@dxc-technology/halstack-react 0.0.0-9bd9511 → 0.0.0-9c04360

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 (333) hide show
  1. package/README.md +46 -0
  2. package/dist/index.d.mts +4032 -0
  3. package/dist/index.d.ts +4032 -0
  4. package/dist/index.js +15089 -0
  5. package/dist/index.mjs +15000 -0
  6. package/package.json +85 -67
  7. package/BackgroundColorContext.d.ts +0 -10
  8. package/BackgroundColorContext.js +0 -37
  9. package/HalstackContext.d.ts +0 -13
  10. package/HalstackContext.js +0 -318
  11. package/accordion/Accordion.d.ts +0 -4
  12. package/accordion/Accordion.js +0 -203
  13. package/accordion/Accordion.stories.tsx +0 -395
  14. package/accordion/Accordion.test.js +0 -56
  15. package/accordion/types.d.ts +0 -69
  16. package/accordion/types.js +0 -5
  17. package/accordion-group/AccordionGroup.d.ts +0 -7
  18. package/accordion-group/AccordionGroup.js +0 -121
  19. package/accordion-group/AccordionGroup.stories.tsx +0 -251
  20. package/accordion-group/AccordionGroup.test.js +0 -108
  21. package/accordion-group/types.d.ts +0 -79
  22. package/accordion-group/types.js +0 -5
  23. package/alert/Alert.d.ts +0 -4
  24. package/alert/Alert.js +0 -262
  25. package/alert/Alert.stories.tsx +0 -198
  26. package/alert/Alert.test.js +0 -75
  27. package/alert/types.d.ts +0 -49
  28. package/alert/types.js +0 -5
  29. package/badge/Badge.d.ts +0 -4
  30. package/badge/Badge.js +0 -49
  31. package/badge/types.d.ts +0 -5
  32. package/badge/types.js +0 -5
  33. package/bleed/Bleed.d.ts +0 -3
  34. package/bleed/Bleed.js +0 -43
  35. package/bleed/Bleed.stories.tsx +0 -341
  36. package/bleed/types.d.ts +0 -37
  37. package/bleed/types.js +0 -5
  38. package/box/Box.d.ts +0 -4
  39. package/box/Box.js +0 -97
  40. package/box/Box.stories.tsx +0 -147
  41. package/box/Box.test.js +0 -13
  42. package/box/types.d.ts +0 -44
  43. package/box/types.js +0 -5
  44. package/bulleted-list/BulletedList.d.ts +0 -7
  45. package/bulleted-list/BulletedList.js +0 -98
  46. package/bulleted-list/BulletedList.stories.tsx +0 -200
  47. package/bulleted-list/types.d.ts +0 -11
  48. package/bulleted-list/types.js +0 -5
  49. package/button/Button.d.ts +0 -4
  50. package/button/Button.js +0 -132
  51. package/button/Button.stories.tsx +0 -425
  52. package/button/Button.test.js +0 -26
  53. package/button/types.d.ts +0 -53
  54. package/button/types.js +0 -5
  55. package/card/Card.d.ts +0 -4
  56. package/card/Card.js +0 -138
  57. package/card/Card.stories.tsx +0 -201
  58. package/card/Card.test.js +0 -39
  59. package/card/ice-cream.jpg +0 -0
  60. package/card/types.d.ts +0 -68
  61. package/card/types.js +0 -5
  62. package/checkbox/Checkbox.d.ts +0 -4
  63. package/checkbox/Checkbox.js +0 -206
  64. package/checkbox/Checkbox.stories.tsx +0 -260
  65. package/checkbox/Checkbox.test.js +0 -128
  66. package/checkbox/types.d.ts +0 -68
  67. package/checkbox/types.js +0 -5
  68. package/chip/Chip.d.ts +0 -4
  69. package/chip/Chip.js +0 -137
  70. package/chip/Chip.stories.tsx +0 -206
  71. package/chip/Chip.test.js +0 -42
  72. package/chip/types.d.ts +0 -45
  73. package/chip/types.js +0 -5
  74. package/common/OpenSans.css +0 -81
  75. package/common/fonts/OpenSans-Bold.ttf +0 -0
  76. package/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  77. package/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  78. package/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  79. package/common/fonts/OpenSans-Italic.ttf +0 -0
  80. package/common/fonts/OpenSans-Light.ttf +0 -0
  81. package/common/fonts/OpenSans-LightItalic.ttf +0 -0
  82. package/common/fonts/OpenSans-Regular.ttf +0 -0
  83. package/common/fonts/OpenSans-SemiBold.ttf +0 -0
  84. package/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  85. package/common/utils.js +0 -17
  86. package/common/variables.d.ts +0 -1431
  87. package/common/variables.js +0 -1538
  88. package/date-input/Calendar.d.ts +0 -4
  89. package/date-input/Calendar.js +0 -215
  90. package/date-input/DateInput.d.ts +0 -4
  91. package/date-input/DateInput.js +0 -222
  92. package/date-input/DateInput.stories.tsx +0 -304
  93. package/date-input/DateInput.test.js +0 -648
  94. package/date-input/DatePicker.d.ts +0 -4
  95. package/date-input/DatePicker.js +0 -116
  96. package/date-input/Icons.d.ts +0 -6
  97. package/date-input/Icons.js +0 -63
  98. package/date-input/YearPicker.d.ts +0 -4
  99. package/date-input/YearPicker.js +0 -101
  100. package/date-input/types.d.ts +0 -158
  101. package/date-input/types.js +0 -5
  102. package/dialog/Dialog.d.ts +0 -4
  103. package/dialog/Dialog.js +0 -134
  104. package/dialog/Dialog.stories.tsx +0 -289
  105. package/dialog/Dialog.test.js +0 -56
  106. package/dialog/types.d.ts +0 -44
  107. package/dialog/types.js +0 -5
  108. package/dropdown/Dropdown.d.ts +0 -4
  109. package/dropdown/Dropdown.js +0 -334
  110. package/dropdown/Dropdown.stories.tsx +0 -438
  111. package/dropdown/Dropdown.test.js +0 -479
  112. package/dropdown/DropdownMenu.d.ts +0 -4
  113. package/dropdown/DropdownMenu.js +0 -60
  114. package/dropdown/DropdownMenuItem.d.ts +0 -4
  115. package/dropdown/DropdownMenuItem.js +0 -70
  116. package/dropdown/types.d.ts +0 -100
  117. package/dropdown/types.js +0 -5
  118. package/file-input/FileInput.d.ts +0 -4
  119. package/file-input/FileInput.js +0 -463
  120. package/file-input/FileInput.stories.tsx +0 -618
  121. package/file-input/FileInput.test.js +0 -445
  122. package/file-input/FileItem.d.ts +0 -4
  123. package/file-input/FileItem.js +0 -135
  124. package/file-input/types.d.ts +0 -129
  125. package/file-input/types.js +0 -5
  126. package/flex/Flex.d.ts +0 -4
  127. package/flex/Flex.js +0 -57
  128. package/flex/Flex.stories.tsx +0 -103
  129. package/flex/types.d.ts +0 -32
  130. package/flex/types.js +0 -5
  131. package/footer/Footer.d.ts +0 -4
  132. package/footer/Footer.js +0 -153
  133. package/footer/Footer.stories.tsx +0 -228
  134. package/footer/Footer.test.js +0 -92
  135. package/footer/Icons.d.ts +0 -2
  136. package/footer/Icons.js +0 -73
  137. package/footer/types.d.ts +0 -66
  138. package/footer/types.js +0 -5
  139. package/header/Header.d.ts +0 -7
  140. package/header/Header.js +0 -259
  141. package/header/Header.stories.tsx +0 -315
  142. package/header/Header.test.js +0 -66
  143. package/header/Icons.d.ts +0 -2
  144. package/header/Icons.js +0 -30
  145. package/header/types.d.ts +0 -48
  146. package/header/types.js +0 -5
  147. package/heading/Heading.d.ts +0 -4
  148. package/heading/Heading.js +0 -138
  149. package/heading/Heading.stories.tsx +0 -54
  150. package/heading/Heading.test.js +0 -169
  151. package/heading/types.d.ts +0 -33
  152. package/heading/types.js +0 -5
  153. package/inset/Inset.d.ts +0 -3
  154. package/inset/Inset.js +0 -43
  155. package/inset/Inset.stories.tsx +0 -229
  156. package/inset/types.d.ts +0 -37
  157. package/inset/types.js +0 -5
  158. package/layout/ApplicationLayout.d.ts +0 -20
  159. package/layout/ApplicationLayout.js +0 -132
  160. package/layout/ApplicationLayout.stories.tsx +0 -162
  161. package/layout/Icons.d.ts +0 -5
  162. package/layout/Icons.js +0 -56
  163. package/layout/SidenavContext.d.ts +0 -5
  164. package/layout/SidenavContext.js +0 -15
  165. package/layout/types.d.ts +0 -42
  166. package/layout/types.js +0 -5
  167. package/link/Link.d.ts +0 -4
  168. package/link/Link.js +0 -116
  169. package/link/Link.stories.tsx +0 -253
  170. package/link/Link.test.js +0 -65
  171. package/link/types.d.ts +0 -54
  172. package/link/types.js +0 -5
  173. package/main.d.ts +0 -44
  174. package/main.js +0 -322
  175. package/nav-tabs/NavTabs.d.ts +0 -8
  176. package/nav-tabs/NavTabs.js +0 -95
  177. package/nav-tabs/NavTabs.stories.tsx +0 -260
  178. package/nav-tabs/NavTabs.test.js +0 -75
  179. package/nav-tabs/Tab.d.ts +0 -4
  180. package/nav-tabs/Tab.js +0 -120
  181. package/nav-tabs/types.d.ts +0 -53
  182. package/nav-tabs/types.js +0 -5
  183. package/number-input/NumberInput.d.ts +0 -4
  184. package/number-input/NumberInput.js +0 -66
  185. package/number-input/NumberInput.stories.tsx +0 -115
  186. package/number-input/NumberInput.test.js +0 -406
  187. package/number-input/NumberInputContext.d.ts +0 -4
  188. package/number-input/NumberInputContext.js +0 -14
  189. package/number-input/numberInputContextTypes.d.ts +0 -19
  190. package/number-input/numberInputContextTypes.js +0 -5
  191. package/number-input/types.d.ts +0 -124
  192. package/number-input/types.js +0 -5
  193. package/paginator/Icons.d.ts +0 -5
  194. package/paginator/Icons.js +0 -44
  195. package/paginator/Paginator.d.ts +0 -4
  196. package/paginator/Paginator.js +0 -141
  197. package/paginator/Paginator.stories.tsx +0 -87
  198. package/paginator/Paginator.test.js +0 -266
  199. package/paginator/types.d.ts +0 -38
  200. package/paginator/types.js +0 -5
  201. package/paragraph/Paragraph.d.ts +0 -6
  202. package/paragraph/Paragraph.js +0 -28
  203. package/paragraph/Paragraph.stories.tsx +0 -44
  204. package/password-input/PasswordInput.d.ts +0 -4
  205. package/password-input/PasswordInput.js +0 -137
  206. package/password-input/PasswordInput.stories.tsx +0 -131
  207. package/password-input/PasswordInput.test.js +0 -138
  208. package/password-input/types.d.ts +0 -110
  209. package/password-input/types.js +0 -5
  210. package/progress-bar/ProgressBar.d.ts +0 -4
  211. package/progress-bar/ProgressBar.js +0 -151
  212. package/progress-bar/ProgressBar.stories.jsx +0 -93
  213. package/progress-bar/ProgressBar.test.js +0 -93
  214. package/progress-bar/types.d.ts +0 -36
  215. package/progress-bar/types.js +0 -5
  216. package/quick-nav/QuickNav.d.ts +0 -4
  217. package/quick-nav/QuickNav.js +0 -95
  218. package/quick-nav/QuickNav.stories.tsx +0 -356
  219. package/quick-nav/types.d.ts +0 -21
  220. package/quick-nav/types.js +0 -5
  221. package/radio-group/Radio.d.ts +0 -4
  222. package/radio-group/Radio.js +0 -125
  223. package/radio-group/RadioGroup.d.ts +0 -4
  224. package/radio-group/RadioGroup.js +0 -238
  225. package/radio-group/RadioGroup.stories.tsx +0 -214
  226. package/radio-group/RadioGroup.test.js +0 -620
  227. package/radio-group/types.d.ts +0 -114
  228. package/radio-group/types.js +0 -5
  229. package/resultsetTable/Icons.d.ts +0 -7
  230. package/resultsetTable/Icons.js +0 -48
  231. package/resultsetTable/ResultsetTable.d.ts +0 -4
  232. package/resultsetTable/ResultsetTable.js +0 -160
  233. package/resultsetTable/ResultsetTable.stories.tsx +0 -300
  234. package/resultsetTable/ResultsetTable.test.js +0 -292
  235. package/resultsetTable/types.d.ts +0 -67
  236. package/resultsetTable/types.js +0 -5
  237. package/select/Icons.d.ts +0 -10
  238. package/select/Icons.js +0 -90
  239. package/select/Listbox.d.ts +0 -4
  240. package/select/Listbox.js +0 -144
  241. package/select/Option.d.ts +0 -4
  242. package/select/Option.js +0 -81
  243. package/select/Select.d.ts +0 -4
  244. package/select/Select.js +0 -579
  245. package/select/Select.stories.tsx +0 -971
  246. package/select/Select.test.js +0 -1845
  247. package/select/types.d.ts +0 -210
  248. package/select/types.js +0 -5
  249. package/sidenav/Sidenav.d.ts +0 -10
  250. package/sidenav/Sidenav.js +0 -226
  251. package/sidenav/Sidenav.stories.tsx +0 -282
  252. package/sidenav/Sidenav.test.js +0 -37
  253. package/sidenav/types.d.ts +0 -73
  254. package/sidenav/types.js +0 -5
  255. package/slider/Slider.d.ts +0 -4
  256. package/slider/Slider.js +0 -296
  257. package/slider/Slider.stories.tsx +0 -240
  258. package/slider/Slider.test.js +0 -222
  259. package/slider/types.d.ts +0 -86
  260. package/slider/types.js +0 -5
  261. package/spinner/Spinner.d.ts +0 -4
  262. package/spinner/Spinner.js +0 -221
  263. package/spinner/Spinner.stories.jsx +0 -129
  264. package/spinner/Spinner.test.js +0 -55
  265. package/spinner/types.d.ts +0 -32
  266. package/spinner/types.js +0 -5
  267. package/switch/Switch.d.ts +0 -4
  268. package/switch/Switch.js +0 -220
  269. package/switch/Switch.stories.tsx +0 -171
  270. package/switch/Switch.test.js +0 -180
  271. package/switch/types.d.ts +0 -66
  272. package/switch/types.js +0 -5
  273. package/table/Table.d.ts +0 -4
  274. package/table/Table.js +0 -100
  275. package/table/Table.stories.jsx +0 -356
  276. package/table/Table.test.js +0 -21
  277. package/table/types.d.ts +0 -21
  278. package/table/types.js +0 -5
  279. package/tabs/Tab.d.ts +0 -4
  280. package/tabs/Tab.js +0 -115
  281. package/tabs/Tabs.d.ts +0 -4
  282. package/tabs/Tabs.js +0 -392
  283. package/tabs/Tabs.stories.tsx +0 -226
  284. package/tabs/Tabs.test.js +0 -295
  285. package/tabs/types.d.ts +0 -92
  286. package/tabs/types.js +0 -5
  287. package/tag/Tag.d.ts +0 -4
  288. package/tag/Tag.js +0 -154
  289. package/tag/Tag.stories.tsx +0 -155
  290. package/tag/Tag.test.js +0 -49
  291. package/tag/types.d.ts +0 -69
  292. package/tag/types.js +0 -5
  293. package/text-input/Icons.d.ts +0 -8
  294. package/text-input/Icons.js +0 -57
  295. package/text-input/Suggestion.d.ts +0 -4
  296. package/text-input/Suggestion.js +0 -68
  297. package/text-input/Suggestions.d.ts +0 -4
  298. package/text-input/Suggestions.js +0 -109
  299. package/text-input/TextInput.d.ts +0 -4
  300. package/text-input/TextInput.js +0 -588
  301. package/text-input/TextInput.stories.tsx +0 -569
  302. package/text-input/TextInput.test.js +0 -1404
  303. package/text-input/types.d.ts +0 -197
  304. package/text-input/types.js +0 -5
  305. package/textarea/Textarea.d.ts +0 -4
  306. package/textarea/Textarea.js +0 -241
  307. package/textarea/Textarea.stories.jsx +0 -216
  308. package/textarea/Textarea.test.js +0 -360
  309. package/textarea/types.d.ts +0 -137
  310. package/textarea/types.js +0 -5
  311. package/toggle-group/ToggleGroup.d.ts +0 -4
  312. package/toggle-group/ToggleGroup.js +0 -180
  313. package/toggle-group/ToggleGroup.stories.tsx +0 -215
  314. package/toggle-group/ToggleGroup.test.js +0 -124
  315. package/toggle-group/types.d.ts +0 -105
  316. package/toggle-group/types.js +0 -5
  317. package/translatedLabelsType.d.ts +0 -82
  318. package/translatedLabelsType.js +0 -5
  319. package/typography/Typography.d.ts +0 -4
  320. package/typography/Typography.js +0 -119
  321. package/typography/Typography.stories.tsx +0 -198
  322. package/typography/types.d.ts +0 -18
  323. package/typography/types.js +0 -5
  324. package/useTheme.d.ts +0 -2
  325. package/useTheme.js +0 -16
  326. package/useTranslatedLabels.d.ts +0 -3
  327. package/useTranslatedLabels.js +0 -15
  328. package/wizard/Wizard.d.ts +0 -4
  329. package/wizard/Wizard.js +0 -251
  330. package/wizard/Wizard.stories.tsx +0 -253
  331. package/wizard/Wizard.test.js +0 -114
  332. package/wizard/types.d.ts +0 -65
  333. package/wizard/types.js +0 -5
@@ -1,648 +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 _dayjs = _interopRequireDefault(require("dayjs"));
12
- var _DateInput = _interopRequireDefault(require("./DateInput.tsx"));
13
- // Mocking DOMRect for Radix Primitive Popover
14
- global.globalThis = global;
15
- global.ResizeObserver = /*#__PURE__*/function () {
16
- function ResizeObserver(cb) {
17
- (0, _classCallCheck2["default"])(this, ResizeObserver);
18
- this.cb = cb;
19
- }
20
- (0, _createClass2["default"])(ResizeObserver, [{
21
- key: "observe",
22
- value: function observe() {
23
- this.cb([{
24
- borderBoxSize: {
25
- inlineSize: 0,
26
- blockSize: 0
27
- }
28
- }]);
29
- }
30
- }, {
31
- key: "unobserve",
32
- value: function unobserve() {}
33
- }]);
34
- return ResizeObserver;
35
- }();
36
- global.DOMRect = {
37
- fromRect: function fromRect() {
38
- return {
39
- top: 0,
40
- left: 0,
41
- bottom: 0,
42
- right: 0,
43
- width: 0,
44
- height: 0
45
- };
46
- }
47
- };
48
- describe("DateInput component tests", function () {
49
- test("Renders with correct label, helper text, optional, placeholder and clearable action", function () {
50
- var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
51
- label: "Example label",
52
- helperText: "Example of helper text",
53
- placeholder: true,
54
- optional: true,
55
- clearable: true
56
- })),
57
- getByText = _render.getByText,
58
- getByRole = _render.getByRole,
59
- getAllByRole = _render.getAllByRole;
60
- var input = getByRole("textbox");
61
- expect(getByText("Example label")).toBeTruthy();
62
- expect(getByText("Example of helper text")).toBeTruthy();
63
- expect(getByText("(Optional)")).toBeTruthy();
64
- expect(input.getAttribute("placeholder")).toBe("DD-MM-YYYY");
65
- _userEvent["default"].type(input, "10/10/2010");
66
- var closeAction = getAllByRole("button")[0];
67
- _userEvent["default"].click(closeAction);
68
- expect(input.value).toBe("");
69
- });
70
- test("Renders with custom error", function () {
71
- var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
72
- error: "Personalized error."
73
- })),
74
- getByText = _render2.getByText;
75
- expect(getByText("Personalized error.")).toBeTruthy();
76
- });
77
- test("Renders with an initial value when it is uncontrolled", function () {
78
- var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
79
- label: "Default label",
80
- placeholder: "Placeholder",
81
- defaultValue: "21-10-2015"
82
- })),
83
- getByText = _render3.getByText,
84
- getByRole = _render3.getByRole;
85
- var input = getByRole("textbox");
86
- var calendarAction = getByRole("combobox");
87
- expect(input.value).toBe("21-10-2015");
88
- _userEvent["default"].click(calendarAction);
89
- expect(getByText("21").getAttribute("aria-selected")).toBe("true");
90
- expect(getByText("October 2015")).toBeTruthy();
91
- });
92
- test("Renders with correct format: user typed date but it's invalid, onBlur error", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
93
- var onBlur, _render4, getByRole, input;
94
- return _regenerator["default"].wrap(function _callee$(_context) {
95
- while (1) switch (_context.prev = _context.next) {
96
- case 0:
97
- onBlur = jest.fn(function (_ref2) {
98
- var value = _ref2.value,
99
- error = _ref2.error;
100
- expect(value).toBe("10/90/2010");
101
- expect(error).toBe("Invalid date.");
102
- });
103
- _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
104
- label: "With format MM/dd/yyyy",
105
- format: "MM/dd/yyyy",
106
- onBlur: onBlur
107
- })), getByRole = _render4.getByRole;
108
- input = getByRole("textbox");
109
- _userEvent["default"].click(input);
110
- _context.next = 6;
111
- return _userEvent["default"].keyboard("10");
112
- case 6:
113
- _context.next = 8;
114
- return _userEvent["default"].keyboard("/");
115
- case 8:
116
- _context.next = 10;
117
- return _userEvent["default"].keyboard("90");
118
- case 10:
119
- _context.next = 12;
120
- return _userEvent["default"].keyboard("/");
121
- case 12:
122
- _context.next = 14;
123
- return _userEvent["default"].keyboard("2010");
124
- case 14:
125
- _react2.fireEvent.blur(input);
126
- case 15:
127
- case "end":
128
- return _context.stop();
129
- }
130
- }, _callee);
131
- })));
132
- test("Renders with correct format: user typed date but it's invalid, onChange error", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
133
- var onChange, _render5, getByRole, input;
134
- return _regenerator["default"].wrap(function _callee2$(_context2) {
135
- while (1) switch (_context2.prev = _context2.next) {
136
- case 0:
137
- onChange = jest.fn();
138
- _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
139
- label: "With format MM/dd/yyyy",
140
- format: "MM/dd/yyyy",
141
- onChange: onChange
142
- })), getByRole = _render5.getByRole;
143
- input = getByRole("textbox");
144
- _userEvent["default"].click(input);
145
- _context2.next = 6;
146
- return _userEvent["default"].keyboard("10");
147
- case 6:
148
- _context2.next = 8;
149
- return _userEvent["default"].keyboard("/");
150
- case 8:
151
- _context2.next = 10;
152
- return _userEvent["default"].keyboard("90");
153
- case 10:
154
- _context2.next = 12;
155
- return _userEvent["default"].keyboard("/");
156
- case 12:
157
- _context2.next = 14;
158
- return _userEvent["default"].keyboard("2010");
159
- case 14:
160
- expect(onChange).toHaveBeenCalledTimes(10);
161
- expect(onChange).toHaveBeenCalledWith({
162
- value: "10/90/2010",
163
- error: "Invalid date."
164
- });
165
- case 16:
166
- case "end":
167
- return _context2.stop();
168
- }
169
- }, _callee2);
170
- })));
171
- test("Calendar renders with correct date: today's date", function () {
172
- var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], null)),
173
- getByText = _render6.getByText,
174
- getByRole = _render6.getByRole,
175
- getAllByText = _render6.getAllByText;
176
- var calendarAction = getByRole("combobox");
177
- var d = (0, _dayjs["default"])();
178
- _userEvent["default"].click(calendarAction);
179
- expect(document.activeElement === getAllByText(d.get("date")).length === 2 && +d.get("date") > 20 ? getAllByText(d.get("date"))[1] : getAllByText(d.get("date"))[0]).toBeTruthy();
180
- expect(getByText(d.format("MMMM YYYY"))).toBeTruthy();
181
- });
182
- test("Calendar renders with correct date: value prop", function () {
183
- var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
184
- value: "20-10-2019"
185
- })),
186
- getByText = _render7.getByText,
187
- getByRole = _render7.getByRole,
188
- getAllByText = _render7.getAllByText;
189
- var calendarAction = getByRole("combobox");
190
- var d = (0, _dayjs["default"])("2019-10-20");
191
- _userEvent["default"].click(calendarAction);
192
- expect(getAllByText(d.get("date"))[0].getAttribute("aria-selected")).toBe("true");
193
- expect(getByText(d.format("MMMM YYYY"))).toBeTruthy();
194
- });
195
- test("Calendar renders with correct date: user typed value", function () {
196
- var _render8 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], null)),
197
- getByText = _render8.getByText,
198
- getByRole = _render8.getByRole,
199
- getAllByText = _render8.getAllByText;
200
- var calendarAction = getByRole("combobox");
201
- var d = (0, _dayjs["default"])("2010-1-1");
202
- var input = getByRole("textbox");
203
- _userEvent["default"].type(input, "01-01-2010");
204
- _userEvent["default"].click(calendarAction);
205
- expect(getAllByText(d.get("date"))[0].getAttribute("aria-selected")).toBe("true");
206
- expect(getByText(d.format("MMMM YYYY"))).toBeTruthy();
207
- });
208
- test("Calendar renders with correct date: invalid date, renders with today's date", function () {
209
- var onBlur = jest.fn();
210
- var _render9 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
211
- onBlur: onBlur
212
- })),
213
- getByText = _render9.getByText,
214
- getByRole = _render9.getByRole,
215
- getAllByText = _render9.getAllByText;
216
- var calendarAction = getByRole("combobox");
217
- var d = (0, _dayjs["default"])();
218
- var input = getByRole("textbox");
219
- _userEvent["default"].type(input, "01-01-xxxx");
220
- _react2.fireEvent.blur(input);
221
- expect(onBlur).toHaveBeenCalled();
222
- expect(onBlur).toHaveBeenCalledWith({
223
- value: "01-01-xxxx",
224
- error: "Invalid date."
225
- });
226
- _userEvent["default"].click(calendarAction);
227
- expect(document.activeElement === getAllByText(d.get("date")).length === 2 && +d.get("date") > 20 ? getAllByText(d.get("date"))[1] : getAllByText(d.get("date"))[0]).toBeTruthy();
228
- expect(getByText(d.format("MMMM YYYY"))).toBeTruthy();
229
- });
230
- test("Selecting a date from the calendar with an specific format", function () {
231
- var _render10 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
232
- label: "With format M-dd-yyyy",
233
- format: "M-dd-yyyy"
234
- })),
235
- getAllByText = _render10.getAllByText,
236
- getByText = _render10.getByText,
237
- getByRole = _render10.getByRole;
238
- var input = getByRole("textbox");
239
- var calendarAction = getByRole("combobox");
240
- _userEvent["default"].click(calendarAction);
241
- var dayButton = getAllByText("10")[0].closest("button");
242
- _react2.fireEvent.click(dayButton);
243
- var d = (0, _dayjs["default"])();
244
- d = d.set("date", 10);
245
- expect(getAllByText(d.get("date"))[0].getAttribute("aria-selected")).toBe("true");
246
- expect(getByText(d.format("MMMM YYYY"))).toBeTruthy();
247
- _react2.fireEvent.keyDown(document, {
248
- key: "Escape",
249
- code: "Escape",
250
- keyCode: 27,
251
- charCode: 27
252
- });
253
- expect(input.value).toBe(d.format("M-DD-YYYY"));
254
- });
255
- test("Changing months using the arrows", function () {
256
- var _render11 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
257
- label: "label",
258
- format: "dd-mm-yyyy",
259
- defaultValue: "10-10-2000"
260
- })),
261
- getByText = _render11.getByText,
262
- getByRole = _render11.getByRole,
263
- getByTitle = _render11.getByTitle;
264
- var calendarAction = getByRole("combobox");
265
- _userEvent["default"].click(calendarAction);
266
- var d = (0, _dayjs["default"])("10-10-2000", "DD-MM-YYYY", true);
267
- d = d.set("date", 10);
268
- expect(getByText(d.format("MMMM YYYY"))).toBeTruthy();
269
- var previousMonth = getByTitle("Previous month");
270
- _userEvent["default"].click(previousMonth);
271
- expect(getByText(d.set("month", d.get("month") - 1).format("MMMM YYYY"))).toBeTruthy();
272
- var nextMonth = getByTitle("Next month");
273
- _userEvent["default"].click(nextMonth);
274
- expect(getByText(d.format("MMMM YYYY"))).toBeTruthy();
275
- });
276
- test("Selecting a date from the calendar from another month", function () {
277
- var _render12 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
278
- format: "dd-mm-yyyy",
279
- defaultValue: "10-08-2021"
280
- })),
281
- getAllByText = _render12.getAllByText,
282
- getByText = _render12.getByText,
283
- getByRole = _render12.getByRole;
284
- var input = getByRole("textbox");
285
- var calendarAction = getByRole("combobox");
286
- _userEvent["default"].click(calendarAction);
287
- var dayButton = getAllByText("31")[0].closest("button");
288
- _react2.fireEvent.click(dayButton);
289
- var d = (0, _dayjs["default"])("10-08-2021", "DD-MM-YYYY", true);
290
- d = d.set("date", 31).set("month", 6);
291
- expect(getAllByText(d.get("date"))[0].getAttribute("aria-selected")).toBe("true");
292
- expect(getByText(d.format("MMMM YYYY"))).toBeTruthy();
293
- _react2.fireEvent.keyDown(document, {
294
- key: "Escape",
295
- code: "Escape",
296
- keyCode: 27,
297
- charCode: 27
298
- });
299
- expect(input.value).toBe(d.format("DD-MM-YYYY"));
300
- });
301
- test("Selecting a year from the calendar year picker", function () {
302
- var _render13 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
303
- format: "dd-mm-yyyy",
304
- defaultValue: "10-08-2021"
305
- })),
306
- getByText = _render13.getByText,
307
- getByRole = _render13.getByRole;
308
- var input = getByRole("textbox");
309
- var calendarAction = getByRole("combobox");
310
- _userEvent["default"].click(calendarAction);
311
- var d = (0, _dayjs["default"])("10-08-2021", "DD-MM-YYYY", true);
312
- _userEvent["default"].click(getByText(d.format("MMMM YYYY")));
313
- expect(getByText("2024")).toBeTruthy();
314
- _userEvent["default"].click(getByText("2024"));
315
- _userEvent["default"].click(getByText(d.set("year", 2024).format("MMMM YYYY")));
316
- _react2.fireEvent.keyDown(document, {
317
- key: "Escape",
318
- code: "Escape",
319
- keyCode: 27,
320
- charCode: 27
321
- });
322
- expect(input.value).toBe(d.format("DD-MM-YYYY"));
323
- });
324
- test("Selecting a date from the calendar (using keyboard presses)", function () {
325
- var _render14 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], null)),
326
- getByRole = _render14.getByRole,
327
- getAllByText = _render14.getAllByText,
328
- getByText = _render14.getByText;
329
- var calendarAction = getByRole("combobox");
330
- var input = getByRole("textbox");
331
- _userEvent["default"].type(input, "01-01-2010");
332
- expect(input.value).toBe("01-01-2010");
333
- _userEvent["default"].click(calendarAction);
334
- expect(document.activeElement === getAllByText("1")[0].closest("button")).toBeTruthy();
335
- _react2.fireEvent.keyDown(getAllByText("1")[0].closest("button"), {
336
- key: "ArrowRight",
337
- code: "ArrowRight",
338
- keyCode: 39,
339
- charCode: 39
340
- });
341
- expect(document.activeElement === getAllByText("2")[0].closest("button")).toBeTruthy();
342
- _react2.fireEvent.keyDown(getAllByText("2")[0].closest("button"), {
343
- key: "PageUp",
344
- code: "PageUp",
345
- keyCode: 33,
346
- charCode: 33
347
- });
348
- expect(document.activeElement === getAllByText("2")[0].closest("button")).toBeTruthy();
349
- expect(getByText("December 2009")).toBeTruthy();
350
- _react2.fireEvent.keyDown(getAllByText("2")[0].closest("button"), {
351
- key: "PageDown",
352
- code: "PageDown",
353
- keyCode: 34,
354
- charCode: 34
355
- });
356
- expect(document.activeElement === getAllByText("2")[0].closest("button")).toBeTruthy();
357
- expect(getByText("January 2010")).toBeTruthy();
358
- _react2.fireEvent.keyDown(getAllByText("2")[0].closest("button"), {
359
- key: "PageDown",
360
- code: "PageDown",
361
- keyCode: 34,
362
- charCode: 34,
363
- shiftKey: true
364
- });
365
- expect(getByText("January 2011")).toBeTruthy();
366
- _react2.fireEvent.keyDown(getAllByText("2")[0].closest("button"), {
367
- key: "PageUp",
368
- code: "PageUp",
369
- keyCode: 33,
370
- charCode: 33,
371
- shiftKey: true
372
- });
373
- expect(getByText("January 2010")).toBeTruthy();
374
- expect(document.activeElement === getAllByText("2")[0].closest("button")).toBeTruthy();
375
- _react2.fireEvent.click(getAllByText("2")[0].closest("button"), {
376
- key: " ",
377
- code: "Space",
378
- keyCode: 32,
379
- charCode: 32
380
- });
381
- expect(getAllByText("2")[0].closest("button").getAttribute("aria-selected")).toBe("true");
382
- _react2.fireEvent.keyDown(document, {
383
- key: "Escape",
384
- code: "Escape",
385
- keyCode: 27,
386
- charCode: 27
387
- });
388
- expect(input.value).toBe("02-01-2010");
389
- });
390
- test("Selecting a date from the calendar (using keyboard presses) part II", function () {
391
- var _render15 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], null)),
392
- getByRole = _render15.getByRole,
393
- getAllByText = _render15.getAllByText;
394
- var calendarAction = getByRole("combobox");
395
- var input = getByRole("textbox");
396
- _userEvent["default"].type(input, "01-01-2010");
397
- expect(input.value).toBe("01-01-2010");
398
- _userEvent["default"].click(calendarAction);
399
- expect(document.activeElement === getAllByText("1")[0].closest("button")).toBeTruthy();
400
- _react2.fireEvent.keyDown(getAllByText("1")[0].closest("button"), {
401
- key: "ArrowDown",
402
- code: "ArrowDown",
403
- keyCode: 40,
404
- charCode: 40
405
- });
406
- expect(document.activeElement === getAllByText("8")[0].closest("button")).toBeTruthy();
407
- _react2.fireEvent.keyDown(getAllByText("8")[0].closest("button"), {
408
- key: "ArrowDown",
409
- code: "ArrowDown",
410
- keyCode: 40,
411
- charCode: 40
412
- });
413
- expect(document.activeElement === getAllByText("15")[0].closest("button")).toBeTruthy();
414
- _react2.fireEvent.keyDown(getAllByText("15")[0].closest("button"), {
415
- key: "ArrowUp",
416
- code: "ArrowUp",
417
- keyCode: 38,
418
- charCode: 38
419
- });
420
- expect(document.activeElement === getAllByText("8")[0].closest("button")).toBeTruthy();
421
- _react2.fireEvent.keyDown(getAllByText("8")[0].closest("button"), {
422
- key: "End",
423
- code: "End",
424
- keyCode: 35,
425
- charCode: 35
426
- });
427
- expect(document.activeElement === getAllByText("10")[0].closest("button")).toBeTruthy();
428
- _react2.fireEvent.keyDown(getAllByText("10")[0].closest("button"), {
429
- key: "Home",
430
- code: "Home",
431
- keyCode: 36,
432
- charCode: 36
433
- });
434
- _react2.fireEvent.keyDown(getAllByText("10")[0].closest("button"), {
435
- key: " ",
436
- code: "Space",
437
- keyCode: 32,
438
- charCode: 32
439
- });
440
- expect(input.value).toBe("10-01-2010");
441
- });
442
- test("onChange & onBlur functions are called correctly", function () {
443
- var onBlur = jest.fn();
444
- var onChange = jest.fn();
445
- var _render16 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
446
- onChange: onChange,
447
- onBlur: onBlur
448
- })),
449
- getByRole = _render16.getByRole;
450
- var input = getByRole("textbox");
451
- var d = new Date(2011, 9, 10);
452
- _userEvent["default"].type(input, "10-10-2011");
453
- expect(input.value).toBe("10-10-2011");
454
- expect(onChange).toHaveBeenCalledTimes(10);
455
- expect(onChange).toHaveBeenCalledWith({
456
- value: "10-10-2011",
457
- date: d
458
- });
459
- _react2.fireEvent.blur(input);
460
- expect(onBlur).toHaveBeenCalled();
461
- expect(onBlur).toHaveBeenCalledWith({
462
- value: "10-10-2011",
463
- date: d
464
- });
465
- });
466
- test("onChange & onBlur functions are called correctly, also with errors", function () {
467
- var onBlur = jest.fn();
468
- var onChange = jest.fn();
469
- var _render17 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
470
- onChange: onChange,
471
- onBlur: onBlur
472
- })),
473
- getByRole = _render17.getByRole;
474
- var input = getByRole("textbox");
475
- _userEvent["default"].type(input, "10-10-");
476
- expect(input.value).toBe("10-10-");
477
- expect(onChange).toHaveBeenCalledTimes(6);
478
- expect(onChange).toHaveBeenCalledWith({
479
- value: "10-10-",
480
- error: "Invalid date."
481
- });
482
- _react2.fireEvent.blur(input);
483
- expect(onBlur).toHaveBeenCalled();
484
- expect(onBlur).toHaveBeenCalledWith({
485
- value: "10-10-",
486
- error: "Invalid date."
487
- });
488
- });
489
- test("onBlur function removes the error when it is fixed", function () {
490
- var onBlur = jest.fn();
491
- var _render18 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
492
- onBlur: onBlur
493
- })),
494
- getByRole = _render18.getByRole;
495
- var input = getByRole("textbox");
496
- var d = new Date(2002, 1, 20);
497
- _userEvent["default"].type(input, "test");
498
- expect(input.value).toBe("test");
499
- _react2.fireEvent.blur(input);
500
- expect(onBlur).toHaveBeenCalled();
501
- expect(onBlur).toHaveBeenCalledWith({
502
- value: "test",
503
- error: "Invalid date."
504
- });
505
- _userEvent["default"].clear(input);
506
- _userEvent["default"].type(input, "20-02-2002");
507
- expect(input.value).toBe("20-02-2002");
508
- _react2.fireEvent.blur(input);
509
- expect(onBlur).toHaveBeenCalled();
510
- expect(onBlur).toHaveBeenCalledWith({
511
- value: "20-02-2002",
512
- date: d
513
- });
514
- });
515
- test("onBlur function removes the error when the input is empty", function () {
516
- var onBlur = jest.fn();
517
- var _render19 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
518
- onBlur: onBlur,
519
- optional: true
520
- })),
521
- getByRole = _render19.getByRole;
522
- var input = getByRole("textbox");
523
- _userEvent["default"].type(input, "test");
524
- expect(input.value).toBe("test");
525
- _react2.fireEvent.blur(input);
526
- expect(onBlur).toHaveBeenCalled();
527
- expect(onBlur).toHaveBeenCalledWith({
528
- value: "test",
529
- error: "Invalid date."
530
- });
531
- _userEvent["default"].clear(input);
532
- _react2.fireEvent.blur(input);
533
- expect(onBlur).toHaveBeenCalled();
534
- expect(onBlur).toHaveBeenCalledWith({
535
- value: ""
536
- });
537
- });
538
- test("onBlur & onChange functions error: required field (not optional)", function () {
539
- var onBlur = jest.fn();
540
- var onChange = jest.fn();
541
- var _render20 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
542
- onBlur: onBlur,
543
- onChange: onChange
544
- })),
545
- getByRole = _render20.getByRole;
546
- var date = getByRole("textbox");
547
- _userEvent["default"].type(date, "t");
548
- expect(date.value).toBe("t");
549
- _userEvent["default"].clear(date);
550
- _react2.fireEvent.blur(date);
551
- expect(onBlur).toHaveBeenCalled();
552
- expect(onBlur).toHaveBeenCalledWith({
553
- value: "",
554
- error: "This field is required. Please, enter a value."
555
- });
556
- expect(onChange).toHaveBeenCalled();
557
- expect(onChange).toHaveBeenCalledWith({
558
- value: "",
559
- error: "This field is required. Please, enter a value."
560
- });
561
- });
562
- test("Disabled date input (calendar action must be shown but not clickable)", function () {
563
- var _render21 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
564
- disabled: true
565
- })),
566
- getByRole = _render21.getByRole,
567
- queryByText = _render21.queryByText;
568
- var calendarAction = getByRole("button");
569
- var d = new Date();
570
- var options = {
571
- weekday: "short",
572
- month: "short",
573
- day: "numeric"
574
- };
575
- expect(getByRole("textbox").disabled).toBeTruthy();
576
- _userEvent["default"].click(calendarAction);
577
- expect(queryByText(d.toLocaleString("en-US", options))).toBeFalsy();
578
- });
579
- test("Input has correct accesibility attributes", function () {
580
- var _render22 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
581
- label: "Date input label"
582
- })),
583
- getByRole = _render22.getByRole;
584
- var input = getByRole("textbox");
585
- expect(input.getAttribute("aria-autocomplete")).toBeNull();
586
- expect(input.getAttribute("aria-controls")).toBeNull();
587
- expect(input.getAttribute("aria-expanded")).toBeNull();
588
- var calendarAction = getByRole("combobox");
589
- expect(calendarAction.getAttribute("aria-autocomplete")).toBeNull();
590
- expect(calendarAction.getAttribute("aria-controls")).toBeTruthy();
591
- expect(calendarAction.getAttribute("aria-describedby")).toBeTruthy();
592
- expect(calendarAction.getAttribute("aria-describedby") === calendarAction.getAttribute("aria-controls")).toBeTruthy();
593
- expect(calendarAction.getAttribute("aria-expanded")).toBe("false");
594
- _userEvent["default"].click(calendarAction);
595
- var datePicker = getByRole("dialog");
596
- expect(datePicker.getAttribute("aria-modal")).toBe("true");
597
- expect(calendarAction.getAttribute("aria-expanded")).toBe("true");
598
- expect(document.getElementById(calendarAction.getAttribute("aria-describedby"))).toBeTruthy();
599
- _react2.fireEvent.keyDown(document, {
600
- key: "Escape",
601
- code: "Escape",
602
- keyCode: 27,
603
- charCode: 27
604
- });
605
- expect(calendarAction.getAttribute("aria-expanded")).toBe("false");
606
- });
607
- test("Chooses the correct year when two digit format", function () {
608
- var _render23 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateInput["default"], {
609
- label: "Default label",
610
- placeholder: "Placeholder",
611
- format: "dd-mm-yy",
612
- defaultValue: "21-10-80"
613
- })),
614
- getByText = _render23.getByText,
615
- getByRole = _render23.getByRole,
616
- getAllByText = _render23.getAllByText;
617
- var input = getByRole("textbox");
618
- var calendarAction = getByRole("combobox");
619
- expect(input.value).toBe("21-10-80");
620
- _userEvent["default"].click(calendarAction);
621
- expect(getByText("21").getAttribute("aria-selected")).toBe("true");
622
- expect(getByText("October 1980")).toBeTruthy();
623
- _react2.fireEvent.keyDown(document, {
624
- key: "Escape",
625
- code: "Escape",
626
- keyCode: 27,
627
- charCode: 27
628
- });
629
- _react2.fireEvent.change(input, {
630
- target: {
631
- value: "21-10-10"
632
- }
633
- });
634
- _userEvent["default"].click(calendarAction);
635
- expect(getByText("October 1910")).toBeTruthy();
636
- _userEvent["default"].click(getByText("October 1910"));
637
- _userEvent["default"].click(getByText("2010"));
638
- _userEvent["default"].click(getAllByText("1")[0]);
639
- expect(input.value).toBe("01-10-10");
640
- _react2.fireEvent.change(input, {
641
- target: {
642
- value: "21-10-80"
643
- }
644
- });
645
- _userEvent["default"].click(calendarAction);
646
- expect(getByText("October 2080")).toBeTruthy();
647
- });
648
- });
@@ -1,4 +0,0 @@
1
- import React from "react";
2
- import { DatePickerPropsType } from "./types";
3
- declare const _default: React.MemoExoticComponent<({ date, onDateSelect, id }: DatePickerPropsType) => JSX.Element>;
4
- export default _default;