@hitachivantara/uikit-react-core 3.52.5

package/dist/VerticalNavigation/TreeView/TreeViewItem.js

@@ -0,0 +1,457 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("core-js/modules/es.array.concat.js");
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _clsx = _interopRequireDefault(require("clsx"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _core = require("@material-ui/core");
+
+var _uikitReactIcons = require("@hitachivantara/uikit-react-icons");
+
+var _Typography = _interopRequireDefault(require("../../Typography"));
+
+var _TreeViewContexts = require("./TreeViewContexts");
+
+var _utils = require("../../utils");
+
+var _descendants = require("./descendants");
+
+var _styles = _interopRequireDefault(require("./styles"));
+
+var _excluded = ["id", "className", "classes", "disabled", "selectable", "nodeId", "icon", "label", "payload", "onClick", "onMouseDown", "onFocus", "children"];
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var preventSelection = function preventSelection(event, disabled) {
+  if (event.shiftKey || event.ctrlKey || event.metaKey || disabled) {
+    // Prevent text selection
+    event.preventDefault();
+  }
+};
+
+var TreeViewItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
+  var idProp = props.id,
+      className = props.className,
+      classes = props.classes,
+      _props$disabled = props.disabled,
+      disabledProp = _props$disabled === void 0 ? false : _props$disabled,
+      selectableProp = props.selectable,
+      nodeId = props.nodeId,
+      _props$icon = props.icon,
+      icon = _props$icon === void 0 ? null : _props$icon,
+      label = props.label,
+      payload = props.payload,
+      onClick = props.onClick,
+      onMouseDown = props.onMouseDown,
+      onFocus = props.onFocus,
+      children = props.children,
+      others = (0, _objectWithoutProperties2.default)(props, _excluded);
+  var treeViewControlContext = (0, _react.useContext)(_TreeViewContexts.TreeViewControlContext);
+
+  var _useContext = (0, _react.useContext)(_TreeViewContexts.TreeViewStateContext),
+      isExpanded = _useContext.isExpanded,
+      isSelected = _useContext.isSelected,
+      isFocused = _useContext.isFocused,
+      isDisabled = _useContext.isDisabled;
+
+  var treeId = treeViewControlContext.treeId,
+      mode = treeViewControlContext.mode,
+      collapsible = treeViewControlContext.collapsible,
+      toggleExpansion = treeViewControlContext.toggleExpansion,
+      multiSelect = treeViewControlContext.multiSelect,
+      selectNode = treeViewControlContext.selectNode,
+      selectRange = treeViewControlContext.selectRange,
+      disabledItemsFocusable = treeViewControlContext.disabledItemsFocusable,
+      registerNode = treeViewControlContext.registerNode,
+      unregisterNode = treeViewControlContext.unregisterNode,
+      mapFirstChar = treeViewControlContext.mapFirstChar,
+      unMapFirstChar = treeViewControlContext.unMapFirstChar,
+      focus = treeViewControlContext.focus;
+  var treeviewMode = mode === "treeview";
+  var id = null;
+
+  if (idProp != null) {
+    id = idProp;
+  } else if (treeId && nodeId) {
+    id = "".concat(treeId, "-").concat(nodeId);
+  }
+
+  var _useState = (0, _react.useState)(null),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      treeitemElement = _useState2[0],
+      setTreeitemElement = _useState2[1];
+
+  var contentRef = (0, _react.useRef)(null);
+  var handleRef = (0, _utils.useForkRef)(setTreeitemElement, ref);
+  var descendant = (0, _react.useMemo)(function () {
+    return {
+      element: treeitemElement,
+      id: nodeId
+    };
+  }, [nodeId, treeitemElement]);
+
+  var _useDescendant = (0, _descendants.useDescendant)(descendant),
+      index = _useDescendant.index,
+      parentId = _useDescendant.parentId,
+      level = _useDescendant.level;
+
+  var expandable = collapsible && Boolean(Array.isArray(children) ? children.length : children);
+  var expanded = isExpanded ? isExpanded(nodeId) : false;
+  var focused = isFocused ? isFocused(nodeId) : false;
+  var selected = isSelected ? isSelected(nodeId) : false;
+  var disabled = isDisabled ? isDisabled(nodeId) : false;
+  var selectable = selectableProp != null ? selectableProp : !collapsible || !expandable;
+  (0, _react.useEffect)(function () {
+    // On the first render a node's index will be -1. We want to wait for the real index.
+    if (registerNode && unregisterNode && index !== -1) {
+      registerNode({
+        id: nodeId,
+        idAttribute: id,
+        index: index,
+        parentId: parentId,
+        selectable: selectable,
+        expandable: expandable,
+        disabled: disabledProp,
+        onFocus: onFocus,
+        payload: payload
+      });
+      return function () {
+        unregisterNode(nodeId);
+      };
+    }
+
+    return undefined;
+  }, [registerNode, unregisterNode, parentId, index, nodeId, expandable, disabledProp, id, selectable, onFocus, payload]);
+  (0, _react.useEffect)(function () {
+    if (mapFirstChar && unMapFirstChar && label) {
+      mapFirstChar(nodeId, contentRef.current.textContent.substring(0, 1).toLowerCase());
+      return function () {
+        unMapFirstChar(nodeId);
+      };
+    }
+
+    return undefined;
+  }, [mapFirstChar, unMapFirstChar, nodeId, label]);
+  var ariaSelected;
+
+  if (multiSelect) {
+    ariaSelected = selected;
+  } else if (selected) {
+    /* single-selection trees unset aria-selected on un-selected items.
+     *
+     * If the tree does not support multiple selection, aria-selected
+     * is set to true for the selected node and it is not present on any other node in the tree.
+     * Source: https://www.w3.org/TR/wai-aria-practices/#TreeView
+     */
+    ariaSelected = true;
+  }
+
+  var handleFocus = (0, _react.useCallback)(function (event) {
+    // DOM focus stays on the tree which manages focus with aria-activedescendant
+    if (event.target === event.currentTarget) {
+      (event.target.ownerDocument || document).getElementById(treeId).focus({
+        preventScroll: true
+      });
+    }
+
+    var unfocusable = !disabledItemsFocusable && disabled;
+
+    if (!focused && event.currentTarget === event.target && !unfocusable) {
+      focus(event, nodeId);
+    }
+  }, [disabled, disabledItemsFocusable, focus, focused, nodeId, treeId]);
+  var handleExpansion = (0, _react.useCallback)(function (event) {
+    if (!disabled) {
+      if (treeviewMode && !focused) {
+        focus(event, nodeId);
+      }
+
+      var multiple = multiSelect && (event.shiftKey || event.ctrlKey || event.metaKey); // If already expanded and trying to toggle selection don't close
+
+      if (expandable && !(multiple && isExpanded(nodeId))) {
+        toggleExpansion(event, nodeId);
+      }
+    }
+  }, [disabled, expandable, focus, focused, isExpanded, multiSelect, nodeId, toggleExpansion, treeviewMode]);
+  var handleSelection = (0, _react.useCallback)(function (event) {
+    if (selectable && !disabled) {
+      if (treeviewMode && !focused) {
+        focus(event, nodeId);
+      }
+
+      var multiple = multiSelect && (event.shiftKey || event.ctrlKey || event.metaKey);
+
+      if (multiple) {
+        if (event.shiftKey) {
+          selectRange(event, {
+            end: nodeId
+          });
+        } else {
+          selectNode(event, nodeId, true);
+        }
+      } else {
+        selectNode(event, nodeId);
+      }
+    }
+  }, [disabled, focus, focused, multiSelect, nodeId, selectNode, selectRange, selectable, treeviewMode]);
+  var handleMouseDown = (0, _react.useCallback)(function (event) {
+    preventSelection(event, disabled);
+
+    if (onMouseDown) {
+      onMouseDown(event);
+    }
+  }, [disabled, onMouseDown]);
+  var handleClick = (0, _react.useCallback)(function (event) {
+    if (!disabled) {
+      if (expandable) {
+        handleExpansion(event);
+      }
+
+      if (selectable) {
+        handleSelection(event);
+      }
+    }
+
+    if (onClick) {
+      onClick(event);
+    }
+  }, [disabled, expandable, handleExpansion, handleSelection, onClick, selectable]);
+  var handleKeyDown = (0, _react.useCallback)(function (event) {
+    var isEventHandled = false;
+    var key = event.key;
+
+    if (event.altKey || event.ctrlKey || event.metaKey || event.currentTarget !== event.target) {
+      return;
+    }
+
+    if (contentRef.current === event.currentTarget) {
+      if (key === "Enter" || key === " ") {
+        if (expandable) {
+          isEventHandled = handleExpansion(event);
+        }
+
+        if (selectable) {
+          isEventHandled = handleSelection(event);
+        }
+      }
+
+      if (isEventHandled) {
+        event.preventDefault();
+        event.stopPropagation();
+      }
+    }
+  }, [expandable, handleExpansion, handleSelection, selectable]);
+  var renderedContent = (0, _react.useMemo)(function () {
+    return /*#__PURE__*/_react.default.createElement(_Typography.default, (0, _extends2.default)({
+      id: (0, _utils.setId)(id, "button"),
+      component: "div",
+      innerRef: contentRef,
+      className: classes.content,
+      onClick: handleClick,
+      onMouseDown: handleMouseDown,
+      style: {
+        paddingLeft: (expandable || icon != null ? 0 : 10) + level * (collapsible ? 32 : 10)
+      }
+    }, treeviewMode ? {
+      role: "button",
+      tabIndex: -1,
+      onFocus: handleFocus
+    } : {
+      role: "button",
+      tabIndex: selectable || expandable ? 0 : -1,
+      onKeyDown: handleKeyDown,
+      "aria-current": selectable && selected ? "page" : undefined,
+      "aria-expanded": expandable ? expanded : undefined,
+      "aria-controls": expandable ? (0, _utils.setId)(id, "group") : undefined
+    }), expandable && (expanded ? /*#__PURE__*/_react.default.createElement(_uikitReactIcons.DropUpXS, null) : /*#__PURE__*/_react.default.createElement(_uikitReactIcons.DropDownXS, null)), icon, label);
+  }, [id, classes.content, handleClick, handleMouseDown, expandable, level, collapsible, treeviewMode, handleFocus, handleKeyDown, selectable, selected, expanded, icon, label]);
+  var renderedChildren = (0, _react.useMemo)(function () {
+    return children && /*#__PURE__*/_react.default.createElement("ul", {
+      id: (0, _utils.setId)(id, "group"),
+      className: classes.group,
+      role: treeviewMode ? "group" : undefined
+    }, children);
+  }, [children, classes.group, id, treeviewMode]);
+  return /*#__PURE__*/_react.default.createElement("li", (0, _extends2.default)({
+    ref: handleRef,
+    id: id,
+    className: (0, _clsx.default)(classes.node, className, disabled ? classes.disabled : selectable ? [classes.selectable, selected ? classes.selected : classes.unselected] : classes.unselectable, expandable && [classes.expandable, expanded ? classes.expanded : classes.collapsed], focused && classes.focused),
+    "data-hasicon": icon != null ? true : undefined
+  }, mode === "treeview" && {
+    role: "treeitem",
+    "aria-selected": ariaSelected,
+    "aria-expanded": expandable ? expanded : undefined,
+    "aria-disabled": disabled ? true : undefined
+  }, others), renderedContent, /*#__PURE__*/_react.default.createElement(_descendants.DescendantProvider, {
+    id: nodeId,
+    level: level + 1
+  }, renderedChildren));
+});
+
+TreeViewItem.propTypes = {
+  /**
+   * Id to be applied to the root node.
+   */
+  id: _propTypes.default.string,
+
+  /**
+   * Class names to be applied.
+   */
+  className: _propTypes.default.string,
+
+  /**
+   * A Jss Object used to override or extend the styles applied to the Radio button.
+   */
+  classes: _propTypes.default.shape({
+    /**
+     * Style applied to the root of the component.
+     */
+    node: _propTypes.default.string,
+
+    /**
+     * Style applied to the content.
+     */
+    content: _propTypes.default.string,
+
+    /**
+     * Style applied to the group.
+     */
+    group: _propTypes.default.string,
+
+    /**
+     * Style applied when item is disabled.
+     */
+    disabled: _propTypes.default.string,
+
+    /**
+     * Style applied when item is expandable.
+     */
+    expandable: _propTypes.default.string,
+
+    /**
+     * Style applied when item is collapsed.
+     */
+    collapsed: _propTypes.default.string,
+
+    /**
+     * Style applied when item is expanded.
+     */
+    expanded: _propTypes.default.string,
+
+    /**
+     * Style applied when item is selectable.
+     */
+    selectable: _propTypes.default.string,
+
+    /**
+     * Style applied when item is unselectable.
+     */
+    unselectable: _propTypes.default.string,
+
+    /**
+     * Style applied when item is selected.
+     */
+    selected: _propTypes.default.string,
+
+    /**
+     * Style applied when item is unselectable.
+     */
+    unselected: _propTypes.default.string,
+
+    /**
+     * Style applied when item is focused.
+     */
+    focused: _propTypes.default.string
+  }).isRequired,
+
+  /**
+   * Is the node disabled.
+   */
+  disabled: _propTypes.default.bool,
+
+  /**
+   * Can the node be selected.
+   */
+  selectable: _propTypes.default.bool,
+
+  /**
+   * The id of the node.
+   */
+  nodeId: _propTypes.default.string.isRequired,
+
+  /**
+   * The icon to display next to the node's label.
+   */
+  icon: _propTypes.default.node,
+
+  /**
+   * The item label.
+   */
+  label: _propTypes.default.node.isRequired,
+
+  /**
+   * The node payload.
+   */
+  // eslint-disable-next-line react/forbid-prop-types
+  payload: _propTypes.default.any,
+
+  /**
+   * @ignore
+   */
+  onClick: _propTypes.default.func,
+
+  /**
+   * @ignore
+   */
+  onMouseDown: _propTypes.default.func,
+
+  /**
+   * @ignore
+   */
+  onFocus: _propTypes.default.func,
+
+  /**
+   * The content of the component.
+   */
+  children: _propTypes.default.node
+};
+
+var _default = (0, _core.withStyles)(_styles.default, {
+  name: "HvVerticalNavigationTreeViewItem"
+})(TreeViewItem);
+
+exports.default = _default;
+//# sourceMappingURL=TreeViewItem.js.map

package/dist/VerticalNavigation/TreeView/TreeViewItem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/VerticalNavigation/TreeView/TreeViewItem.js"],"names":["preventSelection","event","disabled","shiftKey","ctrlKey","metaKey","preventDefault","TreeViewItem","React","forwardRef","props","ref","idProp","id","className","classes","disabledProp","selectableProp","selectable","nodeId","icon","label","payload","onClick","onMouseDown","onFocus","children","others","treeViewControlContext","TreeViewControlContext","TreeViewStateContext","isExpanded","isSelected","isFocused","isDisabled","treeId","mode","collapsible","toggleExpansion","multiSelect","selectNode","selectRange","disabledItemsFocusable","registerNode","unregisterNode","mapFirstChar","unMapFirstChar","focus","treeviewMode","treeitemElement","setTreeitemElement","contentRef","handleRef","descendant","element","index","parentId","level","expandable","Boolean","Array","isArray","length","expanded","focused","selected","idAttribute","undefined","current","textContent","substring","toLowerCase","ariaSelected","handleFocus","target","currentTarget","ownerDocument","document","getElementById","preventScroll","unfocusable","handleExpansion","multiple","handleSelection","end","handleMouseDown","handleClick","handleKeyDown","isEventHandled","key","altKey","stopPropagation","renderedContent","content","paddingLeft","role","tabIndex","onKeyDown","renderedChildren","group","node","unselected","unselectable","collapsed","propTypes","PropTypes","string","shape","isRequired","bool","any","func","styles","name"],"mappings":"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","sourcesContent":["import React, { useCallback, useContext, useEffect, useMemo, useRef, useState } from \"react\";\nimport clsx from \"clsx\";\nimport PropTypes from \"prop-types\";\nimport { withStyles } from \"@material-ui/core\";\n\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport HvTypography from \"../../Typography\";\n\nimport { TreeViewControlContext, TreeViewStateContext } from \"./TreeViewContexts\";\n\nimport { setId, useForkRef } from \"../../utils\";\n\nimport { DescendantProvider, useDescendant } from \"./descendants\";\n\nimport styles from \"./styles\";\n\nconst preventSelection = (event, disabled) => {\n  if (event.shiftKey || event.ctrlKey || event.metaKey || disabled) {\n    // Prevent text selection\n    event.preventDefault();\n  }\n};\n\nconst TreeViewItem = React.forwardRef((props, 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    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 } = 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 = 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(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 { index, parentId, level } = useDescendant(descendant);\n\n  const expandable = collapsible && Boolean(Array.isArray(children) ? children.length : 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 = 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 (mapFirstChar && unMapFirstChar && label) {\n      mapFirstChar(nodeId, contentRef.current.textContent.substring(0, 1).toLowerCase());\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 (!focused && event.currentTarget === event.target && !unfocusable) {\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) {\n          focus(event, nodeId);\n        }\n\n        const multiple = 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(nodeId))) {\n          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) {\n          focus(event, nodeId);\n        }\n\n        const multiple = multiSelect && (event.shiftKey || event.ctrlKey || event.metaKey);\n\n        if (multiple) {\n          if (event.shiftKey) {\n            selectRange(event, { end: nodeId });\n          } else {\n            selectNode(event, nodeId, true);\n          }\n        } else {\n          selectNode(event, nodeId);\n        }\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    [disabled, expandable, handleExpansion, handleSelection, onClick, selectable]\n  );\n\n  const handleKeyDown = useCallback(\n    (event) => {\n      let isEventHandled = false;\n      const { key } = event;\n\n      if (event.altKey || event.ctrlKey || event.metaKey || event.currentTarget !== event.target) {\n        return;\n      }\n      if (contentRef.current === event.currentTarget) {\n        if (key === \"Enter\" || key === \" \") {\n          if (expandable) {\n            isEventHandled = handleExpansion(event);\n          }\n\n          if (selectable) {\n            isEventHandled = handleSelection(event);\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      <HvTypography\n        id={setId(id, \"button\")}\n        component=\"div\"\n        innerRef={contentRef}\n        className={classes.content}\n        onClick={handleClick}\n        onMouseDown={handleMouseDown}\n        style={{\n          paddingLeft: (expandable || icon != null ? 0 : 10) + 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        {expandable && (expanded ? <DropUpXS /> : <DropDownXS />)}\n        {icon}\n        {label}\n      </HvTypography>\n    ),\n    [\n      id,\n      classes.content,\n      handleClick,\n      handleMouseDown,\n      expandable,\n      level,\n      collapsible,\n      treeviewMode,\n      handleFocus,\n      handleKeyDown,\n      selectable,\n      selected,\n      expanded,\n      icon,\n      label,\n    ]\n  );\n\n  const renderedChildren = useMemo(\n    () =>\n      children && (\n        <ul\n          id={setId(id, \"group\")}\n          className={classes.group}\n          role={treeviewMode ? \"group\" : undefined}\n        >\n          {children}\n        </ul>\n      ),\n    [children, classes.group, id, treeviewMode]\n  );\n\n  return (\n    <li\n      ref={handleRef}\n      id={id}\n      className={clsx(classes.node, className, {\n        [classes.disabled]: disabled,\n        [classes.expandable]: expandable,\n        [classes.collapsed]: expandable && !expanded,\n        [classes.expanded]: expandable && expanded,\n        [classes.selectable]: !disabled && selectable,\n        [classes.unselectable]: !disabled && !selectable,\n        [classes.selected]: !disabled && selectable && selected,\n        [classes.unselected]: !disabled && selectable && !selected,\n        [classes.focused]: focused,\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      <DescendantProvider id={nodeId} level={level + 1}>\n        {renderedChildren}\n      </DescendantProvider>\n    </li>\n  );\n});\n\nTreeViewItem.propTypes = {\n  /**\n   * Id to be applied to the root node.\n   */\n  id: PropTypes.string,\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied to the Radio button.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Style applied to the root of the component.\n     */\n    node: PropTypes.string,\n    /**\n     * Style applied to the content.\n     */\n    content: PropTypes.string,\n    /**\n     * Style applied to the group.\n     */\n    group: PropTypes.string,\n    /**\n     * Style applied when item is disabled.\n     */\n    disabled: PropTypes.string,\n    /**\n     * Style applied when item is expandable.\n     */\n    expandable: PropTypes.string,\n    /**\n     * Style applied when item is collapsed.\n     */\n    collapsed: PropTypes.string,\n    /**\n     * Style applied when item is expanded.\n     */\n    expanded: PropTypes.string,\n    /**\n     * Style applied when item is selectable.\n     */\n    selectable: PropTypes.string,\n    /**\n     * Style applied when item is unselectable.\n     */\n    unselectable: PropTypes.string,\n    /**\n     * Style applied when item is selected.\n     */\n    selected: PropTypes.string,\n    /**\n     * Style applied when item is unselectable.\n     */\n    unselected: PropTypes.string,\n    /**\n     * Style applied when item is focused.\n     */\n    focused: PropTypes.string,\n  }).isRequired,\n  /**\n   * Is the node disabled.\n   */\n  disabled: PropTypes.bool,\n  /**\n   * Can the node be selected.\n   */\n  selectable: PropTypes.bool,\n  /**\n   * The id of the node.\n   */\n  nodeId: PropTypes.string.isRequired,\n  /**\n   * The icon to display next to the node's label.\n   */\n  icon: PropTypes.node,\n  /**\n   * The item label.\n   */\n  label: PropTypes.node.isRequired,\n  /**\n   * The node payload.\n   */\n  // eslint-disable-next-line react/forbid-prop-types\n  payload: PropTypes.any,\n  /**\n   * @ignore\n   */\n  onClick: PropTypes.func,\n  /**\n   * @ignore\n   */\n  onMouseDown: PropTypes.func,\n  /**\n   * @ignore\n   */\n  onFocus: PropTypes.func,\n  /**\n   * The content of the component.\n   */\n  children: PropTypes.node,\n};\n\nexport default withStyles(styles, {\n  name: \"HvVerticalNavigationTreeViewItem\",\n})(TreeViewItem);\n"],"file":"TreeViewItem.js"}