#7007 Replace validate color with tiny color 2

decaporg · Dec 6, 2023 · fe85658 · fe85658
1 parent 9dc2fbd
commit fe85658
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 9 deletions.
diff --git a/dev-test/config.yml b/dev-test/config.yml
@@ -158,6 +158,7 @@ collections: # A list of collections the CMS should be able to edit
           multiple: true,
         }
       - { label: 'Hidden', name: 'hidden', widget: 'hidden', default: 'hidden' }
+      - { label: 'Color', name: 'color', widget: 'color' }
       - label: 'Object'
         name: 'object'
         widget: 'object'

diff --git a/packages/decap-cms-widget-colorstring/package.json b/packages/decap-cms-widget-colorstring/package.json
@@ -21,7 +21,7 @@
   },
   "dependencies": {
     "react-color": "^2.18.1",
-    "validate-color": "^2.1.0"
+    "tinycolor2": "^1.4.1"
   },
   "peerDependencies": {
     "@emotion/react": "^11.11.1",

diff --git a/packages/decap-cms-widget-colorstring/src/ColorControl.js b/packages/decap-cms-widget-colorstring/src/ColorControl.js
@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import styled from '@emotion/styled';
 import ChromePicker from 'react-color';
-import validateColor from 'validate-color';
+import tinycolor from 'tinycolor2';
 import { zIndex } from 'decap-cms-ui-default';
 
 function ClearIcon() {
@@ -131,8 +131,10 @@ export default class ColorControl extends React.Component {
         )}
         <ColorSwatchBackground />
         <ColorSwatch
-          background={validateColor(this.props.value) ? this.props.value : '#fff'}
-          color={validateColor(this.props.value) ? 'rgba(255, 255, 255, 0)' : 'rgb(223, 223, 227)'}
+          background={tinycolor(this.props.value).isValid() ? this.props.value : '#fff'}
+          color={
+            tinycolor(this.props.value).isValid() ? 'rgba(255, 255, 255, 0)' : 'rgb(223, 223, 227)'
+          }
           onClick={this.handleClick}
         >
           ?

diff --git a/yarn.lock b/yarn.lock
@@ -17389,11 +17389,6 @@ v8-to-istanbul@^8.1.0:
     convert-source-map "^1.6.0"
     source-map "^0.7.3"
 
-validate-color@^2.1.0:
-  version "2.2.4"
-  resolved "https://registry.yarnpkg.com/validate-color/-/validate-color-2.2.4.tgz#77acf863458cd637ee944f604932512f6cbe6103"
-  integrity sha512-Znolz+b6CwW6eBXYld7MFM3O7funcdyRfjKC/X9hqYV/0VcC5LB/L45mff7m3dIn9wdGdNOAQ/fybNuD5P/HDw==
-
 validate-npm-package-license@^3.0.1, validate-npm-package-license@^3.0.4:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz#fc91f6b9c7ba15c857f4cb2c5defeec39d4f410a"