@elliemae/ds-left-navigation 2.2.0-next.4 → 2.3.0-alpha.2

package/esm/parts/LeftNavFooterItem/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/LeftNavFooterItem/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useContext } from 'react';\nimport { MenuExpand } from '@elliemae/ds-icons';\nimport { PropTypes } from 'react-desc';\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"],
+  "mappings": "AAAA;ACCA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AACA;AACA;AAQO,MAAM,oBAAiE,CAAC,UAAU;AACvF,QAAM,EAAE,aAAa,iBAAiB,MAAM,MAAM,gBAAgB,MAAM,SAAS;AACjF,QAAM;AAAA,IACJ,cAAc,EAAE,eAAe;AAAA,IAC/B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MACE,WAAW;AAEf,QAAM,KAAK;AAEX,QAAM,gBAAgB,uBAAuB,gBAAgB;AAE7D,QAAM,YAAY,sBAAsB;AAAA,IACtC,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,UAAU;AAAA,QACR,YAAY,CAAC;AAAA,QACb,UAAU;AAAA,QACV,UAAU;AAAA;AAAA;AAAA,IAGd,SAAS;AAAA;AAGX,SACE,qCAAC,kBAAD;AAAA,IAAkB,KAAK;AAAA,IAAI,eAAY;AAAA,KACrC,qCAAC,mBAAD,MACE,qCAAC,YAAD;AAAA,IACE,KAAK,iBAAiB,QAAQ;AAAA,IAC9B,UAAU,uBAAuB,KAAK;AAAA,IACtC,UAAU;AAAA,IACV,IAAG;AAAA,IACH,QAAQ,uBAAuB,SAAS;AAAA,IACxC,YAAW;AAAA,IACX,IAAG;AAAA,IACH,MAAM,uBAAuB,CAAC,QAAQ,OAAO,UAAU,CAAC;AAAA,IACxD,SAAS,uBAAuB,MAAM,OAAO;AAAA,IAC7C;AAAA,IACA,SAAS,MAAM,eAAe;AAAA,IAC9B,eAAY;AAAA,IACZ,MAAK;AAAA,IACL,cAAY,uBAAuB,WAAW,gBAAgB;AAAA,KAE7D,CAAC,uBACA,qCAAC,YAAD;AAAA,IAAY,MAAK;AAAA,IAAI,OAAO,CAAC,iBAAiB;AAAA,IAAM,eAAY;AAAA,OAEhE,4DACE,qCAAC,aAAD;AAAA,IACE,IAAG;AAAA,IACH,IAAG;AAAA,IACH,IAAG;AAAA,IACH,eAAY;AAAA,IACZ;AAAA,IACA,aAAU;AAAA,KAET,kBAAkB,aACjB,qCAAC,4BAAD;AAAA,IAA4B,OAAO;AAAA,IAAa,WAAU;AAAA,OAE1D,cAGJ,qCAAC,iBAAD;AAAA,IAAiB,IAAG;AAAA,MACpB,qCAAC,MAAD;AAAA,IAAM,GAAE;AAAA,KACN,qCAAC,oBAAD;AAAA,IACE,MAAK;AAAA,IACL,OAAO,CAAC,iBAAiB;AAAA,IACzB,SAAS,CAAC,MAAM;AACd,QAAE;AACF,oBAAc;AAAA;AAAA,IAEhB,eAAY;AAAA,IACZ,UAAU;AAAA,IACV,SAAS,CAAC,MAAM;AACd,QAAE;AACF,qBAAe;AAAA;AAAA,IAEjB,MAAK;AAAA,IACL,cAAW;AAAA;AAAA;AAW7B,kBAAkB,YAAY;AAAA,EAC5B,aAAa,UAAU;AAAA,EACvB,gBAAgB,UAAU;AAAA,EAC1B,eAAe,UAAU;AAAA;AAG3B,IAAO,4BAAQ;",
+  "names": []
+}

package/esm/parts/LeftNavFooterItem/styled.js

@@ -1,26 +1,65 @@
-import styled from 'styled-components';
-import { Grid } from '@elliemae/ds-grid';
-import { MenuCollapse } from '@elliemae/ds-icons';
-import { getItemBackgroundStyle } from '../../common/getItemBackgroundStyle.js';
-import { getLeftBorderStyle } from '../../common/getLeftBorderStyle.js';
+import * as React from "react";
+import styled from "styled-components";
+import { Grid } from "@elliemae/ds-grid";
+import { MenuCollapse } from "@elliemae/ds-icons";
+import { getLeftBorderStyle, getItemBackgroundStyle } from "../../common";
+const StyledFooterMenu = styled(Grid)`
+  width: 100%;
+  margin-top: auto;
+  background: ${(props) => props.theme.colors.neutral["000"]};
 
-const StyledFooterMenu = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-1mcbjxr-0"
-})(["width:100%;margin-top:auto;background:", ";", " border-top:1px solid ", ";"], props => props.theme.colors.neutral['000'], getLeftBorderStyle, props => props.theme.colors.neutral[100]);
-const StyledItemWrapper = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-1mcbjxr-1"
-})(["position:relative;padding-left:", ";"], props => props.theme.space.xxxs);
-const StyledItem = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-1mcbjxr-2"
-})(["min-height:48px;cursor:", ";", " outline:none;:focus{&:before{content:'';position:absolute;height:100%;width:100%;top:0;left:0px;border:2px solid ", ";pointer-events:none;}}"], props => props.expanded ? 'auto' : 'pointer', getItemBackgroundStyle, props => props.theme.colors.brand[600]);
-const StyledLabel = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-1mcbjxr-3"
-})(["font-size:11px;color:", ";line-height:14px;word-break:", ";"], props => props.theme.colors.neutral[500], props => props.labelOverflow === 'wrapAll' ? 'break-all' : 'normal');
-const StyledSeparator = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-1mcbjxr-4"
-})(["height:16px;width:1px;background-color:", ";"], props => props.theme.colors.neutral[100]);
-const StyledMenuCollapse = /*#__PURE__*/styled(MenuCollapse).withConfig({
-  componentId: "sc-1mcbjxr-5"
-})(["cursor:pointer;:focus{outline:2px solid ", ";}"], props => props.theme.colors.brand[700]);
+  ${getLeftBorderStyle}
 
-export { StyledFooterMenu, StyledItem, StyledItemWrapper, StyledLabel, StyledMenuCollapse, StyledSeparator };
+  border-top: 1px solid ${(props) => props.theme.colors.neutral[100]};
+`;
+const StyledItemWrapper = styled(Grid)`
+  position: relative;
+  padding-left: ${(props) => props.theme.space.xxxs};
+`;
+const StyledItem = styled(Grid)`
+  min-height: 48px;
+  cursor: ${(props) => props.expanded ? "auto" : "pointer"};
+
+  ${getItemBackgroundStyle}
+
+  outline: none;
+
+  :focus {
+    &:before {
+      content: '';
+      position: absolute;
+      height: 100%;
+      width: 100%;
+      top: 0;
+      left: 0px;
+      border: 2px solid ${(props) => props.theme.colors.brand[600]};
+      pointer-events: none;
+    }
+  }
+`;
+const StyledLabel = styled(Grid)`
+  font-size: 11px;
+  color: ${(props) => props.theme.colors.neutral[500]};
+  line-height: 14px;
+  word-break: ${(props) => props.labelOverflow === "wrapAll" ? "break-all" : "normal"};
+`;
+const StyledSeparator = styled(Grid)`
+  height: 16px;
+  width: 1px;
+  background-color: ${(props) => props.theme.colors.neutral[100]};
+`;
+const StyledMenuCollapse = styled(MenuCollapse)`
+  cursor: pointer;
+  :focus {
+    outline: 2px solid ${(props) => props.theme.colors.brand[700]};
+  }
+`;
+export {
+  StyledFooterMenu,
+  StyledItem,
+  StyledItemWrapper,
+  StyledLabel,
+  StyledMenuCollapse,
+  StyledSeparator
+};
+//# sourceMappingURL=styled.js.map

package/esm/parts/LeftNavFooterItem/styled.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/LeftNavFooterItem/styled.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import styled from 'styled-components';\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"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AAEO,MAAM,mBAAmB,OAAO;AAAA;AAAA;AAAA,gBAGvB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,IAElD;AAAA;AAAA,0BAEsB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGzD,MAAM,oBAAoB,OAAO;AAAA;AAAA,kBAEtB,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAGxC,MAAM,aAAa,OAAO;AAAA;AAAA,YAErB,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,cAAc,OAAO;AAAA;AAAA,WAEvB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,gBAEjC,CAAC,UAAW,MAAM,kBAAkB,YAAY,cAAc;AAAA;AAGvE,MAAM,kBAAkB,OAAO;AAAA;AAAA;AAAA,sBAGhB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGrD,MAAM,qBAAqB,OAAO;AAAA;AAAA;AAAA,yBAGhB,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;",
+  "names": []
+}

package/esm/parts/LeftNavLoading/index.js

@@ -1,23 +1,23 @@
-import _jsx from '@babel/runtime/helpers/esm/jsx';
-import 'react';
-import DSCircularProgressIndicator from '@elliemae/ds-circular-progress-indicator';
-import Grid from '@elliemae/ds-grid';
-import styled from 'styled-components';
-
-const StyledLoaderWrapper = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-mqgtxd-0"
-})(["grid-area:left-nav-body;height:100%;place-items:center;z-index:0;background-color:white;"]);
-const LeftNavLoading = _ref => {
-  let {
-    expanded
-  } = _ref;
-  return /*#__PURE__*/_jsx(StyledLoaderWrapper, {}, void 0, /*#__PURE__*/_jsx(DSCircularProgressIndicator, {
-    size: expanded ? 'xl' : 'm',
-    loading: true,
-    showLabel: expanded,
-    waiting: false,
-    showTooltip: !expanded
-  }));
+import * as React from "react";
+import React2 from "react";
+import DSCircularProgressIndicator from "@elliemae/ds-circular-progress-indicator";
+import Grid from "@elliemae/ds-grid";
+import styled from "styled-components";
+const StyledLoaderWrapper = styled(Grid)`
+  grid-area: left-nav-body;
+  height: 100%;
+  place-items: center;
+  z-index: 0;
+  background-color: white;
+`;
+const LeftNavLoading = ({ expanded }) => /* @__PURE__ */ React2.createElement(StyledLoaderWrapper, null, /* @__PURE__ */ React2.createElement(DSCircularProgressIndicator, {
+  size: expanded ? "xl" : "m",
+  loading: true,
+  showLabel: expanded,
+  waiting: false,
+  showTooltip: !expanded
+}));
+export {
+  LeftNavLoading
 };
-
-export { LeftNavLoading };
+//# sourceMappingURL=index.js.map

package/esm/parts/LeftNavLoading/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/LeftNavLoading/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport DSCircularProgressIndicator from '@elliemae/ds-circular-progress-indicator';\nimport Grid from '@elliemae/ds-grid';\nimport styled from 'styled-components';\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"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AAEA,MAAM,sBAAsB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ5B,MAAM,iBAA6D,CAAC,EAAE,eAC3E,qCAAC,qBAAD,MACE,qCAAC,6BAAD;AAAA,EACE,MAAM,WAAW,OAAO;AAAA,EACxB,SAAO;AAAA,EACP,WAAW;AAAA,EACX,SAAS;AAAA,EACT,aAAa,CAAC;AAAA;",
+  "names": []
+}

package/esm/parts/OutOfTheBoxMapItem.js

@@ -1,42 +1,26 @@
-import 'core-js/modules/esnext.async-iterator.filter.js';
-import 'core-js/modules/esnext.iterator.constructor.js';
-import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/esnext.async-iterator.for-each.js';
-import 'core-js/modules/esnext.iterator.for-each.js';
-import _jsx from '@babel/runtime/helpers/esm/jsx';
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import React from 'react';
-import { outOfTheBoxComponents } from '../outOfTheBox/index.js';
-import { LeftNavContext } from '../LeftNavigationContext.js';
-
-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(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 OutOfTheBoxMapItem = props => {
+import * as React from "react";
+import React2 from "react";
+import { outOfTheBoxComponents } from "../outOfTheBox";
+import { LeftNavContext } from "../LeftNavigationContext";
+const OutOfTheBoxMapItem = (props) => {
   const {
     item,
-    item: {
-      type,
-      Component
-    }
+    item: { type, Component }
   } = props;
-  const ctx = React.useContext(LeftNavContext);
-
-  if (typeof type === 'string' && !!outOfTheBoxComponents[type]) {
+  const ctx = React2.useContext(LeftNavContext);
+  if (typeof type === "string" && !!outOfTheBoxComponents[type]) {
     const OutOfTheBoxComponent = outOfTheBoxComponents[type];
-    return /*#__PURE__*/_jsx(OutOfTheBoxComponent, {
-      item: _objectSpread({
-        itemOpts: {}
-      }, item),
-      ctx: ctx
+    return /* @__PURE__ */ React2.createElement(OutOfTheBoxComponent, {
+      item: { itemOpts: {}, ...item },
+      ctx
     });
-  } // we expect an error to be threw if Component is not defined and type is not a valid out-of-the-box...
-
-
-  return /*#__PURE__*/_jsx(Component, {
-    item: item,
-    ctx: ctx
+  }
+  return /* @__PURE__ */ React2.createElement(Component, {
+    item,
+    ctx
   });
 };
-
-export { OutOfTheBoxMapItem };
+export {
+  OutOfTheBoxMapItem
+};
+//# sourceMappingURL=OutOfTheBoxMapItem.js.map

package/esm/parts/OutOfTheBoxMapItem.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/OutOfTheBoxMapItem.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
+  "mappings": "AAAA;ACAA;AACA;AAEA;AAEO,MAAM,qBAAqB,CAAC,UAA4C;AAC7E,QAAM;AAAA,IACJ;AAAA,IACA,MAAM,EAAE,MAAM;AAAA,MACZ;AACJ,QAAM,MAAM,OAAM,WAAW;AAE7B,MAAI,OAAO,SAAS,YAAY,CAAC,CAAC,sBAAsB,OAAO;AAC7D,UAAM,uBAAuB,sBAAsB;AACnD,WAAO,qCAAC,sBAAD;AAAA,MAAsB,MAAM,EAAE,UAAU,OAAO;AAAA,MAAQ;AAAA;AAAA;AAGhE,SAAO,qCAAC,WAAD;AAAA,IAAW;AAAA,IAAY;AAAA;AAAA;",
+  "names": []
+}

package/esm/prop-types.js

@@ -1,40 +1,37 @@
-import { PropTypes, describe } from 'react-desc';
-import { outOfTheBoxTypes } from './outOfTheBox/index.js';
-
+import * as React from "react";
+import { PropTypes, describe } from "react-desc";
+import { outOfTheBoxTypes } from "./outOfTheBox";
 const leftNavItemProps = {
-  type: PropTypes.oneOf(outOfTheBoxTypes).description('out of the box types'),
-  dsId: PropTypes.string.description('unique identifier for the left nav item'),
+  type: PropTypes.oneOf(outOfTheBoxTypes).description("out of the box types"),
+  dsId: PropTypes.string.description("unique identifier for the left nav item"),
   Component: PropTypes.func.description("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"),
-  CollapsedComponent: PropTypes.func.description('A component which is renderer when the left-nav is collapsed'),
-  itemOpts: PropTypes.object.description('Item options')
+  CollapsedComponent: PropTypes.func.description("A component which is renderer when the left-nav is collapsed"),
+  itemOpts: PropTypes.object.description("Item options")
 };
 const leftNavigationProps = {
-  containerProps: PropTypes.shape({
-    expandedWidth: PropTypes.string
-  }).description('Set of Properties attached to the main container').defaultValue({
-    expandedWidth: '240px'
-  }),
-  expanded: PropTypes.bool.description('Whether to show the left navigation expanded or collapsed').defaultValue(false),
-  loading: PropTypes.bool.description('Whether the left-nav is loading').defaultValue(false),
-  tabIndex: PropTypes.number.description('Tab index').defaultValue(0),
-  openedItem: PropTypes.string.description('The id of the left navigation item you want to be opened').defaultValue(null),
-  footerLabel: PropTypes.string.description('The label to show in the footer item'),
-  onFooterExpand: PropTypes.func.description('The function to call when the left-nav is opened via the footer'),
-  onFooterClose: PropTypes.func.description('The function to call when the left-nav is closed via the footer'),
-  onSelectedChange: PropTypes.func.description('A callback which triggers when the selected item changes').defaultValue(() => null),
-  onFocusChange: PropTypes.func.description('A callback which triggers when the focused item changes').defaultValue(() => null),
-  items: PropTypes.arrayOf(PropTypes.object).description('The array of items you want to render inside the left nav').defaultValue([]),
-  disableDefaultSelection: PropTypes.bool.description('Whether you do not want to automatically select the first body item').defaultValue(false)
+  containerProps: PropTypes.shape({ expandedWidth: PropTypes.string }).description("Set of Properties attached to the main container").defaultValue({ expandedWidth: "240px" }),
+  expanded: PropTypes.bool.description("Whether to show the left navigation expanded or collapsed").defaultValue(false),
+  loading: PropTypes.bool.description("Whether the left-nav is loading").defaultValue(false),
+  tabIndex: PropTypes.number.description("Tab index").defaultValue(0),
+  openedItem: PropTypes.string.description("The id of the left navigation item you want to be opened").defaultValue(null),
+  footerLabel: PropTypes.string.description("The label to show in the footer item"),
+  onFooterExpand: PropTypes.func.description("The function to call when the left-nav is opened via the footer"),
+  onFooterClose: PropTypes.func.description("The function to call when the left-nav is closed via the footer"),
+  onSelectedChange: PropTypes.func.description("A callback which triggers when the selected item changes").defaultValue(() => null),
+  onFocusChange: PropTypes.func.description("A callback which triggers when the focused item changes").defaultValue(() => null),
+  items: PropTypes.arrayOf(PropTypes.object).description("The array of items you want to render inside the left nav").defaultValue([]),
+  disableDefaultSelection: PropTypes.bool.description("Whether you do not want to automatically select the first body item").defaultValue(false)
 };
-
 const LeftNavItemProps = () => null;
-
 const LeftNavItemPropsSchema = describe(LeftNavItemProps);
 LeftNavItemPropsSchema.propTypes = leftNavItemProps;
-
 const LeftNavItemOptions = () => null;
-
 const LeftNavItemOptionsSchema = describe(LeftNavItemOptions);
 LeftNavItemOptionsSchema.propTypes = leftNavItemProps;
-
-export { LeftNavItemOptionsSchema, LeftNavItemPropsSchema, leftNavItemProps, leftNavigationProps };
+export {
+  LeftNavItemOptionsSchema,
+  LeftNavItemPropsSchema,
+  leftNavItemProps,
+  leftNavigationProps
+};
+//# sourceMappingURL=prop-types.js.map

package/esm/prop-types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/prop-types.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes, describe } from 'react-desc';\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;\nexport const LeftNavItemPropsSchema = describe(LeftNavItemProps);\nLeftNavItemPropsSchema.propTypes = leftNavItemProps;\n\nconst LeftNavItemOptions = () => null;\nexport const LeftNavItemOptionsSchema = describe(LeftNavItemOptions);\nLeftNavItemOptionsSchema.propTypes = leftNavItemProps;\n"],
+  "mappings": "AAAA;ACAA;AACA;AAEO,MAAM,mBAAmB;AAAA,EAC9B,MAAM,UAAU,MAAM,kBAAkB,YAAY;AAAA,EACpD,MAAM,UAAU,OAAO,YAAY;AAAA,EACnC,WAAW,UAAU,KAAK,YACxB;AAAA,EAEF,oBAAoB,UAAU,KAAK,YAAY;AAAA,EAC/C,UAAU,UAAU,OAAO,YAAY;AAAA;AAGlC,MAAM,sBAAsB;AAAA,EACjC,gBAAgB,UAAU,MAAM,EAAE,eAAe,UAAU,UACxD,YAAY,oDACZ,aAAa,EAAE,eAAe;AAAA,EACjC,UAAU,UAAU,KAAK,YAAY,6DAA6D,aAAa;AAAA,EAC/G,SAAS,UAAU,KAAK,YAAY,mCAAmC,aAAa;AAAA,EACpF,UAAU,UAAU,OAAO,YAAY,aAAa,aAAa;AAAA,EACjE,YAAY,UAAU,OACnB,YAAY,4DACZ,aAAa;AAAA,EAChB,aAAa,UAAU,OAAO,YAAY;AAAA,EAC1C,gBAAgB,UAAU,KAAK,YAAY;AAAA,EAC3C,eAAe,UAAU,KAAK,YAAY;AAAA,EAC1C,kBAAkB,UAAU,KACzB,YAAY,4DACZ,aAAa,MAAM;AAAA,EACtB,eAAe,UAAU,KACtB,YAAY,2DACZ,aAAa,MAAM;AAAA,EACtB,OAAO,UAAU,QAAQ,UAAU,QAChC,YAAY,6DACZ,aAAa;AAAA,EAChB,yBAAyB,UAAU,KAChC,YAAY,uEACZ,aAAa;AAAA;AAGlB,MAAM,mBAAmB,MAAM;AACxB,MAAM,yBAAyB,SAAS;AAC/C,uBAAuB,YAAY;AAEnC,MAAM,qBAAqB,MAAM;AAC1B,MAAM,2BAA2B,SAAS;AACjD,yBAAyB,YAAY;",
+  "names": []
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-left-navigation",
-  "version": "2.2.0-next.4",
+  "version": "2.3.0-alpha.2",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Left Navigation",
   "module": "./esm/index.js",
@@ -233,11 +233,11 @@
     "generateSubmodules": true
   },
   "dependencies": {
-    "@elliemae/ds-circular-progress-indicator": "2.2.0-next.4",
-    "@elliemae/ds-grid": "2.2.0-next.4",
-    "@elliemae/ds-icons": "2.2.0-next.4",
-    "@elliemae/ds-system": "2.2.0-next.4",
-    "@elliemae/ds-truncated-tooltip-text": "2.2.0-next.4",
+    "@elliemae/ds-circular-progress-indicator": "2.3.0-alpha.2",
+    "@elliemae/ds-grid": "2.3.0-alpha.2",
+    "@elliemae/ds-icons": "2.3.0-alpha.2",
+    "@elliemae/ds-system": "2.3.0-alpha.2",
+    "@elliemae/ds-truncated-tooltip-text": "2.3.0-alpha.2",
     "overlayscrollbars": "1.13.1",
     "prop-types": "~15.7.2",
     "react-desc": "~4.1.3"

package/types/LeftNavigationContext.d.ts

@@ -1,10 +1,10 @@
 import React, { MutableRefObject, RefObject } from 'react';
 import type { LeftNavProps } from './index.d';
 export declare type ContextProps = {
-    selectedItem: string | null;
-    setSelectedItem: React.Dispatch<React.SetStateAction<string | null>>;
-    focusedItem: string | null;
-    setFocusedItem: React.Dispatch<React.SetStateAction<string | null>>;
+    selectedItem: string;
+    setSelectedItem: React.Dispatch<React.SetStateAction<string>>;
+    focusedItem: string;
+    setFocusedItem: React.Dispatch<React.SetStateAction<string>>;
     openedDrilldowns: string[];
     setOpenedDrilldowns: React.Dispatch<React.SetStateAction<string[]>>;
     visibleItems: string[];

package/types/configs/useLeftNavSmoothExpand.d.ts

@@ -1,10 +1,10 @@
 /// <reference types="node" />
 import React from 'react';
 import type { LeftNavProps } from '../index.d';
-interface SmoothExpandOptsT {
+interface smoothExpandOptsT {
     expandedForAnimation: boolean;
-    timeoutRef: React.MutableRefObject<NodeJS.Timeout | null>;
+    timeoutRef: React.MutableRefObject<NodeJS.Timeout>;
     setExpandedForAnimation: React.Dispatch<React.SetStateAction<boolean>>;
 }
-export declare const useLeftNavSmoothExpand: (props: LeftNavProps, smoothExpandOpts: SmoothExpandOptsT) => void;
+export declare const useLeftNavSmoothExpand: (props: LeftNavProps, smoothExpandOpts: smoothExpandOptsT) => void;
 export default useLeftNavSmoothExpand;

package/types/hooks/useSelectFirstBodyItem.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import { GenericItemItemProps } from '../index.d';
-export declare const useSelectFirstBodyItem: (items: GenericItemItemProps[], openedItem: string | null, selectedItem: string | null, setSelectedItem: React.Dispatch<React.SetStateAction<string | null>>, disableDefaultSelection: boolean | undefined) => void;
+export declare const useSelectFirstBodyItem: (items: GenericItemItemProps[], openedItem: string, selectedItem: string, setSelectedItem: React.Dispatch<React.SetStateAction<string>>, disableDefaultSelection: boolean) => void;

package/types/index.d.d.ts

@@ -8,8 +8,8 @@ export interface LeftNavProps {
     items: GenericItemItemProps[];
     footerLabel: string;
     labelOverflow: LabelOveflowT;
-    onSelectedChange: (item: string | null) => void;
-    onFocusChange: (item: string | null) => void;
+    onSelectedChange: (item: string) => void;
+    onFocusChange: (item: string) => void;
     onFooterExpand: () => void;
     onFooterClose: () => void;
     onItemClick: (item: GenericItemItemProps, e: React.MouseEvent<HTMLElement>) => void;
@@ -21,9 +21,6 @@ export interface LeftNavProps {
     selectedParent?: string;
     disableDefaultSelection?: boolean;
     withoutBodyShadow?: boolean;
-    actionRef?: React.RefObject<{
-        setFocusedItem: React.Dispatch<React.SetStateAction<string | null>>;
-    }>;
 }
 export declare type OutOfTheBoxT = 'ds-left-nav-item-header' | 'ds-left-nav-item-link' | 'ds-left-nav-item-submenu' | 'ds-left-nav-item-controlled-drilldown' | 'ds-left-nav-item-uncontrolled-drilldown' | 'ds-left-nav-item-section' | 'ds-left-nav-item-separator' | 'ds-left-nav-item-text-label' | 'ds-left-nav-item-with-date';
 export interface itemOptsT {