@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.
- package/build/cjs/packages/aurora/src/components/color_picker/color_picker.js +5 -1
- package/build/cjs/packages/aurora/src/components/color_picker/color_picker.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/color_picker/color_picker_utils.js +3 -0
- package/build/cjs/packages/aurora/src/components/color_picker/color_picker_utils.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_input.js +3 -1
- package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_input.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_inputs/color_picker_inputs_hex/color_picker_inputs_hex.js +1 -1
- 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
- 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
- package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_inputs/color_picker_inputs_rgba.js +3 -3
- package/build/cjs/packages/aurora/src/components/color_picker/components/pure_color_picker.js +2 -3
- package/build/cjs/packages/aurora/src/components/color_picker/components/pure_color_picker.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/color_picker/hooks/setup_color_picker.js +6 -0
- package/build/cjs/packages/aurora/src/components/color_picker/hooks/setup_color_picker.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/input/input.js +1 -1
- package/build/cjs/packages/aurora/src/components/tooltip/components/tooltip_content.js +1 -1
- package/build/esm/packages/aurora/src/components/color_picker/color_picker.js +5 -1
- package/build/esm/packages/aurora/src/components/color_picker/color_picker.js.map +1 -1
- package/build/esm/packages/aurora/src/components/color_picker/color_picker_types.d.ts +2 -0
- package/build/esm/packages/aurora/src/components/color_picker/color_picker_utils.d.ts +1 -0
- package/build/esm/packages/aurora/src/components/color_picker/color_picker_utils.js +3 -0
- package/build/esm/packages/aurora/src/components/color_picker/color_picker_utils.js.map +1 -1
- package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_input.js +3 -1
- package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_input.js.map +1 -1
- package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_inputs/color_picker_inputs_hex/color_picker_inputs_hex.js +1 -1
- 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
- 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
- package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_inputs/color_picker_inputs_rgba.js +3 -3
- package/build/esm/packages/aurora/src/components/color_picker/components/pure_color_picker.js +2 -3
- package/build/esm/packages/aurora/src/components/color_picker/components/pure_color_picker.js.map +1 -1
- package/build/esm/packages/aurora/src/components/color_picker/hooks/setup_color_picker.d.ts +2 -0
- package/build/esm/packages/aurora/src/components/color_picker/hooks/setup_color_picker.js +6 -0
- package/build/esm/packages/aurora/src/components/color_picker/hooks/setup_color_picker.js.map +1 -1
- package/build/esm/packages/aurora/src/components/input/input.js +1 -1
- package/build/esm/packages/aurora/src/components/tooltip/components/tooltip_content.js +1 -1
- package/build/index.css +1 -1
- 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;"}
|
package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_input.js
CHANGED
|
@@ -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, {
|
package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_input.js.map
CHANGED
|
@@ -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-
|
|
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-
|
|
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-
|
|
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-
|
|
39
|
+
className: "aurora-h-full aurora-text-xs",
|
|
40
40
|
type: "text",
|
|
41
41
|
value: rgbaArr[2],
|
|
42
42
|
onChange: function onChange(e) {
|
package/build/cjs/packages/aurora/src/components/color_picker/components/pure_color_picker.js
CHANGED
|
@@ -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(
|
|
60
|
-
|
|
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)
|
package/build/cjs/packages/aurora/src/components/color_picker/components/pure_color_picker.js.map
CHANGED
|
@@ -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;
|
|
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,
|
package/build/cjs/packages/aurora/src/components/color_picker/hooks/setup_color_picker.js.map
CHANGED
|
@@ -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
|
-
'
|
|
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-[
|
|
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;"}
|
package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_input.js
CHANGED
|
@@ -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, {
|
package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_input.js.map
CHANGED
|
@@ -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-
|
|
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-
|
|
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-
|
|
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-
|
|
31
|
+
className: "aurora-h-full aurora-text-xs",
|
|
32
32
|
type: "text",
|
|
33
33
|
value: rgbaArr[2],
|
|
34
34
|
onChange: function onChange(e) {
|
package/build/esm/packages/aurora/src/components/color_picker/components/pure_color_picker.js
CHANGED
|
@@ -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(
|
|
52
|
-
|
|
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)
|
package/build/esm/packages/aurora/src/components/color_picker/components/pure_color_picker.js.map
CHANGED
|
@@ -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;
|
|
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,
|
package/build/esm/packages/aurora/src/components/color_picker/hooks/setup_color_picker.js.map
CHANGED
|
@@ -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
|
-
'
|
|
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-[
|
|
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)));
|