@dreamcommerce/aurora 2.20.2-6 → 2.20.2-8

package/build/cjs/packages/aurora/src/components/color_picker_new/components/color-picker-footer.js

@@ -9,8 +9,8 @@ var index$1 = require('../../button/index.js');
 var index = require('../../dropdown/context/index.js');
 var context = require('../context.js');
 var css_classes = require('../css_classes.js');
-var color_picker_utils = require('../color_picker_utils.js');
 var main_module = require('../../../css/color_picker_new/main.module.less.js');
+var color_picker_utils = require('../color_picker_utils.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/build/cjs/packages/aurora/src/components/color_picker_new/components/color-picker-header.js

@@ -8,8 +8,8 @@ var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPlugi
 var index = require('../../dropdown/context/index.js');
 var context = require('../context.js');
 var css_classes = require('../css_classes.js');
-var main_module = require('../../../css/color_picker_new/main.module.less.js');
 var icon_close = require('../../../assets/icon_close.js');
+var main_module = require('../../../css/color_picker_new/main.module.less.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/build/cjs/packages/aurora/src/components/color_picker_new/components/color-picker-inputs/color-picker-inputs-hex.js

@@ -6,8 +6,8 @@ var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../../_virtual/_rollupPluginBabelHelpers.js');
 var input = require('../../../controls/components/input.js');
 var context = require('../../context.js');
-var color_picker_utils = require('../../color_picker_utils.js');
 var utilities = require('@dreamcommerce/utilities');
+var color_picker_utils = require('../../color_picker_utils.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/build/cjs/packages/aurora/src/components/color_picker_new/components/color-picker-inputs/color-picker-inputs.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../../_virtual/_rollupPluginBabelHelpers.js');
-var constants = require('../../constants.js');
 var css_classes = require('../../css_classes.js');
 var main_module = require('../../../../css/color_picker_new/main.module.less.js');
+var constants = require('../../constants.js');
 var colorPickerInputsHex = require('./color-picker-inputs-hex.js');
 var colorPickerInputsRgba = require('./color-picker-inputs-rgba.js');
 

package/build/cjs/packages/aurora/src/components/color_picker_new/components/color-picker-shades.js

@@ -7,8 +7,8 @@ var useTranslation = require('../../../../../../external/react-i18next/dist/es/u
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
 var context = require('../context.js');
 var css_classes = require('../css_classes.js');
-var color_picker_utils = require('../color_picker_utils.js');
 var main_module = require('../../../css/color_picker_new/main.module.less.js');
+var color_picker_utils = require('../color_picker_utils.js');
 var colorPickerSwatch = require('./color-picker-swatch.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

package/build/cjs/packages/aurora/src/components/color_picker_new/components/color-picker-swatch.js

@@ -5,10 +5,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
 var classnames = require('classnames');
-var constants = require('../constants.js');
 var css_classes = require('../css_classes.js');
-var color_picker_utils = require('../color_picker_utils.js');
 var main_module = require('../../../css/color_picker_new/main.module.less.js');
+var constants = require('../constants.js');
+var color_picker_utils = require('../color_picker_utils.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/build/cjs/packages/aurora/src/components/color_picker_new/components/color-picker-variables.js

@@ -7,8 +7,8 @@ var useTranslation = require('../../../../../../external/react-i18next/dist/es/u
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
 var context = require('../context.js');
 var css_classes = require('../css_classes.js');
-var color_picker_utils = require('../color_picker_utils.js');
 var main_module = require('../../../css/color_picker_new/main.module.less.js');
+var color_picker_utils = require('../color_picker_utils.js');
 var colorPickerSwatch = require('./color-picker-swatch.js');
 var icon_list_arrow_down = require('../../../assets/icon_list_arrow_down.js');
 

package/build/cjs/packages/aurora/src/components/color_picker_new/components/{pure-color-picker.js → color_picker_content.js}

@@ -4,49 +4,28 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var context = require('../context.js');
-var constants = require('../constants.js');
 var css_classes = require('../css_classes.js');
-var colorLabelInput = require('./color-label-input.js');
-var index = require('../../../../../../external/react-best-gradient-color-picker/dist/esm/components/index.js');
 var main_module = require('../../../css/color_picker_new/main.module.less.js');
-var colorPickerFooter = require('./color-picker-footer.js');
+var index = require('../../../../../../external/react-best-gradient-color-picker/dist/esm/components/index.js');
+var constants = require('../constants.js');
+var colorPickerShades = require('./color-picker-shades.js');
 var colorPickerHeader = require('./color-picker-header.js');
 var colorPickerInputs = require('./color-picker-inputs/color-picker-inputs.js');
-var colorPickerSwatch = require('./color-picker-swatch.js');
-var colorPickerShades = require('./color-picker-shades.js');
 var colorPickerVariables = require('./color-picker-variables.js');
-var dropdown = require('../../dropdown/components/dropdown.js');
+var colorPickerFooter = require('./color-picker-footer.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var ColorPickerNewPure = function ColorPickerNewPure(_ref) {
-  var id = _ref.id,
-      name = _ref.name,
-      colorVariables = _ref.colorVariables;
-
+var ColorPickerContent = function ColorPickerContent() {
   var _useContext = React.useContext(context.ColorPickerNewContext),
       color = _useContext.color,
-      setColor = _useContext.setColor;
+      setColor = _useContext.setColor,
+      colorVariables = _useContext.colorVariables;
 
   var colorValue = typeof color === 'string' ? color : color.value;
-  return /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "".concat(main_module['default'][css_classes.cssColorPicker])
-  }, /*#__PURE__*/React__default['default'].createElement(dropdown['default'], null, /*#__PURE__*/React__default['default'].createElement(dropdown['default'].CustomLabel, null, /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "".concat(main_module['default'][css_classes.cssColorPickerInputContainer])
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "".concat(main_module['default'][css_classes.cssColorPickerInputColorSwatchContainer])
-  }, /*#__PURE__*/React__default['default'].createElement(colorPickerSwatch.ColorPickerSwatch, {
-    color: colorValue
-  })), /*#__PURE__*/React__default['default'].createElement(colorLabelInput.ColorLabelInput, {
-    id: id,
-    name: name
-  }))), /*#__PURE__*/React__default['default'].createElement(dropdown['default'].Content, {
-    shouldCloseOnClickOutside: false,
-    shouldCloseOnScroll: false,
-    shouldCloseOthersOnOpen: true
-  }, /*#__PURE__*/React__default['default'].createElement(colorPickerHeader.ColorPickerHeader, null), /*#__PURE__*/React__default['default'].createElement("div", {
+  return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(colorPickerHeader.ColorPickerHeader, null), /*#__PURE__*/React__default['default'].createElement("div", {
     className: "".concat(main_module['default'][css_classes.cssColorPickerContainer])
   }, /*#__PURE__*/React__default['default'].createElement(index.ColorPicker, {
     value: colorValue,
@@ -62,8 +41,8 @@ var ColorPickerNewPure = function ColorPickerNewPure(_ref) {
     className: "".concat(main_module['default'][css_classes.cssColorPickerRbgcp])
   }), /*#__PURE__*/React__default['default'].createElement(colorPickerInputs.ColorPickerInputs, null), /*#__PURE__*/React__default['default'].createElement(colorPickerShades.ColorPickerShades, null), (colorVariables === null || colorVariables === void 0 ? void 0 : colorVariables.isVisible) && /*#__PURE__*/React__default['default'].createElement(colorPickerVariables.ColorPickerVariables, {
     variables: colorVariables.variables
-  })), /*#__PURE__*/React__default['default'].createElement(colorPickerFooter.ColorPickerFooter, null))));
+  })), /*#__PURE__*/React__default['default'].createElement(colorPickerFooter.ColorPickerFooter, null));
 };
 
-exports.default = ColorPickerNewPure;
-//# sourceMappingURL=pure-color-picker.js.map
+exports.ColorPickerContent = ColorPickerContent;
+//# sourceMappingURL=color_picker_content.js.map

package/build/cjs/packages/aurora/src/components/color_picker_new/components/{pure-color-picker.js.map → color_picker_content.js.map}

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,oBAAoB,0FAA8F;AAClH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,oBAAoB,0FAA8F;AAClH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/color_picker_new/components/pure_color_picker.js

@@ -0,0 +1,45 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var context = require('../context.js');
+var css_classes = require('../css_classes.js');
+var dropdown = require('../../dropdown/components/dropdown.js');
+var main_module = require('../../../css/color_picker_new/main.module.less.js');
+var colorPickerSwatch = require('./color-picker-swatch.js');
+var color_picker_content = require('./color_picker_content.js');
+var colorLabelInput = require('./color-label-input.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var ColorPickerNewPure = function ColorPickerNewPure(_ref) {
+  var id = _ref.id,
+      name = _ref.name;
+
+  var _useContext = React.useContext(context.ColorPickerNewContext),
+      color = _useContext.color;
+
+  var colorValue = typeof color === 'string' ? color : color.value;
+  return /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "".concat(main_module['default'][css_classes.cssColorPicker])
+  }, /*#__PURE__*/React__default['default'].createElement(dropdown['default'], null, /*#__PURE__*/React__default['default'].createElement(dropdown['default'].CustomLabel, null, /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "".concat(main_module['default'][css_classes.cssColorPickerInputContainer])
+  }, /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "".concat(main_module['default'][css_classes.cssColorPickerInputColorSwatchContainer])
+  }, /*#__PURE__*/React__default['default'].createElement(colorPickerSwatch.ColorPickerSwatch, {
+    color: colorValue
+  })), /*#__PURE__*/React__default['default'].createElement(colorLabelInput.ColorLabelInput, {
+    id: id,
+    name: name
+  }))), /*#__PURE__*/React__default['default'].createElement(dropdown['default'].MemoizedContent, {
+    shouldCloseOnClickOutside: false,
+    shouldCloseOnScroll: false,
+    shouldCloseOthersOnOpen: true
+  }, /*#__PURE__*/React__default['default'].createElement(color_picker_content.ColorPickerContent, null))));
+};
+
+exports.default = ColorPickerNewPure;
+//# sourceMappingURL=pure_color_picker.js.map

package/build/cjs/packages/aurora/src/components/color_picker_new/components/pure_color_picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/color_picker_new/hooks/use_color_picker.js

@@ -4,8 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
-var constants = require('../constants.js');
 var useColorPicker$1 = require('../../../../../../external/react-best-gradient-color-picker/dist/esm/hooks/useColorPicker.js');
+var constants = require('../constants.js');
 var color_picker_utils = require('../color_picker_utils.js');
 
 var useColorPicker = function useColorPicker(_ref) {
@@ -14,7 +14,8 @@ var useColorPicker = function useColorPicker(_ref) {
   var initialColor = _ref.initialColor,
       onChange = _ref.onChange,
       onCancel = _ref.onCancel,
-      onSave = _ref.onSave;
+      onSave = _ref.onSave,
+      initialColorVariables = _ref.colorVariables;
 
   var _useState = React.useState({
     value: initialColor ? color_picker_utils.ColorPickerUtils.getTinyColorInstance(typeof initialColor === 'string' ? initialColor : initialColor === null || initialColor === void 0 ? void 0 : initialColor.value).toHex8() : constants.COLOR_PICKER_INITIAL_STATE,
@@ -24,6 +25,10 @@ var useColorPicker = function useColorPicker(_ref) {
       color = _useState2[0],
       setColorValue = _useState2[1];
 
+  var _useState3 = React.useState(initialColorVariables),
+      _useState4 = _rollupPluginBabelHelpers.slicedToArray(_useState3, 1),
+      colorVariables = _useState4[0];
+
   var setColor = function setColor(color) {
     var hexColor = color_picker_utils.ColorPickerUtils.getTinyColorInstance(typeof color === 'string' ? color : color.value).toHex8();
     setColorValue(function (prevColor) {
@@ -39,12 +44,12 @@ var useColorPicker = function useColorPicker(_ref) {
   React.useEffect(function () {
     if (!initialColor) return;
     setColor(initialColor);
-  }, [initialColor]);
+  }, []);
 
-  var _useState3 = React.useState(color),
-      _useState4 = _rollupPluginBabelHelpers.slicedToArray(_useState3, 2),
-      choosenColor = _useState4[0],
-      setChoosenColor = _useState4[1];
+  var _useState5 = React.useState(color),
+      _useState6 = _rollupPluginBabelHelpers.slicedToArray(_useState5, 2),
+      choosenColor = _useState6[0],
+      setChoosenColor = _useState6[1];
 
   var _useBestGradientColor = useColorPicker$1.useColorPicker(typeof color === 'string' ? color : color.value, setColor),
       hslArr = _useBestGradientColor.hslArr,
@@ -57,15 +62,15 @@ var useColorPicker = function useColorPicker(_ref) {
   var tinyColor = typeof color === 'string' ? color_picker_utils.ColorPickerUtils.getTinyColorInstance(color) : color_picker_utils.ColorPickerUtils.getTinyColorInstance(color.value);
   var hex = color_picker_utils.ColorPickerUtils.getHexValue(tinyColor);
 
-  var _useState5 = React.useState(rgbaArr[3] * 100),
-      _useState6 = _rollupPluginBabelHelpers.slicedToArray(_useState5, 2),
-      alpha = _useState6[0],
-      setAlpha = _useState6[1];
-
-  var _useState7 = React.useState("".concat(alpha)),
+  var _useState7 = React.useState(rgbaArr[3] * 100),
       _useState8 = _rollupPluginBabelHelpers.slicedToArray(_useState7, 2),
-      alphaValue = _useState8[0],
-      setAlphaValue = _useState8[1];
+      alpha = _useState8[0],
+      setAlpha = _useState8[1];
+
+  var _useState9 = React.useState("".concat(alpha)),
+      _useState10 = _rollupPluginBabelHelpers.slicedToArray(_useState9, 2),
+      alphaValue = _useState10[0],
+      setAlphaValue = _useState10[1];
 
   var handleOnChangeAlpha = function handleOnChangeAlpha(event) {
     changeAlphaValue(Number(event.target.value));
@@ -112,7 +117,8 @@ var useColorPicker = function useColorPicker(_ref) {
     setB: setB,
     handleCancel: handleCancel,
     handleSave: handleSave,
-    handlePickSwatch: handlePickSwatch
+    handlePickSwatch: handlePickSwatch,
+    colorVariables: colorVariables
   };
 };
 

package/build/cjs/packages/aurora/src/components/color_picker_new/hooks/use_color_picker.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,+BAA+B,8FAAkG;AACjI;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA,+BAA+B,8FAAkG;AACjI;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/color_picker_new/index.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var context = require('./context.js');
-var pureColorPicker = require('./components/pure-color-picker.js');
+var pure_color_picker = require('./components/pure_color_picker.js');
 var use_color_picker = require('./hooks/use_color_picker.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -21,6 +21,7 @@ var ColorPickerNewWithContext = function ColorPickerNewWithContext(_ref) {
       onSave = _ref.onSave;
 
   var _useColorPicker = use_color_picker['default']({
+    colorVariables: colorVariables,
     initialColor: initialColor,
     onChange: onChange,
     onCancel: onCancel,
@@ -54,12 +55,13 @@ var ColorPickerNewWithContext = function ColorPickerNewWithContext(_ref) {
       setB: setB,
       handleCancel: handleCancel,
       handleSave: handleSave,
+      colorVariables: colorVariables,
       handlePickSwatch: handlePickSwatch
     };
-  }, [color, setColor, hex, hslArr, handleOnChangeAlpha, alphaValue, rgbaArr, setR, setG, setB, handleCancel, handleSave, handlePickSwatch]);
+  }, [color, setColor, hex, hslArr, handleOnChangeAlpha, alphaValue, rgbaArr, setR, setG, setB, handleCancel, handleSave, handlePickSwatch, colorVariables]);
   return /*#__PURE__*/React__default['default'].createElement(context.ColorPickerNewContext.Provider, {
     value: value
-  }, /*#__PURE__*/React__default['default'].createElement(pureColorPicker['default'], {
+  }, /*#__PURE__*/React__default['default'].createElement(pure_color_picker['default'], {
     id: id,
     name: name,
     colorVariables: colorVariables

package/build/cjs/packages/aurora/src/components/color_picker_new/index.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/dropdown/components/content.js

@@ -12,7 +12,6 @@ var index = require('../context/index.js');
 var responsive_breakpoints = require('../../../constants/responsive_breakpoints.js');
 var use_screen_detect = require('../../../hooks/use_screen_detect.js');
 var with_translation = require('../../../utilities/translation/with_translation.js');
-var utilities$1 = require('@dreamcommerce/utilities');
 var reactTransitionGroup = require('react-transition-group');
 var constants = require('../constants.js');
 var css_classes = require('../css_classes.js');
@@ -20,12 +19,11 @@ var main_module = require('../../../css/dropdown/main.module.less.js');
 var utilities = require('../utilities.js');
 var use_click_outside = require('../../../hooks/use_click_outside.js');
 var icon_arrow = require('../../../assets/icon_arrow.js');
+var utilities$1 = require('@dreamcommerce/utilities');
 var main_module$1 = require('../../../css/hint/main.module.less.js');
 var main_module$2 = require('../../../css/tooltip/main.module.less.js');
 var use_dropdowns_manager_context = require('../hooks/use_dropdowns_manager_context.js');
 var v4 = require('../../../../../../external/uuid/dist/esm-browser/v4.js');
-var isEqual = require('../../../../../../external/lodash/isEqual.js');
-var omit = require('../../../../../../external/lodash/omit.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -274,9 +272,7 @@ var Content = function Content(_ref) {
   }, headerGoBackText !== null && headerGoBackText !== void 0 ? headerGoBackText : t('Go back'))))), children)) : null), (portalContainer === null || portalContainer === void 0 ? void 0 : portalContainer.current) || document.body);
 };
 
-var Content$1 = /*#__PURE__*/React__default['default'].memo(with_translation['default'](Content), function (prev, curr) {
-  return isEqual['default'](omit['default'](prev, ['children']), omit['default'](prev, ['children']));
-});
+var Content$1 = with_translation['default'](Content);
 
 exports.default = Content$1;
 //# sourceMappingURL=content.js.map

package/build/cjs/packages/aurora/src/components/dropdown/components/content.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,6BAA6B,oEAAwE;AACrG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiB,wDAA4D;AAC7E,sBAAsB,8CAAkD;AACxE,mBAAmB,2CAA+C;AAClE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,6BAA6B,oEAAwE;AACrG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiB,wDAA4D;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/dropdown/components/dropdown.js

@@ -20,6 +20,7 @@ var use_toggle = require('../hooks/use_toggle.js');
 var option_multiple = require('./option_multiple.js');
 var search = require('./search.js');
 var select = require('./select.js');
+var memoized_content = require('./memoized_content.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -85,6 +86,7 @@ var Dropdown = function Dropdown(_ref) {
 
 Dropdown.Select = select['default'];
 Dropdown.Content = content['default'];
+Dropdown.MemoizedContent = memoized_content.MemoizedContent;
 Dropdown.ItemWithHover = item_with_hover['default'];
 Dropdown.Search = search['default'];
 Dropdown.List = list['default'];

package/build/cjs/packages/aurora/src/components/dropdown/components/dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/dropdown/components/memoized_content.js

@@ -0,0 +1,23 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
+var content = require('./content.js');
+var isEqual = require('../../../../../../external/lodash/isEqual.js');
+var omit = require('../../../../../../external/lodash/omit.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var MemoizedContent = /*#__PURE__*/React__default['default'].memo(function (props) {
+  return /*#__PURE__*/React__default['default'].createElement(content['default'], _rollupPluginBabelHelpers.objectSpread2({}, props));
+}, function (prev, curr) {
+  return isEqual['default'](omit['default'](prev, ['children']), omit['default'](curr, ['children']));
+});
+MemoizedContent.displayName;
+
+exports.MemoizedContent = MemoizedContent;
+//# sourceMappingURL=memoized_content.js.map

package/build/cjs/packages/aurora/src/components/dropdown/components/memoized_content.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,sBAAsB,8CAAkD;AACxE,mBAAmB,2CAA+C;AAClE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/dropdown/components/select.js

@@ -6,10 +6,10 @@ var React = require('react');
 var index = require('../context/index.js');
 var css_classes = require('../../controls/css_classes.js');
 var main_module$1 = require('../../../css/input/main.module.less.js');
-var icon_close = require('../../../assets/icon_close.js');
 var main_module = require('../../../css/dropdown/main.module.less.js');
 var utilities = require('../utilities.js');
 var use_keyboard_open_close = require('../hooks/use_keyboard_open_close.js');
+var icon_close = require('../../../assets/icon_close.js');
 var input_wrapper = require('../../controls/components/input_wrapper.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

package/build/cjs/packages/aurora/src/components/flash_messenger/components/flash_message.js

@@ -4,8 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var index$1 = require('../../stack/index.js');
-var icon_close = require('../../../assets/icon_close.js');
 var reactTransitionGroup = require('react-transition-group');
+var icon_close = require('../../../assets/icon_close.js');
 var main_module = require('../../../css/flash_message/main.module.less.js');
 var context = require('../context.js');
 var index = require('../../message-box/index.js');

package/build/cjs/packages/aurora/src/components/tree/components/tree_node.js

@@ -5,8 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
 var classnames = require('classnames');
-var icon_list_arrow_down = require('../../../assets/icon_list_arrow_down.js');
 var reactTransitionGroup = require('react-transition-group');
+var icon_list_arrow_down = require('../../../assets/icon_list_arrow_down.js');
 var css_classes = require('../css_classes.js');
 var main_module = require('../../../css/tree/main.module.less.js');
 var tree_hook = require('../hooks/tree_hook.js');

package/build/cjs/packages/aurora/src/index.js

@@ -10,7 +10,6 @@ var index$1 = require('./components/button/index.js');
 var index$3 = require('./components/buttons_group/index.js');
 var index$B = require('./components/dropdown/context/index.js');
 var index$j = require('./components/color_picker/index.js');
-var color_picker_utils = require('./components/color_picker_new/color_picker_utils.js');
 var use_click_outside = require('./hooks/use_click_outside.js');
 var icon_arrow = require('./assets/icon_arrow.js');
 var icon_tick = require('./assets/icon_tick.js');
@@ -20,6 +19,7 @@ var use_toggle = require('./components/dropdown/hooks/use_toggle.js');
 var index$H = require('./components/hint/index.js');
 var index$a = require('./components/controls/hoc/control_checkbox/index.js');
 var dropdown = require('./components/dropdown/components/dropdown.js');
+var color_picker_utils = require('./components/color_picker_new/color_picker_utils.js');
 var index$k = require('./components/color_picker_new/index.js');
 var index$G = require('./components/controls/hoc/control_cell_selector/index.js');
 var index$b = require('./components/controls/hoc/control_checkbox_switch/index.js');
@@ -106,7 +106,6 @@ exports.ButtonsGroup = index$3['default'];
 exports.DropdownContext = index$B.DropdownContext;
 exports.useDropdownContext = index$B.useDropdownContext;
 exports.ColorPicker = index$j['default'];
-exports.ColorPickerUtils = color_picker_utils.ColorPickerUtils;
 exports.useClickOutside = use_click_outside.useClickOutside;
 exports.IconArrow = icon_arrow['default'];
 exports.IconTick = icon_tick['default'];
@@ -116,6 +115,7 @@ exports.useToggle = use_toggle.useToggle;
 exports.Hint = index$H['default'];
 exports.ControlCheckbox = index$a['default'];
 exports.Dropdown = dropdown['default'];
+exports.ColorPickerUtils = color_picker_utils.ColorPickerUtils;
 exports.ColorPickerNew = index$k['default'];
 exports.ControlCellSelector = index$G['default'];
 exports.ControlCheckboxSwitch = index$b['default'];

package/build/esm/packages/aurora/src/components/color_picker_new/components/color-picker-footer.js

@@ -5,8 +5,8 @@ import Button from '../../button/index.js';
 import { DropdownContext } from '../../dropdown/context/index.js';
 import { ColorPickerNewContext } from '../context.js';
 import { cssColorPickerFooter } from '../css_classes.js';
-import { ColorPickerUtils } from '../color_picker_utils.js';
 import styles from '../../../css/color_picker_new/main.module.less.js';
+import { ColorPickerUtils } from '../color_picker_utils.js';
 
 var ColorPickerFooter = function ColorPickerFooter() {
   var _useContext = useContext(DropdownContext),

package/build/esm/packages/aurora/src/components/color_picker_new/components/color-picker-header.js

@@ -4,8 +4,8 @@ import { slicedToArray as _slicedToArray } from '../../../../../../_virtual/_rol
 import { DropdownContext } from '../../dropdown/context/index.js';
 import { ColorPickerNewContext } from '../context.js';
 import { cssColorPickerHeader, cssColorPickerCloseIcon } from '../css_classes.js';
-import styles from '../../../css/color_picker_new/main.module.less.js';
 import IconClose from '../../../assets/icon_close.js';
+import styles from '../../../css/color_picker_new/main.module.less.js';
 
 var ColorPickerHeader = function ColorPickerHeader() {
   var _useContext = useContext(ColorPickerNewContext),

package/build/esm/packages/aurora/src/components/color_picker_new/components/color-picker-inputs/color-picker-inputs-hex.js

@@ -2,8 +2,8 @@ import React, { useContext, useState, useEffect } from 'react';
 import { slicedToArray as _slicedToArray } from '../../../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import Input from '../../../controls/components/input.js';
 import { ColorPickerNewContext } from '../../context.js';
-import { ColorPickerUtils } from '../../color_picker_utils.js';
 import { InputUtils } from '@dreamcommerce/utilities';
+import { ColorPickerUtils } from '../../color_picker_utils.js';
 
 var ColorPickerInputsHex = function ColorPickerInputsHex() {
   var _useContext = useContext(ColorPickerNewContext),

package/build/esm/packages/aurora/src/components/color_picker_new/components/color-picker-inputs/color-picker-inputs.js

@@ -1,8 +1,8 @@
 import React, { useState } from 'react';
 import { slicedToArray as _slicedToArray } from '../../../../../../../_virtual/_rollupPluginBabelHelpers.js';
-import { COLOR_PICKER_TYPES } from '../../constants.js';
 import { cssColorPickerInputs, cssColorPickerInputsType, cssColorPickerInputsValue, cssColorPickerInputsValueContainer } from '../../css_classes.js';
 import styles from '../../../../css/color_picker_new/main.module.less.js';
+import { COLOR_PICKER_TYPES } from '../../constants.js';
 import { ColorPickerInputsHex } from './color-picker-inputs-hex.js';
 import { ColorPickerInputsRgba } from './color-picker-inputs-rgba.js';
 

package/build/esm/packages/aurora/src/components/color_picker_new/components/color-picker-shades.js

@@ -3,8 +3,8 @@ import { useTranslation } from '../../../../../../external/react-i18next/dist/es
 import { slicedToArray as _slicedToArray } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { ColorPickerNewContext } from '../context.js';
 import { cssColorPickerSwatches, cssColorPickerSwatchesHeader, cssColorPickerSwatchesContent } from '../css_classes.js';
-import { ColorPickerUtils } from '../color_picker_utils.js';
 import styles from '../../../css/color_picker_new/main.module.less.js';
+import { ColorPickerUtils } from '../color_picker_utils.js';
 import { ColorPickerSwatch } from './color-picker-swatch.js';
 
 var ColorPickerShades = function ColorPickerShades() {

package/build/esm/packages/aurora/src/components/color_picker_new/components/color-picker-swatch.js

@@ -1,10 +1,10 @@
 import React from 'react';
 import { defineProperty as _defineProperty } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import classnames from 'classnames';
-import { COLOR_PICKER_SWATCH_SIZES } from '../constants.js';
 import { cssColorPickerSwatch, cssColorPickerSwatchBig, cssColorPickerSwatchSmall, cssColorPickerSwatchFill } from '../css_classes.js';
-import { ColorPickerUtils } from '../color_picker_utils.js';
 import styles from '../../../css/color_picker_new/main.module.less.js';
+import { COLOR_PICKER_SWATCH_SIZES } from '../constants.js';
+import { ColorPickerUtils } from '../color_picker_utils.js';
 
 var ColorPickerSwatch = function ColorPickerSwatch(_ref) {
   var color = _ref.color,

package/build/esm/packages/aurora/src/components/color_picker_new/components/color-picker-variables.js

@@ -3,8 +3,8 @@ import { useTranslation } from '../../../../../../external/react-i18next/dist/es
 import { slicedToArray as _slicedToArray, toConsumableArray as _toConsumableArray } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { ColorPickerNewContext } from '../context.js';
 import { cssColorPickerSwatches, cssColorPickerSwatchesHeader, cssColorPickerSwatchesHeaderIcon, cssColorPickerSwatchesHeaderIconRotate, cssColorPickerSwatchesContent, cssColorPickerSwatchesSubContent } from '../css_classes.js';
-import { ColorPickerUtils } from '../color_picker_utils.js';
 import styles from '../../../css/color_picker_new/main.module.less.js';
+import { ColorPickerUtils } from '../color_picker_utils.js';
 import { ColorPickerSwatch } from './color-picker-swatch.js';
 import { IconListArrowDown } from '../../../assets/icon_list_arrow_down.js';
 

package/build/esm/packages/aurora/src/components/color_picker_new/components/color_picker_content.d.ts

@@ -0,0 +1 @@
+export declare const ColorPickerContent: () => JSX.Element;

package/build/esm/packages/aurora/src/components/color_picker_new/components/{pure-color-picker.js → color_picker_content.js}

@@ -1,44 +1,23 @@
 import React, { useContext } from 'react';
 import { ColorPickerNewContext } from '../context.js';
-import { COLOR_PICKER_WIDTH, COLOR_PICKER_HEIGHT } from '../constants.js';
-import { cssColorPicker, cssColorPickerInputContainer, cssColorPickerInputColorSwatchContainer, cssColorPickerContainer, cssColorPickerRbgcp } from '../css_classes.js';
-import { ColorLabelInput } from './color-label-input.js';
-import { ColorPicker } from '../../../../../../external/react-best-gradient-color-picker/dist/esm/components/index.js';
+import { cssColorPickerContainer, cssColorPickerRbgcp } from '../css_classes.js';
 import styles from '../../../css/color_picker_new/main.module.less.js';
-import { ColorPickerFooter } from './color-picker-footer.js';
+import { ColorPicker } from '../../../../../../external/react-best-gradient-color-picker/dist/esm/components/index.js';
+import { COLOR_PICKER_WIDTH, COLOR_PICKER_HEIGHT } from '../constants.js';
+import { ColorPickerShades } from './color-picker-shades.js';
 import { ColorPickerHeader } from './color-picker-header.js';
 import { ColorPickerInputs } from './color-picker-inputs/color-picker-inputs.js';
-import { ColorPickerSwatch } from './color-picker-swatch.js';
-import { ColorPickerShades } from './color-picker-shades.js';
 import { ColorPickerVariables } from './color-picker-variables.js';
-import Dropdown from '../../dropdown/components/dropdown.js';
-
-var ColorPickerNewPure = function ColorPickerNewPure(_ref) {
-  var id = _ref.id,
-      name = _ref.name,
-      colorVariables = _ref.colorVariables;
+import { ColorPickerFooter } from './color-picker-footer.js';
 
+var ColorPickerContent = function ColorPickerContent() {
   var _useContext = useContext(ColorPickerNewContext),
       color = _useContext.color,
-      setColor = _useContext.setColor;
+      setColor = _useContext.setColor,
+      colorVariables = _useContext.colorVariables;
 
   var colorValue = typeof color === 'string' ? color : color.value;
-  return /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles[cssColorPicker])
-  }, /*#__PURE__*/React.createElement(Dropdown, null, /*#__PURE__*/React.createElement(Dropdown.CustomLabel, null, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles[cssColorPickerInputContainer])
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles[cssColorPickerInputColorSwatchContainer])
-  }, /*#__PURE__*/React.createElement(ColorPickerSwatch, {
-    color: colorValue
-  })), /*#__PURE__*/React.createElement(ColorLabelInput, {
-    id: id,
-    name: name
-  }))), /*#__PURE__*/React.createElement(Dropdown.Content, {
-    shouldCloseOnClickOutside: false,
-    shouldCloseOnScroll: false,
-    shouldCloseOthersOnOpen: true
-  }, /*#__PURE__*/React.createElement(ColorPickerHeader, null), /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ColorPickerHeader, null), /*#__PURE__*/React.createElement("div", {
     className: "".concat(styles[cssColorPickerContainer])
   }, /*#__PURE__*/React.createElement(ColorPicker, {
     value: colorValue,
@@ -54,8 +33,8 @@ var ColorPickerNewPure = function ColorPickerNewPure(_ref) {
     className: "".concat(styles[cssColorPickerRbgcp])
   }), /*#__PURE__*/React.createElement(ColorPickerInputs, null), /*#__PURE__*/React.createElement(ColorPickerShades, null), (colorVariables === null || colorVariables === void 0 ? void 0 : colorVariables.isVisible) && /*#__PURE__*/React.createElement(ColorPickerVariables, {
     variables: colorVariables.variables
-  })), /*#__PURE__*/React.createElement(ColorPickerFooter, null))));
+  })), /*#__PURE__*/React.createElement(ColorPickerFooter, null));
 };
 
-export default ColorPickerNewPure;
-//# sourceMappingURL=pure-color-picker.js.map
+export { ColorPickerContent };
+//# sourceMappingURL=color_picker_content.js.map

package/build/esm/packages/aurora/src/components/color_picker_new/components/color_picker_content.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,4BAA4B,0FAA8F;AAC1H;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/color_picker_new/components/pure_color_picker.js

@@ -0,0 +1,37 @@
+import React, { useContext } from 'react';
+import { ColorPickerNewContext } from '../context.js';
+import { cssColorPicker, cssColorPickerInputContainer, cssColorPickerInputColorSwatchContainer } from '../css_classes.js';
+import Dropdown from '../../dropdown/components/dropdown.js';
+import styles from '../../../css/color_picker_new/main.module.less.js';
+import { ColorPickerSwatch } from './color-picker-swatch.js';
+import { ColorPickerContent } from './color_picker_content.js';
+import { ColorLabelInput } from './color-label-input.js';
+
+var ColorPickerNewPure = function ColorPickerNewPure(_ref) {
+  var id = _ref.id,
+      name = _ref.name;
+
+  var _useContext = useContext(ColorPickerNewContext),
+      color = _useContext.color;
+
+  var colorValue = typeof color === 'string' ? color : color.value;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles[cssColorPicker])
+  }, /*#__PURE__*/React.createElement(Dropdown, null, /*#__PURE__*/React.createElement(Dropdown.CustomLabel, null, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles[cssColorPickerInputContainer])
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles[cssColorPickerInputColorSwatchContainer])
+  }, /*#__PURE__*/React.createElement(ColorPickerSwatch, {
+    color: colorValue
+  })), /*#__PURE__*/React.createElement(ColorLabelInput, {
+    id: id,
+    name: name
+  }))), /*#__PURE__*/React.createElement(Dropdown.MemoizedContent, {
+    shouldCloseOnClickOutside: false,
+    shouldCloseOnScroll: false,
+    shouldCloseOthersOnOpen: true
+  }, /*#__PURE__*/React.createElement(ColorPickerContent, null))));
+};
+
+export default ColorPickerNewPure;
+//# sourceMappingURL=pure_color_picker.js.map

package/build/esm/packages/aurora/src/components/color_picker_new/components/pure_color_picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/color_picker_new/hooks/use_color_picker.d.ts

@@ -1,11 +1,12 @@
-import { ColorPickerColorTypes, ColorPickerVariable, IColorPickerColor } from '../types';
+import { ColorPickerColorTypes, ColorPickerVariable, IColorPickerColor, IColorPickerColorVariables } from '../types';
 export declare type ColorPickerHookProps = {
     initialColor?: ColorPickerColorTypes['hex'] | ColorPickerVariable;
     onChange?: (color: IColorPickerColor) => void;
     onCancel?: () => void;
     onSave?: (color: IColorPickerColor) => void;
+    colorVariables?: IColorPickerColorVariables;
 };
-declare const useColorPicker: ({ initialColor, onChange, onCancel, onSave }: ColorPickerHookProps) => {
+declare const useColorPicker: ({ initialColor, onChange, onCancel, onSave, colorVariables: initialColorVariables }: ColorPickerHookProps) => {
     color: ColorPickerVariable;
     setColor: (color: ColorPickerColorTypes['hex'] | ColorPickerVariable) => void;
     hex: string;
@@ -19,5 +20,6 @@ declare const useColorPicker: ({ initialColor, onChange, onCancel, onSave }: Col
     handleCancel: () => void;
     handleSave: () => void;
     handlePickSwatch: (color: ColorPickerColorTypes['hex'] | ColorPickerVariable) => void;
+    colorVariables: IColorPickerColorVariables | undefined;
 };
 export default useColorPicker;

package/build/esm/packages/aurora/src/components/color_picker_new/hooks/use_color_picker.js

@@ -1,7 +1,7 @@
 import { useState, useEffect } from 'react';
 import { slicedToArray as _slicedToArray } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
-import { COLOR_PICKER_INITIAL_STATE, COLOR_PICKER_ALPHA_MAX_VALUE } from '../constants.js';
 import { useColorPicker as useColorPicker$1 } from '../../../../../../external/react-best-gradient-color-picker/dist/esm/hooks/useColorPicker.js';
+import { COLOR_PICKER_INITIAL_STATE, COLOR_PICKER_ALPHA_MAX_VALUE } from '../constants.js';
 import { ColorPickerUtils } from '../color_picker_utils.js';
 
 var useColorPicker = function useColorPicker(_ref) {
@@ -10,7 +10,8 @@ var useColorPicker = function useColorPicker(_ref) {
   var initialColor = _ref.initialColor,
       onChange = _ref.onChange,
       onCancel = _ref.onCancel,
-      onSave = _ref.onSave;
+      onSave = _ref.onSave,
+      initialColorVariables = _ref.colorVariables;
 
   var _useState = useState({
     value: initialColor ? ColorPickerUtils.getTinyColorInstance(typeof initialColor === 'string' ? initialColor : initialColor === null || initialColor === void 0 ? void 0 : initialColor.value).toHex8() : COLOR_PICKER_INITIAL_STATE,
@@ -20,6 +21,10 @@ var useColorPicker = function useColorPicker(_ref) {
       color = _useState2[0],
       setColorValue = _useState2[1];
 
+  var _useState3 = useState(initialColorVariables),
+      _useState4 = _slicedToArray(_useState3, 1),
+      colorVariables = _useState4[0];
+
   var setColor = function setColor(color) {
     var hexColor = ColorPickerUtils.getTinyColorInstance(typeof color === 'string' ? color : color.value).toHex8();
     setColorValue(function (prevColor) {
@@ -35,12 +40,12 @@ var useColorPicker = function useColorPicker(_ref) {
   useEffect(function () {
     if (!initialColor) return;
     setColor(initialColor);
-  }, [initialColor]);
+  }, []);
 
-  var _useState3 = useState(color),
-      _useState4 = _slicedToArray(_useState3, 2),
-      choosenColor = _useState4[0],
-      setChoosenColor = _useState4[1];
+  var _useState5 = useState(color),
+      _useState6 = _slicedToArray(_useState5, 2),
+      choosenColor = _useState6[0],
+      setChoosenColor = _useState6[1];
 
   var _useBestGradientColor = useColorPicker$1(typeof color === 'string' ? color : color.value, setColor),
       hslArr = _useBestGradientColor.hslArr,
@@ -53,15 +58,15 @@ var useColorPicker = function useColorPicker(_ref) {
   var tinyColor = typeof color === 'string' ? ColorPickerUtils.getTinyColorInstance(color) : ColorPickerUtils.getTinyColorInstance(color.value);
   var hex = ColorPickerUtils.getHexValue(tinyColor);
 
-  var _useState5 = useState(rgbaArr[3] * 100),
-      _useState6 = _slicedToArray(_useState5, 2),
-      alpha = _useState6[0],
-      setAlpha = _useState6[1];
-
-  var _useState7 = useState("".concat(alpha)),
+  var _useState7 = useState(rgbaArr[3] * 100),
       _useState8 = _slicedToArray(_useState7, 2),
-      alphaValue = _useState8[0],
-      setAlphaValue = _useState8[1];
+      alpha = _useState8[0],
+      setAlpha = _useState8[1];
+
+  var _useState9 = useState("".concat(alpha)),
+      _useState10 = _slicedToArray(_useState9, 2),
+      alphaValue = _useState10[0],
+      setAlphaValue = _useState10[1];
 
   var handleOnChangeAlpha = function handleOnChangeAlpha(event) {
     changeAlphaValue(Number(event.target.value));
@@ -108,7 +113,8 @@ var useColorPicker = function useColorPicker(_ref) {
     setB: setB,
     handleCancel: handleCancel,
     handleSave: handleSave,
-    handlePickSwatch: handlePickSwatch
+    handlePickSwatch: handlePickSwatch,
+    colorVariables: colorVariables
   };
 };
 

package/build/esm/packages/aurora/src/components/color_picker_new/hooks/use_color_picker.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA,mDAAmD,8FAAkG;AACrJ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA,mDAAmD,8FAAkG;AACrJ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/color_picker_new/index.js

@@ -1,6 +1,6 @@
 import React, { useMemo } from 'react';
 import { ColorPickerNewContext } from './context.js';
-import ColorPickerNewPure from './components/pure-color-picker.js';
+import ColorPickerNewPure from './components/pure_color_picker.js';
 import useColorPicker from './hooks/use_color_picker.js';
 
 var ColorPickerNewWithContext = function ColorPickerNewWithContext(_ref) {
@@ -13,6 +13,7 @@ var ColorPickerNewWithContext = function ColorPickerNewWithContext(_ref) {
       onSave = _ref.onSave;
 
   var _useColorPicker = useColorPicker({
+    colorVariables: colorVariables,
     initialColor: initialColor,
     onChange: onChange,
     onCancel: onCancel,
@@ -46,9 +47,10 @@ var ColorPickerNewWithContext = function ColorPickerNewWithContext(_ref) {
       setB: setB,
       handleCancel: handleCancel,
       handleSave: handleSave,
+      colorVariables: colorVariables,
       handlePickSwatch: handlePickSwatch
     };
-  }, [color, setColor, hex, hslArr, handleOnChangeAlpha, alphaValue, rgbaArr, setR, setG, setB, handleCancel, handleSave, handlePickSwatch]);
+  }, [color, setColor, hex, hslArr, handleOnChangeAlpha, alphaValue, rgbaArr, setR, setG, setB, handleCancel, handleSave, handlePickSwatch, colorVariables]);
   return /*#__PURE__*/React.createElement(ColorPickerNewContext.Provider, {
     value: value
   }, /*#__PURE__*/React.createElement(ColorPickerNewPure, {

package/build/esm/packages/aurora/src/components/color_picker_new/index.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/color_picker_new/types.d.ts

@@ -38,6 +38,7 @@ export interface IColorPickerNewContextProps {
     handleCancel: () => void;
     handleSave: (color: IColorPickerColor) => void;
     handlePickSwatch: (color: string | ColorPickerVariable) => void;
+    colorVariables?: IColorPickerColorVariables;
 }
 export declare type ColorPickerColorTypes = {
     hex: string;

package/build/esm/packages/aurora/src/components/dropdown/components/content.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { IDropdownContentProps } from '../types';
-declare const _default: React.NamedExoticComponent<IDropdownContentProps>;
+declare const _default: React.FC<IDropdownContentProps>;
 export default _default;

package/build/esm/packages/aurora/src/components/dropdown/components/content.js

@@ -8,7 +8,6 @@ import { useDropdownContext } from '../context/index.js';
 import { SCREEN_XS } from '../../../constants/responsive_breakpoints.js';
 import { useScreenDetect } from '../../../hooks/use_screen_detect.js';
 import withTranslation from '../../../utilities/translation/with_translation.js';
-import { UiDomUtils } from '@dreamcommerce/utilities';
 import { TransitionGroup, CSSTransition } from 'react-transition-group';
 import { DROPDOWN_Z_INDEX, DROPDOWN_CONTENT_ARROW_HEIGHT, DROPDOWN_ON_MODAL_Z_INDEX } from '../constants.js';
 import { jsDropdownContentClass, cssDropdownContent, cssDropdownContentOnTop, cssDropdownContentOnBottom, cssDropdownArrowHorizontalDirectionRight, cssDropdownArrowVerticalDirectionBottom, cssDropdownHeader, cssDropdownHeaderContent, cssDropdownHeaderTitle } from '../css_classes.js';
@@ -16,12 +15,11 @@ import cssClasses from '../../../css/dropdown/main.module.less.js';
 import { getBounding, getXYModifiersForNestedDropdowns, isChildOfModal } from '../utilities.js';
 import { useClickOutside } from '../../../hooks/use_click_outside.js';
 import IconArrow from '../../../assets/icon_arrow.js';
+import { UiDomUtils } from '@dreamcommerce/utilities';
 import cssClasses$1 from '../../../css/hint/main.module.less.js';
 import cssClasses$2 from '../../../css/tooltip/main.module.less.js';
 import { useDropdownsManagerContext } from '../hooks/use_dropdowns_manager_context.js';
 import v4 from '../../../../../../external/uuid/dist/esm-browser/v4.js';
-import isEqual_1 from '../../../../../../external/lodash/isEqual.js';
-import omit_1 from '../../../../../../external/lodash/omit.js';
 
 /**
  * Dropdown.Content component. This togglable part of dropdown.
@@ -265,9 +263,7 @@ var Content = function Content(_ref) {
   }, headerGoBackText !== null && headerGoBackText !== void 0 ? headerGoBackText : t('Go back'))))), children)) : null), (portalContainer === null || portalContainer === void 0 ? void 0 : portalContainer.current) || document.body);
 };
 
-var Content$1 = /*#__PURE__*/React.memo(withTranslation(Content), function (prev, curr) {
-  return isEqual_1(omit_1(prev, ['children']), omit_1(prev, ['children']));
-});
+var Content$1 = withTranslation(Content);
 
 export default Content$1;
 //# sourceMappingURL=content.js.map

package/build/esm/packages/aurora/src/components/dropdown/components/content.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,oEAAwE;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,wDAA4D;AAC3E,sBAAsB,8CAAkD;AACxE,mBAAmB,2CAA+C;AAClE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,oEAAwE;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,wDAA4D;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/dropdown/components/dropdown.js

@@ -16,6 +16,7 @@ import { useToggle } from '../hooks/use_toggle.js';
 import OptionMultiple from './option_multiple.js';
 import Search from './search.js';
 import Select from './select.js';
+import { MemoizedContent } from './memoized_content.js';
 
 /**
  * Dropdown composition component. Provides several Dropdown dependant components which can be composed to create
@@ -77,6 +78,7 @@ var Dropdown = function Dropdown(_ref) {
 
 Dropdown.Select = Select;
 Dropdown.Content = Content;
+Dropdown.MemoizedContent = MemoizedContent;
 Dropdown.ItemWithHover = ItemWithHover;
 Dropdown.Search = Search;
 Dropdown.List = List;

package/build/esm/packages/aurora/src/components/dropdown/components/dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/dropdown/components/memoized_content.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IDropdownContentProps } from "../types";
+export declare const MemoizedContent: React.MemoExoticComponent<(props: IDropdownContentProps) => JSX.Element>;

package/build/esm/packages/aurora/src/components/dropdown/components/memoized_content.js

@@ -0,0 +1,15 @@
+import React from 'react';
+import { objectSpread2 as _objectSpread2 } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import Content from './content.js';
+import isEqual_1 from '../../../../../../external/lodash/isEqual.js';
+import omit_1 from '../../../../../../external/lodash/omit.js';
+
+var MemoizedContent = /*#__PURE__*/React.memo(function (props) {
+  return /*#__PURE__*/React.createElement(Content, _objectSpread2({}, props));
+}, function (prev, curr) {
+  return isEqual_1(omit_1(prev, ['children']), omit_1(curr, ['children']));
+});
+MemoizedContent.displayName;
+
+export { MemoizedContent };
+//# sourceMappingURL=memoized_content.js.map

package/build/esm/packages/aurora/src/components/dropdown/components/memoized_content.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA,sBAAsB,8CAAkD;AACxE,mBAAmB,2CAA+C;AAClE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/dropdown/components/select.js

@@ -2,10 +2,10 @@ import React, { useRef } from 'react';
 import { useDropdownContext } from '../context/index.js';
 import { cssControlInputRemoveButton } from '../../controls/css_classes.js';
 import inputCssClasses from '../../../css/input/main.module.less.js';
-import IconClose from '../../../assets/icon_close.js';
 import cssClasses from '../../../css/dropdown/main.module.less.js';
 import { filterOptionDuplicatesByProperty } from '../utilities.js';
 import { useKeyboardOpenClose } from '../hooks/use_keyboard_open_close.js';
+import IconClose from '../../../assets/icon_close.js';
 import InputWrapper from '../../controls/components/input_wrapper.js';
 
 /**

package/build/esm/packages/aurora/src/components/dropdown/types.d.ts

@@ -12,6 +12,7 @@ export interface IDropdownComposition {
     Label: React.FC<IDropdownLabelProps>;
     CustomLabel: React.FC<IDropdownCustomLabelProps>;
     Content: React.FC<IDropdownContentProps>;
+    MemoizedContent: React.FC<IDropdownContentProps>;
     ItemWithHover: React.FC<IDropdownItemWithHover>;
     Search: React.FC<IDropdownSearchProps>;
     Header: React.FC<IDropdownHeaderProps>;

package/build/esm/packages/aurora/src/components/flash_messenger/components/flash_message.js

@@ -1,7 +1,7 @@
 import React, { useEffect } from 'react';
 import Stack from '../../stack/index.js';
-import IconClose from '../../../assets/icon_close.js';
 import { CSSTransition } from 'react-transition-group';
+import IconClose from '../../../assets/icon_close.js';
 import cssClasses from '../../../css/flash_message/main.module.less.js';
 import { useFlashMessenger } from '../context.js';
 import MessageBox from '../../message-box/index.js';

package/build/esm/packages/aurora/src/components/tree/components/tree_node.js

@@ -1,8 +1,8 @@
 import React, { useRef, Children } from 'react';
 import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import classnames from 'classnames';
-import { IconListArrowDown } from '../../../assets/icon_list_arrow_down.js';
 import { CSSTransition } from 'react-transition-group';
+import { IconListArrowDown } from '../../../assets/icon_list_arrow_down.js';
 import { TREE_NODE_CSS_CLASSES } from '../css_classes.js';
 import cssClasses from '../../../css/tree/main.module.less.js';
 import { useTree } from '../hooks/tree_hook.js';

package/build/esm/packages/aurora/src/index.js

@@ -6,7 +6,6 @@ export { default as Button } from './components/button/index.js';
 export { default as ButtonsGroup } from './components/buttons_group/index.js';
 export { DropdownContext, useDropdownContext } from './components/dropdown/context/index.js';
 export { default as ColorPicker } from './components/color_picker/index.js';
-export { ColorPickerUtils } from './components/color_picker_new/color_picker_utils.js';
 export { useClickOutside } from './hooks/use_click_outside.js';
 export { default as IconArrow } from './assets/icon_arrow.js';
 export { default as IconTick } from './assets/icon_tick.js';
@@ -16,6 +15,7 @@ export { useToggle } from './components/dropdown/hooks/use_toggle.js';
 export { default as Hint } from './components/hint/index.js';
 export { default as ControlCheckbox } from './components/controls/hoc/control_checkbox/index.js';
 export { default as Dropdown } from './components/dropdown/components/dropdown.js';
+export { ColorPickerUtils } from './components/color_picker_new/color_picker_utils.js';
 export { default as ColorPickerNew } from './components/color_picker_new/index.js';
 export { default as ControlCellSelector } from './components/controls/hoc/control_cell_selector/index.js';
 export { default as ControlCheckboxSwitch } from './components/controls/hoc/control_checkbox_switch/index.js';

package/package.json

@@ -2,7 +2,7 @@
   "name": "@dreamcommerce/aurora",
   "packageManager": "yarn@3.2.0",
   "sideEffects": false,
-  "version": "2.20.2-6",
+  "version": "2.20.2-8",
   "description": "aurora",
   "author": "k0ssak",
   "license": "MIT",

package/build/esm/packages/aurora/src/components/color_picker_new/components/pure-color-picker.js.map

@@ -1 +0,0 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,4BAA4B,0FAA8F;AAC1H;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}