@thednp/color-picker 0.0.2-alpha1 → 0.0.2-alpha4

Sign up to get free protection for your applications and to get access to all the features.
package/README.md CHANGED
@@ -1,8 +1,9 @@
1
- # ColorPicker Web Component
1
+ # ColorPicker Web Component ![check-code-coverage](https://img.shields.io/badge/code--coverage-100%25-brightgreen) ![cypress version](https://img.shields.io/badge/cypress-9.5.4-brightgreen) ![esbuild version](https://img.shields.io/badge/esbuild-0.14.30-brightgreen) ![shorter-js version](https://img.shields.io/badge/shorter--js-0.3.4-brightgreen)
2
2
  The feature rich **ColorPicker** component for the modern web built with TypeScript definitions, WAI-ARIA compliant and lots of goodies. In addition, it features its own version of [TinyColor](https://github.com/bgrins/TinyColor) called simply `Color`.
3
3
 
4
4
  [![image](./docs/img/color-picker.png)](http://thednp.github.io/color-picker)
5
5
 
6
+
6
7
  [![NPM Version](https://img.shields.io/npm/v/@thednp/color-picker.svg?style=flat-square)](https://www.npmjs.com/package/@thednp/color-picker)
7
8
  [![NPM Downloads](https://img.shields.io/npm/dm/@thednp/color-picker.svg?style=flat-square)](http://npm-stat.com/charts.html?package=@thednp/color-picker)
8
9
  [![Bundle Size](https://img.shields.io/bundlephobia/minzip/@thednp/color-picker?style=flat-square)](https://bundlephobia.com/package/@thednp/color-picker)
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * Color v0.0.2alpha1 (http://thednp.github.io/color-picker)
2
+ * Color v0.0.2alpha4 (http://thednp.github.io/color-picker)
3
3
  * Copyright 2022 © thednp
4
4
  * Licensed under MIT (https://github.com/thednp/color-picker/blob/master/LICENSE)
5
5
  */
@@ -141,6 +141,8 @@ function isColorName(color) {
141
141
  if (nonColors.includes(color)
142
142
  || ['#', ...COLOR_FORMAT].some((f) => color.includes(f))) return false;
143
143
 
144
+ if (['black', 'white'].includes(color)) return true;
145
+
144
146
  return ['rgb(255, 255, 255)', 'rgb(0, 0, 0)'].every((c) => {
145
147
  setElementStyle(documentHead, { color });
146
148
  const computedColor = getElementStyle(documentHead, 'color');
@@ -167,6 +169,11 @@ function isValidCSSUnit(color) {
167
169
  */
168
170
  function bound01(N, max) {
169
171
  let n = N;
172
+
173
+ if (typeof N === 'number'
174
+ && Math.min(N, 0) === 0 // round values to 6 decimals Math.round(N * (10 ** 6)) / 10 ** 6
175
+ && Math.max(N, 1) === 1) return N;
176
+
170
177
  if (isOnePointZero(N)) n = '100%';
171
178
 
172
179
  const processPercent = isPercentage(n);
@@ -270,15 +277,12 @@ function pad2(c) {
270
277
  /**
271
278
  * Converts an RGB colour value to HSL.
272
279
  *
273
- * @param {number} R Red component [0, 255]
274
- * @param {number} G Green component [0, 255]
275
- * @param {number} B Blue component [0, 255]
280
+ * @param {number} r Red component [0, 1]
281
+ * @param {number} g Green component [0, 1]
282
+ * @param {number} b Blue component [0, 1]
276
283
  * @returns {CP.HSL} {h,s,l} object with [0, 1] ranged values
277
284
  */
278
- function rgbToHsl(R, G, B) {
279
- const r = R / 255;
280
- const g = G / 255;
281
- const b = B / 255;
285
+ function rgbToHsl(r, g, b) {
282
286
  const max = Math.max(r, g, b);
283
287
  const min = Math.min(r, g, b);
284
288
  let h = 0;
@@ -290,17 +294,10 @@ function rgbToHsl(R, G, B) {
290
294
  } else {
291
295
  const d = max - min;
292
296
  s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
293
- switch (max) {
294
- case r:
295
- h = (g - b) / d + (g < b ? 6 : 0);
296
- break;
297
- case g:
298
- h = (b - r) / d + 2;
299
- break;
300
- case b:
301
- h = (r - g) / d + 4;
302
- break;
303
- }
297
+ if (max === r) h = (g - b) / d + (g < b ? 6 : 0);
298
+ if (max === g) h = (b - r) / d + 2;
299
+ if (max === b) h = (r - g) / d + 4;
300
+
304
301
  h /= 6;
305
302
  }
306
303
  return { h, s, l };
@@ -329,7 +326,7 @@ function hueToRgb(p, q, t) {
329
326
  * @param {number} h Hue Angle [0, 1]
330
327
  * @param {number} s Saturation [0, 1]
331
328
  * @param {number} l Lightness Angle [0, 1]
332
- * @returns {CP.RGB} {r,g,b} object with [0, 255] ranged values
329
+ * @returns {CP.RGB} {r,g,b} object with [0, 1] ranged values
333
330
  */
334
331
  function hslToRgb(h, s, l) {
335
332
  let r = 0;
@@ -348,7 +345,6 @@ function hslToRgb(h, s, l) {
348
345
  g = hueToRgb(p, q, h);
349
346
  b = hueToRgb(p, q, h - 1 / 3);
350
347
  }
351
- [r, g, b] = [r, g, b].map((x) => x * 255);
352
348
 
353
349
  return { r, g, b };
354
350
  }
@@ -358,16 +354,12 @@ function hslToRgb(h, s, l) {
358
354
  * @link https://www.w3.org/TR/css-color-4/#hwb-to-rgb
359
355
  * @link http://alvyray.com/Papers/CG/hwb2rgb.htm
360
356
  *
361
- * @param {number} R Red component [0, 255]
362
- * @param {number} G Green [0, 255]
363
- * @param {number} B Blue [0, 255]
357
+ * @param {number} r Red component [0, 1]
358
+ * @param {number} g Green [0, 1]
359
+ * @param {number} b Blue [0, 1]
364
360
  * @return {CP.HWB} {h,w,b} object with [0, 1] ranged values
365
361
  */
366
- function rgbToHwb(R, G, B) {
367
- const r = R / 255;
368
- const g = G / 255;
369
- const b = B / 255;
370
-
362
+ function rgbToHwb(r, g, b) {
371
363
  let f = 0;
372
364
  let i = 0;
373
365
  const whiteness = Math.min(r, g, b);
@@ -397,20 +389,18 @@ function rgbToHwb(R, G, B) {
397
389
  * @param {number} H Hue Angle [0, 1]
398
390
  * @param {number} W Whiteness [0, 1]
399
391
  * @param {number} B Blackness [0, 1]
400
- * @return {CP.RGB} {r,g,b} object with [0, 255] ranged values
392
+ * @return {CP.RGB} {r,g,b} object with [0, 1] ranged values
401
393
  *
402
394
  * @link https://www.w3.org/TR/css-color-4/#hwb-to-rgb
403
395
  * @link http://alvyray.com/Papers/CG/hwb2rgb.htm
404
396
  */
405
397
  function hwbToRgb(H, W, B) {
406
398
  if (W + B >= 1) {
407
- const gray = (W / (W + B)) * 255;
399
+ const gray = W / (W + B);
408
400
  return { r: gray, g: gray, b: gray };
409
401
  }
410
402
  let { r, g, b } = hslToRgb(H, 1, 0.5);
411
- [r, g, b] = [r, g, b]
412
- .map((v) => (v / 255) * (1 - W - B) + W)
413
- .map((v) => v * 255);
403
+ [r, g, b] = [r, g, b].map((v) => v * (1 - W - B) + W);
414
404
 
415
405
  return { r, g, b };
416
406
  }
@@ -418,15 +408,12 @@ function hwbToRgb(H, W, B) {
418
408
  /**
419
409
  * Converts an RGB colour value to HSV.
420
410
  *
421
- * @param {number} R Red component [0, 255]
422
- * @param {number} G Green [0, 255]
423
- * @param {number} B Blue [0, 255]
411
+ * @param {number} r Red component [0, 1]
412
+ * @param {number} g Green [0, 1]
413
+ * @param {number} b Blue [0, 1]
424
414
  * @returns {CP.HSV} {h,s,v} object with [0, 1] ranged values
425
415
  */
426
- function rgbToHsv(R, G, B) {
427
- const r = R / 255;
428
- const g = G / 255;
429
- const b = B / 255;
416
+ function rgbToHsv(r, g, b) {
430
417
  const max = Math.max(r, g, b);
431
418
  const min = Math.min(r, g, b);
432
419
  let h = 0;
@@ -436,17 +423,10 @@ function rgbToHsv(R, G, B) {
436
423
  if (max === min) {
437
424
  h = 0; // achromatic
438
425
  } else {
439
- switch (max) {
440
- case r:
441
- h = (g - b) / d + (g < b ? 6 : 0);
442
- break;
443
- case g:
444
- h = (b - r) / d + 2;
445
- break;
446
- case b:
447
- h = (r - g) / d + 4;
448
- break;
449
- }
426
+ if (r === max) h = (g - b) / d + (g < b ? 6 : 0);
427
+ if (g === max) h = (b - r) / d + 2;
428
+ if (b === max) h = (r - g) / d + 4;
429
+
450
430
  h /= 6;
451
431
  }
452
432
  return { h, s, v };
@@ -470,10 +450,9 @@ function hsvToRgb(H, S, V) {
470
450
  const q = v * (1 - f * s);
471
451
  const t = v * (1 - (1 - f) * s);
472
452
  const mod = i % 6;
473
- let r = [v, q, p, p, t, v][mod];
474
- let g = [t, v, v, q, p, p][mod];
475
- let b = [p, p, t, v, v, q][mod];
476
- [r, g, b] = [r, g, b].map((n) => n * 255);
453
+ const r = [v, q, p, p, t, v][mod];
454
+ const g = [t, v, v, q, p, p][mod];
455
+ const b = [p, p, t, v, v, q][mod];
477
456
  return { r, g, b };
478
457
  }
479
458
 
@@ -541,15 +520,15 @@ function rgbaToHex(r, g, b, a, allow4Char) {
541
520
  */
542
521
  function stringInputToObject(input) {
543
522
  let color = toLowerCase(input.trim());
523
+
544
524
  if (color.length === 0) {
545
525
  return {
546
526
  r: 0, g: 0, b: 0, a: 1,
547
527
  };
548
528
  }
549
- let named = false;
529
+
550
530
  if (isColorName(color)) {
551
531
  color = getRGBFromName(color);
552
- named = true;
553
532
  } else if (nonColors.includes(color)) {
554
533
  const a = color === 'transparent' ? 0 : 1;
555
534
  return {
@@ -568,24 +547,28 @@ function stringInputToObject(input) {
568
547
  r: m1, g: m2, b: m3, a: m4 !== undefined ? m4 : 1, format: 'rgb',
569
548
  };
570
549
  }
550
+
571
551
  [, m1, m2, m3, m4] = matchers.hsl.exec(color) || [];
572
552
  if (m1 && m2 && m3/* && m4 */) {
573
553
  return {
574
554
  h: m1, s: m2, l: m3, a: m4 !== undefined ? m4 : 1, format: 'hsl',
575
555
  };
576
556
  }
557
+
577
558
  [, m1, m2, m3, m4] = matchers.hsv.exec(color) || [];
578
559
  if (m1 && m2 && m3/* && m4 */) {
579
560
  return {
580
561
  h: m1, s: m2, v: m3, a: m4 !== undefined ? m4 : 1, format: 'hsv',
581
562
  };
582
563
  }
564
+
583
565
  [, m1, m2, m3, m4] = matchers.hwb.exec(color) || [];
584
566
  if (m1 && m2 && m3) {
585
567
  return {
586
568
  h: m1, w: m2, b: m3, a: m4 !== undefined ? m4 : 1, format: 'hwb',
587
569
  };
588
570
  }
571
+
589
572
  [, m1, m2, m3, m4] = matchers.hex8.exec(color) || [];
590
573
  if (m1 && m2 && m3 && m4) {
591
574
  return {
@@ -593,18 +576,20 @@ function stringInputToObject(input) {
593
576
  g: parseIntFromHex(m2),
594
577
  b: parseIntFromHex(m3),
595
578
  a: convertHexToDecimal(m4),
596
- format: named ? 'rgb' : 'hex',
579
+ format: 'hex',
597
580
  };
598
581
  }
582
+
599
583
  [, m1, m2, m3] = matchers.hex6.exec(color) || [];
600
584
  if (m1 && m2 && m3) {
601
585
  return {
602
586
  r: parseIntFromHex(m1),
603
587
  g: parseIntFromHex(m2),
604
588
  b: parseIntFromHex(m3),
605
- format: named ? 'rgb' : 'hex',
589
+ format: 'hex',
606
590
  };
607
591
  }
592
+
608
593
  [, m1, m2, m3, m4] = matchers.hex4.exec(color) || [];
609
594
  if (m1 && m2 && m3 && m4) {
610
595
  return {
@@ -612,19 +597,20 @@ function stringInputToObject(input) {
612
597
  g: parseIntFromHex(m2 + m2),
613
598
  b: parseIntFromHex(m3 + m3),
614
599
  a: convertHexToDecimal(m4 + m4),
615
- // format: named ? 'rgb' : 'hex8',
616
- format: named ? 'rgb' : 'hex',
600
+ format: 'hex',
617
601
  };
618
602
  }
603
+
619
604
  [, m1, m2, m3] = matchers.hex3.exec(color) || [];
620
605
  if (m1 && m2 && m3) {
621
606
  return {
622
607
  r: parseIntFromHex(m1 + m1),
623
608
  g: parseIntFromHex(m2 + m2),
624
609
  b: parseIntFromHex(m3 + m3),
625
- format: named ? 'rgb' : 'hex',
610
+ format: 'hex',
626
611
  };
627
612
  }
613
+
628
614
  return false;
629
615
  }
630
616
 
@@ -655,6 +641,7 @@ function stringInputToObject(input) {
655
641
  */
656
642
  function inputToRGB(input) {
657
643
  let rgb = { r: 0, g: 0, b: 0 };
644
+ /** @type {*} */
658
645
  let color = input;
659
646
  /** @type {string | number} */
660
647
  let a = 1;
@@ -671,39 +658,41 @@ function inputToRGB(input) {
671
658
  let format = inputFormat && COLOR_FORMAT.includes(inputFormat) ? inputFormat : 'rgb';
672
659
 
673
660
  if (typeof input === 'string') {
674
- // @ts-ignore -- this now is converted to object
675
661
  color = stringInputToObject(input);
676
662
  if (color) ok = true;
677
663
  }
678
664
  if (typeof color === 'object') {
679
665
  if (isValidCSSUnit(color.r) && isValidCSSUnit(color.g) && isValidCSSUnit(color.b)) {
680
666
  ({ r, g, b } = color);
681
- // RGB values now are all in [0, 255] range
682
- [r, g, b] = [r, g, b].map((n) => bound01(n, isPercentage(n) ? 100 : 255) * 255);
667
+ // RGB values now are all in [0, 1] range
668
+ [r, g, b] = [r, g, b].map((n) => bound01(n, isPercentage(n) ? 100 : 255));
683
669
  rgb = { r, g, b };
684
670
  ok = true;
685
- format = 'rgb';
686
- } else if (isValidCSSUnit(color.h) && isValidCSSUnit(color.s) && isValidCSSUnit(color.v)) {
671
+ format = color.format || 'rgb';
672
+ }
673
+ if (isValidCSSUnit(color.h) && isValidCSSUnit(color.s) && isValidCSSUnit(color.v)) {
687
674
  ({ h, s, v } = color);
688
- h = typeof h === 'number' ? h : bound01(h, 360); // hue can be `5deg` or a [0, 1] value
689
- s = typeof s === 'number' ? s : bound01(s, 100); // saturation can be `5%` or a [0, 1] value
690
- v = typeof v === 'number' ? v : bound01(v, 100); // brightness can be `5%` or a [0, 1] value
675
+ h = bound01(h, 360); // hue can be `5deg` or a [0, 1] value
676
+ s = bound01(s, 100); // saturation can be `5%` or a [0, 1] value
677
+ v = bound01(v, 100); // brightness can be `5%` or a [0, 1] value
691
678
  rgb = hsvToRgb(h, s, v);
692
679
  ok = true;
693
680
  format = 'hsv';
694
- } else if (isValidCSSUnit(color.h) && isValidCSSUnit(color.s) && isValidCSSUnit(color.l)) {
681
+ }
682
+ if (isValidCSSUnit(color.h) && isValidCSSUnit(color.s) && isValidCSSUnit(color.l)) {
695
683
  ({ h, s, l } = color);
696
- h = typeof h === 'number' ? h : bound01(h, 360); // hue can be `5deg` or a [0, 1] value
697
- s = typeof s === 'number' ? s : bound01(s, 100); // saturation can be `5%` or a [0, 1] value
698
- l = typeof l === 'number' ? l : bound01(l, 100); // lightness can be `5%` or a [0, 1] value
684
+ h = bound01(h, 360); // hue can be `5deg` or a [0, 1] value
685
+ s = bound01(s, 100); // saturation can be `5%` or a [0, 1] value
686
+ l = bound01(l, 100); // lightness can be `5%` or a [0, 1] value
699
687
  rgb = hslToRgb(h, s, l);
700
688
  ok = true;
701
689
  format = 'hsl';
702
- } else if (isValidCSSUnit(color.h) && isValidCSSUnit(color.w) && isValidCSSUnit(color.b)) {
690
+ }
691
+ if (isValidCSSUnit(color.h) && isValidCSSUnit(color.w) && isValidCSSUnit(color.b)) {
703
692
  ({ h, w, b } = color);
704
- h = typeof h === 'number' ? h : bound01(h, 360); // hue can be `5deg` or a [0, 1] value
705
- w = typeof w === 'number' ? w : bound01(w, 100); // whiteness can be `5%` or a [0, 1] value
706
- b = typeof b === 'number' ? b : bound01(b, 100); // blackness can be `5%` or a [0, 1] value
693
+ h = bound01(h, 360); // hue can be `5deg` or a [0, 1] value
694
+ w = bound01(w, 100); // whiteness can be `5%` or a [0, 1] value
695
+ b = bound01(b, 100); // blackness can be `5%` or a [0, 1] value
707
696
  rgb = hwbToRgb(h, w, b);
708
697
  ok = true;
709
698
  format = 'hwb';
@@ -720,9 +709,12 @@ function inputToRGB(input) {
720
709
  return {
721
710
  ok,
722
711
  format,
723
- r: Math.min(255, Math.max(rgb.r, 0)),
724
- g: Math.min(255, Math.max(rgb.g, 0)),
725
- b: Math.min(255, Math.max(rgb.b, 0)),
712
+ // r: Math.min(255, Math.max(rgb.r, 0)),
713
+ // g: Math.min(255, Math.max(rgb.g, 0)),
714
+ // b: Math.min(255, Math.max(rgb.b, 0)),
715
+ r: rgb.r,
716
+ g: rgb.g,
717
+ b: rgb.b,
726
718
  a: boundAlpha(a),
727
719
  };
728
720
  }
@@ -741,16 +733,13 @@ class Color {
741
733
  constructor(input, config) {
742
734
  let color = input;
743
735
  const configFormat = config && COLOR_FORMAT.includes(config)
744
- ? config : 'rgb';
736
+ ? config : '';
745
737
 
746
- // If input is already a `Color`, return itself
738
+ // If input is already a `Color`, clone its values
747
739
  if (color instanceof Color) {
748
740
  color = inputToRGB(color);
749
741
  }
750
- if (typeof color === 'number') {
751
- const len = `${color}`.length;
752
- color = `#${(len === 2 ? '0' : '00')}${color}`;
753
- }
742
+
754
743
  const {
755
744
  r, g, b, a, ok, format,
756
745
  } = inputToRGB(color);
@@ -800,24 +789,21 @@ class Color {
800
789
  let R = 0;
801
790
  let G = 0;
802
791
  let B = 0;
803
- const rp = r / 255;
804
- const rg = g / 255;
805
- const rb = b / 255;
806
792
 
807
- if (rp <= 0.03928) {
808
- R = rp / 12.92;
793
+ if (r <= 0.03928) {
794
+ R = r / 12.92;
809
795
  } else {
810
- R = ((rp + 0.055) / 1.055) ** 2.4;
796
+ R = ((r + 0.055) / 1.055) ** 2.4;
811
797
  }
812
- if (rg <= 0.03928) {
813
- G = rg / 12.92;
798
+ if (g <= 0.03928) {
799
+ G = g / 12.92;
814
800
  } else {
815
- G = ((rg + 0.055) / 1.055) ** 2.4;
801
+ G = ((g + 0.055) / 1.055) ** 2.4;
816
802
  }
817
- if (rb <= 0.03928) {
818
- B = rb / 12.92;
803
+ if (b <= 0.03928) {
804
+ B = b / 12.92;
819
805
  } else {
820
- B = ((rb + 0.055) / 1.055) ** 2.4;
806
+ B = ((b + 0.055) / 1.055) ** 2.4;
821
807
  }
822
808
  return 0.2126 * R + 0.7152 * G + 0.0722 * B;
823
809
  }
@@ -827,7 +813,7 @@ class Color {
827
813
  * @returns {number} a number in the [0, 255] range
828
814
  */
829
815
  get brightness() {
830
- const { r, g, b } = this;
816
+ const { r, g, b } = this.toRgb();
831
817
  return (r * 299 + g * 587 + b * 114) / 1000;
832
818
  }
833
819
 
@@ -836,12 +822,14 @@ class Color {
836
822
  * @returns {CP.RGBA} an {r,g,b,a} object with [0, 255] ranged values
837
823
  */
838
824
  toRgb() {
839
- const {
825
+ let {
840
826
  r, g, b, a,
841
827
  } = this;
842
828
 
829
+ [r, g, b] = [r, g, b].map((n) => roundPart(n * 255 * 100) / 100);
830
+ a = roundPart(a * 100) / 100;
843
831
  return {
844
- r, g, b, a: roundPart(a * 100) / 100,
832
+ r, g, b, a,
845
833
  };
846
834
  }
847
835
 
@@ -935,7 +923,7 @@ class Color {
935
923
  toHsv() {
936
924
  const {
937
925
  r, g, b, a,
938
- } = this.toRgb();
926
+ } = this;
939
927
  const { h, s, v } = rgbToHsv(r, g, b);
940
928
 
941
929
  return {
@@ -950,7 +938,7 @@ class Color {
950
938
  toHsl() {
951
939
  const {
952
940
  r, g, b, a,
953
- } = this.toRgb();
941
+ } = this;
954
942
  const { h, s, l } = rgbToHsl(r, g, b);
955
943
 
956
944
  return {
@@ -1035,6 +1023,7 @@ class Color {
1035
1023
  */
1036
1024
  setAlpha(alpha) {
1037
1025
  const self = this;
1026
+ if (typeof alpha !== 'number') return self;
1038
1027
  self.a = boundAlpha(alpha);
1039
1028
  return self;
1040
1029
  }
@@ -1,2 +1,2 @@
1
- // Color v0.0.2alpha1 | thednp © 2022 | MIT-License
2
- const{head:t}=document;function r(t,r){const e=getComputedStyle(t);return r in e?e[r]:""}const e=(t,r)=>Object.assign(t,r),n=(t,r)=>{e(t.style,r)},o=["transparent","currentColor","inherit","revert","initial"];function s(t){const r=Math.floor(t);return t-r<.5?r:Math.round(t)}const a=["rgb","hex","hsl","hsv","hwb"],h="[-\\+]?\\d*\\.?\\d+(?:deg|rad|grad|turn)?",i="(?:[-\\+]?\\d*\\.\\d+%?)|(?:[-\\+]?\\d+%?)",c=`(?:${i})|(?:${h})`,u="(?:[,|\\s]+)",g=`(?:[\\s|\\(\\s|\\s\\(\\s]+)?(${c})${u}(${i})${u}(${i})(?:[,|\\/\\s]*)?(${i})?(?:[\\s|\\)\\s]+)?`,b={CSS_UNIT:new RegExp(c),hwb:new RegExp("hwb"+g),rgb:new RegExp("rgb(?:a)?"+g),hsl:new RegExp("hsl(?:a)?"+g),hsv:new RegExp("hsv(?:a)?"+g),hex3:/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,hex6:/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,hex4:/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,hex8:/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/};function l(t){return(""+t).includes(".")&&1===parseFloat(t)}function f(t){return(""+t).includes("%")}function m(e){return!o.includes(e)&&!["#",...a].some(t=>e.includes(t))&&["rgb(255, 255, 255)","rgb(0, 0, 0)"].every(o=>{n(t,{color:e});const s=r(t,"color");return n(t,{color:""}),s!==o})}function p(t){return Boolean(b.CSS_UNIT.exec(String(t)))}function x(t,r){let e=t;l(t)&&(e="100%");const n=f(e);return e=360===r?parseFloat(e):Math.min(r,Math.max(0,parseFloat(e))),n&&(e=e*r/100),Math.abs(e-r)<1e-6?1:(e=360===r?(e<0?e%r+r:e%r)/r:e%r/r,e)}function S(t){let r=parseFloat(""+t);return(Number.isNaN(r)||r<0||r>1)&&(r=1),r}function $(t){return Math.min(1,Math.max(0,t))}function d(e){n(t,{color:e});const o=r(t,"color");return n(t,{color:""}),o}function A(t){return s(255*t).toString(16)}function w(t){return H(t)/255}function H(t){return parseInt(t,16)}function v(t){return 1===t.length?"0"+t:String(t)}function y(t,r,e){const n=t/255,o=r/255,s=e/255,a=Math.max(n,o,s),h=Math.min(n,o,s);let i=0,c=0;const u=(a+h)/2;if(a===h)c=0,i=0;else{const t=a-h;switch(c=u>.5?t/(2-a-h):t/(a+h),a){case n:i=(o-s)/t+(o<s?6:0);break;case o:i=(s-n)/t+2;break;case s:i=(n-o)/t+4}i/=6}return{h:i,s:c,l:u}}function R(t,r,e){let n=e;return n<0&&(n+=1),n>1&&(n-=1),n<1/6?t+6*n*(r-t):n<.5?r:n<2/3?t+(r-t)*(2/3-n)*6:t}function M(t,r,e){let n=0,o=0,s=0;if(0===r)o=e,s=e,n=e;else{const a=e<.5?e*(1+r):e+r-e*r,h=2*e-a;n=R(h,a,t+1/3),o=R(h,a,t),s=R(h,a,t-1/3)}return[n,o,s]=[n,o,s].map(t=>255*t),{r:n,g:o,b:s}}function F(t,r,e){const n=t/255,o=r/255,s=e/255;let a=0,h=0;const i=Math.min(n,o,s),c=Math.max(n,o,s),u=1-c;if(c===i)return{h:0,w:i,b:u};n===i?(a=o-s,h=3):(a=o===i?s-n:n-o,h=o===i?5:1);const g=(h-a/(c-i))/6;return{h:1===g?0:g,w:i,b:u}}function T(t,r,e){if(r+e>=1){const t=r/(r+e)*255;return{r:t,g:t,b:t}}let{r:n,g:o,b:s}=M(t,1,.5);return[n,o,s]=[n,o,s].map(t=>t/255*(1-r-e)+r).map(t=>255*t),{r:n,g:o,b:s}}function C(t,r,e){const n=t/255,o=r/255,s=e/255,a=Math.max(n,o,s),h=Math.min(n,o,s);let i=0;const c=a,u=a-h,g=0===a?0:u/a;if(a===h)i=0;else{switch(a){case n:i=(o-s)/u+(o<s?6:0);break;case o:i=(s-n)/u+2;break;case s:i=(n-o)/u+4}i/=6}return{h:i,s:g,v:c}}function E(t,r,e){const n=6*t,o=r,s=e,a=Math.floor(n),h=n-a,i=s*(1-o),c=s*(1-h*o),u=s*(1-(1-h)*o),g=a%6;let b=[s,c,i,i,u,s][g],l=[u,s,s,c,i,i][g],f=[i,i,u,s,s,c][g];return[b,l,f]=[b,l,f].map(t=>255*t),{r:b,g:l,b:f}}function N(t,r,e,n){const o=[v(s(t).toString(16)),v(s(r).toString(16)),v(s(e).toString(16))];return n&&o[0].charAt(0)===o[0].charAt(1)&&o[1].charAt(0)===o[1].charAt(1)&&o[2].charAt(0)===o[2].charAt(1)?o[0].charAt(0)+o[1].charAt(0)+o[2].charAt(0):o.join("")}function k(t,r,e,n,o){const a=[v(s(t).toString(16)),v(s(r).toString(16)),v(s(e).toString(16)),v(A(n))];return o&&a[0].charAt(0)===a[0].charAt(1)&&a[1].charAt(0)===a[1].charAt(1)&&a[2].charAt(0)===a[2].charAt(1)&&a[3].charAt(0)===a[3].charAt(1)?a[0].charAt(0)+a[1].charAt(0)+a[2].charAt(0)+a[3].charAt(0):a.join("")}function I(t){let r=t.trim().toLowerCase();if(0===r.length)return{r:0,g:0,b:0,a:1};let e=!1;if(m(r))r=d(r),e=!0;else if(o.includes(r)){return{r:0,g:0,b:0,a:"transparent"===r?0:1,format:"rgb",ok:!0}}let[,n,s,a,h]=b.rgb.exec(r)||[];return n&&s&&a?{r:n,g:s,b:a,a:void 0!==h?h:1,format:"rgb"}:([,n,s,a,h]=b.hsl.exec(r)||[],n&&s&&a?{h:n,s:s,l:a,a:void 0!==h?h:1,format:"hsl"}:([,n,s,a,h]=b.hsv.exec(r)||[],n&&s&&a?{h:n,s:s,v:a,a:void 0!==h?h:1,format:"hsv"}:([,n,s,a,h]=b.hwb.exec(r)||[],n&&s&&a?{h:n,w:s,b:a,a:void 0!==h?h:1,format:"hwb"}:([,n,s,a,h]=b.hex8.exec(r)||[],n&&s&&a&&h?{r:H(n),g:H(s),b:H(a),a:w(h),format:e?"rgb":"hex"}:([,n,s,a]=b.hex6.exec(r)||[],n&&s&&a?{r:H(n),g:H(s),b:H(a),format:e?"rgb":"hex"}:([,n,s,a,h]=b.hex4.exec(r)||[],n&&s&&a&&h?{r:H(n+n),g:H(s+s),b:H(a+a),a:w(h+h),format:e?"rgb":"hex"}:([,n,s,a]=b.hex3.exec(r)||[],!!(n&&s&&a)&&{r:H(n+n),g:H(s+s),b:H(a+a),format:e?"rgb":"hex"})))))))}function _(t){let r={r:0,g:0,b:0},e=t,n=1,o=null,s=null,h=null,i=null,c=null,u=null,g=null,b=null,l=!1;const m="object"==typeof e&&e.format;let $=m&&a.includes(m)?m:"rgb";return"string"==typeof t&&(e=I(t),e&&(l=!0)),"object"==typeof e&&(p(e.r)&&p(e.g)&&p(e.b)?(({r:g,g:b,b:c}=e),[g,b,c]=[g,b,c].map(t=>255*x(t,f(t)?100:255)),r={r:g,g:b,b:c},l=!0,$="rgb"):p(e.h)&&p(e.s)&&p(e.v)?(({h:u,s:o,v:s}=e),u="number"==typeof u?u:x(u,360),o="number"==typeof o?o:x(o,100),s="number"==typeof s?s:x(s,100),r=E(u,o,s),l=!0,$="hsv"):p(e.h)&&p(e.s)&&p(e.l)?(({h:u,s:o,l:h}=e),u="number"==typeof u?u:x(u,360),o="number"==typeof o?o:x(o,100),h="number"==typeof h?h:x(h,100),r=M(u,o,h),l=!0,$="hsl"):p(e.h)&&p(e.w)&&p(e.b)&&(({h:u,w:i,b:c}=e),u="number"==typeof u?u:x(u,360),i="number"==typeof i?i:x(i,100),c="number"==typeof c?c:x(c,100),r=T(u,i,c),l=!0,$="hwb"),p(e.a)&&(n=e.a,n=f(""+n)||parseFloat(n)>1?x(n,100):n)),void 0===e&&(l=!0),{ok:l,format:$,r:Math.min(255,Math.max(r.r,0)),g:Math.min(255,Math.max(r.g,0)),b:Math.min(255,Math.max(r.b,0)),a:S(n)}}class j{constructor(t,r){let e=t;const n=r&&a.includes(r)?r:"rgb";if(e instanceof j&&(e=_(e)),"number"==typeof e){e=`#${2===(""+e).length?"0":"00"}${e}`}const{r:o,g:s,b:h,a:i,ok:c,format:u}=_(e);this.originalInput=t,this.r=o,this.g=s,this.b=h,this.a=i,this.ok=c,this.format=n||u}get isValid(){return this.ok}get isDark(){return this.brightness<120}get luminance(){const{r:t,g:r,b:e}=this;let n=0,o=0,s=0;const a=t/255,h=r/255,i=e/255;return n=a<=.03928?a/12.92:((a+.055)/1.055)**2.4,o=h<=.03928?h/12.92:((h+.055)/1.055)**2.4,s=i<=.03928?i/12.92:((i+.055)/1.055)**2.4,.2126*n+.7152*o+.0722*s}get brightness(){const{r:t,g:r,b:e}=this;return(299*t+587*r+114*e)/1e3}toRgb(){const{r:t,g:r,b:e,a:n}=this;return{r:t,g:r,b:e,a:s(100*n)/100}}toRgbString(){const{r:t,g:r,b:e,a:n}=this.toRgb(),[o,a,h]=[t,r,e].map(s);return 1===n?`rgb(${o}, ${a}, ${h})`:`rgba(${o}, ${a}, ${h}, ${n})`}toRgbCSS4String(){const{r:t,g:r,b:e,a:n}=this.toRgb(),[o,a,h]=[t,r,e].map(s);return`rgb(${o} ${a} ${h}${1===n?"":` / ${s(100*n)}%`})`}toHex(t){const{r:r,g:e,b:n,a:o}=this.toRgb();return 1===o?N(r,e,n,t):k(r,e,n,o,t)}toHexString(t){return"#"+this.toHex(t)}toHex8(t){const{r:r,g:e,b:n,a:o}=this.toRgb();return k(r,e,n,o,t)}toHex8String(t){return"#"+this.toHex8(t)}toHsv(){const{r:t,g:r,b:e,a:n}=this.toRgb(),{h:o,s:s,v:a}=C(t,r,e);return{h:o,s:s,v:a,a:n}}toHsl(){const{r:t,g:r,b:e,a:n}=this.toRgb(),{h:o,s:s,l:a}=y(t,r,e);return{h:o,s:s,l:a,a:n}}toHslString(){let{h:t,s:r,l:e,a:n}=this.toHsl();return t=s(360*t),r=s(100*r),e=s(100*e),n=s(100*n)/100,1===n?`hsl(${t}, ${r}%, ${e}%)`:`hsla(${t}, ${r}%, ${e}%, ${n})`}toHslCSS4String(){let{h:t,s:r,l:e,a:n}=this.toHsl();t=s(360*t),r=s(100*r),e=s(100*e),n=s(100*n);return`hsl(${t}deg ${r}% ${e}%${n<100?` / ${s(n)}%`:""})`}toHwb(){const{r:t,g:r,b:e,a:n}=this,{h:o,w:s,b:a}=F(t,r,e);return{h:o,w:s,b:a,a:n}}toHwbString(){let{h:t,w:r,b:e,a:n}=this.toHwb();t=s(360*t),r=s(100*r),e=s(100*e),n=s(100*n);return`hwb(${t}deg ${r}% ${e}%${n<100?` / ${s(n)}%`:""})`}setAlpha(t){return this.a=S(t),this}saturate(t){if("number"!=typeof t)return this;const{h:r,s:n,l:o}=this.toHsl(),{r:s,g:a,b:h}=M(r,$(n+t/100),o);return e(this,{r:s,g:a,b:h}),this}desaturate(t){return"number"==typeof t?this.saturate(-t):this}greyscale(){return this.saturate(-100)}lighten(t){if("number"!=typeof t)return this;const{h:r,s:n,l:o}=this.toHsl(),{r:s,g:a,b:h}=M(r,n,$(o+t/100));return e(this,{r:s,g:a,b:h}),this}darken(t){return"number"==typeof t?this.lighten(-t):this}spin(t){if("number"!=typeof t)return this;const{h:r,s:n,l:o}=this.toHsl(),{r:s,g:a,b:h}=M($((360*r+t)%360/360),n,o);return e(this,{r:s,g:a,b:h}),this}clone(){return new j(this)}toString(t){const{format:r}=this;return"hex"===r?this.toHexString(t):"hsl"===r?this.toHslString():"hwb"===r?this.toHwbString():this.toRgbString()}}e(j,{ANGLES:"deg|rad|grad|turn",CSS_ANGLE:h,CSS_INTEGER:"[-\\+]?\\d+%?",CSS_NUMBER:"[-\\+]?\\d*\\.\\d+%?",CSS_UNIT:i,CSS_UNIT2:c,PERMISSIVE_MATCH:g,matchers:b,isOnePointZero:l,isPercentage:f,isValidCSSUnit:p,isColorName:m,pad2:v,clamp01:$,bound01:x,boundAlpha:S,getRGBFromName:d,convertHexToDecimal:w,convertDecimalToHex:A,rgbToHsl:y,rgbToHex:N,rgbToHsv:C,rgbToHwb:F,rgbaToHex:k,hslToRgb:M,hsvToRgb:E,hueToRgb:R,hwbToRgb:T,parseIntFromHex:H,stringInputToObject:I,inputToRGB:_,roundPart:s,getElementStyle:r,setElementStyle:n,ObjectAssign:e});export{j as default};
1
+ // Color v0.0.2alpha4 | thednp © 2022 | MIT-License
2
+ const{head:t}=document;function r(t,r){const n=getComputedStyle(t);return r in n?n[r]:""}const n=(t,r)=>Object.assign(t,r),e=(t,r)=>{n(t.style,r)},o=["transparent","currentColor","inherit","revert","initial"];function s(t){const r=Math.floor(t);return t-r<.5?r:Math.round(t)}const a=["rgb","hex","hsl","hsv","hwb"],h="[-\\+]?\\d*\\.?\\d+(?:deg|rad|grad|turn)?",i="(?:[-\\+]?\\d*\\.\\d+%?)|(?:[-\\+]?\\d+%?)",u=`(?:${i})|(?:${h})`,c="(?:[,|\\s]+)",g=`(?:[\\s|\\(\\s|\\s\\(\\s]+)?(${u})${c}(${i})${c}(${i})(?:[,|\\/\\s]*)?(${i})?(?:[\\s|\\)\\s]+)?`,l={CSS_UNIT:new RegExp(u),hwb:new RegExp("hwb"+g),rgb:new RegExp("rgb(?:a)?"+g),hsl:new RegExp("hsl(?:a)?"+g),hsv:new RegExp("hsv(?:a)?"+g),hex3:/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,hex6:/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,hex4:/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,hex8:/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/};function b(t){return(""+t).includes(".")&&1===parseFloat(t)}function f(t){return(""+t).includes("%")}function m(n){return!o.includes(n)&&!["#",...a].some(t=>n.includes(t))&&(!!["black","white"].includes(n)||["rgb(255, 255, 255)","rgb(0, 0, 0)"].every(o=>{e(t,{color:n});const s=r(t,"color");return e(t,{color:""}),s!==o}))}function x(t){return Boolean(l.CSS_UNIT.exec(String(t)))}function S(t,r){let n=t;if("number"==typeof t&&0===Math.min(t,0)&&1===Math.max(t,1))return t;b(t)&&(n="100%");const e=f(n);return n=360===r?parseFloat(n):Math.min(r,Math.max(0,parseFloat(n))),e&&(n=n*r/100),Math.abs(n-r)<1e-6?1:(n=360===r?(n<0?n%r+r:n%r)/r:n%r/r,n)}function d(t){let r=parseFloat(""+t);return(Number.isNaN(r)||r<0||r>1)&&(r=1),r}function A(t){return Math.min(1,Math.max(0,t))}function $(n){e(t,{color:n});const o=r(t,"color");return e(t,{color:""}),o}function p(t){return s(255*t).toString(16)}function w(t){return H(t)/255}function H(t){return parseInt(t,16)}function v(t){return 1===t.length?"0"+t:String(t)}function R(t,r,n){const e=Math.max(t,r,n),o=Math.min(t,r,n);let s=0,a=0;const h=(e+o)/2;if(e===o)a=0,s=0;else{const i=e-o;a=h>.5?i/(2-e-o):i/(e+o),e===t&&(s=(r-n)/i+(r<n?6:0)),e===r&&(s=(n-t)/i+2),e===n&&(s=(t-r)/i+4),s/=6}return{h:s,s:a,l:h}}function F(t,r,n){let e=n;return e<0&&(e+=1),e>1&&(e-=1),e<1/6?t+6*e*(r-t):e<.5?r:e<2/3?t+(r-t)*(2/3-e)*6:t}function M(t,r,n){let e=0,o=0,s=0;if(0===r)o=n,s=n,e=n;else{const a=n<.5?n*(1+r):n+r-n*r,h=2*n-a;e=F(h,a,t+1/3),o=F(h,a,t),s=F(h,a,t-1/3)}return{r:e,g:o,b:s}}function T(t,r,n){let e=0,o=0;const s=Math.min(t,r,n),a=Math.max(t,r,n),h=1-a;if(a===s)return{h:0,w:s,b:h};t===s?(e=r-n,o=3):(e=r===s?n-t:t-r,o=r===s?5:1);const i=(o-e/(a-s))/6;return{h:1===i?0:i,w:s,b:h}}function y(t,r,n){if(r+n>=1){const t=r/(r+n);return{r:t,g:t,b:t}}let{r:e,g:o,b:s}=M(t,1,.5);return[e,o,s]=[e,o,s].map(t=>t*(1-r-n)+r),{r:e,g:o,b:s}}function C(t,r,n){const e=Math.max(t,r,n),o=Math.min(t,r,n);let s=0;const a=e-o;return e===o?s=0:(t===e&&(s=(r-n)/a+(r<n?6:0)),r===e&&(s=(n-t)/a+2),n===e&&(s=(t-r)/a+4),s/=6),{h:s,s:0===e?0:a/e,v:e}}function E(t,r,n){const e=6*t,o=r,s=n,a=Math.floor(e),h=e-a,i=s*(1-o),u=s*(1-h*o),c=s*(1-(1-h)*o),g=a%6;return{r:[s,u,i,i,c,s][g],g:[c,s,s,u,i,i][g],b:[i,i,c,s,s,u][g]}}function N(t,r,n,e){const o=[v(s(t).toString(16)),v(s(r).toString(16)),v(s(n).toString(16))];return e&&o[0].charAt(0)===o[0].charAt(1)&&o[1].charAt(0)===o[1].charAt(1)&&o[2].charAt(0)===o[2].charAt(1)?o[0].charAt(0)+o[1].charAt(0)+o[2].charAt(0):o.join("")}function I(t,r,n,e,o){const a=[v(s(t).toString(16)),v(s(r).toString(16)),v(s(n).toString(16)),v(p(e))];return o&&a[0].charAt(0)===a[0].charAt(1)&&a[1].charAt(0)===a[1].charAt(1)&&a[2].charAt(0)===a[2].charAt(1)&&a[3].charAt(0)===a[3].charAt(1)?a[0].charAt(0)+a[1].charAt(0)+a[2].charAt(0)+a[3].charAt(0):a.join("")}function k(t){let r=t.trim().toLowerCase();if(0===r.length)return{r:0,g:0,b:0,a:1};if(m(r))r=$(r);else if(o.includes(r)){return{r:0,g:0,b:0,a:"transparent"===r?0:1,format:"rgb",ok:!0}}let[,n,e,s,a]=l.rgb.exec(r)||[];return n&&e&&s?{r:n,g:e,b:s,a:void 0!==a?a:1,format:"rgb"}:([,n,e,s,a]=l.hsl.exec(r)||[],n&&e&&s?{h:n,s:e,l:s,a:void 0!==a?a:1,format:"hsl"}:([,n,e,s,a]=l.hsv.exec(r)||[],n&&e&&s?{h:n,s:e,v:s,a:void 0!==a?a:1,format:"hsv"}:([,n,e,s,a]=l.hwb.exec(r)||[],n&&e&&s?{h:n,w:e,b:s,a:void 0!==a?a:1,format:"hwb"}:([,n,e,s,a]=l.hex8.exec(r)||[],n&&e&&s&&a?{r:H(n),g:H(e),b:H(s),a:w(a),format:"hex"}:([,n,e,s]=l.hex6.exec(r)||[],n&&e&&s?{r:H(n),g:H(e),b:H(s),format:"hex"}:([,n,e,s,a]=l.hex4.exec(r)||[],n&&e&&s&&a?{r:H(n+n),g:H(e+e),b:H(s+s),a:w(a+a),format:"hex"}:([,n,e,s]=l.hex3.exec(r)||[],!!(n&&e&&s)&&{r:H(n+n),g:H(e+e),b:H(s+s),format:"hex"})))))))}function _(t){let r={r:0,g:0,b:0},n=t,e=1,o=null,s=null,h=null,i=null,u=null,c=null,g=null,l=null,b=!1;const m="object"==typeof n&&n.format;let A=m&&a.includes(m)?m:"rgb";return"string"==typeof t&&(n=k(t),n&&(b=!0)),"object"==typeof n&&(x(n.r)&&x(n.g)&&x(n.b)&&(({r:g,g:l,b:u}=n),[g,l,u]=[g,l,u].map(t=>S(t,f(t)?100:255)),r={r:g,g:l,b:u},b=!0,A=n.format||"rgb"),x(n.h)&&x(n.s)&&x(n.v)&&(({h:c,s:o,v:s}=n),c=S(c,360),o=S(o,100),s=S(s,100),r=E(c,o,s),b=!0,A="hsv"),x(n.h)&&x(n.s)&&x(n.l)&&(({h:c,s:o,l:h}=n),c=S(c,360),o=S(o,100),h=S(h,100),r=M(c,o,h),b=!0,A="hsl"),x(n.h)&&x(n.w)&&x(n.b)&&(({h:c,w:i,b:u}=n),c=S(c,360),i=S(i,100),u=S(u,100),r=y(c,i,u),b=!0,A="hwb"),x(n.a)&&(e=n.a,e=f(""+e)||parseFloat(e)>1?S(e,100):e)),void 0===n&&(b=!0),{ok:b,format:A,r:r.r,g:r.g,b:r.b,a:d(e)}}class j{constructor(t,r){let n=t;const e=r&&a.includes(r)?r:"";n instanceof j&&(n=_(n));const{r:o,g:s,b:h,a:i,ok:u,format:c}=_(n);this.originalInput=t,this.r=o,this.g=s,this.b=h,this.a=i,this.ok=u,this.format=e||c}get isValid(){return this.ok}get isDark(){return this.brightness<120}get luminance(){const{r:t,g:r,b:n}=this;let e=0,o=0,s=0;return e=t<=.03928?t/12.92:((t+.055)/1.055)**2.4,o=r<=.03928?r/12.92:((r+.055)/1.055)**2.4,s=n<=.03928?n/12.92:((n+.055)/1.055)**2.4,.2126*e+.7152*o+.0722*s}get brightness(){const{r:t,g:r,b:n}=this.toRgb();return(299*t+587*r+114*n)/1e3}toRgb(){let{r:t,g:r,b:n,a:e}=this;return[t,r,n]=[t,r,n].map(t=>s(255*t*100)/100),e=s(100*e)/100,{r:t,g:r,b:n,a:e}}toRgbString(){const{r:t,g:r,b:n,a:e}=this.toRgb(),[o,a,h]=[t,r,n].map(s);return 1===e?`rgb(${o}, ${a}, ${h})`:`rgba(${o}, ${a}, ${h}, ${e})`}toRgbCSS4String(){const{r:t,g:r,b:n,a:e}=this.toRgb(),[o,a,h]=[t,r,n].map(s);return`rgb(${o} ${a} ${h}${1===e?"":` / ${s(100*e)}%`})`}toHex(t){const{r:r,g:n,b:e,a:o}=this.toRgb();return 1===o?N(r,n,e,t):I(r,n,e,o,t)}toHexString(t){return"#"+this.toHex(t)}toHex8(t){const{r:r,g:n,b:e,a:o}=this.toRgb();return I(r,n,e,o,t)}toHex8String(t){return"#"+this.toHex8(t)}toHsv(){const{r:t,g:r,b:n,a:e}=this,{h:o,s:s,v:a}=C(t,r,n);return{h:o,s:s,v:a,a:e}}toHsl(){const{r:t,g:r,b:n,a:e}=this,{h:o,s:s,l:a}=R(t,r,n);return{h:o,s:s,l:a,a:e}}toHslString(){let{h:t,s:r,l:n,a:e}=this.toHsl();return t=s(360*t),r=s(100*r),n=s(100*n),e=s(100*e)/100,1===e?`hsl(${t}, ${r}%, ${n}%)`:`hsla(${t}, ${r}%, ${n}%, ${e})`}toHslCSS4String(){let{h:t,s:r,l:n,a:e}=this.toHsl();t=s(360*t),r=s(100*r),n=s(100*n),e=s(100*e);return`hsl(${t}deg ${r}% ${n}%${e<100?` / ${s(e)}%`:""})`}toHwb(){const{r:t,g:r,b:n,a:e}=this,{h:o,w:s,b:a}=T(t,r,n);return{h:o,w:s,b:a,a:e}}toHwbString(){let{h:t,w:r,b:n,a:e}=this.toHwb();t=s(360*t),r=s(100*r),n=s(100*n),e=s(100*e);return`hwb(${t}deg ${r}% ${n}%${e<100?` / ${s(e)}%`:""})`}setAlpha(t){return"number"!=typeof t||(this.a=d(t)),this}saturate(t){if("number"!=typeof t)return this;const{h:r,s:e,l:o}=this.toHsl(),{r:s,g:a,b:h}=M(r,A(e+t/100),o);return n(this,{r:s,g:a,b:h}),this}desaturate(t){return"number"==typeof t?this.saturate(-t):this}greyscale(){return this.saturate(-100)}lighten(t){if("number"!=typeof t)return this;const{h:r,s:e,l:o}=this.toHsl(),{r:s,g:a,b:h}=M(r,e,A(o+t/100));return n(this,{r:s,g:a,b:h}),this}darken(t){return"number"==typeof t?this.lighten(-t):this}spin(t){if("number"!=typeof t)return this;const{h:r,s:e,l:o}=this.toHsl(),{r:s,g:a,b:h}=M(A((360*r+t)%360/360),e,o);return n(this,{r:s,g:a,b:h}),this}clone(){return new j(this)}toString(t){const{format:r}=this;return"hex"===r?this.toHexString(t):"hsl"===r?this.toHslString():"hwb"===r?this.toHwbString():this.toRgbString()}}n(j,{ANGLES:"deg|rad|grad|turn",CSS_ANGLE:h,CSS_INTEGER:"[-\\+]?\\d+%?",CSS_NUMBER:"[-\\+]?\\d*\\.\\d+%?",CSS_UNIT:i,CSS_UNIT2:u,PERMISSIVE_MATCH:g,matchers:l,isOnePointZero:b,isPercentage:f,isValidCSSUnit:x,isColorName:m,pad2:v,clamp01:A,bound01:S,boundAlpha:d,getRGBFromName:$,convertHexToDecimal:w,convertDecimalToHex:p,rgbToHsl:R,rgbToHex:N,rgbToHsv:C,rgbToHwb:T,rgbaToHex:I,hslToRgb:M,hsvToRgb:E,hueToRgb:F,hwbToRgb:y,parseIntFromHex:H,stringInputToObject:k,inputToRGB:_,roundPart:s,getElementStyle:r,setElementStyle:e,ObjectAssign:n});export{j as default};