@bigbinary/neetoui 8.2.46 → 8.2.48

package/dist/ColorPicker.js

@@ -34,36 +34,94 @@ const s=()=>"undefined"!=typeof window&&"EyeDropper"in window,i=()=>Promise.reje
 
 var useEyeDropper = p
 
-var TRANSPARENT = "transparent";
+var DEFAULT_PALETTE_COLORS = [{
+  hex: "#FFFFFF"
+}, {
+  hex: "#D6D6D6"
+}, {
+  hex: "#676767"
+}, {
+  hex: "#0A0E13"
+}, {
+  hex: "#91E5F6"
+}, {
+  hex: "#2A79C4"
+}, {
+  hex: "#095482"
+}, {
+  hex: "#FFCDD2"
+}, {
+  hex: "#E2EFAC"
+}, {
+  hex: "#B3E5FC"
+}, {
+  hex: "#C8E6C9"
+}, {
+  hex: "#D7CCC8"
+}, {
+  hex: "#F5DD90"
+}, {
+  hex: "#C3C6F9"
+}, {
+  hex: "#FFF7AE"
+}, {
+  hex: "#FECE1E"
+}, {
+  hex: "#FFD69D"
+}, {
+  hex: "#FE871E"
+}, {
+  hex: "#02C39A"
+}, {
+  hex: "#00A896"
+}, {
+  hex: "#028090"
+}, {
+  hex: "#99B898"
+}, {
+  hex: "#586BA4"
+}, {
+  hex: "#324376"
+}, {
+  hex: "#FF847C"
+}, {
+  hex: "#F32E48"
+}, {
+  hex: "#8064CE"
+}, {
+  hex: "#4F329A"
+}];
 
 var Palette = function Palette(_ref) {
   var color = _ref.color,
     _ref$colorList = _ref.colorList,
-    colorList = _ref$colorList === void 0 ? [] : _ref$colorList,
+    colorList = _ref$colorList === void 0 ? DEFAULT_PALETTE_COLORS : _ref$colorList,
     onChange = _ref.onChange;
   return /*#__PURE__*/React__default.createElement("div", {
     className: "neeto-ui-flex neeto-ui-flex-row neeto-ui-flex-wrap neeto-ui-items-start neeto-ui-justify-start neeto-ui-color-palette neeto-ui-gap-1"
   }, colorList.map(function (item) {
     var hex = item.hex,
-      colorClassName = item.colorClassName;
-    var isTransparent = hex === TRANSPARENT;
-    var isActive = Boolean((color === null || color === void 0 ? void 0 : color.hex) && color.hex === hex || (color === null || color === void 0 ? void 0 : color.colorClassName) && color.colorClassName === colorClassName);
+      rgb = item.rgb;
+    var colorObject = tinycolor(hex !== null && hex !== void 0 ? hex : rgb);
+    var isTransparent = colorObject.getAlpha() === 0;
+    var isActive = Boolean(
+    // hex is case insensitive.
+    (color === null || color === void 0 ? void 0 : color.toLocaleLowerCase()) === (hex === null || hex === void 0 ? void 0 : hex.toLocaleLowerCase()) || color === rgb);
     return /*#__PURE__*/React__default.createElement("div", {
       "data-testid": "color-palette-item",
-      key: hex !== null && hex !== void 0 ? hex : colorClassName,
+      key: hex !== null && hex !== void 0 ? hex : rgb,
       className: classnames("neeto-ui-color-palette__item neeto-ui-border", {
         active: isActive
       }),
       onClick: function onClick() {
-        return onChange(item);
+        return onChange(hex !== null && hex !== void 0 ? hex : rgb);
       }
     }, /*#__PURE__*/React__default.createElement("div", {
       style: {
-        backgroundColor: hex
+        backgroundColor: hex !== null && hex !== void 0 ? hex : rgb
       },
       className: classnames({
-        "transparent-bg-pattern": isTransparent,
-        colorClassName: !isTransparent
+        "transparent-bg-pattern": isTransparent
       })
     }));
   }));
@@ -84,7 +142,6 @@ var ColorPicker = function ColorPicker(_ref) {
     size = _ref$size === void 0 ? TARGET_SIZES.large : _ref$size,
     _ref$onChange = _ref.onChange,
     onChange = _ref$onChange === void 0 ? noop : _ref$onChange,
-    colorPaletteProps = _ref.colorPaletteProps,
     dropdownProps = _ref.dropdownProps,
     _ref$showEyeDropper = _ref.showEyeDropper,
     showEyeDropper = _ref$showEyeDropper === void 0 ? true : _ref$showEyeDropper,
@@ -94,7 +151,8 @@ var ColorPicker = function ColorPicker(_ref) {
     showTransparencyControl = _ref$showTransparency === void 0 ? false : _ref$showTransparency,
     _ref$showPicker = _ref.showPicker,
     showPicker = _ref$showPicker === void 0 ? true : _ref$showPicker,
-    portalProps = _ref.portalProps;
+    portalProps = _ref.portalProps,
+    colorPalette = _ref.colorPalette;
   var _useState = useState(color),
     _useState2 = _slicedToArray(_useState, 2),
     colorInternal = _useState2[0],
@@ -107,35 +165,39 @@ var ColorPicker = function ColorPicker(_ref) {
     isSupported = _useEyeDropper.isSupported;
   var PickerComponent = showTransparencyControl ? HexAlphaColorPicker : HexColorPicker;
   var colorValue = (_ref2 = color !== null && color !== void 0 ? color : colorInternal) !== null && _ref2 !== void 0 ? _ref2 : "";
-  var onChangeInternal = onChange || setColorInternal;
   var getColor = function getColor(colorValue) {
     var color = tinycolor(colorValue);
+    if (color.isValid()) {
+      var hex = color.toHexString();
+      // return `transparent` for transparent colors.
+      if (color.getAlpha() === 0) hex = colorValue;else if (showTransparencyControl) hex = color.toHex8String();
+      return {
+        hex: hex,
+        rgb: color.toRgb()
+      };
+    }
     return {
-      hex: showTransparencyControl ? color.toHex8String() : color.toHexString(),
-      rgb: color.toRgb()
+      hex: colorValue,
+      rgb: colorValue
     };
   };
+  var onColorChange = function onColorChange(color) {
+    var changeHandler = onChange !== null && onChange !== void 0 ? onChange : setColorInternal;
+    changeHandler(getColor(color));
+  };
   var onColorInputChange = function onColorInputChange(hex) {
-    var color = tinycolor(hex);
-    var rgb = color.toRgb();
     isInputChanged.current = true;
-    onChangeInternal({
-      hex: hex,
-      rgb: rgb
-    });
-  };
-  var onPickerChange = function onPickerChange(hex) {
-    return onChangeInternal(getColor(hex));
+    onColorChange(hex);
   };
   var onBlur = function onBlur() {
     // If input is not changed, don't call onChange on blur
     if (!isInputChanged.current) return;
     isInputChanged.current = false;
-    onChangeInternal(getColor(colorValue));
+    onColorChange(colorValue);
   };
   var pickColor = /*#__PURE__*/function () {
     var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-      var colorResponse, colorHex;
+      var colorResponse, hex;
       return _regeneratorRuntime.wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
@@ -144,8 +206,8 @@ var ColorPicker = function ColorPicker(_ref) {
             return open();
           case 3:
             colorResponse = _context.sent;
-            colorHex = tinycolor(colorResponse.sRGBHex).toHexString();
-            onPickerChange(colorHex);
+            hex = tinycolor(colorResponse.sRGBHex).toHexString();
+            onColorChange(hex);
             _context.next = 10;
             break;
           case 8:
@@ -204,7 +266,7 @@ var ColorPicker = function ColorPicker(_ref) {
     "data-testid": "neeto-color-picker-section"
   }, /*#__PURE__*/React__default.createElement(PickerComponent, {
     color: colorValue,
-    onChange: onPickerChange
+    onChange: onColorChange
   })), /*#__PURE__*/React__default.createElement("div", {
     className: "neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center neeto-ui-mt-3 neeto-ui-gap-2"
   }, showEyeDropper && isSupported() && /*#__PURE__*/React__default.createElement(Button, {
@@ -225,13 +287,17 @@ var ColorPicker = function ColorPicker(_ref) {
     alpha: !!showTransparencyControl,
     color: colorValue,
     onChange: onColorInputChange
-  }))))), colorPaletteProps && /*#__PURE__*/React__default.createElement("div", {
+  }))))), /*#__PURE__*/React__default.createElement("div", {
     "data-testid": "color-palette",
     className: classnames("neeto-ui-colorpicker__palette-wrapper", {
       "neeto-ui-colorpicker__palette-wrapper--hidden-picker": !showPicker,
       "neeto-ui-pt-3 neeto-ui-border-t neeto-ui-border-gray-200": showPicker
     })
-  }, /*#__PURE__*/React__default.createElement(Palette, colorPaletteProps))));
+  }, /*#__PURE__*/React__default.createElement(Palette, {
+    color: color,
+    colorList: colorPalette,
+    onChange: onColorChange
+  }))));
 };
 
 export { ColorPicker as default };

package/dist/ColorPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPicker.js","sources":["../node_modules/use-eye-dropper/lib/use-eye-dropper.module.js","../node_modules/use-eye-dropper/lib/index.module.js","../src/components/ColorPicker/constants.js","../src/components/ColorPicker/Palette.jsx","../src/components/ColorPicker/index.jsx"],"sourcesContent":["import{useMemo as r,useRef as o,useCallback as n,useEffect as t,useState as e}from\"react\";const s=()=>\"undefined\"!=typeof window&&\"EyeDropper\"in window,i=()=>Promise.reject(new Error(\"Unsupported browser.\")),c=()=>{const r=o(),[i,c]=e(!1);t(()=>(r.current=!0,c(s()),()=>{r.current=!1}),[]);const u=n(()=>i,[i]);return[r,u]},u=r=>{const o=(r=>s()&&new EyeDropper(r))(r);var n;return(n=o)?EyeDropper.prototype.open.bind(n):i},p=e=>{const s=r(()=>u(e),[e]),[i,p]=c(),a=o(),f=n(()=>{void 0!==a.current&&a.current.abort()},[a]),d=n(function(r){void 0===r&&(r={});try{f();const{signal:o,...n}=r,t=new AbortController;a.current=t;const e=void 0!==o?(r=>{const o=new AbortController,n=()=>{o.abort();for(const o of r)o.removeEventListener(\"abort\",n)};for(const o of r){if(o.aborted){n();break}o.addEventListener(\"abort\",n)}return o.signal})([o,t.signal]):t.signal;return Promise.resolve(function(r,o){try{var t=Promise.resolve(s({...n,signal:e}))}catch(r){return o(r)}return t&&t.then?t.then(void 0,o):t}(0,function(r){throw i.current||(r.canceled=!0),r}))}catch(r){return Promise.reject(r)}},[a,i,f,s]);return t(()=>f,[f]),{open:d,close:f,isSupported:p}};export{p as default};\n","import { default as DropperDev } from './use-eye-dropper.module.dev.js'\nimport { default as Dropper } from './use-eye-dropper.module.js'\n\nexport default process.env.NODE_ENV === 'production' ? Dropper : DropperDev\n","export const TRANSPARENT = \"transparent\";\n","import React from \"react\";\n\nimport classnames from \"classnames\";\nimport PropTypes from \"prop-types\";\n\nimport { TRANSPARENT } from \"./constants\";\n\nconst Palette = ({ color, colorList = [], onChange }) => (\n  <div className=\"neeto-ui-flex neeto-ui-flex-row neeto-ui-flex-wrap neeto-ui-items-start neeto-ui-justify-start neeto-ui-color-palette neeto-ui-gap-1\">\n    {colorList.map(item => {\n      const { hex, colorClassName } = item;\n      const isTransparent = hex === TRANSPARENT;\n\n      const isActive = Boolean(\n        (color?.hex && color.hex === hex) ||\n          (color?.colorClassName && color.colorClassName === colorClassName)\n      );\n\n      return (\n        <div\n          data-testid=\"color-palette-item\"\n          key={hex ?? colorClassName}\n          className={classnames(\n            \"neeto-ui-color-palette__item neeto-ui-border\",\n            { active: isActive }\n          )}\n          onClick={() => onChange(item)}\n        >\n          <div\n            style={{ backgroundColor: hex }}\n            className={classnames({\n              \"transparent-bg-pattern\": isTransparent,\n              colorClassName: !isTransparent,\n            })}\n          />\n        </div>\n      );\n    })}\n  </div>\n);\n\nPalette.propTypes = {\n  color: PropTypes.shape({\n    hex: PropTypes.string,\n    colorClassName: PropTypes.string,\n  }),\n  colorList: PropTypes.arrayOf(\n    PropTypes.shape({\n      hex: PropTypes.string,\n      colorClassName: PropTypes.string,\n    })\n  ),\n  onChange: PropTypes.func,\n};\n\nexport default Palette;\n","import React, { useState, useRef } from \"react\";\n\nimport classnames from \"classnames\";\nimport { Down, ColorPicker as ColorPickerIcon } from \"neetoicons\";\nimport PropTypes from \"prop-types\";\nimport {\n  HexColorPicker,\n  HexColorInput,\n  HexAlphaColorPicker,\n} from \"react-colorful\";\nimport tinycolor from \"tinycolor2\";\nimport useEyeDropper from \"use-eye-dropper\";\n\nimport Button from \"components/Button\";\nimport Dropdown from \"components/Dropdown\";\nimport { noop } from \"utils\";\n\nimport Palette from \"./Palette\";\n\nconst TARGET_SIZES = {\n  large: \"large\",\n  medium: \"medium\",\n  small: \"small\",\n};\n\nconst ColorPicker = ({\n  color = \"\",\n  size = TARGET_SIZES.large,\n  onChange = noop,\n  colorPaletteProps,\n  dropdownProps,\n  showEyeDropper = true,\n  showHexValue = false,\n  showTransparencyControl = false,\n  showPicker = true,\n  portalProps,\n}) => {\n  const [colorInternal, setColorInternal] = useState(color);\n  const isInputChanged = useRef(false);\n  const { open, isSupported } = useEyeDropper({ pickRadius: 3 });\n\n  const PickerComponent = showTransparencyControl\n    ? HexAlphaColorPicker\n    : HexColorPicker;\n\n  const colorValue = color ?? colorInternal ?? \"\";\n\n  const onChangeInternal = onChange || setColorInternal;\n\n  const getColor = colorValue => {\n    const color = tinycolor(colorValue);\n\n    return {\n      hex: showTransparencyControl ? color.toHex8String() : color.toHexString(),\n      rgb: color.toRgb(),\n    };\n  };\n\n  const onColorInputChange = hex => {\n    const color = tinycolor(hex);\n    const rgb = color.toRgb();\n    isInputChanged.current = true;\n\n    onChangeInternal({ hex, rgb });\n  };\n\n  const onPickerChange = hex => onChangeInternal(getColor(hex));\n\n  const onBlur = () => {\n    // If input is not changed, don't call onChange on blur\n    if (!isInputChanged.current) return;\n    isInputChanged.current = false;\n    onChangeInternal(getColor(colorValue));\n  };\n\n  const pickColor = async () => {\n    try {\n      const colorResponse = await open();\n      const colorHex = tinycolor(colorResponse.sRGBHex).toHexString();\n      onPickerChange(colorHex);\n    } catch {\n      // Ensures component is still mounted\n      // before calling setState\n      // if (!e.canceled) setError(e);\n    }\n  };\n\n  const Target = ({ size }) => (\n    <button\n      data-cy=\"color-picker-target\"\n      data-testid=\"neeto-color-picker\"\n      type=\"button\"\n      className={classnames(\"neeto-ui-colorpicker__target\", {\n        \"neeto-ui-colorpicker__target-size--large\": size === TARGET_SIZES.large,\n        \"neeto-ui-colorpicker__target-size--medium\":\n          size === TARGET_SIZES.medium,\n        \"neeto-ui-colorpicker__target-size--small\": size === TARGET_SIZES.small,\n      })}\n    >\n      {showHexValue && (\n        <span className=\"neeto-ui-colorpicker-target__code\">{color}</span>\n      )}\n      <span className=\"neeto-ui-colorpicker-target__color-wrapper\">\n        <span\n          className=\"neeto-ui-colorpicker-target__color neeto-ui-border-gray-200\"\n          style={{ backgroundColor: colorValue }}\n        />\n        <span className=\"neeto-ui-colorpicker-target__icon\">\n          <Down size={16} />\n        </span>\n      </span>\n    </button>\n  );\n\n  return (\n    <Dropdown\n      className=\"neeto-ui-colorpicker__dropdown\"\n      closeOnSelect={false}\n      customTarget={<Target {...{ size }} />}\n      label={colorValue}\n      position=\"bottom-start\"\n      {...dropdownProps}\n      dropdownProps={{ ...dropdownProps?.dropdownProps, ...portalProps }}\n    >\n      <div className=\"neeto-ui-colorpicker__popover\">\n        {showPicker && (\n          <>\n            <div\n              className=\"neeto-ui-colorpicker__pointer\"\n              data-testid=\"neeto-color-picker-section\"\n            >\n              <PickerComponent color={colorValue} onChange={onPickerChange} />\n            </div>\n            <div className=\"neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center neeto-ui-mt-3 neeto-ui-gap-2\">\n              {showEyeDropper && isSupported() && (\n                <Button\n                  className=\"neeto-ui-colorpicker__eyedropper-btn\"\n                  icon={ColorPickerIcon}\n                  size=\"small\"\n                  style=\"text\"\n                  type=\"button\"\n                  onClick={pickColor}\n                />\n              )}\n              <div className=\"neeto-ui-input__wrapper\">\n                <div\n                  className=\"neeto-ui-colorpicker__input neeto-ui-input neeto-ui-input--small\"\n                  data-cy=\"colorpicker-editable-input\"\n                >\n                  <HexColorInput\n                    {...{ onBlur }}\n                    prefixed\n                    alpha={!!showTransparencyControl}\n                    color={colorValue}\n                    onChange={onColorInputChange}\n                  />\n                </div>\n              </div>\n            </div>\n          </>\n        )}\n        {colorPaletteProps && (\n          <div\n            data-testid=\"color-palette\"\n            className={classnames(\"neeto-ui-colorpicker__palette-wrapper\", {\n              \"neeto-ui-colorpicker__palette-wrapper--hidden-picker\":\n                !showPicker,\n              \"neeto-ui-pt-3 neeto-ui-border-t neeto-ui-border-gray-200\":\n                showPicker,\n            })}\n          >\n            <Palette {...colorPaletteProps} />\n          </div>\n        )}\n      </div>\n    </Dropdown>\n  );\n};\n\nColorPicker.propTypes = {\n  /**\n   * To specify the color value.\n   */\n  color: PropTypes.string,\n  /**\n   * <div class=\"neeto-ui-tag neeto-ui-tag--size-small neeto-ui-tag--style-outline neeto-ui-tag--style-success mb-2\">\n   * New\n   * </div>\n   * To set the size of the target.\n   */\n  size: PropTypes.oneOf(Object.values(TARGET_SIZES)),\n  /**\n   * To specify the action to be triggered on changing the color.\n   */\n  onChange: PropTypes.func,\n  /**\n   * To specify the props to be passed to the Palette component.\n   */\n  colorPaletteProps: PropTypes.shape({\n    color: PropTypes.shape({\n      hex: PropTypes.string,\n      colorClassName: PropTypes.string,\n    }),\n    colorList: PropTypes.arrayOf(\n      PropTypes.shape({\n        hex: PropTypes.string,\n        colorClassName: PropTypes.string,\n      })\n    ),\n    onChange: PropTypes.func,\n  }),\n  /**\n   * Shows eye dropper to pick color.\n   */\n  showEyeDropper: PropTypes.bool,\n  /**\n   * To show hex value near to the color in the dropdown.\n   * By default it will be enabled.\n   */\n  showHexValue: PropTypes.bool,\n  /**\n   * To show transparency control. By default it will be hidden.\n   */\n  showTransparencyControl: PropTypes.bool,\n  /**\n   * To show the color picker. Used to hide the picker in cases where only palette is required. By default it will be true.\n   */\n  showPicker: PropTypes.bool,\n  /**\n   * To specify the props to be passed to the dropdown portal.\n   */\n  portalProps: PropTypes.object,\n};\n\nexport default ColorPicker;\n"],"names":["o","e","t","n","r","Dropper","TRANSPARENT","Palette","_ref","color","_ref$colorList","colorList","onChange","React","createElement","className","map","item","hex","colorClassName","isTransparent","isActive","Boolean","key","classnames","active","onClick","style","backgroundColor","TARGET_SIZES","large","medium","small","ColorPicker","_ref2","_ref$color","_ref$size","size","_ref$onChange","noop","colorPaletteProps","dropdownProps","_ref$showEyeDropper","showEyeDropper","_ref$showHexValue","showHexValue","_ref$showTransparency","showTransparencyControl","_ref$showPicker","showPicker","portalProps","_useState","useState","_useState2","_slicedToArray","colorInternal","setColorInternal","isInputChanged","useRef","_useEyeDropper","useEyeDropper","pickRadius","open","isSupported","PickerComponent","HexAlphaColorPicker","HexColorPicker","colorValue","onChangeInternal","getColor","tinycolor","toHex8String","toHexString","rgb","toRgb","onColorInputChange","current","onPickerChange","onBlur","pickColor","_ref3","_asyncToGenerator","_regeneratorRuntime","mark","_callee","colorResponse","colorHex","wrap","_callee$","_context","prev","next","sent","sRGBHex","t0","stop","apply","arguments","Target","_ref4","type","Down","Dropdown","_extends","closeOnSelect","customTarget","label","position","_objectSpread","Fragment","Button","icon","ColorPickerIcon","HexColorInput","prefixed","alpha"],"mappings":"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","x_google_ignoreList":[0,1]}
+{"version":3,"file":"ColorPicker.js","sources":["../node_modules/use-eye-dropper/lib/use-eye-dropper.module.js","../node_modules/use-eye-dropper/lib/index.module.js","../src/components/ColorPicker/constants.js","../src/components/ColorPicker/Palette.jsx","../src/components/ColorPicker/index.jsx"],"sourcesContent":["import{useMemo as r,useRef as o,useCallback as n,useEffect as t,useState as e}from\"react\";const s=()=>\"undefined\"!=typeof window&&\"EyeDropper\"in window,i=()=>Promise.reject(new Error(\"Unsupported browser.\")),c=()=>{const r=o(),[i,c]=e(!1);t(()=>(r.current=!0,c(s()),()=>{r.current=!1}),[]);const u=n(()=>i,[i]);return[r,u]},u=r=>{const o=(r=>s()&&new EyeDropper(r))(r);var n;return(n=o)?EyeDropper.prototype.open.bind(n):i},p=e=>{const s=r(()=>u(e),[e]),[i,p]=c(),a=o(),f=n(()=>{void 0!==a.current&&a.current.abort()},[a]),d=n(function(r){void 0===r&&(r={});try{f();const{signal:o,...n}=r,t=new AbortController;a.current=t;const e=void 0!==o?(r=>{const o=new AbortController,n=()=>{o.abort();for(const o of r)o.removeEventListener(\"abort\",n)};for(const o of r){if(o.aborted){n();break}o.addEventListener(\"abort\",n)}return o.signal})([o,t.signal]):t.signal;return Promise.resolve(function(r,o){try{var t=Promise.resolve(s({...n,signal:e}))}catch(r){return o(r)}return t&&t.then?t.then(void 0,o):t}(0,function(r){throw i.current||(r.canceled=!0),r}))}catch(r){return Promise.reject(r)}},[a,i,f,s]);return t(()=>f,[f]),{open:d,close:f,isSupported:p}};export{p as default};\n","import { default as DropperDev } from './use-eye-dropper.module.dev.js'\nimport { default as Dropper } from './use-eye-dropper.module.js'\n\nexport default process.env.NODE_ENV === 'production' ? Dropper : DropperDev\n","export const DEFAULT_PALETTE_COLORS = [\n  { hex: \"#FFFFFF\" },\n  { hex: \"#D6D6D6\" },\n  { hex: \"#676767\" },\n  { hex: \"#0A0E13\" },\n  { hex: \"#91E5F6\" },\n  { hex: \"#2A79C4\" },\n  { hex: \"#095482\" },\n  { hex: \"#FFCDD2\" },\n  { hex: \"#E2EFAC\" },\n  { hex: \"#B3E5FC\" },\n  { hex: \"#C8E6C9\" },\n  { hex: \"#D7CCC8\" },\n  { hex: \"#F5DD90\" },\n  { hex: \"#C3C6F9\" },\n  { hex: \"#FFF7AE\" },\n  { hex: \"#FECE1E\" },\n  { hex: \"#FFD69D\" },\n  { hex: \"#FE871E\" },\n  { hex: \"#02C39A\" },\n  { hex: \"#00A896\" },\n  { hex: \"#028090\" },\n  { hex: \"#99B898\" },\n  { hex: \"#586BA4\" },\n  { hex: \"#324376\" },\n  { hex: \"#FF847C\" },\n  { hex: \"#F32E48\" },\n  { hex: \"#8064CE\" },\n  { hex: \"#4F329A\" },\n];\n","import React from \"react\";\n\nimport classnames from \"classnames\";\nimport PropTypes from \"prop-types\";\nimport tinycolor from \"tinycolor2\";\n\nimport { DEFAULT_PALETTE_COLORS } from \"./constants\";\n\nconst Palette = ({ color, colorList = DEFAULT_PALETTE_COLORS, onChange }) => (\n  <div className=\"neeto-ui-flex neeto-ui-flex-row neeto-ui-flex-wrap neeto-ui-items-start neeto-ui-justify-start neeto-ui-color-palette neeto-ui-gap-1\">\n    {colorList.map(item => {\n      const { hex, rgb } = item;\n      const colorObject = tinycolor(hex ?? rgb);\n      const isTransparent = colorObject.getAlpha() === 0;\n      const isActive = Boolean(\n        // hex is case insensitive.\n        color?.toLocaleLowerCase() === hex?.toLocaleLowerCase() || color === rgb\n      );\n\n      return (\n        <div\n          data-testid=\"color-palette-item\"\n          key={hex ?? rgb}\n          className={classnames(\n            \"neeto-ui-color-palette__item neeto-ui-border\",\n            { active: isActive }\n          )}\n          onClick={() => onChange(hex ?? rgb)}\n        >\n          <div\n            style={{ backgroundColor: hex ?? rgb }}\n            className={classnames({\n              \"transparent-bg-pattern\": isTransparent,\n            })}\n          />\n        </div>\n      );\n    })}\n  </div>\n);\n\nPalette.propTypes = {\n  color: PropTypes.string,\n  colorList: PropTypes.arrayOf(\n    PropTypes.shape({ hex: PropTypes.string, rgb: PropTypes.string })\n  ),\n  onChange: PropTypes.func,\n};\n\nexport default Palette;\n","import React, { useState, useRef } from \"react\";\n\nimport classnames from \"classnames\";\nimport { Down, ColorPicker as ColorPickerIcon } from \"neetoicons\";\nimport PropTypes from \"prop-types\";\nimport {\n  HexColorPicker,\n  HexColorInput,\n  HexAlphaColorPicker,\n} from \"react-colorful\";\nimport tinycolor from \"tinycolor2\";\nimport useEyeDropper from \"use-eye-dropper\";\n\nimport Button from \"components/Button\";\nimport Dropdown from \"components/Dropdown\";\nimport { noop } from \"utils\";\n\nimport Palette from \"./Palette\";\n\nconst TARGET_SIZES = {\n  large: \"large\",\n  medium: \"medium\",\n  small: \"small\",\n};\n\nconst ColorPicker = ({\n  color = \"\",\n  size = TARGET_SIZES.large,\n  onChange = noop,\n  dropdownProps,\n  showEyeDropper = true,\n  showHexValue = false,\n  showTransparencyControl = false,\n  showPicker = true,\n  portalProps,\n  colorPalette,\n}) => {\n  const [colorInternal, setColorInternal] = useState(color);\n  const isInputChanged = useRef(false);\n  const { open, isSupported } = useEyeDropper({ pickRadius: 3 });\n\n  const PickerComponent = showTransparencyControl\n    ? HexAlphaColorPicker\n    : HexColorPicker;\n\n  const colorValue = color ?? colorInternal ?? \"\";\n\n  const getColor = colorValue => {\n    const color = tinycolor(colorValue);\n\n    if (color.isValid()) {\n      let hex = color.toHexString();\n      // return `transparent` for transparent colors.\n      if (color.getAlpha() === 0) hex = colorValue;\n      else if (showTransparencyControl) hex = color.toHex8String();\n\n      return { hex, rgb: color.toRgb() };\n    }\n\n    return { hex: colorValue, rgb: colorValue };\n  };\n\n  const onColorChange = color => {\n    const changeHandler = onChange ?? setColorInternal;\n\n    changeHandler(getColor(color));\n  };\n\n  const onColorInputChange = hex => {\n    isInputChanged.current = true;\n\n    onColorChange(hex);\n  };\n\n  const onBlur = () => {\n    // If input is not changed, don't call onChange on blur\n    if (!isInputChanged.current) return;\n\n    isInputChanged.current = false;\n    onColorChange(colorValue);\n  };\n\n  const pickColor = async () => {\n    try {\n      const colorResponse = await open();\n      const hex = tinycolor(colorResponse.sRGBHex).toHexString();\n      onColorChange(hex);\n    } catch {\n      // Ensures component is still mounted\n      // before calling setState\n      // if (!e.canceled) setError(e);\n    }\n  };\n\n  const Target = ({ size }) => (\n    <button\n      data-cy=\"color-picker-target\"\n      data-testid=\"neeto-color-picker\"\n      type=\"button\"\n      className={classnames(\"neeto-ui-colorpicker__target\", {\n        \"neeto-ui-colorpicker__target-size--large\": size === TARGET_SIZES.large,\n        \"neeto-ui-colorpicker__target-size--medium\":\n          size === TARGET_SIZES.medium,\n        \"neeto-ui-colorpicker__target-size--small\": size === TARGET_SIZES.small,\n      })}\n    >\n      {showHexValue && (\n        <span className=\"neeto-ui-colorpicker-target__code\">{color}</span>\n      )}\n      <span className=\"neeto-ui-colorpicker-target__color-wrapper\">\n        <span\n          className=\"neeto-ui-colorpicker-target__color neeto-ui-border-gray-200\"\n          style={{ backgroundColor: colorValue }}\n        />\n        <span className=\"neeto-ui-colorpicker-target__icon\">\n          <Down size={16} />\n        </span>\n      </span>\n    </button>\n  );\n\n  return (\n    <Dropdown\n      className=\"neeto-ui-colorpicker__dropdown\"\n      closeOnSelect={false}\n      customTarget={<Target {...{ size }} />}\n      label={colorValue}\n      position=\"bottom-start\"\n      {...dropdownProps}\n      dropdownProps={{ ...dropdownProps?.dropdownProps, ...portalProps }}\n    >\n      <div className=\"neeto-ui-colorpicker__popover\">\n        {showPicker && (\n          <>\n            <div\n              className=\"neeto-ui-colorpicker__pointer\"\n              data-testid=\"neeto-color-picker-section\"\n            >\n              <PickerComponent color={colorValue} onChange={onColorChange} />\n            </div>\n            <div className=\"neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center neeto-ui-mt-3 neeto-ui-gap-2\">\n              {showEyeDropper && isSupported() && (\n                <Button\n                  className=\"neeto-ui-colorpicker__eyedropper-btn\"\n                  icon={ColorPickerIcon}\n                  size=\"small\"\n                  style=\"text\"\n                  type=\"button\"\n                  onClick={pickColor}\n                />\n              )}\n              <div className=\"neeto-ui-input__wrapper\">\n                <div\n                  className=\"neeto-ui-colorpicker__input neeto-ui-input neeto-ui-input--small\"\n                  data-cy=\"colorpicker-editable-input\"\n                >\n                  <HexColorInput\n                    {...{ onBlur }}\n                    prefixed\n                    alpha={!!showTransparencyControl}\n                    color={colorValue}\n                    onChange={onColorInputChange}\n                  />\n                </div>\n              </div>\n            </div>\n          </>\n        )}\n        <div\n          data-testid=\"color-palette\"\n          className={classnames(\"neeto-ui-colorpicker__palette-wrapper\", {\n            \"neeto-ui-colorpicker__palette-wrapper--hidden-picker\": !showPicker,\n            \"neeto-ui-pt-3 neeto-ui-border-t neeto-ui-border-gray-200\":\n              showPicker,\n          })}\n        >\n          <Palette\n            {...{ color }}\n            colorList={colorPalette}\n            onChange={onColorChange}\n          />\n        </div>\n      </div>\n    </Dropdown>\n  );\n};\n\nColorPicker.propTypes = {\n  /**\n   * To specify the color value.\n   */\n  color: PropTypes.string,\n  /**\n   * <div class=\"neeto-ui-tag neeto-ui-tag--size-small neeto-ui-tag--style-outline neeto-ui-tag--style-success mb-2\">\n   * New\n   * </div>\n   * To set the size of the target.\n   */\n  size: PropTypes.oneOf(Object.values(TARGET_SIZES)),\n  /**\n   * To specify the action to be triggered on changing the color.\n   */\n  onChange: PropTypes.func,\n  /**\n   * To specify the colors shown in the palette.\n   */\n  colorPalette: PropTypes.arrayOf(\n    PropTypes.shape({ hex: PropTypes.string, rgb: PropTypes.string })\n  ),\n  /**\n   * Shows eye dropper to pick color.\n   */\n  showEyeDropper: PropTypes.bool,\n  /**\n   * To show hex value near to the color in the dropdown.\n   * By default it will be enabled.\n   */\n  showHexValue: PropTypes.bool,\n  /**\n   * To show transparency control. By default it will be hidden.\n   */\n  showTransparencyControl: PropTypes.bool,\n  /**\n   * To show the color picker. Used to hide the picker in cases where only palette is required. By default it will be true.\n   */\n  showPicker: PropTypes.bool,\n  /**\n   * To specify the props to be passed to the dropdown portal.\n   */\n  portalProps: PropTypes.object,\n};\n\nexport default ColorPicker;\n"],"names":["o","e","t","n","r","Dropper","DEFAULT_PALETTE_COLORS","hex","Palette","_ref","color","_ref$colorList","colorList","onChange","React","createElement","className","map","item","rgb","colorObject","tinycolor","isTransparent","getAlpha","isActive","Boolean","toLocaleLowerCase","key","classnames","active","onClick","style","backgroundColor","TARGET_SIZES","large","medium","small","ColorPicker","_ref2","_ref$color","_ref$size","size","_ref$onChange","noop","dropdownProps","_ref$showEyeDropper","showEyeDropper","_ref$showHexValue","showHexValue","_ref$showTransparency","showTransparencyControl","_ref$showPicker","showPicker","portalProps","colorPalette","_useState","useState","_useState2","_slicedToArray","colorInternal","setColorInternal","isInputChanged","useRef","_useEyeDropper","useEyeDropper","pickRadius","open","isSupported","PickerComponent","HexAlphaColorPicker","HexColorPicker","colorValue","getColor","isValid","toHexString","toHex8String","toRgb","onColorChange","changeHandler","onColorInputChange","current","onBlur","pickColor","_ref3","_asyncToGenerator","_regeneratorRuntime","mark","_callee","colorResponse","wrap","_callee$","_context","prev","next","sent","sRGBHex","t0","stop","apply","arguments","Target","_ref4","type","Down","Dropdown","_extends","closeOnSelect","customTarget","label","position","_objectSpread","Fragment","Button","icon","ColorPickerIcon","HexColorInput","prefixed","alpha"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAA0F,MAAM,CAAC,CAAC,IAAI,WAAW,EAAE,OAAO,MAAM,EAAE,YAAY,GAAG,MAAM,CAAC,CAAC,CAAC,IAAI,OAAO,CAAC,MAAM,CAAC,IAAI,KAAK,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAACA,MAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAACC,QAAC,CAAC,CAAC,CAAC,CAAC,CAACC,SAAC,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,EAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAACC,WAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,IAAI,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,OAAM,CAAC,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,MAAM,CAAC,CAACC,OAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAACJ,MAAC,EAAE,CAAC,CAAC,CAACG,WAAC,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC,CAAC,OAAO,CAAC,KAAK,GAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAACA,WAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,eAAe,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,IAAI,eAAe,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,mBAAmB,CAAC,OAAO,CAAC,CAAC,EAAC,CAAC,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC,EAAC,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,EAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,GAAG,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAOD,SAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;;ACG3nC,oBAAuDG;;ACHhD,IAAMC,sBAAsB,GAAG,CACpC;AAAEC,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,EAClB;AAAEA,EAAAA,GAAG,EAAE,SAAA;AAAU,CAAC,CACnB;;ACrBD,IAAMC,OAAO,GAAG,SAAVA,OAAOA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAAMC,KAAK,GAAAD,IAAA,CAALC,KAAK;IAAAC,cAAA,GAAAF,IAAA,CAAEG,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAGL,KAAAA,CAAAA,GAAAA,sBAAsB,GAAAK,cAAA;IAAEE,QAAQ,GAAAJ,IAAA,CAARI,QAAQ,CAAA;EAAA,oBACpEC,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,sIAAA;AAAsI,GAAA,EAClJJ,SAAS,CAACK,GAAG,CAAC,UAAAC,IAAI,EAAI;AACrB,IAAA,IAAQX,GAAG,GAAUW,IAAI,CAAjBX,GAAG;MAAEY,GAAG,GAAKD,IAAI,CAAZC,GAAG,CAAA;IAChB,IAAMC,WAAW,GAAGC,SAAS,CAACd,GAAG,KAAHA,IAAAA,IAAAA,GAAG,KAAHA,KAAAA,CAAAA,GAAAA,GAAG,GAAIY,GAAG,CAAC,CAAA;AACzC,IAAA,IAAMG,aAAa,GAAGF,WAAW,CAACG,QAAQ,EAAE,KAAK,CAAC,CAAA;IAClD,IAAMC,QAAQ,GAAGC,OAAO;AACtB;IACA,CAAAf,KAAK,aAALA,KAAK,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAALA,KAAK,CAAEgB,iBAAiB,EAAE,OAAKnB,GAAG,aAAHA,GAAG,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAHA,GAAG,CAAEmB,iBAAiB,EAAE,CAAIhB,IAAAA,KAAK,KAAKS,GAAG,CACzE,CAAA;IAED,oBACEL,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACE,MAAA,aAAA,EAAY,oBAAoB;AAChCY,MAAAA,GAAG,EAAEpB,GAAG,KAAA,IAAA,IAAHA,GAAG,KAAHA,KAAAA,CAAAA,GAAAA,GAAG,GAAIY,GAAI;AAChBH,MAAAA,SAAS,EAAEY,UAAU,CACnB,8CAA8C,EAC9C;AAAEC,QAAAA,MAAM,EAAEL,QAAAA;AAAS,OAAC,CACpB;MACFM,OAAO,EAAE,SAAAA,OAAA,GAAA;QAAA,OAAMjB,QAAQ,CAACN,GAAG,KAAA,IAAA,IAAHA,GAAG,KAAHA,KAAAA,CAAAA,GAAAA,GAAG,GAAIY,GAAG,CAAC,CAAA;AAAA,OAAA;KAEnCL,eAAAA,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEgB,MAAAA,KAAK,EAAE;AAAEC,QAAAA,eAAe,EAAEzB,GAAG,KAAA,IAAA,IAAHA,GAAG,KAAA,KAAA,CAAA,GAAHA,GAAG,GAAIY,GAAAA;OAAM;MACvCH,SAAS,EAAEY,UAAU,CAAC;AACpB,QAAA,wBAAwB,EAAEN,aAAAA;OAC3B,CAAA;AAAE,KAAA,CACH,CACE,CAAA;AAEV,GAAC,CAAC,CACE,CAAA;AAAA,CACP;;;;ACpBD,IAAMW,YAAY,GAAG;AACnBC,EAAAA,KAAK,EAAE,OAAO;AACdC,EAAAA,MAAM,EAAE,QAAQ;AAChBC,EAAAA,KAAK,EAAE,OAAA;AACT,CAAC,CAAA;AAED,IAAMC,WAAW,GAAG,SAAdA,WAAWA,CAAA5B,IAAA,EAWX;AAAA,EAAA,IAAA6B,KAAA,CAAA;AAAA,EAAA,IAAAC,UAAA,GAAA9B,IAAA,CAVJC,KAAK;AAALA,IAAAA,KAAK,GAAA6B,UAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,UAAA;IAAAC,SAAA,GAAA/B,IAAA,CACVgC,IAAI;AAAJA,IAAAA,IAAI,GAAAD,SAAA,KAAA,KAAA,CAAA,GAAGP,YAAY,CAACC,KAAK,GAAAM,SAAA;IAAAE,aAAA,GAAAjC,IAAA,CACzBI,QAAQ;AAARA,IAAAA,QAAQ,GAAA6B,aAAA,KAAGC,KAAAA,CAAAA,GAAAA,IAAI,GAAAD,aAAA;IACfE,aAAa,GAAAnC,IAAA,CAAbmC,aAAa;IAAAC,mBAAA,GAAApC,IAAA,CACbqC,cAAc;AAAdA,IAAAA,cAAc,GAAAD,mBAAA,KAAG,KAAA,CAAA,GAAA,IAAI,GAAAA,mBAAA;IAAAE,iBAAA,GAAAtC,IAAA,CACrBuC,YAAY;AAAZA,IAAAA,YAAY,GAAAD,iBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,iBAAA;IAAAE,qBAAA,GAAAxC,IAAA,CACpByC,uBAAuB;AAAvBA,IAAAA,uBAAuB,GAAAD,qBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,qBAAA;IAAAE,eAAA,GAAA1C,IAAA,CAC/B2C,UAAU;AAAVA,IAAAA,UAAU,GAAAD,eAAA,KAAG,KAAA,CAAA,GAAA,IAAI,GAAAA,eAAA;IACjBE,WAAW,GAAA5C,IAAA,CAAX4C,WAAW;IACXC,YAAY,GAAA7C,IAAA,CAAZ6C,YAAY,CAAA;AAEZ,EAAA,IAAAC,SAAA,GAA0CC,QAAQ,CAAC9C,KAAK,CAAC;IAAA+C,UAAA,GAAAC,cAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AAAlDI,IAAAA,aAAa,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,gBAAgB,GAAAH,UAAA,CAAA,CAAA,CAAA,CAAA;AACtC,EAAA,IAAMI,cAAc,GAAGC,MAAM,CAAC,KAAK,CAAC,CAAA;EACpC,IAAAC,cAAA,GAA8BC,aAAa,CAAC;AAAEC,MAAAA,UAAU,EAAE,CAAA;AAAE,KAAC,CAAC;IAAtDC,IAAI,GAAAH,cAAA,CAAJG,IAAI;IAAEC,WAAW,GAAAJ,cAAA,CAAXI,WAAW,CAAA;AAEzB,EAAA,IAAMC,eAAe,GAAGlB,uBAAuB,GAC3CmB,mBAAmB,GACnBC,cAAc,CAAA;AAElB,EAAA,IAAMC,UAAU,GAAAjC,CAAAA,KAAA,GAAG5B,KAAK,aAALA,KAAK,KAAA,KAAA,CAAA,GAALA,KAAK,GAAIiD,aAAa,MAAArB,IAAAA,IAAAA,KAAA,KAAAA,KAAAA,CAAAA,GAAAA,KAAA,GAAI,EAAE,CAAA;AAE/C,EAAA,IAAMkC,QAAQ,GAAG,SAAXA,QAAQA,CAAGD,UAAU,EAAI;AAC7B,IAAA,IAAM7D,KAAK,GAAGW,SAAS,CAACkD,UAAU,CAAC,CAAA;AAEnC,IAAA,IAAI7D,KAAK,CAAC+D,OAAO,EAAE,EAAE;AACnB,MAAA,IAAIlE,GAAG,GAAGG,KAAK,CAACgE,WAAW,EAAE,CAAA;AAC7B;MACA,IAAIhE,KAAK,CAACa,QAAQ,EAAE,KAAK,CAAC,EAAEhB,GAAG,GAAGgE,UAAU,CAAC,KACxC,IAAIrB,uBAAuB,EAAE3C,GAAG,GAAGG,KAAK,CAACiE,YAAY,EAAE,CAAA;MAE5D,OAAO;AAAEpE,QAAAA,GAAG,EAAHA,GAAG;QAAEY,GAAG,EAAET,KAAK,CAACkE,KAAK,EAAA;OAAI,CAAA;AACpC,KAAA;IAEA,OAAO;AAAErE,MAAAA,GAAG,EAAEgE,UAAU;AAAEpD,MAAAA,GAAG,EAAEoD,UAAAA;KAAY,CAAA;GAC5C,CAAA;AAED,EAAA,IAAMM,aAAa,GAAG,SAAhBA,aAAaA,CAAGnE,KAAK,EAAI;IAC7B,IAAMoE,aAAa,GAAGjE,QAAQ,KAAA,IAAA,IAARA,QAAQ,KAARA,KAAAA,CAAAA,GAAAA,QAAQ,GAAI+C,gBAAgB,CAAA;AAElDkB,IAAAA,aAAa,CAACN,QAAQ,CAAC9D,KAAK,CAAC,CAAC,CAAA;GAC/B,CAAA;AAED,EAAA,IAAMqE,kBAAkB,GAAG,SAArBA,kBAAkBA,CAAGxE,GAAG,EAAI;IAChCsD,cAAc,CAACmB,OAAO,GAAG,IAAI,CAAA;IAE7BH,aAAa,CAACtE,GAAG,CAAC,CAAA;GACnB,CAAA;AAED,EAAA,IAAM0E,MAAM,GAAG,SAATA,MAAMA,GAAS;AACnB;AACA,IAAA,IAAI,CAACpB,cAAc,CAACmB,OAAO,EAAE,OAAA;IAE7BnB,cAAc,CAACmB,OAAO,GAAG,KAAK,CAAA;IAC9BH,aAAa,CAACN,UAAU,CAAC,CAAA;GAC1B,CAAA;AAED,EAAA,IAAMW,SAAS,gBAAA,YAAA;IAAA,IAAAC,KAAA,GAAAC,iBAAA,eAAAC,mBAAA,CAAAC,IAAA,CAAG,SAAAC,OAAA,GAAA;MAAA,IAAAC,aAAA,EAAAjF,GAAA,CAAA;AAAA,MAAA,OAAA8E,mBAAA,CAAAI,IAAA,CAAA,SAAAC,SAAAC,QAAA,EAAA;AAAA,QAAA,OAAA,CAAA,EAAA,QAAAA,QAAA,CAAAC,IAAA,GAAAD,QAAA,CAAAE,IAAA;AAAA,UAAA,KAAA,CAAA;AAAAF,YAAAA,QAAA,CAAAC,IAAA,GAAA,CAAA,CAAA;AAAAD,YAAAA,QAAA,CAAAE,IAAA,GAAA,CAAA,CAAA;AAAA,YAAA,OAEc3B,IAAI,EAAE,CAAA;AAAA,UAAA,KAAA,CAAA;YAA5BsB,aAAa,GAAAG,QAAA,CAAAG,IAAA,CAAA;YACbvF,GAAG,GAAGc,SAAS,CAACmE,aAAa,CAACO,OAAO,CAAC,CAACrB,WAAW,EAAE,CAAA;YAC1DG,aAAa,CAACtE,GAAG,CAAC,CAAA;AAACoF,YAAAA,QAAA,CAAAE,IAAA,GAAA,EAAA,CAAA;AAAA,YAAA,MAAA;AAAA,UAAA,KAAA,CAAA;AAAAF,YAAAA,QAAA,CAAAC,IAAA,GAAA,CAAA,CAAA;YAAAD,QAAA,CAAAK,EAAA,GAAAL,QAAA,CAAA,OAAA,CAAA,CAAA,CAAA,CAAA,CAAA;AAAA,UAAA,KAAA,EAAA,CAAA;AAAA,UAAA,KAAA,KAAA;YAAA,OAAAA,QAAA,CAAAM,IAAA,EAAA,CAAA;AAAA,SAAA;AAAA,OAAA,EAAAV,OAAA,EAAA,IAAA,EAAA,CAAA,CAAA,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,CAAA;KAMtB,CAAA,CAAA,CAAA;AAAA,IAAA,OAAA,SAVKL,SAASA,GAAA;AAAA,MAAA,OAAAC,KAAA,CAAAe,KAAA,CAAA,IAAA,EAAAC,SAAA,CAAA,CAAA;AAAA,KAAA,CAAA;GAUd,EAAA,CAAA;AAED,EAAA,IAAMC,MAAM,GAAG,SAATA,MAAMA,CAAAC,KAAA,EAAA;AAAA,IAAA,IAAM5D,IAAI,GAAA4D,KAAA,CAAJ5D,IAAI,CAAA;IAAA,oBACpB3B,cAAA,CAAAC,aAAA,CAAA,QAAA,EAAA;AACE,MAAA,SAAA,EAAQ,qBAAqB;AAC7B,MAAA,aAAA,EAAY,oBAAoB;AAChCuF,MAAAA,IAAI,EAAC,QAAQ;AACbtF,MAAAA,SAAS,EAAEY,UAAU,CAAC,8BAA8B,EAAE;AACpD,QAAA,0CAA0C,EAAEa,IAAI,KAAKR,YAAY,CAACC,KAAK;AACvE,QAAA,2CAA2C,EACzCO,IAAI,KAAKR,YAAY,CAACE,MAAM;AAC9B,QAAA,0CAA0C,EAAEM,IAAI,KAAKR,YAAY,CAACG,KAAAA;OACnE,CAAA;AAAE,KAAA,EAEFY,YAAY,iBACXlC,cAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AAAMC,MAAAA,SAAS,EAAC,mCAAA;AAAmC,KAAA,EAAEN,KAAK,CAC3D,eACDI,cAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AAAMC,MAAAA,SAAS,EAAC,4CAAA;KACdF,eAAAA,cAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AACEC,MAAAA,SAAS,EAAC,6DAA6D;AACvEe,MAAAA,KAAK,EAAE;AAAEC,QAAAA,eAAe,EAAEuC,UAAAA;AAAW,OAAA;KACrC,CAAA,eACFzD,cAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AAAMC,MAAAA,SAAS,EAAC,mCAAA;AAAmC,KAAA,eACjDF,cAAA,CAAAC,aAAA,CAACwF,IAAI,EAAA;AAAC9D,MAAAA,IAAI,EAAE,EAAA;KAAM,CAAA,CACb,CACF,CACA,CAAA;GACV,CAAA;AAED,EAAA,oBACE3B,cAAA,CAAAC,aAAA,CAACyF,QAAQ,EAAAC,QAAA,CAAA;AACPzF,IAAAA,SAAS,EAAC,gCAAgC;AAC1C0F,IAAAA,aAAa,EAAE,KAAM;AACrBC,IAAAA,YAAY,eAAE7F,cAAA,CAAAC,aAAA,CAACqF,MAAM,EAAA;AAAO3D,MAAAA,IAAI,EAAJA,IAAAA;KAAW,CAAA;AACvCmE,IAAAA,KAAK,EAAErC,UAAW;AAClBsC,IAAAA,QAAQ,EAAC,cAAA;AAAc,GAAA,EACnBjE,aAAa,EAAA;AACjBA,IAAAA,aAAa,EAAAkE,aAAA,CAAAA,aAAA,CAAOlE,EAAAA,EAAAA,aAAa,KAAbA,IAAAA,IAAAA,aAAa,KAAbA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,aAAa,CAAEA,aAAa,GAAKS,WAAW,CAAA;GAEhEvC,CAAAA,eAAAA,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,+BAAA;AAA+B,GAAA,EAC3CoC,UAAU,iBACTtC,cAAA,CAAAC,aAAA,CAAAD,cAAA,CAAAiG,QAAA,EAAA,IAAA,eACEjG,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEC,IAAAA,SAAS,EAAC,+BAA+B;IACzC,aAAY,EAAA,4BAAA;AAA4B,GAAA,eAExCF,cAAA,CAAAC,aAAA,CAACqD,eAAe,EAAA;AAAC1D,IAAAA,KAAK,EAAE6D,UAAW;AAAC1D,IAAAA,QAAQ,EAAEgE,aAAAA;AAAc,GAAA,CAAG,CAC3D,eACN/D,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,0FAAA;GACZ8B,EAAAA,cAAc,IAAIqB,WAAW,EAAE,iBAC9BrD,cAAA,CAAAC,aAAA,CAACiG,MAAM,EAAA;AACLhG,IAAAA,SAAS,EAAC,sCAAsC;AAChDiG,IAAAA,IAAI,EAAEC,aAAgB;AACtBzE,IAAAA,IAAI,EAAC,OAAO;AACZV,IAAAA,KAAK,EAAC,MAAM;AACZuE,IAAAA,IAAI,EAAC,QAAQ;AACbxE,IAAAA,OAAO,EAAEoD,SAAAA;GAEZ,CAAA,eACDpE,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,yBAAA;GACbF,eAAAA,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEC,IAAAA,SAAS,EAAC,kEAAkE;IAC5E,SAAQ,EAAA,4BAAA;AAA4B,GAAA,eAEpCF,cAAA,CAAAC,aAAA,CAACoG,aAAa,EAAA;AACNlC,IAAAA,MAAM,EAANA,MAAM;IACZmC,QAAQ,EAAA,IAAA;IACRC,KAAK,EAAE,CAAC,CAACnE,uBAAwB;AACjCxC,IAAAA,KAAK,EAAE6D,UAAW;AAClB1D,IAAAA,QAAQ,EAAEkE,kBAAAA;AAAmB,GAAA,CAC7B,CACE,CACF,CACF,CAET,eACDjE,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACE,IAAA,aAAA,EAAY,eAAe;AAC3BC,IAAAA,SAAS,EAAEY,UAAU,CAAC,uCAAuC,EAAE;MAC7D,sDAAsD,EAAE,CAACwB,UAAU;AACnE,MAAA,0DAA0D,EACxDA,UAAAA;KACH,CAAA;AAAE,GAAA,eAEHtC,cAAA,CAAAC,aAAA,CAACP,OAAO,EAAA;AACAE,IAAAA,KAAK,EAALA,KAAK;AACXE,IAAAA,SAAS,EAAE0C,YAAa;AACxBzC,IAAAA,QAAQ,EAAEgE,aAAAA;GACV,CAAA,CACE,CACF,CACG,CAAA;AAEf;;;;","x_google_ignoreList":[0,1]}

package/dist/DatePicker.js

@@ -24,7 +24,7 @@ import 'react-colorful';
 import './tinycolor-DX-kZ4bq.js';
 import './Dropdown.js';
 import './index-qrY3Z55Q.js';
-export { D as default } from './index-CwFoAvhY.js';
+export { D as default } from './index-CHqRt5LZ.js';
 import './Input.js';
 import './Label.js';
 import './MultiEmailInput.js';

package/dist/TimePicker.js

@@ -24,7 +24,7 @@ import 'react-colorful';
 import './tinycolor-DX-kZ4bq.js';
 import './Dropdown.js';
 import './index-qrY3Z55Q.js';
-export { T as default } from './index-CwFoAvhY.js';
+export { T as default } from './index-CHqRt5LZ.js';
 import './Input.js';
 import './Label.js';
 import './MultiEmailInput.js';

package/dist/cjs/ColorPicker.js

@@ -36,36 +36,94 @@ const s=()=>"undefined"!=typeof window&&"EyeDropper"in window,i=()=>Promise.reje
 
 var useEyeDropper = p
 
-var TRANSPARENT = "transparent";
+var DEFAULT_PALETTE_COLORS = [{
+  hex: "#FFFFFF"
+}, {
+  hex: "#D6D6D6"
+}, {
+  hex: "#676767"
+}, {
+  hex: "#0A0E13"
+}, {
+  hex: "#91E5F6"
+}, {
+  hex: "#2A79C4"
+}, {
+  hex: "#095482"
+}, {
+  hex: "#FFCDD2"
+}, {
+  hex: "#E2EFAC"
+}, {
+  hex: "#B3E5FC"
+}, {
+  hex: "#C8E6C9"
+}, {
+  hex: "#D7CCC8"
+}, {
+  hex: "#F5DD90"
+}, {
+  hex: "#C3C6F9"
+}, {
+  hex: "#FFF7AE"
+}, {
+  hex: "#FECE1E"
+}, {
+  hex: "#FFD69D"
+}, {
+  hex: "#FE871E"
+}, {
+  hex: "#02C39A"
+}, {
+  hex: "#00A896"
+}, {
+  hex: "#028090"
+}, {
+  hex: "#99B898"
+}, {
+  hex: "#586BA4"
+}, {
+  hex: "#324376"
+}, {
+  hex: "#FF847C"
+}, {
+  hex: "#F32E48"
+}, {
+  hex: "#8064CE"
+}, {
+  hex: "#4F329A"
+}];
 
 var Palette = function Palette(_ref) {
   var color = _ref.color,
     _ref$colorList = _ref.colorList,
-    colorList = _ref$colorList === void 0 ? [] : _ref$colorList,
+    colorList = _ref$colorList === void 0 ? DEFAULT_PALETTE_COLORS : _ref$colorList,
     onChange = _ref.onChange;
   return /*#__PURE__*/React.createElement("div", {
     className: "neeto-ui-flex neeto-ui-flex-row neeto-ui-flex-wrap neeto-ui-items-start neeto-ui-justify-start neeto-ui-color-palette neeto-ui-gap-1"
   }, colorList.map(function (item) {
     var hex = item.hex,
-      colorClassName = item.colorClassName;
-    var isTransparent = hex === TRANSPARENT;
-    var isActive = Boolean((color === null || color === void 0 ? void 0 : color.hex) && color.hex === hex || (color === null || color === void 0 ? void 0 : color.colorClassName) && color.colorClassName === colorClassName);
+      rgb = item.rgb;
+    var colorObject = tinycolor.tinycolor(hex !== null && hex !== void 0 ? hex : rgb);
+    var isTransparent = colorObject.getAlpha() === 0;
+    var isActive = Boolean(
+    // hex is case insensitive.
+    (color === null || color === void 0 ? void 0 : color.toLocaleLowerCase()) === (hex === null || hex === void 0 ? void 0 : hex.toLocaleLowerCase()) || color === rgb);
     return /*#__PURE__*/React.createElement("div", {
       "data-testid": "color-palette-item",
-      key: hex !== null && hex !== void 0 ? hex : colorClassName,
+      key: hex !== null && hex !== void 0 ? hex : rgb,
       className: classnames("neeto-ui-color-palette__item neeto-ui-border", {
         active: isActive
       }),
       onClick: function onClick() {
-        return onChange(item);
+        return onChange(hex !== null && hex !== void 0 ? hex : rgb);
       }
     }, /*#__PURE__*/React.createElement("div", {
       style: {
-        backgroundColor: hex
+        backgroundColor: hex !== null && hex !== void 0 ? hex : rgb
       },
       className: classnames({
-        "transparent-bg-pattern": isTransparent,
-        colorClassName: !isTransparent
+        "transparent-bg-pattern": isTransparent
       })
     }));
   }));
@@ -86,7 +144,6 @@ var ColorPicker = function ColorPicker(_ref) {
     size = _ref$size === void 0 ? TARGET_SIZES.large : _ref$size,
     _ref$onChange = _ref.onChange,
     onChange = _ref$onChange === void 0 ? index.noop : _ref$onChange,
-    colorPaletteProps = _ref.colorPaletteProps,
     dropdownProps = _ref.dropdownProps,
     _ref$showEyeDropper = _ref.showEyeDropper,
     showEyeDropper = _ref$showEyeDropper === void 0 ? true : _ref$showEyeDropper,
@@ -96,7 +153,8 @@ var ColorPicker = function ColorPicker(_ref) {
     showTransparencyControl = _ref$showTransparency === void 0 ? false : _ref$showTransparency,
     _ref$showPicker = _ref.showPicker,
     showPicker = _ref$showPicker === void 0 ? true : _ref$showPicker,
-    portalProps = _ref.portalProps;
+    portalProps = _ref.portalProps,
+    colorPalette = _ref.colorPalette;
   var _useState = React.useState(color),
     _useState2 = _slicedToArray(_useState, 2),
     colorInternal = _useState2[0],
@@ -109,35 +167,39 @@ var ColorPicker = function ColorPicker(_ref) {
     isSupported = _useEyeDropper.isSupported;
   var PickerComponent = showTransparencyControl ? reactColorful.HexAlphaColorPicker : reactColorful.HexColorPicker;
   var colorValue = (_ref2 = color !== null && color !== void 0 ? color : colorInternal) !== null && _ref2 !== void 0 ? _ref2 : "";
-  var onChangeInternal = onChange || setColorInternal;
   var getColor = function getColor(colorValue) {
     var color = tinycolor.tinycolor(colorValue);
+    if (color.isValid()) {
+      var hex = color.toHexString();
+      // return `transparent` for transparent colors.
+      if (color.getAlpha() === 0) hex = colorValue;else if (showTransparencyControl) hex = color.toHex8String();
+      return {
+        hex: hex,
+        rgb: color.toRgb()
+      };
+    }
     return {
-      hex: showTransparencyControl ? color.toHex8String() : color.toHexString(),
-      rgb: color.toRgb()
+      hex: colorValue,
+      rgb: colorValue
     };
   };
+  var onColorChange = function onColorChange(color) {
+    var changeHandler = onChange !== null && onChange !== void 0 ? onChange : setColorInternal;
+    changeHandler(getColor(color));
+  };
   var onColorInputChange = function onColorInputChange(hex) {
-    var color = tinycolor.tinycolor(hex);
-    var rgb = color.toRgb();
     isInputChanged.current = true;
-    onChangeInternal({
-      hex: hex,
-      rgb: rgb
-    });
-  };
-  var onPickerChange = function onPickerChange(hex) {
-    return onChangeInternal(getColor(hex));
+    onColorChange(hex);
   };
   var onBlur = function onBlur() {
     // If input is not changed, don't call onChange on blur
     if (!isInputChanged.current) return;
     isInputChanged.current = false;
-    onChangeInternal(getColor(colorValue));
+    onColorChange(colorValue);
   };
   var pickColor = /*#__PURE__*/function () {
     var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-      var colorResponse, colorHex;
+      var colorResponse, hex;
       return _regeneratorRuntime.wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
@@ -146,8 +208,8 @@ var ColorPicker = function ColorPicker(_ref) {
             return open();
           case 3:
             colorResponse = _context.sent;
-            colorHex = tinycolor.tinycolor(colorResponse.sRGBHex).toHexString();
-            onPickerChange(colorHex);
+            hex = tinycolor.tinycolor(colorResponse.sRGBHex).toHexString();
+            onColorChange(hex);
             _context.next = 10;
             break;
           case 8:
@@ -206,7 +268,7 @@ var ColorPicker = function ColorPicker(_ref) {
     "data-testid": "neeto-color-picker-section"
   }, /*#__PURE__*/React.createElement(PickerComponent, {
     color: colorValue,
-    onChange: onPickerChange
+    onChange: onColorChange
   })), /*#__PURE__*/React.createElement("div", {
     className: "neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center neeto-ui-mt-3 neeto-ui-gap-2"
   }, showEyeDropper && isSupported() && /*#__PURE__*/React.createElement(Button, {
@@ -227,13 +289,17 @@ var ColorPicker = function ColorPicker(_ref) {
     alpha: !!showTransparencyControl,
     color: colorValue,
     onChange: onColorInputChange
-  }))))), colorPaletteProps && /*#__PURE__*/React.createElement("div", {
+  }))))), /*#__PURE__*/React.createElement("div", {
     "data-testid": "color-palette",
     className: classnames("neeto-ui-colorpicker__palette-wrapper", {
       "neeto-ui-colorpicker__palette-wrapper--hidden-picker": !showPicker,
       "neeto-ui-pt-3 neeto-ui-border-t neeto-ui-border-gray-200": showPicker
     })
-  }, /*#__PURE__*/React.createElement(Palette, colorPaletteProps))));
+  }, /*#__PURE__*/React.createElement(Palette, {
+    color: color,
+    colorList: colorPalette,
+    onChange: onColorChange
+  }))));
 };
 
 module.exports = ColorPicker;