@dxc-technology/halstack-react 0.0.0-757bc34 → 0.0.0-75cb2b9

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 (353) hide show
  1. package/README.md +1 -2
  2. package/dist/index.d.mts +6515 -0
  3. package/dist/index.d.ts +6515 -0
  4. package/dist/index.js +12811 -0
  5. package/dist/index.mjs +12724 -0
  6. package/package.json +64 -63
  7. package/BackgroundColorContext.d.ts +0 -10
  8. package/BackgroundColorContext.js +0 -35
  9. package/HalstackContext.d.ts +0 -1353
  10. package/HalstackContext.js +0 -310
  11. package/accordion/Accordion.d.ts +0 -4
  12. package/accordion/Accordion.js +0 -185
  13. package/accordion/Accordion.stories.tsx +0 -283
  14. package/accordion/Accordion.test.js +0 -56
  15. package/accordion/types.d.ts +0 -57
  16. package/accordion/types.js +0 -5
  17. package/accordion-group/AccordionGroup.d.ts +0 -8
  18. package/accordion-group/AccordionGroup.js +0 -101
  19. package/accordion-group/AccordionGroup.stories.tsx +0 -252
  20. package/accordion-group/AccordionGroup.test.js +0 -98
  21. package/accordion-group/AccordionGroupAccordion.d.ts +0 -4
  22. package/accordion-group/AccordionGroupAccordion.js +0 -31
  23. package/accordion-group/types.d.ts +0 -67
  24. package/accordion-group/types.js +0 -5
  25. package/alert/Alert.d.ts +0 -4
  26. package/alert/Alert.js +0 -257
  27. package/alert/Alert.stories.tsx +0 -198
  28. package/alert/Alert.test.js +0 -75
  29. package/alert/types.d.ts +0 -49
  30. package/alert/types.js +0 -5
  31. package/badge/Badge.d.ts +0 -4
  32. package/badge/Badge.js +0 -48
  33. package/badge/types.d.ts +0 -5
  34. package/badge/types.js +0 -5
  35. package/bleed/Bleed.d.ts +0 -3
  36. package/bleed/Bleed.js +0 -43
  37. package/bleed/Bleed.stories.tsx +0 -342
  38. package/bleed/types.d.ts +0 -37
  39. package/bleed/types.js +0 -5
  40. package/box/Box.d.ts +0 -4
  41. package/box/Box.js +0 -78
  42. package/box/Box.stories.tsx +0 -119
  43. package/box/Box.test.js +0 -13
  44. package/box/types.d.ts +0 -32
  45. package/box/types.js +0 -5
  46. package/bulleted-list/BulletedList.d.ts +0 -7
  47. package/bulleted-list/BulletedList.js +0 -99
  48. package/bulleted-list/BulletedList.stories.tsx +0 -116
  49. package/bulleted-list/types.d.ts +0 -38
  50. package/bulleted-list/types.js +0 -5
  51. package/button/Button.d.ts +0 -4
  52. package/button/Button.js +0 -121
  53. package/button/Button.stories.tsx +0 -344
  54. package/button/Button.test.js +0 -36
  55. package/button/types.d.ts +0 -57
  56. package/button/types.js +0 -5
  57. package/card/Card.d.ts +0 -4
  58. package/card/Card.js +0 -120
  59. package/card/Card.stories.tsx +0 -171
  60. package/card/Card.test.js +0 -39
  61. package/card/types.d.ts +0 -62
  62. package/card/types.js +0 -5
  63. package/checkbox/Checkbox.d.ts +0 -4
  64. package/checkbox/Checkbox.js +0 -220
  65. package/checkbox/Checkbox.stories.tsx +0 -222
  66. package/checkbox/Checkbox.test.js +0 -199
  67. package/checkbox/types.d.ts +0 -72
  68. package/checkbox/types.js +0 -5
  69. package/chip/Chip.d.ts +0 -4
  70. package/chip/Chip.js +0 -121
  71. package/chip/Chip.stories.tsx +0 -214
  72. package/chip/Chip.test.js +0 -41
  73. package/chip/types.d.ts +0 -45
  74. package/chip/types.js +0 -5
  75. package/common/OpenSans.css +0 -69
  76. package/common/coreTokens.d.ts +0 -237
  77. package/common/coreTokens.js +0 -184
  78. package/common/fonts/OpenSans-Bold.ttf +0 -0
  79. package/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  80. package/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  81. package/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  82. package/common/fonts/OpenSans-Italic.ttf +0 -0
  83. package/common/fonts/OpenSans-Light.ttf +0 -0
  84. package/common/fonts/OpenSans-LightItalic.ttf +0 -0
  85. package/common/fonts/OpenSans-Regular.ttf +0 -0
  86. package/common/fonts/OpenSans-SemiBold.ttf +0 -0
  87. package/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  88. package/common/utils.d.ts +0 -1
  89. package/common/utils.js +0 -16
  90. package/common/variables.d.ts +0 -1499
  91. package/common/variables.js +0 -1371
  92. package/container/Container.d.ts +0 -4
  93. package/container/Container.js +0 -198
  94. package/container/Container.stories.tsx +0 -229
  95. package/container/types.d.ts +0 -74
  96. package/container/types.js +0 -5
  97. package/date-input/Calendar.d.ts +0 -4
  98. package/date-input/Calendar.js +0 -214
  99. package/date-input/DateInput.d.ts +0 -4
  100. package/date-input/DateInput.js +0 -223
  101. package/date-input/DateInput.stories.tsx +0 -285
  102. package/date-input/DateInput.test.js +0 -808
  103. package/date-input/DatePicker.d.ts +0 -4
  104. package/date-input/DatePicker.js +0 -115
  105. package/date-input/Icons.d.ts +0 -6
  106. package/date-input/Icons.js +0 -58
  107. package/date-input/YearPicker.d.ts +0 -4
  108. package/date-input/YearPicker.js +0 -100
  109. package/date-input/types.d.ts +0 -164
  110. package/date-input/types.js +0 -5
  111. package/dialog/Dialog.d.ts +0 -4
  112. package/dialog/Dialog.js +0 -107
  113. package/dialog/Dialog.stories.tsx +0 -365
  114. package/dialog/Dialog.test.js +0 -307
  115. package/dialog/types.d.ts +0 -36
  116. package/dialog/types.js +0 -5
  117. package/dropdown/Dropdown.d.ts +0 -4
  118. package/dropdown/Dropdown.js +0 -334
  119. package/dropdown/Dropdown.stories.tsx +0 -438
  120. package/dropdown/Dropdown.test.js +0 -599
  121. package/dropdown/DropdownMenu.d.ts +0 -4
  122. package/dropdown/DropdownMenu.js +0 -63
  123. package/dropdown/DropdownMenuItem.d.ts +0 -4
  124. package/dropdown/DropdownMenuItem.js +0 -67
  125. package/dropdown/types.d.ts +0 -98
  126. package/dropdown/types.js +0 -5
  127. package/file-input/FileInput.d.ts +0 -4
  128. package/file-input/FileInput.js +0 -479
  129. package/file-input/FileInput.stories.tsx +0 -618
  130. package/file-input/FileInput.test.js +0 -459
  131. package/file-input/FileItem.d.ts +0 -4
  132. package/file-input/FileItem.js +0 -135
  133. package/file-input/types.d.ts +0 -129
  134. package/file-input/types.js +0 -5
  135. package/flex/Flex.d.ts +0 -4
  136. package/flex/Flex.js +0 -57
  137. package/flex/Flex.stories.tsx +0 -112
  138. package/flex/types.d.ts +0 -97
  139. package/flex/types.js +0 -5
  140. package/footer/Footer.d.ts +0 -4
  141. package/footer/Footer.js +0 -134
  142. package/footer/Footer.stories.tsx +0 -152
  143. package/footer/Footer.test.js +0 -85
  144. package/footer/Icons.d.ts +0 -2
  145. package/footer/Icons.js +0 -72
  146. package/footer/types.d.ts +0 -58
  147. package/footer/types.js +0 -5
  148. package/grid/Grid.d.ts +0 -7
  149. package/grid/Grid.js +0 -76
  150. package/grid/Grid.stories.tsx +0 -219
  151. package/grid/types.d.ts +0 -115
  152. package/grid/types.js +0 -5
  153. package/header/Header.d.ts +0 -8
  154. package/header/Header.js +0 -230
  155. package/header/Header.stories.tsx +0 -251
  156. package/header/Header.test.js +0 -66
  157. package/header/Icons.d.ts +0 -2
  158. package/header/Icons.js +0 -29
  159. package/header/types.d.ts +0 -33
  160. package/header/types.js +0 -5
  161. package/heading/Heading.d.ts +0 -4
  162. package/heading/Heading.js +0 -137
  163. package/heading/Heading.stories.tsx +0 -54
  164. package/heading/Heading.test.js +0 -169
  165. package/heading/types.d.ts +0 -33
  166. package/heading/types.js +0 -5
  167. package/image/Image.d.ts +0 -4
  168. package/image/Image.js +0 -70
  169. package/image/Image.stories.tsx +0 -127
  170. package/image/types.d.ts +0 -72
  171. package/image/types.js +0 -5
  172. package/inset/Inset.d.ts +0 -3
  173. package/inset/Inset.js +0 -43
  174. package/inset/Inset.stories.tsx +0 -230
  175. package/inset/types.d.ts +0 -37
  176. package/inset/types.js +0 -5
  177. package/layout/ApplicationLayout.d.ts +0 -20
  178. package/layout/ApplicationLayout.js +0 -134
  179. package/layout/ApplicationLayout.stories.tsx +0 -162
  180. package/layout/Icons.d.ts +0 -8
  181. package/layout/Icons.js +0 -58
  182. package/layout/SidenavContext.d.ts +0 -5
  183. package/layout/SidenavContext.js +0 -13
  184. package/layout/types.d.ts +0 -41
  185. package/layout/types.js +0 -5
  186. package/link/Link.d.ts +0 -4
  187. package/link/Link.js +0 -115
  188. package/link/Link.stories.tsx +0 -253
  189. package/link/Link.test.js +0 -63
  190. package/link/types.d.ts +0 -54
  191. package/link/types.js +0 -5
  192. package/main.d.ts +0 -47
  193. package/main.js +0 -343
  194. package/nav-tabs/NavTabs.d.ts +0 -8
  195. package/nav-tabs/NavTabs.js +0 -90
  196. package/nav-tabs/NavTabs.stories.tsx +0 -274
  197. package/nav-tabs/NavTabs.test.js +0 -75
  198. package/nav-tabs/Tab.d.ts +0 -4
  199. package/nav-tabs/Tab.js +0 -117
  200. package/nav-tabs/types.d.ts +0 -52
  201. package/nav-tabs/types.js +0 -5
  202. package/number-input/NumberInput.d.ts +0 -11
  203. package/number-input/NumberInput.js +0 -67
  204. package/number-input/NumberInput.stories.tsx +0 -131
  205. package/number-input/NumberInput.test.js +0 -830
  206. package/number-input/types.d.ts +0 -130
  207. package/number-input/types.js +0 -5
  208. package/paginator/Icons.d.ts +0 -5
  209. package/paginator/Icons.js +0 -40
  210. package/paginator/Paginator.d.ts +0 -4
  211. package/paginator/Paginator.js +0 -138
  212. package/paginator/Paginator.stories.tsx +0 -87
  213. package/paginator/Paginator.test.js +0 -335
  214. package/paginator/types.d.ts +0 -38
  215. package/paginator/types.js +0 -5
  216. package/paragraph/Paragraph.d.ts +0 -5
  217. package/paragraph/Paragraph.js +0 -27
  218. package/paragraph/Paragraph.stories.tsx +0 -27
  219. package/password-input/Icons.d.ts +0 -6
  220. package/password-input/Icons.js +0 -35
  221. package/password-input/PasswordInput.d.ts +0 -4
  222. package/password-input/PasswordInput.js +0 -97
  223. package/password-input/PasswordInput.stories.tsx +0 -100
  224. package/password-input/PasswordInput.test.js +0 -198
  225. package/password-input/types.d.ts +0 -111
  226. package/password-input/types.js +0 -5
  227. package/progress-bar/ProgressBar.d.ts +0 -4
  228. package/progress-bar/ProgressBar.js +0 -150
  229. package/progress-bar/ProgressBar.stories.tsx +0 -93
  230. package/progress-bar/ProgressBar.test.js +0 -93
  231. package/progress-bar/types.d.ts +0 -37
  232. package/progress-bar/types.js +0 -5
  233. package/quick-nav/QuickNav.d.ts +0 -4
  234. package/quick-nav/QuickNav.js +0 -94
  235. package/quick-nav/QuickNav.stories.tsx +0 -356
  236. package/quick-nav/types.d.ts +0 -21
  237. package/quick-nav/types.js +0 -5
  238. package/radio-group/Radio.d.ts +0 -4
  239. package/radio-group/Radio.js +0 -124
  240. package/radio-group/RadioGroup.d.ts +0 -4
  241. package/radio-group/RadioGroup.js +0 -235
  242. package/radio-group/RadioGroup.stories.tsx +0 -214
  243. package/radio-group/RadioGroup.test.js +0 -756
  244. package/radio-group/types.d.ts +0 -114
  245. package/radio-group/types.js +0 -5
  246. package/resultset-table/Icons.d.ts +0 -7
  247. package/resultset-table/Icons.js +0 -47
  248. package/resultset-table/ResultsetTable.d.ts +0 -4
  249. package/resultset-table/ResultsetTable.js +0 -159
  250. package/resultset-table/ResultsetTable.stories.tsx +0 -300
  251. package/resultset-table/ResultsetTable.test.js +0 -305
  252. package/resultset-table/types.d.ts +0 -67
  253. package/resultset-table/types.js +0 -5
  254. package/select/Icons.d.ts +0 -10
  255. package/select/Icons.js +0 -89
  256. package/select/Listbox.d.ts +0 -4
  257. package/select/Listbox.js +0 -143
  258. package/select/Option.d.ts +0 -4
  259. package/select/Option.js +0 -80
  260. package/select/Select.d.ts +0 -4
  261. package/select/Select.js +0 -582
  262. package/select/Select.stories.tsx +0 -971
  263. package/select/Select.test.js +0 -2334
  264. package/select/types.d.ts +0 -209
  265. package/select/types.js +0 -5
  266. package/sidenav/Icons.d.ts +0 -7
  267. package/sidenav/Icons.js +0 -47
  268. package/sidenav/Sidenav.d.ts +0 -10
  269. package/sidenav/Sidenav.js +0 -199
  270. package/sidenav/Sidenav.stories.tsx +0 -282
  271. package/sidenav/Sidenav.test.js +0 -37
  272. package/sidenav/types.d.ts +0 -76
  273. package/sidenav/types.js +0 -5
  274. package/slider/Slider.d.ts +0 -4
  275. package/slider/Slider.js +0 -294
  276. package/slider/Slider.test.js +0 -254
  277. package/slider/types.d.ts +0 -86
  278. package/slider/types.js +0 -5
  279. package/spinner/Spinner.d.ts +0 -4
  280. package/spinner/Spinner.js +0 -214
  281. package/spinner/Spinner.stories.tsx +0 -129
  282. package/spinner/Spinner.test.js +0 -55
  283. package/spinner/types.d.ts +0 -32
  284. package/spinner/types.js +0 -5
  285. package/switch/Switch.d.ts +0 -4
  286. package/switch/Switch.js +0 -219
  287. package/switch/Switch.stories.tsx +0 -137
  288. package/switch/Switch.test.js +0 -180
  289. package/switch/types.d.ts +0 -66
  290. package/switch/types.js +0 -5
  291. package/table/Table.d.ts +0 -4
  292. package/table/Table.js +0 -99
  293. package/table/Table.stories.tsx +0 -356
  294. package/table/Table.test.js +0 -21
  295. package/table/types.d.ts +0 -21
  296. package/table/types.js +0 -5
  297. package/tabs/Tab.d.ts +0 -4
  298. package/tabs/Tab.js +0 -113
  299. package/tabs/Tabs.d.ts +0 -4
  300. package/tabs/Tabs.js +0 -385
  301. package/tabs/Tabs.stories.tsx +0 -226
  302. package/tabs/Tabs.test.js +0 -294
  303. package/tabs/types.d.ts +0 -92
  304. package/tabs/types.js +0 -5
  305. package/tag/Tag.d.ts +0 -4
  306. package/tag/Tag.js +0 -151
  307. package/tag/Tag.stories.tsx +0 -155
  308. package/tag/Tag.test.js +0 -49
  309. package/tag/types.d.ts +0 -69
  310. package/tag/types.js +0 -5
  311. package/text-input/Icons.d.ts +0 -8
  312. package/text-input/Icons.js +0 -56
  313. package/text-input/Suggestion.d.ts +0 -4
  314. package/text-input/Suggestion.js +0 -67
  315. package/text-input/Suggestions.d.ts +0 -4
  316. package/text-input/Suggestions.js +0 -89
  317. package/text-input/TextInput.d.ts +0 -4
  318. package/text-input/TextInput.js +0 -592
  319. package/text-input/TextInput.stories.tsx +0 -465
  320. package/text-input/TextInput.test.js +0 -1739
  321. package/text-input/types.d.ts +0 -205
  322. package/text-input/types.js +0 -5
  323. package/textarea/Textarea.d.ts +0 -4
  324. package/textarea/Textarea.js +0 -240
  325. package/textarea/Textarea.stories.tsx +0 -175
  326. package/textarea/Textarea.test.js +0 -406
  327. package/textarea/types.d.ts +0 -141
  328. package/textarea/types.js +0 -5
  329. package/toggle-group/ToggleGroup.d.ts +0 -4
  330. package/toggle-group/ToggleGroup.js +0 -204
  331. package/toggle-group/ToggleGroup.stories.tsx +0 -218
  332. package/toggle-group/ToggleGroup.test.js +0 -137
  333. package/toggle-group/types.d.ts +0 -114
  334. package/toggle-group/types.js +0 -5
  335. package/typography/Typography.d.ts +0 -4
  336. package/typography/Typography.js +0 -23
  337. package/typography/Typography.stories.tsx +0 -198
  338. package/typography/types.d.ts +0 -18
  339. package/typography/types.js +0 -5
  340. package/useTheme.d.ts +0 -1252
  341. package/useTheme.js +0 -15
  342. package/useTranslatedLabels.d.ts +0 -85
  343. package/useTranslatedLabels.js +0 -14
  344. package/utils/BaseTypography.d.ts +0 -21
  345. package/utils/BaseTypography.js +0 -94
  346. package/utils/FocusLock.d.ts +0 -13
  347. package/utils/FocusLock.js +0 -121
  348. package/wizard/Wizard.d.ts +0 -4
  349. package/wizard/Wizard.js +0 -250
  350. package/wizard/Wizard.stories.tsx +0 -253
  351. package/wizard/Wizard.test.js +0 -114
  352. package/wizard/types.d.ts +0 -64
  353. package/wizard/types.js +0 -5
@@ -1,830 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
5
- var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
6
- var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
7
- var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
8
- var _react = _interopRequireDefault(require("react"));
9
- var _react2 = require("@testing-library/react");
10
- var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
11
- var _NumberInput = _interopRequireDefault(require("./NumberInput.tsx"));
12
- // Mocking DOMRect for Radix Primitive Popover
13
- global.globalThis = global;
14
- global.DOMRect = {
15
- fromRect: function fromRect() {
16
- return {
17
- top: 0,
18
- left: 0,
19
- bottom: 0,
20
- right: 0,
21
- width: 0,
22
- height: 0
23
- };
24
- }
25
- };
26
- global.ResizeObserver = /*#__PURE__*/function () {
27
- function ResizeObserver() {
28
- (0, _classCallCheck2["default"])(this, ResizeObserver);
29
- }
30
- (0, _createClass2["default"])(ResizeObserver, [{
31
- key: "observe",
32
- value: function observe() {}
33
- }, {
34
- key: "unobserve",
35
- value: function unobserve() {}
36
- }, {
37
- key: "disconnect",
38
- value: function disconnect() {}
39
- }]);
40
- return ResizeObserver;
41
- }();
42
- describe("Number input component tests", function () {
43
- test("Number input renders with label, helper text, placeholder and increment/decrement action buttons", function () {
44
- var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
45
- label: "Number input label",
46
- helperText: "Helper text",
47
- placeholder: "Placeholder"
48
- })),
49
- getByLabelText = _render.getByLabelText,
50
- getByText = _render.getByText,
51
- queryAllByRole = _render.queryAllByRole;
52
- var number = getByLabelText("Number input label");
53
- expect(getByText("Number input label")).toBeTruthy();
54
- expect(getByText("Helper text")).toBeTruthy();
55
- expect(number.getAttribute("placeholder")).toBe("Placeholder");
56
- expect(queryAllByRole("button").length).toBe(2);
57
- });
58
- test("Number input buttons' tooltip is correct", function () {
59
- var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
60
- label: "Number label"
61
- })),
62
- getByTitle = _render2.getByTitle;
63
- expect(getByTitle("Decrement value")).toBeTruthy();
64
- expect(getByTitle("Increment value")).toBeTruthy();
65
- });
66
- test("Number input is disabled", function () {
67
- var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
68
- label: "Number label",
69
- disabled: true
70
- })),
71
- getByLabelText = _render3.getByLabelText;
72
- var number = getByLabelText("Number label");
73
- expect(number.disabled).toBeTruthy();
74
- });
75
- test("Number input is read only and cannot be incremented or decremented using the actions", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
76
- var _render4, getByLabelText, getAllByRole, number, decrement, increment;
77
- return _regenerator["default"].wrap(function _callee$(_context) {
78
- while (1) switch (_context.prev = _context.next) {
79
- case 0:
80
- _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
81
- label: "Number label",
82
- readOnly: true
83
- })), getByLabelText = _render4.getByLabelText, getAllByRole = _render4.getAllByRole;
84
- number = getByLabelText("Number label");
85
- expect(number.readOnly).toBeTruthy();
86
- decrement = getAllByRole("button")[0];
87
- _context.next = 6;
88
- return _userEvent["default"].click(decrement);
89
- case 6:
90
- expect(number.value).toBe("");
91
- increment = getAllByRole("button")[1];
92
- _context.next = 10;
93
- return _userEvent["default"].click(increment);
94
- case 10:
95
- expect(number.value).toBe("");
96
- case 11:
97
- case "end":
98
- return _context.stop();
99
- }
100
- }, _callee);
101
- })));
102
- test("Number input is read only and cannot be incremented or decremented using the arrow keys", function () {
103
- var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
104
- label: "Number label",
105
- readOnly: true
106
- })),
107
- getByLabelText = _render5.getByLabelText;
108
- var number = getByLabelText("Number label");
109
- expect(number.readOnly).toBeTruthy();
110
- _react2.fireEvent.keyDown(number, {
111
- keyCode: 38
112
- });
113
- expect(number.value).toBe("");
114
- _react2.fireEvent.keyDown(number, {
115
- keyCode: 40
116
- });
117
- expect(number.value).toBe("");
118
- });
119
- test("Number input is optional", function () {
120
- var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
121
- label: "Number label",
122
- optional: true
123
- })),
124
- getByText = _render6.getByText;
125
- expect(getByText("(Optional)")).toBeTruthy();
126
- });
127
- test("Number input is not optional: required field, displays error if not filled in", function () {
128
- var onBlur = jest.fn();
129
- var onChange = jest.fn();
130
- var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
131
- label: "Number input label",
132
- onBlur: onBlur,
133
- onChange: onChange
134
- })),
135
- getByLabelText = _render7.getByLabelText;
136
- var number = getByLabelText("Number input label");
137
- _userEvent["default"].type(number, "1");
138
- _userEvent["default"].clear(number);
139
- _react2.fireEvent.blur(number);
140
- expect(onBlur).toHaveBeenCalled();
141
- expect(onBlur).toHaveBeenCalledWith({
142
- value: "",
143
- error: "This field is required. Please, enter a value."
144
- });
145
- expect(onChange).toHaveBeenCalled();
146
- expect(onChange).toHaveBeenCalledWith({
147
- value: "",
148
- error: "This field is required. Please, enter a value."
149
- });
150
- });
151
- test("Suffix and prefix must be shown", function () {
152
- var _render8 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
153
- label: "Number input label",
154
- prefix: "+34",
155
- suffix: "USD"
156
- })),
157
- getByText = _render8.getByText;
158
- expect(getByText("+34")).toBeTruthy();
159
- expect(getByText("USD")).toBeTruthy();
160
- });
161
- test("Invalid number input renders error", function () {
162
- var _render9 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
163
- error: "Error message."
164
- })),
165
- getByText = _render9.getByText;
166
- expect(getByText("Error message.")).toBeTruthy();
167
- });
168
- test("onChange function is called correctly", function () {
169
- var onChange = jest.fn();
170
- var _render10 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
171
- label: "Number input label",
172
- onChange: onChange
173
- })),
174
- getByLabelText = _render10.getByLabelText;
175
- var number = getByLabelText("Number input label");
176
- _userEvent["default"].type(number, "t");
177
- expect(onChange).not.toHaveBeenCalledWith({
178
- value: "t"
179
- });
180
- expect(number.value).toBe("");
181
- _userEvent["default"].type(number, "1");
182
- expect(onChange).toHaveBeenCalledWith({
183
- value: "1"
184
- });
185
- expect(number.value).toBe("1");
186
- });
187
- test("Error message is shown if the typed value is less than the min value", function () {
188
- var onChange = jest.fn(function (_ref2) {
189
- var value = _ref2.value,
190
- error = _ref2.error;
191
- expect(value).toBe("-1");
192
- expect(error).toBe("Value must be greater than or equal to 0.");
193
- });
194
- var onBlur = jest.fn(function (_ref3) {
195
- var value = _ref3.value,
196
- error = _ref3.error;
197
- expect(value).toBe("-1");
198
- expect(error).toBe("Value must be greater than or equal to 0.");
199
- });
200
- var _render11 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
201
- label: "Number input label",
202
- min: 0,
203
- onBlur: onBlur,
204
- onChange: onChange
205
- })),
206
- getByLabelText = _render11.getByLabelText;
207
- var number = getByLabelText("Number input label");
208
- _userEvent["default"].type(number, "-1");
209
- _react2.fireEvent.blur(number);
210
- });
211
- test("Cannot decrement the value if it is less than the min value", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
212
- var _render12, getByLabelText, getAllByRole, number, decrement;
213
- return _regenerator["default"].wrap(function _callee2$(_context2) {
214
- while (1) switch (_context2.prev = _context2.next) {
215
- case 0:
216
- _render12 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
217
- label: "Number input label",
218
- min: 5
219
- })), getByLabelText = _render12.getByLabelText, getAllByRole = _render12.getAllByRole;
220
- number = getByLabelText("Number input label");
221
- _userEvent["default"].type(number, "1");
222
- _react2.fireEvent.blur(number);
223
- expect(number.value).toBe("1");
224
- decrement = getAllByRole("button")[0];
225
- _context2.next = 8;
226
- return _userEvent["default"].click(decrement);
227
- case 8:
228
- expect(number.value).toBe("1");
229
- case 9:
230
- case "end":
231
- return _context2.stop();
232
- }
233
- }, _callee2);
234
- })));
235
- test("Increment the value when it is less than the min value", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3() {
236
- var _render13, getByLabelText, getAllByRole, number, increment;
237
- return _regenerator["default"].wrap(function _callee3$(_context3) {
238
- while (1) switch (_context3.prev = _context3.next) {
239
- case 0:
240
- _render13 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
241
- label: "Number input label",
242
- min: 5
243
- })), getByLabelText = _render13.getByLabelText, getAllByRole = _render13.getAllByRole;
244
- number = getByLabelText("Number input label");
245
- _userEvent["default"].type(number, "1");
246
- _react2.fireEvent.blur(number);
247
- expect(number.value).toBe("1");
248
- increment = getAllByRole("button")[1];
249
- _context3.next = 8;
250
- return _userEvent["default"].click(increment);
251
- case 8:
252
- expect(number.value).toBe("5");
253
- case 9:
254
- case "end":
255
- return _context3.stop();
256
- }
257
- }, _callee3);
258
- })));
259
- test("Error message is shown if the typed value is greater than the max value", function () {
260
- var onChange = jest.fn();
261
- var onBlur = jest.fn();
262
- var _render14 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
263
- label: "Number input label",
264
- max: 10,
265
- onBlur: onBlur,
266
- onChange: onChange
267
- })),
268
- getByLabelText = _render14.getByLabelText;
269
- var number = getByLabelText("Number input label");
270
- _userEvent["default"].type(number, "12");
271
- expect(onChange).toHaveBeenCalledTimes(2);
272
- expect(onChange).toHaveBeenCalledWith({
273
- value: "12",
274
- error: "Value must be less than or equal to 10."
275
- });
276
- _react2.fireEvent.blur(number);
277
- expect(onBlur).toHaveBeenCalled();
278
- expect(onBlur).toHaveBeenCalledWith({
279
- value: "12",
280
- error: "Value must be less than or equal to 10."
281
- });
282
- });
283
- test("Cannot increment the value if it is greater than the max value", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4() {
284
- var _render15, getByLabelText, getAllByRole, number, decrement;
285
- return _regenerator["default"].wrap(function _callee4$(_context4) {
286
- while (1) switch (_context4.prev = _context4.next) {
287
- case 0:
288
- _render15 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
289
- label: "Number input label",
290
- max: 10
291
- })), getByLabelText = _render15.getByLabelText, getAllByRole = _render15.getAllByRole;
292
- number = getByLabelText("Number input label");
293
- _userEvent["default"].type(number, "12");
294
- _react2.fireEvent.blur(number);
295
- expect(number.value).toBe("12");
296
- decrement = getAllByRole("button")[1];
297
- _context4.next = 8;
298
- return _userEvent["default"].click(decrement);
299
- case 8:
300
- expect(number.value).toBe("12");
301
- case 9:
302
- case "end":
303
- return _context4.stop();
304
- }
305
- }, _callee4);
306
- })));
307
- test("Decrement the value when it is greater than the max value", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee5() {
308
- var _render16, getByLabelText, getAllByRole, number, decrement;
309
- return _regenerator["default"].wrap(function _callee5$(_context5) {
310
- while (1) switch (_context5.prev = _context5.next) {
311
- case 0:
312
- _render16 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
313
- label: "Number input label",
314
- max: 10
315
- })), getByLabelText = _render16.getByLabelText, getAllByRole = _render16.getAllByRole;
316
- number = getByLabelText("Number input label");
317
- _userEvent["default"].type(number, "120");
318
- _react2.fireEvent.blur(number);
319
- expect(number.value).toBe("120");
320
- decrement = getAllByRole("button")[0];
321
- _context5.next = 8;
322
- return _userEvent["default"].click(decrement);
323
- case 8:
324
- expect(number.value).toBe("10");
325
- case 9:
326
- case "end":
327
- return _context5.stop();
328
- }
329
- }, _callee5);
330
- })));
331
- test("Increment and decrement the value with min and max values", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee6() {
332
- var _render17, getByLabelText, getAllByRole, number, decrement, increment;
333
- return _regenerator["default"].wrap(function _callee6$(_context6) {
334
- while (1) switch (_context6.prev = _context6.next) {
335
- case 0:
336
- _render17 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
337
- label: "Number input label",
338
- min: 5,
339
- max: 10
340
- })), getByLabelText = _render17.getByLabelText, getAllByRole = _render17.getAllByRole;
341
- number = getByLabelText("Number input label");
342
- _userEvent["default"].type(number, "1");
343
- _react2.fireEvent.blur(number);
344
- expect(number.value).toBe("1");
345
- decrement = getAllByRole("button")[0];
346
- _context6.next = 8;
347
- return _userEvent["default"].click(decrement);
348
- case 8:
349
- expect(number.value).toBe("1");
350
- increment = getAllByRole("button")[1];
351
- _context6.next = 12;
352
- return _userEvent["default"].click(increment);
353
- case 12:
354
- expect(number.value).toBe("5");
355
- _context6.next = 15;
356
- return _userEvent["default"].click(increment);
357
- case 15:
358
- _context6.next = 17;
359
- return _userEvent["default"].click(increment);
360
- case 17:
361
- _context6.next = 19;
362
- return _userEvent["default"].click(increment);
363
- case 19:
364
- _context6.next = 21;
365
- return _userEvent["default"].click(increment);
366
- case 21:
367
- _context6.next = 23;
368
- return _userEvent["default"].click(increment);
369
- case 23:
370
- expect(number.value).toBe("10");
371
- _context6.next = 26;
372
- return _userEvent["default"].click(increment);
373
- case 26:
374
- expect(number.value).toBe("10");
375
- case 27:
376
- case "end":
377
- return _context6.stop();
378
- }
379
- }, _callee6);
380
- })));
381
- test("Increment and decrement the value with an integer step", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee7() {
382
- var _render18, getByLabelText, getAllByRole, number, increment, decrement;
383
- return _regenerator["default"].wrap(function _callee7$(_context7) {
384
- while (1) switch (_context7.prev = _context7.next) {
385
- case 0:
386
- _render18 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
387
- label: "Number input label",
388
- step: 5
389
- })), getByLabelText = _render18.getByLabelText, getAllByRole = _render18.getAllByRole;
390
- number = getByLabelText("Number input label");
391
- _userEvent["default"].type(number, "10");
392
- _react2.fireEvent.blur(number);
393
- expect(number.value).toBe("10");
394
- increment = getAllByRole("button")[1];
395
- _context7.next = 8;
396
- return _userEvent["default"].click(increment);
397
- case 8:
398
- expect(number.value).toBe("15");
399
- _context7.next = 11;
400
- return _userEvent["default"].click(increment);
401
- case 11:
402
- expect(number.value).toBe("20");
403
- decrement = getAllByRole("button")[0];
404
- _context7.next = 15;
405
- return _userEvent["default"].click(decrement);
406
- case 15:
407
- expect(number.value).toBe("15");
408
- _context7.next = 18;
409
- return _userEvent["default"].click(decrement);
410
- case 18:
411
- expect(number.value).toBe("10");
412
- case 19:
413
- case "end":
414
- return _context7.stop();
415
- }
416
- }, _callee7);
417
- })));
418
- test("Increment and decrement the value with a decimal step", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee8() {
419
- var _render19, getByLabelText, getAllByRole, number, increment, decrement;
420
- return _regenerator["default"].wrap(function _callee8$(_context8) {
421
- while (1) switch (_context8.prev = _context8.next) {
422
- case 0:
423
- _render19 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
424
- label: "Number input label",
425
- step: 0.5
426
- })), getByLabelText = _render19.getByLabelText, getAllByRole = _render19.getAllByRole;
427
- number = getByLabelText("Number input label");
428
- _userEvent["default"].type(number, "-9");
429
- _react2.fireEvent.blur(number);
430
- expect(number.value).toBe("-9");
431
- increment = getAllByRole("button")[1];
432
- _context8.next = 8;
433
- return _userEvent["default"].click(increment);
434
- case 8:
435
- expect(number.value).toBe("-8.5");
436
- _context8.next = 11;
437
- return _userEvent["default"].click(increment);
438
- case 11:
439
- expect(number.value).toBe("-8");
440
- decrement = getAllByRole("button")[0];
441
- _context8.next = 15;
442
- return _userEvent["default"].click(decrement);
443
- case 15:
444
- _context8.next = 17;
445
- return _userEvent["default"].click(decrement);
446
- case 17:
447
- _context8.next = 19;
448
- return _userEvent["default"].click(decrement);
449
- case 19:
450
- expect(number.value).toBe("-9.5");
451
- _context8.next = 22;
452
- return _userEvent["default"].click(decrement);
453
- case 22:
454
- expect(number.value).toBe("-10");
455
- case 23:
456
- case "end":
457
- return _context8.stop();
458
- }
459
- }, _callee8);
460
- })));
461
- test("Increment and decrement the value with min, max and step", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee9() {
462
- var onBlur, _render20, getByLabelText, getAllByRole, number, increment, decrement;
463
- return _regenerator["default"].wrap(function _callee9$(_context9) {
464
- while (1) switch (_context9.prev = _context9.next) {
465
- case 0:
466
- onBlur = jest.fn();
467
- _render20 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
468
- label: "Number input label",
469
- min: 5,
470
- max: 20,
471
- step: 8,
472
- onBlur: onBlur
473
- })), getByLabelText = _render20.getByLabelText, getAllByRole = _render20.getAllByRole;
474
- number = getByLabelText("Number input label");
475
- _userEvent["default"].type(number, "1");
476
- _react2.fireEvent.blur(number);
477
- expect(onBlur).toHaveBeenCalledWith({
478
- value: "1",
479
- error: "Value must be greater than or equal to 5."
480
- });
481
- increment = getAllByRole("button")[1];
482
- _context9.next = 9;
483
- return _userEvent["default"].click(increment);
484
- case 9:
485
- expect(number.value).toBe("5");
486
- _context9.next = 12;
487
- return _userEvent["default"].click(increment);
488
- case 12:
489
- expect(number.value).toBe("13");
490
- _context9.next = 15;
491
- return _userEvent["default"].click(increment);
492
- case 15:
493
- expect(number.value).toBe("13");
494
- _context9.next = 18;
495
- return _userEvent["default"].click(increment);
496
- case 18:
497
- expect(number.value).toBe("13");
498
- decrement = getAllByRole("button")[0];
499
- _context9.next = 22;
500
- return _userEvent["default"].click(decrement);
501
- case 22:
502
- expect(number.value).toBe("5");
503
- _context9.next = 25;
504
- return _userEvent["default"].click(decrement);
505
- case 25:
506
- expect(number.value).toBe("5");
507
- _context9.next = 28;
508
- return _userEvent["default"].click(decrement);
509
- case 28:
510
- case "end":
511
- return _context9.stop();
512
- }
513
- }, _callee9);
514
- })));
515
- test("Start incrementing from 0 when the min value is less than 0 and the max value is bigger than 0", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee10() {
516
- var onBlur, _render21, getByLabelText, getAllByRole, number, increment;
517
- return _regenerator["default"].wrap(function _callee10$(_context10) {
518
- while (1) switch (_context10.prev = _context10.next) {
519
- case 0:
520
- onBlur = jest.fn();
521
- _render21 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
522
- label: "Number input label",
523
- min: -10,
524
- max: 10,
525
- step: 1,
526
- onBlur: onBlur
527
- })), getByLabelText = _render21.getByLabelText, getAllByRole = _render21.getAllByRole;
528
- number = getByLabelText("Number input label");
529
- increment = getAllByRole("button")[1];
530
- _context10.next = 6;
531
- return _userEvent["default"].click(increment);
532
- case 6:
533
- expect(number.value).toBe("1");
534
- _context10.next = 9;
535
- return _userEvent["default"].click(increment);
536
- case 9:
537
- expect(number.value).toBe("2");
538
- case 10:
539
- case "end":
540
- return _context10.stop();
541
- }
542
- }, _callee10);
543
- })));
544
- test("Start incrementing from 0 when the min value is less than 0 and the max is 0", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee11() {
545
- var _render22, getByLabelText, getAllByRole, number, increment;
546
- return _regenerator["default"].wrap(function _callee11$(_context11) {
547
- while (1) switch (_context11.prev = _context11.next) {
548
- case 0:
549
- _render22 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
550
- label: "Number input label",
551
- min: -10,
552
- max: 0,
553
- step: 1
554
- })), getByLabelText = _render22.getByLabelText, getAllByRole = _render22.getAllByRole;
555
- number = getByLabelText("Number input label");
556
- increment = getAllByRole("button")[1];
557
- _context11.next = 5;
558
- return _userEvent["default"].click(increment);
559
- case 5:
560
- expect(number.value).toBe("0");
561
- _context11.next = 8;
562
- return _userEvent["default"].click(increment);
563
- case 8:
564
- expect(number.value).toBe("0");
565
- case 9:
566
- case "end":
567
- return _context11.stop();
568
- }
569
- }, _callee11);
570
- })));
571
- test("Start incrementing from the min value when it is bigger than 0", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee12() {
572
- var _render23, getByLabelText, getAllByRole, number, increment;
573
- return _regenerator["default"].wrap(function _callee12$(_context12) {
574
- while (1) switch (_context12.prev = _context12.next) {
575
- case 0:
576
- _render23 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
577
- label: "Number input label",
578
- min: 2,
579
- max: 10,
580
- step: 0.5
581
- })), getByLabelText = _render23.getByLabelText, getAllByRole = _render23.getAllByRole;
582
- number = getByLabelText("Number input label");
583
- increment = getAllByRole("button")[1];
584
- _context12.next = 5;
585
- return _userEvent["default"].click(increment);
586
- case 5:
587
- expect(number.value).toBe("2");
588
- _context12.next = 8;
589
- return _userEvent["default"].click(increment);
590
- case 8:
591
- expect(number.value).toBe("2.5");
592
- case 9:
593
- case "end":
594
- return _context12.stop();
595
- }
596
- }, _callee12);
597
- })));
598
- test("Start incrementing from the max value when it is less than 0", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee13() {
599
- var _render24, getByLabelText, getAllByRole, number, increment;
600
- return _regenerator["default"].wrap(function _callee13$(_context13) {
601
- while (1) switch (_context13.prev = _context13.next) {
602
- case 0:
603
- _render24 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
604
- label: "Number input label",
605
- min: -10,
606
- max: -1,
607
- step: 0.5
608
- })), getByLabelText = _render24.getByLabelText, getAllByRole = _render24.getAllByRole;
609
- number = getByLabelText("Number input label");
610
- increment = getAllByRole("button")[1];
611
- _context13.next = 5;
612
- return _userEvent["default"].click(increment);
613
- case 5:
614
- expect(number.value).toBe("-1");
615
- _context13.next = 8;
616
- return _userEvent["default"].click(increment);
617
- case 8:
618
- expect(number.value).toBe("-1");
619
- case 9:
620
- case "end":
621
- return _context13.stop();
622
- }
623
- }, _callee13);
624
- })));
625
- test("Start decrementing from 0 when the min value is less than 0 and the max value is bigger than 0", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee14() {
626
- var _render25, getByLabelText, getAllByRole, number, decrement;
627
- return _regenerator["default"].wrap(function _callee14$(_context14) {
628
- while (1) switch (_context14.prev = _context14.next) {
629
- case 0:
630
- _render25 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
631
- label: "Number input label",
632
- min: -10,
633
- max: 10,
634
- step: 1
635
- })), getByLabelText = _render25.getByLabelText, getAllByRole = _render25.getAllByRole;
636
- number = getByLabelText("Number input label");
637
- decrement = getAllByRole("button")[0];
638
- _context14.next = 5;
639
- return _userEvent["default"].click(decrement);
640
- case 5:
641
- expect(number.value).toBe("-1");
642
- case 6:
643
- case "end":
644
- return _context14.stop();
645
- }
646
- }, _callee14);
647
- })));
648
- test("Start decrementing from 0 when the min value is 0 and the max value is bigger than 0", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee15() {
649
- var _render26, getByLabelText, getAllByRole, number, decrement;
650
- return _regenerator["default"].wrap(function _callee15$(_context15) {
651
- while (1) switch (_context15.prev = _context15.next) {
652
- case 0:
653
- _render26 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
654
- label: "Number input label",
655
- min: 0,
656
- max: 10,
657
- step: 1
658
- })), getByLabelText = _render26.getByLabelText, getAllByRole = _render26.getAllByRole;
659
- number = getByLabelText("Number input label");
660
- decrement = getAllByRole("button")[0];
661
- _context15.next = 5;
662
- return _userEvent["default"].click(decrement);
663
- case 5:
664
- expect(number.value).toBe("0");
665
- case 6:
666
- case "end":
667
- return _context15.stop();
668
- }
669
- }, _callee15);
670
- })));
671
- test("Start decrementing from the min value when it is bigger than 0", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee16() {
672
- var _render27, getByLabelText, getAllByRole, number, decrement;
673
- return _regenerator["default"].wrap(function _callee16$(_context16) {
674
- while (1) switch (_context16.prev = _context16.next) {
675
- case 0:
676
- _render27 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
677
- label: "Number input label",
678
- min: 2,
679
- max: 10,
680
- step: 0.5
681
- })), getByLabelText = _render27.getByLabelText, getAllByRole = _render27.getAllByRole;
682
- number = getByLabelText("Number input label");
683
- decrement = getAllByRole("button")[0];
684
- _context16.next = 5;
685
- return _userEvent["default"].click(decrement);
686
- case 5:
687
- expect(number.value).toBe("2");
688
- _context16.next = 8;
689
- return _userEvent["default"].click(decrement);
690
- case 8:
691
- expect(number.value).toBe("2");
692
- case 9:
693
- case "end":
694
- return _context16.stop();
695
- }
696
- }, _callee16);
697
- })));
698
- test("Start decrementing from the max value when it is less than 0", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee17() {
699
- var _render28, getByLabelText, getAllByRole, number, decrement;
700
- return _regenerator["default"].wrap(function _callee17$(_context17) {
701
- while (1) switch (_context17.prev = _context17.next) {
702
- case 0:
703
- _render28 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
704
- label: "Number input label",
705
- min: -10,
706
- max: -1,
707
- step: 0.5
708
- })), getByLabelText = _render28.getByLabelText, getAllByRole = _render28.getAllByRole;
709
- number = getByLabelText("Number input label");
710
- decrement = getAllByRole("button")[0];
711
- _context17.next = 5;
712
- return _userEvent["default"].click(decrement);
713
- case 5:
714
- expect(number.value).toBe("-1");
715
- _context17.next = 8;
716
- return _userEvent["default"].click(decrement);
717
- case 8:
718
- expect(number.value).toBe("-1.5");
719
- case 9:
720
- case "end":
721
- return _context17.stop();
722
- }
723
- }, _callee17);
724
- })));
725
- test("Increment and decrement the value with min, max and step using the arrows in keyboard", function () {
726
- var _render29 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
727
- label: "Number input label",
728
- min: 5,
729
- max: 20,
730
- step: 5
731
- })),
732
- getByLabelText = _render29.getByLabelText;
733
- var number = getByLabelText("Number input label");
734
- _userEvent["default"].type(number, "1");
735
- _react2.fireEvent.keyDown(number, {
736
- keyCode: 38
737
- });
738
- expect(number.value).toBe("5");
739
- _react2.fireEvent.keyDown(number, {
740
- keyCode: 38
741
- });
742
- expect(number.value).toBe("10");
743
- _react2.fireEvent.keyDown(number, {
744
- keyCode: 38
745
- });
746
- expect(number.value).toBe("15");
747
- _react2.fireEvent.keyDown(number, {
748
- keyCode: 38
749
- });
750
- expect(number.value).toBe("20");
751
- _react2.fireEvent.keyDown(number, {
752
- keyCode: 38
753
- });
754
- expect(number.value).toBe("20");
755
- _react2.fireEvent.keyDown(number, {
756
- keyCode: 40
757
- });
758
- expect(number.value).toBe("15");
759
- _react2.fireEvent.keyDown(number, {
760
- keyCode: 40
761
- });
762
- expect(number.value).toBe("10");
763
- _react2.fireEvent.keyDown(number, {
764
- keyCode: 40
765
- });
766
- expect(number.value).toBe("5");
767
- _react2.fireEvent.keyDown(number, {
768
- keyCode: 40
769
- });
770
- expect(number.value).toBe("5");
771
- });
772
- test("Number has correct accessibility attributes", function () {
773
- var _render30 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
774
- label: "Number input label"
775
- })),
776
- getByLabelText = _render30.getByLabelText,
777
- getAllByRole = _render30.getAllByRole;
778
- var number = getByLabelText("Number input label");
779
- expect(number.getAttribute("type")).toBe("number");
780
- expect(number.getAttribute("aria-autocomplete")).toBeNull();
781
- expect(number.getAttribute("aria-controls")).toBeNull();
782
- expect(number.getAttribute("aria-expanded")).toBeNull();
783
- var decrement = getAllByRole("button")[0];
784
- expect(decrement.getAttribute("aria-label")).toBe("Decrement value");
785
- var increment = getAllByRole("button")[1];
786
- expect(increment.getAttribute("aria-label")).toBe("Increment value");
787
- });
788
- test("Number input submits correct values inside a form and actions don't trigger the submit event", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee18() {
789
- var handlerOnSubmit, _render31, getByText, getAllByRole, less, more, submit;
790
- return _regenerator["default"].wrap(function _callee18$(_context18) {
791
- while (1) switch (_context18.prev = _context18.next) {
792
- case 0:
793
- handlerOnSubmit = jest.fn(function (e) {
794
- e.preventDefault();
795
- var formData = new FormData(e.target);
796
- var formProps = Object.fromEntries(formData);
797
- expect(formProps).toStrictEqual({
798
- data: "0"
799
- });
800
- });
801
- _render31 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement("form", {
802
- onSubmit: handlerOnSubmit
803
- }, /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
804
- label: "Number input label",
805
- name: "data"
806
- }), /*#__PURE__*/_react["default"].createElement("button", {
807
- type: "submit"
808
- }, "Submit"))), getByText = _render31.getByText, getAllByRole = _render31.getAllByRole;
809
- less = getAllByRole("button")[0];
810
- more = getAllByRole("button")[1];
811
- submit = getByText("Submit");
812
- _context18.next = 7;
813
- return _userEvent["default"].click(more);
814
- case 7:
815
- expect(handlerOnSubmit).not.toHaveBeenCalled();
816
- _context18.next = 10;
817
- return _userEvent["default"].click(less);
818
- case 10:
819
- expect(handlerOnSubmit).not.toHaveBeenCalled();
820
- _context18.next = 13;
821
- return _userEvent["default"].click(submit);
822
- case 13:
823
- expect(handlerOnSubmit).toHaveBeenCalled();
824
- case 14:
825
- case "end":
826
- return _context18.stop();
827
- }
828
- }, _callee18);
829
- })));
830
- });