@dxc-technology/halstack-react 0.0.0-50c4df3 → 0.0.0-51152f3

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 (278) hide show
  1. package/BackgroundColorContext.d.ts +1 -10
  2. package/BackgroundColorContext.js +5 -22
  3. package/HalstackContext.d.ts +1231 -6
  4. package/HalstackContext.js +67 -100
  5. package/README.md +47 -0
  6. package/accordion/Accordion.d.ts +1 -1
  7. package/accordion/Accordion.js +30 -87
  8. package/accordion/Accordion.stories.tsx +2 -114
  9. package/accordion/Accordion.test.js +19 -34
  10. package/accordion/types.d.ts +5 -17
  11. package/accordion-group/AccordionGroup.d.ts +4 -3
  12. package/accordion-group/AccordionGroup.js +29 -77
  13. package/accordion-group/AccordionGroup.stories.tsx +78 -77
  14. package/accordion-group/AccordionGroup.test.js +44 -72
  15. package/accordion-group/AccordionGroupAccordion.d.ts +4 -0
  16. package/accordion-group/AccordionGroupAccordion.js +31 -0
  17. package/accordion-group/types.d.ts +6 -18
  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 +19 -58
  24. package/alert/Alert.test.js +29 -46
  25. package/alert/types.d.ts +5 -5
  26. package/badge/Badge.d.ts +1 -1
  27. package/badge/Badge.js +141 -43
  28. package/badge/Badge.stories.tsx +210 -0
  29. package/badge/Badge.test.js +30 -0
  30. package/badge/types.d.ts +52 -3
  31. package/bleed/Bleed.js +13 -21
  32. package/bleed/Bleed.stories.tsx +1 -0
  33. package/bleed/types.d.ts +2 -2
  34. package/box/Box.d.ts +1 -1
  35. package/box/Box.js +18 -59
  36. package/box/Box.stories.tsx +25 -53
  37. package/box/Box.test.js +2 -7
  38. package/box/types.d.ts +3 -15
  39. package/bulleted-list/BulletedList.js +19 -53
  40. package/bulleted-list/BulletedList.stories.tsx +8 -93
  41. package/bulleted-list/types.d.ts +32 -5
  42. package/button/Button.d.ts +1 -1
  43. package/button/Button.js +68 -102
  44. package/button/Button.stories.tsx +9 -90
  45. package/button/Button.test.js +20 -17
  46. package/button/types.d.ts +8 -4
  47. package/card/Card.d.ts +1 -1
  48. package/card/Card.js +48 -89
  49. package/card/Card.stories.tsx +12 -42
  50. package/card/Card.test.js +11 -22
  51. package/card/types.d.ts +6 -12
  52. package/checkbox/Checkbox.js +87 -122
  53. package/checkbox/Checkbox.stories.tsx +16 -54
  54. package/checkbox/Checkbox.test.js +108 -64
  55. package/checkbox/types.d.ts +8 -4
  56. package/chip/Chip.js +36 -70
  57. package/chip/Chip.stories.tsx +25 -17
  58. package/chip/Chip.test.js +16 -31
  59. package/chip/types.d.ts +4 -4
  60. package/common/OpenSans.css +68 -80
  61. package/common/coreTokens.d.ts +237 -0
  62. package/common/coreTokens.js +184 -0
  63. package/common/utils.d.ts +1 -0
  64. package/common/utils.js +6 -12
  65. package/common/variables.d.ts +1383 -0
  66. package/common/variables.js +880 -1163
  67. package/container/Container.d.ts +4 -0
  68. package/container/Container.js +194 -0
  69. package/container/Container.stories.tsx +214 -0
  70. package/container/types.d.ts +74 -0
  71. package/date-input/Calendar.js +15 -59
  72. package/date-input/DateInput.js +50 -96
  73. package/date-input/DateInput.stories.tsx +11 -30
  74. package/date-input/DateInput.test.js +674 -701
  75. package/date-input/DatePicker.js +11 -42
  76. package/date-input/Icons.d.ts +6 -6
  77. package/date-input/Icons.js +6 -23
  78. package/date-input/YearPicker.js +8 -34
  79. package/date-input/types.d.ts +27 -21
  80. package/dialog/Dialog.d.ts +1 -1
  81. package/dialog/Dialog.js +61 -117
  82. package/dialog/Dialog.stories.tsx +292 -216
  83. package/dialog/Dialog.test.js +269 -32
  84. package/dialog/types.d.ts +18 -26
  85. package/dropdown/Dropdown.js +50 -102
  86. package/dropdown/Dropdown.test.js +393 -379
  87. package/dropdown/DropdownMenu.js +13 -20
  88. package/dropdown/DropdownMenuItem.js +5 -19
  89. package/dropdown/types.d.ts +17 -19
  90. package/file-input/FileInput.js +181 -250
  91. package/file-input/FileInput.stories.tsx +1 -1
  92. package/file-input/FileInput.test.js +357 -355
  93. package/file-input/FileItem.js +14 -41
  94. package/file-input/types.d.ts +10 -10
  95. package/flex/Flex.js +27 -39
  96. package/flex/Flex.stories.tsx +35 -26
  97. package/flex/types.d.ts +74 -9
  98. package/footer/Footer.d.ts +1 -1
  99. package/footer/Footer.js +70 -117
  100. package/footer/Footer.stories.tsx +38 -95
  101. package/footer/Footer.test.js +33 -57
  102. package/footer/Icons.d.ts +3 -2
  103. package/footer/Icons.js +66 -7
  104. package/footer/types.d.ts +25 -27
  105. package/grid/Grid.d.ts +7 -0
  106. package/grid/Grid.js +76 -0
  107. package/grid/Grid.stories.tsx +219 -0
  108. package/grid/types.d.ts +115 -0
  109. package/grid/types.js +5 -0
  110. package/header/Header.d.ts +4 -3
  111. package/header/Header.js +34 -117
  112. package/header/Header.stories.tsx +7 -71
  113. package/header/Header.test.js +13 -26
  114. package/header/Icons.d.ts +2 -2
  115. package/header/Icons.js +2 -7
  116. package/header/types.d.ts +5 -20
  117. package/heading/Heading.js +10 -32
  118. package/heading/Heading.test.js +71 -88
  119. package/heading/types.d.ts +7 -7
  120. package/image/Image.d.ts +4 -0
  121. package/image/Image.js +70 -0
  122. package/image/Image.stories.tsx +127 -0
  123. package/image/types.d.ts +72 -0
  124. package/image/types.js +5 -0
  125. package/inset/Inset.js +13 -21
  126. package/inset/Inset.stories.tsx +2 -1
  127. package/inset/types.d.ts +2 -2
  128. package/layout/ApplicationLayout.d.ts +5 -5
  129. package/layout/ApplicationLayout.js +29 -66
  130. package/layout/ApplicationLayout.stories.tsx +1 -1
  131. package/layout/Icons.d.ts +8 -5
  132. package/layout/Icons.js +51 -59
  133. package/layout/SidenavContext.d.ts +1 -1
  134. package/layout/SidenavContext.js +3 -9
  135. package/layout/types.d.ts +5 -6
  136. package/link/Link.js +24 -45
  137. package/link/Link.test.js +24 -44
  138. package/link/types.d.ts +14 -14
  139. package/main.d.ts +7 -4
  140. package/main.js +32 -58
  141. package/nav-tabs/NavTabs.d.ts +2 -2
  142. package/nav-tabs/NavTabs.js +22 -54
  143. package/nav-tabs/NavTabs.stories.tsx +21 -5
  144. package/nav-tabs/NavTabs.test.js +39 -45
  145. package/nav-tabs/Tab.js +43 -75
  146. package/nav-tabs/types.d.ts +14 -15
  147. package/number-input/NumberInput.d.ts +7 -0
  148. package/number-input/NumberInput.js +47 -37
  149. package/number-input/NumberInput.stories.tsx +42 -26
  150. package/number-input/NumberInput.test.js +860 -413
  151. package/number-input/types.d.ts +11 -5
  152. package/package.json +31 -29
  153. package/paginator/Icons.d.ts +5 -5
  154. package/paginator/Icons.js +5 -19
  155. package/paginator/Paginator.js +17 -47
  156. package/paginator/Paginator.test.js +235 -215
  157. package/paginator/types.d.ts +3 -3
  158. package/paragraph/Paragraph.d.ts +3 -4
  159. package/paragraph/Paragraph.js +6 -22
  160. package/paragraph/Paragraph.stories.tsx +0 -17
  161. package/password-input/Icons.d.ts +6 -0
  162. package/password-input/Icons.js +35 -0
  163. package/password-input/PasswordInput.js +57 -126
  164. package/password-input/PasswordInput.stories.tsx +1 -33
  165. package/password-input/PasswordInput.test.js +158 -141
  166. package/password-input/types.d.ts +8 -7
  167. package/progress-bar/ProgressBar.d.ts +2 -2
  168. package/progress-bar/ProgressBar.js +22 -54
  169. package/progress-bar/{ProgressBar.stories.jsx → ProgressBar.stories.tsx} +1 -1
  170. package/progress-bar/ProgressBar.test.js +36 -53
  171. package/progress-bar/types.d.ts +4 -3
  172. package/quick-nav/QuickNav.js +4 -27
  173. package/quick-nav/QuickNav.stories.tsx +1 -1
  174. package/quick-nav/types.d.ts +10 -10
  175. package/radio-group/Radio.d.ts +1 -1
  176. package/radio-group/Radio.js +31 -63
  177. package/radio-group/RadioGroup.js +45 -93
  178. package/radio-group/RadioGroup.stories.tsx +10 -10
  179. package/radio-group/RadioGroup.test.js +505 -471
  180. package/radio-group/types.d.ts +8 -8
  181. package/resultset-table/Icons.d.ts +7 -0
  182. package/{resultsetTable → resultset-table}/Icons.js +1 -5
  183. package/resultset-table/ResultsetTable.d.ts +7 -0
  184. package/{resultsetTable → resultset-table}/ResultsetTable.js +38 -66
  185. package/{resultsetTable → resultset-table}/ResultsetTable.stories.tsx +86 -5
  186. package/{resultsetTable → resultset-table}/ResultsetTable.test.js +139 -93
  187. package/{resultsetTable → resultset-table}/types.d.ts +13 -7
  188. package/resultset-table/types.js +5 -0
  189. package/select/Icons.d.ts +7 -7
  190. package/select/Icons.js +1 -5
  191. package/select/Listbox.js +13 -39
  192. package/select/Option.js +17 -27
  193. package/select/Select.js +94 -168
  194. package/select/Select.stories.tsx +3 -3
  195. package/select/Select.test.js +1952 -1810
  196. package/select/types.d.ts +14 -15
  197. package/sidenav/Icons.d.ts +7 -0
  198. package/sidenav/Icons.js +47 -0
  199. package/sidenav/Sidenav.d.ts +2 -2
  200. package/sidenav/Sidenav.js +81 -151
  201. package/sidenav/Sidenav.stories.tsx +60 -60
  202. package/sidenav/Sidenav.test.js +3 -10
  203. package/sidenav/types.d.ts +31 -28
  204. package/slider/Slider.js +70 -128
  205. package/slider/Slider.test.js +108 -104
  206. package/slider/types.d.ts +4 -4
  207. package/spinner/Spinner.js +29 -73
  208. package/spinner/{Spinner.stories.jsx → Spinner.stories.tsx} +28 -28
  209. package/spinner/Spinner.test.js +26 -35
  210. package/spinner/types.d.ts +3 -3
  211. package/status-light/StatusLight.d.ts +4 -0
  212. package/status-light/StatusLight.js +51 -0
  213. package/status-light/StatusLight.stories.tsx +74 -0
  214. package/status-light/StatusLight.test.js +25 -0
  215. package/status-light/types.d.ts +17 -0
  216. package/status-light/types.js +5 -0
  217. package/switch/Switch.js +51 -99
  218. package/switch/Switch.stories.tsx +0 -34
  219. package/switch/Switch.test.js +52 -97
  220. package/switch/types.d.ts +4 -4
  221. package/table/ActionsCell.d.ts +4 -0
  222. package/table/ActionsCell.js +55 -0
  223. package/table/DropdownTheme.js +58 -0
  224. package/table/Table.d.ts +4 -1
  225. package/table/Table.js +27 -32
  226. package/table/{Table.stories.jsx → Table.stories.tsx} +261 -2
  227. package/table/Table.test.js +94 -7
  228. package/table/types.d.ts +45 -6
  229. package/tabs/Tab.js +23 -40
  230. package/tabs/Tabs.js +62 -145
  231. package/tabs/Tabs.stories.tsx +1 -1
  232. package/tabs/Tabs.test.js +66 -123
  233. package/tabs/types.d.ts +19 -19
  234. package/tag/Tag.js +28 -60
  235. package/tag/Tag.test.js +20 -31
  236. package/tag/types.d.ts +7 -7
  237. package/text-input/Icons.d.ts +5 -5
  238. package/text-input/Icons.js +1 -5
  239. package/text-input/Suggestion.js +11 -28
  240. package/text-input/Suggestions.d.ts +1 -1
  241. package/text-input/Suggestions.js +15 -65
  242. package/text-input/TextInput.js +220 -328
  243. package/text-input/TextInput.stories.tsx +48 -152
  244. package/text-input/TextInput.test.js +1228 -1196
  245. package/text-input/types.d.ts +25 -17
  246. package/textarea/Textarea.js +70 -113
  247. package/textarea/{Textarea.stories.jsx → Textarea.stories.tsx} +58 -100
  248. package/textarea/Textarea.test.js +152 -183
  249. package/textarea/types.d.ts +9 -5
  250. package/toggle-group/ToggleGroup.d.ts +2 -2
  251. package/toggle-group/ToggleGroup.js +92 -106
  252. package/toggle-group/ToggleGroup.stories.tsx +7 -4
  253. package/toggle-group/ToggleGroup.test.js +69 -88
  254. package/toggle-group/types.d.ts +26 -17
  255. package/typography/Typography.d.ts +2 -2
  256. package/typography/Typography.js +15 -123
  257. package/typography/Typography.stories.tsx +1 -1
  258. package/typography/types.d.ts +1 -1
  259. package/useTheme.d.ts +1135 -1
  260. package/useTheme.js +2 -9
  261. package/useTranslatedLabels.d.ts +84 -1
  262. package/useTranslatedLabels.js +1 -7
  263. package/utils/BaseTypography.d.ts +21 -0
  264. package/utils/BaseTypography.js +94 -0
  265. package/utils/FocusLock.d.ts +13 -0
  266. package/utils/FocusLock.js +124 -0
  267. package/wizard/Wizard.js +16 -51
  268. package/wizard/Wizard.test.js +54 -81
  269. package/wizard/types.d.ts +8 -9
  270. package/card/ice-cream.jpg +0 -0
  271. package/number-input/NumberInputContext.d.ts +0 -4
  272. package/number-input/NumberInputContext.js +0 -19
  273. package/number-input/numberInputContextTypes.d.ts +0 -19
  274. package/resultsetTable/Icons.d.ts +0 -7
  275. package/resultsetTable/ResultsetTable.d.ts +0 -4
  276. package/slider/Slider.stories.tsx +0 -240
  277. /package/{resultsetTable → action-icon}/types.js +0 -0
  278. /package/{number-input/numberInputContextTypes.js → container/types.js} +0 -0
@@ -1,19 +1,14 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
4
+ var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
5
+ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
5
6
  var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
6
-
7
7
  var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
8
-
9
8
  var _react = _interopRequireDefault(require("react"));
10
-
11
9
  var _react2 = require("@testing-library/react");
12
-
13
10
  var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
14
-
15
- var _Paginator = _interopRequireDefault(require("./Paginator"));
16
-
11
+ var _Paginator = _interopRequireDefault(require("./Paginator.tsx"));
17
12
  // Mocking DOMRect for Radix Primitive Popover
18
13
  global.globalThis = global;
19
14
  global.DOMRect = {
@@ -28,12 +23,10 @@ global.DOMRect = {
28
23
  };
29
24
  }
30
25
  };
31
-
32
26
  global.ResizeObserver = /*#__PURE__*/function () {
33
27
  function ResizeObserver() {
34
28
  (0, _classCallCheck2["default"])(this, ResizeObserver);
35
29
  }
36
-
37
30
  (0, _createClass2["default"])(ResizeObserver, [{
38
31
  key: "observe",
39
32
  value: function observe() {}
@@ -46,7 +39,6 @@ global.ResizeObserver = /*#__PURE__*/function () {
46
39
  }]);
47
40
  return ResizeObserver;
48
41
  }();
49
-
50
42
  global.DOMRect = {
51
43
  fromRect: function fromRect() {
52
44
  return {
@@ -62,227 +54,245 @@ global.DOMRect = {
62
54
  describe("Paginator component tests", function () {
63
55
  test("Paginator renders with default values", function () {
64
56
  var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], null)),
65
- getByText = _render.getByText;
66
-
57
+ getByText = _render.getByText;
67
58
  expect(getByText("1 to 1 of 1")).toBeTruthy();
68
59
  expect(getByText("Page: 1 of 1")).toBeTruthy();
69
60
  });
70
61
  test("Paginator renders with currentPage", function () {
71
62
  var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
72
- currentPage: 2
73
- })),
74
- getByText = _render2.getByText;
75
-
63
+ currentPage: 2
64
+ })),
65
+ getByText = _render2.getByText;
76
66
  expect(getByText("Page: 2 of 1")).toBeTruthy();
77
67
  });
78
68
  test("Paginator renders with itemsPerPageOptions", function () {
79
69
  var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
80
- currentPage: 1,
81
- itemsPerPage: 10,
82
- itemsPerPageOptions: [10, 15],
83
- totalItems: 20
84
- })),
85
- getByText = _render3.getByText;
86
-
70
+ currentPage: 1,
71
+ itemsPerPage: 10,
72
+ itemsPerPageOptions: [10, 15],
73
+ totalItems: 20
74
+ })),
75
+ getByText = _render3.getByText;
87
76
  expect(getByText("Items per page:")).toBeTruthy();
88
- });
89
- test("Paginator renders with itemsPerPageOptions", function () {
90
- var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
91
- currentPage: 1,
92
- itemsPerPage: 10,
93
- totalItems: 20
94
- })),
95
- getByText = _render4.getByText;
96
-
97
77
  expect(getByText("1 to 10 of 20")).toBeTruthy();
98
78
  expect(getByText("Page: 1 of 2")).toBeTruthy();
99
79
  });
100
80
  test("Paginator renders with totalItems", function () {
101
- var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
102
- totalItems: 20
103
- })),
104
- getByText = _render5.getByText;
105
-
81
+ var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
82
+ totalItems: 20
83
+ })),
84
+ getByText = _render4.getByText;
106
85
  expect(getByText("1 to 5 of 20")).toBeTruthy();
107
86
  expect(getByText("Page: 1 of 4")).toBeTruthy();
108
87
  });
109
88
  test("Paginator renders with correct text in second page", function () {
110
- var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
111
- currentPage: 2,
112
- itemsPerPage: 10,
113
- totalItems: 20
114
- })),
115
- getByText = _render6.getByText;
116
-
89
+ var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
90
+ currentPage: 2,
91
+ itemsPerPage: 10,
92
+ totalItems: 20
93
+ })),
94
+ getByText = _render5.getByText;
117
95
  expect(getByText("11 to 20 of 20")).toBeTruthy();
118
96
  expect(getByText("Page: 2 of 2")).toBeTruthy();
119
97
  });
120
98
  test("Paginator renders goToPage select", function () {
121
- var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
122
- currentPage: 2,
123
- showGoToPage: true,
124
- itemsPerPage: 10,
125
- totalItems: 20
126
- })),
127
- getByText = _render7.getByText;
128
-
99
+ var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
100
+ currentPage: 2,
101
+ showGoToPage: true,
102
+ itemsPerPage: 10,
103
+ totalItems: 20
104
+ })),
105
+ getByText = _render6.getByText;
129
106
  expect(getByText("Go to page:")).toBeTruthy();
130
107
  });
131
- test("Paginator goToPage call correct function", function () {
132
- var onClick = jest.fn();
133
-
134
- window.HTMLElement.prototype.scrollIntoView = function () {};
135
-
136
- window.HTMLElement.prototype.scrollTo = function () {};
137
-
138
- var _render8 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
139
- currentPage: 1,
140
- itemsPerPage: 10,
141
- totalItems: 27,
142
- showGoToPage: true,
143
- onPageChange: onClick
144
- })),
145
- getByText = _render8.getByText,
146
- getAllByRole = _render8.getAllByRole,
147
- getByRole = _render8.getByRole;
148
-
149
- var goToPageSelect = getAllByRole("combobox")[0];
150
- (0, _react2.act)(function () {
151
- _userEvent["default"].click(goToPageSelect);
152
- });
153
- var goToPageOption = getByText("2");
154
- (0, _react2.act)(function () {
155
- _userEvent["default"].click(goToPageOption);
156
- });
157
- expect(onClick).toHaveBeenCalledWith(2);
158
- });
159
- test("Call correct goToPageFunction", function () {
160
- var onClick = jest.fn();
161
-
162
- var _render9 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
163
- onPageChange: onClick,
164
- currentPage: 1,
165
- itemsPerPage: 10,
166
- totalItems: 20
167
- })),
168
- getAllByRole = _render9.getAllByRole;
169
-
170
- var nextButton = getAllByRole("button")[2];
171
-
172
- _userEvent["default"].click(nextButton);
173
-
174
- expect(onClick).toHaveBeenCalled();
175
- });
176
- test("Call correct itemsPerPageFunction", function () {
177
- var onClick = jest.fn();
178
-
179
- window.HTMLElement.prototype.scrollIntoView = function () {};
180
-
181
- window.HTMLElement.prototype.scrollTo = function () {};
182
-
183
- var _render10 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
184
- currentPage: 1,
185
- itemsPerPage: 10,
186
- itemsPerPageOptions: [10, 15],
187
- itemsPerPageFunction: onClick,
188
- totalItems: 20
189
- })),
190
- getAllByText = _render10.getAllByText,
191
- getByText = _render10.getByText;
192
-
193
- var select = getAllByText("10")[0];
194
- (0, _react2.act)(function () {
195
- _userEvent["default"].click(select);
196
- });
197
- var itemPerPageOption = getByText("15");
198
- (0, _react2.act)(function () {
199
- _userEvent["default"].click(itemPerPageOption);
200
- });
201
- expect(onClick).toHaveBeenCalledWith(15);
202
- });
203
- test("Next button is disable in last page", function () {
204
- var onClick = jest.fn();
205
-
206
- var _render11 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
207
- onPageChange: onClick,
208
- currentPage: 2,
209
- itemsPerPage: 10,
210
- totalItems: 20
211
- })),
212
- getAllByRole = _render11.getAllByRole;
213
-
214
- var nextButton = getAllByRole("button")[2];
215
- expect(nextButton.hasAttribute("disabled")).toBeTruthy();
216
-
217
- _userEvent["default"].click(nextButton);
218
-
219
- expect(onClick).toHaveBeenCalledTimes(0);
220
- });
221
- test("Last button is disable in last page", function () {
222
- var onClick = jest.fn();
223
-
224
- var _render12 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
225
- onPageChange: onClick,
226
- currentPage: 2,
227
- itemsPerPage: 10,
228
- totalItems: 20
229
- })),
230
- getAllByRole = _render12.getAllByRole;
231
-
232
- var lastButton = getAllByRole("button")[3];
233
- expect(lastButton.hasAttribute("disabled")).toBeTruthy();
234
-
235
- _userEvent["default"].click(lastButton);
236
-
237
- expect(onClick).toHaveBeenCalledTimes(0);
238
- });
239
- test("First button is disable in first page", function () {
240
- var onClick = jest.fn();
241
-
242
- var _render13 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
243
- onPageChange: onClick,
244
- currentPage: 1,
245
- itemsPerPage: 10,
246
- totalItems: 20
247
- })),
248
- getAllByRole = _render13.getAllByRole;
249
-
250
- var lastButton = getAllByRole("button")[0];
251
- expect(lastButton.hasAttribute("disabled")).toBeTruthy();
252
-
253
- _userEvent["default"].click(lastButton);
254
-
255
- expect(onClick).toHaveBeenCalledTimes(0);
256
- });
257
- test("Previous button is disable in first page", function () {
258
- var onClick = jest.fn();
259
-
260
- var _render14 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
261
- onPageChange: onClick,
262
- currentPage: 1,
263
- itemsPerPage: 10,
264
- totalItems: 20
265
- })),
266
- getAllByRole = _render14.getAllByRole;
267
-
268
- var lastButton = getAllByRole("button")[1];
269
- expect(lastButton.hasAttribute("disabled")).toBeTruthy();
270
-
271
- _userEvent["default"].click(lastButton);
272
-
273
- expect(onClick).toHaveBeenCalledTimes(0);
274
- });
108
+ test("Paginator goToPage call correct function", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
109
+ var onClick, _render7, getByText, getAllByRole, goToPageSelect, goToPageOption;
110
+ return _regenerator["default"].wrap(function _callee$(_context) {
111
+ while (1) switch (_context.prev = _context.next) {
112
+ case 0:
113
+ onClick = jest.fn();
114
+ window.HTMLElement.prototype.scrollIntoView = function () {};
115
+ window.HTMLElement.prototype.scrollTo = function () {};
116
+ _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
117
+ currentPage: 1,
118
+ itemsPerPage: 10,
119
+ totalItems: 27,
120
+ showGoToPage: true,
121
+ onPageChange: onClick
122
+ })), getByText = _render7.getByText, getAllByRole = _render7.getAllByRole;
123
+ goToPageSelect = getAllByRole("combobox")[0];
124
+ _context.next = 7;
125
+ return _userEvent["default"].click(goToPageSelect);
126
+ case 7:
127
+ goToPageOption = getByText("2");
128
+ _context.next = 10;
129
+ return _userEvent["default"].click(goToPageOption);
130
+ case 10:
131
+ expect(onClick).toHaveBeenCalledWith(2);
132
+ case 11:
133
+ case "end":
134
+ return _context.stop();
135
+ }
136
+ }, _callee);
137
+ })));
138
+ test("Call correct goToPageFunction", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
139
+ var onClick, _render8, getAllByRole, nextButton;
140
+ return _regenerator["default"].wrap(function _callee2$(_context2) {
141
+ while (1) switch (_context2.prev = _context2.next) {
142
+ case 0:
143
+ onClick = jest.fn();
144
+ _render8 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
145
+ onPageChange: onClick,
146
+ currentPage: 1,
147
+ itemsPerPage: 10,
148
+ totalItems: 20
149
+ })), getAllByRole = _render8.getAllByRole;
150
+ nextButton = getAllByRole("button")[2];
151
+ _context2.next = 5;
152
+ return _userEvent["default"].click(nextButton);
153
+ case 5:
154
+ expect(onClick).toHaveBeenCalled();
155
+ case 6:
156
+ case "end":
157
+ return _context2.stop();
158
+ }
159
+ }, _callee2);
160
+ })));
161
+ test("Call correct itemsPerPageFunction", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3() {
162
+ var onClick, _render9, getAllByText, getByText, select, itemPerPageOption;
163
+ return _regenerator["default"].wrap(function _callee3$(_context3) {
164
+ while (1) switch (_context3.prev = _context3.next) {
165
+ case 0:
166
+ onClick = jest.fn();
167
+ window.HTMLElement.prototype.scrollIntoView = function () {};
168
+ window.HTMLElement.prototype.scrollTo = function () {};
169
+ _render9 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
170
+ currentPage: 1,
171
+ itemsPerPage: 10,
172
+ itemsPerPageOptions: [10, 15],
173
+ itemsPerPageFunction: onClick,
174
+ totalItems: 20
175
+ })), getAllByText = _render9.getAllByText, getByText = _render9.getByText;
176
+ select = getAllByText("10")[0];
177
+ _context3.next = 7;
178
+ return _userEvent["default"].click(select);
179
+ case 7:
180
+ itemPerPageOption = getByText("15");
181
+ _context3.next = 10;
182
+ return _userEvent["default"].click(itemPerPageOption);
183
+ case 10:
184
+ expect(onClick).toHaveBeenCalledWith(15);
185
+ case 11:
186
+ case "end":
187
+ return _context3.stop();
188
+ }
189
+ }, _callee3);
190
+ })));
191
+ test("Next button is disable in last page", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4() {
192
+ var onClick, _render10, getAllByRole, nextButton;
193
+ return _regenerator["default"].wrap(function _callee4$(_context4) {
194
+ while (1) switch (_context4.prev = _context4.next) {
195
+ case 0:
196
+ onClick = jest.fn();
197
+ _render10 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
198
+ onPageChange: onClick,
199
+ currentPage: 2,
200
+ itemsPerPage: 10,
201
+ totalItems: 20
202
+ })), getAllByRole = _render10.getAllByRole;
203
+ nextButton = getAllByRole("button")[2];
204
+ expect(nextButton.hasAttribute("disabled")).toBeTruthy();
205
+ _context4.next = 6;
206
+ return _userEvent["default"].click(nextButton);
207
+ case 6:
208
+ expect(onClick).toHaveBeenCalledTimes(0);
209
+ case 7:
210
+ case "end":
211
+ return _context4.stop();
212
+ }
213
+ }, _callee4);
214
+ })));
215
+ test("Last button is disable in last page", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee5() {
216
+ var onClick, _render11, getAllByRole, lastButton;
217
+ return _regenerator["default"].wrap(function _callee5$(_context5) {
218
+ while (1) switch (_context5.prev = _context5.next) {
219
+ case 0:
220
+ onClick = jest.fn();
221
+ _render11 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
222
+ onPageChange: onClick,
223
+ currentPage: 2,
224
+ itemsPerPage: 10,
225
+ totalItems: 20
226
+ })), getAllByRole = _render11.getAllByRole;
227
+ lastButton = getAllByRole("button")[3];
228
+ expect(lastButton.hasAttribute("disabled")).toBeTruthy();
229
+ _context5.next = 6;
230
+ return _userEvent["default"].click(lastButton);
231
+ case 6:
232
+ expect(onClick).toHaveBeenCalledTimes(0);
233
+ case 7:
234
+ case "end":
235
+ return _context5.stop();
236
+ }
237
+ }, _callee5);
238
+ })));
239
+ test("First button is disable in first page", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee6() {
240
+ var onClick, _render12, getAllByRole, lastButton;
241
+ return _regenerator["default"].wrap(function _callee6$(_context6) {
242
+ while (1) switch (_context6.prev = _context6.next) {
243
+ case 0:
244
+ onClick = jest.fn();
245
+ _render12 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
246
+ onPageChange: onClick,
247
+ currentPage: 1,
248
+ itemsPerPage: 10,
249
+ totalItems: 20
250
+ })), getAllByRole = _render12.getAllByRole;
251
+ lastButton = getAllByRole("button")[0];
252
+ expect(lastButton.hasAttribute("disabled")).toBeTruthy();
253
+ _context6.next = 6;
254
+ return _userEvent["default"].click(lastButton);
255
+ case 6:
256
+ expect(onClick).toHaveBeenCalledTimes(0);
257
+ case 7:
258
+ case "end":
259
+ return _context6.stop();
260
+ }
261
+ }, _callee6);
262
+ })));
263
+ test("Previous button is disable in first page", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee7() {
264
+ var onClick, _render13, getAllByRole, lastButton;
265
+ return _regenerator["default"].wrap(function _callee7$(_context7) {
266
+ while (1) switch (_context7.prev = _context7.next) {
267
+ case 0:
268
+ onClick = jest.fn();
269
+ _render13 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
270
+ onPageChange: onClick,
271
+ currentPage: 1,
272
+ itemsPerPage: 10,
273
+ totalItems: 20
274
+ })), getAllByRole = _render13.getAllByRole;
275
+ lastButton = getAllByRole("button")[1];
276
+ expect(lastButton.hasAttribute("disabled")).toBeTruthy();
277
+ _context7.next = 6;
278
+ return _userEvent["default"].click(lastButton);
279
+ case 6:
280
+ expect(onClick).toHaveBeenCalledTimes(0);
281
+ case 7:
282
+ case "end":
283
+ return _context7.stop();
284
+ }
285
+ }, _callee7);
286
+ })));
275
287
  test("Last and next buttons are disable in last page", function () {
276
288
  var onClick = jest.fn();
277
-
278
- var _render15 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
279
- onPageChange: onClick,
280
- currentPage: 2,
281
- itemsPerPage: 10,
282
- totalItems: 20
283
- })),
284
- getAllByRole = _render15.getAllByRole;
285
-
289
+ var _render14 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
290
+ onPageChange: onClick,
291
+ currentPage: 2,
292
+ itemsPerPage: 10,
293
+ totalItems: 20
294
+ })),
295
+ getAllByRole = _render14.getAllByRole;
286
296
  var firstButton = getAllByRole("button")[0];
287
297
  var prevButton = getAllByRole("button")[1];
288
298
  var nextButton = getAllByRole("button")[2];
@@ -294,15 +304,13 @@ describe("Paginator component tests", function () {
294
304
  });
295
305
  test("First and previous buttons are disable in first page", function () {
296
306
  var onClick = jest.fn();
297
-
298
- var _render16 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
299
- onPageChange: onClick,
300
- currentPage: 1,
301
- itemsPerPage: 10,
302
- totalItems: 20
303
- })),
304
- getAllByRole = _render16.getAllByRole;
305
-
307
+ var _render15 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
308
+ onPageChange: onClick,
309
+ currentPage: 1,
310
+ itemsPerPage: 10,
311
+ totalItems: 20
312
+ })),
313
+ getAllByRole = _render15.getAllByRole;
306
314
  var firstButton = getAllByRole("button")[0];
307
315
  var prevButton = getAllByRole("button")[1];
308
316
  var nextButton = getAllByRole("button")[2];
@@ -312,4 +320,16 @@ describe("Paginator component tests", function () {
312
320
  expect(nextButton.hasAttribute("disabled")).toBeFalsy();
313
321
  expect(lastButton.hasAttribute("disabled")).toBeFalsy();
314
322
  });
323
+ test("itemsPerPage is 0 and showGoToPage is true", function () {
324
+ var _render16 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
325
+ itemsPerPage: 0,
326
+ itemsPerPageOptions: [5, 10, 15],
327
+ totalItems: 27,
328
+ showGoToPage: true
329
+ })),
330
+ getByText = _render16.getByText,
331
+ getAllByRole = _render16.getAllByRole;
332
+ expect(getByText("Items per page:")).toBeTruthy();
333
+ expect(getAllByRole("combobox")).toBeTruthy();
334
+ });
315
335
  });
@@ -1,4 +1,4 @@
1
- declare type Props = {
1
+ type Props = {
2
2
  /**
3
3
  * Number of the current selected page.
4
4
  */
@@ -16,7 +16,7 @@ declare type Props = {
16
16
  * This function will be called when the user selects an item per page option.
17
17
  * The number will be passed as a parameter to this function.
18
18
  */
19
- itemsPerPageFunction?: (val: number) => void;
19
+ itemsPerPageFunction?: (itemsPerPage: number) => void;
20
20
  /**
21
21
  * Total number of items in the pages.
22
22
  */
@@ -29,7 +29,7 @@ declare type Props = {
29
29
  * This function will be called when the user clicks on any of the button to change pages.
30
30
  * The page number will be passed as a parameter to this function.
31
31
  */
32
- onPageChange?: (val: number) => void;
32
+ onPageChange?: (page: number) => void;
33
33
  /**
34
34
  * Value of the tabindex attribute.
35
35
  */
@@ -1,6 +1,5 @@
1
1
  import React from "react";
2
- declare type ParagraphPropsType = {
2
+ declare const DxcParagraph: ({ children }: {
3
3
  children: React.ReactNode;
4
- };
5
- declare const Paragraph: ({ children }: ParagraphPropsType) => JSX.Element;
6
- export default Paragraph;
4
+ }) => JSX.Element;
5
+ export default DxcParagraph;
@@ -1,38 +1,22 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _typeof = require("@babel/runtime/helpers/typeof");
6
-
7
4
  Object.defineProperty(exports, "__esModule", {
8
5
  value: true
9
6
  });
10
7
  exports["default"] = void 0;
11
-
12
- var _react = _interopRequireWildcard(require("react"));
13
-
14
- var _Typography = _interopRequireDefault(require("../typography/Typography"));
15
-
16
- var _BackgroundColorContext = _interopRequireDefault(require("../BackgroundColorContext"));
17
-
8
+ var _react = _interopRequireDefault(require("react"));
18
9
  var _useTheme = _interopRequireDefault(require("../useTheme"));
19
-
20
- 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); }
21
-
22
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(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; }
23
-
24
- var Paragraph = function Paragraph(_ref) {
10
+ var _BaseTypography = _interopRequireDefault(require("../utils/BaseTypography"));
11
+ var DxcParagraph = function DxcParagraph(_ref) {
25
12
  var children = _ref.children;
26
13
  var colorsTheme = (0, _useTheme["default"])();
27
- var backgroundType = (0, _react.useContext)(_BackgroundColorContext["default"]);
28
- return /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
14
+ return /*#__PURE__*/_react["default"].createElement(_BaseTypography["default"], {
29
15
  as: "p",
30
16
  display: colorsTheme.paragraph.display,
31
17
  fontSize: colorsTheme.paragraph.fontSize,
32
18
  fontWeight: colorsTheme.paragraph.fontWeight,
33
- color: backgroundType && backgroundType === "dark" ? colorsTheme.paragraph.fontColorOnDark : colorsTheme.paragraph.fontColor
19
+ color: colorsTheme.paragraph.fontColor
34
20
  }, children);
35
21
  };
36
-
37
- var _default = Paragraph;
38
- exports["default"] = _default;
22
+ var _default = exports["default"] = DxcParagraph;
@@ -1,9 +1,7 @@
1
1
  import React from "react";
2
2
  import Title from "../../.storybook/components/Title";
3
3
  import DxcParagraph from "./Paragraph";
4
- import { BackgroundColorProvider } from "../BackgroundColorContext";
5
4
  import ExampleContainer from "../../.storybook/components/ExampleContainer";
6
- import DarkContainer from "../../.storybook/components/DarkSection";
7
5
 
8
6
  export default {
9
7
  title: "Paragraph",
@@ -25,20 +23,5 @@ export const Chromatic = () => (
25
23
  Suspendisse sed quam tincidunt, commodo dolor vel, tincidunt nisl.
26
24
  </DxcParagraph>
27
25
  </ExampleContainer>
28
- <BackgroundColorProvider color="#333333">
29
- <DarkContainer>
30
- <Title title="Default Paragraph" theme="dark" level={4} />
31
- <DxcParagraph>
32
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id tortor sit amet velit auctor cursus id eget
33
- nisl. Vivamus luctus egestas eros, at mattis libero eleifend ac. Integer vel urna rutrum, pretium arcu
34
- dignissim, fringilla turpis. Nullam luctus odio quis magna finibus, a pharetra magna euismod. Nullam efficitur
35
- semper pellentesque. Nulla eget arcu ac diam fringilla vehicula. In imperdiet nisl hendrerit, elementum metus
36
- eu, ornare risus. Aenean neque nibh, vestibulum vitae elit vel, imperdiet suscipit leo. Curabitur blandit
37
- iaculis pretium. Fusce id imperdiet dui, ut laoreet justo. Sed maximus sollicitudin ipsum, et varius massa
38
- condimentum eget. Vivamus id mauris et nisl mattis consequat et id lectus. Quisque mollis lacinia nisl.
39
- Suspendisse sed quam tincidunt, commodo dolor vel, tincidunt nisl.
40
- </DxcParagraph>
41
- </DarkContainer>
42
- </BackgroundColorProvider>
43
26
  </>
44
27
  );
@@ -0,0 +1,6 @@
1
+ import React from "react";
2
+ declare const icons: {
3
+ showPassword: React.JSX.Element;
4
+ hidePassword: React.JSX.Element;
5
+ };
6
+ export default icons;