@hitachivantara/uikit-react-core 5.0.2 → 5.1.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 (110) hide show
  1. package/dist/cjs/components/Dropdown/dropdownClasses.cjs +1 -1
  2. package/dist/cjs/components/Dropdown/dropdownClasses.cjs.map +1 -1
  3. package/dist/cjs/components/Pagination/Pagination.cjs +1 -1
  4. package/dist/cjs/components/Pagination/Pagination.cjs.map +1 -1
  5. package/dist/cjs/components/Slider/Slider.cjs +301 -0
  6. package/dist/cjs/components/Slider/Slider.cjs.map +1 -0
  7. package/dist/cjs/components/Slider/Slider.styles.cjs +334 -0
  8. package/dist/cjs/components/Slider/Slider.styles.cjs.map +1 -0
  9. package/dist/cjs/components/Slider/SliderInput/SliderInput.cjs +66 -0
  10. package/dist/cjs/components/Slider/SliderInput/SliderInput.cjs.map +1 -0
  11. package/dist/cjs/components/Slider/SliderInput/SliderInput.styles.cjs +55 -0
  12. package/dist/cjs/components/Slider/SliderInput/SliderInput.styles.cjs.map +1 -0
  13. package/dist/cjs/components/Slider/SliderInput/sliderInputClasses.cjs +8 -0
  14. package/dist/cjs/components/Slider/SliderInput/sliderInputClasses.cjs.map +1 -0
  15. package/dist/cjs/components/Slider/base.cjs +251 -0
  16. package/dist/cjs/components/Slider/base.cjs.map +1 -0
  17. package/dist/cjs/components/Slider/sliderClasses.cjs +8 -0
  18. package/dist/cjs/components/Slider/sliderClasses.cjs.map +1 -0
  19. package/dist/cjs/components/Slider/utils.cjs +217 -0
  20. package/dist/cjs/components/Slider/utils.cjs.map +1 -0
  21. package/dist/cjs/components/Table/TableBody/tableBodyClasses.cjs.map +1 -1
  22. package/dist/cjs/components/Table/TableCell/tableCellClasses.cjs.map +1 -1
  23. package/dist/cjs/components/Table/TableContainer/tableContainerClasses.cjs.map +1 -1
  24. package/dist/cjs/components/Table/TableHead/tableHeadClasses.cjs.map +1 -1
  25. package/dist/cjs/components/Table/TableHeader/tableHeaderClasses.cjs.map +1 -1
  26. package/dist/cjs/components/Table/TableRow/tableRowClasses.cjs.map +1 -1
  27. package/dist/cjs/components/Table/tableClasses.cjs.map +1 -1
  28. package/dist/cjs/components/VerticalNavigation/Navigation/Navigation.cjs +76 -17
  29. package/dist/cjs/components/VerticalNavigation/Navigation/Navigation.cjs.map +1 -1
  30. package/dist/cjs/components/VerticalNavigation/Navigation/Navigation.styles.cjs +4 -1
  31. package/dist/cjs/components/VerticalNavigation/Navigation/Navigation.styles.cjs.map +1 -1
  32. package/dist/cjs/components/VerticalNavigation/Navigation/navigationClasses.cjs +1 -1
  33. package/dist/cjs/components/VerticalNavigation/Navigation/navigationClasses.cjs.map +1 -1
  34. package/dist/cjs/components/VerticalNavigation/NavigationPopup/NavigationPopup.cjs +58 -0
  35. package/dist/cjs/components/VerticalNavigation/NavigationPopup/NavigationPopup.cjs.map +1 -0
  36. package/dist/cjs/components/VerticalNavigation/NavigationPopup/NavigationPopup.styles.cjs +16 -0
  37. package/dist/cjs/components/VerticalNavigation/NavigationPopup/NavigationPopup.styles.cjs.map +1 -0
  38. package/dist/cjs/components/VerticalNavigation/TreeView/IconWrapper/IconWrapper.cjs +41 -0
  39. package/dist/cjs/components/VerticalNavigation/TreeView/IconWrapper/IconWrapper.cjs.map +1 -0
  40. package/dist/cjs/components/VerticalNavigation/TreeView/IconWrapper/IconWrapper.styles.cjs +42 -0
  41. package/dist/cjs/components/VerticalNavigation/TreeView/IconWrapper/IconWrapper.styles.cjs.map +1 -0
  42. package/dist/cjs/components/VerticalNavigation/TreeView/TooltipWrapper/TooltipWrapper.cjs +24 -0
  43. package/dist/cjs/components/VerticalNavigation/TreeView/TooltipWrapper/TooltipWrapper.cjs.map +1 -0
  44. package/dist/cjs/components/VerticalNavigation/TreeView/TreeViewItem.cjs +42 -44
  45. package/dist/cjs/components/VerticalNavigation/TreeView/TreeViewItem.cjs.map +1 -1
  46. package/dist/cjs/components/VerticalNavigation/VerticalNavigation.cjs +6 -2
  47. package/dist/cjs/components/VerticalNavigation/VerticalNavigation.cjs.map +1 -1
  48. package/dist/cjs/components/VerticalNavigation/VerticalNavigation.styles.cjs +6 -4
  49. package/dist/cjs/components/VerticalNavigation/VerticalNavigation.styles.cjs.map +1 -1
  50. package/dist/cjs/components/VerticalNavigation/VerticalNavigationContext.cjs.map +1 -1
  51. package/dist/cjs/components/VerticalNavigation/utils/VerticalNavigation.utils.cjs +7 -0
  52. package/dist/cjs/components/VerticalNavigation/utils/VerticalNavigation.utils.cjs.map +1 -0
  53. package/dist/cjs/index.cjs +4 -0
  54. package/dist/cjs/index.cjs.map +1 -1
  55. package/dist/esm/components/Dropdown/dropdownClasses.js +1 -1
  56. package/dist/esm/components/Dropdown/dropdownClasses.js.map +1 -1
  57. package/dist/esm/components/Pagination/Pagination.js +1 -1
  58. package/dist/esm/components/Pagination/Pagination.js.map +1 -1
  59. package/dist/esm/components/Slider/Slider.js +299 -0
  60. package/dist/esm/components/Slider/Slider.js.map +1 -0
  61. package/dist/esm/components/Slider/Slider.styles.js +330 -0
  62. package/dist/esm/components/Slider/Slider.styles.js.map +1 -0
  63. package/dist/esm/components/Slider/SliderInput/SliderInput.js +64 -0
  64. package/dist/esm/components/Slider/SliderInput/SliderInput.js.map +1 -0
  65. package/dist/esm/components/Slider/SliderInput/SliderInput.styles.js +53 -0
  66. package/dist/esm/components/Slider/SliderInput/SliderInput.styles.js.map +1 -0
  67. package/dist/esm/components/Slider/SliderInput/sliderInputClasses.js +8 -0
  68. package/dist/esm/components/Slider/SliderInput/sliderInputClasses.js.map +1 -0
  69. package/dist/esm/components/Slider/base.js +251 -0
  70. package/dist/esm/components/Slider/base.js.map +1 -0
  71. package/dist/esm/components/Slider/sliderClasses.js +8 -0
  72. package/dist/esm/components/Slider/sliderClasses.js.map +1 -0
  73. package/dist/esm/components/Slider/utils.js +217 -0
  74. package/dist/esm/components/Slider/utils.js.map +1 -0
  75. package/dist/esm/components/Table/TableBody/tableBodyClasses.js.map +1 -1
  76. package/dist/esm/components/Table/TableCell/tableCellClasses.js.map +1 -1
  77. package/dist/esm/components/Table/TableContainer/tableContainerClasses.js.map +1 -1
  78. package/dist/esm/components/Table/TableHead/tableHeadClasses.js.map +1 -1
  79. package/dist/esm/components/Table/TableHeader/tableHeaderClasses.js.map +1 -1
  80. package/dist/esm/components/Table/TableRow/tableRowClasses.js.map +1 -1
  81. package/dist/esm/components/Table/tableClasses.js.map +1 -1
  82. package/dist/esm/components/VerticalNavigation/Navigation/Navigation.js +77 -19
  83. package/dist/esm/components/VerticalNavigation/Navigation/Navigation.js.map +1 -1
  84. package/dist/esm/components/VerticalNavigation/Navigation/Navigation.styles.js +4 -1
  85. package/dist/esm/components/VerticalNavigation/Navigation/Navigation.styles.js.map +1 -1
  86. package/dist/esm/components/VerticalNavigation/Navigation/navigationClasses.js +1 -1
  87. package/dist/esm/components/VerticalNavigation/Navigation/navigationClasses.js.map +1 -1
  88. package/dist/esm/components/VerticalNavigation/NavigationPopup/NavigationPopup.js +56 -0
  89. package/dist/esm/components/VerticalNavigation/NavigationPopup/NavigationPopup.js.map +1 -0
  90. package/dist/esm/components/VerticalNavigation/NavigationPopup/NavigationPopup.styles.js +14 -0
  91. package/dist/esm/components/VerticalNavigation/NavigationPopup/NavigationPopup.styles.js.map +1 -0
  92. package/dist/esm/components/VerticalNavigation/TreeView/IconWrapper/IconWrapper.js +41 -0
  93. package/dist/esm/components/VerticalNavigation/TreeView/IconWrapper/IconWrapper.js.map +1 -0
  94. package/dist/esm/components/VerticalNavigation/TreeView/IconWrapper/IconWrapper.styles.js +40 -0
  95. package/dist/esm/components/VerticalNavigation/TreeView/IconWrapper/IconWrapper.styles.js.map +1 -0
  96. package/dist/esm/components/VerticalNavigation/TreeView/TooltipWrapper/TooltipWrapper.js +24 -0
  97. package/dist/esm/components/VerticalNavigation/TreeView/TooltipWrapper/TooltipWrapper.js.map +1 -0
  98. package/dist/esm/components/VerticalNavigation/TreeView/TreeViewItem.js +42 -44
  99. package/dist/esm/components/VerticalNavigation/TreeView/TreeViewItem.js.map +1 -1
  100. package/dist/esm/components/VerticalNavigation/VerticalNavigation.js +6 -2
  101. package/dist/esm/components/VerticalNavigation/VerticalNavigation.js.map +1 -1
  102. package/dist/esm/components/VerticalNavigation/VerticalNavigation.styles.js +6 -4
  103. package/dist/esm/components/VerticalNavigation/VerticalNavigation.styles.js.map +1 -1
  104. package/dist/esm/components/VerticalNavigation/VerticalNavigationContext.js.map +1 -1
  105. package/dist/esm/components/VerticalNavigation/utils/VerticalNavigation.utils.js +7 -0
  106. package/dist/esm/components/VerticalNavigation/utils/VerticalNavigation.utils.js.map +1 -0
  107. package/dist/esm/index.js +22 -18
  108. package/dist/esm/index.js.map +1 -1
  109. package/dist/types/index.d.ts +201 -14
  110. package/package.json +7 -5
@@ -5,11 +5,11 @@ import treeViewItemClasses from "./treeViewItemClasses.js";
5
5
  import { StyledContent, StyledGroup, StyledNode } from "./TreeViewItem.styles.js";
6
6
  import { useDescendant, DescendantProvider } from "./descendants.js";
7
7
  import { TreeViewControlContext, TreeViewStateContext } from "./TreeViewContext.js";
8
- import { VerticalNavigationContext } from "../VerticalNavigationContext.js";
9
8
  import { jsxs, jsx } from "@emotion/react/jsx-runtime";
10
9
  import useForkRef from "../../../hooks/useForkRef.js";
10
+ import { IconWrapper } from "./IconWrapper/IconWrapper.js";
11
+ import { VerticalNavigationContext } from "../VerticalNavigationContext.js";
11
12
  import { setId } from "../../../utils/setId.js";
12
- import { HvAvatar } from "../../Avatar/Avatar.js";
13
13
  const preventSelection = (event, disabled) => {
14
14
  if (event.shiftKey || event.ctrlKey || event.metaKey || disabled) {
15
15
  event.preventDefault();
@@ -33,6 +33,7 @@ const HvVerticalNavigationTreeViewItem = forwardRef((props, ref) => {
33
33
  onMouseDown,
34
34
  onFocus,
35
35
  children,
36
+ disableTooltip,
36
37
  ...others
37
38
  } = props;
38
39
  const treeViewControlContext = useContext(TreeViewControlContext);
@@ -86,7 +87,7 @@ const HvVerticalNavigationTreeViewItem = forwardRef((props, ref) => {
86
87
  const focused = isFocused ? isFocused(nodeId) : false;
87
88
  const selected = isSelected ? isSelected(nodeId) : false;
88
89
  const disabled = isDisabled ? isDisabled(nodeId) : false;
89
- const selectable = selectableProp != null ? selectableProp : !collapsible || !expandable;
90
+ const selectable = selectableProp != null ? selectableProp : !collapsible || !expandable || !isOpen;
90
91
  useEffect(() => {
91
92
  if (registerNode && unregisterNode && index !== -1) {
92
93
  registerNode({
@@ -139,7 +140,7 @@ const HvVerticalNavigationTreeViewItem = forwardRef((props, ref) => {
139
140
  focus(event, nodeId);
140
141
  }
141
142
  const multiple = multiSelect && (event.shiftKey || event.ctrlKey || event.metaKey);
142
- if (expandable && !(multiple && isExpanded && isExpanded(nodeId))) {
143
+ if (expandable && isOpen && !(multiple && isExpanded && isExpanded(nodeId))) {
143
144
  if (toggleExpansion)
144
145
  toggleExpansion(event, nodeId);
145
146
  }
@@ -177,7 +178,7 @@ const HvVerticalNavigationTreeViewItem = forwardRef((props, ref) => {
177
178
  }, [disabled, onMouseDown]);
178
179
  const handleClick = useCallback((event) => {
179
180
  if (!disabled) {
180
- if (expandable) {
181
+ if (expandable && isOpen) {
181
182
  handleExpansion(event);
182
183
  }
183
184
  if (selectable) {
@@ -198,7 +199,7 @@ const HvVerticalNavigationTreeViewItem = forwardRef((props, ref) => {
198
199
  }
199
200
  if (contentRef.current === event.currentTarget) {
200
201
  if (key === "Enter" || key === " ") {
201
- if (expandable) {
202
+ if (expandable && isOpen) {
202
203
  isEventHandled = handleExpansion(event);
203
204
  }
204
205
  if (selectable) {
@@ -211,44 +212,41 @@ const HvVerticalNavigationTreeViewItem = forwardRef((props, ref) => {
211
212
  }
212
213
  }
213
214
  }, [expandable, handleExpansion, handleSelection, selectable]);
214
- const renderedContent = useMemo(() => {
215
- var _a2, _b;
216
- return /* @__PURE__ */ jsxs(StyledContent, {
217
- id: setId(id, "button"),
218
- component: href ? "a" : "div",
219
- href,
220
- target,
221
- ref: contentRef,
222
- className: clsx(treeViewItemClasses.content, classes == null ? void 0 : classes.content, href != null && clsx(treeViewItemClasses.link, classes == null ? void 0 : classes.link), !isOpen && clsx(treeViewItemClasses.minimized, classes == null ? void 0 : classes.minimized)),
223
- variant: disabled ? "placeholderText" : "body",
224
- onClick: handleClick,
225
- onMouseDown: handleMouseDown,
226
- style: {
227
- paddingLeft: (expandable || icon != null ? 0 : 10) + level * (collapsible ? 32 : 10)
228
- },
229
- ...treeviewMode ? {
230
- role: "button",
231
- tabIndex: -1,
232
- onFocus: handleFocus
233
- } : {
234
- role: "button",
235
- tabIndex: selectable || expandable ? 0 : -1,
236
- onKeyDown: handleKeyDown,
237
- "aria-current": selectable && selected ? "page" : void 0,
238
- "aria-expanded": expandable ? expanded : void 0,
239
- "aria-controls": expandable ? setId(id, "group") : void 0
240
- },
241
- children: [isOpen && expandable && (expanded ? /* @__PURE__ */ jsx(DropUpXS, {}) : /* @__PURE__ */ jsx(DropDownXS, {})), !icon && level === 0 && !isOpen && collapsedMode === "icon" && ((_a2 = contentRef.current) == null ? void 0 : _a2.textContent) ? /* @__PURE__ */ jsx(HvAvatar, {
242
- variant: "square",
243
- size: "xs",
244
- backgroundColor: "secondary_80",
245
- style: {
246
- fontSize: "15px"
247
- },
248
- children: (_b = contentRef.current) == null ? void 0 : _b.textContent.substring(0, 1)
249
- }) : icon, isOpen && label]
250
- });
251
- }, [id, href, target, classes == null ? void 0 : classes.content, treeViewItemClasses.content, classes == null ? void 0 : classes.link, treeViewItemClasses.link, classes == null ? void 0 : classes.minimized, treeViewItemClasses.minimized, disabled, handleClick, handleMouseDown, expandable, icon, level, collapsible, treeviewMode, handleFocus, selectable, handleKeyDown, selected, expanded, label]);
215
+ const renderedContent = useMemo(() => /* @__PURE__ */ jsxs(StyledContent, {
216
+ id: setId(id, "button"),
217
+ component: href ? "a" : "div",
218
+ href,
219
+ target,
220
+ ref: contentRef,
221
+ className: clsx(treeViewItemClasses.content, classes == null ? void 0 : classes.content, href != null && clsx(treeViewItemClasses.link, classes == null ? void 0 : classes.link), !isOpen && clsx(treeViewItemClasses.minimized, classes == null ? void 0 : classes.minimized)),
222
+ variant: disabled ? "placeholderText" : "body",
223
+ onClick: handleClick,
224
+ onMouseDown: handleMouseDown,
225
+ style: {
226
+ paddingLeft: (expandable || icon != null ? 0 : 10) + level * (collapsible ? 32 : 10)
227
+ },
228
+ ...treeviewMode ? {
229
+ role: "button",
230
+ tabIndex: -1,
231
+ onFocus: handleFocus
232
+ } : {
233
+ role: "button",
234
+ tabIndex: selectable || expandable ? 0 : -1,
235
+ onKeyDown: handleKeyDown,
236
+ "aria-current": selectable && selected ? "page" : void 0,
237
+ "aria-expanded": expandable ? expanded : void 0,
238
+ "aria-controls": expandable ? setId(id, "group") : void 0,
239
+ "aria-label": payload == null ? void 0 : payload.label
240
+ },
241
+ children: [isOpen && expandable && (expanded ? /* @__PURE__ */ jsx(DropUpXS, {}) : /* @__PURE__ */ jsx(DropDownXS, {})), /* @__PURE__ */ jsx(IconWrapper, {
242
+ icon,
243
+ label: payload == null ? void 0 : payload.label,
244
+ hasChildren: Boolean(children),
245
+ showAvatar: !icon && level === 0 && !isOpen && collapsedMode === "icon",
246
+ isOpen,
247
+ disableTooltip
248
+ }), isOpen && label]
249
+ }), [id, href, target, classes == null ? void 0 : classes.content, treeViewItemClasses.content, classes == null ? void 0 : classes.link, treeViewItemClasses.link, classes == null ? void 0 : classes.minimized, treeViewItemClasses.minimized, disabled, handleClick, handleMouseDown, expandable, icon, level, collapsible, treeviewMode, handleFocus, selectable, handleKeyDown, selected, expanded, label, disableTooltip]);
252
250
  const renderedChildren = useMemo(() => children && /* @__PURE__ */ jsx(StyledGroup, {
253
251
  id: setId(id, "group"),
254
252
  className: clsx(treeViewItemClasses.group, classes == null ? void 0 : classes.group),
@@ -1 +1 @@
1
- {"version":3,"file":"TreeViewItem.js","sources":["../../../../../src/components/VerticalNavigation/TreeView/TreeViewItem.tsx"],"sourcesContent":["import {\n forwardRef,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport clsx from \"clsx\";\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\nimport { useForkRef } from \"~/hooks\";\nimport { setId } from \"~/utils\";\nimport treeViewItemClasses, {\n HvVerticalNavigationTreeViewItemClasses,\n} from \"./treeViewItemClasses\";\nimport { StyledContent, StyledGroup, StyledNode } from \"./TreeViewItem.styles\";\nimport { DescendantProvider, useDescendant } from \"./descendants\";\nimport {\n TreeViewControlContext,\n TreeViewStateContext,\n} from \"./TreeViewContext\";\nimport { HvAvatar } from \"~/components\";\nimport { VerticalNavigationContext } from \"../VerticalNavigationContext\";\n\nexport type HvVerticalNavigationTreeViewItemProps = {\n /**\n * Id to be applied to the root node.\n */\n id?: string;\n /**\n * Class names to be applied.\n */\n className?: string;\n /**\n * A Jss Object used to override or extend the styles applied to the Radio button.\n */\n classes?: HvVerticalNavigationTreeViewItemClasses;\n /**\n * Is the node disabled.\n */\n disabled?: boolean;\n /**\n * Can the node be selected.\n */\n selectable?: boolean;\n /**\n * The id of the node.\n */\n nodeId?: string;\n /**\n * The icon to display next to the node's label.\n */\n icon?: React.ReactNode;\n /**\n * The item label.\n */\n label?: React.ReactNode;\n /**\n * The url for the link.\n */\n href?: string;\n /**\n * The behavior when opening a link.\n */\n target?: string;\n /**\n * The node payload.\n */\n payload?: any;\n /**\n * @ignore\n */\n onClick?: any;\n /**\n * @ignore\n */\n onMouseDown?: any;\n /**\n * @ignore\n */\n onFocus?: any;\n /**\n * The content of the component.\n */\n children?: React.ReactNode;\n};\n\nconst preventSelection = (event, disabled) => {\n if (event.shiftKey || event.ctrlKey || event.metaKey || disabled) {\n // Prevent text selection\n event.preventDefault();\n }\n};\n\nexport const HvVerticalNavigationTreeViewItem = forwardRef(\n (props: HvVerticalNavigationTreeViewItemProps, ref) => {\n const {\n id: idProp,\n className,\n classes,\n\n disabled: disabledProp = false,\n\n selectable: selectableProp,\n\n nodeId,\n icon = null,\n label,\n href,\n target,\n payload,\n\n onClick,\n onMouseDown,\n onFocus,\n\n children,\n\n ...others\n } = props;\n\n const treeViewControlContext = useContext(TreeViewControlContext);\n const { isExpanded, isSelected, isFocused, isDisabled, isChildSelected } =\n useContext(TreeViewStateContext);\n\n const {\n treeId,\n mode,\n collapsible,\n toggleExpansion,\n multiSelect,\n selectNode,\n selectRange,\n disabledItemsFocusable,\n registerNode,\n unregisterNode,\n mapFirstChar,\n unMapFirstChar,\n focus,\n } = treeViewControlContext;\n\n const treeviewMode = mode === \"treeview\";\n\n let id: string | null = null;\n\n if (idProp != null) {\n id = idProp;\n } else if (treeId && nodeId) {\n id = `${treeId}-${nodeId}`;\n }\n\n const [treeitemElement, setTreeitemElement] = useState(null);\n const contentRef = useRef<HTMLDivElement>(null);\n const handleRef = useForkRef(setTreeitemElement, ref);\n\n const descendant = useMemo(\n () => ({\n element: treeitemElement,\n id: nodeId,\n }),\n [nodeId, treeitemElement]\n );\n\n const { isOpen, collapsedMode } = useContext(VerticalNavigationContext);\n\n const { index, parentId, level } = useDescendant(descendant);\n\n const expandable = collapsible && Array.isArray(children);\n const expanded = isExpanded ? isExpanded(nodeId) : false;\n const focused = isFocused ? isFocused(nodeId) : false;\n const selected = isSelected ? isSelected(nodeId) : false;\n const disabled = isDisabled ? isDisabled(nodeId) : false;\n\n const selectable =\n selectableProp != null ? selectableProp : !collapsible || !expandable;\n\n useEffect(() => {\n // On the first render a node's index will be -1. We want to wait for the real index.\n if (registerNode && unregisterNode && index !== -1) {\n registerNode({\n id: nodeId,\n idAttribute: id,\n index,\n parentId,\n selectable,\n expandable,\n disabled: disabledProp,\n onFocus,\n payload,\n });\n\n return () => {\n unregisterNode(nodeId);\n };\n }\n\n return undefined;\n }, [\n registerNode,\n unregisterNode,\n parentId,\n index,\n nodeId,\n expandable,\n disabledProp,\n id,\n selectable,\n onFocus,\n payload,\n ]);\n\n useEffect(() => {\n if (\n mapFirstChar &&\n unMapFirstChar &&\n label &&\n contentRef.current?.textContent\n ) {\n mapFirstChar(\n nodeId,\n contentRef.current?.textContent.substring(0, 1).toLowerCase()\n );\n\n return () => {\n unMapFirstChar(nodeId);\n };\n }\n return undefined;\n }, [mapFirstChar, unMapFirstChar, nodeId, label]);\n\n let ariaSelected;\n if (multiSelect) {\n ariaSelected = selected;\n } else if (selected) {\n /* single-selection trees unset aria-selected on un-selected items.\n *\n * If the tree does not support multiple selection, aria-selected\n * is set to true for the selected node and it is not present on any other node in the tree.\n * Source: https://www.w3.org/TR/wai-aria-practices/#TreeView\n */\n ariaSelected = true;\n }\n\n const handleFocus = useCallback(\n (event) => {\n // DOM focus stays on the tree which manages focus with aria-activedescendant\n if (event.target === event.currentTarget) {\n (event.target.ownerDocument || document)\n .getElementById(treeId)\n .focus({ preventScroll: true });\n }\n\n const unfocusable = !disabledItemsFocusable && disabled;\n if (\n !focused &&\n event.currentTarget === event.target &&\n !unfocusable &&\n focus\n ) {\n focus(event, nodeId);\n }\n },\n [disabled, disabledItemsFocusable, focus, focused, nodeId, treeId]\n );\n\n const handleExpansion = useCallback(\n (event) => {\n if (!disabled) {\n if (treeviewMode && !focused && focus) {\n focus(event, nodeId);\n }\n\n const multiple =\n multiSelect && (event.shiftKey || event.ctrlKey || event.metaKey);\n\n // If already expanded and trying to toggle selection don't close\n if (expandable && !(multiple && isExpanded && isExpanded(nodeId))) {\n if (toggleExpansion) toggleExpansion(event, nodeId);\n }\n }\n },\n [\n disabled,\n expandable,\n focus,\n focused,\n isExpanded,\n multiSelect,\n nodeId,\n toggleExpansion,\n treeviewMode,\n ]\n );\n\n const handleSelection = useCallback(\n (event) => {\n if (selectable && !disabled) {\n if (treeviewMode && !focused && focus) {\n focus(event, nodeId);\n }\n\n const multiple =\n multiSelect && (event.shiftKey || event.ctrlKey || event.metaKey);\n\n if (multiple) {\n if (event.shiftKey) {\n if (selectRange) return selectRange(event, { end: nodeId });\n } else {\n if (selectNode) return selectNode(event, nodeId, true);\n }\n } else {\n if (selectNode) return selectNode(event, nodeId);\n }\n } else {\n return false;\n }\n },\n [\n disabled,\n focus,\n focused,\n multiSelect,\n nodeId,\n selectNode,\n selectRange,\n selectable,\n treeviewMode,\n ]\n );\n\n const handleMouseDown = useCallback(\n (event) => {\n preventSelection(event, disabled);\n\n if (onMouseDown) {\n onMouseDown(event);\n }\n },\n [disabled, onMouseDown]\n );\n\n const handleClick = useCallback(\n (event) => {\n if (!disabled) {\n if (expandable) {\n handleExpansion(event);\n }\n\n if (selectable) {\n handleSelection(event);\n }\n }\n\n if (onClick) {\n onClick(event);\n }\n },\n [\n disabled,\n expandable,\n handleExpansion,\n handleSelection,\n onClick,\n selectable,\n ]\n );\n\n const handleKeyDown = useCallback(\n (event) => {\n let isEventHandled = false;\n const { key } = event;\n\n if (\n event.altKey ||\n event.ctrlKey ||\n event.metaKey ||\n event.currentTarget !== event.target\n ) {\n return;\n }\n if (contentRef.current === event.currentTarget) {\n if (key === \"Enter\" || key === \" \") {\n if (expandable) {\n isEventHandled = handleExpansion(event) as unknown as boolean;\n }\n\n if (selectable) {\n isEventHandled = handleSelection(event) as boolean;\n }\n }\n\n if (isEventHandled) {\n event.preventDefault();\n event.stopPropagation();\n }\n }\n },\n [expandable, handleExpansion, handleSelection, selectable]\n );\n\n const renderedContent = useMemo(\n () => (\n <StyledContent\n id={setId(id, \"button\")}\n component={href ? \"a\" : \"div\"}\n href={href}\n target={target}\n ref={contentRef}\n className={clsx(\n treeViewItemClasses.content,\n classes?.content,\n href != null && clsx(treeViewItemClasses.link, classes?.link),\n !isOpen && clsx(treeViewItemClasses.minimized, classes?.minimized)\n )}\n variant={disabled ? \"placeholderText\" : \"body\"}\n onClick={handleClick}\n onMouseDown={handleMouseDown}\n style={{\n paddingLeft:\n (expandable || icon != null ? 0 : 10) +\n level * (collapsible ? 32 : 10),\n }}\n {...(treeviewMode\n ? {\n role: \"button\",\n tabIndex: -1,\n onFocus: handleFocus,\n }\n : {\n role: \"button\",\n tabIndex: selectable || expandable ? 0 : -1,\n onKeyDown: handleKeyDown,\n \"aria-current\": selectable && selected ? \"page\" : undefined,\n \"aria-expanded\": expandable ? expanded : undefined,\n \"aria-controls\": expandable ? setId(id, \"group\") : undefined,\n })}\n >\n {isOpen && expandable && (expanded ? <DropUpXS /> : <DropDownXS />)}\n {!icon &&\n level === 0 &&\n !isOpen &&\n collapsedMode === \"icon\" &&\n contentRef.current?.textContent ? (\n <HvAvatar\n variant=\"square\"\n size=\"xs\"\n backgroundColor=\"secondary_80\"\n style={{ fontSize: \"15px\" }}\n >\n {contentRef.current?.textContent.substring(0, 1)}\n </HvAvatar>\n ) : (\n icon\n )}\n {isOpen && label}\n </StyledContent>\n ),\n [\n id,\n href,\n target,\n classes?.content,\n treeViewItemClasses.content,\n classes?.link,\n treeViewItemClasses.link,\n classes?.minimized,\n treeViewItemClasses.minimized,\n disabled,\n handleClick,\n handleMouseDown,\n expandable,\n icon,\n level,\n collapsible,\n treeviewMode,\n handleFocus,\n selectable,\n handleKeyDown,\n selected,\n expanded,\n label,\n ]\n );\n\n const renderedChildren = useMemo(\n () =>\n children && (\n <StyledGroup\n id={setId(id, \"group\")}\n className={clsx(treeViewItemClasses.group, classes?.group)}\n role={treeviewMode ? \"group\" : undefined}\n >\n {children}\n </StyledGroup>\n ),\n [children, treeViewItemClasses.group, classes?.group, id, treeviewMode]\n );\n\n return (\n <StyledNode\n ref={handleRef}\n id={id ?? undefined}\n className={clsx(\n treeViewItemClasses?.node,\n classes?.node,\n className,\n disabled && clsx(treeViewItemClasses.disabled, classes?.disabled),\n expandable &&\n clsx(treeViewItemClasses.expandable, classes?.expandable),\n expandable &&\n !expanded &&\n clsx(treeViewItemClasses.collapsed, classes?.collapsed),\n expandable &&\n expanded &&\n clsx(treeViewItemClasses.expanded, classes?.expanded),\n selectable &&\n !disabled &&\n clsx(treeViewItemClasses.selectable, classes?.selectable),\n !disabled &&\n !selectable &&\n clsx(treeViewItemClasses.unselectable, classes?.unselectable),\n !disabled &&\n selectable &&\n selected &&\n clsx(treeViewItemClasses.selected, classes?.selected),\n !disabled &&\n selectable &&\n !selected &&\n clsx(treeViewItemClasses.unselected, classes?.unselected),\n focused && clsx(treeViewItemClasses.focused, classes?.focused),\n !isOpen &&\n collapsedMode == \"simple\" &&\n clsx(treeViewItemClasses.hide, classes?.hide),\n !isOpen &&\n collapsedMode == \"icon\" &&\n isChildSelected &&\n isChildSelected(nodeId) &&\n clsx(treeViewItemClasses.selected, classes?.selected)\n )}\n data-hasicon={icon != null ? true : undefined}\n {...(mode === \"treeview\" && {\n role: \"treeitem\",\n \"aria-selected\": ariaSelected,\n \"aria-expanded\": expandable ? expanded : undefined,\n \"aria-disabled\": disabled ? true : undefined,\n })}\n {...others}\n >\n {renderedContent}\n {isOpen && (\n <DescendantProvider id={nodeId} level={level + 1}>\n {renderedChildren}\n </DescendantProvider>\n )}\n </StyledNode>\n );\n }\n);\n"],"names":["preventSelection","event","disabled","shiftKey","ctrlKey","metaKey","preventDefault","HvVerticalNavigationTreeViewItem","forwardRef","props","ref","id","idProp","className","classes","disabledProp","selectable","selectableProp","nodeId","icon","label","href","target","payload","onClick","onMouseDown","onFocus","children","others","treeViewControlContext","useContext","TreeViewControlContext","isExpanded","isSelected","isFocused","isDisabled","isChildSelected","TreeViewStateContext","treeId","mode","collapsible","toggleExpansion","multiSelect","selectNode","selectRange","disabledItemsFocusable","registerNode","unregisterNode","mapFirstChar","unMapFirstChar","focus","treeviewMode","treeitemElement","setTreeitemElement","useState","contentRef","useRef","handleRef","useForkRef","descendant","useMemo","element","isOpen","collapsedMode","VerticalNavigationContext","index","parentId","level","useDescendant","expandable","Array","isArray","expanded","focused","selected","useEffect","idAttribute","undefined","current","textContent","substring","toLowerCase","ariaSelected","handleFocus","useCallback","currentTarget","ownerDocument","document","getElementById","preventScroll","unfocusable","handleExpansion","multiple","handleSelection","end","handleMouseDown","handleClick","handleKeyDown","isEventHandled","key","altKey","stopPropagation","renderedContent","_jsxs","StyledContent","setId","component","clsx","treeViewItemClasses","content","link","minimized","variant","style","paddingLeft","role","tabIndex","onKeyDown","DropUpXS","_jsx","DropDownXS","HvAvatar","size","backgroundColor","fontSize","renderedChildren","StyledGroup","group","StyledNode","node","collapsed","unselectable","unselected","hide","DescendantProvider"],"mappings":"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"}
1
+ {"version":3,"file":"TreeViewItem.js","sources":["../../../../../src/components/VerticalNavigation/TreeView/TreeViewItem.tsx"],"sourcesContent":["import {\n forwardRef,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport clsx from \"clsx\";\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\nimport { useForkRef } from \"~/hooks\";\nimport { setId } from \"~/utils\";\nimport treeViewItemClasses, {\n HvVerticalNavigationTreeViewItemClasses,\n} from \"./treeViewItemClasses\";\nimport { StyledContent, StyledGroup, StyledNode } from \"./TreeViewItem.styles\";\nimport { DescendantProvider, useDescendant } from \"./descendants\";\nimport {\n TreeViewControlContext,\n TreeViewStateContext,\n} from \"./TreeViewContext\";\nimport { VerticalNavigationContext } from \"../\";\nimport { IconWrapper } from \"./IconWrapper\";\n\nexport type HvVerticalNavigationTreeViewItemProps = {\n /**\n * Id to be applied to the root node.\n */\n id?: string;\n /**\n * Class names to be applied.\n */\n className?: string;\n /**\n * A Jss Object used to override or extend the styles applied to the Radio button.\n */\n classes?: HvVerticalNavigationTreeViewItemClasses;\n /**\n * Is the node disabled.\n */\n disabled?: boolean;\n /**\n * Can the node be selected.\n */\n selectable?: boolean;\n /**\n * The id of the node.\n */\n nodeId?: string;\n /**\n * The icon to display next to the node's label.\n */\n icon?: React.ReactNode;\n /**\n * The item label.\n */\n label?: React.ReactNode;\n /**\n * The url for the link.\n */\n href?: string;\n /**\n * The behavior when opening a link.\n */\n target?: string;\n /**\n * The node payload.\n */\n payload?: any;\n /**\n * @ignore\n */\n onClick?: any;\n /**\n * @ignore\n */\n onMouseDown?: any;\n /**\n * @ignore\n */\n onFocus?: any;\n /**\n * The content of the component.\n */\n children?: React.ReactNode;\n /**\n * @ignore\n */\n onMouseEnter?: any;\n /**\n * Disables the appearence of a tooltip on hovering an element ( Only applicable when the in collapsed mode)\n */\n disableTooltip?: boolean;\n};\n\nconst preventSelection = (event, disabled) => {\n if (event.shiftKey || event.ctrlKey || event.metaKey || disabled) {\n // Prevent text selection\n event.preventDefault();\n }\n};\n\nexport const HvVerticalNavigationTreeViewItem = forwardRef(\n (props: HvVerticalNavigationTreeViewItemProps, ref) => {\n const {\n id: idProp,\n className,\n classes,\n\n disabled: disabledProp = false,\n\n selectable: selectableProp,\n\n nodeId,\n icon = null,\n label,\n href,\n target,\n payload,\n\n onClick,\n onMouseDown,\n onFocus,\n\n children,\n\n disableTooltip,\n\n ...others\n } = props;\n\n const treeViewControlContext = useContext(TreeViewControlContext);\n const { isExpanded, isSelected, isFocused, isDisabled, isChildSelected } =\n useContext(TreeViewStateContext);\n\n const {\n treeId,\n mode,\n collapsible,\n toggleExpansion,\n multiSelect,\n selectNode,\n selectRange,\n disabledItemsFocusable,\n registerNode,\n unregisterNode,\n mapFirstChar,\n unMapFirstChar,\n focus,\n } = treeViewControlContext;\n\n const treeviewMode = mode === \"treeview\";\n\n let id: string | null = null;\n\n if (idProp != null) {\n id = idProp;\n } else if (treeId && nodeId) {\n id = `${treeId}-${nodeId}`;\n }\n\n const [treeitemElement, setTreeitemElement] = useState(null);\n const contentRef = useRef<HTMLDivElement>(null);\n const handleRef = useForkRef(setTreeitemElement, ref);\n\n const descendant = useMemo(\n () => ({\n element: treeitemElement,\n id: nodeId,\n }),\n [nodeId, treeitemElement]\n );\n\n const { isOpen, collapsedMode } = useContext(VerticalNavigationContext);\n\n const { index, parentId, level } = useDescendant(descendant);\n\n const expandable = collapsible && Array.isArray(children);\n const expanded = isExpanded ? isExpanded(nodeId) : false;\n const focused = isFocused ? isFocused(nodeId) : false;\n const selected = isSelected ? isSelected(nodeId) : false;\n const disabled = isDisabled ? isDisabled(nodeId) : false;\n\n const selectable =\n selectableProp != null\n ? selectableProp\n : !collapsible || !expandable || !isOpen;\n\n useEffect(() => {\n // On the first render a node's index will be -1. We want to wait for the real index.\n if (registerNode && unregisterNode && index !== -1) {\n registerNode({\n id: nodeId,\n idAttribute: id,\n index,\n parentId,\n selectable,\n expandable,\n disabled: disabledProp,\n onFocus,\n payload,\n });\n\n return () => {\n unregisterNode(nodeId);\n };\n }\n\n return undefined;\n }, [\n registerNode,\n unregisterNode,\n parentId,\n index,\n nodeId,\n expandable,\n disabledProp,\n id,\n selectable,\n onFocus,\n payload,\n ]);\n\n useEffect(() => {\n if (\n mapFirstChar &&\n unMapFirstChar &&\n label &&\n contentRef.current?.textContent\n ) {\n mapFirstChar(\n nodeId,\n contentRef.current?.textContent.substring(0, 1).toLowerCase()\n );\n\n return () => {\n unMapFirstChar(nodeId);\n };\n }\n return undefined;\n }, [mapFirstChar, unMapFirstChar, nodeId, label]);\n\n let ariaSelected;\n if (multiSelect) {\n ariaSelected = selected;\n } else if (selected) {\n /* single-selection trees unset aria-selected on un-selected items.\n *\n * If the tree does not support multiple selection, aria-selected\n * is set to true for the selected node and it is not present on any other node in the tree.\n * Source: https://www.w3.org/TR/wai-aria-practices/#TreeView\n */\n ariaSelected = true;\n }\n\n const handleFocus = useCallback(\n (event) => {\n // DOM focus stays on the tree which manages focus with aria-activedescendant\n if (event.target === event.currentTarget) {\n (event.target.ownerDocument || document)\n .getElementById(treeId)\n .focus({ preventScroll: true });\n }\n\n const unfocusable = !disabledItemsFocusable && disabled;\n if (\n !focused &&\n event.currentTarget === event.target &&\n !unfocusable &&\n focus\n ) {\n focus(event, nodeId);\n }\n },\n [disabled, disabledItemsFocusable, focus, focused, nodeId, treeId]\n );\n\n const handleExpansion = useCallback(\n (event) => {\n if (!disabled) {\n if (treeviewMode && !focused && focus) {\n focus(event, nodeId);\n }\n\n const multiple =\n multiSelect && (event.shiftKey || event.ctrlKey || event.metaKey);\n\n // If already expanded and trying to toggle selection don't close\n if (\n expandable &&\n isOpen &&\n !(multiple && isExpanded && isExpanded(nodeId))\n ) {\n if (toggleExpansion) toggleExpansion(event, nodeId);\n }\n }\n },\n [\n disabled,\n expandable,\n focus,\n focused,\n isExpanded,\n multiSelect,\n nodeId,\n toggleExpansion,\n treeviewMode,\n ]\n );\n\n const handleSelection = useCallback(\n (event) => {\n if (selectable && !disabled) {\n if (treeviewMode && !focused && focus) {\n focus(event, nodeId);\n }\n\n const multiple =\n multiSelect && (event.shiftKey || event.ctrlKey || event.metaKey);\n\n if (multiple) {\n if (event.shiftKey) {\n if (selectRange) return selectRange(event, { end: nodeId });\n } else {\n if (selectNode) return selectNode(event, nodeId, true);\n }\n } else {\n if (selectNode) return selectNode(event, nodeId);\n }\n } else {\n return false;\n }\n },\n [\n disabled,\n focus,\n focused,\n multiSelect,\n nodeId,\n selectNode,\n selectRange,\n selectable,\n treeviewMode,\n ]\n );\n\n const handleMouseDown = useCallback(\n (event) => {\n preventSelection(event, disabled);\n\n if (onMouseDown) {\n onMouseDown(event);\n }\n },\n [disabled, onMouseDown]\n );\n\n const handleClick = useCallback(\n (event) => {\n if (!disabled) {\n if (expandable && isOpen) {\n handleExpansion(event);\n }\n\n if (selectable) {\n handleSelection(event);\n }\n }\n\n if (onClick) {\n onClick(event);\n }\n },\n [\n disabled,\n expandable,\n handleExpansion,\n handleSelection,\n onClick,\n selectable,\n ]\n );\n\n const handleKeyDown = useCallback(\n (event) => {\n let isEventHandled = false;\n const { key } = event;\n\n if (\n event.altKey ||\n event.ctrlKey ||\n event.metaKey ||\n event.currentTarget !== event.target\n ) {\n return;\n }\n if (contentRef.current === event.currentTarget) {\n if (key === \"Enter\" || key === \" \") {\n if (expandable && isOpen) {\n isEventHandled = handleExpansion(event) as unknown as boolean;\n }\n\n if (selectable) {\n isEventHandled = handleSelection(event) as boolean;\n }\n }\n\n if (isEventHandled) {\n event.preventDefault();\n event.stopPropagation();\n }\n }\n },\n [expandable, handleExpansion, handleSelection, selectable]\n );\n\n const renderedContent = useMemo(\n () => (\n <StyledContent\n id={setId(id, \"button\")}\n component={href ? \"a\" : \"div\"}\n href={href}\n target={target}\n ref={contentRef}\n className={clsx(\n treeViewItemClasses.content,\n classes?.content,\n href != null && clsx(treeViewItemClasses.link, classes?.link),\n !isOpen && clsx(treeViewItemClasses.minimized, classes?.minimized)\n )}\n variant={disabled ? \"placeholderText\" : \"body\"}\n onClick={handleClick}\n onMouseDown={handleMouseDown}\n style={{\n paddingLeft:\n (expandable || icon != null ? 0 : 10) +\n level * (collapsible ? 32 : 10),\n }}\n {...(treeviewMode\n ? {\n role: \"button\",\n tabIndex: -1,\n onFocus: handleFocus,\n }\n : {\n role: \"button\",\n tabIndex: selectable || expandable ? 0 : -1,\n onKeyDown: handleKeyDown,\n \"aria-current\": selectable && selected ? \"page\" : undefined,\n \"aria-expanded\": expandable ? expanded : undefined,\n \"aria-controls\": expandable ? setId(id, \"group\") : undefined,\n \"aria-label\": payload?.label,\n })}\n >\n {isOpen && expandable && (expanded ? <DropUpXS /> : <DropDownXS />)}\n\n <IconWrapper\n icon={icon}\n label={payload?.label}\n hasChildren={Boolean(children)}\n showAvatar={\n !icon && level === 0 && !isOpen && collapsedMode === \"icon\"\n }\n isOpen={isOpen}\n disableTooltip={disableTooltip}\n />\n\n {isOpen && label}\n </StyledContent>\n ),\n [\n id,\n href,\n target,\n classes?.content,\n treeViewItemClasses.content,\n classes?.link,\n treeViewItemClasses.link,\n classes?.minimized,\n treeViewItemClasses.minimized,\n disabled,\n handleClick,\n handleMouseDown,\n expandable,\n icon,\n level,\n collapsible,\n treeviewMode,\n handleFocus,\n selectable,\n handleKeyDown,\n selected,\n expanded,\n label,\n disableTooltip,\n ]\n );\n\n const renderedChildren = useMemo(\n () =>\n children && (\n <StyledGroup\n id={setId(id, \"group\")}\n className={clsx(treeViewItemClasses.group, classes?.group)}\n role={treeviewMode ? \"group\" : undefined}\n >\n {children}\n </StyledGroup>\n ),\n [children, treeViewItemClasses.group, classes?.group, id, treeviewMode]\n );\n\n return (\n <StyledNode\n ref={handleRef}\n id={id ?? undefined}\n className={clsx(\n treeViewItemClasses?.node,\n classes?.node,\n className,\n disabled && clsx(treeViewItemClasses.disabled, classes?.disabled),\n expandable &&\n clsx(treeViewItemClasses.expandable, classes?.expandable),\n expandable &&\n !expanded &&\n clsx(treeViewItemClasses.collapsed, classes?.collapsed),\n expandable &&\n expanded &&\n clsx(treeViewItemClasses.expanded, classes?.expanded),\n selectable &&\n !disabled &&\n clsx(treeViewItemClasses.selectable, classes?.selectable),\n !disabled &&\n !selectable &&\n clsx(treeViewItemClasses.unselectable, classes?.unselectable),\n !disabled &&\n selectable &&\n selected &&\n clsx(treeViewItemClasses.selected, classes?.selected),\n !disabled &&\n selectable &&\n !selected &&\n clsx(treeViewItemClasses.unselected, classes?.unselected),\n focused && clsx(treeViewItemClasses.focused, classes?.focused),\n !isOpen &&\n collapsedMode == \"simple\" &&\n clsx(treeViewItemClasses.hide, classes?.hide),\n !isOpen &&\n collapsedMode == \"icon\" &&\n isChildSelected &&\n isChildSelected(nodeId) &&\n clsx(treeViewItemClasses.selected, classes?.selected)\n )}\n data-hasicon={icon != null ? true : undefined}\n {...(mode === \"treeview\" && {\n role: \"treeitem\",\n \"aria-selected\": ariaSelected,\n \"aria-expanded\": expandable ? expanded : undefined,\n \"aria-disabled\": disabled ? true : undefined,\n })}\n {...others}\n >\n {renderedContent}\n {isOpen && (\n <DescendantProvider id={nodeId} level={level + 1}>\n {renderedChildren}\n </DescendantProvider>\n )}\n </StyledNode>\n );\n }\n);\n"],"names":["preventSelection","event","disabled","shiftKey","ctrlKey","metaKey","preventDefault","HvVerticalNavigationTreeViewItem","forwardRef","props","ref","id","idProp","className","classes","disabledProp","selectable","selectableProp","nodeId","icon","label","href","target","payload","onClick","onMouseDown","onFocus","children","disableTooltip","others","treeViewControlContext","useContext","TreeViewControlContext","isExpanded","isSelected","isFocused","isDisabled","isChildSelected","TreeViewStateContext","treeId","mode","collapsible","toggleExpansion","multiSelect","selectNode","selectRange","disabledItemsFocusable","registerNode","unregisterNode","mapFirstChar","unMapFirstChar","focus","treeviewMode","treeitemElement","setTreeitemElement","useState","contentRef","useRef","handleRef","useForkRef","descendant","useMemo","element","isOpen","collapsedMode","VerticalNavigationContext","index","parentId","level","useDescendant","expandable","Array","isArray","expanded","focused","selected","useEffect","idAttribute","undefined","current","textContent","substring","toLowerCase","ariaSelected","handleFocus","useCallback","currentTarget","ownerDocument","document","getElementById","preventScroll","unfocusable","handleExpansion","multiple","handleSelection","end","handleMouseDown","handleClick","handleKeyDown","isEventHandled","key","altKey","stopPropagation","renderedContent","_jsxs","StyledContent","setId","component","clsx","treeViewItemClasses","content","link","minimized","variant","style","paddingLeft","role","tabIndex","onKeyDown","DropUpXS","DropDownXS","IconWrapper","hasChildren","Boolean","showAvatar","renderedChildren","StyledGroup","group","StyledNode","node","collapsed","unselectable","unselected","hide","DescendantProvider"],"mappings":"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"}
@@ -2,6 +2,7 @@ import clsx from "clsx";
2
2
  import { useState, useMemo, useEffect } from "react";
3
3
  import { StyledRoot } from "./VerticalNavigation.styles.js";
4
4
  import verticalNavigationClasses from "./verticalNavigationClasses.js";
5
+ import { hasChildNavigationItems } from "./utils/VerticalNavigation.utils.js";
5
6
  import { jsx } from "@emotion/react/jsx-runtime";
6
7
  import { fillDataWithParentId, getParentItemById, getNavigationItemById } from "./NavigationSlider/utils/NavigationSlider.utils.js";
7
8
  import { VerticalNavigationContext } from "./VerticalNavigationContext.js";
@@ -21,6 +22,7 @@ const HvVerticalNavigation = ({
21
22
  const withParentData = useMemo(() => fillDataWithParentId(parentData), [parentData]);
22
23
  const initialParentItem = useMemo(() => getParentItemById(withParentData, parentSelected), [withParentData, parentSelected]);
23
24
  const [parentItem, setParentItem] = useState(initialParentItem);
25
+ const hasAnyChildWithData = useMemo(() => hasChildNavigationItems(parentData), [parentData]);
24
26
  useEffect(() => setHeaderTitle(parentItem == null ? void 0 : parentItem.label), [parentItem, setParentItem]);
25
27
  const navigateToParentHandler = () => {
26
28
  setParentItem(getParentItemById(withParentData, parentItem.id));
@@ -42,13 +44,15 @@ const HvVerticalNavigation = ({
42
44
  parentData,
43
45
  setParentData,
44
46
  parentSelected,
45
- setParentSelected
46
- }), [open, collapsedMode, slider, headerTitle, setHeaderTitle, parentItem, withParentData, navigateToChildHandler, navigateToParentHandler]);
47
+ setParentSelected,
48
+ hasAnyChildWithData
49
+ }), [open, collapsedMode, slider, headerTitle, setHeaderTitle, parentItem, withParentData, navigateToChildHandler, navigateToParentHandler, hasAnyChildWithData]);
47
50
  const content = /* @__PURE__ */ jsx(VerticalNavigationContext.Provider, {
48
51
  value,
49
52
  children: /* @__PURE__ */ jsx(StyledRoot, {
50
53
  id,
51
54
  className: clsx(className, verticalNavigationClasses.root, classes == null ? void 0 : classes.root, !open && verticalNavigationClasses.collapsed, slider && verticalNavigationClasses.slider, classes == null ? void 0 : classes.collapsed),
55
+ hasAnyChildWithData,
52
56
  ...others,
53
57
  children
54
58
  })
@@ -1 +1 @@
1
- {"version":3,"file":"VerticalNavigation.js","sources":["../../../../src/components/VerticalNavigation/VerticalNavigation.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useEffect, useMemo, useState } from \"react\";\nimport { StyledRoot } from \"./VerticalNavigation.styles\";\nimport verticalNavigationClasses, {\n HvVerticalNavigationClasses,\n} from \"./verticalNavigationClasses\";\nimport { NavigationData, VerticalNavigationContext } from \"./\";\nimport {\n fillDataWithParentId,\n getNavigationItemById,\n getParentItemById,\n} from \"./NavigationSlider/utils\";\n\nexport type HvVerticalNavigationProps = {\n /**\n * Id to be applied to the root node.\n */\n id?: string;\n /**\n * Class names to be applied.\n */\n className?: string;\n /**\n * A Jss Object used to override or extend the styles applied to the component.\n */\n classes?: HvVerticalNavigationClasses;\n /**\n * Current State of the Vertical Navigation Collapse\n */\n open?: boolean;\n /**\n * Collpased Mode for the Vertical Navigation, the default value is \"simple\".\n */\n collapsedMode?: HvVerticalNavigationMode;\n /**\n * Boolean to determine if treeview is in slider mode (for mobile navigation), the default value is false.\n */\n slider?: boolean;\n /**\n * The content inside the actions container.\n */\n children?: React.ReactNode;\n};\n\n/**\n * Navigation enables users to move through an app to complete tasks.\n *\n * It is recommended to use vertical navigation when your application requires global navigation that is displayed on the left.\n * While vertical navigation menus generally consume more space than their horizontal counterparts, they have become more popular as desktop monitors move to wide-screen formats.\n *\n * Even thou both the hierarchically organized data and the visual style ressemble a treeview-like structure, the [Treeview Design Pattern](https://w3c.github.io/aria-practices/#TreeView)\n * isn't necessarily the most appropriate.\n *\n * The tree role provides complex functionality that is not needed for typical site navigation, and changes the most common keyboard navigation using TAB.\n *\n * The [Disclosure Design Pattern](https://w3c.github.io/aria-practices/#disclosure) is more suited for typical site navigation, with expandable groups of links.\n * However it can be tedious to TAB through all navigation items to reach the actions panel.\n *\n * Both modes are available via the `mode` property and each app should choose the most appropriate.\n */\nexport const HvVerticalNavigation = ({\n id,\n className,\n classes,\n\n children,\n\n open = true,\n\n collapsedMode = \"simple\",\n\n slider = false,\n\n ...others\n}: HvVerticalNavigationProps) => {\n const [parentData, setParentData] = useState<NavigationData[]>([]);\n\n const [parentSelected, setParentSelected] = useState();\n\n const [headerTitle, setHeaderTitle] = useState<string | undefined>();\n\n // navigationSlider\n const withParentData = useMemo(\n () => fillDataWithParentId(parentData),\n [parentData]\n );\n\n const initialParentItem = useMemo(\n () => getParentItemById(withParentData, parentSelected),\n [withParentData, parentSelected]\n );\n\n const [parentItem, setParentItem] = useState(initialParentItem);\n\n useEffect(\n () => setHeaderTitle(parentItem?.label),\n [parentItem, setParentItem]\n );\n\n const navigateToParentHandler = () => {\n setParentItem(getParentItemById(withParentData, parentItem.id));\n };\n\n const navigateToChildHandler = (event, item) => {\n setParentItem(getNavigationItemById(withParentData, item.id));\n event.stopPropagation();\n };\n\n const value = useMemo(\n () => ({\n isOpen: open,\n collapsedMode,\n slider,\n headerTitle,\n setHeaderTitle,\n\n parentItem,\n withParentData,\n navigateToChildHandler,\n navigateToParentHandler,\n\n parentData,\n setParentData,\n parentSelected,\n setParentSelected,\n }),\n [\n open,\n collapsedMode,\n slider,\n headerTitle,\n setHeaderTitle,\n parentItem,\n withParentData,\n navigateToChildHandler,\n navigateToParentHandler,\n ]\n );\n\n const content = (\n <VerticalNavigationContext.Provider value={value}>\n <StyledRoot\n id={id}\n className={clsx(\n className,\n verticalNavigationClasses.root,\n classes?.root,\n !open && verticalNavigationClasses.collapsed,\n slider && verticalNavigationClasses.slider,\n classes?.collapsed\n )}\n {...others}\n >\n {children}\n </StyledRoot>\n </VerticalNavigationContext.Provider>\n );\n\n return content;\n};\n\nexport type HvVerticalNavigationMode = \"icon\" | \"simple\";\n\nexport type HvVerticalNavigationPosition =\n | \"static\"\n | \"relative\"\n | \"fixed\"\n | \"absolute\";\n"],"names":["HvVerticalNavigation","id","className","classes","children","open","collapsedMode","slider","others","parentData","setParentData","useState","parentSelected","setParentSelected","headerTitle","setHeaderTitle","withParentData","useMemo","fillDataWithParentId","initialParentItem","getParentItemById","parentItem","setParentItem","label","navigateToParentHandler","navigateToChildHandler","event","item","getNavigationItemById","stopPropagation","value","isOpen","content","VerticalNavigationContext","Provider","StyledRoot","clsx","verticalNavigationClasses","root","collapsed"],"mappings":";;;;;;;AA4DO,MAAMA,uBAAuBA,CAAC;AAAA,EACnCC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EAEAC;AAAAA,EAEAC,OAAO;AAAA,EAEPC,gBAAgB;AAAA,EAEhBC,SAAS;AAAA,EAET,GAAGC;AACsB,MAAM;AAC/B,QAAM,CAACC,YAAYC,aAAa,IAAIC,SAA2B,CAAE,CAAA;AAEjE,QAAM,CAACC,gBAAgBC,iBAAiB,IAAIF,SAAU;AAEtD,QAAM,CAACG,aAAaC,cAAc,IAAIJ,SAA8B;AAG9DK,QAAAA,iBAAiBC,QACrB,MAAMC,qBAAqBT,UAAU,GACrC,CAACA,UAAU,CAAC;AAGRU,QAAAA,oBAAoBF,QACxB,MAAMG,kBAAkBJ,gBAAgBJ,cAAc,GACtD,CAACI,gBAAgBJ,cAAc,CAAC;AAGlC,QAAM,CAACS,YAAYC,aAAa,IAAIX,SAASQ,iBAAiB;AAG5D,YAAA,MAAMJ,eAAeM,yCAAYE,KAAK,GACtC,CAACF,YAAYC,aAAa,CAAC;AAG7B,QAAME,0BAA0BA,MAAM;AACpCF,kBAAcF,kBAAkBJ,gBAAgBK,WAAWpB,EAAE,CAAC;AAAA,EAAA;AAG1DwB,QAAAA,yBAAyBA,CAACC,OAAOC,SAAS;AAC9CL,kBAAcM,sBAAsBZ,gBAAgBW,KAAK1B,EAAE,CAAC;AAC5DyB,UAAMG,gBAAiB;AAAA,EAAA;AAGnBC,QAAAA,QAAQb,QACZ,OAAO;AAAA,IACLc,QAAQ1B;AAAAA,IACRC;AAAAA,IACAC;AAAAA,IACAO;AAAAA,IACAC;AAAAA,IAEAM;AAAAA,IACAL;AAAAA,IACAS;AAAAA,IACAD;AAAAA,IAEAf;AAAAA,IACAC;AAAAA,IACAE;AAAAA,IACAC;AAAAA,EACF,IACA,CACER,MACAC,eACAC,QACAO,aACAC,gBACAM,YACAL,gBACAS,wBACAD,uBAAuB,CACxB;AAGGQ,QAAAA,UACHC,oBAAAA,0BAA0BC,UAAQ;AAAA,IAACJ;AAAAA,IAAa1B,8BAC9C+B,YAAU;AAAA,MACTlC;AAAAA,MACAC,WAAWkC,KACTlC,WACAmC,0BAA0BC,MAC1BnC,mCAASmC,MACT,CAACjC,QAAQgC,0BAA0BE,WACnChC,UAAU8B,0BAA0B9B,QACpCJ,mCAASoC,SAAS;AAAA,MAClB,GACE/B;AAAAA,MAAMJ;AAAAA,IAAAA,CAED;AAAA,EAAA,CAGd;AAEM4B,SAAAA;AACT;"}
1
+ {"version":3,"file":"VerticalNavigation.js","sources":["../../../../src/components/VerticalNavigation/VerticalNavigation.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useEffect, useMemo, useState } from \"react\";\nimport { StyledRoot } from \"./VerticalNavigation.styles\";\nimport verticalNavigationClasses, {\n HvVerticalNavigationClasses,\n} from \"./verticalNavigationClasses\";\nimport { NavigationData, VerticalNavigationContext } from \"./\";\nimport {\n fillDataWithParentId,\n getNavigationItemById,\n getParentItemById,\n} from \"./NavigationSlider/utils\";\nimport { hasChildNavigationItems } from \"./utils/VerticalNavigation.utils\";\n\nexport type HvVerticalNavigationProps = {\n /**\n * Id to be applied to the root node.\n */\n id?: string;\n /**\n * Class names to be applied.\n */\n className?: string;\n /**\n * A Jss Object used to override or extend the styles applied to the component.\n */\n classes?: HvVerticalNavigationClasses;\n /**\n * Current State of the Vertical Navigation Collapse\n */\n open?: boolean;\n /**\n * Collpased Mode for the Vertical Navigation, the default value is \"simple\".\n */\n collapsedMode?: HvVerticalNavigationMode;\n /**\n * Boolean to determine if treeview is in slider mode (for mobile navigation), the default value is false.\n */\n slider?: boolean;\n /**\n * The content inside the actions container.\n */\n children?: React.ReactNode;\n};\n\n/**\n * Navigation enables users to move through an app to complete tasks.\n *\n * It is recommended to use vertical navigation when your application requires global navigation that is displayed on the left.\n * While vertical navigation menus generally consume more space than their horizontal counterparts, they have become more popular as desktop monitors move to wide-screen formats.\n *\n * Even thou both the hierarchically organized data and the visual style ressemble a treeview-like structure, the [Treeview Design Pattern](https://w3c.github.io/aria-practices/#TreeView)\n * isn't necessarily the most appropriate.\n *\n * The tree role provides complex functionality that is not needed for typical site navigation, and changes the most common keyboard navigation using TAB.\n *\n * The [Disclosure Design Pattern](https://w3c.github.io/aria-practices/#disclosure) is more suited for typical site navigation, with expandable groups of links.\n * However it can be tedious to TAB through all navigation items to reach the actions panel.\n *\n * Both modes are available via the `mode` property and each app should choose the most appropriate.\n */\nexport const HvVerticalNavigation = ({\n id,\n className,\n classes,\n\n children,\n\n open = true,\n\n collapsedMode = \"simple\",\n\n slider = false,\n\n ...others\n}: HvVerticalNavigationProps) => {\n const [parentData, setParentData] = useState<NavigationData[]>([]);\n\n const [parentSelected, setParentSelected] = useState();\n\n const [headerTitle, setHeaderTitle] = useState<string | undefined>();\n\n // navigationSlider\n const withParentData = useMemo(\n () => fillDataWithParentId(parentData),\n [parentData]\n );\n\n const initialParentItem = useMemo(\n () => getParentItemById(withParentData, parentSelected),\n [withParentData, parentSelected]\n );\n\n const [parentItem, setParentItem] = useState(initialParentItem);\n\n const hasAnyChildWithData = useMemo(\n () => hasChildNavigationItems(parentData),\n [parentData]\n );\n\n useEffect(\n () => setHeaderTitle(parentItem?.label),\n [parentItem, setParentItem]\n );\n\n const navigateToParentHandler = () => {\n setParentItem(getParentItemById(withParentData, parentItem.id));\n };\n\n const navigateToChildHandler = (event, item) => {\n setParentItem(getNavigationItemById(withParentData, item.id));\n event.stopPropagation();\n };\n\n const value = useMemo(\n () => ({\n isOpen: open,\n collapsedMode,\n slider,\n headerTitle,\n setHeaderTitle,\n\n parentItem,\n withParentData,\n navigateToChildHandler,\n navigateToParentHandler,\n\n parentData,\n setParentData,\n parentSelected,\n setParentSelected,\n hasAnyChildWithData,\n }),\n [\n open,\n collapsedMode,\n slider,\n headerTitle,\n setHeaderTitle,\n parentItem,\n withParentData,\n navigateToChildHandler,\n navigateToParentHandler,\n hasAnyChildWithData,\n ]\n );\n\n const content = (\n <VerticalNavigationContext.Provider value={value}>\n <StyledRoot\n id={id}\n className={clsx(\n className,\n verticalNavigationClasses.root,\n classes?.root,\n !open && verticalNavigationClasses.collapsed,\n slider && verticalNavigationClasses.slider,\n classes?.collapsed\n )}\n hasAnyChildWithData={hasAnyChildWithData}\n {...others}\n >\n {children}\n </StyledRoot>\n </VerticalNavigationContext.Provider>\n );\n\n return content;\n};\n\nexport type HvVerticalNavigationMode = \"icon\" | \"simple\";\n\nexport type HvVerticalNavigationPosition =\n | \"static\"\n | \"relative\"\n | \"fixed\"\n | \"absolute\";\n"],"names":["HvVerticalNavigation","id","className","classes","children","open","collapsedMode","slider","others","parentData","setParentData","useState","parentSelected","setParentSelected","headerTitle","setHeaderTitle","withParentData","useMemo","fillDataWithParentId","initialParentItem","getParentItemById","parentItem","setParentItem","hasAnyChildWithData","hasChildNavigationItems","label","navigateToParentHandler","navigateToChildHandler","event","item","getNavigationItemById","stopPropagation","value","isOpen","content","VerticalNavigationContext","Provider","StyledRoot","clsx","verticalNavigationClasses","root","collapsed"],"mappings":";;;;;;;;AA6DO,MAAMA,uBAAuBA,CAAC;AAAA,EACnCC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EAEAC;AAAAA,EAEAC,OAAO;AAAA,EAEPC,gBAAgB;AAAA,EAEhBC,SAAS;AAAA,EAET,GAAGC;AACsB,MAAM;AAC/B,QAAM,CAACC,YAAYC,aAAa,IAAIC,SAA2B,CAAE,CAAA;AAEjE,QAAM,CAACC,gBAAgBC,iBAAiB,IAAIF,SAAU;AAEtD,QAAM,CAACG,aAAaC,cAAc,IAAIJ,SAA8B;AAG9DK,QAAAA,iBAAiBC,QACrB,MAAMC,qBAAqBT,UAAU,GACrC,CAACA,UAAU,CAAC;AAGRU,QAAAA,oBAAoBF,QACxB,MAAMG,kBAAkBJ,gBAAgBJ,cAAc,GACtD,CAACI,gBAAgBJ,cAAc,CAAC;AAGlC,QAAM,CAACS,YAAYC,aAAa,IAAIX,SAASQ,iBAAiB;AAExDI,QAAAA,sBAAsBN,QAC1B,MAAMO,wBAAwBf,UAAU,GACxC,CAACA,UAAU,CAAC;AAIZ,YAAA,MAAMM,eAAeM,yCAAYI,KAAK,GACtC,CAACJ,YAAYC,aAAa,CAAC;AAG7B,QAAMI,0BAA0BA,MAAM;AACpCJ,kBAAcF,kBAAkBJ,gBAAgBK,WAAWpB,EAAE,CAAC;AAAA,EAAA;AAG1D0B,QAAAA,yBAAyBA,CAACC,OAAOC,SAAS;AAC9CP,kBAAcQ,sBAAsBd,gBAAgBa,KAAK5B,EAAE,CAAC;AAC5D2B,UAAMG,gBAAiB;AAAA,EAAA;AAGnBC,QAAAA,QAAQf,QACZ,OAAO;AAAA,IACLgB,QAAQ5B;AAAAA,IACRC;AAAAA,IACAC;AAAAA,IACAO;AAAAA,IACAC;AAAAA,IAEAM;AAAAA,IACAL;AAAAA,IACAW;AAAAA,IACAD;AAAAA,IAEAjB;AAAAA,IACAC;AAAAA,IACAE;AAAAA,IACAC;AAAAA,IACAU;AAAAA,EAEF,IAAA,CACElB,MACAC,eACAC,QACAO,aACAC,gBACAM,YACAL,gBACAW,wBACAD,yBACAH,mBAAmB,CACpB;AAGGW,QAAAA,UACHC,oBAAAA,0BAA0BC,UAAQ;AAAA,IAACJ;AAAAA,IAAa5B,8BAC9CiC,YAAU;AAAA,MACTpC;AAAAA,MACAC,WAAWoC,KACTpC,WACAqC,0BAA0BC,MAC1BrC,mCAASqC,MACT,CAACnC,QAAQkC,0BAA0BE,WACnClC,UAAUgC,0BAA0BhC,QACpCJ,mCAASsC,SAAS;AAAA,MAEpBlB;AAAAA,MAAyC,GACrCf;AAAAA,MAAMJ;AAAAA,IAAAA,CAED;AAAA,EAAA,CAGd;AAEM8B,SAAAA;AACT;"}
@@ -6,16 +6,18 @@ const StyledRoot = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "prod
6
6
  } : {
7
7
  target: "eyka99t0",
8
8
  label: "StyledRoot"
9
- })({
9
+ })(({
10
+ hasAnyChildWithData
11
+ }) => ({
10
12
  display: "flex",
11
13
  flexDirection: "column",
12
14
  justifyContent: theme.verticalNavigation.justifyContent,
13
- width: "100%",
15
+ width: "220px",
14
16
  background: theme.colors.atmo1,
15
17
  boxShadow: theme.colors.shadow,
16
18
  clipPath: "inset(0px -12px 0px 0px)",
17
19
  [`&.${verticalNavigationClasses.collapsed}`]: {
18
- width: "56px",
20
+ width: hasAnyChildWithData ? "66px" : "56px",
19
21
  "& > :first-of-type:not(:last-child)": {
20
22
  padding: theme.spacing(["sm", "xs", "xs", "xs"])
21
23
  },
@@ -39,7 +41,7 @@ const StyledRoot = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "prod
39
41
  borderBottom: `3px solid ${theme.colors.atmo2}`
40
42
  }
41
43
  }
42
- }, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvVmVydGljYWxOYXZpZ2F0aW9uL1ZlcnRpY2FsTmF2aWdhdGlvbi5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUkwQiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL1ZlcnRpY2FsTmF2aWdhdGlvbi9WZXJ0aWNhbE5hdmlnYXRpb24uc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHZlcnRpY2FsTmF2aWdhdGlvbkNsYXNzZXMgZnJvbSBcIi4vdmVydGljYWxOYXZpZ2F0aW9uQ2xhc3Nlc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBmbGV4RGlyZWN0aW9uOiBcImNvbHVtblwiLFxuICBqdXN0aWZ5Q29udGVudDogdGhlbWUudmVydGljYWxOYXZpZ2F0aW9uLmp1c3RpZnlDb250ZW50LFxuXG4gIHdpZHRoOiBcIjEwMCVcIixcblxuICBiYWNrZ3JvdW5kOiB0aGVtZS5jb2xvcnMuYXRtbzEsXG4gIGJveFNoYWRvdzogdGhlbWUuY29sb3JzLnNoYWRvdyxcbiAgY2xpcFBhdGg6IFwiaW5zZXQoMHB4IC0xMnB4IDBweCAwcHgpXCIsXG5cbiAgW2AmLiR7dmVydGljYWxOYXZpZ2F0aW9uQ2xhc3Nlcy5jb2xsYXBzZWR9YF06IHtcbiAgICB3aWR0aDogXCI1NnB4XCIsXG5cbiAgICBcIiYgPiA6Zmlyc3Qtb2YtdHlwZTpub3QoOmxhc3QtY2hpbGQpXCI6IHtcbiAgICAgIHBhZGRpbmc6IHRoZW1lLnNwYWNpbmcoW1wic21cIiwgXCJ4c1wiLCBcInhzXCIsIFwieHNcIl0pLFxuICAgIH0sXG5cbiAgICBcIiYgPiA6bm90KG5hdjpmaXJzdC1vZi10eXBlKVwiOiB7XG4gICAgICBwYWRkaW5nOiB0aGVtZS5zcGFjaW5nKFtcInhzXCIsIFwieHNcIiwgXCJzbVwiLCBcInhzXCJdKSxcbiAgICB9LFxuICB9LFxuXG4gIFwiJiA+IDpvbmx5LWNoaWxkXCI6IHtcbiAgICBwYWRkaW5nOiB0aGVtZS5zcGFjZS5zbSxcbiAgfSxcbiAgXCImID4gOm5vdChuYXY6Zmlyc3Qtb2YtdHlwZSlcIjoge1xuICAgIGJvcmRlclRvcDogYDNweCBzb2xpZCAke3RoZW1lLmNvbG9ycy5hdG1vMn1gLFxuICAgIHBhZGRpbmc6IHRoZW1lLnNwYWNpbmcoW1wieHNcIiwgXCJzbVwiLCBcInNtXCIsIFwic21cIl0pLFxuICB9LFxuXG4gIFwiJiA+IDpmaXJzdC1vZi10eXBlOm5vdCg6bGFzdC1jaGlsZClcIjoge1xuICAgIGJvcmRlclRvcDogXCJub25lXCIsXG4gICAgcGFkZGluZzogdGhlbWUuc3BhY2luZyhbXCJzbVwiLCBcInNtXCIsIFwieHNcIiwgXCJzbVwiXSksXG4gIH0sXG5cbiAgW2AmLiR7dmVydGljYWxOYXZpZ2F0aW9uQ2xhc3Nlcy5zbGlkZXJ9YF06IHtcbiAgICBcIiYgPiBkaXY6Zmlyc3Qtb2YtdHlwZVwiOiB7XG4gICAgICBib3JkZXJCb3R0b206IGAzcHggc29saWQgJHt0aGVtZS5jb2xvcnMuYXRtbzJ9YCxcbiAgICB9LFxuICB9LFxufSk7XG4iXX0= */");
44
+ }), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvVmVydGljYWxOYXZpZ2F0aW9uL1ZlcnRpY2FsTmF2aWdhdGlvbi5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVEwQiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL1ZlcnRpY2FsTmF2aWdhdGlvbi9WZXJ0aWNhbE5hdmlnYXRpb24uc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHZlcnRpY2FsTmF2aWdhdGlvbkNsYXNzZXMgZnJvbSBcIi4vdmVydGljYWxOYXZpZ2F0aW9uQ2xhc3Nlc1wiO1xuXG5pbnRlcmZhY2UgU3R5bGVkUm9vdFByb3BzIHtcbiAgaGFzQW55Q2hpbGRXaXRoRGF0YTogYm9vbGVhbjtcbn1cblxuZXhwb3J0IGNvbnN0IFN0eWxlZFJvb3QgPSBzdHlsZWQoXCJkaXZcIikoXG4gICh7IGhhc0FueUNoaWxkV2l0aERhdGEgfTogU3R5bGVkUm9vdFByb3BzKSA9PiAoe1xuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIGZsZXhEaXJlY3Rpb246IFwiY29sdW1uXCIsXG4gICAganVzdGlmeUNvbnRlbnQ6IHRoZW1lLnZlcnRpY2FsTmF2aWdhdGlvbi5qdXN0aWZ5Q29udGVudCxcblxuICAgIHdpZHRoOiBcIjIyMHB4XCIsXG5cbiAgICBiYWNrZ3JvdW5kOiB0aGVtZS5jb2xvcnMuYXRtbzEsXG4gICAgYm94U2hhZG93OiB0aGVtZS5jb2xvcnMuc2hhZG93LFxuICAgIGNsaXBQYXRoOiBcImluc2V0KDBweCAtMTJweCAwcHggMHB4KVwiLFxuXG4gICAgW2AmLiR7dmVydGljYWxOYXZpZ2F0aW9uQ2xhc3Nlcy5jb2xsYXBzZWR9YF06IHtcbiAgICAgIHdpZHRoOiBoYXNBbnlDaGlsZFdpdGhEYXRhID8gXCI2NnB4XCIgOiBcIjU2cHhcIixcblxuICAgICAgXCImID4gOmZpcnN0LW9mLXR5cGU6bm90KDpsYXN0LWNoaWxkKVwiOiB7XG4gICAgICAgIHBhZGRpbmc6IHRoZW1lLnNwYWNpbmcoW1wic21cIiwgXCJ4c1wiLCBcInhzXCIsIFwieHNcIl0pLFxuICAgICAgfSxcblxuICAgICAgXCImID4gOm5vdChuYXY6Zmlyc3Qtb2YtdHlwZSlcIjoge1xuICAgICAgICBwYWRkaW5nOiB0aGVtZS5zcGFjaW5nKFtcInhzXCIsIFwieHNcIiwgXCJzbVwiLCBcInhzXCJdKSxcbiAgICAgIH0sXG4gICAgfSxcblxuICAgIFwiJiA+IDpvbmx5LWNoaWxkXCI6IHtcbiAgICAgIHBhZGRpbmc6IHRoZW1lLnNwYWNlLnNtLFxuICAgIH0sXG4gICAgXCImID4gOm5vdChuYXY6Zmlyc3Qtb2YtdHlwZSlcIjoge1xuICAgICAgYm9yZGVyVG9wOiBgM3B4IHNvbGlkICR7dGhlbWUuY29sb3JzLmF0bW8yfWAsXG4gICAgICBwYWRkaW5nOiB0aGVtZS5zcGFjaW5nKFtcInhzXCIsIFwic21cIiwgXCJzbVwiLCBcInNtXCJdKSxcbiAgICB9LFxuXG4gICAgXCImID4gOmZpcnN0LW9mLXR5cGU6bm90KDpsYXN0LWNoaWxkKVwiOiB7XG4gICAgICBib3JkZXJUb3A6IFwibm9uZVwiLFxuICAgICAgcGFkZGluZzogdGhlbWUuc3BhY2luZyhbXCJzbVwiLCBcInNtXCIsIFwieHNcIiwgXCJzbVwiXSksXG4gICAgfSxcblxuICAgIFtgJi4ke3ZlcnRpY2FsTmF2aWdhdGlvbkNsYXNzZXMuc2xpZGVyfWBdOiB7XG4gICAgICBcIiYgPiBkaXY6Zmlyc3Qtb2YtdHlwZVwiOiB7XG4gICAgICAgIGJvcmRlckJvdHRvbTogYDNweCBzb2xpZCAke3RoZW1lLmNvbG9ycy5hdG1vMn1gLFxuICAgICAgfSxcbiAgICB9LFxuICB9KVxuKTtcbiJdfQ== */");
43
45
  export {
44
46
  StyledRoot
45
47
  };
@@ -1 +1 @@
1
- {"version":3,"file":"VerticalNavigation.styles.js","sources":["../../../../src/components/VerticalNavigation/VerticalNavigation.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport verticalNavigationClasses from \"./verticalNavigationClasses\";\n\nexport const StyledRoot = styled(\"div\")({\n display: \"flex\",\n flexDirection: \"column\",\n justifyContent: theme.verticalNavigation.justifyContent,\n\n width: \"100%\",\n\n background: theme.colors.atmo1,\n boxShadow: theme.colors.shadow,\n clipPath: \"inset(0px -12px 0px 0px)\",\n\n [`&.${verticalNavigationClasses.collapsed}`]: {\n width: \"56px\",\n\n \"& > :first-of-type:not(:last-child)\": {\n padding: theme.spacing([\"sm\", \"xs\", \"xs\", \"xs\"]),\n },\n\n \"& > :not(nav:first-of-type)\": {\n padding: theme.spacing([\"xs\", \"xs\", \"sm\", \"xs\"]),\n },\n },\n\n \"& > :only-child\": {\n padding: theme.space.sm,\n },\n \"& > :not(nav:first-of-type)\": {\n borderTop: `3px solid ${theme.colors.atmo2}`,\n padding: theme.spacing([\"xs\", \"sm\", \"sm\", \"sm\"]),\n },\n\n \"& > :first-of-type:not(:last-child)\": {\n borderTop: \"none\",\n padding: theme.spacing([\"sm\", \"sm\", \"xs\", \"sm\"]),\n },\n\n [`&.${verticalNavigationClasses.slider}`]: {\n \"& > div:first-of-type\": {\n borderBottom: `3px solid ${theme.colors.atmo2}`,\n },\n },\n});\n"],"names":["StyledRoot","process","env","NODE_ENV","target","label","display","flexDirection","justifyContent","theme","verticalNavigation","width","background","colors","atmo1","boxShadow","shadow","clipPath","verticalNavigationClasses","collapsed","padding","spacing","space","sm","borderTop","atmo2","slider","borderBottom"],"mappings":";;;AAIO,MAAMA,aAAoB,wBAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EACtCC,SAAS;AAAA,EACTC,eAAe;AAAA,EACfC,gBAAgBC,MAAMC,mBAAmBF;AAAAA,EAEzCG,OAAO;AAAA,EAEPC,YAAYH,MAAMI,OAAOC;AAAAA,EACzBC,WAAWN,MAAMI,OAAOG;AAAAA,EACxBC,UAAU;AAAA,EAEV,CAAE,KAAIC,0BAA0BC,WAAW,GAAG;AAAA,IAC5CR,OAAO;AAAA,IAEP,uCAAuC;AAAA,MACrCS,SAASX,MAAMY,QAAQ,CAAC,MAAM,MAAM,MAAM,IAAI,CAAC;AAAA,IACjD;AAAA,IAEA,+BAA+B;AAAA,MAC7BD,SAASX,MAAMY,QAAQ,CAAC,MAAM,MAAM,MAAM,IAAI,CAAC;AAAA,IACjD;AAAA,EACF;AAAA,EAEA,mBAAmB;AAAA,IACjBD,SAASX,MAAMa,MAAMC;AAAAA,EACvB;AAAA,EACA,+BAA+B;AAAA,IAC7BC,WAAY,aAAYf,MAAMI,OAAOY;AAAAA,IACrCL,SAASX,MAAMY,QAAQ,CAAC,MAAM,MAAM,MAAM,IAAI,CAAC;AAAA,EACjD;AAAA,EAEA,uCAAuC;AAAA,IACrCG,WAAW;AAAA,IACXJ,SAASX,MAAMY,QAAQ,CAAC,MAAM,MAAM,MAAM,IAAI,CAAC;AAAA,EACjD;AAAA,EAEA,CAAE,KAAIH,0BAA0BQ,QAAQ,GAAG;AAAA,IACzC,yBAAyB;AAAA,MACvBC,cAAe,aAAYlB,MAAMI,OAAOY;AAAAA,IAC1C;AAAA,EACF;AACF,GAACxB,QAAAC,IAAAC,aAAC,eAAA,KAAA,6tEAAA;"}
1
+ {"version":3,"file":"VerticalNavigation.styles.js","sources":["../../../../src/components/VerticalNavigation/VerticalNavigation.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport verticalNavigationClasses from \"./verticalNavigationClasses\";\n\ninterface StyledRootProps {\n hasAnyChildWithData: boolean;\n}\n\nexport const StyledRoot = styled(\"div\")(\n ({ hasAnyChildWithData }: StyledRootProps) => ({\n display: \"flex\",\n flexDirection: \"column\",\n justifyContent: theme.verticalNavigation.justifyContent,\n\n width: \"220px\",\n\n background: theme.colors.atmo1,\n boxShadow: theme.colors.shadow,\n clipPath: \"inset(0px -12px 0px 0px)\",\n\n [`&.${verticalNavigationClasses.collapsed}`]: {\n width: hasAnyChildWithData ? \"66px\" : \"56px\",\n\n \"& > :first-of-type:not(:last-child)\": {\n padding: theme.spacing([\"sm\", \"xs\", \"xs\", \"xs\"]),\n },\n\n \"& > :not(nav:first-of-type)\": {\n padding: theme.spacing([\"xs\", \"xs\", \"sm\", \"xs\"]),\n },\n },\n\n \"& > :only-child\": {\n padding: theme.space.sm,\n },\n \"& > :not(nav:first-of-type)\": {\n borderTop: `3px solid ${theme.colors.atmo2}`,\n padding: theme.spacing([\"xs\", \"sm\", \"sm\", \"sm\"]),\n },\n\n \"& > :first-of-type:not(:last-child)\": {\n borderTop: \"none\",\n padding: theme.spacing([\"sm\", \"sm\", \"xs\", \"sm\"]),\n },\n\n [`&.${verticalNavigationClasses.slider}`]: {\n \"& > div:first-of-type\": {\n borderBottom: `3px solid ${theme.colors.atmo2}`,\n },\n },\n })\n);\n"],"names":["StyledRoot","process","env","NODE_ENV","target","label","hasAnyChildWithData","display","flexDirection","justifyContent","theme","verticalNavigation","width","background","colors","atmo1","boxShadow","shadow","clipPath","verticalNavigationClasses","collapsed","padding","spacing","space","sm","borderTop","atmo2","slider","borderBottom"],"mappings":";;;AAQO,MAAMA,aAAoB,wBAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EACpC,CAAC;AAAA,EAAEC;AAAqC,OAAO;AAAA,EAC7CC,SAAS;AAAA,EACTC,eAAe;AAAA,EACfC,gBAAgBC,MAAMC,mBAAmBF;AAAAA,EAEzCG,OAAO;AAAA,EAEPC,YAAYH,MAAMI,OAAOC;AAAAA,EACzBC,WAAWN,MAAMI,OAAOG;AAAAA,EACxBC,UAAU;AAAA,EAEV,CAAE,KAAIC,0BAA0BC,WAAW,GAAG;AAAA,IAC5CR,OAAON,sBAAsB,SAAS;AAAA,IAEtC,uCAAuC;AAAA,MACrCe,SAASX,MAAMY,QAAQ,CAAC,MAAM,MAAM,MAAM,IAAI,CAAC;AAAA,IACjD;AAAA,IAEA,+BAA+B;AAAA,MAC7BD,SAASX,MAAMY,QAAQ,CAAC,MAAM,MAAM,MAAM,IAAI,CAAC;AAAA,IACjD;AAAA,EACF;AAAA,EAEA,mBAAmB;AAAA,IACjBD,SAASX,MAAMa,MAAMC;AAAAA,EACvB;AAAA,EACA,+BAA+B;AAAA,IAC7BC,WAAY,aAAYf,MAAMI,OAAOY;AAAAA,IACrCL,SAASX,MAAMY,QAAQ,CAAC,MAAM,MAAM,MAAM,IAAI,CAAC;AAAA,EACjD;AAAA,EAEA,uCAAuC;AAAA,IACrCG,WAAW;AAAA,IACXJ,SAASX,MAAMY,QAAQ,CAAC,MAAM,MAAM,MAAM,IAAI,CAAC;AAAA,EACjD;AAAA,EAEA,CAAE,KAAIH,0BAA0BQ,QAAQ,GAAG;AAAA,IACzC,yBAAyB;AAAA,MACvBC,cAAe,aAAYlB,MAAMI,OAAOY;AAAAA,IAC1C;AAAA,EACF;AACF,IAAEzB,QAAAC,IAAAC,aACH,eAAA,KAAA,qgFAAA;"}
@@ -1 +1 @@
1
- {"version":3,"file":"VerticalNavigationContext.js","sources":["../../../../src/components/VerticalNavigation/VerticalNavigationContext.tsx"],"sourcesContent":["import { createContext } from \"react\";\nimport { NavigationData, HvVerticalNavigationMode } from \"./\";\n\ninterface VerticalNavigationContextValue {\n isOpen: boolean;\n collapsedMode: HvVerticalNavigationMode;\n slider?: boolean;\n headerTitle?: string;\n setHeaderTitle?: React.Dispatch<React.SetStateAction<string | undefined>>;\n\n parentItem?;\n withParentData?;\n navigateToChildHandler?: (event, item) => void;\n navigateToParentHandler?: () => void;\n\n parentData?: NavigationData[];\n setParentData?: React.Dispatch<React.SetStateAction<any>>;\n parentSelected?;\n setParentSelected?: React.Dispatch<React.SetStateAction<any>>;\n}\n\nconst VerticalNavigationContext = createContext<VerticalNavigationContextValue>(\n {\n isOpen: true,\n collapsedMode: \"simple\",\n slider: false,\n }\n);\n\nexport { VerticalNavigationContext };\n"],"names":["VerticalNavigationContext","createContext","isOpen","collapsedMode","slider"],"mappings":";AAqBA,MAAMA,4BAA4BC,cAChC;AAAA,EACEC,QAAQ;AAAA,EACRC,eAAe;AAAA,EACfC,QAAQ;AACV,CAAC;"}
1
+ {"version":3,"file":"VerticalNavigationContext.js","sources":["../../../../src/components/VerticalNavigation/VerticalNavigationContext.tsx"],"sourcesContent":["import { createContext } from \"react\";\nimport { NavigationData, HvVerticalNavigationMode } from \"./\";\n\ninterface VerticalNavigationContextValue {\n isOpen: boolean;\n collapsedMode: HvVerticalNavigationMode;\n slider?: boolean;\n headerTitle?: string;\n setHeaderTitle?: React.Dispatch<React.SetStateAction<string | undefined>>;\n\n parentItem?;\n withParentData?;\n navigateToChildHandler?: (event, item) => void;\n navigateToParentHandler?: () => void;\n\n parentData?: NavigationData[];\n setParentData?: React.Dispatch<React.SetStateAction<any>>;\n parentSelected?;\n setParentSelected?: React.Dispatch<React.SetStateAction<any>>;\n\n hasAnyChildWithData?: boolean;\n}\n\nconst VerticalNavigationContext = createContext<VerticalNavigationContextValue>(\n {\n isOpen: true,\n collapsedMode: \"simple\",\n slider: false,\n }\n);\n\nexport { VerticalNavigationContext };\n"],"names":["VerticalNavigationContext","createContext","isOpen","collapsedMode","slider"],"mappings":";AAuBA,MAAMA,4BAA4BC,cAChC;AAAA,EACEC,QAAQ;AAAA,EACRC,eAAe;AAAA,EACfC,QAAQ;AACV,CAAC;"}
@@ -0,0 +1,7 @@
1
+ const hasChildNavigationItems = (data) => {
2
+ return data.some((item) => item.data && item.data.length > 0);
3
+ };
4
+ export {
5
+ hasChildNavigationItems
6
+ };
7
+ //# sourceMappingURL=VerticalNavigation.utils.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"VerticalNavigation.utils.js","sources":["../../../../../src/components/VerticalNavigation/utils/VerticalNavigation.utils.tsx"],"sourcesContent":["import { NavigationData } from \"../Navigation\";\n\n/**\n * Checks if there are any sub items in the NavigationItem data structure.\n *\n * @param data - The collection of navigation items.\n * @returns `true` if there is at least one sub item in the structure, `false` otherwise.\n */\nconst hasChildNavigationItems = (data: NavigationData[]) => {\n return data.some((item) => item.data && item.data.length > 0);\n};\n\nexport { hasChildNavigationItems };\n"],"names":["hasChildNavigationItems","data","some","item","length"],"mappings":"AAQMA,MAAAA,0BAA0BA,CAACC,SAA2B;AACnDA,SAAAA,KAAKC,KAAMC,CAASA,SAAAA,KAAKF,QAAQE,KAAKF,KAAKG,SAAS,CAAC;AAC9D;"}
package/dist/esm/index.js CHANGED
@@ -226,8 +226,10 @@ import { default as default118 } from "./components/VerticalNavigation/TreeView/
226
226
  import { HvVerticalNavigationTreeView } from "./components/VerticalNavigation/TreeView/TreeView.js";
227
227
  import { HvVerticalNavigationTreeViewItem } from "./components/VerticalNavigation/TreeView/TreeViewItem.js";
228
228
  import { VerticalNavigationContext } from "./components/VerticalNavigation/VerticalNavigationContext.js";
229
- import { default as default119 } from "./hooks/useUniqueId.js";
230
- import { default as default120 } from "./hooks/useIsMounted.js";
229
+ import { default as default119 } from "./components/Slider/sliderClasses.js";
230
+ import { HvSlider } from "./components/Slider/Slider.js";
231
+ import { default as default120 } from "./hooks/useUniqueId.js";
232
+ import { default as default121 } from "./hooks/useIsMounted.js";
231
233
  import { useClickOutside } from "./hooks/useClickOutside.js";
232
234
  import { useControlled } from "./hooks/useControlled.js";
233
235
  import { useImageLoaded } from "./hooks/useImageLoaded.js";
@@ -239,11 +241,11 @@ import { useEnhancedEffect } from "./hooks/useEnhancedEffect.js";
239
241
  import { HvProvider } from "./providers/Provider.js";
240
242
  import { HvThemeContext } from "@hitachivantara/uikit-react-shared";
241
243
  import { HvThemeProvider } from "./providers/ThemeProvider.js";
242
- import { default as default121 } from "./utils/iconVariant.js";
243
- import { default as default122 } from "./utils/hexToRgbA.js";
244
- import { default as default123 } from "./utils/browser.js";
245
- import { default as default124 } from "./utils/multiSelectionEventHandler.js";
246
- import { default as default125 } from "./utils/getComponentName.js";
244
+ import { default as default122 } from "./utils/iconVariant.js";
245
+ import { default as default123 } from "./utils/hexToRgbA.js";
246
+ import { default as default124 } from "./utils/browser.js";
247
+ import { default as default125 } from "./utils/multiSelectionEventHandler.js";
248
+ import { default as default126 } from "./utils/getComponentName.js";
247
249
  import { outlineStyles } from "./utils/focusUtils.js";
248
250
  import { keyboardCodes } from "./utils/keyboardUtils/keyboardCodes.js";
249
251
  import { getKeyCodeFromEvent, isKeycode, isKeypress } from "./utils/keyboardUtils/keyCheck.js";
@@ -253,8 +255,8 @@ import { setId, setUid } from "./utils/setId.js";
253
255
  import { getClasses } from "./utils/classes.js";
254
256
  import { getFirstAndLastFocus, getFocusableList, getPrevNextFocus } from "./utils/focusableElementFinder.js";
255
257
  import { wrapperTooltip } from "./utils/wrapperTooltip.js";
256
- import { default as default126 } from "./hocs/withTooltip.js";
257
- import { default as default127 } from "./hocs/withId.js";
258
+ import { default as default127 } from "./hocs/withTooltip.js";
259
+ import { default as default128 } from "./hocs/withId.js";
258
260
  export {
259
261
  CellWithCheckBox,
260
262
  CellWithExpandButton,
@@ -344,6 +346,7 @@ export {
344
346
  HvRightControl,
345
347
  HvSelectionList,
346
348
  HvSimpleGrid,
349
+ HvSlider,
347
350
  HvSnackbar,
348
351
  default81 as HvSnackbarContent,
349
352
  default79 as HvSnackbarProvider,
@@ -437,7 +440,7 @@ export {
437
440
  default36 as footerClasses,
438
441
  default13 as formElementClasses,
439
442
  getClasses,
440
- default125 as getComponentName,
443
+ default126 as getComponentName,
441
444
  getFirstAndLastFocus,
442
445
  getFocusableList,
443
446
  getHeaderFooterPropsHook,
@@ -454,7 +457,7 @@ export {
454
457
  default40 as headerBrandClasses,
455
458
  default38 as headerClasses,
456
459
  default41 as headerNavigationClasses,
457
- default122 as hexToRgbA,
460
+ default123 as hexToRgbA,
458
461
  hvDateColumn,
459
462
  hvDropdownColumn,
460
463
  hvExpandColumn,
@@ -466,11 +469,11 @@ export {
466
469
  hvSwitchColumn,
467
470
  hvTagColumn,
468
471
  hvTextColumn,
469
- default121 as iconVariant,
472
+ default122 as iconVariant,
470
473
  increaseSize,
471
474
  default15 as infoMessageClasses,
472
475
  default60 as inputClasses,
473
- default123 as isBrowser,
476
+ default124 as isBrowser,
474
477
  isInvalid,
475
478
  isKeycode,
476
479
  isKeypress,
@@ -486,7 +489,7 @@ export {
486
489
  default44 as loadingClasses,
487
490
  default105 as loginClasses,
488
491
  default45 as multiButtonClasses,
489
- default124 as multiSelectionEventHandler,
492
+ default125 as multiSelectionEventHandler,
490
493
  normalizeProgressBar,
491
494
  outlineStyles,
492
495
  default53 as overflowTooltipClasses,
@@ -503,6 +506,7 @@ export {
503
506
  setElementAttrs,
504
507
  setId,
505
508
  setUid,
509
+ default119 as sliderClasses,
506
510
  default78 as snackbarClasses,
507
511
  default80 as snackbarContentClasses,
508
512
  default48 as stackClasses,
@@ -547,19 +551,19 @@ export {
547
551
  default92 as useHvTableStyles,
548
552
  useImageLoaded,
549
553
  useInstance,
550
- default120 as useIsMounted,
554
+ default121 as useIsMounted,
551
555
  useLabels,
552
556
  useSelectionPath,
553
557
  useTheme,
554
- default119 as useUniqueId,
558
+ default120 as useUniqueId,
555
559
  useWidth,
556
560
  default111 as verticalNavigationClasses,
557
561
  default112 as verticalNavigationHeaderClasses,
558
562
  default116 as verticalNavigationSliderClasses,
559
563
  default115 as verticalNavigationTreeClasses,
560
564
  default16 as warningTextClasses,
561
- default127 as withId,
562
- default126 as withTooltip,
565
+ default128 as withId,
566
+ default127 as withTooltip,
563
567
  wrapperTooltip
564
568
  };
565
569
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}