@qasa/qds-ui 0.2.0 → 0.4.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.
- package/dist/cjs/index.js +1 -1
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/types/components/avatar/avatar.d.ts +1 -0
- package/dist/cjs/types/components/button/button-styles.d.ts +67 -40
- package/dist/cjs/types/components/heading/heading.d.ts +37 -21
- package/dist/cjs/types/components/icon/create-icon.d.ts +31 -12
- package/dist/cjs/types/components/icon/icons/index.d.ts +1 -0
- package/dist/cjs/types/components/icon/icons/minus.d.ts +2 -0
- package/dist/cjs/types/components/icon-button/icon-button-styles.d.ts +50 -28
- package/dist/cjs/types/components/label/label.d.ts +24 -14
- package/dist/cjs/types/components/loading-dots/loading-dots.d.ts +23 -11
- package/dist/cjs/types/components/paragraph/paragraph.d.ts +24 -14
- package/dist/cjs/types/styles/common-styles.d.ts +28 -11
- package/dist/cjs/types/theme/foundations/colors.d.ts +21 -13
- package/dist/cjs/types/theme/foundations/index.d.ts +23 -11
- package/dist/cjs/types/theme/foundations/typography.d.ts +2 -0
- package/dist/cjs/types/theme/theme-tools.d.ts +23 -11
- package/dist/cjs/types/theme/theme.d.ts +23 -11
- package/dist/esm/index.js +1 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/components/avatar/avatar.d.ts +1 -0
- package/dist/esm/types/components/button/button-styles.d.ts +67 -40
- package/dist/esm/types/components/heading/heading.d.ts +37 -21
- package/dist/esm/types/components/icon/create-icon.d.ts +31 -12
- package/dist/esm/types/components/icon/icons/index.d.ts +1 -0
- package/dist/esm/types/components/icon/icons/minus.d.ts +2 -0
- package/dist/esm/types/components/icon-button/icon-button-styles.d.ts +50 -28
- package/dist/esm/types/components/label/label.d.ts +24 -14
- package/dist/esm/types/components/loading-dots/loading-dots.d.ts +23 -11
- package/dist/esm/types/components/paragraph/paragraph.d.ts +24 -14
- package/dist/esm/types/styles/common-styles.d.ts +28 -11
- package/dist/esm/types/theme/foundations/colors.d.ts +21 -13
- package/dist/esm/types/theme/foundations/index.d.ts +23 -11
- package/dist/esm/types/theme/foundations/typography.d.ts +2 -0
- package/dist/esm/types/theme/theme-tools.d.ts +23 -11
- package/dist/esm/types/theme/theme.d.ts +23 -11
- package/dist/index.d.ts +334 -174
- package/package.json +1 -1
|
@@ -56,15 +56,18 @@ export declare const getSizeStyles: (theme: {
|
|
|
56
56
|
gray30: string;
|
|
57
57
|
gray20: string;
|
|
58
58
|
gray10: string;
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
59
|
+
uiPink: string;
|
|
60
|
+
uiPinkDark: string;
|
|
61
|
+
uiPinkLight: string;
|
|
62
|
+
brown: string;
|
|
63
|
+
brownDark: string;
|
|
64
|
+
brownLight: string;
|
|
65
|
+
offWhite: string;
|
|
66
|
+
offWhiteDark: string;
|
|
67
|
+
offWhiteLight: string;
|
|
68
|
+
softPink: string;
|
|
69
|
+
warmYellow: string;
|
|
70
|
+
softYellow: string;
|
|
68
71
|
red10: string;
|
|
69
72
|
red20: string;
|
|
70
73
|
red30: string;
|
|
@@ -111,6 +114,9 @@ export declare const getSizeStyles: (theme: {
|
|
|
111
114
|
brandSecondary: string;
|
|
112
115
|
brandSecondaryHover: string;
|
|
113
116
|
brandSecondaryActive: string;
|
|
117
|
+
brandTertiary: string;
|
|
118
|
+
brandTertiaryHover: string;
|
|
119
|
+
brandTertiaryActive: string;
|
|
114
120
|
negative: string;
|
|
115
121
|
warning: string;
|
|
116
122
|
positive: string;
|
|
@@ -125,7 +131,9 @@ export declare const getSizeStyles: (theme: {
|
|
|
125
131
|
negative: string;
|
|
126
132
|
warning: string;
|
|
127
133
|
positive: string;
|
|
128
|
-
|
|
134
|
+
onBrandPrimary: string;
|
|
135
|
+
onBrandSecondary: string;
|
|
136
|
+
onBrandTertiary: string;
|
|
129
137
|
};
|
|
130
138
|
icon: {
|
|
131
139
|
default: string;
|
|
@@ -135,7 +143,9 @@ export declare const getSizeStyles: (theme: {
|
|
|
135
143
|
negative: string;
|
|
136
144
|
warning: string;
|
|
137
145
|
success: string;
|
|
138
|
-
|
|
146
|
+
onBrandPrimary: string;
|
|
147
|
+
onBrandSecondary: string;
|
|
148
|
+
onBrandTertiary: string;
|
|
139
149
|
};
|
|
140
150
|
border: {
|
|
141
151
|
default: string;
|
|
@@ -204,6 +214,7 @@ export declare const getSizeStyles: (theme: {
|
|
|
204
214
|
fontSize: string;
|
|
205
215
|
lineHeight: string;
|
|
206
216
|
letterSpacing: string;
|
|
217
|
+
fontFeatureSettings: string;
|
|
207
218
|
};
|
|
208
219
|
md: {
|
|
209
220
|
fontFamily: string;
|
|
@@ -211,6 +222,7 @@ export declare const getSizeStyles: (theme: {
|
|
|
211
222
|
fontSize: string;
|
|
212
223
|
lineHeight: string;
|
|
213
224
|
letterSpacing: string;
|
|
225
|
+
fontFeatureSettings: string;
|
|
214
226
|
};
|
|
215
227
|
};
|
|
216
228
|
title: {
|
|
@@ -361,6 +373,27 @@ export declare const getSizeStyles: (theme: {
|
|
|
361
373
|
paddingLeft: string;
|
|
362
374
|
paddingRight: string;
|
|
363
375
|
};
|
|
376
|
+
lg: {
|
|
377
|
+
fontFamily: string;
|
|
378
|
+
fontWeight: string;
|
|
379
|
+
fontSize: string;
|
|
380
|
+
lineHeight: string;
|
|
381
|
+
letterSpacing: string;
|
|
382
|
+
height: string;
|
|
383
|
+
minWidth: string;
|
|
384
|
+
paddingLeft: string;
|
|
385
|
+
paddingRight: string;
|
|
386
|
+
};
|
|
387
|
+
xl: {
|
|
388
|
+
fontFamily: string;
|
|
389
|
+
fontWeight: string;
|
|
390
|
+
fontSize: string;
|
|
391
|
+
lineHeight: string;
|
|
392
|
+
letterSpacing: string;
|
|
393
|
+
height: string;
|
|
394
|
+
paddingLeft: string;
|
|
395
|
+
paddingRight: string;
|
|
396
|
+
};
|
|
364
397
|
};
|
|
365
398
|
export declare const getVariantStyles: (theme: {
|
|
366
399
|
mediaQueries: {
|
|
@@ -420,15 +453,18 @@ export declare const getVariantStyles: (theme: {
|
|
|
420
453
|
gray30: string;
|
|
421
454
|
gray20: string;
|
|
422
455
|
gray10: string;
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
456
|
+
uiPink: string;
|
|
457
|
+
uiPinkDark: string;
|
|
458
|
+
uiPinkLight: string;
|
|
459
|
+
brown: string;
|
|
460
|
+
brownDark: string;
|
|
461
|
+
brownLight: string;
|
|
462
|
+
offWhite: string;
|
|
463
|
+
offWhiteDark: string;
|
|
464
|
+
offWhiteLight: string;
|
|
465
|
+
softPink: string;
|
|
466
|
+
warmYellow: string;
|
|
467
|
+
softYellow: string;
|
|
432
468
|
red10: string;
|
|
433
469
|
red20: string;
|
|
434
470
|
red30: string;
|
|
@@ -475,6 +511,9 @@ export declare const getVariantStyles: (theme: {
|
|
|
475
511
|
brandSecondary: string;
|
|
476
512
|
brandSecondaryHover: string;
|
|
477
513
|
brandSecondaryActive: string;
|
|
514
|
+
brandTertiary: string;
|
|
515
|
+
brandTertiaryHover: string;
|
|
516
|
+
brandTertiaryActive: string;
|
|
478
517
|
negative: string;
|
|
479
518
|
warning: string;
|
|
480
519
|
positive: string;
|
|
@@ -489,7 +528,9 @@ export declare const getVariantStyles: (theme: {
|
|
|
489
528
|
negative: string;
|
|
490
529
|
warning: string;
|
|
491
530
|
positive: string;
|
|
492
|
-
|
|
531
|
+
onBrandPrimary: string;
|
|
532
|
+
onBrandSecondary: string;
|
|
533
|
+
onBrandTertiary: string;
|
|
493
534
|
};
|
|
494
535
|
icon: {
|
|
495
536
|
default: string;
|
|
@@ -499,7 +540,9 @@ export declare const getVariantStyles: (theme: {
|
|
|
499
540
|
negative: string;
|
|
500
541
|
warning: string;
|
|
501
542
|
success: string;
|
|
502
|
-
|
|
543
|
+
onBrandPrimary: string;
|
|
544
|
+
onBrandSecondary: string;
|
|
545
|
+
onBrandTertiary: string;
|
|
503
546
|
};
|
|
504
547
|
border: {
|
|
505
548
|
default: string;
|
|
@@ -568,6 +611,7 @@ export declare const getVariantStyles: (theme: {
|
|
|
568
611
|
fontSize: string;
|
|
569
612
|
lineHeight: string;
|
|
570
613
|
letterSpacing: string;
|
|
614
|
+
fontFeatureSettings: string;
|
|
571
615
|
};
|
|
572
616
|
md: {
|
|
573
617
|
fontFamily: string;
|
|
@@ -575,6 +619,7 @@ export declare const getVariantStyles: (theme: {
|
|
|
575
619
|
fontSize: string;
|
|
576
620
|
lineHeight: string;
|
|
577
621
|
letterSpacing: string;
|
|
622
|
+
fontFeatureSettings: string;
|
|
578
623
|
};
|
|
579
624
|
};
|
|
580
625
|
title: {
|
|
@@ -723,8 +768,6 @@ export declare const getVariantStyles: (theme: {
|
|
|
723
768
|
tertiary: {
|
|
724
769
|
background: string;
|
|
725
770
|
color: string;
|
|
726
|
-
border: string;
|
|
727
|
-
borderColor: string;
|
|
728
771
|
":not([disabled])": {
|
|
729
772
|
'@media(hover: hover)': {
|
|
730
773
|
':hover': {
|
|
@@ -736,20 +779,4 @@ export declare const getVariantStyles: (theme: {
|
|
|
736
779
|
};
|
|
737
780
|
};
|
|
738
781
|
};
|
|
739
|
-
ghost: {
|
|
740
|
-
background: string;
|
|
741
|
-
color: string;
|
|
742
|
-
textDecoration: string;
|
|
743
|
-
textUnderlineOffset: number;
|
|
744
|
-
":not([disabled])": {
|
|
745
|
-
'@media(hover: hover)': {
|
|
746
|
-
':hover': {
|
|
747
|
-
background: string;
|
|
748
|
-
};
|
|
749
|
-
':active': {
|
|
750
|
-
background: string;
|
|
751
|
-
};
|
|
752
|
-
};
|
|
753
|
-
};
|
|
754
|
-
};
|
|
755
782
|
};
|
|
@@ -58,15 +58,18 @@ declare const getSizeStyles: (theme: {
|
|
|
58
58
|
gray30: string;
|
|
59
59
|
gray20: string;
|
|
60
60
|
gray10: string;
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
61
|
+
uiPink: string;
|
|
62
|
+
uiPinkDark: string;
|
|
63
|
+
uiPinkLight: string;
|
|
64
|
+
brown: string;
|
|
65
|
+
brownDark: string;
|
|
66
|
+
brownLight: string;
|
|
67
|
+
offWhite: string;
|
|
68
|
+
offWhiteDark: string;
|
|
69
|
+
offWhiteLight: string;
|
|
70
|
+
softPink: string;
|
|
71
|
+
warmYellow: string;
|
|
72
|
+
softYellow: string;
|
|
70
73
|
red10: string;
|
|
71
74
|
red20: string;
|
|
72
75
|
red30: string;
|
|
@@ -110,9 +113,16 @@ declare const getSizeStyles: (theme: {
|
|
|
110
113
|
brandPrimary: string;
|
|
111
114
|
brandPrimaryHover: string;
|
|
112
115
|
brandPrimaryActive: string;
|
|
116
|
+
/**
|
|
117
|
+
* Alignment of the heading
|
|
118
|
+
* @default 'left'
|
|
119
|
+
*/
|
|
113
120
|
brandSecondary: string;
|
|
114
121
|
brandSecondaryHover: string;
|
|
115
122
|
brandSecondaryActive: string;
|
|
123
|
+
brandTertiary: string;
|
|
124
|
+
brandTertiaryHover: string;
|
|
125
|
+
brandTertiaryActive: string;
|
|
116
126
|
negative: string;
|
|
117
127
|
warning: string;
|
|
118
128
|
positive: string;
|
|
@@ -127,7 +137,9 @@ declare const getSizeStyles: (theme: {
|
|
|
127
137
|
negative: string;
|
|
128
138
|
warning: string;
|
|
129
139
|
positive: string;
|
|
130
|
-
|
|
140
|
+
onBrandPrimary: string;
|
|
141
|
+
onBrandSecondary: string;
|
|
142
|
+
onBrandTertiary: string;
|
|
131
143
|
};
|
|
132
144
|
icon: {
|
|
133
145
|
default: string;
|
|
@@ -137,7 +149,9 @@ declare const getSizeStyles: (theme: {
|
|
|
137
149
|
negative: string;
|
|
138
150
|
warning: string;
|
|
139
151
|
success: string;
|
|
140
|
-
|
|
152
|
+
onBrandPrimary: string;
|
|
153
|
+
onBrandSecondary: string;
|
|
154
|
+
onBrandTertiary: string;
|
|
141
155
|
};
|
|
142
156
|
border: {
|
|
143
157
|
default: string;
|
|
@@ -206,6 +220,7 @@ declare const getSizeStyles: (theme: {
|
|
|
206
220
|
fontSize: string;
|
|
207
221
|
lineHeight: string;
|
|
208
222
|
letterSpacing: string;
|
|
223
|
+
fontFeatureSettings: string;
|
|
209
224
|
};
|
|
210
225
|
md: {
|
|
211
226
|
fontFamily: string;
|
|
@@ -213,6 +228,7 @@ declare const getSizeStyles: (theme: {
|
|
|
213
228
|
fontSize: string;
|
|
214
229
|
lineHeight: string;
|
|
215
230
|
letterSpacing: string;
|
|
231
|
+
fontFeatureSettings: string;
|
|
216
232
|
};
|
|
217
233
|
};
|
|
218
234
|
title: {
|
|
@@ -241,15 +257,15 @@ declare const getSizeStyles: (theme: {
|
|
|
241
257
|
fontFamily: string;
|
|
242
258
|
fontWeight: string;
|
|
243
259
|
fontSize: string;
|
|
244
|
-
lineHeight: string;
|
|
260
|
+
lineHeight: string; /**
|
|
261
|
+
* Alignment of the heading
|
|
262
|
+
* @default 'left'
|
|
263
|
+
*/
|
|
245
264
|
letterSpacing: string;
|
|
246
265
|
};
|
|
247
266
|
'2xs': {
|
|
248
267
|
fontFamily: string;
|
|
249
|
-
fontWeight: string;
|
|
250
|
-
* Alignment of the heading
|
|
251
|
-
* @default 'left'
|
|
252
|
-
*/
|
|
268
|
+
fontWeight: string;
|
|
253
269
|
fontSize: string;
|
|
254
270
|
lineHeight: string;
|
|
255
271
|
letterSpacing: string;
|
|
@@ -358,15 +374,15 @@ declare const getSizeStyles: (theme: {
|
|
|
358
374
|
fontFamily: string;
|
|
359
375
|
fontWeight: string;
|
|
360
376
|
fontSize: string;
|
|
361
|
-
lineHeight: string;
|
|
377
|
+
lineHeight: string; /**
|
|
378
|
+
* Alignment of the heading
|
|
379
|
+
* @default 'left'
|
|
380
|
+
*/
|
|
362
381
|
letterSpacing: string;
|
|
363
382
|
};
|
|
364
383
|
'2xs': {
|
|
365
384
|
fontFamily: string;
|
|
366
|
-
fontWeight: string;
|
|
367
|
-
* Alignment of the heading
|
|
368
|
-
* @default 'left'
|
|
369
|
-
*/
|
|
385
|
+
fontWeight: string;
|
|
370
386
|
fontSize: string;
|
|
371
387
|
lineHeight: string;
|
|
372
388
|
letterSpacing: string;
|
|
@@ -51,6 +51,9 @@ declare const getSizeStyles: (theme: {
|
|
|
51
51
|
tooltip: number;
|
|
52
52
|
};
|
|
53
53
|
colors: {
|
|
54
|
+
/**
|
|
55
|
+
* The `svg`'s `viewBox` attribute
|
|
56
|
+
*/
|
|
54
57
|
core: {
|
|
55
58
|
black: string;
|
|
56
59
|
white: string;
|
|
@@ -63,15 +66,18 @@ declare const getSizeStyles: (theme: {
|
|
|
63
66
|
gray30: string;
|
|
64
67
|
gray20: string;
|
|
65
68
|
gray10: string;
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
69
|
+
uiPink: string;
|
|
70
|
+
uiPinkDark: string;
|
|
71
|
+
uiPinkLight: string;
|
|
72
|
+
brown: string;
|
|
73
|
+
brownDark: string;
|
|
74
|
+
brownLight: string;
|
|
75
|
+
offWhite: string;
|
|
76
|
+
offWhiteDark: string;
|
|
77
|
+
offWhiteLight: string;
|
|
78
|
+
softPink: string;
|
|
79
|
+
warmYellow: string;
|
|
80
|
+
softYellow: string;
|
|
75
81
|
red10: string;
|
|
76
82
|
red20: string;
|
|
77
83
|
red30: string;
|
|
@@ -83,7 +89,11 @@ declare const getSizeStyles: (theme: {
|
|
|
83
89
|
red90: string;
|
|
84
90
|
green90: string;
|
|
85
91
|
green80: string;
|
|
86
|
-
green70: string;
|
|
92
|
+
green70: string; /**
|
|
93
|
+
* The size of the icon.
|
|
94
|
+
*
|
|
95
|
+
* @default 16
|
|
96
|
+
*/
|
|
87
97
|
green60: string;
|
|
88
98
|
green50: string;
|
|
89
99
|
green40: string;
|
|
@@ -118,6 +128,9 @@ declare const getSizeStyles: (theme: {
|
|
|
118
128
|
brandSecondary: string;
|
|
119
129
|
brandSecondaryHover: string;
|
|
120
130
|
brandSecondaryActive: string;
|
|
131
|
+
brandTertiary: string;
|
|
132
|
+
brandTertiaryHover: string;
|
|
133
|
+
brandTertiaryActive: string;
|
|
121
134
|
negative: string;
|
|
122
135
|
warning: string;
|
|
123
136
|
positive: string;
|
|
@@ -132,7 +145,9 @@ declare const getSizeStyles: (theme: {
|
|
|
132
145
|
negative: string;
|
|
133
146
|
warning: string;
|
|
134
147
|
positive: string;
|
|
135
|
-
|
|
148
|
+
onBrandPrimary: string;
|
|
149
|
+
onBrandSecondary: string;
|
|
150
|
+
onBrandTertiary: string;
|
|
136
151
|
};
|
|
137
152
|
icon: {
|
|
138
153
|
default: string;
|
|
@@ -142,7 +157,9 @@ declare const getSizeStyles: (theme: {
|
|
|
142
157
|
negative: string;
|
|
143
158
|
warning: string;
|
|
144
159
|
success: string;
|
|
145
|
-
|
|
160
|
+
onBrandPrimary: string;
|
|
161
|
+
onBrandSecondary: string;
|
|
162
|
+
onBrandTertiary: string;
|
|
146
163
|
};
|
|
147
164
|
border: {
|
|
148
165
|
default: string;
|
|
@@ -215,6 +232,7 @@ declare const getSizeStyles: (theme: {
|
|
|
215
232
|
fontSize: string;
|
|
216
233
|
lineHeight: string;
|
|
217
234
|
letterSpacing: string;
|
|
235
|
+
fontFeatureSettings: string;
|
|
218
236
|
};
|
|
219
237
|
md: {
|
|
220
238
|
fontFamily: string;
|
|
@@ -222,6 +240,7 @@ declare const getSizeStyles: (theme: {
|
|
|
222
240
|
fontSize: string;
|
|
223
241
|
lineHeight: string;
|
|
224
242
|
letterSpacing: string;
|
|
243
|
+
fontFeatureSettings: string;
|
|
225
244
|
};
|
|
226
245
|
};
|
|
227
246
|
title: {
|
|
@@ -17,6 +17,7 @@ export { HeartIcon } from './heart';
|
|
|
17
17
|
export { ImageIcon } from './image';
|
|
18
18
|
export { LocationDotIcon } from './location-dot';
|
|
19
19
|
export { MapIcon } from './map';
|
|
20
|
+
export { MinusIcon } from './minus';
|
|
20
21
|
export { PlusIcon } from './plus';
|
|
21
22
|
export { SearchIcon } from './search';
|
|
22
23
|
export { SettingsIcon } from './settings';
|
|
@@ -56,15 +56,18 @@ export declare const getSizeStyles: (theme: {
|
|
|
56
56
|
gray30: string;
|
|
57
57
|
gray20: string;
|
|
58
58
|
gray10: string;
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
59
|
+
uiPink: string;
|
|
60
|
+
uiPinkDark: string;
|
|
61
|
+
uiPinkLight: string;
|
|
62
|
+
brown: string;
|
|
63
|
+
brownDark: string;
|
|
64
|
+
brownLight: string;
|
|
65
|
+
offWhite: string;
|
|
66
|
+
offWhiteDark: string;
|
|
67
|
+
offWhiteLight: string;
|
|
68
|
+
softPink: string;
|
|
69
|
+
warmYellow: string;
|
|
70
|
+
softYellow: string;
|
|
68
71
|
red10: string;
|
|
69
72
|
red20: string;
|
|
70
73
|
red30: string;
|
|
@@ -111,6 +114,9 @@ export declare const getSizeStyles: (theme: {
|
|
|
111
114
|
brandSecondary: string;
|
|
112
115
|
brandSecondaryHover: string;
|
|
113
116
|
brandSecondaryActive: string;
|
|
117
|
+
brandTertiary: string;
|
|
118
|
+
brandTertiaryHover: string;
|
|
119
|
+
brandTertiaryActive: string;
|
|
114
120
|
negative: string;
|
|
115
121
|
warning: string;
|
|
116
122
|
positive: string;
|
|
@@ -125,7 +131,9 @@ export declare const getSizeStyles: (theme: {
|
|
|
125
131
|
negative: string;
|
|
126
132
|
warning: string;
|
|
127
133
|
positive: string;
|
|
128
|
-
|
|
134
|
+
onBrandPrimary: string;
|
|
135
|
+
onBrandSecondary: string;
|
|
136
|
+
onBrandTertiary: string;
|
|
129
137
|
};
|
|
130
138
|
icon: {
|
|
131
139
|
default: string;
|
|
@@ -135,7 +143,9 @@ export declare const getSizeStyles: (theme: {
|
|
|
135
143
|
negative: string;
|
|
136
144
|
warning: string;
|
|
137
145
|
success: string;
|
|
138
|
-
|
|
146
|
+
onBrandPrimary: string;
|
|
147
|
+
onBrandSecondary: string;
|
|
148
|
+
onBrandTertiary: string;
|
|
139
149
|
};
|
|
140
150
|
border: {
|
|
141
151
|
default: string;
|
|
@@ -204,6 +214,7 @@ export declare const getSizeStyles: (theme: {
|
|
|
204
214
|
fontSize: string;
|
|
205
215
|
lineHeight: string;
|
|
206
216
|
letterSpacing: string;
|
|
217
|
+
fontFeatureSettings: string;
|
|
207
218
|
};
|
|
208
219
|
md: {
|
|
209
220
|
fontFamily: string;
|
|
@@ -211,6 +222,7 @@ export declare const getSizeStyles: (theme: {
|
|
|
211
222
|
fontSize: string;
|
|
212
223
|
lineHeight: string;
|
|
213
224
|
letterSpacing: string;
|
|
225
|
+
fontFeatureSettings: string;
|
|
214
226
|
};
|
|
215
227
|
};
|
|
216
228
|
title: {
|
|
@@ -402,15 +414,18 @@ export declare const getVariantStyles: (theme: {
|
|
|
402
414
|
gray30: string;
|
|
403
415
|
gray20: string;
|
|
404
416
|
gray10: string;
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
417
|
+
uiPink: string;
|
|
418
|
+
uiPinkDark: string;
|
|
419
|
+
uiPinkLight: string;
|
|
420
|
+
brown: string;
|
|
421
|
+
brownDark: string;
|
|
422
|
+
brownLight: string;
|
|
423
|
+
offWhite: string;
|
|
424
|
+
offWhiteDark: string;
|
|
425
|
+
offWhiteLight: string;
|
|
426
|
+
softPink: string;
|
|
427
|
+
warmYellow: string;
|
|
428
|
+
softYellow: string;
|
|
414
429
|
red10: string;
|
|
415
430
|
red20: string;
|
|
416
431
|
red30: string;
|
|
@@ -457,6 +472,9 @@ export declare const getVariantStyles: (theme: {
|
|
|
457
472
|
brandSecondary: string;
|
|
458
473
|
brandSecondaryHover: string;
|
|
459
474
|
brandSecondaryActive: string;
|
|
475
|
+
brandTertiary: string;
|
|
476
|
+
brandTertiaryHover: string;
|
|
477
|
+
brandTertiaryActive: string;
|
|
460
478
|
negative: string;
|
|
461
479
|
warning: string;
|
|
462
480
|
positive: string;
|
|
@@ -471,7 +489,9 @@ export declare const getVariantStyles: (theme: {
|
|
|
471
489
|
negative: string;
|
|
472
490
|
warning: string;
|
|
473
491
|
positive: string;
|
|
474
|
-
|
|
492
|
+
onBrandPrimary: string;
|
|
493
|
+
onBrandSecondary: string;
|
|
494
|
+
onBrandTertiary: string;
|
|
475
495
|
};
|
|
476
496
|
icon: {
|
|
477
497
|
default: string;
|
|
@@ -481,7 +501,9 @@ export declare const getVariantStyles: (theme: {
|
|
|
481
501
|
negative: string;
|
|
482
502
|
warning: string;
|
|
483
503
|
success: string;
|
|
484
|
-
|
|
504
|
+
onBrandPrimary: string;
|
|
505
|
+
onBrandSecondary: string;
|
|
506
|
+
onBrandTertiary: string;
|
|
485
507
|
};
|
|
486
508
|
border: {
|
|
487
509
|
default: string;
|
|
@@ -550,6 +572,7 @@ export declare const getVariantStyles: (theme: {
|
|
|
550
572
|
fontSize: string;
|
|
551
573
|
lineHeight: string;
|
|
552
574
|
letterSpacing: string;
|
|
575
|
+
fontFeatureSettings: string;
|
|
553
576
|
};
|
|
554
577
|
md: {
|
|
555
578
|
fontFamily: string;
|
|
@@ -557,6 +580,7 @@ export declare const getVariantStyles: (theme: {
|
|
|
557
580
|
fontSize: string;
|
|
558
581
|
lineHeight: string;
|
|
559
582
|
letterSpacing: string;
|
|
583
|
+
fontFeatureSettings: string;
|
|
560
584
|
};
|
|
561
585
|
};
|
|
562
586
|
title: {
|
|
@@ -677,7 +701,7 @@ export declare const getVariantStyles: (theme: {
|
|
|
677
701
|
primary: {
|
|
678
702
|
background: string;
|
|
679
703
|
color: string;
|
|
680
|
-
|
|
704
|
+
":not([disabled])": {
|
|
681
705
|
'@media(hover: hover)': {
|
|
682
706
|
':hover': {
|
|
683
707
|
background: string;
|
|
@@ -691,7 +715,7 @@ export declare const getVariantStyles: (theme: {
|
|
|
691
715
|
secondary: {
|
|
692
716
|
background: string;
|
|
693
717
|
color: string;
|
|
694
|
-
|
|
718
|
+
":not([disabled])": {
|
|
695
719
|
'@media(hover: hover)': {
|
|
696
720
|
':hover': {
|
|
697
721
|
background: string;
|
|
@@ -705,9 +729,7 @@ export declare const getVariantStyles: (theme: {
|
|
|
705
729
|
tertiary: {
|
|
706
730
|
background: string;
|
|
707
731
|
color: string;
|
|
708
|
-
|
|
709
|
-
borderColor: string;
|
|
710
|
-
':enabled': {
|
|
732
|
+
":not([disabled])": {
|
|
711
733
|
'@media(hover: hover)': {
|
|
712
734
|
':hover': {
|
|
713
735
|
background: string;
|
|
@@ -721,7 +743,7 @@ export declare const getVariantStyles: (theme: {
|
|
|
721
743
|
ghost: {
|
|
722
744
|
background: string;
|
|
723
745
|
color: string;
|
|
724
|
-
|
|
746
|
+
":not([disabled])": {
|
|
725
747
|
'@media(hover: hover)': {
|
|
726
748
|
':hover': {
|
|
727
749
|
background: string;
|