npm - @servicetitan/navigation - Versions diffs - 13.0.0-canary.256.b43c6d7.0 → 13.0.0 - Mend

@servicetitan/navigation 13.0.0-canary.256.b43c6d7.0 → 13.0.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 (116) hide show

package/dist/components/titan-layout/layout-header-dark.js CHANGED Viewed

@@ -1,9 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { createElement as _createElement } from "react";
 import { ButtonCompound, Icon, Menu } from '@servicetitan/anvil2';
 import SvgMoreVert from '@servicetitan/anvil2/assets/icons/material/round/more_vert.svg';
 import classNames from 'classnames';
 import { useCallback, useEffect, useRef, useState } from 'react';
+import { getCounterTag } from '../../utils/side-nav';
 import { useTitanLayoutContext } from './layout-context';
 import { LayoutHeader } from './layout-header';
 import { InternalLayoutHeaderNavigationLink } from './layout-header-links-internal';
@@ -21,7 +21,7 @@ var MinimizedState = /*#__PURE__*/ function(MinimizedState) {
     MinimizedState[MinimizedState["Full"] = 2] = "Full";
     return MinimizedState;
 }(MinimizedState || {});
-export const LayoutHeaderDark = ({ className, isMobile, navigationMainItems, navigationOverflowItems, hasNotifications, onBurgerClick, logo, profile, right, rightText, rightClassName, center, centerClassName, ...rest })=>{
+export const LayoutHeaderDark = ({ className, isMobile, navigationMainItems, navigationOverflowItems, hasNotifications, logo, profile, right, rightText, rightClassName, center, centerClassName, hasBurger, onBurgerClick, ...rest })=>{
     return center ? /*#__PURE__*/ _jsxs("div", {
         className: classNames(Styles.headerStacked, className),
         "data-cy": "header-navigation",
@@ -39,6 +39,7 @@ export const LayoutHeaderDark = ({ className, isMobile, navigationMainItems, nav
                 logo: logo,
                 profile: profile,
                 onBurgerClick: onBurgerClick,
+                hasBurger: hasBurger,
                 "data-cy": "header-navigation-top"
             }),
             !isMobile && !!(navigationMainItems === null || navigationMainItems === void 0 ? void 0 : navigationMainItems.length) && /*#__PURE__*/ _jsx(LayoutHeaderNav, {
@@ -63,6 +64,7 @@ export const LayoutHeaderDark = ({ className, isMobile, navigationMainItems, nav
         logo: logo,
         profile: profile,
         onBurgerClick: onBurgerClick,
+        hasBurger: hasBurger,
         ...rest
     });
 };
@@ -112,12 +114,17 @@ const LayoutHeaderNav = ({ className, mainItems, overflowItems })=>{
             /*#__PURE__*/ _jsx("div", {
                 ref: navigationRef,
                 className: classNames(Styles.headerNavigation),
-                children: mainItems === null || mainItems === void 0 ? void 0 : mainItems.map((item)=>withTooltip(/*#__PURE__*/ _createElement(InternalLayoutHeaderNavigationLink, {
-                        ...item,
-                        label: isMinimized ? undefined : item.title,
-                        key: item.id,
+                children: mainItems === null || mainItems === void 0 ? void 0 : mainItems.map((item)=>withTooltip(/*#__PURE__*/ _jsx(InternalLayoutHeaderNavigationLink, {
+                        id: item.id,
+                        to: item.to,
+                        title: isMinimized ? undefined : item.title,
+                        isActive: item.isActive,
+                        icon: item.icon,
+                        iconActive: item.iconActive,
+                        tag: getCounterTag(item.counter, item.tag),
+                        className: item.className,
                         navigationComponent: NavigationComponent
-                    }), isMinimized ? item.title : undefined, {
+                    }, item.id), isMinimized ? item.title : undefined, {
                         key: item.id
                     }))
             }),
@@ -144,13 +151,18 @@ const LayoutHeaderNavOverflow = ({ items, navigationComponent })=>{
         children: /*#__PURE__*/ _jsx("div", {
             "data-cy": "navigation-overflow-content",
             className: Styles.headerNavigationOverflow,
-            children: items.map((item)=>/*#__PURE__*/ _createElement(InternalLayoutHeaderNavigationLink, {
-                    ...item,
-                    label: item.title,
-                    key: item.id,
+            children: items.map((item)=>/*#__PURE__*/ _jsx(InternalLayoutHeaderNavigationLink, {
+                    id: item.id,
+                    to: item.to,
+                    title: item.title,
+                    isActive: item.isActive,
+                    icon: item.icon,
+                    iconActive: item.iconActive,
+                    tag: getCounterTag(item.counter, item.tag),
+                    className: item.className,
                     navigationComponent: navigationComponent,
                     isOverflow: true
-                }))
+                }, item.id))
         })
     });
 };

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/titan-layout/layout-header-dark.tsx"],"sourcesContent":["import { ButtonCompound, Icon, Menu, MenuProps } from '@servicetitan/anvil2';\nimport SvgMoreVert from '@servicetitan/anvil2/assets/icons/material/round/more_vert.svg';\nimport classNames from 'classnames';\nimport { FC, useCallback, useEffect, useRef, useState } from 'react';\nimport { NavigationItemData } from '../../utils/navigation';\nimport { NavigationComponentProps } from './interface-internal';\nimport { useTitanLayoutContext } from './layout-context';\nimport { LayoutHeader, LayoutHeaderProps } from './layout-header';\nimport { InternalLayoutHeaderNavigationLink } from './layout-header-links-internal';\nimport * as Styles from './layout-header.module.less';\nimport { withTooltip } from './with-tooltip';\n\nfunction useForceUpdate() {\n const [, setTick] = useState(0);\n return useCallback(() => {\n setTick(tick => tick + 1);\n }, []);\n}\n\nenum MinimizedState {\n Calculating,\n Minimized,\n Full,\n}\n\ninterface LayoutHeaderStackedProps extends Omit<LayoutHeaderProps, 'variant'> {\n navigationMainItems?: NavigationItemData[];\n navigationOverflowItems?: NavigationItemData[];\n}\n\nexport const LayoutHeaderDark: FC<LayoutHeaderStackedProps> = ({\n className,\n isMobile,\n navigationMainItems,\n navigationOverflowItems,\n hasNotifications,\n onBurgerClick,\n logo,\n profile,\n right,\n rightText,\n rightClassName,\n center,\n centerClassName,\n ...rest\n}) => {\n return center ? (\n <div\n className={classNames(Styles.headerStacked, className)}\n data-cy=\"header-navigation\"\n {...rest}\n >\n <LayoutHeader\n variant=\"dark\"\n right={right}\n rightText={rightText}\n rightClassName={rightClassName}\n center={center}\n centerClassName={centerClassName}\n isMobile={isMobile}\n hasNotifications={hasNotifications}\n logo={logo}\n profile={profile}\n onBurgerClick={onBurgerClick}\n data-cy=\"header-navigation-top\"\n />\n\n {!isMobile && !!navigationMainItems?.length && (\n <LayoutHeaderNav\n className={Styles.headerStackedNav}\n mainItems={navigationMainItems}\n overflowItems={navigationOverflowItems}\n />\n )}\n </div>\n ) : (\n <LayoutHeader\n variant=\"dark\"\n className={classNames(className, !isMobile && Styles.headerDesktopNav)}\n right={right}\n rightText={rightText}\n rightClassName={rightClassName}\n center={\n isMobile ? undefined : (\n <LayoutHeaderNav\n mainItems={navigationMainItems}\n overflowItems={navigationOverflowItems}\n />\n )\n }\n centerClassName={centerClassName}\n isMobile={isMobile}\n hasNotifications={hasNotifications}\n logo={logo}\n profile={profile}\n onBurgerClick={onBurgerClick}\n {...rest}\n />\n );\n};\n\ninterface LayoutHeaderNavProps {\n className?: string;\n mainItems?: NavigationItemData[];\n overflowItems?: NavigationItemData[];\n}\nconst LayoutHeaderNav: FC<LayoutHeaderNavProps> = ({ className, mainItems, overflowItems }) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const navigationRef = useRef<HTMLDivElement>(null);\n const forceUpdate = useForceUpdate();\n const [minimized, setMinimized] = useState(MinimizedState.Calculating);\n const { NavigationComponent } = useTitanLayoutContext();\n\n useEffect(() => {\n const handleResize = () => {\n setMinimized(MinimizedState.Calculating);\n forceUpdate();\n };\n\n window.addEventListener('resize', handleResize);\n return () => window.removeEventListener('resize', handleResize);\n }, [forceUpdate]);\n\n const updateIsMinimized = () => {\n if (containerRef.current && navigationRef.current) {\n const widthGap = 16 + (overflowItems?.length ? 32 : 0);\n if (navigationRef.current.clientWidth + widthGap > containerRef.current.clientWidth) {\n setMinimized(MinimizedState.Minimized);\n } else if (minimized === MinimizedState.Calculating) {\n setMinimized(MinimizedState.Full);\n }\n }\n };\n\n useEffect(() => {\n updateIsMinimized();\n });\n\n useEffect(() => {\n setMinimized(MinimizedState.Calculating);\n forceUpdate();\n }, [forceUpdate]);\n\n const isMinimized = minimized === MinimizedState.Minimized;\n\n return (\n <div\n ref={containerRef}\n className={classNames(Styles.headerNavigationWrapper, className, {\n [Styles.calculating]: minimized === MinimizedState.Calculating,\n })}\n data-cy=\"navigation-items\"\n >\n <div ref={navigationRef} className={classNames(Styles.headerNavigation)}>\n {mainItems?.map(item =>\n withTooltip(\n <InternalLayoutHeaderNavigationLink\n {...item}\n label={isMinimized ? undefined : item.title}\n key={item.id}\n navigationComponent={NavigationComponent}\n />,\n isMinimized ? item.title : undefined,\n { key: item.id }\n )\n )}\n </div>\n {!!overflowItems?.length && (\n <LayoutHeaderNavOverflow\n items={overflowItems}\n navigationComponent={NavigationComponent}\n />\n )}\n </div>\n );\n};\n\nconst LayoutHeaderNavOverflowTrigger: MenuProps['trigger'] = props => (\n <ButtonCompound\n {...props}\n className={Styles.headerNavigationOverflowTrigger}\n data-cy=\"navigation-overflow-trigger\"\n >\n <Icon svg={SvgMoreVert} size=\"medium\" />\n </ButtonCompound>\n);\n\nconst LayoutHeaderNavOverflow: FC<\n {\n items: NavigationItemData[];\n } & NavigationComponentProps\n> = ({ items, navigationComponent }) => {\n return (\n <Menu trigger={LayoutHeaderNavOverflowTrigger} placement=\"bottom-end\">\n <div data-cy=\"navigation-overflow-content\" className={Styles.headerNavigationOverflow}>\n {items.map(item => (\n <InternalLayoutHeaderNavigationLink\n {...item}\n label={item.title}\n key={item.id}\n navigationComponent={navigationComponent}\n isOverflow\n />\n ))}\n </div>\n </Menu>\n );\n};\n"],"names":["ButtonCompound","Icon","Menu","SvgMoreVert","classNames","useCallback","useEffect","useRef","useState","useTitanLayoutContext","LayoutHeader","InternalLayoutHeaderNavigationLink","Styles","withTooltip","useForceUpdate","setTick","tick","MinimizedState","LayoutHeaderDark","className","isMobile","navigationMainItems","navigationOverflowItems","hasNotifications","onBurgerClick","logo","profile","right","rightText","rightClassName","center","centerClassName","rest","div","headerStacked","data-cy","variant","length","LayoutHeaderNav","headerStackedNav","mainItems","overflowItems","headerDesktopNav","undefined","containerRef","navigationRef","forceUpdate","minimized","setMinimized","NavigationComponent","handleResize","window","addEventListener","removeEventListener","updateIsMinimized","current","widthGap","clientWidth","isMinimized","ref","headerNavigationWrapper","calculating","headerNavigation","map","item","label","title","key","id","navigationComponent","LayoutHeaderNavOverflow","items","LayoutHeaderNavOverflowTrigger","props","headerNavigationOverflowTrigger","svg","size","trigger","placement","headerNavigationOverflow","isOverflow"],"mappings":"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"}
1	+ {"version":3,"sources":["../../../src/components/titan-layout/layout-header-dark.tsx"],"sourcesContent":["import { ButtonCompound, Icon, Menu, MenuProps } from '@servicetitan/anvil2';\nimport SvgMoreVert from '@servicetitan/anvil2/assets/icons/material/round/more_vert.svg';\nimport classNames from 'classnames';\nimport { FC, useCallback, useEffect, useRef, useState } from 'react';\nimport { NavigationItemData } from '../../utils/navigation';\nimport { getCounterTag } from '../../utils/side-nav';\nimport { NavigationComponentProps } from './interface-internal';\nimport { useTitanLayoutContext } from './layout-context';\nimport { LayoutHeader, LayoutHeaderProps } from './layout-header';\nimport { InternalLayoutHeaderNavigationLink } from './layout-header-links-internal';\nimport * as Styles from './layout-header.module.less';\nimport { withTooltip } from './with-tooltip';\n\nfunction useForceUpdate() {\n const [, setTick] = useState(0);\n return useCallback(() => {\n setTick(tick => tick + 1);\n }, []);\n}\n\nenum MinimizedState {\n Calculating,\n Minimized,\n Full,\n}\n\ninterface LayoutHeaderStackedProps extends Omit<LayoutHeaderProps, 'variant'> {\n navigationMainItems?: NavigationItemData[];\n navigationOverflowItems?: NavigationItemData[];\n}\n\nexport const LayoutHeaderDark: FC<LayoutHeaderStackedProps> = ({\n className,\n isMobile,\n navigationMainItems,\n navigationOverflowItems,\n hasNotifications,\n logo,\n profile,\n right,\n rightText,\n rightClassName,\n center,\n centerClassName,\n hasBurger,\n onBurgerClick,\n ...rest\n}) => {\n return center ? (\n <div\n className={classNames(Styles.headerStacked, className)}\n data-cy=\"header-navigation\"\n {...rest}\n >\n <LayoutHeader\n variant=\"dark\"\n right={right}\n rightText={rightText}\n rightClassName={rightClassName}\n center={center}\n centerClassName={centerClassName}\n isMobile={isMobile}\n hasNotifications={hasNotifications}\n logo={logo}\n profile={profile}\n onBurgerClick={onBurgerClick}\n hasBurger={hasBurger}\n data-cy=\"header-navigation-top\"\n />\n\n {!isMobile && !!navigationMainItems?.length && (\n <LayoutHeaderNav\n className={Styles.headerStackedNav}\n mainItems={navigationMainItems}\n overflowItems={navigationOverflowItems}\n />\n )}\n </div>\n ) : (\n <LayoutHeader\n variant=\"dark\"\n className={classNames(className, !isMobile && Styles.headerDesktopNav)}\n right={right}\n rightText={rightText}\n rightClassName={rightClassName}\n center={\n isMobile ? undefined : (\n <LayoutHeaderNav\n mainItems={navigationMainItems}\n overflowItems={navigationOverflowItems}\n />\n )\n }\n centerClassName={centerClassName}\n isMobile={isMobile}\n hasNotifications={hasNotifications}\n logo={logo}\n profile={profile}\n onBurgerClick={onBurgerClick}\n hasBurger={hasBurger}\n {...rest}\n />\n );\n};\n\ninterface LayoutHeaderNavProps {\n className?: string;\n mainItems?: NavigationItemData[];\n overflowItems?: NavigationItemData[];\n}\nconst LayoutHeaderNav: FC<LayoutHeaderNavProps> = ({ className, mainItems, overflowItems }) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const navigationRef = useRef<HTMLDivElement>(null);\n const forceUpdate = useForceUpdate();\n const [minimized, setMinimized] = useState(MinimizedState.Calculating);\n const { NavigationComponent } = useTitanLayoutContext();\n\n useEffect(() => {\n const handleResize = () => {\n setMinimized(MinimizedState.Calculating);\n forceUpdate();\n };\n\n window.addEventListener('resize', handleResize);\n return () => window.removeEventListener('resize', handleResize);\n }, [forceUpdate]);\n\n const updateIsMinimized = () => {\n if (containerRef.current && navigationRef.current) {\n const widthGap = 16 + (overflowItems?.length ? 32 : 0);\n if (navigationRef.current.clientWidth + widthGap > containerRef.current.clientWidth) {\n setMinimized(MinimizedState.Minimized);\n } else if (minimized === MinimizedState.Calculating) {\n setMinimized(MinimizedState.Full);\n }\n }\n };\n\n useEffect(() => {\n updateIsMinimized();\n });\n\n useEffect(() => {\n setMinimized(MinimizedState.Calculating);\n forceUpdate();\n }, [forceUpdate]);\n\n const isMinimized = minimized === MinimizedState.Minimized;\n\n return (\n <div\n ref={containerRef}\n className={classNames(Styles.headerNavigationWrapper, className, {\n [Styles.calculating]: minimized === MinimizedState.Calculating,\n })}\n data-cy=\"navigation-items\"\n >\n <div ref={navigationRef} className={classNames(Styles.headerNavigation)}>\n {mainItems?.map(item =>\n withTooltip(\n <InternalLayoutHeaderNavigationLink\n id={item.id}\n to={item.to}\n title={isMinimized ? undefined : item.title}\n isActive={item.isActive}\n icon={item.icon}\n iconActive={item.iconActive}\n tag={getCounterTag(item.counter, item.tag)}\n className={item.className}\n key={item.id}\n navigationComponent={NavigationComponent}\n />,\n isMinimized ? item.title : undefined,\n { key: item.id }\n )\n )}\n </div>\n {!!overflowItems?.length && (\n <LayoutHeaderNavOverflow\n items={overflowItems}\n navigationComponent={NavigationComponent}\n />\n )}\n </div>\n );\n};\n\nconst LayoutHeaderNavOverflowTrigger: MenuProps['trigger'] = props => (\n <ButtonCompound\n {...props}\n className={Styles.headerNavigationOverflowTrigger}\n data-cy=\"navigation-overflow-trigger\"\n >\n <Icon svg={SvgMoreVert} size=\"medium\" />\n </ButtonCompound>\n);\n\nconst LayoutHeaderNavOverflow: FC<\n {\n items: NavigationItemData[];\n } & NavigationComponentProps\n> = ({ items, navigationComponent }) => {\n return (\n <Menu trigger={LayoutHeaderNavOverflowTrigger} placement=\"bottom-end\">\n <div data-cy=\"navigation-overflow-content\" className={Styles.headerNavigationOverflow}>\n {items.map(item => (\n <InternalLayoutHeaderNavigationLink\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 tag={getCounterTag(item.counter, item.tag)}\n className={item.className}\n key={item.id}\n navigationComponent={navigationComponent}\n isOverflow\n />\n ))}\n </div>\n </Menu>\n );\n};\n"],"names":["ButtonCompound","Icon","Menu","SvgMoreVert","classNames","useCallback","useEffect","useRef","useState","getCounterTag","useTitanLayoutContext","LayoutHeader","InternalLayoutHeaderNavigationLink","Styles","withTooltip","useForceUpdate","setTick","tick","MinimizedState","LayoutHeaderDark","className","isMobile","navigationMainItems","navigationOverflowItems","hasNotifications","logo","profile","right","rightText","rightClassName","center","centerClassName","hasBurger","onBurgerClick","rest","div","headerStacked","data-cy","variant","length","LayoutHeaderNav","headerStackedNav","mainItems","overflowItems","headerDesktopNav","undefined","containerRef","navigationRef","forceUpdate","minimized","setMinimized","NavigationComponent","handleResize","window","addEventListener","removeEventListener","updateIsMinimized","current","widthGap","clientWidth","isMinimized","ref","headerNavigationWrapper","calculating","headerNavigation","map","item","id","to","title","isActive","icon","iconActive","tag","counter","navigationComponent","key","LayoutHeaderNavOverflow","items","LayoutHeaderNavOverflowTrigger","props","headerNavigationOverflowTrigger","svg","size","trigger","placement","headerNavigationOverflow","isOverflow"],"mappings":"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"}

package/dist/components/titan-layout/layout-header-links-internal.d.ts CHANGED Viewed

@@ -1,10 +1,29 @@
+import { IconProps } from '@servicetitan/anvil2';
 import { FC } from 'react';
-import { HeaderNavigationLinkProps, HeaderNavigationTriggerProps } from '../../utils/navigation-legacy';
+import { CounterTagData } from '../../utils/counter-tag';
 import { NavigationComponentProps } from './interface-internal';
 /** Navigation extra item with link */
-export declare const InternalLayoutHeaderNavigationLink: FC<HeaderNavigationLinkProps & NavigationComponentProps & {
+export declare const InternalLayoutHeaderNavigationLink: FC<NavigationComponentProps & {
+    id: string;
+    to: string;
+    title: string | undefined;
+    isActive: boolean | ((pathname: string) => boolean) | undefined;
+    icon: IconProps['svg'] | undefined;
+    iconActive: IconProps['svg'] | undefined;
+    tag: CounterTagData | undefined;
+    className: string | undefined;
     isOverflow?: boolean;
+    flashing?: boolean;
 }>;
 /** Navigation extra item with icon button */
-export declare const InternalLayoutHeaderNavigationTrigger: FC<HeaderNavigationTriggerProps>;
+export declare const InternalLayoutHeaderNavigationTrigger: FC<{
+    id: string;
+    title: string | undefined;
+    isActive: boolean | undefined;
+    icon: IconProps['svg'] | undefined;
+    iconActive: IconProps['svg'] | undefined;
+    tag: CounterTagData | undefined;
+    className: string | undefined;
+    flashing?: boolean;
+}>;
 //# sourceMappingURL=layout-header-links-internal.d.ts.map

package/dist/components/titan-layout/layout-header-links-internal.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"layout-header-links-internal.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-header-links-internal.tsx"],"names":[],"mappings":"~~AAEA~~,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;AACrC,OAAO,~~EACH~~,~~yBAAyB~~,~~EACzB~~,~~4BAA4B~~,~~EAC/B~~,~~MAAM,+BAA+B,~~CAAC;~~AAIvC~~,OAAO,EAAE,wBAAwB,EAAE,MAAM,sBAAsB,CAAC;~~AA0ChE~~,sCAAsC;AACtC,eAAO,MAAM,kCAAkC,EAAE,EAAE,CAC/C,~~yBAAyB~~,GAAG,~~wBAAwB~~,GAAG;~~IAAE~~,UAAU,CAAC,EAAE,OAAO,~~CAAA~~;~~CAAE~~,~~CAmDlF~~,CAAC;AAEF,6CAA6C;AAC7C,eAAO,MAAM,qCAAqC,EAAE,EAAE,CAAC,~~4BAA4B~~,~~CA0ClF~~,CAAC"}
1	+ {"version":3,"file":"layout-header-links-internal.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-header-links-internal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAEvD,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAEzD,OAAO,EAAE,wBAAwB,EAAE,MAAM,sBAAsB,CAAC;AAsChE,sCAAsC;AACtC,eAAO,MAAM,kCAAkC,EAAE,EAAE,CAC/C,wBAAwB,GAAG;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,QAAQ,EAAE,OAAO,GAAG,CAAC,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,GAAG,SAAS,CAAC;IAChE,IAAI,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC;IACnC,UAAU,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC;IACzC,GAAG,EAAE,cAAc,GAAG,SAAS,CAAC;IAChC,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;IAE9B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACtB,CA0CJ,CAAC;AAEF,6CAA6C;AAC7C,eAAO,MAAM,qCAAqC,EAAE,EAAE,CAAC;IACnD,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,IAAI,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC;IACnC,UAAU,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC;IACzC,GAAG,EAAE,cAAc,GAAG,SAAS,CAAC;IAChC,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;IAE9B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACtB,CAyBA,CAAC"}

package/dist/components/titan-layout/layout-header-links-internal.js CHANGED Viewed

@@ -3,10 +3,9 @@ import { createElement as _createElement } from "react";
 import { Icon } from '@servicetitan/anvil2';
 import classNames from 'classnames';
 import { Fragment } from 'react';
-import { getCounterTag } from '../../utils/side-nav';
 import { CounterTag } from '../counter-tag';
 import * as Styles from './layout-header.module.less';
-/** Content for navigation items */ const InternalHeaderNavigationItemContent = ({ counterClassName, icon, iconActive, label, labelClassName, tag })=>{
+/** Content for navigation items */ const InternalHeaderNavigationItemContent = ({ counterClassName, icon, iconActive, title, tag })=>{
     return /*#__PURE__*/ _jsxs(Fragment, {
         children: [
             !!icon && /*#__PURE__*/ _jsx(Icon, {
@@ -17,10 +16,10 @@ import * as Styles from './layout-header.module.less';
                 svg: iconActive,
                 className: classNames(Styles.navigationIcon, Styles.navigationIconActive)
             }),
-            !!label && /*#__PURE__*/ _jsx("span", {
-                className: classNames(Styles.navigationItemLabel, labelClassName),
+            !!title && /*#__PURE__*/ _jsx("span", {
+                className: Styles.navigationItemLabel,
                 "data-cy": "nav-item-label",
-                children: label
+                children: title
             }),
             !!tag && /*#__PURE__*/ _jsx(CounterTag, {
                 data: tag,
@@ -30,7 +29,7 @@ import * as Styles from './layout-header.module.less';
         ]
     });
 };
-/** Navigation extra item with link */ export const InternalLayoutHeaderNavigationLink = ({ id, to, hint, tooltip, className, counter, icon, iconActive, iconClassName, iconName, iconComponent, isActive, isOverflow, label, labelClassName, tag, target, title, navigationComponent: NavigationComponent, ...rest })=>{
+/** Navigation extra item with link */ export const InternalLayoutHeaderNavigationLink = ({ id, to, title, isActive, icon, iconActive, tag, className, isOverflow, flashing, navigationComponent: NavigationComponent, ...rest })=>{
     return /*#__PURE__*/ _createElement(NavigationComponent, {
         "data-cy": `navigation-item-${id}`,
         "data-pendo": `navigation-item-${id}`,
@@ -39,35 +38,33 @@ import * as Styles from './layout-header.module.less';
         to: to,
         className: classNames(isOverflow ? Styles.navigationLinkOverflow : Styles.navigationLink, className, {
             [Styles.navigationItemActive]: isActive === true,
-            [Styles.navigationItemIconState]: !!icon && !!iconActive
+            [Styles.navigationItemIconState]: !!icon && !!iconActive,
+            [Styles.navigationItemFlashing]: flashing
         }),
         isActive: typeof isActive === 'function' ? isActive : undefined,
-        activeClassName: Styles.navigationItemActive,
-        target: target
+        activeClassName: Styles.navigationItemActive
     }, /*#__PURE__*/ _jsx(InternalHeaderNavigationItemContent, {
-        tag: getCounterTag(counter, tag),
+        tag: tag,
         icon: icon,
         iconActive: iconActive,
-        label: label,
-        labelClassName: labelClassName
+        title: title
     }));
 };
-/** Navigation extra item with icon button */ export const InternalLayoutHeaderNavigationTrigger = ({ id, className, counter, icon, iconActive, iconName, isActive, hint, label, labelClassName, tag, tooltip, title, titleClassName, ...rest })=>{
+/** Navigation extra item with icon button */ export const InternalLayoutHeaderNavigationTrigger = ({ id, className, flashing, icon, iconActive, isActive, tag, title, ...rest })=>{
     return /*#__PURE__*/ _jsx("div", {
         "data-cy": `navigation-trigger-${id}`,
         "data-pendo": `navigation-trigger-${id}`,
         ...rest,
-        title: hint,
         className: classNames(Styles.navigationLink, {
             [Styles.navigationItemActive]: isActive === true,
-            [Styles.navigationItemIconState]: !!icon && !!iconActive
+            [Styles.navigationItemIconState]: !!icon && !!iconActive,
+            [Styles.navigationItemFlashing]: flashing
         }, 'cursor-pointer', className),
         children: /*#__PURE__*/ _jsx(InternalHeaderNavigationItemContent, {
-            tag: getCounterTag(counter, tag),
+            tag: tag,
             icon: icon,
             iconActive: iconActive,
-            label: label,
-            labelClassName: labelClassName
+            title: title
         })
     });
 };

package/dist/components/titan-layout/layout-header-links-internal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/titan-layout/layout-header-links-internal.tsx"],"sourcesContent":["import { Icon, IconProps } from '@servicetitan/anvil2';\nimport classNames from 'classnames';\nimport { FC, Fragment } from 'react';\nimport {~~\n HeaderNavigationLinkProps,\n HeaderNavigationTriggerProps,\n}~~ ~~from~~ ~~'../../utils/navigation-legacy';\nimport { getCounterTag~~ } from '../../utils/~~side~~-~~nav~~';\nimport { CounterTag, CounterTagProps } from '../counter-tag';\~~n// use v1 tooltips due to bug with v2 in monolith\~~nimport { NavigationComponentProps } from './interface-internal';\nimport * as Styles from './layout-header.module.less';\n\n/** Content for navigation items /\nconst InternalHeaderNavigationItemContent: FC<{\n tag?: CounterTagProps;\n counterClassName?: string;\n icon: IconProps['svg'] \| undefined;\n iconActive?: IconProps['svg'];\n ~~label~~?: string;\n ~~labelClassName?: string;\n~~}> = ({ counterClassName, icon, iconActive, ~~label~~, ~~labelClassName,~~ tag }) => {\n return (\n <Fragment>\n {!!icon && <Icon svg={icon} className={Styles.navigationIcon} />}\n {!!iconActive && (\n <Icon\n svg={iconActive}\n className={classNames(Styles.navigationIcon, Styles.navigationIconActive)}\n />\n )}\n\n {!!~~label~~ && (\n <span\n className={~~classNames(~~Styles.navigationItemLabel, ~~labelClassName)}\n~~ data-cy=\"nav-item-label\"\n >\n {~~label~~}\n </span>\n )}\n\n {!!tag && (\n <CounterTag\n data={tag}\n className={classNames(Styles.navigationItemCounter, counterClassName)}\n longClassName={Styles.navigationItemCounterLong}\n />\n )}\n </Fragment>\n );\n};\n\n/* Navigation extra item with link /\nexport const InternalLayoutHeaderNavigationLink: FC<\n ~~HeaderNavigationLinkProps &~~ NavigationComponentProps & { isOverflow?: boolean }\n> = ({\n id,\n to,\n ~~hint~~,\n ~~tooltip~~,\n ~~className,\n counter,\n~~ icon,\n iconActive,\n ~~iconClassName~~,\n ~~iconName~~,\n ~~iconComponent,\n isActive,\n~~ isOverflow,\n ~~label~~,\n ~~labelClassName,\n tag,\n target,\n title,\n~~ navigationComponent: NavigationComponent,\n ...rest\n}) => {\n return (\n <NavigationComponent\n data-cy={`navigation-item-${id}`}\n data-pendo={`navigation-item-${id}`}\n {...rest}\n key={id}\n to={to}\n className={classNames(\n isOverflow ? Styles.navigationLinkOverflow : Styles.navigationLink,\n className,\n {\n [Styles.navigationItemActive]: isActive === true,\n [Styles.navigationItemIconState]: !!icon && !!iconActive,\n }\n )}\n isActive={typeof isActive === 'function' ? isActive : undefined}\n activeClassName={Styles.navigationItemActive}\n ~~target={target}\n~~ >\n <InternalHeaderNavigationItemContent\n tag={~~getCounterTag(counter,~~ tag)}\n icon={icon}\n iconActive={iconActive}\n ~~label~~={~~label~~}\n ~~labelClassName={labelClassName}\n~~ />\n </NavigationComponent>\n );\n};\n\n/* Navigation extra item with icon button */\nexport const InternalLayoutHeaderNavigationTrigger: FC<~~HeaderNavigationTriggerProps> = (~~{\n id,\n ~~className,\~~n ~~counter,\~~n icon,\n iconActive,\n ~~iconName,\~~n ~~isActive,\~~n ~~hint,\~~n ~~label,\~~n ~~labelClassName,\n~~ tag~~,\n tooltip,\n~~ title~~,\n titleClassName,\n~~ ...rest\n}) => {\n return (\n <div\n data-cy={`navigation-trigger-${id}`}\n data-pendo={`navigation-trigger-${id}`}\n {...rest}\n ~~title={hint}\n~~ className={classNames(\n Styles.navigationLink,\n {\n [Styles.navigationItemActive]: isActive === true,\n [Styles.navigationItemIconState]: !!icon && !!iconActive,\n },\n 'cursor-pointer',\n className\n )}\n >\n <InternalHeaderNavigationItemContent\n tag={~~getCounterTag(counter,~~ tag)}\n icon={icon}\n iconActive={iconActive}\n ~~label~~={~~label~~}\n ~~labelClassName={labelClassName}\n~~ />\n </div>\n );\n};\n"],"names":["Icon","classNames","Fragment","~~getCounterTag","~~CounterTag","Styles","InternalHeaderNavigationItemContent","counterClassName","icon","iconActive","~~label~~","~~labelClassName","~~tag","svg","className","navigationIcon","navigationIconActive","span","navigationItemLabel","data-cy","data","navigationItemCounter","longClassName","navigationItemCounterLong","InternalLayoutHeaderNavigationLink","id","to","~~hint","tooltip","counter","iconClassName","iconName","iconComponent","~~isActive","isOverflow","~~target~~","~~title","~~navigationComponent","NavigationComponent","rest","data-pendo","key","navigationLinkOverflow","navigationLink","navigationItemActive","navigationItemIconState","undefined","activeClassName","InternalLayoutHeaderNavigationTrigger","~~titleClassName","~~div"],"mappings":";;AAAA,SAASA,IAAI,QAAmB,uBAAuB;AACvD,OAAOC,gBAAgB,aAAa;AACpC,SAAaC,QAAQ,QAAQ,QAAQ;~~AAKrC~~,SAASC,~~aAAa,QAAQ,uBAAuB;AACrD,SAASC,~~UAAU,QAAyB,iBAAiB;~~AAG7D~~,YAAYC,YAAY,8BAA8B;AAEtD,iCAAiC,GACjC,MAAMC,~~sCAOD~~,CAAC,EAAEC,gBAAgB,EAAEC,IAAI,EAAEC,UAAU,EAAEC,KAAK,EAAEC,~~cAAc,EAAEC,~~GAAG,EAAE;~~IACpE~~,qBACI,~~MAACV~~;;YACI,CAAC,~~CAACM~~,sBAAQ,~~KAACR~~;~~gBAAKa~~,~~KAAKL~~;~~gBAAMM~~,~~WAAWT~~,~~OAAOU~~,cAAc;;YAC3D,CAAC,~~CAACN~~,4BACC,~~KAACT~~;~~gBACGa~~,~~KAAKJ~~;~~gBACLK~~,~~WAAWb~~,~~WAAWI~~,~~OAAOU~~,cAAc,~~EAAEV~~,~~OAAOW~~,oBAAoB;;YAI/E,CAAC,~~CAACN~~,uBACC,~~KAACO~~;~~gBACGH~~,~~WAAWb~~,~~WAAWI~~,~~OAAOa,~~mBAAmB~~,EAAEP~~;~~gBAClDQ~~,WAAQ;~~0BAEPT~~;;YAIR,CAAC,~~CAACE~~,qBACC,~~KAACR~~;~~gBACGgB~~,MAAMR;gBACNE,~~WAAWb~~,~~WAAWI~~,~~OAAOgB~~,qBAAqB,~~EAAEd~~;~~gBACpDe~~,~~eAAejB~~,~~OAAOkB~~,yBAAyB;;;;AAKnE;AAEA,oCAAoC,GACpC,OAAO,MAAMC,~~qCAET~~,CAAC,EACDC,EAAE,EACFC,EAAE,~~EACFC~~,~~IAAI~~,~~EACJC~~,~~OAAO~~,~~EACPd~~,~~SAAS,EACTe,OAAO,EACPrB,~~IAAI,EACJC,UAAU,~~EACVqB~~,~~aAAa~~,~~EACbC~~,~~QAAQ~~,~~EACRC~~,~~aAAa~~,~~EACbC~~,QAAQ,EACRC,~~UAAU,EACVxB,KAAK,EACLC,cAAc,EACdC,GAAG,EACHuB,MAAM,EACNC,KAAK,EACLC,~~qBAAqBC,mBAAmB,EACxC,GAAGC,MACN;IACG,qBACI,eAACD;~~QACGnB~~,WAAS,CAAC,gBAAgB,EAAEM,IAAI;~~QAChCe~~,cAAY,CAAC,gBAAgB,~~EAAEf~~,IAAI;QAClC,~~GAAGc~~,IAAI;QACRE,~~KAAKhB~~;QACLC,IAAIA;QACJZ,~~WAAWb~~,~~WACPiC~~,~~aAAa7B~~,~~OAAOqC~~,sBAAsB,~~GAAGrC~~,~~OAAOsC~~,cAAc,~~EAClE7B~~,WACA;YACI,~~CAACT~~,~~OAAOuC~~,oBAAoB,CAAC,~~EAAEX~~,aAAa;YAC5C,~~CAAC5B~~,~~OAAOwC~~,uBAAuB,CAAC,EAAE,CAAC,~~CAACrC~~,QAAQ,CAAC,CAACC;~~QAClD~~;~~QAEJwB~~,UAAU,OAAOA,aAAa,aAAaA,WAAWa;QACtDC,~~iBAAiB1C~~,~~OAAOuC~~,oBAAoB;~~QAC5CT~~,~~QAAQA~~;~~qBAER~~,~~KAAC7B~~;~~QACGM~~,~~KAAKT,cAAc0B,SAASjB;QAC5BJ,~~MAAMA;QACNC,YAAYA;QACZC,OAAOA~~;QACPC,gBAAgBA~~;;~~AAIhC~~,EAAE;AAEF,2CAA2C,GAC3C,OAAO,~~MAAMqC~~,~~wCAA0E~~,CAAC,~~EACpFvB~~,EAAE,~~EACFX~~,SAAS,~~EACTe~~,~~OAAO~~,~~EACPrB~~,IAAI,~~EACJC~~,UAAU,~~EACVsB~~,QAAQ,~~EACRE~~,~~QAAQ,EACRN,IAAI,EACJjB,KAAK,EACLC,cAAc,EACdC,~~GAAG,~~EACHgB~~,~~OAAO,EACPQ,~~KAAK,~~EACLa~~,~~cAAc~~,~~EACd,GAAGV,MACN~~;~~IACG~~,qBACI,KAACW;~~QACG/B~~,WAAS,CAAC,mBAAmB,EAAEM,IAAI;~~QACnCe~~,cAAY,CAAC,mBAAmB,~~EAAEf~~,IAAI;QACrC,~~GAAGc~~,IAAI;~~QACRH~~,~~OAAOT;QACPb~~,~~WAAWb~~,~~WACPI~~,~~OAAOsC,~~cAAc,EACrB;YACI,~~CAACtC~~,~~OAAOuC~~,oBAAoB,CAAC,~~EAAEX~~,aAAa;YAC5C,~~CAAC5B~~,~~OAAOwC~~,uBAAuB,CAAC,EAAE,CAAC,~~CAACrC~~,QAAQ,CAAC,CAACC;~~QAClD~~,GACA,~~kBACAK~~;kBAGJ,cAAA,~~KAACR~~;~~YACGM~~,~~KAAKT,cAAc0B,SAASjB~~;~~YAC5BJ~~,MAAMA;YACNC,YAAYA;YACZC,OAAOA~~;YACPC,gBAAgBA~~;;;~~AAIhC~~,EAAE"}
1	+ {"version":3,"sources":["../../../src/components/titan-layout/layout-header-links-internal.tsx"],"sourcesContent":["import { Icon, IconProps } from '@servicetitan/anvil2';\nimport classNames from 'classnames';\nimport { FC, Fragment } from 'react';\nimport { CounterTagData } from '../../utils/counter-tag';\nimport { CounterTag, CounterTagProps } from '../counter-tag';\nimport { NavigationComponentProps } from './interface-internal';\nimport * as Styles from './layout-header.module.less';\n\n/** Content for navigation items /\nconst InternalHeaderNavigationItemContent: FC<{\n tag?: CounterTagProps;\n counterClassName?: string;\n icon: IconProps['svg'] \| undefined;\n iconActive?: IconProps['svg'];\n title?: string;\n}> = ({ counterClassName, icon, iconActive, title, tag }) => {\n return (\n <Fragment>\n {!!icon && <Icon svg={icon} className={Styles.navigationIcon} />}\n {!!iconActive && (\n <Icon\n svg={iconActive}\n className={classNames(Styles.navigationIcon, Styles.navigationIconActive)}\n />\n )}\n\n {!!title && (\n <span className={Styles.navigationItemLabel} data-cy=\"nav-item-label\">\n {title}\n </span>\n )}\n\n {!!tag && (\n <CounterTag\n data={tag}\n className={classNames(Styles.navigationItemCounter, counterClassName)}\n longClassName={Styles.navigationItemCounterLong}\n />\n )}\n </Fragment>\n );\n};\n\n/* Navigation extra item with link /\nexport const InternalLayoutHeaderNavigationLink: FC<\n NavigationComponentProps & {\n id: string;\n to: string;\n title: string \| undefined;\n isActive: boolean \| ((pathname: string) => boolean) \| undefined;\n icon: IconProps['svg'] \| undefined;\n iconActive: IconProps['svg'] \| undefined;\n tag: CounterTagData \| undefined;\n className: string \| undefined;\n\n isOverflow?: boolean;\n flashing?: boolean;\n }\n> = ({\n id,\n to,\n title,\n isActive,\n icon,\n iconActive,\n tag,\n className,\n isOverflow,\n flashing,\n navigationComponent: NavigationComponent,\n ...rest\n}) => {\n return (\n <NavigationComponent\n data-cy={`navigation-item-${id}`}\n data-pendo={`navigation-item-${id}`}\n {...rest}\n key={id}\n to={to}\n className={classNames(\n isOverflow ? Styles.navigationLinkOverflow : Styles.navigationLink,\n className,\n {\n [Styles.navigationItemActive]: isActive === true,\n [Styles.navigationItemIconState]: !!icon && !!iconActive,\n [Styles.navigationItemFlashing]: flashing,\n }\n )}\n isActive={typeof isActive === 'function' ? isActive : undefined}\n activeClassName={Styles.navigationItemActive}\n >\n <InternalHeaderNavigationItemContent\n tag={tag}\n icon={icon}\n iconActive={iconActive}\n title={title}\n />\n </NavigationComponent>\n );\n};\n\n/* Navigation extra item with icon button */\nexport const InternalLayoutHeaderNavigationTrigger: FC<{\n id: string;\n title: string \| undefined;\n isActive: boolean \| undefined;\n icon: IconProps['svg'] \| undefined;\n iconActive: IconProps['svg'] \| undefined;\n tag: CounterTagData \| undefined;\n className: string \| undefined;\n\n flashing?: boolean;\n}> = ({ id, className, flashing, icon, iconActive, isActive, tag, title, ...rest }) => {\n return (\n <div\n data-cy={`navigation-trigger-${id}`}\n data-pendo={`navigation-trigger-${id}`}\n {...rest}\n className={classNames(\n Styles.navigationLink,\n {\n [Styles.navigationItemActive]: isActive === true,\n [Styles.navigationItemIconState]: !!icon && !!iconActive,\n [Styles.navigationItemFlashing]: flashing,\n },\n 'cursor-pointer',\n className\n )}\n >\n <InternalHeaderNavigationItemContent\n tag={tag}\n icon={icon}\n iconActive={iconActive}\n title={title}\n />\n </div>\n );\n};\n"],"names":["Icon","classNames","Fragment","CounterTag","Styles","InternalHeaderNavigationItemContent","counterClassName","icon","iconActive","title","tag","svg","className","navigationIcon","navigationIconActive","span","navigationItemLabel","data-cy","data","navigationItemCounter","longClassName","navigationItemCounterLong","InternalLayoutHeaderNavigationLink","id","to","isActive","isOverflow","flashing","navigationComponent","NavigationComponent","rest","data-pendo","key","navigationLinkOverflow","navigationLink","navigationItemActive","navigationItemIconState","navigationItemFlashing","undefined","activeClassName","InternalLayoutHeaderNavigationTrigger","div"],"mappings":";;AAAA,SAASA,IAAI,QAAmB,uBAAuB;AACvD,OAAOC,gBAAgB,aAAa;AACpC,SAAaC,QAAQ,QAAQ,QAAQ;AAErC,SAASC,UAAU,QAAyB,iBAAiB;AAE7D,YAAYC,YAAY,8BAA8B;AAEtD,iCAAiC,GACjC,MAAMC,sCAMD,CAAC,EAAEC,gBAAgB,EAAEC,IAAI,EAAEC,UAAU,EAAEC,KAAK,EAAEC,GAAG,EAAE;IACpD,qBACI,MAACR;;YACI,CAAC,CAACK,sBAAQ,KAACP;gBAAKW,KAAKJ;gBAAMK,WAAWR,OAAOS,cAAc;;YAC3D,CAAC,CAACL,4BACC,KAACR;gBACGW,KAAKH;gBACLI,WAAWX,WAAWG,OAAOS,cAAc,EAAET,OAAOU,oBAAoB;;YAI/E,CAAC,CAACL,uBACC,KAACM;gBAAKH,WAAWR,OAAOY,mBAAmB;gBAAEC,WAAQ;0BAChDR;;YAIR,CAAC,CAACC,qBACC,KAACP;gBACGe,MAAMR;gBACNE,WAAWX,WAAWG,OAAOe,qBAAqB,EAAEb;gBACpDc,eAAehB,OAAOiB,yBAAyB;;;;AAKnE;AAEA,oCAAoC,GACpC,OAAO,MAAMC,qCAcT,CAAC,EACDC,EAAE,EACFC,EAAE,EACFf,KAAK,EACLgB,QAAQ,EACRlB,IAAI,EACJC,UAAU,EACVE,GAAG,EACHE,SAAS,EACTc,UAAU,EACVC,QAAQ,EACRC,qBAAqBC,mBAAmB,EACxC,GAAGC,MACN;IACG,qBACI,eAACD;QACGZ,WAAS,CAAC,gBAAgB,EAAEM,IAAI;QAChCQ,cAAY,CAAC,gBAAgB,EAAER,IAAI;QAClC,GAAGO,IAAI;QACRE,KAAKT;QACLC,IAAIA;QACJZ,WAAWX,WACPyB,aAAatB,OAAO6B,sBAAsB,GAAG7B,OAAO8B,cAAc,EAClEtB,WACA;YACI,CAACR,OAAO+B,oBAAoB,CAAC,EAAEV,aAAa;YAC5C,CAACrB,OAAOgC,uBAAuB,CAAC,EAAE,CAAC,CAAC7B,QAAQ,CAAC,CAACC;YAC9C,CAACJ,OAAOiC,sBAAsB,CAAC,EAAEV;QACrC;QAEJF,UAAU,OAAOA,aAAa,aAAaA,WAAWa;QACtDC,iBAAiBnC,OAAO+B,oBAAoB;qBAE5C,KAAC9B;QACGK,KAAKA;QACLH,MAAMA;QACNC,YAAYA;QACZC,OAAOA;;AAIvB,EAAE;AAEF,2CAA2C,GAC3C,OAAO,MAAM+B,wCAUR,CAAC,EAAEjB,EAAE,EAAEX,SAAS,EAAEe,QAAQ,EAAEpB,IAAI,EAAEC,UAAU,EAAEiB,QAAQ,EAAEf,GAAG,EAAED,KAAK,EAAE,GAAGqB,MAAM;IAC9E,qBACI,KAACW;QACGxB,WAAS,CAAC,mBAAmB,EAAEM,IAAI;QACnCQ,cAAY,CAAC,mBAAmB,EAAER,IAAI;QACrC,GAAGO,IAAI;QACRlB,WAAWX,WACPG,OAAO8B,cAAc,EACrB;YACI,CAAC9B,OAAO+B,oBAAoB,CAAC,EAAEV,aAAa;YAC5C,CAACrB,OAAOgC,uBAAuB,CAAC,EAAE,CAAC,CAAC7B,QAAQ,CAAC,CAACC;YAC9C,CAACJ,OAAOiC,sBAAsB,CAAC,EAAEV;QACrC,GACA,kBACAf;kBAGJ,cAAA,KAACP;YACGK,KAAKA;YACLH,MAAMA;YACNC,YAAYA;YACZC,OAAOA;;;AAIvB,EAAE"}

package/dist/components/titan-layout/layout-header-links.d.ts CHANGED Viewed

@@ -1,7 +1,6 @@
-import { FC } from 'react';
 import { TitanLayoutLinkProps, TitanLayoutTriggerProps } from './interface';
 /** Navigation extra item with link */
-export declare const LayoutHeaderNavigationLink: FC<TitanLayoutLinkProps>;
+export declare function LayoutHeaderNavigationLink({ id, to, title, isActive, icon, iconActive, counter, tag, className, tooltip, extra, side, wrapper, ...rest }: TitanLayoutLinkProps): import("react/jsx-runtime").JSX.Element;
 /** Navigation extra item with icon button */
-export declare const LayoutHeaderNavigationTrigger: FC<TitanLayoutTriggerProps>;
+export declare function LayoutHeaderNavigationTrigger({ id, title, isActive, icon, iconActive, counter, tag, className, tooltip, extra, side, wrapper, ...rest }: TitanLayoutTriggerProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=layout-header-links.d.ts.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"layout-header-links.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-header-links.tsx"],"names":[],"mappings":"~~AAAA~~,OAAO,EAAE,EAAE,EAAE,MAAM,~~OAAO~~,CAAC;~~AAC3B~~,~~OAAO~~,~~EAAE~~,~~oBAAoB~~,EAAE,~~uBAAuB~~,EAAE,~~MAAM~~,~~aAAa~~,~~CAAC;AAQ5E~~,~~sCAAsC;AACtC~~,~~eAAO~~,~~MAAM~~,~~0BAA0B~~,~~EAAE~~,EAAE,~~CAAC,~~oBAAoB,~~CAO/D,CAAC~~;~~AAEF~~,6CAA6C;AAC7C,~~eAAO~~,~~MAAM,~~6BAA6B,EAAE,EAAE,~~CAAC,~~uBAAuB,~~CAKrE,CAAC~~"}
1	+ {"version":3,"file":"layout-header-links.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-header-links.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAC;AAQ5E,sCAAsC;AACtC,wBAAgB,0BAA0B,CAAC,EACvC,EAAE,EACF,EAAE,EACF,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,UAAU,EACV,OAAO,EACP,GAAG,EACH,SAAS,EAET,OAAO,EACP,KAAK,EACL,IAAI,EACJ,OAAO,EACP,GAAG,IAAI,EACV,EAAE,oBAAoB,2CAoBtB;AAED,6CAA6C;AAC7C,wBAAgB,6BAA6B,CAAC,EAC1C,EAAE,EACF,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,UAAU,EACV,OAAO,EACP,GAAG,EACH,SAAS,EAET,OAAO,EACP,KAAK,EACL,IAAI,EACJ,OAAO,EACP,GAAG,IAAI,EACV,EAAE,uBAAuB,2CAiBzB"}

package/dist/components/titan-layout/layout-header-links.js CHANGED Viewed

@@ -1,18 +1,38 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+import { getCounterTag } from '../../utils/side-nav';
 import { useTitanLayoutContext } from './layout-context';
 import { InternalLayoutHeaderNavigationLink, InternalLayoutHeaderNavigationTrigger } from './layout-header-links-internal';
 import { withTooltip } from './with-tooltip';
-/** Navigation extra item with link */ export const LayoutHeaderNavigationLink = ({ tooltip, ...rest })=>{
+/** Navigation extra item with link */ export function LayoutHeaderNavigationLink({ id, to, title, isActive, icon, iconActive, counter, tag, className, tooltip, extra, side, wrapper, ...rest }) {
     const { NavigationComponent } = useTitanLayoutContext();
+    const { showTitle, flashing } = extra !== null && extra !== void 0 ? extra : {};
     return withTooltip(/*#__PURE__*/ _jsx(InternalLayoutHeaderNavigationLink, {
+        id: id,
+        to: to,
+        title: showTitle ? title : undefined,
+        isActive: isActive,
+        icon: icon,
+        iconActive: iconActive,
+        tag: getCounterTag(counter, tag),
+        className: className,
         ...rest,
+        flashing: flashing,
         navigationComponent: NavigationComponent
     }), tooltip);
-};
-/** Navigation extra item with icon button */ export const LayoutHeaderNavigationTrigger = ({ tooltip, ...rest })=>{
+}
+/** Navigation extra item with icon button */ export function LayoutHeaderNavigationTrigger({ id, title, isActive, icon, iconActive, counter, tag, className, tooltip, extra, side, wrapper, ...rest }) {
+    const { showTitle, flashing } = extra !== null && extra !== void 0 ? extra : {};
     return withTooltip(/*#__PURE__*/ _jsx(InternalLayoutHeaderNavigationTrigger, {
-        ...rest
+        id: id,
+        title: showTitle ? title : undefined,
+        isActive: isActive,
+        icon: icon,
+        iconActive: iconActive,
+        tag: getCounterTag(counter, tag),
+        className: className,
+        ...rest,
+        flashing: flashing
     }), tooltip);
-};
+}
 //# sourceMappingURL=layout-header-links.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/titan-layout/layout-header-links.tsx"],"sourcesContent":["import { FC } from '~~react~~';\nimport { TitanLayoutLinkProps, TitanLayoutTriggerProps } from './interface';\nimport { useTitanLayoutContext } from './layout-context';\nimport {\n InternalLayoutHeaderNavigationLink,\n InternalLayoutHeaderNavigationTrigger,\n} from './layout-header-links-internal';\nimport { withTooltip } from './with-tooltip';\n\n/** Navigation extra item with link /\nexport ~~const~~ LayoutHeaderNavigationLink~~: FC<TitanLayoutLinkProps> =~~ ({ tooltip, ...rest }) => {\n const { NavigationComponent } = useTitanLayoutContext();\n\n return withTooltip(\n <InternalLayoutHeaderNavigationLink {...rest} navigationComponent={NavigationComponent} />,\n tooltip\n );\n};\n\n/* Navigation extra item with icon button */\nexport ~~const~~ LayoutHeaderNavigationTrigger~~: FC<TitanLayoutTriggerProps> =~~ ({\n tooltip,\n ...rest\n}) => {\n return withTooltip(<InternalLayoutHeaderNavigationTrigger {...rest} ~~/>,~~ tooltip);\n};\n"],"names":["useTitanLayoutContext","InternalLayoutHeaderNavigationLink","InternalLayoutHeaderNavigationTrigger","withTooltip","LayoutHeaderNavigationLink","tooltip","rest","NavigationComponent","navigationComponent","LayoutHeaderNavigationTrigger"],"mappings":";~~AAEA~~,SAASA,qBAAqB,QAAQ,mBAAmB;AACzD,SACIC,kCAAkC,EAClCC,qCAAqC,QAClC,iCAAiC;AACxC,SAASC,WAAW,QAAQ,iBAAiB;AAE7C,oCAAoC,GACpC,OAAO,~~MAAMC~~,~~6BAAuD~~,~~CAAC~~,~~EAAEC~~,~~OAAO~~,EAAE,GAAGC,~~MAAM~~;~~IACrF~~,MAAM,EAAEC,mBAAmB,EAAE,~~GAAGP~~;~~IAEhC~~,~~OAAOG~~,0BACH,KAACF;~~QAAoC~~,GAAGK,IAAI;~~QAAEE~~,~~qBAAqBD~~;~~QACnEF~~;AAER~~,EAAE~~;~~AAEF~~,2CAA2C,GAC3C,OAAO,~~MAAMI~~,~~gCAA6D~~,~~CAAC~~,~~EACvEJ~~,OAAO,EACP,GAAGC,~~MACN~~;~~IACG~~,~~OAAOH~~,~~0BAAY~~,KAACD;~~QAAuC~~,~~GAAGI~~,IAAI;~~QAAMD~~;~~AAC5E,EAAE~~"}
1	+ {"version":3,"sources":["../../../src/components/titan-layout/layout-header-links.tsx"],"sourcesContent":["import { getCounterTag } from '../../utils/side-nav';\nimport { TitanLayoutLinkProps, TitanLayoutTriggerProps } from './interface';\nimport { useTitanLayoutContext } from './layout-context';\nimport {\n InternalLayoutHeaderNavigationLink,\n InternalLayoutHeaderNavigationTrigger,\n} from './layout-header-links-internal';\nimport { withTooltip } from './with-tooltip';\n\n/** Navigation extra item with link /\nexport function LayoutHeaderNavigationLink({\n id,\n to,\n title,\n isActive,\n icon,\n iconActive,\n counter,\n tag,\n className,\n\n tooltip,\n extra,\n side,\n wrapper,\n ...rest\n}: TitanLayoutLinkProps) {\n const { NavigationComponent } = useTitanLayoutContext();\n const { showTitle, flashing } = extra ?? {};\n\n return withTooltip(\n <InternalLayoutHeaderNavigationLink\n id={id}\n to={to}\n title={showTitle ? title : undefined}\n isActive={isActive}\n icon={icon}\n iconActive={iconActive}\n tag={getCounterTag(counter, tag)}\n className={className}\n {...rest}\n flashing={flashing}\n navigationComponent={NavigationComponent}\n />,\n tooltip\n );\n}\n\n/* Navigation extra item with icon button */\nexport function LayoutHeaderNavigationTrigger({\n id,\n title,\n isActive,\n icon,\n iconActive,\n counter,\n tag,\n className,\n\n tooltip,\n extra,\n side,\n wrapper,\n ...rest\n}: TitanLayoutTriggerProps) {\n const { showTitle, flashing } = extra ?? {};\n\n return withTooltip(\n <InternalLayoutHeaderNavigationTrigger\n id={id}\n title={showTitle ? title : undefined}\n isActive={isActive}\n icon={icon}\n iconActive={iconActive}\n tag={getCounterTag(counter, tag)}\n className={className}\n {...rest}\n flashing={flashing}\n />,\n tooltip\n );\n}\n"],"names":["getCounterTag","useTitanLayoutContext","InternalLayoutHeaderNavigationLink","InternalLayoutHeaderNavigationTrigger","withTooltip","LayoutHeaderNavigationLink","id","to","title","isActive","icon","iconActive","counter","tag","className","tooltip","extra","side","wrapper","rest","NavigationComponent","showTitle","flashing","undefined","navigationComponent","LayoutHeaderNavigationTrigger"],"mappings":";AAAA,SAASA,aAAa,QAAQ,uBAAuB;AAErD,SAASC,qBAAqB,QAAQ,mBAAmB;AACzD,SACIC,kCAAkC,EAClCC,qCAAqC,QAClC,iCAAiC;AACxC,SAASC,WAAW,QAAQ,iBAAiB;AAE7C,oCAAoC,GACpC,OAAO,SAASC,2BAA2B,EACvCC,EAAE,EACFC,EAAE,EACFC,KAAK,EACLC,QAAQ,EACRC,IAAI,EACJC,UAAU,EACVC,OAAO,EACPC,GAAG,EACHC,SAAS,EAETC,OAAO,EACPC,KAAK,EACLC,IAAI,EACJC,OAAO,EACP,GAAGC,MACgB;IACnB,MAAM,EAAEC,mBAAmB,EAAE,GAAGnB;IAChC,MAAM,EAAEoB,SAAS,EAAEC,QAAQ,EAAE,GAAGN,kBAAAA,mBAAAA,QAAS,CAAC;IAE1C,OAAOZ,0BACH,KAACF;QACGI,IAAIA;QACJC,IAAIA;QACJC,OAAOa,YAAYb,QAAQe;QAC3Bd,UAAUA;QACVC,MAAMA;QACNC,YAAYA;QACZE,KAAKb,cAAcY,SAASC;QAC5BC,WAAWA;QACV,GAAGK,IAAI;QACRG,UAAUA;QACVE,qBAAqBJ;QAEzBL;AAER;AAEA,2CAA2C,GAC3C,OAAO,SAASU,8BAA8B,EAC1CnB,EAAE,EACFE,KAAK,EACLC,QAAQ,EACRC,IAAI,EACJC,UAAU,EACVC,OAAO,EACPC,GAAG,EACHC,SAAS,EAETC,OAAO,EACPC,KAAK,EACLC,IAAI,EACJC,OAAO,EACP,GAAGC,MACmB;IACtB,MAAM,EAAEE,SAAS,EAAEC,QAAQ,EAAE,GAAGN,kBAAAA,mBAAAA,QAAS,CAAC;IAE1C,OAAOZ,0BACH,KAACD;QACGG,IAAIA;QACJE,OAAOa,YAAYb,QAAQe;QAC3Bd,UAAUA;QACVC,MAAMA;QACNC,YAAYA;QACZE,KAAKb,cAAcY,SAASC;QAC5BC,WAAWA;QACV,GAAGK,IAAI;QACRG,UAAUA;QAEdP;AAER"}

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

@@ -12,6 +12,8 @@ export type LayoutHeaderProps = Omit<ComponentPropsWithoutRef<'div'>, 'children'
     isMobile: boolean;
     variant: 'light' | 'dark';
     hasNotifications: boolean;
+    hasBurger: boolean;
+    burgerTooltip?: string;
     onBurgerClick?: (e: MouseEvent<never>) => void;
 };
 export declare const LayoutHeader: FC<LayoutHeaderProps>;

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

	@@ -1 +1 @@
1	- {"version":3,"file":"layout-header.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-header.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,wBAAwB,EAAE,EAAE,EAAE,UAAU,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAI1F,OAAO,EAAc,oBAAoB,EAAgB,MAAM,eAAe,CAAC;~~AAE~~/E,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IAChF,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,IAAI,CAAC,EAAE,oBAAoB,CAAC;IAC5B,OAAO,CAAC,EAAE,YAAY,CAAC;IAEvB,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,GAAG,MAAM,CAAC;IAC1B,gBAAgB,EAAE,OAAO,CAAC;IAC1B,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC;CAClD,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,~~CAsE9C~~,CAAC"}
1	+ {"version":3,"file":"layout-header.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-header.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,wBAAwB,EAAE,EAAE,EAAE,UAAU,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAI1F,OAAO,EAAc,oBAAoB,EAAgB,MAAM,eAAe,CAAC;AAG/E,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IAChF,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,IAAI,CAAC,EAAE,oBAAoB,CAAC;IAC5B,OAAO,CAAC,EAAE,YAAY,CAAC;IAEvB,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,GAAG,MAAM,CAAC;IAC1B,gBAAgB,EAAE,OAAO,CAAC;IAC1B,SAAS,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC;CAClD,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAgF9C,CAAC"}

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

@@ -5,7 +5,21 @@ import { LayoutPlacementContext } from './layout-context';
 import { LayoutHeaderNavigationTrigger } from './layout-header-links';
 import * as Styles from './layout-header.module.less';
 import { LayoutLogo, isLogoCustom } from './layout-logo';
-export const LayoutHeader = ({ className, right, rightText, rightClassName, center, centerClassName, isMobile, hasNotifications, logo, profile, variant, onBurgerClick, ...rest })=>{
+import { withTooltip } from './with-tooltip';
+export const LayoutHeader = ({ className, right, rightText, rightClassName, center, centerClassName, isMobile, hasNotifications, logo, profile, variant, hasBurger, burgerTooltip, onBurgerClick, ...rest })=>{
+    const burgerElement = hasBurger && /*#__PURE__*/ _jsx("div", {
+        className: Styles.burger,
+        children: /*#__PURE__*/ _jsx(LayoutHeaderNavigationTrigger, {
+            id: "burger",
+            title: "",
+            icon: SvgBurgerMenu,
+            iconActive: undefined,
+            onClick: onBurgerClick,
+            tag: {
+                value: hasNotifications
+            }
+        })
+    });
     return /*#__PURE__*/ _jsx(LayoutPlacementContext.Provider, {
         value: "top",
         children: /*#__PURE__*/ _jsxs("div", {
@@ -13,21 +27,16 @@ export const LayoutHeader = ({ className, right, rightText, rightClassName, cent
             "data-cy": "header-navigation",
             ...rest,
             children: [
-                isMobile && /*#__PURE__*/ _jsx("div", {
-                    className: Styles.burger,
-                    children: /*#__PURE__*/ _jsx(LayoutHeaderNavigationTrigger, {
-                        id: "burger",
-                        title: "",
-                        icon: SvgBurgerMenu,
-                        iconActive: undefined,
-                        onClick: onBurgerClick,
-                        tag: {
-                            value: hasNotifications
-                        }
-                    })
-                }),
-                /*#__PURE__*/ _jsx(LayoutLogo, {
-                    ...logo
+                /*#__PURE__*/ _jsxs("div", {
+                    className: Styles.heTopLeft,
+                    children: [
+                        burgerElement && (burgerTooltip ? withTooltip(burgerElement, burgerTooltip, {
+                            placement: 'bottom-end'
+                        }) : burgerElement),
+                        /*#__PURE__*/ _jsx(LayoutLogo, {
+                            ...logo
+                        })
+                    ]
                 }),
                 /*#__PURE__*/ _jsx("div", {
                     className: classNames(Styles.heTopCenter, 'd-f align-items-center justify-content-center', centerClassName),

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/titan-layout/layout-header.tsx"],"sourcesContent":["import SvgBurgerMenu from '@servicetitan/anvil2/assets/icons/material/round/menu.svg';\nimport classNames from 'classnames';\nimport { ComponentPropsWithoutRef, FC, MouseEvent, ReactElement, ReactNode } from 'react';\nimport { LayoutPlacementContext } from './layout-context';\nimport { LayoutHeaderNavigationTrigger } from './layout-header-links';\nimport * as Styles from './layout-header.module.less';\nimport { LayoutLogo, TitanLayoutLogoProps, isLogoCustom } from './layout-logo';\n\nexport type LayoutHeaderProps = Omit<ComponentPropsWithoutRef<'div'>, 'children'> & {\n right?: ReactNode;\n rightText?: string;\n rightClassName?: string;\n\n id?: string;\n\n center?: ReactElement;\n centerClassName?: string;\n\n logo?: TitanLayoutLogoProps;\n profile?: ReactElement;\n\n isMobile: boolean;\n variant: 'light' \| 'dark';\n hasNotifications: boolean;\n onBurgerClick?: (e: MouseEvent<never>) => void;\n};\n\nexport const LayoutHeader: FC<LayoutHeaderProps> = ({\n className,\n right,\n rightText,\n rightClassName,\n center,\n centerClassName,\n isMobile,\n hasNotifications,\n logo,\n profile,\n variant,\n onBurgerClick,\n ...rest\n}) => {\n return (\n <LayoutPlacementContext.Provider value=\"top\">\n <div\n className={classNames(\n Styles.header,\n variant === 'light' ? Styles.headerLight : Styles.headerDark,\n isMobile ? Styles.headerMobile : Styles.headerDesktop,\n isLogoCustom(logo, isMobile) && Styles.headerLogoCustom,\n className\n )}\n data-cy=\"header-navigation\"\n {...rest}\n >\n ~~{isMobile && (\n~~ <div className={Styles.~~burger~~}>\n ~~<LayoutHeaderNavigationTrigger\n id=\"burger\"\n title=\"\"\n icon=~~{~~SvgBurgerMenu}\~~n ~~iconActive={undefined}~~\n ~~onClick=~~{~~onBurgerClick}\n tag={{~~ ~~value~~: ~~hasNotifications~~ }}\n ~~/>\n </div>\n~~ )}\n <LayoutLogo {...logo} />\n <div\n className={classNames(\n Styles.heTopCenter,\n 'd-f align-items-center justify-content-center',\n centerClassName\n )}\n data-cy=\"navigation-center\"\n >\n {center}\n </div>\n <div\n className={classNames(\n 'd-f flex-row justify-content-end align-items-center',\n Styles.heTopRight,\n rightClassName\n )}\n data-cy=\"navigation-right\"\n >\n {!!rightText && (\n <div className={Styles.heTopRightText} data-cy=\"navigation-right-text\">\n {rightText}\n </div>\n )}\n {right}\n {profile}\n </div>\n </div>\n </LayoutPlacementContext.Provider>\n );\n};\n"],"names":["SvgBurgerMenu","classNames","LayoutPlacementContext","LayoutHeaderNavigationTrigger","Styles","LayoutLogo","isLogoCustom","LayoutHeader","className","right","rightText","rightClassName","center","centerClassName","isMobile","hasNotifications","logo","profile","variant","onBurgerClick","rest","~~Provider~~","~~value~~","~~div~~","~~header~~","~~headerLight~~","~~headerDark~~","~~headerMobile~~","~~headerDesktop~~","~~headerLogoCustom~~","~~data-cy~~","~~burger~~","id","~~title~~","~~icon~~","~~iconActive~~","~~undefined~~","~~onClick~~","~~tag~~","heTopCenter","heTopRight","heTopRightText"],"mappings":";AAAA,OAAOA,mBAAmB,4DAA4D;AACtF,OAAOC,gBAAgB,aAAa;AAEpC,SAASC,sBAAsB,QAAQ,mBAAmB;AAC1D,SAASC,6BAA6B,QAAQ,wBAAwB;AACtE,YAAYC,YAAY,8BAA8B;AACtD,SAASC,UAAU,EAAwBC,YAAY,QAAQ,gBAAgB;~~AAqB~~/E,OAAO,MAAMC,eAAsC,CAAC,EAChDC,SAAS,EACTC,KAAK,EACLC,SAAS,EACTC,cAAc,EACdC,MAAM,EACNC,eAAe,EACfC,QAAQ,EACRC,gBAAgB,EAChBC,IAAI,EACJC,OAAO,EACPC,OAAO,EACPC,aAAa,EACb,GAAGC,MACN;IACG,qBACI,~~KAAClB~~,~~uBAAuBmB~~,QAAQ;~~QAACC~~,OAAM;kBACnC,cAAA,~~MAACC~~;~~YACGf~~,~~WAAWP~~,WACPG,~~OAAOoB~~,MAAM,~~EACbN~~,YAAY,~~UAAUd~~,~~OAAOqB~~,WAAW,~~GAAGrB~~,~~OAAOsB~~,UAAU,~~EAC5DZ~~,~~WAAWV~~,~~OAAOuB~~,YAAY,~~GAAGvB~~,~~OAAOwB~~,aAAa,~~EACrDtB~~,~~aAAaU~~,MAAMF,~~aAAaV~~,~~OAAOyB~~,gBAAgB,~~EACvDrB~~;~~YAEJsB~~,WAAQ;YACP,~~GAAGV~~,IAAI;;~~gBAEPN~~,~~0BACG,KAACS~~;~~oBAAIf~~,~~WAAWJ~~,~~OAAO2B~~,~~MAAM;8BACzB~~,~~cAAA~~,~~KAAC5B;wBACG6B~~,~~IAAG;wBACHC~~,~~OAAM;wBACNC~~,~~MAAMlC;wBACNmC~~,~~YAAYC~~;~~wBACZC~~,~~SAASlB~~;~~wBACTmB~~,~~KAAK;4BAAEhB~~,~~OAAOP~~;~~wBAAiB;;;8BAI3C~~,~~KAACV~~;~~oBAAY~~,~~GAAGW~~,IAAI~~;;8BACpB~~,~~KAACO~~;~~oBACGf~~,~~WAAWP~~,WACPG,~~OAAOmC~~,WAAW,EAClB,~~iDACA1B~~;~~oBAEJiB~~,WAAQ;~~8BAEPlB~~;;8BAEL,~~MAACW~~;~~oBACGf~~,~~WAAWP~~,WACP,uDACAG,~~OAAOoC~~,UAAU,~~EACjB7B~~;~~oBAEJmB~~,WAAQ;;wBAEP,CAAC,~~CAACpB~~,2BACC,~~KAACa~~;~~4BAAIf~~,~~WAAWJ~~,~~OAAOqC~~,cAAc;~~4BAAEX~~,WAAQ;~~sCAC1CpB~~;;wBAGRD;wBACAQ;;;;;;AAKrB,EAAE"}
1	+ {"version":3,"sources":["../../../src/components/titan-layout/layout-header.tsx"],"sourcesContent":["import SvgBurgerMenu from '@servicetitan/anvil2/assets/icons/material/round/menu.svg';\nimport classNames from 'classnames';\nimport { ComponentPropsWithoutRef, FC, MouseEvent, ReactElement, ReactNode } from 'react';\nimport { LayoutPlacementContext } from './layout-context';\nimport { LayoutHeaderNavigationTrigger } from './layout-header-links';\nimport * as Styles from './layout-header.module.less';\nimport { LayoutLogo, TitanLayoutLogoProps, isLogoCustom } from './layout-logo';\nimport { withTooltip } from './with-tooltip';\n\nexport type LayoutHeaderProps = Omit<ComponentPropsWithoutRef<'div'>, 'children'> & {\n right?: ReactNode;\n rightText?: string;\n rightClassName?: string;\n\n id?: string;\n\n center?: ReactElement;\n centerClassName?: string;\n\n logo?: TitanLayoutLogoProps;\n profile?: ReactElement;\n\n isMobile: boolean;\n variant: 'light' \| 'dark';\n hasNotifications: boolean;\n hasBurger: boolean;\n burgerTooltip?: string;\n onBurgerClick?: (e: MouseEvent<never>) => void;\n};\n\nexport const LayoutHeader: FC<LayoutHeaderProps> = ({\n className,\n right,\n rightText,\n rightClassName,\n center,\n centerClassName,\n isMobile,\n hasNotifications,\n logo,\n profile,\n variant,\n hasBurger,\n burgerTooltip,\n onBurgerClick,\n ...rest\n}) => {\n const burgerElement = hasBurger && (\n <div className={Styles.burger}>\n <LayoutHeaderNavigationTrigger\n id=\"burger\"\n title=\"\"\n icon={SvgBurgerMenu}\n iconActive={undefined}\n onClick={onBurgerClick}\n tag={{ value: hasNotifications }}\n />\n </div>\n );\n\n return (\n <LayoutPlacementContext.Provider value=\"top\">\n <div\n className={classNames(\n Styles.header,\n variant === 'light' ? Styles.headerLight : Styles.headerDark,\n isMobile ? Styles.headerMobile : Styles.headerDesktop,\n isLogoCustom(logo, isMobile) && Styles.headerLogoCustom,\n className\n )}\n data-cy=\"header-navigation\"\n {...rest}\n >\n <div className={Styles.heTopLeft}>\n {burgerElement &&\n (burgerTooltip\n ? withTooltip(burgerElement, burgerTooltip, { placement: 'bottom-end' })\n : burgerElement)}\n <LayoutLogo {...logo} />\n </div>\n\n <div\n className={classNames(\n Styles.heTopCenter,\n 'd-f align-items-center justify-content-center',\n centerClassName\n )}\n data-cy=\"navigation-center\"\n >\n {center}\n </div>\n <div\n className={classNames(\n 'd-f flex-row justify-content-end align-items-center',\n Styles.heTopRight,\n rightClassName\n )}\n data-cy=\"navigation-right\"\n >\n {!!rightText && (\n <div className={Styles.heTopRightText} data-cy=\"navigation-right-text\">\n {rightText}\n </div>\n )}\n {right}\n {profile}\n </div>\n </div>\n </LayoutPlacementContext.Provider>\n );\n};\n"],"names":["SvgBurgerMenu","classNames","LayoutPlacementContext","LayoutHeaderNavigationTrigger","Styles","LayoutLogo","isLogoCustom","withTooltip","LayoutHeader","className","right","rightText","rightClassName","center","centerClassName","isMobile","hasNotifications","logo","profile","variant","hasBurger","burgerTooltip","onBurgerClick","rest","burgerElement","div","burger","id","title","icon","iconActive","undefined","onClick","tag","value","Provider","header","headerLight","headerDark","headerMobile","headerDesktop","headerLogoCustom","data-cy","heTopLeft","placement","heTopCenter","heTopRight","heTopRightText"],"mappings":";AAAA,OAAOA,mBAAmB,4DAA4D;AACtF,OAAOC,gBAAgB,aAAa;AAEpC,SAASC,sBAAsB,QAAQ,mBAAmB;AAC1D,SAASC,6BAA6B,QAAQ,wBAAwB;AACtE,YAAYC,YAAY,8BAA8B;AACtD,SAASC,UAAU,EAAwBC,YAAY,QAAQ,gBAAgB;AAC/E,SAASC,WAAW,QAAQ,iBAAiB;AAuB7C,OAAO,MAAMC,eAAsC,CAAC,EAChDC,SAAS,EACTC,KAAK,EACLC,SAAS,EACTC,cAAc,EACdC,MAAM,EACNC,eAAe,EACfC,QAAQ,EACRC,gBAAgB,EAChBC,IAAI,EACJC,OAAO,EACPC,OAAO,EACPC,SAAS,EACTC,aAAa,EACbC,aAAa,EACb,GAAGC,MACN;IACG,MAAMC,gBAAgBJ,2BAClB,KAACK;QAAIhB,WAAWL,OAAOsB,MAAM;kBACzB,cAAA,KAACvB;YACGwB,IAAG;YACHC,OAAM;YACNC,MAAM7B;YACN8B,YAAYC;YACZC,SAASV;YACTW,KAAK;gBAAEC,OAAOlB;YAAiB;;;IAK3C,qBACI,KAACd,uBAAuBiC,QAAQ;QAACD,OAAM;kBACnC,cAAA,MAACT;YACGhB,WAAWR,WACPG,OAAOgC,MAAM,EACbjB,YAAY,UAAUf,OAAOiC,WAAW,GAAGjC,OAAOkC,UAAU,EAC5DvB,WAAWX,OAAOmC,YAAY,GAAGnC,OAAOoC,aAAa,EACrDlC,aAAaW,MAAMF,aAAaX,OAAOqC,gBAAgB,EACvDhC;YAEJiC,WAAQ;YACP,GAAGnB,IAAI;;8BAER,MAACE;oBAAIhB,WAAWL,OAAOuC,SAAS;;wBAC3BnB,iBACIH,CAAAA,gBACKd,YAAYiB,eAAeH,eAAe;4BAAEuB,WAAW;wBAAa,KACpEpB,aAAY;sCACtB,KAACnB;4BAAY,GAAGY,IAAI;;;;8BAGxB,KAACQ;oBACGhB,WAAWR,WACPG,OAAOyC,WAAW,EAClB,iDACA/B;oBAEJ4B,WAAQ;8BAEP7B;;8BAEL,MAACY;oBACGhB,WAAWR,WACP,uDACAG,OAAO0C,UAAU,EACjBlC;oBAEJ8B,WAAQ;;wBAEP,CAAC,CAAC/B,2BACC,KAACc;4BAAIhB,WAAWL,OAAO2C,cAAc;4BAAEL,WAAQ;sCAC1C/B;;wBAGRD;wBACAQ;;;;;;AAKrB,EAAE"}

package/dist/components/titan-layout/layout-header.module.less CHANGED Viewed

@@ -2,6 +2,18 @@
 /* stylelint-disable no-duplicate-selectors */
 @import (reference) '@servicetitan/tokens/core/tokens.less';
+@keyframes ExtraPulseAnimation {
+    0% {
+        opacity: 0.7;
+    }
+    50% {
+        opacity: 0.5;
+    }
+    100% {
+        opacity: 0;
+    }
+}
 @size-links-tiny: 24px;
 @bg-light: @color-white;
 @bg-dark: @color-neutral-300;
@@ -36,6 +48,11 @@
         overflow-y: hidden;
     }
+    .he-top-left {
+        display: flex;
+        flex-direction: row;
+    }
     .he-top-center {
         overflow: hidden;
     }
@@ -146,7 +163,7 @@
         grid-template-columns: repeat(3, 1fr);
         grid-template-rows: 48px;
-        .logo,
+        .he-top-left,
         .he-top-center,
         .he-top-right {
             grid-column: span 1;
@@ -352,6 +369,25 @@
     }
 }
+.he-top-right .navigation-item-flashing {
+    &::before {
+        content: '';
+        position: absolute;
+        animation-name: ExtraPulseAnimation;
+        will-change: opacity;
+        background-color: var(--color-neutral-60, @color-neutral-60);
+        animation-iteration-count: infinite;
+        animation-duration: 500ms;
+        animation-direction: alternate;
+        border-radius: 12px;
+        inset: 0;
+    }
+    &.navigation-item-active::before {
+        background-color: var(--color-blue-200, @color-blue-200);
+    }
+}
 // styles specific to main nav links
 .header-navigation .navigation-link {
     font-family: @base-font-family;

package/dist/components/titan-layout/layout-header.module.less.d.ts CHANGED Viewed

@@ -1,7 +1,9 @@
 export const __esModule: true;
 export const burger: string;
 export const calculating: string;
+export const extraPulseAnimation: string;
 export const heTopCenter: string;
+export const heTopLeft: string;
 export const heTopRight: string;
 export const heTopRightText: string;
 export const header: string;
@@ -29,6 +31,7 @@ export const navigationIconActive: string;
 export const navigationItemActive: string;
 export const navigationItemCounter: string;
 export const navigationItemCounterLong: string;
+export const navigationItemFlashing: string;
 export const navigationItemIconState: string;
 export const navigationItemLabel: string;
 export const navigationLink: string;

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

@@ -1,9 +1,12 @@
 import { FC } from 'react';
-import { ProfileDropdownLinkProps, ProfileDropdownProps, ProfileDropdownSectionProps } from '../profile-dropdown/profile-dropdown';
-export type { ProfileDropdownProps, ProfileDropdownSectionProps, ProfileDropdownLinkProps, } from '../profile-dropdown/profile-dropdown';
-export declare const ProfileDropdown: FC<ProfileDropdownProps> & {
+import { ProfileDropdownLinkProps, ProfileDropdownProps, ProfileDropdownSectionProps } from '../profile-dropdown/interface';
+export type { ProfileDropdownProps, ProfileDropdownSectionProps, ProfileDropdownLinkProps, } from '../profile-dropdown/interface';
+declare function ProfileDropdownComponent(props: ProfileDropdownProps): import("react/jsx-runtime").JSX.Element;
+declare function ProfileDropdownSection(props: ProfileDropdownSectionProps): import("react/jsx-runtime").JSX.Element;
+declare function ProfileDropdownLink(props: ProfileDropdownLinkProps): import("react/jsx-runtime").JSX.Element;
+export declare const ProfileDropdown: typeof ProfileDropdownComponent & {
     Divider: FC;
-    Link: FC<ProfileDropdownLinkProps>;
-    Section: FC<ProfileDropdownSectionProps>;
+    Link: typeof ProfileDropdownLink;
+    Section: typeof ProfileDropdownSection;
 };
 //# sourceMappingURL=layout-profile.d.ts.map