@elliemae/ds-left-navigation 3.22.0-next.8 → 3.22.0-rc.1

package/dist/esm/outOfTheBox/ItemWithDate/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/outOfTheBox/ItemWithDate/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport { ItemRenderer } from '../../exported-related/index.js';\nimport type { DSLeftNavigationT } from '../../react-desc-prop-types.js';\nimport { StyledRightContainer, StyledLabel, StyledDate } from '../styled.js';\n\nexport const ItemWithDate = (props: DSLeftNavigationT.ComponentProps): JSX.Element => {\n  const {\n    item,\n    item: {\n      itemOpts: {\n        label,\n        RightComponent,\n        labelRightSection,\n        labelOverflow: itemLabelOverflow,\n        labelBold,\n        labelColor,\n        labelDataTestId,\n      },\n    },\n    ctx,\n    ctx: {\n      leftNavProps: { labelOverflow: leftNavLabelOverflow },\n    },\n  } = props;\n\n  const labelOverflow = itemLabelOverflow || leftNavLabelOverflow;\n  console.log(labelColor, 'labelColor');\n  return (\n    <ItemRenderer\n      item={{\n        ...item,\n        CollapsedComponent: null,\n      }}\n      minHeight=\"32px\"\n      paddingTop=\"8px\"\n    >\n      {/* Empty LeftComponent */} <div />\n      <StyledLabel\n        pl=\"xxs\"\n        pb=\"xxxs\"\n        data-testid={labelDataTestId || 'leftnav-list-item-label'}\n        labelOverflow={labelOverflow}\n        labelBold={labelBold}\n        labelColor={labelColor}\n      >\n        {labelOverflow === 'truncate' ? <SimpleTruncatedTooltipText value={label} placement=\"bottom-start\" /> : label}\n      </StyledLabel>\n      <StyledRightContainer\n        pr=\"xxs2\"\n        cols={['auto', 'auto']}\n        alignItems=\"center\"\n        gutter=\"xxs\"\n        data-testid=\"leftnav-right-component\"\n      >\n        <StyledDate ml=\"xxs\" data-testid=\"leftnav-list-item-date\">\n          {labelRightSection}\n        </StyledDate>\n        {RightComponent && <RightComponent ctx={ctx} item={item} />}\n      </StyledRightContainer>\n    </ItemRenderer>\n  );\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACqCW,cAW5B,YAX4B;AApClC,SAAS,kCAAkC;AAC3C,SAAS,oBAAoB;AAE7B,SAAS,sBAAsB,aAAa,kBAAkB;AAEvD,MAAM,eAAe,CAAC,UAAyD;AACpF,QAAM;AAAA,IACJ;AAAA,IACA,MAAM;AAAA,MACJ,UAAU;AAAA,QACR;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAe;AAAA,QACf;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,IACF;AAAA,IACA;AAAA,IACA,KAAK;AAAA,MACH,cAAc,EAAE,eAAe,qBAAqB;AAAA,IACtD;AAAA,EACF,IAAI;AAEJ,QAAM,gBAAgB,qBAAqB;AAC3C,UAAQ,IAAI,YAAY,YAAY;AACpC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,QACJ,GAAG;AAAA,QACH,oBAAoB;AAAA,MACtB;AAAA,MACA,WAAU;AAAA,MACV,YAAW;AAAA,MAEgB;AAAA;AAAA,QAAC,oBAAC,SAAI;AAAA,QACjC;AAAA,UAAC;AAAA;AAAA,YACC,IAAG;AAAA,YACH,IAAG;AAAA,YACH,eAAa,mBAAmB;AAAA,YAChC;AAAA,YACA;AAAA,YACA;AAAA,YAEC,4BAAkB,aAAa,oBAAC,8BAA2B,OAAO,OAAO,WAAU,gBAAe,IAAK;AAAA;AAAA,QAC1G;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,IAAG;AAAA,YACH,MAAM,CAAC,QAAQ,MAAM;AAAA,YACrB,YAAW;AAAA,YACX,QAAO;AAAA,YACP,eAAY;AAAA,YAEZ;AAAA,kCAAC,cAAW,IAAG,OAAM,eAAY,0BAC9B,6BACH;AAAA,cACC,kBAAkB,oBAAC,kBAAe,KAAU,MAAY;AAAA;AAAA;AAAA,QAC3D;AAAA;AAAA;AAAA,EACF;AAEJ;",
+  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/outOfTheBox/ItemWithDate/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport { ItemRenderer } from '../../exported-related/index.js';\nimport type { DSLeftNavigationT } from '../../react-desc-prop-types.js';\nimport { StyledRightContainer, StyledLabel, StyledDate } from '../styled.js';\n\nexport const ItemWithDate = (props: DSLeftNavigationT.ComponentProps): JSX.Element => {\n  const {\n    item,\n    item: {\n      itemOpts: {\n        label,\n        RightComponent,\n        labelRightSection,\n        labelOverflow: itemLabelOverflow,\n        labelBold,\n        labelColor,\n        labelDataTestId,\n      },\n    },\n    ctx,\n    ctx: {\n      leftNavProps: { labelOverflow: leftNavLabelOverflow },\n    },\n  } = props;\n\n  const labelOverflow = itemLabelOverflow || leftNavLabelOverflow;\n  return (\n    <ItemRenderer\n      item={{\n        ...item,\n        CollapsedComponent: null,\n      }}\n      minHeight=\"32px\"\n      paddingTop=\"8px\"\n    >\n      {/* Empty LeftComponent */} <div />\n      <StyledLabel\n        pl=\"xxs\"\n        pb=\"xxxs\"\n        data-testid={labelDataTestId || 'leftnav-list-item-label'}\n        labelOverflow={labelOverflow}\n        labelBold={labelBold}\n        labelColor={labelColor}\n      >\n        {labelOverflow === 'truncate' && label ? (\n          <SimpleTruncatedTooltipText value={label} placement=\"bottom-start\" />\n        ) : (\n          label\n        )}\n      </StyledLabel>\n      <StyledRightContainer\n        pr=\"xxs2\"\n        cols={['auto', 'auto']}\n        alignItems=\"center\"\n        gutter=\"xxs\"\n        data-testid=\"leftnav-right-component\"\n      >\n        <StyledDate ml=\"xxs\" data-testid=\"leftnav-list-item-date\">\n          {labelRightSection}\n        </StyledDate>\n        {RightComponent && <RightComponent ctx={ctx} item={item} />}\n      </StyledRightContainer>\n    </ItemRenderer>\n  );\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACoCW,cAe5B,YAf4B;AAnClC,SAAS,kCAAkC;AAC3C,SAAS,oBAAoB;AAE7B,SAAS,sBAAsB,aAAa,kBAAkB;AAEvD,MAAM,eAAe,CAAC,UAAyD;AACpF,QAAM;AAAA,IACJ;AAAA,IACA,MAAM;AAAA,MACJ,UAAU;AAAA,QACR;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAe;AAAA,QACf;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,IACF;AAAA,IACA;AAAA,IACA,KAAK;AAAA,MACH,cAAc,EAAE,eAAe,qBAAqB;AAAA,IACtD;AAAA,EACF,IAAI;AAEJ,QAAM,gBAAgB,qBAAqB;AAC3C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,QACJ,GAAG;AAAA,QACH,oBAAoB;AAAA,MACtB;AAAA,MACA,WAAU;AAAA,MACV,YAAW;AAAA,MAEgB;AAAA;AAAA,QAAC,oBAAC,SAAI;AAAA,QACjC;AAAA,UAAC;AAAA;AAAA,YACC,IAAG;AAAA,YACH,IAAG;AAAA,YACH,eAAa,mBAAmB;AAAA,YAChC;AAAA,YACA;AAAA,YACA;AAAA,YAEC,4BAAkB,cAAc,QAC/B,oBAAC,8BAA2B,OAAO,OAAO,WAAU,gBAAe,IAEnE;AAAA;AAAA,QAEJ;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,IAAG;AAAA,YACH,MAAM,CAAC,QAAQ,MAAM;AAAA,YACrB,YAAW;AAAA,YACX,QAAO;AAAA,YACP,eAAY;AAAA,YAEZ;AAAA,kCAAC,cAAW,IAAG,OAAM,eAAY,0BAC9B,6BACH;AAAA,cACC,kBAAkB,oBAAC,kBAAe,KAAU,MAAY;AAAA;AAAA;AAAA,QAC3D;AAAA;AAAA;AAAA,EACF;AAEJ;",
   "names": []
 }

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

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/outOfTheBox/index.tsx"],
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/outOfTheBox/index.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport type { DSLeftNavigationT } from '../react-desc-prop-types.js';\nimport { ITEM_TYPES } from '../exported-related/index.js';\nimport { ItemControlledDrilldown } from './ItemControlledDrilldown/index.js';\nimport { ItemUncontrolledDrilldown } from './ItemUncontrolledDrilldown/index.js';\nimport { ItemHeader } from './ItemHeader/index.js';\nimport { ItemLink } from './ItemLink/index.js';\nimport { ItemSection } from './ItemSection/index.js';\nimport { ItemSeparator } from './ItemSeparator/index.js';\nimport { ItemSubmenu } from './ItemSubmenu/index.js';\nimport { ItemTextLabel } from './ItemTextLabel/index.js';\nimport { ItemWithDate } from './ItemWithDate/index.js';\nimport { ItemSkeleton } from './ItemSkeleton/index.js';\n\nexport * from './ItemControlledDrilldown/index.js';\nexport * from './ItemUncontrolledDrilldown/index.js';\nexport * from './ItemHeader/index.js';\nexport * from './ItemLink/index.js';\nexport * from './ItemSection/index.js';\nexport * from './ItemSeparator/index.js';\nexport * from './ItemSkeleton/index.js';\nexport * from './ItemSubmenu/index.js';\nexport * from './ItemTextLabel/index.js';\nexport * from './ItemWithDate/index.js';\n\nexport const outOfTheBoxTypes = Object.values(ITEM_TYPES);\nconst {\n  LEFT_NAV_ITEM_CONTROLLED_DRILLDOWN,\n  LEFT_NAV_ITEM_UNCONTROLLED_DRILLDOWN,\n  LEFT_NAV_ITEM_HEADER,\n  LEFT_NAV_ITEM_LINK,\n  LEFT_NAV_ITEM_SECTION,\n  LEFT_NAV_ITEM_SEPARATOR,\n  LEFT_NAV_ITEM_SKELETON,\n  LEFT_NAV_ITEM_SUBMENU,\n  LEFT_NAV_ITEM_TEXT_LABEL,\n  LEFT_NAV_ITEM_WITH_DATE,\n} = ITEM_TYPES;\n\nexport const outOfTheBoxComponents: Record<string, React.ComponentType<DSLeftNavigationT.ComponentProps>> = {\n  [LEFT_NAV_ITEM_CONTROLLED_DRILLDOWN]: ItemControlledDrilldown,\n  [LEFT_NAV_ITEM_UNCONTROLLED_DRILLDOWN]: ItemUncontrolledDrilldown,\n  [LEFT_NAV_ITEM_HEADER]: ItemHeader,\n  [LEFT_NAV_ITEM_LINK]: ItemLink,\n  [LEFT_NAV_ITEM_SECTION]: ItemSection,\n  [LEFT_NAV_ITEM_SEPARATOR]: ItemSeparator,\n  [LEFT_NAV_ITEM_SKELETON]: ItemSkeleton,\n  [LEFT_NAV_ITEM_SUBMENU]: ItemSubmenu,\n  [LEFT_NAV_ITEM_TEXT_LABEL]: ItemTextLabel,\n  [LEFT_NAV_ITEM_WITH_DATE]: ItemWithDate,\n};\n"],
   "mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,kBAAkB;AAC3B,SAAS,+BAA+B;AACxC,SAAS,iCAAiC;AAC1C,SAAS,kBAAkB;AAC3B,SAAS,gBAAgB;AACzB,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAC9B,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAC9B,SAAS,oBAAoB;AAC7B,SAAS,oBAAoB;AAE7B,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AAEP,MAAM,mBAAmB,OAAO,OAAO,UAAU;AACxD,MAAM;AAAA,EACJ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,IAAI;AAEG,MAAM,wBAA+F;AAAA,EAC1G,CAAC,kCAAkC,GAAG;AAAA,EACtC,CAAC,oCAAoC,GAAG;AAAA,EACxC,CAAC,oBAAoB,GAAG;AAAA,EACxB,CAAC,kBAAkB,GAAG;AAAA,EACtB,CAAC,qBAAqB,GAAG;AAAA,EACzB,CAAC,uBAAuB,GAAG;AAAA,EAC3B,CAAC,sBAAsB,GAAG;AAAA,EAC1B,CAAC,qBAAqB,GAAG;AAAA,EACzB,CAAC,wBAAwB,GAAG;AAAA,EAC5B,CAAC,uBAAuB,GAAG;AAC7B;",
   "names": []

package/dist/esm/outOfTheBox/styled.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/outOfTheBox/styled.tsx"],
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/outOfTheBox/styled.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled, type Theme } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { DSLeftNavigationName, DSLeftNavigationSlots } from '../constants/index.js';\nimport type { DSLeftNavigationT } from '../react-desc-prop-types.js';\ntype ColorsKey = keyof Theme['colors'];\n\ninterface StyledLabelT {\n  labelBold?: boolean;\n  labelOverflow?: string;\n  labelColor?: [ColorsKey, keyof Theme['colors'][ColorsKey]];\n}\n\nexport const StyledLabel = styled(Grid, {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.ITEM_LABEL,\n})<StyledLabelT>`\n  font-size: 13px;\n  font-weight: ${(props) => (props.labelBold ? props.theme.fontWeights.semibold : props.theme.fontWeights.regular)};\n  color: ${({ labelColor, theme }) =>\n    labelColor ? theme.colors[labelColor[0]][labelColor[1]] : theme.colors.neutral[800]};\n  line-height: 14px;\n  word-break: ${(props) => (props.labelOverflow === 'wrapAll' ? 'break-all' : 'normal')};\n`;\n\nexport const StyledDate = styled(Grid, { name: DSLeftNavigationName, slot: DSLeftNavigationSlots.ITEM_DATE })`\n  font-size: 12px;\n  color: ${(props) => props.theme.colors.neutral[600]};\n  line-height: 14px;\n`;\n\nexport const StyledArrowContainer = styled(Grid, {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.ARROW_CONTAINER,\n})``;\n\nexport const StyledRightContainer = styled(Grid, {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.RIGHT_CONTAINER,\n})``;\n\nexport const StyledSectionLabel = styled('span', {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.SECTION_LABEL,\n})`\n  font-size: 13px;\n  color: ${(props) => props.theme.colors.neutral[700]};\n  margin-left: ${(props) => props.theme.space.xxs};\n  line-height: 13px;\n`;\n\nexport const StyledVerticalSeparator = styled('div', {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.VERTICAL_SEPARATOR,\n})`\n  margin: 0 ${(props) => props.theme.space.xxs};\n  width: 1px;\n  height: 13px;\n  background: ${(props) => props.theme.colors.neutral[600]};\n`;\n\nexport const StyledRightLabel = styled('span', {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.SECTION_RIGHT_LABEL,\n})`\n  font-size: 12px;\n  line-height: 13px;\n`;\n\nexport const StyledSectionContainer = styled(Grid, {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.SECTION_CONTAINER,\n})``;\n\nexport const StyledBottomContainer = styled(Grid, {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.BOTTOM_CONTAINER,\n})`\n  grid-column: span 3;\n`;\n\nexport const StyledLeftContainer = styled(Grid, {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.LEFT_CONTAINER,\n})``;\n\nexport const StyledItemLabel = styled(Grid, { name: DSLeftNavigationName, slot: DSLeftNavigationSlots.ITEM_LABEL })<{\n  labelOverflow?: DSLeftNavigationT.LabelOveflowT;\n}>`\n  font-size: 14px;\n  color: ${(props) => props.theme.colors.neutral[800]};\n  word-break: ${(props) => (props.labelOverflow === 'wrapAll' ? 'break-all' : 'normal')};\n`;\n\nexport const StyledChevronLeft = styled(DSButtonV2, {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.ITEM_CHEVRON_BACK,\n})`\n  padding: 0;\n  :focus {\n    outline: 2px solid ${(props) => props.theme.colors.brand[800]};\n  }\n`;\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAA0B;AACnC,SAAS,YAAY;AACrB,SAAS,kBAAkB;AAC3B,SAAS,sBAAsB,6BAA6B;AAUrD,MAAM,cAAc,OAAO,MAAM;AAAA,EACtC,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA;AAAA,iBAEgB,CAAC,UAAW,MAAM,YAAY,MAAM,MAAM,YAAY,WAAW,MAAM,MAAM,YAAY;AAAA,WAC/F,CAAC,EAAE,YAAY,MAAM,MAC5B,aAAa,MAAM,OAAO,WAAW,CAAC,CAAC,EAAE,WAAW,CAAC,CAAC,IAAI,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA,gBAEtE,CAAC,UAAW,MAAM,kBAAkB,YAAY,cAAc;AAAA;AAGvE,MAAM,aAAa,OAAO,MAAM,EAAE,MAAM,sBAAsB,MAAM,sBAAsB,UAAU,CAAC;AAAA;AAAA,WAEjG,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAI7C,MAAM,uBAAuB,OAAO,MAAM;AAAA,EAC/C,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAEM,MAAM,uBAAuB,OAAO,MAAM;AAAA,EAC/C,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAEM,MAAM,qBAAqB,OAAO,QAAQ;AAAA,EAC/C,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA;AAAA,WAEU,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA,iBACnC,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAAA;AAIvC,MAAM,0BAA0B,OAAO,OAAO;AAAA,EACnD,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA,cACa,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAAA;AAAA,gBAG3B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAGlD,MAAM,mBAAmB,OAAO,QAAQ;AAAA,EAC7C,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA;AAAA;AAAA;AAKM,MAAM,yBAAyB,OAAO,MAAM;AAAA,EACjD,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAEM,MAAM,wBAAwB,OAAO,MAAM;AAAA,EAChD,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA;AAAA;AAIM,MAAM,sBAAsB,OAAO,MAAM;AAAA,EAC9C,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAEM,MAAM,kBAAkB,OAAO,MAAM,EAAE,MAAM,sBAAsB,MAAM,sBAAsB,WAAW,CAAC;AAAA;AAAA,WAIvG,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA,gBACpC,CAAC,UAAW,MAAM,kBAAkB,YAAY,cAAc;AAAA;AAGvE,MAAM,oBAAoB,OAAO,YAAY;AAAA,EAClD,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA;AAAA;AAAA,yBAGwB,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM,GAAG;AAAA;AAAA;",
   "names": []

package/dist/esm/parts/LeftNavContent/index.js

@@ -82,7 +82,15 @@ const LeftNavInnerContent = () => {
 const LeftNavContent = () => {
   const {
     expandedForAnimation,
-    leftNavProps: { expanded, expandedWidth, footerLabel, onFooterExpand, onFooterClose, loading },
+    leftNavProps: {
+      expanded,
+      expandedWidth,
+      FooterLabelComponent,
+      footerLabel,
+      onFooterExpand,
+      onFooterClose,
+      loading
+    },
     leftNavProps
   } = React2.useContext(LeftNavContext);
   const globalProps = useGetGlobalAttributes(leftNavProps);
@@ -105,7 +113,15 @@ const LeftNavContent = () => {
           children: [
             loading && /* @__PURE__ */ jsx(LeftNavLoading, { expanded: expandedForAnimation }),
             !loading && /* @__PURE__ */ jsx(LeftNavInnerContent, {}),
-            /* @__PURE__ */ jsx(LeftNavFooterItem, { footerLabel, onFooterExpand, onFooterClose })
+            /* @__PURE__ */ jsx(
+              LeftNavFooterItem,
+              {
+                footerLabel,
+                FooterLabelComponent,
+                onFooterExpand,
+                onFooterClose
+              }
+            )
           ]
         }
       )

package/dist/esm/parts/LeftNavContent/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/LeftNavContent/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { useGetGlobalAttributes } from '@elliemae/ds-props-helpers';\nimport { LeftNavContext } from '../../LeftNavigationContext.js';\nimport { LeftNavFooterItem } from '../LeftNavFooterItem/index.js';\nimport { OutOfTheBoxMapItem } from '../OutOfTheBoxMapItem.js';\nimport {\n  StyledLeftNavExpandAnimationWrapper,\n  StyledLeftNavAreasContainer,\n  StyledLeftNavHeaderArea,\n  StyledLeftNavBodyAreasContainer,\n  StyledLeftNavBodyHeaderArea,\n  StyledLeftNavBodyItemsArea,\n} from './styled.js';\nimport { ItemSkeleton } from '../../outOfTheBox/ItemSkeleton/index.js';\nimport { LeftNavLoading } from '../LeftNavLoading/index.js';\nconst leftNavScreenReaderInstructions =\n  'Left Navigation. You can navigate through the items using the Up/Down arrows. ' +\n  'To expand or select an item, use the Enter/Return or Space keys. ' +\n  'Expandable items can also be opened/closed with the Right/Left arrows. ' +\n  'The Home and End keys will take you to the first and last item respectively.';\n\nconst LeftNavInnerContent = () => {\n  const {\n    leftNavProps: { HeaderComponent, BodyHeaderComponent, openedItem, items, withoutBodyShadow, isSkeleton },\n    selectedItem,\n  } = React.useContext(LeftNavContext);\n  return (\n    <>\n      <StyledLeftNavHeaderArea\n        data-testid=\"leftnav-header-area\"\n        selected={!!HeaderComponent && [selectedItem, openedItem].includes(HeaderComponent.dsId as string)}\n        role=\"group\"\n      >\n        {isSkeleton ? (\n          <ItemSkeleton item={{ dsId: 'header-skeleton', itemOpts: { skeletonVariant: 'item' } }} hasBorderBottom />\n        ) : (\n          <> {HeaderComponent ? <OutOfTheBoxMapItem item={HeaderComponent} /> : null}</>\n        )}\n      </StyledLeftNavHeaderArea>\n      <StyledLeftNavBodyAreasContainer cols={['1fr']} rows={['auto', '1fr']} role=\"group\">\n        <StyledLeftNavBodyHeaderArea\n          data-testid=\"leftnav-body-header-area\"\n          selected={!!BodyHeaderComponent && [selectedItem, openedItem].includes(BodyHeaderComponent.dsId as string)}\n          role=\"group\"\n          isSkeleton={isSkeleton}\n        >\n          {isSkeleton ? (\n            <ItemSkeleton\n              item={{\n                dsId: 'body-header-skeleton',\n                itemOpts: {\n                  skeletonVariant: 'item',\n                },\n              }}\n            />\n          ) : (\n            <>{BodyHeaderComponent ? <OutOfTheBoxMapItem item={BodyHeaderComponent} /> : null}</>\n          )}\n        </StyledLeftNavBodyHeaderArea>\n        <StyledLeftNavBodyItemsArea\n          selected={!withoutBodyShadow && openedItem !== null}\n          data-testid=\"leftnav-body-items-area\"\n          tabIndex={-1}\n          role=\"group\"\n          isSkeleton={isSkeleton}\n        >\n          {isSkeleton ? (\n            <ItemSkeleton\n              item={{\n                dsId: 'action-items-skeleton',\n                itemOpts: {\n                  skeletonVariant: 'subitem',\n                },\n              }}\n            />\n          ) : (\n            <>\n              {items.map((item) => (\n                <OutOfTheBoxMapItem item={item} key={item.dsId} />\n              ))}\n            </>\n          )}\n        </StyledLeftNavBodyItemsArea>\n      </StyledLeftNavBodyAreasContainer>\n    </>\n  );\n};\n\nconst LeftNavContent: React.ComponentType = () => {\n  const {\n    expandedForAnimation,\n    leftNavProps: { expanded, expandedWidth, footerLabel, onFooterExpand, onFooterClose, loading },\n    leftNavProps,\n  } = React.useContext(LeftNavContext);\n\n  const globalProps = useGetGlobalAttributes(leftNavProps);\n\n  return (\n    <StyledLeftNavExpandAnimationWrapper\n      expandedWidth={expandedWidth}\n      expanded={expanded}\n      data-testid=\"leftnav-component\"\n      aria-label={leftNavScreenReaderInstructions}\n      {...globalProps}\n    >\n      <StyledLeftNavAreasContainer\n        expandedWidth={expandedWidth}\n        expanded={expandedForAnimation}\n        rows={loading ? ['1fr', 'auto'] : ['auto', '1fr', 'auto']}\n        cols={['1fr']}\n        role={'menu'}\n      >\n        {loading && <LeftNavLoading expanded={expandedForAnimation} />}\n        {!loading && <LeftNavInnerContent />}\n        <LeftNavFooterItem footerLabel={footerLabel} onFooterExpand={onFooterExpand} onFooterClose={onFooterClose} />\n      </StyledLeftNavAreasContainer>\n    </StyledLeftNavExpandAnimationWrapper>\n  );\n};\n\nexport default LeftNavContent;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACkCb,SAEA,UAFA,KAEA,YAFA;AAlCV,OAAOA,YAAW;AAClB,SAAS,8BAA8B;AACvC,SAAS,sBAAsB;AAC/B,SAAS,yBAAyB;AAClC,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,oBAAoB;AAC7B,SAAS,sBAAsB;AAC/B,MAAM,kCACJ;AAKF,MAAM,sBAAsB,MAAM;AAChC,QAAM;AAAA,IACJ,cAAc,EAAE,iBAAiB,qBAAqB,YAAY,OAAO,mBAAmB,WAAW;AAAA,IACvG;AAAA,EACF,IAAIA,OAAM,WAAW,cAAc;AACnC,SACE,iCACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,eAAY;AAAA,QACZ,UAAU,CAAC,CAAC,mBAAmB,CAAC,cAAc,UAAU,EAAE,SAAS,gBAAgB,IAAc;AAAA,QACjG,MAAK;AAAA,QAEJ,uBACC,oBAAC,gBAAa,MAAM,EAAE,MAAM,mBAAmB,UAAU,EAAE,iBAAiB,OAAO,EAAE,GAAG,iBAAe,MAAC,IAExG,iCAAE;AAAA;AAAA,UAAE,kBAAkB,oBAAC,sBAAmB,MAAM,iBAAiB,IAAK;AAAA,WAAK;AAAA;AAAA,IAE/E;AAAA,IACA,qBAAC,mCAAgC,MAAM,CAAC,KAAK,GAAG,MAAM,CAAC,QAAQ,KAAK,GAAG,MAAK,SAC1E;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,eAAY;AAAA,UACZ,UAAU,CAAC,CAAC,uBAAuB,CAAC,cAAc,UAAU,EAAE,SAAS,oBAAoB,IAAc;AAAA,UACzG,MAAK;AAAA,UACL;AAAA,UAEC,uBACC;AAAA,YAAC;AAAA;AAAA,cACC,MAAM;AAAA,gBACJ,MAAM;AAAA,gBACN,UAAU;AAAA,kBACR,iBAAiB;AAAA,gBACnB;AAAA,cACF;AAAA;AAAA,UACF,IAEA,gCAAG,gCAAsB,oBAAC,sBAAmB,MAAM,qBAAqB,IAAK,MAAK;AAAA;AAAA,MAEtF;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,UAAU,CAAC,qBAAqB,eAAe;AAAA,UAC/C,eAAY;AAAA,UACZ,UAAU;AAAA,UACV,MAAK;AAAA,UACL;AAAA,UAEC,uBACC;AAAA,YAAC;AAAA;AAAA,cACC,MAAM;AAAA,gBACJ,MAAM;AAAA,gBACN,UAAU;AAAA,kBACR,iBAAiB;AAAA,gBACnB;AAAA,cACF;AAAA;AAAA,UACF,IAEA,gCACG,gBAAM,IAAI,CAAC,SACV,oBAAC,sBAAmB,QAAiB,KAAK,IAAM,CACjD,GACH;AAAA;AAAA,MAEJ;AAAA,OACF;AAAA,KACF;AAEJ;AAEA,MAAM,iBAAsC,MAAM;AAChD,QAAM;AAAA,IACJ;AAAA,IACA,cAAc,EAAE,UAAU,eAAe,aAAa,gBAAgB,eAAe,QAAQ;AAAA,IAC7F;AAAA,EACF,IAAIA,OAAM,WAAW,cAAc;AAEnC,QAAM,cAAc,uBAAuB,YAAY;AAEvD,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,eAAY;AAAA,MACZ,cAAY;AAAA,MACX,GAAG;AAAA,MAEJ;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,UAAU;AAAA,UACV,MAAM,UAAU,CAAC,OAAO,MAAM,IAAI,CAAC,QAAQ,OAAO,MAAM;AAAA,UACxD,MAAM,CAAC,KAAK;AAAA,UACZ,MAAM;AAAA,UAEL;AAAA,uBAAW,oBAAC,kBAAe,UAAU,sBAAsB;AAAA,YAC3D,CAAC,WAAW,oBAAC,uBAAoB;AAAA,YAClC,oBAAC,qBAAkB,aAA0B,gBAAgC,eAA8B;AAAA;AAAA;AAAA,MAC7G;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,yBAAQ;",
+  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/LeftNavContent/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { useGetGlobalAttributes } from '@elliemae/ds-props-helpers';\nimport { LeftNavContext } from '../../LeftNavigationContext.js';\nimport { LeftNavFooterItem } from '../LeftNavFooterItem/index.js';\nimport { OutOfTheBoxMapItem } from '../OutOfTheBoxMapItem.js';\nimport {\n  StyledLeftNavExpandAnimationWrapper,\n  StyledLeftNavAreasContainer,\n  StyledLeftNavHeaderArea,\n  StyledLeftNavBodyAreasContainer,\n  StyledLeftNavBodyHeaderArea,\n  StyledLeftNavBodyItemsArea,\n} from './styled.js';\nimport { ItemSkeleton } from '../../outOfTheBox/ItemSkeleton/index.js';\nimport { LeftNavLoading } from '../LeftNavLoading/index.js';\nconst leftNavScreenReaderInstructions =\n  'Left Navigation. You can navigate through the items using the Up/Down arrows. ' +\n  'To expand or select an item, use the Enter/Return or Space keys. ' +\n  'Expandable items can also be opened/closed with the Right/Left arrows. ' +\n  'The Home and End keys will take you to the first and last item respectively.';\n\nconst LeftNavInnerContent = () => {\n  const {\n    leftNavProps: { HeaderComponent, BodyHeaderComponent, openedItem, items, withoutBodyShadow, isSkeleton },\n    selectedItem,\n  } = React.useContext(LeftNavContext);\n  return (\n    <>\n      <StyledLeftNavHeaderArea\n        data-testid=\"leftnav-header-area\"\n        selected={!!HeaderComponent && [selectedItem, openedItem].includes(HeaderComponent.dsId as string)}\n        role=\"group\"\n      >\n        {isSkeleton ? (\n          <ItemSkeleton item={{ dsId: 'header-skeleton', itemOpts: { skeletonVariant: 'item' } }} hasBorderBottom />\n        ) : (\n          <> {HeaderComponent ? <OutOfTheBoxMapItem item={HeaderComponent} /> : null}</>\n        )}\n      </StyledLeftNavHeaderArea>\n      <StyledLeftNavBodyAreasContainer cols={['1fr']} rows={['auto', '1fr']} role=\"group\">\n        <StyledLeftNavBodyHeaderArea\n          data-testid=\"leftnav-body-header-area\"\n          selected={!!BodyHeaderComponent && [selectedItem, openedItem].includes(BodyHeaderComponent.dsId as string)}\n          role=\"group\"\n          isSkeleton={isSkeleton}\n        >\n          {isSkeleton ? (\n            <ItemSkeleton\n              item={{\n                dsId: 'body-header-skeleton',\n                itemOpts: {\n                  skeletonVariant: 'item',\n                },\n              }}\n            />\n          ) : (\n            <>{BodyHeaderComponent ? <OutOfTheBoxMapItem item={BodyHeaderComponent} /> : null}</>\n          )}\n        </StyledLeftNavBodyHeaderArea>\n        <StyledLeftNavBodyItemsArea\n          selected={!withoutBodyShadow && openedItem !== null}\n          data-testid=\"leftnav-body-items-area\"\n          tabIndex={-1}\n          role=\"group\"\n          isSkeleton={isSkeleton}\n        >\n          {isSkeleton ? (\n            <ItemSkeleton\n              item={{\n                dsId: 'action-items-skeleton',\n                itemOpts: {\n                  skeletonVariant: 'subitem',\n                },\n              }}\n            />\n          ) : (\n            <>\n              {items.map((item) => (\n                <OutOfTheBoxMapItem item={item} key={item.dsId} />\n              ))}\n            </>\n          )}\n        </StyledLeftNavBodyItemsArea>\n      </StyledLeftNavBodyAreasContainer>\n    </>\n  );\n};\n\nconst LeftNavContent: React.ComponentType = () => {\n  const {\n    expandedForAnimation,\n    leftNavProps: {\n      expanded,\n      expandedWidth,\n      FooterLabelComponent,\n      footerLabel,\n      onFooterExpand,\n      onFooterClose,\n      loading,\n    },\n    leftNavProps,\n  } = React.useContext(LeftNavContext);\n\n  const globalProps = useGetGlobalAttributes(leftNavProps);\n\n  return (\n    <StyledLeftNavExpandAnimationWrapper\n      expandedWidth={expandedWidth}\n      expanded={expanded}\n      data-testid=\"leftnav-component\"\n      aria-label={leftNavScreenReaderInstructions}\n      {...globalProps}\n    >\n      <StyledLeftNavAreasContainer\n        expandedWidth={expandedWidth}\n        expanded={expandedForAnimation}\n        rows={loading ? ['1fr', 'auto'] : ['auto', '1fr', 'auto']}\n        cols={['1fr']}\n        role={'menu'}\n      >\n        {loading && <LeftNavLoading expanded={expandedForAnimation} />}\n        {!loading && <LeftNavInnerContent />}\n        <LeftNavFooterItem\n          footerLabel={footerLabel}\n          FooterLabelComponent={FooterLabelComponent}\n          onFooterExpand={onFooterExpand}\n          onFooterClose={onFooterClose}\n        />\n      </StyledLeftNavAreasContainer>\n    </StyledLeftNavExpandAnimationWrapper>\n  );\n};\n\nexport default LeftNavContent;\n"],
+  "mappings": "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",
   "names": ["React"]
 }

package/dist/esm/parts/LeftNavContent/styled.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/LeftNavContent/styled.tsx"],
+  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/LeftNavContent/styled.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { Grid } from '@elliemae/ds-grid';\nimport type { Theme } from '@elliemae/ds-system';\nimport { styled } from '@elliemae/ds-system';\nimport { DSLeftNavigationName, DSLeftNavigationSlots } from '../../constants/index.js';\n\ntype LeftNavProps = {\n  expanded: boolean;\n  expandedWidth: string;\n};\n\nconst getLeftShadowStyles = ({\n  selected,\n  selectedParent,\n  theme,\n}: {\n  selected: boolean;\n  selectedParent?: boolean;\n  theme: Theme;\n}) => {\n  if (!selected && !selectedParent) {\n    return `\n      box-shadow: inset 4px 0 0 0 transparent;\n      :hover {\n        box-shadow: inset 4px 0 0 0 ${theme.colors.brand[300]};\n      }\n      :active {\n        box-shadow: inset 4px 0 0 0 ${theme.colors.brand[400]};\n      }\n    `;\n  }\n  return `box-shadow: inset 4px 0 0 0 ${theme.colors.brand[400]};`;\n};\n\nexport const StyledLeftNavExpandAnimationWrapper = styled('nav', {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.ROOT,\n})<LeftNavProps>`\n  width: ${(props) => (props.expanded ? props.expandedWidth : '48px')};\n  transition: width ${(props) => (props.expanded ? 'ease-out' : 'ease-in')} 350ms;\n  box-shadow: -1px 0 0 0 ${(props) => props.theme.colors.neutral[100]};\n  border: 1px solid ${(props) => props.theme.colors.neutral[100]};\n  overflow: hidden;\n  height: 100%;\n  position: relative;\n`;\n\nexport const StyledLeftNavAreasContainer = styled(Grid, {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.AREAS_CONTAINER,\n})<LeftNavProps>`\n  width: ${(props) => (props.expanded ? `calc(${props.expandedWidth} - 2px)` : '46px')};\n  height: 100%;\n`;\n\nexport const StyledLeftNavHeaderArea = styled('div', {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.HEADER_AREA,\n})<{ selected: boolean; selectedParent?: boolean }>`\n  ${getLeftShadowStyles}\n`;\n\nexport const StyledLeftNavBodyAreasContainer = styled(Grid, {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.BODY_AREAS_CONTAINER,\n})`\n  width: 100%;\n`;\n\nexport const StyledLeftNavBodyHeaderArea = styled('div', {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.BODY_HEADER_AREA,\n})<{ selected: boolean; selectedParent?: boolean; isSkeleton: boolean }>`\n  width: 100%;\n  ${({ isSkeleton }) => (!isSkeleton ? getLeftShadowStyles : '')}\n`;\n\nexport const StyledLeftNavBodyItemsArea = styled('div', {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.BODY_ITEMS_AREA,\n})<{ selected: boolean; isSkeleton: boolean }>`\n  width: 100%;\n  overflow: auto;\n  box-shadow: ${({ isSkeleton, selected, theme }) =>\n    !isSkeleton ? `inset 4px 0 0 0 ${selected ? theme.colors.brand[400] : 'transparent'}` : ''};\n`;\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,YAAY;AAErB,SAAS,cAAc;AACvB,SAAS,sBAAsB,6BAA6B;AAO5D,MAAM,sBAAsB,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AACF,MAIM;AACJ,MAAI,CAAC,YAAY,CAAC,gBAAgB;AAChC,WAAO;AAAA;AAAA;AAAA,sCAG2B,MAAM,OAAO,MAAM,GAAG;AAAA;AAAA;AAAA,sCAGtB,MAAM,OAAO,MAAM,GAAG;AAAA;AAAA;AAAA,EAG1D;AACA,SAAO,+BAA+B,MAAM,OAAO,MAAM,GAAG;AAC9D;AAEO,MAAM,sCAAsC,OAAO,OAAO;AAAA,EAC/D,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA,WACU,CAAC,UAAW,MAAM,WAAW,MAAM,gBAAgB;AAAA,sBACxC,CAAC,UAAW,MAAM,WAAW,aAAa;AAAA,2BACrC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA,sBAC9C,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAAA;AAAA;AAMxD,MAAM,8BAA8B,OAAO,MAAM;AAAA,EACtD,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA,WACU,CAAC,UAAW,MAAM,WAAW,QAAQ,MAAM,yBAAyB;AAAA;AAAA;AAIxE,MAAM,0BAA0B,OAAO,OAAO;AAAA,EACnD,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA,IACG;AAAA;AAGG,MAAM,kCAAkC,OAAO,MAAM;AAAA,EAC1D,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA;AAAA;AAIM,MAAM,8BAA8B,OAAO,OAAO;AAAA,EACvD,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA;AAAA,IAEG,CAAC,EAAE,WAAW,MAAO,CAAC,aAAa,sBAAsB;AAAA;AAGtD,MAAM,6BAA6B,OAAO,OAAO;AAAA,EACtD,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA;AAAA;AAAA,gBAGe,CAAC,EAAE,YAAY,UAAU,MAAM,MAC3C,CAAC,aAAa,mBAAmB,WAAW,MAAM,OAAO,MAAM,GAAG,IAAI,kBAAkB;AAAA;",
   "names": []

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

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { useContext, useCallback } from "react";
+import { useContext, useCallback, useMemo } from "react";
 import { MenuExpand, MenuCollapse } from "@elliemae/ds-icons";
 import { DSSkeleton } from "@elliemae/ds-skeleton";
 import { Grid } from "@elliemae/ds-grid";
@@ -16,7 +16,7 @@ import { useKeyboardNavigation } from "../../hooks/index.js";
 import LeftNavigationContext from "../../LeftNavigationContext.js";
 import { FOOTER_DS_ID, FOOTER_MENU_CLOSE_DS_ID } from "../../exported-related/constants.js";
 const LeftNavFooterItem = (props) => {
-  const { footerLabel, onFooterExpand = () => null, onFooterClose = () => null } = props;
+  const { footerLabel, FooterLabelComponent, onFooterExpand = () => null, onFooterClose = () => null } = props;
   const {
     leftNavProps: { labelOverflow, isSkeleton },
     expandedForAnimation,
@@ -43,6 +43,15 @@ const LeftNavFooterItem = (props) => {
     },
     [handleOnClick]
   );
+  const label = useMemo(() => {
+    if (FooterLabelComponent) {
+      return /* @__PURE__ */ jsx(FooterLabelComponent, {});
+    }
+    if (labelOverflow === "truncate") {
+      return /* @__PURE__ */ jsx(SimpleTruncatedTooltipText, { value: footerLabel, placement: "bottom-start" });
+    }
+    return footerLabel;
+  }, [footerLabel, FooterLabelComponent, labelOverflow]);
   if (isSkeleton) {
     return /* @__PURE__ */ jsx(StyledFooterMenu, { "data-testid": "leftnav-container", children: /* @__PURE__ */ jsx(Grid, { height: "48px", justifyContent: "center", alignItems: "center", cols: ["1fr"], p: "xxs", children: /* @__PURE__ */ jsx(DSSkeleton, { variant: "rectangular", height: "24px" }) }) }, id);
   }
@@ -73,7 +82,7 @@ const LeftNavFooterItem = (props) => {
             "data-testid": "leftnav-itemlabel",
             labelOverflow,
             "aria-live": "polite",
-            children: labelOverflow === "truncate" ? /* @__PURE__ */ jsx(SimpleTruncatedTooltipText, { value: footerLabel, placement: "bottom-start" }) : footerLabel
+            children: label
           }
         ),
         /* @__PURE__ */ jsx(StyledFooterSeparator, { mt: "xxxs" }),

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

@@ -1,7 +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, useCallback } from 'react';\nimport { MenuExpand, MenuCollapse } from '@elliemae/ds-icons';\nimport { DSSkeleton } from '@elliemae/ds-skeleton';\nimport { Grid } from '@elliemae/ds-grid';\n\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport {\n  StyledFooterMenu,\n  StyledFooterItem,\n  StyledFooterLabel,\n  StyledFooterSeparator,\n  StyledMenuCollapse,\n} from './styled.js';\nimport { useKeyboardNavigation } from '../../hooks/index.js';\nimport LeftNavigationContext from '../../LeftNavigationContext.js';\nimport { FOOTER_DS_ID, FOOTER_MENU_CLOSE_DS_ID } from '../../exported-related/constants.js';\n\ntype LeftNavFooterItemProps = {\n  footerLabel: string | JSX.Element;\n  onFooterExpand: React.MouseEventHandler & React.KeyboardEventHandler;\n  onFooterClose: React.MouseEventHandler & React.KeyboardEventHandler;\n};\n\n// eslint-disable-next-line complexity\nexport const LeftNavFooterItem: React.ComponentType<LeftNavFooterItemProps> = (props) => {\n  const { footerLabel, onFooterExpand = () => null, onFooterClose = () => null } = props;\n  const {\n    leftNavProps: { labelOverflow, isSkeleton },\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  const handleMenuCollapseClick = useCallback(\n    (e: React.MouseEvent<HTMLButtonElement, MouseEvent> | React.KeyboardEvent<HTMLButtonElement>) => {\n      e.stopPropagation();\n      handleOnClick(e as React.MouseEvent<HTMLButtonElement, MouseEvent>);\n    },\n    [handleOnClick],\n  );\n\n  if (isSkeleton) {\n    return (\n      <StyledFooterMenu key={id} data-testid=\"leftnav-container\">\n        <Grid height=\"48px\" justifyContent=\"center\" alignItems=\"center\" cols={['1fr']} p=\"xxs\">\n          <DSSkeleton variant=\"rectangular\" height=\"24px\" />\n        </Grid>\n      </StyledFooterMenu>\n    );\n  }\n\n  return (\n    <StyledFooterMenu key={id} data-testid=\"leftnav-container\">\n      <StyledFooterItem\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=\"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              buttonType=\"raw\"\n              onClick={handleMenuCollapseClick}\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              <MenuCollapse size=\"m\" color={['brand-primary', '800']} />\n            </StyledMenuCollapse>\n          </>\n        )}\n      </StyledFooterItem>\n    </StyledFooterMenu>\n  );\n};\n\nexport default LeftNavFooterItem;\n"],
-  "mappings": "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",
+  "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, useCallback, useMemo } from 'react';\nimport { MenuExpand, MenuCollapse } from '@elliemae/ds-icons';\nimport { DSSkeleton } from '@elliemae/ds-skeleton';\nimport { Grid } from '@elliemae/ds-grid';\n\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport {\n  StyledFooterMenu,\n  StyledFooterItem,\n  StyledFooterLabel,\n  StyledFooterSeparator,\n  StyledMenuCollapse,\n} from './styled.js';\nimport { useKeyboardNavigation } from '../../hooks/index.js';\nimport LeftNavigationContext from '../../LeftNavigationContext.js';\nimport { FOOTER_DS_ID, FOOTER_MENU_CLOSE_DS_ID } from '../../exported-related/constants.js';\n\ntype LeftNavFooterItemProps = {\n  footerLabel: string;\n  FooterLabelComponent?: React.ComponentType<unknown>;\n  onFooterExpand: React.MouseEventHandler & React.KeyboardEventHandler;\n  onFooterClose: React.MouseEventHandler & React.KeyboardEventHandler;\n};\n\n// eslint-disable-next-line complexity\nexport const LeftNavFooterItem: React.ComponentType<LeftNavFooterItemProps> = (props) => {\n  const { footerLabel, FooterLabelComponent, onFooterExpand = () => null, onFooterClose = () => null } = props;\n  const {\n    leftNavProps: { labelOverflow, isSkeleton },\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  const handleMenuCollapseClick = useCallback(\n    (e: React.MouseEvent<HTMLButtonElement, MouseEvent> | React.KeyboardEvent<HTMLButtonElement>) => {\n      e.stopPropagation();\n      handleOnClick(e as React.MouseEvent<HTMLButtonElement, MouseEvent>);\n    },\n    [handleOnClick],\n  );\n\n  const label = useMemo(() => {\n    if (FooterLabelComponent) {\n      return <FooterLabelComponent />;\n    }\n    if (labelOverflow === 'truncate') {\n      return <SimpleTruncatedTooltipText value={footerLabel} placement=\"bottom-start\" />;\n    }\n    return footerLabel;\n  }, [footerLabel, FooterLabelComponent, labelOverflow]);\n\n  if (isSkeleton) {\n    return (\n      <StyledFooterMenu key={id} data-testid=\"leftnav-container\">\n        <Grid height=\"48px\" justifyContent=\"center\" alignItems=\"center\" cols={['1fr']} p=\"xxs\">\n          <DSSkeleton variant=\"rectangular\" height=\"24px\" />\n        </Grid>\n      </StyledFooterMenu>\n    );\n  }\n\n  return (\n    <StyledFooterMenu key={id} data-testid=\"leftnav-container\">\n      <StyledFooterItem\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=\"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              {label}\n            </StyledFooterLabel>\n            <StyledFooterSeparator mt=\"xxxs\" />\n            <StyledMenuCollapse\n              buttonType=\"raw\"\n              onClick={handleMenuCollapseClick}\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              <MenuCollapse size=\"m\" color={['brand-primary', '800']} />\n            </StyledMenuCollapse>\n          </>\n        )}\n      </StyledFooterItem>\n    </StyledFooterMenu>\n  );\n};\n\nexport default LeftNavFooterItem;\n"],
+  "mappings": "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",
   "names": []
 }

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

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/LeftNavFooterItem/styled.tsx"],
+  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/LeftNavFooterItem/styled.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { Grid } from '@elliemae/ds-grid';\nimport { getLeftBorderStyle, getItemBackgroundStyle } from '../../common/index.js';\nimport { DSLeftNavigationName, DSLeftNavigationSlots } from '../../constants/index.js';\nimport type { DSLeftNavigationT } from '../../react-desc-prop-types.js';\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  selectedParent?: boolean;\n}>`\n  position: relative;\n  ${(props) => getLeftBorderStyle({ ...props })}\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?: DSLeftNavigationT.LabelOveflowT }>`\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(DSButtonV2, {\n  name: DSLeftNavigationName,\n  slot: DSLeftNavigationSlots.FOOTER_MENU_COLLAPSE,\n})`\n  padding: 0;\n  margin: 0 12px;\n  :focus {\n    outline: 2px solid ${(props) => props.theme.colors.brand[800]};\n  }\n`;\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAAc;AACvB,SAAS,kBAAkB;AAC3B,SAAS,YAAY;AACrB,SAAS,oBAAoB,8BAA8B;AAC3D,SAAS,sBAAsB,6BAA6B;AAGrD,MAAM,mBAAmB,OAAO,MAAM,EAAE,MAAM,sBAAsB,MAAM,sBAAsB,YAAY,CAAC;AAAA;AAAA;AAAA,gBAGpG,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA;AAAA,0BAEjC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAG5D,MAAM,mBAAmB,OAAO,MAAM,EAAE,MAAM,sBAAsB,MAAM,sBAAsB,YAAY,CAAC;AAAA;AAAA,IAOhH,CAAC,UAAU,mBAAmB,EAAE,GAAG,MAAM,CAAC;AAAA;AAAA;AAAA,YAGlC,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,GAAG;AAAA;AAAA;AAAA;AAAA;AAM1D,MAAM,oBAAoB,OAAO,MAAM;AAAA,EAC5C,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA;AAAA,WAEU,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA,gBAEpC,CAAC,UAAW,MAAM,kBAAkB,YAAY,cAAc;AAAA;AAGvE,MAAM,wBAAwB,OAAO,MAAM;AAAA,EAChD,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA;AAAA;AAAA,sBAGqB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAGxD,MAAM,qBAAqB,OAAO,YAAY;AAAA,EACnD,MAAM;AAAA,EACN,MAAM,sBAAsB;AAC9B,CAAC;AAAA;AAAA;AAAA;AAAA,yBAIwB,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM,GAAG;AAAA;AAAA;",
   "names": []

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

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/LeftNavLoading/index.tsx"],
+  "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 { DSCircularIndeterminateIndicator } from '@elliemae/ds-circular-progress-indicator';\nimport Grid from '@elliemae/ds-grid';\nimport { styled } from '@elliemae/ds-system';\nimport { DSLeftNavigationName, DSLeftNavigationSlots } from '../../constants/index.js';\n\nconst StyledLoaderWrapper = styled(Grid, { name: DSLeftNavigationName, slot: DSLeftNavigationSlots.LOADER_WRAPPER })`\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 role=\"menuitem\" aria-label=\"Loading...\">\n    <DSCircularIndeterminateIndicator\n      size={expanded ? 'l' : 's'}\n      text=\"Loading...\"\n      showText={expanded}\n      withTooltip={!expanded}\n    />\n  </StyledLoaderWrapper>\n);\n"],
   "mappings": "AAAA,YAAY,WAAW;ACenB;AAdJ,SAAS,wCAAwC;AACjD,OAAO,UAAU;AACjB,SAAS,cAAc;AACvB,SAAS,sBAAsB,6BAA6B;AAE5D,MAAM,sBAAsB,OAAO,MAAM,EAAE,MAAM,sBAAsB,MAAM,sBAAsB,eAAe,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAO5G,MAAM,iBAA6D,CAAC,EAAE,SAAS,MACpF,oBAAC,uBAAoB,MAAK,YAAW,cAAW,cAC9C;AAAA,EAAC;AAAA;AAAA,IACC,MAAM,WAAW,MAAM;AAAA,IACvB,MAAK;AAAA,IACL,UAAU;AAAA,IACV,aAAa,CAAC;AAAA;AAChB,GACF;",
   "names": []

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

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/OutOfTheBoxMapItem.tsx"],
+  "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/index.js';\nimport type { DSLeftNavigationT } from '../react-desc-prop-types.js';\nimport { LeftNavContext } from '../LeftNavigationContext.js';\n\nexport const OutOfTheBoxMapItem: React.ComponentType<DSLeftNavigationT.OutOfTheBoxMapItemT> = (props) => {\n  const {\n    item,\n    item: { type, Component },\n  } = props;\n  const ctx = React.useContext(LeftNavContext);\n\n  const finalItem = {\n    ...item,\n    itemOpts: {\n      ...item.itemOpts,\n    },\n  };\n  if (typeof type === 'string' && !!outOfTheBoxComponents[type]) {\n    const OutOfTheBoxComponent = outOfTheBoxComponents[type];\n    return <OutOfTheBoxComponent item={finalItem} 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"],
   "mappings": "AAAA,YAAY,WAAW;ACoBZ;AApBX,OAAOA,YAAW;AAClB,SAAS,6BAA6B;AAEtC,SAAS,sBAAsB;AAExB,MAAM,qBAAiF,CAAC,UAAU;AACvG,QAAM;AAAA,IACJ;AAAA,IACA,MAAM,EAAE,MAAM,UAAU;AAAA,EAC1B,IAAI;AACJ,QAAM,MAAMA,OAAM,WAAW,cAAc;AAE3C,QAAM,YAAY;AAAA,IAChB,GAAG;AAAA,IACH,UAAU;AAAA,MACR,GAAG,KAAK;AAAA,IACV;AAAA,EACF;AACA,MAAI,OAAO,SAAS,YAAY,CAAC,CAAC,sBAAsB,IAAI,GAAG;AAC7D,UAAM,uBAAuB,sBAAsB,IAAI;AACvD,WAAO,oBAAC,wBAAqB,MAAM,WAAW,KAAU;AAAA,EAC1D;AACA,MAAI,CAAC;AAAW,WAAO;AAEvB,SAAO,oBAAC,aAAU,MAAY,KAAU;AAC1C;",
   "names": ["React"]

package/dist/esm/react-desc-prop-types.js

@@ -18,6 +18,7 @@ const leftNavigationProps = {
   footerLabel: PropTypes.oneOfType([PropTypes.node, PropTypes.string]).description(
     "The label to show in the footer item"
   ),
+  FooterLabelComponent: PropTypes.func.description("The component 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),

package/dist/esm/react-desc-prop-types.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { WeakValidationMap } from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { type Theme } from '@elliemae/ds-system';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\n\nimport { outOfTheBoxTypes } from './outOfTheBox/index.js';\nimport type { ContextProps } from './LeftNavigationContext.js';\n\ntype ColorsKey = keyof Theme['colors'];\n\nexport declare namespace DSLeftNavigationT {\n  export type LabelOveflowT = 'wrap' | 'wrapAll' | 'truncate';\n\n  export interface DefaultProps {\n    expanded: boolean;\n    expandedWidth: string;\n    openedItem: string | null;\n    items: GenericItemItemProps[];\n    footerLabel: string | JSX.Element;\n    labelOverflow: LabelOveflowT;\n    onSelectedChange: (item: string | null) => void;\n    onFocusChange: (item: string | null) => void;\n    onFooterExpand: () => void;\n    onFooterClose: () => void;\n    onItemClick: (item: GenericItemItemProps, e: React.MouseEvent<HTMLElement>) => void;\n    loading: boolean;\n    isSkeleton: boolean;\n  }\n  export interface OptionalProps {\n    selectedItem?: string | null;\n    selectedParent?: string | null;\n    disableDefaultSelection?: boolean;\n    withoutBodyShadow?: boolean;\n    actionRef?: React.RefObject<{ setFocusedItem: React.Dispatch<React.SetStateAction<string | null>> }>;\n    HeaderComponent?: GenericItemItemProps;\n    BodyHeaderComponent?: GenericItemItemProps;\n  }\n\n  export interface Props\n    extends Partial<DefaultProps>,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps>,\n      XstyledProps {}\n  export interface InternalProps\n    extends DefaultProps,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps>,\n      XstyledProps {}\n\n  export type OutOfTheBoxT =\n    | 'ds-left-nav-item-header'\n    | 'ds-left-nav-item-link'\n    | 'ds-left-nav-item-submenu'\n    | 'ds-left-nav-item-controlled-drilldown'\n    | 'ds-left-nav-item-uncontrolled-drilldown'\n    | 'ds-left-nav-item-section'\n    | 'ds-left-nav-item-separator'\n    | 'ds-left-nav-item-text-label'\n    | 'ds-left-nav-item-with-date';\n\n  export interface ItemOptsT extends Record<string, unknown> {\n    label?: string | JSX.Element;\n    labelBold?: boolean;\n    labelColor?: [ColorsKey, keyof Theme['colors'][ColorsKey]];\n    labelOverflow?: LabelOveflowT;\n    labelRightSection?: string | JSX.Element;\n    selectable?: boolean;\n    focuseable?: boolean;\n    startOpened?: boolean;\n    isOpened?: boolean;\n    openable?: boolean;\n    closable?: boolean;\n    indent?: number;\n    LeftComponent?: React.ComponentType<ComponentProps>;\n    RightComponent?: React.ComponentType<ComponentProps>;\n    BottomComponent?: React.ComponentType<ComponentProps>;\n    ariaLabel?: string;\n    ariaRole?: string;\n    ariaLive?: string;\n    ariaExpanded?: boolean;\n    ariaDescribedBy?: string;\n    items?: GenericItemItemProps[];\n    labelDataTestId?: string;\n    skeletonVariant?: 'item' | 'subitem';\n  }\n\n  export interface ComponentProps {\n    item: GenericItemItemProps;\n    ctx: ContextProps;\n  }\n  export interface GenericItemItemProps {\n    dsId?: string;\n    type?: string;\n    CollapsedComponent?: React.ComponentType<ComponentProps> | null;\n    Component?: React.ComponentType<ComponentProps>;\n    itemOpts: ItemOptsT;\n  }\n  export interface OutOfTheBoxMapItemT {\n    item: GenericItemItemProps;\n  }\n  export interface ItemRendererT {\n    item: GenericItemItemProps;\n    subitems?: JSX.Element[];\n    minHeight?: string;\n    paddingTop?: string;\n    onClick?: () => void;\n    shadowStyle?: (opened: boolean, type?: string) => (theme: Theme) => string;\n    hasBorderBottom?: boolean;\n    borderBottomMr?: string;\n    children: React.ReactNode;\n  }\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.oneOfType([PropTypes.node, PropTypes.string]).description(\n    'The label to show in the footer item',\n  ),\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  isSkeleton: PropTypes.bool.description('Whether the component is in skeleton mode').defaultValue(false),\n} as unknown as WeakValidationMap<DSLeftNavigationT.Props>;\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"],
-  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,WAAW,gBAAgB;AAIpC,SAAS,wBAAwB;AA2G1B,MAAM,mBAAmB;AAAA,EAC9B,MAAM,UAAU,MAAM,gBAAgB,EAAE,YAAY,sBAAsB;AAAA,EAC1E,MAAM,UAAU,OAAO,YAAY,yCAAyC;AAAA,EAC5E,WAAW,UAAU,KAAK;AAAA,IACxB;AAAA,EACF;AAAA,EACA,oBAAoB,UAAU,KAAK,YAAY,8DAA8D;AAAA,EAC7G,UAAU,UAAU,OAAO,YAAY,cAAc;AACvD;AAEO,MAAM,sBAAsB;AAAA,EACjC,gBAAgB,UAAU,MAAM,EAAE,eAAe,UAAU,OAAO,CAAC,EAChE,YAAY,kDAAkD,EAC9D,aAAa,EAAE,eAAe,QAAQ,CAAC;AAAA,EAC1C,UAAU,UAAU,KAAK,YAAY,2DAA2D,EAAE,aAAa,KAAK;AAAA,EACpH,SAAS,UAAU,KAAK,YAAY,iCAAiC,EAAE,aAAa,KAAK;AAAA,EACzF,YAAY,UAAU,OACnB,YAAY,0DAA0D,EACtE,aAAa,IAAI;AAAA,EACpB,aAAa,UAAU,UAAU,CAAC,UAAU,MAAM,UAAU,MAAM,CAAC,EAAE;AAAA,IACnE;AAAA,EACF;AAAA,EACA,gBAAgB,UAAU,KAAK,YAAY,iEAAiE;AAAA,EAC5G,eAAe,UAAU,KAAK,YAAY,iEAAiE;AAAA,EAC3G,kBAAkB,UAAU,KACzB,YAAY,0DAA0D,EACtE,aAAa,MAAM,IAAI;AAAA,EAC1B,eAAe,UAAU,KACtB,YAAY,yDAAyD,EACrE,aAAa,MAAM,IAAI;AAAA,EAC1B,OAAO,UAAU,QAAQ,UAAU,MAAM,EACtC,YAAY,2DAA2D,EACvE,aAAa,CAAC,CAAC;AAAA,EAClB,yBAAyB,UAAU,KAChC,YAAY,qEAAqE,EACjF,aAAa,KAAK;AAAA,EACrB,YAAY,UAAU,KAAK,YAAY,2CAA2C,EAAE,aAAa,KAAK;AACxG;AAEA,MAAM,mBAAmB,MAAM;AAC/B,iBAAiB,cAAc;AACxB,MAAM,yBAAyB,SAAS,gBAAgB;AAC/D,uBAAuB,YAAY;AAEnC,MAAM,qBAAqB,MAAM;AACjC,mBAAmB,cAAc;AAC1B,MAAM,2BAA2B,SAAS,kBAAkB;AACnE,yBAAyB,YAAY;",
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { WeakValidationMap } from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { type Theme } from '@elliemae/ds-system';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\n\nimport { outOfTheBoxTypes } from './outOfTheBox/index.js';\nimport type { ContextProps } from './LeftNavigationContext.js';\n\ntype ColorsKey = keyof Theme['colors'];\n\nexport declare namespace DSLeftNavigationT {\n  export type LabelOveflowT = 'wrap' | 'wrapAll' | 'truncate';\n\n  export interface DefaultProps {\n    expanded: boolean;\n    expandedWidth: string;\n    openedItem: string | null;\n    items: GenericItemItemProps[];\n    footerLabel: string;\n    labelOverflow: LabelOveflowT;\n    onSelectedChange: (item: string | null) => void;\n    onFocusChange: (item: string | null) => void;\n    onFooterExpand: () => void;\n    onFooterClose: () => void;\n    onItemClick: (item: GenericItemItemProps, e: React.MouseEvent<HTMLElement>) => void;\n    loading: boolean;\n    isSkeleton: boolean;\n  }\n  export interface OptionalProps {\n    FooterLabelComponent?: React.ComponentType<unknown>;\n    selectedItem?: string | null;\n    selectedParent?: string | null;\n    disableDefaultSelection?: boolean;\n    withoutBodyShadow?: boolean;\n    actionRef?: React.RefObject<{ setFocusedItem: React.Dispatch<React.SetStateAction<string | null>> }>;\n    HeaderComponent?: GenericItemItemProps;\n    BodyHeaderComponent?: GenericItemItemProps;\n  }\n\n  export interface Props\n    extends Partial<DefaultProps>,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps>,\n      XstyledProps {}\n  export interface InternalProps\n    extends DefaultProps,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps>,\n      XstyledProps {}\n\n  export type OutOfTheBoxT =\n    | 'ds-left-nav-item-header'\n    | 'ds-left-nav-item-link'\n    | 'ds-left-nav-item-submenu'\n    | 'ds-left-nav-item-controlled-drilldown'\n    | 'ds-left-nav-item-uncontrolled-drilldown'\n    | 'ds-left-nav-item-section'\n    | 'ds-left-nav-item-separator'\n    | 'ds-left-nav-item-text-label'\n    | 'ds-left-nav-item-with-date';\n\n  export interface ItemOptsT extends Record<string, unknown> {\n    label?: string | JSX.Element;\n    labelBold?: boolean;\n    labelColor?: [ColorsKey, keyof Theme['colors'][ColorsKey]];\n    labelOverflow?: LabelOveflowT;\n    labelRightSection?: string | JSX.Element;\n    selectable?: boolean;\n    focuseable?: boolean;\n    startOpened?: boolean;\n    isOpened?: boolean;\n    openable?: boolean;\n    closable?: boolean;\n    indent?: number;\n    LeftComponent?: React.ComponentType<ComponentProps>;\n    RightComponent?: React.ComponentType<ComponentProps>;\n    BottomComponent?: React.ComponentType<ComponentProps>;\n    ariaLabel?: string;\n    ariaRole?: string;\n    ariaLive?: string;\n    ariaExpanded?: boolean;\n    ariaDescribedBy?: string;\n    items?: GenericItemItemProps[];\n    labelDataTestId?: string;\n    skeletonVariant?: 'item' | 'subitem';\n  }\n\n  export interface ComponentProps {\n    item: GenericItemItemProps;\n    ctx: ContextProps;\n  }\n  export interface GenericItemItemProps {\n    dsId?: string;\n    type?: string;\n    CollapsedComponent?: React.ComponentType<ComponentProps> | null;\n    Component?: React.ComponentType<ComponentProps>;\n    itemOpts: ItemOptsT;\n  }\n  export interface OutOfTheBoxMapItemT {\n    item: GenericItemItemProps;\n  }\n  export interface ItemRendererT {\n    item: GenericItemItemProps;\n    subitems?: JSX.Element[];\n    minHeight?: string;\n    paddingTop?: string;\n    onClick?: () => void;\n    shadowStyle?: (opened: boolean, type?: string) => (theme: Theme) => string;\n    hasBorderBottom?: boolean;\n    borderBottomMr?: string;\n    children: React.ReactNode;\n  }\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.oneOfType([PropTypes.node, PropTypes.string]).description(\n    'The label to show in the footer item',\n  ),\n  FooterLabelComponent: PropTypes.func.description('The component 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  isSkeleton: PropTypes.bool.description('Whether the component is in skeleton mode').defaultValue(false),\n} as unknown as WeakValidationMap<DSLeftNavigationT.Props>;\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"],
+  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,WAAW,gBAAgB;AAIpC,SAAS,wBAAwB;AA4G1B,MAAM,mBAAmB;AAAA,EAC9B,MAAM,UAAU,MAAM,gBAAgB,EAAE,YAAY,sBAAsB;AAAA,EAC1E,MAAM,UAAU,OAAO,YAAY,yCAAyC;AAAA,EAC5E,WAAW,UAAU,KAAK;AAAA,IACxB;AAAA,EACF;AAAA,EACA,oBAAoB,UAAU,KAAK,YAAY,8DAA8D;AAAA,EAC7G,UAAU,UAAU,OAAO,YAAY,cAAc;AACvD;AAEO,MAAM,sBAAsB;AAAA,EACjC,gBAAgB,UAAU,MAAM,EAAE,eAAe,UAAU,OAAO,CAAC,EAChE,YAAY,kDAAkD,EAC9D,aAAa,EAAE,eAAe,QAAQ,CAAC;AAAA,EAC1C,UAAU,UAAU,KAAK,YAAY,2DAA2D,EAAE,aAAa,KAAK;AAAA,EACpH,SAAS,UAAU,KAAK,YAAY,iCAAiC,EAAE,aAAa,KAAK;AAAA,EACzF,YAAY,UAAU,OACnB,YAAY,0DAA0D,EACtE,aAAa,IAAI;AAAA,EACpB,aAAa,UAAU,UAAU,CAAC,UAAU,MAAM,UAAU,MAAM,CAAC,EAAE;AAAA,IACnE;AAAA,EACF;AAAA,EACA,sBAAsB,UAAU,KAAK,YAAY,0CAA0C;AAAA,EAC3F,gBAAgB,UAAU,KAAK,YAAY,iEAAiE;AAAA,EAC5G,eAAe,UAAU,KAAK,YAAY,iEAAiE;AAAA,EAC3G,kBAAkB,UAAU,KACzB,YAAY,0DAA0D,EACtE,aAAa,MAAM,IAAI;AAAA,EAC1B,eAAe,UAAU,KACtB,YAAY,yDAAyD,EACrE,aAAa,MAAM,IAAI;AAAA,EAC1B,OAAO,UAAU,QAAQ,UAAU,MAAM,EACtC,YAAY,2DAA2D,EACvE,aAAa,CAAC,CAAC;AAAA,EAClB,yBAAyB,UAAU,KAChC,YAAY,qEAAqE,EACjF,aAAa,KAAK;AAAA,EACrB,YAAY,UAAU,KAAK,YAAY,2CAA2C,EAAE,aAAa,KAAK;AACxG;AAEA,MAAM,mBAAmB,MAAM;AAC/B,iBAAiB,cAAc;AACxB,MAAM,yBAAyB,SAAS,gBAAgB;AAC/D,uBAAuB,YAAY;AAEnC,MAAM,qBAAqB,MAAM;AACjC,mBAAmB,cAAc;AAC1B,MAAM,2BAA2B,SAAS,kBAAkB;AACnE,yBAAyB,YAAY;",
   "names": []
 }

package/dist/esm/typescript-testing/typescript-left-navigation-valid.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/typescript-testing/typescript-left-navigation-valid.tsx"],
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/typescript-testing/typescript-left-navigation-valid.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unused-vars, no-unused-vars */\nimport { createRef } from 'react';\nimport { LeftNavigation } from '../index.js';\nimport type { DSLeftNavigationT } from '../index.js';\nimport { ITEM_TYPES } from '../exported-related/constants.js';\n// test we expose the namespace and the namespace follows our deliverable conventions\ntype ComponentPropsForApp = DSLeftNavigationT.Props;\ntype ComponentPropsInternals = DSLeftNavigationT.InternalProps;\ntype ComponentPropsDefaultProps = DSLeftNavigationT.DefaultProps;\ntype ComponentPropsOptionalProps = DSLeftNavigationT.OptionalProps;\n\nconst ref = createRef<{ setFocusedItem: React.Dispatch<React.SetStateAction<string | null>> }>();\n\nconst testOptionalProps: ComponentPropsOptionalProps = {\n  selectedItem: 'selected item',\n  selectedParent: 'parent',\n  disableDefaultSelection: true,\n  withoutBodyShadow: true,\n  actionRef: ref,\n  HeaderComponent: {\n    type: ITEM_TYPES.LEFT_NAV_ITEM_HEADER,\n    dsId: 'application-header-id',\n    CollapsedComponent: () => <div />,\n    itemOpts: {\n      label: 'Notifications',\n    },\n  },\n  BodyHeaderComponent: {\n    type: ITEM_TYPES.LEFT_NAV_ITEM_SUBMENU,\n    dsId: 'application-submenu-forms-id',\n    CollapsedComponent: () => <div />,\n    itemOpts: {\n      label: 'Forms',\n    },\n  },\n};\n\n// difference Props and InternalProps is that InternalProps has all the default props filled in\n//  Props allows for partial defaults\nconst testPartialDefaults: Partial<ComponentPropsDefaultProps> = {};\nconst testProps: ComponentPropsForApp = {\n  ...testOptionalProps,\n  ...testPartialDefaults,\n};\nconst testPropsAsSyntax = {\n  ...testOptionalProps,\n  ...testPartialDefaults,\n} as ComponentPropsForApp;\n// InternalProps requires all defaults to be filled in\nconst testCompleteDefaults: Required<ComponentPropsDefaultProps> = {\n  expanded: true,\n  expandedWidth: '100px',\n  openedItem: 'opened item',\n  items: [\n    {\n      type: ITEM_TYPES.LEFT_NAV_ITEM_HEADER,\n      dsId: 'application-header-id',\n      CollapsedComponent: () => <div />,\n      itemOpts: {\n        label: 'Notifications',\n      },\n    },\n  ],\n  footerLabel: '',\n  onSelectedChange: () => null,\n  onFocusChange: () => null,\n  onFooterExpand: () => null,\n  onFooterClose: () => null,\n  labelOverflow: 'wrap',\n  onItemClick: () => null,\n  isSkeleton: false,\n  loading: false,\n};\nconst testInternalProps: ComponentPropsInternals = {\n  ...testOptionalProps,\n  ...testCompleteDefaults,\n};\nconst testInternalPropsAsSyntax = {\n  ...testOptionalProps,\n  ...testCompleteDefaults,\n} as ComponentPropsInternals;\n\n// using the explicit type definition, if there is an error, it will be marked on the key that is wrong\nconst testExplicitDefinition: ComponentPropsForApp = {\n  expanded: true,\n  expandedWidth: '100px',\n  openedItem: 'opened item',\n  items: [\n    {\n      type: ITEM_TYPES.LEFT_NAV_ITEM_HEADER,\n      dsId: 'application-header-id',\n      CollapsedComponent: () => <div />,\n      itemOpts: {\n        label: 'Notifications',\n      },\n    },\n  ],\n  footerLabel: '',\n  onSelectedChange: () => null,\n  onFocusChange: () => null,\n  onFooterExpand: () => null,\n  onFooterClose: () => null,\n  labelOverflow: 'wrap',\n  onItemClick: () => null,\n  isSkeleton: false,\n  loading: false,\n};\n\n// using the \"as\" syntax, if there is an error, it will be marking the whole object as wrong because it is not compatible with the type\nconst testInferedTypeCompatibility = {\n  expanded: true,\n  expandedWidth: '100px',\n  openedItem: 'opened item',\n  items: [\n    {\n      type: ITEM_TYPES.LEFT_NAV_ITEM_HEADER,\n      dsId: 'application-header-id',\n      CollapsedComponent: () => <div />,\n      itemOpts: {\n        label: 'Notifications',\n      },\n    },\n  ],\n  footerLabel: '',\n  onSelectedChange: () => null,\n  onFocusChange: () => null,\n  onFooterExpand: () => null,\n  onFooterClose: () => null,\n  labelOverflow: 'wrap',\n  onItemClick: () => null,\n  isSkeleton: false,\n  loading: false,\n} as ComponentPropsForApp;\n\nconst testDefinitionAsConst = {\n  expanded: true,\n  expandedWidth: '100px',\n  openedItem: 'opened item',\n  footerLabel: '',\n  onSelectedChange: () => null,\n  onFocusChange: () => null,\n  onFooterExpand: () => null,\n  onFooterClose: () => null,\n  labelOverflow: 'wrap',\n  onItemClick: () => null,\n  isSkeleton: false,\n  loading: false,\n} as const;\n\nconst ExampleUsageComponent = () => (\n  <>\n    {/* works with explicitly casted props, all syntaxes */}\n    <LeftNavigation {...testExplicitDefinition} />\n    <LeftNavigation {...testInferedTypeCompatibility} />\n    <LeftNavigation {...testDefinitionAsConst} />\n    {/* works with inline values */}\n    <LeftNavigation\n      expanded\n      expandedWidth=\"100px\"\n      openedItem=\"opened item\"\n      items={[\n        {\n          type: ITEM_TYPES.LEFT_NAV_ITEM_HEADER,\n          dsId: 'application-header-id',\n          CollapsedComponent: () => <div />,\n          itemOpts: {\n            label: 'Notifications',\n          },\n        },\n      ]}\n      footerLabel=\"\"\n      onSelectedChange={() => null}\n      onFocusChange={() => null}\n      onFooterExpand={() => null}\n      onFooterClose={() => null}\n      labelOverflow=\"wrap\"\n      onItemClick={() => null}\n    />\n  </>\n);\n"],
   "mappings": "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",
   "names": []

package/dist/types/exported-related/ChevronItem/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type SvgIconT } from '@elliemae/ds-icons';
 export declare const ChevronItem: (props?: SvgIconT.Props) => JSX.Element;
 export default ChevronItem;

package/dist/types/exported-related/Notifications/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 type NotificationsProps = {
     exceptions?: boolean;
     alerts?: boolean;

package/dist/types/exported-related/OpenWindowItem/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type SvgIconT } from '@elliemae/ds-icons';
 export declare const OpenWindow: (props: SvgIconT.Props) => JSX.Element;
 export default OpenWindow;

package/dist/types/outOfTheBox/ItemControlledDrilldown/index.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import type { DSLeftNavigationT } from '../../react-desc-prop-types.js';
 export declare const ItemControlledDrilldown: (props: DSLeftNavigationT.ComponentProps) => JSX.Element;

package/dist/types/outOfTheBox/ItemHeader/index.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import type { DSLeftNavigationT } from '../../react-desc-prop-types.js';
 export declare const ItemHeader: (props: DSLeftNavigationT.ComponentProps) => JSX.Element;

package/dist/types/outOfTheBox/ItemLink/index.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import type { DSLeftNavigationT } from '../../react-desc-prop-types.js';
 export declare const ItemLink: (props: DSLeftNavigationT.ComponentProps) => JSX.Element;

package/dist/types/outOfTheBox/ItemSection/index.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import type { DSLeftNavigationT } from '../../react-desc-prop-types.js';
 export declare const ItemSection: (props: DSLeftNavigationT.ComponentProps) => JSX.Element;

package/dist/types/outOfTheBox/ItemSeparator/index.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import type { DSLeftNavigationT } from '../../react-desc-prop-types.js';
 export declare const ItemSeparator: (props: DSLeftNavigationT.ComponentProps) => JSX.Element;

package/dist/types/outOfTheBox/ItemSkeleton/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { DSLeftNavigationT } from '../../react-desc-prop-types.js';
 interface SkeletonPropsT {
     item: DSLeftNavigationT.ComponentProps['item'];

package/dist/types/outOfTheBox/ItemSubmenu/index.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import type { DSLeftNavigationT } from '../../react-desc-prop-types.js';
 export declare const ItemSubmenu: (props: DSLeftNavigationT.ComponentProps) => JSX.Element;

package/dist/types/outOfTheBox/ItemTextLabel/index.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import type { DSLeftNavigationT } from '../../react-desc-prop-types.js';
 export declare const ItemTextLabel: (props: DSLeftNavigationT.ComponentProps) => JSX.Element;

package/dist/types/outOfTheBox/ItemUncontrolledDrilldown/index.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import type { DSLeftNavigationT } from '../../react-desc-prop-types.js';
 export declare const ItemUncontrolledDrilldown: (props: DSLeftNavigationT.ComponentProps) => JSX.Element;

package/dist/types/outOfTheBox/ItemWithDate/index.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import type { DSLeftNavigationT } from '../../react-desc-prop-types.js';
 export declare const ItemWithDate: (props: DSLeftNavigationT.ComponentProps) => JSX.Element;

package/dist/types/parts/LeftNavFooterItem/index.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 type LeftNavFooterItemProps = {
-    footerLabel: string | JSX.Element;
+    footerLabel: string;
+    FooterLabelComponent?: React.ComponentType<unknown>;
     onFooterExpand: React.MouseEventHandler & React.KeyboardEventHandler;
     onFooterClose: React.MouseEventHandler & React.KeyboardEventHandler;
 };

package/dist/types/react-desc-prop-types.d.ts

@@ -10,7 +10,7 @@ export declare namespace DSLeftNavigationT {
         expandedWidth: string;
         openedItem: string | null;
         items: GenericItemItemProps[];
-        footerLabel: string | JSX.Element;
+        footerLabel: string;
         labelOverflow: LabelOveflowT;
         onSelectedChange: (item: string | null) => void;
         onFocusChange: (item: string | null) => void;
@@ -21,6 +21,7 @@ export declare namespace DSLeftNavigationT {
         isSkeleton: boolean;
     }
     interface OptionalProps {
+        FooterLabelComponent?: React.ComponentType<unknown>;
         selectedItem?: string | null;
         selectedParent?: string | null;
         disableDefaultSelection?: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-left-navigation",
-  "version": "3.22.0-next.8",
+  "version": "3.22.0-rc.1",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Left Navigation",
   "files": [
@@ -235,23 +235,23 @@
     "typeSafety": false
   },
   "dependencies": {
-    "@elliemae/ds-button-v2": "3.22.0-next.8",
-    "@elliemae/ds-props-helpers": "3.22.0-next.8",
-    "@elliemae/ds-circular-progress-indicator": "3.22.0-next.8",
-    "@elliemae/ds-system": "3.22.0-next.8",
-    "@elliemae/ds-skeleton": "3.22.0-next.8",
-    "@elliemae/ds-truncated-tooltip-text": "3.22.0-next.8",
-    "@elliemae/ds-grid": "3.22.0-next.8",
-    "@elliemae/ds-icons": "3.22.0-next.8"
+    "@elliemae/ds-grid": "3.22.0-rc.1",
+    "@elliemae/ds-props-helpers": "3.22.0-rc.1",
+    "@elliemae/ds-icons": "3.22.0-rc.1",
+    "@elliemae/ds-system": "3.22.0-rc.1",
+    "@elliemae/ds-truncated-tooltip-text": "3.22.0-rc.1",
+    "@elliemae/ds-button-v2": "3.22.0-rc.1",
+    "@elliemae/ds-circular-progress-indicator": "3.22.0-rc.1",
+    "@elliemae/ds-skeleton": "3.22.0-rc.1"
   },
   "devDependencies": {
-    "@elliemae/pui-cli": "~9.0.0-next.17",
+    "@elliemae/pui-cli": "~9.0.0-next.22",
     "@testing-library/jest-dom": "~5.16.5",
     "@testing-library/react": "~12.1.3",
     "@testing-library/user-event": "~13.5.0",
     "jest-axe": "^7.0.1",
     "styled-components": "~5.3.9",
-    "@elliemae/ds-monorepo-devops": "3.22.0-next.8"
+    "@elliemae/ds-monorepo-devops": "3.22.0-rc.1"
   },
   "peerDependencies": {
     "lodash": "^4.17.21",
@@ -261,13 +261,13 @@
   },
   "scripts": {
     "test": "pui-cli test --passWithNoTests",
-    "lint": "node ../../scripts/lint.mjs",
-    "eslint:fix": "eslint --ext='.js,.jsx,.test.js,.ts,.tsx' --fix --config='../../.eslintrc.js' src/",
-    "dts": "node ../../scripts/dts.mjs",
-    "dev": "cross-env NODE_ENV=development node ../../scripts/build/build.mjs --watch",
-    "build": "cross-env NODE_ENV=production node ../../scripts/build/build.mjs",
+    "lint": "node ../../../scripts/lint.mjs",
+    "eslint:fix": "eslint --ext='.js,.jsx,.test.js,.ts,.tsx' --fix --config='../../../.eslintrc.js' src/",
+    "dts": "node ../../../scripts/dts.mjs",
+    "dev": "cross-env NODE_ENV=development node ../../../scripts/build/build.mjs --watch",
+    "build": "cross-env NODE_ENV=production node ../../../scripts/build/build.mjs",
     "dev:build": "pnpm --filter {.}... build",
     "dev:install": "pnpm --filter {.}... i --no-lockfile && pnpm run dev:build",
-    "checkDeps": "npm exec ../ds-codemods -- check-missing-packages --projectFolderPath=\"./\" --ignorePackagesGlobPattern=\"\" --ignoreFilesGlobPattern=\"**/test-ables/*,**/tests/*\""
+    "checkDeps": "npm exec ../../util/ds-codemods -- check-missing-packages --projectFolderPath=\"./\" --ignorePackagesGlobPattern=\"\" --ignoreFilesGlobPattern=\"**/test-ables/*,**/tests/*\""
   }
 }