@dxc-technology/halstack-react 0.0.0-52b2977 → 0.0.0-52f9f99

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 (336) hide show
  1. package/README.md +46 -0
  2. package/dist/index.d.mts +6683 -0
  3. package/dist/index.d.ts +6683 -0
  4. package/dist/index.js +1 -0
  5. package/dist/index.mjs +1 -0
  6. package/package.json +65 -61
  7. package/BackgroundColorContext.d.ts +0 -10
  8. package/BackgroundColorContext.js +0 -47
  9. package/HalstackContext.d.ts +0 -1336
  10. package/HalstackContext.js +0 -335
  11. package/accordion/Accordion.d.ts +0 -4
  12. package/accordion/Accordion.js +0 -234
  13. package/accordion/Accordion.stories.tsx +0 -395
  14. package/accordion/Accordion.test.js +0 -71
  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 -149
  19. package/accordion-group/AccordionGroup.stories.tsx +0 -251
  20. package/accordion-group/AccordionGroup.test.js +0 -126
  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 -291
  25. package/alert/Alert.stories.tsx +0 -198
  26. package/alert/Alert.test.js +0 -92
  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 -61
  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 -51
  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 -114
  40. package/box/Box.stories.tsx +0 -147
  41. package/box/Box.test.js +0 -18
  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 -123
  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 -154
  51. package/button/Button.stories.tsx +0 -425
  52. package/button/Button.test.js +0 -35
  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 -160
  57. package/card/Card.stories.tsx +0 -200
  58. package/card/Card.test.js +0 -50
  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 -250
  64. package/checkbox/Checkbox.stories.tsx +0 -260
  65. package/checkbox/Checkbox.test.js +0 -155
  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 -153
  70. package/chip/Chip.stories.tsx +0 -206
  71. package/chip/Chip.test.js +0 -54
  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.d.ts +0 -1
  86. package/common/utils.js +0 -22
  87. package/common/variables.d.ts +0 -1625
  88. package/common/variables.js +0 -1504
  89. package/date-input/Calendar.d.ts +0 -4
  90. package/date-input/Calendar.js +0 -258
  91. package/date-input/DateInput.d.ts +0 -4
  92. package/date-input/DateInput.js +0 -269
  93. package/date-input/DateInput.stories.tsx +0 -304
  94. package/date-input/DateInput.test.js +0 -835
  95. package/date-input/DatePicker.d.ts +0 -4
  96. package/date-input/DatePicker.js +0 -146
  97. package/date-input/Icons.d.ts +0 -6
  98. package/date-input/Icons.js +0 -75
  99. package/date-input/YearPicker.d.ts +0 -4
  100. package/date-input/YearPicker.js +0 -126
  101. package/date-input/types.d.ts +0 -158
  102. package/date-input/types.js +0 -5
  103. package/dialog/Dialog.d.ts +0 -4
  104. package/dialog/Dialog.js +0 -149
  105. package/dialog/Dialog.stories.tsx +0 -319
  106. package/dialog/Dialog.test.js +0 -369
  107. package/dialog/types.d.ts +0 -44
  108. package/dialog/types.js +0 -5
  109. package/dropdown/Dropdown.d.ts +0 -4
  110. package/dropdown/Dropdown.js +0 -388
  111. package/dropdown/Dropdown.stories.tsx +0 -438
  112. package/dropdown/Dropdown.test.js +0 -586
  113. package/dropdown/DropdownMenu.d.ts +0 -4
  114. package/dropdown/DropdownMenu.js +0 -70
  115. package/dropdown/DropdownMenuItem.d.ts +0 -4
  116. package/dropdown/DropdownMenuItem.js +0 -79
  117. package/dropdown/types.d.ts +0 -100
  118. package/dropdown/types.js +0 -5
  119. package/file-input/FileInput.d.ts +0 -4
  120. package/file-input/FileInput.js +0 -547
  121. package/file-input/FileInput.stories.tsx +0 -618
  122. package/file-input/FileInput.test.js +0 -457
  123. package/file-input/FileItem.d.ts +0 -4
  124. package/file-input/FileItem.js +0 -162
  125. package/file-input/types.d.ts +0 -129
  126. package/file-input/types.js +0 -5
  127. package/flex/Flex.d.ts +0 -4
  128. package/flex/Flex.js +0 -69
  129. package/flex/Flex.stories.tsx +0 -103
  130. package/flex/types.d.ts +0 -32
  131. package/flex/types.js +0 -5
  132. package/footer/Footer.d.ts +0 -4
  133. package/footer/Footer.js +0 -183
  134. package/footer/Footer.stories.tsx +0 -228
  135. package/footer/Footer.test.js +0 -97
  136. package/footer/Icons.d.ts +0 -2
  137. package/footer/Icons.js +0 -77
  138. package/footer/types.d.ts +0 -66
  139. package/footer/types.js +0 -5
  140. package/header/Header.d.ts +0 -8
  141. package/header/Header.js +0 -303
  142. package/header/Header.stories.tsx +0 -315
  143. package/header/Header.test.js +0 -79
  144. package/header/Icons.d.ts +0 -2
  145. package/header/Icons.js +0 -34
  146. package/header/types.d.ts +0 -48
  147. package/header/types.js +0 -5
  148. package/heading/Heading.d.ts +0 -4
  149. package/heading/Heading.js +0 -159
  150. package/heading/Heading.stories.tsx +0 -54
  151. package/heading/Heading.test.js +0 -186
  152. package/heading/types.d.ts +0 -33
  153. package/heading/types.js +0 -5
  154. package/inset/Inset.d.ts +0 -3
  155. package/inset/Inset.js +0 -51
  156. package/inset/Inset.stories.tsx +0 -229
  157. package/inset/types.d.ts +0 -37
  158. package/inset/types.js +0 -5
  159. package/layout/ApplicationLayout.d.ts +0 -20
  160. package/layout/ApplicationLayout.js +0 -171
  161. package/layout/ApplicationLayout.stories.tsx +0 -162
  162. package/layout/Icons.d.ts +0 -5
  163. package/layout/Icons.js +0 -66
  164. package/layout/SidenavContext.d.ts +0 -5
  165. package/layout/SidenavContext.js +0 -19
  166. package/layout/types.d.ts +0 -42
  167. package/layout/types.js +0 -5
  168. package/link/Link.d.ts +0 -4
  169. package/link/Link.js +0 -136
  170. package/link/Link.stories.tsx +0 -253
  171. package/link/Link.test.js +0 -81
  172. package/link/types.d.ts +0 -54
  173. package/link/types.js +0 -5
  174. package/main.d.ts +0 -44
  175. package/main.js +0 -369
  176. package/nav-tabs/NavTabs.d.ts +0 -8
  177. package/nav-tabs/NavTabs.js +0 -125
  178. package/nav-tabs/NavTabs.stories.tsx +0 -260
  179. package/nav-tabs/NavTabs.test.js +0 -82
  180. package/nav-tabs/Tab.d.ts +0 -4
  181. package/nav-tabs/Tab.js +0 -150
  182. package/nav-tabs/types.d.ts +0 -53
  183. package/nav-tabs/types.js +0 -5
  184. package/number-input/NumberInput.d.ts +0 -4
  185. package/number-input/NumberInput.js +0 -76
  186. package/number-input/NumberInput.stories.tsx +0 -115
  187. package/number-input/NumberInput.test.js +0 -542
  188. package/number-input/NumberInputContext.d.ts +0 -4
  189. package/number-input/NumberInputContext.js +0 -19
  190. package/number-input/numberInputContextTypes.d.ts +0 -19
  191. package/number-input/numberInputContextTypes.js +0 -5
  192. package/number-input/types.d.ts +0 -124
  193. package/number-input/types.js +0 -5
  194. package/paginator/Icons.d.ts +0 -5
  195. package/paginator/Icons.js +0 -54
  196. package/paginator/Paginator.d.ts +0 -4
  197. package/paginator/Paginator.js +0 -163
  198. package/paginator/Paginator.stories.tsx +0 -87
  199. package/paginator/Paginator.test.js +0 -305
  200. package/paginator/types.d.ts +0 -38
  201. package/paginator/types.js +0 -5
  202. package/paragraph/Paragraph.d.ts +0 -5
  203. package/paragraph/Paragraph.js +0 -38
  204. package/paragraph/Paragraph.stories.tsx +0 -44
  205. package/password-input/PasswordInput.d.ts +0 -4
  206. package/password-input/PasswordInput.js +0 -166
  207. package/password-input/PasswordInput.stories.tsx +0 -131
  208. package/password-input/PasswordInput.test.js +0 -181
  209. package/password-input/types.d.ts +0 -110
  210. package/password-input/types.js +0 -5
  211. package/progress-bar/ProgressBar.d.ts +0 -4
  212. package/progress-bar/ProgressBar.js +0 -176
  213. package/progress-bar/ProgressBar.stories.jsx +0 -93
  214. package/progress-bar/ProgressBar.test.js +0 -110
  215. package/progress-bar/types.d.ts +0 -37
  216. package/progress-bar/types.js +0 -5
  217. package/quick-nav/QuickNav.d.ts +0 -4
  218. package/quick-nav/QuickNav.js +0 -117
  219. package/quick-nav/QuickNav.stories.tsx +0 -356
  220. package/quick-nav/types.d.ts +0 -21
  221. package/quick-nav/types.js +0 -5
  222. package/radio-group/Radio.d.ts +0 -4
  223. package/radio-group/Radio.js +0 -156
  224. package/radio-group/RadioGroup.d.ts +0 -4
  225. package/radio-group/RadioGroup.js +0 -283
  226. package/radio-group/RadioGroup.stories.tsx +0 -214
  227. package/radio-group/RadioGroup.test.js +0 -722
  228. package/radio-group/types.d.ts +0 -114
  229. package/radio-group/types.js +0 -5
  230. package/resultsetTable/Icons.d.ts +0 -7
  231. package/resultsetTable/Icons.js +0 -51
  232. package/resultsetTable/ResultsetTable.d.ts +0 -4
  233. package/resultsetTable/ResultsetTable.js +0 -195
  234. package/resultsetTable/ResultsetTable.stories.tsx +0 -300
  235. package/resultsetTable/ResultsetTable.test.js +0 -325
  236. package/resultsetTable/types.d.ts +0 -67
  237. package/resultsetTable/types.js +0 -5
  238. package/select/Icons.d.ts +0 -10
  239. package/select/Icons.js +0 -93
  240. package/select/Listbox.d.ts +0 -4
  241. package/select/Listbox.js +0 -169
  242. package/select/Option.d.ts +0 -4
  243. package/select/Option.js +0 -97
  244. package/select/Select.d.ts +0 -4
  245. package/select/Select.js +0 -666
  246. package/select/Select.stories.tsx +0 -971
  247. package/select/Select.test.js +0 -2228
  248. package/select/types.d.ts +0 -210
  249. package/select/types.js +0 -5
  250. package/sidenav/Sidenav.d.ts +0 -10
  251. package/sidenav/Sidenav.js +0 -266
  252. package/sidenav/Sidenav.stories.tsx +0 -282
  253. package/sidenav/Sidenav.test.js +0 -44
  254. package/sidenav/types.d.ts +0 -73
  255. package/sidenav/types.js +0 -5
  256. package/slider/Slider.d.ts +0 -4
  257. package/slider/Slider.js +0 -342
  258. package/slider/Slider.stories.tsx +0 -240
  259. package/slider/Slider.test.js +0 -250
  260. package/slider/types.d.ts +0 -86
  261. package/slider/types.js +0 -5
  262. package/spinner/Spinner.d.ts +0 -4
  263. package/spinner/Spinner.js +0 -244
  264. package/spinner/Spinner.stories.jsx +0 -129
  265. package/spinner/Spinner.test.js +0 -64
  266. package/spinner/types.d.ts +0 -32
  267. package/spinner/types.js +0 -5
  268. package/switch/Switch.d.ts +0 -4
  269. package/switch/Switch.js +0 -262
  270. package/switch/Switch.stories.tsx +0 -171
  271. package/switch/Switch.test.js +0 -225
  272. package/switch/types.d.ts +0 -66
  273. package/switch/types.js +0 -5
  274. package/table/Table.d.ts +0 -4
  275. package/table/Table.js +0 -118
  276. package/table/Table.stories.jsx +0 -356
  277. package/table/Table.test.js +0 -26
  278. package/table/types.d.ts +0 -21
  279. package/table/types.js +0 -5
  280. package/tabs/Tab.d.ts +0 -4
  281. package/tabs/Tab.js +0 -133
  282. package/tabs/Tabs.d.ts +0 -4
  283. package/tabs/Tabs.js +0 -465
  284. package/tabs/Tabs.stories.tsx +0 -226
  285. package/tabs/Tabs.test.js +0 -350
  286. package/tabs/types.d.ts +0 -92
  287. package/tabs/types.js +0 -5
  288. package/tag/Tag.d.ts +0 -4
  289. package/tag/Tag.js +0 -181
  290. package/tag/Tag.stories.tsx +0 -155
  291. package/tag/Tag.test.js +0 -60
  292. package/tag/types.d.ts +0 -69
  293. package/tag/types.js +0 -5
  294. package/text-input/Icons.d.ts +0 -8
  295. package/text-input/Icons.js +0 -60
  296. package/text-input/Suggestion.d.ts +0 -4
  297. package/text-input/Suggestion.js +0 -84
  298. package/text-input/Suggestions.d.ts +0 -4
  299. package/text-input/Suggestions.js +0 -134
  300. package/text-input/TextInput.d.ts +0 -4
  301. package/text-input/TextInput.js +0 -673
  302. package/text-input/TextInput.stories.tsx +0 -569
  303. package/text-input/TextInput.test.js +0 -1723
  304. package/text-input/types.d.ts +0 -197
  305. package/text-input/types.js +0 -5
  306. package/textarea/Textarea.d.ts +0 -4
  307. package/textarea/Textarea.js +0 -277
  308. package/textarea/Textarea.stories.jsx +0 -216
  309. package/textarea/Textarea.test.js +0 -437
  310. package/textarea/types.d.ts +0 -137
  311. package/textarea/types.js +0 -5
  312. package/toggle-group/ToggleGroup.d.ts +0 -4
  313. package/toggle-group/ToggleGroup.js +0 -218
  314. package/toggle-group/ToggleGroup.stories.tsx +0 -215
  315. package/toggle-group/ToggleGroup.test.js +0 -156
  316. package/toggle-group/types.d.ts +0 -105
  317. package/toggle-group/types.js +0 -5
  318. package/typography/Typography.d.ts +0 -4
  319. package/typography/Typography.js +0 -32
  320. package/typography/Typography.stories.tsx +0 -198
  321. package/typography/types.d.ts +0 -18
  322. package/typography/types.js +0 -5
  323. package/useTheme.d.ts +0 -1235
  324. package/useTheme.js +0 -22
  325. package/useTranslatedLabels.d.ts +0 -85
  326. package/useTranslatedLabels.js +0 -20
  327. package/utils/BaseTypography.d.ts +0 -21
  328. package/utils/BaseTypography.js +0 -108
  329. package/utils/FocusLock.d.ts +0 -13
  330. package/utils/FocusLock.js +0 -139
  331. package/wizard/Wizard.d.ts +0 -4
  332. package/wizard/Wizard.js +0 -285
  333. package/wizard/Wizard.stories.tsx +0 -253
  334. package/wizard/Wizard.test.js +0 -141
  335. package/wizard/types.d.ts +0 -64
  336. package/wizard/types.js +0 -5
@@ -1,4 +0,0 @@
1
- import React from "react";
2
- import { CalendarPropsType } from "./types";
3
- declare const _default: React.MemoExoticComponent<({ selectedDate, innerDate, onInnerDateChange, onDaySelect, today, }: CalendarPropsType) => JSX.Element>;
4
- export default _default;
@@ -1,258 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _typeof = require("@babel/runtime/helpers/typeof");
6
-
7
- Object.defineProperty(exports, "__esModule", {
8
- value: true
9
- });
10
- exports["default"] = void 0;
11
-
12
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
13
-
14
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
15
-
16
- var _react = _interopRequireWildcard(require("react"));
17
-
18
- var _styledComponents = _interopRequireDefault(require("styled-components"));
19
-
20
- var _useTranslatedLabels = _interopRequireDefault(require("../useTranslatedLabels"));
21
-
22
- var _main = require("../main");
23
-
24
- var _templateObject, _templateObject2, _templateObject3, _templateObject4;
25
-
26
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
27
-
28
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
29
-
30
- var getDays = function getDays(innerDate) {
31
- var monthDayCells = [];
32
- var lastMonthNumberOfDays = innerDate.set("month", innerDate.get("month") - 1).endOf("month");
33
- var firstDayOfMonth = innerDate.startOf("month").day() === 0 ? 6 : innerDate.startOf("month").day() - 1;
34
- var daysInMonth = firstDayOfMonth + innerDate.daysInMonth();
35
-
36
- for (var i = 0; i < 42; i++) {
37
- if (i < firstDayOfMonth) {
38
- monthDayCells.push({
39
- day: lastMonthNumberOfDays.get("date") - firstDayOfMonth + i + 1,
40
- month: innerDate.get("month") ? innerDate.get("month") - 1 : 11,
41
- year: innerDate.set("month", innerDate.get("month") - 1).get("year")
42
- });
43
- } else if (i < daysInMonth) {
44
- monthDayCells.push({
45
- day: i - firstDayOfMonth + 1,
46
- month: innerDate.get("month"),
47
- year: innerDate.get("year")
48
- });
49
- } else {
50
- monthDayCells.push({
51
- day: i - daysInMonth + 1,
52
- month: innerDate.get("month") === 11 ? 0 : innerDate.get("month") + 1,
53
- year: innerDate.set("month", innerDate.get("month") + 1).get("year")
54
- });
55
- }
56
- }
57
-
58
- return monthDayCells;
59
- };
60
-
61
- var getDateToFocus = function getDateToFocus(selectedDate, innerDate, today) {
62
- return (selectedDate === null || selectedDate === void 0 ? void 0 : selectedDate.get("month")) === innerDate.get("month") && (selectedDate === null || selectedDate === void 0 ? void 0 : selectedDate.get("year")) === innerDate.get("year") ? selectedDate : today.get("month") === innerDate.get("month") && today.get("year") === innerDate.get("year") ? today : innerDate.set("date", 1);
63
- };
64
-
65
- var isDaySelected = function isDaySelected(date, selectedDate) {
66
- return (selectedDate === null || selectedDate === void 0 ? void 0 : selectedDate.get("month")) === date.month && (selectedDate === null || selectedDate === void 0 ? void 0 : selectedDate.get("year")) === date.year && (selectedDate === null || selectedDate === void 0 ? void 0 : selectedDate.get("date")) === date.day;
67
- };
68
-
69
- var Calendar = function Calendar(_ref) {
70
- var selectedDate = _ref.selectedDate,
71
- innerDate = _ref.innerDate,
72
- onInnerDateChange = _ref.onInnerDateChange,
73
- onDaySelect = _ref.onDaySelect,
74
- today = _ref.today;
75
-
76
- var _useState = (0, _react.useState)(getDateToFocus(selectedDate, innerDate, today)),
77
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
78
- dateToFocus = _useState2[0],
79
- setDateToFocus = _useState2[1];
80
-
81
- var _useState3 = (0, _react.useState)(false),
82
- _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
83
- isFocusable = _useState4[0],
84
- setIsFocusable = _useState4[1];
85
-
86
- var dayCells = (0, _react.useMemo)(function () {
87
- return getDays(innerDate);
88
- }, [innerDate]);
89
- var translatedLabels = (0, _useTranslatedLabels["default"])();
90
- var weekDays = translatedLabels.calendar.daysShort;
91
-
92
- var onDateClickHandler = function onDateClickHandler(date) {
93
- var newDate = innerDate.set("month", date.month).set("date", date.day);
94
- onDaySelect(newDate);
95
- setDateToFocus(newDate);
96
- };
97
-
98
- var handleOnBlur = function handleOnBlur(event) {
99
- if (!(event !== null && event !== void 0 && event.currentTarget.contains(event.relatedTarget))) {
100
- setDateToFocus(getDateToFocus(selectedDate, innerDate, today));
101
- }
102
- };
103
-
104
- var focusDate = function focusDate(date) {
105
- if (innerDate.get("month") !== date.get("month") || innerDate.get("year") !== date.get("year")) {
106
- onInnerDateChange(date);
107
- }
108
-
109
- setDateToFocus(date);
110
- setIsFocusable(true);
111
- };
112
-
113
- (0, _react.useEffect)(function () {
114
- if (isFocusable) {
115
- var _document$getElementB;
116
-
117
- (_document$getElementB = document.getElementById("day_".concat(dateToFocus.get("date"), "_month").concat(dateToFocus.get("month")))) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.focus();
118
- setIsFocusable(false);
119
- }
120
- }, [dateToFocus, isFocusable]);
121
- (0, _react.useEffect)(function () {
122
- if (dateToFocus.get("month") !== innerDate.get("month") || dateToFocus.get("year") !== innerDate.get("year")) {
123
- setDateToFocus(getDateToFocus(selectedDate, innerDate, today));
124
- }
125
- }, [innerDate, dateToFocus, selectedDate, today]);
126
-
127
- var handleDayKeyboardEvent = function handleDayKeyboardEvent(event, date) {
128
- var dateToFocusTemp = date.month === innerDate.get("month") ? innerDate.set("date", date.day) : innerDate.set("date", date.day).set("month", date.month);
129
-
130
- switch (event.key) {
131
- case "PageUp":
132
- event.preventDefault();
133
- event.shiftKey ? dateToFocusTemp = dateToFocusTemp.set("year", dateToFocusTemp.get("year") - 1) : dateToFocusTemp = dateToFocusTemp.set("month", dateToFocusTemp.get("month") - 1);
134
- focusDate(dateToFocusTemp);
135
- break;
136
-
137
- case "PageDown":
138
- event.preventDefault();
139
- event.shiftKey ? dateToFocusTemp = dateToFocusTemp.set("year", dateToFocusTemp.get("year") + 1) : dateToFocusTemp = dateToFocusTemp.set("month", dateToFocusTemp.get("month") + 1);
140
- focusDate(dateToFocusTemp);
141
- break;
142
-
143
- case "ArrowLeft":
144
- event.preventDefault();
145
- dateToFocusTemp = dateToFocusTemp.set("date", dateToFocusTemp.get("date") - 1);
146
- focusDate(dateToFocusTemp);
147
- break;
148
-
149
- case "ArrowRight":
150
- event.preventDefault();
151
- dateToFocusTemp = dateToFocusTemp.set("date", dateToFocusTemp.get("date") + 1);
152
- focusDate(dateToFocusTemp);
153
- break;
154
-
155
- case "ArrowUp":
156
- event.preventDefault();
157
- dateToFocusTemp = dateToFocusTemp.set("date", dateToFocusTemp.get("date") - 7);
158
- focusDate(dateToFocusTemp);
159
- break;
160
-
161
- case "ArrowDown":
162
- event.preventDefault();
163
- dateToFocusTemp = dateToFocusTemp.set("date", dateToFocusTemp.get("date") + 7);
164
- focusDate(dateToFocusTemp);
165
- break;
166
-
167
- case "Home":
168
- event.preventDefault();
169
- dateToFocus.get("day") !== 0 ? dateToFocusTemp = dateToFocusTemp.day(1) : dateToFocusTemp = innerDate.date(date.day - 1).day(1);
170
- focusDate(dateToFocusTemp);
171
- break;
172
-
173
- case "End":
174
- event.preventDefault();
175
- dateToFocusTemp.get("day") !== 0 && (dateToFocusTemp = dateToFocusTemp.day(7));
176
- focusDate(dateToFocusTemp);
177
- break;
178
-
179
- case " ":
180
- event.preventDefault();
181
- onDaySelect(dateToFocusTemp);
182
- break;
183
- }
184
- };
185
-
186
- return /*#__PURE__*/_react["default"].createElement(CalendarContainer, null, /*#__PURE__*/_react["default"].createElement(_main.DxcFlex, {
187
- alignItems: "center",
188
- justifyContent: "space-between"
189
- }, weekDays.map(function (weekDay) {
190
- return /*#__PURE__*/_react["default"].createElement(WeekHeaderCell, {
191
- key: weekDay
192
- }, weekDay);
193
- })), /*#__PURE__*/_react["default"].createElement(DayCellsContainer, {
194
- onBlur: handleOnBlur
195
- }, dayCells.map(function (date, index) {
196
- return /*#__PURE__*/_react["default"].createElement(DayCell, {
197
- onKeyDown: function onKeyDown(event) {
198
- return handleDayKeyboardEvent(event, date);
199
- },
200
- "aria-label": date.day,
201
- id: "day_".concat(date.day, "_month").concat(date.month),
202
- key: "day_".concat(index),
203
- onClick: function onClick() {
204
- return onDateClickHandler(date);
205
- },
206
- selected: isDaySelected(date, selectedDate),
207
- actualMonth: date.month === innerDate.get("month"),
208
- autoFocus: date.day === dateToFocus.get("date") && date.month === dateToFocus.get("month"),
209
- "aria-selected": isDaySelected(date, selectedDate),
210
- tabIndex: date.day === dateToFocus.get("date") && date.month === dateToFocus.get("month") ? 0 : -1,
211
- isCurrentDay: today.get("date") === date.day && today.get("month") === innerDate.get("month") && today.get("month") === date.month && today.get("year") === innerDate.get("year")
212
- }, date.day);
213
- })));
214
- };
215
-
216
- var CalendarContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n justify-content: center;\n padding: 0px 8px 8px 8px;\n width: 292px;\n font-family: ", ";\n font-size: ", ";\n color: ", ";\n font-weight: ", ";\n"])), function (props) {
217
- return props.theme.dateInput.pickerFontFamily;
218
- }, function (props) {
219
- return props.theme.dateInput.pickerFontSize;
220
- }, function (props) {
221
- return props.theme.dateInput.pickerFontColor;
222
- }, function (props) {
223
- return props.theme.dateInput.pickerFontWeight;
224
- });
225
-
226
- var WeekHeaderCell = _styledComponents["default"].span(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n align-items: center;\n justify-content: center;\n width: 36px;\n height: 36px;\n"])));
227
-
228
- var DayCellsContainer = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n box-sizing: border-box;\n display: flex;\n gap: 4px;\n flex-wrap: wrap;\n justify-content: space-between;\n"])));
229
-
230
- var DayCell = _styledComponents["default"].button(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n display: inline-flex;\n justify-content: center;\n align-items: center;\n width: 36px;\n height: 36px;\n padding: 0;\n border: none;\n border-radius: 50%;\n cursor: pointer;\n font-family: ", ";\n font-size: ", ";\n color: ", ";\n font-weight: ", ";\n\n &:focus {\n outline: ", " solid 2px;\n }\n &:hover {\n background-color: ", ";\n color: ", ";\n }\n &:active {\n background-color: ", ";\n color: ", ";\n }\n\n ", "\n background-color: ", ";\n color: ", ";\n"])), function (props) {
231
- return props.theme.dateInput.pickerFontFamily;
232
- }, function (props) {
233
- return props.theme.dateInput.pickerFontSize;
234
- }, function (props) {
235
- return props.theme.dateInput.pickerFontColor;
236
- }, function (props) {
237
- return props.theme.dateInput.pickerFontWeight;
238
- }, function (props) {
239
- return props.theme.dateInput.pickerFocusColor;
240
- }, function (props) {
241
- return props.selected ? props.theme.dateInput.pickerSelectedBackgroundColor : props.theme.dateInput.pickerHoverBackgroundColor;
242
- }, function (props) {
243
- return props.selected ? props.theme.dateInput.pickerSelectedFontColor : props.theme.dateInput.pickerHoverFontColor;
244
- }, function (props) {
245
- return props.theme.dateInput.pickerActiveBackgroundColor;
246
- }, function (props) {
247
- return props.theme.dateInput.pickerActiveFontColor;
248
- }, function (props) {
249
- return props.isCurrentDay && !props.selected && "border: ".concat(props.theme.dateInput.pickerCurrentDateBorderWidth, " solid ").concat(props.theme.dateInput.pickerCurrentDateBorderColor, ";");
250
- }, function (props) {
251
- return props.selected ? props.theme.dateInput.pickerSelectedBackgroundColor : "transparent";
252
- }, function (props) {
253
- return props.selected ? props.theme.dateInput.pickerSelectedFontColor : props.isCurrentDay ? props.theme.dateInput.pickerCurrentDateFontColor : !props.actualMonth ? props.theme.dateInput.pickerNonCurrentMonthFontColor : props.theme.dateInput.pickerFontColor;
254
- });
255
-
256
- var _default = /*#__PURE__*/_react["default"].memo(Calendar);
257
-
258
- exports["default"] = _default;
@@ -1,4 +0,0 @@
1
- import React from "react";
2
- import DateInputPropsType from "./types";
3
- declare const DxcDateInput: React.ForwardRefExoticComponent<DateInputPropsType & React.RefAttributes<HTMLDivElement>>;
4
- export default DxcDateInput;
@@ -1,269 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _typeof = require("@babel/runtime/helpers/typeof");
6
-
7
- Object.defineProperty(exports, "__esModule", {
8
- value: true
9
- });
10
- exports["default"] = void 0;
11
-
12
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
13
-
14
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
15
-
16
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
17
-
18
- var _react = _interopRequireWildcard(require("react"));
19
-
20
- var _dayjs = _interopRequireDefault(require("dayjs"));
21
-
22
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
23
-
24
- var _useTheme = _interopRequireDefault(require("../useTheme"));
25
-
26
- var _useTranslatedLabels = _interopRequireDefault(require("../useTranslatedLabels"));
27
-
28
- var _TextInput = _interopRequireDefault(require("../text-input/TextInput"));
29
-
30
- var _DatePicker = _interopRequireDefault(require("./DatePicker"));
31
-
32
- var Popover = _interopRequireWildcard(require("@radix-ui/react-popover"));
33
-
34
- var _customParseFormat = _interopRequireDefault(require("dayjs/plugin/customParseFormat"));
35
-
36
- var _uuid = require("uuid");
37
-
38
- var _Icons = require("./Icons");
39
-
40
- var _templateObject;
41
-
42
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
43
-
44
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
45
-
46
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
47
-
48
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
49
-
50
- _dayjs["default"].extend(_customParseFormat["default"]);
51
-
52
- var getValueForPicker = function getValueForPicker(value, format) {
53
- return (0, _dayjs["default"])(value, format.toUpperCase(), true);
54
- };
55
-
56
- var getDate = function getDate(value, format, lastValidYear, setLastValidYear) {
57
- if ((value || value === "") && format.toUpperCase().includes("YYYY")) return getValueForPicker(value, format);else {
58
- var newDate = getValueForPicker(value, format);
59
-
60
- if (!lastValidYear) {
61
- if (+newDate.format("YY") < 68) {
62
- setLastValidYear(2000 + +newDate.format("YY"));
63
- newDate = newDate.set("year", 2000 + +newDate.format("YY"));
64
- } else {
65
- setLastValidYear(1900 + +newDate.format("YY"));
66
- newDate = newDate.set("year", 1900 + +newDate.format("YY"));
67
- }
68
- } else {
69
- newDate = newDate.set("year", (lastValidYear <= 1999 ? 1900 : 2000) + +newDate.format("YY"));
70
- }
71
-
72
- return newDate;
73
- }
74
- };
75
-
76
- var DxcDateInput = /*#__PURE__*/_react["default"].forwardRef(function (_ref, ref) {
77
- var _ref2;
78
-
79
- var label = _ref.label,
80
- name = _ref.name,
81
- _ref$defaultValue = _ref.defaultValue,
82
- defaultValue = _ref$defaultValue === void 0 ? "" : _ref$defaultValue,
83
- value = _ref.value,
84
- _ref$format = _ref.format,
85
- format = _ref$format === void 0 ? "dd-MM-yyyy" : _ref$format,
86
- helperText = _ref.helperText,
87
- _ref$placeholder = _ref.placeholder,
88
- placeholder = _ref$placeholder === void 0 ? false : _ref$placeholder,
89
- clearable = _ref.clearable,
90
- disabled = _ref.disabled,
91
- optional = _ref.optional,
92
- onChange = _ref.onChange,
93
- onBlur = _ref.onBlur,
94
- error = _ref.error,
95
- autocomplete = _ref.autocomplete,
96
- margin = _ref.margin,
97
- size = _ref.size,
98
- tabIndex = _ref.tabIndex;
99
-
100
- var _useState = (0, _react.useState)(defaultValue),
101
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
102
- innerValue = _useState2[0],
103
- setInnerValue = _useState2[1];
104
-
105
- var _useState3 = (0, _react.useState)(false),
106
- _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
107
- isOpen = _useState4[0],
108
- setIsOpen = _useState4[1];
109
-
110
- var _useState5 = (0, _react.useState)("date-picker-".concat((0, _uuid.v4)())),
111
- _useState6 = (0, _slicedToArray2["default"])(_useState5, 1),
112
- calendarId = _useState6[0];
113
-
114
- var _useState7 = (0, _react.useState)(getValueForPicker((_ref2 = value !== null && value !== void 0 ? value : defaultValue) !== null && _ref2 !== void 0 ? _ref2 : "", format)),
115
- _useState8 = (0, _slicedToArray2["default"])(_useState7, 2),
116
- dayjsDate = _useState8[0],
117
- setDayjsDate = _useState8[1];
118
-
119
- var _useState9 = (0, _react.useState)(innerValue || value ? !format.toUpperCase().includes("YYYY") && +getValueForPicker(value !== null && value !== void 0 ? value : innerValue, format).format("YY") < 68 ? 2000 : 1900 : undefined),
120
- _useState10 = (0, _slicedToArray2["default"])(_useState9, 2),
121
- lastValidYear = _useState10[0],
122
- setLastValidYear = _useState10[1];
123
-
124
- var colorsTheme = (0, _useTheme["default"])();
125
- var translatedLabels = (0, _useTranslatedLabels["default"])();
126
- var dateRef = (0, _react.useRef)(null);
127
- (0, _react.useEffect)(function () {
128
- if (value || value === "") setDayjsDate(getDate(value, format, lastValidYear, setLastValidYear));
129
- }, [value, format, lastValidYear]);
130
- (0, _react.useLayoutEffect)(function () {
131
- if (!disabled) {
132
- var actionButtonRef = dateRef === null || dateRef === void 0 ? void 0 : dateRef.current.querySelector("[title='Open calendar']");
133
- actionButtonRef === null || actionButtonRef === void 0 ? void 0 : actionButtonRef.setAttribute("aria-haspopup", true);
134
- actionButtonRef === null || actionButtonRef === void 0 ? void 0 : actionButtonRef.setAttribute("role", "combobox");
135
- actionButtonRef === null || actionButtonRef === void 0 ? void 0 : actionButtonRef.setAttribute("aria-expanded", isOpen);
136
- actionButtonRef === null || actionButtonRef === void 0 ? void 0 : actionButtonRef.setAttribute("aria-controls", calendarId);
137
- actionButtonRef === null || actionButtonRef === void 0 ? void 0 : actionButtonRef.setAttribute("aria-describedby", calendarId);
138
- }
139
- }, [isOpen, disabled, calendarId]);
140
-
141
- var handleCalendarOnClick = function handleCalendarOnClick(newDate) {
142
- var newValue = newDate.format(format.toUpperCase());
143
-
144
- if (!value) {
145
- setDayjsDate(newDate);
146
- setInnerValue(newValue);
147
- }
148
-
149
- setLastValidYear(newDate.get("year"));
150
- newDate !== null && newDate !== void 0 && newDate.set("day", newDate.get("date")).toJSON() ? onChange === null || onChange === void 0 ? void 0 : onChange({
151
- value: newValue,
152
- date: newDate.toDate()
153
- }) : onChange === null || onChange === void 0 ? void 0 : onChange({
154
- value: newValue
155
- });
156
- };
157
-
158
- var handleIOnChange = function handleIOnChange(_ref3) {
159
- var newValue = _ref3.value,
160
- inputError = _ref3.error;
161
- value !== null && value !== void 0 ? value : setInnerValue(newValue);
162
- var newDate = getDate(newValue, format, lastValidYear, setLastValidYear);
163
- var invalidDateMessage = newValue !== "" && !newDate.isValid() && translatedLabels.dateInput.invalidDateErrorMessage;
164
- var callbackParams = inputError || invalidDateMessage ? {
165
- value: newValue,
166
- error: inputError || invalidDateMessage
167
- } : {
168
- value: newValue
169
- };
170
-
171
- if (newDate.isValid()) {
172
- setDayjsDate(newDate);
173
- onChange === null || onChange === void 0 ? void 0 : onChange(_objectSpread(_objectSpread({}, callbackParams), {}, {
174
- date: newDate.toDate()
175
- }));
176
- } else {
177
- onChange === null || onChange === void 0 ? void 0 : onChange(callbackParams);
178
- setLastValidYear(function (validYear) {
179
- var _dayjsDate$get;
180
-
181
- return (_dayjsDate$get = dayjsDate === null || dayjsDate === void 0 ? void 0 : dayjsDate.get("year")) !== null && _dayjsDate$get !== void 0 ? _dayjsDate$get : validYear;
182
- });
183
- setDayjsDate(null);
184
- }
185
- };
186
-
187
- var handleIOnBlur = function handleIOnBlur(_ref4) {
188
- var value = _ref4.value,
189
- inputError = _ref4.error;
190
- var date = getDate(value, format, lastValidYear, setLastValidYear);
191
- var invalidDateMessage = value !== "" && !date.isValid() && translatedLabels.dateInput.invalidDateErrorMessage;
192
- var callbackParams = inputError || invalidDateMessage ? {
193
- value: value,
194
- error: inputError || invalidDateMessage
195
- } : {
196
- value: value
197
- };
198
- date.isValid() ? onBlur === null || onBlur === void 0 ? void 0 : onBlur(_objectSpread(_objectSpread({}, callbackParams), {}, {
199
- date: date.toDate()
200
- })) : onBlur === null || onBlur === void 0 ? void 0 : onBlur(callbackParams);
201
- };
202
-
203
- var openCalendar = function openCalendar() {
204
- setIsOpen(!isOpen);
205
- };
206
-
207
- var closeCalendar = function closeCalendar() {
208
- setIsOpen(false);
209
- };
210
-
211
- var handleDatePickerEscKeydown = function handleDatePickerEscKeydown(event) {
212
- event.preventDefault();
213
- closeCalendar();
214
- dateRef === null || dateRef === void 0 ? void 0 : dateRef.current.getElementsByTagName("input")[0].focus();
215
- };
216
-
217
- var handleDatePickerOnBlur = function handleDatePickerOnBlur(event) {
218
- if (!(event !== null && event !== void 0 && event.currentTarget.contains(event.relatedTarget))) closeCalendar();
219
- };
220
-
221
- return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
222
- theme: colorsTheme
223
- }, /*#__PURE__*/_react["default"].createElement("div", {
224
- ref: ref
225
- }, /*#__PURE__*/_react["default"].createElement(Popover.Root, {
226
- open: isOpen
227
- }, /*#__PURE__*/_react["default"].createElement(Popover.Trigger, {
228
- asChild: true,
229
- "aria-controls": undefined
230
- }, /*#__PURE__*/_react["default"].createElement(_TextInput["default"], {
231
- label: label,
232
- name: name,
233
- defaultValue: defaultValue,
234
- value: value !== null && value !== void 0 ? value : innerValue,
235
- helperText: helperText,
236
- placeholder: placeholder ? format.toUpperCase() : null,
237
- action: {
238
- onClick: openCalendar,
239
- icon: _Icons.calendarIcon,
240
- title: "Open calendar"
241
- },
242
- clearable: clearable,
243
- disabled: disabled,
244
- optional: optional,
245
- onChange: handleIOnChange,
246
- onBlur: handleIOnBlur,
247
- error: error,
248
- autocomplete: autocomplete,
249
- margin: margin,
250
- size: size,
251
- tabIndex: tabIndex,
252
- ref: dateRef
253
- })), /*#__PURE__*/_react["default"].createElement(StyledContent, {
254
- sideOffset: error ? -18 : 2,
255
- align: "end",
256
- "aria-modal": true,
257
- onBlur: handleDatePickerOnBlur,
258
- onEscapeKeyDown: handleDatePickerEscKeydown,
259
- avoidCollisions: false
260
- }, /*#__PURE__*/_react["default"].createElement(_DatePicker["default"], {
261
- id: calendarId,
262
- onDateSelect: handleCalendarOnClick,
263
- date: dayjsDate
264
- })))));
265
- });
266
-
267
- var StyledContent = (0, _styledComponents["default"])(Popover.Content)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n &:focus-visible {\n outline: none;\n }\n"])));
268
- var _default = DxcDateInput;
269
- exports["default"] = _default;