@react-stately/color 3.6.1-nightly.4624 → 3.6.1

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/dist/useColor.mjs CHANGED
@@ -15,7 +15,7 @@ import {useMemo as $2sEeQ$useMemo} from "react";
15
15
 
16
16
  function $aa90ad8b2b1d015f$export$5aadd9c0606af5c2(value) {
17
17
  return (0, $2sEeQ$useMemo)(()=>{
18
- if (typeof value === "string") try {
18
+ if (typeof value === 'string') try {
19
19
  return (0, $799cddbef784668f$export$6e865ea70d7724f)(value);
20
20
  } catch (err) {
21
21
  return undefined;
@@ -15,7 +15,7 @@ import {useMemo as $2sEeQ$useMemo} from "react";
15
15
 
16
16
  function $aa90ad8b2b1d015f$export$5aadd9c0606af5c2(value) {
17
17
  return (0, $2sEeQ$useMemo)(()=>{
18
- if (typeof value === "string") try {
18
+ if (typeof value === 'string') try {
19
19
  return (0, $799cddbef784668f$export$6e865ea70d7724f)(value);
20
20
  } catch (err) {
21
21
  return undefined;
@@ -21,7 +21,7 @@ $parcel$export(module.exports, "useColorAreaState", () => $af2d7ac9990cfee2$expo
21
21
  */
22
22
 
23
23
 
24
- const $af2d7ac9990cfee2$var$DEFAULT_COLOR = (0, $83fe1a57d631223b$exports.parseColor)("#ffffff");
24
+ const $af2d7ac9990cfee2$var$DEFAULT_COLOR = (0, $83fe1a57d631223b$exports.parseColor)('#ffffff');
25
25
  function $af2d7ac9990cfee2$export$6df7f0e2cabc7eef(props) {
26
26
  let { value: value, defaultValue: defaultValue, colorSpace: colorSpace, xChannel: xChannel, yChannel: yChannel, onChange: onChange, onChangeEnd: onChangeEnd } = props;
27
27
  if (!value && !defaultValue) defaultValue = $af2d7ac9990cfee2$var$DEFAULT_COLOR;
@@ -119,7 +119,7 @@ function $af2d7ac9990cfee2$export$6df7f0e2cabc7eef(props) {
119
119
  },
120
120
  isDragging: isDragging,
121
121
  getDisplayColor () {
122
- return color.withChannelValue("alpha", 1);
122
+ return color.withChannelValue('alpha', 1);
123
123
  }
124
124
  };
125
125
  }
@@ -15,7 +15,7 @@ import {useMemo as $5ShDH$useMemo, useRef as $5ShDH$useRef, useState as $5ShDH$u
15
15
  */
16
16
 
17
17
 
18
- const $6e14a98a7f67141d$var$DEFAULT_COLOR = (0, $799cddbef784668f$export$6e865ea70d7724f)("#ffffff");
18
+ const $6e14a98a7f67141d$var$DEFAULT_COLOR = (0, $799cddbef784668f$export$6e865ea70d7724f)('#ffffff');
19
19
  function $6e14a98a7f67141d$export$6df7f0e2cabc7eef(props) {
20
20
  let { value: value, defaultValue: defaultValue, colorSpace: colorSpace, xChannel: xChannel, yChannel: yChannel, onChange: onChange, onChangeEnd: onChangeEnd } = props;
21
21
  if (!value && !defaultValue) defaultValue = $6e14a98a7f67141d$var$DEFAULT_COLOR;
@@ -113,7 +113,7 @@ function $6e14a98a7f67141d$export$6df7f0e2cabc7eef(props) {
113
113
  },
114
114
  isDragging: isDragging,
115
115
  getDisplayColor () {
116
- return color.withChannelValue("alpha", 1);
116
+ return color.withChannelValue('alpha', 1);
117
117
  }
118
118
  };
119
119
  }
@@ -15,7 +15,7 @@ import {useMemo as $5ShDH$useMemo, useRef as $5ShDH$useRef, useState as $5ShDH$u
15
15
  */
16
16
 
17
17
 
18
- const $6e14a98a7f67141d$var$DEFAULT_COLOR = (0, $799cddbef784668f$export$6e865ea70d7724f)("#ffffff");
18
+ const $6e14a98a7f67141d$var$DEFAULT_COLOR = (0, $799cddbef784668f$export$6e865ea70d7724f)('#ffffff');
19
19
  function $6e14a98a7f67141d$export$6df7f0e2cabc7eef(props) {
20
20
  let { value: value, defaultValue: defaultValue, colorSpace: colorSpace, xChannel: xChannel, yChannel: yChannel, onChange: onChange, onChangeEnd: onChangeEnd } = props;
21
21
  if (!value && !defaultValue) defaultValue = $6e14a98a7f67141d$var$DEFAULT_COLOR;
@@ -113,7 +113,7 @@ function $6e14a98a7f67141d$export$6df7f0e2cabc7eef(props) {
113
113
  },
114
114
  isDragging: isDragging,
115
115
  getDisplayColor () {
116
- return color.withChannelValue("alpha", 1);
116
+ return color.withChannelValue('alpha', 1);
117
117
  }
118
118
  };
119
119
  }
@@ -16,7 +16,7 @@ $parcel$export(module.exports, "useColorChannelFieldState", () => $9f9c35e37074b
16
16
  function $9f9c35e37074b99b$export$b9fc0d69c9190c4a(props) {
17
17
  let { channel: channel, colorSpace: colorSpace, locale: locale } = props;
18
18
  let initialValue = (0, $f8b3be23ba4462b1$exports.useColor)(props.value);
19
- let initialDefaultValue = (0, $f8b3be23ba4462b1$exports.useColor)(props.defaultValue || "#0000");
19
+ let initialDefaultValue = (0, $f8b3be23ba4462b1$exports.useColor)(props.defaultValue || '#0000');
20
20
  let [colorValue, setColor] = (0, $8s2vy$reactstatelyutils.useControlledState)(initialValue || undefined, initialDefaultValue, props.onChange);
21
21
  let color = (0, $8s2vy$react.useMemo)(()=>colorSpace && colorValue ? colorValue.toFormat(colorSpace) : colorValue, [
22
22
  colorValue,
@@ -28,7 +28,7 @@ function $9f9c35e37074b99b$export$b9fc0d69c9190c4a(props) {
28
28
  color,
29
29
  channel
30
30
  ]);
31
- let multiplier = formatOptions.style === "percent" && range.maxValue === 100 ? 100 : 1;
31
+ let multiplier = formatOptions.style === 'percent' && range.maxValue === 100 ? 100 : 1;
32
32
  let numberFieldState = (0, $8s2vy$reactstatelynumberfield.useNumberFieldState)({
33
33
  locale: locale,
34
34
  value: value / multiplier,
@@ -10,7 +10,7 @@ import {useMemo as $52OvP$useMemo} from "react";
10
10
  function $31a863bb88e75dd6$export$b9fc0d69c9190c4a(props) {
11
11
  let { channel: channel, colorSpace: colorSpace, locale: locale } = props;
12
12
  let initialValue = (0, $aa90ad8b2b1d015f$export$5aadd9c0606af5c2)(props.value);
13
- let initialDefaultValue = (0, $aa90ad8b2b1d015f$export$5aadd9c0606af5c2)(props.defaultValue || "#0000");
13
+ let initialDefaultValue = (0, $aa90ad8b2b1d015f$export$5aadd9c0606af5c2)(props.defaultValue || '#0000');
14
14
  let [colorValue, setColor] = (0, $52OvP$useControlledState)(initialValue || undefined, initialDefaultValue, props.onChange);
15
15
  let color = (0, $52OvP$useMemo)(()=>colorSpace && colorValue ? colorValue.toFormat(colorSpace) : colorValue, [
16
16
  colorValue,
@@ -22,7 +22,7 @@ function $31a863bb88e75dd6$export$b9fc0d69c9190c4a(props) {
22
22
  color,
23
23
  channel
24
24
  ]);
25
- let multiplier = formatOptions.style === "percent" && range.maxValue === 100 ? 100 : 1;
25
+ let multiplier = formatOptions.style === 'percent' && range.maxValue === 100 ? 100 : 1;
26
26
  let numberFieldState = (0, $52OvP$useNumberFieldState)({
27
27
  locale: locale,
28
28
  value: value / multiplier,
@@ -10,7 +10,7 @@ import {useMemo as $52OvP$useMemo} from "react";
10
10
  function $31a863bb88e75dd6$export$b9fc0d69c9190c4a(props) {
11
11
  let { channel: channel, colorSpace: colorSpace, locale: locale } = props;
12
12
  let initialValue = (0, $aa90ad8b2b1d015f$export$5aadd9c0606af5c2)(props.value);
13
- let initialDefaultValue = (0, $aa90ad8b2b1d015f$export$5aadd9c0606af5c2)(props.defaultValue || "#0000");
13
+ let initialDefaultValue = (0, $aa90ad8b2b1d015f$export$5aadd9c0606af5c2)(props.defaultValue || '#0000');
14
14
  let [colorValue, setColor] = (0, $52OvP$useControlledState)(initialValue || undefined, initialDefaultValue, props.onChange);
15
15
  let color = (0, $52OvP$useMemo)(()=>colorSpace && colorValue ? colorValue.toFormat(colorSpace) : colorValue, [
16
16
  colorValue,
@@ -22,7 +22,7 @@ function $31a863bb88e75dd6$export$b9fc0d69c9190c4a(props) {
22
22
  color,
23
23
  channel
24
24
  ]);
25
- let multiplier = formatOptions.style === "percent" && range.maxValue === 100 ? 100 : 1;
25
+ let multiplier = formatOptions.style === 'percent' && range.maxValue === 100 ? 100 : 1;
26
26
  let numberFieldState = (0, $52OvP$useNumberFieldState)({
27
27
  locale: locale,
28
28
  value: value / multiplier,
@@ -25,17 +25,17 @@ $parcel$export(module.exports, "useColorFieldState", () => $d59d0c2b2ce1568f$exp
25
25
 
26
26
 
27
27
 
28
- const $d59d0c2b2ce1568f$var$MIN_COLOR = (0, $83fe1a57d631223b$exports.parseColor)("#000000");
29
- const $d59d0c2b2ce1568f$var$MAX_COLOR = (0, $83fe1a57d631223b$exports.parseColor)("#FFFFFF");
28
+ const $d59d0c2b2ce1568f$var$MIN_COLOR = (0, $83fe1a57d631223b$exports.parseColor)('#000000');
29
+ const $d59d0c2b2ce1568f$var$MAX_COLOR = (0, $83fe1a57d631223b$exports.parseColor)('#FFFFFF');
30
30
  const $d59d0c2b2ce1568f$var$MIN_COLOR_INT = $d59d0c2b2ce1568f$var$MIN_COLOR.toHexInt();
31
31
  const $d59d0c2b2ce1568f$var$MAX_COLOR_INT = $d59d0c2b2ce1568f$var$MAX_COLOR.toHexInt();
32
32
  function $d59d0c2b2ce1568f$export$d52a01683abdfcd6(props) {
33
33
  let { value: value, defaultValue: defaultValue, onChange: onChange } = props;
34
- let { step: step } = $d59d0c2b2ce1568f$var$MIN_COLOR.getChannelRange("red");
34
+ let { step: step } = $d59d0c2b2ce1568f$var$MIN_COLOR.getChannelRange('red');
35
35
  let initialValue = (0, $f8b3be23ba4462b1$exports.useColor)(value);
36
36
  let initialDefaultValue = (0, $f8b3be23ba4462b1$exports.useColor)(defaultValue);
37
37
  let [colorValue, setColorValue] = (0, $41neA$reactstatelyutils.useControlledState)(initialValue, initialDefaultValue, onChange);
38
- let [inputValue, setInputValue] = (0, $41neA$react.useState)(()=>(value || defaultValue) && colorValue ? colorValue.toString("hex") : "");
38
+ let [inputValue, setInputValue] = (0, $41neA$react.useState)(()=>(value || defaultValue) && colorValue ? colorValue.toString('hex') : '');
39
39
  let validation = (0, $41neA$reactstatelyform.useFormValidationState)({
40
40
  ...props,
41
41
  value: colorValue
@@ -52,13 +52,13 @@ function $d59d0c2b2ce1568f$export$d52a01683abdfcd6(props) {
52
52
  };
53
53
  let [prevValue, setPrevValue] = (0, $41neA$react.useState)(colorValue);
54
54
  if (prevValue !== colorValue) {
55
- setInputValue(colorValue ? colorValue.toString("hex") : "");
55
+ setInputValue(colorValue ? colorValue.toString('hex') : '');
56
56
  setPrevValue(colorValue);
57
57
  }
58
58
  let parsedValue = (0, $41neA$react.useMemo)(()=>{
59
59
  let color;
60
60
  try {
61
- color = (0, $83fe1a57d631223b$exports.parseColor)(inputValue.startsWith("#") ? inputValue : `#${inputValue}`);
61
+ color = (0, $83fe1a57d631223b$exports.parseColor)(inputValue.startsWith('#') ? inputValue : `#${inputValue}`);
62
62
  } catch (err) {
63
63
  color = null;
64
64
  }
@@ -70,18 +70,18 @@ function $d59d0c2b2ce1568f$export$d52a01683abdfcd6(props) {
70
70
  // Set to empty state if input value is empty
71
71
  if (!inputValue.length) {
72
72
  safelySetColorValue(null);
73
- setInputValue(value === undefined ? "" : colorValue.toString("hex"));
73
+ setInputValue(value === undefined ? '' : colorValue.toString('hex'));
74
74
  return;
75
75
  }
76
76
  // if it failed to parse, then reset input to formatted version of current number
77
77
  if (parsedValue == null) {
78
- setInputValue(colorValue ? colorValue.toString("hex") : "");
78
+ setInputValue(colorValue ? colorValue.toString('hex') : '');
79
79
  return;
80
80
  }
81
81
  safelySetColorValue(parsedValue);
82
82
  // in a controlled state, the numberValue won't change, so we won't go back to our old input without help
83
- let newColorValue = "";
84
- if (colorValue) newColorValue = colorValue.toString("hex");
83
+ let newColorValue = '';
84
+ if (colorValue) newColorValue = colorValue.toString('hex');
85
85
  setInputValue(newColorValue);
86
86
  };
87
87
  let increment = ()=>{
@@ -90,7 +90,7 @@ function $d59d0c2b2ce1568f$export$d52a01683abdfcd6(props) {
90
90
  // input value should be updated to match
91
91
  // ex type 4, press increment, highlight the number in the input, type 4 again, press increment
92
92
  // you'd be at 5, then incrementing to 5 again, so no re-render would happen and 4 would be left in the input
93
- if (newValue === colorValue) setInputValue(newValue.toString("hex"));
93
+ if (newValue === colorValue) setInputValue(newValue.toString('hex'));
94
94
  safelySetColorValue(newValue);
95
95
  validation.commitValidation();
96
96
  };
@@ -100,7 +100,7 @@ function $d59d0c2b2ce1568f$export$d52a01683abdfcd6(props) {
100
100
  // input value should be updated to match
101
101
  // ex type 4, press increment, highlight the number in the input, type 4 again, press increment
102
102
  // you'd be at 5, then incrementing to 5 again, so no re-render would happen and 4 would be left in the input
103
- if (newValue === colorValue) setInputValue(newValue.toString("hex"));
103
+ if (newValue === colorValue) setInputValue(newValue.toString('hex'));
104
104
  safelySetColorValue(newValue);
105
105
  validation.commitValidation();
106
106
  };
@@ -108,7 +108,7 @@ function $d59d0c2b2ce1568f$export$d52a01683abdfcd6(props) {
108
108
  let decrementToMin = ()=>safelySetColorValue($d59d0c2b2ce1568f$var$MIN_COLOR);
109
109
  let validate = (value)=>{
110
110
  var _value_match;
111
- return value === "" || !!((_value_match = value.match(/^#?[0-9a-f]{0,6}$/i)) === null || _value_match === void 0 ? void 0 : _value_match[0]);
111
+ return value === '' || !!((_value_match = value.match(/^#?[0-9a-f]{0,6}$/i)) === null || _value_match === void 0 ? void 0 : _value_match[0]);
112
112
  };
113
113
  return {
114
114
  ...validation,
@@ -128,7 +128,7 @@ function $d59d0c2b2ce1568f$var$addColorValue(color, step) {
128
128
  let colorInt = newColor.toHexInt();
129
129
  let clampInt = Math.min(Math.max(colorInt + step, $d59d0c2b2ce1568f$var$MIN_COLOR_INT), $d59d0c2b2ce1568f$var$MAX_COLOR_INT);
130
130
  if (clampInt !== colorInt) {
131
- let newColorString = `#${clampInt.toString(16).padStart(6, "0").toUpperCase()}`;
131
+ let newColorString = `#${clampInt.toString(16).padStart(6, '0').toUpperCase()}`;
132
132
  newColor = (0, $83fe1a57d631223b$exports.parseColor)(newColorString);
133
133
  }
134
134
  return newColor;
@@ -19,17 +19,17 @@ import {useState as $aP5W6$useState, useMemo as $aP5W6$useMemo} from "react";
19
19
 
20
20
 
21
21
 
22
- const $b335ada08155d9c0$var$MIN_COLOR = (0, $799cddbef784668f$export$6e865ea70d7724f)("#000000");
23
- const $b335ada08155d9c0$var$MAX_COLOR = (0, $799cddbef784668f$export$6e865ea70d7724f)("#FFFFFF");
22
+ const $b335ada08155d9c0$var$MIN_COLOR = (0, $799cddbef784668f$export$6e865ea70d7724f)('#000000');
23
+ const $b335ada08155d9c0$var$MAX_COLOR = (0, $799cddbef784668f$export$6e865ea70d7724f)('#FFFFFF');
24
24
  const $b335ada08155d9c0$var$MIN_COLOR_INT = $b335ada08155d9c0$var$MIN_COLOR.toHexInt();
25
25
  const $b335ada08155d9c0$var$MAX_COLOR_INT = $b335ada08155d9c0$var$MAX_COLOR.toHexInt();
26
26
  function $b335ada08155d9c0$export$d52a01683abdfcd6(props) {
27
27
  let { value: value, defaultValue: defaultValue, onChange: onChange } = props;
28
- let { step: step } = $b335ada08155d9c0$var$MIN_COLOR.getChannelRange("red");
28
+ let { step: step } = $b335ada08155d9c0$var$MIN_COLOR.getChannelRange('red');
29
29
  let initialValue = (0, $aa90ad8b2b1d015f$export$5aadd9c0606af5c2)(value);
30
30
  let initialDefaultValue = (0, $aa90ad8b2b1d015f$export$5aadd9c0606af5c2)(defaultValue);
31
31
  let [colorValue, setColorValue] = (0, $aP5W6$useControlledState)(initialValue, initialDefaultValue, onChange);
32
- let [inputValue, setInputValue] = (0, $aP5W6$useState)(()=>(value || defaultValue) && colorValue ? colorValue.toString("hex") : "");
32
+ let [inputValue, setInputValue] = (0, $aP5W6$useState)(()=>(value || defaultValue) && colorValue ? colorValue.toString('hex') : '');
33
33
  let validation = (0, $aP5W6$useFormValidationState)({
34
34
  ...props,
35
35
  value: colorValue
@@ -46,13 +46,13 @@ function $b335ada08155d9c0$export$d52a01683abdfcd6(props) {
46
46
  };
47
47
  let [prevValue, setPrevValue] = (0, $aP5W6$useState)(colorValue);
48
48
  if (prevValue !== colorValue) {
49
- setInputValue(colorValue ? colorValue.toString("hex") : "");
49
+ setInputValue(colorValue ? colorValue.toString('hex') : '');
50
50
  setPrevValue(colorValue);
51
51
  }
52
52
  let parsedValue = (0, $aP5W6$useMemo)(()=>{
53
53
  let color;
54
54
  try {
55
- color = (0, $799cddbef784668f$export$6e865ea70d7724f)(inputValue.startsWith("#") ? inputValue : `#${inputValue}`);
55
+ color = (0, $799cddbef784668f$export$6e865ea70d7724f)(inputValue.startsWith('#') ? inputValue : `#${inputValue}`);
56
56
  } catch (err) {
57
57
  color = null;
58
58
  }
@@ -64,18 +64,18 @@ function $b335ada08155d9c0$export$d52a01683abdfcd6(props) {
64
64
  // Set to empty state if input value is empty
65
65
  if (!inputValue.length) {
66
66
  safelySetColorValue(null);
67
- setInputValue(value === undefined ? "" : colorValue.toString("hex"));
67
+ setInputValue(value === undefined ? '' : colorValue.toString('hex'));
68
68
  return;
69
69
  }
70
70
  // if it failed to parse, then reset input to formatted version of current number
71
71
  if (parsedValue == null) {
72
- setInputValue(colorValue ? colorValue.toString("hex") : "");
72
+ setInputValue(colorValue ? colorValue.toString('hex') : '');
73
73
  return;
74
74
  }
75
75
  safelySetColorValue(parsedValue);
76
76
  // in a controlled state, the numberValue won't change, so we won't go back to our old input without help
77
- let newColorValue = "";
78
- if (colorValue) newColorValue = colorValue.toString("hex");
77
+ let newColorValue = '';
78
+ if (colorValue) newColorValue = colorValue.toString('hex');
79
79
  setInputValue(newColorValue);
80
80
  };
81
81
  let increment = ()=>{
@@ -84,7 +84,7 @@ function $b335ada08155d9c0$export$d52a01683abdfcd6(props) {
84
84
  // input value should be updated to match
85
85
  // ex type 4, press increment, highlight the number in the input, type 4 again, press increment
86
86
  // you'd be at 5, then incrementing to 5 again, so no re-render would happen and 4 would be left in the input
87
- if (newValue === colorValue) setInputValue(newValue.toString("hex"));
87
+ if (newValue === colorValue) setInputValue(newValue.toString('hex'));
88
88
  safelySetColorValue(newValue);
89
89
  validation.commitValidation();
90
90
  };
@@ -94,7 +94,7 @@ function $b335ada08155d9c0$export$d52a01683abdfcd6(props) {
94
94
  // input value should be updated to match
95
95
  // ex type 4, press increment, highlight the number in the input, type 4 again, press increment
96
96
  // you'd be at 5, then incrementing to 5 again, so no re-render would happen and 4 would be left in the input
97
- if (newValue === colorValue) setInputValue(newValue.toString("hex"));
97
+ if (newValue === colorValue) setInputValue(newValue.toString('hex'));
98
98
  safelySetColorValue(newValue);
99
99
  validation.commitValidation();
100
100
  };
@@ -102,7 +102,7 @@ function $b335ada08155d9c0$export$d52a01683abdfcd6(props) {
102
102
  let decrementToMin = ()=>safelySetColorValue($b335ada08155d9c0$var$MIN_COLOR);
103
103
  let validate = (value)=>{
104
104
  var _value_match;
105
- return value === "" || !!((_value_match = value.match(/^#?[0-9a-f]{0,6}$/i)) === null || _value_match === void 0 ? void 0 : _value_match[0]);
105
+ return value === '' || !!((_value_match = value.match(/^#?[0-9a-f]{0,6}$/i)) === null || _value_match === void 0 ? void 0 : _value_match[0]);
106
106
  };
107
107
  return {
108
108
  ...validation,
@@ -122,7 +122,7 @@ function $b335ada08155d9c0$var$addColorValue(color, step) {
122
122
  let colorInt = newColor.toHexInt();
123
123
  let clampInt = Math.min(Math.max(colorInt + step, $b335ada08155d9c0$var$MIN_COLOR_INT), $b335ada08155d9c0$var$MAX_COLOR_INT);
124
124
  if (clampInt !== colorInt) {
125
- let newColorString = `#${clampInt.toString(16).padStart(6, "0").toUpperCase()}`;
125
+ let newColorString = `#${clampInt.toString(16).padStart(6, '0').toUpperCase()}`;
126
126
  newColor = (0, $799cddbef784668f$export$6e865ea70d7724f)(newColorString);
127
127
  }
128
128
  return newColor;
@@ -19,17 +19,17 @@ import {useState as $aP5W6$useState, useMemo as $aP5W6$useMemo} from "react";
19
19
 
20
20
 
21
21
 
22
- const $b335ada08155d9c0$var$MIN_COLOR = (0, $799cddbef784668f$export$6e865ea70d7724f)("#000000");
23
- const $b335ada08155d9c0$var$MAX_COLOR = (0, $799cddbef784668f$export$6e865ea70d7724f)("#FFFFFF");
22
+ const $b335ada08155d9c0$var$MIN_COLOR = (0, $799cddbef784668f$export$6e865ea70d7724f)('#000000');
23
+ const $b335ada08155d9c0$var$MAX_COLOR = (0, $799cddbef784668f$export$6e865ea70d7724f)('#FFFFFF');
24
24
  const $b335ada08155d9c0$var$MIN_COLOR_INT = $b335ada08155d9c0$var$MIN_COLOR.toHexInt();
25
25
  const $b335ada08155d9c0$var$MAX_COLOR_INT = $b335ada08155d9c0$var$MAX_COLOR.toHexInt();
26
26
  function $b335ada08155d9c0$export$d52a01683abdfcd6(props) {
27
27
  let { value: value, defaultValue: defaultValue, onChange: onChange } = props;
28
- let { step: step } = $b335ada08155d9c0$var$MIN_COLOR.getChannelRange("red");
28
+ let { step: step } = $b335ada08155d9c0$var$MIN_COLOR.getChannelRange('red');
29
29
  let initialValue = (0, $aa90ad8b2b1d015f$export$5aadd9c0606af5c2)(value);
30
30
  let initialDefaultValue = (0, $aa90ad8b2b1d015f$export$5aadd9c0606af5c2)(defaultValue);
31
31
  let [colorValue, setColorValue] = (0, $aP5W6$useControlledState)(initialValue, initialDefaultValue, onChange);
32
- let [inputValue, setInputValue] = (0, $aP5W6$useState)(()=>(value || defaultValue) && colorValue ? colorValue.toString("hex") : "");
32
+ let [inputValue, setInputValue] = (0, $aP5W6$useState)(()=>(value || defaultValue) && colorValue ? colorValue.toString('hex') : '');
33
33
  let validation = (0, $aP5W6$useFormValidationState)({
34
34
  ...props,
35
35
  value: colorValue
@@ -46,13 +46,13 @@ function $b335ada08155d9c0$export$d52a01683abdfcd6(props) {
46
46
  };
47
47
  let [prevValue, setPrevValue] = (0, $aP5W6$useState)(colorValue);
48
48
  if (prevValue !== colorValue) {
49
- setInputValue(colorValue ? colorValue.toString("hex") : "");
49
+ setInputValue(colorValue ? colorValue.toString('hex') : '');
50
50
  setPrevValue(colorValue);
51
51
  }
52
52
  let parsedValue = (0, $aP5W6$useMemo)(()=>{
53
53
  let color;
54
54
  try {
55
- color = (0, $799cddbef784668f$export$6e865ea70d7724f)(inputValue.startsWith("#") ? inputValue : `#${inputValue}`);
55
+ color = (0, $799cddbef784668f$export$6e865ea70d7724f)(inputValue.startsWith('#') ? inputValue : `#${inputValue}`);
56
56
  } catch (err) {
57
57
  color = null;
58
58
  }
@@ -64,18 +64,18 @@ function $b335ada08155d9c0$export$d52a01683abdfcd6(props) {
64
64
  // Set to empty state if input value is empty
65
65
  if (!inputValue.length) {
66
66
  safelySetColorValue(null);
67
- setInputValue(value === undefined ? "" : colorValue.toString("hex"));
67
+ setInputValue(value === undefined ? '' : colorValue.toString('hex'));
68
68
  return;
69
69
  }
70
70
  // if it failed to parse, then reset input to formatted version of current number
71
71
  if (parsedValue == null) {
72
- setInputValue(colorValue ? colorValue.toString("hex") : "");
72
+ setInputValue(colorValue ? colorValue.toString('hex') : '');
73
73
  return;
74
74
  }
75
75
  safelySetColorValue(parsedValue);
76
76
  // in a controlled state, the numberValue won't change, so we won't go back to our old input without help
77
- let newColorValue = "";
78
- if (colorValue) newColorValue = colorValue.toString("hex");
77
+ let newColorValue = '';
78
+ if (colorValue) newColorValue = colorValue.toString('hex');
79
79
  setInputValue(newColorValue);
80
80
  };
81
81
  let increment = ()=>{
@@ -84,7 +84,7 @@ function $b335ada08155d9c0$export$d52a01683abdfcd6(props) {
84
84
  // input value should be updated to match
85
85
  // ex type 4, press increment, highlight the number in the input, type 4 again, press increment
86
86
  // you'd be at 5, then incrementing to 5 again, so no re-render would happen and 4 would be left in the input
87
- if (newValue === colorValue) setInputValue(newValue.toString("hex"));
87
+ if (newValue === colorValue) setInputValue(newValue.toString('hex'));
88
88
  safelySetColorValue(newValue);
89
89
  validation.commitValidation();
90
90
  };
@@ -94,7 +94,7 @@ function $b335ada08155d9c0$export$d52a01683abdfcd6(props) {
94
94
  // input value should be updated to match
95
95
  // ex type 4, press increment, highlight the number in the input, type 4 again, press increment
96
96
  // you'd be at 5, then incrementing to 5 again, so no re-render would happen and 4 would be left in the input
97
- if (newValue === colorValue) setInputValue(newValue.toString("hex"));
97
+ if (newValue === colorValue) setInputValue(newValue.toString('hex'));
98
98
  safelySetColorValue(newValue);
99
99
  validation.commitValidation();
100
100
  };
@@ -102,7 +102,7 @@ function $b335ada08155d9c0$export$d52a01683abdfcd6(props) {
102
102
  let decrementToMin = ()=>safelySetColorValue($b335ada08155d9c0$var$MIN_COLOR);
103
103
  let validate = (value)=>{
104
104
  var _value_match;
105
- return value === "" || !!((_value_match = value.match(/^#?[0-9a-f]{0,6}$/i)) === null || _value_match === void 0 ? void 0 : _value_match[0]);
105
+ return value === '' || !!((_value_match = value.match(/^#?[0-9a-f]{0,6}$/i)) === null || _value_match === void 0 ? void 0 : _value_match[0]);
106
106
  };
107
107
  return {
108
108
  ...validation,
@@ -122,7 +122,7 @@ function $b335ada08155d9c0$var$addColorValue(color, step) {
122
122
  let colorInt = newColor.toHexInt();
123
123
  let clampInt = Math.min(Math.max(colorInt + step, $b335ada08155d9c0$var$MIN_COLOR_INT), $b335ada08155d9c0$var$MAX_COLOR_INT);
124
124
  if (clampInt !== colorInt) {
125
- let newColorString = `#${clampInt.toString(16).padStart(6, "0").toUpperCase()}`;
125
+ let newColorString = `#${clampInt.toString(16).padStart(6, '0').toUpperCase()}`;
126
126
  newColor = (0, $799cddbef784668f$export$6e865ea70d7724f)(newColorString);
127
127
  }
128
128
  return newColor;
@@ -13,12 +13,12 @@ $parcel$export(module.exports, "useColorPickerState", () => $f31788ea48a5c383$ex
13
13
 
14
14
  function $f31788ea48a5c383$export$dc6b73b623f8645f(props) {
15
15
  let value = (0, $f8b3be23ba4462b1$exports.useColor)(props.value);
16
- let defaultValue = (0, $f8b3be23ba4462b1$exports.useColor)(props.defaultValue || "#0000");
16
+ let defaultValue = (0, $f8b3be23ba4462b1$exports.useColor)(props.defaultValue || '#0000');
17
17
  let [color, setColor] = (0, $1Pz5H$reactstatelyutils.useControlledState)(value || undefined, defaultValue, props.onChange);
18
18
  return {
19
19
  color: color,
20
20
  setColor (color) {
21
- setColor(color || (0, $83fe1a57d631223b$exports.parseColor)("#0000"));
21
+ setColor(color || (0, $83fe1a57d631223b$exports.parseColor)('#0000'));
22
22
  }
23
23
  };
24
24
  }
@@ -7,12 +7,12 @@ import {useControlledState as $5GESt$useControlledState} from "@react-stately/ut
7
7
 
8
8
  function $309d2b7669014898$export$dc6b73b623f8645f(props) {
9
9
  let value = (0, $aa90ad8b2b1d015f$export$5aadd9c0606af5c2)(props.value);
10
- let defaultValue = (0, $aa90ad8b2b1d015f$export$5aadd9c0606af5c2)(props.defaultValue || "#0000");
10
+ let defaultValue = (0, $aa90ad8b2b1d015f$export$5aadd9c0606af5c2)(props.defaultValue || '#0000');
11
11
  let [color, setColor] = (0, $5GESt$useControlledState)(value || undefined, defaultValue, props.onChange);
12
12
  return {
13
13
  color: color,
14
14
  setColor (color) {
15
- setColor(color || (0, $799cddbef784668f$export$6e865ea70d7724f)("#0000"));
15
+ setColor(color || (0, $799cddbef784668f$export$6e865ea70d7724f)('#0000'));
16
16
  }
17
17
  };
18
18
  }
@@ -7,12 +7,12 @@ import {useControlledState as $5GESt$useControlledState} from "@react-stately/ut
7
7
 
8
8
  function $309d2b7669014898$export$dc6b73b623f8645f(props) {
9
9
  let value = (0, $aa90ad8b2b1d015f$export$5aadd9c0606af5c2)(props.value);
10
- let defaultValue = (0, $aa90ad8b2b1d015f$export$5aadd9c0606af5c2)(props.defaultValue || "#0000");
10
+ let defaultValue = (0, $aa90ad8b2b1d015f$export$5aadd9c0606af5c2)(props.defaultValue || '#0000');
11
11
  let [color, setColor] = (0, $5GESt$useControlledState)(value || undefined, defaultValue, props.onChange);
12
12
  return {
13
13
  color: color,
14
14
  setColor (color) {
15
- setColor(color || (0, $799cddbef784668f$export$6e865ea70d7724f)("#0000"));
15
+ setColor(color || (0, $799cddbef784668f$export$6e865ea70d7724f)('#0000'));
16
16
  }
17
17
  };
18
18
  }
@@ -25,7 +25,7 @@ $parcel$export(module.exports, "useColorSliderState", () => $5386a492cfd3234c$ex
25
25
 
26
26
  function $5386a492cfd3234c$export$57bc203e1c9c6d44(props) {
27
27
  let { channel: channel, colorSpace: colorSpace, value: value, defaultValue: defaultValue, onChange: onChange, locale: locale, ...otherProps } = props;
28
- if (value == null && defaultValue == null) throw new Error("useColorSliderState requires a value or defaultValue");
28
+ if (value == null && defaultValue == null) throw new Error('useColorSliderState requires a value or defaultValue');
29
29
  let [colorValue, setColor] = (0, $93tpS$reactstatelyutils.useControlledState)(value && (0, $83fe1a57d631223b$exports.normalizeColor)(value), defaultValue && (0, $83fe1a57d631223b$exports.normalizeColor)(defaultValue), onChange);
30
30
  let color = (0, $93tpS$react.useMemo)(()=>colorSpace && colorValue ? colorValue.toFormat(colorSpace) : colorValue, [
31
31
  colorValue,
@@ -54,19 +54,19 @@ function $5386a492cfd3234c$export$57bc203e1c9c6d44(props) {
54
54
  },
55
55
  getDisplayColor () {
56
56
  switch(channel){
57
- case "hue":
58
- return (0, $83fe1a57d631223b$exports.parseColor)(`hsl(${color.getChannelValue("hue")}, 100%, 50%)`);
59
- case "lightness":
60
- case "brightness":
61
- case "saturation":
62
- case "red":
63
- case "green":
64
- case "blue":
65
- return color.withChannelValue("alpha", 1);
66
- case "alpha":
57
+ case 'hue':
58
+ return (0, $83fe1a57d631223b$exports.parseColor)(`hsl(${color.getChannelValue('hue')}, 100%, 50%)`);
59
+ case 'lightness':
60
+ case 'brightness':
61
+ case 'saturation':
62
+ case 'red':
63
+ case 'green':
64
+ case 'blue':
65
+ return color.withChannelValue('alpha', 1);
66
+ case 'alpha':
67
67
  return color;
68
68
  default:
69
- throw new Error("Unknown color channel: " + channel);
69
+ throw new Error('Unknown color channel: ' + channel);
70
70
  }
71
71
  },
72
72
  getThumbValueLabel () {
@@ -19,7 +19,7 @@ import {useMemo as $1Eavr$useMemo} from "react";
19
19
 
20
20
  function $25a25ac0d1624665$export$57bc203e1c9c6d44(props) {
21
21
  let { channel: channel, colorSpace: colorSpace, value: value, defaultValue: defaultValue, onChange: onChange, locale: locale, ...otherProps } = props;
22
- if (value == null && defaultValue == null) throw new Error("useColorSliderState requires a value or defaultValue");
22
+ if (value == null && defaultValue == null) throw new Error('useColorSliderState requires a value or defaultValue');
23
23
  let [colorValue, setColor] = (0, $1Eavr$useControlledState)(value && (0, $799cddbef784668f$export$4cde5df63f53f473)(value), defaultValue && (0, $799cddbef784668f$export$4cde5df63f53f473)(defaultValue), onChange);
24
24
  let color = (0, $1Eavr$useMemo)(()=>colorSpace && colorValue ? colorValue.toFormat(colorSpace) : colorValue, [
25
25
  colorValue,
@@ -48,19 +48,19 @@ function $25a25ac0d1624665$export$57bc203e1c9c6d44(props) {
48
48
  },
49
49
  getDisplayColor () {
50
50
  switch(channel){
51
- case "hue":
52
- return (0, $799cddbef784668f$export$6e865ea70d7724f)(`hsl(${color.getChannelValue("hue")}, 100%, 50%)`);
53
- case "lightness":
54
- case "brightness":
55
- case "saturation":
56
- case "red":
57
- case "green":
58
- case "blue":
59
- return color.withChannelValue("alpha", 1);
60
- case "alpha":
51
+ case 'hue':
52
+ return (0, $799cddbef784668f$export$6e865ea70d7724f)(`hsl(${color.getChannelValue('hue')}, 100%, 50%)`);
53
+ case 'lightness':
54
+ case 'brightness':
55
+ case 'saturation':
56
+ case 'red':
57
+ case 'green':
58
+ case 'blue':
59
+ return color.withChannelValue('alpha', 1);
60
+ case 'alpha':
61
61
  return color;
62
62
  default:
63
- throw new Error("Unknown color channel: " + channel);
63
+ throw new Error('Unknown color channel: ' + channel);
64
64
  }
65
65
  },
66
66
  getThumbValueLabel () {
@@ -19,7 +19,7 @@ import {useMemo as $1Eavr$useMemo} from "react";
19
19
 
20
20
  function $25a25ac0d1624665$export$57bc203e1c9c6d44(props) {
21
21
  let { channel: channel, colorSpace: colorSpace, value: value, defaultValue: defaultValue, onChange: onChange, locale: locale, ...otherProps } = props;
22
- if (value == null && defaultValue == null) throw new Error("useColorSliderState requires a value or defaultValue");
22
+ if (value == null && defaultValue == null) throw new Error('useColorSliderState requires a value or defaultValue');
23
23
  let [colorValue, setColor] = (0, $1Eavr$useControlledState)(value && (0, $799cddbef784668f$export$4cde5df63f53f473)(value), defaultValue && (0, $799cddbef784668f$export$4cde5df63f53f473)(defaultValue), onChange);
24
24
  let color = (0, $1Eavr$useMemo)(()=>colorSpace && colorValue ? colorValue.toFormat(colorSpace) : colorValue, [
25
25
  colorValue,
@@ -48,19 +48,19 @@ function $25a25ac0d1624665$export$57bc203e1c9c6d44(props) {
48
48
  },
49
49
  getDisplayColor () {
50
50
  switch(channel){
51
- case "hue":
52
- return (0, $799cddbef784668f$export$6e865ea70d7724f)(`hsl(${color.getChannelValue("hue")}, 100%, 50%)`);
53
- case "lightness":
54
- case "brightness":
55
- case "saturation":
56
- case "red":
57
- case "green":
58
- case "blue":
59
- return color.withChannelValue("alpha", 1);
60
- case "alpha":
51
+ case 'hue':
52
+ return (0, $799cddbef784668f$export$6e865ea70d7724f)(`hsl(${color.getChannelValue('hue')}, 100%, 50%)`);
53
+ case 'lightness':
54
+ case 'brightness':
55
+ case 'saturation':
56
+ case 'red':
57
+ case 'green':
58
+ case 'blue':
59
+ return color.withChannelValue('alpha', 1);
60
+ case 'alpha':
61
61
  return color;
62
62
  default:
63
- throw new Error("Unknown color channel: " + channel);
63
+ throw new Error('Unknown color channel: ' + channel);
64
64
  }
65
65
  },
66
66
  getThumbValueLabel () {