@hitachivantara/uikit-react-core 5.19.3 → 5.20.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (196) hide show
  1. package/dist/cjs/components/Accordion/Accordion.cjs +19 -11
  2. package/dist/cjs/components/Accordion/Accordion.cjs.map +1 -1
  3. package/dist/cjs/components/Accordion/Accordion.styles.cjs +44 -68
  4. package/dist/cjs/components/Accordion/Accordion.styles.cjs.map +1 -1
  5. package/dist/cjs/components/ActionsGeneric/ActionsGeneric.cjs +22 -12
  6. package/dist/cjs/components/ActionsGeneric/ActionsGeneric.cjs.map +1 -1
  7. package/dist/cjs/components/ActionsGeneric/ActionsGeneric.styles.cjs +17 -53
  8. package/dist/cjs/components/ActionsGeneric/ActionsGeneric.styles.cjs.map +1 -1
  9. package/dist/cjs/components/AppSwitcher/Action/Action.cjs +23 -16
  10. package/dist/cjs/components/AppSwitcher/Action/Action.cjs.map +1 -1
  11. package/dist/cjs/components/AppSwitcher/Action/Action.styles.cjs +51 -91
  12. package/dist/cjs/components/AppSwitcher/Action/Action.styles.cjs.map +1 -1
  13. package/dist/cjs/components/AppSwitcher/AppSwitcher.cjs +28 -24
  14. package/dist/cjs/components/AppSwitcher/AppSwitcher.cjs.map +1 -1
  15. package/dist/cjs/components/AppSwitcher/AppSwitcher.styles.cjs +52 -116
  16. package/dist/cjs/components/AppSwitcher/AppSwitcher.styles.cjs.map +1 -1
  17. package/dist/cjs/components/AppSwitcher/TitleWithTooltip.cjs +3 -6
  18. package/dist/cjs/components/AppSwitcher/TitleWithTooltip.cjs.map +1 -1
  19. package/dist/cjs/components/BaseDropdown/BaseDropdown.cjs +6 -14
  20. package/dist/cjs/components/BaseDropdown/BaseDropdown.cjs.map +1 -1
  21. package/dist/cjs/components/BreadCrumb/Page/Page.styles.cjs +2 -2
  22. package/dist/cjs/components/BreadCrumb/Page/Page.styles.cjs.map +1 -1
  23. package/dist/cjs/components/Calendar/CalendarHeader/CalendarHeader.cjs +2 -6
  24. package/dist/cjs/components/Calendar/CalendarHeader/CalendarHeader.cjs.map +1 -1
  25. package/dist/cjs/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.cjs +2 -3
  26. package/dist/cjs/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.cjs.map +1 -1
  27. package/dist/cjs/components/Calendar/CalendarNavigation/Navigation/Navigation.cjs +2 -3
  28. package/dist/cjs/components/Calendar/CalendarNavigation/Navigation/Navigation.cjs.map +1 -1
  29. package/dist/cjs/components/Calendar/SingleCalendar/SingleCalendar.cjs +6 -14
  30. package/dist/cjs/components/Calendar/SingleCalendar/SingleCalendar.cjs.map +1 -1
  31. package/dist/cjs/components/Dialog/Actions/Actions.cjs.map +1 -1
  32. package/dist/cjs/components/Dialog/Content/Content.cjs.map +1 -1
  33. package/dist/cjs/components/Dialog/Dialog.cjs +47 -46
  34. package/dist/cjs/components/Dialog/Dialog.cjs.map +1 -1
  35. package/dist/cjs/components/Dialog/Dialog.styles.cjs +15 -0
  36. package/dist/cjs/components/Dialog/Dialog.styles.cjs.map +1 -1
  37. package/dist/cjs/components/Dialog/Title/Title.cjs.map +1 -1
  38. package/dist/cjs/components/DropDownMenu/DropDownMenu.cjs +2 -3
  39. package/dist/cjs/components/DropDownMenu/DropDownMenu.cjs.map +1 -1
  40. package/dist/cjs/components/FileUploader/DropZone/DropZone.cjs +2 -3
  41. package/dist/cjs/components/FileUploader/DropZone/DropZone.cjs.map +1 -1
  42. package/dist/cjs/components/Focus/Focus.cjs +22 -44
  43. package/dist/cjs/components/Focus/Focus.cjs.map +1 -1
  44. package/dist/cjs/components/Focus/utils.cjs +0 -5
  45. package/dist/cjs/components/Focus/utils.cjs.map +1 -1
  46. package/dist/cjs/components/Header/Navigation/MenuBar/MenuBar.cjs +5 -1
  47. package/dist/cjs/components/Header/Navigation/MenuBar/MenuBar.cjs.map +1 -1
  48. package/dist/cjs/components/Header/Navigation/MenuItem/MenuItem.cjs +9 -6
  49. package/dist/cjs/components/Header/Navigation/MenuItem/MenuItem.cjs.map +1 -1
  50. package/dist/cjs/components/Header/Navigation/Navigation.cjs +4 -1
  51. package/dist/cjs/components/Header/Navigation/Navigation.cjs.map +1 -1
  52. package/dist/cjs/components/InlineEditor/InlineEditor.cjs +4 -5
  53. package/dist/cjs/components/InlineEditor/InlineEditor.cjs.map +1 -1
  54. package/dist/cjs/components/Input/Input.cjs +5 -6
  55. package/dist/cjs/components/Input/Input.cjs.map +1 -1
  56. package/dist/cjs/components/Pagination/Pagination.cjs +2 -6
  57. package/dist/cjs/components/Pagination/Pagination.cjs.map +1 -1
  58. package/dist/cjs/components/ScrollTo/Horizontal/ScrollToHorizontal.cjs +2 -6
  59. package/dist/cjs/components/ScrollTo/Horizontal/ScrollToHorizontal.cjs.map +1 -1
  60. package/dist/cjs/components/ScrollTo/Vertical/ScrollToVertical.cjs +2 -6
  61. package/dist/cjs/components/ScrollTo/Vertical/ScrollToVertical.cjs.map +1 -1
  62. package/dist/cjs/components/SelectionList/SelectionList.cjs +3 -8
  63. package/dist/cjs/components/SelectionList/SelectionList.cjs.map +1 -1
  64. package/dist/cjs/components/Snackbar/SnackbarContentWrapper/SnackbarContentWrapper.styles.cjs +5 -2
  65. package/dist/cjs/components/Snackbar/SnackbarContentWrapper/SnackbarContentWrapper.styles.cjs.map +1 -1
  66. package/dist/cjs/components/TagsInput/TagsInput.cjs +3 -4
  67. package/dist/cjs/components/TagsInput/TagsInput.cjs.map +1 -1
  68. package/dist/cjs/components/Tooltip/Tooltip.cjs +1 -1
  69. package/dist/cjs/components/Tooltip/Tooltip.cjs.map +1 -1
  70. package/dist/cjs/components/VerticalNavigation/Actions/Action.cjs +2 -3
  71. package/dist/cjs/components/VerticalNavigation/Actions/Action.cjs.map +1 -1
  72. package/dist/cjs/hooks/useCss.cjs +4 -13
  73. package/dist/cjs/hooks/useCss.cjs.map +1 -1
  74. package/dist/cjs/hooks/useEmotionCache.cjs +4 -4
  75. package/dist/cjs/hooks/useEmotionCache.cjs.map +1 -1
  76. package/dist/cjs/hooks/useTheme.cjs +3 -1
  77. package/dist/cjs/hooks/useTheme.cjs.map +1 -1
  78. package/dist/cjs/index.cjs +25 -19
  79. package/dist/cjs/index.cjs.map +1 -1
  80. package/dist/cjs/providers/Provider.cjs +5 -4
  81. package/dist/cjs/providers/Provider.cjs.map +1 -1
  82. package/dist/cjs/providers/ThemeProvider.cjs +13 -15
  83. package/dist/cjs/providers/ThemeProvider.cjs.map +1 -1
  84. package/dist/cjs/utils/keyboardUtils.cjs +30 -0
  85. package/dist/cjs/utils/keyboardUtils.cjs.map +1 -0
  86. package/dist/esm/components/Accordion/Accordion.js +22 -13
  87. package/dist/esm/components/Accordion/Accordion.js.map +1 -1
  88. package/dist/esm/components/Accordion/Accordion.styles.js +44 -66
  89. package/dist/esm/components/Accordion/Accordion.styles.js.map +1 -1
  90. package/dist/esm/components/ActionsGeneric/ActionsGeneric.js +25 -14
  91. package/dist/esm/components/ActionsGeneric/ActionsGeneric.js.map +1 -1
  92. package/dist/esm/components/ActionsGeneric/ActionsGeneric.styles.js +17 -51
  93. package/dist/esm/components/ActionsGeneric/ActionsGeneric.styles.js.map +1 -1
  94. package/dist/esm/components/AppSwitcher/Action/Action.js +26 -18
  95. package/dist/esm/components/AppSwitcher/Action/Action.js.map +1 -1
  96. package/dist/esm/components/AppSwitcher/Action/Action.styles.js +51 -89
  97. package/dist/esm/components/AppSwitcher/Action/Action.styles.js.map +1 -1
  98. package/dist/esm/components/AppSwitcher/AppSwitcher.js +31 -26
  99. package/dist/esm/components/AppSwitcher/AppSwitcher.js.map +1 -1
  100. package/dist/esm/components/AppSwitcher/AppSwitcher.styles.js +52 -114
  101. package/dist/esm/components/AppSwitcher/AppSwitcher.styles.js.map +1 -1
  102. package/dist/esm/components/AppSwitcher/TitleWithTooltip.js +3 -6
  103. package/dist/esm/components/AppSwitcher/TitleWithTooltip.js.map +1 -1
  104. package/dist/esm/components/BaseDropdown/BaseDropdown.js +6 -14
  105. package/dist/esm/components/BaseDropdown/BaseDropdown.js.map +1 -1
  106. package/dist/esm/components/BreadCrumb/Page/Page.styles.js +1 -1
  107. package/dist/esm/components/BreadCrumb/Page/Page.styles.js.map +1 -1
  108. package/dist/esm/components/Calendar/CalendarHeader/CalendarHeader.js +2 -6
  109. package/dist/esm/components/Calendar/CalendarHeader/CalendarHeader.js.map +1 -1
  110. package/dist/esm/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.js +2 -3
  111. package/dist/esm/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.js.map +1 -1
  112. package/dist/esm/components/Calendar/CalendarNavigation/Navigation/Navigation.js +2 -3
  113. package/dist/esm/components/Calendar/CalendarNavigation/Navigation/Navigation.js.map +1 -1
  114. package/dist/esm/components/Calendar/SingleCalendar/SingleCalendar.js +6 -14
  115. package/dist/esm/components/Calendar/SingleCalendar/SingleCalendar.js.map +1 -1
  116. package/dist/esm/components/Dialog/Actions/Actions.js.map +1 -1
  117. package/dist/esm/components/Dialog/Content/Content.js.map +1 -1
  118. package/dist/esm/components/Dialog/Dialog.js +47 -46
  119. package/dist/esm/components/Dialog/Dialog.js.map +1 -1
  120. package/dist/esm/components/Dialog/Dialog.styles.js +15 -0
  121. package/dist/esm/components/Dialog/Dialog.styles.js.map +1 -1
  122. package/dist/esm/components/Dialog/Title/Title.js.map +1 -1
  123. package/dist/esm/components/DropDownMenu/DropDownMenu.js +2 -3
  124. package/dist/esm/components/DropDownMenu/DropDownMenu.js.map +1 -1
  125. package/dist/esm/components/FileUploader/DropZone/DropZone.js +2 -3
  126. package/dist/esm/components/FileUploader/DropZone/DropZone.js.map +1 -1
  127. package/dist/esm/components/Focus/Focus.js +23 -45
  128. package/dist/esm/components/Focus/Focus.js.map +1 -1
  129. package/dist/esm/components/Focus/utils.js +0 -5
  130. package/dist/esm/components/Focus/utils.js.map +1 -1
  131. package/dist/esm/components/Header/Navigation/MenuBar/MenuBar.js +5 -1
  132. package/dist/esm/components/Header/Navigation/MenuBar/MenuBar.js.map +1 -1
  133. package/dist/esm/components/Header/Navigation/MenuItem/MenuItem.js +9 -6
  134. package/dist/esm/components/Header/Navigation/MenuItem/MenuItem.js.map +1 -1
  135. package/dist/esm/components/Header/Navigation/Navigation.js +4 -1
  136. package/dist/esm/components/Header/Navigation/Navigation.js.map +1 -1
  137. package/dist/esm/components/InlineEditor/InlineEditor.js +3 -4
  138. package/dist/esm/components/InlineEditor/InlineEditor.js.map +1 -1
  139. package/dist/esm/components/Input/Input.js +5 -6
  140. package/dist/esm/components/Input/Input.js.map +1 -1
  141. package/dist/esm/components/Pagination/Pagination.js +2 -6
  142. package/dist/esm/components/Pagination/Pagination.js.map +1 -1
  143. package/dist/esm/components/ScrollTo/Horizontal/ScrollToHorizontal.js +2 -6
  144. package/dist/esm/components/ScrollTo/Horizontal/ScrollToHorizontal.js.map +1 -1
  145. package/dist/esm/components/ScrollTo/Vertical/ScrollToVertical.js +2 -6
  146. package/dist/esm/components/ScrollTo/Vertical/ScrollToVertical.js.map +1 -1
  147. package/dist/esm/components/SelectionList/SelectionList.js +3 -8
  148. package/dist/esm/components/SelectionList/SelectionList.js.map +1 -1
  149. package/dist/esm/components/Snackbar/SnackbarContentWrapper/SnackbarContentWrapper.styles.js +5 -2
  150. package/dist/esm/components/Snackbar/SnackbarContentWrapper/SnackbarContentWrapper.styles.js.map +1 -1
  151. package/dist/esm/components/TagsInput/TagsInput.js +3 -4
  152. package/dist/esm/components/TagsInput/TagsInput.js.map +1 -1
  153. package/dist/esm/components/Tooltip/Tooltip.js +1 -1
  154. package/dist/esm/components/Tooltip/Tooltip.js.map +1 -1
  155. package/dist/esm/components/VerticalNavigation/Actions/Action.js +2 -3
  156. package/dist/esm/components/VerticalNavigation/Actions/Action.js.map +1 -1
  157. package/dist/esm/hooks/useCss.js +4 -13
  158. package/dist/esm/hooks/useCss.js.map +1 -1
  159. package/dist/esm/hooks/useEmotionCache.js +4 -4
  160. package/dist/esm/hooks/useEmotionCache.js.map +1 -1
  161. package/dist/esm/hooks/useTheme.js +3 -1
  162. package/dist/esm/hooks/useTheme.js.map +1 -1
  163. package/dist/esm/index.js +241 -244
  164. package/dist/esm/index.js.map +1 -1
  165. package/dist/esm/providers/Provider.js +4 -3
  166. package/dist/esm/providers/Provider.js.map +1 -1
  167. package/dist/esm/providers/ThemeProvider.js +4 -13
  168. package/dist/esm/providers/ThemeProvider.js.map +1 -1
  169. package/dist/esm/utils/keyboardUtils.js +30 -0
  170. package/dist/esm/utils/keyboardUtils.js.map +1 -0
  171. package/dist/types/index.d.ts +261 -317
  172. package/package.json +4 -4
  173. package/dist/cjs/components/Accordion/accordionClasses.cjs +0 -8
  174. package/dist/cjs/components/Accordion/accordionClasses.cjs.map +0 -1
  175. package/dist/cjs/components/ActionsGeneric/actionsGenericClasses.cjs +0 -8
  176. package/dist/cjs/components/ActionsGeneric/actionsGenericClasses.cjs.map +0 -1
  177. package/dist/cjs/components/AppSwitcher/Action/actionClasses.cjs +0 -8
  178. package/dist/cjs/components/AppSwitcher/Action/actionClasses.cjs.map +0 -1
  179. package/dist/cjs/components/AppSwitcher/appSwitcherClasses.cjs +0 -8
  180. package/dist/cjs/components/AppSwitcher/appSwitcherClasses.cjs.map +0 -1
  181. package/dist/cjs/utils/keyboardUtils/keyCheck.cjs +0 -9
  182. package/dist/cjs/utils/keyboardUtils/keyCheck.cjs.map +0 -1
  183. package/dist/cjs/utils/keyboardUtils/keyboardCodes.cjs +0 -105
  184. package/dist/cjs/utils/keyboardUtils/keyboardCodes.cjs.map +0 -1
  185. package/dist/esm/components/Accordion/accordionClasses.js +0 -8
  186. package/dist/esm/components/Accordion/accordionClasses.js.map +0 -1
  187. package/dist/esm/components/ActionsGeneric/actionsGenericClasses.js +0 -8
  188. package/dist/esm/components/ActionsGeneric/actionsGenericClasses.js.map +0 -1
  189. package/dist/esm/components/AppSwitcher/Action/actionClasses.js +0 -8
  190. package/dist/esm/components/AppSwitcher/Action/actionClasses.js.map +0 -1
  191. package/dist/esm/components/AppSwitcher/appSwitcherClasses.js +0 -8
  192. package/dist/esm/components/AppSwitcher/appSwitcherClasses.js.map +0 -1
  193. package/dist/esm/utils/keyboardUtils/keyCheck.js +0 -9
  194. package/dist/esm/utils/keyboardUtils/keyCheck.js.map +0 -1
  195. package/dist/esm/utils/keyboardUtils/keyboardCodes.js +0 -105
  196. package/dist/esm/utils/keyboardUtils/keyboardCodes.js.map +0 -1
@@ -1,12 +1,10 @@
1
1
  import { useRef, useMemo } from "react";
2
- import { StyledTitleWithTooltip } from "./AppSwitcher.styles.js";
3
2
  import { jsx } from "@emotion/react/jsx-runtime";
4
3
  import { HvTooltip } from "../Tooltip/Tooltip.js";
5
4
  import { HvTypography } from "../Typography/Typography.js";
6
5
  const TitleWithTooltip = ({
7
6
  className,
8
- title,
9
- type
7
+ title
10
8
  }) => {
11
9
  const textRef = useRef(null);
12
10
  const isOverflowed = useMemo(() => {
@@ -21,12 +19,11 @@ const TitleWithTooltip = ({
21
19
  title: /* @__PURE__ */ jsx(HvTypography, {
22
20
  children: title
23
21
  }),
24
- children: /* @__PURE__ */ jsx(StyledTitleWithTooltip, {
22
+ children: /* @__PURE__ */ jsx(HvTypography, {
23
+ className,
25
24
  variant: "label",
26
25
  component: "span",
27
26
  ref: textRef,
28
- className,
29
- $type: type,
30
27
  children: title
31
28
  })
32
29
  });
@@ -1 +1 @@
1
- {"version":3,"file":"TitleWithTooltip.js","sources":["../../../../src/components/AppSwitcher/TitleWithTooltip.tsx"],"sourcesContent":["import { useMemo, useRef } from \"react\";\nimport { HvTooltip, HvTypography } from \"@core/components\";\nimport { StyledTitleWithTooltip } from \"./AppSwitcher.styles\";\n\nconst TitleWithTooltip = ({ className, title, type }) => {\n const textRef = useRef<HTMLDivElement>(null);\n\n const isOverflowed = useMemo(() => {\n const el = textRef.current;\n if (!el) return false;\n\n return el.scrollWidth > el.clientWidth || el.scrollHeight > el.clientHeight;\n }, []);\n\n return (\n <HvTooltip\n disableHoverListener={!isOverflowed}\n placement=\"top-start\"\n title={<HvTypography>{title}</HvTypography>}\n >\n <StyledTitleWithTooltip\n variant=\"label\"\n component=\"span\"\n ref={textRef}\n className={className}\n $type={type}\n >\n {title}\n </StyledTitleWithTooltip>\n </HvTooltip>\n );\n};\n\nexport default TitleWithTooltip;\n"],"names":["TitleWithTooltip","className","title","type","textRef","useRef","isOverflowed","useMemo","el","current","scrollWidth","clientWidth","scrollHeight","clientHeight","HvTooltip","disableHoverListener","placement","HvTypography","children","StyledTitleWithTooltip","variant","component","ref","$type"],"mappings":";;;;;AAIA,MAAMA,mBAAmBA,CAAC;AAAA,EAAEC;AAAAA,EAAWC;AAAAA,EAAOC;AAAK,MAAM;AACjDC,QAAAA,UAAUC,OAAuB,IAAI;AAErCC,QAAAA,eAAeC,QAAQ,MAAM;AACjC,UAAMC,KAAKJ,QAAQK;AACnB,QAAI,CAACD;AAAW,aAAA;AAEhB,WAAOA,GAAGE,cAAcF,GAAGG,eAAeH,GAAGI,eAAeJ,GAAGK;AAAAA,EACjE,GAAG,CAAE,CAAA;AAEL,6BACGC,WAAS;AAAA,IACRC,sBAAsB,CAACT;AAAAA,IACvBU,WAAU;AAAA,IACVd,2BAAQe,cAAY;AAAA,MAAAC,UAAEhB;AAAAA,IAAAA,CAAoB;AAAA,IAAEgB,8BAE3CC,wBAAsB;AAAA,MACrBC,SAAQ;AAAA,MACRC,WAAU;AAAA,MACVC,KAAKlB;AAAAA,MACLH;AAAAA,MACAsB,OAAOpB;AAAAA,MAAKe,UAEXhB;AAAAA,IAAAA,CACqB;AAAA,EAAA,CACf;AAEf;AAEA,MAAA,qBAAeF;"}
1
+ {"version":3,"file":"TitleWithTooltip.js","sources":["../../../../src/components/AppSwitcher/TitleWithTooltip.tsx"],"sourcesContent":["import { useMemo, useRef } from \"react\";\nimport { HvTooltip, HvTypography } from \"@core/components\";\n\nconst TitleWithTooltip = ({ className, title }) => {\n const textRef = useRef<HTMLDivElement>(null);\n\n const isOverflowed = useMemo(() => {\n const el = textRef.current;\n if (!el) return false;\n\n return el.scrollWidth > el.clientWidth || el.scrollHeight > el.clientHeight;\n }, []);\n\n return (\n <HvTooltip\n disableHoverListener={!isOverflowed}\n placement=\"top-start\"\n title={<HvTypography>{title}</HvTypography>}\n >\n <HvTypography\n className={className}\n variant=\"label\"\n component=\"span\"\n ref={textRef}\n >\n {title}\n </HvTypography>\n </HvTooltip>\n );\n};\n\nexport default TitleWithTooltip;\n"],"names":["TitleWithTooltip","className","title","textRef","useRef","isOverflowed","useMemo","el","current","scrollWidth","clientWidth","scrollHeight","clientHeight","HvTooltip","disableHoverListener","placement","HvTypography","children","variant","component","ref"],"mappings":";;;;AAGA,MAAMA,mBAAmBA,CAAC;AAAA,EAAEC;AAAAA,EAAWC;AAAM,MAAM;AAC3CC,QAAAA,UAAUC,OAAuB,IAAI;AAErCC,QAAAA,eAAeC,QAAQ,MAAM;AACjC,UAAMC,KAAKJ,QAAQK;AACnB,QAAI,CAACD;AAAW,aAAA;AAEhB,WAAOA,GAAGE,cAAcF,GAAGG,eAAeH,GAAGI,eAAeJ,GAAGK;AAAAA,EACjE,GAAG,CAAE,CAAA;AAEL,6BACGC,WAAS;AAAA,IACRC,sBAAsB,CAACT;AAAAA,IACvBU,WAAU;AAAA,IACVb,2BAAQc,cAAY;AAAA,MAAAC,UAAEf;AAAAA,IAAAA,CAAoB;AAAA,IAAEe,8BAE3CD,cAAY;AAAA,MACXf;AAAAA,MACAiB,SAAQ;AAAA,MACRC,WAAU;AAAA,MACVC,KAAKjB;AAAAA,MAAQc,UAEZf;AAAAA,IAAAA,CACW;AAAA,EAAA,CACL;AAEf;AAEA,MAAA,qBAAeF;"}
@@ -15,16 +15,8 @@ import useUniqueId from "../../hooks/useUniqueId.js";
15
15
  import BaseDropdownContext from "./BaseDropdownContext/BaseDropdownContext.js";
16
16
  import { useTheme } from "../../hooks/useTheme.js";
17
17
  import { useControlled } from "../../hooks/useControlled.js";
18
- import { isKeypress } from "../../utils/keyboardUtils/keyCheck.js";
18
+ import { isKey, isOneOfKeys } from "../../utils/keyboardUtils.js";
19
19
  import { setId } from "../../utils/setId.js";
20
- import { keyboardCodes } from "../../utils/keyboardUtils/keyboardCodes.js";
21
- const {
22
- Tab,
23
- Enter,
24
- Esc,
25
- Space,
26
- ArrowDown
27
- } = keyboardCodes;
28
20
  const HvBaseDropdown = ({
29
21
  id,
30
22
  className,
@@ -150,11 +142,11 @@ const HvBaseDropdown = ({
150
142
  });
151
143
  const popperPlacement = ((_a = attributes.popper) == null ? void 0 : _a["data-popper-placement"]) ?? "bottom";
152
144
  const handleToggle = useCallback((event) => {
153
- if (event && !isKeypress(event, Tab)) {
145
+ if (event && !isKey(event, "Tab")) {
154
146
  event.preventDefault();
155
147
  }
156
- const notControlKey = [Tab, Enter, Esc, ArrowDown, Space].every((key) => isKeypress(event, key) === false);
157
- const ignoredCombinations = isKeypress(event, Esc) && !isOpen || isKeypress(event, ArrowDown) && isOpen || isKeypress(event, Tab) && !isOpen;
148
+ const notControlKey = !!(event == null ? void 0 : event.code) && !isOneOfKeys(event, ["Tab", "Enter", "Esc", "ArrowDown", "Space"]);
149
+ const ignoredCombinations = isKey(event, "Esc") && !isOpen || isKey(event, "ArrowDown") && isOpen || isKey(event, "Tab") && !isOpen;
158
150
  if (disabled || notControlKey || ignoredCombinations)
159
151
  return;
160
152
  const newOpen = !isOpen;
@@ -214,10 +206,10 @@ const HvBaseDropdown = ({
214
206
  const containerComponent = (() => {
215
207
  const handleContainerKeyDown = (event) => {
216
208
  var _a2;
217
- if (isKeypress(event, Esc)) {
209
+ if (isKey(event, "Esc")) {
218
210
  handleToggle(event);
219
211
  }
220
- if (isKeypress(event, Tab) && !event.shiftKey) {
212
+ if (isKey(event, "Tab") && !event.shiftKey) {
221
213
  const focusList = getFirstAndLastFocus(popperElement);
222
214
  if (document.activeElement === (focusList == null ? void 0 : focusList.last)) {
223
215
  event.preventDefault();
@@ -1 +1 @@
1
- {"version":3,"file":"BaseDropdown.js","sources":["../../../../src/components/BaseDropdown/BaseDropdown.tsx"],"sourcesContent":["import React, {\n useMemo,\n useState,\n useCallback,\n KeyboardEventHandler,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { clsx } from \"clsx\";\nimport {\n ClickAwayListener,\n ClickAwayListenerProps,\n PopperPlacementType,\n PopperProps,\n} from \"@mui/material\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\nimport { useControlled, useForkRef, useTheme, useUniqueId } from \"@core/hooks\";\nimport { isKeypress, keyboardCodes, setId } from \"@core/utils\";\nimport { getFirstAndLastFocus } from \"@core/utils/focusableElementFinder\";\nimport { HvBaseProps } from \"@core/types\";\nimport { usePopper } from \"react-popper\";\nimport { detectOverflow, ModifierArguments, Options } from \"@popperjs/core\";\nimport {\n StyledAdornment,\n StyledAnchor,\n StyledContainer,\n StyledExtension,\n StyledHeaderRoot,\n StyledPanel,\n StyledPlaceholder,\n StyledRoot,\n StyledSelection,\n} from \"./BaseDropdown.styles\";\nimport BaseDropdownContext from \"./BaseDropdownContext\";\nimport baseDropdownClasses, {\n HvBaseDropdownClasses,\n} from \"./baseDropdownClasses\";\n\nconst { Tab, Enter, Esc, Space, ArrowDown } = keyboardCodes;\n\nexport interface HvBaseDropdownProps\n extends HvBaseProps<HTMLDivElement, \"placeholder\"> {\n /**\n * The role of the element that triggers the popup.\n *\n * Defaults to \"combobox\" if `component` and the default\n * \"textbox\" header is used, undefined otherwise.\n */\n role?: string;\n /**\n * Header placeholder.\n */\n placeholder?: string | React.ReactNode;\n /**\n * If `true` the dropdown is disabled unable to be interacted, if `false` it is enabled.\n */\n disabled?: boolean;\n /**\n * If `true` the dropdown will be in read only mode, unable to be interacted.\n */\n readOnly?: boolean;\n /**\n * Disable the portal behavior.\n * The children stay within it's parent DOM hierarchy.\n */\n disablePortal?: boolean;\n /**\n * If `true` the dropdown width depends size of content if `false` the width depends on the header size.\n * Defaults to `false`.\n */\n variableWidth?: boolean;\n /**\n * If `true` the dropdown starts opened if `false` it starts closed.\n */\n expanded?: boolean;\n /**\n * When uncontrolled, defines the initial expanded state.\n */\n defaultExpanded?: boolean;\n /**\n * An object containing props to be wired to the popper component.\n */\n popperProps?: Partial<PopperProps>;\n /**\n * Placement of the dropdown.\n */\n placement?: \"left\" | \"right\";\n /**\n * Replacement for the header component.\n */\n component?: React.ReactNode;\n /**\n * Adornment to replace the default arrows.\n */\n adornment?: React.ReactNode;\n /**\n * When dropdown changes the expanded state.\n */\n onToggle?: (event: Event, open: boolean) => void;\n /**\n * When user click outside the open container.\n */\n onClickOutside?: (event: Event) => void;\n /**\n * Callback called when the dropdown is opened and ready,\n * commonly used to set focus to the content.\n */\n onContainerCreation?: (container: HTMLElement | null) => void;\n /**\n * Attributes applied to the dropdown header element.\n */\n dropdownHeaderProps?: React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLDivElement>,\n HTMLDivElement\n >;\n /**\n * Pass a ref to the dropdown header element.\n */\n dropdownHeaderRef?: React.Ref<any>;\n /**\n * A Jss Object used to override or extend the component styles applied.\n */\n classes?: HvBaseDropdownClasses;\n}\n\nexport const HvBaseDropdown = ({\n id,\n className,\n classes,\n children,\n role,\n placeholder,\n component,\n adornment,\n expanded,\n dropdownHeaderProps,\n defaultExpanded = false,\n disabled = false,\n readOnly = false,\n disablePortal = false,\n variableWidth = false,\n placement = \"right\",\n popperProps = {},\n dropdownHeaderRef: dropdownHeaderRefProp,\n onToggle,\n onClickOutside,\n onContainerCreation,\n ...others\n}: HvBaseDropdownProps) => {\n const { rootId } = useTheme();\n\n const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n\n const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(\n null\n );\n const [popperElement, setPopperElement] = useState<HTMLElement | null>(null);\n const [popperMaxSize, setPopperMaxSize] = useState<{\n width?: number;\n height?: number;\n }>({});\n\n const handleDropdownHeaderRefProp = useForkRef(\n dropdownHeaderRefProp,\n dropdownHeaderProps?.ref\n );\n const handleDropdownHeaderRef = useForkRef(\n setReferenceElement,\n handleDropdownHeaderRefProp\n );\n\n const ariaRole = role || (component == null ? \"combobox\" : undefined);\n\n const elementId = useUniqueId(id, \"hvbasedropdown\");\n\n const bottom: PopperPlacementType =\n placement && `bottom-${placement === \"right\" ? \"start\" : \"end\"}`;\n\n const extensionWidth = referenceElement\n ? referenceElement?.offsetWidth\n : \"inherit\";\n\n const { modifiers: popperPropsModifiers = [], ...otherPopperProps } =\n popperProps;\n\n const onFirstUpdate = useCallback(() => {\n if (onContainerCreation) onContainerCreation(popperElement);\n }, [onContainerCreation, popperElement]);\n\n const widthCalculator = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n state.styles.popper.width = `${state.rects.reference.width}px`;\n },\n []\n );\n\n const widthCalculatorEffect = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n state.elements.popper.style.width = `${\n (state.elements.reference as any).offsetWidth\n }px`;\n },\n []\n );\n\n const applyMaxSizeCalculator = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n // The `maxSize` modifier provides this data\n const { width, height } = state.modifiersData.maxSize;\n if (width !== popperMaxSize?.width || height !== popperMaxSize?.height) {\n setPopperMaxSize({ width, height });\n }\n\n state.styles.popper = {\n ...state.styles.popper,\n maxWidth: `${width}px`,\n maxHeight: `${height}px`,\n };\n },\n [popperMaxSize]\n );\n\n const maxSizeCalculator = useCallback(\n ({ state, name, options }: ModifierArguments<Options>) => {\n const overflow = detectOverflow(state, options);\n\n const x = state.modifiersData.preventOverflow?.x || 0;\n const y = state.modifiersData.preventOverflow?.y || 0;\n\n const popperWidth = state.rects.popper.width;\n const popperHeight = state.rects.popper.height;\n\n const basePlacement = state.placement.split(\"-\")[0];\n\n const widthProp = basePlacement === \"left\" ? \"left\" : \"right\";\n const heightProp = basePlacement === \"top\" ? \"top\" : \"bottom\";\n\n state.modifiersData[name] = {\n width: popperWidth - overflow[widthProp] - x,\n height: popperHeight - overflow[heightProp] - y,\n };\n },\n []\n );\n\n const modifiers: PopperProps[\"modifiers\"] = useMemo(\n () => [\n {\n name: \"variableWidth\",\n enabled: !variableWidth,\n phase: \"beforeWrite\",\n requires: [\"computeStyles\"],\n fn: widthCalculator,\n effect: widthCalculatorEffect,\n },\n {\n name: \"maxSize\",\n enabled: true,\n phase: \"main\",\n requiresIfExists: [\"offset\", \"preventOverflow\", \"flip\"],\n fn: maxSizeCalculator,\n },\n {\n name: \"applyMaxSize\",\n enabled: true,\n phase: \"beforeWrite\",\n requires: [\"maxSize\"],\n fn: applyMaxSizeCalculator,\n },\n ...popperPropsModifiers,\n ],\n [\n maxSizeCalculator,\n applyMaxSizeCalculator,\n popperPropsModifiers,\n variableWidth,\n widthCalculator,\n widthCalculatorEffect,\n ]\n );\n\n const { styles: popperStyles, attributes } = usePopper(\n referenceElement,\n popperElement,\n {\n placement: bottom,\n modifiers,\n onFirstUpdate,\n ...otherPopperProps,\n }\n );\n\n const popperPlacement =\n attributes.popper?.[\"data-popper-placement\"] ?? \"bottom\";\n\n const handleToggle = useCallback(\n (event) => {\n if (event && !isKeypress(event, Tab)) {\n event.preventDefault();\n }\n\n // We are checking specifically for false because if \"isKeypress\" returns true or undefined it should continue\n const notControlKey = [Tab, Enter, Esc, ArrowDown, Space].every(\n (key) => isKeypress(event, key) === false\n );\n\n const ignoredCombinations =\n (isKeypress(event, Esc) && !isOpen) ||\n (isKeypress(event, ArrowDown) && isOpen) ||\n (isKeypress(event, Tab) && !isOpen);\n\n if (disabled || notControlKey || ignoredCombinations) return;\n\n const newOpen = !isOpen;\n\n /* If about to close focus on the header component. */\n const focusHeader = () => {\n if (!newOpen) {\n // Focus-ring won't be visible even if using the keyboard:\n // https://github.com/WICG/focus-visible/issues/88\n referenceElement?.focus({ preventScroll: true });\n }\n\n return newOpen;\n };\n setIsOpen(focusHeader());\n\n onToggle?.(event, newOpen);\n },\n [isOpen, disabled, setIsOpen, onToggle, referenceElement]\n );\n\n const headerComponent = (() => {\n if (component) {\n return React.cloneElement(component as React.ReactElement, {\n ref: handleDropdownHeaderRef,\n });\n }\n\n const ExpanderComponent = isOpen ? DropUpXS : DropDownXS;\n\n return (\n <StyledHeaderRoot\n id={setId(id, \"header\")}\n className={clsx(\n baseDropdownClasses.header,\n classes?.header,\n disabled &&\n clsx(baseDropdownClasses.headerDisabled, classes?.headerDisabled),\n readOnly &&\n clsx(baseDropdownClasses.headerReadOnly, classes?.headerReadOnly),\n isOpen && clsx(baseDropdownClasses.headerOpen, classes?.headerOpen),\n isOpen &&\n popperPlacement.includes(\"top\") &&\n clsx(baseDropdownClasses.headerOpenUp, classes?.headerOpenUp),\n isOpen &&\n popperPlacement.includes(\"bottom\") &&\n clsx(baseDropdownClasses.headerOpenDown, classes?.headerOpenDown)\n )}\n $disabled={disabled}\n $readOnly={readOnly}\n $opened={isOpen}\n $openedUp={isOpen && popperPlacement.includes(\"top\")}\n $openedDown={isOpen && popperPlacement.includes(\"bottom\")}\n role={ariaRole === \"combobox\" ? \"textbox\" : undefined}\n style={disabled || readOnly ? { pointerEvents: \"none\" } : undefined}\n aria-controls={\n isOpen ? setId(elementId, \"children-container\") : undefined\n }\n aria-label={others[\"aria-label\"] ?? undefined}\n aria-labelledby={others[\"aria-labelledby\"] ?? undefined}\n // Removes the element from the navigation sequence for keyboard focus if disabled\n tabIndex={disabled ? -1 : 0}\n ref={handleDropdownHeaderRef}\n {...dropdownHeaderProps}\n >\n <StyledSelection\n className={clsx(baseDropdownClasses.selection, classes?.selection)}\n >\n {placeholder && typeof placeholder === \"string\" ? (\n <StyledPlaceholder\n className={clsx(\n baseDropdownClasses.placeholder,\n classes?.placeholder,\n disabled &&\n clsx(\n baseDropdownClasses.selectionDisabled,\n classes?.selectionDisabled\n )\n )}\n $disabled={disabled}\n variant=\"body\"\n >\n {placeholder}\n </StyledPlaceholder>\n ) : (\n placeholder\n )}\n </StyledSelection>\n <StyledAdornment>\n {adornment || (\n <ExpanderComponent\n iconSize=\"XS\"\n color={disabled ? theme.colors.secondary_60 : undefined}\n className={clsx(baseDropdownClasses.arrow, classes?.arrow)}\n />\n )}\n </StyledAdornment>\n </StyledHeaderRoot>\n );\n })();\n\n const containerComponent = (() => {\n /**\n * Handle keyboard inside children container.\n */\n const handleContainerKeyDown: KeyboardEventHandler = (event) => {\n if (isKeypress(event, Esc)) {\n handleToggle(event);\n }\n if (isKeypress(event, Tab) && !event.shiftKey) {\n const focusList = getFirstAndLastFocus(popperElement);\n if (document.activeElement === focusList?.last) {\n event.preventDefault();\n focusList?.first?.focus();\n }\n }\n };\n\n const handleOutside: ClickAwayListenerProps[\"onClickAway\"] = (event) => {\n const isButtonClick = referenceElement?.contains(event.target as any);\n if (!isButtonClick) {\n onClickOutside?.(event);\n setIsOpen(false);\n onToggle?.(event, false);\n }\n };\n\n const container = (\n <StyledContainer\n role=\"tooltip\"\n ref={setPopperElement}\n className={clsx(baseDropdownClasses.container, classes?.container)}\n style={popperStyles.popper}\n {...attributes.popper}\n >\n <ClickAwayListener onClickAway={handleOutside}>\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n <div onKeyDown={handleContainerKeyDown}>\n {popperPlacement.includes(\"bottom\") && (\n <StyledExtension\n style={{ width: extensionWidth }}\n className={clsx(\n baseDropdownClasses.inputExtensionOpen,\n classes?.inputExtensionOpen,\n popperPlacement.includes(\"end\") &&\n clsx(\n baseDropdownClasses.inputExtensionLeftPosition,\n classes?.inputExtensionLeftPosition\n )\n )}\n $leftPosition={popperPlacement.includes(\"end\")}\n $openShadow={false}\n $floatLeft={false}\n $floatRight={false}\n />\n )}\n <BaseDropdownContext.Provider value={popperMaxSize}>\n <StyledPanel\n id={setId(elementId, \"children-container\")}\n className={clsx(baseDropdownClasses.panel, classes?.panel)}\n $popperPlacement={\n popperPlacement.includes(\"top\") ? \"top\" : \"bottom\"\n }\n >\n {children}\n </StyledPanel>\n </BaseDropdownContext.Provider>\n {popperPlacement.includes(\"top\") && (\n <StyledExtension\n style={{ width: extensionWidth }}\n className={clsx(\n baseDropdownClasses.inputExtensionOpen,\n classes?.inputExtensionOpen,\n baseDropdownClasses.inputExtensionOpenShadow,\n classes?.inputExtensionOpenShadow,\n popperPlacement.includes(\"end\") &&\n clsx(\n baseDropdownClasses.inputExtensionFloatRight,\n classes?.inputExtensionFloatRight\n ),\n popperPlacement.includes(\"start\") &&\n clsx(\n baseDropdownClasses.inputExtensionFloatLeft,\n classes?.inputExtensionFloatLeft\n )\n )}\n $leftPosition={false}\n $openShadow\n $floatLeft={popperPlacement.includes(\"start\")}\n $floatRight={popperPlacement.includes(\"end\")}\n />\n )}\n </div>\n </ClickAwayListener>\n </StyledContainer>\n );\n\n if (disablePortal) return container;\n\n return createPortal(\n container,\n document.getElementById(rootId || \"\") || document.body\n );\n })();\n\n return (\n <StyledRoot className={clsx(baseDropdownClasses.root, classes?.root)}>\n <StyledAnchor\n id={id}\n role={ariaRole}\n aria-expanded={!!isOpen}\n aria-owns={isOpen ? setId(elementId, \"children-container\") : undefined}\n className={clsx(\n className,\n baseDropdownClasses.anchor,\n classes?.anchor,\n disabled &&\n clsx(baseDropdownClasses.rootDisabled, classes?.rootDisabled)\n )}\n $disabled={disabled}\n {...(!readOnly && {\n onKeyDown: handleToggle,\n onClick: handleToggle,\n })}\n // Removes the element from the navigation sequence for keyboard focus\n tabIndex={-1}\n {...others}\n >\n {headerComponent}\n </StyledAnchor>\n {isOpen && containerComponent}\n </StyledRoot>\n );\n};\n"],"names":["Tab","Enter","Esc","Space","ArrowDown","keyboardCodes","HvBaseDropdown","id","className","classes","children","role","placeholder","component","adornment","expanded","dropdownHeaderProps","defaultExpanded","disabled","readOnly","disablePortal","variableWidth","placement","popperProps","dropdownHeaderRef","dropdownHeaderRefProp","onToggle","onClickOutside","onContainerCreation","others","rootId","useTheme","isOpen","setIsOpen","useControlled","Boolean","referenceElement","setReferenceElement","useState","popperElement","setPopperElement","popperMaxSize","setPopperMaxSize","handleDropdownHeaderRefProp","useForkRef","ref","handleDropdownHeaderRef","ariaRole","undefined","elementId","useUniqueId","bottom","extensionWidth","offsetWidth","modifiers","popperPropsModifiers","otherPopperProps","onFirstUpdate","useCallback","widthCalculator","state","styles","popper","width","rects","reference","widthCalculatorEffect","elements","style","applyMaxSizeCalculator","height","modifiersData","maxSize","maxWidth","maxHeight","maxSizeCalculator","name","options","overflow","detectOverflow","x","preventOverflow","y","popperWidth","popperHeight","basePlacement","split","widthProp","heightProp","useMemo","enabled","phase","requires","fn","effect","requiresIfExists","popperStyles","attributes","usePopper","popperPlacement","handleToggle","event","isKeypress","preventDefault","notControlKey","every","key","ignoredCombinations","newOpen","focusHeader","focus","preventScroll","headerComponent","React","cloneElement","ExpanderComponent","DropUpXS","DropDownXS","StyledHeaderRoot","setId","clsx","baseDropdownClasses","header","headerDisabled","headerReadOnly","headerOpen","includes","headerOpenUp","headerOpenDown","$disabled","$readOnly","$opened","$openedUp","$openedDown","pointerEvents","tabIndex","_jsx","StyledSelection","selection","StyledPlaceholder","selectionDisabled","variant","StyledAdornment","iconSize","color","theme","colors","secondary_60","arrow","containerComponent","handleContainerKeyDown","shiftKey","focusList","getFirstAndLastFocus","document","activeElement","last","first","handleOutside","isButtonClick","contains","target","container","StyledContainer","ClickAwayListener","onClickAway","onKeyDown","StyledExtension","inputExtensionOpen","inputExtensionLeftPosition","$leftPosition","$openShadow","$floatLeft","$floatRight","BaseDropdownContext","Provider","value","StyledPanel","panel","$popperPlacement","inputExtensionOpenShadow","inputExtensionFloatRight","inputExtensionFloatLeft","createPortal","getElementById","body","StyledRoot","root","StyledAnchor","anchor","rootDisabled","onClick"],"mappings":"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"}
1
+ {"version":3,"file":"BaseDropdown.js","sources":["../../../../src/components/BaseDropdown/BaseDropdown.tsx"],"sourcesContent":["import React, {\n useMemo,\n useState,\n useCallback,\n KeyboardEventHandler,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { clsx } from \"clsx\";\nimport {\n ClickAwayListener,\n ClickAwayListenerProps,\n PopperPlacementType,\n PopperProps,\n} from \"@mui/material\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\nimport { useControlled, useForkRef, useTheme, useUniqueId } from \"@core/hooks\";\nimport { isKey, isOneOfKeys, setId } from \"@core/utils\";\nimport { getFirstAndLastFocus } from \"@core/utils/focusableElementFinder\";\nimport { HvBaseProps } from \"@core/types\";\nimport { usePopper } from \"react-popper\";\nimport { detectOverflow, ModifierArguments, Options } from \"@popperjs/core\";\nimport {\n StyledAdornment,\n StyledAnchor,\n StyledContainer,\n StyledExtension,\n StyledHeaderRoot,\n StyledPanel,\n StyledPlaceholder,\n StyledRoot,\n StyledSelection,\n} from \"./BaseDropdown.styles\";\nimport BaseDropdownContext from \"./BaseDropdownContext\";\nimport baseDropdownClasses, {\n HvBaseDropdownClasses,\n} from \"./baseDropdownClasses\";\n\nexport interface HvBaseDropdownProps\n extends HvBaseProps<HTMLDivElement, \"placeholder\"> {\n /**\n * The role of the element that triggers the popup.\n *\n * Defaults to \"combobox\" if `component` and the default\n * \"textbox\" header is used, undefined otherwise.\n */\n role?: string;\n /**\n * Header placeholder.\n */\n placeholder?: string | React.ReactNode;\n /**\n * If `true` the dropdown is disabled unable to be interacted, if `false` it is enabled.\n */\n disabled?: boolean;\n /**\n * If `true` the dropdown will be in read only mode, unable to be interacted.\n */\n readOnly?: boolean;\n /**\n * Disable the portal behavior.\n * The children stay within it's parent DOM hierarchy.\n */\n disablePortal?: boolean;\n /**\n * If `true` the dropdown width depends size of content if `false` the width depends on the header size.\n * Defaults to `false`.\n */\n variableWidth?: boolean;\n /**\n * If `true` the dropdown starts opened if `false` it starts closed.\n */\n expanded?: boolean;\n /**\n * When uncontrolled, defines the initial expanded state.\n */\n defaultExpanded?: boolean;\n /**\n * An object containing props to be wired to the popper component.\n */\n popperProps?: Partial<PopperProps>;\n /**\n * Placement of the dropdown.\n */\n placement?: \"left\" | \"right\";\n /**\n * Replacement for the header component.\n */\n component?: React.ReactNode;\n /**\n * Adornment to replace the default arrows.\n */\n adornment?: React.ReactNode;\n /**\n * When dropdown changes the expanded state.\n */\n onToggle?: (event: Event, open: boolean) => void;\n /**\n * When user click outside the open container.\n */\n onClickOutside?: (event: Event) => void;\n /**\n * Callback called when the dropdown is opened and ready,\n * commonly used to set focus to the content.\n */\n onContainerCreation?: (container: HTMLElement | null) => void;\n /**\n * Attributes applied to the dropdown header element.\n */\n dropdownHeaderProps?: React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLDivElement>,\n HTMLDivElement\n >;\n /**\n * Pass a ref to the dropdown header element.\n */\n dropdownHeaderRef?: React.Ref<any>;\n /**\n * A Jss Object used to override or extend the component styles applied.\n */\n classes?: HvBaseDropdownClasses;\n}\n\nexport const HvBaseDropdown = ({\n id,\n className,\n classes,\n children,\n role,\n placeholder,\n component,\n adornment,\n expanded,\n dropdownHeaderProps,\n defaultExpanded = false,\n disabled = false,\n readOnly = false,\n disablePortal = false,\n variableWidth = false,\n placement = \"right\",\n popperProps = {},\n dropdownHeaderRef: dropdownHeaderRefProp,\n onToggle,\n onClickOutside,\n onContainerCreation,\n ...others\n}: HvBaseDropdownProps) => {\n const { rootId } = useTheme();\n\n const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n\n const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(\n null\n );\n const [popperElement, setPopperElement] = useState<HTMLElement | null>(null);\n const [popperMaxSize, setPopperMaxSize] = useState<{\n width?: number;\n height?: number;\n }>({});\n\n const handleDropdownHeaderRefProp = useForkRef(\n dropdownHeaderRefProp,\n dropdownHeaderProps?.ref\n );\n const handleDropdownHeaderRef = useForkRef(\n setReferenceElement,\n handleDropdownHeaderRefProp\n );\n\n const ariaRole = role || (component == null ? \"combobox\" : undefined);\n\n const elementId = useUniqueId(id, \"hvbasedropdown\");\n\n const bottom: PopperPlacementType =\n placement && `bottom-${placement === \"right\" ? \"start\" : \"end\"}`;\n\n const extensionWidth = referenceElement\n ? referenceElement?.offsetWidth\n : \"inherit\";\n\n const { modifiers: popperPropsModifiers = [], ...otherPopperProps } =\n popperProps;\n\n const onFirstUpdate = useCallback(() => {\n if (onContainerCreation) onContainerCreation(popperElement);\n }, [onContainerCreation, popperElement]);\n\n const widthCalculator = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n state.styles.popper.width = `${state.rects.reference.width}px`;\n },\n []\n );\n\n const widthCalculatorEffect = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n state.elements.popper.style.width = `${\n (state.elements.reference as any).offsetWidth\n }px`;\n },\n []\n );\n\n const applyMaxSizeCalculator = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n // The `maxSize` modifier provides this data\n const { width, height } = state.modifiersData.maxSize;\n if (width !== popperMaxSize?.width || height !== popperMaxSize?.height) {\n setPopperMaxSize({ width, height });\n }\n\n state.styles.popper = {\n ...state.styles.popper,\n maxWidth: `${width}px`,\n maxHeight: `${height}px`,\n };\n },\n [popperMaxSize]\n );\n\n const maxSizeCalculator = useCallback(\n ({ state, name, options }: ModifierArguments<Options>) => {\n const overflow = detectOverflow(state, options);\n\n const x = state.modifiersData.preventOverflow?.x || 0;\n const y = state.modifiersData.preventOverflow?.y || 0;\n\n const popperWidth = state.rects.popper.width;\n const popperHeight = state.rects.popper.height;\n\n const basePlacement = state.placement.split(\"-\")[0];\n\n const widthProp = basePlacement === \"left\" ? \"left\" : \"right\";\n const heightProp = basePlacement === \"top\" ? \"top\" : \"bottom\";\n\n state.modifiersData[name] = {\n width: popperWidth - overflow[widthProp] - x,\n height: popperHeight - overflow[heightProp] - y,\n };\n },\n []\n );\n\n const modifiers: PopperProps[\"modifiers\"] = useMemo(\n () => [\n {\n name: \"variableWidth\",\n enabled: !variableWidth,\n phase: \"beforeWrite\",\n requires: [\"computeStyles\"],\n fn: widthCalculator,\n effect: widthCalculatorEffect,\n },\n {\n name: \"maxSize\",\n enabled: true,\n phase: \"main\",\n requiresIfExists: [\"offset\", \"preventOverflow\", \"flip\"],\n fn: maxSizeCalculator,\n },\n {\n name: \"applyMaxSize\",\n enabled: true,\n phase: \"beforeWrite\",\n requires: [\"maxSize\"],\n fn: applyMaxSizeCalculator,\n },\n ...popperPropsModifiers,\n ],\n [\n maxSizeCalculator,\n applyMaxSizeCalculator,\n popperPropsModifiers,\n variableWidth,\n widthCalculator,\n widthCalculatorEffect,\n ]\n );\n\n const { styles: popperStyles, attributes } = usePopper(\n referenceElement,\n popperElement,\n {\n placement: bottom,\n modifiers,\n onFirstUpdate,\n ...otherPopperProps,\n }\n );\n\n const popperPlacement =\n attributes.popper?.[\"data-popper-placement\"] ?? \"bottom\";\n\n const handleToggle = useCallback(\n (event) => {\n if (event && !isKey(event, \"Tab\")) {\n event.preventDefault();\n }\n\n const notControlKey =\n !!event?.code &&\n !isOneOfKeys(event, [\"Tab\", \"Enter\", \"Esc\", \"ArrowDown\", \"Space\"]);\n\n const ignoredCombinations =\n (isKey(event, \"Esc\") && !isOpen) ||\n (isKey(event, \"ArrowDown\") && isOpen) ||\n (isKey(event, \"Tab\") && !isOpen);\n\n if (disabled || notControlKey || ignoredCombinations) return;\n\n const newOpen = !isOpen;\n\n /* If about to close focus on the header component. */\n const focusHeader = () => {\n if (!newOpen) {\n // Focus-ring won't be visible even if using the keyboard:\n // https://github.com/WICG/focus-visible/issues/88\n referenceElement?.focus({ preventScroll: true });\n }\n\n return newOpen;\n };\n setIsOpen(focusHeader());\n\n onToggle?.(event, newOpen);\n },\n [isOpen, disabled, setIsOpen, onToggle, referenceElement]\n );\n\n const headerComponent = (() => {\n if (component) {\n return React.cloneElement(component as React.ReactElement, {\n ref: handleDropdownHeaderRef,\n });\n }\n\n const ExpanderComponent = isOpen ? DropUpXS : DropDownXS;\n\n return (\n <StyledHeaderRoot\n id={setId(id, \"header\")}\n className={clsx(\n baseDropdownClasses.header,\n classes?.header,\n disabled &&\n clsx(baseDropdownClasses.headerDisabled, classes?.headerDisabled),\n readOnly &&\n clsx(baseDropdownClasses.headerReadOnly, classes?.headerReadOnly),\n isOpen && clsx(baseDropdownClasses.headerOpen, classes?.headerOpen),\n isOpen &&\n popperPlacement.includes(\"top\") &&\n clsx(baseDropdownClasses.headerOpenUp, classes?.headerOpenUp),\n isOpen &&\n popperPlacement.includes(\"bottom\") &&\n clsx(baseDropdownClasses.headerOpenDown, classes?.headerOpenDown)\n )}\n $disabled={disabled}\n $readOnly={readOnly}\n $opened={isOpen}\n $openedUp={isOpen && popperPlacement.includes(\"top\")}\n $openedDown={isOpen && popperPlacement.includes(\"bottom\")}\n role={ariaRole === \"combobox\" ? \"textbox\" : undefined}\n style={disabled || readOnly ? { pointerEvents: \"none\" } : undefined}\n aria-controls={\n isOpen ? setId(elementId, \"children-container\") : undefined\n }\n aria-label={others[\"aria-label\"] ?? undefined}\n aria-labelledby={others[\"aria-labelledby\"] ?? undefined}\n // Removes the element from the navigation sequence for keyboard focus if disabled\n tabIndex={disabled ? -1 : 0}\n ref={handleDropdownHeaderRef}\n {...dropdownHeaderProps}\n >\n <StyledSelection\n className={clsx(baseDropdownClasses.selection, classes?.selection)}\n >\n {placeholder && typeof placeholder === \"string\" ? (\n <StyledPlaceholder\n className={clsx(\n baseDropdownClasses.placeholder,\n classes?.placeholder,\n disabled &&\n clsx(\n baseDropdownClasses.selectionDisabled,\n classes?.selectionDisabled\n )\n )}\n $disabled={disabled}\n variant=\"body\"\n >\n {placeholder}\n </StyledPlaceholder>\n ) : (\n placeholder\n )}\n </StyledSelection>\n <StyledAdornment>\n {adornment || (\n <ExpanderComponent\n iconSize=\"XS\"\n color={disabled ? theme.colors.secondary_60 : undefined}\n className={clsx(baseDropdownClasses.arrow, classes?.arrow)}\n />\n )}\n </StyledAdornment>\n </StyledHeaderRoot>\n );\n })();\n\n const containerComponent = (() => {\n /**\n * Handle keyboard inside children container.\n */\n const handleContainerKeyDown: KeyboardEventHandler = (event) => {\n if (isKey(event, \"Esc\")) {\n handleToggle(event);\n }\n if (isKey(event, \"Tab\") && !event.shiftKey) {\n const focusList = getFirstAndLastFocus(popperElement);\n if (document.activeElement === focusList?.last) {\n event.preventDefault();\n focusList?.first?.focus();\n }\n }\n };\n\n const handleOutside: ClickAwayListenerProps[\"onClickAway\"] = (event) => {\n const isButtonClick = referenceElement?.contains(event.target as any);\n if (!isButtonClick) {\n onClickOutside?.(event);\n setIsOpen(false);\n onToggle?.(event, false);\n }\n };\n\n const container = (\n <StyledContainer\n role=\"tooltip\"\n ref={setPopperElement}\n className={clsx(baseDropdownClasses.container, classes?.container)}\n style={popperStyles.popper}\n {...attributes.popper}\n >\n <ClickAwayListener onClickAway={handleOutside}>\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n <div onKeyDown={handleContainerKeyDown}>\n {popperPlacement.includes(\"bottom\") && (\n <StyledExtension\n style={{ width: extensionWidth }}\n className={clsx(\n baseDropdownClasses.inputExtensionOpen,\n classes?.inputExtensionOpen,\n popperPlacement.includes(\"end\") &&\n clsx(\n baseDropdownClasses.inputExtensionLeftPosition,\n classes?.inputExtensionLeftPosition\n )\n )}\n $leftPosition={popperPlacement.includes(\"end\")}\n $openShadow={false}\n $floatLeft={false}\n $floatRight={false}\n />\n )}\n <BaseDropdownContext.Provider value={popperMaxSize}>\n <StyledPanel\n id={setId(elementId, \"children-container\")}\n className={clsx(baseDropdownClasses.panel, classes?.panel)}\n $popperPlacement={\n popperPlacement.includes(\"top\") ? \"top\" : \"bottom\"\n }\n >\n {children}\n </StyledPanel>\n </BaseDropdownContext.Provider>\n {popperPlacement.includes(\"top\") && (\n <StyledExtension\n style={{ width: extensionWidth }}\n className={clsx(\n baseDropdownClasses.inputExtensionOpen,\n classes?.inputExtensionOpen,\n baseDropdownClasses.inputExtensionOpenShadow,\n classes?.inputExtensionOpenShadow,\n popperPlacement.includes(\"end\") &&\n clsx(\n baseDropdownClasses.inputExtensionFloatRight,\n classes?.inputExtensionFloatRight\n ),\n popperPlacement.includes(\"start\") &&\n clsx(\n baseDropdownClasses.inputExtensionFloatLeft,\n classes?.inputExtensionFloatLeft\n )\n )}\n $leftPosition={false}\n $openShadow\n $floatLeft={popperPlacement.includes(\"start\")}\n $floatRight={popperPlacement.includes(\"end\")}\n />\n )}\n </div>\n </ClickAwayListener>\n </StyledContainer>\n );\n\n if (disablePortal) return container;\n\n return createPortal(\n container,\n document.getElementById(rootId || \"\") || document.body\n );\n })();\n\n return (\n <StyledRoot className={clsx(baseDropdownClasses.root, classes?.root)}>\n <StyledAnchor\n id={id}\n role={ariaRole}\n aria-expanded={!!isOpen}\n aria-owns={isOpen ? setId(elementId, \"children-container\") : undefined}\n className={clsx(\n className,\n baseDropdownClasses.anchor,\n classes?.anchor,\n disabled &&\n clsx(baseDropdownClasses.rootDisabled, classes?.rootDisabled)\n )}\n $disabled={disabled}\n {...(!readOnly && {\n onKeyDown: handleToggle,\n onClick: handleToggle,\n })}\n // Removes the element from the navigation sequence for keyboard focus\n tabIndex={-1}\n {...others}\n >\n {headerComponent}\n </StyledAnchor>\n {isOpen && containerComponent}\n </StyledRoot>\n );\n};\n"],"names":["HvBaseDropdown","id","className","classes","children","role","placeholder","component","adornment","expanded","dropdownHeaderProps","defaultExpanded","disabled","readOnly","disablePortal","variableWidth","placement","popperProps","dropdownHeaderRef","dropdownHeaderRefProp","onToggle","onClickOutside","onContainerCreation","others","rootId","useTheme","isOpen","setIsOpen","useControlled","Boolean","referenceElement","setReferenceElement","useState","popperElement","setPopperElement","popperMaxSize","setPopperMaxSize","handleDropdownHeaderRefProp","useForkRef","ref","handleDropdownHeaderRef","ariaRole","undefined","elementId","useUniqueId","bottom","extensionWidth","offsetWidth","modifiers","popperPropsModifiers","otherPopperProps","onFirstUpdate","useCallback","widthCalculator","state","styles","popper","width","rects","reference","widthCalculatorEffect","elements","style","applyMaxSizeCalculator","height","modifiersData","maxSize","maxWidth","maxHeight","maxSizeCalculator","name","options","overflow","detectOverflow","x","preventOverflow","y","popperWidth","popperHeight","basePlacement","split","widthProp","heightProp","useMemo","enabled","phase","requires","fn","effect","requiresIfExists","popperStyles","attributes","usePopper","popperPlacement","handleToggle","event","isKey","preventDefault","notControlKey","code","isOneOfKeys","ignoredCombinations","newOpen","focusHeader","focus","preventScroll","headerComponent","React","cloneElement","ExpanderComponent","DropUpXS","DropDownXS","StyledHeaderRoot","setId","clsx","baseDropdownClasses","header","headerDisabled","headerReadOnly","headerOpen","includes","headerOpenUp","headerOpenDown","$disabled","$readOnly","$opened","$openedUp","$openedDown","pointerEvents","tabIndex","_jsx","StyledSelection","selection","StyledPlaceholder","selectionDisabled","variant","StyledAdornment","iconSize","color","theme","colors","secondary_60","arrow","containerComponent","handleContainerKeyDown","shiftKey","focusList","getFirstAndLastFocus","document","activeElement","last","first","handleOutside","isButtonClick","contains","target","container","StyledContainer","ClickAwayListener","onClickAway","onKeyDown","StyledExtension","inputExtensionOpen","inputExtensionLeftPosition","$leftPosition","$openShadow","$floatLeft","$floatRight","BaseDropdownContext","Provider","value","StyledPanel","panel","$popperPlacement","inputExtensionOpenShadow","inputExtensionFloatRight","inputExtensionFloatLeft","createPortal","getElementById","body","StyledRoot","root","StyledAnchor","anchor","rootDisabled","onClick"],"mappings":"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"}
@@ -1,6 +1,6 @@
1
- import { outlineStyles } from "@hitachivantara/uikit-react-core";
2
1
  import { theme } from "@hitachivantara/uikit-styles";
3
2
  import { createClasses } from "../../../utils/classes.js";
3
+ import { outlineStyles } from "../../../utils/focusUtils.js";
4
4
  const {
5
5
  staticClasses,
6
6
  useClasses
@@ -1 +1 @@
1
- {"version":3,"file":"Page.styles.js","sources":["../../../../../src/components/BreadCrumb/Page/Page.styles.tsx"],"sourcesContent":["import { createClasses } from \"@core/utils\";\nimport { outlineStyles } from \"@hitachivantara/uikit-react-core\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvPage\", {\n link: {\n padding: `8px ${theme.space.xs}`,\n borderRadius: theme.radii.base,\n maxWidth: 170 + 16,\n textTransform: \"capitalize\",\n \"&:hover\": {\n cursor: \"pointer\",\n backgroundColor: theme.colors.atmo3,\n },\n \"&:focus\": {\n backgroundColor: theme.colors.atmo3,\n },\n \"&:focus-visible\": {\n ...outlineStyles,\n },\n },\n label: {},\n a: {},\n});\n"],"names":["staticClasses","useClasses","createClasses","link","padding","theme","space","xs","borderRadius","radii","base","maxWidth","textTransform","cursor","backgroundColor","colors","atmo3","outlineStyles","label","a"],"mappings":";;;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,UAAU;AAAA,EACnEC,MAAM;AAAA,IACJC,SAAU,OAAMC,MAAMC,MAAMC;AAAAA,IAC5BC,cAAcH,MAAMI,MAAMC;AAAAA,IAC1BC,UAAU,MAAM;AAAA,IAChBC,eAAe;AAAA,IACf,WAAW;AAAA,MACTC,QAAQ;AAAA,MACRC,iBAAiBT,MAAMU,OAAOC;AAAAA,IAChC;AAAA,IACA,WAAW;AAAA,MACTF,iBAAiBT,MAAMU,OAAOC;AAAAA,IAChC;AAAA,IACA,mBAAmB;AAAA,MACjB,GAAGC;AAAAA,IACL;AAAA,EACF;AAAA,EACAC,OAAO,CAAC;AAAA,EACRC,GAAG,CAAC;AACN,CAAC;"}
1
+ {"version":3,"file":"Page.styles.js","sources":["../../../../../src/components/BreadCrumb/Page/Page.styles.tsx"],"sourcesContent":["import { createClasses, outlineStyles } from \"@core/utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvPage\", {\n link: {\n padding: `8px ${theme.space.xs}`,\n borderRadius: theme.radii.base,\n maxWidth: 170 + 16,\n textTransform: \"capitalize\",\n \"&:hover\": {\n cursor: \"pointer\",\n backgroundColor: theme.colors.atmo3,\n },\n \"&:focus\": {\n backgroundColor: theme.colors.atmo3,\n },\n \"&:focus-visible\": {\n ...outlineStyles,\n },\n },\n label: {},\n a: {},\n});\n"],"names":["staticClasses","useClasses","createClasses","link","padding","theme","space","xs","borderRadius","radii","base","maxWidth","textTransform","cursor","backgroundColor","colors","atmo3","outlineStyles","label","a"],"mappings":";;;AAGa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,UAAU;AAAA,EACnEC,MAAM;AAAA,IACJC,SAAU,OAAMC,MAAMC,MAAMC;AAAAA,IAC5BC,cAAcH,MAAMI,MAAMC;AAAAA,IAC1BC,UAAU,MAAM;AAAA,IAChBC,eAAe;AAAA,IACf,WAAW;AAAA,MACTC,QAAQ;AAAA,MACRC,iBAAiBT,MAAMU,OAAOC;AAAAA,IAChC;AAAA,IACA,WAAW;AAAA,MACTF,iBAAiBT,MAAMU,OAAOC;AAAAA,IAChC;AAAA,IACA,mBAAmB;AAAA,MACjB,GAAGC;AAAAA,IACL;AAAA,EACF;AAAA,EACAC,OAAO,CAAC;AAAA,EACRC,GAAG,CAAC;AACN,CAAC;"}
@@ -14,14 +14,10 @@ import { HvFormElementValueContext } from "../../Forms/FormElement/context/FormE
14
14
  import { HvFormElementContext } from "../../Forms/FormElement/context/FormElementContext.js";
15
15
  import { HvFormElementDescriptorsContext } from "../../Forms/FormElement/context/FormElementDescriptorsContext.js";
16
16
  import { setId } from "../../../utils/setId.js";
17
- import { isKeypress } from "../../../utils/keyboardUtils/keyCheck.js";
18
- import { keyboardCodes } from "../../../utils/keyboardUtils/keyboardCodes.js";
17
+ import { isKey } from "../../../utils/keyboardUtils.js";
19
18
  dayjs.extend(localeData);
20
19
  dayjs.extend(localizedFormat);
21
20
  dayjs.extend(customParseFormat);
22
- const {
23
- Enter
24
- } = keyboardCodes;
25
21
  const HvCalendarHeader = ({
26
22
  id,
27
23
  value,
@@ -97,7 +93,7 @@ const HvCalendarHeader = ({
97
93
  handleNewDate(event, editedValue);
98
94
  };
99
95
  const keyDownHandler = (event) => {
100
- if (!isKeypress(event, Enter) || isNil(editedValue) || editedValue === "")
96
+ if (!isKey(event, "Enter") || isNil(editedValue) || editedValue === "")
101
97
  return;
102
98
  event.preventDefault();
103
99
  handleNewDate(event, editedValue);
@@ -1 +1 @@
1
- {"version":3,"file":"CalendarHeader.js","sources":["../../../../../src/components/Calendar/CalendarHeader/CalendarHeader.tsx"],"sourcesContent":["import { useState, useEffect, useContext } from \"react\";\nimport dayjs from \"dayjs\";\nimport localeData from \"dayjs/plugin/localeData\";\nimport localizedFormat from \"dayjs/plugin/localizedFormat\";\nimport customParseFormat from \"dayjs/plugin/customParseFormat\";\nimport { clsx } from \"clsx\";\nimport isNil from \"lodash/isNil\";\nimport {\n HvFormElementContext,\n HvFormElementValueContext,\n HvFormElementDescriptorsContext,\n} from \"@core/components\";\nimport { isKeypress, keyboardCodes, setId } from \"@core/utils\";\nimport { Info } from \"@hitachivantara/uikit-react-icons\";\nimport { isRange, isSameDay, formatToLocale, isDate } from \"../utils\";\nimport { DateRangeProp } from \"../Calendar\";\nimport calendarHeaderClasses, {\n HvCalendarHeaderClasses,\n} from \"./calendarHeaderClasses\";\nimport {\n StyledHeaderDayOfWeek,\n StyledInput,\n StyledInputBorderContainer,\n StyledRoot,\n StyledTypography,\n} from \"./CalendarHeader.styles\";\n\ndayjs.extend(localeData);\ndayjs.extend(localizedFormat);\ndayjs.extend(customParseFormat);\n\nconst { Enter } = keyboardCodes;\n\nexport const HvCalendarHeader = ({\n id,\n value,\n locale = \"en-US\",\n classes,\n onChange,\n showEndDate,\n showDayOfWeek = false,\n onFocus,\n invalidDateLabel = \"Invalid Date\",\n ...others\n}: HvCalendarHeaderProps) => {\n const { elementId } = useContext(HvFormElementContext);\n const elementValue = useContext(HvFormElementValueContext);\n const { label } = useContext(HvFormElementDescriptorsContext);\n\n let localValue: string | Date | DateRangeProp | undefined =\n value ?? elementValue ?? \"\";\n if (isRange(localValue)) {\n localValue = showEndDate ? localValue.endDate : localValue.startDate;\n }\n const [dateValue, setDateValue] = useState<\n string | Date | DateRangeProp | undefined\n >(localValue);\n const [editedValue, setEditedValue] = useState<string | null>(null);\n const [displayValue, setDisplayValue] = useState(\"\");\n const [weekdayDisplay, setWeekdayDisplay] = useState(\"\");\n\n const localId = id ?? setId(elementId, \"calendarHeader\");\n\n const inputValue = editedValue ?? displayValue;\n const localeFormat = dayjs().locale(locale).localeData().longDateFormat(\"L\");\n\n const [isValidValue, setIsValidValue] = useState(\n inputValue.length === 0 || (!!inputValue && dayjs(localValue).isValid())\n );\n\n const validateInput = (incomingValid) =>\n incomingValid === undefined || dayjs(incomingValid).isValid();\n useEffect(() => {\n const valid = validateInput(localValue);\n setIsValidValue(valid);\n if (valid) {\n if (!localValue) {\n setDisplayValue(\"\");\n setEditedValue(null);\n setWeekdayDisplay(\"\");\n return;\n }\n const weekday = new Intl.DateTimeFormat(locale, {\n weekday: \"short\",\n }).format(isDate(localValue) ? localValue : 0);\n setDisplayValue(formatToLocale(localValue, locale));\n setEditedValue(null);\n setWeekdayDisplay(weekday);\n }\n }, [localValue, locale]);\n\n const handleNewDate = (event, date) => {\n // attempt to format in locale data, or fallback to default\n const localeParsedDate = dayjs(date, localeFormat);\n\n const isValidInput = localeParsedDate.isValid();\n const dateParsed = isValidInput\n ? localeParsedDate.toDate()\n : dayjs(date).toDate();\n // prevent extra updates\n if (!isSameDay(dateParsed, dateValue)) {\n setDateValue(dateParsed);\n onChange?.(event, dateParsed);\n }\n\n setIsValidValue(isValidInput);\n if (isValidInput) {\n setEditedValue(null);\n }\n };\n\n const onBlurHandler = (event) => {\n if (isNil(editedValue)) return;\n if (editedValue === \"\") {\n setIsValidValue(true);\n setEditedValue(null);\n return;\n }\n handleNewDate(event, editedValue);\n };\n\n const keyDownHandler = (event) => {\n if (!isKeypress(event, Enter) || isNil(editedValue) || editedValue === \"\")\n return;\n event.preventDefault();\n\n handleNewDate(event, editedValue);\n };\n\n const onFocusHandler = (event) => {\n if (!localValue) return;\n const formattedDate =\n isValidValue && isDate(localValue)\n ? dayjs(localValue).locale(locale).format(\"L\")\n : editedValue;\n setEditedValue(formattedDate);\n onFocus?.(event, formattedDate);\n };\n\n const onChangeHandler = (event) => {\n setEditedValue(event.target.value);\n };\n return (\n <>\n <StyledRoot\n id={localId}\n className={clsx(\n calendarHeaderClasses.root,\n classes?.root,\n !isValidValue &&\n inputValue !== \"\" &&\n clsx(calendarHeaderClasses.invalid, classes?.invalid)\n )}\n >\n {showDayOfWeek && (\n <StyledHeaderDayOfWeek\n className={clsx(\n calendarHeaderClasses.headerDayOfWeek,\n classes?.headerDayOfWeek\n )}\n >\n {weekdayDisplay || \"\\u00A0\"}\n </StyledHeaderDayOfWeek>\n )}\n\n <div\n className={clsx(\n calendarHeaderClasses.headerDate,\n classes?.headerDate\n )}\n >\n <StyledInput\n type=\"text\"\n id={setId(localId, \"header-input\")}\n placeholder={localeFormat}\n value={inputValue}\n className={clsx(calendarHeaderClasses.input, classes?.input)}\n onBlur={onBlurHandler}\n onFocus={onFocusHandler}\n onChange={onChangeHandler}\n onKeyDown={keyDownHandler}\n aria-labelledby={label?.[0]?.id}\n {...others}\n />\n </div>\n </StyledRoot>\n {!isValidValue && inputValue !== \"\" && (\n <StyledInputBorderContainer\n role=\"presentation\"\n className={clsx(\n calendarHeaderClasses.inputBorderContainer,\n classes?.inputBorderContainer\n )}\n />\n )}\n <div style={{ height: 32 }}>\n {!isValidValue && inputValue !== \"\" && (\n <StyledTypography\n component=\"span\"\n variant=\"body\"\n className={clsx(\n calendarHeaderClasses.invalidMessageStyling,\n classes?.invalidMessageStyling\n )}\n >\n <Info color=\"brand\" iconSize=\"S\" />\n {invalidDateLabel}\n </StyledTypography>\n )}\n </div>\n </>\n );\n};\n\n// TODO: refactor this out\nHvCalendarHeader.formElementType = \"HvCalendarHeader\";\n\nexport interface HvCalendarHeaderProps {\n /**\n * A Jss Object used to override or extend the component styles.\n */\n classes?: HvCalendarHeaderClasses;\n /**\n * Identifier.\n */\n id?: string;\n /**\n * The text to be shown on the main part of the header.\n */\n value?: string | Date | DateRangeProp;\n /**\n * Locale to be used by the calendar.\n */\n locale?: string;\n /**\n * Callback to define the input date.\n */\n onChange?: (\n event:\n | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n | undefined,\n value: Date | DateRangeProp\n ) => void;\n /**\n * Callback to handle input onFocus.\n */\n onFocus?: (\n event: React.FocusEventHandler<any>,\n formattedDate: string | null\n ) => void;\n /**\n * Indicates if header should display end date in a date range.\n */\n showEndDate?: boolean;\n /**\n * Indicates if header should display the day of week.\n */\n showDayOfWeek?: boolean;\n /**\n * Label shown when date is invalid.\n */\n invalidDateLabel?: string;\n}\n"],"names":["dayjs","extend","localeData","localizedFormat","customParseFormat","Enter","keyboardCodes","HvCalendarHeader","id","value","locale","classes","onChange","showEndDate","showDayOfWeek","onFocus","invalidDateLabel","others","elementId","useContext","HvFormElementContext","elementValue","HvFormElementValueContext","label","HvFormElementDescriptorsContext","localValue","isRange","endDate","startDate","dateValue","setDateValue","useState","editedValue","setEditedValue","displayValue","setDisplayValue","weekdayDisplay","setWeekdayDisplay","localId","setId","inputValue","localeFormat","longDateFormat","isValidValue","setIsValidValue","length","isValid","validateInput","incomingValid","undefined","useEffect","valid","weekday","Intl","DateTimeFormat","format","isDate","formatToLocale","handleNewDate","event","date","localeParsedDate","isValidInput","dateParsed","toDate","isSameDay","onBlurHandler","isNil","keyDownHandler","isKeypress","preventDefault","onFocusHandler","formattedDate","onChangeHandler","target","_Fragment","children","_jsxs","StyledRoot","className","clsx","calendarHeaderClasses","root","invalid","_jsx","StyledHeaderDayOfWeek","headerDayOfWeek","headerDate","StyledInput","type","placeholder","input","onBlur","onKeyDown","StyledInputBorderContainer","role","inputBorderContainer","style","height","StyledTypography","component","variant","invalidMessageStyling","Info","color","iconSize","formElementType"],"mappings":"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"}
1
+ {"version":3,"file":"CalendarHeader.js","sources":["../../../../../src/components/Calendar/CalendarHeader/CalendarHeader.tsx"],"sourcesContent":["import { useState, useEffect, useContext } from \"react\";\nimport dayjs from \"dayjs\";\nimport localeData from \"dayjs/plugin/localeData\";\nimport localizedFormat from \"dayjs/plugin/localizedFormat\";\nimport customParseFormat from \"dayjs/plugin/customParseFormat\";\nimport { clsx } from \"clsx\";\nimport isNil from \"lodash/isNil\";\nimport {\n HvFormElementContext,\n HvFormElementValueContext,\n HvFormElementDescriptorsContext,\n} from \"@core/components\";\nimport { isKey, setId } from \"@core/utils\";\nimport { Info } from \"@hitachivantara/uikit-react-icons\";\nimport { isRange, isSameDay, formatToLocale, isDate } from \"../utils\";\nimport { DateRangeProp } from \"../Calendar\";\nimport calendarHeaderClasses, {\n HvCalendarHeaderClasses,\n} from \"./calendarHeaderClasses\";\nimport {\n StyledHeaderDayOfWeek,\n StyledInput,\n StyledInputBorderContainer,\n StyledRoot,\n StyledTypography,\n} from \"./CalendarHeader.styles\";\n\ndayjs.extend(localeData);\ndayjs.extend(localizedFormat);\ndayjs.extend(customParseFormat);\n\nexport const HvCalendarHeader = ({\n id,\n value,\n locale = \"en-US\",\n classes,\n onChange,\n showEndDate,\n showDayOfWeek = false,\n onFocus,\n invalidDateLabel = \"Invalid Date\",\n ...others\n}: HvCalendarHeaderProps) => {\n const { elementId } = useContext(HvFormElementContext);\n const elementValue = useContext(HvFormElementValueContext);\n const { label } = useContext(HvFormElementDescriptorsContext);\n\n let localValue: string | Date | DateRangeProp | undefined =\n value ?? elementValue ?? \"\";\n if (isRange(localValue)) {\n localValue = showEndDate ? localValue.endDate : localValue.startDate;\n }\n const [dateValue, setDateValue] = useState<\n string | Date | DateRangeProp | undefined\n >(localValue);\n const [editedValue, setEditedValue] = useState<string | null>(null);\n const [displayValue, setDisplayValue] = useState(\"\");\n const [weekdayDisplay, setWeekdayDisplay] = useState(\"\");\n\n const localId = id ?? setId(elementId, \"calendarHeader\");\n\n const inputValue = editedValue ?? displayValue;\n const localeFormat = dayjs().locale(locale).localeData().longDateFormat(\"L\");\n\n const [isValidValue, setIsValidValue] = useState(\n inputValue.length === 0 || (!!inputValue && dayjs(localValue).isValid())\n );\n\n const validateInput = (incomingValid) =>\n incomingValid === undefined || dayjs(incomingValid).isValid();\n useEffect(() => {\n const valid = validateInput(localValue);\n setIsValidValue(valid);\n if (valid) {\n if (!localValue) {\n setDisplayValue(\"\");\n setEditedValue(null);\n setWeekdayDisplay(\"\");\n return;\n }\n const weekday = new Intl.DateTimeFormat(locale, {\n weekday: \"short\",\n }).format(isDate(localValue) ? localValue : 0);\n setDisplayValue(formatToLocale(localValue, locale));\n setEditedValue(null);\n setWeekdayDisplay(weekday);\n }\n }, [localValue, locale]);\n\n const handleNewDate = (event, date) => {\n // attempt to format in locale data, or fallback to default\n const localeParsedDate = dayjs(date, localeFormat);\n\n const isValidInput = localeParsedDate.isValid();\n const dateParsed = isValidInput\n ? localeParsedDate.toDate()\n : dayjs(date).toDate();\n // prevent extra updates\n if (!isSameDay(dateParsed, dateValue)) {\n setDateValue(dateParsed);\n onChange?.(event, dateParsed);\n }\n\n setIsValidValue(isValidInput);\n if (isValidInput) {\n setEditedValue(null);\n }\n };\n\n const onBlurHandler = (event) => {\n if (isNil(editedValue)) return;\n if (editedValue === \"\") {\n setIsValidValue(true);\n setEditedValue(null);\n return;\n }\n handleNewDate(event, editedValue);\n };\n\n const keyDownHandler = (event) => {\n if (!isKey(event, \"Enter\") || isNil(editedValue) || editedValue === \"\")\n return;\n event.preventDefault();\n\n handleNewDate(event, editedValue);\n };\n\n const onFocusHandler = (event) => {\n if (!localValue) return;\n const formattedDate =\n isValidValue && isDate(localValue)\n ? dayjs(localValue).locale(locale).format(\"L\")\n : editedValue;\n setEditedValue(formattedDate);\n onFocus?.(event, formattedDate);\n };\n\n const onChangeHandler = (event) => {\n setEditedValue(event.target.value);\n };\n return (\n <>\n <StyledRoot\n id={localId}\n className={clsx(\n calendarHeaderClasses.root,\n classes?.root,\n !isValidValue &&\n inputValue !== \"\" &&\n clsx(calendarHeaderClasses.invalid, classes?.invalid)\n )}\n >\n {showDayOfWeek && (\n <StyledHeaderDayOfWeek\n className={clsx(\n calendarHeaderClasses.headerDayOfWeek,\n classes?.headerDayOfWeek\n )}\n >\n {weekdayDisplay || \"\\u00A0\"}\n </StyledHeaderDayOfWeek>\n )}\n\n <div\n className={clsx(\n calendarHeaderClasses.headerDate,\n classes?.headerDate\n )}\n >\n <StyledInput\n type=\"text\"\n id={setId(localId, \"header-input\")}\n placeholder={localeFormat}\n value={inputValue}\n className={clsx(calendarHeaderClasses.input, classes?.input)}\n onBlur={onBlurHandler}\n onFocus={onFocusHandler}\n onChange={onChangeHandler}\n onKeyDown={keyDownHandler}\n aria-labelledby={label?.[0]?.id}\n {...others}\n />\n </div>\n </StyledRoot>\n {!isValidValue && inputValue !== \"\" && (\n <StyledInputBorderContainer\n role=\"presentation\"\n className={clsx(\n calendarHeaderClasses.inputBorderContainer,\n classes?.inputBorderContainer\n )}\n />\n )}\n <div style={{ height: 32 }}>\n {!isValidValue && inputValue !== \"\" && (\n <StyledTypography\n component=\"span\"\n variant=\"body\"\n className={clsx(\n calendarHeaderClasses.invalidMessageStyling,\n classes?.invalidMessageStyling\n )}\n >\n <Info color=\"brand\" iconSize=\"S\" />\n {invalidDateLabel}\n </StyledTypography>\n )}\n </div>\n </>\n );\n};\n\n// TODO: refactor this out\nHvCalendarHeader.formElementType = \"HvCalendarHeader\";\n\nexport interface HvCalendarHeaderProps {\n /**\n * A Jss Object used to override or extend the component styles.\n */\n classes?: HvCalendarHeaderClasses;\n /**\n * Identifier.\n */\n id?: string;\n /**\n * The text to be shown on the main part of the header.\n */\n value?: string | Date | DateRangeProp;\n /**\n * Locale to be used by the calendar.\n */\n locale?: string;\n /**\n * Callback to define the input date.\n */\n onChange?: (\n event:\n | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n | undefined,\n value: Date | DateRangeProp\n ) => void;\n /**\n * Callback to handle input onFocus.\n */\n onFocus?: (\n event: React.FocusEventHandler<any>,\n formattedDate: string | null\n ) => void;\n /**\n * Indicates if header should display end date in a date range.\n */\n showEndDate?: boolean;\n /**\n * Indicates if header should display the day of week.\n */\n showDayOfWeek?: boolean;\n /**\n * Label shown when date is invalid.\n */\n invalidDateLabel?: string;\n}\n"],"names":["dayjs","extend","localeData","localizedFormat","customParseFormat","HvCalendarHeader","id","value","locale","classes","onChange","showEndDate","showDayOfWeek","onFocus","invalidDateLabel","others","elementId","useContext","HvFormElementContext","elementValue","HvFormElementValueContext","label","HvFormElementDescriptorsContext","localValue","isRange","endDate","startDate","dateValue","setDateValue","useState","editedValue","setEditedValue","displayValue","setDisplayValue","weekdayDisplay","setWeekdayDisplay","localId","setId","inputValue","localeFormat","longDateFormat","isValidValue","setIsValidValue","length","isValid","validateInput","incomingValid","undefined","useEffect","valid","weekday","Intl","DateTimeFormat","format","isDate","formatToLocale","handleNewDate","event","date","localeParsedDate","isValidInput","dateParsed","toDate","isSameDay","onBlurHandler","isNil","keyDownHandler","isKey","preventDefault","onFocusHandler","formattedDate","onChangeHandler","target","_Fragment","children","_jsxs","StyledRoot","className","clsx","calendarHeaderClasses","root","invalid","_jsx","StyledHeaderDayOfWeek","headerDayOfWeek","headerDate","StyledInput","type","placeholder","input","onBlur","onKeyDown","StyledInputBorderContainer","role","inputBorderContainer","style","height","StyledTypography","component","variant","invalidMessageStyling","Info","color","iconSize","formElementType"],"mappings":"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"}
@@ -3,8 +3,7 @@ import { getMonthNamesList } from "../../utils.js";
3
3
  import monthSelectorClasses from "./monthSelectorClasses.js";
4
4
  import { StyledCalendarMonthlyGrid, StyledFocusSelection, StyledCalendarMonthlyCell } from "./MonthSelector.styles.js";
5
5
  import { jsx } from "@emotion/react/jsx-runtime";
6
- import { isKeypress } from "../../../../utils/keyboardUtils/keyCheck.js";
7
- import { keyboardCodes } from "../../../../utils/keyboardUtils/keyboardCodes.js";
6
+ import { isKey } from "../../../../utils/keyboardUtils.js";
8
7
  const HvMonthSelector = ({
9
8
  classes,
10
9
  id,
@@ -17,7 +16,7 @@ const HvMonthSelector = ({
17
16
  }) => {
18
17
  const listMonthNamesShort = getMonthNamesList(locale, "short");
19
18
  const onKeyDownHandler = (event, index) => {
20
- if (isKeypress(event, keyboardCodes.Enter)) {
19
+ if (isKey(event, "Enter")) {
21
20
  onChange == null ? void 0 : onChange(event, "month", index + 1);
22
21
  onViewModeChange("calendar");
23
22
  }
@@ -1 +1 @@
1
- {"version":3,"file":"MonthSelector.js","sources":["../../../../../../src/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { isKeypress, keyboardCodes } from \"@core/utils\";\nimport { getMonthNamesList } from \"../../utils\";\nimport { ViewMode } from \"../../enums\";\nimport monthSelectorClasses, {\n HvMonthSelectorClasses,\n} from \"./monthSelectorClasses\";\nimport {\n StyledCalendarMonthlyCell,\n StyledCalendarMonthlyGrid,\n StyledFocusSelection,\n} from \"./MonthSelector.styles\";\nimport { DateRangeProp, VisibilitySelectorActions } from \"../../Calendar\";\n\nexport const HvMonthSelector = ({\n classes,\n id,\n locale,\n onChange,\n onViewModeChange,\n rangeMode,\n visibleMonth,\n ...others\n}: HvMonthSelectorProps) => {\n const listMonthNamesShort = getMonthNamesList(locale, \"short\");\n const onKeyDownHandler = (event, index) => {\n if (isKeypress(event, keyboardCodes.Enter)) {\n onChange?.(event, \"month\", index + 1);\n onViewModeChange(\"calendar\");\n }\n };\n return (\n <StyledCalendarMonthlyGrid\n className={clsx(\n monthSelectorClasses.calendarMonthlyGrid,\n classes?.calendarMonthlyGrid,\n rangeMode\n ? clsx(monthSelectorClasses.rangeModeWidth, classes?.rangeModeWidth)\n : clsx(monthSelectorClasses.normalWidth, classes?.normalWidth)\n )}\n >\n {listMonthNamesShort.map((monthName, index) => (\n <StyledFocusSelection\n className={clsx(\n monthSelectorClasses.focusSelection,\n classes?.focusSelection\n )}\n key={monthName}\n role=\"button\"\n onClick={(event) => {\n onChange?.(event, \"month\", index + 1);\n onViewModeChange(\"calendar\");\n }}\n onKeyDown={(event) => onKeyDownHandler(event, index)}\n tabIndex={0}\n {...others}\n >\n <StyledCalendarMonthlyCell\n className={clsx(\n monthSelectorClasses.calendarMonthlyCell,\n classes?.calendarMonthlyCell,\n index + 1 === visibleMonth &&\n clsx(\n monthSelectorClasses.calendarMonthlyCellSelected,\n classes?.calendarMonthlyCellSelected\n )\n )}\n >\n {monthName}\n </StyledCalendarMonthlyCell>\n </StyledFocusSelection>\n ))}\n </StyledCalendarMonthlyGrid>\n );\n};\n\nexport interface HvMonthSelectorProps {\n /**\n * A Jss Object used to override or extend the component styles.\n */\n classes?: HvMonthSelectorClasses;\n /**\n * Identifier.\n */\n id?: string;\n /**\n * Locale to be used by the calendar.\n */\n locale?: string;\n /**\n * Callback to define the input date.\n */\n onChange?: (\n event: any,\n action: VisibilitySelectorActions,\n value: Date | DateRangeProp | number\n ) => void;\n /**\n * Callback to define the input date.\n */\n onViewModeChange: (viewMode: ViewMode) => void;\n /**\n * Controls the visible month of the Calendar\n */\n visibleMonth: number;\n /**\n * Controls the visible month of the Calendar\n */\n visibleYear?: number;\n rangeMode?: boolean;\n}\n"],"names":["HvMonthSelector","classes","id","locale","onChange","onViewModeChange","rangeMode","visibleMonth","others","listMonthNamesShort","getMonthNamesList","onKeyDownHandler","event","index","isKeypress","keyboardCodes","Enter","StyledCalendarMonthlyGrid","className","clsx","monthSelectorClasses","calendarMonthlyGrid","rangeModeWidth","normalWidth","children","map","monthName","StyledFocusSelection","focusSelection","role","onClick","onKeyDown","tabIndex","StyledCalendarMonthlyCell","calendarMonthlyCell","calendarMonthlyCellSelected"],"mappings":";;;;;;;AAcO,MAAMA,kBAAkBA,CAAC;AAAA,EAC9BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACiB,MAAM;AACpBC,QAAAA,sBAAsBC,kBAAkBP,QAAQ,OAAO;AACvDQ,QAAAA,mBAAmBA,CAACC,OAAOC,UAAU;AACzC,QAAIC,WAAWF,OAAOG,cAAcC,KAAK,GAAG;AAC/BJ,2CAAAA,OAAO,SAASC,QAAQ;AACnCR,uBAAiB,UAAU;AAAA,IAC7B;AAAA,EAAA;AAEF,6BACGY,2BAAyB;AAAA,IACxBC,WAAWC,KACTC,qBAAqBC,qBACrBpB,mCAASoB,qBACTf,YACIa,KAAKC,qBAAqBE,gBAAgBrB,mCAASqB,cAAc,IACjEH,KAAKC,qBAAqBG,aAAatB,mCAASsB,WAAW,CACjE;AAAA,IAAEC,UAEDf,oBAAoBgB,IAAI,CAACC,WAAWb,8BAClCc,sBAAoB;AAAA,MACnBT,WAAWC,KACTC,qBAAqBQ,gBACrB3B,mCAAS2B,cACX;AAAA,MAEAC,MAAK;AAAA,MACLC,SAAUlB,CAAU,UAAA;AACPA,6CAAAA,OAAO,SAASC,QAAQ;AACnCR,yBAAiB,UAAU;AAAA,MAC7B;AAAA,MACA0B,WAAYnB,CAAAA,UAAUD,iBAAiBC,OAAOC,KAAK;AAAA,MACnDmB,UAAU;AAAA,MAAE,GACRxB;AAAAA,MAAMgB,8BAETS,2BAAyB;AAAA,QACxBf,WAAWC,KACTC,qBAAqBc,qBACrBjC,mCAASiC,qBACTrB,QAAQ,MAAMN,gBACZY,KACEC,qBAAqBe,6BACrBlC,mCAASkC,2BACX,CACJ;AAAA,QAAEX,UAEDE;AAAAA,MAAAA,CACwB;AAAA,IAAC,GAtBvBA,SAuBe,CACvB;AAAA,EAAA,CACwB;AAE/B;"}
1
+ {"version":3,"file":"MonthSelector.js","sources":["../../../../../../src/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { isKey } from \"@core/utils\";\nimport { getMonthNamesList } from \"../../utils\";\nimport { ViewMode } from \"../../enums\";\nimport monthSelectorClasses, {\n HvMonthSelectorClasses,\n} from \"./monthSelectorClasses\";\nimport {\n StyledCalendarMonthlyCell,\n StyledCalendarMonthlyGrid,\n StyledFocusSelection,\n} from \"./MonthSelector.styles\";\nimport { DateRangeProp, VisibilitySelectorActions } from \"../../Calendar\";\n\nexport const HvMonthSelector = ({\n classes,\n id,\n locale,\n onChange,\n onViewModeChange,\n rangeMode,\n visibleMonth,\n ...others\n}: HvMonthSelectorProps) => {\n const listMonthNamesShort = getMonthNamesList(locale, \"short\");\n const onKeyDownHandler = (event, index) => {\n if (isKey(event, \"Enter\")) {\n onChange?.(event, \"month\", index + 1);\n onViewModeChange(\"calendar\");\n }\n };\n return (\n <StyledCalendarMonthlyGrid\n className={clsx(\n monthSelectorClasses.calendarMonthlyGrid,\n classes?.calendarMonthlyGrid,\n rangeMode\n ? clsx(monthSelectorClasses.rangeModeWidth, classes?.rangeModeWidth)\n : clsx(monthSelectorClasses.normalWidth, classes?.normalWidth)\n )}\n >\n {listMonthNamesShort.map((monthName, index) => (\n <StyledFocusSelection\n className={clsx(\n monthSelectorClasses.focusSelection,\n classes?.focusSelection\n )}\n key={monthName}\n role=\"button\"\n onClick={(event) => {\n onChange?.(event, \"month\", index + 1);\n onViewModeChange(\"calendar\");\n }}\n onKeyDown={(event) => onKeyDownHandler(event, index)}\n tabIndex={0}\n {...others}\n >\n <StyledCalendarMonthlyCell\n className={clsx(\n monthSelectorClasses.calendarMonthlyCell,\n classes?.calendarMonthlyCell,\n index + 1 === visibleMonth &&\n clsx(\n monthSelectorClasses.calendarMonthlyCellSelected,\n classes?.calendarMonthlyCellSelected\n )\n )}\n >\n {monthName}\n </StyledCalendarMonthlyCell>\n </StyledFocusSelection>\n ))}\n </StyledCalendarMonthlyGrid>\n );\n};\n\nexport interface HvMonthSelectorProps {\n /**\n * A Jss Object used to override or extend the component styles.\n */\n classes?: HvMonthSelectorClasses;\n /**\n * Identifier.\n */\n id?: string;\n /**\n * Locale to be used by the calendar.\n */\n locale?: string;\n /**\n * Callback to define the input date.\n */\n onChange?: (\n event: any,\n action: VisibilitySelectorActions,\n value: Date | DateRangeProp | number\n ) => void;\n /**\n * Callback to define the input date.\n */\n onViewModeChange: (viewMode: ViewMode) => void;\n /**\n * Controls the visible month of the Calendar\n */\n visibleMonth: number;\n /**\n * Controls the visible month of the Calendar\n */\n visibleYear?: number;\n rangeMode?: boolean;\n}\n"],"names":["HvMonthSelector","classes","id","locale","onChange","onViewModeChange","rangeMode","visibleMonth","others","listMonthNamesShort","getMonthNamesList","onKeyDownHandler","event","index","isKey","StyledCalendarMonthlyGrid","className","clsx","monthSelectorClasses","calendarMonthlyGrid","rangeModeWidth","normalWidth","children","map","monthName","StyledFocusSelection","focusSelection","role","onClick","onKeyDown","tabIndex","StyledCalendarMonthlyCell","calendarMonthlyCell","calendarMonthlyCellSelected"],"mappings":";;;;;;AAcO,MAAMA,kBAAkBA,CAAC;AAAA,EAC9BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACiB,MAAM;AACpBC,QAAAA,sBAAsBC,kBAAkBP,QAAQ,OAAO;AACvDQ,QAAAA,mBAAmBA,CAACC,OAAOC,UAAU;AACrCC,QAAAA,MAAMF,OAAO,OAAO,GAAG;AACdA,2CAAAA,OAAO,SAASC,QAAQ;AACnCR,uBAAiB,UAAU;AAAA,IAC7B;AAAA,EAAA;AAEF,6BACGU,2BAAyB;AAAA,IACxBC,WAAWC,KACTC,qBAAqBC,qBACrBlB,mCAASkB,qBACTb,YACIW,KAAKC,qBAAqBE,gBAAgBnB,mCAASmB,cAAc,IACjEH,KAAKC,qBAAqBG,aAAapB,mCAASoB,WAAW,CACjE;AAAA,IAAEC,UAEDb,oBAAoBc,IAAI,CAACC,WAAWX,8BAClCY,sBAAoB;AAAA,MACnBT,WAAWC,KACTC,qBAAqBQ,gBACrBzB,mCAASyB,cACX;AAAA,MAEAC,MAAK;AAAA,MACLC,SAAUhB,CAAU,UAAA;AACPA,6CAAAA,OAAO,SAASC,QAAQ;AACnCR,yBAAiB,UAAU;AAAA,MAC7B;AAAA,MACAwB,WAAYjB,CAAAA,UAAUD,iBAAiBC,OAAOC,KAAK;AAAA,MACnDiB,UAAU;AAAA,MAAE,GACRtB;AAAAA,MAAMc,8BAETS,2BAAyB;AAAA,QACxBf,WAAWC,KACTC,qBAAqBc,qBACrB/B,mCAAS+B,qBACTnB,QAAQ,MAAMN,gBACZU,KACEC,qBAAqBe,6BACrBhC,mCAASgC,2BACX,CACJ;AAAA,QAAEX,UAEDE;AAAAA,MAAAA,CACwB;AAAA,IAAC,GAtBvBA,SAuBe,CACvB;AAAA,EAAA,CACwB;AAE/B;"}
@@ -4,8 +4,7 @@ import navigationClasses from "./navigationClasses.js";
4
4
  import { jsxs, jsx } from "@emotion/react/jsx-runtime";
5
5
  import { setId } from "../../../../utils/setId.js";
6
6
  import { HvTypography } from "../../../Typography/Typography.js";
7
- import { isKeypress } from "../../../../utils/keyboardUtils/keyCheck.js";
8
- import { keyboardCodes } from "../../../../utils/keyboardUtils/keyboardCodes.js";
7
+ import { isKey } from "../../../../utils/keyboardUtils.js";
9
8
  const Navigation = ({
10
9
  id,
11
10
  classes,
@@ -17,7 +16,7 @@ const Navigation = ({
17
16
  isNextEnabled = true
18
17
  }) => {
19
18
  const onkeyDownHandler = (event, funcAction) => {
20
- if (isKeypress(event, keyboardCodes.Enter) || isKeypress(event, keyboardCodes.Space)) {
19
+ if (isKey(event, "Enter") || isKey(event, "Space")) {
21
20
  event.preventDefault();
22
21
  funcAction(event);
23
22
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Navigation.js","sources":["../../../../../../src/components/Calendar/CalendarNavigation/Navigation/Navigation.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { isKeypress, keyboardCodes, setId } from \"@core/utils\";\nimport { HvTypography } from \"@core/components\";\nimport { HvBaseProps } from \"@core/types\";\nimport {\n StyledDropLeftIcon,\n StyledDropRightIcon,\n StyledRoot,\n StyledText,\n} from \"./Navigation.styles\";\nimport navigationClasses, { HvNavigationClasses } from \"./navigationClasses\";\n\nexport const Navigation = ({\n id,\n classes,\n onNavigatePrevious,\n onNavigateNext,\n onTextClick,\n navigationText = \"n/a\",\n isPreviousEnabled = true,\n isNextEnabled = true,\n}: NavigationProps) => {\n const onkeyDownHandler = (event, funcAction) => {\n if (\n isKeypress(event, keyboardCodes.Enter) ||\n isKeypress(event, keyboardCodes.Space)\n ) {\n event.preventDefault();\n funcAction(event);\n }\n };\n\n const onTextClickIsFunction = typeof onTextClick === \"function\";\n\n return (\n <StyledRoot className={clsx(navigationClasses.root, classes?.root)}>\n <StyledDropLeftIcon\n id={setId(id, \"left\")}\n className={clsx(\n navigationClasses.icon,\n classes?.icon,\n !isPreviousEnabled &&\n clsx(navigationClasses.disabled, classes?.disabled)\n )}\n onClick={\n isPreviousEnabled ? (event) => onNavigatePrevious(event) : undefined\n }\n onKeyDown={(event) =>\n isNextEnabled\n ? onkeyDownHandler(event, onNavigatePrevious)\n : undefined\n }\n tabIndex={0}\n />\n\n <StyledText\n id={id}\n className={clsx(\n onTextClickIsFunction && clsx(navigationClasses.text, classes?.text),\n !onTextClickIsFunction &&\n clsx(navigationClasses.textWithoutHover, classes?.textWithoutHover)\n )}\n role=\"presentation\"\n onClick={onTextClick}\n onKeyDown={\n onTextClick && ((event) => onkeyDownHandler(event, onTextClick))\n }\n tabIndex={onTextClick ? 0 : -1}\n >\n <HvTypography variant=\"body\">{navigationText}</HvTypography>\n </StyledText>\n\n <StyledDropRightIcon\n id={setId(id, \"right\")}\n className={`${clsx(navigationClasses.icon, classes?.icon)} ${\n isNextEnabled\n ? \"\"\n : clsx(navigationClasses.disabled, classes?.disabled)\n }`}\n onClick={isNextEnabled ? (event) => onNavigateNext(event) : undefined}\n onKeyDown={(event) =>\n isNextEnabled ? onkeyDownHandler(event, onNavigateNext) : undefined\n }\n tabIndex={0}\n />\n </StyledRoot>\n );\n};\n\nexport interface NavigationProps extends HvBaseProps {\n /**\n * Identifier.\n */\n id?: string;\n /**\n * A Jss Object used to override or extend the component styles.\n */\n classes?: HvNavigationClasses;\n /**\n * A function to be executed whenever the navigate previous action is triggered.\n */\n onNavigatePrevious: (event: React.MouseEvent<HTMLDivElement>) => void;\n /**\n * A function to be executed whenever the navigate next action is triggered.\n */\n onNavigateNext: (event: React.MouseEvent<HTMLDivElement>) => void;\n /**\n * A function to be executed whenever the text is clicked.\n */\n onTextClick?: () => void;\n /**\n * The text that will be shown between the navigation buttons.\n */\n navigationText?: string;\n /**\n * Flag stating if the previous button should be enabled or disabled.\n */\n isPreviousEnabled?: boolean;\n /**\n * Flag stating if the next button should be enabled or disabled.\n */\n isNextEnabled?: boolean;\n}\n"],"names":["Navigation","id","classes","onNavigatePrevious","onNavigateNext","onTextClick","navigationText","isPreviousEnabled","isNextEnabled","onkeyDownHandler","event","funcAction","isKeypress","keyboardCodes","Enter","Space","preventDefault","onTextClickIsFunction","StyledRoot","className","clsx","navigationClasses","root","children","_jsx","StyledDropLeftIcon","setId","icon","disabled","onClick","undefined","onKeyDown","tabIndex","StyledText","text","textWithoutHover","role","HvTypography","variant","StyledDropRightIcon"],"mappings":";;;;;;;;AAYO,MAAMA,aAAaA,CAAC;AAAA,EACzBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,iBAAiB;AAAA,EACjBC,oBAAoB;AAAA,EACpBC,gBAAgB;AACD,MAAM;AACfC,QAAAA,mBAAmBA,CAACC,OAAOC,eAAe;AAE5CC,QAAAA,WAAWF,OAAOG,cAAcC,KAAK,KACrCF,WAAWF,OAAOG,cAAcE,KAAK,GACrC;AACAL,YAAMM,eAAe;AACrBL,iBAAWD,KAAK;AAAA,IAClB;AAAA,EAAA;AAGIO,QAAAA,wBAAwB,OAAOZ,gBAAgB;AAErD,8BACGa,YAAU;AAAA,IAACC,WAAWC,KAAKC,kBAAkBC,MAAMpB,mCAASoB,IAAI;AAAA,IAAEC,UAAA,CACjEC,oBAACC,oBAAkB;AAAA,MACjBxB,IAAIyB,MAAMzB,IAAI,MAAM;AAAA,MACpBkB,WAAWC,KACTC,kBAAkBM,MAClBzB,mCAASyB,MACT,CAACpB,qBACCa,KAAKC,kBAAkBO,UAAU1B,mCAAS0B,QAAQ,CACtD;AAAA,MACAC,SACEtB,oBAAqBG,CAAUP,UAAAA,mBAAmBO,KAAK,IAAIoB;AAAAA,MAE7DC,WAAYrB,CACVF,UAAAA,gBACIC,iBAAiBC,OAAOP,kBAAkB,IAC1C2B;AAAAA,MAENE,UAAU;AAAA,IAAA,CACX,GAEDR,oBAACS,YAAU;AAAA,MACThC;AAAAA,MACAkB,WAAWC,KACTH,yBAAyBG,KAAKC,kBAAkBa,MAAMhC,mCAASgC,IAAI,GACnE,CAACjB,yBACCG,KAAKC,kBAAkBc,kBAAkBjC,mCAASiC,gBAAgB,CACtE;AAAA,MACAC,MAAK;AAAA,MACLP,SAASxB;AAAAA,MACT0B,WACE1B,gBAAiBK,CAAUD,UAAAA,iBAAiBC,OAAOL,WAAW;AAAA,MAEhE2B,UAAU3B,cAAc,IAAI;AAAA,MAAGkB,8BAE9Bc,cAAY;AAAA,QAACC,SAAQ;AAAA,QAAMf,UAAEjB;AAAAA,MAAAA,CAA6B;AAAA,IAAA,CACjD,GAEZkB,oBAACe,qBAAmB;AAAA,MAClBtC,IAAIyB,MAAMzB,IAAI,OAAO;AAAA,MACrBkB,WAAY,GAAEC,KAAKC,kBAAkBM,MAAMzB,mCAASyB,IAAI,KACtDnB,gBACI,KACAY,KAAKC,kBAAkBO,UAAU1B,mCAAS0B,QAAQ;AAAA,MAExDC,SAASrB,gBAAiBE,CAAUN,UAAAA,eAAeM,KAAK,IAAIoB;AAAAA,MAC5DC,WAAYrB,CACVF,UAAAA,gBAAgBC,iBAAiBC,OAAON,cAAc,IAAI0B;AAAAA,MAE5DE,UAAU;AAAA,IAAA,CACX,CAAC;AAAA,EAAA,CACQ;AAEhB;"}
1
+ {"version":3,"file":"Navigation.js","sources":["../../../../../../src/components/Calendar/CalendarNavigation/Navigation/Navigation.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { isKey, setId } from \"@core/utils\";\nimport { HvTypography } from \"@core/components\";\nimport { HvBaseProps } from \"@core/types\";\nimport {\n StyledDropLeftIcon,\n StyledDropRightIcon,\n StyledRoot,\n StyledText,\n} from \"./Navigation.styles\";\nimport navigationClasses, { HvNavigationClasses } from \"./navigationClasses\";\n\nexport const Navigation = ({\n id,\n classes,\n onNavigatePrevious,\n onNavigateNext,\n onTextClick,\n navigationText = \"n/a\",\n isPreviousEnabled = true,\n isNextEnabled = true,\n}: NavigationProps) => {\n const onkeyDownHandler = (event, funcAction) => {\n if (isKey(event, \"Enter\") || isKey(event, \"Space\")) {\n event.preventDefault();\n funcAction(event);\n }\n };\n\n const onTextClickIsFunction = typeof onTextClick === \"function\";\n\n return (\n <StyledRoot className={clsx(navigationClasses.root, classes?.root)}>\n <StyledDropLeftIcon\n id={setId(id, \"left\")}\n className={clsx(\n navigationClasses.icon,\n classes?.icon,\n !isPreviousEnabled &&\n clsx(navigationClasses.disabled, classes?.disabled)\n )}\n onClick={\n isPreviousEnabled ? (event) => onNavigatePrevious(event) : undefined\n }\n onKeyDown={(event) =>\n isNextEnabled\n ? onkeyDownHandler(event, onNavigatePrevious)\n : undefined\n }\n tabIndex={0}\n />\n\n <StyledText\n id={id}\n className={clsx(\n onTextClickIsFunction && clsx(navigationClasses.text, classes?.text),\n !onTextClickIsFunction &&\n clsx(navigationClasses.textWithoutHover, classes?.textWithoutHover)\n )}\n role=\"presentation\"\n onClick={onTextClick}\n onKeyDown={\n onTextClick && ((event) => onkeyDownHandler(event, onTextClick))\n }\n tabIndex={onTextClick ? 0 : -1}\n >\n <HvTypography variant=\"body\">{navigationText}</HvTypography>\n </StyledText>\n\n <StyledDropRightIcon\n id={setId(id, \"right\")}\n className={`${clsx(navigationClasses.icon, classes?.icon)} ${\n isNextEnabled\n ? \"\"\n : clsx(navigationClasses.disabled, classes?.disabled)\n }`}\n onClick={isNextEnabled ? (event) => onNavigateNext(event) : undefined}\n onKeyDown={(event) =>\n isNextEnabled ? onkeyDownHandler(event, onNavigateNext) : undefined\n }\n tabIndex={0}\n />\n </StyledRoot>\n );\n};\n\nexport interface NavigationProps extends HvBaseProps {\n /**\n * Identifier.\n */\n id?: string;\n /**\n * A Jss Object used to override or extend the component styles.\n */\n classes?: HvNavigationClasses;\n /**\n * A function to be executed whenever the navigate previous action is triggered.\n */\n onNavigatePrevious: (event: React.MouseEvent<HTMLDivElement>) => void;\n /**\n * A function to be executed whenever the navigate next action is triggered.\n */\n onNavigateNext: (event: React.MouseEvent<HTMLDivElement>) => void;\n /**\n * A function to be executed whenever the text is clicked.\n */\n onTextClick?: () => void;\n /**\n * The text that will be shown between the navigation buttons.\n */\n navigationText?: string;\n /**\n * Flag stating if the previous button should be enabled or disabled.\n */\n isPreviousEnabled?: boolean;\n /**\n * Flag stating if the next button should be enabled or disabled.\n */\n isNextEnabled?: boolean;\n}\n"],"names":["Navigation","id","classes","onNavigatePrevious","onNavigateNext","onTextClick","navigationText","isPreviousEnabled","isNextEnabled","onkeyDownHandler","event","funcAction","isKey","preventDefault","onTextClickIsFunction","StyledRoot","className","clsx","navigationClasses","root","children","_jsx","StyledDropLeftIcon","setId","icon","disabled","onClick","undefined","onKeyDown","tabIndex","StyledText","text","textWithoutHover","role","HvTypography","variant","StyledDropRightIcon"],"mappings":";;;;;;;AAYO,MAAMA,aAAaA,CAAC;AAAA,EACzBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,iBAAiB;AAAA,EACjBC,oBAAoB;AAAA,EACpBC,gBAAgB;AACD,MAAM;AACfC,QAAAA,mBAAmBA,CAACC,OAAOC,eAAe;AAC9C,QAAIC,MAAMF,OAAO,OAAO,KAAKE,MAAMF,OAAO,OAAO,GAAG;AAClDA,YAAMG,eAAe;AACrBF,iBAAWD,KAAK;AAAA,IAClB;AAAA,EAAA;AAGII,QAAAA,wBAAwB,OAAOT,gBAAgB;AAErD,8BACGU,YAAU;AAAA,IAACC,WAAWC,KAAKC,kBAAkBC,MAAMjB,mCAASiB,IAAI;AAAA,IAAEC,UAAA,CACjEC,oBAACC,oBAAkB;AAAA,MACjBrB,IAAIsB,MAAMtB,IAAI,MAAM;AAAA,MACpBe,WAAWC,KACTC,kBAAkBM,MAClBtB,mCAASsB,MACT,CAACjB,qBACCU,KAAKC,kBAAkBO,UAAUvB,mCAASuB,QAAQ,CACtD;AAAA,MACAC,SACEnB,oBAAqBG,CAAUP,UAAAA,mBAAmBO,KAAK,IAAIiB;AAAAA,MAE7DC,WAAYlB,CACVF,UAAAA,gBACIC,iBAAiBC,OAAOP,kBAAkB,IAC1CwB;AAAAA,MAENE,UAAU;AAAA,IAAA,CACX,GAEDR,oBAACS,YAAU;AAAA,MACT7B;AAAAA,MACAe,WAAWC,KACTH,yBAAyBG,KAAKC,kBAAkBa,MAAM7B,mCAAS6B,IAAI,GACnE,CAACjB,yBACCG,KAAKC,kBAAkBc,kBAAkB9B,mCAAS8B,gBAAgB,CACtE;AAAA,MACAC,MAAK;AAAA,MACLP,SAASrB;AAAAA,MACTuB,WACEvB,gBAAiBK,CAAUD,UAAAA,iBAAiBC,OAAOL,WAAW;AAAA,MAEhEwB,UAAUxB,cAAc,IAAI;AAAA,MAAGe,8BAE9Bc,cAAY;AAAA,QAACC,SAAQ;AAAA,QAAMf,UAAEd;AAAAA,MAAAA,CAA6B;AAAA,IAAA,CACjD,GAEZe,oBAACe,qBAAmB;AAAA,MAClBnC,IAAIsB,MAAMtB,IAAI,OAAO;AAAA,MACrBe,WAAY,GAAEC,KAAKC,kBAAkBM,MAAMtB,mCAASsB,IAAI,KACtDhB,gBACI,KACAS,KAAKC,kBAAkBO,UAAUvB,mCAASuB,QAAQ;AAAA,MAExDC,SAASlB,gBAAiBE,CAAUN,UAAAA,eAAeM,KAAK,IAAIiB;AAAAA,MAC5DC,WAAYlB,CACVF,UAAAA,gBAAgBC,iBAAiBC,OAAON,cAAc,IAAIuB;AAAAA,MAE5DE,UAAU;AAAA,IAAA,CACX,CAAC;AAAA,EAAA,CACQ;AAEhB;"}
@@ -12,15 +12,7 @@ import { HvComposedNavigation } from "../CalendarNavigation/ComposedNavigation/C
12
12
  import { HvCalendarWeekLabel } from "../CalendarWeekLabels/CalendarWeekLabels.js";
13
13
  import { HvMonthSelector } from "../CalendarNavigation/MonthSelector/MonthSelector.js";
14
14
  import { setId } from "../../../utils/setId.js";
15
- import { isKeypress } from "../../../utils/keyboardUtils/keyCheck.js";
16
- import { keyboardCodes } from "../../../utils/keyboardUtils/keyboardCodes.js";
17
- const {
18
- Enter,
19
- ArrowLeft,
20
- ArrowRight,
21
- ArrowUp,
22
- ArrowDown
23
- } = keyboardCodes;
15
+ import { isKey } from "../../../utils/keyboardUtils.js";
24
16
  const HvSingleCalendar = ({
25
17
  classes,
26
18
  className,
@@ -59,13 +51,13 @@ const HvSingleCalendar = ({
59
51
  onInputChange == null ? void 0 : onInputChange(event, date);
60
52
  };
61
53
  const getNavChild = (event, siblings, i) => {
62
- if (isKeypress(event, ArrowLeft))
54
+ if (isKey(event, "ArrowLeft"))
63
55
  return siblings[i - 1];
64
- if (isKeypress(event, ArrowRight))
56
+ if (isKey(event, "ArrowRight"))
65
57
  return siblings[i + 1];
66
- if (isKeypress(event, ArrowUp))
58
+ if (isKey(event, "ArrowUp"))
67
59
  return siblings[i - 7];
68
- if (isKeypress(event, ArrowDown))
60
+ if (isKey(event, "ArrowDown"))
69
61
  return siblings[i + 7];
70
62
  return void 0;
71
63
  };
@@ -75,7 +67,7 @@ const HvSingleCalendar = ({
75
67
  const parent = (_a2 = el == null ? void 0 : el.parentElement) == null ? void 0 : _a2.parentElement;
76
68
  const siblings = parent != null ? Array.from(parent.getElementsByClassName(singleCalendarClasses.cellContainer)) : [];
77
69
  const elIndex = el ? siblings.indexOf(el) : 0;
78
- if (isKeypress(event, Enter)) {
70
+ if (isKey(event, "Enter")) {
79
71
  el.focus();
80
72
  return;
81
73
  }
@@ -1 +1 @@
1
- {"version":3,"file":"SingleCalendar.js","sources":["../../../../../src/components/Calendar/SingleCalendar/SingleCalendar.tsx"],"sourcesContent":["import { useState, useMemo } from \"react\";\nimport { clsx } from \"clsx\";\nimport isNil from \"lodash/isNil\";\nimport { setId, keyboardCodes, isKeypress } from \"@core/utils\";\nimport { ViewMode } from \"../enums\";\nimport { isRange, isDate, getWeekdayNamesList } from \"../utils\";\nimport { generateCalendarModel } from \"../model\";\nimport { HvComposedNavigation, HvMonthSelector } from \"../CalendarNavigation\";\nimport { DateRangeProp, VisibilitySelectorActions } from \"..\";\nimport {\n StyledCalendarContainer,\n StyledCalendarGrid,\n StyledCalendarWrapper,\n} from \"./SingleCalendar.styles\";\nimport singleCalendarClasses, {\n HvSingleCalendarClasses,\n} from \"./singleCalendarClasses\";\nimport { HvCalendarCell } from \"./CalendarCell\";\nimport { HvCalendarWeekLabel } from \"../CalendarWeekLabels\";\nimport { HvCalendarHeader } from \"../CalendarHeader/CalendarHeader\";\n\nconst { Enter, ArrowLeft, ArrowRight, ArrowUp, ArrowDown } = keyboardCodes;\n\nexport const HvSingleCalendar = ({\n classes,\n className,\n id,\n locale = \"en-US\",\n value,\n visibleMonth,\n visibleYear,\n minimumDate,\n maximumDate,\n onChange,\n onInputChange,\n onVisibleDateChange,\n showEndDate,\n showDayOfWeek,\n invalidDateLabel,\n children,\n ...others\n}: HvSingleCalendarProps) => {\n // TODO: refactor this out\n // const { HvCalendarHeader } = useContext(HvFormElementDescriptorsContext);\n\n const today = new Date();\n const localValue = isNil(value) ? today : value;\n\n const [calViewMode, setCalViewMode] = useState<ViewMode>(\"calendar\");\n\n const rangeMode = isRange(localValue);\n const isDateSelectionMode = rangeMode && !isDate(localValue.endDate);\n const calModel = rangeMode\n ? generateCalendarModel(localValue.startDate, visibleMonth, visibleYear)\n : generateCalendarModel(localValue, visibleMonth, visibleYear);\n const firstDayOfCurrentMonth = new Date(calModel.year, calModel.month - 1, 1);\n const firstDayOfCurrentMonthTime = firstDayOfCurrentMonth.getTime();\n\n const listWeekdayNames = useMemo(\n () => getWeekdayNamesList(locale, \"narrow\"),\n [locale]\n );\n\n const handleChange = (event, date: Date | DateRangeProp) => {\n event?.preventDefault();\n onChange?.(event, date);\n };\n\n const handleInputChange = (event, date) => {\n event?.preventDefault();\n onInputChange?.(event, date);\n };\n\n const getNavChild = (event: KeyboardEvent, siblings, i: number) => {\n if (isKeypress(event, ArrowLeft)) return siblings[i - 1];\n if (isKeypress(event, ArrowRight)) return siblings[i + 1];\n if (isKeypress(event, ArrowUp)) return siblings[i - 7];\n if (isKeypress(event, ArrowDown)) return siblings[i + 7];\n return undefined;\n };\n\n const handleKeyDown = (event) => {\n // This code is very brittle and should be managed with the focus wrapper\n const el = document?.activeElement;\n const parent = el?.parentElement?.parentElement;\n const siblings =\n parent != null\n ? Array.from(\n parent.getElementsByClassName(\n singleCalendarClasses.cellContainer as string\n )\n )\n : [];\n const elIndex = el ? siblings.indexOf(el) : 0;\n\n if (isKeypress(event, Enter)) {\n (el as HTMLElement).focus();\n return;\n }\n\n const child = getNavChild(event, siblings, elIndex);\n\n if (child) {\n const inMonth = child.getAttribute(\"data-in-month\");\n if (inMonth === \"true\") {\n event?.preventDefault();\n child?.focus();\n }\n }\n };\n\n /**\n * Renders the element representing the received date.\n *\n * @param currentDate - The array representing the date [YYYY, MM, DD].\n * @memberOf Calendar\n */\n const renderCalendarDate = (currentDate) => {\n return (\n <HvCalendarCell\n classes={classes}\n key={currentDate}\n tabIndex={currentDate.getTime() === firstDayOfCurrentMonthTime ? 0 : -1}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n value={currentDate}\n today={today}\n calendarValue={localValue}\n rangeMode={rangeMode}\n isDateSelectionMode={isDateSelectionMode}\n locale={locale}\n firstDayOfCurrentMonth={firstDayOfCurrentMonth}\n maximumDate={maximumDate}\n minimumDate={minimumDate}\n />\n );\n };\n\n return (\n <StyledCalendarContainer\n className={clsx(\n className,\n singleCalendarClasses.calendarContainer,\n classes?.calendarContainer\n )}\n {...others}\n >\n <StyledCalendarWrapper\n id={id}\n className={clsx(\n singleCalendarClasses.calendarWrapper,\n classes?.calendarWrapper\n )}\n >\n <HvCalendarHeader\n id={setId(id, \"header\")}\n locale={locale}\n onChange={handleInputChange}\n showEndDate={showEndDate && !isDateSelectionMode}\n showDayOfWeek={showDayOfWeek}\n invalidDateLabel={invalidDateLabel}\n />\n {calViewMode === \"calendar\" && (\n <div>\n <HvComposedNavigation\n id={id}\n locale={locale}\n onChange={onVisibleDateChange}\n onViewModeChange={setCalViewMode}\n visibleYear={visibleYear || today.getFullYear()}\n visibleMonth={visibleMonth || today.getMonth() + 1}\n />\n <StyledCalendarGrid\n className={clsx(\n singleCalendarClasses.calendarGrid,\n classes?.calendarGrid\n )}\n aria-controls={HvCalendarHeader?.[0]?.id}\n >\n <HvCalendarWeekLabel labels={listWeekdayNames} />\n {calModel.dates.map(renderCalendarDate)}\n </StyledCalendarGrid>\n </div>\n )}\n {calViewMode === \"monthly\" && (\n <HvMonthSelector\n id={id}\n locale={locale}\n onChange={onVisibleDateChange}\n onViewModeChange={setCalViewMode}\n visibleMonth={visibleMonth || today.getMonth() + 1}\n rangeMode={rangeMode}\n />\n )}\n </StyledCalendarWrapper>\n </StyledCalendarContainer>\n );\n};\n\nexport interface HvSingleCalendarProps {\n /**\n * Styles applied from the theme.\n */\n classes?: HvSingleCalendarClasses;\n /**\n * Identifier.\n */\n id?: string;\n /**\n * The class name to add at the root of the single calendar\n */\n className?: string;\n /**\n * The calendar locale.\n *\n */\n locale: string;\n /**\n * Date that the calendar would show.\n */\n value?: string | Date | DateRangeProp;\n /**\n * Date that will be used to know which month and year should be displayed on the calendar. The value of the day is\n * irrelevant.\n */\n visibleDate?: Date;\n /**\n * Controls the visible month of the Calendar\n */\n visibleMonth?: number;\n /**\n * Controls the visible month of the Calendar\n */\n visibleYear?: number;\n /**\n * Callback function to be triggered when the selected date has changed.\n */\n onChange?: (\n event:\n | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n | undefined,\n value: Date | DateRangeProp\n ) => void;\n /**\n * Callback function to be triggered when the selected date input has changed.\n */\n onInputChange?: (\n event:\n | React.ChangeEvent<\n HTMLTextAreaElement | HTMLInputElement | HTMLButtonElement\n >\n | undefined,\n value: Date | DateRangeProp,\n position?: \"left\" | \"right\"\n ) => void;\n /**\n * Callback function to be triggered when visible date has changed.\n */\n onVisibleDateChange?: (\n event:\n | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n | undefined,\n action: VisibilitySelectorActions,\n value?: Date | DateRangeProp | number\n ) => void;\n /**\n * The maximum selectable date after this all values are disabled.\n */\n maximumDate?: Date;\n /**\n * The minimum selectable date before this all values are disabled.\n */\n minimumDate?: Date;\n /**\n * Indicates if header should display end date in a date range.\n */\n showEndDate?: boolean;\n /**\n * Indicates if header should display the day of week.\n */\n showDayOfWeek?: boolean;\n /**\n * Content on the upper part of the calendar.\n */\n children?: React.ReactNode;\n /**\n * Label shown when date is invalid.\n */\n invalidDateLabel?: string;\n}\n"],"names":["Enter","ArrowLeft","ArrowRight","ArrowUp","ArrowDown","keyboardCodes","HvSingleCalendar","classes","className","id","locale","value","visibleMonth","visibleYear","minimumDate","maximumDate","onChange","onInputChange","onVisibleDateChange","showEndDate","showDayOfWeek","invalidDateLabel","children","others","today","Date","localValue","isNil","calViewMode","setCalViewMode","useState","rangeMode","isRange","isDateSelectionMode","isDate","endDate","calModel","generateCalendarModel","startDate","firstDayOfCurrentMonth","year","month","firstDayOfCurrentMonthTime","getTime","listWeekdayNames","useMemo","getWeekdayNamesList","handleChange","event","date","preventDefault","handleInputChange","getNavChild","siblings","i","isKeypress","undefined","handleKeyDown","el","document","activeElement","parent","parentElement","Array","from","getElementsByClassName","singleCalendarClasses","cellContainer","elIndex","indexOf","focus","child","inMonth","getAttribute","renderCalendarDate","currentDate","HvCalendarCell","tabIndex","onKeyDown","calendarValue","StyledCalendarContainer","clsx","calendarContainer","StyledCalendarWrapper","calendarWrapper","_jsx","HvCalendarHeader","setId","HvComposedNavigation","onViewModeChange","getFullYear","getMonth","_jsxs","StyledCalendarGrid","calendarGrid","HvCalendarWeekLabel","labels","dates","map","HvMonthSelector"],"mappings":"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"}
1
+ {"version":3,"file":"SingleCalendar.js","sources":["../../../../../src/components/Calendar/SingleCalendar/SingleCalendar.tsx"],"sourcesContent":["import { useState, useMemo } from \"react\";\nimport { clsx } from \"clsx\";\nimport isNil from \"lodash/isNil\";\nimport { setId, isKey } from \"@core/utils\";\nimport { ViewMode } from \"../enums\";\nimport { isRange, isDate, getWeekdayNamesList } from \"../utils\";\nimport { generateCalendarModel } from \"../model\";\nimport { HvComposedNavigation, HvMonthSelector } from \"../CalendarNavigation\";\nimport { DateRangeProp, VisibilitySelectorActions } from \"..\";\nimport {\n StyledCalendarContainer,\n StyledCalendarGrid,\n StyledCalendarWrapper,\n} from \"./SingleCalendar.styles\";\nimport singleCalendarClasses, {\n HvSingleCalendarClasses,\n} from \"./singleCalendarClasses\";\nimport { HvCalendarCell } from \"./CalendarCell\";\nimport { HvCalendarWeekLabel } from \"../CalendarWeekLabels\";\nimport { HvCalendarHeader } from \"../CalendarHeader/CalendarHeader\";\n\nexport const HvSingleCalendar = ({\n classes,\n className,\n id,\n locale = \"en-US\",\n value,\n visibleMonth,\n visibleYear,\n minimumDate,\n maximumDate,\n onChange,\n onInputChange,\n onVisibleDateChange,\n showEndDate,\n showDayOfWeek,\n invalidDateLabel,\n children,\n ...others\n}: HvSingleCalendarProps) => {\n // TODO: refactor this out\n // const { HvCalendarHeader } = useContext(HvFormElementDescriptorsContext);\n\n const today = new Date();\n const localValue = isNil(value) ? today : value;\n\n const [calViewMode, setCalViewMode] = useState<ViewMode>(\"calendar\");\n\n const rangeMode = isRange(localValue);\n const isDateSelectionMode = rangeMode && !isDate(localValue.endDate);\n const calModel = rangeMode\n ? generateCalendarModel(localValue.startDate, visibleMonth, visibleYear)\n : generateCalendarModel(localValue, visibleMonth, visibleYear);\n const firstDayOfCurrentMonth = new Date(calModel.year, calModel.month - 1, 1);\n const firstDayOfCurrentMonthTime = firstDayOfCurrentMonth.getTime();\n\n const listWeekdayNames = useMemo(\n () => getWeekdayNamesList(locale, \"narrow\"),\n [locale]\n );\n\n const handleChange = (event, date: Date | DateRangeProp) => {\n event?.preventDefault();\n onChange?.(event, date);\n };\n\n const handleInputChange = (event, date) => {\n event?.preventDefault();\n onInputChange?.(event, date);\n };\n\n const getNavChild = (event: KeyboardEvent, siblings, i: number) => {\n if (isKey(event, \"ArrowLeft\")) return siblings[i - 1];\n if (isKey(event, \"ArrowRight\")) return siblings[i + 1];\n if (isKey(event, \"ArrowUp\")) return siblings[i - 7];\n if (isKey(event, \"ArrowDown\")) return siblings[i + 7];\n return undefined;\n };\n\n const handleKeyDown = (event) => {\n // This code is very brittle and should be managed with the focus wrapper\n const el = document?.activeElement;\n const parent = el?.parentElement?.parentElement;\n const siblings =\n parent != null\n ? Array.from(\n parent.getElementsByClassName(\n singleCalendarClasses.cellContainer as string\n )\n )\n : [];\n const elIndex = el ? siblings.indexOf(el) : 0;\n\n if (isKey(event, \"Enter\")) {\n (el as HTMLElement).focus();\n return;\n }\n\n const child = getNavChild(event, siblings, elIndex);\n\n if (child) {\n const inMonth = child.getAttribute(\"data-in-month\");\n if (inMonth === \"true\") {\n event?.preventDefault();\n child?.focus();\n }\n }\n };\n\n /**\n * Renders the element representing the received date.\n *\n * @param currentDate - The array representing the date [YYYY, MM, DD].\n * @memberOf Calendar\n */\n const renderCalendarDate = (currentDate) => {\n return (\n <HvCalendarCell\n classes={classes}\n key={currentDate}\n tabIndex={currentDate.getTime() === firstDayOfCurrentMonthTime ? 0 : -1}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n value={currentDate}\n today={today}\n calendarValue={localValue}\n rangeMode={rangeMode}\n isDateSelectionMode={isDateSelectionMode}\n locale={locale}\n firstDayOfCurrentMonth={firstDayOfCurrentMonth}\n maximumDate={maximumDate}\n minimumDate={minimumDate}\n />\n );\n };\n\n return (\n <StyledCalendarContainer\n className={clsx(\n className,\n singleCalendarClasses.calendarContainer,\n classes?.calendarContainer\n )}\n {...others}\n >\n <StyledCalendarWrapper\n id={id}\n className={clsx(\n singleCalendarClasses.calendarWrapper,\n classes?.calendarWrapper\n )}\n >\n <HvCalendarHeader\n id={setId(id, \"header\")}\n locale={locale}\n onChange={handleInputChange}\n showEndDate={showEndDate && !isDateSelectionMode}\n showDayOfWeek={showDayOfWeek}\n invalidDateLabel={invalidDateLabel}\n />\n {calViewMode === \"calendar\" && (\n <div>\n <HvComposedNavigation\n id={id}\n locale={locale}\n onChange={onVisibleDateChange}\n onViewModeChange={setCalViewMode}\n visibleYear={visibleYear || today.getFullYear()}\n visibleMonth={visibleMonth || today.getMonth() + 1}\n />\n <StyledCalendarGrid\n className={clsx(\n singleCalendarClasses.calendarGrid,\n classes?.calendarGrid\n )}\n aria-controls={HvCalendarHeader?.[0]?.id}\n >\n <HvCalendarWeekLabel labels={listWeekdayNames} />\n {calModel.dates.map(renderCalendarDate)}\n </StyledCalendarGrid>\n </div>\n )}\n {calViewMode === \"monthly\" && (\n <HvMonthSelector\n id={id}\n locale={locale}\n onChange={onVisibleDateChange}\n onViewModeChange={setCalViewMode}\n visibleMonth={visibleMonth || today.getMonth() + 1}\n rangeMode={rangeMode}\n />\n )}\n </StyledCalendarWrapper>\n </StyledCalendarContainer>\n );\n};\n\nexport interface HvSingleCalendarProps {\n /**\n * Styles applied from the theme.\n */\n classes?: HvSingleCalendarClasses;\n /**\n * Identifier.\n */\n id?: string;\n /**\n * The class name to add at the root of the single calendar\n */\n className?: string;\n /**\n * The calendar locale.\n *\n */\n locale: string;\n /**\n * Date that the calendar would show.\n */\n value?: string | Date | DateRangeProp;\n /**\n * Date that will be used to know which month and year should be displayed on the calendar. The value of the day is\n * irrelevant.\n */\n visibleDate?: Date;\n /**\n * Controls the visible month of the Calendar\n */\n visibleMonth?: number;\n /**\n * Controls the visible month of the Calendar\n */\n visibleYear?: number;\n /**\n * Callback function to be triggered when the selected date has changed.\n */\n onChange?: (\n event:\n | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n | undefined,\n value: Date | DateRangeProp\n ) => void;\n /**\n * Callback function to be triggered when the selected date input has changed.\n */\n onInputChange?: (\n event:\n | React.ChangeEvent<\n HTMLTextAreaElement | HTMLInputElement | HTMLButtonElement\n >\n | undefined,\n value: Date | DateRangeProp,\n position?: \"left\" | \"right\"\n ) => void;\n /**\n * Callback function to be triggered when visible date has changed.\n */\n onVisibleDateChange?: (\n event:\n | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n | undefined,\n action: VisibilitySelectorActions,\n value?: Date | DateRangeProp | number\n ) => void;\n /**\n * The maximum selectable date after this all values are disabled.\n */\n maximumDate?: Date;\n /**\n * The minimum selectable date before this all values are disabled.\n */\n minimumDate?: Date;\n /**\n * Indicates if header should display end date in a date range.\n */\n showEndDate?: boolean;\n /**\n * Indicates if header should display the day of week.\n */\n showDayOfWeek?: boolean;\n /**\n * Content on the upper part of the calendar.\n */\n children?: React.ReactNode;\n /**\n * Label shown when date is invalid.\n */\n invalidDateLabel?: string;\n}\n"],"names":["HvSingleCalendar","classes","className","id","locale","value","visibleMonth","visibleYear","minimumDate","maximumDate","onChange","onInputChange","onVisibleDateChange","showEndDate","showDayOfWeek","invalidDateLabel","children","others","today","Date","localValue","isNil","calViewMode","setCalViewMode","useState","rangeMode","isRange","isDateSelectionMode","isDate","endDate","calModel","generateCalendarModel","startDate","firstDayOfCurrentMonth","year","month","firstDayOfCurrentMonthTime","getTime","listWeekdayNames","useMemo","getWeekdayNamesList","handleChange","event","date","preventDefault","handleInputChange","getNavChild","siblings","i","isKey","undefined","handleKeyDown","el","document","activeElement","parent","parentElement","Array","from","getElementsByClassName","singleCalendarClasses","cellContainer","elIndex","indexOf","focus","child","inMonth","getAttribute","renderCalendarDate","currentDate","HvCalendarCell","tabIndex","onKeyDown","calendarValue","StyledCalendarContainer","clsx","calendarContainer","StyledCalendarWrapper","calendarWrapper","_jsx","HvCalendarHeader","setId","HvComposedNavigation","onViewModeChange","getFullYear","getMonth","_jsxs","StyledCalendarGrid","calendarGrid","HvCalendarWeekLabel","labels","dates","map","HvMonthSelector"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"Actions.js","sources":["../../../../../src/components/Dialog/Actions/Actions.tsx"],"sourcesContent":["import MuiDialogActions, {\n DialogActionsProps as MuiDialogActionsProps,\n} from \"@mui/material/DialogActions\";\n\nimport { HvBaseProps } from \"@core/types\";\nimport { ExtractNames } from \"@core/utils\";\n\nimport { staticClasses, useClasses } from \"./Actions.styles\";\n\nexport { staticClasses as dialogActionClasses };\n\nexport type HvDialogActionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDialogActionsProps\n extends Omit<MuiDialogActionsProps, \"classes\">,\n HvBaseProps {\n /** Set the dialog to fullscreen mode. */\n fullscreen?: boolean;\n classes?: HvDialogActionClasses;\n}\n\nexport const HvDialogActions = ({\n classes: classesProp,\n className,\n children,\n fullscreen = false,\n ...others\n}: HvDialogActionsProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n return (\n <MuiDialogActions\n className={className}\n classes={{\n root: cx(classes.root, { [classes.fullscreen]: fullscreen }),\n spacing: classes.spacing,\n }}\n {...others}\n >\n {children}\n </MuiDialogActions>\n );\n};\n"],"names":["HvDialogActions","classes","classesProp","className","children","fullscreen","others","cx","useClasses","MuiDialogActions","root","spacing"],"mappings":";;;;AAqBO,MAAMA,kBAAkBA,CAAC;AAAA,EAC9BC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC,aAAa;AAAA,EACb,GAAGC;AACiB,MAAM;AACpB,QAAA;AAAA,IAAEL;AAAAA,IAASM;AAAAA,EAAAA,IAAOC,WAAWN,WAAW;AAE9C,6BACGO,kBAAgB;AAAA,IACfN;AAAAA,IACAF,SAAS;AAAA,MACPS,MAAMH,GAAGN,QAAQS,MAAM;AAAA,QAAE,CAACT,QAAQI,UAAU,GAAGA;AAAAA,MAAAA,CAAY;AAAA,MAC3DM,SAASV,QAAQU;AAAAA,IACnB;AAAA,IAAE,GACEL;AAAAA,IAAMF;AAAAA,EAAAA,CAGM;AAEtB;"}
1
+ {"version":3,"file":"Actions.js","sources":["../../../../../src/components/Dialog/Actions/Actions.tsx"],"sourcesContent":["import MuiDialogActions, {\n DialogActionsProps as MuiDialogActionsProps,\n} from \"@mui/material/DialogActions\";\n\nimport { HvBaseProps } from \"@core/types\";\nimport { ExtractNames } from \"@core/utils\";\n\nimport { staticClasses, useClasses } from \"./Actions.styles\";\n\nexport { staticClasses as dialogActionClasses };\n\nexport type HvDialogActionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDialogActionsProps\n extends Omit<MuiDialogActionsProps, \"classes\">,\n HvBaseProps {\n /** Set the dialog to fullscreen mode. */\n fullscreen?: boolean;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvDialogActionClasses;\n}\n\nexport const HvDialogActions = ({\n classes: classesProp,\n className,\n children,\n fullscreen = false,\n ...others\n}: HvDialogActionsProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n return (\n <MuiDialogActions\n className={className}\n classes={{\n root: cx(classes.root, { [classes.fullscreen]: fullscreen }),\n spacing: classes.spacing,\n }}\n {...others}\n >\n {children}\n </MuiDialogActions>\n );\n};\n"],"names":["HvDialogActions","classes","classesProp","className","children","fullscreen","others","cx","useClasses","MuiDialogActions","root","spacing"],"mappings":";;;;AAsBO,MAAMA,kBAAkBA,CAAC;AAAA,EAC9BC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC,aAAa;AAAA,EACb,GAAGC;AACiB,MAAM;AACpB,QAAA;AAAA,IAAEL;AAAAA,IAASM;AAAAA,EAAAA,IAAOC,WAAWN,WAAW;AAE9C,6BACGO,kBAAgB;AAAA,IACfN;AAAAA,IACAF,SAAS;AAAA,MACPS,MAAMH,GAAGN,QAAQS,MAAM;AAAA,QAAE,CAACT,QAAQI,UAAU,GAAGA;AAAAA,MAAAA,CAAY;AAAA,MAC3DM,SAASV,QAAQU;AAAAA,IACnB;AAAA,IAAE,GACEL;AAAAA,IAAMF;AAAAA,EAAAA,CAGM;AAEtB;"}