@elliemae/ds-left-navigation 2.2.0-alpha.1 → 2.2.0-alpha.5

package/cjs/configs/useLeftNavConfig.js

@@ -1,98 +1,102 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-require('core-js/modules/web.dom-collections.iterator.js');
-var React = require('react');
-var useLeftNavItems = require('./useLeftNavItems.js');
-var useLeftNavSmoothExpand = require('./useLeftNavSmoothExpand.js');
-var useSelectFirstBodyItem = require('../hooks/useSelectFirstBodyItem.js');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
-const useLeftNavConfig = props => {
-  const {
-    expanded,
-    openedItem,
-    onSelectedChange,
-    onFocusChange,
-    items
-  } = props; // -----------------------------------------------------------------------------
-  // ************************** ------------ **************************
-  // *                         INTERNAL STATE                         *
-  // ************************** ------------ **************************
-  // Selection related
-
-  const [selectedItem, setSelectedItem] = React__default["default"].useState(null);
-  React__default["default"].useState(null);
-  const [selectedParent, setSelectedParent] = React__default["default"].useState(null); // Focus related
-
-  const [focusedItem, setFocusedItem] = React__default["default"].useState(null); // Opened uncontrolled drilldowns
-
-  const [openedDrilldowns, setOpenedDrilldowns] = React__default["default"].useState([]); // -----------------------------------------------------------------------------
-  // ************************** ------------ **************************
-  // *                        EXPAND ANIMATION                        *
-  // ************************** ------------ **************************
-
-  const [expandedForAnimation, setExpandedForAnimation] = React__default["default"].useState(expanded);
-  const timeoutRef = React__default["default"].useRef(null);
-  const smoothExpandOpts = React__default["default"].useMemo(() => ({
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var useLeftNavConfig_exports = {};
+__export(useLeftNavConfig_exports, {
+  default: () => useLeftNavConfig_default,
+  useLeftNavConfig: () => useLeftNavConfig
+});
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_useLeftNavItems = __toESM(require("./useLeftNavItems"));
+var import_useLeftNavSmoothExpand = require("./useLeftNavSmoothExpand");
+var import_useSelectFirstBodyItem = require("../hooks/useSelectFirstBodyItem");
+const useLeftNavConfig = (props) => {
+  const { expanded, openedItem, onSelectedChange, onFocusChange, items } = props;
+  const [selectedItem, setSelectedItem] = import_react.default.useState(null);
+  const [selectedSubitem, setSelectedSubitem] = import_react.default.useState(null);
+  const [selectedParent, setSelectedParent] = import_react.default.useState(null);
+  const [focusedItem, setFocusedItem] = import_react.default.useState(null);
+  const [openedDrilldowns, setOpenedDrilldowns] = import_react.default.useState([]);
+  const [expandedForAnimation, setExpandedForAnimation] = import_react.default.useState(expanded);
+  const timeoutRef = import_react.default.useRef(null);
+  const smoothExpandOpts = import_react.default.useMemo(() => ({
     expandedForAnimation,
     timeoutRef,
     setExpandedForAnimation
   }), [expandedForAnimation, timeoutRef, setExpandedForAnimation]);
-  useLeftNavSmoothExpand.useLeftNavSmoothExpand(props, smoothExpandOpts); // -----------------------------------------------------------------------------
-  // ************************** ------------ **************************
-  // *                          SIDE EFFECTS                          *
-  // ************************** ------------ **************************
-
-  React__default["default"].useEffect(() => {
+  (0, import_useLeftNavSmoothExpand.useLeftNavSmoothExpand)(props, smoothExpandOpts);
+  import_react.default.useEffect(() => {
     onSelectedChange(selectedItem);
   }, [selectedItem, onSelectedChange]);
-  React__default["default"].useEffect(() => {
-    if (openedItem !== null) setSelectedParent(openedItem);
+  import_react.default.useEffect(() => {
+    if (openedItem !== null)
+      setSelectedParent(openedItem);
   }, [openedItem]);
-  React__default["default"].useEffect(() => {
+  import_react.default.useEffect(() => {
     onFocusChange(focusedItem);
   }, [focusedItem, onFocusChange]);
-  useSelectFirstBodyItem.useSelectFirstBodyItem(items, openedItem, props.selectedItem !== undefined ? props.selectedItem : selectedItem, setSelectedItem, props.disableDefaultSelection); // -----------------------------------------------------------------------------
-  // ************************** ------------ **************************
-  // *                        ITEMS MANAGEMENT                        *
-  // ************************** ------------ **************************
-
-  const leftNavItemsProps = React__default["default"].useMemo(() => ({
+  (0, import_useSelectFirstBodyItem.useSelectFirstBodyItem)(items, openedItem, props.selectedItem !== void 0 ? props.selectedItem : selectedItem, setSelectedItem, props.disableDefaultSelection);
+  const leftNavItemsProps = import_react.default.useMemo(() => ({
     headerItem: props.HeaderComponent,
     bodyHeaderItem: props.BodyHeaderComponent,
     items: props.items,
     openedDrilldowns
-  }), [props.HeaderComponent, props.BodyHeaderComponent, props.items, openedDrilldowns]); // We need to know the current visible items since we have drilldowns
-
-  const {
+  }), [props.HeaderComponent, props.BodyHeaderComponent, props.items, openedDrilldowns]);
+  const { visibleItems, visibleItemsRefs } = (0, import_useLeftNavItems.default)(leftNavItemsProps);
+  const finalConfig = import_react.default.useMemo(() => ({
+    leftNavProps: props,
+    expandedForAnimation,
+    selectedItem: props.selectedItem !== void 0 ? props.selectedItem : selectedItem,
+    setSelectedItem,
+    selectedParent: props.selectedParent !== void 0 ? props.selectedParent : selectedParent,
+    setSelectedParent,
+    focusedItem,
+    setFocusedItem,
+    openedDrilldowns,
+    setOpenedDrilldowns,
     visibleItems,
     visibleItemsRefs
-  } = useLeftNavItems.useLeftNavItems(leftNavItemsProps); // -----------------------------------------------------------------------------
-  // ************************** ------------ **************************
-  // *                         LEFTNAV CONFIG                         *
-  // ************************** ------------ **************************
-
-  const finalConfig = React__default["default"].useMemo(() => ({
-    leftNavProps: props,
+  }), [
+    props,
     expandedForAnimation,
-    selectedItem: props.selectedItem !== undefined ? props.selectedItem : selectedItem,
+    selectedItem,
     setSelectedItem,
-    selectedParent: props.selectedParent !== undefined ? props.selectedParent : selectedParent,
     setSelectedParent,
+    selectedParent,
     focusedItem,
     setFocusedItem,
     openedDrilldowns,
     setOpenedDrilldowns,
     visibleItems,
     visibleItemsRefs
-  }), [props, expandedForAnimation, selectedItem, setSelectedItem, setSelectedParent, selectedParent, focusedItem, setFocusedItem, openedDrilldowns, setOpenedDrilldowns, visibleItems, visibleItemsRefs]);
+  ]);
   return finalConfig;
 };
-
-exports["default"] = useLeftNavConfig;
-exports.useLeftNavConfig = useLeftNavConfig;
+var useLeftNavConfig_default = useLeftNavConfig;
+module.exports = __toCommonJS(useLeftNavConfig_exports);
+//# sourceMappingURL=useLeftNavConfig.js.map

package/cjs/configs/useLeftNavConfig.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/configs/useLeftNavConfig.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React from 'react';\nimport type { LeftNavProps } from '../index.d';\nimport { ContextProps } from '../LeftNavigationContext';\nimport useLeftNavItems from './useLeftNavItems';\nimport { useLeftNavSmoothExpand } from './useLeftNavSmoothExpand';\nimport { useSelectFirstBodyItem } from '../hooks/useSelectFirstBodyItem';\n\nexport const useLeftNavConfig = (props: LeftNavProps): ContextProps => {\n  const { expanded, openedItem, onSelectedChange, onFocusChange, items } = props;\n\n  // -----------------------------------------------------------------------------\n  // ************************** ------------ **************************\n  // *                         INTERNAL STATE                         *\n  // ************************** ------------ **************************\n  // Selection related\n  const [selectedItem, setSelectedItem] = React.useState(null);\n  const [selectedSubitem, setSelectedSubitem] = React.useState(null);\n  const [selectedParent, setSelectedParent] = React.useState(null);\n  // Focus related\n  const [focusedItem, setFocusedItem] = React.useState(null);\n  // Opened uncontrolled drilldowns\n  const [openedDrilldowns, setOpenedDrilldowns] = React.useState<string[]>([]);\n\n  // -----------------------------------------------------------------------------\n  // ************************** ------------ **************************\n  // *                        EXPAND ANIMATION                        *\n  // ************************** ------------ **************************\n  const [expandedForAnimation, setExpandedForAnimation] = React.useState(expanded);\n  const timeoutRef = React.useRef<ReturnType<typeof setTimeout>>(null);\n  const smoothExpandOpts = React.useMemo(\n    () => ({\n      expandedForAnimation,\n      timeoutRef,\n      setExpandedForAnimation,\n    }),\n    [expandedForAnimation, timeoutRef, setExpandedForAnimation],\n  );\n  useLeftNavSmoothExpand(props, smoothExpandOpts);\n\n  // -----------------------------------------------------------------------------\n  // ************************** ------------ **************************\n  // *                          SIDE EFFECTS                          *\n  // ************************** ------------ **************************\n  React.useEffect(() => {\n    onSelectedChange(selectedItem);\n  }, [selectedItem, onSelectedChange]);\n\n  React.useEffect(() => {\n    if (openedItem !== null) setSelectedParent(openedItem);\n  }, [openedItem]);\n\n  React.useEffect(() => {\n    onFocusChange(focusedItem);\n  }, [focusedItem, onFocusChange]);\n\n  useSelectFirstBodyItem(\n    items,\n    openedItem,\n    props.selectedItem !== undefined ? props.selectedItem : selectedItem,\n    setSelectedItem,\n    props.disableDefaultSelection,\n  );\n\n  // -----------------------------------------------------------------------------\n  // ************************** ------------ **************************\n  // *                        ITEMS MANAGEMENT                        *\n  // ************************** ------------ **************************\n\n  const leftNavItemsProps = React.useMemo(\n    () => ({\n      headerItem: props.HeaderComponent,\n      bodyHeaderItem: props.BodyHeaderComponent,\n      items: props.items,\n      openedDrilldowns,\n    }),\n    [props.HeaderComponent, props.BodyHeaderComponent, props.items, openedDrilldowns],\n  );\n\n  // We need to know the current visible items since we have drilldowns\n  const { visibleItems, visibleItemsRefs } = useLeftNavItems(leftNavItemsProps);\n\n  // -----------------------------------------------------------------------------\n  // ************************** ------------ **************************\n  // *                         LEFTNAV CONFIG                         *\n  // ************************** ------------ **************************\n  const finalConfig = React.useMemo(\n    () => ({\n      leftNavProps: props,\n      expandedForAnimation,\n      selectedItem: props.selectedItem !== undefined ? props.selectedItem : selectedItem,\n      setSelectedItem,\n      selectedParent: props.selectedParent !== undefined ? props.selectedParent : selectedParent,\n      setSelectedParent,\n      focusedItem,\n      setFocusedItem,\n      openedDrilldowns,\n      setOpenedDrilldowns,\n      visibleItems,\n      visibleItemsRefs,\n    }),\n    [\n      props,\n      expandedForAnimation,\n      selectedItem,\n      setSelectedItem,\n      setSelectedParent,\n      selectedParent,\n      focusedItem,\n      setFocusedItem,\n      openedDrilldowns,\n      setOpenedDrilldowns,\n      visibleItems,\n      visibleItemsRefs,\n    ],\n  );\n\n  return finalConfig;\n};\n\nexport default useLeftNavConfig;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAGlB,6BAA4B;AAC5B,oCAAuC;AACvC,oCAAuC;AAEhC,MAAM,mBAAmB,CAAC,UAAsC;AACrE,QAAM,EAAE,UAAU,YAAY,kBAAkB,eAAe,UAAU;AAOzE,QAAM,CAAC,cAAc,mBAAmB,qBAAM,SAAS;AACvD,QAAM,CAAC,iBAAiB,sBAAsB,qBAAM,SAAS;AAC7D,QAAM,CAAC,gBAAgB,qBAAqB,qBAAM,SAAS;AAE3D,QAAM,CAAC,aAAa,kBAAkB,qBAAM,SAAS;AAErD,QAAM,CAAC,kBAAkB,uBAAuB,qBAAM,SAAmB;AAMzE,QAAM,CAAC,sBAAsB,2BAA2B,qBAAM,SAAS;AACvE,QAAM,aAAa,qBAAM,OAAsC;AAC/D,QAAM,mBAAmB,qBAAM,QAC7B,MAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,MAEF,CAAC,sBAAsB,YAAY;AAErC,4DAAuB,OAAO;AAM9B,uBAAM,UAAU,MAAM;AACpB,qBAAiB;AAAA,KAChB,CAAC,cAAc;AAElB,uBAAM,UAAU,MAAM;AACpB,QAAI,eAAe;AAAM,wBAAkB;AAAA,KAC1C,CAAC;AAEJ,uBAAM,UAAU,MAAM;AACpB,kBAAc;AAAA,KACb,CAAC,aAAa;AAEjB,4DACE,OACA,YACA,MAAM,iBAAiB,SAAY,MAAM,eAAe,cACxD,iBACA,MAAM;AAQR,QAAM,oBAAoB,qBAAM,QAC9B,MAAO;AAAA,IACL,YAAY,MAAM;AAAA,IAClB,gBAAgB,MAAM;AAAA,IACtB,OAAO,MAAM;AAAA,IACb;AAAA,MAEF,CAAC,MAAM,iBAAiB,MAAM,qBAAqB,MAAM,OAAO;AAIlE,QAAM,EAAE,cAAc,qBAAqB,oCAAgB;AAM3D,QAAM,cAAc,qBAAM,QACxB,MAAO;AAAA,IACL,cAAc;AAAA,IACd;AAAA,IACA,cAAc,MAAM,iBAAiB,SAAY,MAAM,eAAe;AAAA,IACtE;AAAA,IACA,gBAAgB,MAAM,mBAAmB,SAAY,MAAM,iBAAiB;AAAA,IAC5E;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MAEF;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAIJ,SAAO;AAAA;AAGT,IAAO,2BAAQ;",
+  "names": []
+}

package/cjs/configs/useLeftNavItems.js

@@ -1,80 +1,82 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-require('core-js/modules/esnext.async-iterator.for-each.js');
-require('core-js/modules/esnext.iterator.constructor.js');
-require('core-js/modules/esnext.iterator.for-each.js');
-require('core-js/modules/web.dom-collections.iterator.js');
-var React = require('react');
-var constants = require('../exported-related/constants.js');
-require('@babel/runtime/helpers/jsx');
-require('@elliemae/ds-grid');
-require('styled-components');
-require('core-js/modules/esnext.async-iterator.filter.js');
-require('core-js/modules/esnext.iterator.filter.js');
-require('@babel/runtime/helpers/defineProperty');
-require('react/jsx-runtime');
-require('@elliemae/ds-icons');
-
-const notFocuseableItems = [constants.ITEM_TYPES.LEFT_NAV_ITEM_SEPARATOR, constants.ITEM_TYPES.LEFT_NAV_ITEM_SECTION]; // Walks the array of items
-// Drilldowns are tree-like structures
-
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var useLeftNavItems_exports = {};
+__export(useLeftNavItems_exports, {
+  default: () => useLeftNavItems_default,
+  useLeftNavItems: () => useLeftNavItems
+});
+var React = __toESM(require("react"));
+var import_react = require("react");
+var import_exported_related = require("../exported-related");
+var import_constants = require("../exported-related/constants");
+const notFocuseableItems = [import_exported_related.ITEM_TYPES.LEFT_NAV_ITEM_SEPARATOR, import_exported_related.ITEM_TYPES.LEFT_NAV_ITEM_SECTION];
 const walkItems = (items, openedDrilldowns, callback) => {
-  items.forEach(item => {
-    if (typeof item.type === 'string') {
-      var _item$itemOpts$items, _item$itemOpts, _item$itemOpts2, _item$itemOpts$items2, _item$itemOpts3;
-
-      // Out of the box item
-      if (notFocuseableItems.includes(item.type)) return; // not focuseable
-
-      callback(item.dsId); // If it's an opened uncontrolled drilldown
-
-      if (item.type === constants.ITEM_TYPES.LEFT_NAV_ITEM_UNCONTROLLED_DRILLDOWN && openedDrilldowns.includes(item.dsId)) walkItems((_item$itemOpts$items = (_item$itemOpts = item.itemOpts) === null || _item$itemOpts === void 0 ? void 0 : _item$itemOpts.items) !== null && _item$itemOpts$items !== void 0 ? _item$itemOpts$items : [], openedDrilldowns, callback); // If it's an opened controlled drilldown
-
-      if (item.type === constants.ITEM_TYPES.LEFT_NAV_ITEM_CONTROLLED_DRILLDOWN && (_item$itemOpts2 = item.itemOpts) !== null && _item$itemOpts2 !== void 0 && _item$itemOpts2.isOpened) walkItems((_item$itemOpts$items2 = (_item$itemOpts3 = item.itemOpts) === null || _item$itemOpts3 === void 0 ? void 0 : _item$itemOpts3.items) !== null && _item$itemOpts$items2 !== void 0 ? _item$itemOpts$items2 : [], openedDrilldowns, callback);
+  items.forEach((item) => {
+    if (typeof item.type === "string") {
+      if (notFocuseableItems.includes(item.type))
+        return;
+      callback(item.dsId);
+      if (item.type === import_exported_related.ITEM_TYPES.LEFT_NAV_ITEM_UNCONTROLLED_DRILLDOWN && openedDrilldowns.includes(item.dsId))
+        walkItems(item.itemOpts?.items ?? [], openedDrilldowns, callback);
+      if (item.type === import_exported_related.ITEM_TYPES.LEFT_NAV_ITEM_CONTROLLED_DRILLDOWN && item.itemOpts?.isOpened)
+        walkItems(item.itemOpts?.items ?? [], openedDrilldowns, callback);
     } else {
-      var _item$itemOpts4;
-
-      // Custom item
-      if (!((_item$itemOpts4 = item.itemOpts) !== null && _item$itemOpts4 !== void 0 && _item$itemOpts4.focuseable)) return; // not focuseable specified
-
+      if (!item.itemOpts?.focuseable)
+        return;
       callback(item.dsId);
     }
   });
 };
-
-const useLeftNavItems = props => {
-  const {
-    headerItem,
-    bodyHeaderItem,
-    items: bodyItems,
-    openedDrilldowns
-  } = props; // Place the header and body header items into the array of items
-
-  const items = React.useMemo(() => {
+const useLeftNavItems = (props) => {
+  const { headerItem, bodyHeaderItem, items: bodyItems, openedDrilldowns } = props;
+  const items = (0, import_react.useMemo)(() => {
     const itemsArray = [...bodyItems];
-    if (bodyHeaderItem) itemsArray.unshift(bodyHeaderItem);
-    if (headerItem) itemsArray.unshift(headerItem);
+    if (bodyHeaderItem)
+      itemsArray.unshift(bodyHeaderItem);
+    if (headerItem)
+      itemsArray.unshift(headerItem);
     return itemsArray;
   }, [headerItem, bodyHeaderItem, bodyItems]);
-  const visibleItemsRefs = React.useRef({});
-  const visibleItems = React.useMemo(() => {
+  const visibleItemsRefs = (0, import_react.useRef)({});
+  const visibleItems = (0, import_react.useMemo)(() => {
     const visibleItemsArray = [];
-    walkItems(items, openedDrilldowns, dsId => {
+    walkItems(items, openedDrilldowns, (dsId) => {
       visibleItemsArray.push(dsId);
     });
-    visibleItemsArray.push(constants.FOOTER_DS_ID);
+    visibleItemsArray.push(import_constants.FOOTER_DS_ID);
     return visibleItemsArray;
   }, [items, openedDrilldowns]);
-  visibleItems.forEach(dsId => {
-    if (!(dsId in visibleItemsRefs.current)) visibleItemsRefs.current[dsId] = /*#__PURE__*/React.createRef();
+  visibleItems.forEach((dsId) => {
+    if (!(dsId in visibleItemsRefs.current))
+      visibleItemsRefs.current[dsId] = (0, import_react.createRef)();
   });
-  return {
-    visibleItems,
-    visibleItemsRefs
-  };
+  return { visibleItems, visibleItemsRefs };
 };
-
-exports["default"] = useLeftNavItems;
-exports.useLeftNavItems = useLeftNavItems;
+var useLeftNavItems_default = useLeftNavItems;
+module.exports = __toCommonJS(useLeftNavItems_exports);
+//# sourceMappingURL=useLeftNavItems.js.map

package/cjs/configs/useLeftNavItems.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/configs/useLeftNavItems.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["/* eslint-disable complexity */\nimport { createRef, MutableRefObject, RefObject, useMemo, useRef } from 'react';\nimport { ITEM_TYPES } from '../exported-related';\nimport type { GenericItemItemProps } from '../index.d';\nimport { FOOTER_DS_ID } from '../exported-related/constants';\n\nconst notFocuseableItems = [ITEM_TYPES.LEFT_NAV_ITEM_SEPARATOR, ITEM_TYPES.LEFT_NAV_ITEM_SECTION];\n\n// Walks the array of items\n// Drilldowns are tree-like structures\nconst walkItems = (items: GenericItemItemProps[], openedDrilldowns: string[], callback: (dsId: string) => void) => {\n  items.forEach((item) => {\n    if (typeof item.type === 'string') {\n      // Out of the box item\n      if (notFocuseableItems.includes(item.type)) return; // not focuseable\n\n      callback(item.dsId);\n\n      // If it's an opened uncontrolled drilldown\n      if (item.type === ITEM_TYPES.LEFT_NAV_ITEM_UNCONTROLLED_DRILLDOWN && openedDrilldowns.includes(item.dsId))\n        walkItems(item.itemOpts?.items ?? [], openedDrilldowns, callback);\n\n      // If it's an opened controlled drilldown\n      if (item.type === ITEM_TYPES.LEFT_NAV_ITEM_CONTROLLED_DRILLDOWN && item.itemOpts?.isOpened)\n        walkItems(item.itemOpts?.items ?? [], openedDrilldowns, callback);\n    } else {\n      // Custom item\n      if (!item.itemOpts?.focuseable) return; // not focuseable specified\n      callback(item.dsId);\n    }\n  });\n};\n\nexport const useLeftNavItems = (props: {\n  headerItem: GenericItemItemProps;\n  bodyHeaderItem: GenericItemItemProps;\n  items: GenericItemItemProps[];\n  openedDrilldowns: string[];\n}): {\n  visibleItems: string[];\n  visibleItemsRefs: MutableRefObject<Record<string, RefObject<HTMLElement>>>;\n} => {\n  const { headerItem, bodyHeaderItem, items: bodyItems, openedDrilldowns } = props;\n\n  // Place the header and body header items into the array of items\n  const items = useMemo(() => {\n    const itemsArray: GenericItemItemProps[] = [...bodyItems];\n    if (bodyHeaderItem) itemsArray.unshift(bodyHeaderItem);\n    if (headerItem) itemsArray.unshift(headerItem);\n    return itemsArray;\n  }, [headerItem, bodyHeaderItem, bodyItems]);\n\n  const visibleItemsRefs = useRef<Record<string, RefObject<HTMLElement>>>({});\n\n  const visibleItems: string[] = useMemo(() => {\n    const visibleItemsArray: string[] = [];\n    walkItems(items, openedDrilldowns, (dsId: string) => {\n      visibleItemsArray.push(dsId);\n    });\n    visibleItemsArray.push(FOOTER_DS_ID);\n    return visibleItemsArray;\n  }, [items, openedDrilldowns]);\n\n  visibleItems.forEach((dsId) => {\n    if (!(dsId in visibleItemsRefs.current)) visibleItemsRefs.current[dsId] = createRef();\n  });\n\n  return { visibleItems, visibleItemsRefs };\n};\n\nexport default useLeftNavItems;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAwE;AACxE,8BAA2B;AAE3B,uBAA6B;AAE7B,MAAM,qBAAqB,CAAC,mCAAW,yBAAyB,mCAAW;AAI3E,MAAM,YAAY,CAAC,OAA+B,kBAA4B,aAAqC;AACjH,QAAM,QAAQ,CAAC,SAAS;AACtB,QAAI,OAAO,KAAK,SAAS,UAAU;AAEjC,UAAI,mBAAmB,SAAS,KAAK;AAAO;AAE5C,eAAS,KAAK;AAGd,UAAI,KAAK,SAAS,mCAAW,wCAAwC,iBAAiB,SAAS,KAAK;AAClG,kBAAU,KAAK,UAAU,SAAS,IAAI,kBAAkB;AAG1D,UAAI,KAAK,SAAS,mCAAW,sCAAsC,KAAK,UAAU;AAChF,kBAAU,KAAK,UAAU,SAAS,IAAI,kBAAkB;AAAA,WACrD;AAEL,UAAI,CAAC,KAAK,UAAU;AAAY;AAChC,eAAS,KAAK;AAAA;AAAA;AAAA;AAKb,MAAM,kBAAkB,CAAC,UAQ3B;AACH,QAAM,EAAE,YAAY,gBAAgB,OAAO,WAAW,qBAAqB;AAG3E,QAAM,QAAQ,0BAAQ,MAAM;AAC1B,UAAM,aAAqC,CAAC,GAAG;AAC/C,QAAI;AAAgB,iBAAW,QAAQ;AACvC,QAAI;AAAY,iBAAW,QAAQ;AACnC,WAAO;AAAA,KACN,CAAC,YAAY,gBAAgB;AAEhC,QAAM,mBAAmB,yBAA+C;AAExE,QAAM,eAAyB,0BAAQ,MAAM;AAC3C,UAAM,oBAA8B;AACpC,cAAU,OAAO,kBAAkB,CAAC,SAAiB;AACnD,wBAAkB,KAAK;AAAA;AAEzB,sBAAkB,KAAK;AACvB,WAAO;AAAA,KACN,CAAC,OAAO;AAEX,eAAa,QAAQ,CAAC,SAAS;AAC7B,QAAI,CAAE,SAAQ,iBAAiB;AAAU,uBAAiB,QAAQ,QAAQ;AAAA;AAG5E,SAAO,EAAE,cAAc;AAAA;AAGzB,IAAO,0BAAQ;",
+  "names": []
+}

package/cjs/configs/useLeftNavSmoothExpand.js

@@ -1,32 +1,53 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var useLeftNavSmoothExpand_exports = {};
+__export(useLeftNavSmoothExpand_exports, {
+  default: () => useLeftNavSmoothExpand_default,
+  useLeftNavSmoothExpand: () => useLeftNavSmoothExpand
+});
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
 const useLeftNavSmoothExpand = (props, smoothExpandOpts) => {
-  const {
-    expanded
-  } = props;
+  const { expanded } = props;
   const {
     expandedForAnimation,
     timeoutRef,
     setExpandedForAnimation
   } = smoothExpandOpts;
-  React__default["default"].useEffect(() => {
-    // If expanded changes, we need to smoothly transition to the non-expanded state
-    // so we need to wait for 350ms
+  import_react.default.useEffect(() => {
     if (!expanded && expandedForAnimation) {
       clearTimeout(timeoutRef.current);
       timeoutRef.current = setTimeout(() => setExpandedForAnimation(false), 350);
-    } else if (expanded) setExpandedForAnimation(true);
+    } else if (expanded)
+      setExpandedForAnimation(true);
   }, [expanded]);
-  React__default["default"].useEffect(() => () => clearTimeout(timeoutRef.current), []);
+  import_react.default.useEffect(() => () => clearTimeout(timeoutRef.current), []);
 };
-
-exports["default"] = useLeftNavSmoothExpand;
-exports.useLeftNavSmoothExpand = useLeftNavSmoothExpand;
+var useLeftNavSmoothExpand_default = useLeftNavSmoothExpand;
+module.exports = __toCommonJS(useLeftNavSmoothExpand_exports);
+//# sourceMappingURL=useLeftNavSmoothExpand.js.map

package/cjs/configs/useLeftNavSmoothExpand.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/configs/useLeftNavSmoothExpand.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React from 'react';\nimport type { LeftNavProps } from '../index.d';\n\ninterface smoothExpandOptsT {\n  expandedForAnimation: boolean;\n  timeoutRef: React.MutableRefObject<NodeJS.Timeout>;\n  setExpandedForAnimation: React.Dispatch<React.SetStateAction<boolean>>;\n}\nexport const useLeftNavSmoothExpand = (\n  props: LeftNavProps,\n  smoothExpandOpts: smoothExpandOptsT,\n): void => {\n  const { expanded } = props;\n  const {\n    expandedForAnimation,\n    timeoutRef,\n    setExpandedForAnimation,\n  } = smoothExpandOpts;\n\n  React.useEffect(() => {\n    // If expanded changes, we need to smoothly transition to the non-expanded state\n    // so we need to wait for 350ms\n    if (!expanded && expandedForAnimation) {\n      clearTimeout(timeoutRef.current);\n      timeoutRef.current = setTimeout(\n        () => setExpandedForAnimation(false),\n        350,\n      );\n    } else if (expanded) setExpandedForAnimation(true);\n  }, [expanded]);\n\n  React.useEffect(() => () => clearTimeout(timeoutRef.current), []);\n};\n\nexport default useLeftNavSmoothExpand;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAQX,MAAM,yBAAyB,CACpC,OACA,qBACS;AACT,QAAM,EAAE,aAAa;AACrB,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,MACE;AAEJ,uBAAM,UAAU,MAAM;AAGpB,QAAI,CAAC,YAAY,sBAAsB;AACrC,mBAAa,WAAW;AACxB,iBAAW,UAAU,WACnB,MAAM,wBAAwB,QAC9B;AAAA,eAEO;AAAU,8BAAwB;AAAA,KAC5C,CAAC;AAEJ,uBAAM,UAAU,MAAM,MAAM,aAAa,WAAW,UAAU;AAAA;AAGhE,IAAO,iCAAQ;",
+  "names": []
+}

package/cjs/exported-related/ChevronItem/index.js

@@ -1,28 +1,43 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-require('core-js/modules/esnext.async-iterator.filter.js');
-require('core-js/modules/esnext.iterator.constructor.js');
-require('core-js/modules/esnext.iterator.filter.js');
-require('core-js/modules/esnext.async-iterator.for-each.js');
-require('core-js/modules/esnext.iterator.for-each.js');
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-require('react');
-var dsIcons = require('@elliemae/ds-icons');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-const ChevronItem = props => /*#__PURE__*/jsxRuntime.jsx(dsIcons.ChevronSmallRight, _objectSpread({
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var ChevronItem_exports = {};
+__export(ChevronItem_exports, {
+  ChevronItem: () => ChevronItem,
+  default: () => ChevronItem_default
+});
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_ds_icons = require("@elliemae/ds-icons");
+const ChevronItem = (props) => /* @__PURE__ */ import_react.default.createElement(import_ds_icons.ChevronSmallRight, {
   size: "m",
-  color: ['brand-primary', 800]
-}, props));
-
-exports.ChevronItem = ChevronItem;
-exports["default"] = ChevronItem;
+  color: ["brand-primary", 800],
+  ...props
+});
+var ChevronItem_default = ChevronItem;
+module.exports = __toCommonJS(ChevronItem_exports);
+//# sourceMappingURL=index.js.map

package/cjs/exported-related/ChevronItem/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/exported-related/ChevronItem/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React from 'react';\nimport { ChevronSmallRight } from '@elliemae/ds-icons';\n\nexport const ChevronItem = (props: unknown): JSX.Element => (\n  <ChevronSmallRight size=\"m\" color={['brand-primary', 800]} {...props} />\n);\n\nexport default ChevronItem;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,sBAAkC;AAE3B,MAAM,cAAc,CAAC,UAC1B,mDAAC,mCAAD;AAAA,EAAmB,MAAK;AAAA,EAAI,OAAO,CAAC,iBAAiB;AAAA,KAAU;AAAA;AAGjE,IAAO,sBAAQ;",
+  "names": []
+}

package/cjs/exported-related/Icon/index.js

@@ -1,36 +1,53 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-require('core-js/modules/esnext.async-iterator.filter.js');
-require('core-js/modules/esnext.iterator.constructor.js');
-require('core-js/modules/esnext.iterator.filter.js');
-require('core-js/modules/esnext.async-iterator.for-each.js');
-require('core-js/modules/esnext.iterator.for-each.js');
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-require('react');
-var styled = require('styled-components');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-const AugmentedIcon = Icon => styled__default["default"](Icon).withConfig({
-  componentId: "sc-1eek2uh-0"
-})(["cursor:pointer;outline:0;:focus,:active{outline:1px solid #1e79c2;}"]);
-
-const Icon = IconComponent => props => {
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var Icon_exports = {};
+__export(Icon_exports, {
+  Icon: () => Icon
+});
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_styled_components = __toESM(require("styled-components"));
+const AugmentedIcon = (Icon2) => (0, import_styled_components.default)(Icon2)`
+  cursor: pointer;
+
+  outline: 0;
+  :focus,
+  :active {
+    outline: 1px solid #1e79c2;
+  }
+`;
+const Icon = (IconComponent) => (props) => {
   const StyledComponent = AugmentedIcon(IconComponent);
-  return /*#__PURE__*/jsxRuntime.jsx(StyledComponent, _objectSpread({
-    color: ['brand-primary', 800],
-    tabIndex: 0
-  }, props));
+  return /* @__PURE__ */ import_react.default.createElement(StyledComponent, {
+    color: ["brand-primary", 800],
+    tabIndex: 0,
+    ...props
+  });
 };
-
-exports.Icon = Icon;
+module.exports = __toCommonJS(Icon_exports);
+//# sourceMappingURL=index.js.map