@dreamcommerce/aurora 3.0.0-53 → 3.0.0-55

package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_swatch.js

@@ -0,0 +1,32 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var color_picker_constants = require('../color_picker_constants.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var ColorPickerSwatch = function ColorPickerSwatch(_ref) {
+  var color = _ref.color,
+    cssColor = _ref.cssColor,
+    size = _ref.size,
+    onClick = _ref.onClick;
+  var handleOnClick = function handleOnClick() {
+    onClick === null || onClick === void 0 ? void 0 : onClick(color);
+  };
+  return /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "color-picker__swatch aurora-relative aurora-border aurora-rounded-2 aurora-overflow-hidden \n                ".concat(size === color_picker_constants.COLOR_PICKER_SWATCH_SIZES.small && 'aurora-w-4 aurora-h-4', "\n                ").concat(size === color_picker_constants.COLOR_PICKER_SWATCH_SIZES.big && 'aurora-w-7 aurora-h-7', "\n            "),
+    onClick: handleOnClick
+  }, /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "aurora-absolute aurora-inset-y-0 aurora-inset-x-0 aurora-rounded-2 aurora-shadow-s",
+    style: {
+      background: "".concat(cssColor)
+    }
+  }));
+};
+
+exports.ColorPickerSwatch = ColorPickerSwatch;
+//# sourceMappingURL=color_picker_swatch.js.map

package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_swatch.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;"}

package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_variables.js

@@ -0,0 +1,95 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var useTranslation = require('../../../../../../external/react-i18next/dist/es/useTranslation.js');
+var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
+var arrow_down_s_line_icon = require('../../../assets/icons/arrow_down_s_line_icon.js');
+var color_picker_utils = require('../color_picker_utils.js');
+var use_color_picker = require('../hooks/use_color_picker.js');
+var color_picker_swatch = require('./color_picker_swatch.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var ColorPickerVariables = function ColorPickerVariables(_ref) {
+  var variables = _ref.variables;
+  var _useColorPicker = use_color_picker.useColorPicker(),
+    setColor = _useColorPicker.setColor;
+  var _useTranslation = useTranslation.useTranslation(),
+    _useTranslation2 = _rollupPluginBabelHelpers.slicedToArray(_useTranslation, 1),
+    t = _useTranslation2[0];
+  var _useState = React.useState(false),
+    _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
+    isOpen = _useState2[0],
+    setIsOpen = _useState2[1];
+  var primary = variables.primary,
+    secondary = variables.secondary,
+    neutral = variables.neutral;
+  var primaryShades = color_picker_utils.ColorPickerUtils.getVariableShades({
+    color: primary.value,
+    name: primary.name
+  });
+  var secondaryShades = color_picker_utils.ColorPickerUtils.getVariableShades({
+    color: secondary.value,
+    name: secondary.name
+  });
+  var neutralShades = color_picker_utils.ColorPickerUtils.getVariableShades({
+    color: neutral.value,
+    name: neutral.name
+  });
+  var allShades = [].concat(_rollupPluginBabelHelpers.toConsumableArray(primaryShades), _rollupPluginBabelHelpers.toConsumableArray(secondaryShades), _rollupPluginBabelHelpers.toConsumableArray(neutralShades));
+  return /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "aurora-mt-3.5"
+  }, /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "aurora-flex aurora-items-center aurora-justify-between aurora-mb-1 aurora-text-info-active"
+  }, /*#__PURE__*/React__default['default'].createElement("p", {
+    className: "aurora-text-xs aurora-font-medium"
+  }, "".concat(t('Theme colors'))), /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "aurora-flex aurora-items-start aurora-justify-center aurora-p-1",
+    onClick: function onClick() {
+      return setIsOpen(!isOpen);
+    }
+  }, /*#__PURE__*/React__default['default'].createElement(arrow_down_s_line_icon.ArrowDownSLineIcon, {
+    className: "".concat(!isOpen ? 'aurora-rotate-180' : '')
+  }))), /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "aurora-grid aurora-grid-cols-12 aurora-gap-1"
+  }, Object.values(variables).map(function (variable, index) {
+    var colorTiny = color_picker_utils.ColorPickerUtils.getTinyColorInstance(variable.value);
+    var colorHex = color_picker_utils.ColorPickerUtils.getHexValue(colorTiny);
+    var handleOnClick = function handleOnClick() {
+      return setColor({
+        value: colorHex,
+        name: "".concat(variable.name)
+      });
+    };
+    return /*#__PURE__*/React__default['default'].createElement(color_picker_swatch.ColorPickerSwatch, {
+      size: "small",
+      onClick: handleOnClick,
+      key: "".concat(variable, "-").concat(index),
+      color: colorHex,
+      cssColor: color_picker_utils.ColorPickerUtils.getHexValueString(colorTiny)
+    });
+  })), isOpen && (/*#__PURE__*/React__default['default'].createElement("div", {
+    className: "aurora-grid aurora-grid-cols-12 aurora-gap-1 aurora-mt-3"
+  }, allShades.map(function (variable, index) {
+    var handleOnClick = function handleOnClick() {
+      return setColor === null || setColor === void 0 ? void 0 : setColor({
+        value: variable.value,
+        name: variable.name
+      });
+    };
+    return /*#__PURE__*/React__default['default'].createElement(color_picker_swatch.ColorPickerSwatch, {
+      size: "small",
+      onClick: handleOnClick,
+      key: "".concat(variable, "-").concat(index),
+      color: variable.value,
+      cssColor: variable.value
+    });
+  }))));
+};
+
+exports.ColorPickerVariables = ColorPickerVariables;
+//# sourceMappingURL=color_picker_variables.js.map

package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_variables.js.map

@@ -0,0 +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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/components/current_color_preview.js

@@ -0,0 +1,26 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var color_picker_utils = require('../color_picker_utils.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 }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var CurrentColorPreview = function CurrentColorPreview() {
+  var _useColorPicker = use_color_picker.useColorPicker(),
+    color = _useColorPicker.color;
+  return /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "aurora-self-stretch aurora-w-6 aurora-border aurora-rounded-4",
+    "aria-label": "color picker current color value",
+    style: {
+      background: color_picker_utils.ColorPickerUtils.isGradient(color.value) ? color.value : "#".concat(color.value)
+    }
+  });
+};
+
+exports.CurrentColorPreview = CurrentColorPreview;
+//# sourceMappingURL=current_color_preview.js.map

package/build/cjs/packages/aurora/src/components/color_picker/components/current_color_preview.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;"}

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

@@ -0,0 +1,61 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var popover = require('../../popover/popover.js');
+var popover_trigger = require('../../popover/components/popover_trigger.js');
+var color_picker_utils = require('../color_picker_utils.js');
+var use_color_picker = require('../hooks/use_color_picker.js');
+var color_picker_swatch = require('./color_picker_swatch.js');
+var color_picker_content = require('./color_picker_content.js');
+var color_label_input = require('./color_label_input.js');
+var popover_content = require('../../popover/components/popover_content.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var ColorPickerPure = function ColorPickerPure(_ref) {
+  var id = _ref.id,
+    name = _ref.name,
+    errors = _ref.errors;
+  var _useColorPicker = use_color_picker.useColorPicker(),
+    color = _useColorPicker.color,
+    handleCancel = _useColorPicker.handleCancel,
+    isColorPickerOpened = _useColorPicker.isColorPickerOpened,
+    setIsColorPickerOpened = _useColorPicker.setIsColorPickerOpened;
+  var colorValue = typeof color === 'string' ? color : color.value;
+  var colorTiny = color_picker_utils.ColorPickerUtils.getTinyColorInstance(colorValue);
+  var handleClosePopover = function handleClosePopover() {
+    setIsColorPickerOpened(false);
+    handleCancel === null || handleCancel === void 0 ? void 0 : handleCancel();
+  };
+  return /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement(popover.Popover, {
+    open: isColorPickerOpened,
+    onOpenChange: function onOpenChange(value) {
+      return !value && handleClosePopover();
+    }
+  }, /*#__PURE__*/React__default['default'].createElement(popover_trigger.PopoverTrigger, {
+    onClick: function onClick() {
+      return setIsColorPickerOpened(true);
+    }
+  }, /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "color-picker__input-container aurora-relative"
+  }, /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "aurora-absolute aurora-top-1.5 aurora-left-2.5"
+  }, /*#__PURE__*/React__default['default'].createElement(color_picker_swatch.ColorPickerSwatch, {
+    color: color_picker_utils.ColorPickerUtils.isGradient(colorValue) ? colorValue : color_picker_utils.ColorPickerUtils.getHexValue(colorTiny),
+    cssColor: color_picker_utils.ColorPickerUtils.isGradient(colorValue) ? colorValue : color_picker_utils.ColorPickerUtils.getHexValueString(colorTiny),
+    size: "big"
+  })), /*#__PURE__*/React__default['default'].createElement(color_label_input.ColorPickerInput, {
+    id: id,
+    name: name,
+    errors: errors
+  }))), /*#__PURE__*/React__default['default'].createElement(popover_content.PopoverContent, {
+    className: "aurora-mt-2 aurora-rounded-16 aurora-overflow-hidden"
+  }, /*#__PURE__*/React__default['default'].createElement(color_picker_content.ColorPickerContent, null))));
+};
+
+exports.default = ColorPickerPure;
+//# sourceMappingURL=pure_color_picker.js.map

package/build/cjs/packages/aurora/src/components/color_picker/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;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/hooks/setup_color_piceker.js

@@ -0,0 +1,162 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
+var color_picker_constants = require('../color_picker_constants.js');
+var color_picker_utils = require('../color_picker_utils.js');
+var isEqual = require('lodash/isEqual');
+var useColorPicker = require('../../../../../../external/react-best-gradient-color-picker/dist/esm/hooks/useColorPicker.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var isEqual__default = /*#__PURE__*/_interopDefaultLegacy(isEqual);
+
+var defaultGradient = 'linear-gradient(90deg, #000000 0%, #FFFFFF 100%)';
+var useSetupColorPicker = function useSetupColorPicker(_ref) {
+  var initialColor = _ref.initialColor,
+    onChange = _ref.onChange,
+    onCancel = _ref.onCancel,
+    onSave = _ref.onSave,
+    colorVariables = _ref.colorVariables,
+    _ref$withGradient = _ref.withGradient,
+    isWithGradient = _ref$withGradient === void 0 ? false : _ref$withGradient;
+  var initialColorObject = color_picker_utils.ColorPickerUtils.getColorPickerValue(initialColor);
+  var _useState = React.useState(initialColorObject),
+    _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
+    color = _useState2[0],
+    setColorValue = _useState2[1];
+  var _useState3 = React.useState(),
+    _useState4 = _rollupPluginBabelHelpers.slicedToArray(_useState3, 2),
+    previousSolidColor = _useState4[0],
+    setPreviousSolidColor = _useState4[1];
+  var _useState5 = React.useState(),
+    _useState6 = _rollupPluginBabelHelpers.slicedToArray(_useState5, 2),
+    previousGradientColor = _useState6[0],
+    setPreviousGradientColor = _useState6[1];
+  var _useState7 = React.useState(initialColor),
+    _useState8 = _rollupPluginBabelHelpers.slicedToArray(_useState7, 2),
+    prevInitialColor = _useState8[0],
+    setPrevInitialColor = _useState8[1];
+  var withGradient = isWithGradient || color_picker_utils.ColorPickerUtils.isGradient(initialColorObject.value);
+  var _useState9 = React.useState(false),
+    _useState10 = _rollupPluginBabelHelpers.slicedToArray(_useState9, 2),
+    isColorPickerOpened = _useState10[0],
+    setIsColorPickerOpened = _useState10[1];
+  var setColor = function setColor(newColor) {
+    var newColorValue = color_picker_utils.ColorPickerUtils.getColorPickerValue(newColor);
+    !color_picker_utils.ColorPickerUtils.isGradient(color.value) ? setPreviousSolidColor(color.value) : setPreviousGradientColor(color.value);
+    setColorValue(function (prevColor) {
+      var _prevColor$value;
+      return {
+        value: newColorValue.value,
+        name: ((_prevColor$value = prevColor.value) !== null && _prevColor$value !== void 0 ? _prevColor$value : prevColor) === newColorValue.value ? prevColor === null || prevColor === void 0 ? void 0 : prevColor.name : typeof newColor === 'string' ? '' : newColor === null || newColor === void 0 ? void 0 : newColor.name
+      };
+    });
+  };
+  React.useEffect(function () {
+    if (!initialColor) return;
+    if (!isEqual__default['default'](initialColor, prevInitialColor) && !isColorPickerOpened) {
+      setColor(initialColor);
+      setPrevInitialColor(initialColor);
+    }
+  }, [initialColor]);
+  var _useBestGradientColor = useColorPicker.useColorPicker(color.value, setColor),
+    hslArr = _useBestGradientColor.hslArr,
+    rgbaArr = _useBestGradientColor.rgbaArr,
+    setR = _useBestGradientColor.setR,
+    setG = _useBestGradientColor.setG,
+    setB = _useBestGradientColor.setB,
+    setA = _useBestGradientColor.setA,
+    isGradient = _useBestGradientColor.isGradient,
+    gradientType = _useBestGradientColor.gradientType,
+    getGradientObject = _useBestGradientColor.getGradientObject;
+  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 _useState11 = React.useState(rgbaArr[3] * 100),
+    _useState12 = _rollupPluginBabelHelpers.slicedToArray(_useState11, 2),
+    alpha = _useState12[0],
+    setAlpha = _useState12[1];
+  var _useState13 = React.useState("".concat(alpha)),
+    _useState14 = _rollupPluginBabelHelpers.slicedToArray(_useState13, 2),
+    alphaValue = _useState14[0],
+    setAlphaValue = _useState14[1];
+  var setSolid = function setSolid(value) {
+    setColor(color_picker_utils.ColorPickerUtils.getColorPickerValue(value).value);
+  };
+  var setLinear = function setLinear(value) {
+    var gradientColor = value || defaultGradient;
+    if (value && !color_picker_utils.ColorPickerUtils.isGradient(value)) {
+      setGradient(gradientColor);
+    }
+    var remaining = gradientColor.split(/,(.+)/)[1];
+    setColor("linear-gradient(90deg, ".concat(remaining));
+  };
+  var setRadial = function setRadial(value) {
+    var gradientColor = value || defaultGradient;
+    if (value && !color_picker_utils.ColorPickerUtils.isGradient(value)) {
+      setGradient(gradientColor);
+    }
+    var remaining = gradientColor.split(/,(.+)/)[1];
+    setColor("radial-gradient(circle, ".concat(remaining));
+  };
+  var setGradient = function setGradient(value) {
+    var gradientColor = value || defaultGradient;
+    setColor(gradientColor);
+  };
+  var handleOnChangeAlpha = function handleOnChangeAlpha(event) {
+    changeAlphaValue(Number(event.target.value));
+  };
+  var changeAlphaValue = function changeAlphaValue(value) {
+    setAlpha(value > color_picker_constants.COLOR_PICKER_ALPHA_MAX_VALUE ? color_picker_constants.COLOR_PICKER_ALPHA_MAX_VALUE : value);
+  };
+  React.useEffect(function () {
+    setA(alpha);
+  }, [alpha]);
+  React.useEffect(function () {
+    setAlphaValue("".concat(Math.round(rgbaArr[3] * 100)));
+  }, [rgbaArr[3]]);
+  React.useEffect(function () {
+    var colorObject = color_picker_utils.ColorPickerUtils.getAllColorTypes(color);
+    var gradientObject = getGradientObject();
+    onChange === null || onChange === void 0 ? void 0 : onChange(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, colorObject), {}, {
+      gradient: gradientObject !== null && gradientObject !== void 0 && gradientObject.isGradient ? color_picker_utils.ColorPickerUtils.getColorPickerGradientValue(gradientObject) : undefined
+    }));
+  }, [color]);
+  var handleCancel = function handleCancel() {
+    setColor(color_picker_utils.ColorPickerUtils.getColorPickerValue(initialColor));
+    onCancel === null || onCancel === void 0 ? void 0 : onCancel();
+  };
+  var handleSave = function handleSave() {
+    onSave === null || onSave === void 0 ? void 0 : onSave(color_picker_utils.ColorPickerUtils.getAllColorTypes(color));
+  };
+  return {
+    color: color,
+    previousSolidColor: previousSolidColor,
+    previousGradientColor: previousGradientColor,
+    setColor: setColor,
+    hex: hex,
+    hslArr: hslArr,
+    handleOnChangeAlpha: handleOnChangeAlpha,
+    alphaValue: alphaValue,
+    rgbaArr: rgbaArr,
+    setR: setR,
+    setG: setG,
+    setB: setB,
+    handleCancel: handleCancel,
+    handleSave: handleSave,
+    colorVariables: colorVariables,
+    isCurrentValueGradient: isGradient,
+    setSolid: setSolid,
+    setRadial: setRadial,
+    setLinear: setLinear,
+    gradientType: gradientType,
+    withGradient: withGradient,
+    isColorPickerOpened: isColorPickerOpened,
+    setIsColorPickerOpened: setIsColorPickerOpened
+  };
+};
+
+exports.default = useSetupColorPicker;
+//# sourceMappingURL=setup_color_piceker.js.map

package/build/cjs/packages/aurora/src/components/color_picker/hooks/setup_color_piceker.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,6BAA6B,8FAAkG;AAC/H;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/hooks/use_color_picker.js

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var color_picker_context = require('../color_picker_context.js');
+
+var useColorPicker = function useColorPicker() {
+  return React.useContext(color_picker_context.ColorPickerContext);
+};
+
+exports.useColorPicker = useColorPicker;
+//# sourceMappingURL=use_color_picker.js.map

package/build/cjs/packages/aurora/src/components/color_picker/hooks/use_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;"}

package/build/cjs/packages/aurora/src/components/controls/color_picker_control/color_picker_control.js

@@ -0,0 +1,56 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
+var label = require('../../label/label.js');
+var error_list = require('../../error_list/error_list.js');
+var control = require('../../control/control.js');
+var color_picker = require('../../color_picker/color_picker.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var _excluded = ["label", "tooltip", "required", "id", "name", "errors", "initialColor", "colorVariables", "onChange", "onCancel", "onSave", "withGradient"];
+var ColorPickerControl = function ColorPickerControl(_ref) {
+  var label$1 = _ref.label,
+    tooltip = _ref.tooltip,
+    _ref$required = _ref.required,
+    required = _ref$required === void 0 ? false : _ref$required,
+    id = _ref.id,
+    name = _ref.name,
+    errors = _ref.errors,
+    initialColor = _ref.initialColor,
+    colorVariables = _ref.colorVariables,
+    onChange = _ref.onChange,
+    onCancel = _ref.onCancel,
+    onSave = _ref.onSave,
+    withGradient = _ref.withGradient,
+    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React__default['default'].createElement(control.Control, {
+    classname: "aurora-flex-col"
+  }, label$1 && (/*#__PURE__*/React__default['default'].createElement(label.Label, {
+    htmlFor: id,
+    tooltip: tooltip,
+    required: required,
+    className: "aurora-pb-1 aurora-text"
+  }, label$1)), /*#__PURE__*/React__default['default'].createElement(color_picker.ColorPickerWithContext, _rollupPluginBabelHelpers.objectSpread2({
+    id: id,
+    name: name,
+    initialColor: initialColor,
+    colorVariables: colorVariables,
+    errors: errors,
+    onChange: onChange,
+    onCancel: onCancel,
+    onSave: onSave,
+    withGradient: withGradient
+  }, rest)), errors && /*#__PURE__*/React__default['default'].createElement(error_list.ErrorList, {
+    errors: errors
+  }));
+};
+ColorPickerControl.displayName = 'ColorPickerControl';
+
+exports.ColorPickerControl = ColorPickerControl;
+//# sourceMappingURL=color_picker_control.js.map

package/build/cjs/packages/aurora/src/components/controls/color_picker_control/color_picker_control.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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

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

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../_virtual/_rollupPluginBabelHelpers.js');
 var cn = require('../../utilities/cn.js');
-var box = require('../box/box.js');
+var stack = require('../stack/stack.js');
 var tooltip = require('../tooltip/tooltip.js');
 var tooltip_trigger = require('../tooltip/components/tooltip_trigger.js');
 var tooltip_content = require('../tooltip/components/tooltip_content.js');
@@ -22,9 +22,10 @@ var Label = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     disabled = _ref.disabled,
     children = _ref.children,
     props = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  var content = /*#__PURE__*/React.createElement(box.Box, {
+  var content = /*#__PURE__*/React.createElement(stack.Stack, {
     align: "center",
     spacing: "0.5",
+    inline: true,
     className: cn.cn(label_variants.labelVariants(), "".concat(disabled ? 'aurora-cursor-not-allowed aurora-text-subtle-light' : '', " ").concat(className))
   }, required && /*#__PURE__*/React.createElement("span", {
     className: "aurora-text-interactive"

package/build/cjs/packages/aurora/src/components/label/label.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;"}
+{"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;"}

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

@@ -5,10 +5,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../../_virtual/_rollupPluginBabelHelpers.js');
 var cn = require('../../../../utilities/cn.js');
+var ReactDOM = require('react-dom');
 var modal_constants = require('../../modal_constants.js');
 var modal_footer = require('./modal_footer.js');
 var modal_header = require('./modal_header.js');
-var reactDom = require('react-dom');
 var modal_variants = require('../../modal_variants.js');
 var use_modals_context = require('../../hooks/use_modals_context.js');
 
@@ -77,7 +77,7 @@ var Modal = function Modal(_ref) {
     hideAllModalsOnClose ? hideAllModals(onCloseAction) : hideModal(name, onCloseAction);
   };
   if (!$modalsManagerContainer) return null;
-  return renderModal ? /*#__PURE__*/reactDom.createPortal(/*#__PURE__*/React__default['default'].createElement("div", {
+  return renderModal ? /*#__PURE__*/ReactDOM.createPortal(/*#__PURE__*/React__default['default'].createElement("div", {
     "data-modal-id": name,
     "data-test-id": "modal",
     className: cn.cn(modal_variants.modalVariants({
@@ -88,7 +88,7 @@ var Modal = function Modal(_ref) {
     text: header.text,
     onClose: handleCloseModal
   }), children && /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "aurora-overflow-y-auto"
+    className: "aurora-overflow-y-auto custom-scrollbar"
   }, children), footer && /*#__PURE__*/React__default['default'].createElement(modal_footer.ModalFooter, {
     text: footer.text
   })), $modalsManagerContainer) : null;

package/build/cjs/packages/aurora/src/components/modal/components/modals_wrapper.js

@@ -4,8 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
+var ReactDOM = require('react-dom');
 var modal_constants = require('../modal_constants.js');
-var reactDom = require('react-dom');
 var use_modals_context = require('../hooks/use_modals_context.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -39,7 +39,7 @@ var ModalsWrapper = function ModalsWrapper(_ref) {
       return clearTimeout(showWrapperTimeout);
     };
   }, [openedModals]);
-  return /*#__PURE__*/reactDom.createPortal(/*#__PURE__*/React__default['default'].createElement("div", null, showWrapper && (/*#__PURE__*/React__default['default'].createElement("div", {
+  return /*#__PURE__*/ReactDOM.createPortal(/*#__PURE__*/React__default['default'].createElement("div", null, showWrapper && (/*#__PURE__*/React__default['default'].createElement("div", {
     className: "aurora-fixed aurora-flex aurora-items-center aurora-justify-center aurora-top-0 aurora-left-0 aurora-w-full aurora-h-full aurora-z-20 aurora-p-4"
   }, /*#__PURE__*/React__default['default'].createElement("div", {
     className: "aurora-absolute aurora-inset-x-0 aurora-inset-y-0 aurora-bg-inverse aurora-z-10 aurora-transition-opacity aurora-duration-300 aurora-animate-modal-backdrop-fade-in ".concat(visibleClass ? 'aurora-opacity-70' : 'aurora-opacity-0', " js__modal-mask")

package/build/cjs/packages/aurora/src/components/modal/modal_variants.js

@@ -6,7 +6,7 @@ var _rollupPluginBabelHelpers = require('../../../../../_virtual/_rollupPluginBa
 var index = require('../../../../../external/class-variance-authority/dist/index.mjs.js');
 var modal_constants = require('./modal_constants.js');
 
-var modalVariants = index.cva('aurora-w-full aurora-absolute aurora-bg aurora-rounded-16 aurora-shadow-xl aurora-p-6 aurora-opacity-0 aurora-transition-all js__modal', {
+var modalVariants = index.cva('aurora-flex aurora-flex-col aurora-w-full aurora-max-h-[90vh] aurora-absolute aurora-bg aurora-rounded-16 aurora-shadow-xl aurora-p-6 aurora-opacity-0 aurora-transition-all js__modal', {
   variants: {
     width: _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, modal_constants.MODAL_WIDTH_VARIANT.s, 'aurora-max-w-[25rem]'), modal_constants.MODAL_WIDTH_VARIANT.m, 'aurora-max-w-[40rem]'), modal_constants.MODAL_WIDTH_VARIANT.l, 'aurora-max-w-[61rem]')
   },

package/build/cjs/packages/aurora/src/components/popover/components/popover_content.js

@@ -0,0 +1,32 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
+var cn = require('../../../utilities/cn.js');
+var PopoverPrimitive = require('@radix-ui/react-popover');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var _excluded = ["className", "align", "sideOffset"];
+var PopoverContent = /*#__PURE__*/React__default['default'].forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+    _ref$align = _ref.align,
+    align = _ref$align === void 0 ? 'center' : _ref$align,
+    _ref$sideOffset = _ref.sideOffset,
+    sideOffset = _ref$sideOffset === void 0 ? 4 : _ref$sideOffset,
+    props = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React__default['default'].createElement(PopoverPrimitive.Portal, null, /*#__PURE__*/React__default['default'].createElement(PopoverPrimitive.Content, _rollupPluginBabelHelpers.objectSpread2({
+    ref: ref,
+    align: align,
+    sideOffset: sideOffset,
+    className: cn.cn('aurora-z-50 w-72 aurora-shadow-m aurora-outline-none data-[state=open]:aurora-animate-in data-[state=closed]:aurora-animate-out data-[state=closed]:aurora-fade-out-0 data-[state=open]:aurora-fade-in-0 data-[side=bottom]:aurora-slide-in-from-top-2 data-[side=left]:aurora-slide-in-from-right-2 data-[side=right]:aurora-slide-in-from-left-2 data-[side=top]:aurora-slide-in-from-bottom-2', className)
+  }, props)));
+});
+PopoverContent.displayName = PopoverPrimitive.Content.displayName;
+
+exports.PopoverContent = PopoverContent;
+//# sourceMappingURL=popover_content.js.map

package/build/cjs/packages/aurora/src/components/popover/components/popover_content.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;"}