@elliemae/ds-left-navigation 3.46.0-rc.8 → 3.46.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -114,7 +114,7 @@ const LeftNavFooterItem = (props) => {
|
|
|
114
114
|
children: label
|
|
115
115
|
}
|
|
116
116
|
),
|
|
117
|
-
!hideFooterPipe ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledFooterSeparator, { mt: "xxxs" }) :
|
|
117
|
+
!hideFooterPipe ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledFooterSeparator, { mt: "xxxs" }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {}),
|
|
118
118
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
119
119
|
import_styled.StyledMenuCollapse,
|
|
120
120
|
{
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/LeftNavFooterItem/index.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* 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, hideFooterPipe },\n expandedForAnimation,\n setFocusedItem,\n visibleItemsRefs,\n } = useContext(LeftNavigationContext);\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 setFocusedItem(id);\n },\n [handleOnClick, id, setFocusedItem],\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 innerRef={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 {!hideFooterPipe ? <StyledFooterSeparator mt=\"xxxs\" /> :
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6DV;AA5Db,mBAAwD;AACxD,sBAAyC;AACzC,yBAA2B;AAC3B,qBAAqB;AAErB,uCAA2C;AAC3C,oBAMO;AACP,mBAAsC;AACtC,mCAAkC;AAClC,uBAAsD;AAU/C,MAAM,oBAAiE,CAAC,UAAU;AACvF,QAAM,EAAE,aAAa,sBAAsB,iBAAiB,MAAM,MAAM,gBAAgB,MAAM,KAAK,IAAI;AACvG,QAAM;AAAA,IACJ,cAAc,EAAE,eAAe,YAAY,eAAe;AAAA,IAC1D;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,6BAAAA,OAAqB;AACpC,QAAM,KAAK;AAEX,QAAM,gBAAgB,uBAAuB,gBAAgB;AAE7D,QAAM,gBAAY,oCAAsB;AAAA,IACtC,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,UAAU;AAAA,QACR,YAAY,CAAC;AAAA,QACb,UAAU;AAAA,QACV,UAAU;AAAA,MACZ;AAAA,IACF;AAAA,IACA,SAAS;AAAA,EACX,CAAC;AAED,QAAM,8BAA0B;AAAA,IAC9B,CAAC,MAAgG;AAC/F,QAAE,gBAAgB;AAClB,oBAAc,CAAoD;AAClE,qBAAe,EAAE;AAAA,IACnB;AAAA,IACA,CAAC,eAAe,IAAI,cAAc;AAAA,EACpC;AAEA,QAAM,YAAQ,sBAAQ,MAAM;AAC1B,QAAI,sBAAsB;AACxB,aAAO,4CAAC,wBAAqB;AAAA,IAC/B;AACA,QAAI,kBAAkB,YAAY;AAChC,aAAO,4CAAC,+DAA2B,OAAO,aAAa,WAAU,gBAAe;AAAA,IAClF;AACA,WAAO;AAAA,EACT,GAAG,CAAC,aAAa,sBAAsB,aAAa,CAAC;AAErD,MAAI,YAAY;AACd,WACE,4CAAC,kCAA0B,eAAY,qBACrC,sDAAC,uBAAK,QAAO,QAAO,gBAAe,UAAS,YAAW,UAAS,MAAM,CAAC,KAAK,GAAG,GAAE,OAC/E,sDAAC,iCAAW,SAAQ,eAAc,QAAO,QAAO,GAClD,KAHqB,EAIvB;AAAA,EAEJ;AAEA,SACE,4CAAC,kCAA0B,eAAY,qBACrC;AAAA,IAAC;AAAA;AAAA,MACC,UAAU,iBAAiB,QAAQ,EAAE;AAAA,MACrC,UAAU,uBAAuB,KAAK;AAAA,MACtC,UAAU;AAAA,MACV,IAAG;AAAA,MACH,QAAQ,uBAAuB,SAAS;AAAA,MACxC,YAAW;AAAA,MACX,IAAG;AAAA,MACH,MAAM,uBAAuB,CAAC,QAAQ,OAAO,MAAM,IAAI,CAAC,MAAM;AAAA,MAC9D,SAAS,uBAAuB,MAAM,OAAO;AAAA,MAC7C;AAAA,MACA,SAAS,MAAM,eAAe,EAAE;AAAA,MAChC,eAAY;AAAA,MACZ,MAAK;AAAA,MACL,cACE,uBACI,WAAW,OAAO,gBAAgB,WAAW,cAAc,EAAE,KAC7D;AAAA,MAGL,WAAC,uBACA,4CAAC,8BAAW,MAAK,KAAI,OAAO,CAAC,iBAAiB,KAAK,GAAG,eAAY,sBAAqB,IAEvF,4EACE;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,IAAG;AAAA,YACH,IAAG;AAAA,YACH,IAAG;AAAA,YACH,eAAY;AAAA,YACZ;AAAA,YACA,aAAU;AAAA,YAET;AAAA;AAAA,QACH;AAAA,QACC,CAAC,iBAAiB,4CAAC,uCAAsB,IAAG,QAAO,IAAK;AAAA,
|
|
4
|
+
"sourcesContent": ["/* 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, hideFooterPipe },\n expandedForAnimation,\n setFocusedItem,\n visibleItemsRefs,\n } = useContext(LeftNavigationContext);\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 setFocusedItem(id);\n },\n [handleOnClick, id, setFocusedItem],\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 innerRef={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 {!hideFooterPipe ? <StyledFooterSeparator mt=\"xxxs\" /> : <div></div>}\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", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6DV;AA5Db,mBAAwD;AACxD,sBAAyC;AACzC,yBAA2B;AAC3B,qBAAqB;AAErB,uCAA2C;AAC3C,oBAMO;AACP,mBAAsC;AACtC,mCAAkC;AAClC,uBAAsD;AAU/C,MAAM,oBAAiE,CAAC,UAAU;AACvF,QAAM,EAAE,aAAa,sBAAsB,iBAAiB,MAAM,MAAM,gBAAgB,MAAM,KAAK,IAAI;AACvG,QAAM;AAAA,IACJ,cAAc,EAAE,eAAe,YAAY,eAAe;AAAA,IAC1D;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,6BAAAA,OAAqB;AACpC,QAAM,KAAK;AAEX,QAAM,gBAAgB,uBAAuB,gBAAgB;AAE7D,QAAM,gBAAY,oCAAsB;AAAA,IACtC,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,UAAU;AAAA,QACR,YAAY,CAAC;AAAA,QACb,UAAU;AAAA,QACV,UAAU;AAAA,MACZ;AAAA,IACF;AAAA,IACA,SAAS;AAAA,EACX,CAAC;AAED,QAAM,8BAA0B;AAAA,IAC9B,CAAC,MAAgG;AAC/F,QAAE,gBAAgB;AAClB,oBAAc,CAAoD;AAClE,qBAAe,EAAE;AAAA,IACnB;AAAA,IACA,CAAC,eAAe,IAAI,cAAc;AAAA,EACpC;AAEA,QAAM,YAAQ,sBAAQ,MAAM;AAC1B,QAAI,sBAAsB;AACxB,aAAO,4CAAC,wBAAqB;AAAA,IAC/B;AACA,QAAI,kBAAkB,YAAY;AAChC,aAAO,4CAAC,+DAA2B,OAAO,aAAa,WAAU,gBAAe;AAAA,IAClF;AACA,WAAO;AAAA,EACT,GAAG,CAAC,aAAa,sBAAsB,aAAa,CAAC;AAErD,MAAI,YAAY;AACd,WACE,4CAAC,kCAA0B,eAAY,qBACrC,sDAAC,uBAAK,QAAO,QAAO,gBAAe,UAAS,YAAW,UAAS,MAAM,CAAC,KAAK,GAAG,GAAE,OAC/E,sDAAC,iCAAW,SAAQ,eAAc,QAAO,QAAO,GAClD,KAHqB,EAIvB;AAAA,EAEJ;AAEA,SACE,4CAAC,kCAA0B,eAAY,qBACrC;AAAA,IAAC;AAAA;AAAA,MACC,UAAU,iBAAiB,QAAQ,EAAE;AAAA,MACrC,UAAU,uBAAuB,KAAK;AAAA,MACtC,UAAU;AAAA,MACV,IAAG;AAAA,MACH,QAAQ,uBAAuB,SAAS;AAAA,MACxC,YAAW;AAAA,MACX,IAAG;AAAA,MACH,MAAM,uBAAuB,CAAC,QAAQ,OAAO,MAAM,IAAI,CAAC,MAAM;AAAA,MAC9D,SAAS,uBAAuB,MAAM,OAAO;AAAA,MAC7C;AAAA,MACA,SAAS,MAAM,eAAe,EAAE;AAAA,MAChC,eAAY;AAAA,MACZ,MAAK;AAAA,MACL,cACE,uBACI,WAAW,OAAO,gBAAgB,WAAW,cAAc,EAAE,KAC7D;AAAA,MAGL,WAAC,uBACA,4CAAC,8BAAW,MAAK,KAAI,OAAO,CAAC,iBAAiB,KAAK,GAAG,eAAY,sBAAqB,IAEvF,4EACE;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,IAAG;AAAA,YACH,IAAG;AAAA,YACH,IAAG;AAAA,YACH,eAAY;AAAA,YACZ;AAAA,YACA,aAAU;AAAA,YAET;AAAA;AAAA,QACH;AAAA,QACC,CAAC,iBAAiB,4CAAC,uCAAsB,IAAG,QAAO,IAAK,4CAAC,SAAI;AAAA,QAC9D;AAAA,UAAC;AAAA;AAAA,YACC,YAAW;AAAA,YACX,SAAS;AAAA,YACT,eAAY;AAAA,YACZ,UAAU;AAAA,YACV,SAAS,CAAC,MAAwB;AAChC,gBAAE,gBAAgB;AAClB,6BAAe,wCAAuB;AAAA,YACxC;AAAA,YACA,MAAK;AAAA,YACL,cAAW;AAAA,YAEX,sDAAC,gCAAa,MAAK,KAAI,OAAO,CAAC,iBAAiB,KAAK,GAAG;AAAA;AAAA,QAC1D;AAAA,SACF;AAAA;AAAA,EAEJ,KApDqB,EAqDvB;AAEJ;AAEA,IAAO,4BAAQ;",
|
|
6
6
|
"names": ["LeftNavigationContext"]
|
|
7
7
|
}
|
|
@@ -86,7 +86,7 @@ const LeftNavFooterItem = (props) => {
|
|
|
86
86
|
children: label
|
|
87
87
|
}
|
|
88
88
|
),
|
|
89
|
-
!hideFooterPipe ? /* @__PURE__ */ jsx(StyledFooterSeparator, { mt: "xxxs" }) :
|
|
89
|
+
!hideFooterPipe ? /* @__PURE__ */ jsx(StyledFooterSeparator, { mt: "xxxs" }) : /* @__PURE__ */ jsx("div", {}),
|
|
90
90
|
/* @__PURE__ */ jsx(
|
|
91
91
|
StyledMenuCollapse,
|
|
92
92
|
{
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/LeftNavFooterItem/index.tsx"],
|
|
4
|
-
"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, hideFooterPipe },\n expandedForAnimation,\n setFocusedItem,\n visibleItemsRefs,\n } = useContext(LeftNavigationContext);\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 setFocusedItem(id);\n },\n [handleOnClick, id, setFocusedItem],\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 innerRef={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 {!hideFooterPipe ? <StyledFooterSeparator mt=\"xxxs\" /> :
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AC6DV,SA2CH,UA3CG,KA2CH,YA3CG;AA5Db,SAAgB,YAAY,aAAa,eAAe;AACxD,SAAS,YAAY,oBAAoB;AACzC,SAAS,kBAAkB;AAC3B,SAAS,YAAY;AAErB,SAAS,kCAAkC;AAC3C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,6BAA6B;AACtC,OAAO,2BAA2B;AAClC,SAAS,cAAc,+BAA+B;AAU/C,MAAM,oBAAiE,CAAC,UAAU;AACvF,QAAM,EAAE,aAAa,sBAAsB,iBAAiB,MAAM,MAAM,gBAAgB,MAAM,KAAK,IAAI;AACvG,QAAM;AAAA,IACJ,cAAc,EAAE,eAAe,YAAY,eAAe;AAAA,IAC1D;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,qBAAqB;AACpC,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,MACZ;AAAA,IACF;AAAA,IACA,SAAS;AAAA,EACX,CAAC;AAED,QAAM,0BAA0B;AAAA,IAC9B,CAAC,MAAgG;AAC/F,QAAE,gBAAgB;AAClB,oBAAc,CAAoD;AAClE,qBAAe,EAAE;AAAA,IACnB;AAAA,IACA,CAAC,eAAe,IAAI,cAAc;AAAA,EACpC;AAEA,QAAM,QAAQ,QAAQ,MAAM;AAC1B,QAAI,sBAAsB;AACxB,aAAO,oBAAC,wBAAqB;AAAA,IAC/B;AACA,QAAI,kBAAkB,YAAY;AAChC,aAAO,oBAAC,8BAA2B,OAAO,aAAa,WAAU,gBAAe;AAAA,IAClF;AACA,WAAO;AAAA,EACT,GAAG,CAAC,aAAa,sBAAsB,aAAa,CAAC;AAErD,MAAI,YAAY;AACd,WACE,oBAAC,oBAA0B,eAAY,qBACrC,8BAAC,QAAK,QAAO,QAAO,gBAAe,UAAS,YAAW,UAAS,MAAM,CAAC,KAAK,GAAG,GAAE,OAC/E,8BAAC,cAAW,SAAQ,eAAc,QAAO,QAAO,GAClD,KAHqB,EAIvB;AAAA,EAEJ;AAEA,SACE,oBAAC,oBAA0B,eAAY,qBACrC;AAAA,IAAC;AAAA;AAAA,MACC,UAAU,iBAAiB,QAAQ,EAAE;AAAA,MACrC,UAAU,uBAAuB,KAAK;AAAA,MACtC,UAAU;AAAA,MACV,IAAG;AAAA,MACH,QAAQ,uBAAuB,SAAS;AAAA,MACxC,YAAW;AAAA,MACX,IAAG;AAAA,MACH,MAAM,uBAAuB,CAAC,QAAQ,OAAO,MAAM,IAAI,CAAC,MAAM;AAAA,MAC9D,SAAS,uBAAuB,MAAM,OAAO;AAAA,MAC7C;AAAA,MACA,SAAS,MAAM,eAAe,EAAE;AAAA,MAChC,eAAY;AAAA,MACZ,MAAK;AAAA,MACL,cACE,uBACI,WAAW,OAAO,gBAAgB,WAAW,cAAc,EAAE,KAC7D;AAAA,MAGL,WAAC,uBACA,oBAAC,cAAW,MAAK,KAAI,OAAO,CAAC,iBAAiB,KAAK,GAAG,eAAY,sBAAqB,IAEvF,iCACE;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,IAAG;AAAA,YACH,IAAG;AAAA,YACH,IAAG;AAAA,YACH,eAAY;AAAA,YACZ;AAAA,YACA,aAAU;AAAA,YAET;AAAA;AAAA,QACH;AAAA,QACC,CAAC,iBAAiB,oBAAC,yBAAsB,IAAG,QAAO,IAAK;AAAA,
|
|
4
|
+
"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, hideFooterPipe },\n expandedForAnimation,\n setFocusedItem,\n visibleItemsRefs,\n } = useContext(LeftNavigationContext);\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 setFocusedItem(id);\n },\n [handleOnClick, id, setFocusedItem],\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 innerRef={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 {!hideFooterPipe ? <StyledFooterSeparator mt=\"xxxs\" /> : <div></div>}\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"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-left-navigation",
|
|
3
|
-
"version": "3.46.0
|
|
3
|
+
"version": "3.46.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Left Navigation",
|
|
6
6
|
"files": [
|
|
@@ -236,19 +236,19 @@
|
|
|
236
236
|
"typeSafety": false
|
|
237
237
|
},
|
|
238
238
|
"dependencies": {
|
|
239
|
-
"@elliemae/ds-button-v2": "3.46.0
|
|
240
|
-
"@elliemae/ds-circular-progress-indicator": "3.46.0
|
|
241
|
-
"@elliemae/ds-grid": "3.46.0
|
|
242
|
-
"@elliemae/ds-icons": "3.46.0
|
|
243
|
-
"@elliemae/ds-props-helpers": "3.46.0
|
|
244
|
-
"@elliemae/ds-
|
|
245
|
-
"@elliemae/ds-
|
|
246
|
-
"@elliemae/ds-truncated-tooltip-text": "3.46.0
|
|
239
|
+
"@elliemae/ds-button-v2": "3.46.0",
|
|
240
|
+
"@elliemae/ds-circular-progress-indicator": "3.46.0",
|
|
241
|
+
"@elliemae/ds-grid": "3.46.0",
|
|
242
|
+
"@elliemae/ds-icons": "3.46.0",
|
|
243
|
+
"@elliemae/ds-props-helpers": "3.46.0",
|
|
244
|
+
"@elliemae/ds-system": "3.46.0",
|
|
245
|
+
"@elliemae/ds-skeleton": "3.46.0",
|
|
246
|
+
"@elliemae/ds-truncated-tooltip-text": "3.46.0"
|
|
247
247
|
},
|
|
248
248
|
"devDependencies": {
|
|
249
249
|
"@elliemae/pui-cli": "9.0.0-next.50",
|
|
250
250
|
"styled-components": "~5.3.9",
|
|
251
|
-
"@elliemae/ds-monorepo-devops": "3.46.0
|
|
251
|
+
"@elliemae/ds-monorepo-devops": "3.46.0"
|
|
252
252
|
},
|
|
253
253
|
"peerDependencies": {
|
|
254
254
|
"lodash": "^4.17.21",
|