@dxc-technology/halstack-react 10.1.0 → 11.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/BackgroundColorContext.d.ts +2 -2
- package/BackgroundColorContext.js +5 -17
- package/HalstackContext.d.ts +18 -6
- package/HalstackContext.js +9 -34
- package/accordion/Accordion.js +21 -58
- package/accordion/Accordion.stories.tsx +1 -15
- package/accordion/Accordion.test.js +18 -33
- package/accordion/types.d.ts +5 -5
- package/accordion-group/AccordionGroup.js +15 -42
- package/accordion-group/AccordionGroup.stories.tsx +1 -1
- package/accordion-group/AccordionGroup.test.js +42 -60
- package/accordion-group/AccordionGroupAccordion.js +9 -21
- package/accordion-group/types.d.ts +6 -6
- package/alert/Alert.js +14 -46
- package/alert/Alert.test.js +28 -45
- package/alert/types.d.ts +5 -5
- package/badge/Badge.js +4 -17
- package/badge/types.d.ts +1 -1
- package/bleed/Bleed.js +13 -21
- package/bleed/types.d.ts +2 -2
- package/box/Box.js +10 -29
- package/box/Box.test.js +1 -6
- package/box/types.d.ts +3 -3
- package/bulleted-list/BulletedList.js +7 -33
- package/bulleted-list/BulletedList.stories.tsx +1 -91
- package/bulleted-list/types.d.ts +5 -5
- package/button/Button.js +23 -46
- package/button/Button.stories.tsx +5 -86
- package/button/Button.test.js +11 -21
- package/button/types.d.ts +4 -4
- package/card/Card.js +21 -44
- package/card/Card.test.js +10 -21
- package/card/types.d.ts +5 -5
- package/checkbox/Checkbox.js +81 -111
- package/checkbox/Checkbox.stories.tsx +16 -54
- package/checkbox/Checkbox.test.js +107 -63
- package/checkbox/types.d.ts +8 -4
- package/chip/Chip.js +12 -31
- package/chip/Chip.test.js +15 -28
- package/chip/types.d.ts +4 -4
- package/common/coreTokens.js +1 -2
- package/common/utils.js +2 -8
- package/common/variables.d.ts +15 -6
- package/common/variables.js +17 -15
- package/date-input/Calendar.js +13 -57
- package/date-input/DateInput.js +50 -96
- package/date-input/DateInput.stories.tsx +11 -30
- package/date-input/DateInput.test.js +674 -701
- package/date-input/DatePicker.js +11 -42
- package/date-input/Icons.d.ts +6 -6
- package/date-input/Icons.js +6 -23
- package/date-input/YearPicker.js +8 -34
- package/date-input/types.d.ts +27 -21
- package/dialog/Dialog.js +11 -35
- package/dialog/Dialog.test.js +125 -187
- package/dialog/types.d.ts +18 -13
- package/dropdown/Dropdown.js +39 -93
- package/dropdown/Dropdown.test.js +391 -378
- package/dropdown/DropdownMenu.js +8 -19
- package/dropdown/DropdownMenuItem.js +5 -17
- package/dropdown/types.d.ts +17 -19
- package/file-input/FileInput.js +131 -220
- package/file-input/FileInput.stories.tsx +1 -1
- package/file-input/FileInput.test.js +293 -342
- package/file-input/FileItem.js +12 -39
- package/file-input/types.d.ts +9 -9
- package/flex/Flex.js +25 -39
- package/flex/types.d.ts +6 -6
- package/footer/Footer.js +9 -39
- package/footer/Footer.test.js +18 -32
- package/footer/Icons.d.ts +2 -2
- package/footer/Icons.js +2 -7
- package/footer/types.d.ts +13 -13
- package/grid/Grid.js +1 -16
- package/grid/types.d.ts +10 -10
- package/header/Header.d.ts +1 -1
- package/header/Header.js +19 -64
- package/header/Header.test.js +12 -25
- package/header/Icons.d.ts +2 -2
- package/header/Icons.js +2 -7
- package/header/types.d.ts +5 -7
- package/heading/Heading.js +9 -31
- package/heading/Heading.test.js +70 -87
- package/heading/types.d.ts +7 -7
- package/image/Image.d.ts +2 -2
- package/image/Image.js +17 -32
- package/image/types.d.ts +2 -2
- package/inset/Inset.js +13 -21
- package/inset/types.d.ts +2 -2
- package/layout/ApplicationLayout.d.ts +1 -1
- package/layout/ApplicationLayout.js +14 -54
- package/layout/Icons.d.ts +5 -5
- package/layout/Icons.js +1 -5
- package/layout/SidenavContext.d.ts +1 -1
- package/layout/SidenavContext.js +3 -9
- package/layout/types.d.ts +3 -3
- package/link/Link.js +21 -42
- package/link/Link.test.js +23 -41
- package/link/types.d.ts +14 -14
- package/main.d.ts +1 -1
- package/main.js +3 -52
- package/nav-tabs/NavTabs.js +11 -43
- package/nav-tabs/NavTabs.stories.tsx +1 -1
- package/nav-tabs/NavTabs.test.js +36 -43
- package/nav-tabs/Tab.js +16 -45
- package/nav-tabs/types.d.ts +9 -9
- package/number-input/NumberInput.d.ts +1 -1
- package/number-input/NumberInput.js +24 -35
- package/number-input/NumberInput.stories.tsx +42 -26
- package/number-input/NumberInput.test.js +682 -577
- package/number-input/types.d.ts +11 -5
- package/package.json +27 -25
- package/paginator/Icons.d.ts +5 -5
- package/paginator/Icons.js +5 -19
- package/paginator/Paginator.js +14 -39
- package/paginator/Paginator.test.js +224 -207
- package/paginator/types.d.ts +3 -3
- package/paragraph/Paragraph.js +3 -14
- package/paragraph/Paragraph.stories.tsx +0 -17
- package/password-input/Icons.d.ts +3 -3
- package/password-input/Icons.js +1 -5
- package/password-input/PasswordInput.js +26 -48
- package/password-input/PasswordInput.stories.tsx +1 -33
- package/password-input/PasswordInput.test.js +153 -129
- package/password-input/types.d.ts +8 -7
- package/progress-bar/ProgressBar.js +16 -42
- package/progress-bar/{ProgressBar.stories.jsx → ProgressBar.stories.tsx} +1 -1
- package/progress-bar/ProgressBar.test.js +35 -52
- package/progress-bar/types.d.ts +3 -3
- package/quick-nav/QuickNav.js +4 -27
- package/quick-nav/QuickNav.stories.tsx +1 -1
- package/quick-nav/types.d.ts +10 -10
- package/radio-group/Radio.d.ts +1 -1
- package/radio-group/Radio.js +22 -54
- package/radio-group/RadioGroup.js +37 -83
- package/radio-group/RadioGroup.stories.tsx +10 -10
- package/radio-group/RadioGroup.test.js +504 -470
- package/radio-group/types.d.ts +8 -8
- package/resultset-table/Icons.d.ts +7 -0
- package/{resultsetTable → resultset-table}/Icons.js +1 -5
- package/{resultsetTable → resultset-table}/ResultsetTable.js +22 -58
- package/{resultsetTable → resultset-table}/ResultsetTable.test.js +72 -92
- package/{resultsetTable → resultset-table}/types.d.ts +7 -7
- package/select/Icons.d.ts +7 -7
- package/select/Icons.js +1 -5
- package/select/Listbox.js +13 -39
- package/select/Option.js +9 -26
- package/select/Select.js +54 -138
- package/select/Select.test.js +1902 -1796
- package/select/types.d.ts +14 -15
- package/sidenav/Icons.d.ts +4 -4
- package/sidenav/Icons.js +1 -5
- package/sidenav/Sidenav.js +24 -63
- package/sidenav/Sidenav.test.js +3 -10
- package/sidenav/types.d.ts +18 -18
- package/slider/Slider.js +38 -86
- package/slider/Slider.test.js +107 -103
- package/slider/types.d.ts +4 -4
- package/spinner/Spinner.js +10 -40
- package/spinner/Spinner.test.js +25 -34
- package/spinner/types.d.ts +3 -3
- package/switch/Switch.js +26 -69
- package/switch/Switch.stories.tsx +0 -34
- package/switch/Switch.test.js +51 -96
- package/switch/types.d.ts +4 -4
- package/table/Table.js +4 -23
- package/table/Table.test.js +1 -6
- package/table/types.d.ts +8 -8
- package/tabs/Tab.js +10 -29
- package/tabs/Tabs.js +48 -124
- package/tabs/Tabs.test.js +62 -118
- package/tabs/types.d.ts +19 -19
- package/tag/Tag.js +21 -51
- package/tag/Tag.test.js +19 -30
- package/tag/types.d.ts +7 -7
- package/text-input/Icons.d.ts +5 -5
- package/text-input/Icons.js +1 -5
- package/text-input/Suggestion.js +9 -26
- package/text-input/Suggestions.d.ts +1 -1
- package/text-input/Suggestions.js +12 -57
- package/text-input/TextInput.js +128 -193
- package/text-input/TextInput.stories.tsx +48 -152
- package/text-input/TextInput.test.js +1210 -1194
- package/text-input/types.d.ts +25 -17
- package/textarea/Textarea.js +60 -96
- package/textarea/{Textarea.stories.jsx → Textarea.stories.tsx} +58 -99
- package/textarea/Textarea.test.js +150 -179
- package/textarea/types.d.ts +9 -5
- package/toggle-group/ToggleGroup.js +20 -57
- package/toggle-group/ToggleGroup.stories.tsx +1 -1
- package/toggle-group/ToggleGroup.test.js +48 -81
- package/toggle-group/types.d.ts +10 -10
- package/typography/Typography.js +4 -13
- package/typography/types.d.ts +1 -1
- package/useTheme.d.ts +12 -3
- package/useTheme.js +1 -8
- package/useTranslatedLabels.js +1 -7
- package/utils/BaseTypography.d.ts +2 -2
- package/utils/BaseTypography.js +16 -30
- package/utils/FocusLock.js +12 -36
- package/wizard/Wizard.js +14 -49
- package/wizard/Wizard.test.js +53 -80
- package/wizard/types.d.ts +6 -6
- package/resultsetTable/Icons.d.ts +0 -7
- package/slider/Slider.stories.tsx +0 -240
- /package/{resultsetTable → resultset-table}/ResultsetTable.d.ts +0 -0
- /package/{resultsetTable → resultset-table}/ResultsetTable.stories.tsx +0 -0
- /package/{resultsetTable → resultset-table}/types.js +0 -0
- /package/spinner/{Spinner.stories.jsx → Spinner.stories.tsx} +0 -0
- /package/table/{Table.stories.jsx → Table.stories.tsx} +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
11
|
var _Paginator = _interopRequireDefault(require("./Paginator.tsx"));
|
|
16
|
-
|
|
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,217 +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
|
-
|
|
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
|
-
|
|
73
|
-
|
|
74
|
-
|
|
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
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
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
77
|
expect(getByText("1 to 10 of 20")).toBeTruthy();
|
|
89
78
|
expect(getByText("Page: 1 of 2")).toBeTruthy();
|
|
90
79
|
});
|
|
91
80
|
test("Paginator renders with totalItems", function () {
|
|
92
81
|
var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
82
|
+
totalItems: 20
|
|
83
|
+
})),
|
|
84
|
+
getByText = _render4.getByText;
|
|
97
85
|
expect(getByText("1 to 5 of 20")).toBeTruthy();
|
|
98
86
|
expect(getByText("Page: 1 of 4")).toBeTruthy();
|
|
99
87
|
});
|
|
100
88
|
test("Paginator renders with correct text in second page", function () {
|
|
101
89
|
var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
90
|
+
currentPage: 2,
|
|
91
|
+
itemsPerPage: 10,
|
|
92
|
+
totalItems: 20
|
|
93
|
+
})),
|
|
94
|
+
getByText = _render5.getByText;
|
|
108
95
|
expect(getByText("11 to 20 of 20")).toBeTruthy();
|
|
109
96
|
expect(getByText("Page: 2 of 2")).toBeTruthy();
|
|
110
97
|
});
|
|
111
98
|
test("Paginator renders goToPage select", function () {
|
|
112
99
|
var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
100
|
+
currentPage: 2,
|
|
101
|
+
showGoToPage: true,
|
|
102
|
+
itemsPerPage: 10,
|
|
103
|
+
totalItems: 20
|
|
104
|
+
})),
|
|
105
|
+
getByText = _render6.getByText;
|
|
120
106
|
expect(getByText("Go to page:")).toBeTruthy();
|
|
121
107
|
});
|
|
122
|
-
test("Paginator goToPage call correct function", function () {
|
|
123
|
-
var onClick
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
});
|
|
229
|
-
test("
|
|
230
|
-
var onClick
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
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
|
+
})));
|
|
265
287
|
test("Last and next buttons are disable in last page", function () {
|
|
266
288
|
var onClick = jest.fn();
|
|
267
|
-
|
|
268
289
|
var _render14 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
290
|
+
onPageChange: onClick,
|
|
291
|
+
currentPage: 2,
|
|
292
|
+
itemsPerPage: 10,
|
|
293
|
+
totalItems: 20
|
|
294
|
+
})),
|
|
295
|
+
getAllByRole = _render14.getAllByRole;
|
|
276
296
|
var firstButton = getAllByRole("button")[0];
|
|
277
297
|
var prevButton = getAllByRole("button")[1];
|
|
278
298
|
var nextButton = getAllByRole("button")[2];
|
|
@@ -284,15 +304,13 @@ describe("Paginator component tests", function () {
|
|
|
284
304
|
});
|
|
285
305
|
test("First and previous buttons are disable in first page", function () {
|
|
286
306
|
var onClick = jest.fn();
|
|
287
|
-
|
|
288
307
|
var _render15 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
308
|
+
onPageChange: onClick,
|
|
309
|
+
currentPage: 1,
|
|
310
|
+
itemsPerPage: 10,
|
|
311
|
+
totalItems: 20
|
|
312
|
+
})),
|
|
313
|
+
getAllByRole = _render15.getAllByRole;
|
|
296
314
|
var firstButton = getAllByRole("button")[0];
|
|
297
315
|
var prevButton = getAllByRole("button")[1];
|
|
298
316
|
var nextButton = getAllByRole("button")[2];
|
|
@@ -304,14 +322,13 @@ describe("Paginator component tests", function () {
|
|
|
304
322
|
});
|
|
305
323
|
test("itemsPerPage is 0 and showGoToPage is true", function () {
|
|
306
324
|
var _render16 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Paginator["default"], {
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
325
|
+
itemsPerPage: 0,
|
|
326
|
+
itemsPerPageOptions: [5, 10, 15],
|
|
327
|
+
totalItems: 27,
|
|
328
|
+
showGoToPage: true
|
|
329
|
+
})),
|
|
330
|
+
getByText = _render16.getByText,
|
|
331
|
+
getAllByRole = _render16.getAllByRole;
|
|
315
332
|
expect(getByText("Items per page:")).toBeTruthy();
|
|
316
333
|
expect(getAllByRole("combobox")).toBeTruthy();
|
|
317
334
|
});
|
package/paginator/types.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
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?: (
|
|
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?: (
|
|
32
|
+
onPageChange?: (page: number) => void;
|
|
33
33
|
/**
|
|
34
34
|
* Value of the tabindex attribute.
|
|
35
35
|
*/
|
package/paragraph/Paragraph.js
CHANGED
|
@@ -1,26 +1,17 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
-
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
8
6
|
value: true
|
|
9
7
|
});
|
|
10
8
|
exports["default"] = void 0;
|
|
11
|
-
|
|
12
9
|
var _react = _interopRequireWildcard(require("react"));
|
|
13
|
-
|
|
14
10
|
var _BackgroundColorContext = _interopRequireDefault(require("../BackgroundColorContext"));
|
|
15
|
-
|
|
16
11
|
var _useTheme = _interopRequireDefault(require("../useTheme"));
|
|
17
|
-
|
|
18
12
|
var _BaseTypography = _interopRequireDefault(require("../utils/BaseTypography"));
|
|
19
|
-
|
|
20
|
-
function
|
|
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
|
-
|
|
13
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
14
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
24
15
|
var DxcParagraph = function DxcParagraph(_ref) {
|
|
25
16
|
var children = _ref.children;
|
|
26
17
|
var colorsTheme = (0, _useTheme["default"])();
|
|
@@ -33,6 +24,4 @@ var DxcParagraph = function DxcParagraph(_ref) {
|
|
|
33
24
|
color: backgroundType && backgroundType === "dark" ? colorsTheme.paragraph.fontColorOnDark : colorsTheme.paragraph.fontColor
|
|
34
25
|
}, children);
|
|
35
26
|
};
|
|
36
|
-
|
|
37
|
-
var _default = DxcParagraph;
|
|
38
|
-
exports["default"] = _default;
|
|
27
|
+
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
|
);
|
package/password-input/Icons.js
CHANGED
|
@@ -1,14 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports["default"] = void 0;
|
|
9
|
-
|
|
10
8
|
var _react = _interopRequireDefault(require("react"));
|
|
11
|
-
|
|
12
9
|
var icons = {
|
|
13
10
|
showPassword: /*#__PURE__*/_react["default"].createElement("svg", {
|
|
14
11
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -35,5 +32,4 @@ var icons = {
|
|
|
35
32
|
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
33
|
}))
|
|
37
34
|
};
|
|
38
|
-
var _default = icons;
|
|
39
|
-
exports["default"] = _default;
|
|
35
|
+
var _default = exports["default"] = icons;
|