@dxc-technology/halstack-react 0.0.0-d3ac293 → 0.0.0-d3df47e
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/BackgroundColorContext.d.ts +1 -10
- package/BackgroundColorContext.js +4 -21
- package/HalstackContext.d.ts +24 -139
- package/HalstackContext.js +11 -36
- package/README.md +47 -0
- package/accordion/Accordion.d.ts +1 -1
- package/accordion/Accordion.js +26 -83
- package/accordion/Accordion.stories.tsx +2 -114
- package/accordion/Accordion.test.js +18 -33
- package/accordion/types.d.ts +5 -17
- package/accordion-group/AccordionGroup.d.ts +4 -3
- package/accordion-group/AccordionGroup.js +27 -75
- package/accordion-group/AccordionGroup.stories.tsx +78 -77
- package/accordion-group/AccordionGroup.test.js +43 -71
- package/accordion-group/AccordionGroupAccordion.d.ts +4 -0
- package/accordion-group/AccordionGroupAccordion.js +31 -0
- package/accordion-group/types.d.ts +6 -18
- package/action-icon/ActionIcon.d.ts +4 -0
- package/action-icon/ActionIcon.js +47 -0
- package/action-icon/ActionIcon.stories.tsx +41 -0
- package/action-icon/ActionIcon.test.js +64 -0
- package/action-icon/types.d.ts +26 -0
- package/alert/Alert.js +17 -56
- package/alert/Alert.test.js +28 -45
- package/alert/types.d.ts +5 -5
- package/badge/Badge.d.ts +1 -1
- package/badge/Badge.js +142 -42
- package/badge/Badge.stories.tsx +210 -0
- package/badge/Badge.test.js +30 -0
- package/badge/types.d.ts +52 -3
- package/bleed/Bleed.js +13 -21
- package/bleed/Bleed.stories.tsx +1 -0
- package/bleed/types.d.ts +2 -2
- package/box/Box.d.ts +1 -1
- package/box/Box.js +16 -55
- package/box/Box.stories.tsx +25 -53
- package/box/Box.test.js +1 -6
- package/box/types.d.ts +3 -15
- package/bulleted-list/BulletedList.js +19 -53
- package/bulleted-list/BulletedList.stories.tsx +8 -93
- package/bulleted-list/types.d.ts +32 -5
- package/button/Button.d.ts +1 -1
- package/button/Button.js +66 -100
- package/button/Button.stories.tsx +9 -90
- package/button/Button.test.js +19 -16
- package/button/types.d.ts +8 -4
- package/card/Card.d.ts +1 -1
- package/card/Card.js +47 -88
- package/card/Card.stories.tsx +12 -42
- package/card/Card.test.js +10 -21
- package/card/types.d.ts +6 -12
- package/checkbox/Checkbox.js +85 -120
- package/checkbox/Checkbox.stories.tsx +16 -54
- package/checkbox/Checkbox.test.js +107 -63
- package/checkbox/types.d.ts +8 -4
- package/chip/Chip.js +34 -68
- package/chip/Chip.stories.tsx +25 -17
- package/chip/Chip.test.js +15 -28
- package/chip/types.d.ts +4 -4
- package/common/OpenSans.css +68 -80
- package/common/coreTokens.d.ts +237 -0
- package/common/coreTokens.js +184 -0
- package/common/utils.js +2 -8
- package/common/variables.d.ts +24 -282
- package/common/variables.js +860 -1125
- package/container/Container.d.ts +4 -0
- package/container/Container.js +194 -0
- package/container/Container.stories.tsx +214 -0
- package/container/types.d.ts +74 -0
- package/date-input/Calendar.js +15 -59
- package/date-input/DateInput.js +50 -96
- package/date-input/DateInput.stories.tsx +11 -30
- package/date-input/DateInput.test.js +674 -701
- package/date-input/DatePicker.js +11 -42
- package/date-input/Icons.d.ts +6 -6
- package/date-input/Icons.js +6 -23
- package/date-input/YearPicker.js +8 -34
- package/date-input/types.d.ts +27 -21
- package/dialog/Dialog.d.ts +1 -1
- package/dialog/Dialog.js +15 -60
- package/dialog/Dialog.stories.tsx +215 -169
- package/dialog/Dialog.test.js +125 -187
- package/dialog/types.d.ts +18 -26
- package/dropdown/Dropdown.js +39 -93
- package/dropdown/Dropdown.test.js +391 -378
- package/dropdown/DropdownMenu.js +13 -20
- package/dropdown/DropdownMenuItem.js +5 -19
- package/dropdown/types.d.ts +17 -19
- package/file-input/FileInput.js +180 -249
- package/file-input/FileInput.stories.tsx +1 -1
- package/file-input/FileInput.test.js +356 -354
- package/file-input/FileItem.js +14 -41
- package/file-input/types.d.ts +10 -10
- package/flex/Flex.js +27 -39
- package/flex/Flex.stories.tsx +35 -26
- package/flex/types.d.ts +74 -9
- package/footer/Footer.d.ts +1 -1
- package/footer/Footer.js +69 -116
- package/footer/Footer.stories.tsx +38 -95
- package/footer/Footer.test.js +21 -33
- package/footer/Icons.d.ts +3 -2
- package/footer/Icons.js +66 -7
- package/footer/types.d.ts +25 -27
- package/grid/Grid.d.ts +7 -0
- package/grid/Grid.js +76 -0
- package/grid/Grid.stories.tsx +219 -0
- package/grid/types.d.ts +115 -0
- package/grid/types.js +5 -0
- package/header/Header.d.ts +4 -3
- package/header/Header.js +33 -116
- package/header/Header.stories.tsx +7 -71
- package/header/Header.test.js +12 -25
- package/header/Icons.d.ts +2 -2
- package/header/Icons.js +2 -7
- package/header/types.d.ts +5 -20
- package/heading/Heading.js +9 -31
- package/heading/Heading.test.js +70 -87
- package/heading/types.d.ts +7 -7
- package/image/Image.d.ts +4 -0
- package/image/Image.js +70 -0
- package/image/Image.stories.tsx +127 -0
- package/image/types.d.ts +72 -0
- package/image/types.js +5 -0
- package/inset/Inset.js +13 -21
- package/inset/Inset.stories.tsx +2 -1
- package/inset/types.d.ts +2 -2
- package/layout/ApplicationLayout.d.ts +5 -5
- package/layout/ApplicationLayout.js +28 -65
- package/layout/ApplicationLayout.stories.tsx +1 -1
- package/layout/Icons.d.ts +8 -5
- package/layout/Icons.js +51 -59
- package/layout/SidenavContext.d.ts +1 -1
- package/layout/SidenavContext.js +3 -9
- package/layout/types.d.ts +5 -6
- package/link/Link.js +23 -44
- package/link/Link.test.js +23 -41
- package/link/types.d.ts +14 -14
- package/main.d.ts +7 -4
- package/main.js +32 -58
- package/nav-tabs/NavTabs.d.ts +2 -2
- package/nav-tabs/NavTabs.js +22 -54
- package/nav-tabs/NavTabs.stories.tsx +21 -5
- package/nav-tabs/NavTabs.test.js +38 -44
- package/nav-tabs/Tab.js +40 -72
- package/nav-tabs/types.d.ts +14 -15
- package/number-input/NumberInput.d.ts +7 -0
- package/number-input/NumberInput.js +26 -35
- package/number-input/NumberInput.stories.tsx +42 -26
- package/number-input/NumberInput.test.js +700 -412
- package/number-input/types.d.ts +11 -5
- package/package.json +30 -28
- package/paginator/Icons.d.ts +5 -5
- package/paginator/Icons.js +5 -19
- package/paginator/Paginator.js +17 -47
- package/paginator/Paginator.test.js +229 -199
- package/paginator/types.d.ts +3 -3
- package/paragraph/Paragraph.d.ts +2 -3
- package/paragraph/Paragraph.js +3 -19
- package/paragraph/Paragraph.stories.tsx +0 -17
- package/password-input/Icons.d.ts +6 -0
- package/password-input/Icons.js +35 -0
- package/password-input/PasswordInput.js +57 -126
- package/password-input/PasswordInput.stories.tsx +1 -33
- package/password-input/PasswordInput.test.js +157 -140
- package/password-input/types.d.ts +8 -7
- package/progress-bar/ProgressBar.d.ts +2 -2
- package/progress-bar/ProgressBar.js +21 -53
- package/progress-bar/{ProgressBar.stories.jsx → ProgressBar.stories.tsx} +1 -1
- package/progress-bar/ProgressBar.test.js +35 -52
- package/progress-bar/types.d.ts +4 -3
- package/quick-nav/QuickNav.js +4 -27
- package/quick-nav/QuickNav.stories.tsx +1 -1
- package/quick-nav/types.d.ts +10 -10
- package/radio-group/Radio.d.ts +1 -1
- package/radio-group/Radio.js +31 -63
- package/radio-group/RadioGroup.js +45 -93
- package/radio-group/RadioGroup.stories.tsx +10 -10
- package/radio-group/RadioGroup.test.js +504 -470
- package/radio-group/types.d.ts +8 -8
- package/resultset-table/Icons.d.ts +7 -0
- package/{resultsetTable → resultset-table}/Icons.js +1 -5
- package/{resultsetTable → resultset-table}/ResultsetTable.d.ts +1 -1
- package/{resultsetTable → resultset-table}/ResultsetTable.js +33 -63
- package/{resultsetTable → resultset-table}/ResultsetTable.stories.tsx +19 -0
- package/{resultsetTable → resultset-table}/ResultsetTable.test.js +72 -92
- package/{resultsetTable → resultset-table}/types.d.ts +13 -7
- package/resultset-table/types.js +5 -0
- package/select/Icons.d.ts +7 -7
- package/select/Icons.js +1 -5
- package/select/Listbox.js +13 -39
- package/select/Option.js +17 -27
- package/select/Select.js +92 -166
- package/select/Select.stories.tsx +3 -3
- package/select/Select.test.js +1946 -1804
- package/select/types.d.ts +14 -15
- package/sidenav/Icons.d.ts +7 -0
- package/sidenav/Icons.js +47 -0
- package/sidenav/Sidenav.d.ts +2 -2
- package/sidenav/Sidenav.js +80 -150
- package/sidenav/Sidenav.stories.tsx +60 -60
- package/sidenav/Sidenav.test.js +3 -10
- package/sidenav/types.d.ts +31 -28
- package/slider/Slider.js +68 -126
- package/slider/Slider.test.js +107 -103
- package/slider/types.d.ts +4 -4
- package/spinner/Spinner.js +28 -72
- package/spinner/{Spinner.stories.jsx → Spinner.stories.tsx} +28 -28
- package/spinner/Spinner.test.js +25 -34
- package/spinner/types.d.ts +3 -3
- package/status-light/StatusLight.d.ts +4 -0
- package/status-light/StatusLight.js +51 -0
- package/status-light/StatusLight.stories.tsx +74 -0
- package/status-light/StatusLight.test.js +25 -0
- package/status-light/types.d.ts +17 -0
- package/status-light/types.js +5 -0
- package/switch/Switch.js +49 -97
- package/switch/Switch.stories.tsx +0 -34
- package/switch/Switch.test.js +51 -96
- package/switch/types.d.ts +4 -4
- package/table/Table.d.ts +1 -1
- package/table/Table.js +23 -30
- package/table/{Table.stories.jsx → Table.stories.tsx} +98 -0
- package/table/Table.test.js +1 -6
- package/table/types.d.ts +12 -6
- package/tabs/Tab.js +19 -36
- package/tabs/Tabs.js +61 -144
- package/tabs/Tabs.stories.tsx +1 -1
- package/tabs/Tabs.test.js +65 -121
- package/tabs/types.d.ts +19 -19
- package/tag/Tag.js +26 -58
- package/tag/Tag.test.js +19 -30
- package/tag/types.d.ts +7 -7
- package/text-input/Icons.d.ts +5 -5
- package/text-input/Icons.js +1 -5
- package/text-input/Suggestion.js +11 -28
- package/text-input/Suggestions.d.ts +1 -1
- package/text-input/Suggestions.js +15 -65
- package/text-input/TextInput.js +217 -318
- package/text-input/TextInput.stories.tsx +48 -152
- package/text-input/TextInput.test.js +1210 -1194
- package/text-input/types.d.ts +25 -17
- package/textarea/Textarea.js +68 -111
- package/textarea/{Textarea.stories.jsx → Textarea.stories.tsx} +58 -100
- package/textarea/Textarea.test.js +151 -182
- package/textarea/types.d.ts +9 -5
- package/toggle-group/ToggleGroup.d.ts +2 -2
- package/toggle-group/ToggleGroup.js +91 -105
- package/toggle-group/ToggleGroup.stories.tsx +7 -4
- package/toggle-group/ToggleGroup.test.js +68 -87
- package/toggle-group/types.d.ts +26 -17
- package/typography/Typography.js +4 -13
- package/typography/types.d.ts +1 -1
- package/useTheme.d.ts +21 -136
- package/useTheme.js +1 -8
- package/useTranslatedLabels.js +1 -7
- package/utils/BaseTypography.d.ts +2 -2
- package/utils/BaseTypography.js +16 -30
- package/utils/FocusLock.js +28 -43
- package/wizard/Wizard.js +15 -50
- package/wizard/Wizard.test.js +53 -80
- package/wizard/types.d.ts +8 -9
- package/card/ice-cream.jpg +0 -0
- package/number-input/NumberInputContext.d.ts +0 -4
- package/number-input/NumberInputContext.js +0 -19
- package/number-input/numberInputContextTypes.d.ts +0 -19
- package/resultsetTable/Icons.d.ts +0 -7
- package/slider/Slider.stories.tsx +0 -240
- /package/{resultsetTable → action-icon}/types.js +0 -0
- /package/{number-input/numberInputContextTypes.js → container/types.js} +0 -0
package/common/variables.d.ts
CHANGED
|
@@ -1,146 +1,3 @@
|
|
|
1
|
-
export declare const globalTokens: {
|
|
2
|
-
inherit: string;
|
|
3
|
-
transparent: string;
|
|
4
|
-
hal_white: string;
|
|
5
|
-
hal_grey_l_95: string;
|
|
6
|
-
hal_grey_l_90: string;
|
|
7
|
-
hal_grey_l_80: string;
|
|
8
|
-
hal_grey_l_75: string;
|
|
9
|
-
hal_grey_l_60: string;
|
|
10
|
-
hal_grey_s_40: string;
|
|
11
|
-
hal_black: string;
|
|
12
|
-
color_grey_800: string;
|
|
13
|
-
color_grey_600: string;
|
|
14
|
-
color_grey_50: string;
|
|
15
|
-
color_grey_a_100: string;
|
|
16
|
-
color_grey_a_200: string;
|
|
17
|
-
color_grey_a_300: string;
|
|
18
|
-
color_grey_a_800: string;
|
|
19
|
-
color_grey_a_900: string;
|
|
20
|
-
hal_purple_l_95: string;
|
|
21
|
-
hal_purple_l_90: string;
|
|
22
|
-
hal_purple_l_65: string;
|
|
23
|
-
hal_purple_s_38: string;
|
|
24
|
-
hal_purple_d_30: string;
|
|
25
|
-
hal_purple_d_20: string;
|
|
26
|
-
hal_purple_d_70: string;
|
|
27
|
-
color_purple_600: string;
|
|
28
|
-
color_purple_300: string;
|
|
29
|
-
hal_blue_l_95: string;
|
|
30
|
-
hal_blue_l_80: string;
|
|
31
|
-
hal_blue_l_50: string;
|
|
32
|
-
hal_blue_l_45: string;
|
|
33
|
-
hal_blue_s_35: string;
|
|
34
|
-
hal_blue_d_20: string;
|
|
35
|
-
color_blue_200: string;
|
|
36
|
-
color_blue_500: string;
|
|
37
|
-
color_blue_50: string;
|
|
38
|
-
hal_red_l_95: string;
|
|
39
|
-
hal_red_l_80: string;
|
|
40
|
-
hal_red_l_60: string;
|
|
41
|
-
hal_red_s_41: string;
|
|
42
|
-
hal_red_d_30: string;
|
|
43
|
-
hal_red_d_20: string;
|
|
44
|
-
color_red_700: string;
|
|
45
|
-
color_red_50: string;
|
|
46
|
-
color_red_600: string;
|
|
47
|
-
hal_green_l_95: string;
|
|
48
|
-
hal_green_l_80: string;
|
|
49
|
-
hal_green_s_39: string;
|
|
50
|
-
hal_green_d_30: string;
|
|
51
|
-
hal_green_d_20: string;
|
|
52
|
-
hal_yellow_l_95: string;
|
|
53
|
-
hal_yellow_l_80: string;
|
|
54
|
-
hal_yellow_s_57: string;
|
|
55
|
-
hal_yellow_d_40: string;
|
|
56
|
-
hal_yellow_d_30: string;
|
|
57
|
-
hal_orange_s_54: string;
|
|
58
|
-
lightBlack: string;
|
|
59
|
-
yellow: string;
|
|
60
|
-
lightGrey: string;
|
|
61
|
-
lightRed: string;
|
|
62
|
-
lightBlue: string;
|
|
63
|
-
lightYellow: string;
|
|
64
|
-
lightPink: string;
|
|
65
|
-
lightGreen: string;
|
|
66
|
-
blue: string;
|
|
67
|
-
lighterGrey: string;
|
|
68
|
-
violet: string;
|
|
69
|
-
darkBlue: string;
|
|
70
|
-
purple: string;
|
|
71
|
-
mediumPurple: string;
|
|
72
|
-
lightPurple: string;
|
|
73
|
-
lighterPurple: string;
|
|
74
|
-
mediumWhite: string;
|
|
75
|
-
softBlue: string;
|
|
76
|
-
darkWhite: string;
|
|
77
|
-
lighterBlack: string;
|
|
78
|
-
mediumBlack: string;
|
|
79
|
-
mediumGreyBlack: string;
|
|
80
|
-
softGrey: string;
|
|
81
|
-
softBlack: string;
|
|
82
|
-
type_sans: string;
|
|
83
|
-
type_scale_root: string;
|
|
84
|
-
type_scale_08: string;
|
|
85
|
-
type_scale_07: string;
|
|
86
|
-
type_scale_06: string;
|
|
87
|
-
type_scale_05: string;
|
|
88
|
-
type_scale_04: string;
|
|
89
|
-
type_scale_03: string;
|
|
90
|
-
type_scale_02: string;
|
|
91
|
-
type_scale_01: string;
|
|
92
|
-
type_light: string;
|
|
93
|
-
type_regular: string;
|
|
94
|
-
type_semibold: string;
|
|
95
|
-
type_bold: string;
|
|
96
|
-
type_italic: string;
|
|
97
|
-
type_normal: string;
|
|
98
|
-
type_spacing_tight_02: string;
|
|
99
|
-
type_spacing_tight_01: string;
|
|
100
|
-
type_spacing_normal: string;
|
|
101
|
-
type_spacing_wide_01: string;
|
|
102
|
-
type_spacing_wide_02: string;
|
|
103
|
-
type_spacing_wide_03: string;
|
|
104
|
-
type_initial: string;
|
|
105
|
-
type_uppercase: string;
|
|
106
|
-
type_no_line: string;
|
|
107
|
-
type_underline: string;
|
|
108
|
-
type_line_through: string;
|
|
109
|
-
type_leading_compact_03: string;
|
|
110
|
-
type_leading_compact_02: string;
|
|
111
|
-
type_leading_compact_01: string;
|
|
112
|
-
type_leading_normal: string;
|
|
113
|
-
type_leading_loose_01: string;
|
|
114
|
-
type_leading_loose_02: string;
|
|
115
|
-
fontSize10: string;
|
|
116
|
-
spacing_00: string;
|
|
117
|
-
spacing_01: string;
|
|
118
|
-
spacing_02: string;
|
|
119
|
-
spacing_03: string;
|
|
120
|
-
spacing_04: string;
|
|
121
|
-
spacing_05: string;
|
|
122
|
-
spacing_06: string;
|
|
123
|
-
spacing_07: string;
|
|
124
|
-
spacing_08: string;
|
|
125
|
-
spacing_09: string;
|
|
126
|
-
spacing_10: string;
|
|
127
|
-
spacing_11: string;
|
|
128
|
-
spacing_12: string;
|
|
129
|
-
spacing_13: string;
|
|
130
|
-
spacing_14: string;
|
|
131
|
-
border_width_0: string;
|
|
132
|
-
border_width_1: string;
|
|
133
|
-
border_width_2: string;
|
|
134
|
-
border_width_4: string;
|
|
135
|
-
border_radius_none: string;
|
|
136
|
-
border_radius_small: string;
|
|
137
|
-
border_radius_medium: string;
|
|
138
|
-
border_radius_large: string;
|
|
139
|
-
border_radius_full: string;
|
|
140
|
-
border_solid: string;
|
|
141
|
-
border_dashed: string;
|
|
142
|
-
border_none: string;
|
|
143
|
-
};
|
|
144
1
|
export declare const componentTokens: {
|
|
145
2
|
accordion: {
|
|
146
3
|
backgroundColor: string;
|
|
@@ -252,7 +109,6 @@ export declare const componentTokens: {
|
|
|
252
109
|
};
|
|
253
110
|
bulletedList: {
|
|
254
111
|
fontColor: string;
|
|
255
|
-
fontColorOnDark: string;
|
|
256
112
|
bulletIconHeight: string;
|
|
257
113
|
bulletIconWidth: string;
|
|
258
114
|
bulletHeight: string;
|
|
@@ -267,19 +123,12 @@ export declare const componentTokens: {
|
|
|
267
123
|
paddingTop: string;
|
|
268
124
|
paddingBottom: string;
|
|
269
125
|
focusBorderColor: string;
|
|
270
|
-
focusBorderColorOnDark: string;
|
|
271
126
|
primaryBackgroundColor: string;
|
|
272
|
-
primaryBackgroundColorOnDark: string;
|
|
273
127
|
primaryFontColor: string;
|
|
274
|
-
primaryFontColorOnDark: string;
|
|
275
128
|
primaryHoverBackgroundColor: string;
|
|
276
|
-
primaryHoverBackgroundColorOnDark: string;
|
|
277
129
|
primaryActiveBackgroundColor: string;
|
|
278
|
-
primaryActiveBackgroundColorOnDark: string;
|
|
279
130
|
primaryDisabledBackgroundColor: string;
|
|
280
|
-
primaryDisabledBackgroundColorOnDark: string;
|
|
281
131
|
primaryDisabledFontColor: string;
|
|
282
|
-
primaryDisabledFontColorOnDark: string;
|
|
283
132
|
primaryBorderThickness: string;
|
|
284
133
|
primaryBorderStyle: string;
|
|
285
134
|
primaryBorderRadius: string;
|
|
@@ -287,23 +136,14 @@ export declare const componentTokens: {
|
|
|
287
136
|
primaryFontSize: string;
|
|
288
137
|
primaryFontWeight: string;
|
|
289
138
|
secondaryBackgroundColor: string;
|
|
290
|
-
secondaryBackgroundColorOnDark: string;
|
|
291
139
|
secondaryFontColor: string;
|
|
292
|
-
secondaryFontColorOnDark: string;
|
|
293
140
|
secondaryHoverFontColor: string;
|
|
294
|
-
secondaryHoverFontColorOnDark: string;
|
|
295
141
|
secondaryBorderColor: string;
|
|
296
|
-
secondaryBorderColorOnDark: string;
|
|
297
142
|
secondaryHoverBackgroundColor: string;
|
|
298
|
-
secondaryHoverBackgroundColorOnDark: string;
|
|
299
143
|
secondaryActiveBackgroundColor: string;
|
|
300
|
-
secondaryActiveBackgroundColorOnDark: string;
|
|
301
144
|
secondaryDisabledBackgroundColor: string;
|
|
302
|
-
secondaryDisabledBackgroundColorOnDark: string;
|
|
303
145
|
secondaryDisabledFontColor: string;
|
|
304
|
-
secondaryDisabledFontColorOnDark: string;
|
|
305
146
|
secondaryDisabledBorderColor: string;
|
|
306
|
-
secondaryDisabledBorderColorOnDark: string;
|
|
307
147
|
secondaryBorderThickness: string;
|
|
308
148
|
secondaryBorderStyle: string;
|
|
309
149
|
secondaryBorderRadius: string;
|
|
@@ -311,17 +151,11 @@ export declare const componentTokens: {
|
|
|
311
151
|
secondaryFontSize: string;
|
|
312
152
|
secondaryFontWeight: string;
|
|
313
153
|
textBackgroundColor: string;
|
|
314
|
-
textBackgroundColorOnDark: string;
|
|
315
154
|
textFontColor: string;
|
|
316
|
-
textFontColorOnDark: string;
|
|
317
155
|
textHoverBackgroundColor: string;
|
|
318
|
-
textHoverBackgroundColorOnDark: string;
|
|
319
156
|
textActiveBackgroundColor: string;
|
|
320
|
-
textActiveBackgroundColorOnDark: string;
|
|
321
157
|
textDisabledBackgroundColor: string;
|
|
322
|
-
textDisabledBackgroundColorOnDark: string;
|
|
323
158
|
textDisabledFontColor: string;
|
|
324
|
-
textDisabledFontColorOnDark: string;
|
|
325
159
|
textBorderThickness: string;
|
|
326
160
|
textBorderStyle: string;
|
|
327
161
|
textBorderRadius: string;
|
|
@@ -335,30 +169,24 @@ export declare const componentTokens: {
|
|
|
335
169
|
};
|
|
336
170
|
checkbox: {
|
|
337
171
|
backgroundColorChecked: string;
|
|
338
|
-
backgroundColorCheckedOnDark: string;
|
|
339
172
|
hoverBackgroundColorChecked: string;
|
|
340
|
-
hoverBackgroundColorCheckedOnDark: string;
|
|
341
173
|
disabledBackgroundColorChecked: string;
|
|
342
|
-
|
|
174
|
+
readOnlyBackgroundColorChecked: string;
|
|
175
|
+
hoverReadOnlyBackgroundColorChecked: string;
|
|
343
176
|
borderColor: string;
|
|
344
|
-
borderColorOnDark: string;
|
|
345
177
|
hoverBorderColor: string;
|
|
346
|
-
hoverBorderColorOnDark: string;
|
|
347
178
|
disabledBorderColor: string;
|
|
348
|
-
|
|
179
|
+
readOnlyBorderColor: string;
|
|
180
|
+
hoverReadOnlyBorderColor: string;
|
|
349
181
|
checkColor: string;
|
|
350
|
-
checkColorOnDark: string;
|
|
351
182
|
disabledCheckColor: string;
|
|
352
|
-
|
|
183
|
+
readOnlyCheckColor: string;
|
|
353
184
|
fontFamily: string;
|
|
354
185
|
fontSize: string;
|
|
355
186
|
fontWeight: string;
|
|
356
187
|
fontColor: string;
|
|
357
|
-
fontColorOnDark: string;
|
|
358
188
|
disabledFontColor: string;
|
|
359
|
-
disabledFontColorOnDark: string;
|
|
360
189
|
focusColor: string;
|
|
361
|
-
focusColorOnDark: string;
|
|
362
190
|
checkLabelSpacing: string;
|
|
363
191
|
};
|
|
364
192
|
chip: {
|
|
@@ -592,7 +420,6 @@ export declare const componentTokens: {
|
|
|
592
420
|
underlinedThickness: string;
|
|
593
421
|
underlinedStyle: string;
|
|
594
422
|
contentColor: string;
|
|
595
|
-
contentColorOnDark: string;
|
|
596
423
|
};
|
|
597
424
|
heading: {
|
|
598
425
|
level1FontColor: string;
|
|
@@ -631,6 +458,14 @@ export declare const componentTokens: {
|
|
|
631
458
|
level5LineHeight: string;
|
|
632
459
|
level5LetterSpacing: string;
|
|
633
460
|
};
|
|
461
|
+
image: {
|
|
462
|
+
captionFontColor: string;
|
|
463
|
+
captionFontFamily: string;
|
|
464
|
+
captionFontSize: string;
|
|
465
|
+
captionFontStyle: string;
|
|
466
|
+
captionFontWeight: string;
|
|
467
|
+
captionLineHeight: string;
|
|
468
|
+
};
|
|
634
469
|
link: {
|
|
635
470
|
fontColor: string;
|
|
636
471
|
fontFamily: string;
|
|
@@ -642,7 +477,7 @@ export declare const componentTokens: {
|
|
|
642
477
|
underlineSpacing: string;
|
|
643
478
|
underlineStyle: string;
|
|
644
479
|
underlineThickness: string;
|
|
645
|
-
|
|
480
|
+
disabledFontColor: string;
|
|
646
481
|
hoverFontColor: string;
|
|
647
482
|
hoverUnderlineColor: string;
|
|
648
483
|
visitedFontColor: string;
|
|
@@ -691,31 +526,26 @@ export declare const componentTokens: {
|
|
|
691
526
|
};
|
|
692
527
|
paragraph: {
|
|
693
528
|
fontColor: string;
|
|
694
|
-
fontColorOnDark: string;
|
|
695
529
|
display: string;
|
|
696
530
|
fontSize: string;
|
|
697
531
|
fontWeight: string;
|
|
698
532
|
};
|
|
699
533
|
progressBar: {
|
|
700
534
|
trackLineColor: string;
|
|
701
|
-
trackLineColorOnDark: string;
|
|
702
535
|
totalLineColor: string;
|
|
703
536
|
labelFontFamily: string;
|
|
704
537
|
labelFontSize: string;
|
|
705
538
|
labelFontStyle: string;
|
|
706
539
|
labelFontWeight: string;
|
|
707
540
|
labelFontColor: string;
|
|
708
|
-
labelFontColorOnDark: string;
|
|
709
541
|
labelFontTextTransform: string;
|
|
710
542
|
valueFontFamily: string;
|
|
711
543
|
valueFontSize: string;
|
|
712
544
|
valueFontStyle: string;
|
|
713
545
|
valueFontWeight: string;
|
|
714
546
|
valueFontColor: string;
|
|
715
|
-
valueFontColorOnDark: string;
|
|
716
547
|
valueFontTextTransform: string;
|
|
717
548
|
helperTextFontColor: string;
|
|
718
|
-
helperTextFontColorOnDark: string;
|
|
719
549
|
helperTextFontSize: string;
|
|
720
550
|
helperTextFontStyle: string;
|
|
721
551
|
helperTextFontWeight: string;
|
|
@@ -751,9 +581,9 @@ export declare const componentTokens: {
|
|
|
751
581
|
errorRadioInputColor: string;
|
|
752
582
|
hoverErrorRadioInputColor: string;
|
|
753
583
|
activeErrorRadioInputColor: string;
|
|
754
|
-
|
|
755
|
-
|
|
756
|
-
|
|
584
|
+
readOnlyRadioInputColor: string;
|
|
585
|
+
hoverReadOnlyRadioInputColor: string;
|
|
586
|
+
activeReadOnlyRadioInputColor: string;
|
|
757
587
|
disabledRadioInputColor: string;
|
|
758
588
|
disabledLabelFontColor: string;
|
|
759
589
|
disabledHelperTextFontColor: string;
|
|
@@ -893,7 +723,6 @@ export declare const componentTokens: {
|
|
|
893
723
|
slider: {
|
|
894
724
|
fontFamily: string;
|
|
895
725
|
limitValuesFontColor: string;
|
|
896
|
-
limitValuesFontColorOnDark: string;
|
|
897
726
|
limitValuesFontSize: string;
|
|
898
727
|
limitValuesFontStyle: string;
|
|
899
728
|
limitValuesFontWeight: string;
|
|
@@ -910,15 +739,10 @@ export declare const componentTokens: {
|
|
|
910
739
|
helperTextFontWeight: string;
|
|
911
740
|
helperTextLineHeight: string;
|
|
912
741
|
fontColor: string;
|
|
913
|
-
fontColorOnDark: string;
|
|
914
742
|
labelFontColor: string;
|
|
915
|
-
labelFontColorOnDark: string;
|
|
916
743
|
helperTextFontColor: string;
|
|
917
|
-
helperTextFontColorOnDark: string;
|
|
918
744
|
disabledLabelFontColor: string;
|
|
919
|
-
disabledLabelFontColorOnDark: string;
|
|
920
745
|
disabledHelperTextFontColor: string;
|
|
921
|
-
disabledHelperTextFontColorOnDark: string;
|
|
922
746
|
thumbHeight: string;
|
|
923
747
|
thumbWidth: string;
|
|
924
748
|
hoverThumbHeight: string;
|
|
@@ -926,40 +750,28 @@ export declare const componentTokens: {
|
|
|
926
750
|
thumbVerticalPosition: string;
|
|
927
751
|
hoverThumbVerticalPosition: string;
|
|
928
752
|
thumbBackgroundColor: string;
|
|
929
|
-
thumbBackgroundColorOnDark: string;
|
|
930
753
|
hoverThumbScale: string;
|
|
931
754
|
hoverThumbBackgroundColor: string;
|
|
932
|
-
hoverThumbBackgroundColorOnDark: string;
|
|
933
755
|
activeThumbScale: string;
|
|
934
756
|
activeThumbBackgroundColor: string;
|
|
935
|
-
activeThumbBackgroundColorOnDark: string;
|
|
936
757
|
focusThumbBackgroundColor: string;
|
|
937
|
-
focusThumbBackgroundColorOnDark: string;
|
|
938
758
|
tickHeight: string;
|
|
939
759
|
tickWidth: string;
|
|
940
760
|
tickVerticalPosition: string;
|
|
941
761
|
tickBackgroundColor: string;
|
|
942
|
-
tickBackgroundColorOnDark: string;
|
|
943
762
|
trackLineThickness: string;
|
|
944
763
|
trackLineVerticalPosition: string;
|
|
945
764
|
trackLineColor: string;
|
|
946
|
-
trackLineColorOnDark: string;
|
|
947
765
|
totalLineThickness: string;
|
|
948
766
|
totalLineVerticalPosition: string;
|
|
949
767
|
totalLineColor: string;
|
|
950
|
-
totalLineColorOnDark: string;
|
|
951
768
|
disabledThumbVerticalPosition: string;
|
|
952
769
|
disabledThumbBackgroundColor: string;
|
|
953
|
-
disabledThumbBackgroundColorOnDark: string;
|
|
954
770
|
disabledTickVerticalPosition: string;
|
|
955
771
|
disabledTickBackgroundColor: string;
|
|
956
|
-
disabledTickBackgroundColorOnDark: string;
|
|
957
772
|
disabledTrackLineColor: string;
|
|
958
|
-
disabledTrackLineColorOnDark: string;
|
|
959
773
|
disabledTotalLineColor: string;
|
|
960
|
-
disabledTotalLineColorOnDark: string;
|
|
961
774
|
focusColor: string;
|
|
962
|
-
focusColorOnDark: string;
|
|
963
775
|
floorLabelMarginRight: string;
|
|
964
776
|
ceilLabelMarginLeft: string;
|
|
965
777
|
inputMarginLeft: string;
|
|
@@ -973,14 +785,12 @@ export declare const componentTokens: {
|
|
|
973
785
|
labelFontStyle: string;
|
|
974
786
|
labelFontWeight: string;
|
|
975
787
|
labelFontColor: string;
|
|
976
|
-
labelFontColorOnDark: string;
|
|
977
788
|
labelTextAlign: string;
|
|
978
789
|
progressValueFontFamily: string;
|
|
979
790
|
progressValueFontSize: string;
|
|
980
791
|
progressValueFontStyle: string;
|
|
981
792
|
progressValueFontWeight: string;
|
|
982
793
|
progressValueFontColor: string;
|
|
983
|
-
progressValueFontColorOnDark: string;
|
|
984
794
|
progressValueTextAlign: string;
|
|
985
795
|
overlayBackgroundColor: string;
|
|
986
796
|
overlayOpacity: string;
|
|
@@ -999,32 +809,21 @@ export declare const componentTokens: {
|
|
|
999
809
|
};
|
|
1000
810
|
switch: {
|
|
1001
811
|
checkedTrackBackgroundColor: string;
|
|
1002
|
-
checkedTrackBackgroundColorOnDark: string;
|
|
1003
812
|
checkedThumbBackgroundColor: string;
|
|
1004
|
-
checkedThumbBackgroundColorOnDark: string;
|
|
1005
813
|
uncheckedTrackBackgroundColor: string;
|
|
1006
|
-
uncheckedTrackBackgroundColorOnDark: string;
|
|
1007
814
|
uncheckedThumbBackgroundColor: string;
|
|
1008
|
-
uncheckedThumbBackgroundColorOnDark: string;
|
|
1009
815
|
disabledCheckedTrackBackgroundColor: string;
|
|
1010
|
-
disabledCheckedTrackBackgroundColorOnDark: string;
|
|
1011
816
|
disabledCheckedThumbBackgroundColor: string;
|
|
1012
|
-
disabledCheckedThumbBackgroundColorOnDark: string;
|
|
1013
817
|
disabledUncheckedTrackBackgroundColor: string;
|
|
1014
|
-
disabledUncheckedTrackBackgroundColorOnDark: string;
|
|
1015
818
|
disabledUncheckedThumbBackgroundColor: string;
|
|
1016
|
-
disabledUncheckedThumbBackgroundColorOnDark: string;
|
|
1017
819
|
disabledLabelFontColor: string;
|
|
1018
|
-
disabledLabelFontColorOnDark: string;
|
|
1019
820
|
disabledLabelFontStyle: string;
|
|
1020
821
|
labelFontFamily: string;
|
|
1021
822
|
labelFontSize: string;
|
|
1022
823
|
labelFontStyle: string;
|
|
1023
824
|
labelFontWeight: string;
|
|
1024
825
|
labelFontColor: string;
|
|
1025
|
-
labelFontColorOnDark: string;
|
|
1026
826
|
thumbFocusColor: string;
|
|
1027
|
-
thumbFocusColorOnDark: string;
|
|
1028
827
|
thumbHeight: string;
|
|
1029
828
|
thumbWidth: string;
|
|
1030
829
|
thumbShift: string;
|
|
@@ -1084,7 +883,6 @@ export declare const componentTokens: {
|
|
|
1084
883
|
disabledFontColor: string;
|
|
1085
884
|
disabledIconColor: string;
|
|
1086
885
|
disabledFontStyle: string;
|
|
1087
|
-
disabledBadgeBackgroundColor: string;
|
|
1088
886
|
hoverBackgroundColor: string;
|
|
1089
887
|
pressedBackgroundColor: string;
|
|
1090
888
|
pressedFontWeight: string;
|
|
@@ -1092,19 +890,6 @@ export declare const componentTokens: {
|
|
|
1092
890
|
dividerThickness: string;
|
|
1093
891
|
focusOutline: string;
|
|
1094
892
|
scrollButtonsWidth: string;
|
|
1095
|
-
badgeBackgroundColor: string;
|
|
1096
|
-
badgeFontFamily: string;
|
|
1097
|
-
badgeFontSize: string;
|
|
1098
|
-
badgeFontStyle: string;
|
|
1099
|
-
badgeFontWeight: string;
|
|
1100
|
-
badgeFontColor: string;
|
|
1101
|
-
badgeLetterSpacing: string;
|
|
1102
|
-
badgeWidth: string;
|
|
1103
|
-
badgeHeight: string;
|
|
1104
|
-
badgeRadius: string;
|
|
1105
|
-
badgeWidthWithNotificationNumber: string;
|
|
1106
|
-
badgeHeightWithNotificationNumber: string;
|
|
1107
|
-
badgeRadiusWithNotificationNumber: string;
|
|
1108
893
|
};
|
|
1109
894
|
tag: {
|
|
1110
895
|
fontFamily: string;
|
|
@@ -1126,130 +911,87 @@ export declare const componentTokens: {
|
|
|
1126
911
|
textarea: {
|
|
1127
912
|
fontFamily: string;
|
|
1128
913
|
enabledBorderColor: string;
|
|
1129
|
-
enabledBorderColorOnDark: string;
|
|
1130
914
|
hoverBorderColor: string;
|
|
1131
|
-
hoverBorderColorOnDark: string;
|
|
1132
915
|
focusBorderColor: string;
|
|
1133
|
-
focusBorderColorOnDark: string;
|
|
1134
916
|
disabledBorderColor: string;
|
|
1135
|
-
disabledBorderColorOnDark: string;
|
|
1136
917
|
disabledContainerFillColor: string;
|
|
1137
|
-
|
|
918
|
+
readOnlyBorderColor: string;
|
|
919
|
+
hoverReadOnlyBorderColor: string;
|
|
1138
920
|
errorBorderColor: string;
|
|
1139
|
-
errorBorderColorOnDark: string;
|
|
1140
921
|
hoverErrorBorderColor: string;
|
|
1141
|
-
hoverErrorBorderColorOnDark: string;
|
|
1142
922
|
inputMarginTop: string;
|
|
1143
923
|
inputMarginBottom: string;
|
|
1144
924
|
errorMessageColor: string;
|
|
1145
|
-
errorMessageColorOnDark: string;
|
|
1146
925
|
labelFontColor: string;
|
|
1147
|
-
labelFontColorOnDark: string;
|
|
1148
926
|
labelFontSize: string;
|
|
1149
927
|
labelFontStyle: string;
|
|
1150
928
|
labelFontWeight: string;
|
|
1151
929
|
labelLineHeight: string;
|
|
1152
930
|
disabledLabelFontColor: string;
|
|
1153
|
-
disabledLabelFontColorOnDark: string;
|
|
1154
931
|
optionalLabelFontWeight: string;
|
|
1155
932
|
helperTextFontColor: string;
|
|
1156
|
-
helperTextFontColorOnDark: string;
|
|
1157
933
|
helperTextFontSize: string;
|
|
1158
934
|
helperTextFontStyle: string;
|
|
1159
935
|
helperTextFontWeight: string;
|
|
1160
936
|
helperTextLineHeight: string;
|
|
1161
937
|
disabledHelperTextFontColor: string;
|
|
1162
|
-
disabledHelperTextFontColorOnDark: string;
|
|
1163
938
|
placeholderFontColor: string;
|
|
1164
|
-
placeholderFontColorOnDark: string;
|
|
1165
939
|
disabledPlaceholderFontColor: string;
|
|
1166
|
-
disabledPlaceholderFontColorOnDark: string;
|
|
1167
940
|
valueFontColor: string;
|
|
1168
|
-
valueFontColorOnDark: string;
|
|
1169
941
|
valueFontSize: string;
|
|
1170
942
|
valueFontStyle: string;
|
|
1171
943
|
valueFontWeight: string;
|
|
1172
944
|
disabledValueFontColor: string;
|
|
1173
|
-
disabledValueFontColorOnDark: string;
|
|
1174
945
|
};
|
|
1175
946
|
textInput: {
|
|
1176
947
|
fontFamily: string;
|
|
1177
948
|
enabledBorderColor: string;
|
|
1178
|
-
enabledBorderColorOnDark: string;
|
|
1179
949
|
hoverBorderColor: string;
|
|
1180
|
-
hoverBorderColorOnDark: string;
|
|
1181
950
|
focusBorderColor: string;
|
|
1182
|
-
focusBorderColorOnDark: string;
|
|
1183
951
|
disabledBorderColor: string;
|
|
1184
|
-
disabledBorderColorOnDark: string;
|
|
1185
952
|
disabledContainerFillColor: string;
|
|
1186
|
-
|
|
953
|
+
readOnlyBorderColor: string;
|
|
954
|
+
hoverReadOnlyBorderColor: string;
|
|
1187
955
|
errorBorderColor: string;
|
|
1188
|
-
errorBorderColorOnDark: string;
|
|
1189
956
|
hoverErrorBorderColor: string;
|
|
1190
|
-
hoverErrorBorderColorOnDark: string;
|
|
1191
957
|
inputMarginTop: string;
|
|
1192
958
|
inputMarginBottom: string;
|
|
1193
959
|
errorMessageColor: string;
|
|
1194
|
-
errorMessageColorOnDark: string;
|
|
1195
960
|
errorIconColor: string;
|
|
1196
|
-
errorIconColorOnDark: string;
|
|
1197
961
|
labelFontColor: string;
|
|
1198
|
-
labelFontColorOnDark: string;
|
|
1199
962
|
labelFontSize: string;
|
|
1200
963
|
labelFontStyle: string;
|
|
1201
964
|
labelFontWeight: string;
|
|
1202
965
|
labelLineHeight: string;
|
|
1203
966
|
disabledLabelFontColor: string;
|
|
1204
|
-
disabledLabelFontColorOnDark: string;
|
|
1205
967
|
optionalLabelFontWeight: string;
|
|
1206
968
|
helperTextFontColor: string;
|
|
1207
|
-
helperTextFontColorOnDark: string;
|
|
1208
969
|
helperTextFontSize: string;
|
|
1209
970
|
helperTextFontStyle: string;
|
|
1210
971
|
helperTextFontWeight: string;
|
|
1211
972
|
helperTextLineHeight: string;
|
|
1212
973
|
disabledHelperTextFontColor: string;
|
|
1213
|
-
disabledHelperTextFontColorOnDark: string;
|
|
1214
974
|
prefixColor: string;
|
|
1215
|
-
prefixColorOnDark: string;
|
|
1216
975
|
suffixColor: string;
|
|
1217
|
-
suffixColorOnDark: string;
|
|
1218
976
|
disabledPrefixColor: string;
|
|
1219
977
|
disabledSuffixColor: string;
|
|
1220
|
-
disabledPrefixColorOnDark: string;
|
|
1221
|
-
disabledSuffixColorOnDark: string;
|
|
1222
978
|
placeholderFontColor: string;
|
|
1223
|
-
placeholderFontColorOnDark: string;
|
|
1224
979
|
disabledPlaceholderFontColor: string;
|
|
1225
|
-
disabledPlaceholderFontColorOnDark: string;
|
|
1226
980
|
valueFontColor: string;
|
|
1227
|
-
valueFontColorOnDark: string;
|
|
1228
981
|
valueFontSize: string;
|
|
1229
982
|
valueFontStyle: string;
|
|
1230
983
|
valueFontWeight: string;
|
|
1231
984
|
disabledValueFontColor: string;
|
|
1232
|
-
disabledValueFontColorOnDark: string;
|
|
1233
985
|
actionIconColor: string;
|
|
1234
|
-
actionIconColorOnDark: string;
|
|
1235
986
|
disabledActionIconColor: string;
|
|
1236
|
-
disabledActionIconColorOnDark: string;
|
|
1237
987
|
hoverActionIconColor: string;
|
|
1238
|
-
hoverActionIconColorOnDark: string;
|
|
1239
988
|
focusActionIconColor: string;
|
|
1240
|
-
focusActionIconColorOnDark: string;
|
|
1241
989
|
activeActionIconColor: string;
|
|
1242
|
-
activeActionIconColorOnDark: string;
|
|
1243
990
|
actionBackgroundColor: string;
|
|
1244
|
-
actionBackgroundColorOnDark: string;
|
|
1245
991
|
disabledActionBackgroundColor: string;
|
|
1246
|
-
disabledActionBackgroundColorOnDark: string;
|
|
1247
992
|
hoverActionBackgroundColor: string;
|
|
1248
|
-
hoverActionBackgroundColorOnDark: string;
|
|
1249
993
|
focusActionBorderColor: string;
|
|
1250
|
-
focusActionBorderColorOnDark: string;
|
|
1251
994
|
activeActionBackgroundColor: string;
|
|
1252
|
-
activeActionBackgroundColorOnDark: string;
|
|
1253
995
|
listDialogBackgroundColor: string;
|
|
1254
996
|
listDialogBorderColor: string;
|
|
1255
997
|
listOptionDividerColor: string;
|
|
@@ -1375,8 +1117,8 @@ export declare const componentTokens: {
|
|
|
1375
1117
|
focusColor: string;
|
|
1376
1118
|
};
|
|
1377
1119
|
};
|
|
1378
|
-
export
|
|
1379
|
-
export
|
|
1120
|
+
export type AdvancedTheme = typeof componentTokens;
|
|
1121
|
+
export type OpinionatedTheme = {
|
|
1380
1122
|
accordion: {
|
|
1381
1123
|
accentColor: string;
|
|
1382
1124
|
titleFontColor: string;
|
|
@@ -1622,4 +1364,4 @@ export declare const defaultTranslatedComponentLabels: {
|
|
|
1622
1364
|
nextMonthTitle: string;
|
|
1623
1365
|
};
|
|
1624
1366
|
};
|
|
1625
|
-
export
|
|
1367
|
+
export type TranslatedLabels = typeof defaultTranslatedComponentLabels;
|