@dxc-technology/halstack-react 0.0.0-f53e801 → 0.0.0-f6290b3

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 (313) hide show
  1. package/BackgroundColorContext.d.ts +1 -10
  2. package/BackgroundColorContext.js +5 -22
  3. package/HalstackContext.d.ts +1243 -6
  4. package/HalstackContext.js +125 -110
  5. package/README.md +47 -0
  6. package/accordion/Accordion.d.ts +1 -1
  7. package/accordion/Accordion.js +116 -160
  8. package/accordion/Accordion.stories.tsx +101 -125
  9. package/accordion/Accordion.test.js +25 -41
  10. package/accordion/types.d.ts +5 -16
  11. package/accordion-group/AccordionGroup.d.ts +4 -3
  12. package/accordion-group/AccordionGroup.js +30 -98
  13. package/accordion-group/AccordionGroup.stories.tsx +94 -67
  14. package/accordion-group/AccordionGroup.test.js +52 -105
  15. package/accordion-group/AccordionGroupAccordion.d.ts +4 -0
  16. package/accordion-group/AccordionGroupAccordion.js +31 -0
  17. package/accordion-group/types.d.ts +11 -16
  18. package/action-icon/ActionIcon.d.ts +4 -0
  19. package/action-icon/ActionIcon.js +47 -0
  20. package/action-icon/ActionIcon.stories.tsx +41 -0
  21. package/action-icon/ActionIcon.test.js +64 -0
  22. package/action-icon/types.d.ts +26 -0
  23. package/alert/Alert.js +20 -59
  24. package/alert/Alert.stories.tsx +28 -0
  25. package/alert/Alert.test.js +29 -46
  26. package/alert/types.d.ts +5 -5
  27. package/badge/Badge.d.ts +1 -1
  28. package/badge/Badge.js +141 -43
  29. package/badge/Badge.stories.tsx +210 -0
  30. package/badge/Badge.test.js +30 -0
  31. package/badge/types.d.ts +52 -3
  32. package/bleed/Bleed.js +13 -21
  33. package/bleed/Bleed.stories.tsx +1 -0
  34. package/bleed/types.d.ts +2 -2
  35. package/box/Box.d.ts +1 -1
  36. package/box/Box.js +19 -60
  37. package/box/Box.stories.tsx +38 -51
  38. package/box/Box.test.js +2 -7
  39. package/box/types.d.ts +3 -14
  40. package/bulleted-list/BulletedList.js +19 -53
  41. package/bulleted-list/BulletedList.stories.tsx +8 -93
  42. package/bulleted-list/types.d.ts +32 -5
  43. package/button/Button.d.ts +1 -1
  44. package/button/Button.js +69 -105
  45. package/button/Button.stories.tsx +152 -91
  46. package/button/Button.test.js +20 -17
  47. package/button/types.d.ts +8 -4
  48. package/card/Card.d.ts +1 -1
  49. package/card/Card.js +48 -89
  50. package/card/Card.stories.tsx +12 -42
  51. package/card/Card.test.js +11 -22
  52. package/card/types.d.ts +6 -11
  53. package/checkbox/Checkbox.d.ts +2 -2
  54. package/checkbox/Checkbox.js +140 -182
  55. package/checkbox/Checkbox.stories.tsx +128 -94
  56. package/checkbox/Checkbox.test.js +160 -39
  57. package/checkbox/types.d.ts +11 -3
  58. package/chip/Chip.js +39 -79
  59. package/chip/Chip.stories.tsx +121 -26
  60. package/chip/Chip.test.js +16 -31
  61. package/chip/types.d.ts +4 -4
  62. package/common/OpenSans.css +68 -80
  63. package/common/coreTokens.d.ts +237 -0
  64. package/common/coreTokens.js +184 -0
  65. package/common/utils.d.ts +1 -0
  66. package/common/utils.js +6 -12
  67. package/common/variables.d.ts +1395 -0
  68. package/common/variables.js +927 -1164
  69. package/container/Container.d.ts +4 -0
  70. package/container/Container.js +194 -0
  71. package/container/Container.stories.tsx +214 -0
  72. package/container/types.d.ts +74 -0
  73. package/contextual-menu/ContextualMenu.d.ts +7 -0
  74. package/contextual-menu/ContextualMenu.js +71 -0
  75. package/contextual-menu/ContextualMenu.stories.tsx +182 -0
  76. package/contextual-menu/ContextualMenu.test.js +71 -0
  77. package/contextual-menu/MenuItemAction.d.ts +4 -0
  78. package/contextual-menu/MenuItemAction.js +46 -0
  79. package/contextual-menu/types.d.ts +22 -0
  80. package/date-input/Calendar.d.ts +4 -0
  81. package/date-input/Calendar.js +214 -0
  82. package/date-input/DateInput.js +150 -299
  83. package/date-input/DateInput.stories.tsx +203 -56
  84. package/date-input/DateInput.test.js +700 -371
  85. package/date-input/DatePicker.d.ts +4 -0
  86. package/date-input/DatePicker.js +115 -0
  87. package/date-input/Icons.d.ts +6 -0
  88. package/date-input/Icons.js +58 -0
  89. package/date-input/YearPicker.d.ts +4 -0
  90. package/date-input/YearPicker.js +100 -0
  91. package/date-input/types.d.ts +72 -15
  92. package/dialog/Dialog.d.ts +1 -1
  93. package/dialog/Dialog.js +60 -118
  94. package/dialog/Dialog.stories.tsx +320 -166
  95. package/dialog/Dialog.test.js +269 -32
  96. package/dialog/types.d.ts +18 -25
  97. package/divider/Divider.d.ts +4 -0
  98. package/divider/Divider.js +36 -0
  99. package/divider/Divider.stories.tsx +223 -0
  100. package/divider/Divider.test.js +38 -0
  101. package/divider/types.d.ts +19 -0
  102. package/divider/types.js +5 -0
  103. package/dropdown/Dropdown.js +81 -132
  104. package/dropdown/Dropdown.stories.tsx +210 -84
  105. package/dropdown/Dropdown.test.js +410 -402
  106. package/dropdown/DropdownMenu.js +20 -37
  107. package/dropdown/DropdownMenuItem.js +10 -35
  108. package/dropdown/types.d.ts +18 -20
  109. package/file-input/FileInput.d.ts +2 -2
  110. package/file-input/FileInput.js +241 -355
  111. package/file-input/FileInput.stories.tsx +123 -12
  112. package/file-input/FileInput.test.js +369 -367
  113. package/file-input/FileItem.d.ts +4 -14
  114. package/file-input/FileItem.js +45 -96
  115. package/file-input/types.d.ts +25 -8
  116. package/flex/Flex.d.ts +1 -1
  117. package/flex/Flex.js +40 -40
  118. package/flex/Flex.stories.tsx +35 -26
  119. package/flex/types.d.ts +84 -8
  120. package/footer/Footer.d.ts +1 -1
  121. package/footer/Footer.js +70 -117
  122. package/footer/Footer.stories.tsx +60 -19
  123. package/footer/Footer.test.js +33 -57
  124. package/footer/Icons.d.ts +3 -2
  125. package/footer/Icons.js +66 -7
  126. package/footer/types.d.ts +25 -26
  127. package/grid/Grid.d.ts +7 -0
  128. package/grid/Grid.js +76 -0
  129. package/grid/Grid.stories.tsx +219 -0
  130. package/grid/types.d.ts +115 -0
  131. package/grid/types.js +5 -0
  132. package/header/Header.d.ts +4 -3
  133. package/header/Header.js +48 -133
  134. package/header/Header.stories.tsx +118 -39
  135. package/header/Header.test.js +13 -26
  136. package/header/Icons.d.ts +2 -2
  137. package/header/Icons.js +2 -7
  138. package/header/types.d.ts +7 -21
  139. package/heading/Heading.js +10 -32
  140. package/heading/Heading.test.js +71 -88
  141. package/heading/types.d.ts +7 -7
  142. package/image/Image.d.ts +4 -0
  143. package/image/Image.js +70 -0
  144. package/image/Image.stories.tsx +129 -0
  145. package/image/types.d.ts +72 -0
  146. package/image/types.js +5 -0
  147. package/inset/Inset.js +13 -21
  148. package/inset/Inset.stories.tsx +2 -1
  149. package/inset/types.d.ts +2 -2
  150. package/layout/ApplicationLayout.d.ts +5 -5
  151. package/layout/ApplicationLayout.js +29 -66
  152. package/layout/ApplicationLayout.stories.tsx +2 -1
  153. package/layout/Icons.d.ts +8 -5
  154. package/layout/Icons.js +51 -59
  155. package/layout/SidenavContext.d.ts +1 -1
  156. package/layout/SidenavContext.js +3 -9
  157. package/layout/types.d.ts +5 -6
  158. package/link/Link.js +25 -46
  159. package/link/Link.stories.tsx +60 -0
  160. package/link/Link.test.js +24 -44
  161. package/link/types.d.ts +14 -14
  162. package/main.d.ts +9 -5
  163. package/main.js +40 -59
  164. package/{tabs-nav → nav-tabs}/NavTabs.d.ts +2 -2
  165. package/{tabs-nav → nav-tabs}/NavTabs.js +23 -55
  166. package/{tabs-nav → nav-tabs}/NavTabs.stories.tsx +115 -9
  167. package/{tabs-nav → nav-tabs}/NavTabs.test.js +39 -45
  168. package/nav-tabs/Tab.js +118 -0
  169. package/{tabs-nav → nav-tabs}/types.d.ts +14 -15
  170. package/nav-tabs/types.js +5 -0
  171. package/number-input/NumberInput.d.ts +7 -0
  172. package/number-input/NumberInput.js +47 -37
  173. package/number-input/NumberInput.stories.tsx +42 -26
  174. package/number-input/NumberInput.test.js +860 -377
  175. package/number-input/types.d.ts +11 -5
  176. package/package.json +39 -42
  177. package/paginator/Icons.d.ts +5 -0
  178. package/paginator/Icons.js +21 -47
  179. package/paginator/Paginator.js +23 -59
  180. package/paginator/Paginator.stories.tsx +24 -0
  181. package/paginator/Paginator.test.js +253 -226
  182. package/paginator/types.d.ts +3 -3
  183. package/paragraph/Paragraph.d.ts +3 -4
  184. package/paragraph/Paragraph.js +6 -22
  185. package/paragraph/Paragraph.stories.tsx +0 -17
  186. package/password-input/Icons.d.ts +6 -0
  187. package/password-input/Icons.js +35 -0
  188. package/password-input/PasswordInput.js +57 -126
  189. package/password-input/PasswordInput.stories.tsx +1 -33
  190. package/password-input/PasswordInput.test.js +160 -142
  191. package/password-input/types.d.ts +8 -7
  192. package/progress-bar/ProgressBar.d.ts +2 -2
  193. package/progress-bar/ProgressBar.js +23 -55
  194. package/progress-bar/{ProgressBar.stories.jsx → ProgressBar.stories.tsx} +36 -3
  195. package/progress-bar/ProgressBar.test.js +36 -53
  196. package/progress-bar/types.d.ts +4 -3
  197. package/quick-nav/QuickNav.js +15 -39
  198. package/quick-nav/QuickNav.stories.tsx +112 -20
  199. package/quick-nav/types.d.ts +10 -10
  200. package/radio-group/Radio.d.ts +1 -1
  201. package/radio-group/Radio.js +59 -76
  202. package/radio-group/RadioGroup.js +59 -105
  203. package/radio-group/RadioGroup.stories.tsx +132 -18
  204. package/radio-group/RadioGroup.test.js +518 -457
  205. package/radio-group/types.d.ts +10 -10
  206. package/resultset-table/Icons.d.ts +7 -0
  207. package/resultset-table/Icons.js +47 -0
  208. package/resultset-table/ResultsetTable.d.ts +7 -0
  209. package/resultset-table/ResultsetTable.js +166 -0
  210. package/{resultsetTable → resultset-table}/ResultsetTable.stories.tsx +152 -30
  211. package/{resultsetTable → resultset-table}/ResultsetTable.test.js +167 -144
  212. package/{resultsetTable → resultset-table}/types.d.ts +13 -7
  213. package/resultset-table/types.js +5 -0
  214. package/select/Icons.d.ts +7 -7
  215. package/select/Icons.js +1 -5
  216. package/select/Listbox.d.ts +1 -1
  217. package/select/Listbox.js +17 -73
  218. package/select/Option.js +27 -50
  219. package/select/Select.js +123 -176
  220. package/select/Select.stories.tsx +497 -153
  221. package/select/Select.test.js +1970 -1775
  222. package/select/types.d.ts +16 -17
  223. package/sidenav/Icons.d.ts +7 -0
  224. package/sidenav/Icons.js +47 -0
  225. package/sidenav/Sidenav.d.ts +2 -2
  226. package/sidenav/Sidenav.js +82 -153
  227. package/sidenav/Sidenav.stories.tsx +165 -63
  228. package/sidenav/Sidenav.test.js +3 -10
  229. package/sidenav/types.d.ts +31 -28
  230. package/slider/Slider.d.ts +2 -2
  231. package/slider/Slider.js +146 -179
  232. package/slider/Slider.test.js +164 -97
  233. package/slider/types.d.ts +7 -3
  234. package/spinner/Spinner.js +31 -75
  235. package/spinner/{Spinner.stories.jsx → Spinner.stories.tsx} +53 -27
  236. package/spinner/Spinner.test.js +26 -35
  237. package/spinner/types.d.ts +3 -3
  238. package/status-light/StatusLight.d.ts +4 -0
  239. package/status-light/StatusLight.js +51 -0
  240. package/status-light/StatusLight.stories.tsx +74 -0
  241. package/status-light/StatusLight.test.js +25 -0
  242. package/status-light/types.d.ts +17 -0
  243. package/status-light/types.js +5 -0
  244. package/switch/Switch.d.ts +3 -3
  245. package/switch/Switch.js +113 -150
  246. package/switch/Switch.stories.tsx +33 -34
  247. package/switch/Switch.test.js +70 -102
  248. package/switch/types.d.ts +8 -3
  249. package/table/DropdownTheme.js +62 -0
  250. package/table/Table.d.ts +6 -2
  251. package/table/Table.js +87 -35
  252. package/table/Table.stories.tsx +658 -0
  253. package/table/Table.test.js +95 -8
  254. package/table/types.d.ts +48 -6
  255. package/tabs/Tab.d.ts +4 -0
  256. package/tabs/Tab.js +116 -0
  257. package/tabs/Tabs.js +314 -141
  258. package/tabs/Tabs.stories.tsx +120 -6
  259. package/tabs/Tabs.test.js +223 -69
  260. package/tabs/types.d.ts +28 -18
  261. package/tag/Tag.js +29 -61
  262. package/tag/Tag.stories.tsx +14 -1
  263. package/tag/Tag.test.js +20 -31
  264. package/tag/types.d.ts +7 -7
  265. package/text-input/Icons.d.ts +8 -0
  266. package/text-input/Icons.js +56 -0
  267. package/text-input/Suggestion.js +40 -28
  268. package/text-input/Suggestions.d.ts +4 -0
  269. package/text-input/Suggestions.js +84 -0
  270. package/text-input/TextInput.js +301 -497
  271. package/text-input/TextInput.stories.tsx +266 -274
  272. package/text-input/TextInput.test.js +1419 -1375
  273. package/text-input/types.d.ts +43 -16
  274. package/textarea/Textarea.js +70 -113
  275. package/textarea/Textarea.stories.tsx +174 -0
  276. package/textarea/Textarea.test.js +152 -183
  277. package/textarea/types.d.ts +9 -5
  278. package/toggle-group/ToggleGroup.d.ts +2 -2
  279. package/toggle-group/ToggleGroup.js +92 -106
  280. package/toggle-group/ToggleGroup.stories.tsx +49 -4
  281. package/toggle-group/ToggleGroup.test.js +69 -88
  282. package/toggle-group/types.d.ts +26 -17
  283. package/typography/Typography.d.ts +2 -2
  284. package/typography/Typography.js +15 -123
  285. package/typography/Typography.stories.tsx +1 -1
  286. package/typography/types.d.ts +1 -1
  287. package/useTheme.d.ts +1147 -1
  288. package/useTheme.js +2 -9
  289. package/useTranslatedLabels.d.ts +84 -1
  290. package/useTranslatedLabels.js +1 -7
  291. package/utils/BaseTypography.d.ts +21 -0
  292. package/utils/BaseTypography.js +94 -0
  293. package/utils/FocusLock.d.ts +13 -0
  294. package/utils/FocusLock.js +124 -0
  295. package/wizard/Wizard.js +16 -51
  296. package/wizard/Wizard.stories.tsx +20 -0
  297. package/wizard/Wizard.test.js +54 -81
  298. package/wizard/types.d.ts +9 -10
  299. package/card/ice-cream.jpg +0 -0
  300. package/common/RequiredComponent.js +0 -32
  301. package/number-input/NumberInputContext.d.ts +0 -4
  302. package/number-input/NumberInputContext.js +0 -19
  303. package/number-input/numberInputContextTypes.d.ts +0 -19
  304. package/resultsetTable/ResultsetTable.d.ts +0 -4
  305. package/resultsetTable/ResultsetTable.js +0 -254
  306. package/slider/Slider.stories.tsx +0 -177
  307. package/table/Table.stories.jsx +0 -277
  308. package/tabs-nav/Tab.js +0 -130
  309. package/textarea/Textarea.stories.jsx +0 -157
  310. /package/{resultsetTable → action-icon}/types.js +0 -0
  311. /package/{tabs-nav → container}/types.js +0 -0
  312. /package/{number-input/numberInputContextTypes.js → contextual-menu/types.js} +0 -0
  313. /package/{tabs-nav → nav-tabs}/Tab.d.ts +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
- var _Wizard = _interopRequireDefault(require("./Wizard"));
10
-
6
+ var _Wizard = _interopRequireDefault(require("./Wizard.tsx"));
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
- export declare type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
- export 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
- declare type Step = {
9
+ type SVG = React.ReactNode & React.SVGProps<SVGSVGElement>;
10
+ export type StepProps = {
11
11
  /**
12
12
  * Step label.
13
13
  */
@@ -29,12 +29,11 @@ declare type Step = {
29
29
  */
30
30
  valid?: boolean;
31
31
  };
32
- export declare type Mode = "horizontal" | "vertical";
33
- declare type Props = {
32
+ type Props = {
34
33
  /**
35
- * The wizard can be showed in horizontal or vertical.
34
+ * The wizard can be shown in horizontal or vertical.
36
35
  */
37
- mode?: Mode;
36
+ mode?: "horizontal" | "vertical";
38
37
  /**
39
38
  * Initially selected step, only when it is uncontrolled.
40
39
  */
@@ -47,11 +46,11 @@ declare type Props = {
47
46
  * This function will be called when the user clicks a step. The step
48
47
  * number will be passed as a parameter.
49
48
  */
50
- onStepClick?: (newCurrentStep: number) => void;
49
+ onStepClick?: (currentStep: number) => void;
51
50
  /**
52
51
  * An array of objects representing the steps.
53
52
  */
54
- steps: Step[];
53
+ steps: StepProps[];
55
54
  /**
56
55
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
57
56
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
Binary file
@@ -1,32 +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 _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
11
-
12
- var _react = _interopRequireDefault(require("react"));
13
-
14
- var _styledComponents = _interopRequireDefault(require("styled-components"));
15
-
16
- var _propTypes = _interopRequireDefault(require("prop-types"));
17
-
18
- var _templateObject;
19
-
20
- var DxcRequired = function DxcRequired(_ref) {
21
- var _ref$theme = _ref.theme,
22
- theme = _ref$theme === void 0 ? "light" : _ref$theme;
23
- return /*#__PURE__*/_react["default"].createElement(RequiredSpan, null, "*");
24
- };
25
-
26
- var RequiredSpan = _styledComponents["default"].span(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n color: #d0011b;\n margin-right: 1px;\n cursor: default;\n"])));
27
-
28
- DxcRequired.propTypes = {
29
- theme: _propTypes["default"].oneOf(["dark", "light"])
30
- };
31
- var _default = DxcRequired;
32
- exports["default"] = _default;
@@ -1,4 +0,0 @@
1
- import React from "react";
2
- import NumberInputContextPropsType from "./numberInputContextTypes";
3
- declare const NumberInputContext: React.Context<NumberInputContextPropsType>;
4
- export default NumberInputContext;
@@ -1,19 +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 defaultState = {
13
- stepNumber: 1
14
- };
15
-
16
- var NumberInputContext = /*#__PURE__*/_react["default"].createContext(defaultState);
17
-
18
- var _default = NumberInputContext;
19
- exports["default"] = _default;
@@ -1,19 +0,0 @@
1
- declare type Props = {
2
- /**
3
- * Type of the input.
4
- */
5
- typeNumber?: string;
6
- /**
7
- * Minimum value allowed by the number input.
8
- */
9
- minNumber?: number;
10
- /**
11
- * Maximum value allowed by the number input.
12
- */
13
- maxNumber?: number;
14
- /**
15
- * The step interval to use when using the up and down arrows to adjust the value.
16
- */
17
- stepNumber?: number;
18
- };
19
- export default Props;
@@ -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;
@@ -1,254 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _typeof3 = require("@babel/runtime/helpers/typeof");
6
-
7
- Object.defineProperty(exports, "__esModule", {
8
- value: true
9
- });
10
- exports["default"] = void 0;
11
-
12
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
13
-
14
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
15
-
16
- var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
17
-
18
- var _react = _interopRequireWildcard(require("react"));
19
-
20
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
21
-
22
- var _variables = require("../common/variables.js");
23
-
24
- var _Table = _interopRequireDefault(require("../table/Table"));
25
-
26
- var _Paginator = _interopRequireDefault(require("../paginator/Paginator"));
27
-
28
- var _useTheme = _interopRequireDefault(require("../useTheme"));
29
-
30
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
31
-
32
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
33
-
34
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
35
-
36
- function normalizeSortValue(sortValue) {
37
- return typeof sortValue === "string" ? sortValue.toUpperCase() : sortValue;
38
- }
39
-
40
- function sortArray(index, order, resultset) {
41
- return resultset.slice().sort(function (element1, element2) {
42
- var sortValueA = normalizeSortValue(element1[index].sortValue || element1[index].displayValue);
43
- var sortValueB = normalizeSortValue(element2[index].sortValue || element2[index].displayValue);
44
- var comparison = 0;
45
-
46
- if ((0, _typeof2["default"])(sortValueA) === "object") {
47
- comparison = -1;
48
- } else if ((0, _typeof2["default"])(sortValueB) === "object") {
49
- comparison = 1;
50
- } else if (sortValueA > sortValueB) {
51
- comparison = 1;
52
- } else if (sortValueA < sortValueB) {
53
- comparison = -1;
54
- }
55
-
56
- return order === "desc" ? comparison * -1 : comparison;
57
- });
58
- }
59
-
60
- var getMinItemsPerPageIndex = function getMinItemsPerPageIndex(currentPageInternal, itemsPerPage, page) {
61
- return currentPageInternal === 1 ? 0 : itemsPerPage * (page - 1);
62
- };
63
-
64
- var getMaxItemsPerPageIndex = function getMaxItemsPerPageIndex(minItemsPerPageIndex, itemsPerPage, resultset, page) {
65
- return minItemsPerPageIndex + itemsPerPage > resultset.length ? resultset.length : itemsPerPage * page - 1;
66
- };
67
-
68
- var ArrowUp = function ArrowUp() {
69
- return /*#__PURE__*/_react["default"].createElement("svg", {
70
- xmlns: "http://www.w3.org/2000/svg",
71
- height: "24",
72
- viewBox: "0 0 24 24",
73
- width: "24",
74
- fill: "currentColor"
75
- }, /*#__PURE__*/_react["default"].createElement("path", {
76
- d: "M0 0h24v24H0V0z",
77
- fill: "none"
78
- }), /*#__PURE__*/_react["default"].createElement("path", {
79
- d: "M4 12l1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8-8 8z"
80
- }));
81
- };
82
-
83
- var ArrowDown = function ArrowDown() {
84
- return /*#__PURE__*/_react["default"].createElement("svg", {
85
- xmlns: "http://www.w3.org/2000/svg",
86
- height: "24",
87
- viewBox: "0 0 24 24",
88
- width: "24",
89
- fill: "currentColor"
90
- }, /*#__PURE__*/_react["default"].createElement("path", {
91
- d: "M0 0h24v24H0V0z",
92
- fill: "none"
93
- }), /*#__PURE__*/_react["default"].createElement("path", {
94
- d: "M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
95
- }));
96
- };
97
-
98
- var BothArrows = function BothArrows() {
99
- return /*#__PURE__*/_react["default"].createElement("svg", {
100
- xmlns: "http://www.w3.org/2000/svg",
101
- height: "24",
102
- viewBox: "0 0 24 24",
103
- width: "24",
104
- fill: "currentColor"
105
- }, /*#__PURE__*/_react["default"].createElement("path", {
106
- d: "M0 0h24v24H0z",
107
- fill: "none"
108
- }), /*#__PURE__*/_react["default"].createElement("path", {
109
- d: "M12 5.83L15.17 9l1.41-1.41L12 3 7.41 7.59 8.83 9 12 5.83zm0 12.34L8.83 15l-1.41 1.41L12 21l4.59-4.59L15.17 15 12 18.17z"
110
- }));
111
- };
112
-
113
- var DxcResultsetTable = function DxcResultsetTable(_ref) {
114
- var columns = _ref.columns,
115
- rows = _ref.rows,
116
- _ref$showGoToPage = _ref.showGoToPage,
117
- showGoToPage = _ref$showGoToPage === void 0 ? true : _ref$showGoToPage,
118
- _ref$itemsPerPage = _ref.itemsPerPage,
119
- itemsPerPage = _ref$itemsPerPage === void 0 ? 5 : _ref$itemsPerPage,
120
- itemsPerPageOptions = _ref.itemsPerPageOptions,
121
- itemsPerPageFunction = _ref.itemsPerPageFunction,
122
- margin = _ref.margin,
123
- _ref$tabIndex = _ref.tabIndex,
124
- tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex;
125
- var colorsTheme = (0, _useTheme["default"])();
126
-
127
- var _useState = (0, _react.useState)(1),
128
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
129
- page = _useState2[0],
130
- changePage = _useState2[1];
131
-
132
- var _useState3 = (0, _react.useState)(""),
133
- _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
134
- sortColumnIndex = _useState4[0],
135
- changeSortColumnIndex = _useState4[1];
136
-
137
- var _useState5 = (0, _react.useState)("asc"),
138
- _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
139
- sortOrder = _useState6[0],
140
- changeSortOrder = _useState6[1];
141
-
142
- var minItemsPerPageIndex = (0, _react.useMemo)(function () {
143
- return getMinItemsPerPageIndex(page, itemsPerPage, page);
144
- }, [itemsPerPage, page]);
145
- var maxItemsPerPageIndex = (0, _react.useMemo)(function () {
146
- return getMaxItemsPerPageIndex(minItemsPerPageIndex, itemsPerPage, rows, page);
147
- }, [itemsPerPage, minItemsPerPageIndex, page, rows]);
148
-
149
- var goToPage = function goToPage(newPage) {
150
- changePage(newPage);
151
- };
152
-
153
- var changeSorting = function changeSorting(columnIndex) {
154
- changePage(1);
155
- changeSortColumnIndex(columnIndex);
156
- changeSortOrder(sortColumnIndex === "" || sortColumnIndex !== columnIndex ? "asc" : sortOrder === "asc" ? "desc" : "asc");
157
- };
158
-
159
- var getIconForSortableColumn = function getIconForSortableColumn(clickedColumnIndex) {
160
- return sortColumnIndex === clickedColumnIndex ? sortOrder === "asc" ? /*#__PURE__*/_react["default"].createElement(ArrowUp, null) : /*#__PURE__*/_react["default"].createElement(ArrowDown, null) : /*#__PURE__*/_react["default"].createElement(BothArrows, null);
161
- };
162
-
163
- (0, _react.useEffect)(function () {
164
- if (rows.length > 0) {
165
- changePage(1);
166
- } else {
167
- changePage(0);
168
- }
169
- }, [rows.length, itemsPerPage]);
170
- var sortedResultset = (0, _react.useMemo)(function () {
171
- return sortColumnIndex !== "" ? sortArray(sortColumnIndex, sortOrder, rows) : rows;
172
- }, [sortColumnIndex, sortOrder, rows]);
173
- var filteredResultset = (0, _react.useMemo)(function () {
174
- return sortedResultset && sortedResultset.slice(minItemsPerPageIndex, maxItemsPerPageIndex + 1);
175
- }, [sortedResultset, minItemsPerPageIndex, maxItemsPerPageIndex]);
176
- return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
177
- theme: colorsTheme.table
178
- }, /*#__PURE__*/_react["default"].createElement(DxcResultsetTableContainer, {
179
- margin: margin
180
- }, /*#__PURE__*/_react["default"].createElement(TableContainer, null, /*#__PURE__*/_react["default"].createElement(_Table["default"], null, /*#__PURE__*/_react["default"].createElement(HeaderRow, null, /*#__PURE__*/_react["default"].createElement("tr", null, columns.map(function (column, index) {
181
- return /*#__PURE__*/_react["default"].createElement(TableHeader, {
182
- key: "tableHeader_".concat(index)
183
- }, /*#__PURE__*/_react["default"].createElement(HeaderContainer, {
184
- key: "headerContainer_".concat(index),
185
- onClick: function onClick() {
186
- return column.isSortable && changeSorting(index);
187
- },
188
- tabIndex: column.isSortable ? tabIndex : -1,
189
- isSortable: column.isSortable
190
- }, /*#__PURE__*/_react["default"].createElement(TitleDiv, {
191
- isSortable: column.isSortable
192
- }, column.displayValue), column.isSortable && /*#__PURE__*/_react["default"].createElement(SortIcon, null, getIconForSortableColumn(index))));
193
- }))), /*#__PURE__*/_react["default"].createElement(TableRowGroup, null, filteredResultset.map(function (cells, index) {
194
- return /*#__PURE__*/_react["default"].createElement("tr", {
195
- key: "resultSetTableCell_".concat(index)
196
- }, cells.map(function (cellContent, index) {
197
- return /*#__PURE__*/_react["default"].createElement("td", {
198
- key: "resultSetTableCellContent_".concat(index)
199
- }, cellContent.displayValue);
200
- }));
201
- })))), /*#__PURE__*/_react["default"].createElement(PaginatorContainer, null, /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
202
- totalItems: rows.length,
203
- itemsPerPage: itemsPerPage,
204
- itemsPerPageOptions: itemsPerPageOptions,
205
- itemsPerPageFunction: itemsPerPageFunction,
206
- currentPage: page,
207
- showGoToPage: showGoToPage,
208
- onPageChange: goToPage,
209
- tabIndex: tabIndex
210
- }))));
211
- };
212
-
213
- var TableContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n & table {\n table-layout: auto;\n }\n"])));
214
-
215
- var PaginatorContainer = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])([""])));
216
-
217
- var TableRowGroup = _styledComponents["default"].tbody(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n > div:nth-child(1) {\n position: absolute;\n left: calc(50% - 68.5px);\n bottom: calc(50% - 68.5px - 30px);\n }\n & tr {\n height: ", ";\n }\n"])), function (props) {
218
- return props.theme.rowHeight || "70px";
219
- });
220
-
221
- var SortIcon = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n top: 409px;\n left: 390px;\n height: 14px;\n cursor: pointer;\n color: ", ";\n\n svg {\n height: 100%;\n width: 100%;\n }\n"])), function (props) {
222
- return props.theme.sortIconColor;
223
- });
224
-
225
- var TitleDiv = _styledComponents["default"].div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n cursor: ", ";\n"])), function (props) {
226
- return props.isSortable && "pointer" || "default";
227
- });
228
-
229
- var TableHeader = _styledComponents["default"].th(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])([""])));
230
-
231
- var HeaderContainer = _styledComponents["default"].div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n align-items: center;\n justify-content: ", ";\n width: fit-content;\n :focus {\n ", "\n }\n"])), function (props) {
232
- return props.theme.headerTextAlign === "center" ? "center" : props.theme.headerTextAlign === "right" ? "flex-end" : "flex-start";
233
- }, function (props) {
234
- return props.isSortable && "outline: #0095ff solid 2px; \n outline-offset: 4px;";
235
- });
236
-
237
- var HeaderRow = _styledComponents["default"].thead(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["\n height: 60px;\n"])));
238
-
239
- var DxcResultsetTableContainer = _styledComponents["default"].div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["\n font-size: ", ";\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n"])), function (props) {
240
- return props.theme.fontSizeBase;
241
- }, function (props) {
242
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
243
- }, function (props) {
244
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
245
- }, function (props) {
246
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
247
- }, function (props) {
248
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
249
- }, function (props) {
250
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
251
- });
252
-
253
- var _default = DxcResultsetTable;
254
- exports["default"] = _default;