@hitachivantara/uikit-react-core 5.5.0 → 5.7.0

package/dist/cjs/components/ColorPicker/Fields/Fields.cjs

@@ -0,0 +1,137 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const react = require("@emotion/react");
+const React = require("react");
+const color = require("react-color/lib/helpers/color");
+const Fields_styles = require("./Fields.styles.cjs");
+const fieldsClasses = require("./fieldsClasses.cjs");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const Input = require("../../Input/Input.cjs");
+function _interopNamespace(e) {
+  if (e && e.__esModule)
+    return e;
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const color__namespace = /* @__PURE__ */ _interopNamespace(color);
+const Fields = ({
+  className,
+  onChange,
+  rgb,
+  hex,
+  classes
+}) => {
+  const [internalHex, setInternalHex] = React.useState(hex);
+  const [internalRed, setInternalRed] = React.useState(rgb == null ? void 0 : rgb.r);
+  const [internalGreen, setInternalGreen] = React.useState(rgb == null ? void 0 : rgb.g);
+  const [internalBlue, setInternalBlue] = React.useState(rgb == null ? void 0 : rgb.b);
+  const hexInputRef = React.useRef();
+  const redInputRef = React.useRef();
+  const greenInputRef = React.useRef();
+  const blueInputRef = React.useRef();
+  React.useEffect(() => {
+    if (document.activeElement !== hexInputRef.current) {
+      setInternalHex(hex);
+    }
+  }, [hex]);
+  React.useEffect(() => {
+    if (document.activeElement !== redInputRef.current) {
+      setInternalRed(rgb == null ? void 0 : rgb.r);
+    }
+    if (document.activeElement !== greenInputRef.current) {
+      setInternalGreen(rgb == null ? void 0 : rgb.g);
+    }
+    if (document.activeElement !== blueInputRef.current) {
+      setInternalBlue(rgb == null ? void 0 : rgb.b);
+    }
+  }, [rgb]);
+  const handleChange = (data, event) => {
+    if (data.hex && color__namespace.isValidHex(data.hex)) {
+      onChange({
+        hex: data.hex,
+        source: "hex"
+      }, event);
+    } else if (data.r || data.g || data.b) {
+      onChange({
+        r: data.r || (rgb == null ? void 0 : rgb.r),
+        g: data.g || (rgb == null ? void 0 : rgb.g),
+        b: data.b || (rgb == null ? void 0 : rgb.b),
+        source: "rgb"
+      }, event);
+    }
+  };
+  const onChangeHex = (event, value) => {
+    setInternalHex(value);
+    handleChange({
+      hex: value
+    }, event);
+  };
+  const onChangeRbg = (event, value, colorPart) => {
+    if (colorPart === "r")
+      setInternalRed(Number(value));
+    if (colorPart === "g")
+      setInternalGreen(Number(value));
+    if (colorPart === "b")
+      setInternalBlue(Number(value));
+    handleChange({
+      r: colorPart === "r" ? Number(value) : rgb == null ? void 0 : rgb.r,
+      g: colorPart === "g" ? Number(value) : rgb == null ? void 0 : rgb.g,
+      b: colorPart === "b" ? Number(value) : rgb == null ? void 0 : rgb.b
+    }, event);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(react.ClassNames, {
+    children: ({
+      css,
+      cx
+    }) => /* @__PURE__ */ jsxRuntime.jsxs("div", {
+      className: cx(fieldsClasses.default.fields, css(Fields_styles.styles.fields), className, classes == null ? void 0 : classes.fields),
+      children: [/* @__PURE__ */ jsxRuntime.jsx(Input.HvInput, {
+        inputRef: hexInputRef,
+        className: cx(fieldsClasses.default.double, css(Fields_styles.styles.double), classes == null ? void 0 : classes.double),
+        label: "HEX",
+        value: internalHex == null ? void 0 : internalHex.replace("#", ""),
+        onChange: onChangeHex,
+        onBlur: () => setInternalHex(hex),
+        disableClear: true
+      }), /* @__PURE__ */ jsxRuntime.jsx(Input.HvInput, {
+        inputRef: redInputRef,
+        className: cx(fieldsClasses.default.single, css(Fields_styles.styles.single), classes == null ? void 0 : classes.single),
+        label: "R",
+        value: `${internalRed}`,
+        onChange: (event, value) => onChangeRbg(event, value, "r"),
+        onBlur: () => setInternalRed(rgb == null ? void 0 : rgb.r),
+        disableClear: true
+      }), /* @__PURE__ */ jsxRuntime.jsx(Input.HvInput, {
+        inputRef: greenInputRef,
+        className: cx(fieldsClasses.default.single, css(Fields_styles.styles.single), classes == null ? void 0 : classes.single),
+        label: "G",
+        value: `${internalGreen}`,
+        onChange: (event, value) => onChangeRbg(event, value, "g"),
+        onBlur: () => setInternalGreen(rgb == null ? void 0 : rgb.g),
+        disableClear: true
+      }), /* @__PURE__ */ jsxRuntime.jsx(Input.HvInput, {
+        inputRef: blueInputRef,
+        className: cx(fieldsClasses.default.single, css(Fields_styles.styles.single), classes == null ? void 0 : classes.single),
+        label: "B",
+        value: `${internalBlue}`,
+        onChange: (event, value) => onChangeRbg(event, value, "b"),
+        onBlur: () => setInternalBlue(rgb == null ? void 0 : rgb.b),
+        disableClear: true
+      })]
+    })
+  });
+};
+exports.Fields = Fields;
+//# sourceMappingURL=Fields.cjs.map

package/dist/cjs/components/ColorPicker/Fields/Fields.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Fields.cjs","sources":["../../../../../src/components/ColorPicker/Fields/Fields.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport { useEffect, useRef, useState } from \"react\";\nimport { HvInput } from \"@core/components\";\nimport { HSLColor, HSVColor, RGBColor } from \"react-color\";\nimport * as color from \"react-color/lib/helpers/color\";\nimport { styles } from \"./Fields.styles\";\nimport colorPickerFieldsClasses, {\n  HvColorPickerFieldsClasses,\n} from \"./fieldsClasses\";\n\ninterface FieldsProps {\n  className?: string;\n  rgb?: RGBColor;\n  hex?: string;\n  onChange: (\n    data:\n      | HSLColor\n      | HSVColor\n      | RGBColor\n      | {\n          source?: string;\n          hex?: string;\n        },\n    event: React.ChangeEvent<HTMLInputElement>\n  ) => void;\n  classes?: HvColorPickerFieldsClasses;\n}\n\nexport const Fields = ({\n  className,\n  onChange,\n  rgb,\n  hex,\n  classes,\n}: FieldsProps) => {\n  const [internalHex, setInternalHex] = useState<string | undefined>(hex);\n  const [internalRed, setInternalRed] = useState<number | undefined>(rgb?.r);\n  const [internalGreen, setInternalGreen] = useState<number | undefined>(\n    rgb?.g\n  );\n  const [internalBlue, setInternalBlue] = useState<number | undefined>(rgb?.b);\n\n  const hexInputRef = useRef();\n  const redInputRef = useRef();\n  const greenInputRef = useRef();\n  const blueInputRef = useRef();\n\n  useEffect(() => {\n    if (document.activeElement !== hexInputRef.current) {\n      setInternalHex(hex);\n    }\n  }, [hex]);\n\n  useEffect(() => {\n    if (document.activeElement !== redInputRef.current) {\n      setInternalRed(rgb?.r);\n    }\n\n    if (document.activeElement !== greenInputRef.current) {\n      setInternalGreen(rgb?.g);\n    }\n\n    if (document.activeElement !== blueInputRef.current) {\n      setInternalBlue(rgb?.b);\n    }\n  }, [rgb]);\n\n  const handleChange = (\n    data: {\n      hex?: string;\n      r?: number;\n      g?: number;\n      b?: number;\n    },\n    event: React.ChangeEvent<HTMLInputElement>\n  ) => {\n    if (data.hex && color.isValidHex(data.hex)) {\n      onChange(\n        {\n          hex: data.hex,\n          source: \"hex\",\n        },\n        event\n      );\n    } else if (data.r || data.g || data.b) {\n      onChange(\n        {\n          r: data.r || rgb?.r,\n          g: data.g || rgb?.g,\n          b: data.b || rgb?.b,\n          source: \"rgb\",\n        },\n        event\n      );\n    }\n  };\n\n  const onChangeHex = (\n    event: React.ChangeEvent<HTMLInputElement>,\n    value: string\n  ) => {\n    setInternalHex(value);\n    handleChange({ hex: value }, event);\n  };\n\n  const onChangeRbg = (\n    event: React.ChangeEvent<HTMLInputElement>,\n    value: string,\n    colorPart: \"r\" | \"g\" | \"b\"\n  ) => {\n    if (colorPart === \"r\") setInternalRed(Number(value));\n    if (colorPart === \"g\") setInternalGreen(Number(value));\n    if (colorPart === \"b\") setInternalBlue(Number(value));\n\n    handleChange(\n      {\n        r: colorPart === \"r\" ? Number(value) : rgb?.r,\n        g: colorPart === \"g\" ? Number(value) : rgb?.g,\n        b: colorPart === \"b\" ? Number(value) : rgb?.b,\n      },\n      event\n    );\n  };\n\n  return (\n    <ClassNames>\n      {({ css, cx }) => (\n        <div\n          className={cx(\n            colorPickerFieldsClasses.fields,\n            css(styles.fields),\n            className,\n            classes?.fields\n          )}\n        >\n          <HvInput\n            inputRef={hexInputRef}\n            className={cx(\n              colorPickerFieldsClasses.double,\n              css(styles.double),\n              classes?.double\n            )}\n            label=\"HEX\"\n            value={internalHex?.replace(\"#\", \"\")}\n            onChange={onChangeHex}\n            onBlur={() => setInternalHex(hex)}\n            disableClear\n          />\n          <HvInput\n            inputRef={redInputRef}\n            className={cx(\n              colorPickerFieldsClasses.single,\n              css(styles.single),\n              classes?.single\n            )}\n            label=\"R\"\n            value={`${internalRed}`}\n            onChange={(event, value) => onChangeRbg(event, value, \"r\")}\n            onBlur={() => setInternalRed(rgb?.r)}\n            disableClear\n          />\n          <HvInput\n            inputRef={greenInputRef}\n            className={cx(\n              colorPickerFieldsClasses.single,\n              css(styles.single),\n              classes?.single\n            )}\n            label=\"G\"\n            value={`${internalGreen}`}\n            onChange={(event, value) => onChangeRbg(event, value, \"g\")}\n            onBlur={() => setInternalGreen(rgb?.g)}\n            disableClear\n          />\n          <HvInput\n            inputRef={blueInputRef}\n            className={cx(\n              colorPickerFieldsClasses.single,\n              css(styles.single),\n              classes?.single\n            )}\n            label=\"B\"\n            value={`${internalBlue}`}\n            onChange={(event, value) => onChangeRbg(event, value, \"b\")}\n            onBlur={() => setInternalBlue(rgb?.b)}\n            disableClear\n          />\n        </div>\n      )}\n    </ClassNames>\n  );\n};\n"],"names":["Fields","className","onChange","rgb","hex","classes","internalHex","setInternalHex","useState","internalRed","setInternalRed","r","internalGreen","setInternalGreen","g","internalBlue","setInternalBlue","b","hexInputRef","useRef","redInputRef","greenInputRef","blueInputRef","useEffect","document","activeElement","current","handleChange","data","event","color","isValidHex","source","onChangeHex","value","onChangeRbg","colorPart","Number","ClassNames","children","css","cx","colorPickerFieldsClasses","fields","styles","_jsx","HvInput","inputRef","double","label","replace","onBlur","disableClear","single"],"mappings":"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"}

package/dist/cjs/components/ColorPicker/Fields/Fields.styles.cjs

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const styles = {
+  fields: {
+    width: "100%",
+    display: "flex",
+    paddingTop: uikitStyles.theme.colorPicker.fieldsPaddingTop,
+    marginRight: uikitStyles.theme.colorPicker.fieldsMarginRight
+  },
+  single: {
+    maxWidth: uikitStyles.theme.colorPicker.fieldsRgbWidth,
+    paddingLeft: uikitStyles.theme.colorPicker.fieldsRgbPaddingLeft,
+    "& input": {
+      marginLeft: 5,
+      marginRight: 5
+    },
+    "& label": {
+      paddingLeft: 5
+    }
+  },
+  double: {
+    maxWidth: uikitStyles.theme.colorPicker.fieldsHexWidth,
+    paddingRight: uikitStyles.theme.colorPicker.fieldsHexPaddingRight,
+    "& input": {
+      textTransform: "uppercase",
+      marginLeft: 5,
+      marginRight: 5
+    },
+    "& label": {
+      paddingLeft: 5
+    }
+  }
+};
+exports.styles = styles;
+//# sourceMappingURL=Fields.styles.cjs.map

package/dist/cjs/components/ColorPicker/Fields/Fields.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Fields.styles.cjs","sources":["../../../../../src/components/ColorPicker/Fields/Fields.styles.tsx"],"sourcesContent":["import { CSSInterpolation } from \"@emotion/serialize\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { HvColorPickerFieldsClasses } from \"./fieldsClasses\";\n\nexport const styles: Partial<\n  Record<keyof HvColorPickerFieldsClasses, CSSInterpolation>\n> = {\n  fields: {\n    width: \"100%\",\n    display: \"flex\",\n    paddingTop: theme.colorPicker.fieldsPaddingTop,\n    marginRight: theme.colorPicker.fieldsMarginRight,\n  },\n  single: {\n    maxWidth: theme.colorPicker.fieldsRgbWidth,\n    paddingLeft: theme.colorPicker.fieldsRgbPaddingLeft,\n    \"& input\": {\n      marginLeft: 5,\n      marginRight: 5,\n    },\n    \"& label\": {\n      paddingLeft: 5,\n    },\n  },\n  double: {\n    maxWidth: theme.colorPicker.fieldsHexWidth,\n    paddingRight: theme.colorPicker.fieldsHexPaddingRight,\n    \"& input\": {\n      textTransform: \"uppercase\",\n      marginLeft: 5,\n      marginRight: 5,\n    },\n    \"& label\": {\n      paddingLeft: 5,\n    },\n  },\n};\n"],"names":["styles","fields","width","display","paddingTop","theme","colorPicker","fieldsPaddingTop","marginRight","fieldsMarginRight","single","maxWidth","fieldsRgbWidth","paddingLeft","fieldsRgbPaddingLeft","marginLeft","double","fieldsHexWidth","paddingRight","fieldsHexPaddingRight","textTransform"],"mappings":";;;AAIO,MAAMA,SAET;AAAA,EACFC,QAAQ;AAAA,IACNC,OAAO;AAAA,IACPC,SAAS;AAAA,IACTC,YAAYC,YAAAA,MAAMC,YAAYC;AAAAA,IAC9BC,aAAaH,YAAAA,MAAMC,YAAYG;AAAAA,EACjC;AAAA,EACAC,QAAQ;AAAA,IACNC,UAAUN,YAAAA,MAAMC,YAAYM;AAAAA,IAC5BC,aAAaR,YAAAA,MAAMC,YAAYQ;AAAAA,IAC/B,WAAW;AAAA,MACTC,YAAY;AAAA,MACZP,aAAa;AAAA,IACf;AAAA,IACA,WAAW;AAAA,MACTK,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACAG,QAAQ;AAAA,IACNL,UAAUN,YAAAA,MAAMC,YAAYW;AAAAA,IAC5BC,cAAcb,YAAAA,MAAMC,YAAYa;AAAAA,IAChC,WAAW;AAAA,MACTC,eAAe;AAAA,MACfL,YAAY;AAAA,MACZP,aAAa;AAAA,IACf;AAAA,IACA,WAAW;AAAA,MACTK,aAAa;AAAA,IACf;AAAA,EACF;AACF;;"}

package/dist/cjs/components/ColorPicker/Fields/fieldsClasses.cjs

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const classes = require("../../../utils/classes.cjs");
+const classKeys = ["double", "fields", "single"];
+const colorPickerFieldsClasses = classes.getClasses(classKeys, "HvColorPicker-Fields");
+const colorPickerFieldsClasses$1 = colorPickerFieldsClasses;
+exports.default = colorPickerFieldsClasses$1;
+//# sourceMappingURL=fieldsClasses.cjs.map

package/dist/cjs/components/ColorPicker/Fields/fieldsClasses.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"fieldsClasses.cjs","sources":["../../../../../src/components/ColorPicker/Fields/fieldsClasses.ts"],"sourcesContent":["import { getClasses } from \"@core/utils\";\n\nexport interface HvColorPickerFieldsClasses {\n  fields?: string;\n  double?: string;\n  single?: string;\n}\n\nconst classKeys: (keyof HvColorPickerFieldsClasses)[] = [\n  \"double\",\n  \"fields\",\n  \"single\",\n];\n\nconst colorPickerFieldsClasses = getClasses(classKeys, \"HvColorPicker-Fields\");\n\nexport default colorPickerFieldsClasses;\n"],"names":["classKeys","colorPickerFieldsClasses","getClasses"],"mappings":";;;AAQA,MAAMA,YAAkD,CACtD,UACA,UACA,QAAQ;AAGV,MAAMC,2BAA2BC,QAAWF,WAAAA,WAAW,sBAAsB;AAE7E,MAAA,6BAAeC;;"}

package/dist/cjs/components/ColorPicker/Picker/Picker.cjs

@@ -0,0 +1,81 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const react = require("@emotion/react");
+const React = require("react");
+const common = require("react-color/lib/components/common");
+const reactColor = require("react-color");
+const Picker_styles = require("./Picker.styles.cjs");
+const pickerClasses = require("./pickerClasses.cjs");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const Fields = require("../Fields/Fields.cjs");
+const useTheme = require("../../../hooks/useTheme.cjs");
+const Typography = require("../../Typography/Typography.cjs");
+const Picker = ({
+  onChange,
+  rgb,
+  hsl,
+  hsv,
+  hex,
+  title,
+  classes
+}) => {
+  const {
+    activeTheme
+  } = useTheme.useTheme();
+  const SaturationPointer = React.useCallback(() => /* @__PURE__ */ jsxRuntime.jsx(react.ClassNames, {
+    children: ({
+      css,
+      cx
+    }) => /* @__PURE__ */ jsxRuntime.jsx("div", {
+      className: cx(pickerClasses.default.saturationPointer, css(Picker_styles.styles.saturationPointer), classes == null ? void 0 : classes.saturationPointer)
+    })
+  }), []);
+  const HueSlider = React.useCallback(() => /* @__PURE__ */ jsxRuntime.jsx(react.ClassNames, {
+    children: ({
+      css,
+      cx
+    }) => /* @__PURE__ */ jsxRuntime.jsx("div", {
+      className: cx(pickerClasses.default.hueSlider, css(Picker_styles.styles.hueSlider), classes == null ? void 0 : classes.hueSlider)
+    })
+  }), []);
+  return /* @__PURE__ */ jsxRuntime.jsx(react.ClassNames, {
+    children: ({
+      css,
+      cx
+    }) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+      children: [title && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
+        className: cx(pickerClasses.default.title, css(Picker_styles.styles.title), classes == null ? void 0 : classes.title),
+        variant: "caption1",
+        children: title
+      }), /* @__PURE__ */ jsxRuntime.jsxs("div", {
+        className: cx(pickerClasses.default.pickers, css(Picker_styles.styles.pickers), classes == null ? void 0 : classes.pickers),
+        children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
+          className: cx(pickerClasses.default.saturation, css(Picker_styles.styles.saturation), classes == null ? void 0 : classes.saturation),
+          children: /* @__PURE__ */ jsxRuntime.jsx(common.Saturation, {
+            hsl,
+            hsv,
+            onChange,
+            pointer: SaturationPointer
+          })
+        }), /* @__PURE__ */ jsxRuntime.jsx("div", {
+          className: cx(pickerClasses.default.hue, css(Picker_styles.styles.hue), classes == null ? void 0 : classes.hue),
+          children: /* @__PURE__ */ jsxRuntime.jsx(common.Hue, {
+            direction: activeTheme == null ? void 0 : activeTheme.colorPicker.hueDirection,
+            hsl,
+            onChange,
+            pointer: HueSlider
+          })
+        })]
+      }), /* @__PURE__ */ jsxRuntime.jsx(Fields.Fields, {
+        className: cx(pickerClasses.default.fields, classes == null ? void 0 : classes.fields),
+        rgb,
+        hex,
+        onChange
+      })]
+    })
+  });
+};
+const Picker$1 = reactColor.CustomPicker(Picker);
+exports.Picker = Picker;
+exports.default = Picker$1;
+//# sourceMappingURL=Picker.cjs.map

package/dist/cjs/components/ColorPicker/Picker/Picker.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Picker.cjs","sources":["../../../../../src/components/ColorPicker/Picker/Picker.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport { useCallback } from \"react\";\nimport { Saturation, Hue } from \"react-color/lib/components/common\";\nimport {\n  CustomPicker,\n  CustomPickerInjectedProps,\n  HSLColor,\n  HSVColor,\n  RGBColor,\n} from \"react-color\";\nimport { styles } from \"./Picker.styles\";\nimport { Fields } from \"../Fields\";\nimport { HvTypography } from \"@core/components\";\nimport { useTheme } from \"@core/hooks\";\nimport colorPickerPickerClasses, {\n  HvColorPickerPickerClasses,\n} from \"./pickerClasses\";\n\nexport const Picker = ({\n  onChange,\n  rgb,\n  hsl,\n  hsv,\n  hex,\n  title,\n  classes,\n}: {\n  classes?: HvColorPickerPickerClasses;\n  title?: string;\n} & CustomPickerInjectedProps<\n  | HSLColor\n  | HSVColor\n  | RGBColor\n  | {\n      source?: string;\n      hex?: string;\n    }\n>) => {\n  const { activeTheme } = useTheme();\n\n  const SaturationPointer = useCallback(\n    () => (\n      <ClassNames>\n        {({ css, cx }) => (\n          <div\n            className={cx(\n              colorPickerPickerClasses.saturationPointer,\n              css(styles.saturationPointer),\n              classes?.saturationPointer\n            )}\n          />\n        )}\n      </ClassNames>\n    ),\n    []\n  );\n\n  const HueSlider = useCallback(\n    () => (\n      <ClassNames>\n        {({ css, cx }) => (\n          <div\n            className={cx(\n              colorPickerPickerClasses.hueSlider,\n              css(styles.hueSlider),\n              classes?.hueSlider\n            )}\n          />\n        )}\n      </ClassNames>\n    ),\n    []\n  );\n\n  return (\n    <ClassNames>\n      {({ css, cx }) => (\n        <>\n          {title && (\n            <HvTypography\n              className={cx(\n                colorPickerPickerClasses.title,\n                css(styles.title),\n                classes?.title\n              )}\n              variant=\"caption1\"\n            >\n              {title}\n            </HvTypography>\n          )}\n          <div\n            className={cx(\n              colorPickerPickerClasses.pickers,\n              css(styles.pickers),\n              classes?.pickers\n            )}\n          >\n            <div\n              className={cx(\n                colorPickerPickerClasses.saturation,\n                css(styles.saturation),\n                classes?.saturation\n              )}\n            >\n              <Saturation\n                hsl={hsl}\n                hsv={hsv}\n                onChange={onChange}\n                pointer={SaturationPointer}\n              />\n            </div>\n            <div\n              className={cx(\n                colorPickerPickerClasses.hue,\n                css(styles.hue),\n                classes?.hue\n              )}\n            >\n              <Hue\n                direction={activeTheme?.colorPicker.hueDirection}\n                hsl={hsl}\n                onChange={onChange}\n                pointer={HueSlider}\n              />\n            </div>\n          </div>\n          <Fields\n            className={cx(colorPickerPickerClasses.fields, classes?.fields)}\n            rgb={rgb}\n            hex={hex}\n            onChange={onChange}\n          />\n        </>\n      )}\n    </ClassNames>\n  );\n};\n\nexport default CustomPicker(Picker);\n"],"names":["Picker","onChange","rgb","hsl","hsv","hex","title","classes","activeTheme","useTheme","SaturationPointer","useCallback","_jsx","ClassNames","children","css","cx","className","colorPickerPickerClasses","saturationPointer","styles","HueSlider","hueSlider","_Fragment","HvTypography","variant","_jsxs","pickers","saturation","Saturation","pointer","hue","Hue","direction","colorPicker","hueDirection","Fields","fields","CustomPicker"],"mappings":";;;;;;;;;;;;AAkBO,MAAMA,SAASA,CAAC;AAAA,EACrBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAYF,MAAM;AACE,QAAA;AAAA,IAAEC;AAAAA,MAAgBC,SAAU,SAAA;AAElC,QAAMC,oBAAoBC,MAAAA,YACxB,MACEC,2BAAAA,IAACC,MAAAA,YAAU;AAAA,IAAAC,UACRA,CAAC;AAAA,MAAEC;AAAAA,MAAKC;AAAAA,IAAAA,qCACP,OAAA;AAAA,MACEC,WAAWD,GACTE,cAAyBC,QAAAA,mBACzBJ,IAAIK,cAAAA,OAAOD,iBAAiB,GAC5BZ,mCAASY,iBAAiB;AAAA,IAAA,CAC1B;AAAA,EAAA,CAIT,GACD,CAAE,CAAA;AAGJ,QAAME,YAAYV,MAAAA,YAChB,MACEC,2BAAAA,IAACC,MAAAA,YAAU;AAAA,IAAAC,UACRA,CAAC;AAAA,MAAEC;AAAAA,MAAKC;AAAAA,IAAAA,qCACP,OAAA;AAAA,MACEC,WAAWD,GACTE,cAAyBI,QAAAA,WACzBP,IAAIK,cAAAA,OAAOE,SAAS,GACpBf,mCAASe,SAAS;AAAA,IAAA,CAClB;AAAA,EAAA,CAIT,GACD,CAAE,CAAA;AAGJ,wCACGT,MAAAA,YAAU;AAAA,IAAAC,UACRA,CAAC;AAAA,MAAEC;AAAAA,MAAKC;AAAAA,IAAAA,sCACPO,WAAAA,UAAA;AAAA,MAAAT,UACGR,CAAAA,SACCM,2BAAAA,IAACY,yBAAY;AAAA,QACXP,WAAWD,GACTE,cAAyBZ,QAAAA,OACzBS,IAAIK,cAAAA,OAAOd,KAAK,GAChBC,mCAASD,KAAK;AAAA,QAEhBmB,SAAQ;AAAA,QAAUX,UAEjBR;AAAAA,MAAAA,CAAK,GAGVoB,2BAAAA,KAAA,OAAA;AAAA,QACET,WAAWD,GACTE,cAAyBS,QAAAA,SACzBZ,IAAIK,cAAAA,OAAOO,OAAO,GAClBpB,mCAASoB,OAAO;AAAA,QAChBb,WAEFF,2BAAAA,IAAA,OAAA;AAAA,UACEK,WAAWD,GACTE,cAAyBU,QAAAA,YACzBb,IAAIK,cAAAA,OAAOQ,UAAU,GACrBrB,mCAASqB,UAAU;AAAA,UACnBd,yCAEDe,mBAAU;AAAA,YACT1B;AAAAA,YACAC;AAAAA,YACAH;AAAAA,YACA6B,SAASpB;AAAAA,UAAAA,CAAkB;AAAA,QAAA,CAC3B,GAEJE,2BAAAA,IAAA,OAAA;AAAA,UACEK,WAAWD,GACTE,cAAyBa,QAAAA,KACzBhB,IAAIK,cAAAA,OAAOW,GAAG,GACdxB,mCAASwB,GAAG;AAAA,UACZjB,yCAEDkB,YAAG;AAAA,YACFC,WAAWzB,2CAAa0B,YAAYC;AAAAA,YACpChC;AAAAA,YACAF;AAAAA,YACA6B,SAAST;AAAAA,UAAAA,CAAU;AAAA,QAAA,CAEjB,CAAA;AAAA,MAAA,CACF,GACNT,2BAAAA,IAACwB,eAAM;AAAA,QACLnB,WAAWD,GAAGE,cAAAA,QAAyBmB,QAAQ9B,mCAAS8B,MAAM;AAAA,QAC9DnC;AAAAA,QACAG;AAAAA,QACAJ;AAAAA,MAAAA,CACA,CAAA;AAAA,IAAA,CAAA;AAAA,EAAA,CAGK;AAEjB;AAEA,MAAeqC,WAAAA,WAAAA,aAAatC,MAAM;;;"}

package/dist/cjs/components/ColorPicker/Picker/Picker.styles.cjs

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const styles = {
+  pickers: {
+    display: "flex",
+    flexDirection: uikitStyles.theme.colorPicker.pickersFlexDirection
+  },
+  saturation: {
+    width: uikitStyles.theme.colorPicker.saturationWidth,
+    height: uikitStyles.theme.colorPicker.saturationHeight,
+    marginRight: uikitStyles.theme.colorPicker.saturationMarginRight,
+    position: "relative",
+    overflow: "visible",
+    "& > div": {
+      borderRadius: uikitStyles.theme.colorPicker.saturationBorderRadius,
+      "& .saturation-white": {
+        borderRadius: uikitStyles.theme.colorPicker.saturationBorderRadius,
+        "& .saturation-black": {
+          borderRadius: uikitStyles.theme.colorPicker.saturationBorderRadius
+        }
+      }
+    }
+  },
+  saturationPointer: {
+    width: uikitStyles.theme.colorPicker.saturationPointerWidth,
+    height: uikitStyles.theme.colorPicker.saturationPointerHeight,
+    boxShadow: `0 0 0 2px #fff, inset 0 0 1px 1px rgba(0,0,0,.3),
+            0 0 1px 2px rgba(0,0,0,.4)`,
+    borderRadius: "50%",
+    transform: "translate(-3px, -3px)"
+  },
+  hue: {
+    height: uikitStyles.theme.colorPicker.hueHeight,
+    width: uikitStyles.theme.colorPicker.hueWidth,
+    position: "relative",
+    overflow: "visible",
+    marginTop: uikitStyles.theme.colorPicker.hueMarginTop,
+    "& .hue-horizontal": {
+      borderRadius: uikitStyles.theme.colorPicker.hueBorderRadius
+    }
+  },
+  hueSlider: {
+    width: uikitStyles.theme.colorPicker.hueSliderWidth,
+    height: uikitStyles.theme.colorPicker.hueSliderHeight,
+    background: uikitStyles.theme.colorPicker.hueSliderBackground,
+    boxShadow: "0 0 2px rgb(0 0 0 / 60%)",
+    marginLeft: uikitStyles.theme.colorPicker.hueSliderMarginLeft,
+    border: uikitStyles.theme.colorPicker.hueSliderBorder,
+    borderRadius: uikitStyles.theme.colorPicker.hueSliderBorderRadius,
+    transform: "translate(0, -2px)"
+  },
+  title: {
+    fontWeight: uikitStyles.theme.fontWeights.semibold,
+    marginBottom: 8
+  }
+};
+exports.styles = styles;
+//# sourceMappingURL=Picker.styles.cjs.map

package/dist/cjs/components/ColorPicker/Picker/Picker.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Picker.styles.cjs","sources":["../../../../../src/components/ColorPicker/Picker/Picker.styles.tsx"],"sourcesContent":["import { CSSInterpolation } from \"@emotion/serialize\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { CSSProperties } from \"react\";\nimport { HvColorPickerPickerClasses } from \"./pickerClasses\";\n\nexport const styles: Partial<\n  Record<keyof HvColorPickerPickerClasses, CSSInterpolation>\n> = {\n  pickers: {\n    display: \"flex\",\n    flexDirection: theme.colorPicker\n      .pickersFlexDirection as CSSProperties[\"flexDirection\"],\n  },\n  saturation: {\n    width: theme.colorPicker.saturationWidth,\n    height: theme.colorPicker.saturationHeight,\n    marginRight: theme.colorPicker.saturationMarginRight,\n    position: \"relative\",\n    overflow: \"visible\",\n\n    \"& > div\": {\n      borderRadius: theme.colorPicker.saturationBorderRadius,\n\n      \"& .saturation-white\": {\n        borderRadius: theme.colorPicker.saturationBorderRadius,\n\n        \"& .saturation-black\": {\n          borderRadius: theme.colorPicker.saturationBorderRadius,\n        },\n      },\n    },\n  },\n  saturationPointer: {\n    width: theme.colorPicker.saturationPointerWidth,\n    height: theme.colorPicker.saturationPointerHeight,\n    boxShadow: `0 0 0 2px #fff, inset 0 0 1px 1px rgba(0,0,0,.3),\n            0 0 1px 2px rgba(0,0,0,.4)`,\n    borderRadius: \"50%\",\n    transform: \"translate(-3px, -3px)\",\n  },\n  hue: {\n    height: theme.colorPicker.hueHeight,\n    width: theme.colorPicker.hueWidth,\n    position: \"relative\",\n    overflow: \"visible\",\n    marginTop: theme.colorPicker.hueMarginTop,\n\n    \"& .hue-horizontal\": {\n      borderRadius: theme.colorPicker.hueBorderRadius,\n    },\n  },\n  hueSlider: {\n    width: theme.colorPicker.hueSliderWidth,\n    height: theme.colorPicker.hueSliderHeight,\n    background: theme.colorPicker.hueSliderBackground,\n    boxShadow: \"0 0 2px rgb(0 0 0 / 60%)\",\n    marginLeft: theme.colorPicker.hueSliderMarginLeft,\n    border: theme.colorPicker.hueSliderBorder,\n    borderRadius: theme.colorPicker.hueSliderBorderRadius,\n    transform: \"translate(0, -2px)\",\n  },\n  title: {\n    fontWeight: theme.fontWeights.semibold,\n    marginBottom: 8,\n  },\n};\n"],"names":["styles","pickers","display","flexDirection","theme","colorPicker","pickersFlexDirection","saturation","width","saturationWidth","height","saturationHeight","marginRight","saturationMarginRight","position","overflow","borderRadius","saturationBorderRadius","saturationPointer","saturationPointerWidth","saturationPointerHeight","boxShadow","transform","hue","hueHeight","hueWidth","marginTop","hueMarginTop","hueBorderRadius","hueSlider","hueSliderWidth","hueSliderHeight","background","hueSliderBackground","marginLeft","hueSliderMarginLeft","border","hueSliderBorder","hueSliderBorderRadius","title","fontWeight","fontWeights","semibold","marginBottom"],"mappings":";;;AAKO,MAAMA,SAET;AAAA,EACFC,SAAS;AAAA,IACPC,SAAS;AAAA,IACTC,eAAeC,YAAAA,MAAMC,YAClBC;AAAAA,EACL;AAAA,EACAC,YAAY;AAAA,IACVC,OAAOJ,YAAAA,MAAMC,YAAYI;AAAAA,IACzBC,QAAQN,YAAAA,MAAMC,YAAYM;AAAAA,IAC1BC,aAAaR,YAAAA,MAAMC,YAAYQ;AAAAA,IAC/BC,UAAU;AAAA,IACVC,UAAU;AAAA,IAEV,WAAW;AAAA,MACTC,cAAcZ,YAAAA,MAAMC,YAAYY;AAAAA,MAEhC,uBAAuB;AAAA,QACrBD,cAAcZ,YAAAA,MAAMC,YAAYY;AAAAA,QAEhC,uBAAuB;AAAA,UACrBD,cAAcZ,YAAAA,MAAMC,YAAYY;AAAAA,QAClC;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA,EACAC,mBAAmB;AAAA,IACjBV,OAAOJ,YAAAA,MAAMC,YAAYc;AAAAA,IACzBT,QAAQN,YAAAA,MAAMC,YAAYe;AAAAA,IAC1BC,WAAY;AAAA;AAAA,IAEZL,cAAc;AAAA,IACdM,WAAW;AAAA,EACb;AAAA,EACAC,KAAK;AAAA,IACHb,QAAQN,YAAAA,MAAMC,YAAYmB;AAAAA,IAC1BhB,OAAOJ,YAAAA,MAAMC,YAAYoB;AAAAA,IACzBX,UAAU;AAAA,IACVC,UAAU;AAAA,IACVW,WAAWtB,YAAAA,MAAMC,YAAYsB;AAAAA,IAE7B,qBAAqB;AAAA,MACnBX,cAAcZ,YAAAA,MAAMC,YAAYuB;AAAAA,IAClC;AAAA,EACF;AAAA,EACAC,WAAW;AAAA,IACTrB,OAAOJ,YAAAA,MAAMC,YAAYyB;AAAAA,IACzBpB,QAAQN,YAAAA,MAAMC,YAAY0B;AAAAA,IAC1BC,YAAY5B,YAAAA,MAAMC,YAAY4B;AAAAA,IAC9BZ,WAAW;AAAA,IACXa,YAAY9B,YAAAA,MAAMC,YAAY8B;AAAAA,IAC9BC,QAAQhC,YAAAA,MAAMC,YAAYgC;AAAAA,IAC1BrB,cAAcZ,YAAAA,MAAMC,YAAYiC;AAAAA,IAChChB,WAAW;AAAA,EACb;AAAA,EACAiB,OAAO;AAAA,IACLC,YAAYpC,YAAAA,MAAMqC,YAAYC;AAAAA,IAC9BC,cAAc;AAAA,EAChB;AACF;;"}

package/dist/cjs/components/ColorPicker/Picker/pickerClasses.cjs

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const classes = require("../../../utils/classes.cjs");
+const classKeys = ["hue", "hueSlider", "pickers", "saturation", "saturationPointer", "title", "fields"];
+const colorPickerPickerClasses = classes.getClasses(classKeys, "HvColorPicker-Picker");
+const colorPickerPickerClasses$1 = colorPickerPickerClasses;
+exports.default = colorPickerPickerClasses$1;
+//# sourceMappingURL=pickerClasses.cjs.map

package/dist/cjs/components/ColorPicker/Picker/pickerClasses.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"pickerClasses.cjs","sources":["../../../../../src/components/ColorPicker/Picker/pickerClasses.ts"],"sourcesContent":["import { getClasses } from \"@core/utils\";\n\nexport interface HvColorPickerPickerClasses {\n  pickers?: string;\n  saturation?: string;\n  saturationPointer?: string;\n  hue?: string;\n  hueSlider?: string;\n  title?: string;\n  fields?: string;\n}\n\nconst classKeys: (keyof HvColorPickerPickerClasses)[] = [\n  \"hue\",\n  \"hueSlider\",\n  \"pickers\",\n  \"saturation\",\n  \"saturationPointer\",\n  \"title\",\n  \"fields\",\n];\n\nconst colorPickerPickerClasses = getClasses(classKeys, \"HvColorPicker-Picker\");\n\nexport default colorPickerPickerClasses;\n"],"names":["classKeys","colorPickerPickerClasses","getClasses"],"mappings":";;;AAYA,MAAMA,YAAkD,CACtD,OACA,aACA,WACA,cACA,qBACA,SACA,QAAQ;AAGV,MAAMC,2BAA2BC,QAAWF,WAAAA,WAAW,sBAAsB;AAE7E,MAAA,6BAAeC;;"}

package/dist/cjs/components/ColorPicker/PresetColors/PresetColors.cjs

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const react = require("@emotion/react");
+const PresetColors_styles = require("./PresetColors.styles.cjs");
+const presetColorsClasses = require("./presetColorsClasses.cjs");
+const common = require("react-color/lib/components/common");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const Typography = require("../../Typography/Typography.cjs");
+const PresetColors = ({
+  onClick,
+  colors,
+  title,
+  className,
+  classes
+}) => {
+  const handleClick = (hex) => {
+    onClick({
+      hex,
+      source: "hex"
+    });
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(react.ClassNames, {
+    children: ({
+      css,
+      cx
+    }) => /* @__PURE__ */ jsxRuntime.jsxs("div", {
+      className: cx(presetColorsClasses.default.root, css(PresetColors_styles.styles.root), className, classes == null ? void 0 : classes.root),
+      children: [title && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
+        className: cx(presetColorsClasses.default.title, css(PresetColors_styles.styles.title), classes == null ? void 0 : classes.title),
+        variant: "caption1",
+        children: title
+      }), /* @__PURE__ */ jsxRuntime.jsx("div", {
+        className: cx(presetColorsClasses.default.colors, css(PresetColors_styles.styles.colors), classes == null ? void 0 : classes.colors),
+        children: colors.map((color, index) => {
+          return /* @__PURE__ */ jsxRuntime.jsx("div", {
+            className: cx(presetColorsClasses.default.swatchWrap, css(PresetColors_styles.styles.swatchWrap), classes == null ? void 0 : classes.swatchWrap),
+            children: /* @__PURE__ */ jsxRuntime.jsx(common.Swatch, {
+              color,
+              onClick: handleClick,
+              focusStyle: {
+                boxShadow: `inset 0 0 0 1px rgba(0,0,0,.15), 0 0 4px ${color}`
+              }
+            })
+          }, `recommended-color-${color}-${index}`);
+        })
+      })]
+    })
+  });
+};
+exports.PresetColors = PresetColors;
+//# sourceMappingURL=PresetColors.cjs.map

package/dist/cjs/components/ColorPicker/PresetColors/PresetColors.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PresetColors.cjs","sources":["../../../../../src/components/ColorPicker/PresetColors/PresetColors.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport { styles } from \"./PresetColors.styles\";\nimport { HvTypography } from \"@core/components\";\nimport colorPickerPresetColorsClasses, {\n  HvColorPickerPresetColorsClasses,\n} from \"./presetColorsClasses\";\n\n// @types/react-color seems to be broken\n// @ts-ignore\nimport { Swatch } from \"react-color/lib/components/common\";\n\ninterface PresetColorsProps {\n  colors: string[];\n  onClick: (color: { hex: string; source: string }) => void;\n  title?: string;\n  className?: string;\n  classes?: HvColorPickerPresetColorsClasses;\n}\n\nexport const PresetColors = ({\n  onClick,\n  colors,\n  title,\n  className,\n  classes,\n}: PresetColorsProps) => {\n  const handleClick = (hex: string) => {\n    onClick({\n      hex,\n      source: \"hex\",\n    });\n  };\n\n  return (\n    <ClassNames>\n      {({ css, cx }) => (\n        <div\n          className={cx(\n            colorPickerPresetColorsClasses.root,\n            css(styles.root),\n            className,\n            classes?.root\n          )}\n        >\n          {title && (\n            <HvTypography\n              className={cx(\n                colorPickerPresetColorsClasses.title,\n                css(styles.title),\n                classes?.title\n              )}\n              variant=\"caption1\"\n            >\n              {title}\n            </HvTypography>\n          )}\n          <div\n            className={cx(\n              colorPickerPresetColorsClasses.colors,\n              css(styles.colors),\n              classes?.colors\n            )}\n          >\n            {colors.map((color, index) => {\n              return (\n                <div\n                  key={`recommended-color-${color}-${index}`}\n                  className={cx(\n                    colorPickerPresetColorsClasses.swatchWrap,\n                    css(styles.swatchWrap),\n                    classes?.swatchWrap\n                  )}\n                >\n                  <Swatch\n                    color={color}\n                    onClick={handleClick}\n                    focusStyle={{\n                      boxShadow: `inset 0 0 0 1px rgba(0,0,0,.15), 0 0 4px ${color}`,\n                    }}\n                  />\n                </div>\n              );\n            })}\n          </div>\n        </div>\n      )}\n    </ClassNames>\n  );\n};\n"],"names":["PresetColors","onClick","colors","title","className","classes","handleClick","hex","source","ClassNames","children","css","cx","colorPickerPresetColorsClasses","root","styles","_jsx","HvTypography","variant","map","color","index","swatchWrap","Swatch","focusStyle","boxShadow"],"mappings":";;;;;;;;AAmBO,MAAMA,eAAeA,CAAC;AAAA,EAC3BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AACiB,MAAM;AACjBC,QAAAA,cAAcA,CAACC,QAAgB;AAC3B,YAAA;AAAA,MACNA;AAAAA,MACAC,QAAQ;AAAA,IAAA,CACT;AAAA,EAAA;AAGH,wCACGC,MAAAA,YAAU;AAAA,IAAAC,UACRA,CAAC;AAAA,MAAEC;AAAAA,MAAKC;AAAAA,IAAAA,sCACP,OAAA;AAAA,MACER,WAAWQ,GACTC,4BAA+BC,MAC/BH,IAAII,2BAAOD,IAAI,GACfV,WACAC,mCAASS,IAAI;AAAA,MACbJ,UAEDP,CAAAA,SACCa,2BAAAA,IAACC,yBAAY;AAAA,QACXb,WAAWQ,GACTC,oBAA+BV,QAAAA,OAC/BQ,IAAII,oBAAAA,OAAOZ,KAAK,GAChBE,mCAASF,KAAK;AAAA,QAEhBe,SAAQ;AAAA,QAAUR,UAEjBP;AAAAA,MAAAA,CAAK,GAGVa,2BAAAA,IAAA,OAAA;AAAA,QACEZ,WAAWQ,GACTC,oBAA+BX,QAAAA,QAC/BS,IAAII,oBAAAA,OAAOb,MAAM,GACjBG,mCAASH,MAAM;AAAA,QACfQ,UAEDR,OAAOiB,IAAI,CAACC,OAAOC,UAAU;AAC5B,gDACE,OAAA;AAAA,YAEEjB,WAAWQ,GACTC,oBAA+BS,QAAAA,YAC/BX,IAAII,oBAAAA,OAAOO,UAAU,GACrBjB,mCAASiB,UAAU;AAAA,YACnBZ,yCAEDa,eAAM;AAAA,cACLH;AAAAA,cACAnB,SAASK;AAAAA,cACTkB,YAAY;AAAA,gBACVC,WAAY,4CAA2CL;AAAAA,cACzD;AAAA,YAAA,CAAE;AAAA,UAAA,GAZE,qBAAoBA,SAASC,OAAO;AAAA,QAAA,CAgB/C;AAAA,MAAA,CACG,CAAA;AAAA,IAAA,CAAA;AAAA,EAAA,CAGC;AAEjB;;"}

package/dist/cjs/components/ColorPicker/PresetColors/PresetColors.styles.cjs

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const styles = {
+  root: {
+    width: uikitStyles.theme.colorPicker.recommendedColorsRootWidth
+  },
+  colors: {
+    display: "flex",
+    flexWrap: "wrap",
+    position: "relative",
+    width: uikitStyles.theme.colorPicker.recommendedColorsWidth,
+    margin: uikitStyles.theme.colorPicker.recommendedColorsMargin,
+    padding: 0
+  },
+  title: {
+    fontWeight: uikitStyles.theme.fontWeights.semibold,
+    marginBottom: 8
+  },
+  swatchWrap: {
+    width: uikitStyles.theme.colorPicker.recommendedColorsSwatchWidth,
+    height: uikitStyles.theme.colorPicker.recommendedColorsSwatchHeight,
+    margin: uikitStyles.theme.colorPicker.recommendedColorsSwatchMargin,
+    "& > span > div": {
+      borderRadius: uikitStyles.theme.colorPicker.recommendedColorsSwatchBorderRadius
+    }
+  }
+};
+exports.styles = styles;
+//# sourceMappingURL=PresetColors.styles.cjs.map

package/dist/cjs/components/ColorPicker/PresetColors/PresetColors.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PresetColors.styles.cjs","sources":["../../../../../src/components/ColorPicker/PresetColors/PresetColors.styles.tsx"],"sourcesContent":["import { CSSInterpolation } from \"@emotion/serialize\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { HvColorPickerPresetColorsClasses } from \"./presetColorsClasses\";\n\nexport const styles: Partial<\n  Record<keyof HvColorPickerPresetColorsClasses, CSSInterpolation>\n> = {\n  root: { width: theme.colorPicker.recommendedColorsRootWidth },\n  colors: {\n    display: \"flex\",\n    flexWrap: \"wrap\",\n    position: \"relative\",\n    width: theme.colorPicker.recommendedColorsWidth,\n    margin: theme.colorPicker.recommendedColorsMargin,\n    padding: 0,\n  },\n  title: {\n    fontWeight: theme.fontWeights.semibold,\n    marginBottom: 8,\n  },\n  swatchWrap: {\n    width: theme.colorPicker.recommendedColorsSwatchWidth,\n    height: theme.colorPicker.recommendedColorsSwatchHeight,\n    margin: theme.colorPicker.recommendedColorsSwatchMargin,\n\n    \"& > span > div\": {\n      borderRadius: theme.colorPicker.recommendedColorsSwatchBorderRadius,\n    },\n  },\n};\n"],"names":["styles","root","width","theme","colorPicker","recommendedColorsRootWidth","colors","display","flexWrap","position","recommendedColorsWidth","margin","recommendedColorsMargin","padding","title","fontWeight","fontWeights","semibold","marginBottom","swatchWrap","recommendedColorsSwatchWidth","height","recommendedColorsSwatchHeight","recommendedColorsSwatchMargin","borderRadius","recommendedColorsSwatchBorderRadius"],"mappings":";;;AAIO,MAAMA,SAET;AAAA,EACFC,MAAM;AAAA,IAAEC,OAAOC,YAAAA,MAAMC,YAAYC;AAAAA,EAA2B;AAAA,EAC5DC,QAAQ;AAAA,IACNC,SAAS;AAAA,IACTC,UAAU;AAAA,IACVC,UAAU;AAAA,IACVP,OAAOC,YAAAA,MAAMC,YAAYM;AAAAA,IACzBC,QAAQR,YAAAA,MAAMC,YAAYQ;AAAAA,IAC1BC,SAAS;AAAA,EACX;AAAA,EACAC,OAAO;AAAA,IACLC,YAAYZ,YAAAA,MAAMa,YAAYC;AAAAA,IAC9BC,cAAc;AAAA,EAChB;AAAA,EACAC,YAAY;AAAA,IACVjB,OAAOC,YAAAA,MAAMC,YAAYgB;AAAAA,IACzBC,QAAQlB,YAAAA,MAAMC,YAAYkB;AAAAA,IAC1BX,QAAQR,YAAAA,MAAMC,YAAYmB;AAAAA,IAE1B,kBAAkB;AAAA,MAChBC,cAAcrB,YAAAA,MAAMC,YAAYqB;AAAAA,IAClC;AAAA,EACF;AACF;;"}

package/dist/cjs/components/ColorPicker/PresetColors/presetColorsClasses.cjs

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const classes = require("../../../utils/classes.cjs");
+const classKeys = ["colors", "root", "swatchWrap", "title"];
+const colorPickerPresetColorsClasses = classes.getClasses(classKeys, "HvColorPicker-PresetColors");
+const colorPickerPresetColorsClasses$1 = colorPickerPresetColorsClasses;
+exports.default = colorPickerPresetColorsClasses$1;
+//# sourceMappingURL=presetColorsClasses.cjs.map

package/dist/cjs/components/ColorPicker/PresetColors/presetColorsClasses.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"presetColorsClasses.cjs","sources":["../../../../../src/components/ColorPicker/PresetColors/presetColorsClasses.ts"],"sourcesContent":["import { getClasses } from \"@core/utils\";\n\nexport interface HvColorPickerPresetColorsClasses {\n  root?: string;\n  colors?: string;\n  title?: string;\n  swatchWrap?: string;\n}\n\nconst classKeys: (keyof HvColorPickerPresetColorsClasses)[] = [\n  \"colors\",\n  \"root\",\n  \"swatchWrap\",\n  \"title\",\n];\n\nconst colorPickerPresetColorsClasses = getClasses(\n  classKeys,\n  \"HvColorPicker-PresetColors\"\n);\n\nexport default colorPickerPresetColorsClasses;\n"],"names":["classKeys","colorPickerPresetColorsClasses","getClasses"],"mappings":";;;AASA,MAAMA,YAAwD,CAC5D,UACA,QACA,cACA,OAAO;AAGT,MAAMC,iCAAiCC,QACrCF,WAAAA,WACA,4BAA4B;AAG9B,MAAA,mCAAeC;;"}

package/dist/cjs/components/ColorPicker/SavedColors/SavedColors.cjs

@@ -0,0 +1,67 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const react = require("@emotion/react");
+const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
+const SavedColors_styles = require("./SavedColors.styles.cjs");
+const common = require("react-color/lib/components/common");
+const savedColorsClasses = require("./savedColorsClasses.cjs");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const Button = require("../../Button/Button.cjs");
+const SavedColors = ({
+  colors,
+  onClickColor,
+  onAddColor,
+  onRemoveColor,
+  deleteButtonArialLabel,
+  classes
+}) => {
+  const handleClick = (hex) => {
+    onClickColor({
+      hex,
+      source: "hex"
+    });
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(react.ClassNames, {
+    children: ({
+      css,
+      cx
+    }) => /* @__PURE__ */ jsxRuntime.jsxs("div", {
+      className: cx(savedColorsClasses.default.root, css(SavedColors_styles.styles.root), classes == null ? void 0 : classes.root),
+      children: [/* @__PURE__ */ jsxRuntime.jsx(Button.HvButton, {
+        className: cx(savedColorsClasses.default.addButton, css(SavedColors_styles.styles.addButton), classes == null ? void 0 : classes.addButton),
+        variant: "secondarySubtle",
+        icon: true,
+        onClick: onAddColor,
+        children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Add, {})
+      }), colors.map((color, index) => {
+        return /* @__PURE__ */ jsxRuntime.jsxs("div", {
+          className: cx(savedColorsClasses.default.swatchRoot, css(SavedColors_styles.styles.swatchRoot), classes == null ? void 0 : classes.swatchRoot),
+          children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
+            className: cx(savedColorsClasses.default.swatchWrap, css(SavedColors_styles.styles.swatchWrap), classes == null ? void 0 : classes.swatchWrap),
+            children: /* @__PURE__ */ jsxRuntime.jsx(common.Swatch, {
+              color,
+              onClick: handleClick,
+              focusStyle: {
+                boxShadow: `inset 0 0 0 1px rgba(0,0,0,.15), 0 0 4px ${color}`
+              }
+            })
+          }), /* @__PURE__ */ jsxRuntime.jsx("div", {
+            className: cx(savedColorsClasses.default.removeButtonRoot, css(SavedColors_styles.styles.removeButtonRoot), classes == null ? void 0 : classes.removeButtonRoot),
+            children: /* @__PURE__ */ jsxRuntime.jsx(Button.HvButton, {
+              className: cx(savedColorsClasses.default.removeButton, css(SavedColors_styles.styles.removeButton), classes == null ? void 0 : classes.removeButton),
+              variant: "secondarySubtle",
+              onClick: () => onRemoveColor(color, index),
+              tabIndex: 0,
+              "aria-label": deleteButtonArialLabel,
+              children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.CloseXS, {
+                iconSize: "XS"
+              })
+            })
+          })]
+        }, `saved-color-${color}-${index}`);
+      })]
+    })
+  });
+};
+exports.SavedColors = SavedColors;
+//# sourceMappingURL=SavedColors.cjs.map

package/dist/cjs/components/ColorPicker/SavedColors/SavedColors.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SavedColors.cjs","sources":["../../../../../src/components/ColorPicker/SavedColors/SavedColors.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport { HvButton } from \"@core/components\";\nimport { CloseXS, Add } from \"@hitachivantara/uikit-react-icons\";\nimport { styles } from \"./SavedColors.styles\";\n\n// @types/react-color seems to be broken\n// @ts-ignore\nimport { Swatch } from \"react-color/lib/components/common\";\nimport colorPickerSavedColorsClasses, {\n  HvColorPickerSavedColorsClasses,\n} from \"./savedColorsClasses\";\n\ninterface SavedColorsProps {\n  colors: string[];\n  onClickColor: (color: { hex: string; source: string }) => void;\n  onAddColor: () => void;\n  onRemoveColor: (color: string, index: number) => void;\n  deleteButtonArialLabel?: string;\n  classes?: HvColorPickerSavedColorsClasses;\n}\n\nexport const SavedColors = ({\n  colors,\n  onClickColor,\n  onAddColor,\n  onRemoveColor,\n  deleteButtonArialLabel,\n  classes,\n}: SavedColorsProps) => {\n  const handleClick = (hex: string) => {\n    onClickColor({\n      hex,\n      source: \"hex\",\n    });\n  };\n\n  return (\n    <ClassNames>\n      {({ css, cx }) => (\n        <div\n          className={cx(\n            colorPickerSavedColorsClasses.root,\n            css(styles.root),\n            classes?.root\n          )}\n        >\n          <HvButton\n            className={cx(\n              colorPickerSavedColorsClasses.addButton,\n              css(styles.addButton),\n              classes?.addButton\n            )}\n            variant=\"secondarySubtle\"\n            icon\n            onClick={onAddColor}\n          >\n            <Add />\n          </HvButton>\n          {colors.map((color, index) => {\n            return (\n              <div\n                key={`saved-color-${color}-${index}`}\n                className={cx(\n                  colorPickerSavedColorsClasses.swatchRoot,\n                  css(styles.swatchRoot),\n                  classes?.swatchRoot\n                )}\n              >\n                <div\n                  className={cx(\n                    colorPickerSavedColorsClasses.swatchWrap,\n                    css(styles.swatchWrap),\n                    classes?.swatchWrap\n                  )}\n                >\n                  <Swatch\n                    color={color}\n                    onClick={handleClick}\n                    focusStyle={{\n                      boxShadow: `inset 0 0 0 1px rgba(0,0,0,.15), 0 0 4px ${color}`,\n                    }}\n                  />\n                </div>\n                <div\n                  className={cx(\n                    colorPickerSavedColorsClasses.removeButtonRoot,\n                    css(styles.removeButtonRoot),\n                    classes?.removeButtonRoot\n                  )}\n                >\n                  <HvButton\n                    className={cx(\n                      colorPickerSavedColorsClasses.removeButton,\n                      css(styles.removeButton),\n                      classes?.removeButton\n                    )}\n                    variant=\"secondarySubtle\"\n                    onClick={() => onRemoveColor(color, index)}\n                    tabIndex={0}\n                    aria-label={deleteButtonArialLabel}\n                  >\n                    <CloseXS iconSize=\"XS\" />\n                  </HvButton>\n                </div>\n              </div>\n            );\n          })}\n        </div>\n      )}\n    </ClassNames>\n  );\n};\n"],"names":["SavedColors","colors","onClickColor","onAddColor","onRemoveColor","deleteButtonArialLabel","classes","handleClick","hex","source","ClassNames","children","css","cx","className","colorPickerSavedColorsClasses","root","styles","_jsx","HvButton","addButton","variant","icon","onClick","Add","map","color","index","swatchRoot","swatchWrap","Swatch","focusStyle","boxShadow","removeButtonRoot","removeButton","tabIndex","CloseXS","iconSize"],"mappings":";;;;;;;;;AAqBO,MAAMA,cAAcA,CAAC;AAAA,EAC1BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AACgB,MAAM;AAChBC,QAAAA,cAAcA,CAACC,QAAgB;AACtB,iBAAA;AAAA,MACXA;AAAAA,MACAC,QAAQ;AAAA,IAAA,CACT;AAAA,EAAA;AAGH,wCACGC,MAAAA,YAAU;AAAA,IAAAC,UACRA,CAAC;AAAA,MAAEC;AAAAA,MAAKC;AAAAA,IAAAA,sCACP,OAAA;AAAA,MACEC,WAAWD,GACTE,mBAA8BC,QAAAA,MAC9BJ,IAAIK,mBAAAA,OAAOD,IAAI,GACfV,mCAASU,IAAI;AAAA,MACbL,UAAA,CAEFO,2BAAAA,IAACC,iBAAQ;AAAA,QACPL,WAAWD,GACTE,mBAA8BK,QAAAA,WAC9BR,IAAIK,mBAAAA,OAAOG,SAAS,GACpBd,mCAASc,SAAS;AAAA,QAEpBC,SAAQ;AAAA,QACRC,MAAI;AAAA,QACJC,SAASpB;AAAAA,QAAWQ,UAEpBO,2BAAAA,IAACM,gBAAG,KAAA,EAAA;AAAA,MACK,CAAA,GACVvB,OAAOwB,IAAI,CAACC,OAAOC,UAAU;AAC5B,+CACE,OAAA;AAAA,UAEEb,WAAWD,GACTE,mBAA8Ba,QAAAA,YAC9BhB,IAAIK,mBAAAA,OAAOW,UAAU,GACrBtB,mCAASsB,UAAU;AAAA,UACnBjB,WAEFO,2BAAAA,IAAA,OAAA;AAAA,YACEJ,WAAWD,GACTE,mBAA8Bc,QAAAA,YAC9BjB,IAAIK,mBAAAA,OAAOY,UAAU,GACrBvB,mCAASuB,UAAU;AAAA,YACnBlB,yCAEDmB,eAAM;AAAA,cACLJ;AAAAA,cACAH,SAAShB;AAAAA,cACTwB,YAAY;AAAA,gBACVC,WAAY,4CAA2CN;AAAAA,cACzD;AAAA,YAAA,CAAE;AAAA,UAAA,CACF,GAEJR,2BAAAA,IAAA,OAAA;AAAA,YACEJ,WAAWD,GACTE,mBAA8BkB,QAAAA,kBAC9BrB,IAAIK,mBAAAA,OAAOgB,gBAAgB,GAC3B3B,mCAAS2B,gBAAgB;AAAA,YACzBtB,yCAEDQ,iBAAQ;AAAA,cACPL,WAAWD,GACTE,mBAA8BmB,QAAAA,cAC9BtB,IAAIK,mBAAAA,OAAOiB,YAAY,GACvB5B,mCAAS4B,YAAY;AAAA,cAEvBb,SAAQ;AAAA,cACRE,SAASA,MAAMnB,cAAcsB,OAAOC,KAAK;AAAA,cACzCQ,UAAU;AAAA,cACV,cAAY9B;AAAAA,cAAuBM,yCAElCyB,yBAAO;AAAA,gBAACC,UAAS;AAAA,cAAA,CAAI;AAAA,YAAA,CAAG;AAAA,UAAA,CAEvB,CAAA;AAAA,QAAA,GA1CA,eAAcX,SAASC,OAAO;AAAA,MAAA,CA6CzC,CAAC;AAAA,IAAA,CAAA;AAAA,EAAA,CAGK;AAEjB;;"}