@dreamcommerce/aurora 3.0.0-317 → 3.0.0-318

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (37) hide show
  1. package/build/cjs/packages/aurora/src/components/color_picker/color_picker.js +5 -1
  2. package/build/cjs/packages/aurora/src/components/color_picker/color_picker.js.map +1 -1
  3. package/build/cjs/packages/aurora/src/components/color_picker/color_picker_utils.js +3 -0
  4. package/build/cjs/packages/aurora/src/components/color_picker/color_picker_utils.js.map +1 -1
  5. package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_input.js +3 -1
  6. package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_input.js.map +1 -1
  7. package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_inputs/color_picker_inputs_hex/color_picker_inputs_hex.js +1 -1
  8. package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_inputs/color_picker_inputs_hex/color_picker_inputs_hex_input.js +2 -0
  9. package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_inputs/color_picker_inputs_hex/color_picker_inputs_hex_input.js.map +1 -1
  10. package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_inputs/color_picker_inputs_rgba.js +3 -3
  11. package/build/cjs/packages/aurora/src/components/color_picker/components/pure_color_picker.js +2 -3
  12. package/build/cjs/packages/aurora/src/components/color_picker/components/pure_color_picker.js.map +1 -1
  13. package/build/cjs/packages/aurora/src/components/color_picker/hooks/setup_color_picker.js +6 -0
  14. package/build/cjs/packages/aurora/src/components/color_picker/hooks/setup_color_picker.js.map +1 -1
  15. package/build/cjs/packages/aurora/src/components/input/input.js +1 -1
  16. package/build/cjs/packages/aurora/src/components/tooltip/components/tooltip_content.js +1 -1
  17. package/build/esm/packages/aurora/src/components/color_picker/color_picker.js +5 -1
  18. package/build/esm/packages/aurora/src/components/color_picker/color_picker.js.map +1 -1
  19. package/build/esm/packages/aurora/src/components/color_picker/color_picker_types.d.ts +2 -0
  20. package/build/esm/packages/aurora/src/components/color_picker/color_picker_utils.d.ts +1 -0
  21. package/build/esm/packages/aurora/src/components/color_picker/color_picker_utils.js +3 -0
  22. package/build/esm/packages/aurora/src/components/color_picker/color_picker_utils.js.map +1 -1
  23. package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_input.js +3 -1
  24. package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_input.js.map +1 -1
  25. package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_inputs/color_picker_inputs_hex/color_picker_inputs_hex.js +1 -1
  26. package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_inputs/color_picker_inputs_hex/color_picker_inputs_hex_input.js +2 -0
  27. package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_inputs/color_picker_inputs_hex/color_picker_inputs_hex_input.js.map +1 -1
  28. package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_inputs/color_picker_inputs_rgba.js +3 -3
  29. package/build/esm/packages/aurora/src/components/color_picker/components/pure_color_picker.js +2 -3
  30. package/build/esm/packages/aurora/src/components/color_picker/components/pure_color_picker.js.map +1 -1
  31. package/build/esm/packages/aurora/src/components/color_picker/hooks/setup_color_picker.d.ts +2 -0
  32. package/build/esm/packages/aurora/src/components/color_picker/hooks/setup_color_picker.js +6 -0
  33. package/build/esm/packages/aurora/src/components/color_picker/hooks/setup_color_picker.js.map +1 -1
  34. package/build/esm/packages/aurora/src/components/input/input.js +1 -1
  35. package/build/esm/packages/aurora/src/components/tooltip/components/tooltip_content.js +1 -1
  36. package/build/index.css +1 -1
  37. package/package.json +1 -1
@@ -35,6 +35,8 @@ var ColorPicker = function ColorPicker(_ref) {
35
35
  }),
36
36
  color = _useSetupColorPicker.color,
37
37
  setColor = _useSetupColorPicker.setColor,
38
+ typedInputValue = _useSetupColorPicker.typedInputValue,
39
+ setTypedInputValue = _useSetupColorPicker.setTypedInputValue,
38
40
  hex = _useSetupColorPicker.hex,
39
41
  hslArr = _useSetupColorPicker.hslArr,
40
42
  handleOnChangeAlpha = _useSetupColorPicker.handleOnChangeAlpha,
@@ -61,6 +63,8 @@ var ColorPicker = function ColorPicker(_ref) {
61
63
  return {
62
64
  color: color,
63
65
  setColor: setColor,
66
+ typedInputValue: typedInputValue,
67
+ setTypedInputValue: setTypedInputValue,
64
68
  hex: hex,
65
69
  hslArr: hslArr,
66
70
  handleOnChangeAlpha: handleOnChangeAlpha,
@@ -85,7 +89,7 @@ var ColorPicker = function ColorPicker(_ref) {
85
89
  degrees: degrees,
86
90
  shadeName: shadeName
87
91
  };
88
- }, [color, setColor, hex, hslArr, handleOnChangeAlpha, alpha, rgbaArr, setR, setG, setB, handleCancel, handleSave, previousSolidColor, colorVariables, isCurrentValueGradient, setLinear, setRadial, gradientType, previousGradientColor, setSolid, withGradient, isColorPickerOpened, setIsColorPickerOpened, degrees, shadeName]);
92
+ }, [color, setColor, typedInputValue, setTypedInputValue, hex, hslArr, handleOnChangeAlpha, alpha, rgbaArr, setR, setG, setB, handleCancel, handleSave, previousSolidColor, colorVariables, isCurrentValueGradient, setLinear, setRadial, gradientType, previousGradientColor, setSolid, withGradient, isColorPickerOpened, setIsColorPickerOpened, degrees, shadeName]);
89
93
  return /*#__PURE__*/React__default['default'].createElement(color_picker_context.ColorPickerContext.Provider, {
90
94
  value: contextVal
91
95
  }, /*#__PURE__*/React__default['default'].createElement(pure_color_picker['default'], _rollupPluginBabelHelpers.objectSpread2({
@@ -1 +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;"}
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;AACA;AACA;AACA;AACA;"}
@@ -39,6 +39,9 @@ _rollupPluginBabelHelpers.defineProperty(ColorPickerUtils, "getHexValue", functi
39
39
  var alphaValue = colorSet.getAlpha();
40
40
  return alphaValue < 1 ? colorSet.toHex8() : colorSet.toHex();
41
41
  });
42
+ _rollupPluginBabelHelpers.defineProperty(ColorPickerUtils, "getHexValueWithoutHash", function (color) {
43
+ return color.replace('#', '');
44
+ });
42
45
  _rollupPluginBabelHelpers.defineProperty(ColorPickerUtils, "getHexValueString", function (colorSet) {
43
46
  return "#".concat(_ColorPickerUtils.getHexValue(colorSet));
44
47
  });
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,wBAAwB,qDAAyD;AACjF,yBAAyB,uFAA2F;AACpH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,wBAAwB,qDAAyD;AACjF,yBAAyB,uFAA2F;AACpH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -22,6 +22,7 @@ var ColorPickerInput = function ColorPickerInput(_ref) {
22
22
  preElement = _ref.preElement;
23
23
  var _useColorPicker = use_color_picker.useColorPicker(),
24
24
  color = _useColorPicker.color,
25
+ typedInputValue = _useColorPicker.typedInputValue,
25
26
  isCurrentValueGradient = _useColorPicker.isCurrentValueGradient,
26
27
  gradientType = _useColorPicker.gradientType,
27
28
  colorVariables = _useColorPicker.colorVariables,
@@ -29,11 +30,12 @@ var ColorPickerInput = function ColorPickerInput(_ref) {
29
30
  var _useTranslation = useTranslation.useTranslation(),
30
31
  _useTranslation2 = _rollupPluginBabelHelpers.slicedToArray(_useTranslation, 1),
31
32
  t = _useTranslation2[0];
33
+ var typedInputValueHasFullHexLength = typedInputValue.length >= 6;
32
34
  var variableName = (colorVariables === null || colorVariables === void 0 ? void 0 : colorVariables.variables) && color_picker_utils.ColorPickerUtils.findVariable(colorVariables.variables, color) || shadeName || '';
33
35
  var colorName = undefined;
34
36
  if (isCurrentValueGradient) {
35
37
  colorName = gradientType === color_picker_constants.GRADIENT_TYPES.linear ? t('Linear gradient') : t('Radial gradient');
36
- } else if (variableName) {
38
+ } else if (variableName && typedInputValueHasFullHexLength) {
37
39
  colorName = "".concat(t(variableName));
38
40
  }
39
41
  return /*#__PURE__*/React__default['default'].createElement(color_picker_inputs_hex_input.ColorPickerInputsHexInput, {
@@ -1 +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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
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;"}
@@ -12,7 +12,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
12
 
13
13
  var ColorPickerInputsHex = function ColorPickerInputsHex() {
14
14
  return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(color_picker_inputs_hex_input.ColorPickerInputsHexInput, {
15
- className: "aurora-h-full aurora-px-2 aurora-text-xs"
15
+ className: "aurora-h-full aurora-text-xs"
16
16
  }), /*#__PURE__*/React__default['default'].createElement(color_picker_inputs_hex_alpha.ColorPickerInputsHexAlpha, null));
17
17
  };
18
18
 
@@ -28,6 +28,7 @@ var ColorPickerInputsHexInput = function ColorPickerInputsHexInput(_ref) {
28
28
  hasCursorPointer = _ref.hasCursorPointer;
29
29
  var _useColorPicker = use_color_picker.useColorPicker(),
30
30
  setColor = _useColorPicker.setColor,
31
+ setTypedInputValue = _useColorPicker.setTypedInputValue,
31
32
  hex = _useColorPicker.hex,
32
33
  isCurrentValueGradient = _useColorPicker.isCurrentValueGradient,
33
34
  gradientType = _useColorPicker.gradientType;
@@ -46,6 +47,7 @@ var ColorPickerInputsHexInput = function ColorPickerInputsHexInput(_ref) {
46
47
  createGradientStr = _usePicker.createGradientStr;
47
48
  var handleOnChange = function handleOnChange(event) {
48
49
  var inputValue = event.target.value.replace('%', '');
50
+ setTypedInputValue(inputValue);
49
51
  setValue(inputValue);
50
52
  valueRef.current = inputValue;
51
53
  if (!tinycolor['default'](inputValue).isValid()) return;
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwB,8DAAkE;AAC1F,sBAAsB,uFAA2F;AACjH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwB,8DAAkE;AAC1F,sBAAsB,uFAA2F;AACjH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -20,7 +20,7 @@ var ColorPickerInputsRgba = function ColorPickerInputsRgba() {
20
20
  alpha = _useColorPicker.alpha,
21
21
  rgbaArr = _useColorPicker.rgbaArr;
22
22
  return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(input.Input, {
23
- className: "aurora-h-full aurora-px-1.5 aurora-text-xs",
23
+ className: "aurora-h-full aurora-text-xs",
24
24
  type: "text",
25
25
  value: rgbaArr[0],
26
26
  onChange: function onChange(e) {
@@ -28,7 +28,7 @@ var ColorPickerInputsRgba = function ColorPickerInputsRgba() {
28
28
  },
29
29
  onKeyDown: color_picker_utils.ColorPickerUtils.preventTypingLetters
30
30
  }), /*#__PURE__*/React__default['default'].createElement(input.Input, {
31
- className: "aurora-h-full aurora-px-1.5 aurora-text-xs",
31
+ className: "aurora-h-full aurora-text-xs",
32
32
  type: "text",
33
33
  value: rgbaArr[1],
34
34
  onChange: function onChange(e) {
@@ -36,7 +36,7 @@ var ColorPickerInputsRgba = function ColorPickerInputsRgba() {
36
36
  },
37
37
  onKeyDown: color_picker_utils.ColorPickerUtils.preventTypingLetters
38
38
  }), /*#__PURE__*/React__default['default'].createElement(input.Input, {
39
- className: "aurora-h-full aurora-px-1.5 aurora-text-xs",
39
+ className: "aurora-h-full aurora-text-xs",
40
40
  type: "text",
41
41
  value: rgbaArr[2],
42
42
  onChange: function onChange(e) {
@@ -56,9 +56,8 @@ var ColorPickerPure = function ColorPickerPure(_ref) {
56
56
  squareHeight: color_picker_constants.COLOR_PICKER_HEIGHT,
57
57
  hideOpacity: false
58
58
  }, /*#__PURE__*/React__default['default'].createElement(popover_trigger.PopoverTrigger, {
59
- onClick: function onClick(e) {
60
- e.preventDefault();
61
- setIsColorPickerOpened(true);
59
+ onClick: function onClick() {
60
+ return setIsColorPickerOpened(true);
62
61
  },
63
62
  disabled: disabled,
64
63
  className: cn.cn('aurora-w-full', triggerClassName)
@@ -1 +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,oBAAoB,qFAAyF;AAC7G,sBAAsB,iFAAqF;AAC3G,qBAAqB,uFAA2F;AAChH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,oBAAoB,qFAAyF;AAC7G,sBAAsB,iFAAqF;AAC3G,qBAAqB,uFAA2F;AAChH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -38,6 +38,10 @@ var useSetupColorPicker = function useSetupColorPicker(_ref) {
38
38
  _useState8 = _rollupPluginBabelHelpers.slicedToArray(_useState7, 2),
39
39
  shadeName = _useState8[0],
40
40
  setShadeName = _useState8[1];
41
+ var _useState9 = React.useState(color_picker_utils.ColorPickerUtils.getHexValueWithoutHash(colorValue)),
42
+ _useState10 = _rollupPluginBabelHelpers.slicedToArray(_useState9, 2),
43
+ typedInputValue = _useState10[0],
44
+ setTypedInputValue = _useState10[1];
41
45
  var _getDetails = utils.getDetails(colorValue),
42
46
  degrees = _getDetails.degrees;
43
47
  var savedDegRef = React.useRef(isNaN(degrees) ? 180 : degrees);
@@ -112,6 +116,8 @@ var useSetupColorPicker = function useSetupColorPicker(_ref) {
112
116
  color: colorValue,
113
117
  previousSolidColor: previousSolidColor,
114
118
  previousGradientColor: previousGradientColor,
119
+ typedInputValue: typedInputValue,
120
+ setTypedInputValue: setTypedInputValue,
115
121
  setColor: setColor,
116
122
  hex: hex,
117
123
  hslArr: hslArr,
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,oBAAoB,qFAAyF;AAC7G,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;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,oBAAoB,qFAAyF;AAC7G,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;"}
@@ -53,7 +53,7 @@ var Input = /*#__PURE__*/React__default['default'].forwardRef(function (_ref, re
53
53
  onKeyUp: onKeyUp,
54
54
  type: type,
55
55
  className: cn.cn('aurora-h-[40px] aurora-w-full focus:aurora-outline-none focus:aurora-shadow-none aurora-px-2 aurora-rounded-6', {
56
- '!aurora-cursor-pointer': hasCursorPointer
56
+ 'aurora-cursor-pointer': hasCursorPointer
57
57
  })
58
58
  })), postElement && /*#__PURE__*/React__default['default'].createElement("div", {
59
59
  className: "aurora-flex aurora-h-full aurora-right-0 aurora-pr-2 aurora-items-center"
@@ -18,7 +18,7 @@ var TooltipContent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
18
18
  return /*#__PURE__*/React.createElement(TooltipPrimitive.Portal, null, /*#__PURE__*/React.createElement(TooltipPrimitive.Content, _rollupPluginBabelHelpers.objectSpread2({
19
19
  ref: ref,
20
20
  sideOffset: sideOffset,
21
- className: cn.cn('aurora-z-[1000] aurora-max-w-[320px] aurora-shadow aurora-overflow-hidden aurora-border aurora-rounded-8 aurora-px-3 aurora-py-2 aurora-text-xs aurora-animate-in aurora-fade-in-0 data-[state=closed]:aurora-animate-out data-[state=closed]:aurora-fade-out-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', 'js__aurora-tooltip-content', tooltip_content_variants.tooltipContentVariants({
21
+ className: cn.cn('aurora-z-[99999] aurora-max-w-[320px] aurora-shadow aurora-overflow-hidden aurora-border aurora-rounded-8 aurora-px-3 aurora-py-2 aurora-text-xs aurora-animate-in aurora-fade-in-0 data-[state=closed]:aurora-animate-out data-[state=closed]:aurora-fade-out-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', 'js__aurora-tooltip-content', tooltip_content_variants.tooltipContentVariants({
22
22
  variant: variant
23
23
  }), className)
24
24
  }, props)));
@@ -27,6 +27,8 @@ var ColorPicker = function ColorPicker(_ref) {
27
27
  }),
28
28
  color = _useSetupColorPicker.color,
29
29
  setColor = _useSetupColorPicker.setColor,
30
+ typedInputValue = _useSetupColorPicker.typedInputValue,
31
+ setTypedInputValue = _useSetupColorPicker.setTypedInputValue,
30
32
  hex = _useSetupColorPicker.hex,
31
33
  hslArr = _useSetupColorPicker.hslArr,
32
34
  handleOnChangeAlpha = _useSetupColorPicker.handleOnChangeAlpha,
@@ -53,6 +55,8 @@ var ColorPicker = function ColorPicker(_ref) {
53
55
  return {
54
56
  color: color,
55
57
  setColor: setColor,
58
+ typedInputValue: typedInputValue,
59
+ setTypedInputValue: setTypedInputValue,
56
60
  hex: hex,
57
61
  hslArr: hslArr,
58
62
  handleOnChangeAlpha: handleOnChangeAlpha,
@@ -77,7 +81,7 @@ var ColorPicker = function ColorPicker(_ref) {
77
81
  degrees: degrees,
78
82
  shadeName: shadeName
79
83
  };
80
- }, [color, setColor, hex, hslArr, handleOnChangeAlpha, alpha, rgbaArr, setR, setG, setB, handleCancel, handleSave, previousSolidColor, colorVariables, isCurrentValueGradient, setLinear, setRadial, gradientType, previousGradientColor, setSolid, withGradient, isColorPickerOpened, setIsColorPickerOpened, degrees, shadeName]);
84
+ }, [color, setColor, typedInputValue, setTypedInputValue, hex, hslArr, handleOnChangeAlpha, alpha, rgbaArr, setR, setG, setB, handleCancel, handleSave, previousSolidColor, colorVariables, isCurrentValueGradient, setLinear, setRadial, gradientType, previousGradientColor, setSolid, withGradient, isColorPickerOpened, setIsColorPickerOpened, degrees, shadeName]);
81
85
  return /*#__PURE__*/React.createElement(ColorPickerContext.Provider, {
82
86
  value: contextVal
83
87
  }, /*#__PURE__*/React.createElement(ColorPickerPure, _objectSpread2({
@@ -1 +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;"}
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;"}
@@ -34,6 +34,8 @@ export interface IColorPickerProps extends Omit<HTMLAttributes<HTMLDivElement>,
34
34
  triggerClassName?: string;
35
35
  }
36
36
  export interface IColorPickerContext {
37
+ typedInputValue: string;
38
+ setTypedInputValue: (newValue: string) => void;
37
39
  color: string;
38
40
  setColor: (newColor: string, shadeName?: string) => void;
39
41
  hex: string;
@@ -7,6 +7,7 @@ export declare class ColorPickerUtils {
7
7
  static isGradient(color: string): boolean;
8
8
  static getRgbaValue: (colorSet: tinycolor.Instance) => tinycolor.ColorFormats.RGBA;
9
9
  static getHexValue: (colorSet: tinycolor.Instance) => string;
10
+ static getHexValueWithoutHash: (color: string) => string;
10
11
  static getHexValueString: (colorSet: tinycolor.Instance) => string;
11
12
  static getAllColorTypes: (color: ColorPickerVariable) => IColorPickerColor;
12
13
  static getVariableShades: ({ color, name }: {
@@ -35,6 +35,9 @@ _defineProperty(ColorPickerUtils, "getHexValue", function (colorSet) {
35
35
  var alphaValue = colorSet.getAlpha();
36
36
  return alphaValue < 1 ? colorSet.toHex8() : colorSet.toHex();
37
37
  });
38
+ _defineProperty(ColorPickerUtils, "getHexValueWithoutHash", function (color) {
39
+ return color.replace('#', '');
40
+ });
38
41
  _defineProperty(ColorPickerUtils, "getHexValueString", function (colorSet) {
39
42
  return "#".concat(_ColorPickerUtils.getHexValue(colorSet));
40
43
  });
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,sBAAsB,qDAAyD;AAC/E,0BAA0B,uFAA2F;AACrH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,sBAAsB,qDAAyD;AAC/E,0BAA0B,uFAA2F;AACrH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -14,6 +14,7 @@ var ColorPickerInput = function ColorPickerInput(_ref) {
14
14
  preElement = _ref.preElement;
15
15
  var _useColorPicker = useColorPicker(),
16
16
  color = _useColorPicker.color,
17
+ typedInputValue = _useColorPicker.typedInputValue,
17
18
  isCurrentValueGradient = _useColorPicker.isCurrentValueGradient,
18
19
  gradientType = _useColorPicker.gradientType,
19
20
  colorVariables = _useColorPicker.colorVariables,
@@ -21,11 +22,12 @@ var ColorPickerInput = function ColorPickerInput(_ref) {
21
22
  var _useTranslation = useTranslation(),
22
23
  _useTranslation2 = _slicedToArray(_useTranslation, 1),
23
24
  t = _useTranslation2[0];
25
+ var typedInputValueHasFullHexLength = typedInputValue.length >= 6;
24
26
  var variableName = (colorVariables === null || colorVariables === void 0 ? void 0 : colorVariables.variables) && ColorPickerUtils.findVariable(colorVariables.variables, color) || shadeName || '';
25
27
  var colorName = undefined;
26
28
  if (isCurrentValueGradient) {
27
29
  colorName = gradientType === GRADIENT_TYPES.linear ? t('Linear gradient') : t('Radial gradient');
28
- } else if (variableName) {
30
+ } else if (variableName && typedInputValueHasFullHexLength) {
29
31
  colorName = "".concat(t(variableName));
30
32
  }
31
33
  return /*#__PURE__*/React.createElement(ColorPickerInputsHexInput, {
@@ -1 +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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -4,7 +4,7 @@ import { ColorPickerInputsHexAlpha } from './color_picker_inputs_hex_alpha.js';
4
4
 
5
5
  var ColorPickerInputsHex = function ColorPickerInputsHex() {
6
6
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ColorPickerInputsHexInput, {
7
- className: "aurora-h-full aurora-px-2 aurora-text-xs"
7
+ className: "aurora-h-full aurora-text-xs"
8
8
  }), /*#__PURE__*/React.createElement(ColorPickerInputsHexAlpha, null));
9
9
  };
10
10
 
@@ -20,6 +20,7 @@ var ColorPickerInputsHexInput = function ColorPickerInputsHexInput(_ref) {
20
20
  hasCursorPointer = _ref.hasCursorPointer;
21
21
  var _useColorPicker = useColorPicker(),
22
22
  setColor = _useColorPicker.setColor,
23
+ setTypedInputValue = _useColorPicker.setTypedInputValue,
23
24
  hex = _useColorPicker.hex,
24
25
  isCurrentValueGradient = _useColorPicker.isCurrentValueGradient,
25
26
  gradientType = _useColorPicker.gradientType;
@@ -38,6 +39,7 @@ var ColorPickerInputsHexInput = function ColorPickerInputsHexInput(_ref) {
38
39
  createGradientStr = _usePicker.createGradientStr;
39
40
  var handleOnChange = function handleOnChange(event) {
40
41
  var inputValue = event.target.value.replace('%', '');
42
+ setTypedInputValue(inputValue);
41
43
  setValue(inputValue);
42
44
  valueRef.current = inputValue;
43
45
  if (!tinycolor(inputValue).isValid()) return;
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,sBAAsB,8DAAkE;AACxF,0BAA0B,uFAA2F;AACrH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,sBAAsB,8DAAkE;AACxF,0BAA0B,uFAA2F;AACrH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -12,7 +12,7 @@ var ColorPickerInputsRgba = function ColorPickerInputsRgba() {
12
12
  alpha = _useColorPicker.alpha,
13
13
  rgbaArr = _useColorPicker.rgbaArr;
14
14
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Input, {
15
- className: "aurora-h-full aurora-px-1.5 aurora-text-xs",
15
+ className: "aurora-h-full aurora-text-xs",
16
16
  type: "text",
17
17
  value: rgbaArr[0],
18
18
  onChange: function onChange(e) {
@@ -20,7 +20,7 @@ var ColorPickerInputsRgba = function ColorPickerInputsRgba() {
20
20
  },
21
21
  onKeyDown: ColorPickerUtils.preventTypingLetters
22
22
  }), /*#__PURE__*/React.createElement(Input, {
23
- className: "aurora-h-full aurora-px-1.5 aurora-text-xs",
23
+ className: "aurora-h-full aurora-text-xs",
24
24
  type: "text",
25
25
  value: rgbaArr[1],
26
26
  onChange: function onChange(e) {
@@ -28,7 +28,7 @@ var ColorPickerInputsRgba = function ColorPickerInputsRgba() {
28
28
  },
29
29
  onKeyDown: ColorPickerUtils.preventTypingLetters
30
30
  }), /*#__PURE__*/React.createElement(Input, {
31
- className: "aurora-h-full aurora-px-1.5 aurora-text-xs",
31
+ className: "aurora-h-full aurora-text-xs",
32
32
  type: "text",
33
33
  value: rgbaArr[2],
34
34
  onChange: function onChange(e) {
@@ -48,9 +48,8 @@ var ColorPickerPure = function ColorPickerPure(_ref) {
48
48
  squareHeight: COLOR_PICKER_HEIGHT,
49
49
  hideOpacity: false
50
50
  }, /*#__PURE__*/React.createElement(PopoverTrigger, {
51
- onClick: function onClick(e) {
52
- e.preventDefault();
53
- setIsColorPickerOpened(true);
51
+ onClick: function onClick() {
52
+ return setIsColorPickerOpened(true);
54
53
  },
55
54
  disabled: disabled,
56
55
  className: cn('aurora-w-full', triggerClassName)
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,+BAA+B,qFAAyF;AACxH,iCAAiC,iFAAqF;AACtH,0BAA0B,uFAA2F;AACrH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,+BAA+B,qFAAyF;AACxH,iCAAiC,iFAAqF;AACtH,0BAA0B,uFAA2F;AACrH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -12,6 +12,8 @@ declare const useSetupColorPicker: ({ value, onChange, onCancel, onSave, colorVa
12
12
  color: string;
13
13
  previousSolidColor: string;
14
14
  previousGradientColor: string;
15
+ typedInputValue: string;
16
+ setTypedInputValue: import("react").Dispatch<import("react").SetStateAction<string>>;
15
17
  setColor: (newColor: string, shadeName?: string) => void;
16
18
  hex: string;
17
19
  hslArr: number[];
@@ -34,6 +34,10 @@ var useSetupColorPicker = function useSetupColorPicker(_ref) {
34
34
  _useState8 = _slicedToArray(_useState7, 2),
35
35
  shadeName = _useState8[0],
36
36
  setShadeName = _useState8[1];
37
+ var _useState9 = useState(ColorPickerUtils.getHexValueWithoutHash(colorValue)),
38
+ _useState10 = _slicedToArray(_useState9, 2),
39
+ typedInputValue = _useState10[0],
40
+ setTypedInputValue = _useState10[1];
37
41
  var _getDetails = getDetails(colorValue),
38
42
  degrees = _getDetails.degrees;
39
43
  var savedDegRef = useRef(isNaN(degrees) ? 180 : degrees);
@@ -108,6 +112,8 @@ var useSetupColorPicker = function useSetupColorPicker(_ref) {
108
112
  color: colorValue,
109
113
  previousSolidColor: previousSolidColor,
110
114
  previousGradientColor: previousGradientColor,
115
+ typedInputValue: typedInputValue,
116
+ setTypedInputValue: setTypedInputValue,
111
117
  setColor: setColor,
112
118
  hex: hex,
113
119
  hslArr: hslArr,
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA,2BAA2B,qFAAyF;AACpH,+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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA,2BAA2B,qFAAyF;AACpH,+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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -45,7 +45,7 @@ var Input = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
45
45
  onKeyUp: onKeyUp,
46
46
  type: type,
47
47
  className: cn('aurora-h-[40px] aurora-w-full focus:aurora-outline-none focus:aurora-shadow-none aurora-px-2 aurora-rounded-6', {
48
- '!aurora-cursor-pointer': hasCursorPointer
48
+ 'aurora-cursor-pointer': hasCursorPointer
49
49
  })
50
50
  })), postElement && /*#__PURE__*/React.createElement("div", {
51
51
  className: "aurora-flex aurora-h-full aurora-right-0 aurora-pr-2 aurora-items-center"
@@ -14,7 +14,7 @@ var TooltipContent = /*#__PURE__*/forwardRef(function (_ref, ref) {
14
14
  return /*#__PURE__*/createElement(Portal, null, /*#__PURE__*/createElement(Content, _objectSpread2({
15
15
  ref: ref,
16
16
  sideOffset: sideOffset,
17
- className: cn('aurora-z-[1000] aurora-max-w-[320px] aurora-shadow aurora-overflow-hidden aurora-border aurora-rounded-8 aurora-px-3 aurora-py-2 aurora-text-xs aurora-animate-in aurora-fade-in-0 data-[state=closed]:aurora-animate-out data-[state=closed]:aurora-fade-out-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', 'js__aurora-tooltip-content', tooltipContentVariants({
17
+ className: cn('aurora-z-[99999] aurora-max-w-[320px] aurora-shadow aurora-overflow-hidden aurora-border aurora-rounded-8 aurora-px-3 aurora-py-2 aurora-text-xs aurora-animate-in aurora-fade-in-0 data-[state=closed]:aurora-animate-out data-[state=closed]:aurora-fade-out-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', 'js__aurora-tooltip-content', tooltipContentVariants({
18
18
  variant: variant
19
19
  }), className)
20
20
  }, props)));