@react-stately/color 3.6.1-nightly.4623 → 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.
@@ -25,19 +25,19 @@ let $799cddbef784668f$var$dictionary = new (0, $34yyy$LocalizedStringDictionary)
25
25
  function $799cddbef784668f$export$6e865ea70d7724f(value) {
26
26
  let res = $799cddbef784668f$var$RGBColor.parse(value) || $799cddbef784668f$var$HSBColor.parse(value) || $799cddbef784668f$var$HSLColor.parse(value);
27
27
  if (res) return res;
28
- throw new Error("Invalid color value: " + value);
28
+ throw new Error('Invalid color value: ' + value);
29
29
  }
30
30
  function $799cddbef784668f$export$4cde5df63f53f473(v) {
31
- if (typeof v === "string") return $799cddbef784668f$export$6e865ea70d7724f(v);
31
+ if (typeof v === 'string') return $799cddbef784668f$export$6e865ea70d7724f(v);
32
32
  else return v;
33
33
  }
34
34
  function $799cddbef784668f$export$1c0c08912582810c(colorSpace) {
35
35
  switch(colorSpace){
36
- case "rgb":
36
+ case 'rgb':
37
37
  return $799cddbef784668f$var$RGBColor.colorChannels;
38
- case "hsl":
38
+ case 'hsl':
39
39
  return $799cddbef784668f$var$HSLColor.colorChannels;
40
- case "hsb":
40
+ case 'hsb':
41
41
  return $799cddbef784668f$var$HSBColor.colorChannels;
42
42
  }
43
43
  }
@@ -52,52 +52,52 @@ const $799cddbef784668f$var$GRAY_THRESHOLD = 0.001;
52
52
  const $799cddbef784668f$var$OKLCH_HUES = [
53
53
  [
54
54
  0,
55
- "pink"
55
+ 'pink'
56
56
  ],
57
57
  [
58
58
  15,
59
- "red"
59
+ 'red'
60
60
  ],
61
61
  [
62
62
  48,
63
- "orange"
63
+ 'orange'
64
64
  ],
65
65
  [
66
66
  94,
67
- "yellow"
67
+ 'yellow'
68
68
  ],
69
69
  [
70
70
  135,
71
- "green"
71
+ 'green'
72
72
  ],
73
73
  [
74
74
  175,
75
- "cyan"
75
+ 'cyan'
76
76
  ],
77
77
  [
78
78
  264,
79
- "blue"
79
+ 'blue'
80
80
  ],
81
81
  [
82
82
  284,
83
- "purple"
83
+ 'purple'
84
84
  ],
85
85
  [
86
86
  320,
87
- "magenta"
87
+ 'magenta'
88
88
  ],
89
89
  [
90
90
  349,
91
- "pink"
91
+ 'pink'
92
92
  ]
93
93
  ];
94
94
  class $799cddbef784668f$var$Color {
95
95
  toHexInt() {
96
- return this.toFormat("rgb").toHexInt();
96
+ return this.toFormat('rgb').toHexInt();
97
97
  }
98
98
  getChannelValue(channel) {
99
99
  if (channel in this) return this[channel];
100
- throw new Error("Unsupported color channel: " + channel);
100
+ throw new Error('Unsupported color channel: ' + channel);
101
101
  }
102
102
  withChannelValue(channel, value) {
103
103
  if (channel in this) {
@@ -105,10 +105,10 @@ class $799cddbef784668f$var$Color {
105
105
  x[channel] = value;
106
106
  return x;
107
107
  }
108
- throw new Error("Unsupported color channel: " + channel);
108
+ throw new Error('Unsupported color channel: ' + channel);
109
109
  }
110
110
  getChannelName(channel, locale) {
111
- let strings = (0, $34yyy$LocalizedStringDictionary).getGlobalDictionaryForPackage("@react-stately/color") || $799cddbef784668f$var$dictionary;
111
+ let strings = (0, $34yyy$LocalizedStringDictionary).getGlobalDictionaryForPackage('@react-stately/color') || $799cddbef784668f$var$dictionary;
112
112
  return strings.getStringForLocale(channel, locale);
113
113
  }
114
114
  getColorSpaceAxes(xyChannels) {
@@ -125,65 +125,65 @@ class $799cddbef784668f$var$Color {
125
125
  getColorName(locale) {
126
126
  // Convert to oklch color space, which has perceptually uniform lightness across all hues.
127
127
  let [l, c, h] = $799cddbef784668f$var$toOKLCH(this);
128
- let strings = (0, $34yyy$LocalizedStringDictionary).getGlobalDictionaryForPackage("@react-stately/color") || $799cddbef784668f$var$dictionary;
129
- if (l > 0.999) return strings.getStringForLocale("white", locale);
130
- if (l < 0.001) return strings.getStringForLocale("black", locale);
128
+ let strings = (0, $34yyy$LocalizedStringDictionary).getGlobalDictionaryForPackage('@react-stately/color') || $799cddbef784668f$var$dictionary;
129
+ if (l > 0.999) return strings.getStringForLocale('white', locale);
130
+ if (l < 0.001) return strings.getStringForLocale('black', locale);
131
131
  let hue;
132
132
  [hue, l] = this.getOklchHue(l, c, h, locale);
133
- let lightness = "";
134
- let chroma = "";
133
+ let lightness = '';
134
+ let chroma = '';
135
135
  if (c <= 0.1 && c >= $799cddbef784668f$var$GRAY_THRESHOLD) {
136
- if (l >= 0.7) chroma = "pale";
137
- else chroma = "grayish";
138
- } else if (c >= 0.15) chroma = "vibrant";
139
- if (l < 0.3) lightness = "very dark";
140
- else if (l < $799cddbef784668f$var$MAX_DARK_LIGHTNESS) lightness = "dark";
136
+ if (l >= 0.7) chroma = 'pale';
137
+ else chroma = 'grayish';
138
+ } else if (c >= 0.15) chroma = 'vibrant';
139
+ if (l < 0.3) lightness = 'very dark';
140
+ else if (l < $799cddbef784668f$var$MAX_DARK_LIGHTNESS) lightness = 'dark';
141
141
  else if (l < 0.7) ;
142
- else if (l < 0.85) lightness = "light";
143
- else lightness = "very light";
142
+ else if (l < 0.85) lightness = 'light';
143
+ else lightness = 'very light';
144
144
  if (chroma) chroma = strings.getStringForLocale(chroma, locale);
145
145
  if (lightness) lightness = strings.getStringForLocale(lightness, locale);
146
- let alpha = this.getChannelValue("alpha");
146
+ let alpha = this.getChannelValue('alpha');
147
147
  let formatter = new (0, $34yyy$LocalizedStringFormatter)(locale, strings);
148
148
  if (alpha < 1) {
149
149
  let percentTransparent = new (0, $34yyy$NumberFormatter)(locale, {
150
- style: "percent"
150
+ style: 'percent'
151
151
  }).format(1 - alpha);
152
- return formatter.format("transparentColorName", {
152
+ return formatter.format('transparentColorName', {
153
153
  lightness: lightness,
154
154
  chroma: chroma,
155
155
  hue: hue,
156
156
  percentTransparent: percentTransparent
157
- }).replace(/\s+/g, " ").trim();
158
- } else return formatter.format("colorName", {
157
+ }).replace(/\s+/g, ' ').trim();
158
+ } else return formatter.format('colorName', {
159
159
  lightness: lightness,
160
160
  chroma: chroma,
161
161
  hue: hue
162
- }).replace(/\s+/g, " ").trim();
162
+ }).replace(/\s+/g, ' ').trim();
163
163
  }
164
164
  getOklchHue(l, c, h, locale) {
165
- let strings = (0, $34yyy$LocalizedStringDictionary).getGlobalDictionaryForPackage("@react-stately/color") || $799cddbef784668f$var$dictionary;
165
+ let strings = (0, $34yyy$LocalizedStringDictionary).getGlobalDictionaryForPackage('@react-stately/color') || $799cddbef784668f$var$dictionary;
166
166
  if (c < $799cddbef784668f$var$GRAY_THRESHOLD) return [
167
- strings.getStringForLocale("gray", locale),
167
+ strings.getStringForLocale('gray', locale),
168
168
  l
169
169
  ];
170
170
  for(let i = 0; i < $799cddbef784668f$var$OKLCH_HUES.length; i++){
171
171
  let [hue, hueName] = $799cddbef784668f$var$OKLCH_HUES[i];
172
172
  let [nextHue, nextHueName] = $799cddbef784668f$var$OKLCH_HUES[i + 1] || [
173
173
  360,
174
- "pink"
174
+ 'pink'
175
175
  ];
176
176
  if (h >= hue && h < nextHue) {
177
177
  // Split orange hue into brown/orange depending on lightness.
178
- if (hueName === "orange") {
179
- if (l < $799cddbef784668f$var$ORANGE_LIGHTNESS_THRESHOLD) hueName = "brown";
178
+ if (hueName === 'orange') {
179
+ if (l < $799cddbef784668f$var$ORANGE_LIGHTNESS_THRESHOLD) hueName = 'brown';
180
180
  else // Adjust lightness.
181
181
  l = l - $799cddbef784668f$var$ORANGE_LIGHTNESS_THRESHOLD + $799cddbef784668f$var$MAX_DARK_LIGHTNESS;
182
182
  }
183
183
  // If the hue is at least halfway to the next hue, add the next hue name as well.
184
184
  if (h > hue + (nextHue - hue) / 2 && hueName !== nextHueName) hueName = `${hueName} ${nextHueName}`;
185
- else if (hueName === "yellow" && l < $799cddbef784668f$var$YELLOW_GREEN_LIGHTNESS_THRESHOLD) // Yellow shifts toward green at lower lightnesses.
186
- hueName = "yellow green";
185
+ else if (hueName === 'yellow' && l < $799cddbef784668f$var$YELLOW_GREEN_LIGHTNESS_THRESHOLD) // Yellow shifts toward green at lower lightnesses.
186
+ hueName = 'yellow green';
187
187
  let name = strings.getStringForLocale(hueName, locale).toLocaleLowerCase(locale);
188
188
  return [
189
189
  name,
@@ -191,7 +191,7 @@ class $799cddbef784668f$var$Color {
191
191
  ];
192
192
  }
193
193
  }
194
- throw new Error("Unexpected hue");
194
+ throw new Error('Unexpected hue');
195
195
  }
196
196
  getHueName(locale) {
197
197
  let [l, c, h] = $799cddbef784668f$var$toOKLCH(this);
@@ -209,29 +209,29 @@ class $799cddbef784668f$var$RGBColor extends $799cddbef784668f$var$Color {
209
209
  7,
210
210
  9
211
211
  ].includes(value.length)) {
212
- const values = (value.length < 6 ? value.replace(/[^#]/gi, "$&$&") : value).slice(1).split("");
213
- while(values.length > 0)colors.push(parseInt(values.splice(0, 2).join(""), 16));
212
+ const values = (value.length < 6 ? value.replace(/[^#]/gi, '$&$&') : value).slice(1).split('');
213
+ while(values.length > 0)colors.push(parseInt(values.splice(0, 2).join(''), 16));
214
214
  colors[3] = colors[3] !== undefined ? colors[3] / 255 : undefined;
215
215
  }
216
216
  // matching rgb(rrr, ggg, bbb), rgba(rrr, ggg, bbb, 0.a)
217
217
  const match = value.match(/^rgba?\((.*)\)$/);
218
218
  if (match === null || match === void 0 ? void 0 : match[1]) {
219
- colors = match[1].split(",").map((value)=>Number(value.trim()));
219
+ colors = match[1].split(',').map((value)=>Number(value.trim()));
220
220
  colors = colors.map((num, i)=>(0, $34yyy$clamp)(num, 0, i < 3 ? 255 : 1));
221
221
  }
222
222
  var _colors_;
223
223
  return colors.length < 3 ? undefined : new $799cddbef784668f$var$RGBColor(colors[0], colors[1], colors[2], (_colors_ = colors[3]) !== null && _colors_ !== void 0 ? _colors_ : 1);
224
224
  }
225
- toString(format = "css") {
225
+ toString(format = 'css') {
226
226
  switch(format){
227
- case "hex":
228
- return "#" + (this.red.toString(16).padStart(2, "0") + this.green.toString(16).padStart(2, "0") + this.blue.toString(16).padStart(2, "0")).toUpperCase();
229
- case "hexa":
230
- return "#" + (this.red.toString(16).padStart(2, "0") + this.green.toString(16).padStart(2, "0") + this.blue.toString(16).padStart(2, "0") + Math.round(this.alpha * 255).toString(16).padStart(2, "0")).toUpperCase();
231
- case "rgb":
227
+ case 'hex':
228
+ return '#' + (this.red.toString(16).padStart(2, '0') + this.green.toString(16).padStart(2, '0') + this.blue.toString(16).padStart(2, '0')).toUpperCase();
229
+ case 'hexa':
230
+ return '#' + (this.red.toString(16).padStart(2, '0') + this.green.toString(16).padStart(2, '0') + this.blue.toString(16).padStart(2, '0') + Math.round(this.alpha * 255).toString(16).padStart(2, '0')).toUpperCase();
231
+ case 'rgb':
232
232
  return `rgb(${this.red}, ${this.green}, ${this.blue})`;
233
- case "css":
234
- case "rgba":
233
+ case 'css':
234
+ case 'rgba':
235
235
  return `rgba(${this.red}, ${this.green}, ${this.blue}, ${this.alpha})`;
236
236
  default:
237
237
  return this.toFormat(format).toString(format);
@@ -239,19 +239,19 @@ class $799cddbef784668f$var$RGBColor extends $799cddbef784668f$var$Color {
239
239
  }
240
240
  toFormat(format) {
241
241
  switch(format){
242
- case "hex":
243
- case "hexa":
244
- case "rgb":
245
- case "rgba":
242
+ case 'hex':
243
+ case 'hexa':
244
+ case 'rgb':
245
+ case 'rgba':
246
246
  return this;
247
- case "hsb":
248
- case "hsba":
247
+ case 'hsb':
248
+ case 'hsba':
249
249
  return this.toHSB();
250
- case "hsl":
251
- case "hsla":
250
+ case 'hsl':
251
+ case 'hsla':
252
252
  return this.toHSL();
253
253
  default:
254
- throw new Error("Unsupported color conversion: rgb -> " + format);
254
+ throw new Error('Unsupported color conversion: rgb -> ' + format);
255
255
  }
256
256
  }
257
257
  toHexInt() {
@@ -323,16 +323,16 @@ class $799cddbef784668f$var$RGBColor extends $799cddbef784668f$var$Color {
323
323
  }
324
324
  getChannelRange(channel) {
325
325
  switch(channel){
326
- case "red":
327
- case "green":
328
- case "blue":
326
+ case 'red':
327
+ case 'green':
328
+ case 'blue':
329
329
  return {
330
330
  minValue: 0x0,
331
331
  maxValue: 0xFF,
332
332
  step: 0x1,
333
333
  pageSize: 0x11
334
334
  };
335
- case "alpha":
335
+ case 'alpha':
336
336
  return {
337
337
  minValue: 0,
338
338
  maxValue: 1,
@@ -340,23 +340,23 @@ class $799cddbef784668f$var$RGBColor extends $799cddbef784668f$var$Color {
340
340
  pageSize: 0.1
341
341
  };
342
342
  default:
343
- throw new Error("Unknown color channel: " + channel);
343
+ throw new Error('Unknown color channel: ' + channel);
344
344
  }
345
345
  }
346
346
  getChannelFormatOptions(channel) {
347
347
  switch(channel){
348
- case "red":
349
- case "green":
350
- case "blue":
348
+ case 'red':
349
+ case 'green':
350
+ case 'blue':
351
351
  return {
352
- style: "decimal"
352
+ style: 'decimal'
353
353
  };
354
- case "alpha":
354
+ case 'alpha':
355
355
  return {
356
- style: "percent"
356
+ style: 'percent'
357
357
  };
358
358
  default:
359
- throw new Error("Unknown color channel: " + channel);
359
+ throw new Error('Unknown color channel: ' + channel);
360
360
  }
361
361
  }
362
362
  formatChannelValue(channel, locale) {
@@ -365,7 +365,7 @@ class $799cddbef784668f$var$RGBColor extends $799cddbef784668f$var$Color {
365
365
  return new (0, $34yyy$NumberFormatter)(locale, options).format(value);
366
366
  }
367
367
  getColorSpace() {
368
- return "rgb";
368
+ return 'rgb';
369
369
  }
370
370
  getColorChannels() {
371
371
  return $799cddbef784668f$var$RGBColor.colorChannels;
@@ -379,9 +379,9 @@ class $799cddbef784668f$var$RGBColor extends $799cddbef784668f$var$Color {
379
379
  }
380
380
  }
381
381
  $799cddbef784668f$var$RGBColor.colorChannels = [
382
- "red",
383
- "green",
384
- "blue"
382
+ 'red',
383
+ 'green',
384
+ 'blue'
385
385
  ];
386
386
  // X = <negative/positive number with/without decimal places>
387
387
  // before/after a comma, 0 or more whitespaces are allowed
@@ -393,21 +393,21 @@ class $799cddbef784668f$var$HSBColor extends $799cddbef784668f$var$Color {
393
393
  let m;
394
394
  if (m = value.match($799cddbef784668f$var$HSB_REGEX)) {
395
395
  var _m_;
396
- const [h, s, b, a] = ((_m_ = m[1]) !== null && _m_ !== void 0 ? _m_ : m[2]).split(",").map((n)=>Number(n.trim().replace("%", "")));
396
+ const [h, s, b, a] = ((_m_ = m[1]) !== null && _m_ !== void 0 ? _m_ : m[2]).split(',').map((n)=>Number(n.trim().replace('%', '')));
397
397
  return new $799cddbef784668f$var$HSBColor($799cddbef784668f$var$mod(h, 360), (0, $34yyy$clamp)(s, 0, 100), (0, $34yyy$clamp)(b, 0, 100), (0, $34yyy$clamp)(a !== null && a !== void 0 ? a : 1, 0, 1));
398
398
  }
399
399
  }
400
- toString(format = "css") {
400
+ toString(format = 'css') {
401
401
  switch(format){
402
- case "css":
403
- return this.toHSL().toString("css");
404
- case "hex":
405
- return this.toRGB().toString("hex");
406
- case "hexa":
407
- return this.toRGB().toString("hexa");
408
- case "hsb":
402
+ case 'css':
403
+ return this.toHSL().toString('css');
404
+ case 'hex':
405
+ return this.toRGB().toString('hex');
406
+ case 'hexa':
407
+ return this.toRGB().toString('hexa');
408
+ case 'hsb':
409
409
  return `hsb(${this.hue}, ${(0, $34yyy$toFixedNumber)(this.saturation, 2)}%, ${(0, $34yyy$toFixedNumber)(this.brightness, 2)}%)`;
410
- case "hsba":
410
+ case 'hsba':
411
411
  return `hsba(${this.hue}, ${(0, $34yyy$toFixedNumber)(this.saturation, 2)}%, ${(0, $34yyy$toFixedNumber)(this.brightness, 2)}%, ${this.alpha})`;
412
412
  default:
413
413
  return this.toFormat(format).toString(format);
@@ -415,17 +415,17 @@ class $799cddbef784668f$var$HSBColor extends $799cddbef784668f$var$Color {
415
415
  }
416
416
  toFormat(format) {
417
417
  switch(format){
418
- case "hsb":
419
- case "hsba":
418
+ case 'hsb':
419
+ case 'hsba':
420
420
  return this;
421
- case "hsl":
422
- case "hsla":
421
+ case 'hsl':
422
+ case 'hsla':
423
423
  return this.toHSL();
424
- case "rgb":
425
- case "rgba":
424
+ case 'rgb':
425
+ case 'rgba':
426
426
  return this.toRGB();
427
427
  default:
428
- throw new Error("Unsupported color conversion: hsb -> " + format);
428
+ throw new Error('Unsupported color conversion: hsb -> ' + format);
429
429
  }
430
430
  }
431
431
  /**
@@ -455,22 +455,22 @@ class $799cddbef784668f$var$HSBColor extends $799cddbef784668f$var$Color {
455
455
  }
456
456
  getChannelRange(channel) {
457
457
  switch(channel){
458
- case "hue":
458
+ case 'hue':
459
459
  return {
460
460
  minValue: 0,
461
461
  maxValue: 360,
462
462
  step: 1,
463
463
  pageSize: 15
464
464
  };
465
- case "saturation":
466
- case "brightness":
465
+ case 'saturation':
466
+ case 'brightness':
467
467
  return {
468
468
  minValue: 0,
469
469
  maxValue: 100,
470
470
  step: 1,
471
471
  pageSize: 10
472
472
  };
473
- case "alpha":
473
+ case 'alpha':
474
474
  return {
475
475
  minValue: 0,
476
476
  maxValue: 1,
@@ -478,35 +478,35 @@ class $799cddbef784668f$var$HSBColor extends $799cddbef784668f$var$Color {
478
478
  pageSize: 0.1
479
479
  };
480
480
  default:
481
- throw new Error("Unknown color channel: " + channel);
481
+ throw new Error('Unknown color channel: ' + channel);
482
482
  }
483
483
  }
484
484
  getChannelFormatOptions(channel) {
485
485
  switch(channel){
486
- case "hue":
486
+ case 'hue':
487
487
  return {
488
- style: "unit",
489
- unit: "degree",
490
- unitDisplay: "narrow"
488
+ style: 'unit',
489
+ unit: 'degree',
490
+ unitDisplay: 'narrow'
491
491
  };
492
- case "saturation":
493
- case "brightness":
494
- case "alpha":
492
+ case 'saturation':
493
+ case 'brightness':
494
+ case 'alpha':
495
495
  return {
496
- style: "percent"
496
+ style: 'percent'
497
497
  };
498
498
  default:
499
- throw new Error("Unknown color channel: " + channel);
499
+ throw new Error('Unknown color channel: ' + channel);
500
500
  }
501
501
  }
502
502
  formatChannelValue(channel, locale) {
503
503
  let options = this.getChannelFormatOptions(channel);
504
504
  let value = this.getChannelValue(channel);
505
- if (channel === "saturation" || channel === "brightness") value /= 100;
505
+ if (channel === 'saturation' || channel === 'brightness') value /= 100;
506
506
  return new (0, $34yyy$NumberFormatter)(locale, options).format(value);
507
507
  }
508
508
  getColorSpace() {
509
- return "hsb";
509
+ return 'hsb';
510
510
  }
511
511
  getColorChannels() {
512
512
  return $799cddbef784668f$var$HSBColor.colorChannels;
@@ -520,9 +520,9 @@ class $799cddbef784668f$var$HSBColor extends $799cddbef784668f$var$Color {
520
520
  }
521
521
  }
522
522
  $799cddbef784668f$var$HSBColor.colorChannels = [
523
- "hue",
524
- "saturation",
525
- "brightness"
523
+ 'hue',
524
+ 'saturation',
525
+ 'brightness'
526
526
  ];
527
527
  // X = <negative/positive number with/without decimal places>
528
528
  // before/after a comma, 0 or more whitespaces are allowed
@@ -537,20 +537,20 @@ class $799cddbef784668f$var$HSLColor extends $799cddbef784668f$var$Color {
537
537
  let m;
538
538
  if (m = value.match($799cddbef784668f$var$HSL_REGEX)) {
539
539
  var _m_;
540
- const [h, s, l, a] = ((_m_ = m[1]) !== null && _m_ !== void 0 ? _m_ : m[2]).split(",").map((n)=>Number(n.trim().replace("%", "")));
540
+ const [h, s, l, a] = ((_m_ = m[1]) !== null && _m_ !== void 0 ? _m_ : m[2]).split(',').map((n)=>Number(n.trim().replace('%', '')));
541
541
  return new $799cddbef784668f$var$HSLColor($799cddbef784668f$var$mod(h, 360), (0, $34yyy$clamp)(s, 0, 100), (0, $34yyy$clamp)(l, 0, 100), (0, $34yyy$clamp)(a !== null && a !== void 0 ? a : 1, 0, 1));
542
542
  }
543
543
  }
544
- toString(format = "css") {
544
+ toString(format = 'css') {
545
545
  switch(format){
546
- case "hex":
547
- return this.toRGB().toString("hex");
548
- case "hexa":
549
- return this.toRGB().toString("hexa");
550
- case "hsl":
546
+ case 'hex':
547
+ return this.toRGB().toString('hex');
548
+ case 'hexa':
549
+ return this.toRGB().toString('hexa');
550
+ case 'hsl':
551
551
  return `hsl(${this.hue}, ${(0, $34yyy$toFixedNumber)(this.saturation, 2)}%, ${(0, $34yyy$toFixedNumber)(this.lightness, 2)}%)`;
552
- case "css":
553
- case "hsla":
552
+ case 'css':
553
+ case 'hsla':
554
554
  return `hsla(${this.hue}, ${(0, $34yyy$toFixedNumber)(this.saturation, 2)}%, ${(0, $34yyy$toFixedNumber)(this.lightness, 2)}%, ${this.alpha})`;
555
555
  default:
556
556
  return this.toFormat(format).toString(format);
@@ -558,17 +558,17 @@ class $799cddbef784668f$var$HSLColor extends $799cddbef784668f$var$Color {
558
558
  }
559
559
  toFormat(format) {
560
560
  switch(format){
561
- case "hsl":
562
- case "hsla":
561
+ case 'hsl':
562
+ case 'hsla':
563
563
  return this;
564
- case "hsb":
565
- case "hsba":
564
+ case 'hsb':
565
+ case 'hsba':
566
566
  return this.toHSB();
567
- case "rgb":
568
- case "rgba":
567
+ case 'rgb':
568
+ case 'rgba':
569
569
  return this.toRGB();
570
570
  default:
571
- throw new Error("Unsupported color conversion: hsl -> " + format);
571
+ throw new Error('Unsupported color conversion: hsl -> ' + format);
572
572
  }
573
573
  }
574
574
  /**
@@ -599,22 +599,22 @@ class $799cddbef784668f$var$HSLColor extends $799cddbef784668f$var$Color {
599
599
  }
600
600
  getChannelRange(channel) {
601
601
  switch(channel){
602
- case "hue":
602
+ case 'hue':
603
603
  return {
604
604
  minValue: 0,
605
605
  maxValue: 360,
606
606
  step: 1,
607
607
  pageSize: 15
608
608
  };
609
- case "saturation":
610
- case "lightness":
609
+ case 'saturation':
610
+ case 'lightness':
611
611
  return {
612
612
  minValue: 0,
613
613
  maxValue: 100,
614
614
  step: 1,
615
615
  pageSize: 10
616
616
  };
617
- case "alpha":
617
+ case 'alpha':
618
618
  return {
619
619
  minValue: 0,
620
620
  maxValue: 1,
@@ -622,35 +622,35 @@ class $799cddbef784668f$var$HSLColor extends $799cddbef784668f$var$Color {
622
622
  pageSize: 0.1
623
623
  };
624
624
  default:
625
- throw new Error("Unknown color channel: " + channel);
625
+ throw new Error('Unknown color channel: ' + channel);
626
626
  }
627
627
  }
628
628
  getChannelFormatOptions(channel) {
629
629
  switch(channel){
630
- case "hue":
630
+ case 'hue':
631
631
  return {
632
- style: "unit",
633
- unit: "degree",
634
- unitDisplay: "narrow"
632
+ style: 'unit',
633
+ unit: 'degree',
634
+ unitDisplay: 'narrow'
635
635
  };
636
- case "saturation":
637
- case "lightness":
638
- case "alpha":
636
+ case 'saturation':
637
+ case 'lightness':
638
+ case 'alpha':
639
639
  return {
640
- style: "percent"
640
+ style: 'percent'
641
641
  };
642
642
  default:
643
- throw new Error("Unknown color channel: " + channel);
643
+ throw new Error('Unknown color channel: ' + channel);
644
644
  }
645
645
  }
646
646
  formatChannelValue(channel, locale) {
647
647
  let options = this.getChannelFormatOptions(channel);
648
648
  let value = this.getChannelValue(channel);
649
- if (channel === "saturation" || channel === "lightness") value /= 100;
649
+ if (channel === 'saturation' || channel === 'lightness') value /= 100;
650
650
  return new (0, $34yyy$NumberFormatter)(locale, options).format(value);
651
651
  }
652
652
  getColorSpace() {
653
- return "hsl";
653
+ return 'hsl';
654
654
  }
655
655
  getColorChannels() {
656
656
  return $799cddbef784668f$var$HSLColor.colorChannels;
@@ -664,16 +664,16 @@ class $799cddbef784668f$var$HSLColor extends $799cddbef784668f$var$Color {
664
664
  }
665
665
  }
666
666
  $799cddbef784668f$var$HSLColor.colorChannels = [
667
- "hue",
668
- "saturation",
669
- "lightness"
667
+ 'hue',
668
+ 'saturation',
669
+ 'lightness'
670
670
  ];
671
671
  // https://www.w3.org/TR/css-color-4/#color-conversion-code
672
672
  function $799cddbef784668f$var$toOKLCH(color) {
673
- let rgb = color.toFormat("rgb");
674
- let red = rgb.getChannelValue("red") / 255;
675
- let green = rgb.getChannelValue("green") / 255;
676
- let blue = rgb.getChannelValue("blue") / 255;
673
+ let rgb = color.toFormat('rgb');
674
+ let red = rgb.getChannelValue('red') / 255;
675
+ let green = rgb.getChannelValue('green') / 255;
676
+ let blue = rgb.getChannelValue('blue') / 255;
677
677
  [red, green, blue] = $799cddbef784668f$var$lin_sRGB(red, green, blue);
678
678
  let [x, y, z] = $799cddbef784668f$var$lin_sRGB_to_XYZ(red, green, blue);
679
679
  let [l, a, b] = $799cddbef784668f$var$XYZ_to_OKLab(x, y, z);
@@ -21,7 +21,7 @@ $parcel$export(module.exports, "useColor", () => $f8b3be23ba4462b1$export$5aadd9
21
21
 
22
22
  function $f8b3be23ba4462b1$export$5aadd9c0606af5c2(value) {
23
23
  return (0, $bTjYY$react.useMemo)(()=>{
24
- if (typeof value === "string") try {
24
+ if (typeof value === 'string') try {
25
25
  return (0, $83fe1a57d631223b$exports.parseColor)(value);
26
26
  } catch (err) {
27
27
  return undefined;