@hitachivantara/uikit-react-core 3.52.5

package/dist/VerticalNavigation/Navigation/Navigation.d.ts

@@ -0,0 +1,107 @@
+import React, { MouseEvent } from "react";
+import { StandardProps } from "@material-ui/core";
+
+export interface NavigationData {
+  /**
+   * the id to be applied to the root element.
+   */
+  id: string;
+  /**
+   * the label to be rendered on the menu item.
+   */
+  label: string;
+  /**
+   * Icon to be render.
+   */
+  icon?: React.ReactNode;
+  /**
+   * Data subset.
+   */
+  data?: NavigationData[];
+  /**
+   * Any other properties.
+   */
+  [otherProperty: string]: any;
+}
+
+export type HvNavigationClassKey = "root" | "list" | "listItem";
+
+export interface HvVerticalNavigationNavigationProps
+  extends StandardProps<
+    React.HTMLAttributes<HTMLElement>,
+    HvNavigationClassKey,
+    "onClick" | "onChange"
+  > {
+  /**
+   * Modus operandi (role) of the widget instance.
+   */
+  mode?: "treeview" | "navigation";
+  /**
+   * Can non-leaf nodes be collapsed / expanded.
+   */
+  collapsible?: boolean;
+
+  /**
+   * The ID of the selected page.
+   */
+  selected?: string;
+  /**
+   * When uncontrolled, defines the initial selected page ID.
+   */
+  defaultSelected?: string;
+  /**
+   * Callback fired when a navigation item is selected.
+   *
+   * @param {object} event The event source of the callback.
+   * @param {object} page The data of the selected page.
+   */
+  onChange?: (event: React.SyntheticEvent, selectedItem: NavigationData) => void;
+
+  /**
+   * Expanded nodes' ids.
+   */
+  expanded?: string[];
+  /**
+   * When uncontrolled, defines the initial expanded nodes' ids.
+   *
+   * It also supports `true` for starting with all nodes expanded.
+   * With `false` all nodes will be collapsed.
+   *
+   * By default it expands the needed nodes to display the current selection, if any.
+   */
+  defaultExpanded?: string[] | boolean;
+  /**
+   * Callback fired when tree items are expanded/collapsed.
+   *
+   * @param {object} event The event source of the callback.
+   * @param {array} nodeIds The ids of the expanded nodes.
+   */
+  onToggle?: (event: React.SyntheticEvent, nodeIds: string[]) => void;
+
+  /**
+   * An array containing the data for each menu item.
+   *
+   * id - the id to be applied to the root element.
+   * label - the label to be rendered on the menu item.
+   * data - sub-menu items
+   */
+  data: NavigationData[];
+
+  /**
+   * Callback triggered when any item is clicked.
+   *
+   *  @deprecated use `onChange` for selection and `onToggle` for node expansion/collapse.
+   */
+  onClick?: (event: MouseEvent, selectedItem: NavigationData) => void;
+
+  /**
+   * The root element (nav) aria label.
+   *
+   *  @deprecated Use directly the `aria-label` property instead.
+   */
+  label?: string;
+}
+
+export default function HvVerticalNavigationNavigation(
+  props: HvVerticalNavigationNavigationProps
+): JSX.Element | null;

package/dist/VerticalNavigation/Navigation/Navigation.js

@@ -0,0 +1,338 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.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;
+
+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 _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
+require("core-js/modules/es.array.map.js");
+
+require("core-js/modules/es.array.filter.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.array.flat-map.js");
+
+require("core-js/modules/es.array.unscopables.flat-map.js");
+
+require("core-js/modules/es.array.concat.js");
+
+require("core-js/modules/es.array.slice.js");
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _core = require("@material-ui/core");
+
+var _clsx = _interopRequireDefault(require("clsx"));
+
+var _TreeView = _interopRequireWildcard(require("../TreeView"));
+
+var _utils = require("../../utils");
+
+var _styles = _interopRequireDefault(require("./styles"));
+
+var _utils2 = require("../../List/utils");
+
+var _excluded = ["id", "className", "classes", "data", "mode", "collapsible", "expanded", "defaultExpanded", "onToggle", "selected", "defaultSelected", "onChange", "label", "onClick"];
+
+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 createListHierarchy = function createListHierarchy(items, id, classes) {
+  return items.map(function (item) {
+    var itemId = item.id,
+        itemLabel = item.label,
+        icon = item.icon,
+        children = item.data,
+        selectable = item.selectable;
+    var ItemText = (0, _utils2.wrapperTooltip)(true, itemLabel, itemLabel);
+    return /*#__PURE__*/_react.default.createElement(_TreeView.TreeViewItem, {
+      id: (0, _utils.setId)(id, itemId),
+      className: classes.listItem,
+      key: itemId,
+      nodeId: itemId,
+      label: /*#__PURE__*/_react.default.createElement(ItemText, null),
+      icon: icon,
+      payload: item,
+      selectable: selectable
+    }, children ? createListHierarchy(children, id, classes) : undefined);
+  });
+};
+
+var getAllParents = function getAllParents(items) {
+  var parents = items.filter(function (item) {
+    return item.data != null && item.data.length > 0;
+  });
+  var childParents = parents.flatMap(function (item) {
+    return getAllParents(item.data);
+  });
+  return [].concat((0, _toConsumableArray2.default)(parents), (0, _toConsumableArray2.default)(childParents));
+};
+
+function pathToElement(data, targetId) {
+  var path = [];
+
+  if (data != null && data.length > 0) {
+    // eslint-disable-next-line no-plusplus
+    for (var i = 0; i !== data.length; ++i) {
+      var item = data[i];
+
+      if (item.id === targetId) {
+        path.push(item.id);
+        break;
+      }
+
+      var subPaths = pathToElement(item.data, targetId);
+
+      if (subPaths.length > 0) {
+        path.push(item.id);
+        path.push.apply(path, (0, _toConsumableArray2.default)(subPaths));
+        break;
+      }
+    }
+  }
+
+  return path;
+}
+
+var Navigation = function Navigation(_ref) {
+  var id = _ref.id,
+      className = _ref.className,
+      classes = _ref.classes,
+      data = _ref.data,
+      _ref$mode = _ref.mode,
+      mode = _ref$mode === void 0 ? "navigation" : _ref$mode,
+      _ref$collapsible = _ref.collapsible,
+      collapsible = _ref$collapsible === void 0 ? false : _ref$collapsible,
+      expandedProp = _ref.expanded,
+      defaultExpanded = _ref.defaultExpanded,
+      onToggle = _ref.onToggle,
+      selectedProp = _ref.selected,
+      defaultSelected = _ref.defaultSelected,
+      onChange = _ref.onChange,
+      label = _ref.label,
+      onClick = _ref.onClick,
+      others = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+
+  var _useControlled = (0, _utils.useControlled)(selectedProp, defaultSelected),
+      _useControlled2 = (0, _slicedToArray2.default)(_useControlled, 2),
+      selected = _useControlled2[0],
+      setSelected = _useControlled2[1];
+
+  var _useControlled3 = (0, _utils.useControlled)(expandedProp, function () {
+    if (defaultExpanded === true) {
+      // all parent nodes will be expanded by default
+      return getAllParents(data).map(function (item) {
+        return item.id;
+      });
+    }
+
+    if (defaultExpanded === false) {
+      // all parent nodes will be collapsed by default
+      return [];
+    }
+
+    if (defaultExpanded == null) {
+      if (selected != null) {
+        // the path to the selected node will be expanded (default behaviour)
+        var path = pathToElement(data, selected);
+        return path.slice(0, -1);
+      } // nothing is expanded
+
+
+      // nothing is expanded
+      return [];
+    }
+
+    return defaultExpanded;
+  }),
+      _useControlled4 = (0, _slicedToArray2.default)(_useControlled3, 2),
+      expanded = _useControlled4[0],
+      setExpanded = _useControlled4[1];
+
+  var handleChange = (0, _react.useCallback)(function (event, selectedId, selectedItem) {
+    setSelected(selectedId);
+
+    if (onChange) {
+      onChange(event, selectedItem);
+    } // deprecated
+
+
+    if (onClick) {
+      onClick(event, selectedItem);
+    }
+  }, [onChange, onClick, setSelected]);
+  var handleToggle = (0, _react.useCallback)(function (event, newExpanded) {
+    setExpanded(newExpanded);
+
+    if (onToggle) {
+      onToggle(event, newExpanded);
+    } // deprecated
+
+
+    if (onClick) {
+      onClick(event);
+    }
+  }, [onClick, onToggle, setExpanded]);
+  var children = (0, _react.useMemo)(function () {
+    return data && createListHierarchy(data, id, classes);
+  }, [classes, data, id]);
+  return /*#__PURE__*/_react.default.createElement("nav", (0, _extends2.default)({
+    id: id,
+    className: (0, _clsx.default)(className, classes.root),
+    "aria-label": label
+  }, others), /*#__PURE__*/_react.default.createElement(_TreeView.default, {
+    id: (0, _utils.setId)(id, "tree"),
+    className: classes.list,
+    selectable: true,
+    mode: mode,
+    collapsible: collapsible,
+    selected: selected,
+    onChange: handleChange,
+    expanded: expanded,
+    onToggle: handleToggle
+  }, children));
+};
+
+Navigation.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.
+   */
+  classes: _propTypes.default.shape({
+    /**
+     * Style applied to the root element.
+     */
+    root: _propTypes.default.string,
+
+    /**
+     * Style applied to the list.
+     */
+    list: _propTypes.default.string,
+
+    /**
+     * Style applied to the list items.
+     */
+    listItem: _propTypes.default.string
+  }).isRequired,
+
+  /**
+   * Modus operandi (role) of the widget instance.
+   */
+  mode: _propTypes.default.oneOf(["treeview", "navigation"]),
+
+  /**
+   * Can non-leaf nodes be collapsed / expanded.
+   */
+  collapsible: _propTypes.default.bool,
+
+  /**
+   * The ID of the selected page.
+   */
+  selected: _propTypes.default.string,
+
+  /**
+   * When uncontrolled, defines the initial selected page ID.
+   */
+  defaultSelected: _propTypes.default.string,
+
+  /**
+   * Callback fired when a navigation item is selected.
+   *
+   * @param {object} event The event source of the callback.
+   * @param {object} page The data of the selected page.
+   */
+  onChange: _propTypes.default.func,
+
+  /**
+   * Expanded nodes' ids.
+   */
+  expanded: _propTypes.default.arrayOf(_propTypes.default.string),
+
+  /**
+   * When uncontrolled, defines the initial expanded nodes' ids.
+   *
+   * It also supports `true` for starting with all nodes expanded.
+   * With `false` all nodes will be collapsed.
+   *
+   * By default it expands the needed nodes to display the current selection, if any.
+   */
+  defaultExpanded: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.string), _propTypes.default.bool]),
+
+  /**
+   * Callback fired when tree items are expanded/collapsed.
+   *
+   * @param {object} event The event source of the callback.
+   * @param {array} nodeIds The ids of the expanded nodes (old and new).
+   */
+  onToggle: _propTypes.default.func,
+
+  /**
+   * An array containing the data for each menu item.
+   *
+   * id - the id to be applied to the root element.
+   * label - the label to be rendered on the menu item.
+   * data - sub-menu items
+   */
+  data: _propTypes.default.arrayOf(_propTypes.default.shape({
+    id: _propTypes.default.string.isRequired,
+    label: _propTypes.default.string.isRequired,
+    icon: _propTypes.default.node,
+    data: _propTypes.default.array
+  })).isRequired,
+
+  /**
+   * Callback triggered when any item is clicked.
+   *
+   *  @deprecated use `onChange` for selection and `onToggle` for node expansion/collapse.
+   */
+  onClick: (0, _core.deprecatedPropType)(_propTypes.default.func),
+
+  /**
+   * The root element (nav) aria label.
+   *
+   *  @deprecated Use directly the `aria-label` property instead.
+   */
+  label: (0, _core.deprecatedPropType)(_propTypes.default.string)
+};
+
+var _default = (0, _core.withStyles)(_styles.default, {
+  name: "HvVerticalNavigationNavigation"
+})(Navigation);
+
+exports.default = _default;
+//# sourceMappingURL=Navigation.js.map

package/dist/VerticalNavigation/Navigation/Navigation.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/VerticalNavigation/Navigation/Navigation.js"],"names":["createListHierarchy","items","id","classes","map","item","itemId","itemLabel","label","icon","children","data","selectable","ItemText","listItem","undefined","getAllParents","parents","filter","length","childParents","flatMap","pathToElement","targetId","path","i","push","subPaths","Navigation","className","mode","collapsible","expandedProp","expanded","defaultExpanded","onToggle","selectedProp","selected","defaultSelected","onChange","onClick","others","setSelected","slice","setExpanded","handleChange","event","selectedId","selectedItem","handleToggle","newExpanded","root","list","propTypes","PropTypes","string","shape","isRequired","oneOf","bool","func","arrayOf","oneOfType","node","array","styles","name"],"mappings":"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","sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport PropTypes from \"prop-types\";\nimport { deprecatedPropType, withStyles } from \"@material-ui/core\";\nimport clsx from \"clsx\";\nimport TreeView, { TreeViewItem } from \"../TreeView\";\nimport { setId, useControlled } from \"../../utils\";\nimport styles from \"./styles\";\nimport { wrapperTooltip } from \"../../List/utils\";\n\nconst createListHierarchy = (items, id, classes) =>\n  items.map((item) => {\n    const { id: itemId, label: itemLabel, icon, data: children, selectable } = item;\n\n    const ItemText = wrapperTooltip(true, itemLabel, itemLabel);\n\n    return (\n      <TreeViewItem\n        id={setId(id, itemId)}\n        className={classes.listItem}\n        key={itemId}\n        nodeId={itemId}\n        label={<ItemText />}\n        icon={icon}\n        payload={item}\n        selectable={selectable}\n      >\n        {children ? createListHierarchy(children, id, classes) : undefined}\n      </TreeViewItem>\n    );\n  });\n\nconst getAllParents = (items) => {\n  const parents = items.filter((item) => item.data != null && item.data.length > 0);\n  const childParents = parents.flatMap((item) => getAllParents(item.data));\n\n  return [...parents, ...childParents];\n};\n\nfunction pathToElement(data, targetId) {\n  const path = [];\n\n  if (data != null && data.length > 0) {\n    // eslint-disable-next-line no-plusplus\n    for (let i = 0; i !== data.length; ++i) {\n      const item = data[i];\n      if (item.id === targetId) {\n        path.push(item.id);\n        break;\n      }\n\n      const subPaths = pathToElement(item.data, targetId);\n      if (subPaths.length > 0) {\n        path.push(item.id);\n        path.push(...subPaths);\n        break;\n      }\n    }\n  }\n\n  return path;\n}\n\nconst Navigation = ({\n  id,\n\n  className,\n  classes,\n\n  data,\n\n  mode = \"navigation\",\n\n  collapsible = false,\n  expanded: expandedProp,\n  defaultExpanded,\n  onToggle,\n\n  selected: selectedProp,\n  defaultSelected,\n  onChange,\n\n  label,\n  onClick,\n\n  ...others\n}) => {\n  const [selected, setSelected] = useControlled(selectedProp, defaultSelected);\n  const [expanded, setExpanded] = useControlled(expandedProp, () => {\n    if (defaultExpanded === true) {\n      // all parent nodes will be expanded by default\n      return getAllParents(data).map((item) => item.id);\n    }\n\n    if (defaultExpanded === false) {\n      // all parent nodes will be collapsed by default\n      return [];\n    }\n\n    if (defaultExpanded == null) {\n      if (selected != null) {\n        // the path to the selected node will be expanded (default behaviour)\n        const path = pathToElement(data, selected);\n        return path.slice(0, -1);\n      }\n\n      // nothing is expanded\n      return [];\n    }\n\n    return defaultExpanded;\n  });\n\n  const handleChange = useCallback(\n    (event, selectedId, selectedItem) => {\n      setSelected(selectedId);\n\n      if (onChange) {\n        onChange(event, selectedItem);\n      }\n\n      // deprecated\n      if (onClick) {\n        onClick(event, selectedItem);\n      }\n    },\n    [onChange, onClick, setSelected]\n  );\n\n  const handleToggle = useCallback(\n    (event, newExpanded) => {\n      setExpanded(newExpanded);\n\n      if (onToggle) {\n        onToggle(event, newExpanded);\n      }\n\n      // deprecated\n      if (onClick) {\n        onClick(event);\n      }\n    },\n    [onClick, onToggle, setExpanded]\n  );\n\n  const children = useMemo(\n    () => data && createListHierarchy(data, id, classes),\n    [classes, data, id]\n  );\n\n  return (\n    <nav id={id} className={clsx(className, classes.root)} aria-label={label} {...others}>\n      <TreeView\n        id={setId(id, \"tree\")}\n        className={classes.list}\n        selectable\n        mode={mode}\n        collapsible={collapsible}\n        selected={selected}\n        onChange={handleChange}\n        expanded={expanded}\n        onToggle={handleToggle}\n      >\n        {children}\n      </TreeView>\n    </nav>\n  );\n};\n\nNavigation.propTypes = {\n  /**\n   * Id to be applied to the root node.\n   */\n  id: PropTypes.string,\n\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.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Style applied to the root element.\n     */\n    root: PropTypes.string,\n    /**\n     * Style applied to the list.\n     */\n    list: PropTypes.string,\n    /**\n     * Style applied to the list items.\n     */\n    listItem: PropTypes.string,\n  }).isRequired,\n\n  /**\n   * Modus operandi (role) of the widget instance.\n   */\n  mode: PropTypes.oneOf([\"treeview\", \"navigation\"]),\n  /**\n   * Can non-leaf nodes be collapsed / expanded.\n   */\n  collapsible: PropTypes.bool,\n\n  /**\n   * The ID of the selected page.\n   */\n  selected: PropTypes.string,\n  /**\n   * When uncontrolled, defines the initial selected page ID.\n   */\n  defaultSelected: PropTypes.string,\n  /**\n   * Callback fired when a navigation item is selected.\n   *\n   * @param {object} event The event source of the callback.\n   * @param {object} page The data of the selected page.\n   */\n  onChange: PropTypes.func,\n\n  /**\n   * Expanded nodes' ids.\n   */\n  expanded: PropTypes.arrayOf(PropTypes.string),\n  /**\n   * When uncontrolled, defines the initial expanded nodes' ids.\n   *\n   * It also supports `true` for starting with all nodes expanded.\n   * With `false` all nodes will be collapsed.\n   *\n   * By default it expands the needed nodes to display the current selection, if any.\n   */\n  defaultExpanded: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string), PropTypes.bool]),\n  /**\n   * Callback fired when tree items are expanded/collapsed.\n   *\n   * @param {object} event The event source of the callback.\n   * @param {array} nodeIds The ids of the expanded nodes (old and new).\n   */\n  onToggle: PropTypes.func,\n\n  /**\n   * An array containing the data for each menu item.\n   *\n   * id - the id to be applied to the root element.\n   * label - the label to be rendered on the menu item.\n   * data - sub-menu items\n   */\n  data: PropTypes.arrayOf(\n    PropTypes.shape({\n      id: PropTypes.string.isRequired,\n      label: PropTypes.string.isRequired,\n      icon: PropTypes.node,\n      data: PropTypes.array,\n    })\n  ).isRequired,\n\n  /**\n   * Callback triggered when any item is clicked.\n   *\n   *  @deprecated use `onChange` for selection and `onToggle` for node expansion/collapse.\n   */\n  onClick: deprecatedPropType(PropTypes.func),\n  /**\n   * The root element (nav) aria label.\n   *\n   *  @deprecated Use directly the `aria-label` property instead.\n   */\n  label: deprecatedPropType(PropTypes.string),\n};\n\nexport default withStyles(styles, { name: \"HvVerticalNavigationNavigation\" })(Navigation);\n"],"file":"Navigation.js"}

package/dist/VerticalNavigation/Navigation/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./Navigation";
+export * from "./Navigation";

package/dist/VerticalNavigation/Navigation/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _Navigation.default;
+  }
+});
+
+var _Navigation = _interopRequireDefault(require("./Navigation"));
+//# sourceMappingURL=index.js.map

package/dist/VerticalNavigation/Navigation/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/VerticalNavigation/Navigation/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA","sourcesContent":["export { default } from \"./Navigation\";\n"],"file":"index.js"}

package/dist/VerticalNavigation/Navigation/styles.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var styles = function styles(theme) {
+  return {
+    root: {
+      display: "block",
+      background: theme.hv.palette.atmosphere.atmo1,
+      overflowY: "auto"
+    },
+    list: {},
+    listItem: {}
+  };
+};
+
+var _default = styles;
+exports.default = _default;
+//# sourceMappingURL=styles.js.map

package/dist/VerticalNavigation/Navigation/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/VerticalNavigation/Navigation/styles.js"],"names":["styles","theme","root","display","background","hv","palette","atmosphere","atmo1","overflowY","list","listItem"],"mappings":";;;;;;;AAAA,IAAMA,MAAM,GAAG,SAATA,MAAS,CAACC,KAAD;AAAA,SAAY;AACzBC,IAAAA,IAAI,EAAE;AACJC,MAAAA,OAAO,EAAE,OADL;AAEJC,MAAAA,UAAU,EAAEH,KAAK,CAACI,EAAN,CAASC,OAAT,CAAiBC,UAAjB,CAA4BC,KAFpC;AAIJC,MAAAA,SAAS,EAAE;AAJP,KADmB;AAOzBC,IAAAA,IAAI,EAAE,EAPmB;AAQzBC,IAAAA,QAAQ,EAAE;AARe,GAAZ;AAAA,CAAf;;eAWeX,M","sourcesContent":["const styles = (theme) => ({\n  root: {\n    display: \"block\",\n    background: theme.hv.palette.atmosphere.atmo1,\n\n    overflowY: \"auto\",\n  },\n  list: {},\n  listItem: {},\n});\n\nexport default styles;\n"],"file":"styles.js"}

package/dist/VerticalNavigation/TreeView/TreeView.d.ts

@@ -0,0 +1,111 @@
+import * as React from "react";
+import { StandardProps } from "@material-ui/core";
+
+export type HvVerticalNavigationTreeViewClassKey = "root";
+
+export interface HvVerticalNavigationTreeViewPropsBase
+  extends StandardProps<
+    React.HTMLAttributes<HTMLUListElement>,
+    HvVerticalNavigationTreeViewClassKey,
+    "onChange"
+  > {
+  /**
+   * Modus operandi (role) of the widget instance.
+   */
+  mode?: "treeview" | "navigation";
+  /**
+   * Enables selection.
+   * @default false
+   */
+  selectable?: boolean;
+  /**
+   * Can non-leaf nodes be collapsed / expanded.
+   */
+  collapsible?: boolean;
+  /**
+   * Expanded nodes' ids.
+   */
+  expanded?: string[];
+  /**
+   * When uncontrolled, defines the initial expanded nodes' ids.
+   * @default []
+   */
+  defaultExpanded?: string[];
+  /**
+   * Callback fired when tree items are expanded/collapsed.
+   *
+   * @param {object} event The event source of the callback.
+   * @param {array} nodeIds The ids of the expanded nodes.
+   */
+  onToggle?: (event: React.SyntheticEvent, nodeIds: string[]) => void;
+  /**
+   * If `true`, will allow focus on disabled items.
+   * @default false
+   */
+  disabledItemsFocusable?: boolean;
+}
+
+interface MultiSelectTreeViewProps extends HvVerticalNavigationTreeViewPropsBase {
+  /**
+   * The selected nodes' ids.
+   *
+   * When `multiSelect` is true this takes an array of strings; when false (default) a string.
+   */
+  selected?: string[];
+  /**
+   * When uncontrolled, defines the initial selected nodes' ids.
+   *
+   * When `multiSelect` is true this takes an array of strings; when false (default) a string.
+   * @default []
+   */
+  defaultSelected?: string[];
+  /**
+   * Enables the simultaneous selection of multiple items.
+   * @default false
+   */
+  multiSelect?: true;
+  /**
+   * Callback fired when tree items are selected/unselected.
+   *
+   * @param {object} event The event source of the callback
+   * @param {(array|string)} value of the selected nodes. When `multiSelect` is true
+   * this is an array of strings; when false (default) a string.
+   */
+  onChange?: (event: React.SyntheticEvent, nodeIds: string[]) => void;
+}
+
+interface SingleSelectTreeViewProps extends HvVerticalNavigationTreeViewPropsBase {
+  /**
+   * The selected nodes' ids.
+   *
+   * When `multiSelect` is true this takes an array of strings; when false (default) a string.
+   */
+  selected?: string;
+  /**
+   * When uncontrolled, defines the initial selected nodes' ids.
+   *
+   * When `multiSelect` is true this takes an array of strings; when false (default) a string.
+   */
+  defaultSelected?: string;
+  /**
+   * Enables the simultaneous selection of multiple items.
+   * @default false
+   */
+  multiSelect?: false;
+  /**
+   * Callback fired when tree items are selected/unselected.
+   *
+   * @param {object} event The event source of the callback
+   * @param {(array|string)} value of the selected nodes. When `multiSelect` is true
+   * this is an array of strings; when false (default) a string.
+   */
+  onChange?: (event: React.SyntheticEvent, nodeIds: string) => void;
+}
+
+export type HvVerticalNavigationTreeViewProps =
+  | SingleSelectTreeViewProps
+  | MultiSelectTreeViewProps;
+
+export default function HvVerticalNavigationTreeView(
+  props: HvVerticalNavigationTreeViewProps
+): JSX.Element | null;