@hitachivantara/uikit-react-core 5.42.1 → 5.44.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 (155) hide show
  1. package/dist/cjs/Accordion/Accordion.cjs +3 -1
  2. package/dist/cjs/Accordion/Accordion.cjs.map +1 -1
  3. package/dist/cjs/AppSwitcher/AppSwitcher.cjs +3 -3
  4. package/dist/cjs/AppSwitcher/AppSwitcher.cjs.map +1 -1
  5. package/dist/cjs/BaseDropdown/BaseDropdown.cjs +1 -0
  6. package/dist/cjs/BaseDropdown/BaseDropdown.cjs.map +1 -1
  7. package/dist/cjs/BaseDropdown/BaseDropdown.styles.cjs +2 -1
  8. package/dist/cjs/BaseDropdown/BaseDropdown.styles.cjs.map +1 -1
  9. package/dist/cjs/Button/Button.styles.cjs +1 -0
  10. package/dist/cjs/Button/Button.styles.cjs.map +1 -1
  11. package/dist/cjs/Calendar/SingleCalendar/CalendarCell.cjs.map +1 -1
  12. package/dist/cjs/Calendar/SingleCalendar/SingleCalendar.cjs.map +1 -1
  13. package/dist/cjs/Calendar/model.cjs.map +1 -1
  14. package/dist/cjs/Calendar/utils.cjs.map +1 -1
  15. package/dist/cjs/Card/Card.cjs +1 -1
  16. package/dist/cjs/Card/Card.cjs.map +1 -1
  17. package/dist/cjs/ColorPicker/Fields/Fields.cjs.map +1 -1
  18. package/dist/cjs/DatePicker/DatePicker.styles.cjs +4 -1
  19. package/dist/cjs/DatePicker/DatePicker.styles.cjs.map +1 -1
  20. package/dist/cjs/DatePicker/useVisibleDate.cjs.map +1 -1
  21. package/dist/cjs/Dialog/Content/Content.cjs +3 -1
  22. package/dist/cjs/Dialog/Content/Content.cjs.map +1 -1
  23. package/dist/cjs/Drawer/Drawer.cjs +2 -4
  24. package/dist/cjs/Drawer/Drawer.cjs.map +1 -1
  25. package/dist/cjs/FileUploader/DropZone/DropZone.cjs +3 -4
  26. package/dist/cjs/FileUploader/DropZone/DropZone.cjs.map +1 -1
  27. package/dist/cjs/Focus/utils.cjs.map +1 -1
  28. package/dist/cjs/Forms/FormElement/utils/FormUtils.cjs.map +1 -1
  29. package/dist/cjs/Header/Navigation/utils/FocusContext.cjs +1 -2
  30. package/dist/cjs/Header/Navigation/utils/FocusContext.cjs.map +1 -1
  31. package/dist/cjs/Link/Link.cjs +6 -5
  32. package/dist/cjs/Link/Link.cjs.map +1 -1
  33. package/dist/cjs/List/utils.cjs.map +1 -1
  34. package/dist/cjs/QueryBuilder/Rule/Value/DateTimeValue/DateTimeValue.cjs.map +1 -1
  35. package/dist/cjs/ScrollTo/useScrollTo.cjs.map +1 -1
  36. package/dist/cjs/Slider/Slider.cjs +1 -1
  37. package/dist/cjs/Slider/Slider.cjs.map +1 -1
  38. package/dist/cjs/Snackbar/Snackbar.cjs +8 -8
  39. package/dist/cjs/Snackbar/Snackbar.cjs.map +1 -1
  40. package/dist/cjs/Stack/Stack.cjs.map +1 -1
  41. package/dist/cjs/Switch/Switch.cjs.map +1 -1
  42. package/dist/cjs/Table/Table.cjs.map +1 -1
  43. package/dist/cjs/Table/TableCell/TableCell.styles.cjs +2 -5
  44. package/dist/cjs/Table/TableCell/TableCell.styles.cjs.map +1 -1
  45. package/dist/cjs/Table/TableHeader/TableHeader.cjs +2 -1
  46. package/dist/cjs/Table/TableHeader/TableHeader.cjs.map +1 -1
  47. package/dist/cjs/Table/TableHeader/utils.cjs +1 -3
  48. package/dist/cjs/Table/TableHeader/utils.cjs.map +1 -1
  49. package/dist/cjs/Table/hooks/useResizeColumns.cjs +4 -0
  50. package/dist/cjs/Table/hooks/useResizeColumns.cjs.map +1 -1
  51. package/dist/cjs/Table/hooks/useTable.cjs +0 -4
  52. package/dist/cjs/Table/hooks/useTable.cjs.map +1 -1
  53. package/dist/cjs/Tag/Tag.cjs +7 -8
  54. package/dist/cjs/Tag/Tag.cjs.map +1 -1
  55. package/dist/cjs/TextArea/TextArea.cjs +2 -2
  56. package/dist/cjs/TextArea/TextArea.cjs.map +1 -1
  57. package/dist/cjs/TimeAgo/formatUtils.cjs.map +1 -1
  58. package/dist/cjs/TimeAgo/useTimeAgo.cjs +1 -1
  59. package/dist/cjs/TimeAgo/useTimeAgo.cjs.map +1 -1
  60. package/dist/cjs/TimeAgo/useTimeout.cjs.map +1 -1
  61. package/dist/cjs/TimePicker/Placeholder.cjs.map +1 -1
  62. package/dist/cjs/Typography/Typography.styles.cjs +1 -0
  63. package/dist/cjs/Typography/Typography.styles.cjs.map +1 -1
  64. package/dist/cjs/hooks/useUniqueId.cjs +29 -4
  65. package/dist/cjs/hooks/useUniqueId.cjs.map +1 -1
  66. package/dist/cjs/index.cjs +0 -4
  67. package/dist/cjs/index.cjs.map +1 -1
  68. package/dist/cjs/utils/ConditionalWrapper.cjs +5 -1
  69. package/dist/cjs/utils/ConditionalWrapper.cjs.map +1 -1
  70. package/dist/cjs/utils/browser.cjs.map +1 -1
  71. package/dist/cjs/utils/focusableElementFinder.cjs.map +1 -1
  72. package/dist/cjs/utils/getComponentName.cjs.map +1 -1
  73. package/dist/cjs/utils/hexToRgbA.cjs.map +1 -1
  74. package/dist/cjs/utils/multiSelectionEventHandler.cjs.map +1 -1
  75. package/dist/cjs/utils/setId.cjs.map +1 -1
  76. package/dist/cjs/utils/theme.cjs.map +1 -1
  77. package/dist/cjs/utils/wrapperTooltip.cjs.map +1 -1
  78. package/dist/esm/Accordion/Accordion.mjs +3 -1
  79. package/dist/esm/Accordion/Accordion.mjs.map +1 -1
  80. package/dist/esm/AppSwitcher/AppSwitcher.mjs +3 -3
  81. package/dist/esm/AppSwitcher/AppSwitcher.mjs.map +1 -1
  82. package/dist/esm/BaseDropdown/BaseDropdown.mjs +1 -0
  83. package/dist/esm/BaseDropdown/BaseDropdown.mjs.map +1 -1
  84. package/dist/esm/BaseDropdown/BaseDropdown.styles.mjs +2 -1
  85. package/dist/esm/BaseDropdown/BaseDropdown.styles.mjs.map +1 -1
  86. package/dist/esm/Button/Button.styles.mjs +1 -0
  87. package/dist/esm/Button/Button.styles.mjs.map +1 -1
  88. package/dist/esm/Calendar/SingleCalendar/CalendarCell.mjs.map +1 -1
  89. package/dist/esm/Calendar/SingleCalendar/SingleCalendar.mjs.map +1 -1
  90. package/dist/esm/Calendar/model.mjs.map +1 -1
  91. package/dist/esm/Calendar/utils.mjs.map +1 -1
  92. package/dist/esm/Card/Card.mjs +2 -2
  93. package/dist/esm/Card/Card.mjs.map +1 -1
  94. package/dist/esm/ColorPicker/Fields/Fields.mjs.map +1 -1
  95. package/dist/esm/DatePicker/DatePicker.styles.mjs +4 -1
  96. package/dist/esm/DatePicker/DatePicker.styles.mjs.map +1 -1
  97. package/dist/esm/DatePicker/useVisibleDate.mjs.map +1 -1
  98. package/dist/esm/Dialog/Content/Content.mjs +3 -1
  99. package/dist/esm/Dialog/Content/Content.mjs.map +1 -1
  100. package/dist/esm/Drawer/Drawer.mjs +2 -4
  101. package/dist/esm/Drawer/Drawer.mjs.map +1 -1
  102. package/dist/esm/FileUploader/DropZone/DropZone.mjs +3 -4
  103. package/dist/esm/FileUploader/DropZone/DropZone.mjs.map +1 -1
  104. package/dist/esm/Focus/utils.mjs.map +1 -1
  105. package/dist/esm/Forms/FormElement/utils/FormUtils.mjs.map +1 -1
  106. package/dist/esm/Header/Navigation/utils/FocusContext.mjs +1 -2
  107. package/dist/esm/Header/Navigation/utils/FocusContext.mjs.map +1 -1
  108. package/dist/esm/Link/Link.mjs +6 -5
  109. package/dist/esm/Link/Link.mjs.map +1 -1
  110. package/dist/esm/List/utils.mjs.map +1 -1
  111. package/dist/esm/QueryBuilder/Rule/Value/DateTimeValue/DateTimeValue.mjs.map +1 -1
  112. package/dist/esm/ScrollTo/useScrollTo.mjs.map +1 -1
  113. package/dist/esm/Slider/Slider.mjs +1 -1
  114. package/dist/esm/Slider/Slider.mjs.map +1 -1
  115. package/dist/esm/Snackbar/Snackbar.mjs +8 -8
  116. package/dist/esm/Snackbar/Snackbar.mjs.map +1 -1
  117. package/dist/esm/Stack/Stack.mjs.map +1 -1
  118. package/dist/esm/Switch/Switch.mjs.map +1 -1
  119. package/dist/esm/Table/Table.mjs.map +1 -1
  120. package/dist/esm/Table/TableCell/TableCell.styles.mjs +2 -5
  121. package/dist/esm/Table/TableCell/TableCell.styles.mjs.map +1 -1
  122. package/dist/esm/Table/TableHeader/TableHeader.mjs +2 -1
  123. package/dist/esm/Table/TableHeader/TableHeader.mjs.map +1 -1
  124. package/dist/esm/Table/TableHeader/utils.mjs +1 -3
  125. package/dist/esm/Table/TableHeader/utils.mjs.map +1 -1
  126. package/dist/esm/Table/hooks/useResizeColumns.mjs +4 -0
  127. package/dist/esm/Table/hooks/useResizeColumns.mjs.map +1 -1
  128. package/dist/esm/Table/hooks/useTable.mjs +0 -2
  129. package/dist/esm/Table/hooks/useTable.mjs.map +1 -1
  130. package/dist/esm/Tag/Tag.mjs +7 -8
  131. package/dist/esm/Tag/Tag.mjs.map +1 -1
  132. package/dist/esm/TextArea/TextArea.mjs +2 -2
  133. package/dist/esm/TextArea/TextArea.mjs.map +1 -1
  134. package/dist/esm/TimeAgo/formatUtils.mjs.map +1 -1
  135. package/dist/esm/TimeAgo/useTimeAgo.mjs +1 -1
  136. package/dist/esm/TimeAgo/useTimeAgo.mjs.map +1 -1
  137. package/dist/esm/TimeAgo/useTimeout.mjs.map +1 -1
  138. package/dist/esm/TimePicker/Placeholder.mjs.map +1 -1
  139. package/dist/esm/Typography/Typography.styles.mjs +1 -0
  140. package/dist/esm/Typography/Typography.styles.mjs.map +1 -1
  141. package/dist/esm/hooks/useUniqueId.mjs +11 -3
  142. package/dist/esm/hooks/useUniqueId.mjs.map +1 -1
  143. package/dist/esm/index.mjs +1 -2
  144. package/dist/esm/utils/ConditionalWrapper.mjs +5 -1
  145. package/dist/esm/utils/ConditionalWrapper.mjs.map +1 -1
  146. package/dist/esm/utils/browser.mjs.map +1 -1
  147. package/dist/esm/utils/focusableElementFinder.mjs.map +1 -1
  148. package/dist/esm/utils/getComponentName.mjs.map +1 -1
  149. package/dist/esm/utils/hexToRgbA.mjs.map +1 -1
  150. package/dist/esm/utils/multiSelectionEventHandler.mjs.map +1 -1
  151. package/dist/esm/utils/setId.mjs.map +1 -1
  152. package/dist/esm/utils/theme.mjs.map +1 -1
  153. package/dist/esm/utils/wrapperTooltip.mjs.map +1 -1
  154. package/dist/types/index.d.ts +20 -37
  155. package/package.json +5 -5
@@ -1,5 +1,5 @@
1
1
  import { jsxs, jsx } from "@emotion/react/jsx-runtime";
2
- import { theme } from "@hitachivantara/uikit-styles";
2
+ import { getColor, theme } from "@hitachivantara/uikit-styles";
3
3
  import { useDefaultProps } from "../hooks/useDefaultProps.mjs";
4
4
  import { useClasses } from "./Card.styles.mjs";
5
5
  import { staticClasses } from "./Card.styles.mjs";
@@ -24,7 +24,7 @@ const HvCard = (props) => {
24
24
  "HvIsCardGridElement",
25
25
  classes.root,
26
26
  css({
27
- backgroundColor: bgcolor && theme.colors[bgcolor]
27
+ backgroundColor: getColor(bgcolor)
28
28
  }),
29
29
  {
30
30
  [classes.selectable]: selectable,
@@ -1 +1 @@
1
- {"version":3,"file":"Card.mjs","sources":["../../../src/Card/Card.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\n\nimport { HvBox } from \"../Box\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { HvAtmosphereColorKeys, HvSemanticColorKeys } from \"../types/tokens\";\n\nimport { staticClasses, useClasses } from \"./Card.styles\";\n\nexport { staticClasses as cardClasses };\n\nexport type HvCardClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCardProps extends HvBaseProps {\n /** The renderable content inside the icon slot of the header. */\n icon?: React.ReactNode;\n /** Whether the card is selectable. */\n selectable?: boolean;\n /** Whether the card is currently selected. */\n selected?: boolean;\n /** The background color of the card. */\n bgcolor?:\n | \"sema0\"\n | HvSemanticColorKeys\n | HvAtmosphereColorKeys\n | \"transparent\";\n /**\n * The border color at the top of the card. Must be one of palette semantic or atmosphere colors.\n * To set another color, the borderTop should be override.\n */\n statusColor?: \"sema0\" | HvSemanticColorKeys | HvAtmosphereColorKeys;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvCardClasses;\n}\n\n/**\n * A card is a container for a few short and related pieces of content.\n * It roughly resembles a playing card in size and shape and is intended as a\n * linked short representation of a conceptual unit. For that reason,\n * this pattern must be used as an entry-point for further information.\n */\nexport const HvCard = (props: HvCardProps) => {\n const {\n classes: classesProp,\n className,\n children,\n icon,\n selectable = false,\n selected = false,\n statusColor = \"sema0\",\n bgcolor,\n ...others\n } = useDefaultProps(\"HvCard\", props);\n\n const { classes, css, cx } = useClasses(classesProp);\n\n return (\n <HvBox\n className={cx(\n \"HvIsCardGridElement\",\n classes.root,\n css({\n backgroundColor: bgcolor && theme.colors[bgcolor],\n }),\n {\n [classes.selectable]: selectable,\n [classes.selected]: selected,\n },\n className\n )}\n {...others}\n >\n <div className={classes.semanticContainer}>\n <div\n className={cx(\n css({\n height: selected ? 4 : 2,\n backgroundColor:\n statusColor === \"sema0\"\n ? selected\n ? theme.colors.secondary\n : theme.colors.atmo4\n : theme.colors[statusColor],\n }),\n classes.semanticBar\n )}\n />\n <div className={classes.icon}>{icon}</div>\n </div>\n {children}\n </HvBox>\n );\n};\n"],"names":[],"mappings":";;;;;;AA2Ca,MAAA,SAAS,CAAC,UAAuB;AACtC,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa;AAAA,IACb,WAAW;AAAA,IACX,cAAc;AAAA,IACd;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,UAAU,KAAK;AAEnC,QAAM,EAAE,SAAS,KAAK,GAAG,IAAI,WAAW,WAAW;AAGjD,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,QAAQ;AAAA,QACR,IAAI;AAAA,UACF,iBAAiB,WAAW,MAAM,OAAO,OAAO;AAAA,QAAA,CACjD;AAAA,QACD;AAAA,UACE,CAAC,QAAQ,UAAU,GAAG;AAAA,UACtB,CAAC,QAAQ,QAAQ,GAAG;AAAA,QACtB;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ,UAAA;AAAA,QAAC,qBAAA,OAAA,EAAI,WAAW,QAAQ,mBACtB,UAAA;AAAA,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW;AAAA,gBACT,IAAI;AAAA,kBACF,QAAQ,WAAW,IAAI;AAAA,kBACvB,iBACE,gBAAgB,UACZ,WACE,MAAM,OAAO,YACb,MAAM,OAAO,QACf,MAAM,OAAO,WAAW;AAAA,gBAAA,CAC/B;AAAA,gBACD,QAAQ;AAAA,cACV;AAAA,YAAA;AAAA,UACF;AAAA,UACC,oBAAA,OAAA,EAAI,WAAW,QAAQ,MAAO,UAAK,MAAA;AAAA,QAAA,GACtC;AAAA,QACC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP;"}
1
+ {"version":3,"file":"Card.mjs","sources":["../../../src/Card/Card.tsx"],"sourcesContent":["import { getColor, theme } from \"@hitachivantara/uikit-styles\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\n\nimport { HvBox } from \"../Box\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { HvAtmosphereColorKeys, HvSemanticColorKeys } from \"../types/tokens\";\n\nimport { staticClasses, useClasses } from \"./Card.styles\";\n\nexport { staticClasses as cardClasses };\n\nexport type HvCardClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCardProps extends HvBaseProps {\n /** The renderable content inside the icon slot of the header. */\n icon?: React.ReactNode;\n /** Whether the card is selectable. */\n selectable?: boolean;\n /** Whether the card is currently selected. */\n selected?: boolean;\n /** The background color of the card. */\n bgcolor?:\n | \"sema0\"\n | HvSemanticColorKeys\n | HvAtmosphereColorKeys\n | \"transparent\";\n /**\n * The border color at the top of the card. Must be one of palette semantic or atmosphere colors.\n * To set another color, the borderTop should be override.\n */\n statusColor?: \"sema0\" | HvSemanticColorKeys | HvAtmosphereColorKeys;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvCardClasses;\n}\n\n/**\n * A card is a container for a few short and related pieces of content.\n * It roughly resembles a playing card in size and shape and is intended as a\n * linked short representation of a conceptual unit. For that reason,\n * this pattern must be used as an entry-point for further information.\n */\nexport const HvCard = (props: HvCardProps) => {\n const {\n classes: classesProp,\n className,\n children,\n icon,\n selectable = false,\n selected = false,\n statusColor = \"sema0\",\n bgcolor,\n ...others\n } = useDefaultProps(\"HvCard\", props);\n\n const { classes, css, cx } = useClasses(classesProp);\n\n return (\n <HvBox\n className={cx(\n \"HvIsCardGridElement\",\n classes.root,\n css({\n backgroundColor: getColor(bgcolor),\n }),\n {\n [classes.selectable]: selectable,\n [classes.selected]: selected,\n },\n className\n )}\n {...others}\n >\n <div className={classes.semanticContainer}>\n <div\n className={cx(\n css({\n height: selected ? 4 : 2,\n backgroundColor:\n statusColor === \"sema0\"\n ? selected\n ? theme.colors.secondary\n : theme.colors.atmo4\n : theme.colors[statusColor],\n }),\n classes.semanticBar\n )}\n />\n <div className={classes.icon}>{icon}</div>\n </div>\n {children}\n </HvBox>\n );\n};\n"],"names":[],"mappings":";;;;;;AA2Ca,MAAA,SAAS,CAAC,UAAuB;AACtC,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa;AAAA,IACb,WAAW;AAAA,IACX,cAAc;AAAA,IACd;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,UAAU,KAAK;AAEnC,QAAM,EAAE,SAAS,KAAK,GAAG,IAAI,WAAW,WAAW;AAGjD,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,QAAQ;AAAA,QACR,IAAI;AAAA,UACF,iBAAiB,SAAS,OAAO;AAAA,QAAA,CAClC;AAAA,QACD;AAAA,UACE,CAAC,QAAQ,UAAU,GAAG;AAAA,UACtB,CAAC,QAAQ,QAAQ,GAAG;AAAA,QACtB;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ,UAAA;AAAA,QAAC,qBAAA,OAAA,EAAI,WAAW,QAAQ,mBACtB,UAAA;AAAA,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW;AAAA,gBACT,IAAI;AAAA,kBACF,QAAQ,WAAW,IAAI;AAAA,kBACvB,iBACE,gBAAgB,UACZ,WACE,MAAM,OAAO,YACb,MAAM,OAAO,QACf,MAAM,OAAO,WAAW;AAAA,gBAAA,CAC/B;AAAA,gBACD,QAAQ;AAAA,cACV;AAAA,YAAA;AAAA,UACF;AAAA,UACC,oBAAA,OAAA,EAAI,WAAW,QAAQ,MAAO,UAAK,MAAA;AAAA,QAAA,GACtC;AAAA,QACC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Fields.mjs","sources":["../../../../src/ColorPicker/Fields/Fields.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nimport { HSLColor, HSVColor, RGBColor } from \"react-color\";\n\nimport * as color from \"react-color/lib/helpers/color\";\n\nimport { HvInput } from \"../../Input\";\nimport { ExtractNames } from \"../../utils/classes\";\n\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\n\nimport { staticClasses, useClasses } from \"./Fields.styles\";\n\nexport { staticClasses as colorPickerFieldsClasses };\n\nexport type HvColorPickerFieldsClasses = ExtractNames<typeof useClasses>;\n\ninterface FieldsProps {\n className?: string;\n rgb?: RGBColor;\n hex?: string;\n onChange: (\n data:\n | HSLColor\n | HSVColor\n | RGBColor\n | {\n source?: string;\n hex?: string;\n },\n event: React.ChangeEvent<HTMLInputElement>\n ) => void;\n classes?: HvColorPickerFieldsClasses;\n}\n\nexport const Fields = (props: FieldsProps) => {\n const {\n className,\n onChange,\n rgb,\n hex,\n classes: classesProp,\n } = useDefaultProps(\"HvColorPickerFields\", props);\n const { classes, cx } = useClasses(classesProp);\n const [internalHex, setInternalHex] = useState(hex);\n const [internalRed, setInternalRed] = useState(rgb?.r);\n const [internalGreen, setInternalGreen] = useState(rgb?.g);\n const [internalBlue, setInternalBlue] = useState(rgb?.b);\n\n const hexInputRef = useRef<HTMLInputElement>(null);\n const redInputRef = useRef<HTMLInputElement>(null);\n const greenInputRef = useRef<HTMLInputElement>(null);\n const blueInputRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (document.activeElement !== hexInputRef.current) {\n setInternalHex(hex);\n }\n }, [hex]);\n\n useEffect(() => {\n if (document.activeElement !== redInputRef.current) {\n setInternalRed(rgb?.r);\n }\n\n if (document.activeElement !== greenInputRef.current) {\n setInternalGreen(rgb?.g);\n }\n\n if (document.activeElement !== blueInputRef.current) {\n setInternalBlue(rgb?.b);\n }\n }, [rgb]);\n\n const handleChange = (\n data: {\n hex?: string;\n r?: number;\n g?: number;\n b?: number;\n },\n event: React.ChangeEvent<HTMLInputElement>\n ) => {\n if (data.hex && color.isValidHex(data.hex)) {\n onChange(\n {\n hex: data.hex,\n source: \"hex\",\n },\n event\n );\n } else if (data.r || data.g || data.b) {\n onChange(\n {\n r: data.r || rgb?.r,\n g: data.g || rgb?.g,\n b: data.b || rgb?.b,\n source: \"rgb\",\n },\n event\n );\n }\n };\n\n const onChangeHex = (event: React.ChangeEvent<any>, value: string) => {\n setInternalHex(value);\n handleChange({ hex: value }, event);\n };\n\n const onChangeRbg = (\n event: React.ChangeEvent<any>,\n value: string,\n colorPart: \"r\" | \"g\" | \"b\"\n ) => {\n if (colorPart === \"r\") setInternalRed(Number(value));\n if (colorPart === \"g\") setInternalGreen(Number(value));\n if (colorPart === \"b\") setInternalBlue(Number(value));\n\n handleChange(\n {\n r: colorPart === \"r\" ? Number(value) : rgb?.r,\n g: colorPart === \"g\" ? Number(value) : rgb?.g,\n b: colorPart === \"b\" ? Number(value) : rgb?.b,\n },\n event\n );\n };\n\n return (\n <div className={cx(classes.fields, className)}>\n <HvInput\n ref={hexInputRef}\n className={classes.double}\n label=\"HEX\"\n value={internalHex?.replace(\"#\", \"\")}\n onChange={onChangeHex}\n onBlur={() => setInternalHex(hex)}\n disableClear\n />\n <HvInput\n ref={redInputRef}\n className={classes.single}\n label=\"R\"\n value={`${internalRed}`}\n onChange={(event, value) => onChangeRbg(event, value, \"r\")}\n onBlur={() => setInternalRed(rgb?.r)}\n disableClear\n />\n <HvInput\n ref={greenInputRef}\n className={classes.single}\n label=\"G\"\n value={`${internalGreen}`}\n onChange={(event, value) => onChangeRbg(event, value, \"g\")}\n onBlur={() => setInternalGreen(rgb?.g)}\n disableClear\n />\n <HvInput\n ref={blueInputRef}\n className={classes.single}\n label=\"B\"\n value={`${internalBlue}`}\n onChange={(event, value) => onChangeRbg(event, value, \"b\")}\n onBlur={() => setInternalBlue(rgb?.b)}\n disableClear\n />\n </div>\n );\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Fields.mjs","sources":["../../../../src/ColorPicker/Fields/Fields.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nimport { HSLColor, HSVColor, RGBColor } from \"react-color\";\n\n// @ts-ignore\nimport * as color from \"react-color/lib/helpers/color\";\n\nimport { HvInput } from \"../../Input\";\nimport { ExtractNames } from \"../../utils/classes\";\n\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\n\nimport { staticClasses, useClasses } from \"./Fields.styles\";\n\nexport { staticClasses as colorPickerFieldsClasses };\n\nexport type HvColorPickerFieldsClasses = ExtractNames<typeof useClasses>;\n\ninterface FieldsProps {\n className?: string;\n rgb?: RGBColor;\n hex?: string;\n onChange: (\n data:\n | HSLColor\n | HSVColor\n | RGBColor\n | {\n source?: string;\n hex?: string;\n },\n event: React.ChangeEvent<HTMLInputElement>\n ) => void;\n classes?: HvColorPickerFieldsClasses;\n}\n\nexport const Fields = (props: FieldsProps) => {\n const {\n className,\n onChange,\n rgb,\n hex,\n classes: classesProp,\n } = useDefaultProps(\"HvColorPickerFields\", props);\n const { classes, cx } = useClasses(classesProp);\n const [internalHex, setInternalHex] = useState(hex);\n const [internalRed, setInternalRed] = useState(rgb?.r);\n const [internalGreen, setInternalGreen] = useState(rgb?.g);\n const [internalBlue, setInternalBlue] = useState(rgb?.b);\n\n const hexInputRef = useRef<HTMLInputElement>(null);\n const redInputRef = useRef<HTMLInputElement>(null);\n const greenInputRef = useRef<HTMLInputElement>(null);\n const blueInputRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (document.activeElement !== hexInputRef.current) {\n setInternalHex(hex);\n }\n }, [hex]);\n\n useEffect(() => {\n if (document.activeElement !== redInputRef.current) {\n setInternalRed(rgb?.r);\n }\n\n if (document.activeElement !== greenInputRef.current) {\n setInternalGreen(rgb?.g);\n }\n\n if (document.activeElement !== blueInputRef.current) {\n setInternalBlue(rgb?.b);\n }\n }, [rgb]);\n\n const handleChange = (\n data: {\n hex?: string;\n r?: number;\n g?: number;\n b?: number;\n },\n event: React.ChangeEvent<HTMLInputElement>\n ) => {\n if (data.hex && color.isValidHex(data.hex)) {\n onChange(\n {\n hex: data.hex,\n source: \"hex\",\n },\n event\n );\n } else if (data.r || data.g || data.b) {\n onChange(\n {\n r: data.r || rgb?.r,\n g: data.g || rgb?.g,\n b: data.b || rgb?.b,\n source: \"rgb\",\n },\n event\n );\n }\n };\n\n const onChangeHex = (event: React.ChangeEvent<any>, value: string) => {\n setInternalHex(value);\n handleChange({ hex: value }, event);\n };\n\n const onChangeRbg = (\n event: React.ChangeEvent<any>,\n value: string,\n colorPart: \"r\" | \"g\" | \"b\"\n ) => {\n if (colorPart === \"r\") setInternalRed(Number(value));\n if (colorPart === \"g\") setInternalGreen(Number(value));\n if (colorPart === \"b\") setInternalBlue(Number(value));\n\n handleChange(\n {\n r: colorPart === \"r\" ? Number(value) : rgb?.r,\n g: colorPart === \"g\" ? Number(value) : rgb?.g,\n b: colorPart === \"b\" ? Number(value) : rgb?.b,\n },\n event\n );\n };\n\n return (\n <div className={cx(classes.fields, className)}>\n <HvInput\n ref={hexInputRef}\n className={classes.double}\n label=\"HEX\"\n value={internalHex?.replace(\"#\", \"\")}\n onChange={onChangeHex}\n onBlur={() => setInternalHex(hex)}\n disableClear\n />\n <HvInput\n ref={redInputRef}\n className={classes.single}\n label=\"R\"\n value={`${internalRed}`}\n onChange={(event, value) => onChangeRbg(event, value, \"r\")}\n onBlur={() => setInternalRed(rgb?.r)}\n disableClear\n />\n <HvInput\n ref={greenInputRef}\n className={classes.single}\n label=\"G\"\n value={`${internalGreen}`}\n onChange={(event, value) => onChangeRbg(event, value, \"g\")}\n onBlur={() => setInternalGreen(rgb?.g)}\n disableClear\n />\n <HvInput\n ref={blueInputRef}\n className={classes.single}\n label=\"B\"\n value={`${internalBlue}`}\n onChange={(event, value) => onChangeRbg(event, value, \"b\")}\n onBlur={() => setInternalBlue(rgb?.b)}\n disableClear\n />\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;;;AAoCa,MAAA,SAAS,CAAC,UAAuB;AACtC,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,EAAA,IACP,gBAAgB,uBAAuB,KAAK;AAChD,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAC9C,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,GAAG;AAClD,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,KAAK,CAAC;AACrD,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAS,KAAK,CAAC;AACzD,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,KAAK,CAAC;AAEjD,QAAA,cAAc,OAAyB,IAAI;AAC3C,QAAA,cAAc,OAAyB,IAAI;AAC3C,QAAA,gBAAgB,OAAyB,IAAI;AAC7C,QAAA,eAAe,OAAyB,IAAI;AAElD,YAAU,MAAM;AACV,QAAA,SAAS,kBAAkB,YAAY,SAAS;AAClD,qBAAe,GAAG;AAAA,IACpB;AAAA,EAAA,GACC,CAAC,GAAG,CAAC;AAER,YAAU,MAAM;AACV,QAAA,SAAS,kBAAkB,YAAY,SAAS;AAClD,qBAAe,KAAK,CAAC;AAAA,IACvB;AAEI,QAAA,SAAS,kBAAkB,cAAc,SAAS;AACpD,uBAAiB,KAAK,CAAC;AAAA,IACzB;AAEI,QAAA,SAAS,kBAAkB,aAAa,SAAS;AACnD,sBAAgB,KAAK,CAAC;AAAA,IACxB;AAAA,EAAA,GACC,CAAC,GAAG,CAAC;AAEF,QAAA,eAAe,CACnB,MAMA,UACG;AACH,QAAI,KAAK,OAAO,MAAM,WAAW,KAAK,GAAG,GAAG;AAC1C;AAAA,QACE;AAAA,UACE,KAAK,KAAK;AAAA,UACV,QAAQ;AAAA,QACV;AAAA,QACA;AAAA,MAAA;AAAA,IACF,WACS,KAAK,KAAK,KAAK,KAAK,KAAK,GAAG;AACrC;AAAA,QACE;AAAA,UACE,GAAG,KAAK,KAAK,KAAK;AAAA,UAClB,GAAG,KAAK,KAAK,KAAK;AAAA,UAClB,GAAG,KAAK,KAAK,KAAK;AAAA,UAClB,QAAQ;AAAA,QACV;AAAA,QACA;AAAA,MAAA;AAAA,IAEJ;AAAA,EAAA;AAGI,QAAA,cAAc,CAAC,OAA+B,UAAkB;AACpE,mBAAe,KAAK;AACpB,iBAAa,EAAE,KAAK,MAAM,GAAG,KAAK;AAAA,EAAA;AAGpC,QAAM,cAAc,CAClB,OACA,OACA,cACG;AACH,QAAI,cAAc;AAAoB,qBAAA,OAAO,KAAK,CAAC;AACnD,QAAI,cAAc;AAAsB,uBAAA,OAAO,KAAK,CAAC;AACrD,QAAI,cAAc;AAAqB,sBAAA,OAAO,KAAK,CAAC;AAEpD;AAAA,MACE;AAAA,QACE,GAAG,cAAc,MAAM,OAAO,KAAK,IAAI,KAAK;AAAA,QAC5C,GAAG,cAAc,MAAM,OAAO,KAAK,IAAI,KAAK;AAAA,QAC5C,GAAG,cAAc,MAAM,OAAO,KAAK,IAAI,KAAK;AAAA,MAC9C;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAGF,8BACG,OAAI,EAAA,WAAW,GAAG,QAAQ,QAAQ,SAAS,GAC1C,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAK;AAAA,QACL,WAAW,QAAQ;AAAA,QACnB,OAAM;AAAA,QACN,OAAO,aAAa,QAAQ,KAAK,EAAE;AAAA,QACnC,UAAU;AAAA,QACV,QAAQ,MAAM,eAAe,GAAG;AAAA,QAChC,cAAY;AAAA,MAAA;AAAA,IACd;AAAA,IACA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAK;AAAA,QACL,WAAW,QAAQ;AAAA,QACnB,OAAM;AAAA,QACN,OAAO,GAAG,WAAW;AAAA,QACrB,UAAU,CAAC,OAAO,UAAU,YAAY,OAAO,OAAO,GAAG;AAAA,QACzD,QAAQ,MAAM,eAAe,KAAK,CAAC;AAAA,QACnC,cAAY;AAAA,MAAA;AAAA,IACd;AAAA,IACA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAK;AAAA,QACL,WAAW,QAAQ;AAAA,QACnB,OAAM;AAAA,QACN,OAAO,GAAG,aAAa;AAAA,QACvB,UAAU,CAAC,OAAO,UAAU,YAAY,OAAO,OAAO,GAAG;AAAA,QACzD,QAAQ,MAAM,iBAAiB,KAAK,CAAC;AAAA,QACrC,cAAY;AAAA,MAAA;AAAA,IACd;AAAA,IACA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAK;AAAA,QACL,WAAW,QAAQ;AAAA,QACnB,OAAM;AAAA,QACN,OAAO,GAAG,YAAY;AAAA,QACtB,UAAU,CAAC,OAAO,UAAU,YAAY,OAAO,OAAO,GAAG;AAAA,QACzD,QAAQ,MAAM,gBAAgB,KAAK,CAAC;AAAA,QACpC,cAAY;AAAA,MAAA;AAAA,IACd;AAAA,EACF,EAAA,CAAA;AAEJ;"}
@@ -37,7 +37,10 @@ const { staticClasses, useClasses } = createClasses("HvDatePicker", {
37
37
  }
38
38
  },
39
39
  inputText: {
40
- color: theme.colors.secondary_80
40
+ color: theme.colors.secondary_80,
41
+ overflow: "hidden",
42
+ textOverflow: "ellipsis",
43
+ whiteSpace: "nowrap"
41
44
  },
42
45
  dateText: {
43
46
  color: theme.colors.secondary
@@ -1 +1 @@
1
- {"version":3,"file":"DatePicker.styles.mjs","sources":["../../../src/DatePicker/DatePicker.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvDatePicker\", {\n root: {\n position: \"relative\",\n },\n actionContainer: {\n justifyContent: \"space-between\",\n },\n leftContainer: {},\n rightContainer: {},\n\n labelContainer: {\n display: \"flex\",\n alignItems: \"flex-start\",\n },\n label: {\n paddingBottom: \"6px\",\n display: \"block\",\n },\n description: {},\n error: {},\n\n dropdown: {\n display: \"block\",\n },\n panel: {},\n\n dropdownHeaderInvalid: {\n border: `1px solid ${theme.colors.negative}`,\n \"&:hover\": {\n border: `1px solid ${theme.colors.negative}`,\n },\n },\n dropdownHeaderOpen: {},\n icon: {},\n action: {\n \"&:first-of-type\": {\n marginRight: theme.space.xs,\n },\n },\n inputText: {\n color: theme.colors.secondary_80,\n },\n dateText: {\n color: theme.colors.secondary,\n },\n});\n"],"names":[],"mappings":";;AAIO,MAAM,EAAE,eAAe,eAAe,cAAc,gBAAgB;AAAA,EACzE,MAAM;AAAA,IACJ,UAAU;AAAA,EACZ;AAAA,EACA,iBAAiB;AAAA,IACf,gBAAgB;AAAA,EAClB;AAAA,EACA,eAAe,CAAC;AAAA,EAChB,gBAAgB,CAAC;AAAA,EAEjB,gBAAgB;AAAA,IACd,SAAS;AAAA,IACT,YAAY;AAAA,EACd;AAAA,EACA,OAAO;AAAA,IACL,eAAe;AAAA,IACf,SAAS;AAAA,EACX;AAAA,EACA,aAAa,CAAC;AAAA,EACd,OAAO,CAAC;AAAA,EAER,UAAU;AAAA,IACR,SAAS;AAAA,EACX;AAAA,EACA,OAAO,CAAC;AAAA,EAER,uBAAuB;AAAA,IACrB,QAAQ,aAAa,MAAM,OAAO,QAAQ;AAAA,IAC1C,WAAW;AAAA,MACT,QAAQ,aAAa,MAAM,OAAO,QAAQ;AAAA,IAC5C;AAAA,EACF;AAAA,EACA,oBAAoB,CAAC;AAAA,EACrB,MAAM,CAAC;AAAA,EACP,QAAQ;AAAA,IACN,mBAAmB;AAAA,MACjB,aAAa,MAAM,MAAM;AAAA,IAC3B;AAAA,EACF;AAAA,EACA,WAAW;AAAA,IACT,OAAO,MAAM,OAAO;AAAA,EACtB;AAAA,EACA,UAAU;AAAA,IACR,OAAO,MAAM,OAAO;AAAA,EACtB;AACF,CAAC;"}
1
+ {"version":3,"file":"DatePicker.styles.mjs","sources":["../../../src/DatePicker/DatePicker.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvDatePicker\", {\n root: {\n position: \"relative\",\n },\n actionContainer: {\n justifyContent: \"space-between\",\n },\n leftContainer: {},\n rightContainer: {},\n\n labelContainer: {\n display: \"flex\",\n alignItems: \"flex-start\",\n },\n label: {\n paddingBottom: \"6px\",\n display: \"block\",\n },\n description: {},\n error: {},\n\n dropdown: {\n display: \"block\",\n },\n panel: {},\n\n dropdownHeaderInvalid: {\n border: `1px solid ${theme.colors.negative}`,\n \"&:hover\": {\n border: `1px solid ${theme.colors.negative}`,\n },\n },\n dropdownHeaderOpen: {},\n icon: {},\n action: {\n \"&:first-of-type\": {\n marginRight: theme.space.xs,\n },\n },\n inputText: {\n color: theme.colors.secondary_80,\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n },\n dateText: {\n color: theme.colors.secondary,\n },\n});\n"],"names":[],"mappings":";;AAIO,MAAM,EAAE,eAAe,eAAe,cAAc,gBAAgB;AAAA,EACzE,MAAM;AAAA,IACJ,UAAU;AAAA,EACZ;AAAA,EACA,iBAAiB;AAAA,IACf,gBAAgB;AAAA,EAClB;AAAA,EACA,eAAe,CAAC;AAAA,EAChB,gBAAgB,CAAC;AAAA,EAEjB,gBAAgB;AAAA,IACd,SAAS;AAAA,IACT,YAAY;AAAA,EACd;AAAA,EACA,OAAO;AAAA,IACL,eAAe;AAAA,IACf,SAAS;AAAA,EACX;AAAA,EACA,aAAa,CAAC;AAAA,EACd,OAAO,CAAC;AAAA,EAER,UAAU;AAAA,IACR,SAAS;AAAA,EACX;AAAA,EACA,OAAO,CAAC;AAAA,EAER,uBAAuB;AAAA,IACrB,QAAQ,aAAa,MAAM,OAAO,QAAQ;AAAA,IAC1C,WAAW;AAAA,MACT,QAAQ,aAAa,MAAM,OAAO,QAAQ;AAAA,IAC5C;AAAA,EACF;AAAA,EACA,oBAAoB,CAAC;AAAA,EACrB,MAAM,CAAC;AAAA,EACP,QAAQ;AAAA,IACN,mBAAmB;AAAA,MACjB,aAAa,MAAM,MAAM;AAAA,IAC3B;AAAA,EACF;AAAA,EACA,WAAW;AAAA,IACT,OAAO,MAAM,OAAO;AAAA,IACpB,UAAU;AAAA,IACV,cAAc;AAAA,IACd,YAAY;AAAA,EACd;AAAA,EACA,UAAU;AAAA,IACR,OAAO,MAAM,OAAO;AAAA,EACtB;AACF,CAAC;"}
@@ -1 +1 @@
1
- {"version":3,"file":"useVisibleDate.mjs","sources":["../../../src/DatePicker/useVisibleDate.tsx"],"sourcesContent":["import { Reducer, useReducer } from \"react\";\n\nimport { VisibilitySelectorActions } from \"../Calendar\";\n\nimport { validateDate } from \"./utils\";\n\nfunction stateToLeftRight({\n visibleYear,\n visibleMonth,\n rightVisibleYear,\n rightVisibleMonth,\n}) {\n return {\n left: { year: visibleYear, month: visibleMonth },\n right: { year: rightVisibleYear, month: rightVisibleMonth },\n };\n}\n\nfunction leftRightToState(left, right) {\n return {\n visibleYear: left.year,\n visibleMonth: left.month,\n rightVisibleYear: right.year,\n rightVisibleMonth: right.month,\n };\n}\n\nfunction subtractYear({ year, month }) {\n return { year: year - 1, month };\n}\n\nfunction addYear({ year, month }) {\n return { year: year + 1, month };\n}\n\nfunction subtractMonth({ year, month }) {\n let y = year;\n let m = month;\n\n m -= 1;\n if (m === 0) {\n y -= 1;\n m = 12;\n }\n\n return { year: y, month: m };\n}\n\nfunction addMonth({ year, month }) {\n let y = year;\n let m = month;\n\n m += 1;\n if (m === 13) {\n y += 1;\n m = 1;\n }\n\n return { year: y, month: m };\n}\n\nfunction ensureNoOverlap(left, right, keepRight = false) {\n let l = left;\n let r = right;\n if (\n left.year > right.year ||\n (left.year === right.year && left.month >= right.month)\n ) {\n if (keepRight) {\n l = subtractMonth(right);\n } else {\n r = addMonth(left);\n }\n }\n\n return leftRightToState(l, r);\n}\n\nexport function isSameYearMonth(d1, d2) {\n return d1.year === d2.year && d1.month === d2.month;\n}\n\ntype State = {\n visibleYear: any;\n visibleMonth: any;\n rightVisibleYear: any;\n rightVisibleMonth: any;\n};\ntype Action = { type: VisibilitySelectorActions } & Record<string, any>;\n\nconst visibleDateReducer: Reducer<State, Action> = (state, action) => {\n let { left, right } = stateToLeftRight(state);\n\n switch (action.type) {\n case \"previous_year\":\n if (action.target === \"right\") {\n right = subtractYear(right);\n return ensureNoOverlap(left, right, true);\n }\n\n left = subtractYear(left);\n return ensureNoOverlap(left, right, false);\n\n case \"next_year\":\n if (action.target === \"right\") {\n right = addYear(right);\n return ensureNoOverlap(left, right, true);\n }\n\n left = addYear(left);\n return ensureNoOverlap(left, right, false);\n\n case \"previous_month\":\n if (action.target === \"right\") {\n right = subtractMonth(right);\n return ensureNoOverlap(left, right, true);\n }\n\n left = subtractMonth(left);\n return ensureNoOverlap(left, right, false);\n\n case \"next_month\":\n if (action.target === \"right\") {\n right = addMonth(right);\n return ensureNoOverlap(left, right, true);\n }\n\n left = addMonth(left);\n return ensureNoOverlap(left, right, false);\n\n case \"month\":\n if (action.month != null) {\n if (action.target === \"right\") {\n if (right.month !== action.month) {\n right = { year: right.year, month: action.month };\n return ensureNoOverlap(left, right, true);\n }\n } else if (left.month !== action.month) {\n left = { year: left.year, month: action.month };\n return ensureNoOverlap(left, right, false);\n }\n }\n break;\n\n case \"month_year\":\n if (action.month != null && action.year != null) {\n if (action.target === \"right\") {\n if (\n !isSameYearMonth(left, action) &&\n !isSameYearMonth(right, action)\n ) {\n right = { year: action.year, month: action.month };\n return ensureNoOverlap(left, right, true);\n }\n } else if (\n !isSameYearMonth(left, action) &&\n (action.target === \"left\" || !isSameYearMonth(right, action))\n ) {\n left = { year: action.year, month: action.month };\n return ensureNoOverlap(left, right, false);\n }\n }\n\n break;\n\n default:\n }\n\n return state;\n};\n\nfunction stateFromRange(startDate, endDate) {\n const initialStartDate = validateDate(startDate);\n const initialEndDate =\n endDate != null ? validateDate(endDate) : initialStartDate;\n\n return ensureNoOverlap(\n {\n year: initialStartDate.getFullYear(),\n month: initialStartDate.getMonth() + 1,\n },\n { year: initialEndDate.getFullYear(), month: initialEndDate.getMonth() + 1 }\n );\n}\n\nexport default function useVisibleDate(startDate?: Date, endDate?: Date) {\n return useReducer(visibleDateReducer, { startDate, endDate }, (initData) =>\n stateFromRange(initData.startDate, initData.endDate)\n );\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"useVisibleDate.mjs","sources":["../../../src/DatePicker/useVisibleDate.tsx"],"sourcesContent":["import { Reducer, useReducer } from \"react\";\n\nimport { VisibilitySelectorActions } from \"../Calendar\";\n\nimport { validateDate } from \"./utils\";\n\nfunction stateToLeftRight({\n visibleYear,\n visibleMonth,\n rightVisibleYear,\n rightVisibleMonth,\n}: any) {\n return {\n left: { year: visibleYear, month: visibleMonth },\n right: { year: rightVisibleYear, month: rightVisibleMonth },\n };\n}\n\nfunction leftRightToState(left: any, right: any) {\n return {\n visibleYear: left.year,\n visibleMonth: left.month,\n rightVisibleYear: right.year,\n rightVisibleMonth: right.month,\n };\n}\n\nfunction subtractYear({ year, month }: any) {\n return { year: year - 1, month };\n}\n\nfunction addYear({ year, month }: any) {\n return { year: year + 1, month };\n}\n\nfunction subtractMonth({ year, month }: any) {\n let y = year;\n let m = month;\n\n m -= 1;\n if (m === 0) {\n y -= 1;\n m = 12;\n }\n\n return { year: y, month: m };\n}\n\nfunction addMonth({ year, month }: any) {\n let y = year;\n let m = month;\n\n m += 1;\n if (m === 13) {\n y += 1;\n m = 1;\n }\n\n return { year: y, month: m };\n}\n\nfunction ensureNoOverlap(left: any, right: any, keepRight = false) {\n let l = left;\n let r = right;\n if (\n left.year > right.year ||\n (left.year === right.year && left.month >= right.month)\n ) {\n if (keepRight) {\n l = subtractMonth(right);\n } else {\n r = addMonth(left);\n }\n }\n\n return leftRightToState(l, r);\n}\n\nexport function isSameYearMonth(d1: any, d2: any) {\n return d1.year === d2.year && d1.month === d2.month;\n}\n\ntype State = {\n visibleYear: any;\n visibleMonth: any;\n rightVisibleYear: any;\n rightVisibleMonth: any;\n};\ntype Action = { type: VisibilitySelectorActions } & Record<string, any>;\n\nconst visibleDateReducer: Reducer<State, Action> = (state, action) => {\n let { left, right } = stateToLeftRight(state);\n\n switch (action.type) {\n case \"previous_year\":\n if (action.target === \"right\") {\n right = subtractYear(right);\n return ensureNoOverlap(left, right, true);\n }\n\n left = subtractYear(left);\n return ensureNoOverlap(left, right, false);\n\n case \"next_year\":\n if (action.target === \"right\") {\n right = addYear(right);\n return ensureNoOverlap(left, right, true);\n }\n\n left = addYear(left);\n return ensureNoOverlap(left, right, false);\n\n case \"previous_month\":\n if (action.target === \"right\") {\n right = subtractMonth(right);\n return ensureNoOverlap(left, right, true);\n }\n\n left = subtractMonth(left);\n return ensureNoOverlap(left, right, false);\n\n case \"next_month\":\n if (action.target === \"right\") {\n right = addMonth(right);\n return ensureNoOverlap(left, right, true);\n }\n\n left = addMonth(left);\n return ensureNoOverlap(left, right, false);\n\n case \"month\":\n if (action.month != null) {\n if (action.target === \"right\") {\n if (right.month !== action.month) {\n right = { year: right.year, month: action.month };\n return ensureNoOverlap(left, right, true);\n }\n } else if (left.month !== action.month) {\n left = { year: left.year, month: action.month };\n return ensureNoOverlap(left, right, false);\n }\n }\n break;\n\n case \"month_year\":\n if (action.month != null && action.year != null) {\n if (action.target === \"right\") {\n if (\n !isSameYearMonth(left, action) &&\n !isSameYearMonth(right, action)\n ) {\n right = { year: action.year, month: action.month };\n return ensureNoOverlap(left, right, true);\n }\n } else if (\n !isSameYearMonth(left, action) &&\n (action.target === \"left\" || !isSameYearMonth(right, action))\n ) {\n left = { year: action.year, month: action.month };\n return ensureNoOverlap(left, right, false);\n }\n }\n\n break;\n\n default:\n }\n\n return state;\n};\n\nfunction stateFromRange(startDate: any, endDate: any) {\n const initialStartDate = validateDate(startDate);\n const initialEndDate =\n endDate != null ? validateDate(endDate) : initialStartDate;\n\n return ensureNoOverlap(\n {\n year: initialStartDate.getFullYear(),\n month: initialStartDate.getMonth() + 1,\n },\n { year: initialEndDate.getFullYear(), month: initialEndDate.getMonth() + 1 }\n );\n}\n\nexport default function useVisibleDate(startDate?: Date, endDate?: Date) {\n return useReducer(visibleDateReducer, { startDate, endDate }, (initData) =>\n stateFromRange(initData.startDate, initData.endDate)\n );\n}\n"],"names":[],"mappings":"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"}
@@ -9,7 +9,8 @@ const HvDialogContent = (props) => {
9
9
  classes: classesProp,
10
10
  className,
11
11
  children,
12
- indentContent = false
12
+ indentContent = false,
13
+ ...others
13
14
  } = useDefaultProps("HvDialogContent", props);
14
15
  const { classes, cx } = useClasses(classesProp);
15
16
  return /* @__PURE__ */ jsx(
@@ -21,6 +22,7 @@ const HvDialogContent = (props) => {
21
22
  { [classes.textContent]: !!indentContent },
22
23
  className
23
24
  ),
25
+ ...others,
24
26
  children
25
27
  }
26
28
  );
@@ -1 +1 @@
1
- {"version":3,"file":"Content.mjs","sources":["../../../../src/Dialog/Content/Content.tsx"],"sourcesContent":["import MuiDialogContent, {\n DialogContentProps as MuiDialogContentProps,\n} from \"@mui/material/DialogContent\";\n\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\n\nimport { ExtractNames } from \"../../utils/classes\";\nimport { HvTypography } from \"../../Typography\";\n\nimport { staticClasses, useClasses } from \"./Content.styles\";\n\nexport { staticClasses as dialogContentClasses };\n\nexport type HvDialogContentClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDialogContentProps\n extends Omit<MuiDialogContentProps, \"classes\"> {\n /** Content should be indented in relationship to the Dialog title. */\n indentContent?: boolean;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvDialogContentClasses;\n}\n\nexport const HvDialogContent = (props: HvDialogContentProps) => {\n const {\n classes: classesProp,\n className,\n children,\n indentContent = false,\n } = useDefaultProps(\"HvDialogContent\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n return (\n <HvTypography\n component={MuiDialogContent}\n className={cx(\n classes.root,\n { [classes.textContent]: !!indentContent },\n className\n )}\n >\n {children}\n </HvTypography>\n );\n};\n"],"names":[],"mappings":";;;;;;AAuBa,MAAA,kBAAkB,CAAC,UAAgC;AACxD,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,EAAA,IACd,gBAAgB,mBAAmB,KAAK;AAE5C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAG5C,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,MACX,WAAW;AAAA,QACT,QAAQ;AAAA,QACR,EAAE,CAAC,QAAQ,WAAW,GAAG,CAAC,CAAC,cAAc;AAAA,QACzC;AAAA,MACF;AAAA,MAEC;AAAA,IAAA;AAAA,EAAA;AAGP;"}
1
+ {"version":3,"file":"Content.mjs","sources":["../../../../src/Dialog/Content/Content.tsx"],"sourcesContent":["import MuiDialogContent, {\n DialogContentProps as MuiDialogContentProps,\n} from \"@mui/material/DialogContent\";\n\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\n\nimport { ExtractNames } from \"../../utils/classes\";\nimport { HvTypography } from \"../../Typography\";\n\nimport { staticClasses, useClasses } from \"./Content.styles\";\n\nexport { staticClasses as dialogContentClasses };\n\nexport type HvDialogContentClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDialogContentProps\n extends Omit<MuiDialogContentProps, \"classes\"> {\n /** Content should be indented in relationship to the Dialog title. */\n indentContent?: boolean;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvDialogContentClasses;\n}\n\nexport const HvDialogContent = (props: HvDialogContentProps) => {\n const {\n classes: classesProp,\n className,\n children,\n indentContent = false,\n ...others\n } = useDefaultProps(\"HvDialogContent\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n return (\n <HvTypography\n component={MuiDialogContent}\n className={cx(\n classes.root,\n { [classes.textContent]: !!indentContent },\n className\n )}\n {...others}\n >\n {children}\n </HvTypography>\n );\n};\n"],"names":[],"mappings":";;;;;;AAuBa,MAAA,kBAAkB,CAAC,UAAgC;AACxD,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB,GAAG;AAAA,EAAA,IACD,gBAAgB,mBAAmB,KAAK;AAE5C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAG5C,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,MACX,WAAW;AAAA,QACT,QAAQ;AAAA,QACR,EAAE,CAAC,QAAQ,WAAW,GAAG,CAAC,CAAC,cAAc;AAAA,QACzC;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAAA;AAGP;"}
@@ -35,10 +35,8 @@ const HvDrawer = (props) => {
35
35
  id,
36
36
  anchor,
37
37
  open,
38
- PaperProps: {
39
- classes: {
40
- root: classes.paper
41
- }
38
+ classes: {
39
+ paper: classes.paper
42
40
  },
43
41
  hideBackdrop: shouldHideBackdrop,
44
42
  ...!shouldHideBackdrop && {
@@ -1 +1 @@
1
- {"version":3,"file":"Drawer.mjs","sources":["../../../src/Drawer/Drawer.tsx"],"sourcesContent":["import MuiDrawer, { DrawerProps as MuiDrawerProps } from \"@mui/material/Drawer\";\nimport { Close } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { IconButton } from \"../utils/IconButton\";\nimport { setId } from \"../utils/setId\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Drawer.styles\";\n\nexport { staticClasses as drawerClasses };\n\nexport type HvDrawerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDrawerProps extends Omit<MuiDrawerProps, \"classes\"> {\n /**\n * Class names to be applied.\n */\n className?: string;\n /**\n * Id to be applied to the root node.\n */\n id?: string;\n /**\n * A Jss Object used to override or extend the styles applied.\n */\n classes?: HvDrawerClasses;\n /**\n * Components of the Drawer.\n */\n children?: React.ReactNode;\n /**\n * Current state of the Drawer.\n */\n open?: boolean;\n /**\n * Function executed on close.\n * Extended from Modal from material-ui\n *\n */\n onClose?: (\n event: React.SyntheticEvent,\n reason?: \"escapeKeyDown\" | \"backdropClick\"\n ) => void;\n /**\n * The side the drawer opens from.\n */\n anchor?: \"left\" | \"top\" | \"right\" | \"bottom\";\n /**\n * Title for the button close.\n */\n buttonTitle?: string;\n /**\n * Show backdrop when drawer is open.\n * @deprecated Use `hideBackdrop` instead.\n */\n showBackdrop?: boolean;\n /**\n * Prevent closing the dialog when clicking on the backdrop.\n */\n disableBackdropClick?: boolean;\n /** @ignore */\n ref?: MuiDrawerProps[\"ref\"];\n /** @ignore */\n component?: MuiDrawerProps[\"component\"];\n}\n\n/**\n * The Drawer component provides a foundation to create a sliding pane.\n * It only provides the pane with a close button, the rest of the\n * content can be customized.\n */\nexport const HvDrawer = (props: HvDrawerProps) => {\n const {\n className,\n classes: classesProp,\n id,\n children,\n open,\n onClose,\n anchor = \"right\",\n buttonTitle = \"Close\",\n showBackdrop = true,\n hideBackdrop,\n disableBackdropClick = false,\n ...others\n } = useDefaultProps(\"HvDrawer\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const handleOnClose: MuiDrawerProps[\"onClose\"] = (\n event: React.SyntheticEvent,\n reason\n ) => {\n if (reason === \"backdropClick\" && disableBackdropClick) return;\n\n onClose?.(event, reason);\n };\n\n const shouldHideBackdrop = hideBackdrop ?? !showBackdrop;\n\n return (\n <MuiDrawer\n className={cx(classes.root, className)}\n id={id}\n anchor={anchor}\n open={open}\n PaperProps={{\n classes: {\n root: classes.paper,\n },\n }}\n hideBackdrop={shouldHideBackdrop}\n {...(!shouldHideBackdrop && {\n slotProps: {\n backdrop: {\n classes: {\n root: classes.background,\n },\n onClick: (event) => {\n if (disableBackdropClick) return;\n onClose?.(event, \"backdropClick\");\n },\n },\n },\n })}\n onClose={handleOnClose}\n {...others}\n >\n <IconButton\n id={setId(id, \"close\")}\n className={classes.closeButton}\n variant=\"secondaryGhost\"\n onClick={onClose}\n title={buttonTitle}\n >\n <Close role=\"none\" />\n </IconButton>\n {children}\n </MuiDrawer>\n );\n};\n"],"names":[],"mappings":";;;;;;;;AAwEa,MAAA,WAAW,CAAC,UAAyB;AAC1C,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,cAAc;AAAA,IACd,eAAe;AAAA,IACf;AAAA,IACA,uBAAuB;AAAA,IACvB,GAAG;AAAA,EAAA,IACD,gBAAgB,YAAY,KAAK;AAErC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,QAAA,gBAA2C,CAC/C,OACA,WACG;AACH,QAAI,WAAW,mBAAmB;AAAsB;AAExD,cAAU,OAAO,MAAM;AAAA,EAAA;AAGnB,QAAA,qBAAqB,gBAAgB,CAAC;AAG1C,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,MACrC;AAAA,MACA;AAAA,MACA;AAAA,MACA,YAAY;AAAA,QACV,SAAS;AAAA,UACP,MAAM,QAAQ;AAAA,QAChB;AAAA,MACF;AAAA,MACA,cAAc;AAAA,MACb,GAAI,CAAC,sBAAsB;AAAA,QAC1B,WAAW;AAAA,UACT,UAAU;AAAA,YACR,SAAS;AAAA,cACP,MAAM,QAAQ;AAAA,YAChB;AAAA,YACA,SAAS,CAAC,UAAU;AACd,kBAAA;AAAsB;AAC1B,wBAAU,OAAO,eAAe;AAAA,YAClC;AAAA,UACF;AAAA,QACF;AAAA,MACF;AAAA,MACA,SAAS;AAAA,MACR,GAAG;AAAA,MAEJ,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAI,MAAM,IAAI,OAAO;AAAA,YACrB,WAAW,QAAQ;AAAA,YACnB,SAAQ;AAAA,YACR,SAAS;AAAA,YACT,OAAO;AAAA,YAEP,UAAA,oBAAC,OAAM,EAAA,MAAK,OAAO,CAAA;AAAA,UAAA;AAAA,QACrB;AAAA,QACC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP;"}
1
+ {"version":3,"file":"Drawer.mjs","sources":["../../../src/Drawer/Drawer.tsx"],"sourcesContent":["import MuiDrawer, { DrawerProps as MuiDrawerProps } from \"@mui/material/Drawer\";\nimport { Close } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { IconButton } from \"../utils/IconButton\";\nimport { setId } from \"../utils/setId\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Drawer.styles\";\n\nexport { staticClasses as drawerClasses };\n\nexport type HvDrawerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDrawerProps extends Omit<MuiDrawerProps, \"classes\"> {\n /**\n * Class names to be applied.\n */\n className?: string;\n /**\n * Id to be applied to the root node.\n */\n id?: string;\n /**\n * A Jss Object used to override or extend the styles applied.\n */\n classes?: HvDrawerClasses;\n /**\n * Components of the Drawer.\n */\n children?: React.ReactNode;\n /**\n * Current state of the Drawer.\n */\n open?: boolean;\n /**\n * Function executed on close.\n * Extended from Modal from material-ui\n *\n */\n onClose?: (\n event: React.SyntheticEvent,\n reason?: \"escapeKeyDown\" | \"backdropClick\"\n ) => void;\n /**\n * The side the drawer opens from.\n */\n anchor?: \"left\" | \"top\" | \"right\" | \"bottom\";\n /**\n * Title for the button close.\n */\n buttonTitle?: string;\n /**\n * Show backdrop when drawer is open.\n * @deprecated Use `hideBackdrop` instead.\n */\n showBackdrop?: boolean;\n /**\n * Prevent closing the dialog when clicking on the backdrop.\n */\n disableBackdropClick?: boolean;\n /** @ignore */\n ref?: MuiDrawerProps[\"ref\"];\n /** @ignore */\n component?: MuiDrawerProps[\"component\"];\n}\n\n/**\n * The Drawer component provides a foundation to create a sliding pane.\n * It only provides the pane with a close button, the rest of the\n * content can be customized.\n */\nexport const HvDrawer = (props: HvDrawerProps) => {\n const {\n className,\n classes: classesProp,\n id,\n children,\n open,\n onClose,\n anchor = \"right\",\n buttonTitle = \"Close\",\n showBackdrop = true,\n hideBackdrop,\n disableBackdropClick = false,\n ...others\n } = useDefaultProps(\"HvDrawer\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const handleOnClose: MuiDrawerProps[\"onClose\"] = (\n event: React.SyntheticEvent,\n reason\n ) => {\n if (reason === \"backdropClick\" && disableBackdropClick) return;\n\n onClose?.(event, reason);\n };\n\n const shouldHideBackdrop = hideBackdrop ?? !showBackdrop;\n\n return (\n <MuiDrawer\n className={cx(classes.root, className)}\n id={id}\n anchor={anchor}\n open={open}\n classes={{\n paper: classes.paper,\n }}\n hideBackdrop={shouldHideBackdrop}\n {...(!shouldHideBackdrop && {\n slotProps: {\n backdrop: {\n classes: {\n root: classes.background,\n },\n onClick: (event) => {\n if (disableBackdropClick) return;\n onClose?.(event, \"backdropClick\");\n },\n },\n },\n })}\n onClose={handleOnClose}\n {...others}\n >\n <IconButton\n id={setId(id, \"close\")}\n className={classes.closeButton}\n variant=\"secondaryGhost\"\n onClick={onClose}\n title={buttonTitle}\n >\n <Close role=\"none\" />\n </IconButton>\n {children}\n </MuiDrawer>\n );\n};\n"],"names":[],"mappings":";;;;;;;;AAwEa,MAAA,WAAW,CAAC,UAAyB;AAC1C,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,cAAc;AAAA,IACd,eAAe;AAAA,IACf;AAAA,IACA,uBAAuB;AAAA,IACvB,GAAG;AAAA,EAAA,IACD,gBAAgB,YAAY,KAAK;AAErC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,QAAA,gBAA2C,CAC/C,OACA,WACG;AACH,QAAI,WAAW,mBAAmB;AAAsB;AAExD,cAAU,OAAO,MAAM;AAAA,EAAA;AAGnB,QAAA,qBAAqB,gBAAgB,CAAC;AAG1C,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,MACrC;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAS;AAAA,QACP,OAAO,QAAQ;AAAA,MACjB;AAAA,MACA,cAAc;AAAA,MACb,GAAI,CAAC,sBAAsB;AAAA,QAC1B,WAAW;AAAA,UACT,UAAU;AAAA,YACR,SAAS;AAAA,cACP,MAAM,QAAQ;AAAA,YAChB;AAAA,YACA,SAAS,CAAC,UAAU;AACd,kBAAA;AAAsB;AAC1B,wBAAU,OAAO,eAAe;AAAA,YAClC;AAAA,UACF;AAAA,QACF;AAAA,MACF;AAAA,MACA,SAAS;AAAA,MACR,GAAG;AAAA,MAEJ,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAI,MAAM,IAAI,OAAO;AAAA,YACrB,WAAW,QAAQ;AAAA,YACnB,SAAQ;AAAA,YACR,SAAS;AAAA,YACT,OAAO;AAAA,YAEP,UAAA,oBAAC,OAAM,EAAA,MAAK,OAAO,CAAA;AAAA,UAAA;AAAA,QACrB;AAAA,QACC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP;"}
@@ -36,9 +36,8 @@ const HvDropZone = (props) => {
36
36
  setDrag(true);
37
37
  };
38
38
  const onChangeHandler = (filesList) => {
39
- const filesToProcess = Object.keys(filesList).map((e) => filesList[e]);
40
- const newFiles = [];
41
- filesToProcess.forEach((file) => {
39
+ const filesToProcess = Object.values(filesList);
40
+ const newFiles = filesToProcess.map((file) => {
42
41
  const newFile = file;
43
42
  const isSizeAllowed = file.size <= maxFileSize;
44
43
  const isFileAccepted = !acceptedFiles.length || acceptedFiles.indexOf(file.type.split("/")[1]) > -1 || acceptedFiles.some(
@@ -52,7 +51,7 @@ const HvDropZone = (props) => {
52
51
  newFile.status = "fail";
53
52
  }
54
53
  newFile.id = uniqueId("uploaded-file-data-");
55
- newFiles.push(newFile);
54
+ return newFile;
56
55
  });
57
56
  onFilesAdded?.(newFiles);
58
57
  };
@@ -1 +1 @@
1
- {"version":3,"file":"DropZone.mjs","sources":["../../../../src/FileUploader/DropZone/DropZone.tsx"],"sourcesContent":["import React, { useRef, useState } from \"react\";\n\nimport uniqueId from \"lodash/uniqueId\";\n\nimport accept from \"attr-accept\";\n\nimport { Doc } from \"@hitachivantara/uikit-react-icons\";\n\nimport { setId } from \"../../utils/setId\";\nimport { useUniqueId } from \"../../hooks/useUniqueId\";\n\nimport { HvTypography } from \"../../Typography\";\nimport { HvInfoMessage, HvLabel } from \"../../Forms\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\n\nimport { convertUnits } from \"../utils\";\nimport { HvFileData, HvFilesAddedEvent } from \"../File\";\n\nimport { staticClasses, useClasses } from \"./DropZone.styles\";\n\nexport { staticClasses as dropZoneClasses };\n\nexport type HvDropZoneClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDropZoneLabels {\n /**\n * Extensions of the accepted file types\n */\n acceptedFiles?: string;\n /**\n * Dropzone area label.\n */\n dropzone?: string;\n /**\n * Size file warning label.\n */\n sizeWarning?: string;\n /**\n * Size file warning label.\n */\n drag?: string;\n /**\n * Size file warning label.\n */\n selectFiles?: string;\n /**\n * Theming sheet used to style components\n * */\n dropFiles?: string;\n /**\n * Message to display when file size is greater than allowed\n * */\n fileSizeError?: string;\n /**\n * Message to display when file type is greater than allowed\n * */\n fileTypeError?: string;\n}\n\nexport interface HvDropZoneProps {\n /**\n * Id to be applied to the root node.\n */\n id?: string;\n /**\n * Labels to present in FileUploader.\n */\n labels?: HvDropZoneLabels;\n /**\n * Whether the Dropzone should accept multiple files at once.\n */\n multiple?: boolean;\n /**\n * If the input is disabled or not\n */\n disabled?: boolean;\n /**\n * Files extensions accepted for upload.\n */\n acceptedFiles: string[];\n /**\n * Max upload size\n * */\n maxFileSize: number;\n /**\n * Function responsible for processing files added to the drop zone.\n */\n onFilesAdded?: HvFilesAddedEvent;\n /**\n * Whether the DropZone should hide labels or not.\n */\n hideLabels?: boolean;\n /**\n * Attributes applied to the input element.\n */\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /**\n * A Jss Object used to override or extend the styles applied to the component.\n */\n classes?: HvDropZoneClasses;\n}\n\nexport const HvDropZone = (props: HvDropZoneProps) => {\n const {\n id: idProp,\n classes: classesProp,\n labels,\n acceptedFiles,\n maxFileSize,\n inputProps,\n hideLabels,\n multiple = true,\n disabled = false,\n onFilesAdded,\n } = useDefaultProps(\"HvDropZone\", props);\n const id = useUniqueId(idProp, \"dropzone\");\n\n const { classes, cx } = useClasses(classesProp);\n\n const [dragState, setDrag] = useState<boolean>(false);\n\n const inputRef = useRef<HTMLInputElement | null>(null);\n\n const leaveDropArea = () => {\n setDrag(false);\n };\n\n const enterDropArea = () => {\n setDrag(true);\n };\n\n const onChangeHandler = (filesList: FileList) => {\n const filesToProcess = Object.keys(filesList).map((e) => filesList[e]);\n\n const newFiles: HvFileData[] = [];\n\n filesToProcess.forEach((file: File) => {\n const newFile: HvFileData = file;\n\n const isSizeAllowed = file.size <= maxFileSize;\n const isFileAccepted =\n !acceptedFiles.length ||\n acceptedFiles.indexOf(file.type.split(\"/\")[1]) > -1 ||\n acceptedFiles.some((acceptExtension) =>\n accept({ name: file.name, type: file.type }, acceptExtension)\n );\n\n if (!isFileAccepted) {\n newFile.errorMessage = labels?.fileTypeError;\n newFile.status = \"fail\";\n } else if (!isSizeAllowed) {\n newFile.errorMessage = labels?.fileSizeError;\n newFile.status = \"fail\";\n }\n\n newFile.id = uniqueId(\"uploaded-file-data-\");\n newFiles.push(newFile);\n });\n\n onFilesAdded?.(newFiles);\n };\n\n return (\n <>\n {!hideLabels && (\n <div id={id} className={classes.dropZoneLabelsGroup}>\n <HvLabel\n id={setId(id, \"input-file-label\")}\n htmlFor={setId(id, \"input-file\")}\n label={labels?.dropzone}\n className={classes.dropZoneLabel}\n />\n <HvInfoMessage id={setId(id, \"description\")}>\n {Number.isInteger(maxFileSize) &&\n `${labels?.sizeWarning} ${convertUnits(maxFileSize)}`}\n {labels?.acceptedFiles && labels.acceptedFiles}\n {!labels?.acceptedFiles &&\n acceptedFiles.length > 0 &&\n `\\u00A0(${acceptedFiles.join(\", \")})`}\n </HvInfoMessage>\n </div>\n )}\n <div\n id={setId(id, \"input-file-container\")}\n className={cx(classes.dropZoneContainer, {\n [classes.dragAction]: dragState,\n [classes.dropZoneContainerDisabled]: disabled,\n })}\n >\n <input\n id={setId(id, \"input-file\")}\n className={classes.inputArea}\n type=\"file\"\n multiple={multiple}\n disabled={disabled}\n title={!disabled ? `${labels?.drag}\\xa0${labels?.selectFiles}` : \"\"}\n onClick={() => {\n if (inputRef.current) {\n inputRef.current.value = \"\";\n }\n }}\n onChange={() => {\n if (!disabled && inputRef.current?.files) {\n onChangeHandler(inputRef.current.files);\n }\n }}\n onDragEnter={(event) => {\n if (!disabled) {\n enterDropArea();\n event.stopPropagation();\n event.preventDefault();\n }\n }}\n onDragLeave={leaveDropArea}\n onDropCapture={leaveDropArea}\n onDragOver={(event) => {\n if (!disabled) {\n enterDropArea();\n event.stopPropagation();\n event.preventDefault();\n }\n }}\n onDrop={(event) => {\n if (!disabled) {\n const { files } = event.dataTransfer;\n if (multiple === true || files.length === 1) {\n event.stopPropagation();\n event.preventDefault();\n onChangeHandler(files);\n }\n }\n }}\n ref={inputRef}\n accept={acceptedFiles.join(\",\")}\n {...inputProps}\n />\n <div className={classes?.dropArea}>\n {dragState ? (\n <div className={classes.dropZoneAreaLabels}>\n <HvTypography className={classes.dragText}>\n {labels?.dropFiles}\n </HvTypography>\n </div>\n ) : (\n <>\n <Doc\n iconSize=\"M\"\n className={classes.dropZoneAreaIcon}\n color={disabled ? \"secondary_60\" : \"secondary\"}\n />\n <div className={classes.dropZoneAreaLabels}>\n <HvTypography className={classes.dragText}>\n {labels?.drag}\n <span\n className={classes.selectFilesText}\n >{`\\xa0${labels?.selectFiles}`}</span>\n </HvTypography>\n </div>\n </>\n )}\n </div>\n </div>\n </>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAuGa,MAAA,aAAa,CAAC,UAA2B;AAC9C,QAAA;AAAA,IACJ,IAAI;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX,WAAW;AAAA,IACX;AAAA,EAAA,IACE,gBAAgB,cAAc,KAAK;AACjC,QAAA,KAAK,YAAY,QAAQ,UAAU;AAEzC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,QAAM,CAAC,WAAW,OAAO,IAAI,SAAkB,KAAK;AAE9C,QAAA,WAAW,OAAgC,IAAI;AAErD,QAAM,gBAAgB,MAAM;AAC1B,YAAQ,KAAK;AAAA,EAAA;AAGf,QAAM,gBAAgB,MAAM;AAC1B,YAAQ,IAAI;AAAA,EAAA;AAGR,QAAA,kBAAkB,CAAC,cAAwB;AACzC,UAAA,iBAAiB,OAAO,KAAK,SAAS,EAAE,IAAI,CAAC,MAAM,UAAU,CAAC,CAAC;AAErE,UAAM,WAAyB,CAAA;AAEhB,mBAAA,QAAQ,CAAC,SAAe;AACrC,YAAM,UAAsB;AAEtB,YAAA,gBAAgB,KAAK,QAAQ;AACnC,YAAM,iBACJ,CAAC,cAAc,UACf,cAAc,QAAQ,KAAK,KAAK,MAAM,GAAG,EAAE,CAAC,CAAC,IAAI,MACjD,cAAc;AAAA,QAAK,CAAC,oBAClB,OAAO,EAAE,MAAM,KAAK,MAAM,MAAM,KAAK,KAAK,GAAG,eAAe;AAAA,MAAA;AAGhE,UAAI,CAAC,gBAAgB;AACnB,gBAAQ,eAAe,QAAQ;AAC/B,gBAAQ,SAAS;AAAA,MAAA,WACR,CAAC,eAAe;AACzB,gBAAQ,eAAe,QAAQ;AAC/B,gBAAQ,SAAS;AAAA,MACnB;AAEQ,cAAA,KAAK,SAAS,qBAAqB;AAC3C,eAAS,KAAK,OAAO;AAAA,IAAA,CACtB;AAED,mBAAe,QAAQ;AAAA,EAAA;AAGzB,SAEK,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAA,CAAC,cACC,qBAAA,OAAA,EAAI,IAAQ,WAAW,QAAQ,qBAC9B,UAAA;AAAA,MAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAI,MAAM,IAAI,kBAAkB;AAAA,UAChC,SAAS,MAAM,IAAI,YAAY;AAAA,UAC/B,OAAO,QAAQ;AAAA,UACf,WAAW,QAAQ;AAAA,QAAA;AAAA,MACrB;AAAA,2BACC,eAAc,EAAA,IAAI,MAAM,IAAI,aAAa,GACvC,UAAA;AAAA,QAAO,OAAA,UAAU,WAAW,KAC3B,GAAG,QAAQ,WAAW,IAAI,aAAa,WAAW,CAAC;AAAA,QACpD,QAAQ,iBAAiB,OAAO;AAAA,QAChC,CAAC,QAAQ,iBACR,cAAc,SAAS,KACvB,KAAU,cAAc,KAAK,IAAI,CAAC;AAAA,MAAA,GACtC;AAAA,IAAA,GACF;AAAA,IAEF;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAI,MAAM,IAAI,sBAAsB;AAAA,QACpC,WAAW,GAAG,QAAQ,mBAAmB;AAAA,UACvC,CAAC,QAAQ,UAAU,GAAG;AAAA,UACtB,CAAC,QAAQ,yBAAyB,GAAG;AAAA,QAAA,CACtC;AAAA,QAED,UAAA;AAAA,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,IAAI,MAAM,IAAI,YAAY;AAAA,cAC1B,WAAW,QAAQ;AAAA,cACnB,MAAK;AAAA,cACL;AAAA,cACA;AAAA,cACA,OAAO,CAAC,WAAW,GAAG,QAAQ,IAAI,IAAO,QAAQ,WAAW,KAAK;AAAA,cACjE,SAAS,MAAM;AACb,oBAAI,SAAS,SAAS;AACpB,2BAAS,QAAQ,QAAQ;AAAA,gBAC3B;AAAA,cACF;AAAA,cACA,UAAU,MAAM;AACd,oBAAI,CAAC,YAAY,SAAS,SAAS,OAAO;AACxB,kCAAA,SAAS,QAAQ,KAAK;AAAA,gBACxC;AAAA,cACF;AAAA,cACA,aAAa,CAAC,UAAU;AACtB,oBAAI,CAAC,UAAU;AACC;AACd,wBAAM,gBAAgB;AACtB,wBAAM,eAAe;AAAA,gBACvB;AAAA,cACF;AAAA,cACA,aAAa;AAAA,cACb,eAAe;AAAA,cACf,YAAY,CAAC,UAAU;AACrB,oBAAI,CAAC,UAAU;AACC;AACd,wBAAM,gBAAgB;AACtB,wBAAM,eAAe;AAAA,gBACvB;AAAA,cACF;AAAA,cACA,QAAQ,CAAC,UAAU;AACjB,oBAAI,CAAC,UAAU;AACP,wBAAA,EAAE,MAAM,IAAI,MAAM;AACxB,sBAAI,aAAa,QAAQ,MAAM,WAAW,GAAG;AAC3C,0BAAM,gBAAgB;AACtB,0BAAM,eAAe;AACrB,oCAAgB,KAAK;AAAA,kBACvB;AAAA,gBACF;AAAA,cACF;AAAA,cACA,KAAK;AAAA,cACL,QAAQ,cAAc,KAAK,GAAG;AAAA,cAC7B,GAAG;AAAA,YAAA;AAAA,UACN;AAAA,UACA,oBAAC,SAAI,WAAW,SAAS,UACtB,UACC,YAAA,oBAAC,SAAI,WAAW,QAAQ,oBACtB,UAAC,oBAAA,cAAA,EAAa,WAAW,QAAQ,UAC9B,kBAAQ,UACX,CAAA,EAAA,CACF,IAGE,qBAAA,UAAA,EAAA,UAAA;AAAA,YAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,UAAS;AAAA,gBACT,WAAW,QAAQ;AAAA,gBACnB,OAAO,WAAW,iBAAiB;AAAA,cAAA;AAAA,YACrC;AAAA,YACA,oBAAC,SAAI,WAAW,QAAQ,oBACtB,UAAC,qBAAA,cAAA,EAAa,WAAW,QAAQ,UAC9B,UAAA;AAAA,cAAQ,QAAA;AAAA,cACT;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAW,QAAQ;AAAA,kBACnB,UAAA,IAAO,QAAQ,WAAW;AAAA,gBAAA;AAAA,cAAG;AAAA,YAAA,EAAA,CACjC,EACF,CAAA;AAAA,UAAA,EAAA,CACF,EAEJ,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EACF,EAAA,CAAA;AAEJ;"}
1
+ {"version":3,"file":"DropZone.mjs","sources":["../../../../src/FileUploader/DropZone/DropZone.tsx"],"sourcesContent":["import React, { useRef, useState } from \"react\";\n\nimport uniqueId from \"lodash/uniqueId\";\n\nimport accept from \"attr-accept\";\n\nimport { Doc } from \"@hitachivantara/uikit-react-icons\";\n\nimport { setId } from \"../../utils/setId\";\nimport { useUniqueId } from \"../../hooks/useUniqueId\";\n\nimport { HvTypography } from \"../../Typography\";\nimport { HvInfoMessage, HvLabel } from \"../../Forms\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\n\nimport { convertUnits } from \"../utils\";\nimport { HvFileData, HvFilesAddedEvent } from \"../File\";\n\nimport { staticClasses, useClasses } from \"./DropZone.styles\";\n\nexport { staticClasses as dropZoneClasses };\n\nexport type HvDropZoneClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDropZoneLabels {\n /**\n * Extensions of the accepted file types\n */\n acceptedFiles?: string;\n /**\n * Dropzone area label.\n */\n dropzone?: string;\n /**\n * Size file warning label.\n */\n sizeWarning?: string;\n /**\n * Size file warning label.\n */\n drag?: string;\n /**\n * Size file warning label.\n */\n selectFiles?: string;\n /**\n * Theming sheet used to style components\n * */\n dropFiles?: string;\n /**\n * Message to display when file size is greater than allowed\n * */\n fileSizeError?: string;\n /**\n * Message to display when file type is greater than allowed\n * */\n fileTypeError?: string;\n}\n\nexport interface HvDropZoneProps {\n /**\n * Id to be applied to the root node.\n */\n id?: string;\n /**\n * Labels to present in FileUploader.\n */\n labels?: HvDropZoneLabels;\n /**\n * Whether the Dropzone should accept multiple files at once.\n */\n multiple?: boolean;\n /**\n * If the input is disabled or not\n */\n disabled?: boolean;\n /**\n * Files extensions accepted for upload.\n */\n acceptedFiles: string[];\n /**\n * Max upload size\n * */\n maxFileSize: number;\n /**\n * Function responsible for processing files added to the drop zone.\n */\n onFilesAdded?: HvFilesAddedEvent;\n /**\n * Whether the DropZone should hide labels or not.\n */\n hideLabels?: boolean;\n /**\n * Attributes applied to the input element.\n */\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /**\n * A Jss Object used to override or extend the styles applied to the component.\n */\n classes?: HvDropZoneClasses;\n}\n\nexport const HvDropZone = (props: HvDropZoneProps) => {\n const {\n id: idProp,\n classes: classesProp,\n labels,\n acceptedFiles,\n maxFileSize,\n inputProps,\n hideLabels,\n multiple = true,\n disabled = false,\n onFilesAdded,\n } = useDefaultProps(\"HvDropZone\", props);\n const id = useUniqueId(idProp, \"dropzone\");\n\n const { classes, cx } = useClasses(classesProp);\n\n const [dragState, setDrag] = useState<boolean>(false);\n\n const inputRef = useRef<HTMLInputElement | null>(null);\n\n const leaveDropArea = () => {\n setDrag(false);\n };\n\n const enterDropArea = () => {\n setDrag(true);\n };\n\n const onChangeHandler = (filesList: FileList) => {\n const filesToProcess = Object.values(filesList);\n\n const newFiles = filesToProcess.map((file) => {\n const newFile: HvFileData = file;\n\n const isSizeAllowed = file.size <= maxFileSize;\n const isFileAccepted =\n !acceptedFiles.length ||\n acceptedFiles.indexOf(file.type.split(\"/\")[1]) > -1 ||\n acceptedFiles.some((acceptExtension) =>\n accept({ name: file.name, type: file.type }, acceptExtension)\n );\n\n if (!isFileAccepted) {\n newFile.errorMessage = labels?.fileTypeError;\n newFile.status = \"fail\";\n } else if (!isSizeAllowed) {\n newFile.errorMessage = labels?.fileSizeError;\n newFile.status = \"fail\";\n }\n\n newFile.id = uniqueId(\"uploaded-file-data-\");\n return newFile;\n });\n\n onFilesAdded?.(newFiles);\n };\n\n return (\n <>\n {!hideLabels && (\n <div id={id} className={classes.dropZoneLabelsGroup}>\n <HvLabel\n id={setId(id, \"input-file-label\")}\n htmlFor={setId(id, \"input-file\")}\n label={labels?.dropzone}\n className={classes.dropZoneLabel}\n />\n <HvInfoMessage id={setId(id, \"description\")}>\n {Number.isInteger(maxFileSize) &&\n `${labels?.sizeWarning} ${convertUnits(maxFileSize)}`}\n {labels?.acceptedFiles && labels.acceptedFiles}\n {!labels?.acceptedFiles &&\n acceptedFiles.length > 0 &&\n `\\u00A0(${acceptedFiles.join(\", \")})`}\n </HvInfoMessage>\n </div>\n )}\n <div\n id={setId(id, \"input-file-container\")}\n className={cx(classes.dropZoneContainer, {\n [classes.dragAction]: dragState,\n [classes.dropZoneContainerDisabled]: disabled,\n })}\n >\n <input\n id={setId(id, \"input-file\")}\n className={classes.inputArea}\n type=\"file\"\n multiple={multiple}\n disabled={disabled}\n title={!disabled ? `${labels?.drag}\\xa0${labels?.selectFiles}` : \"\"}\n onClick={() => {\n if (inputRef.current) {\n inputRef.current.value = \"\";\n }\n }}\n onChange={() => {\n if (!disabled && inputRef.current?.files) {\n onChangeHandler(inputRef.current.files);\n }\n }}\n onDragEnter={(event) => {\n if (!disabled) {\n enterDropArea();\n event.stopPropagation();\n event.preventDefault();\n }\n }}\n onDragLeave={leaveDropArea}\n onDropCapture={leaveDropArea}\n onDragOver={(event) => {\n if (!disabled) {\n enterDropArea();\n event.stopPropagation();\n event.preventDefault();\n }\n }}\n onDrop={(event) => {\n if (!disabled) {\n const { files } = event.dataTransfer;\n if (multiple === true || files.length === 1) {\n event.stopPropagation();\n event.preventDefault();\n onChangeHandler(files);\n }\n }\n }}\n ref={inputRef}\n accept={acceptedFiles.join(\",\")}\n {...inputProps}\n />\n <div className={classes?.dropArea}>\n {dragState ? (\n <div className={classes.dropZoneAreaLabels}>\n <HvTypography className={classes.dragText}>\n {labels?.dropFiles}\n </HvTypography>\n </div>\n ) : (\n <>\n <Doc\n iconSize=\"M\"\n className={classes.dropZoneAreaIcon}\n color={disabled ? \"secondary_60\" : \"secondary\"}\n />\n <div className={classes.dropZoneAreaLabels}>\n <HvTypography className={classes.dragText}>\n {labels?.drag}\n <span\n className={classes.selectFilesText}\n >{`\\xa0${labels?.selectFiles}`}</span>\n </HvTypography>\n </div>\n </>\n )}\n </div>\n </div>\n </>\n );\n};\n"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"utils.mjs","sources":["../../../src/Focus/utils.ts"],"sourcesContent":["export const getFocusableChildren = (el) =>\n el?.querySelectorAll(\"input, button, select, textarea, a[href]\") || [];\n\nexport const setFocusTo = (el) => {\n el.focus();\n};\n"],"names":[],"mappings":"AAAO,MAAM,uBAAuB,CAAC,OACnC,IAAI,iBAAiB,0CAA0C,KAAK,CAAC;AAE1D,MAAA,aAAa,CAAC,OAAO;AAChC,KAAG,MAAM;AACX;"}
1
+ {"version":3,"file":"utils.mjs","sources":["../../../src/Focus/utils.ts"],"sourcesContent":["export const getFocusableChildren = (el: any) =>\n el?.querySelectorAll(\"input, button, select, textarea, a[href]\") || [];\n\nexport const setFocusTo = (el: any) => {\n el.focus();\n};\n"],"names":[],"mappings":"AAAO,MAAM,uBAAuB,CAAC,OACnC,IAAI,iBAAiB,0CAA0C,KAAK,CAAC;AAE1D,MAAA,aAAa,CAAC,OAAY;AACrC,KAAG,MAAM;AACX;"}
@@ -1 +1 @@
1
- {"version":3,"file":"FormUtils.mjs","sources":["../../../../../src/Forms/FormElement/utils/FormUtils.ts"],"sourcesContent":["import React from \"react\";\n\ninterface Descriptor {\n id?: string;\n htmlFor?: string;\n}\n/**\n * Scans the element's children looking for the children IDs that match the different form element types.\n * This function will produce an object that has a key for each provided name\n * Inside each key there will be an array with each id of the found descriptor.\n *\n * @param {Array} children - The children inside the form element to scan.\n * @param {Object} descriptors - Initial descriptors map (used for recursion).\n *\n */\nconst findDescriptors = (\n children,\n descriptors: {\n input: Descriptor[];\n label: Descriptor[];\n description: Descriptor[];\n controlled: Descriptor[];\n errormessage: Descriptor[];\n HvCalendarHeader?: Descriptor[];\n } = {\n input: [],\n label: [],\n description: [],\n controlled: [],\n errormessage: [],\n\n // TODO: refactor this out\n HvCalendarHeader: [],\n }\n) => {\n React.Children.forEach(children, (child) => {\n if (child?.type?.formElementType && child.props?.id) {\n descriptors[child.type.formElementType]?.push({\n id: child.props?.id,\n htmlFor: child.props?.htmlFor,\n });\n }\n\n if (child?.type?.formElementType !== \"formelement\") {\n findDescriptors(child?.props?.children, descriptors);\n }\n });\n\n return descriptors;\n};\n\nconst getIdReferenceListFor = (\n formElementType,\n descriptors,\n filterFor = null\n) => {\n const referenceList = descriptors?.[formElementType]\n ?.filter((d) => d.htmlFor !== filterFor)\n ?.map((d) => d.id)\n .join(\" \")\n .trim();\n\n return referenceList !== \"\" ? referenceList : undefined;\n};\n\nconst getIdReferenceFor = (formElementType, descriptors, filterFor = null) => {\n const referenceList = descriptors?.[formElementType]\n ?.filter((d) => d.htmlFor !== filterFor)\n ?.map((d) => d.id)?.[0];\n\n return referenceList !== \"\" ? referenceList : undefined;\n};\n\nconst buildFormElementPropsFromContext = (\n name,\n disabled,\n readOnly,\n required,\n context\n) => {\n return {\n name: name || context?.elementName,\n disabled: disabled !== undefined ? disabled : context?.elementDisabled,\n readOnly: readOnly !== undefined ? readOnly : context?.elementReadOnly,\n required: required !== undefined ? required : context?.elementRequired,\n status: context?.elementStatus,\n };\n};\n\nconst buildAriaPropsFromContext = (props, context, isInvalid, inputId) => {\n const arias = {\n \"aria-labelledby\":\n props?.[\"aria-labelledby\"] !== undefined\n ? props?.[\"aria-labelledby\"]\n : getIdReferenceListFor(\"label\", context?.descriptors, inputId),\n \"aria-describedby\":\n props?.[\"aria-describedby\"] !== undefined\n ? props?.[\"aria-describedby\"]\n : getIdReferenceListFor(\"description\", context?.descriptors),\n \"aria-controls\":\n props?.[\"aria-controls\"] !== undefined\n ? props?.[\"aria-controls\"]\n : getIdReferenceListFor(\"controlled\", context?.descriptors),\n };\n\n if (isInvalid) {\n arias[\"aria-invalid\"] = isInvalid;\n arias[\"aria-errormessage\"] =\n props?.[\"aria-errormessage\"] !== undefined\n ? props?.[\"aria-errormessage\"]\n : getIdReferenceFor(\"errormessage\", context?.descriptors);\n }\n\n return arias;\n};\n\nexport {\n findDescriptors,\n getIdReferenceListFor,\n getIdReferenceFor,\n buildFormElementPropsFromContext,\n buildAriaPropsFromContext,\n};\n"],"names":["React"],"mappings":";AAeM,MAAA,kBAAkB,CACtB,UACA,cAOI;AAAA,EACF,OAAO,CAAC;AAAA,EACR,OAAO,CAAC;AAAA,EACR,aAAa,CAAC;AAAA,EACd,YAAY,CAAC;AAAA,EACb,cAAc,CAAC;AAAA;AAAA,EAGf,kBAAkB,CAAC;AACrB,MACG;AACHA,iBAAM,SAAS,QAAQ,UAAU,CAAC,UAAU;AAC1C,QAAI,OAAO,MAAM,mBAAmB,MAAM,OAAO,IAAI;AACnD,kBAAY,MAAM,KAAK,eAAe,GAAG,KAAK;AAAA,QAC5C,IAAI,MAAM,OAAO;AAAA,QACjB,SAAS,MAAM,OAAO;AAAA,MAAA,CACvB;AAAA,IACH;AAEI,QAAA,OAAO,MAAM,oBAAoB,eAAe;AAClC,sBAAA,OAAO,OAAO,UAAU,WAAW;AAAA,IACrD;AAAA,EAAA,CACD;AAEM,SAAA;AACT;AAEA,MAAM,wBAAwB,CAC5B,iBACA,aACA,YAAY,SACT;AACG,QAAA,gBAAgB,cAAc,eAAe,GAC/C,OAAO,CAAC,MAAM,EAAE,YAAY,SAAS,GACrC,IAAI,CAAC,MAAM,EAAE,EAAE,EAChB,KAAK,GAAG,EACR;AAEI,SAAA,kBAAkB,KAAK,gBAAgB;AAChD;AAEA,MAAM,oBAAoB,CAAC,iBAAiB,aAAa,YAAY,SAAS;AAC5E,QAAM,gBAAgB,cAAc,eAAe,GAC/C,OAAO,CAAC,MAAM,EAAE,YAAY,SAAS,GACrC,IAAI,CAAC,MAAM,EAAE,EAAE,IAAI,CAAC;AAEjB,SAAA,kBAAkB,KAAK,gBAAgB;AAChD;AAEA,MAAM,mCAAmC,CACvC,MACA,UACA,UACA,UACA,YACG;AACI,SAAA;AAAA,IACL,MAAM,QAAQ,SAAS;AAAA,IACvB,UAAU,aAAa,SAAY,WAAW,SAAS;AAAA,IACvD,UAAU,aAAa,SAAY,WAAW,SAAS;AAAA,IACvD,UAAU,aAAa,SAAY,WAAW,SAAS;AAAA,IACvD,QAAQ,SAAS;AAAA,EAAA;AAErB;AAEA,MAAM,4BAA4B,CAAC,OAAO,SAAS,WAAW,YAAY;AACxE,QAAM,QAAQ;AAAA,IACZ,mBACE,QAAQ,iBAAiB,MAAM,SAC3B,QAAQ,iBAAiB,IACzB,sBAAsB,SAAS,SAAS,aAAa,OAAO;AAAA,IAClE,oBACE,QAAQ,kBAAkB,MAAM,SAC5B,QAAQ,kBAAkB,IAC1B,sBAAsB,eAAe,SAAS,WAAW;AAAA,IAC/D,iBACE,QAAQ,eAAe,MAAM,SACzB,QAAQ,eAAe,IACvB,sBAAsB,cAAc,SAAS,WAAW;AAAA,EAAA;AAGhE,MAAI,WAAW;AACb,UAAM,cAAc,IAAI;AACxB,UAAM,mBAAmB,IACvB,QAAQ,mBAAmB,MAAM,SAC7B,QAAQ,mBAAmB,IAC3B,kBAAkB,gBAAgB,SAAS,WAAW;AAAA,EAC9D;AAEO,SAAA;AACT;"}
1
+ {"version":3,"file":"FormUtils.mjs","sources":["../../../../../src/Forms/FormElement/utils/FormUtils.ts"],"sourcesContent":["import React from \"react\";\n\ninterface Descriptor {\n id?: string;\n htmlFor?: string;\n}\n/**\n * Scans the element's children looking for the children IDs that match the different form element types.\n * This function will produce an object that has a key for each provided name\n * Inside each key there will be an array with each id of the found descriptor.\n *\n * @param {Array} children - The children inside the form element to scan.\n * @param {Object} descriptors - Initial descriptors map (used for recursion).\n *\n */\nconst findDescriptors = (\n children,\n descriptors: {\n input: Descriptor[];\n label: Descriptor[];\n description: Descriptor[];\n controlled: Descriptor[];\n errormessage: Descriptor[];\n HvCalendarHeader?: Descriptor[];\n } = {\n input: [],\n label: [],\n description: [],\n controlled: [],\n errormessage: [],\n\n // TODO: refactor this out\n HvCalendarHeader: [],\n }\n) => {\n React.Children.forEach(children, (child) => {\n if (child?.type?.formElementType && child.props?.id) {\n descriptors[child.type.formElementType]?.push({\n id: child.props?.id,\n htmlFor: child.props?.htmlFor,\n });\n }\n\n if (child?.type?.formElementType !== \"formelement\") {\n findDescriptors(child?.props?.children, descriptors);\n }\n });\n\n return descriptors;\n};\n\nconst getIdReferenceListFor = (\n formElementType,\n descriptors,\n filterFor = null\n) => {\n const referenceList = descriptors?.[formElementType]\n ?.filter((d) => d.htmlFor !== filterFor)\n ?.map((d) => d.id)\n .join(\" \")\n .trim();\n\n return referenceList !== \"\" ? referenceList : undefined;\n};\n\nconst getIdReferenceFor = (formElementType, descriptors, filterFor = null) => {\n const referenceList = descriptors?.[formElementType]\n ?.filter((d) => d.htmlFor !== filterFor)\n ?.map((d) => d.id)?.[0];\n\n return referenceList !== \"\" ? referenceList : undefined;\n};\n\nconst buildFormElementPropsFromContext = (\n name,\n disabled,\n readOnly,\n required,\n context\n) => {\n return {\n name: name || context?.elementName,\n disabled: disabled !== undefined ? disabled : context?.elementDisabled,\n readOnly: readOnly !== undefined ? readOnly : context?.elementReadOnly,\n required: required !== undefined ? required : context?.elementRequired,\n status: context?.elementStatus,\n };\n};\n\nconst buildAriaPropsFromContext = (props, context, isInvalid, inputId) => {\n const arias: React.AriaAttributes = {\n \"aria-labelledby\":\n props?.[\"aria-labelledby\"] !== undefined\n ? props?.[\"aria-labelledby\"]\n : getIdReferenceListFor(\"label\", context?.descriptors, inputId),\n \"aria-describedby\":\n props?.[\"aria-describedby\"] !== undefined\n ? props?.[\"aria-describedby\"]\n : getIdReferenceListFor(\"description\", context?.descriptors),\n \"aria-controls\":\n props?.[\"aria-controls\"] !== undefined\n ? props?.[\"aria-controls\"]\n : getIdReferenceListFor(\"controlled\", context?.descriptors),\n };\n\n if (isInvalid) {\n arias[\"aria-invalid\"] = isInvalid;\n arias[\"aria-errormessage\"] =\n props?.[\"aria-errormessage\"] !== undefined\n ? props?.[\"aria-errormessage\"]\n : getIdReferenceFor(\"errormessage\", context?.descriptors);\n }\n\n return arias;\n};\n\nexport {\n findDescriptors,\n getIdReferenceListFor,\n getIdReferenceFor,\n buildFormElementPropsFromContext,\n buildAriaPropsFromContext,\n};\n"],"names":["React"],"mappings":";AAeM,MAAA,kBAAkB,CACtB,UACA,cAOI;AAAA,EACF,OAAO,CAAC;AAAA,EACR,OAAO,CAAC;AAAA,EACR,aAAa,CAAC;AAAA,EACd,YAAY,CAAC;AAAA,EACb,cAAc,CAAC;AAAA;AAAA,EAGf,kBAAkB,CAAC;AACrB,MACG;AACHA,iBAAM,SAAS,QAAQ,UAAU,CAAC,UAAU;AAC1C,QAAI,OAAO,MAAM,mBAAmB,MAAM,OAAO,IAAI;AACnD,kBAAY,MAAM,KAAK,eAAe,GAAG,KAAK;AAAA,QAC5C,IAAI,MAAM,OAAO;AAAA,QACjB,SAAS,MAAM,OAAO;AAAA,MAAA,CACvB;AAAA,IACH;AAEI,QAAA,OAAO,MAAM,oBAAoB,eAAe;AAClC,sBAAA,OAAO,OAAO,UAAU,WAAW;AAAA,IACrD;AAAA,EAAA,CACD;AAEM,SAAA;AACT;AAEA,MAAM,wBAAwB,CAC5B,iBACA,aACA,YAAY,SACT;AACG,QAAA,gBAAgB,cAAc,eAAe,GAC/C,OAAO,CAAC,MAAM,EAAE,YAAY,SAAS,GACrC,IAAI,CAAC,MAAM,EAAE,EAAE,EAChB,KAAK,GAAG,EACR;AAEI,SAAA,kBAAkB,KAAK,gBAAgB;AAChD;AAEA,MAAM,oBAAoB,CAAC,iBAAiB,aAAa,YAAY,SAAS;AAC5E,QAAM,gBAAgB,cAAc,eAAe,GAC/C,OAAO,CAAC,MAAM,EAAE,YAAY,SAAS,GACrC,IAAI,CAAC,MAAM,EAAE,EAAE,IAAI,CAAC;AAEjB,SAAA,kBAAkB,KAAK,gBAAgB;AAChD;AAEA,MAAM,mCAAmC,CACvC,MACA,UACA,UACA,UACA,YACG;AACI,SAAA;AAAA,IACL,MAAM,QAAQ,SAAS;AAAA,IACvB,UAAU,aAAa,SAAY,WAAW,SAAS;AAAA,IACvD,UAAU,aAAa,SAAY,WAAW,SAAS;AAAA,IACvD,UAAU,aAAa,SAAY,WAAW,SAAS;AAAA,IACvD,QAAQ,SAAS;AAAA,EAAA;AAErB;AAEA,MAAM,4BAA4B,CAAC,OAAO,SAAS,WAAW,YAAY;AACxE,QAAM,QAA8B;AAAA,IAClC,mBACE,QAAQ,iBAAiB,MAAM,SAC3B,QAAQ,iBAAiB,IACzB,sBAAsB,SAAS,SAAS,aAAa,OAAO;AAAA,IAClE,oBACE,QAAQ,kBAAkB,MAAM,SAC5B,QAAQ,kBAAkB,IAC1B,sBAAsB,eAAe,SAAS,WAAW;AAAA,IAC/D,iBACE,QAAQ,eAAe,MAAM,SACzB,QAAQ,eAAe,IACvB,sBAAsB,cAAc,SAAS,WAAW;AAAA,EAAA;AAGhE,MAAI,WAAW;AACb,UAAM,cAAc,IAAI;AACxB,UAAM,mBAAmB,IACvB,QAAQ,mBAAmB,MAAM,SAC7B,QAAQ,mBAAmB,IAC3B,kBAAkB,gBAAgB,SAAS,WAAW;AAAA,EAC9D;AAEO,SAAA;AACT;"}
@@ -10,13 +10,12 @@ const reducer = (state, action) => {
10
10
  };
11
11
  const initialState = { itemFocused: void 0, dispatch: void 0 };
12
12
  const FocusContext = createContext(initialState);
13
- const FocusProvider = (props) => {
13
+ const FocusProvider = ({ children }) => {
14
14
  const [state, dispatch] = useReducer(reducer, initialState);
15
15
  const contextValue = useMemo(
16
16
  () => ({ ...state, dispatch }),
17
17
  [state, dispatch]
18
18
  );
19
- const { children } = props;
20
19
  return /* @__PURE__ */ jsx(FocusContext.Provider, { value: contextValue, children });
21
20
  };
22
21
  export {
@@ -1 +1 @@
1
- {"version":3,"file":"FocusContext.mjs","sources":["../../../../../src/Header/Navigation/utils/FocusContext.tsx"],"sourcesContent":["import React, { createContext, useMemo, useReducer } from \"react\";\n\ninterface SetItemFocused {\n type: \"setItemFocused\";\n itemFocused: EventTarget & Element;\n}\n\nconst reducer = (state, action) => {\n switch (action.type) {\n case \"setItemFocused\":\n return { itemFocused: action.itemFocused };\n default:\n return state;\n }\n};\n\nconst initialState = { itemFocused: undefined, dispatch: undefined };\n\nexport const FocusContext = createContext<{\n itemFocused?: EventTarget & Element;\n dispatch?: React.Dispatch<SetItemFocused>;\n}>(initialState);\n\nexport const FocusProvider = (props) => {\n const [state, dispatch] = useReducer(reducer, initialState);\n const contextValue = useMemo(\n () => ({ ...state, dispatch }),\n [state, dispatch]\n );\n const { children } = props;\n\n return (\n <FocusContext.Provider value={contextValue}>\n {children}\n </FocusContext.Provider>\n );\n};\n"],"names":[],"mappings":";;AAOA,MAAM,UAAU,CAAC,OAAO,WAAW;AACjC,UAAQ,OAAO,MAAM;AAAA,IACnB,KAAK;AACI,aAAA,EAAE,aAAa,OAAO;IAC/B;AACS,aAAA;AAAA,EACX;AACF;AAEA,MAAM,eAAe,EAAE,aAAa,QAAW,UAAU;AAE5C,MAAA,eAAe,cAGzB,YAAY;AAEF,MAAA,gBAAgB,CAAC,UAAU;AACtC,QAAM,CAAC,OAAO,QAAQ,IAAI,WAAW,SAAS,YAAY;AAC1D,QAAM,eAAe;AAAA,IACnB,OAAO,EAAE,GAAG,OAAO;IACnB,CAAC,OAAO,QAAQ;AAAA,EAAA;AAEZ,QAAA,EAAE,SAAa,IAAA;AAErB,6BACG,aAAa,UAAb,EAAsB,OAAO,cAC3B,SACH,CAAA;AAEJ;"}
1
+ {"version":3,"file":"FocusContext.mjs","sources":["../../../../../src/Header/Navigation/utils/FocusContext.tsx"],"sourcesContent":["import React, { createContext, useMemo, useReducer } from \"react\";\n\ntype Action = { type: \"setItemFocused\"; itemFocused: EventTarget & Element };\n\nconst reducer: React.Reducer<FocusContextType, Action> = (state, action) => {\n switch (action.type) {\n case \"setItemFocused\":\n return { itemFocused: action.itemFocused };\n default:\n return state;\n }\n};\n\nconst initialState = { itemFocused: undefined, dispatch: undefined };\n\ntype FocusContextType = {\n itemFocused?: EventTarget & Element;\n dispatch?: React.Dispatch<Action>;\n};\n\nexport const FocusContext = createContext<FocusContextType>(initialState);\n\nexport const FocusProvider = ({ children }: { children?: React.ReactNode }) => {\n const [state, dispatch] = useReducer(reducer, initialState);\n const contextValue = useMemo(\n () => ({ ...state, dispatch }),\n [state, dispatch]\n );\n\n return (\n <FocusContext.Provider value={contextValue}>\n {children}\n </FocusContext.Provider>\n );\n};\n"],"names":[],"mappings":";;AAIA,MAAM,UAAmD,CAAC,OAAO,WAAW;AAC1E,UAAQ,OAAO,MAAM;AAAA,IACnB,KAAK;AACI,aAAA,EAAE,aAAa,OAAO;IAC/B;AACS,aAAA;AAAA,EACX;AACF;AAEA,MAAM,eAAe,EAAE,aAAa,QAAW,UAAU;AAO5C,MAAA,eAAe,cAAgC,YAAY;AAEjE,MAAM,gBAAgB,CAAC,EAAE,eAA+C;AAC7E,QAAM,CAAC,OAAO,QAAQ,IAAI,WAAW,SAAS,YAAY;AAC1D,QAAM,eAAe;AAAA,IACnB,OAAO,EAAE,GAAG,OAAO;IACnB,CAAC,OAAO,QAAQ;AAAA,EAAA;AAGlB,6BACG,aAAa,UAAb,EAAsB,OAAO,cAC3B,SACH,CAAA;AAEJ;"}
@@ -13,15 +13,16 @@ const HvLink = (props) => {
13
13
  ...others
14
14
  } = useDefaultProps("HvLink", props);
15
15
  const { classes, cx } = useClasses(classesProp);
16
- const handleClick = (event) => {
17
- event.preventDefault();
18
- onClick?.(event, data);
19
- };
20
16
  return /* @__PURE__ */ jsx(
21
17
  "a",
22
18
  {
23
19
  href: route,
24
- onClick: onClick != null ? handleClick : void 0,
20
+ onClick: (event) => {
21
+ if (!onClick)
22
+ return;
23
+ event.preventDefault();
24
+ onClick?.(event, data);
25
+ },
25
26
  className: cx(classes.a, className),
26
27
  ...others,
27
28
  children
@@ -1 +1 @@
1
- {"version":3,"file":"Link.mjs","sources":["../../../src/Link/Link.tsx"],"sourcesContent":["import { MouseEventHandler } from \"react\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Link.styles\";\n\nexport { staticClasses as linkClasses };\n\nexport type HvLinkClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLinkProps extends HvBaseProps<HTMLAnchorElement, \"onClick\"> {\n onClick?: (\n event: MouseEventHandler<HTMLAnchorElement>,\n data: any\n ) => void | undefined;\n route?: string;\n data?: any;\n children: any;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvLinkClasses;\n}\n\nexport const HvLink = (props: HvLinkProps) => {\n const {\n onClick,\n classes: classesProp,\n className,\n route,\n data,\n children,\n ...others\n } = useDefaultProps(\"HvLink\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const handleClick = (event) => {\n event.preventDefault();\n\n onClick?.(event, data);\n };\n\n return (\n <a\n href={route}\n onClick={onClick != null ? handleClick : undefined}\n className={cx(classes.a, className)}\n {...others}\n >\n {children}\n </a>\n );\n};\n"],"names":[],"mappings":";;;;AAwBa,MAAA,SAAS,CAAC,UAAuB;AACtC,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,UAAU,KAAK;AAEnC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,QAAA,cAAc,CAAC,UAAU;AAC7B,UAAM,eAAe;AAErB,cAAU,OAAO,IAAI;AAAA,EAAA;AAIrB,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAM;AAAA,MACN,SAAS,WAAW,OAAO,cAAc;AAAA,MACzC,WAAW,GAAG,QAAQ,GAAG,SAAS;AAAA,MACjC,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAAA;AAGP;"}
1
+ {"version":3,"file":"Link.mjs","sources":["../../../src/Link/Link.tsx"],"sourcesContent":["import { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Link.styles\";\n\nexport { staticClasses as linkClasses };\n\nexport type HvLinkClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLinkProps extends HvBaseProps<HTMLAnchorElement, \"onClick\"> {\n onClick?: (\n event: React.MouseEvent<HTMLAnchorElement>,\n data: any\n ) => void | undefined;\n route?: string;\n data?: any;\n children: any;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvLinkClasses;\n}\n\nexport const HvLink = (props: HvLinkProps) => {\n const {\n onClick,\n classes: classesProp,\n className,\n route,\n data,\n children,\n ...others\n } = useDefaultProps(\"HvLink\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n return (\n <a\n href={route}\n onClick={(event) => {\n if (!onClick) return;\n\n event.preventDefault();\n onClick?.(event, data);\n }}\n className={cx(classes.a, className)}\n {...others}\n >\n {children}\n </a>\n );\n};\n"],"names":[],"mappings":";;;;AAsBa,MAAA,SAAS,CAAC,UAAuB;AACtC,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,UAAU,KAAK;AAEnC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAG5C,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAM;AAAA,MACN,SAAS,CAAC,UAAU;AAClB,YAAI,CAAC;AAAS;AAEd,cAAM,eAAe;AACrB,kBAAU,OAAO,IAAI;AAAA,MACvB;AAAA,MACA,WAAW,GAAG,QAAQ,GAAG,SAAS;AAAA,MACjC,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAAA;AAGP;"}
@@ -1 +1 @@
1
- {"version":3,"file":"utils.mjs","sources":["../../../src/List/utils.ts"],"sourcesContent":["import { HvListValue } from \"./types\";\n\nconst isItemSelected = (item: HvListValue, newItem: HvListValue) => {\n const selectionKey = item?.id ? \"id\" : \"label\";\n const selectionElement = item && item[selectionKey];\n return newItem[selectionKey] === selectionElement;\n};\n\nconst checkIcons = (list) => list?.some((elem) => elem?.icon);\n\nconst parseState = (list = []) => {\n const hasLeftIcons = checkIcons(list);\n const selection = list.filter((elem: any) => elem?.selected);\n const anySelected = !!selection.length;\n const allSelected = selection.length === list.length;\n const anySelectableSelected = list.some(\n (elem: any) => elem?.selected || elem?.disabled\n );\n const allSelectableSelected = list.every(\n (elem: any) => elem?.selected || elem?.disabled\n );\n\n return {\n list,\n hasLeftIcons,\n anySelected,\n allSelected,\n anySelectableSelected,\n allSelectableSelected,\n selection,\n };\n};\n\nconst parseList = (\n item: HvListValue | undefined,\n props: {\n multiSelect?: boolean;\n selectable?: boolean;\n singleSelectionToggle?: boolean;\n },\n selectAll: boolean | undefined,\n list: HvListValue[] = []\n): HvListValue[] => {\n const { multiSelect, selectable, singleSelectionToggle } = props || {};\n\n let anySelected = false;\n const newList = list.map((elem: any) => {\n const newItem = { ...elem };\n\n // reset elem item\n if (!multiSelect) {\n newItem.selected = false;\n }\n\n const selectItem = item ? isItemSelected(item, newItem) : elem?.selected;\n\n if (selectItem && selectable) {\n let selectionState;\n\n if (multiSelect) {\n selectionState = item ? !elem?.selected : true;\n } else {\n selectionState =\n !anySelected &&\n (item && singleSelectionToggle ? !elem?.selected : true);\n }\n\n newItem.selected = selectionState;\n anySelected = true;\n }\n\n if (typeof selectAll === \"boolean\" && !elem?.disabled)\n newItem.selected = selectAll;\n\n // normalize item selected prop if not provided\n if (!newItem?.selected) newItem.selected = false;\n\n return newItem;\n });\n\n return newList;\n};\n\nexport { isItemSelected, parseList, parseState };\n"],"names":[],"mappings":"AAEM,MAAA,iBAAiB,CAAC,MAAmB,YAAyB;AAC5D,QAAA,eAAe,MAAM,KAAK,OAAO;AACjC,QAAA,mBAAmB,QAAQ,KAAK,YAAY;AAC3C,SAAA,QAAQ,YAAY,MAAM;AACnC;AA2BA,MAAM,YAAY,CAChB,MACA,OAKA,WACA,OAAsB,CAAA,MACJ;AAClB,QAAM,EAAE,aAAa,YAAY,sBAAsB,IAAI,SAAS,CAAA;AAEpE,MAAI,cAAc;AAClB,QAAM,UAAU,KAAK,IAAI,CAAC,SAAc;AAChC,UAAA,UAAU,EAAE,GAAG;AAGrB,QAAI,CAAC,aAAa;AAChB,cAAQ,WAAW;AAAA,IACrB;AAEA,UAAM,aAAa,OAAO,eAAe,MAAM,OAAO,IAAI,MAAM;AAEhE,QAAI,cAAc,YAAY;AACxB,UAAA;AAEJ,UAAI,aAAa;AACE,yBAAA,OAAO,CAAC,MAAM,WAAW;AAAA,MAAA,OACrC;AACL,yBACE,CAAC,gBACA,QAAQ,wBAAwB,CAAC,MAAM,WAAW;AAAA,MACvD;AAEA,cAAQ,WAAW;AACL,oBAAA;AAAA,IAChB;AAEA,QAAI,OAAO,cAAc,aAAa,CAAC,MAAM;AAC3C,cAAQ,WAAW;AAGrB,QAAI,CAAC,SAAS;AAAU,cAAQ,WAAW;AAEpC,WAAA;AAAA,EAAA,CACR;AAEM,SAAA;AACT;"}
1
+ {"version":3,"file":"utils.mjs","sources":["../../../src/List/utils.ts"],"sourcesContent":["import { HvListValue } from \"./types\";\n\nconst isItemSelected = (item: HvListValue, newItem: HvListValue) => {\n const selectionKey = item?.id ? \"id\" : \"label\";\n const selectionElement = item && item[selectionKey];\n return newItem[selectionKey] === selectionElement;\n};\n\nconst checkIcons = (list: any[]) => list?.some((elem) => elem?.icon);\n\nconst parseState = (list = []) => {\n const hasLeftIcons = checkIcons(list);\n const selection = list.filter((elem: any) => elem?.selected);\n const anySelected = !!selection.length;\n const allSelected = selection.length === list.length;\n const anySelectableSelected = list.some(\n (elem: any) => elem?.selected || elem?.disabled\n );\n const allSelectableSelected = list.every(\n (elem: any) => elem?.selected || elem?.disabled\n );\n\n return {\n list,\n hasLeftIcons,\n anySelected,\n allSelected,\n anySelectableSelected,\n allSelectableSelected,\n selection,\n };\n};\n\nconst parseList = (\n item: HvListValue | undefined,\n props: {\n multiSelect?: boolean;\n selectable?: boolean;\n singleSelectionToggle?: boolean;\n },\n selectAll: boolean | undefined,\n list: HvListValue[] = []\n): HvListValue[] => {\n const { multiSelect, selectable, singleSelectionToggle } = props || {};\n\n let anySelected = false;\n const newList = list.map((elem: any) => {\n const newItem = { ...elem };\n\n // reset elem item\n if (!multiSelect) {\n newItem.selected = false;\n }\n\n const selectItem = item ? isItemSelected(item, newItem) : elem?.selected;\n\n if (selectItem && selectable) {\n let selectionState;\n\n if (multiSelect) {\n selectionState = item ? !elem?.selected : true;\n } else {\n selectionState =\n !anySelected &&\n (item && singleSelectionToggle ? !elem?.selected : true);\n }\n\n newItem.selected = selectionState;\n anySelected = true;\n }\n\n if (typeof selectAll === \"boolean\" && !elem?.disabled)\n newItem.selected = selectAll;\n\n // normalize item selected prop if not provided\n if (!newItem?.selected) newItem.selected = false;\n\n return newItem;\n });\n\n return newList;\n};\n\nexport { isItemSelected, parseList, parseState };\n"],"names":[],"mappings":"AAEM,MAAA,iBAAiB,CAAC,MAAmB,YAAyB;AAC5D,QAAA,eAAe,MAAM,KAAK,OAAO;AACjC,QAAA,mBAAmB,QAAQ,KAAK,YAAY;AAC3C,SAAA,QAAQ,YAAY,MAAM;AACnC;AA2BA,MAAM,YAAY,CAChB,MACA,OAKA,WACA,OAAsB,CAAA,MACJ;AAClB,QAAM,EAAE,aAAa,YAAY,sBAAsB,IAAI,SAAS,CAAA;AAEpE,MAAI,cAAc;AAClB,QAAM,UAAU,KAAK,IAAI,CAAC,SAAc;AAChC,UAAA,UAAU,EAAE,GAAG;AAGrB,QAAI,CAAC,aAAa;AAChB,cAAQ,WAAW;AAAA,IACrB;AAEA,UAAM,aAAa,OAAO,eAAe,MAAM,OAAO,IAAI,MAAM;AAEhE,QAAI,cAAc,YAAY;AACxB,UAAA;AAEJ,UAAI,aAAa;AACE,yBAAA,OAAO,CAAC,MAAM,WAAW;AAAA,MAAA,OACrC;AACL,yBACE,CAAC,gBACA,QAAQ,wBAAwB,CAAC,MAAM,WAAW;AAAA,MACvD;AAEA,cAAQ,WAAW;AACL,oBAAA;AAAA,IAChB;AAEA,QAAI,OAAO,cAAc,aAAa,CAAC,MAAM;AAC3C,cAAQ,WAAW;AAGrB,QAAI,CAAC,SAAS;AAAU,cAAQ,WAAW;AAEpC,WAAA;AAAA,EAAA,CACR;AAEM,SAAA;AACT;"}
@@ -1 +1 @@
1
- {"version":3,"file":"DateTimeValue.mjs","sources":["../../../../../../src/QueryBuilder/Rule/Value/DateTimeValue/DateTimeValue.tsx"],"sourcesContent":["import { memo, useCallback, useMemo, useState } from \"react\";\nimport uniqueId from \"lodash/uniqueId\";\nimport dayjs from \"dayjs\";\nimport { useTheme } from \"@mui/material/styles\";\nimport useMediaQuery from \"@mui/material/useMediaQuery\";\n\nimport { HvWarningText } from \"../../../../Forms\";\nimport { HvTimePicker, HvTimePickerValue } from \"../../../../TimePicker\";\nimport { HvDatePicker } from \"../../../../DatePicker\";\n\nimport { useQueryBuilderContext } from \"../../../Context\";\nimport { padTime, parseDate, parseTime } from \"./utils\";\nimport { useClasses } from \"./DateTimeValue.styles\";\n\nfunction valueIsRange(operator) {\n return operator === \"range\";\n}\n\nexport interface DateTimeValueProps {\n id: React.Key;\n operator?: string;\n value?: any;\n initialTouched?: boolean;\n}\n\nexport const DateTimeValue = ({\n id,\n operator,\n value: valueProp = {},\n initialTouched = false,\n}: DateTimeValueProps) => {\n const { classes, cx } = useClasses();\n\n const theme = useTheme();\n const isMdDown = useMediaQuery(theme.breakpoints.down(\"md\"));\n\n const isRange = valueIsRange(operator);\n\n const { labels, dispatchAction, readOnly } = useQueryBuilderContext();\n\n const elementId = uniqueId(`datetime${id}`);\n\n const [touchedDate, setTouchedDate] = useState(initialTouched);\n const [touchedTime, setTouchedTime] = useState(initialTouched);\n const [touchedEndDate, setTouchedEndDate] = useState(initialTouched);\n const [touchedEndTime, setTouchedEndTime] = useState(initialTouched);\n\n const onDateChange = useCallback(\n (data?: Date) => {\n setTouchedDate(true);\n\n let date;\n if (data != null) {\n date = dayjs(data).format(\"YYYY-MM-DD\");\n }\n\n const oldValue = !isRange ? valueProp?.date : valueProp?.start?.date;\n\n if (date !== oldValue) {\n let value;\n if (!isRange) {\n value = {\n date,\n time: valueProp?.time,\n };\n } else {\n value = {\n start: {\n date,\n time: valueProp?.start?.time,\n },\n end: valueProp?.end,\n };\n }\n\n dispatchAction({\n type: \"set-value\",\n id,\n value,\n });\n }\n },\n [dispatchAction, id, isRange, valueProp]\n );\n\n const onTimeChange = useCallback(\n (data: HvTimePickerValue) => {\n setTouchedTime(true);\n\n let time;\n if (data != null) {\n time = `${padTime(data.hours)}:${padTime(data.minutes)}:${padTime(\n data.seconds\n )}`;\n }\n\n const oldValue = !isRange ? valueProp?.time : valueProp?.start?.time;\n\n if (time !== oldValue) {\n let value;\n if (!isRange) {\n value = {\n date: valueProp?.date,\n time,\n };\n } else {\n value = {\n start: {\n date: valueProp?.start?.date,\n time,\n },\n end: valueProp?.end,\n };\n }\n\n dispatchAction({\n type: \"set-value\",\n id,\n value,\n });\n }\n },\n [dispatchAction, id, isRange, valueProp]\n );\n\n const onEndDateChange = useCallback(\n (data?: Date) => {\n setTouchedEndDate(true);\n\n let date;\n if (data != null) {\n date = dayjs(data).format(\"YYYY-MM-DD\");\n }\n\n if (date !== valueProp?.end?.date) {\n const value = {\n start: valueProp?.start,\n end: {\n date,\n time: valueProp?.end?.time,\n },\n };\n\n dispatchAction({\n type: \"set-value\",\n id,\n value,\n });\n }\n },\n [dispatchAction, id, valueProp]\n );\n\n const onEndTimeChange = useCallback(\n (data: HvTimePickerValue) => {\n setTouchedEndTime(true);\n\n let time;\n if (data != null) {\n time = `${padTime(data.hours)}:${padTime(data.minutes)}:${padTime(\n data.seconds\n )}`;\n }\n\n if (time !== valueProp?.end?.time) {\n const value = {\n start: valueProp?.start,\n end: {\n date: valueProp?.end?.date,\n time,\n },\n };\n\n dispatchAction({\n type: \"set-value\",\n id,\n value,\n });\n }\n },\n [dispatchAction, id, valueProp]\n );\n\n const startDate = isRange ? valueProp?.start?.date : valueProp?.date;\n const datePickerValue = useMemo(() => parseDate(startDate), [startDate]);\n const datePickerStatus = datePickerValue != null ? \"valid\" : \"invalid\";\n\n const startTime = (isRange ? valueProp?.start?.time : valueProp?.time) ?? \"\";\n const timePickerValue = useMemo(() => parseTime(startTime), [startTime]);\n const timePickerStatus = timePickerValue != null ? \"valid\" : \"invalid\";\n\n const endDate = isRange ? valueProp?.end?.date : null;\n const endDatePickerValue = useMemo(() => parseDate(endDate), [endDate]);\n\n const endTime = isRange ? valueProp?.end?.time : null;\n const endTimePickerValue = useMemo(() => parseTime(endTime), [endTime]);\n\n const dateStatus = !touchedDate ? \"standBy\" : datePickerStatus;\n const timeStatus = !touchedTime ? \"standBy\" : timePickerStatus;\n\n const endDateIsBefore =\n startDate != null && endDate != null && endDate < startDate;\n\n const endTimeIsBeforeOrSame =\n startDate != null &&\n endDate != null &&\n endDate === startDate &&\n startTime != null &&\n endTime != null &&\n endTime <= startTime;\n\n const endDateTimeIsBefore = endDateIsBefore || endTimeIsBeforeOrSame;\n\n const endDatePickerStatus =\n endDatePickerValue == null || endDateTimeIsBefore ? \"invalid\" : \"valid\";\n const endDateStatus = !touchedEndDate ? \"standBy\" : endDatePickerStatus;\n\n const endTimePickerStatus =\n endTimePickerValue == null || endDateTimeIsBefore ? \"invalid\" : \"valid\";\n const endTimeStatus = !touchedEndTime ? \"standBy\" : endTimePickerStatus;\n\n return (\n <div className={classes.root}>\n <div\n className={cx(classes.row, classes.horizontal, {\n [classes.isMdDown]: isMdDown,\n })}\n >\n <HvDatePicker\n className={classes.datePicker}\n name={`${elementId}-date`}\n required\n status={dateStatus}\n statusMessage={labels.rule.value.datetime.validation.required}\n label={\n isRange\n ? labels.rule.value.datetime.startDateLabel\n : labels.rule.value.datetime.dateLabel\n }\n placeholder={\n isRange\n ? labels.rule.value.datetime.startDatePlaceholder\n : labels.rule.value.datetime.datePlaceholder\n }\n value={datePickerValue}\n onChange={onDateChange}\n readOnly={readOnly}\n />\n <HvTimePicker\n className={classes.timePicker}\n timeFormat=\"24\"\n name={`${elementId}-time`}\n required\n status={timeStatus}\n statusMessage={labels.rule.value.datetime.validation.required}\n label={\n isRange\n ? labels.rule.value.datetime.startTimeLabel\n : labels.rule.value.datetime.timeLabel\n }\n placeholder={\n isRange\n ? labels.rule.value.datetime.startTimePlaceholder\n : labels.rule.value.datetime.timePlaceholder\n }\n value={timePickerValue || undefined}\n onChange={onTimeChange}\n onToggle={(_evt, open) => {\n if (!open && !touchedTime) {\n setTouchedTime(true);\n }\n }}\n readOnly={readOnly}\n />\n </div>\n {isRange && (\n <div className={cx(classes.row, classes.vertical)}>\n <div\n className={cx(classes.horizontal, {\n [classes.isMdDown]: isMdDown,\n })}\n >\n <HvDatePicker\n className={classes.datePicker}\n name={`${elementId}-endDate`}\n required\n status={endDateStatus}\n statusMessage={labels.rule.value.datetime.validation.required}\n aria-errormessage={\n endDateTimeIsBefore ? `${elementId}-combined-error` : undefined\n }\n label={labels.rule.value.datetime.endDateLabel}\n placeholder={labels.rule.value.datetime.endDatePlaceholder}\n value={endDatePickerValue}\n onChange={onEndDateChange}\n readOnly={readOnly}\n />\n <HvTimePicker\n className={classes.timePicker}\n timeFormat=\"24\"\n name={`${elementId}-endTime`}\n required\n status={endTimeStatus}\n statusMessage={labels.rule.value.datetime.validation.required}\n aria-errormessage={\n endDateTimeIsBefore ? `${elementId}-combined-error` : undefined\n }\n label={labels.rule.value.datetime.endTimeLabel}\n placeholder={labels.rule.value.datetime.endTimePlaceholder}\n value={endTimePickerValue || undefined}\n onChange={onEndTimeChange}\n onToggle={(_evt, open) => {\n if (!open && !touchedEndTime) {\n setTouchedEndTime(true);\n }\n }}\n readOnly={readOnly}\n />\n </div>\n <HvWarningText\n disableBorder\n id={`${elementId}-combined-error`}\n isVisible={endDateTimeIsBefore}\n >\n {labels.rule.value.datetime.validation.invalidInterval}\n </HvWarningText>\n </div>\n )}\n </div>\n );\n};\n\nexport default memo(DateTimeValue);\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"DateTimeValue.mjs","sources":["../../../../../../src/QueryBuilder/Rule/Value/DateTimeValue/DateTimeValue.tsx"],"sourcesContent":["import { memo, useCallback, useMemo, useState } from \"react\";\nimport uniqueId from \"lodash/uniqueId\";\nimport dayjs from \"dayjs\";\nimport { useTheme } from \"@mui/material/styles\";\nimport useMediaQuery from \"@mui/material/useMediaQuery\";\n\nimport { HvWarningText } from \"../../../../Forms\";\nimport { HvTimePicker, HvTimePickerValue } from \"../../../../TimePicker\";\nimport { HvDatePicker } from \"../../../../DatePicker\";\n\nimport { useQueryBuilderContext } from \"../../../Context\";\nimport { padTime, parseDate, parseTime } from \"./utils\";\nimport { useClasses } from \"./DateTimeValue.styles\";\n\nfunction valueIsRange(operator?: string) {\n return operator === \"range\";\n}\n\nexport interface DateTimeValueProps {\n id: React.Key;\n operator?: string;\n value?: any;\n initialTouched?: boolean;\n}\n\nexport const DateTimeValue = ({\n id,\n operator,\n value: valueProp = {},\n initialTouched = false,\n}: DateTimeValueProps) => {\n const { classes, cx } = useClasses();\n\n const theme = useTheme();\n const isMdDown = useMediaQuery(theme.breakpoints.down(\"md\"));\n\n const isRange = valueIsRange(operator);\n\n const { labels, dispatchAction, readOnly } = useQueryBuilderContext();\n\n const elementId = uniqueId(`datetime${id}`);\n\n const [touchedDate, setTouchedDate] = useState(initialTouched);\n const [touchedTime, setTouchedTime] = useState(initialTouched);\n const [touchedEndDate, setTouchedEndDate] = useState(initialTouched);\n const [touchedEndTime, setTouchedEndTime] = useState(initialTouched);\n\n const onDateChange = useCallback(\n (data?: Date) => {\n setTouchedDate(true);\n\n let date;\n if (data != null) {\n date = dayjs(data).format(\"YYYY-MM-DD\");\n }\n\n const oldValue = !isRange ? valueProp?.date : valueProp?.start?.date;\n\n if (date !== oldValue) {\n let value;\n if (!isRange) {\n value = {\n date,\n time: valueProp?.time,\n };\n } else {\n value = {\n start: {\n date,\n time: valueProp?.start?.time,\n },\n end: valueProp?.end,\n };\n }\n\n dispatchAction({\n type: \"set-value\",\n id,\n value,\n });\n }\n },\n [dispatchAction, id, isRange, valueProp]\n );\n\n const onTimeChange = useCallback(\n (data: HvTimePickerValue) => {\n setTouchedTime(true);\n\n let time;\n if (data != null) {\n time = `${padTime(data.hours)}:${padTime(data.minutes)}:${padTime(\n data.seconds\n )}`;\n }\n\n const oldValue = !isRange ? valueProp?.time : valueProp?.start?.time;\n\n if (time !== oldValue) {\n let value;\n if (!isRange) {\n value = {\n date: valueProp?.date,\n time,\n };\n } else {\n value = {\n start: {\n date: valueProp?.start?.date,\n time,\n },\n end: valueProp?.end,\n };\n }\n\n dispatchAction({\n type: \"set-value\",\n id,\n value,\n });\n }\n },\n [dispatchAction, id, isRange, valueProp]\n );\n\n const onEndDateChange = useCallback(\n (data?: Date) => {\n setTouchedEndDate(true);\n\n let date;\n if (data != null) {\n date = dayjs(data).format(\"YYYY-MM-DD\");\n }\n\n if (date !== valueProp?.end?.date) {\n const value = {\n start: valueProp?.start,\n end: {\n date,\n time: valueProp?.end?.time,\n },\n };\n\n dispatchAction({\n type: \"set-value\",\n id,\n value,\n });\n }\n },\n [dispatchAction, id, valueProp]\n );\n\n const onEndTimeChange = useCallback(\n (data: HvTimePickerValue) => {\n setTouchedEndTime(true);\n\n let time;\n if (data != null) {\n time = `${padTime(data.hours)}:${padTime(data.minutes)}:${padTime(\n data.seconds\n )}`;\n }\n\n if (time !== valueProp?.end?.time) {\n const value = {\n start: valueProp?.start,\n end: {\n date: valueProp?.end?.date,\n time,\n },\n };\n\n dispatchAction({\n type: \"set-value\",\n id,\n value,\n });\n }\n },\n [dispatchAction, id, valueProp]\n );\n\n const startDate = isRange ? valueProp?.start?.date : valueProp?.date;\n const datePickerValue = useMemo(() => parseDate(startDate), [startDate]);\n const datePickerStatus = datePickerValue != null ? \"valid\" : \"invalid\";\n\n const startTime = (isRange ? valueProp?.start?.time : valueProp?.time) ?? \"\";\n const timePickerValue = useMemo(() => parseTime(startTime), [startTime]);\n const timePickerStatus = timePickerValue != null ? \"valid\" : \"invalid\";\n\n const endDate = isRange ? valueProp?.end?.date : null;\n const endDatePickerValue = useMemo(() => parseDate(endDate), [endDate]);\n\n const endTime = isRange ? valueProp?.end?.time : null;\n const endTimePickerValue = useMemo(() => parseTime(endTime), [endTime]);\n\n const dateStatus = !touchedDate ? \"standBy\" : datePickerStatus;\n const timeStatus = !touchedTime ? \"standBy\" : timePickerStatus;\n\n const endDateIsBefore =\n startDate != null && endDate != null && endDate < startDate;\n\n const endTimeIsBeforeOrSame =\n startDate != null &&\n endDate != null &&\n endDate === startDate &&\n startTime != null &&\n endTime != null &&\n endTime <= startTime;\n\n const endDateTimeIsBefore = endDateIsBefore || endTimeIsBeforeOrSame;\n\n const endDatePickerStatus =\n endDatePickerValue == null || endDateTimeIsBefore ? \"invalid\" : \"valid\";\n const endDateStatus = !touchedEndDate ? \"standBy\" : endDatePickerStatus;\n\n const endTimePickerStatus =\n endTimePickerValue == null || endDateTimeIsBefore ? \"invalid\" : \"valid\";\n const endTimeStatus = !touchedEndTime ? \"standBy\" : endTimePickerStatus;\n\n return (\n <div className={classes.root}>\n <div\n className={cx(classes.row, classes.horizontal, {\n [classes.isMdDown]: isMdDown,\n })}\n >\n <HvDatePicker\n className={classes.datePicker}\n name={`${elementId}-date`}\n required\n status={dateStatus}\n statusMessage={labels.rule.value.datetime.validation.required}\n label={\n isRange\n ? labels.rule.value.datetime.startDateLabel\n : labels.rule.value.datetime.dateLabel\n }\n placeholder={\n isRange\n ? labels.rule.value.datetime.startDatePlaceholder\n : labels.rule.value.datetime.datePlaceholder\n }\n value={datePickerValue}\n onChange={onDateChange}\n readOnly={readOnly}\n />\n <HvTimePicker\n className={classes.timePicker}\n timeFormat=\"24\"\n name={`${elementId}-time`}\n required\n status={timeStatus}\n statusMessage={labels.rule.value.datetime.validation.required}\n label={\n isRange\n ? labels.rule.value.datetime.startTimeLabel\n : labels.rule.value.datetime.timeLabel\n }\n placeholder={\n isRange\n ? labels.rule.value.datetime.startTimePlaceholder\n : labels.rule.value.datetime.timePlaceholder\n }\n value={timePickerValue || undefined}\n onChange={onTimeChange}\n onToggle={(_evt, open) => {\n if (!open && !touchedTime) {\n setTouchedTime(true);\n }\n }}\n readOnly={readOnly}\n />\n </div>\n {isRange && (\n <div className={cx(classes.row, classes.vertical)}>\n <div\n className={cx(classes.horizontal, {\n [classes.isMdDown]: isMdDown,\n })}\n >\n <HvDatePicker\n className={classes.datePicker}\n name={`${elementId}-endDate`}\n required\n status={endDateStatus}\n statusMessage={labels.rule.value.datetime.validation.required}\n aria-errormessage={\n endDateTimeIsBefore ? `${elementId}-combined-error` : undefined\n }\n label={labels.rule.value.datetime.endDateLabel}\n placeholder={labels.rule.value.datetime.endDatePlaceholder}\n value={endDatePickerValue}\n onChange={onEndDateChange}\n readOnly={readOnly}\n />\n <HvTimePicker\n className={classes.timePicker}\n timeFormat=\"24\"\n name={`${elementId}-endTime`}\n required\n status={endTimeStatus}\n statusMessage={labels.rule.value.datetime.validation.required}\n aria-errormessage={\n endDateTimeIsBefore ? `${elementId}-combined-error` : undefined\n }\n label={labels.rule.value.datetime.endTimeLabel}\n placeholder={labels.rule.value.datetime.endTimePlaceholder}\n value={endTimePickerValue || undefined}\n onChange={onEndTimeChange}\n onToggle={(_evt, open) => {\n if (!open && !touchedEndTime) {\n setTouchedEndTime(true);\n }\n }}\n readOnly={readOnly}\n />\n </div>\n <HvWarningText\n disableBorder\n id={`${elementId}-combined-error`}\n isVisible={endDateTimeIsBefore}\n >\n {labels.rule.value.datetime.validation.invalidInterval}\n </HvWarningText>\n </div>\n )}\n </div>\n );\n};\n\nexport default memo(DateTimeValue);\n"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"useScrollTo.mjs","sources":["../../../src/ScrollTo/useScrollTo.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from \"react\";\n\nimport {\n findFirstVisibleElement,\n getScrollTop,\n isScrolledToTheBottom,\n scrollElement,\n verticalScrollOffset,\n} from \"./utils\";\nimport { HvScrollToVerticalOption } from \"./types\";\n\nexport const useScrollTo = (\n selectedIndexProp: number = 0,\n scrollElementId: string | undefined = undefined,\n href: boolean = false,\n offset: number = 0,\n options: HvScrollToVerticalOption[] = [],\n onChange:\n | ((\n event:\n | Event\n | React.MouseEvent<HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>,\n index: number\n ) => void)\n | undefined = undefined,\n direction: \"column\" | \"row\" = \"column\"\n): [\n number,\n (\n event:\n | React.MouseEvent<HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>,\n id: string,\n index: number,\n wrappedOnChange?: (index: number) => void\n ) => void\n] => {\n const RETRY_MAX: number = 5;\n const [selectedIndex, setSelectedIndex] = useState<number>(selectedIndexProp);\n\n const scrollEle = useRef<HTMLElement | (Window & typeof globalThis)>(window);\n const requestedAnimationFrame = useRef(0);\n const lastContainerScrollTop = useRef<number>(0);\n\n // Ref to use a often-changing value in useCallback, as recommended in\n // https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback\n const selectedIndexRef = useRef(selectedIndex);\n\n useEffect(() => {\n selectedIndexRef.current = selectedIndex;\n }, [selectedIndex]);\n\n useEffect(() => {\n scrollEle.current =\n (scrollElementId && document.getElementById(scrollElementId)) || window;\n\n lastContainerScrollTop.current = verticalScrollOffset(scrollEle.current);\n }, [scrollElementId]);\n\n const checkScroll = useCallback(\n (\n event:\n | Event\n | React.MouseEvent<HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>\n ) => {\n if (\n requestedAnimationFrame.current === 0 &&\n window?.requestAnimationFrame\n ) {\n requestedAnimationFrame.current = window.requestAnimationFrame(() => {\n requestedAnimationFrame.current = 0;\n\n const firstVisibleElementIndex = findFirstVisibleElement(\n scrollEle.current,\n options,\n offset\n );\n\n let newSelectedIndex = firstVisibleElementIndex;\n\n // select the first element when all elements are bellow the container's top\n if (firstVisibleElementIndex < 0) {\n newSelectedIndex = 0;\n }\n\n // if the user has reached the bottom of the container, select the first nav item still visible\n // (usually this selects the last nav item, when it can't reach the top the container)\n // in theory only needed when scrolling down, but no... because of the Safari bouncing behaviour\n if (\n newSelectedIndex < options.length - 1 &&\n isScrolledToTheBottom(scrollEle.current)\n ) {\n newSelectedIndex += 1;\n }\n\n const containerScrollTop = getScrollTop(scrollEle.current);\n const isScrollingDown =\n containerScrollTop > lastContainerScrollTop.current;\n lastContainerScrollTop.current = containerScrollTop;\n\n // only update the selected item if the scroll direction is moving away from it\n if (isScrollingDown) {\n if (newSelectedIndex < selectedIndexRef.current) {\n newSelectedIndex = selectedIndexRef.current;\n }\n } else if (newSelectedIndex > selectedIndexRef.current) {\n newSelectedIndex = selectedIndexRef.current;\n }\n\n setSelectedIndex(newSelectedIndex);\n onChange?.(event, newSelectedIndex);\n });\n }\n },\n [offset, options, onChange]\n );\n\n // Registers and unregisters the scroll listener\n useEffect(() => {\n if (scrollEle.current) {\n scrollEle.current.addEventListener(\"scroll\", checkScroll, false);\n }\n\n return () => {\n if (scrollEle.current) {\n scrollEle.current.removeEventListener(\"scroll\", checkScroll);\n }\n\n if (requestedAnimationFrame.current !== 0) {\n window.cancelAnimationFrame(requestedAnimationFrame.current);\n requestedAnimationFrame.current = 0;\n }\n };\n }, [checkScroll]);\n\n // Waits for the elements to be rendered and scrolls to the one referenced in the URL hash, if any\n useEffect(() => {\n let checkRenderedInterval;\n\n if (href) {\n const hashValue = document.location.hash.split(\"#\")[1] || \"\";\n\n const option = options.find((o) => o.value === hashValue);\n\n if (option) {\n let retry = 0;\n checkRenderedInterval = setInterval(() => {\n const ele = document.getElementById(option.value);\n\n if (ele) {\n scrollElement(ele, scrollEle.current, option.offset || offset);\n clearInterval(checkRenderedInterval);\n } else {\n retry += 1;\n if (retry === RETRY_MAX) {\n clearInterval(checkRenderedInterval);\n }\n }\n }, 1000);\n }\n }\n\n return () => {\n clearInterval(checkRenderedInterval);\n };\n\n // We really want to run this just in the first load\n // in fact this doesn't even belong here, the logic should be external\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const setScrollTo = (\n event:\n | React.MouseEvent<HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>,\n id: string,\n index: number,\n wrappedOnChange?: (index: number) => void\n ) => {\n const option = options.find((o) => o.value === id);\n\n if (option) {\n const ele = document.getElementById(id);\n if (ele) {\n scrollElement(\n ele,\n scrollEle.current,\n option.offset || offset,\n direction\n );\n }\n\n if (href) {\n window.history.pushState({}, \"\", `#${options[index].value}`);\n }\n\n setSelectedIndex(index);\n wrappedOnChange?.(index);\n\n // Safari scrolls immediately (no smooth scroll support),\n // so this ref value must be updated asap\n selectedIndexRef.current = index;\n }\n };\n\n return [selectedIndex, setScrollTo];\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"useScrollTo.mjs","sources":["../../../src/ScrollTo/useScrollTo.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from \"react\";\n\nimport {\n findFirstVisibleElement,\n getScrollTop,\n isScrolledToTheBottom,\n scrollElement,\n verticalScrollOffset,\n} from \"./utils\";\nimport { HvScrollToVerticalOption } from \"./types\";\n\nexport const useScrollTo = (\n selectedIndexProp: number = 0,\n scrollElementId: string | undefined = undefined,\n href: boolean = false,\n offset: number = 0,\n options: HvScrollToVerticalOption[] = [],\n onChange:\n | ((\n event:\n | Event\n | React.MouseEvent<HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>,\n index: number\n ) => void)\n | undefined = undefined,\n direction: \"column\" | \"row\" = \"column\"\n): [\n number,\n (\n event:\n | React.MouseEvent<HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>,\n id: string,\n index: number,\n wrappedOnChange?: (index: number) => void\n ) => void\n] => {\n const RETRY_MAX: number = 5;\n const [selectedIndex, setSelectedIndex] = useState<number>(selectedIndexProp);\n\n const scrollEle = useRef<HTMLElement | (Window & typeof globalThis)>(window);\n const requestedAnimationFrame = useRef(0);\n const lastContainerScrollTop = useRef<number>(0);\n\n // Ref to use a often-changing value in useCallback, as recommended in\n // https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback\n const selectedIndexRef = useRef(selectedIndex);\n\n useEffect(() => {\n selectedIndexRef.current = selectedIndex;\n }, [selectedIndex]);\n\n useEffect(() => {\n scrollEle.current =\n (scrollElementId && document.getElementById(scrollElementId)) || window;\n\n lastContainerScrollTop.current = verticalScrollOffset(scrollEle.current);\n }, [scrollElementId]);\n\n const checkScroll = useCallback(\n (\n event:\n | Event\n | React.MouseEvent<HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>\n ) => {\n if (\n requestedAnimationFrame.current === 0 &&\n window?.requestAnimationFrame\n ) {\n requestedAnimationFrame.current = window.requestAnimationFrame(() => {\n requestedAnimationFrame.current = 0;\n\n const firstVisibleElementIndex = findFirstVisibleElement(\n scrollEle.current,\n options,\n offset\n );\n\n let newSelectedIndex = firstVisibleElementIndex;\n\n // select the first element when all elements are bellow the container's top\n if (firstVisibleElementIndex < 0) {\n newSelectedIndex = 0;\n }\n\n // if the user has reached the bottom of the container, select the first nav item still visible\n // (usually this selects the last nav item, when it can't reach the top the container)\n // in theory only needed when scrolling down, but no... because of the Safari bouncing behaviour\n if (\n newSelectedIndex < options.length - 1 &&\n isScrolledToTheBottom(scrollEle.current)\n ) {\n newSelectedIndex += 1;\n }\n\n const containerScrollTop = getScrollTop(scrollEle.current);\n const isScrollingDown =\n containerScrollTop > lastContainerScrollTop.current;\n lastContainerScrollTop.current = containerScrollTop;\n\n // only update the selected item if the scroll direction is moving away from it\n if (isScrollingDown) {\n if (newSelectedIndex < selectedIndexRef.current) {\n newSelectedIndex = selectedIndexRef.current;\n }\n } else if (newSelectedIndex > selectedIndexRef.current) {\n newSelectedIndex = selectedIndexRef.current;\n }\n\n setSelectedIndex(newSelectedIndex);\n onChange?.(event, newSelectedIndex);\n });\n }\n },\n [offset, options, onChange]\n );\n\n // Registers and unregisters the scroll listener\n useEffect(() => {\n if (scrollEle.current) {\n scrollEle.current.addEventListener(\"scroll\", checkScroll, false);\n }\n\n return () => {\n if (scrollEle.current) {\n scrollEle.current.removeEventListener(\"scroll\", checkScroll);\n }\n\n if (requestedAnimationFrame.current !== 0) {\n window.cancelAnimationFrame(requestedAnimationFrame.current);\n requestedAnimationFrame.current = 0;\n }\n };\n }, [checkScroll]);\n\n // Waits for the elements to be rendered and scrolls to the one referenced in the URL hash, if any\n useEffect(() => {\n let checkRenderedInterval: any;\n\n if (href) {\n const hashValue = document.location.hash.split(\"#\")[1] || \"\";\n\n const option = options.find((o) => o.value === hashValue);\n\n if (option) {\n let retry = 0;\n checkRenderedInterval = setInterval(() => {\n const ele = document.getElementById(option.value);\n\n if (ele) {\n scrollElement(ele, scrollEle.current, option.offset || offset);\n clearInterval(checkRenderedInterval);\n } else {\n retry += 1;\n if (retry === RETRY_MAX) {\n clearInterval(checkRenderedInterval);\n }\n }\n }, 1000);\n }\n }\n\n return () => {\n clearInterval(checkRenderedInterval);\n };\n\n // We really want to run this just in the first load\n // in fact this doesn't even belong here, the logic should be external\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const setScrollTo = (\n event:\n | React.MouseEvent<HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>,\n id: string,\n index: number,\n wrappedOnChange?: (index: number) => void\n ) => {\n const option = options.find((o) => o.value === id);\n\n if (option) {\n const ele = document.getElementById(id);\n if (ele) {\n scrollElement(\n ele,\n scrollEle.current,\n option.offset || offset,\n direction\n );\n }\n\n if (href) {\n window.history.pushState({}, \"\", `#${options[index].value}`);\n }\n\n setSelectedIndex(index);\n wrappedOnChange?.(index);\n\n // Safari scrolls immediately (no smooth scroll support),\n // so this ref value must be updated asap\n selectedIndexRef.current = index;\n }\n };\n\n return [selectedIndex, setScrollTo];\n};\n"],"names":[],"mappings":"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"}
@@ -350,7 +350,7 @@ const HvSlider = forwardRef((props, ref) => {
350
350
  {
351
351
  id: setId(elementId, "label"),
352
352
  className: classes.label,
353
- htmlFor: setId(elementId, "slider"),
353
+ htmlFor: sliderInputId,
354
354
  label
355
355
  }
356
356
  ),