@react-stately/color 3.0.0-beta.6 → 3.0.0-beta.9
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/main.js +430 -271
- package/dist/main.js.map +1 -1
- package/dist/module.js +423 -266
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +55 -3
- package/dist/types.d.ts.map +1 -1
- package/package.json +9 -8
- package/src/Color.ts +41 -9
- package/src/index.ts +2 -1
- package/src/useColorAreaState.ts +184 -0
- package/src/useColorFieldState.ts +7 -4
- package/src/useColorSliderState.ts +6 -11
- package/src/useColorWheelState.ts +21 -22
package/dist/main.js
CHANGED
|
@@ -1,9 +1,12 @@
|
|
|
1
|
-
var $
|
|
2
|
-
var $
|
|
3
|
-
var $
|
|
4
|
-
var $
|
|
5
|
-
var $
|
|
1
|
+
var $4tN2K$reactstatelyutils = require("@react-stately/utils");
|
|
2
|
+
var $4tN2K$internationalizedmessage = require("@internationalized/message");
|
|
3
|
+
var $4tN2K$internationalizednumber = require("@internationalized/number");
|
|
4
|
+
var $4tN2K$react = require("react");
|
|
5
|
+
var $4tN2K$reactstatelyslider = require("@react-stately/slider");
|
|
6
6
|
|
|
7
|
+
function $parcel$export(e, n, v, s) {
|
|
8
|
+
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
9
|
+
}
|
|
7
10
|
function $parcel$exportWildcard(dest, source) {
|
|
8
11
|
Object.keys(source).forEach(function(key) {
|
|
9
12
|
if (key === 'default' || key === '__esModule' || dest.hasOwnProperty(key)) {
|
|
@@ -23,197 +26,197 @@ function $parcel$exportWildcard(dest, source) {
|
|
|
23
26
|
function $parcel$interopDefault(a) {
|
|
24
27
|
return a && a.__esModule ? a.default : a;
|
|
25
28
|
}
|
|
26
|
-
function $parcel$export(e, n, v, s) {
|
|
27
|
-
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
28
|
-
}
|
|
29
|
-
var $412b05879b4e9a06$exports = {};
|
|
30
29
|
|
|
31
|
-
$parcel$export(
|
|
30
|
+
$parcel$export(module.exports, "parseColor", () => $83fe1a57d631223b$export$6e865ea70d7724f);
|
|
32
31
|
|
|
33
|
-
var $
|
|
34
|
-
var $
|
|
35
|
-
$
|
|
32
|
+
var $c0b600cf8eafdee9$exports = {};
|
|
33
|
+
var $b044e7150534af04$exports = {};
|
|
34
|
+
$b044e7150534af04$exports = JSON.parse("{\"alpha\":\"ألفا\",\"blue\":\"أزرق\",\"brightness\":\"السطوع\",\"green\":\"أخضر\",\"hue\":\"درجة اللون\",\"lightness\":\"الإضاءة\",\"red\":\"أحمر\",\"saturation\":\"التشبع\"}");
|
|
36
35
|
|
|
37
36
|
|
|
38
|
-
var $
|
|
39
|
-
$
|
|
37
|
+
var $c8bf89547a4a9b3f$exports = {};
|
|
38
|
+
$c8bf89547a4a9b3f$exports = JSON.parse("{\"alpha\":\"Алфа\",\"blue\":\"Синьо\",\"brightness\":\"Яркост\",\"green\":\"Зелено\",\"hue\":\"Оттенък\",\"lightness\":\"Лекота\",\"red\":\"Червено\",\"saturation\":\"Наситеност\"}");
|
|
40
39
|
|
|
41
40
|
|
|
42
|
-
var $
|
|
43
|
-
$
|
|
41
|
+
var $8365d8dfc7e4c985$exports = {};
|
|
42
|
+
$8365d8dfc7e4c985$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Modrá\",\"brightness\":\"Jas\",\"green\":\"Zelená\",\"hue\":\"Odstín\",\"lightness\":\"Světlost\",\"red\":\"Červená\",\"saturation\":\"Sytost\"}");
|
|
44
43
|
|
|
45
44
|
|
|
46
|
-
var $
|
|
47
|
-
$
|
|
45
|
+
var $8d95eeaa73699e56$exports = {};
|
|
46
|
+
$8d95eeaa73699e56$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Blå\",\"brightness\":\"Lysstyrke\",\"green\":\"Grøn\",\"hue\":\"Tone\",\"lightness\":\"Lyshed\",\"red\":\"Rød\",\"saturation\":\"Farvemætning\"}");
|
|
48
47
|
|
|
49
48
|
|
|
50
|
-
var $
|
|
51
|
-
$
|
|
49
|
+
var $2dbbd166053d6d10$exports = {};
|
|
50
|
+
$2dbbd166053d6d10$exports = JSON.parse("{\"alpha\":\"Alpha\",\"blue\":\"Blau\",\"brightness\":\"Helligkeit\",\"green\":\"Grün\",\"hue\":\"Farbton\",\"lightness\":\"Leuchtkraft\",\"red\":\"Rot\",\"saturation\":\"Sättigung\"}");
|
|
52
51
|
|
|
53
52
|
|
|
54
|
-
var $
|
|
55
|
-
$
|
|
53
|
+
var $1fcbdf9eaf6cc074$exports = {};
|
|
54
|
+
$1fcbdf9eaf6cc074$exports = JSON.parse("{\"alpha\":\"Άλφα\",\"blue\":\"Μπλε\",\"brightness\":\"Φωτεινότητα\",\"green\":\"Πράσινο\",\"hue\":\"Τόνος\",\"lightness\":\"Φωτεινότητα\",\"red\":\"Κόκκινο\",\"saturation\":\"Κορεσμός\"}");
|
|
56
55
|
|
|
57
56
|
|
|
58
|
-
var $
|
|
59
|
-
$
|
|
57
|
+
var $42d54be461715959$exports = {};
|
|
58
|
+
$42d54be461715959$exports = JSON.parse("{\"hue\":\"Hue\",\"saturation\":\"Saturation\",\"lightness\":\"Lightness\",\"brightness\":\"Brightness\",\"red\":\"Red\",\"green\":\"Green\",\"blue\":\"Blue\",\"alpha\":\"Alpha\"}");
|
|
60
59
|
|
|
61
60
|
|
|
62
|
-
var $
|
|
63
|
-
$
|
|
61
|
+
var $911646bd5662c33d$exports = {};
|
|
62
|
+
$911646bd5662c33d$exports = JSON.parse("{\"alpha\":\"Alpha\",\"blue\":\"Azul\",\"brightness\":\"Brillo\",\"green\":\"Verde\",\"hue\":\"Tono\",\"lightness\":\"Luminosidad\",\"red\":\"Rojo\",\"saturation\":\"Saturación\"}");
|
|
64
63
|
|
|
65
64
|
|
|
66
|
-
var $
|
|
67
|
-
$
|
|
65
|
+
var $6e8998796901e680$exports = {};
|
|
66
|
+
$6e8998796901e680$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Sinine\",\"brightness\":\"Heledus\",\"green\":\"Roheline\",\"hue\":\"Värv\",\"lightness\":\"Valgus\",\"red\":\"Punane\",\"saturation\":\"Küllastus\"}");
|
|
68
67
|
|
|
69
68
|
|
|
70
|
-
var $
|
|
71
|
-
$
|
|
69
|
+
var $4503b4001036be6d$exports = {};
|
|
70
|
+
$4503b4001036be6d$exports = JSON.parse("{\"alpha\":\"Alpha\",\"blue\":\"Sininen\",\"brightness\":\"Kirkkaus\",\"green\":\"Vihreä\",\"hue\":\"Sävy\",\"lightness\":\"Valomäärä\",\"red\":\"Punainen\",\"saturation\":\"Värikylläisyys\"}");
|
|
72
71
|
|
|
73
72
|
|
|
74
|
-
var $
|
|
75
|
-
$
|
|
73
|
+
var $721e7016769a7a7f$exports = {};
|
|
74
|
+
$721e7016769a7a7f$exports = JSON.parse("{\"alpha\":\"Alpha\",\"blue\":\"Bleu\",\"brightness\":\"Luminosité\",\"green\":\"Vert\",\"hue\":\"Teinte\",\"lightness\":\"Luminosité\",\"red\":\"Rouge\",\"saturation\":\"Saturation\"}");
|
|
76
75
|
|
|
77
76
|
|
|
78
|
-
var $
|
|
79
|
-
$
|
|
77
|
+
var $dcc290e5792f9bab$exports = {};
|
|
78
|
+
$dcc290e5792f9bab$exports = JSON.parse("{\"alpha\":\"אלפא\",\"blue\":\"כחול\",\"brightness\":\"בהירות\",\"green\":\"ירוק\",\"hue\":\"גוון\",\"lightness\":\"כמות אור\",\"red\":\"אדום\",\"saturation\":\"רוויה\"}");
|
|
80
79
|
|
|
81
80
|
|
|
82
|
-
var $
|
|
83
|
-
$
|
|
81
|
+
var $d93d5aebdd12334c$exports = {};
|
|
82
|
+
$d93d5aebdd12334c$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Plava\",\"brightness\":\"Svjetlina\",\"green\":\"Zelena\",\"hue\":\"Nijansa\",\"lightness\":\"Osvijetljenost\",\"red\":\"Crvena\",\"saturation\":\"Zasićenost\"}");
|
|
84
83
|
|
|
85
84
|
|
|
86
|
-
var $
|
|
87
|
-
$
|
|
85
|
+
var $a3749e0ee87dbebc$exports = {};
|
|
86
|
+
$a3749e0ee87dbebc$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Kék\",\"brightness\":\"Fényesség\",\"green\":\"Zöld\",\"hue\":\"Színárnyalat\",\"lightness\":\"Világosság\",\"red\":\"Piros\",\"saturation\":\"Telítettség\"}");
|
|
88
87
|
|
|
89
88
|
|
|
90
|
-
var $
|
|
91
|
-
$
|
|
89
|
+
var $2fdb931b6c9652b9$exports = {};
|
|
90
|
+
$2fdb931b6c9652b9$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Blu\",\"brightness\":\"Luminosità\",\"green\":\"Verde\",\"hue\":\"Tonalità\",\"lightness\":\"Luminosità\",\"red\":\"Rosso\",\"saturation\":\"Saturazione\"}");
|
|
92
91
|
|
|
93
92
|
|
|
94
|
-
var $
|
|
95
|
-
$
|
|
93
|
+
var $219c839b59015b4f$exports = {};
|
|
94
|
+
$219c839b59015b4f$exports = JSON.parse("{\"alpha\":\"アルファ\",\"blue\":\"青\",\"brightness\":\"明るさ\",\"green\":\"緑\",\"hue\":\"色相\",\"lightness\":\"明度\",\"red\":\"赤\",\"saturation\":\"彩度\"}");
|
|
96
95
|
|
|
97
96
|
|
|
98
|
-
var $
|
|
99
|
-
$
|
|
97
|
+
var $b7f67f414086d976$exports = {};
|
|
98
|
+
$b7f67f414086d976$exports = JSON.parse("{\"alpha\":\"알파\",\"blue\":\"파랑\",\"brightness\":\"명도\",\"green\":\"초록\",\"hue\":\"색조\",\"lightness\":\"밝기\",\"red\":\"빨강\",\"saturation\":\"채도\"}");
|
|
100
99
|
|
|
101
100
|
|
|
102
|
-
var $
|
|
103
|
-
$
|
|
101
|
+
var $f27b2ac7d517417c$exports = {};
|
|
102
|
+
$f27b2ac7d517417c$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Mėlyna\",\"brightness\":\"Ryškumas\",\"green\":\"Žalia\",\"hue\":\"Atspalvis\",\"lightness\":\"Šviesumas\",\"red\":\"Raudona\",\"saturation\":\"Įsotinimas\"}");
|
|
104
103
|
|
|
105
104
|
|
|
106
|
-
var $
|
|
107
|
-
$
|
|
105
|
+
var $e92168db3cbe2797$exports = {};
|
|
106
|
+
$e92168db3cbe2797$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Zila\",\"brightness\":\"Spilgtums\",\"green\":\"Zaļa\",\"hue\":\"Nokrāsa\",\"lightness\":\"Gaišums\",\"red\":\"Sarkana\",\"saturation\":\"Piesātinājums\"}");
|
|
108
107
|
|
|
109
108
|
|
|
110
|
-
var $
|
|
111
|
-
$
|
|
109
|
+
var $44b012e02982e825$exports = {};
|
|
110
|
+
$44b012e02982e825$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Blå\",\"brightness\":\"Lysstyrke\",\"green\":\"Grønn\",\"hue\":\"Fargetone\",\"lightness\":\"Lyshet\",\"red\":\"Rød\",\"saturation\":\"Metning\"}");
|
|
112
111
|
|
|
113
112
|
|
|
114
|
-
var $
|
|
115
|
-
$
|
|
113
|
+
var $64fbd91459613d8b$exports = {};
|
|
114
|
+
$64fbd91459613d8b$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Blauw\",\"brightness\":\"Helderheid\",\"green\":\"Groen\",\"hue\":\"Kleurtoon\",\"lightness\":\"Lichtsterkte\",\"red\":\"Rood\",\"saturation\":\"Verzadiging\"}");
|
|
116
115
|
|
|
117
116
|
|
|
118
|
-
var $
|
|
119
|
-
$
|
|
117
|
+
var $83fabdc4e0df6af9$exports = {};
|
|
118
|
+
$83fabdc4e0df6af9$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Niebieski\",\"brightness\":\"Jasność\",\"green\":\"Zielony\",\"hue\":\"Odcień\",\"lightness\":\"Jaskrawość\",\"red\":\"Czerwony\",\"saturation\":\"Nasycenie\"}");
|
|
120
119
|
|
|
121
120
|
|
|
122
|
-
var $
|
|
123
|
-
$
|
|
121
|
+
var $30b915257fa66ccf$exports = {};
|
|
122
|
+
$30b915257fa66ccf$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Azul\",\"brightness\":\"Brilho\",\"green\":\"Verde\",\"hue\":\"Matiz\",\"lightness\":\"Luminosidade\",\"red\":\"Vermelho\",\"saturation\":\"Saturação\"}");
|
|
124
123
|
|
|
125
124
|
|
|
126
|
-
var $
|
|
127
|
-
$
|
|
125
|
+
var $ce75e45ccbc92491$exports = {};
|
|
126
|
+
$ce75e45ccbc92491$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Azul\",\"brightness\":\"Luminosidade\",\"green\":\"Verde\",\"hue\":\"Tonalidade\",\"lightness\":\"Claridade\",\"red\":\"Vermelho\",\"saturation\":\"Saturação\"}");
|
|
128
127
|
|
|
129
128
|
|
|
130
|
-
var $
|
|
131
|
-
$
|
|
129
|
+
var $225440ee53a1fecd$exports = {};
|
|
130
|
+
$225440ee53a1fecd$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Albastru\",\"brightness\":\"Luminozitate\",\"green\":\"Verde\",\"hue\":\"Nuanță\",\"lightness\":\"Luminozitate\",\"red\":\"Roșu\",\"saturation\":\"Saturație\"}");
|
|
132
131
|
|
|
133
132
|
|
|
134
|
-
var $
|
|
135
|
-
$
|
|
133
|
+
var $cbc60c1dd4e689ff$exports = {};
|
|
134
|
+
$cbc60c1dd4e689ff$exports = JSON.parse("{\"alpha\":\"Альфа\",\"blue\":\"Синий\",\"brightness\":\"Яркость\",\"green\":\"Зеленый\",\"hue\":\"Оттенок\",\"lightness\":\"Освещенность\",\"red\":\"Красный\",\"saturation\":\"Насыщенность\"}");
|
|
136
135
|
|
|
137
136
|
|
|
138
|
-
var $
|
|
139
|
-
$
|
|
137
|
+
var $8612080ab5efe0cf$exports = {};
|
|
138
|
+
$8612080ab5efe0cf$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Modrá\",\"brightness\":\"Jas\",\"green\":\"Zelená\",\"hue\":\"Odtieň\",\"lightness\":\"Svetlosť\",\"red\":\"Červená\",\"saturation\":\"Sýtosť\"}");
|
|
140
139
|
|
|
141
140
|
|
|
142
|
-
var $
|
|
143
|
-
$
|
|
141
|
+
var $99cc034ddd2b7d86$exports = {};
|
|
142
|
+
$99cc034ddd2b7d86$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Modra\",\"brightness\":\"Svetlost\",\"green\":\"Zelena\",\"hue\":\"Barva\",\"lightness\":\"Lahkost\",\"red\":\"Rdeča\",\"saturation\":\"Nasičenost\"}");
|
|
144
143
|
|
|
145
144
|
|
|
146
|
-
var $
|
|
147
|
-
$
|
|
145
|
+
var $dc671800d61be83e$exports = {};
|
|
146
|
+
$dc671800d61be83e$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Plava\",\"brightness\":\"Osvetljenost\",\"green\":\"Zelena\",\"hue\":\"Nijansa\",\"lightness\":\"Osvetljenje\",\"red\":\"Crvena\",\"saturation\":\"Zasićenje\"}");
|
|
148
147
|
|
|
149
148
|
|
|
150
|
-
var $
|
|
151
|
-
$
|
|
149
|
+
var $0f4790e2f696e63f$exports = {};
|
|
150
|
+
$0f4790e2f696e63f$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Blått\",\"brightness\":\"Ljusstyrka\",\"green\":\"Grönt\",\"hue\":\"Nyans\",\"lightness\":\"Ljushet\",\"red\":\"Rött\",\"saturation\":\"Mättnad\"}");
|
|
152
151
|
|
|
153
152
|
|
|
154
|
-
var $
|
|
155
|
-
$
|
|
153
|
+
var $deb5f82eb1998a3c$exports = {};
|
|
154
|
+
$deb5f82eb1998a3c$exports = JSON.parse("{\"alpha\":\"Alfa\",\"blue\":\"Mavi\",\"brightness\":\"Parlaklık\",\"green\":\"Yeşil\",\"hue\":\"Ton\",\"lightness\":\"Canlılık\",\"red\":\"Kırmızı\",\"saturation\":\"Doygunluk\"}");
|
|
156
155
|
|
|
157
156
|
|
|
158
|
-
var $
|
|
159
|
-
$
|
|
157
|
+
var $99530e1782ca02cc$exports = {};
|
|
158
|
+
$99530e1782ca02cc$exports = JSON.parse("{\"alpha\":\"Альфа\",\"blue\":\"Синій\",\"brightness\":\"Яскравість\",\"green\":\"Зелений\",\"hue\":\"Тон\",\"lightness\":\"Освітленість\",\"red\":\"Червоний\",\"saturation\":\"Насиченість\"}");
|
|
160
159
|
|
|
161
160
|
|
|
162
|
-
var $
|
|
163
|
-
$
|
|
161
|
+
var $a6e8f490b423d65e$exports = {};
|
|
162
|
+
$a6e8f490b423d65e$exports = JSON.parse("{\"alpha\":\"Alpha\",\"blue\":\"蓝色\",\"brightness\":\"亮度\",\"green\":\"绿色\",\"hue\":\"色相\",\"lightness\":\"明亮度\",\"red\":\"红色\",\"saturation\":\"饱和度\"}");
|
|
164
163
|
|
|
165
164
|
|
|
166
|
-
var $
|
|
167
|
-
$
|
|
165
|
+
var $eba443dcc93cab9a$exports = {};
|
|
166
|
+
$eba443dcc93cab9a$exports = JSON.parse("{\"alpha\":\"Alpha\",\"blue\":\"藍色\",\"brightness\":\"亮度\",\"green\":\"綠色\",\"hue\":\"色相\",\"lightness\":\"明亮\",\"red\":\"紅色\",\"saturation\":\"飽和度\"}");
|
|
168
167
|
|
|
169
168
|
|
|
170
|
-
$
|
|
171
|
-
"ar-AE": $
|
|
172
|
-
"bg-BG": $
|
|
173
|
-
"cs-CZ": $
|
|
174
|
-
"da-DK": $
|
|
175
|
-
"de-DE": $
|
|
176
|
-
"el-GR": $
|
|
177
|
-
"en-US": $
|
|
178
|
-
"es-ES": $
|
|
179
|
-
"et-EE": $
|
|
180
|
-
"fi-FI": $
|
|
181
|
-
"fr-FR": $
|
|
182
|
-
"he-IL": $
|
|
183
|
-
"hr-HR": $
|
|
184
|
-
"hu-HU": $
|
|
185
|
-
"it-IT": $
|
|
186
|
-
"ja-JP": $
|
|
187
|
-
"ko-KR": $
|
|
188
|
-
"lt-LT": $
|
|
189
|
-
"lv-LV": $
|
|
190
|
-
"nb-NO": $
|
|
191
|
-
"nl-NL": $
|
|
192
|
-
"pl-PL": $
|
|
193
|
-
"pt-BR": $
|
|
194
|
-
"pt-PT": $
|
|
195
|
-
"ro-RO": $
|
|
196
|
-
"ru-RU": $
|
|
197
|
-
"sk-SK": $
|
|
198
|
-
"sl-SI": $
|
|
199
|
-
"sr-SP": $
|
|
200
|
-
"sv-SE": $
|
|
201
|
-
"tr-TR": $
|
|
202
|
-
"uk-UA": $
|
|
203
|
-
"zh-CN": $
|
|
204
|
-
"zh-TW": $
|
|
169
|
+
$c0b600cf8eafdee9$exports = {
|
|
170
|
+
"ar-AE": $b044e7150534af04$exports,
|
|
171
|
+
"bg-BG": $c8bf89547a4a9b3f$exports,
|
|
172
|
+
"cs-CZ": $8365d8dfc7e4c985$exports,
|
|
173
|
+
"da-DK": $8d95eeaa73699e56$exports,
|
|
174
|
+
"de-DE": $2dbbd166053d6d10$exports,
|
|
175
|
+
"el-GR": $1fcbdf9eaf6cc074$exports,
|
|
176
|
+
"en-US": $42d54be461715959$exports,
|
|
177
|
+
"es-ES": $911646bd5662c33d$exports,
|
|
178
|
+
"et-EE": $6e8998796901e680$exports,
|
|
179
|
+
"fi-FI": $4503b4001036be6d$exports,
|
|
180
|
+
"fr-FR": $721e7016769a7a7f$exports,
|
|
181
|
+
"he-IL": $dcc290e5792f9bab$exports,
|
|
182
|
+
"hr-HR": $d93d5aebdd12334c$exports,
|
|
183
|
+
"hu-HU": $a3749e0ee87dbebc$exports,
|
|
184
|
+
"it-IT": $2fdb931b6c9652b9$exports,
|
|
185
|
+
"ja-JP": $219c839b59015b4f$exports,
|
|
186
|
+
"ko-KR": $b7f67f414086d976$exports,
|
|
187
|
+
"lt-LT": $f27b2ac7d517417c$exports,
|
|
188
|
+
"lv-LV": $e92168db3cbe2797$exports,
|
|
189
|
+
"nb-NO": $44b012e02982e825$exports,
|
|
190
|
+
"nl-NL": $64fbd91459613d8b$exports,
|
|
191
|
+
"pl-PL": $83fabdc4e0df6af9$exports,
|
|
192
|
+
"pt-BR": $30b915257fa66ccf$exports,
|
|
193
|
+
"pt-PT": $ce75e45ccbc92491$exports,
|
|
194
|
+
"ro-RO": $225440ee53a1fecd$exports,
|
|
195
|
+
"ru-RU": $cbc60c1dd4e689ff$exports,
|
|
196
|
+
"sk-SK": $8612080ab5efe0cf$exports,
|
|
197
|
+
"sl-SI": $99cc034ddd2b7d86$exports,
|
|
198
|
+
"sr-SP": $dc671800d61be83e$exports,
|
|
199
|
+
"sv-SE": $0f4790e2f696e63f$exports,
|
|
200
|
+
"tr-TR": $deb5f82eb1998a3c$exports,
|
|
201
|
+
"uk-UA": $99530e1782ca02cc$exports,
|
|
202
|
+
"zh-CN": $a6e8f490b423d65e$exports,
|
|
203
|
+
"zh-TW": $eba443dcc93cab9a$exports
|
|
205
204
|
};
|
|
206
205
|
|
|
207
206
|
|
|
208
207
|
|
|
209
208
|
|
|
210
|
-
const $
|
|
211
|
-
function $
|
|
212
|
-
let res = $
|
|
209
|
+
const $83fe1a57d631223b$var$messages = new $4tN2K$internationalizedmessage.MessageDictionary((/*@__PURE__*/$parcel$interopDefault($c0b600cf8eafdee9$exports)));
|
|
210
|
+
function $83fe1a57d631223b$export$6e865ea70d7724f(value) {
|
|
211
|
+
let res = $83fe1a57d631223b$var$RGBColor.parse(value) || $83fe1a57d631223b$var$HSBColor.parse(value) || $83fe1a57d631223b$var$HSLColor.parse(value);
|
|
213
212
|
if (res) return res;
|
|
214
213
|
throw new Error('Invalid color value: ' + value);
|
|
215
214
|
}
|
|
216
|
-
|
|
215
|
+
function $83fe1a57d631223b$export$4cde5df63f53f473(v) {
|
|
216
|
+
if (typeof v === 'string') return $83fe1a57d631223b$export$6e865ea70d7724f(v);
|
|
217
|
+
else return v;
|
|
218
|
+
}
|
|
219
|
+
class $83fe1a57d631223b$var$Color {
|
|
217
220
|
toHexInt() {
|
|
218
221
|
return this.toFormat('rgb').toHexInt();
|
|
219
222
|
}
|
|
@@ -230,42 +233,50 @@ class $412b05879b4e9a06$var$Color {
|
|
|
230
233
|
throw new Error('Unsupported color channel: ' + channel);
|
|
231
234
|
}
|
|
232
235
|
getChannelName(channel, locale) {
|
|
233
|
-
return $
|
|
236
|
+
return $83fe1a57d631223b$var$messages.getStringForLocale(channel, locale);
|
|
237
|
+
}
|
|
238
|
+
getColorSpaceAxes(xyChannels) {
|
|
239
|
+
let { xChannel: xChannel , yChannel: yChannel } = xyChannels;
|
|
240
|
+
let xCh = xChannel || this.getColorChannels().find((c)=>c !== yChannel
|
|
241
|
+
);
|
|
242
|
+
let yCh = yChannel || this.getColorChannels().find((c)=>c !== xCh
|
|
243
|
+
);
|
|
244
|
+
let zCh = this.getColorChannels().find((c)=>c !== xCh && c !== yCh
|
|
245
|
+
);
|
|
246
|
+
return {
|
|
247
|
+
xChannel: xCh,
|
|
248
|
+
yChannel: yCh,
|
|
249
|
+
zChannel: zCh
|
|
250
|
+
};
|
|
234
251
|
}
|
|
235
252
|
}
|
|
236
|
-
const $
|
|
253
|
+
const $83fe1a57d631223b$var$HEX_REGEX = /^#(?:([0-9a-f]{3})|([0-9a-f]{6}))$/i;
|
|
237
254
|
// X = <negative/positive number with/without decimal places>
|
|
238
255
|
// before/after a comma, 0 or more whitespaces are allowed
|
|
239
256
|
// - rgb(X, X, X)
|
|
240
257
|
// - rgba(X, X, X, X)
|
|
241
|
-
const $
|
|
242
|
-
class $
|
|
243
|
-
constructor(red, green, blue, alpha){
|
|
244
|
-
super();
|
|
245
|
-
this.red = red;
|
|
246
|
-
this.green = green;
|
|
247
|
-
this.blue = blue;
|
|
248
|
-
this.alpha = alpha;
|
|
249
|
-
}
|
|
258
|
+
const $83fe1a57d631223b$var$RGB_REGEX = /rgb\(([-+]?\d+(?:.\d+)?\s*,\s*[-+]?\d+(?:.\d+)?\s*,\s*[-+]?\d+(?:.\d+)?)\)|rgba\(([-+]?\d+(?:.\d+)?\s*,\s*[-+]?\d+(?:.\d+)?\s*,\s*[-+]?\d+(?:.\d+)?\s*,\s*[-+]?\d(.\d+)?)\)/;
|
|
259
|
+
class $83fe1a57d631223b$var$RGBColor extends $83fe1a57d631223b$var$Color {
|
|
250
260
|
static parse(value) {
|
|
251
261
|
let m;
|
|
252
|
-
if (m = value.match($
|
|
262
|
+
if (m = value.match($83fe1a57d631223b$var$HEX_REGEX)) {
|
|
253
263
|
if (m[1]) {
|
|
254
264
|
let r = parseInt(m[1][0] + m[1][0], 16);
|
|
255
265
|
let g = parseInt(m[1][1] + m[1][1], 16);
|
|
256
266
|
let b = parseInt(m[1][2] + m[1][2], 16);
|
|
257
|
-
return new $
|
|
267
|
+
return new $83fe1a57d631223b$var$RGBColor(r, g, b, 1);
|
|
258
268
|
} else if (m[2]) {
|
|
259
269
|
let r = parseInt(m[2][0] + m[2][1], 16);
|
|
260
270
|
let g = parseInt(m[2][2] + m[2][3], 16);
|
|
261
271
|
let b = parseInt(m[2][4] + m[2][5], 16);
|
|
262
|
-
return new $
|
|
272
|
+
return new $83fe1a57d631223b$var$RGBColor(r, g, b, 1);
|
|
263
273
|
}
|
|
264
274
|
}
|
|
265
|
-
if (m = value.match($
|
|
266
|
-
|
|
275
|
+
if (m = value.match($83fe1a57d631223b$var$RGB_REGEX)) {
|
|
276
|
+
var ref;
|
|
277
|
+
const [r, g, b, a] = ((ref = m[1]) !== null && ref !== void 0 ? ref : m[2]).split(',').map((n)=>Number(n.trim())
|
|
267
278
|
);
|
|
268
|
-
return new $
|
|
279
|
+
return new $83fe1a57d631223b$var$RGBColor($4tN2K$reactstatelyutils.clamp(r, 0, 255), $4tN2K$reactstatelyutils.clamp(g, 0, 255), $4tN2K$reactstatelyutils.clamp(b, 0, 255), $4tN2K$reactstatelyutils.clamp(a !== null && a !== void 0 ? a : 1, 0, 1));
|
|
269
280
|
}
|
|
270
281
|
}
|
|
271
282
|
toString(format) {
|
|
@@ -330,7 +341,7 @@ class $412b05879b4e9a06$var$RGBColor extends $412b05879b4e9a06$var$Color {
|
|
|
330
341
|
}
|
|
331
342
|
hue /= 6;
|
|
332
343
|
}
|
|
333
|
-
return new $
|
|
344
|
+
return new $83fe1a57d631223b$var$HSBColor($4tN2K$reactstatelyutils.toFixedNumber(hue * 360, 2), $4tN2K$reactstatelyutils.toFixedNumber(saturation * 100, 2), $4tN2K$reactstatelyutils.toFixedNumber(brightness * 100, 2), this.alpha);
|
|
334
345
|
}
|
|
335
346
|
/**
|
|
336
347
|
* Converts an RGB color value to HSL.
|
|
@@ -362,10 +373,10 @@ class $412b05879b4e9a06$var$RGBColor extends $412b05879b4e9a06$var$Color {
|
|
|
362
373
|
}
|
|
363
374
|
hue /= 6;
|
|
364
375
|
}
|
|
365
|
-
return new $
|
|
376
|
+
return new $83fe1a57d631223b$var$HSLColor($4tN2K$reactstatelyutils.toFixedNumber(hue * 360, 2), $4tN2K$reactstatelyutils.toFixedNumber(saturation * 100, 2), $4tN2K$reactstatelyutils.toFixedNumber(lightness * 100, 2), this.alpha);
|
|
366
377
|
}
|
|
367
378
|
clone() {
|
|
368
|
-
return new $
|
|
379
|
+
return new $83fe1a57d631223b$var$RGBColor(this.red, this.green, this.blue, this.alpha);
|
|
369
380
|
}
|
|
370
381
|
getChannelRange(channel) {
|
|
371
382
|
switch(channel){
|
|
@@ -375,13 +386,15 @@ class $412b05879b4e9a06$var$RGBColor extends $412b05879b4e9a06$var$Color {
|
|
|
375
386
|
return {
|
|
376
387
|
minValue: 0,
|
|
377
388
|
maxValue: 255,
|
|
378
|
-
step: 1
|
|
389
|
+
step: 1,
|
|
390
|
+
pageSize: 17
|
|
379
391
|
};
|
|
380
392
|
case 'alpha':
|
|
381
393
|
return {
|
|
382
394
|
minValue: 0,
|
|
383
395
|
maxValue: 1,
|
|
384
|
-
step: 0.01
|
|
396
|
+
step: 0.01,
|
|
397
|
+
pageSize: 0.1
|
|
385
398
|
};
|
|
386
399
|
default:
|
|
387
400
|
throw new Error('Unknown color channel: ' + channel);
|
|
@@ -406,31 +419,40 @@ class $412b05879b4e9a06$var$RGBColor extends $412b05879b4e9a06$var$Color {
|
|
|
406
419
|
default:
|
|
407
420
|
throw new Error('Unknown color channel: ' + channel);
|
|
408
421
|
}
|
|
409
|
-
return new $
|
|
422
|
+
return new $4tN2K$internationalizednumber.NumberFormatter(locale, options).format(value);
|
|
410
423
|
}
|
|
411
424
|
getColorSpace() {
|
|
412
425
|
return 'rgb';
|
|
413
426
|
}
|
|
427
|
+
getColorChannels() {
|
|
428
|
+
return $83fe1a57d631223b$var$RGBColor.colorChannels;
|
|
429
|
+
}
|
|
430
|
+
constructor(red, green, blue, alpha){
|
|
431
|
+
super();
|
|
432
|
+
this.red = red;
|
|
433
|
+
this.green = green;
|
|
434
|
+
this.blue = blue;
|
|
435
|
+
this.alpha = alpha;
|
|
436
|
+
}
|
|
414
437
|
}
|
|
438
|
+
$83fe1a57d631223b$var$RGBColor.colorChannels = [
|
|
439
|
+
'red',
|
|
440
|
+
'green',
|
|
441
|
+
'blue'
|
|
442
|
+
];
|
|
415
443
|
// X = <negative/positive number with/without decimal places>
|
|
416
444
|
// before/after a comma, 0 or more whitespaces are allowed
|
|
417
445
|
// - hsb(X, X%, X%)
|
|
418
446
|
// - hsba(X, X%, X%, X)
|
|
419
|
-
const $
|
|
420
|
-
class $
|
|
421
|
-
constructor(hue, saturation, brightness, alpha){
|
|
422
|
-
super();
|
|
423
|
-
this.hue = hue;
|
|
424
|
-
this.saturation = saturation;
|
|
425
|
-
this.brightness = brightness;
|
|
426
|
-
this.alpha = alpha;
|
|
427
|
-
}
|
|
447
|
+
const $83fe1a57d631223b$var$HSB_REGEX = /hsb\(([-+]?\d+(?:.\d+)?\s*,\s*[-+]?\d+(?:.\d+)?%\s*,\s*[-+]?\d+(?:.\d+)?%)\)|hsba\(([-+]?\d+(?:.\d+)?\s*,\s*[-+]?\d+(?:.\d+)?%\s*,\s*[-+]?\d+(?:.\d+)?%\s*,\s*[-+]?\d(.\d+)?)\)/;
|
|
448
|
+
class $83fe1a57d631223b$var$HSBColor extends $83fe1a57d631223b$var$Color {
|
|
428
449
|
static parse(value) {
|
|
429
450
|
let m;
|
|
430
|
-
if (m = value.match($
|
|
431
|
-
|
|
451
|
+
if (m = value.match($83fe1a57d631223b$var$HSB_REGEX)) {
|
|
452
|
+
var ref;
|
|
453
|
+
const [h, s, b, a] = ((ref = m[1]) !== null && ref !== void 0 ? ref : m[2]).split(',').map((n)=>Number(n.trim().replace('%', ''))
|
|
432
454
|
);
|
|
433
|
-
return new $
|
|
455
|
+
return new $83fe1a57d631223b$var$HSBColor($83fe1a57d631223b$var$mod(h, 360), $4tN2K$reactstatelyutils.clamp(s, 0, 100), $4tN2K$reactstatelyutils.clamp(b, 0, 100), $4tN2K$reactstatelyutils.clamp(a !== null && a !== void 0 ? a : 1, 0, 1));
|
|
434
456
|
}
|
|
435
457
|
}
|
|
436
458
|
toString(format) {
|
|
@@ -442,9 +464,9 @@ class $412b05879b4e9a06$var$HSBColor extends $412b05879b4e9a06$var$Color {
|
|
|
442
464
|
case 'hexa':
|
|
443
465
|
return this.toRGB().toString('hexa');
|
|
444
466
|
case 'hsb':
|
|
445
|
-
return `hsb(${this.hue}, ${$
|
|
467
|
+
return `hsb(${this.hue}, ${$4tN2K$reactstatelyutils.toFixedNumber(this.saturation, 2)}%, ${$4tN2K$reactstatelyutils.toFixedNumber(this.brightness, 2)}%)`;
|
|
446
468
|
case 'hsba':
|
|
447
|
-
return `hsba(${this.hue}, ${$
|
|
469
|
+
return `hsba(${this.hue}, ${$4tN2K$reactstatelyutils.toFixedNumber(this.saturation, 2)}%, ${$4tN2K$reactstatelyutils.toFixedNumber(this.brightness, 2)}%, ${this.alpha})`;
|
|
448
470
|
default:
|
|
449
471
|
return this.toFormat(format).toString(format);
|
|
450
472
|
}
|
|
@@ -473,7 +495,7 @@ class $412b05879b4e9a06$var$HSBColor extends $412b05879b4e9a06$var$Color {
|
|
|
473
495
|
let brightness = this.brightness / 100;
|
|
474
496
|
let lightness = brightness * (1 - saturation / 2);
|
|
475
497
|
saturation = lightness === 0 || lightness === 1 ? 0 : (brightness - lightness) / Math.min(lightness, 1 - lightness);
|
|
476
|
-
return new $
|
|
498
|
+
return new $83fe1a57d631223b$var$HSLColor($4tN2K$reactstatelyutils.toFixedNumber(this.hue, 2), $4tN2K$reactstatelyutils.toFixedNumber(saturation * 100, 2), $4tN2K$reactstatelyutils.toFixedNumber(lightness * 100, 2), this.alpha);
|
|
477
499
|
}
|
|
478
500
|
/**
|
|
479
501
|
* Converts a HSV color value to RGB.
|
|
@@ -485,10 +507,10 @@ class $412b05879b4e9a06$var$HSBColor extends $412b05879b4e9a06$var$Color {
|
|
|
485
507
|
let brightness = this.brightness / 100;
|
|
486
508
|
let fn = (n, k = (n + hue / 60) % 6)=>brightness - saturation * brightness * Math.max(Math.min(k, 4 - k, 1), 0)
|
|
487
509
|
;
|
|
488
|
-
return new $
|
|
510
|
+
return new $83fe1a57d631223b$var$RGBColor(Math.round(fn(5) * 255), Math.round(fn(3) * 255), Math.round(fn(1) * 255), this.alpha);
|
|
489
511
|
}
|
|
490
512
|
clone() {
|
|
491
|
-
return new $
|
|
513
|
+
return new $83fe1a57d631223b$var$HSBColor(this.hue, this.saturation, this.brightness, this.alpha);
|
|
492
514
|
}
|
|
493
515
|
getChannelRange(channel) {
|
|
494
516
|
switch(channel){
|
|
@@ -496,20 +518,23 @@ class $412b05879b4e9a06$var$HSBColor extends $412b05879b4e9a06$var$Color {
|
|
|
496
518
|
return {
|
|
497
519
|
minValue: 0,
|
|
498
520
|
maxValue: 360,
|
|
499
|
-
step: 1
|
|
521
|
+
step: 1,
|
|
522
|
+
pageSize: 15
|
|
500
523
|
};
|
|
501
524
|
case 'saturation':
|
|
502
525
|
case 'brightness':
|
|
503
526
|
return {
|
|
504
527
|
minValue: 0,
|
|
505
528
|
maxValue: 100,
|
|
506
|
-
step: 1
|
|
529
|
+
step: 1,
|
|
530
|
+
pageSize: 10
|
|
507
531
|
};
|
|
508
532
|
case 'alpha':
|
|
509
533
|
return {
|
|
510
534
|
minValue: 0,
|
|
511
535
|
maxValue: 1,
|
|
512
|
-
step: 0.01
|
|
536
|
+
step: 0.01,
|
|
537
|
+
pageSize: 0.1
|
|
513
538
|
};
|
|
514
539
|
default:
|
|
515
540
|
throw new Error('Unknown color channel: ' + channel);
|
|
@@ -541,34 +566,43 @@ class $412b05879b4e9a06$var$HSBColor extends $412b05879b4e9a06$var$Color {
|
|
|
541
566
|
default:
|
|
542
567
|
throw new Error('Unknown color channel: ' + channel);
|
|
543
568
|
}
|
|
544
|
-
return new $
|
|
569
|
+
return new $4tN2K$internationalizednumber.NumberFormatter(locale, options).format(value);
|
|
545
570
|
}
|
|
546
571
|
getColorSpace() {
|
|
547
572
|
return 'hsb';
|
|
548
573
|
}
|
|
574
|
+
getColorChannels() {
|
|
575
|
+
return $83fe1a57d631223b$var$HSBColor.colorChannels;
|
|
576
|
+
}
|
|
577
|
+
constructor(hue, saturation, brightness, alpha){
|
|
578
|
+
super();
|
|
579
|
+
this.hue = hue;
|
|
580
|
+
this.saturation = saturation;
|
|
581
|
+
this.brightness = brightness;
|
|
582
|
+
this.alpha = alpha;
|
|
583
|
+
}
|
|
549
584
|
}
|
|
585
|
+
$83fe1a57d631223b$var$HSBColor.colorChannels = [
|
|
586
|
+
'hue',
|
|
587
|
+
'saturation',
|
|
588
|
+
'brightness'
|
|
589
|
+
];
|
|
550
590
|
// X = <negative/positive number with/without decimal places>
|
|
551
591
|
// before/after a comma, 0 or more whitespaces are allowed
|
|
552
592
|
// - hsl(X, X%, X%)
|
|
553
593
|
// - hsla(X, X%, X%, X)
|
|
554
|
-
const $
|
|
555
|
-
function $
|
|
594
|
+
const $83fe1a57d631223b$var$HSL_REGEX = /hsl\(([-+]?\d+(?:.\d+)?\s*,\s*[-+]?\d+(?:.\d+)?%\s*,\s*[-+]?\d+(?:.\d+)?%)\)|hsla\(([-+]?\d+(?:.\d+)?\s*,\s*[-+]?\d+(?:.\d+)?%\s*,\s*[-+]?\d+(?:.\d+)?%\s*,\s*[-+]?\d(.\d+)?)\)/;
|
|
595
|
+
function $83fe1a57d631223b$var$mod(n, m) {
|
|
556
596
|
return (n % m + m) % m;
|
|
557
597
|
}
|
|
558
|
-
class $
|
|
559
|
-
constructor(hue, saturation, lightness, alpha){
|
|
560
|
-
super();
|
|
561
|
-
this.hue = hue;
|
|
562
|
-
this.saturation = saturation;
|
|
563
|
-
this.lightness = lightness;
|
|
564
|
-
this.alpha = alpha;
|
|
565
|
-
}
|
|
598
|
+
class $83fe1a57d631223b$var$HSLColor extends $83fe1a57d631223b$var$Color {
|
|
566
599
|
static parse(value) {
|
|
567
600
|
let m;
|
|
568
|
-
if (m = value.match($
|
|
569
|
-
|
|
601
|
+
if (m = value.match($83fe1a57d631223b$var$HSL_REGEX)) {
|
|
602
|
+
var ref;
|
|
603
|
+
const [h, s, l, a] = ((ref = m[1]) !== null && ref !== void 0 ? ref : m[2]).split(',').map((n)=>Number(n.trim().replace('%', ''))
|
|
570
604
|
);
|
|
571
|
-
return new $
|
|
605
|
+
return new $83fe1a57d631223b$var$HSLColor($83fe1a57d631223b$var$mod(h, 360), $4tN2K$reactstatelyutils.clamp(s, 0, 100), $4tN2K$reactstatelyutils.clamp(l, 0, 100), $4tN2K$reactstatelyutils.clamp(a !== null && a !== void 0 ? a : 1, 0, 1));
|
|
572
606
|
}
|
|
573
607
|
}
|
|
574
608
|
toString(format) {
|
|
@@ -578,10 +612,10 @@ class $412b05879b4e9a06$var$HSLColor extends $412b05879b4e9a06$var$Color {
|
|
|
578
612
|
case 'hexa':
|
|
579
613
|
return this.toRGB().toString('hexa');
|
|
580
614
|
case 'hsl':
|
|
581
|
-
return `hsl(${this.hue}, ${$
|
|
615
|
+
return `hsl(${this.hue}, ${$4tN2K$reactstatelyutils.toFixedNumber(this.saturation, 2)}%, ${$4tN2K$reactstatelyutils.toFixedNumber(this.lightness, 2)}%)`;
|
|
582
616
|
case 'css':
|
|
583
617
|
case 'hsla':
|
|
584
|
-
return `hsla(${this.hue}, ${$
|
|
618
|
+
return `hsla(${this.hue}, ${$4tN2K$reactstatelyutils.toFixedNumber(this.saturation, 2)}%, ${$4tN2K$reactstatelyutils.toFixedNumber(this.lightness, 2)}%, ${this.alpha})`;
|
|
585
619
|
default:
|
|
586
620
|
return this.toFormat(format).toString(format);
|
|
587
621
|
}
|
|
@@ -610,7 +644,7 @@ class $412b05879b4e9a06$var$HSLColor extends $412b05879b4e9a06$var$Color {
|
|
|
610
644
|
let lightness = this.lightness / 100;
|
|
611
645
|
let brightness = lightness + saturation * Math.min(lightness, 1 - lightness);
|
|
612
646
|
saturation = brightness === 0 ? 0 : 2 * (1 - lightness / brightness);
|
|
613
|
-
return new $
|
|
647
|
+
return new $83fe1a57d631223b$var$HSBColor($4tN2K$reactstatelyutils.toFixedNumber(this.hue, 2), $4tN2K$reactstatelyutils.toFixedNumber(saturation * 100, 2), $4tN2K$reactstatelyutils.toFixedNumber(brightness * 100, 2), this.alpha);
|
|
614
648
|
}
|
|
615
649
|
/**
|
|
616
650
|
* Converts a HSL color to RGB.
|
|
@@ -623,10 +657,10 @@ class $412b05879b4e9a06$var$HSLColor extends $412b05879b4e9a06$var$Color {
|
|
|
623
657
|
let a = saturation * Math.min(lightness, 1 - lightness);
|
|
624
658
|
let fn = (n, k = (n + hue / 30) % 12)=>lightness - a * Math.max(Math.min(k - 3, 9 - k, 1), -1)
|
|
625
659
|
;
|
|
626
|
-
return new $
|
|
660
|
+
return new $83fe1a57d631223b$var$RGBColor(Math.round(fn(0) * 255), Math.round(fn(8) * 255), Math.round(fn(4) * 255), this.alpha);
|
|
627
661
|
}
|
|
628
662
|
clone() {
|
|
629
|
-
return new $
|
|
663
|
+
return new $83fe1a57d631223b$var$HSLColor(this.hue, this.saturation, this.lightness, this.alpha);
|
|
630
664
|
}
|
|
631
665
|
getChannelRange(channel) {
|
|
632
666
|
switch(channel){
|
|
@@ -634,20 +668,23 @@ class $412b05879b4e9a06$var$HSLColor extends $412b05879b4e9a06$var$Color {
|
|
|
634
668
|
return {
|
|
635
669
|
minValue: 0,
|
|
636
670
|
maxValue: 360,
|
|
637
|
-
step: 1
|
|
671
|
+
step: 1,
|
|
672
|
+
pageSize: 15
|
|
638
673
|
};
|
|
639
674
|
case 'saturation':
|
|
640
675
|
case 'lightness':
|
|
641
676
|
return {
|
|
642
677
|
minValue: 0,
|
|
643
678
|
maxValue: 100,
|
|
644
|
-
step: 1
|
|
679
|
+
step: 1,
|
|
680
|
+
pageSize: 10
|
|
645
681
|
};
|
|
646
682
|
case 'alpha':
|
|
647
683
|
return {
|
|
648
684
|
minValue: 0,
|
|
649
685
|
maxValue: 1,
|
|
650
|
-
step: 0.01
|
|
686
|
+
step: 0.01,
|
|
687
|
+
pageSize: 0.1
|
|
651
688
|
};
|
|
652
689
|
default:
|
|
653
690
|
throw new Error('Unknown color channel: ' + channel);
|
|
@@ -679,29 +716,145 @@ class $412b05879b4e9a06$var$HSLColor extends $412b05879b4e9a06$var$Color {
|
|
|
679
716
|
default:
|
|
680
717
|
throw new Error('Unknown color channel: ' + channel);
|
|
681
718
|
}
|
|
682
|
-
return new $
|
|
719
|
+
return new $4tN2K$internationalizednumber.NumberFormatter(locale, options).format(value);
|
|
683
720
|
}
|
|
684
721
|
getColorSpace() {
|
|
685
722
|
return 'hsl';
|
|
686
723
|
}
|
|
724
|
+
getColorChannels() {
|
|
725
|
+
return $83fe1a57d631223b$var$HSLColor.colorChannels;
|
|
726
|
+
}
|
|
727
|
+
constructor(hue, saturation, lightness, alpha){
|
|
728
|
+
super();
|
|
729
|
+
this.hue = hue;
|
|
730
|
+
this.saturation = saturation;
|
|
731
|
+
this.lightness = lightness;
|
|
732
|
+
this.alpha = alpha;
|
|
733
|
+
}
|
|
687
734
|
}
|
|
735
|
+
$83fe1a57d631223b$var$HSLColor.colorChannels = [
|
|
736
|
+
'hue',
|
|
737
|
+
'saturation',
|
|
738
|
+
'lightness'
|
|
739
|
+
];
|
|
688
740
|
|
|
689
741
|
|
|
690
|
-
var $
|
|
742
|
+
var $af2d7ac9990cfee2$exports = {};
|
|
691
743
|
|
|
692
|
-
$parcel$export($
|
|
744
|
+
$parcel$export($af2d7ac9990cfee2$exports, "useColorAreaState", () => $af2d7ac9990cfee2$export$6df7f0e2cabc7eef);
|
|
693
745
|
|
|
694
746
|
|
|
695
747
|
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
748
|
+
const $af2d7ac9990cfee2$var$DEFAULT_COLOR = $83fe1a57d631223b$export$6e865ea70d7724f('#ffffff');
|
|
749
|
+
function $af2d7ac9990cfee2$export$6df7f0e2cabc7eef(props) {
|
|
750
|
+
let { value: value1 , defaultValue: defaultValue , xChannel: xChannel , yChannel: yChannel , onChange: onChange , onChangeEnd: onChangeEnd } = props;
|
|
751
|
+
if (!value1 && !defaultValue) defaultValue = $af2d7ac9990cfee2$var$DEFAULT_COLOR;
|
|
752
|
+
let [color, setColor] = $4tN2K$reactstatelyutils.useControlledState(value1 && $83fe1a57d631223b$export$4cde5df63f53f473(value1), defaultValue && $83fe1a57d631223b$export$4cde5df63f53f473(defaultValue), onChange);
|
|
753
|
+
let valueRef = $4tN2K$react.useRef(color);
|
|
754
|
+
valueRef.current = color;
|
|
755
|
+
let channels = $4tN2K$react.useMemo(()=>valueRef.current.getColorSpaceAxes({
|
|
756
|
+
xChannel: xChannel,
|
|
757
|
+
yChannel: yChannel
|
|
758
|
+
})
|
|
759
|
+
, [
|
|
760
|
+
xChannel,
|
|
761
|
+
yChannel
|
|
762
|
+
]);
|
|
763
|
+
let xChannelRange = color.getChannelRange(channels.xChannel);
|
|
764
|
+
let yChannelRange = color.getChannelRange(channels.yChannel);
|
|
765
|
+
let { minValue: minValueX , maxValue: maxValueX , step: stepX , pageSize: pageSizeX } = xChannelRange;
|
|
766
|
+
let { minValue: minValueY , maxValue: maxValueY , step: stepY , pageSize: pageSizeY } = yChannelRange;
|
|
767
|
+
let [isDragging1, setDragging] = $4tN2K$react.useState(false);
|
|
768
|
+
let isDraggingRef = $4tN2K$react.useRef(false).current;
|
|
769
|
+
let xValue = color.getChannelValue(channels.xChannel);
|
|
770
|
+
let yValue = color.getChannelValue(channels.yChannel);
|
|
771
|
+
let setXValue = (v)=>{
|
|
772
|
+
if (v === xValue) return;
|
|
773
|
+
valueRef.current = color.withChannelValue(channels.xChannel, v);
|
|
774
|
+
setColor(valueRef.current);
|
|
775
|
+
};
|
|
776
|
+
let setYValue = (v)=>{
|
|
777
|
+
if (v === yValue) return;
|
|
778
|
+
valueRef.current = color.withChannelValue(channels.yChannel, v);
|
|
779
|
+
setColor(valueRef.current);
|
|
780
|
+
};
|
|
781
|
+
return {
|
|
782
|
+
channels: channels,
|
|
783
|
+
xChannelStep: stepX,
|
|
784
|
+
yChannelStep: stepY,
|
|
785
|
+
xChannelPageStep: pageSizeX,
|
|
786
|
+
yChannelPageStep: pageSizeY,
|
|
787
|
+
value: color,
|
|
788
|
+
setValue (value) {
|
|
789
|
+
let c = $83fe1a57d631223b$export$4cde5df63f53f473(value);
|
|
790
|
+
valueRef.current = c;
|
|
791
|
+
setColor(c);
|
|
792
|
+
},
|
|
793
|
+
xValue: xValue,
|
|
794
|
+
setXValue: setXValue,
|
|
795
|
+
yValue: yValue,
|
|
796
|
+
setYValue: setYValue,
|
|
797
|
+
setColorFromPoint (x, y) {
|
|
798
|
+
let newXValue = minValueX + $4tN2K$reactstatelyutils.clamp(x, 0, 1) * (maxValueX - minValueX);
|
|
799
|
+
let newYValue = minValueY + (1 - $4tN2K$reactstatelyutils.clamp(y, 0, 1)) * (maxValueY - minValueY);
|
|
800
|
+
let newColor;
|
|
801
|
+
if (newXValue !== xValue) {
|
|
802
|
+
// Round new value to multiple of step, clamp value between min and max
|
|
803
|
+
newXValue = $4tN2K$reactstatelyutils.snapValueToStep(newXValue, minValueX, maxValueX, stepX);
|
|
804
|
+
newColor = color.withChannelValue(channels.xChannel, newXValue);
|
|
805
|
+
}
|
|
806
|
+
if (newYValue !== yValue) {
|
|
807
|
+
// Round new value to multiple of step, clamp value between min and max
|
|
808
|
+
newYValue = $4tN2K$reactstatelyutils.snapValueToStep(newYValue, minValueY, maxValueY, stepY);
|
|
809
|
+
newColor = (newColor || color).withChannelValue(channels.yChannel, newYValue);
|
|
810
|
+
}
|
|
811
|
+
if (newColor) setColor(newColor);
|
|
812
|
+
},
|
|
813
|
+
getThumbPosition () {
|
|
814
|
+
let x = (xValue - minValueX) / (maxValueX - minValueX);
|
|
815
|
+
let y = 1 - (yValue - minValueY) / (maxValueY - minValueY);
|
|
816
|
+
return {
|
|
817
|
+
x: x,
|
|
818
|
+
y: y
|
|
819
|
+
};
|
|
820
|
+
},
|
|
821
|
+
incrementX (stepSize) {
|
|
822
|
+
setXValue(xValue + stepSize > maxValueX ? maxValueX : $4tN2K$reactstatelyutils.snapValueToStep(xValue + stepSize, minValueX, maxValueX, stepX));
|
|
823
|
+
},
|
|
824
|
+
incrementY (stepSize) {
|
|
825
|
+
setYValue(yValue + stepSize > maxValueY ? maxValueY : $4tN2K$reactstatelyutils.snapValueToStep(yValue + stepSize, minValueY, maxValueY, stepY));
|
|
826
|
+
},
|
|
827
|
+
decrementX (stepSize) {
|
|
828
|
+
setXValue($4tN2K$reactstatelyutils.snapValueToStep(xValue - stepSize, minValueX, maxValueX, stepX));
|
|
829
|
+
},
|
|
830
|
+
decrementY (stepSize) {
|
|
831
|
+
setYValue($4tN2K$reactstatelyutils.snapValueToStep(yValue - stepSize, minValueY, maxValueY, stepY));
|
|
832
|
+
},
|
|
833
|
+
setDragging (isDragging) {
|
|
834
|
+
let wasDragging = isDraggingRef;
|
|
835
|
+
isDraggingRef = isDragging;
|
|
836
|
+
if (onChangeEnd && !isDragging && wasDragging) onChangeEnd(valueRef.current);
|
|
837
|
+
setDragging(isDragging);
|
|
838
|
+
},
|
|
839
|
+
isDragging: isDragging1,
|
|
840
|
+
getDisplayColor () {
|
|
841
|
+
return color.withChannelValue('alpha', 1);
|
|
842
|
+
}
|
|
843
|
+
};
|
|
699
844
|
}
|
|
700
|
-
|
|
845
|
+
|
|
846
|
+
|
|
847
|
+
var $5386a492cfd3234c$exports = {};
|
|
848
|
+
|
|
849
|
+
$parcel$export($5386a492cfd3234c$exports, "useColorSliderState", () => $5386a492cfd3234c$export$57bc203e1c9c6d44);
|
|
850
|
+
|
|
851
|
+
|
|
852
|
+
|
|
853
|
+
function $5386a492cfd3234c$export$57bc203e1c9c6d44(props) {
|
|
701
854
|
let { channel: channel , value: value1 , defaultValue: defaultValue , onChange: onChange , locale: locale , ...otherProps } = props;
|
|
702
855
|
if (value1 == null && defaultValue == null) throw new Error('useColorSliderState requires a value or defaultValue');
|
|
703
|
-
let [color, setColor] = $
|
|
704
|
-
let sliderState = $
|
|
856
|
+
let [color, setColor] = $4tN2K$reactstatelyutils.useControlledState(value1 && $83fe1a57d631223b$export$4cde5df63f53f473(value1), defaultValue && $83fe1a57d631223b$export$4cde5df63f53f473(defaultValue), onChange);
|
|
857
|
+
let sliderState = $4tN2K$reactstatelyslider.useSliderState({
|
|
705
858
|
...color.getChannelRange(channel),
|
|
706
859
|
...otherProps,
|
|
707
860
|
// Unused except in getThumbValueLabel, which is overridden below. null to appease TypeScript.
|
|
@@ -713,20 +866,21 @@ function $164fc04cbb06c959$export$57bc203e1c9c6d44(props) {
|
|
|
713
866
|
setColor(color.withChannelValue(channel, v));
|
|
714
867
|
},
|
|
715
868
|
onChangeEnd ([v]) {
|
|
716
|
-
// onChange will have already been called with the right value, this is just to trigger
|
|
869
|
+
// onChange will have already been called with the right value, this is just to trigger onChangeEnd
|
|
717
870
|
if (props.onChangeEnd) props.onChangeEnd(color.withChannelValue(channel, v));
|
|
718
871
|
}
|
|
719
872
|
});
|
|
873
|
+
let { step: step , pageSize: pageSize } = color.getChannelRange(channel);
|
|
720
874
|
return {
|
|
721
875
|
...sliderState,
|
|
722
876
|
value: color,
|
|
723
877
|
setValue (value) {
|
|
724
|
-
setColor($
|
|
878
|
+
setColor($83fe1a57d631223b$export$4cde5df63f53f473(value));
|
|
725
879
|
},
|
|
726
880
|
getDisplayColor () {
|
|
727
881
|
switch(channel){
|
|
728
882
|
case 'hue':
|
|
729
|
-
return $
|
|
883
|
+
return $83fe1a57d631223b$export$6e865ea70d7724f(`hsl(${color.getChannelValue('hue')}, 100%, 50%)`);
|
|
730
884
|
case 'lightness':
|
|
731
885
|
case 'brightness':
|
|
732
886
|
case 'saturation':
|
|
@@ -742,42 +896,40 @@ function $164fc04cbb06c959$export$57bc203e1c9c6d44(props) {
|
|
|
742
896
|
},
|
|
743
897
|
getThumbValueLabel () {
|
|
744
898
|
return color.formatChannelValue(channel, locale);
|
|
745
|
-
}
|
|
899
|
+
},
|
|
900
|
+
step: step,
|
|
901
|
+
pageSize: pageSize
|
|
746
902
|
};
|
|
747
903
|
}
|
|
748
904
|
|
|
749
905
|
|
|
750
|
-
var $
|
|
906
|
+
var $9d7d8736d45f74b8$exports = {};
|
|
751
907
|
|
|
752
|
-
$parcel$export($
|
|
908
|
+
$parcel$export($9d7d8736d45f74b8$exports, "useColorWheelState", () => $9d7d8736d45f74b8$export$f4301076d9336137);
|
|
753
909
|
|
|
754
910
|
|
|
755
911
|
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
else return v;
|
|
759
|
-
}
|
|
760
|
-
const $605819ebb1cf98c3$var$DEFAULT_COLOR = $412b05879b4e9a06$export$6e865ea70d7724f('hsl(0, 100%, 50%)');
|
|
761
|
-
function $605819ebb1cf98c3$var$roundToStep(value, step) {
|
|
912
|
+
const $9d7d8736d45f74b8$var$DEFAULT_COLOR = $83fe1a57d631223b$export$6e865ea70d7724f('hsl(0, 100%, 50%)');
|
|
913
|
+
function $9d7d8736d45f74b8$var$roundToStep(value, step) {
|
|
762
914
|
return Math.round(value / step) * step;
|
|
763
915
|
}
|
|
764
|
-
function $
|
|
916
|
+
function $9d7d8736d45f74b8$var$mod(n, m) {
|
|
765
917
|
return (n % m + m) % m;
|
|
766
918
|
}
|
|
767
|
-
function $
|
|
919
|
+
function $9d7d8736d45f74b8$var$roundDown(v) {
|
|
768
920
|
let r = Math.floor(v);
|
|
769
921
|
if (r === v) return v - 1;
|
|
770
922
|
else return r;
|
|
771
923
|
}
|
|
772
|
-
function $
|
|
924
|
+
function $9d7d8736d45f74b8$var$degToRad(deg) {
|
|
773
925
|
return deg * Math.PI / 180;
|
|
774
926
|
}
|
|
775
|
-
function $
|
|
927
|
+
function $9d7d8736d45f74b8$var$radToDeg(rad) {
|
|
776
928
|
return rad * 180 / Math.PI;
|
|
777
929
|
}
|
|
778
930
|
// 0deg = 3 o'clock. increases clockwise
|
|
779
|
-
function $
|
|
780
|
-
let rad = $
|
|
931
|
+
function $9d7d8736d45f74b8$var$angleToCartesian(angle, radius) {
|
|
932
|
+
let rad = $9d7d8736d45f74b8$var$degToRad(360 - angle + 90);
|
|
781
933
|
let x = Math.sin(rad) * radius;
|
|
782
934
|
let y = Math.cos(rad) * radius;
|
|
783
935
|
return {
|
|
@@ -785,23 +937,25 @@ function $605819ebb1cf98c3$var$angleToCartesian(angle, radius) {
|
|
|
785
937
|
y: y
|
|
786
938
|
};
|
|
787
939
|
}
|
|
788
|
-
function $
|
|
789
|
-
let deg = $
|
|
940
|
+
function $9d7d8736d45f74b8$var$cartesianToAngle(x, y, radius) {
|
|
941
|
+
let deg = $9d7d8736d45f74b8$var$radToDeg(Math.atan2(y / radius, x / radius));
|
|
790
942
|
return (deg + 360) % 360;
|
|
791
943
|
}
|
|
792
|
-
function $
|
|
793
|
-
let { defaultValue: defaultValue , onChange: onChange , onChangeEnd: onChangeEnd
|
|
794
|
-
if (!props.value && !defaultValue) defaultValue = $
|
|
795
|
-
let [value, setValue] = $
|
|
796
|
-
let valueRef = $
|
|
944
|
+
function $9d7d8736d45f74b8$export$f4301076d9336137(props) {
|
|
945
|
+
let { defaultValue: defaultValue , onChange: onChange , onChangeEnd: onChangeEnd } = props;
|
|
946
|
+
if (!props.value && !defaultValue) defaultValue = $9d7d8736d45f74b8$var$DEFAULT_COLOR;
|
|
947
|
+
let [value, setValue] = $4tN2K$reactstatelyutils.useControlledState($83fe1a57d631223b$export$4cde5df63f53f473(props.value), $83fe1a57d631223b$export$4cde5df63f53f473(defaultValue), onChange);
|
|
948
|
+
let valueRef = $4tN2K$react.useRef(value);
|
|
797
949
|
valueRef.current = value;
|
|
798
|
-
let
|
|
799
|
-
let
|
|
950
|
+
let channelRange = value.getChannelRange('hue');
|
|
951
|
+
let { minValue: minValueX , maxValue: maxValueX , step: step , pageSize: pageStep } = channelRange;
|
|
952
|
+
let [isDragging1, setDragging] = $4tN2K$react.useState(false);
|
|
953
|
+
let isDraggingRef = $4tN2K$react.useRef(false).current;
|
|
800
954
|
let hue = value.getChannelValue('hue');
|
|
801
955
|
function setHue(v) {
|
|
802
956
|
if (v > 360) // Make sure you can always get back to 0.
|
|
803
957
|
v = 0;
|
|
804
|
-
v = $
|
|
958
|
+
v = $9d7d8736d45f74b8$var$roundToStep($9d7d8736d45f74b8$var$mod(v, 360), step);
|
|
805
959
|
if (hue !== v) {
|
|
806
960
|
let color = value.withChannelValue('hue', v);
|
|
807
961
|
valueRef.current = color;
|
|
@@ -810,31 +964,34 @@ function $605819ebb1cf98c3$export$f4301076d9336137(props) {
|
|
|
810
964
|
}
|
|
811
965
|
return {
|
|
812
966
|
value: value,
|
|
967
|
+
step: step,
|
|
968
|
+
pageStep: pageStep,
|
|
813
969
|
setValue (v) {
|
|
814
|
-
let color = $
|
|
970
|
+
let color = $83fe1a57d631223b$export$4cde5df63f53f473(v);
|
|
815
971
|
valueRef.current = color;
|
|
816
972
|
setValue(color);
|
|
817
973
|
},
|
|
818
974
|
hue: hue,
|
|
819
975
|
setHue: setHue,
|
|
820
976
|
setHueFromPoint (x, y, radius) {
|
|
821
|
-
setHue($
|
|
977
|
+
setHue($9d7d8736d45f74b8$var$cartesianToAngle(x, y, radius));
|
|
822
978
|
},
|
|
823
979
|
getThumbPosition (radius) {
|
|
824
|
-
return $
|
|
980
|
+
return $9d7d8736d45f74b8$var$angleToCartesian(value.getChannelValue('hue'), radius);
|
|
825
981
|
},
|
|
826
|
-
increment (
|
|
827
|
-
let
|
|
828
|
-
|
|
829
|
-
newValue
|
|
830
|
-
|
|
982
|
+
increment (stepSize = 1) {
|
|
983
|
+
let s = Math.max(stepSize, step);
|
|
984
|
+
let newValue = hue + s;
|
|
985
|
+
if (newValue >= maxValueX) // Make sure you can always get back to 0.
|
|
986
|
+
newValue = minValueX;
|
|
987
|
+
setHue($9d7d8736d45f74b8$var$roundToStep($9d7d8736d45f74b8$var$mod(newValue, 360), s));
|
|
831
988
|
},
|
|
832
|
-
decrement (
|
|
833
|
-
let s = Math.max(
|
|
989
|
+
decrement (stepSize = 1) {
|
|
990
|
+
let s = Math.max(stepSize, step);
|
|
834
991
|
if (hue === 0) // We can't just subtract step because this might be the case:
|
|
835
992
|
// |(previous step) - 0| < step size
|
|
836
|
-
setHue($
|
|
837
|
-
else setHue(hue - s);
|
|
993
|
+
setHue($9d7d8736d45f74b8$var$roundDown(360 / s) * s);
|
|
994
|
+
else setHue($9d7d8736d45f74b8$var$roundToStep($9d7d8736d45f74b8$var$mod(hue - s, 360), s));
|
|
838
995
|
},
|
|
839
996
|
setDragging (isDragging) {
|
|
840
997
|
let wasDragging = isDraggingRef;
|
|
@@ -844,22 +1001,22 @@ function $605819ebb1cf98c3$export$f4301076d9336137(props) {
|
|
|
844
1001
|
},
|
|
845
1002
|
isDragging: isDragging1,
|
|
846
1003
|
getDisplayColor () {
|
|
847
|
-
return value.withChannelValue('saturation', 100).withChannelValue('lightness', 50);
|
|
1004
|
+
return value.toFormat('hsl').withChannelValue('saturation', 100).withChannelValue('lightness', 50);
|
|
848
1005
|
}
|
|
849
1006
|
};
|
|
850
1007
|
}
|
|
851
1008
|
|
|
852
1009
|
|
|
853
|
-
var $
|
|
1010
|
+
var $d59d0c2b2ce1568f$exports = {};
|
|
854
1011
|
|
|
855
|
-
$parcel$export($
|
|
1012
|
+
$parcel$export($d59d0c2b2ce1568f$exports, "useColorFieldState", () => $d59d0c2b2ce1568f$export$d52a01683abdfcd6);
|
|
856
1013
|
|
|
857
1014
|
|
|
858
1015
|
|
|
859
|
-
function $
|
|
860
|
-
return $
|
|
1016
|
+
function $f8b3be23ba4462b1$export$5aadd9c0606af5c2(value) {
|
|
1017
|
+
return $4tN2K$react.useMemo(()=>{
|
|
861
1018
|
if (typeof value === 'string') try {
|
|
862
|
-
return $
|
|
1019
|
+
return $83fe1a57d631223b$export$6e865ea70d7724f(value);
|
|
863
1020
|
} catch (err) {
|
|
864
1021
|
return undefined;
|
|
865
1022
|
}
|
|
@@ -872,16 +1029,17 @@ function $3721a75ad9e74048$export$5aadd9c0606af5c2(value) {
|
|
|
872
1029
|
|
|
873
1030
|
|
|
874
1031
|
|
|
875
|
-
const $
|
|
876
|
-
const $
|
|
877
|
-
const $
|
|
878
|
-
const $
|
|
879
|
-
function $
|
|
880
|
-
let {
|
|
881
|
-
let
|
|
882
|
-
let
|
|
883
|
-
let
|
|
884
|
-
let [
|
|
1032
|
+
const $d59d0c2b2ce1568f$var$MIN_COLOR = $83fe1a57d631223b$export$6e865ea70d7724f('#000000');
|
|
1033
|
+
const $d59d0c2b2ce1568f$var$MAX_COLOR = $83fe1a57d631223b$export$6e865ea70d7724f('#FFFFFF');
|
|
1034
|
+
const $d59d0c2b2ce1568f$var$MIN_COLOR_INT = $d59d0c2b2ce1568f$var$MIN_COLOR.toHexInt();
|
|
1035
|
+
const $d59d0c2b2ce1568f$var$MAX_COLOR_INT = $d59d0c2b2ce1568f$var$MAX_COLOR.toHexInt();
|
|
1036
|
+
function $d59d0c2b2ce1568f$export$d52a01683abdfcd6(props) {
|
|
1037
|
+
let { value: value1 , defaultValue: defaultValue , onChange: onChange } = props;
|
|
1038
|
+
let { step: step } = $d59d0c2b2ce1568f$var$MIN_COLOR.getChannelRange('red');
|
|
1039
|
+
let initialValue = $f8b3be23ba4462b1$export$5aadd9c0606af5c2(value1);
|
|
1040
|
+
let initialDefaultValue = $f8b3be23ba4462b1$export$5aadd9c0606af5c2(defaultValue);
|
|
1041
|
+
let [colorValue, setColorValue] = $4tN2K$reactstatelyutils.useControlledState(initialValue, initialDefaultValue, onChange);
|
|
1042
|
+
let [inputValue, setInputValue] = $4tN2K$react.useState(()=>(value1 || defaultValue) && colorValue ? colorValue.toString('hex') : ''
|
|
885
1043
|
);
|
|
886
1044
|
let safelySetColorValue = (newColor)=>{
|
|
887
1045
|
if (!colorValue || !newColor) {
|
|
@@ -893,25 +1051,24 @@ function $53c8c8a3c8a0c7ca$export$d52a01683abdfcd6(props) {
|
|
|
893
1051
|
return;
|
|
894
1052
|
}
|
|
895
1053
|
};
|
|
896
|
-
$
|
|
1054
|
+
let prevValue = $4tN2K$react.useRef(colorValue);
|
|
1055
|
+
if (prevValue.current !== colorValue) {
|
|
897
1056
|
setInputValue(colorValue ? colorValue.toString('hex') : '');
|
|
898
|
-
|
|
899
|
-
|
|
900
|
-
|
|
901
|
-
]);
|
|
902
|
-
let parsedValue = $5lTOm$react.useMemo(()=>{
|
|
1057
|
+
prevValue.current = colorValue;
|
|
1058
|
+
}
|
|
1059
|
+
let parsedValue = $4tN2K$react.useMemo(()=>{
|
|
903
1060
|
let color;
|
|
904
1061
|
try {
|
|
905
|
-
color = $
|
|
1062
|
+
color = $83fe1a57d631223b$export$6e865ea70d7724f(inputValue.startsWith('#') ? inputValue : `#${inputValue}`);
|
|
906
1063
|
} catch (err) {
|
|
907
1064
|
color = null;
|
|
908
1065
|
}
|
|
909
1066
|
return color;
|
|
910
1067
|
}, [
|
|
911
|
-
$
|
|
1068
|
+
$83fe1a57d631223b$export$6e865ea70d7724f,
|
|
912
1069
|
inputValue
|
|
913
1070
|
]);
|
|
914
|
-
let parsed = $
|
|
1071
|
+
let parsed = $4tN2K$react.useRef(null);
|
|
915
1072
|
parsed.current = parsedValue;
|
|
916
1073
|
let commit = ()=>{
|
|
917
1074
|
// Set to empty state if input value is empty
|
|
@@ -932,7 +1089,7 @@ function $53c8c8a3c8a0c7ca$export$d52a01683abdfcd6(props) {
|
|
|
932
1089
|
setInputValue(newColorValue);
|
|
933
1090
|
};
|
|
934
1091
|
let increment = ()=>{
|
|
935
|
-
let newValue = $
|
|
1092
|
+
let newValue = $d59d0c2b2ce1568f$var$addColorValue(parsed.current, step);
|
|
936
1093
|
// if we've arrived at the same value that was previously in the state, the
|
|
937
1094
|
// input value should be updated to match
|
|
938
1095
|
// ex type 4, press increment, highlight the number in the input, type 4 again, press increment
|
|
@@ -941,7 +1098,7 @@ function $53c8c8a3c8a0c7ca$export$d52a01683abdfcd6(props) {
|
|
|
941
1098
|
safelySetColorValue(newValue);
|
|
942
1099
|
};
|
|
943
1100
|
let decrement = ()=>{
|
|
944
|
-
let newValue = $
|
|
1101
|
+
let newValue = $d59d0c2b2ce1568f$var$addColorValue(parsed.current, -step);
|
|
945
1102
|
// if we've arrived at the same value that was previously in the state, the
|
|
946
1103
|
// input value should be updated to match
|
|
947
1104
|
// ex type 4, press increment, highlight the number in the input, type 4 again, press increment
|
|
@@ -949,12 +1106,14 @@ function $53c8c8a3c8a0c7ca$export$d52a01683abdfcd6(props) {
|
|
|
949
1106
|
if (newValue === colorValue) setInputValue(newValue.toString('hex'));
|
|
950
1107
|
safelySetColorValue(newValue);
|
|
951
1108
|
};
|
|
952
|
-
let incrementToMax = ()=>safelySetColorValue($
|
|
1109
|
+
let incrementToMax = ()=>safelySetColorValue($d59d0c2b2ce1568f$var$MAX_COLOR)
|
|
953
1110
|
;
|
|
954
|
-
let decrementToMin = ()=>safelySetColorValue($
|
|
955
|
-
;
|
|
956
|
-
let validate = (value)=>value === '' || !!value.match(/^#?[0-9a-f]{0,6}$/i)?.[0]
|
|
1111
|
+
let decrementToMin = ()=>safelySetColorValue($d59d0c2b2ce1568f$var$MIN_COLOR)
|
|
957
1112
|
;
|
|
1113
|
+
let validate = (value)=>{
|
|
1114
|
+
var ref;
|
|
1115
|
+
return value === '' || !!((ref = value.match(/^#?[0-9a-f]{0,6}$/i)) === null || ref === void 0 ? void 0 : ref[0]);
|
|
1116
|
+
};
|
|
958
1117
|
return {
|
|
959
1118
|
validate: validate,
|
|
960
1119
|
colorValue: colorValue,
|
|
@@ -967,22 +1126,22 @@ function $53c8c8a3c8a0c7ca$export$d52a01683abdfcd6(props) {
|
|
|
967
1126
|
decrementToMin: decrementToMin
|
|
968
1127
|
};
|
|
969
1128
|
}
|
|
970
|
-
function $
|
|
971
|
-
let newColor = color ? color : $
|
|
1129
|
+
function $d59d0c2b2ce1568f$var$addColorValue(color, step) {
|
|
1130
|
+
let newColor = color ? color : $d59d0c2b2ce1568f$var$MIN_COLOR;
|
|
972
1131
|
let colorInt = newColor.toHexInt();
|
|
973
|
-
let clampInt = Math.min(Math.max(colorInt + step, $
|
|
1132
|
+
let clampInt = Math.min(Math.max(colorInt + step, $d59d0c2b2ce1568f$var$MIN_COLOR_INT), $d59d0c2b2ce1568f$var$MAX_COLOR_INT);
|
|
974
1133
|
if (clampInt !== colorInt) {
|
|
975
1134
|
let newColorString = `#${clampInt.toString(16).padStart(6, '0').toUpperCase()}`;
|
|
976
|
-
newColor = $
|
|
1135
|
+
newColor = $83fe1a57d631223b$export$6e865ea70d7724f(newColorString);
|
|
977
1136
|
}
|
|
978
1137
|
return newColor;
|
|
979
1138
|
}
|
|
980
1139
|
|
|
981
1140
|
|
|
982
|
-
$parcel$exportWildcard(module.exports, $
|
|
983
|
-
$parcel$exportWildcard(module.exports, $
|
|
984
|
-
$parcel$exportWildcard(module.exports, $
|
|
985
|
-
$parcel$exportWildcard(module.exports, $
|
|
1141
|
+
$parcel$exportWildcard(module.exports, $af2d7ac9990cfee2$exports);
|
|
1142
|
+
$parcel$exportWildcard(module.exports, $5386a492cfd3234c$exports);
|
|
1143
|
+
$parcel$exportWildcard(module.exports, $9d7d8736d45f74b8$exports);
|
|
1144
|
+
$parcel$exportWildcard(module.exports, $d59d0c2b2ce1568f$exports);
|
|
986
1145
|
|
|
987
1146
|
|
|
988
1147
|
//# sourceMappingURL=main.js.map
|