@elliemae/ds-left-navigation 3.11.0-next.2 → 3.11.0-next.4

package/dist/cjs/parts/LeftNavFooterItem/index.js

@@ -32,8 +32,6 @@ var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
 var import_ds_icons = require("@elliemae/ds-icons");
-var import_ds_utilities = require("@elliemae/ds-utilities");
-var import_ds_grid = __toESM(require("@elliemae/ds-grid"));
 var import_ds_truncated_tooltip_text = require("@elliemae/ds-truncated-tooltip-text");
 var import_styled = require("./styled");
 var import_hooks = require("../../hooks");
@@ -42,9 +40,8 @@ var import_constants = require("../../exported-related/constants");
 const LeftNavFooterItem = (props) => {
   const { footerLabel, onFooterExpand = () => null, onFooterClose = () => null } = props;
   const {
-    leftNavProps: { labelOverflow, openedItem },
+    leftNavProps: { labelOverflow },
     expandedForAnimation,
-    setSelectedItem,
     setFocusedItem,
     visibleItemsRefs
   } = (0, import_react.useContext)(import_LeftNavigationContext.default);
@@ -63,72 +60,62 @@ const LeftNavFooterItem = (props) => {
   });
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledFooterMenu, {
     "data-testid": "leftnav-container",
-    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledItemWrapper, {
-      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledItem, {
-        ref: visibleItemsRefs.current[id],
-        tabIndex: expandedForAnimation ? -1 : 0,
-        expanded: expandedForAnimation,
-        pt: "xxs2",
-        height: expandedForAnimation ? "auto" : "48px",
-        alignItems: "flex-start",
-        pl: "xxs",
-        cols: expandedForAnimation ? ["auto", "1fr", "auto"] : ["38px"],
-        onClick: expandedForAnimation ? () => null : handleOnClick,
-        onKeyDown,
-        onFocus: () => setFocusedItem(id),
-        "data-testid": "leftnav-item-container",
-        role: "menuitem",
-        "aria-label": expandedForAnimation ? `Footer, ${footerLabel}` : `Expand left navigation`,
-        children: !expandedForAnimation ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.MenuExpand, {
-          size: "m",
-          color: ["brand-primary", 800],
-          "data-testid": "leftnav-footer-btn"
-        }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledLabel, {
-              mt: "5px",
-              mr: "12px",
-              mb: "16px",
-              "data-testid": "leftnav-itemlabel",
-              labelOverflow,
-              "aria-live": "polite",
-              children: labelOverflow === "truncate" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.SimpleTruncatedTooltipText, {
-                value: footerLabel,
-                placement: "bottom-start"
-              }) : footerLabel
-            }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledSeparator, {
-              mt: "xxxs"
-            }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.default, {
-              m: "0 12px",
-              children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledMenuCollapse, {
-                size: "m",
-                color: ["brand-primary", 800],
-                onClick: (e) => {
-                  e.stopPropagation();
-                  handleOnClick(e);
-                },
-                "data-testid": "leftnav-footer-btn",
-                tabIndex: 0,
-                onFocus: (e) => {
-                  e.stopPropagation();
-                  setFocusedItem(import_constants.FOOTER_MENU_CLOSE_DS_ID);
-                },
-                role: "button",
-                "aria-label": "Collapse left navigation"
-              })
-            })
-          ]
-        })
+    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledFooterItem, {
+      ref: visibleItemsRefs.current[id],
+      tabIndex: expandedForAnimation ? -1 : 0,
+      expanded: expandedForAnimation,
+      pt: "xxs2",
+      height: expandedForAnimation ? "auto" : "48px",
+      alignItems: "flex-start",
+      pl: "xxs2",
+      cols: expandedForAnimation ? ["auto", "1fr", "auto"] : ["38px"],
+      onClick: expandedForAnimation ? () => null : handleOnClick,
+      onKeyDown,
+      onFocus: () => setFocusedItem(id),
+      "data-testid": "leftnav-item-container",
+      role: "menuitem",
+      "aria-label": expandedForAnimation ? `Footer, ${typeof footerLabel === "string" ? footerLabel : ""}` : `Expand left navigation`,
+      children: !expandedForAnimation ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.MenuExpand, {
+        size: "m",
+        color: ["brand-primary", 800],
+        "data-testid": "leftnav-footer-btn"
+      }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledFooterLabel, {
+            mt: "5px",
+            mr: "12px",
+            mb: "16px",
+            "data-testid": "leftnav-itemlabel",
+            labelOverflow,
+            "aria-live": "polite",
+            children: labelOverflow === "truncate" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.SimpleTruncatedTooltipText, {
+              value: footerLabel,
+              placement: "bottom-start"
+            }) : footerLabel
+          }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledFooterSeparator, {
+            mt: "xxxs"
+          }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledMenuCollapse, {
+            size: "m",
+            color: ["brand-primary", 800],
+            onClick: (e) => {
+              e.stopPropagation();
+              handleOnClick(e);
+            },
+            "data-testid": "leftnav-footer-btn",
+            tabIndex: 0,
+            onFocus: (e) => {
+              e.stopPropagation();
+              setFocusedItem(import_constants.FOOTER_MENU_CLOSE_DS_ID);
+            },
+            role: "button",
+            "aria-label": "Collapse left navigation"
+          })
+        ]
       })
     })
   }, id);
 };
-LeftNavFooterItem.propTypes = {
-  footerLabel: import_ds_utilities.PropTypes.any,
-  onFooterExpand: import_ds_utilities.PropTypes.func,
-  onFooterClose: import_ds_utilities.PropTypes.func
-};
 var LeftNavFooterItem_default = LeftNavFooterItem;
 //# sourceMappingURL=index.js.map

package/dist/cjs/parts/LeftNavFooterItem/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/LeftNavFooterItem/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useContext } from 'react';\nimport { MenuExpand } from '@elliemae/ds-icons';\nimport { PropTypes } from '@elliemae/ds-utilities';\nimport Grid from '@elliemae/ds-grid';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport {\n  StyledFooterMenu,\n  StyledItem,\n  StyledItemWrapper,\n  StyledLabel,\n  StyledSeparator,\n  StyledMenuCollapse,\n} from './styled';\nimport { useKeyboardNavigation } from '../../hooks';\nimport LeftNavigationContext from '../../LeftNavigationContext';\nimport { FOOTER_DS_ID, FOOTER_MENU_CLOSE_DS_ID } from '../../exported-related/constants';\n\ntype LeftNavFooterItemProps = {\n  footerLabel: string | JSX.Element;\n  onFooterExpand: React.MouseEventHandler & React.KeyboardEventHandler;\n  onFooterClose: React.MouseEventHandler & React.KeyboardEventHandler;\n};\n\nexport const LeftNavFooterItem: React.ComponentType<LeftNavFooterItemProps> = (props) => {\n  const { footerLabel, onFooterExpand = () => null, onFooterClose = () => null } = props;\n  const {\n    leftNavProps: { labelOverflow, openedItem },\n    expandedForAnimation,\n    setSelectedItem,\n    setFocusedItem,\n    visibleItemsRefs,\n  } = useContext(LeftNavigationContext);\n\n  const id = FOOTER_DS_ID;\n\n  const handleOnClick = expandedForAnimation ? onFooterClose : onFooterExpand;\n\n  const onKeyDown = useKeyboardNavigation({\n    item: {\n      dsId: id,\n      itemOpts: {\n        selectable: !expandedForAnimation,\n        openable: false,\n        closable: false,\n      },\n    },\n    onClick: handleOnClick,\n  });\n\n  return (\n    <StyledFooterMenu key={id} data-testid=\"leftnav-container\">\n      <StyledItemWrapper>\n        <StyledItem\n          ref={visibleItemsRefs.current[id]}\n          tabIndex={expandedForAnimation ? -1 : 0}\n          expanded={expandedForAnimation}\n          pt=\"xxs2\"\n          height={expandedForAnimation ? 'auto' : '48px'}\n          alignItems=\"flex-start\"\n          pl=\"xxs\"\n          cols={expandedForAnimation ? ['auto', '1fr', 'auto'] : ['38px']}\n          onClick={expandedForAnimation ? () => null : handleOnClick}\n          onKeyDown={onKeyDown}\n          onFocus={() => setFocusedItem(id)}\n          data-testid=\"leftnav-item-container\"\n          role=\"menuitem\"\n          aria-label={expandedForAnimation ? `Footer, ${footerLabel}` : `Expand left navigation`}\n        >\n          {!expandedForAnimation ? (\n            <MenuExpand size=\"m\" color={['brand-primary', 800]} data-testid=\"leftnav-footer-btn\" />\n          ) : (\n            <>\n              <StyledLabel\n                mt=\"5px\"\n                mr=\"12px\"\n                mb=\"16px\"\n                data-testid=\"leftnav-itemlabel\"\n                labelOverflow={labelOverflow}\n                aria-live=\"polite\"\n              >\n                {labelOverflow === 'truncate' ? (\n                  <SimpleTruncatedTooltipText value={footerLabel} placement=\"bottom-start\" />\n                ) : (\n                  footerLabel\n                )}\n              </StyledLabel>\n              <StyledSeparator mt=\"xxxs\" />\n              <Grid m=\"0 12px\">\n                <StyledMenuCollapse\n                  size=\"m\"\n                  color={['brand-primary', 800]}\n                  onClick={(e) => {\n                    e.stopPropagation();\n                    handleOnClick(e);\n                  }}\n                  data-testid=\"leftnav-footer-btn\"\n                  tabIndex={0}\n                  onFocus={(e) => {\n                    e.stopPropagation();\n                    setFocusedItem(FOOTER_MENU_CLOSE_DS_ID);\n                  }}\n                  role=\"button\"\n                  aria-label=\"Collapse left navigation\"\n                />\n              </Grid>\n            </>\n          )}\n        </StyledItem>\n      </StyledItemWrapper>\n    </StyledFooterMenu>\n  );\n};\n\nLeftNavFooterItem.propTypes = {\n  footerLabel: PropTypes.any,\n  onFooterExpand: PropTypes.func,\n  onFooterClose: PropTypes.func,\n};\n\nexport default LeftNavFooterItem;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,mBAAkC;AAClC,sBAA2B;AAC3B,0BAA0B;AAC1B,qBAAiB;AACjB,uCAA2C;AAC3C,oBAOO;AACP,mBAAsC;AACtC,mCAAkC;AAClC,uBAAsD;AAQ/C,MAAM,oBAAiE,CAAC,UAAU;AACvF,QAAM,EAAE,aAAa,iBAAiB,MAAM,MAAM,gBAAgB,MAAM,KAAK,IAAI;AACjF,QAAM;AAAA,IACJ,cAAc,EAAE,eAAe,WAAW;AAAA,IAC1C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,6BAAAA,OAAqB;AAEpC,QAAM,KAAK;AAEX,QAAM,gBAAgB,uBAAuB,gBAAgB;AAE7D,QAAM,gBAAY,oCAAsB;AAAA,IACtC,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,UAAU;AAAA,QACR,YAAY,CAAC;AAAA,QACb,UAAU;AAAA,QACV,UAAU;AAAA,MACZ;AAAA,IACF;AAAA,IACA,SAAS;AAAA,EACX,CAAC;AAED,SACE,4CAAC;AAAA,IAA0B,eAAY;AAAA,IACrC,sDAAC;AAAA,MACC,sDAAC;AAAA,QACC,KAAK,iBAAiB,QAAQ;AAAA,QAC9B,UAAU,uBAAuB,KAAK;AAAA,QACtC,UAAU;AAAA,QACV,IAAG;AAAA,QACH,QAAQ,uBAAuB,SAAS;AAAA,QACxC,YAAW;AAAA,QACX,IAAG;AAAA,QACH,MAAM,uBAAuB,CAAC,QAAQ,OAAO,MAAM,IAAI,CAAC,MAAM;AAAA,QAC9D,SAAS,uBAAuB,MAAM,OAAO;AAAA,QAC7C;AAAA,QACA,SAAS,MAAM,eAAe,EAAE;AAAA,QAChC,eAAY;AAAA,QACZ,MAAK;AAAA,QACL,cAAY,uBAAuB,WAAW,gBAAgB;AAAA,QAE7D,WAAC,uBACA,4CAAC;AAAA,UAAW,MAAK;AAAA,UAAI,OAAO,CAAC,iBAAiB,GAAG;AAAA,UAAG,eAAY;AAAA,SAAqB,IAErF;AAAA,UACE;AAAA,wDAAC;AAAA,cACC,IAAG;AAAA,cACH,IAAG;AAAA,cACH,IAAG;AAAA,cACH,eAAY;AAAA,cACZ;AAAA,cACA,aAAU;AAAA,cAET,4BAAkB,aACjB,4CAAC;AAAA,gBAA2B,OAAO;AAAA,gBAAa,WAAU;AAAA,eAAe,IAEzE;AAAA,aAEJ;AAAA,YACA,4CAAC;AAAA,cAAgB,IAAG;AAAA,aAAO;AAAA,YAC3B,4CAAC,eAAAC,SAAA;AAAA,cAAK,GAAE;AAAA,cACN,sDAAC;AAAA,gBACC,MAAK;AAAA,gBACL,OAAO,CAAC,iBAAiB,GAAG;AAAA,gBAC5B,SAAS,CAAC,MAAM;AACd,oBAAE,gBAAgB;AAClB,gCAAc,CAAC;AAAA,gBACjB;AAAA,gBACA,eAAY;AAAA,gBACZ,UAAU;AAAA,gBACV,SAAS,CAAC,MAAM;AACd,oBAAE,gBAAgB;AAClB,iCAAe,wCAAuB;AAAA,gBACxC;AAAA,gBACA,MAAK;AAAA,gBACL,cAAW;AAAA,eACb;AAAA,aACF;AAAA;AAAA,SACF;AAAA,OAEJ;AAAA,KACF;AAAA,KA1DqB,EA2DvB;AAEJ;AAEA,kBAAkB,YAAY;AAAA,EAC5B,aAAa,8BAAU;AAAA,EACvB,gBAAgB,8BAAU;AAAA,EAC1B,eAAe,8BAAU;AAC3B;AAEA,IAAO,4BAAQ;",
-  "names": ["LeftNavigationContext", "Grid"]
+  "sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useContext } from 'react';\nimport { MenuExpand } from '@elliemae/ds-icons';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport {\n  StyledFooterMenu,\n  StyledFooterItem,\n  StyledFooterWrapper,\n  StyledFooterLabel,\n  StyledFooterSeparator,\n  StyledMenuCollapse,\n} from './styled';\nimport { useKeyboardNavigation } from '../../hooks';\nimport LeftNavigationContext from '../../LeftNavigationContext';\nimport { FOOTER_DS_ID, FOOTER_MENU_CLOSE_DS_ID } from '../../exported-related/constants';\n\ntype LeftNavFooterItemProps = {\n  footerLabel: string | JSX.Element;\n  onFooterExpand: React.MouseEventHandler & React.KeyboardEventHandler;\n  onFooterClose: React.MouseEventHandler & React.KeyboardEventHandler;\n};\n\nexport const LeftNavFooterItem: React.ComponentType<LeftNavFooterItemProps> = (props) => {\n  const { footerLabel, onFooterExpand = () => null, onFooterClose = () => null } = props;\n  const {\n    leftNavProps: { labelOverflow },\n    expandedForAnimation,\n    setFocusedItem,\n    visibleItemsRefs,\n  } = useContext(LeftNavigationContext);\n\n  const id = FOOTER_DS_ID;\n\n  const handleOnClick = expandedForAnimation ? onFooterClose : onFooterExpand;\n\n  const onKeyDown = useKeyboardNavigation({\n    item: {\n      dsId: id,\n      itemOpts: {\n        selectable: !expandedForAnimation,\n        openable: false,\n        closable: false,\n      },\n    },\n    onClick: handleOnClick,\n  });\n\n  return (\n    <StyledFooterMenu key={id} data-testid=\"leftnav-container\">\n      <StyledFooterItem\n        ref={visibleItemsRefs.current[id] as React.RefObject<HTMLDivElement>}\n        tabIndex={expandedForAnimation ? -1 : 0}\n        expanded={expandedForAnimation}\n        pt=\"xxs2\"\n        height={expandedForAnimation ? 'auto' : '48px'}\n        alignItems=\"flex-start\"\n        pl=\"xxs2\"\n        cols={expandedForAnimation ? ['auto', '1fr', 'auto'] : ['38px']}\n        onClick={expandedForAnimation ? () => null : handleOnClick}\n        onKeyDown={onKeyDown}\n        onFocus={() => setFocusedItem(id)}\n        data-testid=\"leftnav-item-container\"\n        role=\"menuitem\"\n        aria-label={\n          expandedForAnimation\n            ? `Footer, ${typeof footerLabel === 'string' ? footerLabel : ''}`\n            : `Expand left navigation`\n        }\n      >\n        {!expandedForAnimation ? (\n          <MenuExpand size=\"m\" color={['brand-primary', 800]} data-testid=\"leftnav-footer-btn\" />\n        ) : (\n          <>\n            <StyledFooterLabel\n              mt=\"5px\"\n              mr=\"12px\"\n              mb=\"16px\"\n              data-testid=\"leftnav-itemlabel\"\n              labelOverflow={labelOverflow}\n              aria-live=\"polite\"\n            >\n              {labelOverflow === 'truncate' ? (\n                <SimpleTruncatedTooltipText value={footerLabel} placement=\"bottom-start\" />\n              ) : (\n                footerLabel\n              )}\n            </StyledFooterLabel>\n            <StyledFooterSeparator mt=\"xxxs\" />\n            <StyledMenuCollapse\n              size=\"m\"\n              color={['brand-primary', 800]}\n              onClick={(e: React.MouseEvent) => {\n                e.stopPropagation();\n                handleOnClick(e);\n              }}\n              data-testid=\"leftnav-footer-btn\"\n              tabIndex={0}\n              onFocus={(e: React.FocusEvent) => {\n                e.stopPropagation();\n                setFocusedItem(FOOTER_MENU_CLOSE_DS_ID);\n              }}\n              role=\"button\"\n              aria-label=\"Collapse left navigation\"\n            />\n          </>\n        )}\n      </StyledFooterItem>\n    </StyledFooterMenu>\n  );\n};\n\nexport default LeftNavFooterItem;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,mBAAkC;AAClC,sBAA2B;AAC3B,uCAA2C;AAC3C,oBAOO;AACP,mBAAsC;AACtC,mCAAkC;AAClC,uBAAsD;AAQ/C,MAAM,oBAAiE,CAAC,UAAU;AACvF,QAAM,EAAE,aAAa,iBAAiB,MAAM,MAAM,gBAAgB,MAAM,KAAK,IAAI;AACjF,QAAM;AAAA,IACJ,cAAc,EAAE,cAAc;AAAA,IAC9B;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,6BAAAA,OAAqB;AAEpC,QAAM,KAAK;AAEX,QAAM,gBAAgB,uBAAuB,gBAAgB;AAE7D,QAAM,gBAAY,oCAAsB;AAAA,IACtC,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,UAAU;AAAA,QACR,YAAY,CAAC;AAAA,QACb,UAAU;AAAA,QACV,UAAU;AAAA,MACZ;AAAA,IACF;AAAA,IACA,SAAS;AAAA,EACX,CAAC;AAED,SACE,4CAAC;AAAA,IAA0B,eAAY;AAAA,IACrC,sDAAC;AAAA,MACC,KAAK,iBAAiB,QAAQ;AAAA,MAC9B,UAAU,uBAAuB,KAAK;AAAA,MACtC,UAAU;AAAA,MACV,IAAG;AAAA,MACH,QAAQ,uBAAuB,SAAS;AAAA,MACxC,YAAW;AAAA,MACX,IAAG;AAAA,MACH,MAAM,uBAAuB,CAAC,QAAQ,OAAO,MAAM,IAAI,CAAC,MAAM;AAAA,MAC9D,SAAS,uBAAuB,MAAM,OAAO;AAAA,MAC7C;AAAA,MACA,SAAS,MAAM,eAAe,EAAE;AAAA,MAChC,eAAY;AAAA,MACZ,MAAK;AAAA,MACL,cACE,uBACI,WAAW,OAAO,gBAAgB,WAAW,cAAc,OAC3D;AAAA,MAGL,WAAC,uBACA,4CAAC;AAAA,QAAW,MAAK;AAAA,QAAI,OAAO,CAAC,iBAAiB,GAAG;AAAA,QAAG,eAAY;AAAA,OAAqB,IAErF;AAAA,QACE;AAAA,sDAAC;AAAA,YACC,IAAG;AAAA,YACH,IAAG;AAAA,YACH,IAAG;AAAA,YACH,eAAY;AAAA,YACZ;AAAA,YACA,aAAU;AAAA,YAET,4BAAkB,aACjB,4CAAC;AAAA,cAA2B,OAAO;AAAA,cAAa,WAAU;AAAA,aAAe,IAEzE;AAAA,WAEJ;AAAA,UACA,4CAAC;AAAA,YAAsB,IAAG;AAAA,WAAO;AAAA,UACjC,4CAAC;AAAA,YACC,MAAK;AAAA,YACL,OAAO,CAAC,iBAAiB,GAAG;AAAA,YAC5B,SAAS,CAAC,MAAwB;AAChC,gBAAE,gBAAgB;AAClB,4BAAc,CAAC;AAAA,YACjB;AAAA,YACA,eAAY;AAAA,YACZ,UAAU;AAAA,YACV,SAAS,CAAC,MAAwB;AAChC,gBAAE,gBAAgB;AAClB,6BAAe,wCAAuB;AAAA,YACxC;AAAA,YACA,MAAK;AAAA,YACL,cAAW;AAAA,WACb;AAAA;AAAA,OACF;AAAA,KAEJ;AAAA,KA1DqB,EA2DvB;AAEJ;AAEA,IAAO,4BAAQ;",
+  "names": ["LeftNavigationContext"]
 }

package/dist/cjs/parts/LeftNavFooterItem/styled.js

@@ -24,12 +24,11 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var styled_exports = {};
 __export(styled_exports, {
+  StyledFooterItem: () => StyledFooterItem,
+  StyledFooterLabel: () => StyledFooterLabel,
   StyledFooterMenu: () => StyledFooterMenu,
-  StyledItem: () => StyledItem,
-  StyledItemWrapper: () => StyledItemWrapper,
-  StyledLabel: () => StyledLabel,
-  StyledMenuCollapse: () => StyledMenuCollapse,
-  StyledSeparator: () => StyledSeparator
+  StyledFooterSeparator: () => StyledFooterSeparator,
+  StyledMenuCollapse: () => StyledMenuCollapse
 });
 module.exports = __toCommonJS(styled_exports);
 var React = __toESM(require("react"));
@@ -37,20 +36,18 @@ var import_ds_system = require("@elliemae/ds-system");
 var import_ds_grid = require("@elliemae/ds-grid");
 var import_ds_icons = require("@elliemae/ds-icons");
 var import_common = require("../../common");
-const StyledFooterMenu = (0, import_ds_system.styled)(import_ds_grid.Grid)`
+var import_constants = require("../../constants");
+const StyledFooterMenu = (0, import_ds_system.styled)(import_ds_grid.Grid, { name: import_constants.DSLeftNavigationName, slot: import_constants.DSLeftNavigationSlots.FOOTER_MENU })`
   width: 100%;
   margin-top: auto;
   background: ${(props) => props.theme.colors.neutral["000"]};
 
-  ${import_common.getLeftBorderStyle}
-
   border-top: 1px solid ${(props) => props.theme.colors.neutral[100]};
 `;
-const StyledItemWrapper = (0, import_ds_system.styled)(import_ds_grid.Grid)`
+const StyledFooterItem = (0, import_ds_system.styled)(import_ds_grid.Grid, { name: import_constants.DSLeftNavigationName, slot: import_constants.DSLeftNavigationSlots.FOOTER_ITEM })`
   position: relative;
-  padding-left: ${(props) => props.theme.space.xxxs};
-`;
-const StyledItem = (0, import_ds_system.styled)(import_ds_grid.Grid)`
+  ${import_common.getLeftBorderStyle}
+
   min-height: 48px;
   cursor: ${(props) => props.expanded ? "auto" : "pointer"};
 
@@ -71,18 +68,28 @@ const StyledItem = (0, import_ds_system.styled)(import_ds_grid.Grid)`
     }
   }
 `;
-const StyledLabel = (0, import_ds_system.styled)(import_ds_grid.Grid)`
+const StyledFooterLabel = (0, import_ds_system.styled)(import_ds_grid.Grid, {
+  name: import_constants.DSLeftNavigationName,
+  slot: import_constants.DSLeftNavigationSlots.FOOTER_LABEL
+})`
   font-size: 11px;
   color: ${(props) => props.theme.colors.neutral[500]};
   line-height: 14px;
   word-break: ${(props) => props.labelOverflow === "wrapAll" ? "break-all" : "normal"};
 `;
-const StyledSeparator = (0, import_ds_system.styled)(import_ds_grid.Grid)`
+const StyledFooterSeparator = (0, import_ds_system.styled)(import_ds_grid.Grid, {
+  name: import_constants.DSLeftNavigationName,
+  slot: import_constants.DSLeftNavigationSlots.FOOTER_SEPARATOR
+})`
   height: 16px;
   width: 1px;
   background-color: ${(props) => props.theme.colors.neutral[100]};
 `;
-const StyledMenuCollapse = (0, import_ds_system.styled)(import_ds_icons.MenuCollapse)`
+const StyledMenuCollapse = (0, import_ds_system.styled)(import_ds_icons.MenuCollapse, {
+  name: import_constants.DSLeftNavigationName,
+  slot: import_constants.DSLeftNavigationSlots.FOOTER_MENU_COLLAPSE
+})`
+  margin: 0 12px;
   cursor: pointer;
   :focus {
     outline: 2px solid ${(props) => props.theme.colors.brand[700]};

package/dist/cjs/parts/LeftNavFooterItem/styled.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/LeftNavFooterItem/styled.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { MenuCollapse } from '@elliemae/ds-icons';\nimport { getLeftBorderStyle, getItemBackgroundStyle } from '../../common';\n\nexport const StyledFooterMenu = styled(Grid)`\n  width: 100%;\n  margin-top: auto;\n  background: ${(props) => props.theme.colors.neutral['000']};\n\n  ${getLeftBorderStyle}\n\n  border-top: 1px solid ${(props) => props.theme.colors.neutral[100]};\n`;\n\nexport const StyledItemWrapper = styled(Grid)`\n  position: relative;\n  padding-left: ${(props) => props.theme.space.xxxs};\n`;\n\nexport const StyledItem = styled(Grid)`\n  min-height: 48px;\n  cursor: ${(props) => (props.expanded ? 'auto' : 'pointer')};\n\n  ${getItemBackgroundStyle}\n\n  outline: none;\n\n  :focus {\n    &:before {\n      content: '';\n      position: absolute;\n      height: 100%;\n      width: 100%;\n      top: 0;\n      left: 0px;\n      border: 2px solid ${(props) => props.theme.colors.brand[600]};\n      pointer-events: none;\n    }\n  }\n`;\n\nexport const StyledLabel = styled(Grid)`\n  font-size: 11px;\n  color: ${(props) => props.theme.colors.neutral[500]};\n  line-height: 14px;\n  word-break: ${(props) => (props.labelOverflow === 'wrapAll' ? 'break-all' : 'normal')};\n`;\n\nexport const StyledSeparator = styled(Grid)`\n  height: 16px;\n  width: 1px;\n  background-color: ${(props) => props.theme.colors.neutral[100]};\n`;\n\nexport const StyledMenuCollapse = styled(MenuCollapse)`\n  cursor: pointer;\n  :focus {\n    outline: 2px solid ${(props) => props.theme.colors.brand[700]};\n  }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,qBAAqB;AACrB,sBAA6B;AAC7B,oBAA2D;AAEpD,MAAM,uBAAmB,yBAAO,mBAAI;AAAA;AAAA;AAAA,gBAG3B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,IAElD;AAAA;AAAA,0BAEsB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGzD,MAAM,wBAAoB,yBAAO,mBAAI;AAAA;AAAA,kBAE1B,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAGxC,MAAM,iBAAa,yBAAO,mBAAI;AAAA;AAAA,YAEzB,CAAC,UAAW,MAAM,WAAW,SAAS;AAAA;AAAA,IAE9C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAYsB,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAMvD,MAAM,kBAAc,yBAAO,mBAAI;AAAA;AAAA,WAE3B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,gBAEjC,CAAC,UAAW,MAAM,kBAAkB,YAAY,cAAc;AAAA;AAGvE,MAAM,sBAAkB,yBAAO,mBAAI;AAAA;AAAA;AAAA,sBAGpB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGrD,MAAM,yBAAqB,yBAAO,4BAAY;AAAA;AAAA;AAAA,yBAG5B,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;",
+  "sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { MenuCollapse } from '@elliemae/ds-icons';\nimport { getLeftBorderStyle, getItemBackgroundStyle } from '../../common';\nimport { DSLeftNavigationName, DSLeftNavigationSlots } from '../../constants';\n\nexport const StyledFooterMenu = styled(Grid, { name: DSLeftNavigationName, slot: DSLeftNavigationSlots.FOOTER_MENU })`\n  width: 100%;\n  margin-top: auto;\n  background: ${(props) => props.theme.colors.neutral['000']};\n\n  border-top: 1px solid ${(props) => props.theme.colors.neutral[100]};\n`;\n\nexport const StyledFooterItem = styled(Grid, { name: DSLeftNavigationName, slot: DSLeftNavigationSlots.FOOTER_ITEM })<{\n  expanded: boolean;\n  opened: boolean;\n  selected: boolean;\n}>`\n  position: relative;\n  ${getLeftBorderStyle}\n\n  min-height: 48px;\n  cursor: ${(props) => (props.expanded ? 'auto' : 'pointer')};\n\n  ${getItemBackgroundStyle}\n\n  outline: none;\n\n  :focus {\n    &:before {\n      content: '';\n      position: absolute;\n      height: 100%;\n      width: 100%;\n      top: 0;\n      left: 0px;\n      border: 2px solid ${(props) => props.theme.colors.brand[600]};\n      pointer-events: none;\n    }\n  }\n`;\n\nexport const StyledFooterLabel = styled(Grid, {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.FOOTER_LABEL,\n})<{ labelOverflow: string }>`\n  font-size: 11px;\n  color: ${(props) => props.theme.colors.neutral[500]};\n  line-height: 14px;\n  word-break: ${(props) => (props.labelOverflow === 'wrapAll' ? 'break-all' : 'normal')};\n`;\n\nexport const StyledFooterSeparator = styled(Grid, {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.FOOTER_SEPARATOR,\n})`\n  height: 16px;\n  width: 1px;\n  background-color: ${(props) => props.theme.colors.neutral[100]};\n`;\n\nexport const StyledMenuCollapse = styled(MenuCollapse, {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.FOOTER_MENU_COLLAPSE,\n})`\n  margin: 0 12px;\n  cursor: pointer;\n  :focus {\n    outline: 2px solid ${(props) => props.theme.colors.brand[700]};\n  }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,qBAAqB;AACrB,sBAA6B;AAC7B,oBAA2D;AAC3D,uBAA4D;AAErD,MAAM,uBAAmB,yBAAO,qBAAM,EAAE,MAAM,uCAAsB,MAAM,uCAAsB,YAAY,CAAC;AAAA;AAAA;AAAA,gBAGpG,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,0BAE5B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGzD,MAAM,uBAAmB,yBAAO,qBAAM,EAAE,MAAM,uCAAsB,MAAM,uCAAsB,YAAY,CAAC;AAAA;AAAA,IAMhH;AAAA;AAAA;AAAA,YAGQ,CAAC,UAAW,MAAM,WAAW,SAAS;AAAA;AAAA,IAE9C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAYsB,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAMvD,MAAM,wBAAoB,yBAAO,qBAAM;AAAA,EAC5C,MAAM;AAAA,EACN,MAAM,uCAAsB;AAC9B,CAAC;AAAA;AAAA,WAEU,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,gBAEjC,CAAC,UAAW,MAAM,kBAAkB,YAAY,cAAc;AAAA;AAGvE,MAAM,4BAAwB,yBAAO,qBAAM;AAAA,EAChD,MAAM;AAAA,EACN,MAAM,uCAAsB;AAC9B,CAAC;AAAA;AAAA;AAAA,sBAGqB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGrD,MAAM,yBAAqB,yBAAO,8BAAc;AAAA,EACrD,MAAM;AAAA,EACN,MAAM,uCAAsB;AAC9B,CAAC;AAAA;AAAA;AAAA;AAAA,yBAIwB,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;",
   "names": []
 }

package/dist/cjs/parts/LeftNavLoading/index.js

@@ -32,7 +32,8 @@ var import_jsx_runtime = require("react/jsx-runtime");
 var import_ds_circular_progress_indicator = __toESM(require("@elliemae/ds-circular-progress-indicator"));
 var import_ds_grid = __toESM(require("@elliemae/ds-grid"));
 var import_ds_system = require("@elliemae/ds-system");
-const StyledLoaderWrapper = (0, import_ds_system.styled)(import_ds_grid.default)`
+var import_constants = require("../../constants");
+const StyledLoaderWrapper = (0, import_ds_system.styled)(import_ds_grid.default, { name: import_constants.DSLeftNavigationName, slot: import_constants.DSLeftNavigationSlots.LOADER_WRAPPER })`
   grid-area: left-nav-body;
   height: 100%;
   place-items: center;

package/dist/cjs/parts/LeftNavLoading/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/LeftNavLoading/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport DSCircularProgressIndicator from '@elliemae/ds-circular-progress-indicator';\nimport Grid from '@elliemae/ds-grid';\nimport { styled } from '@elliemae/ds-system';\n\nconst StyledLoaderWrapper = styled(Grid)`\n  grid-area: left-nav-body;\n  height: 100%;\n  place-items: center;\n  z-index: 0;\n  background-color: white;\n`;\n\nexport const LeftNavLoading: React.ComponentType<{ expanded: boolean }> = ({ expanded }) => (\n  <StyledLoaderWrapper>\n    <DSCircularProgressIndicator\n      size={expanded ? 'xl' : 'm'}\n      loading\n      showLabel={expanded}\n      waiting={false}\n      showTooltip={!expanded}\n    />\n  </StyledLoaderWrapper>\n);\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,4CAAwC;AACxC,qBAAiB;AACjB,uBAAuB;AAEvB,MAAM,0BAAsB,yBAAO,eAAAA,OAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQhC,MAAM,iBAA6D,CAAC,EAAE,SAAS,MACpF,4CAAC;AAAA,EACC,sDAAC,sCAAAC,SAAA;AAAA,IACC,MAAM,WAAW,OAAO;AAAA,IACxB,SAAO;AAAA,IACP,WAAW;AAAA,IACX,SAAS;AAAA,IACT,aAAa,CAAC;AAAA,GAChB;AAAA,CACF;",
+  "sourcesContent": ["import React from 'react';\nimport DSCircularProgressIndicator from '@elliemae/ds-circular-progress-indicator';\nimport Grid from '@elliemae/ds-grid';\nimport { styled } from '@elliemae/ds-system';\nimport { DSLeftNavigationName, DSLeftNavigationSlots } from '../../constants';\n\nconst StyledLoaderWrapper = styled(Grid, { name: DSLeftNavigationName, slot: DSLeftNavigationSlots.LOADER_WRAPPER })`\n  grid-area: left-nav-body;\n  height: 100%;\n  place-items: center;\n  z-index: 0;\n  background-color: white;\n`;\n\nexport const LeftNavLoading: React.ComponentType<{ expanded: boolean }> = ({ expanded }) => (\n  <StyledLoaderWrapper>\n    <DSCircularProgressIndicator\n      size={expanded ? 'xl' : 'm'}\n      loading\n      showLabel={expanded}\n      waiting={false}\n      showTooltip={!expanded}\n    />\n  </StyledLoaderWrapper>\n);\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,4CAAwC;AACxC,qBAAiB;AACjB,uBAAuB;AACvB,uBAA4D;AAE5D,MAAM,0BAAsB,yBAAO,eAAAA,SAAM,EAAE,MAAM,uCAAsB,MAAM,uCAAsB,eAAe,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ5G,MAAM,iBAA6D,CAAC,EAAE,SAAS,MACpF,4CAAC;AAAA,EACC,sDAAC,sCAAAC,SAAA;AAAA,IACC,MAAM,WAAW,OAAO;AAAA,IACxB,SAAO;AAAA,IACP,WAAW;AAAA,IACX,SAAS;AAAA,IACT,aAAa,CAAC;AAAA,GAChB;AAAA,CACF;",
   "names": ["Grid", "DSCircularProgressIndicator"]
 }

package/dist/cjs/parts/OutOfTheBoxMapItem.js

@@ -45,6 +45,8 @@ const OutOfTheBoxMapItem = (props) => {
       ctx
     });
   }
+  if (!Component)
+    return null;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, {
     item,
     ctx

package/dist/cjs/parts/OutOfTheBoxMapItem.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/parts/OutOfTheBoxMapItem.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport { outOfTheBoxComponents } from '../outOfTheBox';\nimport { OutOfTheBoxMapItemT } from '../index.d';\nimport { LeftNavContext } from '../LeftNavigationContext';\n\nexport const OutOfTheBoxMapItem = (props: OutOfTheBoxMapItemT): JSX.Element => {\n  const {\n    item,\n    item: { type, Component },\n  } = props;\n  const ctx = React.useContext(LeftNavContext);\n\n  if (typeof type === 'string' && !!outOfTheBoxComponents[type]) {\n    const OutOfTheBoxComponent = outOfTheBoxComponents[type];\n    return <OutOfTheBoxComponent item={{ itemOpts: {}, ...item }} ctx={ctx} />;\n  }\n  // we expect an error to be threw if Component is not defined and type is not a valid out-of-the-box...\n  return <Component item={item} ctx={ctx} />;\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAAkB;AAClB,yBAAsC;AAEtC,mCAA+B;AAExB,MAAM,qBAAqB,CAAC,UAA4C;AAC7E,QAAM;AAAA,IACJ;AAAA,IACA,MAAM,EAAE,MAAM,UAAU;AAAA,EAC1B,IAAI;AACJ,QAAM,MAAM,aAAAA,QAAM,WAAW,2CAAc;AAE3C,MAAI,OAAO,SAAS,YAAY,CAAC,CAAC,yCAAsB,OAAO;AAC7D,UAAM,uBAAuB,yCAAsB;AACnD,WAAO,4CAAC;AAAA,MAAqB,MAAM,EAAE,UAAU,CAAC,GAAG,GAAG,KAAK;AAAA,MAAG;AAAA,KAAU;AAAA,EAC1E;AAEA,SAAO,4CAAC;AAAA,IAAU;AAAA,IAAY;AAAA,GAAU;AAC1C;",
+  "sourcesContent": ["import React from 'react';\nimport { outOfTheBoxComponents } from '../outOfTheBox';\nimport { OutOfTheBoxMapItemT } from '../index.d';\nimport { LeftNavContext } from '../LeftNavigationContext';\n\nexport const OutOfTheBoxMapItem: React.ComponentType<OutOfTheBoxMapItemT> = (props) => {\n  const {\n    item,\n    item: { type, Component },\n  } = props;\n  const ctx = React.useContext(LeftNavContext);\n\n  if (typeof type === 'string' && !!outOfTheBoxComponents[type]) {\n    const OutOfTheBoxComponent = outOfTheBoxComponents[type];\n    return <OutOfTheBoxComponent item={{ itemOpts: {}, ...item }} ctx={ctx} />;\n  }\n  if (!Component) return null;\n  // we expect an error to be threw if Component is not defined and type is not a valid out-of-the-box...\n  return <Component item={item} ctx={ctx} />;\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAAkB;AAClB,yBAAsC;AAEtC,mCAA+B;AAExB,MAAM,qBAA+D,CAAC,UAAU;AACrF,QAAM;AAAA,IACJ;AAAA,IACA,MAAM,EAAE,MAAM,UAAU;AAAA,EAC1B,IAAI;AACJ,QAAM,MAAM,aAAAA,QAAM,WAAW,2CAAc;AAE3C,MAAI,OAAO,SAAS,YAAY,CAAC,CAAC,yCAAsB,OAAO;AAC7D,UAAM,uBAAuB,yCAAsB;AACnD,WAAO,4CAAC;AAAA,MAAqB,MAAM,EAAE,UAAU,CAAC,GAAG,GAAG,KAAK;AAAA,MAAG;AAAA,KAAU;AAAA,EAC1E;AACA,MAAI,CAAC;AAAW,WAAO;AAEvB,SAAO,4CAAC;AAAA,IAAU;AAAA,IAAY;AAAA,GAAU;AAC1C;",
   "names": ["React"]
 }

package/dist/cjs/prop-types.js

@@ -46,7 +46,6 @@ const leftNavigationProps = {
   containerProps: import_ds_utilities.PropTypes.shape({ expandedWidth: import_ds_utilities.PropTypes.string }).description("Set of Properties attached to the main container").defaultValue({ expandedWidth: "240px" }),
   expanded: import_ds_utilities.PropTypes.bool.description("Whether to show the left navigation expanded or collapsed").defaultValue(false),
   loading: import_ds_utilities.PropTypes.bool.description("Whether the left-nav is loading").defaultValue(false),
-  tabIndex: import_ds_utilities.PropTypes.number.description("Tab index").defaultValue(0),
   openedItem: import_ds_utilities.PropTypes.string.description("The id of the left navigation item you want to be opened").defaultValue(null),
   footerLabel: import_ds_utilities.PropTypes.string.description("The label to show in the footer item"),
   onFooterExpand: import_ds_utilities.PropTypes.func.description("The function to call when the left-nav is opened via the footer"),

package/dist/cjs/prop-types.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/prop-types.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { outOfTheBoxTypes } from './outOfTheBox';\n\nexport const leftNavItemProps = {\n  type: PropTypes.oneOf(outOfTheBoxTypes).description('out of the box types'),\n  dsId: PropTypes.string.description('unique identifier for the left nav item'),\n  Component: PropTypes.func.description(\n    \"A custom component, receives the item as prop. This is used only when type is not defined or doesn't matches any out-of-the-box\",\n  ),\n  CollapsedComponent: PropTypes.func.description('A component which is renderer when the left-nav is collapsed'),\n  itemOpts: PropTypes.object.description('Item options'),\n};\n\nexport const leftNavigationProps = {\n  containerProps: PropTypes.shape({ expandedWidth: PropTypes.string })\n    .description('Set of Properties attached to the main container')\n    .defaultValue({ expandedWidth: '240px' }),\n  expanded: PropTypes.bool.description('Whether to show the left navigation expanded or collapsed').defaultValue(false),\n  loading: PropTypes.bool.description('Whether the left-nav is loading').defaultValue(false),\n  tabIndex: PropTypes.number.description('Tab index').defaultValue(0),\n  openedItem: PropTypes.string\n    .description('The id of the left navigation item you want to be opened')\n    .defaultValue(null),\n  footerLabel: PropTypes.string.description('The label to show in the footer item'),\n  onFooterExpand: PropTypes.func.description('The function to call when the left-nav is opened via the footer'),\n  onFooterClose: PropTypes.func.description('The function to call when the left-nav is closed via the footer'),\n  onSelectedChange: PropTypes.func\n    .description('A callback which triggers when the selected item changes')\n    .defaultValue(() => null),\n  onFocusChange: PropTypes.func\n    .description('A callback which triggers when the focused item changes')\n    .defaultValue(() => null),\n  items: PropTypes.arrayOf(PropTypes.object)\n    .description('The array of items you want to render inside the left nav')\n    .defaultValue([]),\n  disableDefaultSelection: PropTypes.bool\n    .description('Whether you do not want to automatically select the first body item')\n    .defaultValue(false),\n};\n\nconst LeftNavItemProps = () => null;\nLeftNavItemProps.displayName = 'LeftNavItemProps';\nexport const LeftNavItemPropsSchema = describe(LeftNavItemProps);\nLeftNavItemPropsSchema.propTypes = leftNavItemProps;\n\nconst LeftNavItemOptions = () => null;\nLeftNavItemOptions.displayName = 'LeftNavItemOptions';\nexport const LeftNavItemOptionsSchema = describe(LeftNavItemOptions);\nLeftNavItemOptionsSchema.propTypes = leftNavItemProps;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAAoC;AACpC,yBAAiC;AAE1B,MAAM,mBAAmB;AAAA,EAC9B,MAAM,8BAAU,MAAM,mCAAgB,EAAE,YAAY,sBAAsB;AAAA,EAC1E,MAAM,8BAAU,OAAO,YAAY,yCAAyC;AAAA,EAC5E,WAAW,8BAAU,KAAK;AAAA,IACxB;AAAA,EACF;AAAA,EACA,oBAAoB,8BAAU,KAAK,YAAY,8DAA8D;AAAA,EAC7G,UAAU,8BAAU,OAAO,YAAY,cAAc;AACvD;AAEO,MAAM,sBAAsB;AAAA,EACjC,gBAAgB,8BAAU,MAAM,EAAE,eAAe,8BAAU,OAAO,CAAC,EAChE,YAAY,kDAAkD,EAC9D,aAAa,EAAE,eAAe,QAAQ,CAAC;AAAA,EAC1C,UAAU,8BAAU,KAAK,YAAY,2DAA2D,EAAE,aAAa,KAAK;AAAA,EACpH,SAAS,8BAAU,KAAK,YAAY,iCAAiC,EAAE,aAAa,KAAK;AAAA,EACzF,UAAU,8BAAU,OAAO,YAAY,WAAW,EAAE,aAAa,CAAC;AAAA,EAClE,YAAY,8BAAU,OACnB,YAAY,0DAA0D,EACtE,aAAa,IAAI;AAAA,EACpB,aAAa,8BAAU,OAAO,YAAY,sCAAsC;AAAA,EAChF,gBAAgB,8BAAU,KAAK,YAAY,iEAAiE;AAAA,EAC5G,eAAe,8BAAU,KAAK,YAAY,iEAAiE;AAAA,EAC3G,kBAAkB,8BAAU,KACzB,YAAY,0DAA0D,EACtE,aAAa,MAAM,IAAI;AAAA,EAC1B,eAAe,8BAAU,KACtB,YAAY,yDAAyD,EACrE,aAAa,MAAM,IAAI;AAAA,EAC1B,OAAO,8BAAU,QAAQ,8BAAU,MAAM,EACtC,YAAY,2DAA2D,EACvE,aAAa,CAAC,CAAC;AAAA,EAClB,yBAAyB,8BAAU,KAChC,YAAY,qEAAqE,EACjF,aAAa,KAAK;AACvB;AAEA,MAAM,mBAAmB,MAAM;AAC/B,iBAAiB,cAAc;AACxB,MAAM,6BAAyB,8BAAS,gBAAgB;AAC/D,uBAAuB,YAAY;AAEnC,MAAM,qBAAqB,MAAM;AACjC,mBAAmB,cAAc;AAC1B,MAAM,+BAA2B,8BAAS,kBAAkB;AACnE,yBAAyB,YAAY;",
+  "sourcesContent": ["import { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { outOfTheBoxTypes } from './outOfTheBox';\n\nexport const leftNavItemProps = {\n  type: PropTypes.oneOf(outOfTheBoxTypes).description('out of the box types'),\n  dsId: PropTypes.string.description('unique identifier for the left nav item'),\n  Component: PropTypes.func.description(\n    \"A custom component, receives the item as prop. This is used only when type is not defined or doesn't matches any out-of-the-box\",\n  ),\n  CollapsedComponent: PropTypes.func.description('A component which is renderer when the left-nav is collapsed'),\n  itemOpts: PropTypes.object.description('Item options'),\n};\n\nexport const leftNavigationProps = {\n  containerProps: PropTypes.shape({ expandedWidth: PropTypes.string })\n    .description('Set of Properties attached to the main container')\n    .defaultValue({ expandedWidth: '240px' }),\n  expanded: PropTypes.bool.description('Whether to show the left navigation expanded or collapsed').defaultValue(false),\n  loading: PropTypes.bool.description('Whether the left-nav is loading').defaultValue(false),\n  openedItem: PropTypes.string\n    .description('The id of the left navigation item you want to be opened')\n    .defaultValue(null),\n  footerLabel: PropTypes.string.description('The label to show in the footer item'),\n  onFooterExpand: PropTypes.func.description('The function to call when the left-nav is opened via the footer'),\n  onFooterClose: PropTypes.func.description('The function to call when the left-nav is closed via the footer'),\n  onSelectedChange: PropTypes.func\n    .description('A callback which triggers when the selected item changes')\n    .defaultValue(() => null),\n  onFocusChange: PropTypes.func\n    .description('A callback which triggers when the focused item changes')\n    .defaultValue(() => null),\n  items: PropTypes.arrayOf(PropTypes.object)\n    .description('The array of items you want to render inside the left nav')\n    .defaultValue([]),\n  disableDefaultSelection: PropTypes.bool\n    .description('Whether you do not want to automatically select the first body item')\n    .defaultValue(false),\n};\n\nconst LeftNavItemProps = () => null;\nLeftNavItemProps.displayName = 'LeftNavItemProps';\nexport const LeftNavItemPropsSchema = describe(LeftNavItemProps);\nLeftNavItemPropsSchema.propTypes = leftNavItemProps;\n\nconst LeftNavItemOptions = () => null;\nLeftNavItemOptions.displayName = 'LeftNavItemOptions';\nexport const LeftNavItemOptionsSchema = describe(LeftNavItemOptions);\nLeftNavItemOptionsSchema.propTypes = leftNavItemProps;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAAoC;AACpC,yBAAiC;AAE1B,MAAM,mBAAmB;AAAA,EAC9B,MAAM,8BAAU,MAAM,mCAAgB,EAAE,YAAY,sBAAsB;AAAA,EAC1E,MAAM,8BAAU,OAAO,YAAY,yCAAyC;AAAA,EAC5E,WAAW,8BAAU,KAAK;AAAA,IACxB;AAAA,EACF;AAAA,EACA,oBAAoB,8BAAU,KAAK,YAAY,8DAA8D;AAAA,EAC7G,UAAU,8BAAU,OAAO,YAAY,cAAc;AACvD;AAEO,MAAM,sBAAsB;AAAA,EACjC,gBAAgB,8BAAU,MAAM,EAAE,eAAe,8BAAU,OAAO,CAAC,EAChE,YAAY,kDAAkD,EAC9D,aAAa,EAAE,eAAe,QAAQ,CAAC;AAAA,EAC1C,UAAU,8BAAU,KAAK,YAAY,2DAA2D,EAAE,aAAa,KAAK;AAAA,EACpH,SAAS,8BAAU,KAAK,YAAY,iCAAiC,EAAE,aAAa,KAAK;AAAA,EACzF,YAAY,8BAAU,OACnB,YAAY,0DAA0D,EACtE,aAAa,IAAI;AAAA,EACpB,aAAa,8BAAU,OAAO,YAAY,sCAAsC;AAAA,EAChF,gBAAgB,8BAAU,KAAK,YAAY,iEAAiE;AAAA,EAC5G,eAAe,8BAAU,KAAK,YAAY,iEAAiE;AAAA,EAC3G,kBAAkB,8BAAU,KACzB,YAAY,0DAA0D,EACtE,aAAa,MAAM,IAAI;AAAA,EAC1B,eAAe,8BAAU,KACtB,YAAY,yDAAyD,EACrE,aAAa,MAAM,IAAI;AAAA,EAC1B,OAAO,8BAAU,QAAQ,8BAAU,MAAM,EACtC,YAAY,2DAA2D,EACvE,aAAa,CAAC,CAAC;AAAA,EAClB,yBAAyB,8BAAU,KAChC,YAAY,qEAAqE,EACjF,aAAa,KAAK;AACvB;AAEA,MAAM,mBAAmB,MAAM;AAC/B,iBAAiB,cAAc;AACxB,MAAM,6BAAyB,8BAAS,gBAAgB;AAC/D,uBAAuB,YAAY;AAEnC,MAAM,qBAAqB,MAAM;AACjC,mBAAmB,cAAc;AAC1B,MAAM,+BAA2B,8BAAS,kBAAkB;AACnE,yBAAyB,YAAY;",
   "names": []
 }

package/dist/esm/LeftNavigationContext.js

@@ -2,7 +2,6 @@ import * as React from "react";
 import { createContext } from "react";
 const defaultProps = {
   expandedWidth: "240px",
-  tabIndex: 0,
   loading: false,
   expanded: false,
   openedItem: null,
@@ -19,6 +18,8 @@ const defaultContext = {
   leftNavProps: defaultProps,
   selectedItem: null,
   setSelectedItem: () => null,
+  selectedParent: null,
+  setSelectedParent: () => null,
   focusedItem: null,
   setFocusedItem: () => null,
   expandedForAnimation: true,

package/dist/esm/LeftNavigationContext.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/LeftNavigationContext.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { createContext, MutableRefObject, RefObject } from 'react';\nimport type { LeftNavProps, LabelOveflowT } from './index.d';\n\nexport type ContextProps = {\n  selectedItem: string | null;\n  setSelectedItem: React.Dispatch<React.SetStateAction<string | null>>;\n  focusedItem: string | null;\n  setFocusedItem: React.Dispatch<React.SetStateAction<string | null>>;\n  openedDrilldowns: string[];\n  setOpenedDrilldowns: React.Dispatch<React.SetStateAction<string[]>>;\n  visibleItems: string[];\n  visibleItemsRefs: MutableRefObject<Record<string, RefObject<HTMLElement>>>;\n  leftNavProps: LeftNavProps;\n  expandedForAnimation: boolean;\n};\n\nexport const defaultProps: LeftNavProps = {\n  expandedWidth: '240px',\n  tabIndex: 0,\n  loading: false,\n  expanded: false,\n  openedItem: null,\n  footerLabel: '',\n  onSelectedChange: () => null,\n  onFocusChange: () => null,\n  onFooterExpand: () => null,\n  onFooterClose: () => null,\n  items: [],\n  labelOverflow: 'wrap' as LabelOveflowT,\n  onItemClick: () => null,\n};\n\nexport const defaultContext: ContextProps = {\n  leftNavProps: defaultProps,\n  selectedItem: null,\n  setSelectedItem: () => null,\n  focusedItem: null,\n  setFocusedItem: () => null,\n  expandedForAnimation: true,\n  openedDrilldowns: [],\n  setOpenedDrilldowns: () => null,\n  visibleItems: [],\n  visibleItemsRefs: { current: {} },\n};\n\nexport const LeftNavContext = createContext<ContextProps>(defaultContext);\n\nexport default LeftNavContext;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAgB,qBAAkD;AAgB3D,MAAM,eAA6B;AAAA,EACxC,eAAe;AAAA,EACf,UAAU;AAAA,EACV,SAAS;AAAA,EACT,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,kBAAkB,MAAM;AAAA,EACxB,eAAe,MAAM;AAAA,EACrB,gBAAgB,MAAM;AAAA,EACtB,eAAe,MAAM;AAAA,EACrB,OAAO,CAAC;AAAA,EACR,eAAe;AAAA,EACf,aAAa,MAAM;AACrB;AAEO,MAAM,iBAA+B;AAAA,EAC1C,cAAc;AAAA,EACd,cAAc;AAAA,EACd,iBAAiB,MAAM;AAAA,EACvB,aAAa;AAAA,EACb,gBAAgB,MAAM;AAAA,EACtB,sBAAsB;AAAA,EACtB,kBAAkB,CAAC;AAAA,EACnB,qBAAqB,MAAM;AAAA,EAC3B,cAAc,CAAC;AAAA,EACf,kBAAkB,EAAE,SAAS,CAAC,EAAE;AAClC;AAEO,MAAM,iBAAiB,cAA4B,cAAc;AAExE,IAAO,gCAAQ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { createContext, MutableRefObject, RefObject } from 'react';\nimport type { LeftNavProps, LabelOveflowT } from './index.d';\n\nexport type ContextProps = {\n  selectedItem: string | null;\n  setSelectedItem: React.Dispatch<React.SetStateAction<string | null>>;\n  selectedParent: string | null;\n  setSelectedParent: React.Dispatch<React.SetStateAction<string | null>>;\n  focusedItem: string | null;\n  setFocusedItem: React.Dispatch<React.SetStateAction<string | null>>;\n  openedDrilldowns: string[];\n  setOpenedDrilldowns: React.Dispatch<React.SetStateAction<string[]>>;\n  visibleItems: string[];\n  visibleItemsRefs: MutableRefObject<Record<string, RefObject<HTMLElement>>>;\n  leftNavProps: LeftNavProps;\n  expandedForAnimation: boolean;\n};\n\nexport const defaultProps: LeftNavProps = {\n  expandedWidth: '240px',\n  loading: false,\n  expanded: false,\n  openedItem: null,\n  footerLabel: '',\n  onSelectedChange: () => null,\n  onFocusChange: () => null,\n  onFooterExpand: () => null,\n  onFooterClose: () => null,\n  items: [],\n  labelOverflow: 'wrap' as LabelOveflowT,\n  onItemClick: () => null,\n};\n\nexport const defaultContext: ContextProps = {\n  leftNavProps: defaultProps,\n  selectedItem: null,\n  setSelectedItem: () => null,\n  selectedParent: null,\n  setSelectedParent: () => null,\n  focusedItem: null,\n  setFocusedItem: () => null,\n  expandedForAnimation: true,\n  openedDrilldowns: [],\n  setOpenedDrilldowns: () => null,\n  visibleItems: [],\n  visibleItemsRefs: { current: {} },\n};\n\nexport const LeftNavContext = createContext<ContextProps>(defaultContext);\n\nexport default LeftNavContext;\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAgB,qBAAkD;AAkB3D,MAAM,eAA6B;AAAA,EACxC,eAAe;AAAA,EACf,SAAS;AAAA,EACT,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,kBAAkB,MAAM;AAAA,EACxB,eAAe,MAAM;AAAA,EACrB,gBAAgB,MAAM;AAAA,EACtB,eAAe,MAAM;AAAA,EACrB,OAAO,CAAC;AAAA,EACR,eAAe;AAAA,EACf,aAAa,MAAM;AACrB;AAEO,MAAM,iBAA+B;AAAA,EAC1C,cAAc;AAAA,EACd,cAAc;AAAA,EACd,iBAAiB,MAAM;AAAA,EACvB,gBAAgB;AAAA,EAChB,mBAAmB,MAAM;AAAA,EACzB,aAAa;AAAA,EACb,gBAAgB,MAAM;AAAA,EACtB,sBAAsB;AAAA,EACtB,kBAAkB,CAAC;AAAA,EACnB,qBAAqB,MAAM;AAAA,EAC3B,cAAc,CAAC;AAAA,EACf,kBAAkB,EAAE,SAAS,CAAC,EAAE;AAClC;AAEO,MAAM,iBAAiB,cAA4B,cAAc;AAExE,IAAO,gCAAQ;",
   "names": []
 }

package/dist/esm/common/getItemBackgroundStyle.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/common/getItemBackgroundStyle.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "const commonItemBackgroundStyle = (\n  color: string,\n  hoverColor: string,\n  activeColor: string,\n): string => `\n\n  background: ${color};\n\n  :hover {\n    background: ${hoverColor};\n  }\n\n  :active {\n    background: ${activeColor};\n  }\n`;\n\nexport const getItemBackgroundStyle = (props: {\n  theme: any;\n  selected: boolean;\n  opened: boolean;\n}): string => {\n  if (props.selected && !props.opened)\n    return commonItemBackgroundStyle(\n      props.theme.colors.brand[200],\n      props.theme.colors.brand[200],\n      props.theme.colors.brand[200],\n    );\n\n  return commonItemBackgroundStyle(\n    props.theme.colors.neutral['000'],\n    props.theme.colors.neutral['080'],\n    props.theme.colors.brand[200],\n  );\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,MAAM,4BAA4B,CAChC,OACA,YACA,gBACW;AAAA;AAAA,gBAEG;AAAA;AAAA;AAAA,kBAGE;AAAA;AAAA;AAAA;AAAA,kBAIA;AAAA;AAAA;AAIX,MAAM,yBAAyB,CAAC,UAIzB;AACZ,MAAI,MAAM,YAAY,CAAC,MAAM;AAC3B,WAAO;AAAA,MACL,MAAM,MAAM,OAAO,MAAM;AAAA,MACzB,MAAM,MAAM,OAAO,MAAM;AAAA,MACzB,MAAM,MAAM,OAAO,MAAM;AAAA,IAC3B;AAEF,SAAO;AAAA,IACL,MAAM,MAAM,OAAO,QAAQ;AAAA,IAC3B,MAAM,MAAM,OAAO,QAAQ;AAAA,IAC3B,MAAM,MAAM,OAAO,MAAM;AAAA,EAC3B;AACF;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { Theme } from '@elliemae/ds-system';\n\nconst commonItemBackgroundStyle = (color: string, hoverColor: string, activeColor: string): string => `\n\n  background: ${color};\n\n  :hover {\n    background: ${hoverColor};\n  }\n\n  :active {\n    background: ${activeColor};\n  }\n`;\n\nexport const getItemBackgroundStyle = (props: { theme: Theme; selected: boolean; opened: boolean }): string => {\n  if (props.selected && !props.opened)\n    return commonItemBackgroundStyle(\n      props.theme.colors.brand[200],\n      props.theme.colors.brand[200],\n      props.theme.colors.brand[200],\n    );\n\n  return commonItemBackgroundStyle(\n    props.theme.colors.neutral['000'],\n    props.theme.colors.neutral['080'],\n    props.theme.colors.brand[200],\n  );\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACEvB,MAAM,4BAA4B,CAAC,OAAe,YAAoB,gBAAgC;AAAA;AAAA,gBAEtF;AAAA;AAAA;AAAA,kBAGE;AAAA;AAAA;AAAA;AAAA,kBAIA;AAAA;AAAA;AAIX,MAAM,yBAAyB,CAAC,UAAwE;AAC7G,MAAI,MAAM,YAAY,CAAC,MAAM;AAC3B,WAAO;AAAA,MACL,MAAM,MAAM,OAAO,MAAM;AAAA,MACzB,MAAM,MAAM,OAAO,MAAM;AAAA,MACzB,MAAM,MAAM,OAAO,MAAM;AAAA,IAC3B;AAEF,SAAO;AAAA,IACL,MAAM,MAAM,OAAO,QAAQ;AAAA,IAC3B,MAAM,MAAM,OAAO,QAAQ;AAAA,IAC3B,MAAM,MAAM,OAAO,MAAM;AAAA,EAC3B;AACF;",
   "names": []
 }

package/dist/esm/common/getLeftBorderStyle.js

@@ -21,11 +21,7 @@ const getLeftBorderStyle = (props) => {
       props.theme.colors.brand[400],
       props.theme.colors.brand[400]
     );
-  return commonLeftBorderStyle(
-    props.theme.colors.neutral["000"],
-    props.theme.colors.brand[300],
-    props.theme.colors.brand[400]
-  );
+  return commonLeftBorderStyle("transparent", props.theme.colors.brand[300], props.theme.colors.brand[400]);
 };
 export {
   getLeftBorderStyle

package/dist/esm/common/getLeftBorderStyle.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/common/getLeftBorderStyle.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "const commonLeftBorderStyle = (\n  color: string,\n  hoverColor: string,\n  activeColor: string,\n): string => `\n\n  -webkit-box-shadow: inset 4px 0 0 0 ${color};\n          box-shadow: inset 4px 0 0 0 ${color};\n\n  :hover {\n    -webkit-box-shadow: inset 4px 0 0 0 ${hoverColor};\n            box-shadow: inset 4px 0 0 0 ${hoverColor};\n  }\n\n  :active {\n    -webkit-box-shadow: inset 4px 0 0 0 ${activeColor};\n            box-shadow: inset 4px 0 0 0 ${activeColor};\n  }\n`;\n\nexport const getLeftBorderStyle = (props: {\n  theme: any;\n  selected: boolean;\n}): string => {\n  if (props.selected || props.selectedParent)\n    return commonLeftBorderStyle(\n      props.theme.colors.brand[400],\n      props.theme.colors.brand[400],\n      props.theme.colors.brand[400],\n    );\n\n  return commonLeftBorderStyle(\n    props.theme.colors.neutral['000'],\n    props.theme.colors.brand[300],\n    props.theme.colors.brand[400],\n  );\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,MAAM,wBAAwB,CAC5B,OACA,YACA,gBACW;AAAA;AAAA,wCAE2B;AAAA,wCACA;AAAA;AAAA;AAAA,0CAGE;AAAA,0CACA;AAAA;AAAA;AAAA;AAAA,0CAIA;AAAA,0CACA;AAAA;AAAA;AAInC,MAAM,qBAAqB,CAAC,UAGrB;AACZ,MAAI,MAAM,YAAY,MAAM;AAC1B,WAAO;AAAA,MACL,MAAM,MAAM,OAAO,MAAM;AAAA,MACzB,MAAM,MAAM,OAAO,MAAM;AAAA,MACzB,MAAM,MAAM,OAAO,MAAM;AAAA,IAC3B;AAEF,SAAO;AAAA,IACL,MAAM,MAAM,OAAO,QAAQ;AAAA,IAC3B,MAAM,MAAM,OAAO,MAAM;AAAA,IACzB,MAAM,MAAM,OAAO,MAAM;AAAA,EAC3B;AACF;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { Theme } from '@elliemae/ds-system';\n\nconst commonLeftBorderStyle = (color: string, hoverColor: string, activeColor: string): string => `\n\n  -webkit-box-shadow: inset 4px 0 0 0 ${color};\n          box-shadow: inset 4px 0 0 0 ${color};\n\n  :hover {\n    -webkit-box-shadow: inset 4px 0 0 0 ${hoverColor};\n            box-shadow: inset 4px 0 0 0 ${hoverColor};\n  }\n\n  :active {\n    -webkit-box-shadow: inset 4px 0 0 0 ${activeColor};\n            box-shadow: inset 4px 0 0 0 ${activeColor};\n  }\n`;\n\nexport const getLeftBorderStyle = (props: { theme: Theme; selected: boolean; selectedParent: boolean }): string => {\n  if (props.selected || props.selectedParent)\n    return commonLeftBorderStyle(\n      props.theme.colors.brand[400],\n      props.theme.colors.brand[400],\n      props.theme.colors.brand[400],\n    );\n\n  return commonLeftBorderStyle('transparent', props.theme.colors.brand[300], props.theme.colors.brand[400]);\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACEvB,MAAM,wBAAwB,CAAC,OAAe,YAAoB,gBAAgC;AAAA;AAAA,wCAE1D;AAAA,wCACA;AAAA;AAAA;AAAA,0CAGE;AAAA,0CACA;AAAA;AAAA;AAAA;AAAA,0CAIA;AAAA,0CACA;AAAA;AAAA;AAInC,MAAM,qBAAqB,CAAC,UAAgF;AACjH,MAAI,MAAM,YAAY,MAAM;AAC1B,WAAO;AAAA,MACL,MAAM,MAAM,OAAO,MAAM;AAAA,MACzB,MAAM,MAAM,OAAO,MAAM;AAAA,MACzB,MAAM,MAAM,OAAO,MAAM;AAAA,IAC3B;AAEF,SAAO,sBAAsB,eAAe,MAAM,MAAM,OAAO,MAAM,MAAM,MAAM,MAAM,OAAO,MAAM,IAAI;AAC1G;",
   "names": []
 }

package/dist/esm/constants/constants.js

@@ -0,0 +1,39 @@
+import * as React from "react";
+const DSLeftNavigationName = "DSLeftNavigation";
+const DSLeftNavigationSlots = {
+  ROOT: "root",
+  AREAS_CONTAINER: "areas-container",
+  BODY_AREAS_CONTAINER: "body-areas-container",
+  FOOTER_AREA: "footer-area",
+  LOADER_WRAPPER: "loader-wrapper",
+  HEADER_AREA: "header-area",
+  BODY_HEADER_AREA: "body-header-area",
+  BODY_ITEMS_AREA: "body-items-area",
+  CONTENT_WITH_SCROLLBAR: "content-with-scrollbar",
+  FOOTER_MENU: "footer-menu",
+  FOOTER_ITEM: "footer-item",
+  FOOTER_LABEL: "footer-label",
+  FOOTER_SEPARATOR: "footer-separator",
+  FOOTER_MENU_COLLAPSE: "footer-menu-collapse",
+  NOTIFICATIONS_CONTAINER: "notifications-container",
+  ITEM_SEPARATOR: "item-separator",
+  SECTION_LABEL: "section-label",
+  SECTION_RIGHT_LABEL: "section-right-label",
+  VERTICAL_SEPARATOR: "vertical-separator",
+  SECTION_CONTAINER: "section-container",
+  ITEM_LABEL: "item-label",
+  LEFT_CONTAINER: "left-container",
+  BOTTOM_CONTAINER: "bottom-container",
+  RIGHT_CONTAINER: "right-container",
+  ITEM_DATE: "item-date",
+  ITEM_CHEVRON_BACK: "item-chevron-back",
+  ITEM: "item",
+  COLLAPSED_CONTAINER: "collapsed-container",
+  ARROW_CONTAINER: "arrow-container",
+  ITEM_BORDER_BOTTOM: "item-border-bottom"
+};
+export {
+  DSLeftNavigationName,
+  DSLeftNavigationSlots
+};
+//# sourceMappingURL=constants.js.map

package/dist/esm/constants/constants.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/constants/constants.ts"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSLeftNavigationName = 'DSLeftNavigation';\n\nexport const DSLeftNavigationSlots = {\n  ROOT: 'root',\n\n  AREAS_CONTAINER: 'areas-container',\n  BODY_AREAS_CONTAINER: 'body-areas-container',\n  FOOTER_AREA: 'footer-area',\n  LOADER_WRAPPER: 'loader-wrapper',\n  HEADER_AREA: 'header-area',\n  BODY_HEADER_AREA: 'body-header-area',\n  BODY_ITEMS_AREA: 'body-items-area',\n  CONTENT_WITH_SCROLLBAR: 'content-with-scrollbar',\n\n  FOOTER_MENU: 'footer-menu',\n  FOOTER_ITEM: 'footer-item',\n  FOOTER_LABEL: 'footer-label',\n  FOOTER_SEPARATOR: 'footer-separator',\n  FOOTER_MENU_COLLAPSE: 'footer-menu-collapse',\n\n  NOTIFICATIONS_CONTAINER: 'notifications-container',\n\n  ITEM_SEPARATOR: 'item-separator',\n\n  SECTION_LABEL: 'section-label',\n  SECTION_RIGHT_LABEL: 'section-right-label',\n  VERTICAL_SEPARATOR: 'vertical-separator',\n  SECTION_CONTAINER: 'section-container',\n\n  ITEM_LABEL: 'item-label',\n  LEFT_CONTAINER: 'left-container',\n  BOTTOM_CONTAINER: 'bottom-container',\n  RIGHT_CONTAINER: 'right-container',\n  ITEM_DATE: 'item-date',\n  ITEM_CHEVRON_BACK: 'item-chevron-back',\n\n  ITEM: 'item',\n  COLLAPSED_CONTAINER: 'collapsed-container',\n  ARROW_CONTAINER: 'arrow-container',\n  ITEM_BORDER_BOTTOM: 'item-border-bottom',\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,uBAAuB;AAE7B,MAAM,wBAAwB;AAAA,EACnC,MAAM;AAAA,EAEN,iBAAiB;AAAA,EACjB,sBAAsB;AAAA,EACtB,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,aAAa;AAAA,EACb,kBAAkB;AAAA,EAClB,iBAAiB;AAAA,EACjB,wBAAwB;AAAA,EAExB,aAAa;AAAA,EACb,aAAa;AAAA,EACb,cAAc;AAAA,EACd,kBAAkB;AAAA,EAClB,sBAAsB;AAAA,EAEtB,yBAAyB;AAAA,EAEzB,gBAAgB;AAAA,EAEhB,eAAe;AAAA,EACf,qBAAqB;AAAA,EACrB,oBAAoB;AAAA,EACpB,mBAAmB;AAAA,EAEnB,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,kBAAkB;AAAA,EAClB,iBAAiB;AAAA,EACjB,WAAW;AAAA,EACX,mBAAmB;AAAA,EAEnB,MAAM;AAAA,EACN,qBAAqB;AAAA,EACrB,iBAAiB;AAAA,EACjB,oBAAoB;AACtB;",
+  "names": []
+}

package/dist/esm/constants/index.js

@@ -0,0 +1,3 @@
+import * as React from "react";
+export * from "./constants";
+//# sourceMappingURL=index.js.map

package/dist/esm/constants/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/constants/index.ts"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './constants';\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;",
+  "names": []
+}