@dxc-technology/halstack-react 11.0.0 → 12.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.
- package/BackgroundColorContext.d.ts +1 -10
- package/BackgroundColorContext.js +3 -8
- package/HalstackContext.d.ts +32 -142
- package/HalstackContext.js +2 -2
- package/accordion/Accordion.accessibility.test.js +71 -0
- package/accordion/Accordion.js +13 -27
- package/accordion/Accordion.stories.tsx +7 -49
- package/accordion/types.d.ts +1 -1
- package/accordion-group/AccordionGroup.accessibility.test.js +88 -0
- package/accordion-group/AccordionGroup.d.ts +2 -3
- package/accordion-group/AccordionGroup.js +4 -4
- package/accordion-group/AccordionGroup.stories.tsx +23 -23
- package/accordion-group/AccordionGroupAccordion.js +3 -3
- package/accordion-group/AccordionGroupContext.d.ts +3 -0
- package/accordion-group/AccordionGroupContext.js +8 -0
- package/accordion-group/types.d.ts +1 -1
- package/action-icon/ActionIcon.accessibility.test.js +63 -0
- package/action-icon/ActionIcon.d.ts +4 -0
- package/action-icon/ActionIcon.js +48 -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/action-icon/types.js +5 -0
- package/alert/Alert.accessibility.test.js +95 -0
- package/alert/Alert.js +21 -75
- package/badge/Badge.accessibility.test.js +129 -0
- package/badge/Badge.d.ts +1 -1
- package/badge/Badge.js +141 -28
- package/badge/Badge.stories.tsx +210 -0
- package/badge/Badge.test.js +30 -0
- package/badge/types.d.ts +52 -3
- package/box/Box.accessibility.test.js +33 -0
- package/box/Box.js +2 -5
- package/breadcrumbs/Breadcrumbs.accessibility.test.d.ts +1 -0
- package/breadcrumbs/Breadcrumbs.accessibility.test.js +96 -0
- package/breadcrumbs/Breadcrumbs.d.ts +4 -0
- package/breadcrumbs/Breadcrumbs.js +79 -0
- package/breadcrumbs/Breadcrumbs.stories.tsx +194 -0
- package/breadcrumbs/Breadcrumbs.test.d.ts +1 -0
- package/breadcrumbs/Breadcrumbs.test.js +169 -0
- package/breadcrumbs/Item.d.ts +4 -0
- package/breadcrumbs/Item.js +52 -0
- package/breadcrumbs/dropdownTheme.d.ts +53 -0
- package/breadcrumbs/dropdownTheme.js +62 -0
- package/breadcrumbs/types.d.ts +16 -0
- package/breadcrumbs/types.js +5 -0
- package/bulleted-list/BulletedList.accessibility.test.js +119 -0
- package/bulleted-list/BulletedList.js +16 -23
- package/bulleted-list/BulletedList.stories.tsx +1 -2
- package/button/Button.accessibility.test.js +127 -0
- package/button/Button.js +16 -16
- package/button/Button.stories.tsx +34 -53
- package/button/Button.test.js +3 -1
- package/button/types.d.ts +1 -1
- package/card/Card.accessibility.test.js +36 -0
- package/card/Card.js +3 -2
- package/checkbox/Checkbox.accessibility.test.js +87 -0
- package/checkbox/Checkbox.js +31 -36
- package/chip/Chip.accessibility.test.js +67 -0
- package/chip/Chip.js +11 -6
- package/chip/Chip.stories.tsx +10 -25
- package/chip/Chip.test.js +4 -4
- package/common/coreTokens.d.ts +105 -14
- package/common/coreTokens.js +40 -22
- package/common/variables.d.ts +31 -138
- package/common/variables.js +103 -210
- 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/container/types.js +5 -0
- package/contextual-menu/ContextualMenu.accessibility.test.js +97 -0
- package/contextual-menu/ContextualMenu.d.ts +5 -0
- package/contextual-menu/ContextualMenu.js +88 -0
- package/contextual-menu/ContextualMenu.stories.tsx +232 -0
- package/contextual-menu/ContextualMenu.test.js +205 -0
- package/contextual-menu/GroupItem.d.ts +4 -0
- package/contextual-menu/GroupItem.js +67 -0
- package/contextual-menu/ItemAction.d.ts +4 -0
- package/contextual-menu/ItemAction.js +51 -0
- package/contextual-menu/MenuItem.d.ts +4 -0
- package/contextual-menu/MenuItem.js +29 -0
- package/contextual-menu/SingleItem.d.ts +4 -0
- package/contextual-menu/SingleItem.js +38 -0
- package/contextual-menu/types.d.ts +58 -0
- package/contextual-menu/types.js +5 -0
- package/date-input/Calendar.js +1 -1
- package/date-input/DateInput.accessibility.test.js +228 -0
- package/date-input/DateInput.js +4 -5
- package/date-input/DateInput.stories.tsx +15 -8
- package/date-input/DatePicker.js +13 -7
- package/date-input/YearPicker.js +1 -1
- package/date-input/types.d.ts +2 -2
- package/dialog/Dialog.accessibility.test.js +69 -0
- package/dialog/Dialog.js +11 -25
- package/dialog/Dialog.stories.tsx +176 -0
- package/dialog/Dialog.test.js +1 -1
- package/divider/Divider.accessibility.test.js +33 -0
- package/divider/Divider.d.ts +4 -0
- package/divider/Divider.js +36 -0
- package/divider/Divider.stories.tsx +223 -0
- package/divider/Divider.test.js +38 -0
- package/divider/types.d.ts +21 -0
- package/divider/types.js +5 -0
- package/dropdown/Dropdown.accessibility.test.js +180 -0
- package/dropdown/Dropdown.js +26 -39
- package/dropdown/Dropdown.stories.tsx +15 -26
- package/dropdown/Dropdown.test.js +18 -18
- package/dropdown/DropdownMenu.js +4 -4
- package/dropdown/DropdownMenuItem.js +8 -4
- package/dropdown/types.d.ts +3 -5
- package/file-input/FileInput.accessibility.test.js +160 -0
- package/file-input/FileInput.js +126 -141
- package/file-input/FileInput.test.js +84 -110
- package/file-input/FileItem.js +18 -28
- package/file-input/types.d.ts +1 -1
- package/footer/Footer.accessibility.test.js +125 -0
- package/footer/Footer.d.ts +1 -1
- package/footer/Footer.js +36 -31
- package/footer/Footer.stories.tsx +58 -2
- package/footer/Icons.d.ts +1 -0
- package/footer/Icons.js +52 -16
- package/footer/types.d.ts +8 -8
- package/header/Header.accessibility.test.js +93 -0
- package/header/Header.js +20 -41
- package/header/Header.stories.tsx +16 -0
- package/header/Icons.js +1 -6
- package/header/types.d.ts +4 -3
- package/heading/Heading.accessibility.test.js +33 -0
- package/heading/Heading.js +1 -1
- package/icon/Icon.accessibility.test.js +30 -0
- package/icon/Icon.d.ts +4 -0
- package/icon/Icon.js +33 -0
- package/icon/Icon.stories.tsx +28 -0
- package/icon/types.d.ts +4 -0
- package/icon/types.js +5 -0
- package/image/Image.accessibility.test.js +56 -0
- package/image/Image.js +1 -1
- package/image/Image.stories.tsx +3 -1
- package/layout/ApplicationLayout.d.ts +1 -1
- package/layout/ApplicationLayout.js +10 -7
- package/layout/Icons.d.ts +0 -1
- package/layout/Icons.js +1 -11
- package/link/Link.accessibility.test.js +108 -0
- package/link/Link.js +8 -6
- package/link/Link.stories.tsx +4 -4
- package/link/types.d.ts +1 -1
- package/main.d.ts +7 -3
- package/main.js +37 -9
- package/nav-tabs/NavTabs.accessibility.test.js +44 -0
- package/nav-tabs/NavTabs.d.ts +1 -2
- package/nav-tabs/NavTabs.js +10 -7
- package/nav-tabs/NavTabs.stories.tsx +29 -24
- package/nav-tabs/NavTabs.test.js +11 -9
- package/nav-tabs/NavTabsContext.d.ts +3 -0
- package/nav-tabs/NavTabsContext.js +8 -0
- package/nav-tabs/Tab.js +23 -23
- package/nav-tabs/types.d.ts +1 -1
- package/number-input/NumberInput.accessibility.test.js +228 -0
- package/number-input/NumberInput.d.ts +0 -7
- package/number-input/NumberInput.js +24 -5
- package/number-input/NumberInput.test.js +165 -6
- package/number-input/NumberInputContext.d.ts +3 -0
- package/number-input/NumberInputContext.js +8 -0
- package/number-input/types.d.ts +6 -0
- package/package.json +16 -14
- package/paginator/Paginator.accessibility.test.js +79 -0
- package/paginator/Paginator.js +14 -14
- package/paragraph/Paragraph.accessibility.test.js +28 -0
- package/paragraph/Paragraph.js +2 -7
- package/password-input/PasswordInput.accessibility.test.js +153 -0
- package/password-input/PasswordInput.js +7 -7
- package/password-input/PasswordInput.stories.tsx +0 -1
- package/password-input/PasswordInput.test.js +4 -4
- package/progress-bar/ProgressBar.accessibility.test.js +35 -0
- package/progress-bar/ProgressBar.js +11 -15
- package/quick-nav/QuickNav.accessibility.test.js +57 -0
- package/quick-nav/QuickNav.js +1 -1
- package/radio-group/Radio.js +1 -1
- package/radio-group/RadioGroup.accessibility.test.js +97 -0
- package/radio-group/RadioGroup.js +3 -2
- package/resultset-table/ResultsetTable.accessibility.test.js +285 -0
- package/resultset-table/ResultsetTable.d.ts +4 -1
- package/resultset-table/ResultsetTable.js +25 -13
- package/resultset-table/ResultsetTable.stories.tsx +118 -5
- package/resultset-table/ResultsetTable.test.js +76 -0
- package/resultset-table/types.d.ts +40 -7
- package/select/Listbox.js +28 -16
- package/select/Option.js +19 -10
- package/select/Select.accessibility.test.js +228 -0
- package/select/Select.js +57 -37
- package/select/Select.stories.tsx +59 -111
- package/select/Select.test.js +387 -456
- package/select/types.d.ts +3 -3
- package/sidenav/Sidenav.accessibility.test.js +59 -0
- package/sidenav/Sidenav.js +21 -19
- package/sidenav/Sidenav.stories.tsx +4 -9
- package/sidenav/types.d.ts +2 -2
- package/slider/Slider.accessibility.test.js +104 -0
- package/slider/Slider.js +40 -48
- package/spinner/Spinner.accessibility.test.js +96 -0
- package/spinner/Spinner.js +12 -16
- package/status-light/StatusLight.accessibility.test.js +157 -0
- 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.accessibility.test.js +98 -0
- package/switch/Switch.js +24 -29
- package/switch/Switch.stories.tsx +12 -0
- package/table/DropdownTheme.js +62 -0
- package/table/Table.accessibility.test.js +93 -0
- package/table/Table.d.ts +6 -2
- package/table/Table.js +74 -12
- package/table/Table.stories.tsx +309 -2
- package/table/Table.test.js +92 -0
- package/table/types.d.ts +28 -0
- package/tabs/Tab.js +13 -9
- package/tabs/Tabs.accessibility.test.js +56 -0
- package/tabs/Tabs.js +12 -24
- package/tabs/Tabs.stories.tsx +8 -4
- package/tabs/Tabs.test.js +19 -37
- package/tabs/types.d.ts +2 -2
- package/tag/Tag.accessibility.test.js +69 -0
- package/tag/Tag.js +7 -7
- package/tag/Tag.stories.tsx +4 -7
- package/tag/Tag.test.js +4 -12
- package/tag/types.d.ts +2 -2
- package/text-input/Suggestion.js +1 -1
- package/text-input/Suggestions.js +19 -14
- package/text-input/TextInput.accessibility.test.js +321 -0
- package/text-input/TextInput.js +84 -105
- package/text-input/TextInput.stories.tsx +17 -8
- package/text-input/TextInput.test.js +96 -79
- package/textarea/Textarea.accessibility.test.js +155 -0
- package/textarea/Textarea.js +12 -17
- package/textarea/Textarea.stories.tsx +0 -1
- package/toggle-group/ToggleGroup.accessibility.test.js +107 -0
- package/toggle-group/ToggleGroup.js +6 -8
- package/toggle-group/ToggleGroup.stories.tsx +3 -3
- package/toggle-group/types.d.ts +2 -2
- package/typography/Typography.accessibility.test.js +339 -0
- package/useTheme.d.ts +31 -138
- package/utils/BaseTypography.js +1 -1
- package/utils/FocusLock.js +16 -6
- package/wizard/Wizard.accessibility.test.js +55 -0
- package/wizard/Wizard.js +14 -25
- package/wizard/Wizard.stories.tsx +19 -0
- package/wizard/types.d.ts +2 -2
- package/common/OpenSans.css +0 -69
- package/common/fonts/OpenSans-Bold.ttf +0 -0
- package/common/fonts/OpenSans-BoldItalic.ttf +0 -0
- package/common/fonts/OpenSans-ExtraBold.ttf +0 -0
- package/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
- package/common/fonts/OpenSans-Italic.ttf +0 -0
- package/common/fonts/OpenSans-Light.ttf +0 -0
- package/common/fonts/OpenSans-LightItalic.ttf +0 -0
- package/common/fonts/OpenSans-Regular.ttf +0 -0
- package/common/fonts/OpenSans-SemiBold.ttf +0 -0
- package/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
- package/date-input/Icons.d.ts +0 -6
- package/date-input/Icons.js +0 -58
- package/paginator/Icons.d.ts +0 -5
- package/paginator/Icons.js +0 -40
- package/password-input/Icons.d.ts +0 -6
- package/password-input/Icons.js +0 -35
- package/select/Icons.d.ts +0 -10
- package/select/Icons.js +0 -89
- package/sidenav/Icons.d.ts +0 -7
- package/sidenav/Icons.js +0 -47
- package/text-input/Icons.d.ts +0 -8
- package/text-input/Icons.js +0 -56
- /package/{layout → sidenav}/SidenavContext.d.ts +0 -0
- /package/{layout → sidenav}/SidenavContext.js +0 -0
|
@@ -1,10 +1 @@
|
|
|
1
|
-
|
|
2
|
-
export type BackgroundColors = "dark" | "light";
|
|
3
|
-
declare const BackgroundColorContext: React.Context<BackgroundColors>;
|
|
4
|
-
type BackgroundColorProviderPropsType = {
|
|
5
|
-
color: string;
|
|
6
|
-
children: React.ReactNode;
|
|
7
|
-
};
|
|
8
|
-
declare const BackgroundColorProvider: ({ color, children }: BackgroundColorProviderPropsType) => JSX.Element;
|
|
9
|
-
export default BackgroundColorContext;
|
|
10
|
-
export { BackgroundColorProvider };
|
|
1
|
+
export {};
|
|
@@ -2,14 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
4
|
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports["default"] = exports.BackgroundColorProvider = void 0;
|
|
9
5
|
var _react = _interopRequireWildcard(require("react"));
|
|
10
6
|
var _color = _interopRequireDefault(require("color"));
|
|
11
7
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
12
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u &&
|
|
8
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
13
9
|
var BackgroundColorContext = /*#__PURE__*/_react["default"].createContext(null);
|
|
14
10
|
var getColorType = function getColorType(hexColor) {
|
|
15
11
|
try {
|
|
@@ -22,7 +18,7 @@ var getColorType = function getColorType(hexColor) {
|
|
|
22
18
|
return "light";
|
|
23
19
|
}
|
|
24
20
|
};
|
|
25
|
-
var BackgroundColorProvider =
|
|
21
|
+
var BackgroundColorProvider = function BackgroundColorProvider(_ref) {
|
|
26
22
|
var color = _ref.color,
|
|
27
23
|
children = _ref.children;
|
|
28
24
|
var colorType = (0, _react.useMemo)(function () {
|
|
@@ -31,5 +27,4 @@ var BackgroundColorProvider = exports.BackgroundColorProvider = function Backgro
|
|
|
31
27
|
return /*#__PURE__*/_react["default"].createElement(BackgroundColorContext.Provider, {
|
|
32
28
|
value: colorType
|
|
33
29
|
}, children);
|
|
34
|
-
};
|
|
35
|
-
var _default = exports["default"] = BackgroundColorContext;
|
|
30
|
+
};
|
package/HalstackContext.d.ts
CHANGED
|
@@ -38,7 +38,7 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
38
38
|
disabledIconColor: string;
|
|
39
39
|
iconSize: string;
|
|
40
40
|
iconMarginLeft: string;
|
|
41
|
-
|
|
41
|
+
iconMarginRight: string;
|
|
42
42
|
accordionGroupSeparatorBorderColor: string;
|
|
43
43
|
accordionGroupSeparatorBorderThickness: string;
|
|
44
44
|
accordionGroupSeparatorBorderRadius: string;
|
|
@@ -111,7 +111,6 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
111
111
|
};
|
|
112
112
|
bulletedList: {
|
|
113
113
|
fontColor: string;
|
|
114
|
-
fontColorOnDark: string;
|
|
115
114
|
bulletIconHeight: string;
|
|
116
115
|
bulletIconWidth: string;
|
|
117
116
|
bulletHeight: string;
|
|
@@ -126,19 +125,12 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
126
125
|
paddingTop: string;
|
|
127
126
|
paddingBottom: string;
|
|
128
127
|
focusBorderColor: string;
|
|
129
|
-
focusBorderColorOnDark: string;
|
|
130
128
|
primaryBackgroundColor: string;
|
|
131
|
-
primaryBackgroundColorOnDark: string;
|
|
132
129
|
primaryFontColor: string;
|
|
133
|
-
primaryFontColorOnDark: string;
|
|
134
130
|
primaryHoverBackgroundColor: string;
|
|
135
|
-
primaryHoverBackgroundColorOnDark: string;
|
|
136
131
|
primaryActiveBackgroundColor: string;
|
|
137
|
-
primaryActiveBackgroundColorOnDark: string;
|
|
138
132
|
primaryDisabledBackgroundColor: string;
|
|
139
|
-
primaryDisabledBackgroundColorOnDark: string;
|
|
140
133
|
primaryDisabledFontColor: string;
|
|
141
|
-
primaryDisabledFontColorOnDark: string;
|
|
142
134
|
primaryBorderThickness: string;
|
|
143
135
|
primaryBorderStyle: string;
|
|
144
136
|
primaryBorderRadius: string;
|
|
@@ -146,23 +138,14 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
146
138
|
primaryFontSize: string;
|
|
147
139
|
primaryFontWeight: string;
|
|
148
140
|
secondaryBackgroundColor: string;
|
|
149
|
-
secondaryBackgroundColorOnDark: string;
|
|
150
141
|
secondaryFontColor: string;
|
|
151
|
-
secondaryFontColorOnDark: string;
|
|
152
142
|
secondaryHoverFontColor: string;
|
|
153
|
-
secondaryHoverFontColorOnDark: string;
|
|
154
143
|
secondaryBorderColor: string;
|
|
155
|
-
secondaryBorderColorOnDark: string;
|
|
156
144
|
secondaryHoverBackgroundColor: string;
|
|
157
|
-
secondaryHoverBackgroundColorOnDark: string;
|
|
158
145
|
secondaryActiveBackgroundColor: string;
|
|
159
|
-
secondaryActiveBackgroundColorOnDark: string;
|
|
160
146
|
secondaryDisabledBackgroundColor: string;
|
|
161
|
-
secondaryDisabledBackgroundColorOnDark: string;
|
|
162
147
|
secondaryDisabledFontColor: string;
|
|
163
|
-
secondaryDisabledFontColorOnDark: string;
|
|
164
148
|
secondaryDisabledBorderColor: string;
|
|
165
|
-
secondaryDisabledBorderColorOnDark: string;
|
|
166
149
|
secondaryBorderThickness: string;
|
|
167
150
|
secondaryBorderStyle: string;
|
|
168
151
|
secondaryBorderRadius: string;
|
|
@@ -170,17 +153,11 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
170
153
|
secondaryFontSize: string;
|
|
171
154
|
secondaryFontWeight: string;
|
|
172
155
|
textBackgroundColor: string;
|
|
173
|
-
textBackgroundColorOnDark: string;
|
|
174
156
|
textFontColor: string;
|
|
175
|
-
textFontColorOnDark: string;
|
|
176
157
|
textHoverBackgroundColor: string;
|
|
177
|
-
textHoverBackgroundColorOnDark: string;
|
|
178
158
|
textActiveBackgroundColor: string;
|
|
179
|
-
textActiveBackgroundColorOnDark: string;
|
|
180
159
|
textDisabledBackgroundColor: string;
|
|
181
|
-
textDisabledBackgroundColorOnDark: string;
|
|
182
160
|
textDisabledFontColor: string;
|
|
183
|
-
textDisabledFontColorOnDark: string;
|
|
184
161
|
textBorderThickness: string;
|
|
185
162
|
textBorderStyle: string;
|
|
186
163
|
textBorderRadius: string;
|
|
@@ -194,35 +171,24 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
194
171
|
};
|
|
195
172
|
checkbox: {
|
|
196
173
|
backgroundColorChecked: string;
|
|
197
|
-
backgroundColorCheckedOnDark: string;
|
|
198
174
|
hoverBackgroundColorChecked: string;
|
|
199
|
-
hoverBackgroundColorCheckedOnDark: string;
|
|
200
175
|
disabledBackgroundColorChecked: string;
|
|
201
|
-
disabledBackgroundColorCheckedOnDark: string;
|
|
202
176
|
readOnlyBackgroundColorChecked: string;
|
|
203
177
|
hoverReadOnlyBackgroundColorChecked: string;
|
|
204
178
|
borderColor: string;
|
|
205
|
-
borderColorOnDark: string;
|
|
206
179
|
hoverBorderColor: string;
|
|
207
|
-
hoverBorderColorOnDark: string;
|
|
208
180
|
disabledBorderColor: string;
|
|
209
|
-
disabledBorderColorOnDark: string;
|
|
210
181
|
readOnlyBorderColor: string;
|
|
211
182
|
hoverReadOnlyBorderColor: string;
|
|
212
183
|
checkColor: string;
|
|
213
|
-
checkColorOnDark: string;
|
|
214
184
|
disabledCheckColor: string;
|
|
215
|
-
disabledCheckColorOnDark: string;
|
|
216
185
|
readOnlyCheckColor: string;
|
|
217
186
|
fontFamily: string;
|
|
218
187
|
fontSize: string;
|
|
219
188
|
fontWeight: string;
|
|
220
189
|
fontColor: string;
|
|
221
|
-
fontColorOnDark: string;
|
|
222
190
|
disabledFontColor: string;
|
|
223
|
-
disabledFontColorOnDark: string;
|
|
224
191
|
focusColor: string;
|
|
225
|
-
focusColorOnDark: string;
|
|
226
192
|
checkLabelSpacing: string;
|
|
227
193
|
};
|
|
228
194
|
chip: {
|
|
@@ -287,8 +253,7 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
287
253
|
dialog: {
|
|
288
254
|
overlayColor: string;
|
|
289
255
|
backgroundColor: string;
|
|
290
|
-
|
|
291
|
-
closeIconHeight: string;
|
|
256
|
+
closeIconSize: string;
|
|
292
257
|
closeIconTopPosition: string;
|
|
293
258
|
closeIconRightPosition: string;
|
|
294
259
|
closeIconBackgroundColor: string;
|
|
@@ -318,9 +283,14 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
318
283
|
buttonPaddingBottom: string;
|
|
319
284
|
buttonPaddingLeft: string;
|
|
320
285
|
buttonPaddingRight: string;
|
|
286
|
+
buttonHeight: string;
|
|
287
|
+
buttonBorderRadius: string;
|
|
288
|
+
buttonBorderStyle: string;
|
|
289
|
+
buttonBorderThickness: string;
|
|
290
|
+
buttonBorderColor: string;
|
|
321
291
|
disabledColor: string;
|
|
322
292
|
disabledButtonBackgroundColor: string;
|
|
323
|
-
|
|
293
|
+
disabledButtonBorderColor: string;
|
|
324
294
|
optionBackgroundColor: string;
|
|
325
295
|
hoverOptionBackgroundColor: string;
|
|
326
296
|
activeOptionBackgroundColor: string;
|
|
@@ -360,7 +330,6 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
360
330
|
focusDropBorderColor: string;
|
|
361
331
|
disabledDropBorderColor: string;
|
|
362
332
|
dragoverDropBackgroundColor: string;
|
|
363
|
-
activeFileItemIconBackgrounColor: string;
|
|
364
333
|
errorFileItemBorderColor: string;
|
|
365
334
|
errorFileItemBackgroundColor: string;
|
|
366
335
|
errorFilePreviewBackgroundColor: string;
|
|
@@ -456,7 +425,6 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
456
425
|
underlinedThickness: string;
|
|
457
426
|
underlinedStyle: string;
|
|
458
427
|
contentColor: string;
|
|
459
|
-
contentColorOnDark: string;
|
|
460
428
|
};
|
|
461
429
|
heading: {
|
|
462
430
|
level1FontColor: string;
|
|
@@ -527,10 +495,7 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
527
495
|
selectedBackgroundColor: string;
|
|
528
496
|
unselectedBackgroundColor: string;
|
|
529
497
|
hoverBackgroundColor: string;
|
|
530
|
-
pressedBackgroundColor: string;
|
|
531
|
-
* This type is used to allow partial themes and labels objects to be passed to the HalstackProvider.
|
|
532
|
-
* This is an extension of the already existing Partial type, which only allows one level of partiality.
|
|
533
|
-
*/
|
|
498
|
+
pressedBackgroundColor: string;
|
|
534
499
|
selectedFontColor: string;
|
|
535
500
|
unselectedFontColor: string;
|
|
536
501
|
disabledFontColor: string;
|
|
@@ -565,32 +530,27 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
565
530
|
totalItemsContainerMarginLeft: string;
|
|
566
531
|
};
|
|
567
532
|
paragraph: {
|
|
568
|
-
fontColor: string;
|
|
569
|
-
fontColorOnDark: string;
|
|
570
533
|
display: string;
|
|
534
|
+
fontColor: string;
|
|
571
535
|
fontSize: string;
|
|
572
536
|
fontWeight: string;
|
|
573
537
|
};
|
|
574
538
|
progressBar: {
|
|
575
539
|
trackLineColor: string;
|
|
576
|
-
trackLineColorOnDark: string;
|
|
577
540
|
totalLineColor: string;
|
|
578
541
|
labelFontFamily: string;
|
|
579
542
|
labelFontSize: string;
|
|
580
543
|
labelFontStyle: string;
|
|
581
544
|
labelFontWeight: string;
|
|
582
545
|
labelFontColor: string;
|
|
583
|
-
labelFontColorOnDark: string;
|
|
584
546
|
labelFontTextTransform: string;
|
|
585
547
|
valueFontFamily: string;
|
|
586
548
|
valueFontSize: string;
|
|
587
549
|
valueFontStyle: string;
|
|
588
550
|
valueFontWeight: string;
|
|
589
551
|
valueFontColor: string;
|
|
590
|
-
valueFontColorOnDark: string;
|
|
591
552
|
valueFontTextTransform: string;
|
|
592
553
|
helperTextFontColor: string;
|
|
593
|
-
helperTextFontColorOnDark: string;
|
|
594
554
|
helperTextFontSize: string;
|
|
595
555
|
helperTextFontStyle: string;
|
|
596
556
|
helperTextFontWeight: string;
|
|
@@ -768,7 +728,6 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
768
728
|
slider: {
|
|
769
729
|
fontFamily: string;
|
|
770
730
|
limitValuesFontColor: string;
|
|
771
|
-
limitValuesFontColorOnDark: string;
|
|
772
731
|
limitValuesFontSize: string;
|
|
773
732
|
limitValuesFontStyle: string;
|
|
774
733
|
limitValuesFontWeight: string;
|
|
@@ -785,15 +744,10 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
785
744
|
helperTextFontWeight: string;
|
|
786
745
|
helperTextLineHeight: string;
|
|
787
746
|
fontColor: string;
|
|
788
|
-
fontColorOnDark: string;
|
|
789
747
|
labelFontColor: string;
|
|
790
|
-
labelFontColorOnDark: string;
|
|
791
748
|
helperTextFontColor: string;
|
|
792
|
-
helperTextFontColorOnDark: string;
|
|
793
749
|
disabledLabelFontColor: string;
|
|
794
|
-
disabledLabelFontColorOnDark: string;
|
|
795
750
|
disabledHelperTextFontColor: string;
|
|
796
|
-
disabledHelperTextFontColorOnDark: string;
|
|
797
751
|
thumbHeight: string;
|
|
798
752
|
thumbWidth: string;
|
|
799
753
|
hoverThumbHeight: string;
|
|
@@ -801,40 +755,28 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
801
755
|
thumbVerticalPosition: string;
|
|
802
756
|
hoverThumbVerticalPosition: string;
|
|
803
757
|
thumbBackgroundColor: string;
|
|
804
|
-
thumbBackgroundColorOnDark: string;
|
|
805
758
|
hoverThumbScale: string;
|
|
806
759
|
hoverThumbBackgroundColor: string;
|
|
807
|
-
hoverThumbBackgroundColorOnDark: string;
|
|
808
760
|
activeThumbScale: string;
|
|
809
761
|
activeThumbBackgroundColor: string;
|
|
810
|
-
activeThumbBackgroundColorOnDark: string;
|
|
811
762
|
focusThumbBackgroundColor: string;
|
|
812
|
-
focusThumbBackgroundColorOnDark: string;
|
|
813
763
|
tickHeight: string;
|
|
814
764
|
tickWidth: string;
|
|
815
765
|
tickVerticalPosition: string;
|
|
816
766
|
tickBackgroundColor: string;
|
|
817
|
-
tickBackgroundColorOnDark: string;
|
|
818
767
|
trackLineThickness: string;
|
|
819
768
|
trackLineVerticalPosition: string;
|
|
820
769
|
trackLineColor: string;
|
|
821
|
-
trackLineColorOnDark: string;
|
|
822
770
|
totalLineThickness: string;
|
|
823
771
|
totalLineVerticalPosition: string;
|
|
824
772
|
totalLineColor: string;
|
|
825
|
-
totalLineColorOnDark: string;
|
|
826
773
|
disabledThumbVerticalPosition: string;
|
|
827
774
|
disabledThumbBackgroundColor: string;
|
|
828
|
-
disabledThumbBackgroundColorOnDark: string;
|
|
829
775
|
disabledTickVerticalPosition: string;
|
|
830
776
|
disabledTickBackgroundColor: string;
|
|
831
|
-
disabledTickBackgroundColorOnDark: string;
|
|
832
777
|
disabledTrackLineColor: string;
|
|
833
|
-
disabledTrackLineColorOnDark: string;
|
|
834
778
|
disabledTotalLineColor: string;
|
|
835
|
-
disabledTotalLineColorOnDark: string;
|
|
836
779
|
focusColor: string;
|
|
837
|
-
focusColorOnDark: string;
|
|
838
780
|
floorLabelMarginRight: string;
|
|
839
781
|
ceilLabelMarginLeft: string;
|
|
840
782
|
inputMarginLeft: string;
|
|
@@ -848,14 +790,12 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
848
790
|
labelFontStyle: string;
|
|
849
791
|
labelFontWeight: string;
|
|
850
792
|
labelFontColor: string;
|
|
851
|
-
labelFontColorOnDark: string;
|
|
852
793
|
labelTextAlign: string;
|
|
853
794
|
progressValueFontFamily: string;
|
|
854
795
|
progressValueFontSize: string;
|
|
855
796
|
progressValueFontStyle: string;
|
|
856
797
|
progressValueFontWeight: string;
|
|
857
798
|
progressValueFontColor: string;
|
|
858
|
-
progressValueFontColorOnDark: string;
|
|
859
799
|
progressValueTextAlign: string;
|
|
860
800
|
overlayBackgroundColor: string;
|
|
861
801
|
overlayOpacity: string;
|
|
@@ -874,32 +814,21 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
874
814
|
};
|
|
875
815
|
switch: {
|
|
876
816
|
checkedTrackBackgroundColor: string;
|
|
877
|
-
checkedTrackBackgroundColorOnDark: string;
|
|
878
817
|
checkedThumbBackgroundColor: string;
|
|
879
|
-
checkedThumbBackgroundColorOnDark: string;
|
|
880
818
|
uncheckedTrackBackgroundColor: string;
|
|
881
|
-
uncheckedTrackBackgroundColorOnDark: string;
|
|
882
819
|
uncheckedThumbBackgroundColor: string;
|
|
883
|
-
uncheckedThumbBackgroundColorOnDark: string;
|
|
884
820
|
disabledCheckedTrackBackgroundColor: string;
|
|
885
|
-
disabledCheckedTrackBackgroundColorOnDark: string;
|
|
886
821
|
disabledCheckedThumbBackgroundColor: string;
|
|
887
|
-
disabledCheckedThumbBackgroundColorOnDark: string;
|
|
888
822
|
disabledUncheckedTrackBackgroundColor: string;
|
|
889
|
-
disabledUncheckedTrackBackgroundColorOnDark: string;
|
|
890
823
|
disabledUncheckedThumbBackgroundColor: string;
|
|
891
|
-
disabledUncheckedThumbBackgroundColorOnDark: string;
|
|
892
824
|
disabledLabelFontColor: string;
|
|
893
|
-
disabledLabelFontColorOnDark: string;
|
|
894
825
|
disabledLabelFontStyle: string;
|
|
895
826
|
labelFontFamily: string;
|
|
896
827
|
labelFontSize: string;
|
|
897
828
|
labelFontStyle: string;
|
|
898
829
|
labelFontWeight: string;
|
|
899
830
|
labelFontColor: string;
|
|
900
|
-
labelFontColorOnDark: string;
|
|
901
831
|
thumbFocusColor: string;
|
|
902
|
-
thumbFocusColorOnDark: string;
|
|
903
832
|
thumbHeight: string;
|
|
904
833
|
thumbWidth: string;
|
|
905
834
|
thumbShift: string;
|
|
@@ -922,8 +851,16 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
922
851
|
dataPaddingBottom: string;
|
|
923
852
|
dataPaddingRight: string;
|
|
924
853
|
dataPaddingLeft: string;
|
|
854
|
+
dataPaddingTopReduced: string;
|
|
855
|
+
dataPaddingBottomReduced: string;
|
|
856
|
+
dataPaddingRightReduced: string;
|
|
857
|
+
dataPaddingLeftReduced: string;
|
|
925
858
|
dataTextAlign: string;
|
|
926
859
|
dataTextLineHeight: string;
|
|
860
|
+
firstChildPaddingLeft: string;
|
|
861
|
+
lastChildPaddingRight: string;
|
|
862
|
+
firstChildPaddingLeftReduced: string;
|
|
863
|
+
lastChildPaddingRightReduced: string;
|
|
927
864
|
headerBackgroundColor: string;
|
|
928
865
|
headerBorderRadius: string;
|
|
929
866
|
headerFontFamily: string;
|
|
@@ -936,11 +873,25 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
936
873
|
headerPaddingBottom: string;
|
|
937
874
|
headerPaddingRight: string;
|
|
938
875
|
headerPaddingLeft: string;
|
|
876
|
+
headerPaddingTopReduced: string;
|
|
877
|
+
headerPaddingBottomReduced: string;
|
|
878
|
+
headerPaddingRightReduced: string;
|
|
879
|
+
headerPaddingLeftReduced: string;
|
|
939
880
|
headerTextAlign: string;
|
|
940
881
|
headerTextLineHeight: string;
|
|
941
882
|
scrollBarThumbColor: string;
|
|
942
883
|
scrollBarTrackColor: string;
|
|
943
884
|
sortIconColor: string;
|
|
885
|
+
actionIconColor: string;
|
|
886
|
+
disabledActionIconColor: string;
|
|
887
|
+
hoverActionIconColor: string;
|
|
888
|
+
focusActionIconColor: string;
|
|
889
|
+
activeActionIconColor: string;
|
|
890
|
+
actionBackgroundColor: string;
|
|
891
|
+
disabledActionBackgroundColor: string;
|
|
892
|
+
hoverActionBackgroundColor: string;
|
|
893
|
+
focusActionBorderColor: string;
|
|
894
|
+
activeActionBackgroundColor: string;
|
|
944
895
|
};
|
|
945
896
|
tabs: {
|
|
946
897
|
fontFamily: string;
|
|
@@ -959,7 +910,6 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
959
910
|
disabledFontColor: string;
|
|
960
911
|
disabledIconColor: string;
|
|
961
912
|
disabledFontStyle: string;
|
|
962
|
-
disabledBadgeBackgroundColor: string;
|
|
963
913
|
hoverBackgroundColor: string;
|
|
964
914
|
pressedBackgroundColor: string;
|
|
965
915
|
pressedFontWeight: string;
|
|
@@ -967,19 +917,6 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
967
917
|
dividerThickness: string;
|
|
968
918
|
focusOutline: string;
|
|
969
919
|
scrollButtonsWidth: string;
|
|
970
|
-
badgeBackgroundColor: string;
|
|
971
|
-
badgeFontFamily: string;
|
|
972
|
-
badgeFontSize: string;
|
|
973
|
-
badgeFontStyle: string;
|
|
974
|
-
badgeFontWeight: string;
|
|
975
|
-
badgeFontColor: string;
|
|
976
|
-
badgeLetterSpacing: string;
|
|
977
|
-
badgeWidth: string;
|
|
978
|
-
badgeHeight: string;
|
|
979
|
-
badgeRadius: string;
|
|
980
|
-
badgeWidthWithNotificationNumber: string;
|
|
981
|
-
badgeHeightWithNotificationNumber: string;
|
|
982
|
-
badgeRadiusWithNotificationNumber: string;
|
|
983
920
|
};
|
|
984
921
|
tag: {
|
|
985
922
|
fontFamily: string;
|
|
@@ -1001,134 +938,87 @@ declare const HalstackContext: React.Context<DeepPartial<{
|
|
|
1001
938
|
textarea: {
|
|
1002
939
|
fontFamily: string;
|
|
1003
940
|
enabledBorderColor: string;
|
|
1004
|
-
enabledBorderColorOnDark: string;
|
|
1005
941
|
hoverBorderColor: string;
|
|
1006
|
-
hoverBorderColorOnDark: string;
|
|
1007
942
|
focusBorderColor: string;
|
|
1008
|
-
focusBorderColorOnDark: string;
|
|
1009
943
|
disabledBorderColor: string;
|
|
1010
|
-
disabledBorderColorOnDark: string;
|
|
1011
944
|
disabledContainerFillColor: string;
|
|
1012
|
-
disabledContainerFillColorOnDark: string;
|
|
1013
945
|
readOnlyBorderColor: string;
|
|
1014
946
|
hoverReadOnlyBorderColor: string;
|
|
1015
947
|
errorBorderColor: string;
|
|
1016
|
-
errorBorderColorOnDark: string;
|
|
1017
948
|
hoverErrorBorderColor: string;
|
|
1018
|
-
hoverErrorBorderColorOnDark: string;
|
|
1019
949
|
inputMarginTop: string;
|
|
1020
950
|
inputMarginBottom: string;
|
|
1021
951
|
errorMessageColor: string;
|
|
1022
|
-
errorMessageColorOnDark: string;
|
|
1023
952
|
labelFontColor: string;
|
|
1024
|
-
labelFontColorOnDark: string;
|
|
1025
953
|
labelFontSize: string;
|
|
1026
954
|
labelFontStyle: string;
|
|
1027
955
|
labelFontWeight: string;
|
|
1028
956
|
labelLineHeight: string;
|
|
1029
957
|
disabledLabelFontColor: string;
|
|
1030
|
-
disabledLabelFontColorOnDark: string;
|
|
1031
958
|
optionalLabelFontWeight: string;
|
|
1032
959
|
helperTextFontColor: string;
|
|
1033
|
-
helperTextFontColorOnDark: string;
|
|
1034
960
|
helperTextFontSize: string;
|
|
1035
961
|
helperTextFontStyle: string;
|
|
1036
962
|
helperTextFontWeight: string;
|
|
1037
963
|
helperTextLineHeight: string;
|
|
1038
964
|
disabledHelperTextFontColor: string;
|
|
1039
|
-
disabledHelperTextFontColorOnDark: string;
|
|
1040
965
|
placeholderFontColor: string;
|
|
1041
|
-
placeholderFontColorOnDark: string;
|
|
1042
966
|
disabledPlaceholderFontColor: string;
|
|
1043
|
-
disabledPlaceholderFontColorOnDark: string;
|
|
1044
967
|
valueFontColor: string;
|
|
1045
|
-
valueFontColorOnDark: string;
|
|
1046
968
|
valueFontSize: string;
|
|
1047
969
|
valueFontStyle: string;
|
|
1048
970
|
valueFontWeight: string;
|
|
1049
971
|
disabledValueFontColor: string;
|
|
1050
|
-
disabledValueFontColorOnDark: string;
|
|
1051
972
|
};
|
|
1052
973
|
textInput: {
|
|
1053
974
|
fontFamily: string;
|
|
1054
975
|
enabledBorderColor: string;
|
|
1055
|
-
enabledBorderColorOnDark: string;
|
|
1056
976
|
hoverBorderColor: string;
|
|
1057
|
-
hoverBorderColorOnDark: string;
|
|
1058
977
|
focusBorderColor: string;
|
|
1059
|
-
focusBorderColorOnDark: string;
|
|
1060
978
|
disabledBorderColor: string;
|
|
1061
|
-
disabledBorderColorOnDark: string;
|
|
1062
979
|
disabledContainerFillColor: string;
|
|
1063
|
-
disabledContainerFillColorOnDark: string;
|
|
1064
980
|
readOnlyBorderColor: string;
|
|
1065
981
|
hoverReadOnlyBorderColor: string;
|
|
1066
982
|
errorBorderColor: string;
|
|
1067
|
-
errorBorderColorOnDark: string;
|
|
1068
983
|
hoverErrorBorderColor: string;
|
|
1069
|
-
hoverErrorBorderColorOnDark: string;
|
|
1070
984
|
inputMarginTop: string;
|
|
1071
985
|
inputMarginBottom: string;
|
|
1072
986
|
errorMessageColor: string;
|
|
1073
|
-
errorMessageColorOnDark: string;
|
|
1074
987
|
errorIconColor: string;
|
|
1075
|
-
errorIconColorOnDark: string;
|
|
1076
988
|
labelFontColor: string;
|
|
1077
|
-
labelFontColorOnDark: string;
|
|
1078
989
|
labelFontSize: string;
|
|
1079
990
|
labelFontStyle: string;
|
|
1080
991
|
labelFontWeight: string;
|
|
1081
992
|
labelLineHeight: string;
|
|
1082
993
|
disabledLabelFontColor: string;
|
|
1083
|
-
disabledLabelFontColorOnDark: string;
|
|
1084
994
|
optionalLabelFontWeight: string;
|
|
1085
995
|
helperTextFontColor: string;
|
|
1086
|
-
helperTextFontColorOnDark: string;
|
|
1087
996
|
helperTextFontSize: string;
|
|
1088
997
|
helperTextFontStyle: string;
|
|
1089
998
|
helperTextFontWeight: string;
|
|
1090
999
|
helperTextLineHeight: string;
|
|
1091
1000
|
disabledHelperTextFontColor: string;
|
|
1092
|
-
disabledHelperTextFontColorOnDark: string;
|
|
1093
1001
|
prefixColor: string;
|
|
1094
|
-
prefixColorOnDark: string;
|
|
1095
1002
|
suffixColor: string;
|
|
1096
|
-
suffixColorOnDark: string;
|
|
1097
1003
|
disabledPrefixColor: string;
|
|
1098
1004
|
disabledSuffixColor: string;
|
|
1099
|
-
disabledPrefixColorOnDark: string;
|
|
1100
|
-
disabledSuffixColorOnDark: string;
|
|
1101
1005
|
placeholderFontColor: string;
|
|
1102
|
-
placeholderFontColorOnDark: string;
|
|
1103
1006
|
disabledPlaceholderFontColor: string;
|
|
1104
|
-
disabledPlaceholderFontColorOnDark: string;
|
|
1105
1007
|
valueFontColor: string;
|
|
1106
|
-
valueFontColorOnDark: string;
|
|
1107
1008
|
valueFontSize: string;
|
|
1108
1009
|
valueFontStyle: string;
|
|
1109
1010
|
valueFontWeight: string;
|
|
1110
1011
|
disabledValueFontColor: string;
|
|
1111
|
-
disabledValueFontColorOnDark: string;
|
|
1112
1012
|
actionIconColor: string;
|
|
1113
|
-
actionIconColorOnDark: string;
|
|
1114
1013
|
disabledActionIconColor: string;
|
|
1115
|
-
disabledActionIconColorOnDark: string;
|
|
1116
1014
|
hoverActionIconColor: string;
|
|
1117
|
-
hoverActionIconColorOnDark: string;
|
|
1118
1015
|
focusActionIconColor: string;
|
|
1119
|
-
focusActionIconColorOnDark: string;
|
|
1120
1016
|
activeActionIconColor: string;
|
|
1121
|
-
activeActionIconColorOnDark: string;
|
|
1122
1017
|
actionBackgroundColor: string;
|
|
1123
|
-
actionBackgroundColorOnDark: string;
|
|
1124
1018
|
disabledActionBackgroundColor: string;
|
|
1125
|
-
disabledActionBackgroundColorOnDark: string;
|
|
1126
1019
|
hoverActionBackgroundColor: string;
|
|
1127
|
-
hoverActionBackgroundColorOnDark: string;
|
|
1128
1020
|
focusActionBorderColor: string;
|
|
1129
|
-
focusActionBorderColorOnDark: string;
|
|
1130
1021
|
activeActionBackgroundColor: string;
|
|
1131
|
-
activeActionBackgroundColorOnDark: string;
|
|
1132
1022
|
listDialogBackgroundColor: string;
|
|
1133
1023
|
listDialogBorderColor: string;
|
|
1134
1024
|
listOptionDividerColor: string;
|
package/HalstackContext.js
CHANGED
|
@@ -13,7 +13,7 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
|
13
13
|
var _variables = require("./common/variables");
|
|
14
14
|
var _templateObject;
|
|
15
15
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
16
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u &&
|
|
16
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
17
17
|
var HalstackContext = /*#__PURE__*/_react["default"].createContext(null);
|
|
18
18
|
var HalstackLanguageContext = exports.HalstackLanguageContext = /*#__PURE__*/_react["default"].createContext(null);
|
|
19
19
|
var addLightness = function addLightness(newLightness, hexColor) {
|
|
@@ -306,5 +306,5 @@ var HalstackProvider = exports.HalstackProvider = function HalstackProvider(_ref
|
|
|
306
306
|
value: parsedLabels
|
|
307
307
|
}, children)));
|
|
308
308
|
};
|
|
309
|
-
var Halstack = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n @import url(\"https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&display=swap\");\n"])));
|
|
309
|
+
var Halstack = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n @import url(\"https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&display=swap\");\n @import url(\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:FILL@0..1\");\n"])));
|
|
310
310
|
var _default = exports["default"] = HalstackContext;
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
|
|
5
|
+
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
|
|
6
|
+
var _react = _interopRequireDefault(require("react"));
|
|
7
|
+
var _react2 = require("@testing-library/react");
|
|
8
|
+
var _Accordion = _interopRequireDefault(require("./Accordion.tsx"));
|
|
9
|
+
var _axeHelper = require("../../test/accessibility/axe-helper.js");
|
|
10
|
+
var folderIcon = /*#__PURE__*/_react["default"].createElement("svg", {
|
|
11
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
12
|
+
enableBackground: "new 0 0 24 24",
|
|
13
|
+
height: "24px",
|
|
14
|
+
viewBox: "0 0 24 24",
|
|
15
|
+
width: "24px",
|
|
16
|
+
fill: "currentColor"
|
|
17
|
+
}, /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].createElement("rect", {
|
|
18
|
+
fill: "none",
|
|
19
|
+
height: "24",
|
|
20
|
+
width: "24"
|
|
21
|
+
})), /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].createElement("path", {
|
|
22
|
+
d: "M20,6h-8l-2-2H4C2.9,4,2.01,4.9,2.01,6L2,18c0,1.1,0.9,2,2,2h16c1.1,0,2-0.9,2-2V8C22,6.9,21.1,6,20,6z M16,16h2v-2h-2v-2 h2v-2h-2V8h4v10h-4V16z M16,16h-2v2H4V6h5.17l2,2H14v2h2v2h-2v2h2V16z"
|
|
23
|
+
})));
|
|
24
|
+
describe("Accordion component accessibility tests", function () {
|
|
25
|
+
it("Should not have basic accessibility issues", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
|
|
26
|
+
var _render, container, results;
|
|
27
|
+
return _regenerator["default"].wrap(function _callee$(_context) {
|
|
28
|
+
while (1) switch (_context.prev = _context.next) {
|
|
29
|
+
case 0:
|
|
30
|
+
_render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Accordion["default"], {
|
|
31
|
+
label: "Accordion",
|
|
32
|
+
assistiveText: "Assistive Text",
|
|
33
|
+
icon: folderIcon,
|
|
34
|
+
margin: "small",
|
|
35
|
+
defaultIsExpanded: true
|
|
36
|
+
}, /*#__PURE__*/_react["default"].createElement("div", null, "test-expanded"))), container = _render.container;
|
|
37
|
+
_context.next = 3;
|
|
38
|
+
return (0, _axeHelper.axe)(container);
|
|
39
|
+
case 3:
|
|
40
|
+
results = _context.sent;
|
|
41
|
+
expect(results).toHaveNoViolations();
|
|
42
|
+
case 5:
|
|
43
|
+
case "end":
|
|
44
|
+
return _context.stop();
|
|
45
|
+
}
|
|
46
|
+
}, _callee);
|
|
47
|
+
})));
|
|
48
|
+
it("Should not have basic accessibility issues for disabled mode", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
|
|
49
|
+
var _render2, container, results;
|
|
50
|
+
return _regenerator["default"].wrap(function _callee2$(_context2) {
|
|
51
|
+
while (1) switch (_context2.prev = _context2.next) {
|
|
52
|
+
case 0:
|
|
53
|
+
_render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Accordion["default"], {
|
|
54
|
+
label: "Accordion",
|
|
55
|
+
assistiveText: "Assistive Text",
|
|
56
|
+
icon: folderIcon,
|
|
57
|
+
margin: "small",
|
|
58
|
+
disabled: true
|
|
59
|
+
}, /*#__PURE__*/_react["default"].createElement("div", null, "test-expanded"))), container = _render2.container;
|
|
60
|
+
_context2.next = 3;
|
|
61
|
+
return (0, _axeHelper.axe)(container);
|
|
62
|
+
case 3:
|
|
63
|
+
results = _context2.sent;
|
|
64
|
+
expect(results).toHaveNoViolations();
|
|
65
|
+
case 5:
|
|
66
|
+
case "end":
|
|
67
|
+
return _context2.stop();
|
|
68
|
+
}
|
|
69
|
+
}, _callee2);
|
|
70
|
+
})));
|
|
71
|
+
});
|