@dxc-technology/halstack-react 10.1.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.
Files changed (350) hide show
  1. package/BackgroundColorContext.d.ts +1 -10
  2. package/BackgroundColorContext.js +4 -21
  3. package/HalstackContext.d.ts +45 -143
  4. package/HalstackContext.js +10 -35
  5. package/accordion/Accordion.accessibility.test.js +71 -0
  6. package/accordion/Accordion.js +33 -84
  7. package/accordion/Accordion.stories.tsx +8 -64
  8. package/accordion/Accordion.test.js +18 -33
  9. package/accordion/types.d.ts +6 -6
  10. package/accordion-group/AccordionGroup.accessibility.test.js +88 -0
  11. package/accordion-group/AccordionGroup.d.ts +2 -3
  12. package/accordion-group/AccordionGroup.js +17 -44
  13. package/accordion-group/AccordionGroup.stories.tsx +24 -24
  14. package/accordion-group/AccordionGroup.test.js +42 -60
  15. package/accordion-group/AccordionGroupAccordion.js +11 -23
  16. package/accordion-group/AccordionGroupContext.d.ts +3 -0
  17. package/accordion-group/AccordionGroupContext.js +8 -0
  18. package/accordion-group/types.d.ts +7 -7
  19. package/action-icon/ActionIcon.accessibility.test.js +63 -0
  20. package/action-icon/ActionIcon.d.ts +4 -0
  21. package/action-icon/ActionIcon.js +48 -0
  22. package/action-icon/ActionIcon.stories.tsx +41 -0
  23. package/action-icon/ActionIcon.test.js +64 -0
  24. package/action-icon/types.d.ts +26 -0
  25. package/alert/Alert.accessibility.test.js +95 -0
  26. package/alert/Alert.js +34 -120
  27. package/alert/Alert.test.js +28 -45
  28. package/alert/types.d.ts +5 -5
  29. package/badge/Badge.accessibility.test.js +129 -0
  30. package/badge/Badge.d.ts +1 -1
  31. package/badge/Badge.js +142 -42
  32. package/badge/Badge.stories.tsx +210 -0
  33. package/badge/Badge.test.js +30 -0
  34. package/badge/types.d.ts +52 -3
  35. package/bleed/Bleed.js +13 -21
  36. package/bleed/types.d.ts +2 -2
  37. package/box/Box.accessibility.test.js +33 -0
  38. package/box/Box.js +11 -33
  39. package/box/Box.test.js +1 -6
  40. package/box/types.d.ts +3 -3
  41. package/breadcrumbs/Breadcrumbs.accessibility.test.d.ts +1 -0
  42. package/breadcrumbs/Breadcrumbs.accessibility.test.js +96 -0
  43. package/breadcrumbs/Breadcrumbs.d.ts +4 -0
  44. package/breadcrumbs/Breadcrumbs.js +79 -0
  45. package/breadcrumbs/Breadcrumbs.stories.tsx +194 -0
  46. package/breadcrumbs/Breadcrumbs.test.d.ts +1 -0
  47. package/breadcrumbs/Breadcrumbs.test.js +169 -0
  48. package/breadcrumbs/Item.d.ts +4 -0
  49. package/breadcrumbs/Item.js +52 -0
  50. package/breadcrumbs/dropdownTheme.d.ts +53 -0
  51. package/breadcrumbs/dropdownTheme.js +62 -0
  52. package/breadcrumbs/types.d.ts +16 -0
  53. package/breadcrumbs/types.js +5 -0
  54. package/bulleted-list/BulletedList.accessibility.test.js +119 -0
  55. package/bulleted-list/BulletedList.js +22 -55
  56. package/bulleted-list/BulletedList.stories.tsx +2 -93
  57. package/bulleted-list/types.d.ts +5 -5
  58. package/button/Button.accessibility.test.js +127 -0
  59. package/button/Button.js +36 -59
  60. package/button/Button.stories.tsx +35 -135
  61. package/button/Button.test.js +13 -21
  62. package/button/types.d.ts +5 -5
  63. package/card/Card.accessibility.test.js +36 -0
  64. package/card/Card.js +23 -45
  65. package/card/Card.test.js +10 -21
  66. package/card/types.d.ts +5 -5
  67. package/checkbox/Checkbox.accessibility.test.js +87 -0
  68. package/checkbox/Checkbox.js +88 -123
  69. package/checkbox/Checkbox.stories.tsx +16 -54
  70. package/checkbox/Checkbox.test.js +107 -63
  71. package/checkbox/types.d.ts +8 -4
  72. package/chip/Chip.accessibility.test.js +67 -0
  73. package/chip/Chip.js +22 -36
  74. package/chip/Chip.stories.tsx +10 -25
  75. package/chip/Chip.test.js +17 -30
  76. package/chip/types.d.ts +4 -4
  77. package/common/coreTokens.d.ts +105 -14
  78. package/common/coreTokens.js +40 -23
  79. package/common/utils.js +2 -8
  80. package/common/variables.d.ts +46 -144
  81. package/common/variables.js +120 -225
  82. package/container/Container.d.ts +4 -0
  83. package/container/Container.js +194 -0
  84. package/container/Container.stories.tsx +214 -0
  85. package/container/types.d.ts +74 -0
  86. package/container/types.js +5 -0
  87. package/contextual-menu/ContextualMenu.accessibility.test.js +97 -0
  88. package/contextual-menu/ContextualMenu.d.ts +5 -0
  89. package/contextual-menu/ContextualMenu.js +88 -0
  90. package/contextual-menu/ContextualMenu.stories.tsx +232 -0
  91. package/contextual-menu/ContextualMenu.test.js +205 -0
  92. package/contextual-menu/GroupItem.d.ts +4 -0
  93. package/contextual-menu/GroupItem.js +67 -0
  94. package/contextual-menu/ItemAction.d.ts +4 -0
  95. package/contextual-menu/ItemAction.js +51 -0
  96. package/contextual-menu/MenuItem.d.ts +4 -0
  97. package/contextual-menu/MenuItem.js +29 -0
  98. package/contextual-menu/SingleItem.d.ts +4 -0
  99. package/contextual-menu/SingleItem.js +38 -0
  100. package/contextual-menu/types.d.ts +58 -0
  101. package/contextual-menu/types.js +5 -0
  102. package/date-input/Calendar.js +13 -57
  103. package/date-input/DateInput.accessibility.test.js +228 -0
  104. package/date-input/DateInput.js +53 -100
  105. package/date-input/DateInput.stories.tsx +19 -31
  106. package/date-input/DateInput.test.js +674 -701
  107. package/date-input/DatePicker.js +23 -48
  108. package/date-input/YearPicker.js +8 -34
  109. package/date-input/types.d.ts +28 -22
  110. package/dialog/Dialog.accessibility.test.js +69 -0
  111. package/dialog/Dialog.js +21 -59
  112. package/dialog/Dialog.stories.tsx +176 -0
  113. package/dialog/Dialog.test.js +126 -188
  114. package/dialog/types.d.ts +18 -13
  115. package/divider/Divider.accessibility.test.js +33 -0
  116. package/divider/Divider.d.ts +4 -0
  117. package/divider/Divider.js +36 -0
  118. package/divider/Divider.stories.tsx +223 -0
  119. package/divider/Divider.test.js +38 -0
  120. package/divider/types.d.ts +21 -0
  121. package/divider/types.js +5 -0
  122. package/dropdown/Dropdown.accessibility.test.js +180 -0
  123. package/dropdown/Dropdown.js +63 -130
  124. package/dropdown/Dropdown.stories.tsx +15 -26
  125. package/dropdown/Dropdown.test.js +402 -389
  126. package/dropdown/DropdownMenu.js +12 -23
  127. package/dropdown/DropdownMenuItem.js +13 -21
  128. package/dropdown/types.d.ts +20 -24
  129. package/file-input/FileInput.accessibility.test.js +160 -0
  130. package/file-input/FileInput.js +180 -284
  131. package/file-input/FileInput.stories.tsx +1 -1
  132. package/file-input/FileInput.test.js +279 -354
  133. package/file-input/FileItem.js +29 -66
  134. package/file-input/types.d.ts +9 -9
  135. package/flex/Flex.js +25 -39
  136. package/flex/types.d.ts +6 -6
  137. package/footer/Footer.accessibility.test.js +125 -0
  138. package/footer/Footer.d.ts +1 -1
  139. package/footer/Footer.js +43 -68
  140. package/footer/Footer.stories.tsx +58 -2
  141. package/footer/Footer.test.js +18 -32
  142. package/footer/Icons.d.ts +3 -2
  143. package/footer/Icons.js +53 -22
  144. package/footer/types.d.ts +17 -17
  145. package/grid/Grid.js +1 -16
  146. package/grid/types.d.ts +10 -10
  147. package/header/Header.accessibility.test.js +93 -0
  148. package/header/Header.d.ts +1 -1
  149. package/header/Header.js +38 -104
  150. package/header/Header.stories.tsx +16 -0
  151. package/header/Header.test.js +12 -25
  152. package/header/Icons.d.ts +2 -2
  153. package/header/Icons.js +3 -13
  154. package/header/types.d.ts +7 -8
  155. package/heading/Heading.accessibility.test.js +33 -0
  156. package/heading/Heading.js +9 -31
  157. package/heading/Heading.test.js +70 -87
  158. package/heading/types.d.ts +7 -7
  159. package/icon/Icon.accessibility.test.js +30 -0
  160. package/icon/Icon.d.ts +4 -0
  161. package/icon/Icon.js +33 -0
  162. package/icon/Icon.stories.tsx +28 -0
  163. package/icon/types.d.ts +4 -0
  164. package/icon/types.js +5 -0
  165. package/image/Image.accessibility.test.js +56 -0
  166. package/image/Image.d.ts +2 -2
  167. package/image/Image.js +17 -32
  168. package/image/Image.stories.tsx +3 -1
  169. package/image/types.d.ts +2 -2
  170. package/inset/Inset.js +13 -21
  171. package/inset/types.d.ts +2 -2
  172. package/layout/ApplicationLayout.d.ts +2 -2
  173. package/layout/ApplicationLayout.js +23 -60
  174. package/layout/Icons.d.ts +4 -5
  175. package/layout/Icons.js +2 -16
  176. package/layout/types.d.ts +3 -3
  177. package/link/Link.accessibility.test.js +108 -0
  178. package/link/Link.js +28 -47
  179. package/link/Link.stories.tsx +4 -4
  180. package/link/Link.test.js +23 -41
  181. package/link/types.d.ts +14 -14
  182. package/main.d.ts +8 -4
  183. package/main.js +39 -60
  184. package/nav-tabs/NavTabs.accessibility.test.js +44 -0
  185. package/nav-tabs/NavTabs.d.ts +1 -2
  186. package/nav-tabs/NavTabs.js +19 -48
  187. package/nav-tabs/NavTabs.stories.tsx +30 -25
  188. package/nav-tabs/NavTabs.test.js +45 -50
  189. package/nav-tabs/NavTabsContext.d.ts +3 -0
  190. package/nav-tabs/NavTabsContext.js +8 -0
  191. package/nav-tabs/Tab.js +38 -67
  192. package/nav-tabs/types.d.ts +10 -10
  193. package/number-input/NumberInput.accessibility.test.js +228 -0
  194. package/number-input/NumberInput.d.ts +0 -7
  195. package/number-input/NumberInput.js +47 -39
  196. package/number-input/NumberInput.stories.tsx +42 -26
  197. package/number-input/NumberInput.test.js +839 -575
  198. package/number-input/NumberInputContext.d.ts +3 -0
  199. package/number-input/NumberInputContext.js +8 -0
  200. package/number-input/types.d.ts +17 -5
  201. package/package.json +41 -37
  202. package/paginator/Paginator.accessibility.test.js +79 -0
  203. package/paginator/Paginator.js +27 -52
  204. package/paginator/Paginator.test.js +224 -207
  205. package/paginator/types.d.ts +3 -3
  206. package/paragraph/Paragraph.accessibility.test.js +28 -0
  207. package/paragraph/Paragraph.js +3 -19
  208. package/paragraph/Paragraph.stories.tsx +0 -17
  209. package/password-input/PasswordInput.accessibility.test.js +153 -0
  210. package/password-input/PasswordInput.js +32 -54
  211. package/password-input/PasswordInput.stories.tsx +1 -34
  212. package/password-input/PasswordInput.test.js +153 -129
  213. package/password-input/types.d.ts +8 -7
  214. package/progress-bar/ProgressBar.accessibility.test.js +35 -0
  215. package/progress-bar/ProgressBar.js +26 -56
  216. package/progress-bar/{ProgressBar.stories.jsx → ProgressBar.stories.tsx} +1 -1
  217. package/progress-bar/ProgressBar.test.js +35 -52
  218. package/progress-bar/types.d.ts +3 -3
  219. package/quick-nav/QuickNav.accessibility.test.js +57 -0
  220. package/quick-nav/QuickNav.js +4 -27
  221. package/quick-nav/QuickNav.stories.tsx +1 -1
  222. package/quick-nav/types.d.ts +10 -10
  223. package/radio-group/Radio.d.ts +1 -1
  224. package/radio-group/Radio.js +22 -54
  225. package/radio-group/RadioGroup.accessibility.test.js +97 -0
  226. package/radio-group/RadioGroup.js +38 -83
  227. package/radio-group/RadioGroup.stories.tsx +10 -10
  228. package/radio-group/RadioGroup.test.js +504 -470
  229. package/radio-group/types.d.ts +8 -8
  230. package/resultset-table/Icons.d.ts +7 -0
  231. package/{resultsetTable → resultset-table}/Icons.js +1 -5
  232. package/resultset-table/ResultsetTable.accessibility.test.js +285 -0
  233. package/resultset-table/ResultsetTable.d.ts +7 -0
  234. package/{resultsetTable → resultset-table}/ResultsetTable.js +45 -69
  235. package/{resultsetTable → resultset-table}/ResultsetTable.stories.tsx +118 -5
  236. package/{resultsetTable → resultset-table}/ResultsetTable.test.js +148 -92
  237. package/{resultsetTable → resultset-table}/types.d.ts +44 -11
  238. package/resultset-table/types.js +5 -0
  239. package/select/Listbox.js +40 -54
  240. package/select/Option.js +28 -36
  241. package/select/Select.accessibility.test.js +228 -0
  242. package/select/Select.js +107 -171
  243. package/select/Select.stories.tsx +59 -111
  244. package/select/Select.test.js +1895 -1858
  245. package/select/types.d.ts +15 -16
  246. package/sidenav/Sidenav.accessibility.test.js +59 -0
  247. package/sidenav/Sidenav.js +44 -81
  248. package/sidenav/Sidenav.stories.tsx +4 -9
  249. package/sidenav/Sidenav.test.js +3 -10
  250. package/{layout → sidenav}/SidenavContext.d.ts +1 -1
  251. package/{layout → sidenav}/SidenavContext.js +3 -9
  252. package/sidenav/types.d.ts +20 -20
  253. package/slider/Slider.accessibility.test.js +104 -0
  254. package/slider/Slider.js +70 -126
  255. package/slider/Slider.test.js +107 -103
  256. package/slider/types.d.ts +4 -4
  257. package/spinner/Spinner.accessibility.test.js +96 -0
  258. package/spinner/Spinner.js +21 -55
  259. package/spinner/Spinner.test.js +25 -34
  260. package/spinner/types.d.ts +3 -3
  261. package/status-light/StatusLight.accessibility.test.js +157 -0
  262. package/status-light/StatusLight.d.ts +4 -0
  263. package/status-light/StatusLight.js +51 -0
  264. package/status-light/StatusLight.stories.tsx +74 -0
  265. package/status-light/StatusLight.test.js +25 -0
  266. package/status-light/types.d.ts +17 -0
  267. package/status-light/types.js +5 -0
  268. package/switch/Switch.accessibility.test.js +98 -0
  269. package/switch/Switch.js +49 -97
  270. package/switch/Switch.stories.tsx +12 -34
  271. package/switch/Switch.test.js +51 -96
  272. package/switch/types.d.ts +4 -4
  273. package/table/DropdownTheme.js +62 -0
  274. package/table/Table.accessibility.test.js +93 -0
  275. package/table/Table.d.ts +6 -2
  276. package/table/Table.js +76 -33
  277. package/table/{Table.stories.jsx → Table.stories.tsx} +309 -2
  278. package/table/Table.test.js +93 -6
  279. package/table/types.d.ts +34 -6
  280. package/tabs/Tab.js +22 -37
  281. package/tabs/Tabs.accessibility.test.js +56 -0
  282. package/tabs/Tabs.js +59 -147
  283. package/tabs/Tabs.stories.tsx +8 -4
  284. package/tabs/Tabs.test.js +57 -131
  285. package/tabs/types.d.ts +21 -21
  286. package/tag/Tag.accessibility.test.js +69 -0
  287. package/tag/Tag.js +27 -57
  288. package/tag/Tag.stories.tsx +4 -7
  289. package/tag/Tag.test.js +17 -36
  290. package/tag/types.d.ts +9 -9
  291. package/text-input/Suggestion.js +9 -26
  292. package/text-input/Suggestions.d.ts +1 -1
  293. package/text-input/Suggestions.js +30 -70
  294. package/text-input/TextInput.accessibility.test.js +321 -0
  295. package/text-input/TextInput.js +203 -289
  296. package/text-input/TextInput.stories.tsx +65 -160
  297. package/text-input/TextInput.test.js +1227 -1194
  298. package/text-input/types.d.ts +25 -17
  299. package/textarea/Textarea.accessibility.test.js +155 -0
  300. package/textarea/Textarea.js +68 -109
  301. package/textarea/{Textarea.stories.jsx → Textarea.stories.tsx} +58 -100
  302. package/textarea/Textarea.test.js +150 -179
  303. package/textarea/types.d.ts +9 -5
  304. package/toggle-group/ToggleGroup.accessibility.test.js +107 -0
  305. package/toggle-group/ToggleGroup.js +25 -64
  306. package/toggle-group/ToggleGroup.stories.tsx +4 -4
  307. package/toggle-group/ToggleGroup.test.js +48 -81
  308. package/toggle-group/types.d.ts +12 -12
  309. package/typography/Typography.accessibility.test.js +339 -0
  310. package/typography/Typography.js +4 -13
  311. package/typography/types.d.ts +1 -1
  312. package/useTheme.d.ts +43 -141
  313. package/useTheme.js +1 -8
  314. package/useTranslatedLabels.js +1 -7
  315. package/utils/BaseTypography.d.ts +2 -2
  316. package/utils/BaseTypography.js +16 -30
  317. package/utils/FocusLock.js +25 -39
  318. package/wizard/Wizard.accessibility.test.js +55 -0
  319. package/wizard/Wizard.js +27 -73
  320. package/wizard/Wizard.stories.tsx +19 -0
  321. package/wizard/Wizard.test.js +53 -80
  322. package/wizard/types.d.ts +8 -8
  323. package/common/OpenSans.css +0 -69
  324. package/common/fonts/OpenSans-Bold.ttf +0 -0
  325. package/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  326. package/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  327. package/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  328. package/common/fonts/OpenSans-Italic.ttf +0 -0
  329. package/common/fonts/OpenSans-Light.ttf +0 -0
  330. package/common/fonts/OpenSans-LightItalic.ttf +0 -0
  331. package/common/fonts/OpenSans-Regular.ttf +0 -0
  332. package/common/fonts/OpenSans-SemiBold.ttf +0 -0
  333. package/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  334. package/date-input/Icons.d.ts +0 -6
  335. package/date-input/Icons.js +0 -75
  336. package/paginator/Icons.d.ts +0 -5
  337. package/paginator/Icons.js +0 -54
  338. package/password-input/Icons.d.ts +0 -6
  339. package/password-input/Icons.js +0 -39
  340. package/resultsetTable/Icons.d.ts +0 -7
  341. package/resultsetTable/ResultsetTable.d.ts +0 -4
  342. package/select/Icons.d.ts +0 -10
  343. package/select/Icons.js +0 -93
  344. package/sidenav/Icons.d.ts +0 -7
  345. package/sidenav/Icons.js +0 -51
  346. package/slider/Slider.stories.tsx +0 -240
  347. package/text-input/Icons.d.ts +0 -8
  348. package/text-input/Icons.js +0 -60
  349. /package/{resultsetTable → action-icon}/types.js +0 -0
  350. /package/spinner/{Spinner.stories.jsx → Spinner.stories.tsx} +0 -0
@@ -1,25 +1,20 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
4
  var _react = _interopRequireDefault(require("react"));
6
-
7
5
  var _react2 = require("@testing-library/react");
8
-
9
6
  var _Wizard = _interopRequireDefault(require("./Wizard.tsx"));
10
-
11
7
  describe("Wizard components tests", function () {
12
8
  test("Wizard renders with correct steps", function () {
13
9
  var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Wizard["default"], {
14
- steps: [{
15
- label: "first-step"
16
- }, {
17
- label: "second-step"
18
- }]
19
- })),
20
- getByText = _render.getByText,
21
- getAllByRole = _render.getAllByRole;
22
-
10
+ steps: [{
11
+ label: "first-step"
12
+ }, {
13
+ label: "second-step"
14
+ }]
15
+ })),
16
+ getByText = _render.getByText,
17
+ getAllByRole = _render.getAllByRole;
23
18
  var steps = getAllByRole("button");
24
19
  expect(getByText("first-step")).toBeTruthy();
25
20
  expect(getByText("second-step")).toBeTruthy();
@@ -28,112 +23,90 @@ describe("Wizard components tests", function () {
28
23
  });
29
24
  test("Wizard renders with initially selected step", function () {
30
25
  var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Wizard["default"], {
31
- defaultCurrentStep: 1,
32
- steps: [{
33
- label: "first-step"
34
- }, {
35
- label: "second-step"
36
- }]
37
- })),
38
- getAllByRole = _render2.getAllByRole;
39
-
26
+ defaultCurrentStep: 1,
27
+ steps: [{
28
+ label: "first-step"
29
+ }, {
30
+ label: "second-step"
31
+ }]
32
+ })),
33
+ getAllByRole = _render2.getAllByRole;
40
34
  var steps = getAllByRole("button");
41
35
  expect(steps[1].getAttribute("aria-current")).toBe("step");
42
36
  });
43
37
  test("Click on step text", function () {
44
38
  var onClick = jest.fn();
45
-
46
39
  var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Wizard["default"], {
47
- onStepClick: onClick,
48
- steps: [{
49
- label: "first-step"
50
- }]
51
- })),
52
- getByText = _render3.getByText;
53
-
40
+ onStepClick: onClick,
41
+ steps: [{
42
+ label: "first-step"
43
+ }]
44
+ })),
45
+ getByText = _render3.getByText;
54
46
  var step = getByText("first-step");
55
-
56
47
  _react2.fireEvent.click(step);
57
-
58
48
  expect(onClick).toHaveBeenCalled();
59
49
  });
60
50
  test("Click on step description", function () {
61
51
  var onClick = jest.fn();
62
-
63
52
  var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Wizard["default"], {
64
- onStepClick: onClick,
65
- steps: [{
66
- label: "first-step",
67
- description: "step-description"
68
- }]
69
- })),
70
- getByText = _render4.getByText;
71
-
53
+ onStepClick: onClick,
54
+ steps: [{
55
+ label: "first-step",
56
+ description: "step-description"
57
+ }]
58
+ })),
59
+ getByText = _render4.getByText;
72
60
  var step = getByText("step-description");
73
-
74
61
  _react2.fireEvent.click(step);
75
-
76
62
  expect(onClick).toHaveBeenCalled();
77
63
  });
78
64
  test("Click on step number", function () {
79
65
  var onClick = jest.fn();
80
-
81
66
  var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Wizard["default"], {
82
- onStepClick: onClick,
83
- steps: [{
84
- label: "first-step"
85
- }]
86
- })),
87
- getByText = _render5.getByText;
88
-
67
+ onStepClick: onClick,
68
+ steps: [{
69
+ label: "first-step"
70
+ }]
71
+ })),
72
+ getByText = _render5.getByText;
89
73
  var step = getByText("1");
90
-
91
74
  _react2.fireEvent.click(step);
92
-
93
75
  expect(onClick).toHaveBeenCalled();
94
76
  });
95
77
  test("Click on disable step", function () {
96
78
  var onClick = jest.fn();
97
-
98
79
  var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Wizard["default"], {
99
- onStepClick: onClick,
100
- steps: [{
101
- label: "first-step"
102
- }, {
103
- label: "second-step",
104
- disabled: true
105
- }]
106
- })),
107
- getByText = _render6.getByText;
108
-
80
+ onStepClick: onClick,
81
+ steps: [{
82
+ label: "first-step"
83
+ }, {
84
+ label: "second-step",
85
+ disabled: true
86
+ }]
87
+ })),
88
+ getByText = _render6.getByText;
109
89
  var step = getByText("second-step");
110
-
111
90
  _react2.fireEvent.click(step);
112
-
113
91
  expect(onClick).toHaveBeenCalledTimes(0);
114
92
  });
115
93
  test("Controlled wizard function is called", function () {
116
94
  var onClick = jest.fn(function (i) {
117
95
  return i;
118
96
  });
119
-
120
97
  var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Wizard["default"], {
121
- currentStep: 0,
122
- onStepClick: onClick,
123
- steps: [{
124
- label: "first-step"
125
- }, {
126
- label: "second-step"
127
- }]
128
- })),
129
- getAllByRole = _render7.getAllByRole;
130
-
98
+ currentStep: 0,
99
+ onStepClick: onClick,
100
+ steps: [{
101
+ label: "first-step"
102
+ }, {
103
+ label: "second-step"
104
+ }]
105
+ })),
106
+ getAllByRole = _render7.getAllByRole;
131
107
  var steps = getAllByRole("button");
132
-
133
108
  _react2.fireEvent.click(steps[1]);
134
-
135
109
  _react2.fireEvent.click(steps[0]);
136
-
137
110
  expect(onClick).toHaveBeenCalledTimes(2);
138
111
  expect(onClick).toHaveBeenNthCalledWith(1, 1);
139
112
  expect(onClick).toHaveBeenNthCalledWith(2, 0);
package/wizard/types.d.ts CHANGED
@@ -1,13 +1,13 @@
1
1
  /// <reference types="react" />
2
- declare type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
- declare type Margin = {
2
+ type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
+ type Margin = {
4
4
  top?: Space;
5
5
  bottom?: Space;
6
6
  left?: Space;
7
7
  right?: Space;
8
8
  };
9
- declare type SVG = React.ReactNode & React.SVGProps<SVGSVGElement>;
10
- export declare type StepProps = {
9
+ type SVG = React.ReactNode & React.SVGProps<SVGSVGElement>;
10
+ export type StepProps = {
11
11
  /**
12
12
  * Step label.
13
13
  */
@@ -17,7 +17,7 @@ export declare type StepProps = {
17
17
  */
18
18
  description?: string;
19
19
  /**
20
- * Element or path used as the icon displayed in the step.
20
+ * Material Symbol name or SVG element used as the icon displayed in the step.
21
21
  */
22
22
  icon?: string | SVG;
23
23
  /**
@@ -29,9 +29,9 @@ export declare type StepProps = {
29
29
  */
30
30
  valid?: boolean;
31
31
  };
32
- declare type Props = {
32
+ type Props = {
33
33
  /**
34
- * The wizard can be showed in horizontal or vertical.
34
+ * The wizard can be shown in horizontal or vertical.
35
35
  */
36
36
  mode?: "horizontal" | "vertical";
37
37
  /**
@@ -46,7 +46,7 @@ declare type Props = {
46
46
  * This function will be called when the user clicks a step. The step
47
47
  * number will be passed as a parameter.
48
48
  */
49
- onStepClick?: (newCurrentStep: number) => void;
49
+ onStepClick?: (currentStep: number) => void;
50
50
  /**
51
51
  * An array of objects representing the steps.
52
52
  */
@@ -1,69 +0,0 @@
1
- @font-face {
2
- font-family: "Open Sans";
3
- src: url("./fonts/OpenSans-Light.ttf") format("truetype");
4
- font-style: normal;
5
- font-weight: 200;
6
- }
7
-
8
- @font-face {
9
- font-family: "Open Sans";
10
- src: url("./fonts/OpenSans-Regular.ttf") format("truetype");
11
- font-style: normal;
12
- font-weight: 400;
13
- }
14
-
15
- @font-face {
16
- font-family: "Open Sans";
17
- src: url("./fonts/OpenSans-SemiBold.ttf") format("truetype");
18
- font-style: normal;
19
- font-weight: 600;
20
- }
21
-
22
- @font-face {
23
- font-family: "Open Sans";
24
- src: url("./fonts/OpenSans-Bold.ttf") format("truetype");
25
- font-style: normal;
26
- font-weight: 700;
27
- }
28
-
29
- @font-face {
30
- font-family: "Open Sans";
31
- src: url("./fonts/OpenSans-ExtraBold.ttf") format("truetype");
32
- font-style: normal;
33
- font-weight: 800;
34
- }
35
-
36
- @font-face {
37
- font-family: "Open Sans";
38
- src: url("./fonts/OpenSans-LightItalic.ttf") format("truetype");
39
- font-style: italic;
40
- font-weight: 200;
41
- }
42
-
43
- @font-face {
44
- font-family: "Open Sans";
45
- src: url("./fonts/OpenSans-Italic.ttf") format("truetype");
46
- font-style: italic;
47
- font-weight: 400;
48
- }
49
-
50
- @font-face {
51
- font-family: "Open Sans";
52
- src: url("./fonts/OpenSans-SemiBoldItalic.ttf") format("truetype");
53
- font-style: italic;
54
- font-weight: 600;
55
- }
56
-
57
- @font-face {
58
- font-family: "Open Sans";
59
- src: url("./fonts/OpenSans-BoldItalic.ttf") format("truetype");
60
- font-style: italic;
61
- font-weight: 700;
62
- }
63
-
64
- @font-face {
65
- font-family: "Open Sans";
66
- src: url("./fonts/OpenSans-ExtraBoldItalic.ttf") format("truetype");
67
- font-style: italic;
68
- font-weight: 800;
69
- }
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
@@ -1,6 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const calendarIcon: JSX.Element;
3
- export declare const leftCaret: JSX.Element;
4
- export declare const rightCaret: JSX.Element;
5
- export declare const downCaret: JSX.Element;
6
- export declare const upCaret: JSX.Element;
@@ -1,75 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.upCaret = exports.rightCaret = exports.leftCaret = exports.downCaret = exports.calendarIcon = void 0;
9
-
10
- var _react = _interopRequireDefault(require("react"));
11
-
12
- var calendarIcon = /*#__PURE__*/_react["default"].createElement("svg", {
13
- xmlns: "http://www.w3.org/2000/svg",
14
- height: "24",
15
- viewBox: "0 0 24 24",
16
- width: "24",
17
- fill: "currentColor"
18
- }, /*#__PURE__*/_react["default"].createElement("path", {
19
- d: "M0 0h24v24H0z",
20
- fill: "none"
21
- }), /*#__PURE__*/_react["default"].createElement("path", {
22
- d: "M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V8h16v13z"
23
- }));
24
-
25
- exports.calendarIcon = calendarIcon;
26
-
27
- var leftCaret = /*#__PURE__*/_react["default"].createElement("svg", {
28
- fill: "currentColor",
29
- focusable: "false",
30
- viewBox: "0 0 24 24"
31
- }, /*#__PURE__*/_react["default"].createElement("path", {
32
- d: "M15.41 16.59L10.83 12l4.58-4.59L14 6l-6 6 6 6 1.41-1.41z"
33
- }), /*#__PURE__*/_react["default"].createElement("path", {
34
- fill: "none",
35
- d: "M0 0h24v24H0V0z"
36
- }));
37
-
38
- exports.leftCaret = leftCaret;
39
-
40
- var rightCaret = /*#__PURE__*/_react["default"].createElement("svg", {
41
- fill: "currentColor",
42
- focusable: "false",
43
- viewBox: "0 0 24 24"
44
- }, /*#__PURE__*/_react["default"].createElement("path", {
45
- d: "M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z"
46
- }), /*#__PURE__*/_react["default"].createElement("path", {
47
- fill: "none",
48
- d: "M0 0h24v24H0V0z"
49
- }));
50
-
51
- exports.rightCaret = rightCaret;
52
-
53
- var downCaret = /*#__PURE__*/_react["default"].createElement("svg", {
54
- xmlns: "http://www.w3.org/2000/svg",
55
- width: "24",
56
- height: "24",
57
- viewBox: "0 0 24 24"
58
- }, /*#__PURE__*/_react["default"].createElement("path", {
59
- d: "M7.5 10L12.5 15L17.5 10H7.5Z",
60
- fill: "currentColor"
61
- }));
62
-
63
- exports.downCaret = downCaret;
64
-
65
- var upCaret = /*#__PURE__*/_react["default"].createElement("svg", {
66
- xmlns: "http://www.w3.org/2000/svg",
67
- height: "24",
68
- width: "24",
69
- viewBox: "0 0 24 24"
70
- }, /*#__PURE__*/_react["default"].createElement("path", {
71
- d: "m7 14 5-5 5 5Z",
72
- fill: "currentColor"
73
- }));
74
-
75
- exports.upCaret = upCaret;
@@ -1,5 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const firstIcon: JSX.Element;
3
- export declare const previousIcon: JSX.Element;
4
- export declare const nextIcon: JSX.Element;
5
- export declare const lastIcon: JSX.Element;
@@ -1,54 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.previousIcon = exports.nextIcon = exports.lastIcon = exports.firstIcon = void 0;
9
-
10
- var _react = _interopRequireDefault(require("react"));
11
-
12
- var firstIcon = /*#__PURE__*/_react["default"].createElement("svg", {
13
- xmlns: "http://www.w3.org/2000/svg",
14
- height: "24",
15
- width: "24",
16
- fill: "currentColor"
17
- }, /*#__PURE__*/_react["default"].createElement("path", {
18
- d: "M6 18V6h2v12Zm11 0-6-6 6-6 1.4 1.4-4.6 4.6 4.6 4.6Z"
19
- }));
20
-
21
- exports.firstIcon = firstIcon;
22
-
23
- var previousIcon = /*#__PURE__*/_react["default"].createElement("svg", {
24
- xmlns: "http://www.w3.org/2000/svg",
25
- height: "24",
26
- width: "24",
27
- fill: "currentColor"
28
- }, /*#__PURE__*/_react["default"].createElement("path", {
29
- d: "m14 18-6-6 6-6 1.4 1.4-4.6 4.6 4.6 4.6Z"
30
- }));
31
-
32
- exports.previousIcon = previousIcon;
33
-
34
- var nextIcon = /*#__PURE__*/_react["default"].createElement("svg", {
35
- xmlns: "http://www.w3.org/2000/svg",
36
- height: "24",
37
- width: "24",
38
- fill: "currentColor"
39
- }, /*#__PURE__*/_react["default"].createElement("path", {
40
- d: "M9.4 18 8 16.6l4.6-4.6L8 7.4 9.4 6l6 6Z"
41
- }));
42
-
43
- exports.nextIcon = nextIcon;
44
-
45
- var lastIcon = /*#__PURE__*/_react["default"].createElement("svg", {
46
- xmlns: "http://www.w3.org/2000/svg",
47
- height: "24",
48
- width: "24",
49
- fill: "currentColor"
50
- }, /*#__PURE__*/_react["default"].createElement("path", {
51
- d: "m7 18-1.4-1.4 4.6-4.6-4.6-4.6L7 6l6 6Zm9 0V6h2v12Z"
52
- }));
53
-
54
- exports.lastIcon = lastIcon;
@@ -1,6 +0,0 @@
1
- /// <reference types="react" />
2
- declare const icons: {
3
- showPassword: JSX.Element;
4
- hidePassword: JSX.Element;
5
- };
6
- export default icons;
@@ -1,39 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports["default"] = void 0;
9
-
10
- var _react = _interopRequireDefault(require("react"));
11
-
12
- var icons = {
13
- showPassword: /*#__PURE__*/_react["default"].createElement("svg", {
14
- xmlns: "http://www.w3.org/2000/svg",
15
- height: "24px",
16
- viewBox: "0 0 24 24",
17
- width: "24px",
18
- fill: "currentColor"
19
- }, /*#__PURE__*/_react["default"].createElement("path", {
20
- d: "M0 0h24v24H0V0z",
21
- fill: "none"
22
- }), /*#__PURE__*/_react["default"].createElement("path", {
23
- d: "M12 6c3.79 0 7.17 2.13 8.82 5.5C19.17 14.87 15.79 17 12 17s-7.17-2.13-8.82-5.5C4.83 8.13 8.21 6 12 6m0-2C7 4 2.73 7.11 1 11.5 2.73 15.89 7 19 12 19s9.27-3.11 11-7.5C21.27 7.11 17 4 12 4zm0 5c1.38 0 2.5 1.12 2.5 2.5S13.38 14 12 14s-2.5-1.12-2.5-2.5S10.62 9 12 9m0-2c-2.48 0-4.5 2.02-4.5 4.5S9.52 16 12 16s4.5-2.02 4.5-4.5S14.48 7 12 7z"
24
- })),
25
- hidePassword: /*#__PURE__*/_react["default"].createElement("svg", {
26
- xmlns: "http://www.w3.org/2000/svg",
27
- height: "24px",
28
- viewBox: "0 0 24 24",
29
- width: "24px",
30
- fill: "currentColor"
31
- }, /*#__PURE__*/_react["default"].createElement("path", {
32
- d: "M0 0h24v24H0V0zm0 0h24v24H0V0zm0 0h24v24H0V0zm0 0h24v24H0V0z",
33
- fill: "none"
34
- }), /*#__PURE__*/_react["default"].createElement("path", {
35
- d: "M12 6c3.79 0 7.17 2.13 8.82 5.5-.59 1.22-1.42 2.27-2.41 3.12l1.41 1.41c1.39-1.23 2.49-2.77 3.18-4.53C21.27 7.11 17 4 12 4c-1.27 0-2.49.2-3.64.57l1.65 1.65C10.66 6.09 11.32 6 12 6zm-1.07 1.14L13 9.21c.57.25 1.03.71 1.28 1.28l2.07 2.07c.08-.34.14-.7.14-1.07C16.5 9.01 14.48 7 12 7c-.37 0-.72.05-1.07.14zM2.01 3.87l2.68 2.68C3.06 7.83 1.77 9.53 1 11.5 2.73 15.89 7 19 12 19c1.52 0 2.98-.29 4.32-.82l3.42 3.42 1.41-1.41L3.42 2.45 2.01 3.87zm7.5 7.5l2.61 2.61c-.04.01-.08.02-.12.02-1.38 0-2.5-1.12-2.5-2.5 0-.05.01-.08.01-.13zm-3.4-3.4l1.75 1.75c-.23.55-.36 1.15-.36 1.78 0 2.48 2.02 4.5 4.5 4.5.63 0 1.23-.13 1.77-.36l.98.98c-.88.24-1.8.38-2.75.38-3.79 0-7.17-2.13-8.82-5.5.7-1.43 1.72-2.61 2.93-3.53z"
36
- }))
37
- };
38
- var _default = icons;
39
- exports["default"] = _default;
@@ -1,7 +0,0 @@
1
- /// <reference types="react" />
2
- declare const icons: {
3
- arrowUp: JSX.Element;
4
- arrowDown: JSX.Element;
5
- bothArrows: JSX.Element;
6
- };
7
- export default icons;
@@ -1,4 +0,0 @@
1
- /// <reference types="react" />
2
- import ResultsetTablePropsType from "./types";
3
- declare const DxcResultsetTable: ({ columns, rows, showGoToPage, itemsPerPage, itemsPerPageOptions, itemsPerPageFunction, margin, tabIndex, }: ResultsetTablePropsType) => JSX.Element;
4
- export default DxcResultsetTable;
package/select/Icons.d.ts DELETED
@@ -1,10 +0,0 @@
1
- /// <reference types="react" />
2
- declare const selectIcons: {
3
- error: JSX.Element;
4
- arrowUp: JSX.Element;
5
- arrowDown: JSX.Element;
6
- clear: JSX.Element;
7
- selected: JSX.Element;
8
- searchOff: JSX.Element;
9
- };
10
- export default selectIcons;
package/select/Icons.js DELETED
@@ -1,93 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports["default"] = void 0;
9
-
10
- var _react = _interopRequireDefault(require("react"));
11
-
12
- var selectIcons = {
13
- error: /*#__PURE__*/_react["default"].createElement("svg", {
14
- role: "img",
15
- xmlns: "http://www.w3.org/2000/svg",
16
- height: "24px",
17
- viewBox: "0 0 24 24",
18
- width: "24px",
19
- fill: "currentColor"
20
- }, /*#__PURE__*/_react["default"].createElement("path", {
21
- d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z"
22
- })),
23
- arrowUp: /*#__PURE__*/_react["default"].createElement("svg", {
24
- role: "img",
25
- xmlns: "http://www.w3.org/2000/svg",
26
- height: "24px",
27
- viewBox: "0 0 24 24",
28
- width: "24px",
29
- fill: "currentColor"
30
- }, /*#__PURE__*/_react["default"].createElement("path", {
31
- d: "M0 0h24v24H0V0z",
32
- fill: "none"
33
- }), /*#__PURE__*/_react["default"].createElement("path", {
34
- d: "M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6 1.41 1.41z"
35
- })),
36
- arrowDown: /*#__PURE__*/_react["default"].createElement("svg", {
37
- role: "img",
38
- xmlns: "http://www.w3.org/2000/svg",
39
- height: "24px",
40
- viewBox: "0 0 24 24",
41
- width: "24px",
42
- fill: "currentColor"
43
- }, /*#__PURE__*/_react["default"].createElement("path", {
44
- d: "M0 0h24v24H0V0z",
45
- fill: "none"
46
- }), /*#__PURE__*/_react["default"].createElement("path", {
47
- d: "M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z"
48
- })),
49
- clear: /*#__PURE__*/_react["default"].createElement("svg", {
50
- role: "img",
51
- xmlns: "http://www.w3.org/2000/svg",
52
- width: "24",
53
- height: "24",
54
- viewBox: "0 0 24 24",
55
- fill: "currentColor"
56
- }, /*#__PURE__*/_react["default"].createElement("path", {
57
- d: "M0 0h24v24H0V0z",
58
- fill: "none"
59
- }), /*#__PURE__*/_react["default"].createElement("path", {
60
- d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z"
61
- })),
62
- selected: /*#__PURE__*/_react["default"].createElement("svg", {
63
- role: "img",
64
- xmlns: "http://www.w3.org/2000/svg",
65
- height: "24px",
66
- viewBox: "0 0 24 24",
67
- width: "24px",
68
- fill: "currentColor"
69
- }, /*#__PURE__*/_react["default"].createElement("path", {
70
- d: "M0 0h24v24H0z",
71
- fill: "none"
72
- }), /*#__PURE__*/_react["default"].createElement("path", {
73
- d: "M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z"
74
- })),
75
- searchOff: /*#__PURE__*/_react["default"].createElement("svg", {
76
- role: "img",
77
- xmlns: "http://www.w3.org/2000/svg",
78
- height: "24px",
79
- viewBox: "0 0 24 24",
80
- width: "24px",
81
- fill: "currentColor"
82
- }, /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].createElement("rect", {
83
- fill: "none",
84
- height: "24",
85
- width: "24"
86
- })), /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].createElement("path", {
87
- d: "M15.5,14h-0.79l-0.28-0.27C15.41,12.59,16,11.11,16,9.5C16,5.91,13.09,3,9.5,3C6.08,3,3.28,5.64,3.03,9h2.02 C5.3,6.75,7.18,5,9.5,5C11.99,5,14,7.01,14,9.5S11.99,14,9.5,14c-0.17,0-0.33-0.03-0.5-0.05v2.02C9.17,15.99,9.33,16,9.5,16 c1.61,0,3.09-0.59,4.23-1.57L14,14.71v0.79l5,4.99L20.49,19L15.5,14z"
88
- }), /*#__PURE__*/_react["default"].createElement("polygon", {
89
- points: "6.47,10.82 4,13.29 1.53,10.82 0.82,11.53 3.29,14 0.82,16.47 1.53,17.18 4,14.71 6.47,17.18 7.18,16.47 4.71,14 7.18,11.53"
90
- }))))
91
- };
92
- var _default = selectIcons;
93
- exports["default"] = _default;
@@ -1,7 +0,0 @@
1
- /// <reference types="react" />
2
- declare const icons: {
3
- collapsedIcon: JSX.Element;
4
- collapsableIcon: JSX.Element;
5
- externalLinkIcon: JSX.Element;
6
- };
7
- export default icons;