npm - @servicetitan/navigation - Versions diffs - 14.0.0 → 14.2.0 - Mend

@servicetitan/navigation 14.0.0 → 14.2.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.

Files changed (12) hide show

package/dist/components/profile-dropdown/interface.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"interface.d.ts","sourceRoot":"","sources":["../../../src/components/profile-dropdown/interface.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAE1E,MAAM,MAAM,2BAA2B,GAAG;IACtC,IAAI,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;IACvC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC/B,KAAK,CAAC,EAAE;QAAE,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;CACxD,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC;AAErD,MAAM,MAAM,oBAAoB,GAAG;IAC/B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,IAAI,CAAC,2BAA2B,EAAE,SAAS,GAAG,MAAM,GAAG,WAAW,CAAC,CAAC;IAC9E,SAAS,CAAC,EAAE;QACR,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,OAAO,EAAE,EAAE,CAAC;YAAE,WAAW,IAAI,IAAI,CAAA;SAAE,CAAC,CAAC;QACrC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;KACxB,CAAC;IACF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,IAAI,IAAI,CAAC;IACjB,MAAM,CAAC,IAAI,IAAI,CAAC;CACnB,GAAG,wBAAwB,CAAC,KAAK,CAAC,CAAC;AAEpC,MAAM,MAAM,kBAAkB,~~GACxB~~;IAAE,QAAQ,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,~~GACnC~~;IAAE,QAAQ,EAAE,SAAS,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;~~AAE5C~~,MAAM,MAAM,2BAA2B,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IAC1F,QAAQ,EAAE,SAAS,CAAC;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,GAAG,CAAC,EAAE,cAAc,CAAC;IACrB,OAAO,CAAC,EAAE,eAAe,CAAC;CAC7B,GAAG,kBAAkB,CAAC;AAEvB,MAAM,MAAM,wBAAwB,GAAG,IAAI,CAAC,wBAAwB,CAAC,GAAG,CAAC,EAAE,UAAU,CAAC,GAAG;IACrF,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,CAAC,EAAE,cAAc,CAAC;IACrB,OAAO,CAAC,EAAE,eAAe,CAAC;CAC7B,GAAG,kBAAkB,CAAC"}
1	+ {"version":3,"file":"interface.d.ts","sourceRoot":"","sources":["../../../src/components/profile-dropdown/interface.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAE1E,MAAM,MAAM,2BAA2B,GAAG;IACtC,IAAI,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;IACvC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC/B,KAAK,CAAC,EAAE;QAAE,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;CACxD,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC;AAErD,MAAM,MAAM,oBAAoB,GAAG;IAC/B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,IAAI,CAAC,2BAA2B,EAAE,SAAS,GAAG,MAAM,GAAG,WAAW,CAAC,CAAC;IAC9E,SAAS,CAAC,EAAE;QACR,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,OAAO,EAAE,EAAE,CAAC;YAAE,WAAW,IAAI,IAAI,CAAA;SAAE,CAAC,CAAC;QACrC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;KACxB,CAAC;IACF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,IAAI,IAAI,CAAC;IACjB,MAAM,CAAC,IAAI,IAAI,CAAC;CACnB,GAAG,wBAAwB,CAAC,KAAK,CAAC,CAAC;AAEpC,MAAM,MAAM,kBAAkB,GAC1B;IAAE,QAAQ,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,QAAQ,EAAE,SAAS,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;AAEhF,MAAM,MAAM,2BAA2B,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IAC1F,QAAQ,EAAE,SAAS,CAAC;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,GAAG,CAAC,EAAE,cAAc,CAAC;IACrB,OAAO,CAAC,EAAE,eAAe,CAAC;CAC7B,GAAG,kBAAkB,CAAC;AAEvB,MAAM,MAAM,wBAAwB,GAAG,IAAI,CAAC,wBAAwB,CAAC,GAAG,CAAC,EAAE,UAAU,CAAC,GAAG;IACrF,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,CAAC,EAAE,cAAc,CAAC;IACrB,OAAO,CAAC,EAAE,eAAe,CAAC;CAC7B,GAAG,kBAAkB,CAAC"}

package/dist/components/profile-dropdown/interface.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/profile-dropdown/interface.ts"],"sourcesContent":["import { ComponentPropsWithoutRef, FC, ReactNode } from 'react';\nimport { CounterTagData, CounterTagValue } from '../../utils/counter-tag';\n\nexport type ProfileDropdownTriggerProps = {\n info?: { title: string; text: string };\n imageSrc?: string \| null;\n avatarBadge?: boolean \| string;\n badge?: { content?: number \| string; color: string };\n} & Omit<ComponentPropsWithoutRef<'div'>, 'onClick'>;\n\nexport type ProfileDropdownProps = {\n anvil1?: boolean;\n trigger?: Omit<ProfileDropdownTriggerProps, 'onClick' \| 'open' \| 'hintArrow'>;\n hintPopup?: {\n bgColor?: string;\n content: FC<{ openProfile(): void }>;\n onClose?: () => void;\n };\n portal?: boolean;\n onClose?(): void;\n onOpen?(): void;\n} & ComponentPropsWithoutRef<'div'>;\n\nexport type ProfileItemContent =\n \| { children: string; text?: string }\n \| { children: ReactNode; text: string };\n\nexport type ProfileDropdownSectionProps = Omit<ComponentPropsWithoutRef<'div'>, 'children'> & {\n children: ReactNode;\n id: string;\n tooltip?: string;\n tag?: CounterTagData;\n counter?: CounterTagValue;\n} & ProfileItemContent;\n\nexport type ProfileDropdownLinkProps = Omit<ComponentPropsWithoutRef<'a'>, 'children'> & {\n id: string;\n children: ReactNode;\n external?: boolean;\n tooltip?: string;\n to: string;\n tag?: CounterTagData;\n counter?: CounterTagValue;\n} & ProfileItemContent;\n"],"names":[],"mappings":"~~AAmCA~~,WAQuB"}
1	+ {"version":3,"sources":["../../../src/components/profile-dropdown/interface.ts"],"sourcesContent":["import { ComponentPropsWithoutRef, FC, ReactNode } from 'react';\nimport { CounterTagData, CounterTagValue } from '../../utils/counter-tag';\n\nexport type ProfileDropdownTriggerProps = {\n info?: { title: string; text: string };\n imageSrc?: string \| null;\n avatarBadge?: boolean \| string;\n badge?: { content?: number \| string; color: string };\n} & Omit<ComponentPropsWithoutRef<'div'>, 'onClick'>;\n\nexport type ProfileDropdownProps = {\n anvil1?: boolean;\n trigger?: Omit<ProfileDropdownTriggerProps, 'onClick' \| 'open' \| 'hintArrow'>;\n hintPopup?: {\n bgColor?: string;\n content: FC<{ openProfile(): void }>;\n onClose?: () => void;\n };\n portal?: boolean;\n onClose?(): void;\n onOpen?(): void;\n} & ComponentPropsWithoutRef<'div'>;\n\nexport type ProfileItemContent =\n { children: string; text?: string } \| { children: ReactNode; text: string };\n\nexport type ProfileDropdownSectionProps = Omit<ComponentPropsWithoutRef<'div'>, 'children'> & {\n children: ReactNode;\n id: string;\n tooltip?: string;\n tag?: CounterTagData;\n counter?: CounterTagValue;\n} & ProfileItemContent;\n\nexport type ProfileDropdownLinkProps = Omit<ComponentPropsWithoutRef<'a'>, 'children'> & {\n id: string;\n children: ReactNode;\n external?: boolean;\n tooltip?: string;\n to: string;\n tag?: CounterTagData;\n counter?: CounterTagValue;\n} & ProfileItemContent;\n"],"names":[],"mappings":"AAkCA,WAQuB"}

package/dist/components/titan-layout/layout-sidebar.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"layout-sidebar.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-sidebar.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAY,EAAE,EAAY,YAAY,EAAkB,MAAM,OAAO,CAAC;AAC7E,OAAO,EAAE,kBAAkB,EAAyB,MAAM,wBAAwB,CAAC;AACnF,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAYvE,MAAM,WAAW,kBAAkB;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,YAAY,EAAE,CAAC;IACrB,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,SAAS,CAAC,EAAE,kBAAkB,EAAE,CAAC;IACjC,WAAW,EAAE,OAAO,CAAC;IACrB,cAAc,EAAE,MAAM,EAAE,GAAG,SAAS,CAAC;IACrC,YAAY,EAAE,OAAO,CAAC;IACtB,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,OAAO,CAAC;IACrB,mBAAmB,EAAE,EAAE,CAAC,qBAAqB,CAAC,CAAC;IAC/C,iBAAiB,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI,CAAC;IAC3C,kBAAkB,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI,CAAC;IAC5C,mBAAmB,CAAC,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,GAAG,IAAI,CAAC;IACvD,qBAAqB,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACxE;AAED,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,~~CAqGhD~~,CAAC"}
1	+ {"version":3,"file":"layout-sidebar.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-sidebar.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAY,EAAE,EAAY,YAAY,EAAkB,MAAM,OAAO,CAAC;AAC7E,OAAO,EAAE,kBAAkB,EAAyB,MAAM,wBAAwB,CAAC;AACnF,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAYvE,MAAM,WAAW,kBAAkB;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,YAAY,EAAE,CAAC;IACrB,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,SAAS,CAAC,EAAE,kBAAkB,EAAE,CAAC;IACjC,WAAW,EAAE,OAAO,CAAC;IACrB,cAAc,EAAE,MAAM,EAAE,GAAG,SAAS,CAAC;IACrC,YAAY,EAAE,OAAO,CAAC;IACtB,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,OAAO,CAAC;IACrB,mBAAmB,EAAE,EAAE,CAAC,qBAAqB,CAAC,CAAC;IAC/C,iBAAiB,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI,CAAC;IAC3C,kBAAkB,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI,CAAC;IAC5C,mBAAmB,CAAC,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,GAAG,IAAI,CAAC;IACvD,qBAAqB,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACxE;AAED,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CA2GhD,CAAC"}

package/dist/components/titan-layout/layout-sidebar.js CHANGED Viewed

@@ -16,6 +16,7 @@ export const LayoutSidebar = ({ className, mobile, touchDevice, barExpanded, sub
             onDrawerOpenChange === null || onDrawerOpenChange === void 0 ? void 0 : onDrawerOpenChange(false);
         }
     };
+    const effectiveExpanded = mobile ? drawerOpened : barExpanded;
     return /*#__PURE__*/ _jsxs(LayoutPlacementContext.Provider, {
         value: "side",
         children: [
@@ -48,9 +49,11 @@ export const LayoutSidebar = ({ className, mobile, touchDevice, barExpanded, sub
                             }),
                             /*#__PURE__*/ _jsx("div", {
                                 "data-cy": "navigation-items",
-                                children: mainItems === null || mainItems === void 0 ? void 0 : mainItems.map((item)=>item.submenu ? /*#__PURE__*/ _jsx(SideNavigationGroupItem, {
+                                children: mainItems === null || mainItems === void 0 ? void 0 : mainItems.map((item)=>{
+                                    var _item_collapsedTitle;
+                                    return item.submenu ? /*#__PURE__*/ _jsx(SideNavigationGroupItem, {
                                         item: item,
-                                        barExpanded: mobile ? drawerOpened : barExpanded,
+                                        barExpanded: effectiveExpanded,
                                         submenuOpened: !!item.id && !!(submenusOpened === null || submenusOpened === void 0 ? void 0 : submenusOpened.includes(item.id)),
                                         onSubmenuOpen: onSubmenuOpenChange,
                                         navigationComponent: navigationComponent,
@@ -59,14 +62,15 @@ export const LayoutSidebar = ({ className, mobile, touchDevice, barExpanded, sub
                                     }, item.id) : /*#__PURE__*/ _jsx(InternalSideNavigationLink, {
                                         id: item.id,
                                         to: item.to,
-                                        title: item.title,
+                                        title: effectiveExpanded ? item.title : (_item_collapsedTitle = item.collapsedTitle) !== null && _item_collapsedTitle !== void 0 ? _item_collapsedTitle : item.title,
                                         isActive: item.isActive,
                                         icon: item.icon,
                                         iconActive: item.iconActive,
                                         className: item.className,
                                         tag: getSubmenuGroupTag(item.submenu, getCounterTag(item.counter, item.tag)),
                                         navigationComponent: navigationComponent
-                                    }, item.id))
+                                    }, item.id);
+                                })
                             }),
                             !!bottom && /*#__PURE__*/ _jsx(SidebarBottom, {
                                 children: bottom
@@ -157,12 +161,14 @@ LayoutSidebar.displayName = 'LayoutSidebar';
         noPadding: true,
         children: [
             /*#__PURE__*/ _jsx(Popover.Trigger, {
-                children: (triggerProps)=>/*#__PURE__*/ _jsx("div", {
+                children: (triggerProps)=>{
+                    var _item_collapsedTitle;
+                    return /*#__PURE__*/ _jsx("div", {
                         ...triggerProps,
                         children: /*#__PURE__*/ _jsx(InternalSideNavigationLink, {
                             id: item.id,
                             to: item.to,
-                            title: item.title,
+                            title: (_item_collapsedTitle = item.collapsedTitle) !== null && _item_collapsedTitle !== void 0 ? _item_collapsedTitle : item.title,
                             isActive: item.isActive,
                             icon: item.icon,
                             iconActive: item.iconActive,
@@ -170,7 +176,8 @@ LayoutSidebar.displayName = 'LayoutSidebar';
                             tag: tag,
                             navigationComponent: navigationComponent
                         })
-                    })
+                    });
+                }
             }),
             /*#__PURE__*/ _jsx(Popover.Content, {
                 style: popoverContent,

package/dist/components/titan-layout/layout-sidebar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/titan-layout/layout-sidebar.tsx"],"sourcesContent":["import { Divider, Icon, Popover, Text, ThemeProvider } from '@servicetitan/anvil2';\nimport SvgClose from '@servicetitan/anvil2/assets/icons/material/round/close.svg';\nimport SvgCollapse from '@servicetitan/anvil2/assets/icons/st/gnav_menu_collapse.svg';\nimport SvgExpand from '@servicetitan/anvil2/assets/icons/st/gnav_menu_expand.svg';\nimport classNames from 'classnames';\nimport { Children, FC, Fragment, ReactElement, isValidElement } from 'react';\nimport { NavigationItemData, NavigationSubmenuData } from '../../utils/navigation';\nimport { NavLinkComponentProps } from '../../utils/navigation-context';\nimport { getCounterTag, getSubmenuGroupTag } from '../../utils/side-nav';\nimport { NavigationComponentProps } from './interface-internal';\nimport { LayoutPlacementContext, useTitanLayoutContext } from './layout-context';\nimport {\n InternalSideNavigationGroup,\n InternalSideNavigationGroupLink,\n InternalSideNavigationLink,\n} from './layout-sidebar-links-internal';\nimport * as Styles from './layout-sidebar.module.less';\nimport { withTooltip } from './with-tooltip';\n\nexport interface LayoutSidebarProps {\n className?: string;\n top?: ReactElement[];\n bottom?: ReactElement;\n mainItems?: NavigationItemData[];\n barExpanded: boolean;\n submenusOpened: string[] \| undefined;\n drawerOpened: boolean;\n mobile: boolean;\n touchDevice: boolean;\n navigationComponent: FC<NavLinkComponentProps>;\n onBarExpandChange(expanded: boolean): void;\n onDrawerOpenChange(expanded: boolean): void;\n onSubmenuOpenChange(id: string, opened: boolean): void;\n onNavigationLinkClick?(itemId: string, submenuItemId?: string): void;\n}\n\nexport const LayoutSidebar: FC<LayoutSidebarProps> = ({\n className,\n mobile,\n touchDevice,\n barExpanded,\n submenusOpened,\n drawerOpened,\n onBarExpandChange,\n onSubmenuOpenChange,\n onDrawerOpenChange,\n onNavigationLinkClick,\n mainItems,\n top,\n bottom,\n navigationComponent,\n}) => {\n const closeDrawer = () => {\n if (mobile) {\n onDrawerOpenChange?.(false);\n }\n };\n\n return (\n <LayoutPlacementContext.Provider value=\"side\">\n {mobile && drawerOpened && (\n <div className={Styles.navDrawerBackdrop} onClick={closeDrawer} />\n )}\n <div\n className={classNames(\n Styles.nav,\n mobile && Styles.navDrawer,\n mobile && drawerOpened && Styles.navDrawerOpened,\n !mobile && (barExpanded ? Styles.navWide : Styles.navSlim),\n className\n )}\n data-cy=\"side-navigation\"\n onClick={closeDrawer}\n >\n <ThemeProvider mode=\"dark\" className={Styles.navMain}>\n {mobile && (\n <div className={Styles.navCloseWrapper}>\n <div\n className={Styles.navClose}\n onClick={() => onBarExpandChange(false)}\n >\n <Icon svg={SvgClose} size=\"large\" />\n </div>\n </div>\n )}\n {!!top?.length && <SidebarTop>{top}</SidebarTop>}\n\n <div data-cy=\"navigation-items\">\n {mainItems?.map(item =>\n item.submenu ? (\n <SideNavigationGroupItem\n key={item.id}\n item={item}\n barExpanded={mobile ? drawerOpened : barExpanded}\n submenuOpened={!!item.id && !!submenusOpened?.includes(item.id)}\n onSubmenuOpen={onSubmenuOpenChange}\n navigationComponent={navigationComponent}\n onNavigationLinkClick={onNavigationLinkClick}\n touchDevice={touchDevice}\n />\n ) : (\n <InternalSideNavigationLink\n key={item.id}\n id={item.id}\n to={item.to}\n title={item.title}\n isActive={item.isActive}\n icon={item.icon}\n iconActive={item.iconActive}\n className={item.className}\n tag={getSubmenuGroupTag(\n item.submenu,\n getCounterTag(item.counter, item.tag)\n )}\n navigationComponent={navigationComponent}\n />\n )\n )}\n </div>\n\n {!!bottom && <SidebarBottom>{bottom}</SidebarBottom>}\n </ThemeProvider>\n\n {!mobile && (\n <div className={Styles.navFooter}>\n <div className={Styles.divider} />\n <div className={Styles.toggleWrapper}>\n <SideNavigationOptionsToggle\n appearance={barExpanded ? 'collapse-button' : 'expand'}\n onExpandedChange={() => onBarExpandChange(!barExpanded)}\n />\n </div>\n </div>\n )}\n </div>\n </LayoutPlacementContext.Provider>\n );\n};\nLayoutSidebar.displayName = 'LayoutSidebar';\n\n/** Side Navigation options toggle /\nconst SideNavigationOptionsToggle: FC<{\n appearance: 'expand' \| 'collapse' \| 'collapse-button';\n onExpandedChange?(expanded: boolean): void;\n}> = ({ appearance, onExpandedChange }) =>\n withTooltip(\n <div\n role=\"button\"\n tabIndex={0}\n data-cy=\"navigation-left-options\"\n data-pendo=\"navigation-left-options\"\n aria-label={appearance === 'expand' ? 'Expand Menu' : 'Collapse Menu'}\n className={classNames(Styles.toggle)}\n onClick={() => onExpandedChange?.(appearance === 'expand')}\n onKeyDown={e => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n onExpandedChange?.(appearance === 'expand');\n }\n }}\n >\n <div className={Styles.toggleContent}>\n <div className={Styles.toggleIconWrapper}>\n <Icon\n className={Styles.toggleIcon}\n svg={appearance === 'expand' ? SvgExpand : SvgCollapse}\n />\n </div>\n\n {appearance === 'collapse-button' && (\n <span className={Styles.toggleText}>Collapse Menu</span>\n )}\n </div>\n </div>,\n appearance === 'expand'\n ? 'Expand Menu'\n : appearance === 'collapse'\n ? 'Collapse Menu'\n : undefined,\n { placement: 'right' }\n );\n\n/* Side Navigation menu item /\nconst SideNavigationGroupItem: FC<{\n item: NavigationItemData;\n navigationComponent: FC<NavLinkComponentProps>;\n touchDevice: boolean;\n barExpanded: boolean;\n submenuOpened: boolean;\n onSubmenuOpen: (id: string, opened: boolean) => void;\n onNavigationLinkClick?: (itemId: string, submenuItemId?: string) => void;\n}> = ({\n item,\n onSubmenuOpen,\n onNavigationLinkClick,\n barExpanded,\n submenuOpened,\n navigationComponent,\n touchDevice,\n}) => {\n const {\n sidebar: {\n styles: { popoverContent },\n },\n } = useTitanLayoutContext();\n\n const tag = getSubmenuGroupTag(item.submenu, getCounterTag(item.counter, item.tag));\n\n return barExpanded ? (\n <InternalSideNavigationGroup\n id={item.id}\n to={item.to}\n title={item.title}\n isActive={item.isActive}\n icon={item.icon}\n iconActive={item.iconActive}\n className={item.className}\n tag={tag}\n submenuOpened={submenuOpened}\n onSubmenuOpen={onSubmenuOpen}\n navigationComponent={navigationComponent}\n >\n <SideNavigationGroupContent\n parentId={item.id}\n groups={item.submenu?.groups ?? []}\n navigationComponent={navigationComponent}\n onNavigationLinkClick={onNavigationLinkClick}\n />\n </InternalSideNavigationGroup>\n ) : (\n <Popover placement=\"right-start\" openOnHover={!touchDevice} delay={200} noPadding>\n <Popover.Trigger>\n {(triggerProps: any) => (\n <div {...triggerProps}>\n <InternalSideNavigationLink\n id={item.id}\n to={item.to}\n title={item.title}\n isActive={item.isActive}\n icon={item.icon}\n iconActive={item.iconActive}\n className={classNames(\n item.className,\n touchDevice && Styles.pointerEventsNone\n )}\n tag={tag}\n navigationComponent={navigationComponent}\n />\n </div>\n )}\n </Popover.Trigger>\n <Popover.Content\n style={popoverContent}\n className={classNames('z-global-nav-i', Styles.submenuPopoverContent)}\n data-cy=\"navigation-item-popover-content\"\n >\n <div className={Styles.submenuPopover}>\n <Text\n variant=\"headline\"\n el=\"h4\"\n size=\"small\"\n className={Styles.submenuPopoverTitle}\n >\n {item.title}\n </Text>\n <Divider className={Styles.submenuPopoverDivider} />\n <div className={Styles.submenuPopoverBody}>\n <SideNavigationGroupContent\n parentId={item.id}\n groups={item.submenu?.groups ?? []}\n navigationComponent={navigationComponent}\n />\n </div>\n </div>\n </Popover.Content>\n </Popover>\n );\n};\nconst SideNavigationGroupContent: FC<\n NavigationSubmenuData &\n NavigationComponentProps & {\n parentId: string;\n onNavigationLinkClick?: (itemId: string, submenuItemId?: string) => void;\n }\n> = ({ groups, parentId, navigationComponent, onNavigationLinkClick }) => {\n return (\n <Fragment>\n {groups.reduce((out, group, index) => {\n if (!group.links.length) {\n return out;\n }\n\n const title = group.title?.trim() ?? '';\n / eslint-disable react/no-array-index-key /\n if (title) {\n out.push(\n <div\n key={`:group:${parentId}:${index}:title`}\n className={Styles.submenuGroupHeader}\n >\n {title}\n </div>\n );\n }\n out.push(\n ...group.links.map((link, index) => (\n <InternalSideNavigationGroupLink\n key={`:${parentId}:${link.id}:${index}`}\n id={link.id}\n to={link.to}\n title={link.title}\n isActive={link.isActive}\n className={undefined}\n tag={getCounterTag(link.counter, link.tag)}\n parentId={parentId}\n navigationComponent={navigationComponent}\n onLinkClick={onNavigationLinkClick}\n />\n ))\n );\n / eslint-enable react/no-array-index-key */\n\n return out;\n }, [] as ReactElement[])}\n </Fragment>\n );\n};\n\nfunction SidebarTop({ children }: any) {\n const list = Children.map(children, child => {\n return child && isValidElement(child) ? child : null;\n });\n return list?.length ? (\n <ThemeProvider mode=\"dark\" className={Styles.navTop} data-cy=\"navigation-items-top\">\n {list}\n <div className={Styles.divider} />\n </ThemeProvider>\n ) : null;\n}\n\nfunction SidebarBottom({ children }: any) {\n return (\n <ThemeProvider mode=\"dark\" className={Styles.navBottom} data-cy=\"navigation-items-bottom\">\n <div className={Styles.divider} />\n {children}\n </ThemeProvider>\n );\n}\n"],"names":["Divider","Icon","Popover","Text","ThemeProvider","SvgClose","SvgCollapse","SvgExpand","classNames","Children","Fragment","isValidElement","getCounterTag","getSubmenuGroupTag","LayoutPlacementContext","useTitanLayoutContext","InternalSideNavigationGroup","InternalSideNavigationGroupLink","InternalSideNavigationLink","Styles","withTooltip","LayoutSidebar","className","mobile","touchDevice","barExpanded","submenusOpened","drawerOpened","onBarExpandChange","onSubmenuOpenChange","onDrawerOpenChange","onNavigationLinkClick","mainItems","top","bottom","navigationComponent","closeDrawer","Provider","value","div","navDrawerBackdrop","onClick","nav","navDrawer","navDrawerOpened","navWide","navSlim","data-cy","mode","navMain","navCloseWrapper","navClose","svg","size","length","SidebarTop","map","item","submenu","SideNavigationGroupItem","submenuOpened","id","includes","onSubmenuOpen","to","title","isActive","icon","iconActive","tag","counter","SidebarBottom","navFooter","divider","toggleWrapper","SideNavigationOptionsToggle","appearance","onExpandedChange","displayName","role","tabIndex","data-pendo","aria-label","toggle","onKeyDown","e","key","preventDefault","toggleContent","toggleIconWrapper","toggleIcon","span","toggleText","undefined","placement","sidebar","styles","popoverContent","SideNavigationGroupContent","parentId","groups","openOnHover","delay","noPadding","Trigger","triggerProps","pointerEventsNone","Content","style","submenuPopoverContent","submenuPopover","variant","el","submenuPopoverTitle","submenuPopoverDivider","submenuPopoverBody","reduce","out","group","index","links","trim","push","submenuGroupHeader","link","onLinkClick","children","list","child","navTop","navBottom"],"mappings":"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"}
1	+ {"version":3,"sources":["../../../src/components/titan-layout/layout-sidebar.tsx"],"sourcesContent":["import { Divider, Icon, Popover, Text, ThemeProvider } from '@servicetitan/anvil2';\nimport SvgClose from '@servicetitan/anvil2/assets/icons/material/round/close.svg';\nimport SvgCollapse from '@servicetitan/anvil2/assets/icons/st/gnav_menu_collapse.svg';\nimport SvgExpand from '@servicetitan/anvil2/assets/icons/st/gnav_menu_expand.svg';\nimport classNames from 'classnames';\nimport { Children, FC, Fragment, ReactElement, isValidElement } from 'react';\nimport { NavigationItemData, NavigationSubmenuData } from '../../utils/navigation';\nimport { NavLinkComponentProps } from '../../utils/navigation-context';\nimport { getCounterTag, getSubmenuGroupTag } from '../../utils/side-nav';\nimport { NavigationComponentProps } from './interface-internal';\nimport { LayoutPlacementContext, useTitanLayoutContext } from './layout-context';\nimport {\n InternalSideNavigationGroup,\n InternalSideNavigationGroupLink,\n InternalSideNavigationLink,\n} from './layout-sidebar-links-internal';\nimport * as Styles from './layout-sidebar.module.less';\nimport { withTooltip } from './with-tooltip';\n\nexport interface LayoutSidebarProps {\n className?: string;\n top?: ReactElement[];\n bottom?: ReactElement;\n mainItems?: NavigationItemData[];\n barExpanded: boolean;\n submenusOpened: string[] \| undefined;\n drawerOpened: boolean;\n mobile: boolean;\n touchDevice: boolean;\n navigationComponent: FC<NavLinkComponentProps>;\n onBarExpandChange(expanded: boolean): void;\n onDrawerOpenChange(expanded: boolean): void;\n onSubmenuOpenChange(id: string, opened: boolean): void;\n onNavigationLinkClick?(itemId: string, submenuItemId?: string): void;\n}\n\nexport const LayoutSidebar: FC<LayoutSidebarProps> = ({\n className,\n mobile,\n touchDevice,\n barExpanded,\n submenusOpened,\n drawerOpened,\n onBarExpandChange,\n onSubmenuOpenChange,\n onDrawerOpenChange,\n onNavigationLinkClick,\n mainItems,\n top,\n bottom,\n navigationComponent,\n}) => {\n const closeDrawer = () => {\n if (mobile) {\n onDrawerOpenChange?.(false);\n }\n };\n\n const effectiveExpanded = mobile ? drawerOpened : barExpanded;\n\n return (\n <LayoutPlacementContext.Provider value=\"side\">\n {mobile && drawerOpened && (\n <div className={Styles.navDrawerBackdrop} onClick={closeDrawer} />\n )}\n <div\n className={classNames(\n Styles.nav,\n mobile && Styles.navDrawer,\n mobile && drawerOpened && Styles.navDrawerOpened,\n !mobile && (barExpanded ? Styles.navWide : Styles.navSlim),\n className\n )}\n data-cy=\"side-navigation\"\n onClick={closeDrawer}\n >\n <ThemeProvider mode=\"dark\" className={Styles.navMain}>\n {mobile && (\n <div className={Styles.navCloseWrapper}>\n <div\n className={Styles.navClose}\n onClick={() => onBarExpandChange(false)}\n >\n <Icon svg={SvgClose} size=\"large\" />\n </div>\n </div>\n )}\n {!!top?.length && <SidebarTop>{top}</SidebarTop>}\n\n <div data-cy=\"navigation-items\">\n {mainItems?.map(item =>\n item.submenu ? (\n <SideNavigationGroupItem\n key={item.id}\n item={item}\n barExpanded={effectiveExpanded}\n submenuOpened={!!item.id && !!submenusOpened?.includes(item.id)}\n onSubmenuOpen={onSubmenuOpenChange}\n navigationComponent={navigationComponent}\n onNavigationLinkClick={onNavigationLinkClick}\n touchDevice={touchDevice}\n />\n ) : (\n <InternalSideNavigationLink\n key={item.id}\n id={item.id}\n to={item.to}\n title={\n effectiveExpanded\n ? item.title\n : (item.collapsedTitle ?? item.title)\n }\n isActive={item.isActive}\n icon={item.icon}\n iconActive={item.iconActive}\n className={item.className}\n tag={getSubmenuGroupTag(\n item.submenu,\n getCounterTag(item.counter, item.tag)\n )}\n navigationComponent={navigationComponent}\n />\n )\n )}\n </div>\n\n {!!bottom && <SidebarBottom>{bottom}</SidebarBottom>}\n </ThemeProvider>\n\n {!mobile && (\n <div className={Styles.navFooter}>\n <div className={Styles.divider} />\n <div className={Styles.toggleWrapper}>\n <SideNavigationOptionsToggle\n appearance={barExpanded ? 'collapse-button' : 'expand'}\n onExpandedChange={() => onBarExpandChange(!barExpanded)}\n />\n </div>\n </div>\n )}\n </div>\n </LayoutPlacementContext.Provider>\n );\n};\nLayoutSidebar.displayName = 'LayoutSidebar';\n\n/** Side Navigation options toggle /\nconst SideNavigationOptionsToggle: FC<{\n appearance: 'expand' \| 'collapse' \| 'collapse-button';\n onExpandedChange?(expanded: boolean): void;\n}> = ({ appearance, onExpandedChange }) =>\n withTooltip(\n <div\n role=\"button\"\n tabIndex={0}\n data-cy=\"navigation-left-options\"\n data-pendo=\"navigation-left-options\"\n aria-label={appearance === 'expand' ? 'Expand Menu' : 'Collapse Menu'}\n className={classNames(Styles.toggle)}\n onClick={() => onExpandedChange?.(appearance === 'expand')}\n onKeyDown={e => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n onExpandedChange?.(appearance === 'expand');\n }\n }}\n >\n <div className={Styles.toggleContent}>\n <div className={Styles.toggleIconWrapper}>\n <Icon\n className={Styles.toggleIcon}\n svg={appearance === 'expand' ? SvgExpand : SvgCollapse}\n />\n </div>\n\n {appearance === 'collapse-button' && (\n <span className={Styles.toggleText}>Collapse Menu</span>\n )}\n </div>\n </div>,\n appearance === 'expand'\n ? 'Expand Menu'\n : appearance === 'collapse'\n ? 'Collapse Menu'\n : undefined,\n { placement: 'right' }\n );\n\n/* Side Navigation menu item /\nconst SideNavigationGroupItem: FC<{\n item: NavigationItemData;\n navigationComponent: FC<NavLinkComponentProps>;\n touchDevice: boolean;\n barExpanded: boolean;\n submenuOpened: boolean;\n onSubmenuOpen: (id: string, opened: boolean) => void;\n onNavigationLinkClick?: (itemId: string, submenuItemId?: string) => void;\n}> = ({\n item,\n onSubmenuOpen,\n onNavigationLinkClick,\n barExpanded,\n submenuOpened,\n navigationComponent,\n touchDevice,\n}) => {\n const {\n sidebar: {\n styles: { popoverContent },\n },\n } = useTitanLayoutContext();\n\n const tag = getSubmenuGroupTag(item.submenu, getCounterTag(item.counter, item.tag));\n\n return barExpanded ? (\n <InternalSideNavigationGroup\n id={item.id}\n to={item.to}\n title={item.title}\n isActive={item.isActive}\n icon={item.icon}\n iconActive={item.iconActive}\n className={item.className}\n tag={tag}\n submenuOpened={submenuOpened}\n onSubmenuOpen={onSubmenuOpen}\n navigationComponent={navigationComponent}\n >\n <SideNavigationGroupContent\n parentId={item.id}\n groups={item.submenu?.groups ?? []}\n navigationComponent={navigationComponent}\n onNavigationLinkClick={onNavigationLinkClick}\n />\n </InternalSideNavigationGroup>\n ) : (\n <Popover placement=\"right-start\" openOnHover={!touchDevice} delay={200} noPadding>\n <Popover.Trigger>\n {(triggerProps: any) => (\n <div {...triggerProps}>\n <InternalSideNavigationLink\n id={item.id}\n to={item.to}\n title={item.collapsedTitle ?? item.title}\n isActive={item.isActive}\n icon={item.icon}\n iconActive={item.iconActive}\n className={classNames(\n item.className,\n touchDevice && Styles.pointerEventsNone\n )}\n tag={tag}\n navigationComponent={navigationComponent}\n />\n </div>\n )}\n </Popover.Trigger>\n <Popover.Content\n style={popoverContent}\n className={classNames('z-global-nav-i', Styles.submenuPopoverContent)}\n data-cy=\"navigation-item-popover-content\"\n >\n <div className={Styles.submenuPopover}>\n <Text\n variant=\"headline\"\n el=\"h4\"\n size=\"small\"\n className={Styles.submenuPopoverTitle}\n >\n {item.title}\n </Text>\n <Divider className={Styles.submenuPopoverDivider} />\n <div className={Styles.submenuPopoverBody}>\n <SideNavigationGroupContent\n parentId={item.id}\n groups={item.submenu?.groups ?? []}\n navigationComponent={navigationComponent}\n />\n </div>\n </div>\n </Popover.Content>\n </Popover>\n );\n};\nconst SideNavigationGroupContent: FC<\n NavigationSubmenuData &\n NavigationComponentProps & {\n parentId: string;\n onNavigationLinkClick?: (itemId: string, submenuItemId?: string) => void;\n }\n> = ({ groups, parentId, navigationComponent, onNavigationLinkClick }) => {\n return (\n <Fragment>\n {groups.reduce((out, group, index) => {\n if (!group.links.length) {\n return out;\n }\n\n const title = group.title?.trim() ?? '';\n / eslint-disable react/no-array-index-key /\n if (title) {\n out.push(\n <div\n key={`:group:${parentId}:${index}:title`}\n className={Styles.submenuGroupHeader}\n >\n {title}\n </div>\n );\n }\n out.push(\n ...group.links.map((link, index) => (\n <InternalSideNavigationGroupLink\n key={`:${parentId}:${link.id}:${index}`}\n id={link.id}\n to={link.to}\n title={link.title}\n isActive={link.isActive}\n className={undefined}\n tag={getCounterTag(link.counter, link.tag)}\n parentId={parentId}\n navigationComponent={navigationComponent}\n onLinkClick={onNavigationLinkClick}\n />\n ))\n );\n / eslint-enable react/no-array-index-key */\n\n return out;\n }, [] as ReactElement[])}\n </Fragment>\n );\n};\n\nfunction SidebarTop({ children }: any) {\n const list = Children.map(children, child => {\n return child && isValidElement(child) ? child : null;\n });\n return list?.length ? (\n <ThemeProvider mode=\"dark\" className={Styles.navTop} data-cy=\"navigation-items-top\">\n {list}\n <div className={Styles.divider} />\n </ThemeProvider>\n ) : null;\n}\n\nfunction SidebarBottom({ children }: any) {\n return (\n <ThemeProvider mode=\"dark\" className={Styles.navBottom} data-cy=\"navigation-items-bottom\">\n <div className={Styles.divider} />\n {children}\n </ThemeProvider>\n );\n}\n"],"names":["Divider","Icon","Popover","Text","ThemeProvider","SvgClose","SvgCollapse","SvgExpand","classNames","Children","Fragment","isValidElement","getCounterTag","getSubmenuGroupTag","LayoutPlacementContext","useTitanLayoutContext","InternalSideNavigationGroup","InternalSideNavigationGroupLink","InternalSideNavigationLink","Styles","withTooltip","LayoutSidebar","className","mobile","touchDevice","barExpanded","submenusOpened","drawerOpened","onBarExpandChange","onSubmenuOpenChange","onDrawerOpenChange","onNavigationLinkClick","mainItems","top","bottom","navigationComponent","closeDrawer","effectiveExpanded","Provider","value","div","navDrawerBackdrop","onClick","nav","navDrawer","navDrawerOpened","navWide","navSlim","data-cy","mode","navMain","navCloseWrapper","navClose","svg","size","length","SidebarTop","map","item","submenu","SideNavigationGroupItem","submenuOpened","id","includes","onSubmenuOpen","to","title","collapsedTitle","isActive","icon","iconActive","tag","counter","SidebarBottom","navFooter","divider","toggleWrapper","SideNavigationOptionsToggle","appearance","onExpandedChange","displayName","role","tabIndex","data-pendo","aria-label","toggle","onKeyDown","e","key","preventDefault","toggleContent","toggleIconWrapper","toggleIcon","span","toggleText","undefined","placement","sidebar","styles","popoverContent","SideNavigationGroupContent","parentId","groups","openOnHover","delay","noPadding","Trigger","triggerProps","pointerEventsNone","Content","style","submenuPopoverContent","submenuPopover","variant","el","submenuPopoverTitle","submenuPopoverDivider","submenuPopoverBody","reduce","out","group","index","links","trim","push","submenuGroupHeader","link","onLinkClick","children","list","child","navTop","navBottom"],"mappings":";AAAA,SAASA,OAAO,EAAEC,IAAI,EAAEC,OAAO,EAAEC,IAAI,EAAEC,aAAa,QAAQ,uBAAuB;AACnF,OAAOC,cAAc,6DAA6D;AAClF,OAAOC,iBAAiB,8DAA8D;AACtF,OAAOC,eAAe,4DAA4D;AAClF,OAAOC,gBAAgB,aAAa;AACpC,SAASC,QAAQ,EAAMC,QAAQ,EAAgBC,cAAc,QAAQ,QAAQ;AAG7E,SAASC,aAAa,EAAEC,kBAAkB,QAAQ,uBAAuB;AAEzE,SAASC,sBAAsB,EAAEC,qBAAqB,QAAQ,mBAAmB;AACjF,SACIC,2BAA2B,EAC3BC,+BAA+B,EAC/BC,0BAA0B,QACvB,kCAAkC;AACzC,YAAYC,YAAY,+BAA+B;AACvD,SAASC,WAAW,QAAQ,iBAAiB;AAmB7C,OAAO,MAAMC,gBAAwC,CAAC,EAClDC,SAAS,EACTC,MAAM,EACNC,WAAW,EACXC,WAAW,EACXC,cAAc,EACdC,YAAY,EACZC,iBAAiB,EACjBC,mBAAmB,EACnBC,kBAAkB,EAClBC,qBAAqB,EACrBC,SAAS,EACTC,GAAG,EACHC,MAAM,EACNC,mBAAmB,EACtB;IACG,MAAMC,cAAc;QAChB,IAAIb,QAAQ;YACRO,+BAAAA,yCAAAA,mBAAqB;QACzB;IACJ;IAEA,MAAMO,oBAAoBd,SAASI,eAAeF;IAElD,qBACI,MAACX,uBAAuBwB,QAAQ;QAACC,OAAM;;YAClChB,UAAUI,8BACP,KAACa;gBAAIlB,WAAWH,OAAOsB,iBAAiB;gBAAEC,SAASN;;0BAEvD,MAACI;gBACGlB,WAAWd,WACPW,OAAOwB,GAAG,EACVpB,UAAUJ,OAAOyB,SAAS,EAC1BrB,UAAUI,gBAAgBR,OAAO0B,eAAe,EAChD,CAACtB,UAAWE,CAAAA,cAAcN,OAAO2B,OAAO,GAAG3B,OAAO4B,OAAO,AAAD,GACxDzB;gBAEJ0B,WAAQ;gBACRN,SAASN;;kCAET,MAAChC;wBAAc6C,MAAK;wBAAO3B,WAAWH,OAAO+B,OAAO;;4BAC/C3B,wBACG,KAACiB;gCAAIlB,WAAWH,OAAOgC,eAAe;0CAClC,cAAA,KAACX;oCACGlB,WAAWH,OAAOiC,QAAQ;oCAC1BV,SAAS,IAAMd,kBAAkB;8CAEjC,cAAA,KAAC3B;wCAAKoD,KAAKhD;wCAAUiD,MAAK;;;;4BAIrC,CAAC,EAACrB,gBAAAA,0BAAAA,IAAKsB,MAAM,mBAAI,KAACC;0CAAYvB;;0CAE/B,KAACO;gCAAIQ,WAAQ;0CACRhB,sBAAAA,gCAAAA,UAAWyB,GAAG,CAACC,CAAAA;wCAoBOA;2CAnBnBA,KAAKC,OAAO,iBACR,KAACC;wCAEGF,MAAMA;wCACNjC,aAAaY;wCACbwB,eAAe,CAAC,CAACH,KAAKI,EAAE,IAAI,CAAC,EAACpC,2BAAAA,qCAAAA,eAAgBqC,QAAQ,CAACL,KAAKI,EAAE;wCAC9DE,eAAenC;wCACfM,qBAAqBA;wCACrBJ,uBAAuBA;wCACvBP,aAAaA;uCAPRkC,KAAKI,EAAE,kBAUhB,KAAC5C;wCAEG4C,IAAIJ,KAAKI,EAAE;wCACXG,IAAIP,KAAKO,EAAE;wCACXC,OACI7B,oBACMqB,KAAKQ,KAAK,IACTR,uBAAAA,KAAKS,cAAc,cAAnBT,kCAAAA,uBAAuBA,KAAKQ,KAAK;wCAE5CE,UAAUV,KAAKU,QAAQ;wCACvBC,MAAMX,KAAKW,IAAI;wCACfC,YAAYZ,KAAKY,UAAU;wCAC3BhD,WAAWoC,KAAKpC,SAAS;wCACzBiD,KAAK1D,mBACD6C,KAAKC,OAAO,EACZ/C,cAAc8C,KAAKc,OAAO,EAAEd,KAAKa,GAAG;wCAExCpC,qBAAqBA;uCAhBhBuB,KAAKI,EAAE;;;4BAsB3B,CAAC,CAAC5B,wBAAU,KAACuC;0CAAevC;;;;oBAGhC,CAACX,wBACE,MAACiB;wBAAIlB,WAAWH,OAAOuD,SAAS;;0CAC5B,KAAClC;gCAAIlB,WAAWH,OAAOwD,OAAO;;0CAC9B,KAACnC;gCAAIlB,WAAWH,OAAOyD,aAAa;0CAChC,cAAA,KAACC;oCACGC,YAAYrD,cAAc,oBAAoB;oCAC9CsD,kBAAkB,IAAMnD,kBAAkB,CAACH;;;;;;;;;AAQ3E,EAAE;AACFJ,cAAc2D,WAAW,GAAG;AAE5B,mCAAmC,GACnC,MAAMH,8BAGD,CAAC,EAAEC,UAAU,EAAEC,gBAAgB,EAAE,GAClC3D,0BACI,KAACoB;QACGyC,MAAK;QACLC,UAAU;QACVlC,WAAQ;QACRmC,cAAW;QACXC,cAAYN,eAAe,WAAW,gBAAgB;QACtDxD,WAAWd,WAAWW,OAAOkE,MAAM;QACnC3C,SAAS,IAAMqC,6BAAAA,uCAAAA,iBAAmBD,eAAe;QACjDQ,WAAWC,CAAAA;YACP,IAAIA,EAAEC,GAAG,KAAK,WAAWD,EAAEC,GAAG,KAAK,KAAK;gBACpCD,EAAEE,cAAc;gBAChBV,6BAAAA,uCAAAA,iBAAmBD,eAAe;YACtC;QACJ;kBAEA,cAAA,MAACtC;YAAIlB,WAAWH,OAAOuE,aAAa;;8BAChC,KAAClD;oBAAIlB,WAAWH,OAAOwE,iBAAiB;8BACpC,cAAA,KAAC1F;wBACGqB,WAAWH,OAAOyE,UAAU;wBAC5BvC,KAAKyB,eAAe,WAAWvE,YAAYD;;;gBAIlDwE,eAAe,mCACZ,KAACe;oBAAKvE,WAAWH,OAAO2E,UAAU;8BAAE;;;;QAIhDhB,eAAe,WACT,gBACAA,eAAe,aACb,kBACAiB,WACR;QAAEC,WAAW;IAAQ;AAG7B,8BAA8B,GAC9B,MAAMpC,0BAQD,CAAC,EACFF,IAAI,EACJM,aAAa,EACbjC,qBAAqB,EACrBN,WAAW,EACXoC,aAAa,EACb1B,mBAAmB,EACnBX,WAAW,EACd;;QAyBuBkC,eA6CYA;IArEhC,MAAM,EACFuC,SAAS,EACLC,QAAQ,EAAEC,cAAc,EAAE,EAC7B,EACJ,GAAGpF;IAEJ,MAAMwD,MAAM1D,mBAAmB6C,KAAKC,OAAO,EAAE/C,cAAc8C,KAAKc,OAAO,EAAEd,KAAKa,GAAG;IAEjF,OAAO9C,4BACH,KAACT;QACG8C,IAAIJ,KAAKI,EAAE;QACXG,IAAIP,KAAKO,EAAE;QACXC,OAAOR,KAAKQ,KAAK;QACjBE,UAAUV,KAAKU,QAAQ;QACvBC,MAAMX,KAAKW,IAAI;QACfC,YAAYZ,KAAKY,UAAU;QAC3BhD,WAAWoC,KAAKpC,SAAS;QACzBiD,KAAKA;QACLV,eAAeA;QACfG,eAAeA;QACf7B,qBAAqBA;kBAErB,cAAA,KAACiE;YACGC,UAAU3C,KAAKI,EAAE;YACjBwC,MAAM,WAAE5C,gBAAAA,KAAKC,OAAO,cAAZD,oCAAAA,cAAc4C,MAAM,uCAAI,EAAE;YAClCnE,qBAAqBA;YACrBJ,uBAAuBA;;uBAI/B,MAAC7B;QAAQ8F,WAAU;QAAcO,aAAa,CAAC/E;QAAagF,OAAO;QAAKC,SAAS;;0BAC7E,KAACvG,QAAQwG,OAAO;0BACX,CAACC;wBAKiBjD;yCAJf,KAAClB;wBAAK,GAAGmE,YAAY;kCACjB,cAAA,KAACzF;4BACG4C,IAAIJ,KAAKI,EAAE;4BACXG,IAAIP,KAAKO,EAAE;4BACXC,KAAK,GAAER,uBAAAA,KAAKS,cAAc,cAAnBT,kCAAAA,uBAAuBA,KAAKQ,KAAK;4BACxCE,UAAUV,KAAKU,QAAQ;4BACvBC,MAAMX,KAAKW,IAAI;4BACfC,YAAYZ,KAAKY,UAAU;4BAC3BhD,WAAWd,WACPkD,KAAKpC,SAAS,EACdE,eAAeL,OAAOyF,iBAAiB;4BAE3CrC,KAAKA;4BACLpC,qBAAqBA;;;;;0BAKrC,KAACjC,QAAQ2G,OAAO;gBACZC,OAAOX;gBACP7E,WAAWd,WAAW,kBAAkBW,OAAO4F,qBAAqB;gBACpE/D,WAAQ;0BAER,cAAA,MAACR;oBAAIlB,WAAWH,OAAO6F,cAAc;;sCACjC,KAAC7G;4BACG8G,SAAQ;4BACRC,IAAG;4BACH5D,MAAK;4BACLhC,WAAWH,OAAOgG,mBAAmB;sCAEpCzD,KAAKQ,KAAK;;sCAEf,KAAClE;4BAAQsB,WAAWH,OAAOiG,qBAAqB;;sCAChD,KAAC5E;4BAAIlB,WAAWH,OAAOkG,kBAAkB;sCACrC,cAAA,KAACjB;gCACGC,UAAU3C,KAAKI,EAAE;gCACjBwC,MAAM,YAAE5C,iBAAAA,KAAKC,OAAO,cAAZD,qCAAAA,eAAc4C,MAAM,yCAAI,EAAE;gCAClCnE,qBAAqBA;;;;;;;;AAOjD;AACA,MAAMiE,6BAMF,CAAC,EAAEE,MAAM,EAAED,QAAQ,EAAElE,mBAAmB,EAAEJ,qBAAqB,EAAE;IACjE,qBACI,KAACrB;kBACI4F,OAAOgB,MAAM,CAAC,CAACC,KAAKC,OAAOC;;gBAKVD;YAJd,IAAI,CAACA,MAAME,KAAK,CAACnE,MAAM,EAAE;gBACrB,OAAOgE;YACX;YAEA,MAAMrD,iBAAQsD,eAAAA,MAAMtD,KAAK,cAAXsD,mCAAAA,aAAaG,IAAI,yCAAM;YACrC,2CAA2C,GAC3C,IAAIzD,OAAO;gBACPqD,IAAIK,IAAI,eACJ,KAACpF;oBAEGlB,WAAWH,OAAO0G,kBAAkB;8BAEnC3D;mBAHI,CAAC,OAAO,EAAEmC,SAAS,CAAC,EAAEoB,MAAM,MAAM,CAAC;YAMpD;YACAF,IAAIK,IAAI,IACDJ,MAAME,KAAK,CAACjE,GAAG,CAAC,CAACqE,MAAML,sBACtB,KAACxG;oBAEG6C,IAAIgE,KAAKhE,EAAE;oBACXG,IAAI6D,KAAK7D,EAAE;oBACXC,OAAO4D,KAAK5D,KAAK;oBACjBE,UAAU0D,KAAK1D,QAAQ;oBACvB9C,WAAWyE;oBACXxB,KAAK3D,cAAckH,KAAKtD,OAAO,EAAEsD,KAAKvD,GAAG;oBACzC8B,UAAUA;oBACVlE,qBAAqBA;oBACrB4F,aAAahG;mBATR,CAAC,CAAC,EAAEsE,SAAS,CAAC,EAAEyB,KAAKhE,EAAE,CAAC,CAAC,EAAE2D,OAAO;YAanD,0CAA0C,GAE1C,OAAOF;QACX,GAAG,EAAE;;AAGjB;AAEA,SAAS/D,WAAW,EAAEwE,QAAQ,EAAO;IACjC,MAAMC,OAAOxH,SAASgD,GAAG,CAACuE,UAAUE,CAAAA;QAChC,OAAOA,uBAASvH,eAAeuH,SAASA,QAAQ;IACpD;IACA,OAAOD,CAAAA,iBAAAA,2BAAAA,KAAM1E,MAAM,kBACf,MAACnD;QAAc6C,MAAK;QAAO3B,WAAWH,OAAOgH,MAAM;QAAEnF,WAAQ;;YACxDiF;0BACD,KAACzF;gBAAIlB,WAAWH,OAAOwD,OAAO;;;SAElC;AACR;AAEA,SAASF,cAAc,EAAEuD,QAAQ,EAAO;IACpC,qBACI,MAAC5H;QAAc6C,MAAK;QAAO3B,WAAWH,OAAOiH,SAAS;QAAEpF,WAAQ;;0BAC5D,KAACR;gBAAIlB,WAAWH,OAAOwD,OAAO;;YAC7BqD;;;AAGb"}

package/dist/utils/navigation.d.ts CHANGED Viewed

@@ -20,6 +20,8 @@ export interface NavigationLinkData {
     to: string;
     /** link title */
     title: string;
+    /** title shown when the navigation rail is collapsed; falls back to `title` */
+    collapsedTitle?: string;
     /** callback to return active state. By default, it compares link href with current pathname */
     isActive?: boolean | ((pathname: string) => boolean);
 }

package/dist/utils/navigation.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"navigation.d.ts","sourceRoot":"","sources":["../../src/utils/navigation.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAEhE,MAAM,WAAW,kBAAmB,SAAQ,kBAAkB;IAC1D,yCAAyC;IACzC,IAAI,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC;IAEnC,uCAAuC;IACvC,UAAU,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC;IAEzC,yEAAyE;IACzE,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,GAAG,CAAC,EAAE,cAAc,CAAC;IAErB,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,oCAAoC;IACpC,OAAO,CAAC,EAAE,qBAAqB,CAAC;CACnC;AAED,MAAM,WAAW,kBAAkB;IAC/B,cAAc;IACd,EAAE,EAAE,MAAM,CAAC;IAEX,gBAAgB;IAChB,EAAE,EAAE,MAAM,CAAC;IAEX,iBAAiB;IACjB,KAAK,EAAE,MAAM,CAAC;IAEd,+FAA+F;IAC/F,QAAQ,CAAC,EAAE,OAAO,GAAG,CAAC,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,CAAC;CACxD;AAED,MAAM,WAAW,qBAAqB;IAClC,qBAAqB;IACrB,MAAM,EAAE,0BAA0B,EAAE,CAAC;CACxC;AAED,MAAM,WAAW,yBAA0B,SAAQ,kBAAkB;IACjE,+EAA+E;IAC/E,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,0EAA0E;IAC1E,GAAG,CAAC,EAAE,cAAc,CAAC;CACxB;AAED,MAAM,WAAW,0BAA0B;IACvC,0BAA0B;IAC1B,KAAK,EAAE,MAAM,CAAC;IAEd,0BAA0B;IAC1B,KAAK,EAAE,yBAAyB,EAAE,CAAC;CACtC"}
1	+ {"version":3,"file":"navigation.d.ts","sourceRoot":"","sources":["../../src/utils/navigation.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAEhE,MAAM,WAAW,kBAAmB,SAAQ,kBAAkB;IAC1D,yCAAyC;IACzC,IAAI,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC;IAEnC,uCAAuC;IACvC,UAAU,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC;IAEzC,yEAAyE;IACzE,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,GAAG,CAAC,EAAE,cAAc,CAAC;IAErB,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,oCAAoC;IACpC,OAAO,CAAC,EAAE,qBAAqB,CAAC;CACnC;AAED,MAAM,WAAW,kBAAkB;IAC/B,cAAc;IACd,EAAE,EAAE,MAAM,CAAC;IAEX,gBAAgB;IAChB,EAAE,EAAE,MAAM,CAAC;IAEX,iBAAiB;IACjB,KAAK,EAAE,MAAM,CAAC;IAEd,+EAA+E;IAC/E,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,+FAA+F;IAC/F,QAAQ,CAAC,EAAE,OAAO,GAAG,CAAC,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,CAAC;CACxD;AAED,MAAM,WAAW,qBAAqB;IAClC,qBAAqB;IACrB,MAAM,EAAE,0BAA0B,EAAE,CAAC;CACxC;AAED,MAAM,WAAW,yBAA0B,SAAQ,kBAAkB;IACjE,+EAA+E;IAC/E,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,0EAA0E;IAC1E,GAAG,CAAC,EAAE,cAAc,CAAC;CACxB;AAED,MAAM,WAAW,0BAA0B;IACvC,0BAA0B;IAC1B,KAAK,EAAE,MAAM,CAAC;IAEd,0BAA0B;IAC1B,KAAK,EAAE,yBAAyB,EAAE,CAAC;CACtC"}

package/dist/utils/navigation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../src/utils/navigation.ts"],"sourcesContent":["import { IconProps } from '@servicetitan/anvil2';\nimport { CounterTagData, CounterTagValue } from './counter-tag';\n\nexport interface NavigationItemData extends NavigationLinkData {\n /** svg icon (anvil2) of inactive item /\n icon: IconProps['svg'] \| undefined;\n\n /* svg icon (anvil2) of active item /\n iconActive: IconProps['svg'] \| undefined;\n\n /* item tag (optional). shown if it is set and true or greater than 0 /\n counter?: CounterTagValue;\n tag?: CounterTagData;\n\n /* class name of link item /\n className?: string;\n\n /* optional submenu of link item /\n submenu?: NavigationSubmenuData;\n}\n\nexport interface NavigationLinkData {\n /* link id /\n id: string;\n\n /* link href /\n to: string;\n\n /* link title /\n title: string;\n\n /* callback to return active state. By default, it compares link href with current pathname /\n isActive?: boolean \| ((pathname: string) => boolean);\n}\n\nexport interface NavigationSubmenuData {\n /* submenu groups /\n groups: NavigationSubmenuGroupData[];\n}\n\nexport interface NavigationSubmenuItemData extends NavigationLinkData {\n /* item tag (optional) value. shown if it is set and true or greater than 0 /\n counter?: CounterTagValue;\n /* item tag (optional) value. shown if value is true or greater than 0 /\n tag?: CounterTagData;\n}\n\nexport interface NavigationSubmenuGroupData {\n /* submenu group title /\n title: string;\n\n /* submenu group links */\n links: NavigationSubmenuItemData[];\n}\n"],"names":[],"mappings":"~~AA+CA~~,WAMC"}
1	+ {"version":3,"sources":["../../src/utils/navigation.ts"],"sourcesContent":["import { IconProps } from '@servicetitan/anvil2';\nimport { CounterTagData, CounterTagValue } from './counter-tag';\n\nexport interface NavigationItemData extends NavigationLinkData {\n /** svg icon (anvil2) of inactive item /\n icon: IconProps['svg'] \| undefined;\n\n /* svg icon (anvil2) of active item /\n iconActive: IconProps['svg'] \| undefined;\n\n /* item tag (optional). shown if it is set and true or greater than 0 /\n counter?: CounterTagValue;\n tag?: CounterTagData;\n\n /* class name of link item /\n className?: string;\n\n /* optional submenu of link item /\n submenu?: NavigationSubmenuData;\n}\n\nexport interface NavigationLinkData {\n /* link id /\n id: string;\n\n /* link href /\n to: string;\n\n /* link title /\n title: string;\n\n /* title shown when the navigation rail is collapsed; falls back to `title` /\n collapsedTitle?: string;\n\n /* callback to return active state. By default, it compares link href with current pathname /\n isActive?: boolean \| ((pathname: string) => boolean);\n}\n\nexport interface NavigationSubmenuData {\n /* submenu groups /\n groups: NavigationSubmenuGroupData[];\n}\n\nexport interface NavigationSubmenuItemData extends NavigationLinkData {\n /* item tag (optional) value. shown if it is set and true or greater than 0 /\n counter?: CounterTagValue;\n /* item tag (optional) value. shown if value is true or greater than 0 /\n tag?: CounterTagData;\n}\n\nexport interface NavigationSubmenuGroupData {\n /* submenu group title /\n title: string;\n\n /* submenu group links */\n links: NavigationSubmenuItemData[];\n}\n"],"names":[],"mappings":"AAkDA,WAMC"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
     "name": "@servicetitan/navigation",
-    "version": "14.0.0",
+    "version": "14.2.0",
     "description": "Navigation components",
     "repository": {
         "type": "git",
@@ -23,7 +23,7 @@
         "react": ">=18.0.0"
     },
     "devDependencies": {
-        "@servicetitan/anvil2": "^2.1.0",
+        "@servicetitan/anvil2": "^3.12.0",
         "@servicetitan/design-system": "^14.5.3",
         "@servicetitan/tokens": ">=12.1.11",
         "react": "~18.2.0"
@@ -35,5 +35,5 @@
         "less": true,
         "webpack": false
     },
-    "gitHead": "cc95ed44520e07801e9fc8bd61d6d89797696a11"
+    "gitHead": "d1f4e9cbaf1ec2c270dc2d3fdb21b862ae5ee1f7"
 }

package/src/components/profile-dropdown/interface.ts CHANGED Viewed

@@ -22,8 +22,7 @@ export type ProfileDropdownProps = {
 } & ComponentPropsWithoutRef<'div'>;
 export type ProfileItemContent =
-    | { children: string; text?: string }
-    | { children: ReactNode; text: string };
+    { children: string; text?: string } | { children: ReactNode; text: string };
 export type ProfileDropdownSectionProps = Omit<ComponentPropsWithoutRef<'div'>, 'children'> & {
     children: ReactNode;

package/src/components/titan-layout/layout-sidebar.tsx CHANGED Viewed

@@ -56,6 +56,8 @@ export const LayoutSidebar: FC<LayoutSidebarProps> = ({
         }
     };
+    const effectiveExpanded = mobile ? drawerOpened : barExpanded;
     return (
         <LayoutPlacementContext.Provider value="side">
             {mobile && drawerOpened && (
@@ -91,7 +93,7 @@ export const LayoutSidebar: FC<LayoutSidebarProps> = ({
                                 <SideNavigationGroupItem
                                     key={item.id}
                                     item={item}
-                                    barExpanded={mobile ? drawerOpened : barExpanded}
+                                    barExpanded={effectiveExpanded}
                                     submenuOpened={!!item.id && !!submenusOpened?.includes(item.id)}
                                     onSubmenuOpen={onSubmenuOpenChange}
                                     navigationComponent={navigationComponent}
@@ -103,7 +105,11 @@ export const LayoutSidebar: FC<LayoutSidebarProps> = ({
                                     key={item.id}
                                     id={item.id}
                                     to={item.to}
-                                    title={item.title}
+                                    title={
+                                        effectiveExpanded
+                                            ? item.title
+                                            : (item.collapsedTitle ?? item.title)
+                                    }
                                     isActive={item.isActive}
                                     icon={item.icon}
                                     iconActive={item.iconActive}
@@ -235,7 +241,7 @@ const SideNavigationGroupItem: FC<{
                         <InternalSideNavigationLink
                             id={item.id}
                             to={item.to}
-                            title={item.title}
+                            title={item.collapsedTitle ?? item.title}
                             isActive={item.isActive}
                             icon={item.icon}
                             iconActive={item.iconActive}

package/src/utils/navigation.ts CHANGED Viewed

@@ -29,6 +29,9 @@ export interface NavigationLinkData {
     /** link title */
     title: string;
+    /** title shown when the navigation rail is collapsed; falls back to `title` */
+    collapsedTitle?: string;
     /** callback to return active state. By default, it compares link href with current pathname */
     isActive?: boolean | ((pathname: string) => boolean);
 }