@hitachivantara/uikit-react-lab 3.52.1 → 4.0.1-next.1

package/dist/ColorPicker/ColorPicker.d.ts

@@ -1,4 +1,4 @@
-import { StandardProps } from "@material-ui/core";
+import { StandardProps } from "@mui/material";
 import { HvFormElementProps } from "@hitachivantara/uikit-react-core";
 
 export type HvColorPickerClassKey = "root";

package/dist/ColorPicker/ColorPicker.js

@@ -39,18 +39,20 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _clsx = _interopRequireDefault(require("clsx"));
 
-var _core = require("@material-ui/core");
+var _styles = require("@mui/styles");
 
 var _uikitReactCore = require("@hitachivantara/uikit-react-core");
 
 var _uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 
-var _styles = _interopRequireDefault(require("./styles"));
+var _styles2 = _interopRequireDefault(require("./styles"));
 
 var _Picker = _interopRequireDefault(require("./Picker"));
 
 var _PresetColors = _interopRequireDefault(require("./PresetColors"));
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -60,7 +62,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
  * It receives a color string in HEX format and outputs an HEX formatted color.
  */
 var HvColorPicker = function HvColorPicker(props) {
-  var theme = (0, _core.useTheme)();
+  var theme = (0, _styles.useTheme)();
   var id = props.id,
       name = props.name,
       _props$required = props.required,
@@ -116,46 +118,55 @@ var HvColorPicker = function HvColorPicker(props) {
     }
   };
 
-  return /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvFormElement, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_uikitReactCore.HvFormElement, {
     id: id,
     name: name,
     disabled: disabled,
     required: required,
-    className: (0, _clsx.default)(className, classes.root)
-  }, (hasLabel || hasDescription) && /*#__PURE__*/_react.default.createElement("div", {
-    className: classes.labelContainer
-  }, hasLabel && /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvLabel, {
-    id: (0, _uikitReactCore.setId)(elementId, "label"),
-    label: label,
-    className: classes.label
-  }), hasDescription && /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvInfoMessage, {
-    id: (0, _uikitReactCore.setId)(elementId, "description"),
-    className: classes.description
-  }, description)), /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvBaseDropdown, {
-    className: className,
-    expanded: isOpen,
-    onToggle: handleToggle,
-    onContainerCreation: setFocusToContent,
-    placeholder: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_uikitReactIcons.Checkbox, {
-      className: classes.headerColorIcon,
-      color: [color]
-    }), /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvTypography, {
-      className: classes.headerColorValue
-    }, color)),
-    "aria-label": ariaLabel,
-    "aria-labelledby": [label && (0, _uikitReactCore.setId)(elementId, "label"), ariaLabelledBy].join(" ").trim() || undefined,
-    "aria-describedby": [description && (0, _uikitReactCore.setId)(elementId, "description"), ariaDescribedBy].join(" ").trim() || undefined
-  }, /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvPanel, {
-    className: classes.panel
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: classes.colorPicker
-  }, /*#__PURE__*/_react.default.createElement(_Picker.default, {
-    color: color,
-    onChange: handleSelect
-  }), /*#__PURE__*/_react.default.createElement(_PresetColors.default, {
-    colors: colorArray,
-    onClick: handleSelect
-  })))));
+    className: (0, _clsx.default)(className, classes.root),
+    children: [(hasLabel || hasDescription) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: classes.labelContainer,
+      children: [hasLabel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_uikitReactCore.HvLabel, {
+        id: (0, _uikitReactCore.setId)(elementId, "label"),
+        label: label,
+        className: classes.label
+      }), hasDescription && /*#__PURE__*/(0, _jsxRuntime.jsx)(_uikitReactCore.HvInfoMessage, {
+        id: (0, _uikitReactCore.setId)(elementId, "description"),
+        className: classes.description,
+        children: description
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_uikitReactCore.HvBaseDropdown, {
+      className: className,
+      expanded: isOpen,
+      onToggle: handleToggle,
+      onContainerCreation: setFocusToContent,
+      placeholder: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_uikitReactIcons.Checkbox, {
+          className: classes.headerColorIcon,
+          color: [color]
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_uikitReactCore.HvTypography, {
+          className: classes.headerColorValue,
+          children: color
+        })]
+      }),
+      "aria-label": ariaLabel,
+      "aria-labelledby": [label && (0, _uikitReactCore.setId)(elementId, "label"), ariaLabelledBy].join(" ").trim() || undefined,
+      "aria-describedby": [description && (0, _uikitReactCore.setId)(elementId, "description"), ariaDescribedBy].join(" ").trim() || undefined,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_uikitReactCore.HvPanel, {
+        className: classes.panel,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: classes.colorPicker,
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Picker.default, {
+            color: color,
+            onChange: handleSelect
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_PresetColors.default, {
+            colors: colorArray,
+            onClick: handleSelect
+          })]
+        })
+      })
+    })]
+  });
 };
 
 process.env.NODE_ENV !== "production" ? HvColorPicker.propTypes = {
@@ -252,7 +263,7 @@ process.env.NODE_ENV !== "production" ? HvColorPicker.propTypes = {
   defaultValue: _propTypes.default.string
 } : void 0;
 
-var _default = (0, _core.withStyles)(_styles.default, {
+var _default = (0, _styles.withStyles)(_styles2.default, {
   name: "HvColorPicker"
 })(HvColorPicker);
 

package/dist/ColorPicker/ColorPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPicker.js","names":["HvColorPicker","props","theme","useTheme","id","name","required","disabled","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","className","classes","value","onChange","defaultValue","hv","palette","accent","acce1","expanded","defaultExpanded","useControlled","Boolean","isOpen","setIsOpen","color","setColor","handleToggle","_evt","s","handleSelect","val","hex","elementId","useUniqueId","hasLabel","hasDescription","colorArray","useMemo","semantic","sema4","sema3","sema1","sema19","acce2h","sema6","atmosphere","atmo5","setFocusToContent","containerRef","inputs","getElementsByTagName","length","focus","clsx","root","labelContainer","setId","headerColorIcon","headerColorValue","join","trim","undefined","panel","colorPicker","propTypes","PropTypes","string","node","bool","shape","isRequired","func","withStyles","styles"],"sources":["../../src/ColorPicker/ColorPicker.js"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\n\nimport { withStyles, useTheme } from \"@material-ui/core\";\nimport {\n  HvPanel,\n  HvLabel,\n  HvInfoMessage,\n  HvFormElement,\n  HvBaseDropdown,\n  useControlled,\n  HvTypography,\n  useUniqueId,\n  setId,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Checkbox } from \"@hitachivantara/uikit-react-icons\";\n\nimport styles from \"./styles\";\nimport Picker from \"./Picker\";\nimport PresetColors from \"./PresetColors\";\n\n/**\n * A color picker component which allows the user to select a color from a list of pre-defined colors or freely select one color via the Hue and Saturation.\n * It receives a color string in HEX format and outputs an HEX formatted color.\n */\nconst HvColorPicker = (props) => {\n  const theme = useTheme();\n  const {\n    id,\n    name,\n\n    required = false,\n    disabled = false,\n\n    label,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    description,\n    \"aria-describedby\": ariaDescribedBy,\n    className,\n    classes,\n    value,\n    onChange,\n    defaultValue = theme.hv.palette.accent.acce1,\n\n    expanded,\n    defaultExpanded = false,\n  } = props;\n\n  const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n  const [color, setColor] = useControlled(value, defaultValue);\n\n  const handleToggle = (_evt, s) => {\n    setIsOpen(s);\n  };\n\n  const handleSelect = (val) => {\n    onChange?.(val.hex);\n    setColor(val.hex);\n  };\n\n  const elementId = useUniqueId(id, \"hvdropdown\");\n\n  const hasLabel = label != null;\n  const hasDescription = description != null;\n\n  const colorArray = useMemo(\n    () => [\n      theme.hv.palette.semantic.sema4,\n      theme.hv.palette.semantic.sema3,\n      \"#F6941E\",\n      \"#8DC63D\",\n      theme.hv.palette.semantic.sema1,\n      theme.hv.palette.semantic.sema19,\n      \"#05A99C\",\n      \"#01ADEF\",\n      theme.hv.palette.accent.acce2h,\n      \"#0155A5\",\n      \"#2E3192\",\n      \"#652C90\",\n      theme.hv.palette.semantic.sema6,\n      \"#EC018B\",\n      theme.hv.palette.atmosphere.atmo5,\n      theme.hv.palette.accent.acce1,\n    ],\n    [theme]\n  );\n\n  const setFocusToContent = (containerRef) => {\n    const inputs = containerRef?.getElementsByTagName(\"input\");\n    if (inputs?.length > 0) {\n      inputs[0].focus();\n    }\n  };\n\n  return (\n    <HvFormElement\n      id={id}\n      name={name}\n      disabled={disabled}\n      required={required}\n      className={clsx(className, classes.root)}\n    >\n      {(hasLabel || hasDescription) && (\n        <div className={classes.labelContainer}>\n          {hasLabel && (\n            <HvLabel id={setId(elementId, \"label\")} label={label} className={classes.label} />\n          )}\n\n          {hasDescription && (\n            <HvInfoMessage id={setId(elementId, \"description\")} className={classes.description}>\n              {description}\n            </HvInfoMessage>\n          )}\n        </div>\n      )}\n      <HvBaseDropdown\n        className={className}\n        expanded={isOpen}\n        onToggle={handleToggle}\n        onContainerCreation={setFocusToContent}\n        placeholder={\n          <>\n            <Checkbox className={classes.headerColorIcon} color={[color]} />\n            <HvTypography className={classes.headerColorValue}>{color}</HvTypography>\n          </>\n        }\n        aria-label={ariaLabel}\n        aria-labelledby={\n          [label && setId(elementId, \"label\"), ariaLabelledBy].join(\" \").trim() || undefined\n        }\n        aria-describedby={\n          [description && setId(elementId, \"description\"), ariaDescribedBy].join(\" \").trim() ||\n          undefined\n        }\n      >\n        <HvPanel className={classes.panel}>\n          <div className={classes.colorPicker}>\n            <Picker color={color} onChange={handleSelect} />\n            <PresetColors colors={colorArray} onClick={handleSelect} />\n          </div>\n        </HvPanel>\n      </HvBaseDropdown>\n    </HvFormElement>\n  );\n};\n\nHvColorPicker.propTypes = {\n  /**\n   * Id to be applied to the form element root node.\n   */\n  id: PropTypes.string,\n\n  /**\n   * The form element name.\n   */\n  name: PropTypes.string,\n\n  /**\n   * The label of the form element.\n   *\n   * The form element must be labeled for accessibility reasons.\n   * If not provided, an aria-label or aria-labelledby must be provided instead.\n   */\n  label: PropTypes.node,\n  /**\n   * @ignore\n   */\n  \"aria-label\": PropTypes.string,\n  /**\n   * @ignore\n   */\n  \"aria-labelledby\": PropTypes.string,\n  /**\n   * Provide additional descriptive text for the form element.\n   */\n  description: PropTypes.node,\n  /**\n   * @ignore\n   */\n  \"aria-describedby\": PropTypes.string,\n\n  /**\n   * Indicates that the form element is disabled.\n   */\n  disabled: PropTypes.bool,\n  /**\n   * Indicates that user input is required on the form element.\n   */\n  required: PropTypes.bool,\n\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    root: PropTypes.string,\n    labelContainer: PropTypes.string,\n    label: PropTypes.string,\n    description: PropTypes.string,\n    headerColorIcon: PropTypes.string,\n    headerColorValue: PropTypes.string,\n    panel: PropTypes.string,\n    colorPicker: PropTypes.string,\n  }).isRequired,\n\n  /**\n   * If `true` the color picker starts opened if `false` it starts closed.\n   */\n  expanded: PropTypes.bool,\n  /**\n   * When uncontrolled, defines the initial expanded state.\n   */\n  defaultExpanded: PropTypes.bool,\n\n  /**\n   * The callback fired when the value changes.\n   */\n  onChange: PropTypes.func,\n\n  /**\n   * The value color, in HEX format.\n   */\n  value: PropTypes.string,\n\n  /**\n   * When uncontrolled, defines the initial value state.\n   */\n  defaultValue: PropTypes.string,\n};\n\nexport default withStyles(styles, { name: \"HvColorPicker\" })(HvColorPicker);\n"],"mappings":"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"}
+{"version":3,"file":"ColorPicker.js","names":["HvColorPicker","props","theme","useTheme","id","name","required","disabled","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","className","classes","value","onChange","defaultValue","hv","palette","accent","acce1","expanded","defaultExpanded","useControlled","Boolean","isOpen","setIsOpen","color","setColor","handleToggle","_evt","s","handleSelect","val","hex","elementId","useUniqueId","hasLabel","hasDescription","colorArray","useMemo","semantic","sema4","sema3","sema1","sema19","acce2h","sema6","atmosphere","atmo5","setFocusToContent","containerRef","inputs","getElementsByTagName","length","focus","clsx","root","labelContainer","setId","headerColorIcon","headerColorValue","join","trim","undefined","panel","colorPicker","propTypes","PropTypes","string","node","bool","shape","isRequired","func","withStyles","styles"],"sources":["../../src/ColorPicker/ColorPicker.js"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { withStyles, useTheme } from \"@mui/styles\";\n\nimport {\n  HvPanel,\n  HvLabel,\n  HvInfoMessage,\n  HvFormElement,\n  HvBaseDropdown,\n  useControlled,\n  HvTypography,\n  useUniqueId,\n  setId,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Checkbox } from \"@hitachivantara/uikit-react-icons\";\n\nimport styles from \"./styles\";\nimport Picker from \"./Picker\";\nimport PresetColors from \"./PresetColors\";\n\n/**\n * A color picker component which allows the user to select a color from a list of pre-defined colors or freely select one color via the Hue and Saturation.\n * It receives a color string in HEX format and outputs an HEX formatted color.\n */\nconst HvColorPicker = (props) => {\n  const theme = useTheme();\n  const {\n    id,\n    name,\n\n    required = false,\n    disabled = false,\n\n    label,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    description,\n    \"aria-describedby\": ariaDescribedBy,\n    className,\n    classes,\n    value,\n    onChange,\n    defaultValue = theme.hv.palette.accent.acce1,\n\n    expanded,\n    defaultExpanded = false,\n  } = props;\n\n  const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n  const [color, setColor] = useControlled(value, defaultValue);\n\n  const handleToggle = (_evt, s) => {\n    setIsOpen(s);\n  };\n\n  const handleSelect = (val) => {\n    onChange?.(val.hex);\n    setColor(val.hex);\n  };\n\n  const elementId = useUniqueId(id, \"hvdropdown\");\n\n  const hasLabel = label != null;\n  const hasDescription = description != null;\n\n  const colorArray = useMemo(\n    () => [\n      theme.hv.palette.semantic.sema4,\n      theme.hv.palette.semantic.sema3,\n      \"#F6941E\",\n      \"#8DC63D\",\n      theme.hv.palette.semantic.sema1,\n      theme.hv.palette.semantic.sema19,\n      \"#05A99C\",\n      \"#01ADEF\",\n      theme.hv.palette.accent.acce2h,\n      \"#0155A5\",\n      \"#2E3192\",\n      \"#652C90\",\n      theme.hv.palette.semantic.sema6,\n      \"#EC018B\",\n      theme.hv.palette.atmosphere.atmo5,\n      theme.hv.palette.accent.acce1,\n    ],\n    [theme]\n  );\n\n  const setFocusToContent = (containerRef) => {\n    const inputs = containerRef?.getElementsByTagName(\"input\");\n    if (inputs?.length > 0) {\n      inputs[0].focus();\n    }\n  };\n\n  return (\n    <HvFormElement\n      id={id}\n      name={name}\n      disabled={disabled}\n      required={required}\n      className={clsx(className, classes.root)}\n    >\n      {(hasLabel || hasDescription) && (\n        <div className={classes.labelContainer}>\n          {hasLabel && (\n            <HvLabel id={setId(elementId, \"label\")} label={label} className={classes.label} />\n          )}\n\n          {hasDescription && (\n            <HvInfoMessage id={setId(elementId, \"description\")} className={classes.description}>\n              {description}\n            </HvInfoMessage>\n          )}\n        </div>\n      )}\n      <HvBaseDropdown\n        className={className}\n        expanded={isOpen}\n        onToggle={handleToggle}\n        onContainerCreation={setFocusToContent}\n        placeholder={\n          <>\n            <Checkbox className={classes.headerColorIcon} color={[color]} />\n            <HvTypography className={classes.headerColorValue}>{color}</HvTypography>\n          </>\n        }\n        aria-label={ariaLabel}\n        aria-labelledby={\n          [label && setId(elementId, \"label\"), ariaLabelledBy].join(\" \").trim() || undefined\n        }\n        aria-describedby={\n          [description && setId(elementId, \"description\"), ariaDescribedBy].join(\" \").trim() ||\n          undefined\n        }\n      >\n        <HvPanel className={classes.panel}>\n          <div className={classes.colorPicker}>\n            <Picker color={color} onChange={handleSelect} />\n            <PresetColors colors={colorArray} onClick={handleSelect} />\n          </div>\n        </HvPanel>\n      </HvBaseDropdown>\n    </HvFormElement>\n  );\n};\n\nHvColorPicker.propTypes = {\n  /**\n   * Id to be applied to the form element root node.\n   */\n  id: PropTypes.string,\n\n  /**\n   * The form element name.\n   */\n  name: PropTypes.string,\n\n  /**\n   * The label of the form element.\n   *\n   * The form element must be labeled for accessibility reasons.\n   * If not provided, an aria-label or aria-labelledby must be provided instead.\n   */\n  label: PropTypes.node,\n  /**\n   * @ignore\n   */\n  \"aria-label\": PropTypes.string,\n  /**\n   * @ignore\n   */\n  \"aria-labelledby\": PropTypes.string,\n  /**\n   * Provide additional descriptive text for the form element.\n   */\n  description: PropTypes.node,\n  /**\n   * @ignore\n   */\n  \"aria-describedby\": PropTypes.string,\n\n  /**\n   * Indicates that the form element is disabled.\n   */\n  disabled: PropTypes.bool,\n  /**\n   * Indicates that user input is required on the form element.\n   */\n  required: PropTypes.bool,\n\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    root: PropTypes.string,\n    labelContainer: PropTypes.string,\n    label: PropTypes.string,\n    description: PropTypes.string,\n    headerColorIcon: PropTypes.string,\n    headerColorValue: PropTypes.string,\n    panel: PropTypes.string,\n    colorPicker: PropTypes.string,\n  }).isRequired,\n\n  /**\n   * If `true` the color picker starts opened if `false` it starts closed.\n   */\n  expanded: PropTypes.bool,\n  /**\n   * When uncontrolled, defines the initial expanded state.\n   */\n  defaultExpanded: PropTypes.bool,\n\n  /**\n   * The callback fired when the value changes.\n   */\n  onChange: PropTypes.func,\n\n  /**\n   * The value color, in HEX format.\n   */\n  value: PropTypes.string,\n\n  /**\n   * When uncontrolled, defines the initial value state.\n   */\n  defaultValue: PropTypes.string,\n};\n\nexport default withStyles(styles, { name: \"HvColorPicker\" })(HvColorPicker);\n"],"mappings":"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"}

package/dist/ColorPicker/Fields/Fields.js

@@ -39,6 +39,8 @@ var _uikitReactCore = require("@hitachivantara/uikit-react-core");
 
 var _styles = _interopRequireDefault(require("./styles"));
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -128,55 +130,56 @@ var Fields = function Fields(_ref) {
     }, _evt);
   };
 
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _clsx.default)(classes.fields)
-  }, /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvInput, {
-    inputRef: hexInputRef,
-    className: (0, _clsx.default)(classes.double),
-    label: "HEX",
-    value: internalHex.replace("#", ""),
-    onChange: onChangeHex,
-    onBlur: function onBlur() {
-      return setInternalHex(hex);
-    },
-    disableClear: true
-  }), /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvInput, {
-    inputRef: redInputRef,
-    className: (0, _clsx.default)(classes.single),
-    label: "R",
-    value: "".concat(internalRed),
-    onChange: function onChange(_evt, value) {
-      return onChangeRbg(_evt, value, "r");
-    },
-    onBlur: function onBlur() {
-      return setInternalRed(rgb.r);
-    },
-    disableClear: true
-  }), /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvInput, {
-    inputRef: greenInputRef,
-    className: (0, _clsx.default)(classes.single),
-    label: "G",
-    value: "".concat(internalGreen),
-    onChange: function onChange(_evt, value) {
-      return onChangeRbg(_evt, value, "g");
-    },
-    onBlur: function onBlur() {
-      return setInternalGreen(rgb.g);
-    },
-    disableClear: true
-  }), /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvInput, {
-    inputRef: blueInputRef,
-    className: (0, _clsx.default)(classes.single),
-    label: "B",
-    value: "".concat(internalBlue),
-    onChange: function onChange(_evt, value) {
-      return onChangeRbg(_evt, value, "b");
-    },
-    onBlur: function onBlur() {
-      return setInternalBlue(rgb.b);
-    },
-    disableClear: true
-  }));
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: (0, _clsx.default)(classes.fields),
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_uikitReactCore.HvInput, {
+      inputRef: hexInputRef,
+      className: (0, _clsx.default)(classes.double),
+      label: "HEX",
+      value: internalHex.replace("#", ""),
+      onChange: onChangeHex,
+      onBlur: function onBlur() {
+        return setInternalHex(hex);
+      },
+      disableClear: true
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_uikitReactCore.HvInput, {
+      inputRef: redInputRef,
+      className: (0, _clsx.default)(classes.single),
+      label: "R",
+      value: "".concat(internalRed),
+      onChange: function onChange(_evt, value) {
+        return onChangeRbg(_evt, value, "r");
+      },
+      onBlur: function onBlur() {
+        return setInternalRed(rgb.r);
+      },
+      disableClear: true
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_uikitReactCore.HvInput, {
+      inputRef: greenInputRef,
+      className: (0, _clsx.default)(classes.single),
+      label: "G",
+      value: "".concat(internalGreen),
+      onChange: function onChange(_evt, value) {
+        return onChangeRbg(_evt, value, "g");
+      },
+      onBlur: function onBlur() {
+        return setInternalGreen(rgb.g);
+      },
+      disableClear: true
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_uikitReactCore.HvInput, {
+      inputRef: blueInputRef,
+      className: (0, _clsx.default)(classes.single),
+      label: "B",
+      value: "".concat(internalBlue),
+      onChange: function onChange(_evt, value) {
+        return onChangeRbg(_evt, value, "b");
+      },
+      onBlur: function onBlur() {
+        return setInternalBlue(rgb.b);
+      },
+      disableClear: true
+    })]
+  });
 };
 
 exports.Fields = Fields;

package/dist/ColorPicker/Fields/Fields.js.map

@@ -1 +1 @@
-{"version":3,"file":"Fields.js","names":["Fields","onChange","rgb","hex","classes","useStyles","useState","internalHex","setInternalHex","r","internalRed","setInternalRed","g","internalGreen","setInternalGreen","b","internalBlue","setInternalBlue","hexInputRef","useRef","redInputRef","greenInputRef","blueInputRef","useEffect","document","activeElement","current","handleChange","data","e","color","isValidHex","source","onChangeHex","_evt","value","onChangeRbg","colorPart","clsx","fields","double","replace","single","propTypes","PropTypes","shape","number","isRequired"],"sources":["../../../src/ColorPicker/Fields/Fields.js"],"sourcesContent":["/* eslint-disable no-param-reassign */\n\nimport React, { useEffect, useRef, useState } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport * as color from \"react-color/lib/helpers/color\";\n\nimport { HvInput } from \"@hitachivantara/uikit-react-core\";\n\nimport useStyles from \"./styles\";\n\n// eslint-disable-next-line react/prop-types\nexport const Fields = ({ onChange, rgb, hex }) => {\n  const classes = useStyles();\n  const [internalHex, setInternalHex] = useState(hex);\n  const [internalRed, setInternalRed] = useState(rgb.r);\n  const [internalGreen, setInternalGreen] = useState(rgb.g);\n  const [internalBlue, setInternalBlue] = useState(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 = (data, e) => {\n    if (data.hex && color.isValidHex(data.hex)) {\n      onChange(\n        {\n          hex: data.hex,\n          source: \"hex\",\n        },\n        e\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        e\n      );\n    }\n  };\n\n  const onChangeHex = (_evt, value) => {\n    setInternalHex(value);\n    handleChange({ hex: value }, _evt);\n  };\n\n  const onChangeRbg = (_evt, value, colorPart) => {\n    if (colorPart === \"r\") setInternalRed(value);\n    if (colorPart === \"g\") setInternalGreen(value);\n    if (colorPart === \"b\") setInternalBlue(value);\n    handleChange(\n      {\n        r: colorPart === \"r\" ? value : rgb.r,\n        g: colorPart === \"g\" ? value : rgb.g,\n        b: colorPart === \"b\" ? value : rgb.b,\n      },\n      _evt\n    );\n  };\n\n  return (\n    <div className={clsx(classes.fields)}>\n      <HvInput\n        inputRef={hexInputRef}\n        className={clsx(classes.double)}\n        label=\"HEX\"\n        value={internalHex.replace(\"#\", \"\")}\n        onChange={onChangeHex}\n        onBlur={() => setInternalHex(hex)}\n        disableClear\n      />\n      <HvInput\n        inputRef={redInputRef}\n        className={clsx(classes.single)}\n        label=\"R\"\n        value={`${internalRed}`}\n        onChange={(_evt, value) => onChangeRbg(_evt, value, \"r\")}\n        onBlur={() => setInternalRed(rgb.r)}\n        disableClear\n      />\n      <HvInput\n        inputRef={greenInputRef}\n        className={clsx(classes.single)}\n        label=\"G\"\n        value={`${internalGreen}`}\n        onChange={(_evt, value) => onChangeRbg(_evt, value, \"g\")}\n        onBlur={() => setInternalGreen(rgb.g)}\n        disableClear\n      />\n      <HvInput\n        inputRef={blueInputRef}\n        className={clsx(classes.single)}\n        label=\"B\"\n        value={`${internalBlue}`}\n        onChange={(_evt, value) => onChangeRbg(_evt, value, \"b\")}\n        onBlur={() => setInternalBlue(rgb.b)}\n        disableClear\n      />\n    </div>\n  );\n};\n\nFields.propTypes = {\n  rgb: PropTypes.shape({\n    r: PropTypes.number,\n    g: PropTypes.number,\n    b: PropTypes.number,\n  }).isRequired,\n};\n\nexport default Fields;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;;AACA;;AACA;;AACA;;AAEA;;AAEA;;;;;;AATA;AAWA;AACO,IAAMA,MAAM,GAAG,SAATA,MAAS,OAA4B;EAAA,IAAzBC,QAAyB,QAAzBA,QAAyB;EAAA,IAAfC,GAAe,QAAfA,GAAe;EAAA,IAAVC,GAAU,QAAVA,GAAU;EAChD,IAAMC,OAAO,GAAG,IAAAC,eAAA,GAAhB;;EACA,gBAAsC,IAAAC,eAAA,EAASH,GAAT,CAAtC;EAAA;EAAA,IAAOI,WAAP;EAAA,IAAoBC,cAApB;;EACA,iBAAsC,IAAAF,eAAA,EAASJ,GAAG,CAACO,CAAb,CAAtC;EAAA;EAAA,IAAOC,WAAP;EAAA,IAAoBC,cAApB;;EACA,iBAA0C,IAAAL,eAAA,EAASJ,GAAG,CAACU,CAAb,CAA1C;EAAA;EAAA,IAAOC,aAAP;EAAA,IAAsBC,gBAAtB;;EACA,iBAAwC,IAAAR,eAAA,EAASJ,GAAG,CAACa,CAAb,CAAxC;EAAA;EAAA,IAAOC,YAAP;EAAA,IAAqBC,eAArB;;EAEA,IAAMC,WAAW,GAAG,IAAAC,aAAA,GAApB;EACA,IAAMC,WAAW,GAAG,IAAAD,aAAA,GAApB;EACA,IAAME,aAAa,GAAG,IAAAF,aAAA,GAAtB;EACA,IAAMG,YAAY,GAAG,IAAAH,aAAA,GAArB;EAEA,IAAAI,gBAAA,EAAU,YAAM;IACd,IAAIC,QAAQ,CAACC,aAAT,KAA2BP,WAAW,CAACQ,OAA3C,EAAoD;MAClDlB,cAAc,CAACL,GAAD,CAAd;IACD;EACF,CAJD,EAIG,CAACA,GAAD,CAJH;EAMA,IAAAoB,gBAAA,EAAU,YAAM;IACd,IAAIC,QAAQ,CAACC,aAAT,KAA2BL,WAAW,CAACM,OAA3C,EAAoD;MAClDf,cAAc,CAACT,GAAG,CAACO,CAAL,CAAd;IACD;;IAED,IAAIe,QAAQ,CAACC,aAAT,KAA2BJ,aAAa,CAACK,OAA7C,EAAsD;MACpDZ,gBAAgB,CAACZ,GAAG,CAACU,CAAL,CAAhB;IACD;;IAED,IAAIY,QAAQ,CAACC,aAAT,KAA2BH,YAAY,CAACI,OAA5C,EAAqD;MACnDT,eAAe,CAACf,GAAG,CAACa,CAAL,CAAf;IACD;EACF,CAZD,EAYG,CAACb,GAAD,CAZH;;EAcA,IAAMyB,YAAY,GAAG,SAAfA,YAAe,CAACC,IAAD,EAAOC,CAAP,EAAa;IAChC,IAAID,IAAI,CAACzB,GAAL,IAAY2B,KAAK,CAACC,UAAN,CAAiBH,IAAI,CAACzB,GAAtB,CAAhB,EAA4C;MAC1CF,QAAQ,CACN;QACEE,GAAG,EAAEyB,IAAI,CAACzB,GADZ;QAEE6B,MAAM,EAAE;MAFV,CADM,EAKNH,CALM,CAAR;IAOD,CARD,MAQO,IAAID,IAAI,CAACnB,CAAL,IAAUmB,IAAI,CAAChB,CAAf,IAAoBgB,IAAI,CAACb,CAA7B,EAAgC;MACrCd,QAAQ,CACN;QACEQ,CAAC,EAAEmB,IAAI,CAACnB,CAAL,IAAUP,GAAG,CAACO,CADnB;QAEEG,CAAC,EAAEgB,IAAI,CAAChB,CAAL,IAAUV,GAAG,CAACU,CAFnB;QAGEG,CAAC,EAAEa,IAAI,CAACb,CAAL,IAAUb,GAAG,CAACa,CAHnB;QAIEiB,MAAM,EAAE;MAJV,CADM,EAONH,CAPM,CAAR;IASD;EACF,CApBD;;EAsBA,IAAMI,WAAW,GAAG,SAAdA,WAAc,CAACC,IAAD,EAAOC,KAAP,EAAiB;IACnC3B,cAAc,CAAC2B,KAAD,CAAd;IACAR,YAAY,CAAC;MAAExB,GAAG,EAAEgC;IAAP,CAAD,EAAiBD,IAAjB,CAAZ;EACD,CAHD;;EAKA,IAAME,WAAW,GAAG,SAAdA,WAAc,CAACF,IAAD,EAAOC,KAAP,EAAcE,SAAd,EAA4B;IAC9C,IAAIA,SAAS,KAAK,GAAlB,EAAuB1B,cAAc,CAACwB,KAAD,CAAd;IACvB,IAAIE,SAAS,KAAK,GAAlB,EAAuBvB,gBAAgB,CAACqB,KAAD,CAAhB;IACvB,IAAIE,SAAS,KAAK,GAAlB,EAAuBpB,eAAe,CAACkB,KAAD,CAAf;IACvBR,YAAY,CACV;MACElB,CAAC,EAAE4B,SAAS,KAAK,GAAd,GAAoBF,KAApB,GAA4BjC,GAAG,CAACO,CADrC;MAEEG,CAAC,EAAEyB,SAAS,KAAK,GAAd,GAAoBF,KAApB,GAA4BjC,GAAG,CAACU,CAFrC;MAGEG,CAAC,EAAEsB,SAAS,KAAK,GAAd,GAAoBF,KAApB,GAA4BjC,GAAG,CAACa;IAHrC,CADU,EAMVmB,IANU,CAAZ;EAQD,CAZD;;EAcA,oBACE;IAAK,SAAS,EAAE,IAAAI,aAAA,EAAKlC,OAAO,CAACmC,MAAb;EAAhB,gBACE,6BAAC,uBAAD;IACE,QAAQ,EAAErB,WADZ;IAEE,SAAS,EAAE,IAAAoB,aAAA,EAAKlC,OAAO,CAACoC,MAAb,CAFb;IAGE,KAAK,EAAC,KAHR;IAIE,KAAK,EAAEjC,WAAW,CAACkC,OAAZ,CAAoB,GAApB,EAAyB,EAAzB,CAJT;IAKE,QAAQ,EAAER,WALZ;IAME,MAAM,EAAE;MAAA,OAAMzB,cAAc,CAACL,GAAD,CAApB;IAAA,CANV;IAOE,YAAY;EAPd,EADF,eAUE,6BAAC,uBAAD;IACE,QAAQ,EAAEiB,WADZ;IAEE,SAAS,EAAE,IAAAkB,aAAA,EAAKlC,OAAO,CAACsC,MAAb,CAFb;IAGE,KAAK,EAAC,GAHR;IAIE,KAAK,YAAKhC,WAAL,CAJP;IAKE,QAAQ,EAAE,kBAACwB,IAAD,EAAOC,KAAP;MAAA,OAAiBC,WAAW,CAACF,IAAD,EAAOC,KAAP,EAAc,GAAd,CAA5B;IAAA,CALZ;IAME,MAAM,EAAE;MAAA,OAAMxB,cAAc,CAACT,GAAG,CAACO,CAAL,CAApB;IAAA,CANV;IAOE,YAAY;EAPd,EAVF,eAmBE,6BAAC,uBAAD;IACE,QAAQ,EAAEY,aADZ;IAEE,SAAS,EAAE,IAAAiB,aAAA,EAAKlC,OAAO,CAACsC,MAAb,CAFb;IAGE,KAAK,EAAC,GAHR;IAIE,KAAK,YAAK7B,aAAL,CAJP;IAKE,QAAQ,EAAE,kBAACqB,IAAD,EAAOC,KAAP;MAAA,OAAiBC,WAAW,CAACF,IAAD,EAAOC,KAAP,EAAc,GAAd,CAA5B;IAAA,CALZ;IAME,MAAM,EAAE;MAAA,OAAMrB,gBAAgB,CAACZ,GAAG,CAACU,CAAL,CAAtB;IAAA,CANV;IAOE,YAAY;EAPd,EAnBF,eA4BE,6BAAC,uBAAD;IACE,QAAQ,EAAEU,YADZ;IAEE,SAAS,EAAE,IAAAgB,aAAA,EAAKlC,OAAO,CAACsC,MAAb,CAFb;IAGE,KAAK,EAAC,GAHR;IAIE,KAAK,YAAK1B,YAAL,CAJP;IAKE,QAAQ,EAAE,kBAACkB,IAAD,EAAOC,KAAP;MAAA,OAAiBC,WAAW,CAACF,IAAD,EAAOC,KAAP,EAAc,GAAd,CAA5B;IAAA,CALZ;IAME,MAAM,EAAE;MAAA,OAAMlB,eAAe,CAACf,GAAG,CAACa,CAAL,CAArB;IAAA,CANV;IAOE,YAAY;EAPd,EA5BF,CADF;AAwCD,CAjHM;;;AAmHP,wCAAAf,MAAM,CAAC2C,SAAP,GAAmB;EACjBzC,GAAG,EAAE0C,kBAAA,CAAUC,KAAV,CAAgB;IACnBpC,CAAC,EAAEmC,kBAAA,CAAUE,MADM;IAEnBlC,CAAC,EAAEgC,kBAAA,CAAUE,MAFM;IAGnB/B,CAAC,EAAE6B,kBAAA,CAAUE;EAHM,CAAhB,EAIFC;AALc,CAAnB;eAQe/C,M"}
+{"version":3,"file":"Fields.js","names":["Fields","onChange","rgb","hex","classes","useStyles","useState","internalHex","setInternalHex","r","internalRed","setInternalRed","g","internalGreen","setInternalGreen","b","internalBlue","setInternalBlue","hexInputRef","useRef","redInputRef","greenInputRef","blueInputRef","useEffect","document","activeElement","current","handleChange","data","e","color","isValidHex","source","onChangeHex","_evt","value","onChangeRbg","colorPart","clsx","fields","double","replace","single","propTypes","PropTypes","shape","number","isRequired"],"sources":["../../../src/ColorPicker/Fields/Fields.js"],"sourcesContent":["/* eslint-disable no-param-reassign */\n\nimport React, { useEffect, useRef, useState } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport * as color from \"react-color/lib/helpers/color\";\n\nimport { HvInput } from \"@hitachivantara/uikit-react-core\";\n\nimport useStyles from \"./styles\";\n\n// eslint-disable-next-line react/prop-types\nexport const Fields = ({ onChange, rgb, hex }) => {\n  const classes = useStyles();\n  const [internalHex, setInternalHex] = useState(hex);\n  const [internalRed, setInternalRed] = useState(rgb.r);\n  const [internalGreen, setInternalGreen] = useState(rgb.g);\n  const [internalBlue, setInternalBlue] = useState(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 = (data, e) => {\n    if (data.hex && color.isValidHex(data.hex)) {\n      onChange(\n        {\n          hex: data.hex,\n          source: \"hex\",\n        },\n        e\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        e\n      );\n    }\n  };\n\n  const onChangeHex = (_evt, value) => {\n    setInternalHex(value);\n    handleChange({ hex: value }, _evt);\n  };\n\n  const onChangeRbg = (_evt, value, colorPart) => {\n    if (colorPart === \"r\") setInternalRed(value);\n    if (colorPart === \"g\") setInternalGreen(value);\n    if (colorPart === \"b\") setInternalBlue(value);\n    handleChange(\n      {\n        r: colorPart === \"r\" ? value : rgb.r,\n        g: colorPart === \"g\" ? value : rgb.g,\n        b: colorPart === \"b\" ? value : rgb.b,\n      },\n      _evt\n    );\n  };\n\n  return (\n    <div className={clsx(classes.fields)}>\n      <HvInput\n        inputRef={hexInputRef}\n        className={clsx(classes.double)}\n        label=\"HEX\"\n        value={internalHex.replace(\"#\", \"\")}\n        onChange={onChangeHex}\n        onBlur={() => setInternalHex(hex)}\n        disableClear\n      />\n      <HvInput\n        inputRef={redInputRef}\n        className={clsx(classes.single)}\n        label=\"R\"\n        value={`${internalRed}`}\n        onChange={(_evt, value) => onChangeRbg(_evt, value, \"r\")}\n        onBlur={() => setInternalRed(rgb.r)}\n        disableClear\n      />\n      <HvInput\n        inputRef={greenInputRef}\n        className={clsx(classes.single)}\n        label=\"G\"\n        value={`${internalGreen}`}\n        onChange={(_evt, value) => onChangeRbg(_evt, value, \"g\")}\n        onBlur={() => setInternalGreen(rgb.g)}\n        disableClear\n      />\n      <HvInput\n        inputRef={blueInputRef}\n        className={clsx(classes.single)}\n        label=\"B\"\n        value={`${internalBlue}`}\n        onChange={(_evt, value) => onChangeRbg(_evt, value, \"b\")}\n        onBlur={() => setInternalBlue(rgb.b)}\n        disableClear\n      />\n    </div>\n  );\n};\n\nFields.propTypes = {\n  rgb: PropTypes.shape({\n    r: PropTypes.number,\n    g: PropTypes.number,\n    b: PropTypes.number,\n  }).isRequired,\n};\n\nexport default Fields;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;;AACA;;AACA;;AACA;;AAEA;;AAEA;;;;;;;;AATA;AAWA;AACO,IAAMA,MAAM,GAAG,SAATA,MAAS,OAA4B;EAAA,IAAzBC,QAAyB,QAAzBA,QAAyB;EAAA,IAAfC,GAAe,QAAfA,GAAe;EAAA,IAAVC,GAAU,QAAVA,GAAU;EAChD,IAAMC,OAAO,GAAG,IAAAC,eAAA,GAAhB;;EACA,gBAAsC,IAAAC,eAAA,EAASH,GAAT,CAAtC;EAAA;EAAA,IAAOI,WAAP;EAAA,IAAoBC,cAApB;;EACA,iBAAsC,IAAAF,eAAA,EAASJ,GAAG,CAACO,CAAb,CAAtC;EAAA;EAAA,IAAOC,WAAP;EAAA,IAAoBC,cAApB;;EACA,iBAA0C,IAAAL,eAAA,EAASJ,GAAG,CAACU,CAAb,CAA1C;EAAA;EAAA,IAAOC,aAAP;EAAA,IAAsBC,gBAAtB;;EACA,iBAAwC,IAAAR,eAAA,EAASJ,GAAG,CAACa,CAAb,CAAxC;EAAA;EAAA,IAAOC,YAAP;EAAA,IAAqBC,eAArB;;EAEA,IAAMC,WAAW,GAAG,IAAAC,aAAA,GAApB;EACA,IAAMC,WAAW,GAAG,IAAAD,aAAA,GAApB;EACA,IAAME,aAAa,GAAG,IAAAF,aAAA,GAAtB;EACA,IAAMG,YAAY,GAAG,IAAAH,aAAA,GAArB;EAEA,IAAAI,gBAAA,EAAU,YAAM;IACd,IAAIC,QAAQ,CAACC,aAAT,KAA2BP,WAAW,CAACQ,OAA3C,EAAoD;MAClDlB,cAAc,CAACL,GAAD,CAAd;IACD;EACF,CAJD,EAIG,CAACA,GAAD,CAJH;EAMA,IAAAoB,gBAAA,EAAU,YAAM;IACd,IAAIC,QAAQ,CAACC,aAAT,KAA2BL,WAAW,CAACM,OAA3C,EAAoD;MAClDf,cAAc,CAACT,GAAG,CAACO,CAAL,CAAd;IACD;;IAED,IAAIe,QAAQ,CAACC,aAAT,KAA2BJ,aAAa,CAACK,OAA7C,EAAsD;MACpDZ,gBAAgB,CAACZ,GAAG,CAACU,CAAL,CAAhB;IACD;;IAED,IAAIY,QAAQ,CAACC,aAAT,KAA2BH,YAAY,CAACI,OAA5C,EAAqD;MACnDT,eAAe,CAACf,GAAG,CAACa,CAAL,CAAf;IACD;EACF,CAZD,EAYG,CAACb,GAAD,CAZH;;EAcA,IAAMyB,YAAY,GAAG,SAAfA,YAAe,CAACC,IAAD,EAAOC,CAAP,EAAa;IAChC,IAAID,IAAI,CAACzB,GAAL,IAAY2B,KAAK,CAACC,UAAN,CAAiBH,IAAI,CAACzB,GAAtB,CAAhB,EAA4C;MAC1CF,QAAQ,CACN;QACEE,GAAG,EAAEyB,IAAI,CAACzB,GADZ;QAEE6B,MAAM,EAAE;MAFV,CADM,EAKNH,CALM,CAAR;IAOD,CARD,MAQO,IAAID,IAAI,CAACnB,CAAL,IAAUmB,IAAI,CAAChB,CAAf,IAAoBgB,IAAI,CAACb,CAA7B,EAAgC;MACrCd,QAAQ,CACN;QACEQ,CAAC,EAAEmB,IAAI,CAACnB,CAAL,IAAUP,GAAG,CAACO,CADnB;QAEEG,CAAC,EAAEgB,IAAI,CAAChB,CAAL,IAAUV,GAAG,CAACU,CAFnB;QAGEG,CAAC,EAAEa,IAAI,CAACb,CAAL,IAAUb,GAAG,CAACa,CAHnB;QAIEiB,MAAM,EAAE;MAJV,CADM,EAONH,CAPM,CAAR;IASD;EACF,CApBD;;EAsBA,IAAMI,WAAW,GAAG,SAAdA,WAAc,CAACC,IAAD,EAAOC,KAAP,EAAiB;IACnC3B,cAAc,CAAC2B,KAAD,CAAd;IACAR,YAAY,CAAC;MAAExB,GAAG,EAAEgC;IAAP,CAAD,EAAiBD,IAAjB,CAAZ;EACD,CAHD;;EAKA,IAAME,WAAW,GAAG,SAAdA,WAAc,CAACF,IAAD,EAAOC,KAAP,EAAcE,SAAd,EAA4B;IAC9C,IAAIA,SAAS,KAAK,GAAlB,EAAuB1B,cAAc,CAACwB,KAAD,CAAd;IACvB,IAAIE,SAAS,KAAK,GAAlB,EAAuBvB,gBAAgB,CAACqB,KAAD,CAAhB;IACvB,IAAIE,SAAS,KAAK,GAAlB,EAAuBpB,eAAe,CAACkB,KAAD,CAAf;IACvBR,YAAY,CACV;MACElB,CAAC,EAAE4B,SAAS,KAAK,GAAd,GAAoBF,KAApB,GAA4BjC,GAAG,CAACO,CADrC;MAEEG,CAAC,EAAEyB,SAAS,KAAK,GAAd,GAAoBF,KAApB,GAA4BjC,GAAG,CAACU,CAFrC;MAGEG,CAAC,EAAEsB,SAAS,KAAK,GAAd,GAAoBF,KAApB,GAA4BjC,GAAG,CAACa;IAHrC,CADU,EAMVmB,IANU,CAAZ;EAQD,CAZD;;EAcA,oBACE;IAAK,SAAS,EAAE,IAAAI,aAAA,EAAKlC,OAAO,CAACmC,MAAb,CAAhB;IAAA,wBACE,qBAAC,uBAAD;MACE,QAAQ,EAAErB,WADZ;MAEE,SAAS,EAAE,IAAAoB,aAAA,EAAKlC,OAAO,CAACoC,MAAb,CAFb;MAGE,KAAK,EAAC,KAHR;MAIE,KAAK,EAAEjC,WAAW,CAACkC,OAAZ,CAAoB,GAApB,EAAyB,EAAzB,CAJT;MAKE,QAAQ,EAAER,WALZ;MAME,MAAM,EAAE;QAAA,OAAMzB,cAAc,CAACL,GAAD,CAApB;MAAA,CANV;MAOE,YAAY;IAPd,EADF,eAUE,qBAAC,uBAAD;MACE,QAAQ,EAAEiB,WADZ;MAEE,SAAS,EAAE,IAAAkB,aAAA,EAAKlC,OAAO,CAACsC,MAAb,CAFb;MAGE,KAAK,EAAC,GAHR;MAIE,KAAK,YAAKhC,WAAL,CAJP;MAKE,QAAQ,EAAE,kBAACwB,IAAD,EAAOC,KAAP;QAAA,OAAiBC,WAAW,CAACF,IAAD,EAAOC,KAAP,EAAc,GAAd,CAA5B;MAAA,CALZ;MAME,MAAM,EAAE;QAAA,OAAMxB,cAAc,CAACT,GAAG,CAACO,CAAL,CAApB;MAAA,CANV;MAOE,YAAY;IAPd,EAVF,eAmBE,qBAAC,uBAAD;MACE,QAAQ,EAAEY,aADZ;MAEE,SAAS,EAAE,IAAAiB,aAAA,EAAKlC,OAAO,CAACsC,MAAb,CAFb;MAGE,KAAK,EAAC,GAHR;MAIE,KAAK,YAAK7B,aAAL,CAJP;MAKE,QAAQ,EAAE,kBAACqB,IAAD,EAAOC,KAAP;QAAA,OAAiBC,WAAW,CAACF,IAAD,EAAOC,KAAP,EAAc,GAAd,CAA5B;MAAA,CALZ;MAME,MAAM,EAAE;QAAA,OAAMrB,gBAAgB,CAACZ,GAAG,CAACU,CAAL,CAAtB;MAAA,CANV;MAOE,YAAY;IAPd,EAnBF,eA4BE,qBAAC,uBAAD;MACE,QAAQ,EAAEU,YADZ;MAEE,SAAS,EAAE,IAAAgB,aAAA,EAAKlC,OAAO,CAACsC,MAAb,CAFb;MAGE,KAAK,EAAC,GAHR;MAIE,KAAK,YAAK1B,YAAL,CAJP;MAKE,QAAQ,EAAE,kBAACkB,IAAD,EAAOC,KAAP;QAAA,OAAiBC,WAAW,CAACF,IAAD,EAAOC,KAAP,EAAc,GAAd,CAA5B;MAAA,CALZ;MAME,MAAM,EAAE;QAAA,OAAMlB,eAAe,CAACf,GAAG,CAACa,CAAL,CAArB;MAAA,CANV;MAOE,YAAY;IAPd,EA5BF;EAAA,EADF;AAwCD,CAjHM;;;AAmHP,wCAAAf,MAAM,CAAC2C,SAAP,GAAmB;EACjBzC,GAAG,EAAE0C,kBAAA,CAAUC,KAAV,CAAgB;IACnBpC,CAAC,EAAEmC,kBAAA,CAAUE,MADM;IAEnBlC,CAAC,EAAEgC,kBAAA,CAAUE,MAFM;IAGnB/B,CAAC,EAAE6B,kBAAA,CAAUE;EAHM,CAAhB,EAIFC;AALc,CAAnB;eAQe/C,M"}

package/dist/ColorPicker/Fields/styles.js

@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _core = require("@material-ui/core");
+var _styles = require("@mui/styles");
 
-var styles = (0, _core.makeStyles)(function () {
+var styles = (0, _styles.makeStyles)(function () {
   return {
     fields: {
       width: "100%",

package/dist/ColorPicker/Fields/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","names":["styles","makeStyles","fields","width","display","paddingTop","paddingBottom","marginRight","single","paddingLeft","marginLeft","double","textTransform","paddingRight"],"sources":["../../../src/ColorPicker/Fields/styles.js"],"sourcesContent":["import { makeStyles } from \"@material-ui/core\";\n\nconst styles = makeStyles(() => ({\n  fields: {\n    width: \"100%\",\n    display: \"flex\",\n    paddingTop: 10,\n    paddingBottom: 20,\n    marginRight: 5,\n  },\n  single: {\n    width: 40,\n    paddingLeft: 5,\n    \"& input\": {\n      marginLeft: 5,\n      marginRight: 5,\n    },\n    \"& label\": {\n      paddingLeft: 5,\n    },\n  },\n  double: {\n    width: 80,\n    \"& input\": {\n      textTransform: \"uppercase\",\n      marginLeft: 5,\n      marginRight: 5,\n    },\n    \"& label\": {\n      paddingLeft: 5,\n    },\n    paddingRight: 20,\n  },\n}));\n\nexport default styles;\n"],"mappings":";;;;;;;AAAA;;AAEA,IAAMA,MAAM,GAAG,IAAAC,gBAAA,EAAW;EAAA,OAAO;IAC/BC,MAAM,EAAE;MACNC,KAAK,EAAE,MADD;MAENC,OAAO,EAAE,MAFH;MAGNC,UAAU,EAAE,EAHN;MAINC,aAAa,EAAE,EAJT;MAKNC,WAAW,EAAE;IALP,CADuB;IAQ/BC,MAAM,EAAE;MACNL,KAAK,EAAE,EADD;MAENM,WAAW,EAAE,CAFP;MAGN,WAAW;QACTC,UAAU,EAAE,CADH;QAETH,WAAW,EAAE;MAFJ,CAHL;MAON,WAAW;QACTE,WAAW,EAAE;MADJ;IAPL,CARuB;IAmB/BE,MAAM,EAAE;MACNR,KAAK,EAAE,EADD;MAEN,WAAW;QACTS,aAAa,EAAE,WADN;QAETF,UAAU,EAAE,CAFH;QAGTH,WAAW,EAAE;MAHJ,CAFL;MAON,WAAW;QACTE,WAAW,EAAE;MADJ,CAPL;MAUNI,YAAY,EAAE;IAVR;EAnBuB,CAAP;AAAA,CAAX,CAAf;eAiCeb,M"}
+{"version":3,"file":"styles.js","names":["styles","makeStyles","fields","width","display","paddingTop","paddingBottom","marginRight","single","paddingLeft","marginLeft","double","textTransform","paddingRight"],"sources":["../../../src/ColorPicker/Fields/styles.js"],"sourcesContent":["import { makeStyles } from \"@mui/styles\";\n\nconst styles = makeStyles(() => ({\n  fields: {\n    width: \"100%\",\n    display: \"flex\",\n    paddingTop: 10,\n    paddingBottom: 20,\n    marginRight: 5,\n  },\n  single: {\n    width: 40,\n    paddingLeft: 5,\n    \"& input\": {\n      marginLeft: 5,\n      marginRight: 5,\n    },\n    \"& label\": {\n      paddingLeft: 5,\n    },\n  },\n  double: {\n    width: 80,\n    \"& input\": {\n      textTransform: \"uppercase\",\n      marginLeft: 5,\n      marginRight: 5,\n    },\n    \"& label\": {\n      paddingLeft: 5,\n    },\n    paddingRight: 20,\n  },\n}));\n\nexport default styles;\n"],"mappings":";;;;;;;AAAA;;AAEA,IAAMA,MAAM,GAAG,IAAAC,kBAAA,EAAW;EAAA,OAAO;IAC/BC,MAAM,EAAE;MACNC,KAAK,EAAE,MADD;MAENC,OAAO,EAAE,MAFH;MAGNC,UAAU,EAAE,EAHN;MAINC,aAAa,EAAE,EAJT;MAKNC,WAAW,EAAE;IALP,CADuB;IAQ/BC,MAAM,EAAE;MACNL,KAAK,EAAE,EADD;MAENM,WAAW,EAAE,CAFP;MAGN,WAAW;QACTC,UAAU,EAAE,CADH;QAETH,WAAW,EAAE;MAFJ,CAHL;MAON,WAAW;QACTE,WAAW,EAAE;MADJ;IAPL,CARuB;IAmB/BE,MAAM,EAAE;MACNR,KAAK,EAAE,EADD;MAEN,WAAW;QACTS,aAAa,EAAE,WADN;QAETF,UAAU,EAAE,CAFH;QAGTH,WAAW,EAAE;MAHJ,CAFL;MAON,WAAW;QACTE,WAAW,EAAE;MADJ,CAPL;MAUNI,YAAY,EAAE;IAVR;EAnBuB,CAAP;AAAA,CAAX,CAAf;eAiCeb,M"}

package/dist/ColorPicker/Picker/Picker.js

@@ -31,6 +31,8 @@ var _Fields = _interopRequireDefault(require("../Fields"));
 
 var _styles = _interopRequireDefault(require("./styles"));
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -45,37 +47,42 @@ var Picker = function Picker(_ref) {
       hex = _ref.hex;
   var classes = (0, _styles.default)();
   var SaturationPointer = (0, _react.useCallback)(function () {
-    return /*#__PURE__*/_react.default.createElement("div", {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: (0, _clsx.default)(classes.saturationPointer)
     });
   }, [classes.saturationPointer]);
   var HueSlider = (0, _react.useCallback)(function () {
-    return /*#__PURE__*/_react.default.createElement("div", {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: (0, _clsx.default)(classes.hueSlider)
     });
   }, [classes.hueSlider]);
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _clsx.default)(classes.pickers)
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _clsx.default)(classes.saturation)
-  }, /*#__PURE__*/_react.default.createElement(_common.Saturation, {
-    hsl: hsl,
-    hsv: hsv,
-    onChange: onChange,
-    pointer: SaturationPointer
-  })), /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _clsx.default)(classes.hue)
-  }, /*#__PURE__*/_react.default.createElement(_common.Hue, {
-    direction: "vertical",
-    hsl: hsl,
-    onChange: onChange,
-    pointer: HueSlider
-  }))), /*#__PURE__*/_react.default.createElement(_Fields.default, {
-    rgb: rgb,
-    hsl: hsl,
-    hex: hex,
-    onChange: onChange
-  }));
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: (0, _clsx.default)(classes.pickers),
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: (0, _clsx.default)(classes.saturation),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_common.Saturation, {
+          hsl: hsl,
+          hsv: hsv,
+          onChange: onChange,
+          pointer: SaturationPointer
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: (0, _clsx.default)(classes.hue),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_common.Hue, {
+          direction: "vertical",
+          hsl: hsl,
+          onChange: onChange,
+          pointer: HueSlider
+        })
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Fields.default, {
+      rgb: rgb,
+      hsl: hsl,
+      hex: hex,
+      onChange: onChange
+    })]
+  });
 };
 
 var _default = (0, _common.ColorWrap)(Picker);

package/dist/ColorPicker/Picker/Picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"Picker.js","names":["Picker","onChange","rgb","hsl","hsv","hex","classes","useStyles","SaturationPointer","useCallback","clsx","saturationPointer","HueSlider","hueSlider","pickers","saturation","hue","ColorWrap"],"sources":["../../../src/ColorPicker/Picker/Picker.js"],"sourcesContent":["/* eslint-disable no-param-reassign */\n\nimport clsx from \"clsx\";\nimport React, { useCallback } from \"react\";\nimport { Saturation, ColorWrap, Hue } from \"react-color/lib/components/common\";\n\nimport Fields from \"../Fields\";\nimport useStyles from \"./styles\";\n\n// eslint-disable-next-line react/prop-types\nconst Picker = ({ onChange, rgb, hsl, hsv, hex }) => {\n  const classes = useStyles();\n\n  const SaturationPointer = useCallback(\n    () => <div className={clsx(classes.saturationPointer)} />,\n    [classes.saturationPointer]\n  );\n  const HueSlider = useCallback(\n    () => <div className={clsx(classes.hueSlider)} />,\n    [classes.hueSlider]\n  );\n\n  return (\n    <>\n      <div className={clsx(classes.pickers)}>\n        <div className={clsx(classes.saturation)}>\n          <Saturation hsl={hsl} hsv={hsv} onChange={onChange} pointer={SaturationPointer} />\n        </div>\n        <div className={clsx(classes.hue)}>\n          <Hue direction=\"vertical\" hsl={hsl} onChange={onChange} pointer={HueSlider} />\n        </div>\n      </div>\n      <Fields rgb={rgb} hsl={hsl} hex={hex} onChange={onChange} />\n    </>\n  );\n};\n\nexport default ColorWrap(Picker);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAEA;;AACA;;AACA;;AAEA;;AACA;;;;;;AAPA;AASA;AACA,IAAMA,MAAM,GAAG,SAATA,MAAS,OAAsC;EAAA,IAAnCC,QAAmC,QAAnCA,QAAmC;EAAA,IAAzBC,GAAyB,QAAzBA,GAAyB;EAAA,IAApBC,GAAoB,QAApBA,GAAoB;EAAA,IAAfC,GAAe,QAAfA,GAAe;EAAA,IAAVC,GAAU,QAAVA,GAAU;EACnD,IAAMC,OAAO,GAAG,IAAAC,eAAA,GAAhB;EAEA,IAAMC,iBAAiB,GAAG,IAAAC,kBAAA,EACxB;IAAA,oBAAM;MAAK,SAAS,EAAE,IAAAC,aAAA,EAAKJ,OAAO,CAACK,iBAAb;IAAhB,EAAN;EAAA,CADwB,EAExB,CAACL,OAAO,CAACK,iBAAT,CAFwB,CAA1B;EAIA,IAAMC,SAAS,GAAG,IAAAH,kBAAA,EAChB;IAAA,oBAAM;MAAK,SAAS,EAAE,IAAAC,aAAA,EAAKJ,OAAO,CAACO,SAAb;IAAhB,EAAN;EAAA,CADgB,EAEhB,CAACP,OAAO,CAACO,SAAT,CAFgB,CAAlB;EAKA,oBACE,yEACE;IAAK,SAAS,EAAE,IAAAH,aAAA,EAAKJ,OAAO,CAACQ,OAAb;EAAhB,gBACE;IAAK,SAAS,EAAE,IAAAJ,aAAA,EAAKJ,OAAO,CAACS,UAAb;EAAhB,gBACE,6BAAC,kBAAD;IAAY,GAAG,EAAEZ,GAAjB;IAAsB,GAAG,EAAEC,GAA3B;IAAgC,QAAQ,EAAEH,QAA1C;IAAoD,OAAO,EAAEO;EAA7D,EADF,CADF,eAIE;IAAK,SAAS,EAAE,IAAAE,aAAA,EAAKJ,OAAO,CAACU,GAAb;EAAhB,gBACE,6BAAC,WAAD;IAAK,SAAS,EAAC,UAAf;IAA0B,GAAG,EAAEb,GAA/B;IAAoC,QAAQ,EAAEF,QAA9C;IAAwD,OAAO,EAAEW;EAAjE,EADF,CAJF,CADF,eASE,6BAAC,eAAD;IAAQ,GAAG,EAAEV,GAAb;IAAkB,GAAG,EAAEC,GAAvB;IAA4B,GAAG,EAAEE,GAAjC;IAAsC,QAAQ,EAAEJ;EAAhD,EATF,CADF;AAaD,CAzBD;;eA2Be,IAAAgB,iBAAA,EAAUjB,MAAV,C"}
+{"version":3,"file":"Picker.js","names":["Picker","onChange","rgb","hsl","hsv","hex","classes","useStyles","SaturationPointer","useCallback","clsx","saturationPointer","HueSlider","hueSlider","pickers","saturation","hue","ColorWrap"],"sources":["../../../src/ColorPicker/Picker/Picker.js"],"sourcesContent":["/* eslint-disable no-param-reassign */\n\nimport clsx from \"clsx\";\nimport React, { useCallback } from \"react\";\nimport { Saturation, ColorWrap, Hue } from \"react-color/lib/components/common\";\n\nimport Fields from \"../Fields\";\nimport useStyles from \"./styles\";\n\n// eslint-disable-next-line react/prop-types\nconst Picker = ({ onChange, rgb, hsl, hsv, hex }) => {\n  const classes = useStyles();\n\n  const SaturationPointer = useCallback(\n    () => <div className={clsx(classes.saturationPointer)} />,\n    [classes.saturationPointer]\n  );\n  const HueSlider = useCallback(\n    () => <div className={clsx(classes.hueSlider)} />,\n    [classes.hueSlider]\n  );\n\n  return (\n    <>\n      <div className={clsx(classes.pickers)}>\n        <div className={clsx(classes.saturation)}>\n          <Saturation hsl={hsl} hsv={hsv} onChange={onChange} pointer={SaturationPointer} />\n        </div>\n        <div className={clsx(classes.hue)}>\n          <Hue direction=\"vertical\" hsl={hsl} onChange={onChange} pointer={HueSlider} />\n        </div>\n      </div>\n      <Fields rgb={rgb} hsl={hsl} hex={hex} onChange={onChange} />\n    </>\n  );\n};\n\nexport default ColorWrap(Picker);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAEA;;AACA;;AACA;;AAEA;;AACA;;;;;;;;AAPA;AASA;AACA,IAAMA,MAAM,GAAG,SAATA,MAAS,OAAsC;EAAA,IAAnCC,QAAmC,QAAnCA,QAAmC;EAAA,IAAzBC,GAAyB,QAAzBA,GAAyB;EAAA,IAApBC,GAAoB,QAApBA,GAAoB;EAAA,IAAfC,GAAe,QAAfA,GAAe;EAAA,IAAVC,GAAU,QAAVA,GAAU;EACnD,IAAMC,OAAO,GAAG,IAAAC,eAAA,GAAhB;EAEA,IAAMC,iBAAiB,GAAG,IAAAC,kBAAA,EACxB;IAAA,oBAAM;MAAK,SAAS,EAAE,IAAAC,aAAA,EAAKJ,OAAO,CAACK,iBAAb;IAAhB,EAAN;EAAA,CADwB,EAExB,CAACL,OAAO,CAACK,iBAAT,CAFwB,CAA1B;EAIA,IAAMC,SAAS,GAAG,IAAAH,kBAAA,EAChB;IAAA,oBAAM;MAAK,SAAS,EAAE,IAAAC,aAAA,EAAKJ,OAAO,CAACO,SAAb;IAAhB,EAAN;EAAA,CADgB,EAEhB,CAACP,OAAO,CAACO,SAAT,CAFgB,CAAlB;EAKA,oBACE;IAAA,wBACE;MAAK,SAAS,EAAE,IAAAH,aAAA,EAAKJ,OAAO,CAACQ,OAAb,CAAhB;MAAA,wBACE;QAAK,SAAS,EAAE,IAAAJ,aAAA,EAAKJ,OAAO,CAACS,UAAb,CAAhB;QAAA,uBACE,qBAAC,kBAAD;UAAY,GAAG,EAAEZ,GAAjB;UAAsB,GAAG,EAAEC,GAA3B;UAAgC,QAAQ,EAAEH,QAA1C;UAAoD,OAAO,EAAEO;QAA7D;MADF,EADF,eAIE;QAAK,SAAS,EAAE,IAAAE,aAAA,EAAKJ,OAAO,CAACU,GAAb,CAAhB;QAAA,uBACE,qBAAC,WAAD;UAAK,SAAS,EAAC,UAAf;UAA0B,GAAG,EAAEb,GAA/B;UAAoC,QAAQ,EAAEF,QAA9C;UAAwD,OAAO,EAAEW;QAAjE;MADF,EAJF;IAAA,EADF,eASE,qBAAC,eAAD;MAAQ,GAAG,EAAEV,GAAb;MAAkB,GAAG,EAAEC,GAAvB;MAA4B,GAAG,EAAEE,GAAjC;MAAsC,QAAQ,EAAEJ;IAAhD,EATF;EAAA,EADF;AAaD,CAzBD;;eA2Be,IAAAgB,iBAAA,EAAUjB,MAAV,C"}

package/dist/ColorPicker/Picker/styles.js

@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _core = require("@material-ui/core");
+var _styles = require("@mui/styles");
 
-var styles = (0, _core.makeStyles)(function () {
+var styles = (0, _styles.makeStyles)(function () {
   return {
     pickers: {
       display: "flex"

package/dist/ColorPicker/Picker/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","names":["styles","makeStyles","pickers","display","saturation","width","height","marginRight","position","overflow","saturationPointer","boxShadow","borderRadius","transform","sliders","padding","flex","hue","hueSlider","background","marginLeft","double"],"sources":["../../../src/ColorPicker/Picker/styles.js"],"sourcesContent":["import { makeStyles } from \"@material-ui/core\";\n\nconst styles = makeStyles(() => ({\n  pickers: {\n    display: \"flex\",\n  },\n  saturation: {\n    width: 180,\n    height: 180,\n    marginRight: 5,\n    position: \"relative\",\n    overflow: \"visible\",\n  },\n  saturationPointer: {\n    width: \"6px\",\n    height: \"6px\",\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  sliders: {\n    padding: \"4px 0\",\n    flex: \"1\",\n  },\n  hue: {\n    width: 15,\n    position: \"relative\",\n    overflow: \"visible\",\n  },\n  hueSlider: {\n    width: 12,\n    height: 6,\n    background: \"#fff\",\n    boxShadow: \"0 0 2px rgb(0 0 0 / 60%)\",\n    marginLeft: 1,\n    borderRadius: \"1px\",\n    transform: \"translate(0, -2px)\",\n  },\n  double: {\n    flex: \"2\",\n  },\n}));\n\nexport default styles;\n"],"mappings":";;;;;;;AAAA;;AAEA,IAAMA,MAAM,GAAG,IAAAC,gBAAA,EAAW;EAAA,OAAO;IAC/BC,OAAO,EAAE;MACPC,OAAO,EAAE;IADF,CADsB;IAI/BC,UAAU,EAAE;MACVC,KAAK,EAAE,GADG;MAEVC,MAAM,EAAE,GAFE;MAGVC,WAAW,EAAE,CAHH;MAIVC,QAAQ,EAAE,UAJA;MAKVC,QAAQ,EAAE;IALA,CAJmB;IAW/BC,iBAAiB,EAAE;MACjBL,KAAK,EAAE,KADU;MAEjBC,MAAM,EAAE,KAFS;MAGjBK,SAAS,6FAHQ;MAKjBC,YAAY,EAAE,KALG;MAMjBC,SAAS,EAAE;IANM,CAXY;IAmB/BC,OAAO,EAAE;MACPC,OAAO,EAAE,OADF;MAEPC,IAAI,EAAE;IAFC,CAnBsB;IAuB/BC,GAAG,EAAE;MACHZ,KAAK,EAAE,EADJ;MAEHG,QAAQ,EAAE,UAFP;MAGHC,QAAQ,EAAE;IAHP,CAvB0B;IA4B/BS,SAAS,EAAE;MACTb,KAAK,EAAE,EADE;MAETC,MAAM,EAAE,CAFC;MAGTa,UAAU,EAAE,MAHH;MAITR,SAAS,EAAE,0BAJF;MAKTS,UAAU,EAAE,CALH;MAMTR,YAAY,EAAE,KANL;MAOTC,SAAS,EAAE;IAPF,CA5BoB;IAqC/BQ,MAAM,EAAE;MACNL,IAAI,EAAE;IADA;EArCuB,CAAP;AAAA,CAAX,CAAf;eA0CehB,M"}
+{"version":3,"file":"styles.js","names":["styles","makeStyles","pickers","display","saturation","width","height","marginRight","position","overflow","saturationPointer","boxShadow","borderRadius","transform","sliders","padding","flex","hue","hueSlider","background","marginLeft","double"],"sources":["../../../src/ColorPicker/Picker/styles.js"],"sourcesContent":["import { makeStyles } from \"@mui/styles\";\n\nconst styles = makeStyles(() => ({\n  pickers: {\n    display: \"flex\",\n  },\n  saturation: {\n    width: 180,\n    height: 180,\n    marginRight: 5,\n    position: \"relative\",\n    overflow: \"visible\",\n  },\n  saturationPointer: {\n    width: \"6px\",\n    height: \"6px\",\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  sliders: {\n    padding: \"4px 0\",\n    flex: \"1\",\n  },\n  hue: {\n    width: 15,\n    position: \"relative\",\n    overflow: \"visible\",\n  },\n  hueSlider: {\n    width: 12,\n    height: 6,\n    background: \"#fff\",\n    boxShadow: \"0 0 2px rgb(0 0 0 / 60%)\",\n    marginLeft: 1,\n    borderRadius: \"1px\",\n    transform: \"translate(0, -2px)\",\n  },\n  double: {\n    flex: \"2\",\n  },\n}));\n\nexport default styles;\n"],"mappings":";;;;;;;AAAA;;AAEA,IAAMA,MAAM,GAAG,IAAAC,kBAAA,EAAW;EAAA,OAAO;IAC/BC,OAAO,EAAE;MACPC,OAAO,EAAE;IADF,CADsB;IAI/BC,UAAU,EAAE;MACVC,KAAK,EAAE,GADG;MAEVC,MAAM,EAAE,GAFE;MAGVC,WAAW,EAAE,CAHH;MAIVC,QAAQ,EAAE,UAJA;MAKVC,QAAQ,EAAE;IALA,CAJmB;IAW/BC,iBAAiB,EAAE;MACjBL,KAAK,EAAE,KADU;MAEjBC,MAAM,EAAE,KAFS;MAGjBK,SAAS,6FAHQ;MAKjBC,YAAY,EAAE,KALG;MAMjBC,SAAS,EAAE;IANM,CAXY;IAmB/BC,OAAO,EAAE;MACPC,OAAO,EAAE,OADF;MAEPC,IAAI,EAAE;IAFC,CAnBsB;IAuB/BC,GAAG,EAAE;MACHZ,KAAK,EAAE,EADJ;MAEHG,QAAQ,EAAE,UAFP;MAGHC,QAAQ,EAAE;IAHP,CAvB0B;IA4B/BS,SAAS,EAAE;MACTb,KAAK,EAAE,EADE;MAETC,MAAM,EAAE,CAFC;MAGTa,UAAU,EAAE,MAHH;MAITR,SAAS,EAAE,0BAJF;MAKTS,UAAU,EAAE,CALH;MAMTR,YAAY,EAAE,KANL;MAOTC,SAAS,EAAE;IAPF,CA5BoB;IAqC/BQ,MAAM,EAAE;MACNL,IAAI,EAAE;IADA;EArCuB,CAAP;AAAA,CAAX,CAAf;eA0CehB,M"}

package/dist/ColorPicker/PresetColors/PresetColors.js

@@ -1,5 +1,19 @@
 "use strict";
 
+require("core-js/modules/es.object.keys.js");
+
+require("core-js/modules/es.symbol.js");
+
+require("core-js/modules/es.array.filter.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+require("core-js/modules/web.dom-collections.for-each.js");
+
+require("core-js/modules/es.object.get-own-property-descriptors.js");
+
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
 Object.defineProperty(exports, "__esModule", {
@@ -7,7 +21,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.SketchPresetColors = void 0;
 
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
 require("core-js/modules/es.array.map.js");
 
@@ -21,6 +35,12 @@ var _common = require("react-color/lib/components/common");
 
 var _styles = _interopRequireDefault(require("./styles"));
 
+var _jsxRuntime = require("react/jsx-runtime");
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
 var SketchPresetColors = function SketchPresetColors(_ref) {
   var colors = _ref.colors,
       _ref$onClick = _ref.onClick,
@@ -34,24 +54,25 @@ var SketchPresetColors = function SketchPresetColors(_ref) {
     }, e);
   };
 
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: classes.colors
-  }, colors.map(function (colorObjOrString) {
-    var c = typeof colorObjOrString === "string" ? {
-      color: colorObjOrString
-    } : colorObjOrString;
-    var key = "".concat(c.color).concat(c.title || "");
-    return /*#__PURE__*/_react.default.createElement("div", {
-      key: key,
-      className: classes.swatchWrap
-    }, /*#__PURE__*/_react.default.createElement(_common.Swatch, (0, _extends2.default)({}, c, {
-      className: classes.swatch,
-      onClick: handleClick,
-      focusStyle: {
-        boxShadow: "inset 0 0 0 1px rgba(0,0,0,.15), 0 0 4px ".concat(c.color)
-      }
-    })));
-  }));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    className: classes.colors,
+    children: colors.map(function (colorObjOrString) {
+      var c = typeof colorObjOrString === "string" ? {
+        color: colorObjOrString
+      } : colorObjOrString;
+      var key = "".concat(c.color).concat(c.title || "");
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: classes.swatchWrap,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_common.Swatch, _objectSpread(_objectSpread({}, c), {}, {
+          className: classes.swatch,
+          onClick: handleClick,
+          focusStyle: {
+            boxShadow: "inset 0 0 0 1px rgba(0,0,0,.15), 0 0 4px ".concat(c.color)
+          }
+        }))
+      }, key);
+    })
+  });
 };
 
 exports.SketchPresetColors = SketchPresetColors;