uni-select-field 1.0.0

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.
Files changed (9) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +268 -0
  3. package/index.html +382 -0
  4. package/mjs/common-css.js +171 -0
  5. package/mjs/common-lib.js +1158 -0
  6. package/mjs/uni-css.js +586 -0
  7. package/mjs/wc-uni-select-field.js +496 -0
  8. package/mjs/wc-uni-select-field.min.js +258 -0
  9. package/package.json +23 -0
package/mjs/uni-css.js ADDED
@@ -0,0 +1,586 @@
1
+ export const colorPalette = `
2
+ :host {
3
+ --gt_purple_100: #f0ecff;
4
+ --gt_purple_200: #dcd1ff;
5
+ --gt_purple_300: #c4b1ff;
6
+ --gt_purple_400: #a98dff;
7
+ --gt_purple_500: #9b7bff;
8
+ --gt_purple_600: #8660ff;
9
+ --gt_purple_700: #714eff;
10
+ --gt_purple_800: #5a27f2;
11
+ --gt_purple_900: #430dcc;
12
+ --gt_purple_1000: #3400ac;
13
+ --gt_orange_100: #fff0e5;
14
+ --gt_orange_200: #ffe0cb;
15
+ --gt_orange_300: #ffd2b4;
16
+ --gt_orange_400: #ffba8c;
17
+ --gt_orange_500: #ff9d5c;
18
+ --gt_orange_600: #ff8a3d;
19
+ --gt_orange_700: #f97824;
20
+ --gt_orange_800: #ee660c;
21
+ --gt_orange_900: #da5700;
22
+ --gt_orange_1000: #b04600;
23
+ --gt_blue_100: #e6f7ff;
24
+ --gt_blue_200: #bae7ff;
25
+ --gt_blue_300: #91d5ff;
26
+ --gt_blue_400: #69c0ff;
27
+ --gt_blue_500: #40a9ff;
28
+ --gt_blue_600: #1890ff;
29
+ --gt_blue_700: #096dd9;
30
+ --gt_blue_800: #0050b3;
31
+ --gt_blue_900: #003a8c;
32
+ --gt_blue_1000: #002766;
33
+ --gt_green_100: #dfffd6;
34
+ --gt_green_200: #c7f4bb;
35
+ --gt_green_300: #a3ed90;
36
+ --gt_green_400: #97e24f;
37
+ --gt_green_500: #95d500;
38
+ --gt_green_600: #13b97d;
39
+ --gt_green_700: #1ba279;
40
+ --gt_green_800: #089683;
41
+ --gt_green_900: #008b79;
42
+ --gt_green_1000: #006c5e;
43
+ --gt_pink_100: #ffe5f1;
44
+ --gt_pink_200: #ffcfe6;
45
+ --gt_pink_300: #ffbde7;
46
+ --gt_pink_400: #ff90d7;
47
+ --gt_pink_500: #ff5cc5;
48
+ --gt_pink_600: #ff38b7;
49
+ --gt_pink_700: #e70094;
50
+ --gt_pink_800: #ba0077;
51
+ --gt_pink_900: #8b0059;
52
+ --gt_pink_1000: #72054a;
53
+ --gt_gold_100: #fffbe6;
54
+ --gt_gold_200: #fff4c6;
55
+ --gt_gold_300: #ffeda2;
56
+ --gt_gold_400: #ffdf77;
57
+ --gt_gold_500: #ffd35a;
58
+ --gt_gold_600: #ffc53d;
59
+ --gt_gold_700: #faad14;
60
+ --gt_gold_800: #d48806;
61
+ --gt_gold_900: #ad6800;
62
+ --gt_gold_1000: #613400;
63
+ --gt_red_100: #ffe5e7;
64
+ --gt_red_200: #ffccd1;
65
+ --gt_red_300: #ffa9b2;
66
+ --gt_red_400: #ff8e99;
67
+ --gt_red_500: #ff717f;
68
+ --gt_red_600: #ff4c59;
69
+ --gt_red_700: #e60013;
70
+ --gt_red_800: #cf001f;
71
+ --gt_red_900: #a00033;
72
+ --gt_red_1000: #720532;
73
+ --gt_red-orange_100: #ffeae7;
74
+ --gt_red-orange_200: #ffd9d4;
75
+ --gt_red-orange_300: #ffb7ac;
76
+ --gt_red-orange_400: #ff9586;
77
+ --gt_red-orange_500: #ff7f6d;
78
+ --gt_red-orange_600: #ff614a;
79
+ --gt_red-orange_700: #f04128;
80
+ --gt_red-orange_800: #e52a0c;
81
+ --gt_red-orange_900: #b11c05;
82
+ --gt_red-orange_1000: #6a0d00;
83
+ --gt_black_100: #fafafa;
84
+ --gt_black_200: #f5f5f5;
85
+ --gt_black_300: #e0e0e0;
86
+ --gt_black_400: #bdbdbd;
87
+ --gt_black_500: #9e9e9e;
88
+ --gt_black_600: #757575;
89
+ --gt_black_700: #616161;
90
+ --gt_black_800: #424242;
91
+ --gt_black_900: #212121;
92
+ --gt_black_1000: #000000;
93
+ --gt_black_white: #ffffff;
94
+ --gt_black-opacity_100: #000000;
95
+ --gt_black-opacity_87: rgba(0, 0, 0, 0.8700);
96
+ --gt_black-opacity_60: rgba(0, 0, 0, 0.6000);
97
+ --gt_black-opacity_38: rgba(0, 0, 0, 0.3800);
98
+ --gt_black-opacity_15: rgba(0, 0, 0, 0.1500);
99
+ --gt_black-opacity_8: rgba(0, 0, 0, 0.0800);
100
+ --gt_black-opacity_4: rgba(0, 0, 0, 0.0400);
101
+ --gt_white-opacity_100: #ffffff;
102
+ --gt_white-opacity_80: rgba(255, 255, 255, 0.8000);
103
+ --gt_white-opacity_60: rgba(255, 255, 255, 0.6000);
104
+ --gt_white-opacity_40: rgba(255, 255, 255, 0.4000);
105
+ --gt_white-opacity_20: rgba(255, 255, 255, 0.2000);
106
+ --gt_white-opacity_10: rgba(255, 255, 255, 0.1000);
107
+ --gt_white-opacity_5: rgba(255, 255, 255, 0.0500);
108
+ --at_primary_strongest: var(--gt_red-orange_1000);
109
+ --at_primary_strong: var(--gt_red-orange_900);
110
+ --at_primary_general: var(--gt_red-orange_700);
111
+ --at_primary_subtle: var(--gt_red-orange_600);
112
+ --at_primary_subtlest: var(--gt_red-orange_500);
113
+ --at_primary_pale: var(--gt_red-orange_200);
114
+ --at_primary_palest: var(--gt_red-orange_100);
115
+ --at_secondary_strong: var(--gt_purple_1000);
116
+ --at_secondary_general: var(--gt_purple_700);
117
+ --at_secondary_subtle: var(--gt_purple_600);
118
+ --at_secondary_subtlest: var(--gt_purple_400);
119
+ --at_secondary_pale: var(--gt_purple_200);
120
+ --at_secondary_palest: var(--gt_purple_100);
121
+ --at_tertiary_strong: var(--gt_green_900);
122
+ --at_tertiary_general: var(--gt_green_700);
123
+ --at_tertiary_subtle: var(--gt_green_600);
124
+ --at_tertiary_subtlest: var(--gt_green_500);
125
+ --at_tertiary_pale: var(--gt_green_200);
126
+ --at_tertiary_palest: var(--gt_green_100);
127
+ --at_quaternary_strong: var(--gt_orange_900);
128
+ --at_quaternary_general: var(--gt_orange_700);
129
+ --at_quaternary_subtle: var(--gt_orange_600);
130
+ --at_quaternary_subtlest: var(--gt_orange_500);
131
+ --at_quaternary_pale: var(--gt_orange_200);
132
+ --at_quaternary_palest: var(--gt_orange_100);
133
+ --at_danger_strong: var(--gt_red_900);
134
+ --at_danger_general: var(--gt_red_700);
135
+ --at_danger_subtle: var(--gt_red_600);
136
+ --at_danger_subtlest: var(--gt_red_500);
137
+ --at_danger_pale: var(--gt_red_200);
138
+ --at_danger_palest: var(--gt_red_100);
139
+ --at_warning_strong: var(--gt_gold_900);
140
+ --at_warning_general: var(--gt_gold_700);
141
+ --at_warning_subtle: var(--gt_gold_600);
142
+ --at_warning_subtlest: var(--gt_gold_500);
143
+ --at_warning_pale: var(--gt_gold_200);
144
+ --at_warning_palest: var(--gt_gold_100);
145
+ --at_success_strong: var(--gt_green_900);
146
+ --at_success_general: var(--gt_green_700);
147
+ --at_success_subtle: var(--gt_green_600);
148
+ --at_success_subtlest: var(--gt_green_500);
149
+ --at_success_pale: var(--gt_green_200);
150
+ --at_success_palest: var(--gt_green_100);
151
+ --at_engagement_strong: var(--gt_red-orange_900);
152
+ --at_engagement_general: var(--gt_red-orange_700);
153
+ --at_engagement_subtle: var(--gt_red-orange_600);
154
+ --at_engagement_subtlest: var(--gt_red-orange_500);
155
+ --at_engagement_pale: var(--gt_red-orange_200);
156
+ --at_engagement_palest: var(--gt_red-orange_100);
157
+ --at_black-opacity_general: var(--gt_black-opacity_100);
158
+ --at_black-opacity_subtle: var(--gt_black-opacity_60);
159
+ --at_black-opacity_subtlest: var(--gt_black-opacity_38);
160
+ --at_black-opacity_pale: var(--gt_black-opacity_15);
161
+ --at_black-opacity_palest: var(--gt_black-opacity_8);
162
+ --at_black-opacity_thick: var(--gt_black-opacity_4);
163
+ --at_white-opacity_general: var(--gt_white-opacity_100);
164
+ --at_white-opacity_subtle: var(--gt_white-opacity_80);
165
+ --at_white-opacity_subtlest: var(--gt_white-opacity_40);
166
+ --at_white-opacity_pale: var(--gt_white-opacity_20);
167
+ --at_white-opacity_palest: var(--gt_white-opacity_10);
168
+ --at_white-opacity_thick: var(--gt_white-opacity_5);
169
+ --at_neutral_dark: var(--gt_black_1000);
170
+ --at_neutral_deep: var(--gt_black_800);
171
+ --at_neutral_subtle: var(--gt_black_600);
172
+ --at_neutral_subtlest: var(--gt_black_400);
173
+ --at_neutral_pale: var(--gt_black_300);
174
+ --at_neutral_palest: var(--gt_black_200);
175
+ --at_neutral_light: var(--gt_black_white);
176
+ --at_neutral_opacity_general: var(--gt_black-opacity_87);
177
+ --at_neutral_opacity_subtle: var(--gt_black-opacity_60);
178
+ --at_neutral_opacity_subtlest: var(--gt_black-opacity_38);
179
+ --at_neutral_opacity_pale: var(--gt_black-opacity_15);
180
+ --at_neutral_opacity_palest: var(--gt_black-opacity_8);
181
+ --at_neutral_opacity_light: var(--gt_black-opacity_4);
182
+ --ct_text_main_general: var(--at_black-opacity_general);
183
+ --ct_text_main_subtle: var(--at_black-opacity_subtle);
184
+ --ct_text_main_subtlest: var(--at_black-opacity_subtlest);
185
+ --ct_text_main_pale: var(--at_black-opacity_pale);
186
+ --ct_text_moderate_strong: var(--at_primary_strong);
187
+ --ct_text_moderate_general: var(--at_primary_general);
188
+ --ct_text_moderate_subtle: var(--at_primary_subtle);
189
+ --ct_text_moderate_subtlest: var(--at_primary_subtlest);
190
+ --ct_text_moderate_pale: var(--at_primary_pale);
191
+ --ct_text_minor_strong: var(--at_secondary_strong);
192
+ --ct_text_minor_general: var(--at_secondary_general);
193
+ --ct_text_minor_subtle: var(--at_secondary_subtle);
194
+ --ct_text_minor_subtlest: var(--at_secondary_subtlest);
195
+ --ct_text_minor_pale: var(--at_secondary_pale);
196
+ --ct_text_rare_strong: var(--at_tertiary_strong);
197
+ --ct_text_rare_general: var(--at_tertiary_general);
198
+ --ct_text_rare_subtle: var(--at_tertiary_subtle);
199
+ --ct_text_rare_subtlest: var(--at_tertiary_subtlest);
200
+ --ct_text_rare_pale: var(--at_tertiary_pale);
201
+ --ct_text_success_strong: var(--at_success_strong);
202
+ --ct_text_success_general: var(--at_success_general);
203
+ --ct_text_success_subtle: var(--at_success_subtle);
204
+ --ct_text_success_subtlest: var(--at_success_subtlest);
205
+ --ct_text_success_pale: var(--at_success_pale);
206
+ --ct_text_danger_strong: var(--at_danger_strong);
207
+ --ct_text_danger_general: var(--at_danger_general);
208
+ --ct_text_danger_subtle: var(--at_danger_subtle);
209
+ --ct_text_danger_subtlest: var(--at_danger_subtlest);
210
+ --ct_text_danger_pale: var(--at_danger_pale);
211
+ --ct_text_inverse_general: var(--at_white-opacity_general);
212
+ --ct_text_inverse_subtle: var(--at_white-opacity_subtle);
213
+ --ct_text_inverse_subtlest: var(--at_white-opacity_subtlest);
214
+ --ct_text_inverse_pale: var(--at_white-opacity_pale);
215
+ --ct_icon_main_general: var(--at_black-opacity_general);
216
+ --ct_icon_main_subtle: var(--at_black-opacity_subtle);
217
+ --ct_icon_main_subtlest: var(--at_black-opacity_subtlest);
218
+ --ct_icon_main_pale: var(--at_black-opacity_pale);
219
+ --ct_icon_moderate_strong: var(--at_primary_strong);
220
+ --ct_icon_moderate_general: var(--at_primary_general);
221
+ --ct_icon_moderate_subtle: var(--at_primary_subtle);
222
+ --ct_icon_moderate_subtlest: var(--at_primary_subtlest);
223
+ --ct_icon_moderate_pale: var(--at_primary_pale);
224
+ --ct_icon_minor_strong: var(--at_secondary_strong);
225
+ --ct_icon_minor_general: var(--at_secondary_general);
226
+ --ct_icon_minor_subtle: var(--at_secondary_subtle);
227
+ --ct_icon_minor_subtlest: var(--at_secondary_subtlest);
228
+ --ct_icon_minor_pale: var(--at_secondary_pale);
229
+ --ct_icon_rare_strong: var(--at_tertiary_strong);
230
+ --ct_icon_rare_general: var(--at_tertiary_general);
231
+ --ct_icon_rare_subtle: var(--at_tertiary_subtle);
232
+ --ct_icon_rare_subtlest: var(--at_tertiary_subtlest);
233
+ --ct_icon_rare_pale: var(--at_tertiary_pale);
234
+ --ct_icon_success_strong: var(--at_success_strong);
235
+ --ct_icon_success_general: var(--at_success_general);
236
+ --ct_icon_success_subtle: var(--at_success_subtle);
237
+ --ct_icon_success_subtlest: var(--at_success_subtlest);
238
+ --ct_icon_success_pale: var(--at_success_pale);
239
+ --ct_icon_danger_strong: var(--at_danger_strong);
240
+ --ct_icon_danger_general: var(--at_danger_general);
241
+ --ct_icon_danger_subtle: var(--at_danger_subtle);
242
+ --ct_icon_danger_subtlest: var(--at_danger_subtlest);
243
+ --ct_icon_danger_pale: var(--at_danger_pale);
244
+ --ct_icon_engagement_strong: var(--at_engagement_strong);
245
+ --ct_icon_engagement_general: var(--at_engagement_general);
246
+ --ct_icon_engagement_subtle: var(--at_engagement_subtle);
247
+ --ct_icon_engagement_subtlest: var(--at_engagement_subtlest);
248
+ --ct_icon_engagement_pale: var(--at_engagement_pale);
249
+ --ct_icon_inverse_general: var(--at_white-opacity_general);
250
+ --ct_icon_inverse_subtle: var(--at_white-opacity_subtle);
251
+ --ct_icon_inverse_subtlest: var(--at_white-opacity_subtlest);
252
+ --ct_icon_inverse_pale: var(--at_white-opacity_pale);
253
+ --ct_icon_black_general: var(--at_black-opacity_general);
254
+ --ct_icon_white_general: var(--at_white-opacity_general);
255
+ --ct_image-stroke_general: var(--at_black-opacity_palest);
256
+ --ct_image-stroke_inverse: var(--at_white-opacity_general);
257
+ --ct_surface_main: var(--at_neutral_palest);
258
+ --ct_surface_moderate: var(--at_neutral_light);
259
+ --ct_surface_minor: var(--at_neutral_pale);
260
+ --ct_surface_inverse: var(--at_neutral_dark);
261
+ --ct_surface_dim: var(--at_black-opacity_subtlest);
262
+ --ct_border_subtle: var(--at_black-opacity_pale);
263
+ --ct_button-filled_main_enabled: var(--at_neutral_dark);
264
+ --ct_button-filled_main_hover: var(--at_neutral_deep);
265
+ --ct_button-filled_main_active: var(--at_neutral_deep);
266
+ --ct_button-filled_main_disabled: var(--at_neutral_dark);
267
+ --ct_button-filled_moderate_enabled: var(--at_primary_general);
268
+ --ct_button-filled_moderate_hover: var(--at_primary_subtle);
269
+ --ct_button-filled_moderate_active: var(--at_primary_subtle);
270
+ --ct_button-filled_moderate_disabled: var(--at_primary_general);
271
+ --ct_button-filled_inverse_enabled: var(--at_neutral_light);
272
+ --ct_button-filled_inverse_hover: var(--at_neutral_palest);
273
+ --ct_button-filled_inverse_active: var(--at_neutral_palest);
274
+ --ct_button-filled_inverse_disabled: var(--at_neutral_light);
275
+ --ct_button-emoji_main_enabled: var(--at_neutral_light);
276
+ --ct_button-emoji_main_hover: var(--at_neutral_palest);
277
+ --ct_button-emoji_main_active: var(--at_primary_palest);
278
+ --ct_button-outlined_main_container_hover: var(--at_black-opacity_thick);
279
+ --ct_button-outlined_main_container_active: var(--at_black-opacity_thick);
280
+ --ct_button-outlined_main_stroke: var(--at_black-opacity_general);
281
+ --ct_button-outlined_moderate_stroke: var(--at_primary_general);
282
+ --ct_button-outlined_moderate_container_hover: var(--at_black-opacity_thick);
283
+ --ct_button-outlined_moderate_container_active: var(--at_black-opacity_thick);
284
+ --ct_button-outlined_inverse_stroke: var(--at_white-opacity_general);
285
+ --ct_button-outlined_inverse_container_hover: var(--at_black-opacity_thick);
286
+ --ct_button-outlined_inverse_container_active: var(--at_black-opacity_thick);
287
+ --ct_button-icon_spotlight_hover: var(--at_black-opacity_thick);
288
+ --ct_button-share_enabled: var(--at_neutral_light);
289
+ --ct_button-share_hover: var(--at_neutral_palest);
290
+ --ct_button-share_active: var(--at_neutral_palest);
291
+ --ct_button-floating_main_general_enabled: var(--at_neutral_light);
292
+ --ct_button-floating_main_general_disabled: var(--at_neutral_light);
293
+ --ct_button-floating_main_general_hover: var(--at_neutral_palest);
294
+ --ct_button-floating_main_general_active: var(--at_neutral_palest);
295
+ --ct_button-floating_main_subtle_enabled: var(--at_neutral_pale);
296
+ --ct_button-floating_main_subtle_disabled: var(--at_neutral_pale);
297
+ --ct_button-floating_main_subtle_hover: var(--at_neutral_pale);
298
+ --ct_button-floating_main_subtle_active: var(--at_neutral_pale);
299
+ --ct_button-floating_moderate_container_enabled: var(--at_neutral_light);
300
+ --ct_button-floating_moderate_container_disabled: var(--at_neutral_light);
301
+ --ct_button-floating_moderate_container_hover: var(--at_neutral_palest);
302
+ --ct_button-floating_moderate_container_active: var(--at_neutral_palest);
303
+ --ct_button-floating_inverse_general_enabled: var(--at_neutral_dark);
304
+ --ct_button-floating_inverse_general_disabled: var(--at_neutral_dark);
305
+ --ct_button-floating_inverse_general_hover: var(--at_neutral_deep);
306
+ --ct_button-floating_inverse_general_active: var(--at_neutral_deep);
307
+ --ct_button-floating_inverse_subtle_enabled: var(--at_neutral_subtle);
308
+ --ct_button-floating_inverse_subtle_disabled: var(--at_neutral_subtle);
309
+ --ct_button-floating_inverse_subtle_hover: var(--at_neutral_subtlest);
310
+ --ct_button-floating_inverse_subtle_active: var(--at_neutral_subtlest);
311
+ --ct_button-segmented_main_stroke_enabled: var(--at_neutral_pale);
312
+ --ct_button-segmented_main_stroke_disabled: var(--at_neutral_pale);
313
+ --ct_button-segmented_main_stroke_hover: var(--at_neutral_pale);
314
+ --ct_button-segmented_main_stroke_edit: var(--at_primary_subtle);
315
+ --ct_button-segmented_main_stroke_focused: var(--at_neutral_subtle);
316
+ --ct_button-segmented_main_container_enabled: var(--at_neutral_light);
317
+ --ct_button-segmented_main_container_disabled: var(--at_neutral_light);
318
+ --ct_button-segmented_main_container_hover: var(--at_neutral_palest);
319
+ --ct_button-segmented_main_container_edit: var(--at_primary_general);
320
+ --ct_button-segmented_main_container_focused: var(--at_neutral_dark);
321
+ --ct_button-segmented_dim_stroke_default: var(--at_black-opacity_palest);
322
+ --ct_button-segmented_dim_stroke_disabled: var(--at_black-opacity_palest);
323
+ --ct_button-segmented_dim_stroke_hover: var(--at_black-opacity_palest);
324
+ --ct_button-segmented_dim_stroke_edit: var(--at_primary_subtle);
325
+ --ct_button-segmented_dim_stroke_focused: var(--at_neutral_pale);
326
+ --ct_button-segmented_dim_container_default: var(--at_black-opacity_subtlest);
327
+ --ct_button-segmented_dim_container_disabled: var(--at_black-opacity_subtlest);
328
+ --ct_button-segmented_dim_container_hover: var(--at_black-opacity_pale);
329
+ --ct_button-segmented_dim_container_edit: var(--at_primary_general);
330
+ --ct_button-segmented_dim_container_focused: var(--at_neutral_light);
331
+ --ct_button-segmented_outlined_stroke_default: var(--at_black-opacity_pale);
332
+ --ct_button-segmented_outlined_stroke_disabled: var(--at_black-opacity_pale);
333
+ --ct_button-segmented_outlined_stroke_hover: var(--at_black-opacity_pale);
334
+ --ct_button-segmented_outlined_stroke_edit: var(--at_primary_subtle);
335
+ --ct_button-segmented_outlined_stroke_focused: var(--at_neutral_subtle);
336
+ --ct_button-segmented_outlined_container_hover: var(--at_black-opacity_thick);
337
+ --ct_button-segmented_outlined_container_active: var(--at_primary_subtle);
338
+ --ct_button-segmented_outlined_container_focused: var(--at_neutral_dark);
339
+ --ct_button-ghost_main_container_enabled: var(--at_neutral_opacity_pale);
340
+ --ct_button-ghost_main_container_disabled: var(--at_neutral_opacity_pale);
341
+ --ct_button-ghost_main_container_hover: var(--at_neutral_opacity_pale);
342
+ --ct_button-ghost_main_container_active: var(--at_neutral_opacity_pale);
343
+ --ct_button-ghost_main_Stroke: var(--at_neutral_opacity_palest);
344
+ --ct_button-ghost_on-light_container_enabled: var(--at_black-opacity_subtlest);
345
+ --ct_button-ghost_on-light_container_disabled: var(--at_black-opacity_subtlest);
346
+ --ct_button-ghost_on-light_container_hover: var(--at_black-opacity_subtlest);
347
+ --ct_button-ghost_on-light_container_active: var(--at_black-opacity_subtlest);
348
+ --ct_button-ghost_on-light_Stroke: var(--at_black-opacity_palest);
349
+ --ct_button-ghost_on-dark_container_enabled: var(--at_white-opacity_pale);
350
+ --ct_button-ghost_on-dark_container_disabled: var(--at_white-opacity_pale);
351
+ --ct_button-ghost_on-dark_container_hover: var(--at_white-opacity_pale);
352
+ --ct_button-ghost_on-dark_container_active: var(--at_white-opacity_pale);
353
+ --ct_button-ghost_on-dark_Stroke: var(--at_white-opacity_palest);
354
+ --ct_button-search_main_default: var(--at_primary_general);
355
+ --ct_button-search_main_hover: var(--at_primary_subtlest);
356
+ --ct_card-basic_main_container: var(--at_neutral_light);
357
+ --ct_card-basic_main_dim: var(--at_black-opacity_pale);
358
+ --ct_card-merch_main_container: var(--at_neutral_light);
359
+ --ct_card-merch_main_dim: var(--at_black-opacity_pale);
360
+ --ct_card-coupon_main_container-front_default: var(--at_danger_subtlest);
361
+ --ct_card-coupon_main_container-front_hover: var(--ct_text_danger_subtle);
362
+ --ct_card-coupon_main_container-back_default: var(--at_danger_subtlest);
363
+ --ct_card-coupon_main_container-back_hover: var(--at_danger_subtle);
364
+ --ct_card-coupon_main_divider_default: var(--at_danger_subtlest);
365
+ --ct_card-coupon_main_divider_hover: var(--at_danger_subtle);
366
+ --ct_card-see-more_main_container: var(--at_neutral_light);
367
+ --ct_card-see-more_main_dim: var(--at_black-opacity_palest);
368
+ --ct_divider_main_strong: var(--at_black-opacity_subtlest);
369
+ --ct_divider_main_general: var(--at_black-opacity_pale);
370
+ --ct_divider_main_subtle: var(--at_black-opacity_thick);
371
+ --ct_divider_inverse_strong: var(--at_white-opacity_subtlest);
372
+ --ct_divider_inverse_general: var(--at_white-opacity_pale);
373
+ --ct_divider_inverse_subtle: var(--at_white-opacity_thick);
374
+ --ct_tab-segmented_unit_selected: var(--at_black-opacity_general);
375
+ --ct_tab-segmented_dropdown_default: var(--at_neutral_light);
376
+ --ct_tab-segmented_dropdown_hover: var(--at_primary_subtlest);
377
+ --ct_tab-segmented_dropdown_selected: var(--at_black-opacity_general);
378
+ --ct_tab-segmented_dropdown_disabled: var(--at_neutral_light);
379
+ --ct_tab-segmented_container_default: var(--at_black-opacity_thick);
380
+ --ct_tag-basic_main_general: var(--at_primary_general);
381
+ --ct_tag-basic_main_subtle: var(--at_primary_subtlest);
382
+ --ct_tag-basic_moderate_general: var(--at_secondary_general);
383
+ --ct_tag-basic_moderate_subtle: var(--at_secondary_subtlest);
384
+ --ct_tag-basic_minor_general: var(--at_tertiary_general);
385
+ --ct_tag-basic_minor_subtle: var(--at_tertiary_subtlest);
386
+ --ct_tag-basic_inverse_general: var(--at_white-opacity_general);
387
+ --ct_tag-basic_inverse_subtle: var(--at_white-opacity_subtlest);
388
+ --ct_tag-basic_dim_strong: var(--at_black-opacity_subtle);
389
+ --ct_tag-basic_dim_general: var(--at_black-opacity_subtlest);
390
+ --ct_tag-basic_dim_subtle: var(--at_black-opacity_palest);
391
+ --ct_tag-hashtag_dim_default: var(--at_black-opacity_palest);
392
+ --ct_tag-hashtag_dim_hover: var(--at_black-opacity_pale);
393
+ --ct_tag-hashtag_dim_active: var(--at_black-opacity_pale);
394
+ --ct_tag-point_main_point-container: var(--ct_text_danger_general);
395
+ --ct_tag-point_main_container: var(--at_black-opacity_general);
396
+ --ct_tooltip_main_general: var(--at_white-opacity_general);
397
+ --ct_tooltip_main_subtle: var(--at_white-opacity_pale);
398
+ --ct_tooltip_inverse_general: var(--at_black-opacity_subtle);
399
+ --ct_tooltip_inverse_subtle: var(--at_black-opacity_subtlest);
400
+ --ct_scroller_general: var(--at_black-opacity_thick);
401
+ --ct_menu-tab_unit_default: var(--at_neutral_light);
402
+ --ct_menu-tab_unit_hover: var(--at_primary_subtlest);
403
+ --ct_menu-tab_unit_active: var(--at_primary_subtlest);
404
+ --ct_menu-tab_unit_selected: var(--at_black-opacity_general);
405
+ --ct_menu-tab_unit_disabled: var(--at_neutral_light);
406
+ --ct_menu-tab_container: var(--at_neutral_light);
407
+ --ct_menu-general_unit_default: var(--at_neutral_light);
408
+ --ct_menu-general_unit_hover: var(--at_black-opacity_thick);
409
+ --ct_menu-general_unit_active: var(--at_primary_palest);
410
+ --ct_menu-general_unit_selected: var(--at_neutral_light);
411
+ --ct_menu-general_unit_selected-n-hover: var(--at_black-opacity_thick);
412
+ --ct_menu-general_unit_disabled: var(--at_neutral_light);
413
+ --ct_menu-general_container: var(--at_neutral_light);
414
+ --ct_pagination-unit_container_default: var(--at_black-opacity_thick);
415
+ --ct_pagination-unit_container_hover: var(--at_primary_subtlest);
416
+ --ct_pagination-unit_container_active: var(--at_primary_subtlest);
417
+ --ct_pagination-unit_container_selected: var(--at_primary_general);
418
+ --ct_pagination-unit_container_disabled: var(--at_black-opacity_thick);
419
+ --ct_pagination-unit_stroke_disabled: var(--at_black-opacity_pale);
420
+ --ct_pagination-navigation_container_hover: var(--at_black-opacity_thick);
421
+ --ct_pagination-navigation_container_pressed: var(--at_black-opacity_palest);
422
+ --ct_pagination-navigation_container_disabled: var(--at_black-opacity_thick);
423
+ --ct_pagination-capsule_dim_default: var(--at_black-opacity_subtlest);
424
+ --ct_pagination-capsule_dim_hover: var(--at_black-opacity_subtle);
425
+ --ct_pagination-capsule_dim_active: var(--at_black-opacity_subtle);
426
+ --ct_placeholder-box_strong: var(--at_black-opacity_subtlest);
427
+ --ct_placeholder-box_general: var(--at_black-opacity_palest);
428
+ --ct_checkbox_main_unit_selected: var(--at_white-opacity_general);
429
+ --ct_checkbox_main_unit_disabled: var(--at_black-opacity_pale);
430
+ --ct_checkbox_main_container_default: var(--at_white-opacity_general);
431
+ --ct_checkbox_main_container_hover: var(--at_white-opacity_general);
432
+ --ct_checkbox_main_container_selected: var(--at_primary_general);
433
+ --ct_checkbox_main_container_disabled: var(--at_black-opacity_thick);
434
+ --ct_checkbox_main_focus-outline_default: var(--at_black-opacity_pale);
435
+ --ct_checkbox_main_focus-outline_hover: var(--at_primary_subtlest);
436
+ --ct_checkbox_main_focus-outline_disabled: var(--at_black-opacity_palest);
437
+ --ct_checkbox_moderate_unit_selected: var(--at_black-opacity_general);
438
+ --ct_checkbox_moderate_unit_disabled: var(--at_black-opacity_pale);
439
+ --ct_checkbox_moderate_container_default: var(--at_white-opacity_general);
440
+ --ct_checkbox_moderate_container_hover: var(--at_white-opacity_general);
441
+ --ct_checkbox_moderate_container_selected: var(--at_white-opacity_general);
442
+ --ct_checkbox_moderate_container_disabled: var(--at_black-opacity_thick);
443
+ --ct_checkbox_moderate_focus-outline_default: var(--at_black-opacity_pale);
444
+ --ct_checkbox_moderate_focus-outline_hover: var(--at_primary_subtlest);
445
+ --ct_checkbox_moderate_focus-outline_disabled: var(--at_black-opacity_palest);
446
+ --ct_radio-button_main_unit_selected: var(--at_primary_general);
447
+ --ct_radio-button_main_unit_disabled: var(--at_black-opacity_pale);
448
+ --ct_radio-button_main_container_default: var(--at_white-opacity_general);
449
+ --ct_radio-button_main_container_hover: var(--at_white-opacity_general);
450
+ --ct_radio-button_main_container_selected: var(--at_white-opacity_general);
451
+ --ct_radio-button_main_container_disabled: var(--at_black-opacity_thick);
452
+ --ct_radio-button_main_focus-outline_default: var(--at_black-opacity_pale);
453
+ --ct_radio-button_main_focus-outline_selected: var(--at_black-opacity_pale);
454
+ --ct_radio-button_main_focus-outline_hover: var(--at_primary_subtlest);
455
+ --ct_radio-button_main_focus-outline_disabled: var(--at_black-opacity_palest);
456
+ --ct_radio-button_moderate_unit_selected: var(--at_black-opacity_general);
457
+ --ct_radio-button_moderate_unit_disabled: var(--at_black-opacity_pale);
458
+ --ct_radio-button_moderate_container_default: var(--at_white-opacity_general);
459
+ --ct_radio-button_moderate_container_hover: var(--at_white-opacity_general);
460
+ --ct_radio-button_moderate_container_selected: var(--at_white-opacity_general);
461
+ --ct_radio-button_moderate_container_disabled: var(--at_black-opacity_thick);
462
+ --ct_radio-button_moderate_focus-outline_default: var(--at_black-opacity_pale);
463
+ --ct_radio-button_moderate_focus-outline_selected: var(--at_black-opacity_pale);
464
+ --ct_radio-button_moderate_focus-outline_hover: var(--at_primary_subtlest);
465
+ --ct_radio-button_moderate_focus-outline_disabled: var(--at_black-opacity_palest);
466
+ --ct_dialog_main_container: var(--at_neutral_palest);
467
+ --ct_input-general_main_container_default: var(--at_white-opacity_general);
468
+ --ct_input-general_main_container_success: var(--at_white-opacity_general);
469
+ --ct_input-general_main_container_error: var(--at_white-opacity_general);
470
+ --ct_input-general_main_container_auto-filled: var(--at_black-opacity_thick);
471
+ --ct_input-general_main_container_disabled: var(--at_black-opacity_thick);
472
+ --ct_input-general_main_stroke_default: var(--at_black-opacity_palest);
473
+ --ct_input-general_main_stroke_success: var(--at_success_general);
474
+ --ct_input-general_main_stroke_error: var(--at_danger_general);
475
+ --ct_input-general_main_stroke_auto-filled: var(--at_black-opacity_palest);
476
+ --ct_input-general_main_stroke_disabled: var(--at_black-opacity_palest);
477
+ --ct_input-general_main_focus-outline_default: var(--at_primary_pale);
478
+ --ct_input-general_main_focus-outline_success: var(--at_success_pale);
479
+ --ct_input-general_main_focus-outline_error: var(--at_danger_pale);
480
+ --ct_input-general_button-search2_main_default: var(--at_primary_general);
481
+ --ct_input-general_button-search2_main_hover: var(--at_primary_subtlest);
482
+ --ct_input-general_dim_container_default: var(--at_black-opacity_thick);
483
+ --ct_input-general_dim_container_success: var(--at_black-opacity_thick);
484
+ --ct_input-general_dim_container_error: var(--at_black-opacity_thick);
485
+ --ct_input-general_dim_container_auto-filled: var(--at_black-opacity_thick);
486
+ --ct_input-general_dim_container_disabled: var(--at_black-opacity_thick);
487
+ --ct_input-general_dim_stroke_default: var(--at_black-opacity_palest);
488
+ --ct_input-general_dim_stroke_success: var(--at_success_general);
489
+ --ct_input-general_dim_stroke_error: var(--at_danger_general);
490
+ --ct_input-general_dim_stroke_auto-filled: var(--at_black-opacity_palest);
491
+ --ct_input-general_dim_stroke_disabled: var(--at_black-opacity_palest);
492
+ --ct_input-general_dim_focus-outline_default: var(--at_primary_pale);
493
+ --ct_input-general_dim_focus-outline_success: var(--at_success_pale);
494
+ --ct_input-general_dim_focus-outline_error: var(--at_danger_pale);
495
+ --ct_input-search_main_container: var(--at_white-opacity_general);
496
+ --ct_input-search_main_stroke: var(--at_primary_general);
497
+ --ct_input-search_dim_container: var(--at_black-opacity_thick);
498
+ --ct_input-voicehint_main_container: var(--at_black-opacity_general);
499
+ --ct_input-voicehint_inverse_container: var(--at_black-opacity_thick);
500
+ --ct_input-voicehint_spotlight_active: var(--at_black-opacity_thick);
501
+ --ct_input-caret_main_general: var(--at_primary_general);
502
+ --ct_input-caret_inverse_general: var(--at_primary_pale);
503
+ --ct_notification_unit_default: var(--at_neutral_light);
504
+ --ct_notification_unit_hover: var(--at_primary_palest);
505
+ --ct_notification_unit_pressed: var(--at_primary_palest);
506
+ --ct_notification_unit_selected: var(--at_neutral_light);
507
+ --ct_notification_container: var(--at_neutral_light);
508
+ --ct_table_unit_default: var(--at_neutral_light);
509
+ --ct_table_unit_hover: var(--at_primary_palest);
510
+ --ct_table_unit_active: var(--at_primary_pale);
511
+ --ct_table_unit_selected: var(--at_primary_palest);
512
+ --ct_table_container: var(--at_neutral_light);
513
+ --ct_toast_container_success: var(--at_success_palest);
514
+ --ct_toast_container_error: var(--at_danger_palest);
515
+ --ct_toast_container_default: var(--at_neutral_subtle);
516
+ --ct_toast_stroke_success: var(--at_success_general);
517
+ --ct_toast_stroke_error: var(--at_danger_general);
518
+ --ct_toast_stroke_default: var(--at_neutral_subtle);
519
+ --ct_barchart_container: var(--at_black-opacity_thick);
520
+ --ct_barchart_unit: var(--gt_purple_300);
521
+ --ct_option_container_default: var(--at_white-opacity_general);
522
+ --ct_option_container_selected: var(--at_black-opacity_general);
523
+ --ct_option_container_disabled: var(--at_black-opacity_thick);
524
+ --ct_option_stroke_default: var(--at_black-opacity_palest);
525
+ --ct_option_stroke_disabled: var(--at_black-opacity_palest);
526
+ --ct_mask_general: var(--at_black-opacity_subtle);
527
+ --ct_skeleton_background_strong: var(--at_black-opacity_palest);
528
+ --ct_skeleton_background_general: var(--at_black-opacity_thick);
529
+ --ct_skeleton_toplight_strong: var(--at_white-opacity_subtlest);
530
+ --ct_skeleton_toplight_general: var(--at_white-opacity_pale);
531
+ --ct_bottom-sheet_container: var(--at_neutral_palest);
532
+ --ct_bottom-sheet_handle: var(--at_neutral_subtle);
533
+ --ct_bottom-sheet_unit: var(--at_white-opacity_subtle);
534
+ --ct_chips_main_general_container_default: var(--at_neutral_light);
535
+ --ct_chips_main_general_container_selected: var(--at_neutral_dark);
536
+ --ct_chips_main_general_stroke_default: var(--at_neutral_palest);
537
+ --ct_chips_main_general_stroke_selected: var(--at_neutral_deep);
538
+ --ct_chips_main_subtle_container_default: var(--at_neutral_palest);
539
+ --ct_chips_main_subtle_container_selected: var(--at_neutral_dark);
540
+ --ct_chips_main_subtle_stroke_default: var(--at_neutral_pale);
541
+ --ct_chips_main_subtle_stroke_selected: var(--at_neutral_deep);
542
+ --ct_switch_main_handle: var(--at_neutral_light);
543
+ --ct_switch_main_container_on: var(--at_primary_general);
544
+ --ct_switch_main_container_off: var(--at_neutral_pale);
545
+ --ct_switch_inverse_handle: var(--at_neutral_light);
546
+ --ct_switch_inverse_container_on: var(--at_primary_general);
547
+ --ct_switch_inverse_container_off: var(--at_neutral_subtle);
548
+ --ct_tab-bar_hint: var(--at_primary_general);
549
+ --ct_tab-bar_container: var(--at_neutral_light);
550
+ --ct_tab-bar_stroke: var(--at_neutral_palest);
551
+ --ct_tab-bar_noti: var(--at_danger_general);
552
+ --ct_tabs_hint: var(--at_primary_general);
553
+ --ct_top-bar_second-layer: var(--at_neutral_pale);
554
+ --ct_top-bar_handle: var(--at_neutral_subtle);
555
+ --ct_avatar_general_container: var(--at_neutral_pale);
556
+ --ct_avatar_general_stroke: var(--at_neutral_subtlest);
557
+ --ct_avatar_shady_container: var(--at_neutral_light);
558
+ --ct_avatar_shady_stroke: var(--at_neutral_palest);
559
+ --ct_info-message_main_container: var(--at_black-opacity_palest);
560
+ --ct_info-message_inverse_container: var(--at_white-opacity_pale);
561
+ --ct_progress-bar_main_container: var(--at_neutral_subtle);
562
+ --ct_progress-bar_main_bar: var(--at_neutral_light);
563
+ --ct_progress-bar_main_pointer: var(--at_neutral_light);
564
+
565
+ /* gradient */
566
+ --gt_gradient_violet_dark: linear-gradient(to right, #6d71ea, #430dcc);
567
+ --gt_gradient_violet_default: linear-gradient(to right, #a7b4ff, #9b7bff, #714eff);
568
+ --gt_gradient_violet_light: linear-gradient(to right, #dedfff, #dcc1ff);
569
+ --gt_gradient_orange_dark: linear-gradient(to right, #ffa76e, #f97824, #ff4c59);
570
+ --gt_gradient_orange_default: linear-gradient(to right, #ffae83, #ff8a3d, #ff717f);
571
+ --gt_gradient_orange_light: linear-gradient(to right, #ffee9d, #ffdcaf, #ffd2b4);
572
+ --gt_gradient_blue_default: linear-gradient(to right, #40a9ff, #0050b3);
573
+ --gt_gradient_blue_light: linear-gradient(to right, #e6f7ff, #91d5ff);
574
+ --gt_gradient_iOM_dark: linear-gradient(to right, #ff8a3d, #f04128, #e60013);
575
+ --gt_gradient_iOM_default: linear-gradient(to right, #ffb44b, #f18d00, #ff614a);
576
+ --gt_gradient_iOM_light: linear-gradient(to right, #fff4da, #ffccbb, #ffaa9d);
577
+ --at_gradient_primary_dark: var(--gt_gradient_iOM_dark);
578
+ --at_gradient_primary_default: var(--gt_gradient_iOM_default);
579
+ --at_gradient_primary_light: var(--gt_gradient_iOM_light);
580
+ --at_gradient_secondary_dark: var(--gt_gradient_violet_dark);
581
+ --at_gradient_secondary_default: var(--gt_gradient_violet_default);
582
+ --at_gradient_secondary_light: var(--gt_gradient_violet_light);
583
+ --at_gradient_tertiary_default: var(--gt_gradient_blue_default);
584
+ --at_gradient_tertiary_light: var(--gt_gradient_blue_light);
585
+ }
586
+ `;