@servicetitan/navigation 12.0.3 → 13.0.0-canary.256.b43c6d7.0

package/dist/components/header-navigation/header-navigation-content.d.ts

@@ -1,30 +0,0 @@
-import { IconPropsStrict } from '@servicetitan/design-system';
-import { FC } from 'react';
-import { HeaderNavigationItemData } from '../../utils/navigation-legacy';
-import { CounterTagProps } from '../counter-tag';
-export interface HeaderNavigationItemContentPropsStrict {
-    /** item text */
-    title?: string;
-    /** text component class name */
-    titleClassName?: string;
-    /** counter tag shown for item */
-    tag: CounterTagProps | undefined;
-    /** counter component class name */
-    counterClassName?: string;
-    /** icon component class name */
-    iconClassName?: string;
-    /** IconComponent custom icon component */
-    iconComponent?: FC;
-    /** iconName name of anvil icon */
-    iconName?: IconPropsStrict['name'];
-}
-/** Content for navigation items */
-export declare const HeaderNavigationItemContent: FC<HeaderNavigationItemContentPropsStrict>;
-interface HeaderNavigationItemPropsStrict extends HeaderNavigationItemData {
-    minimized: boolean;
-    main: boolean;
-}
-/** Navigation main menu item */
-export declare const HeaderNavigationItem: FC<HeaderNavigationItemPropsStrict>;
-export {};
-//# sourceMappingURL=header-navigation-content.d.ts.map

package/dist/components/header-navigation/header-navigation-content.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"header-navigation-content.d.ts","sourceRoot":"","sources":["../../../src/components/header-navigation/header-navigation-content.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAEpE,OAAO,EAAE,EAAE,EAAwB,MAAM,OAAO,CAAC;AAEjD,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AAEzE,OAAO,EAAc,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAI7D,MAAM,WAAW,sCAAsC;IACnD,gBAAgB;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gCAAgC;IAChC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,iCAAiC;IACjC,GAAG,EAAE,eAAe,GAAG,SAAS,CAAC;IACjC,mCAAmC;IACnC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gCAAgC;IAChC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,0CAA0C;IAC1C,aAAa,CAAC,EAAE,EAAE,CAAC;IACnB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;CACtC;AAED,mCAAmC;AACnC,eAAO,MAAM,2BAA2B,EAAE,EAAE,CAAC,sCAAsC,CAqClF,CAAC;AAEF,UAAU,+BAAgC,SAAQ,wBAAwB;IACtE,SAAS,EAAE,OAAO,CAAC;IACnB,IAAI,EAAE,OAAO,CAAC;CACjB;AAED,gCAAgC;AAChC,eAAO,MAAM,oBAAoB,EAAE,EAAE,CAAC,+BAA+B,CA8CpE,CAAC"}

package/dist/components/header-navigation/header-navigation-content.js

@@ -1,58 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Icon } from '@servicetitan/design-system';
-import classNames from 'classnames';
-import { Fragment, useContext } from 'react';
-import { NavigationComponentContext } from '../../utils/navigation-context';
-import { getCounterTag } from '../../utils/side-nav';
-import { CounterTag } from '../counter-tag';
-import * as Styles from './header-navigation.module.less';
-import { withTooltip } from './with-tooltip';
-/** Content for navigation items */ export const HeaderNavigationItemContent = ({ title, titleClassName, counterClassName, iconClassName, iconComponent: IconComponent, iconName, tag })=>{
-    const iconClass = classNames(Styles.navigationIcon, iconClassName);
-    return /*#__PURE__*/ _jsxs(Fragment, {
-        children: [
-            IconComponent ? /*#__PURE__*/ _jsx("i", {
-                className: iconClass,
-                children: /*#__PURE__*/ _jsx(IconComponent, {})
-            }) : iconName ? /*#__PURE__*/ _jsx(Icon, {
-                name: iconName,
-                className: iconClass
-            }) : /*#__PURE__*/ _jsx("i", {
-                className: iconClass
-            }),
-            !!title && /*#__PURE__*/ _jsx("span", {
-                className: classNames(Styles.navigationItemTitle, titleClassName),
-                children: title
-            }),
-            !!tag && /*#__PURE__*/ _jsx(CounterTag, {
-                data: tag,
-                className: classNames(Styles.navigationItemCounter, counterClassName),
-                longClassName: Styles.navigationItemCounterLong
-            })
-        ]
-    });
-};
-/** Navigation main menu item */ export const HeaderNavigationItem = ({ id, to, counter, title, hint, className, iconClassName, iconComponent, iconName, isActive, main, minimized, tag })=>{
-    const NavigationComponent = useContext(NavigationComponentContext);
-    return withTooltip(/*#__PURE__*/ _jsx(NavigationComponent, {
-        "data-cy": `navigation-item-${id}`,
-        "data-pendo": `navigation-item-${id}`,
-        to: to,
-        title: hint,
-        className: classNames(Styles.navigationItem, main ? Styles.navigationItemMain : Styles.navigationItemOverflow, className, {
-            [Styles.navigationItemActive]: isActive === true
-        }),
-        isActive: typeof isActive === 'function' ? isActive : undefined,
-        activeClassName: Styles.navigationItemActive,
-        children: /*#__PURE__*/ _jsx(HeaderNavigationItemContent, {
-            title: minimized ? undefined : title,
-            titleClassName: main ? '' : 'm-l-half',
-            tag: getCounterTag(counter, tag),
-            iconComponent: iconComponent,
-            iconClassName: iconClassName,
-            iconName: iconName
-        })
-    }, id), minimized ? title : undefined);
-};
-
-//# sourceMappingURL=header-navigation-content.js.map

package/dist/components/header-navigation/header-navigation-content.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/components/header-navigation/header-navigation-content.tsx"],"sourcesContent":["import { Icon, IconPropsStrict } from '@servicetitan/design-system';\nimport classNames from 'classnames';\nimport { FC, Fragment, useContext } from 'react';\nimport { NavigationComponentContext } from '../../utils/navigation-context';\nimport { HeaderNavigationItemData } from '../../utils/navigation-legacy';\nimport { getCounterTag } from '../../utils/side-nav';\nimport { CounterTag, CounterTagProps } from '../counter-tag';\nimport * as Styles from './header-navigation.module.less';\nimport { withTooltip } from './with-tooltip';\n\nexport interface HeaderNavigationItemContentPropsStrict {\n    /** item text */\n    title?: string;\n    /** text component class name */\n    titleClassName?: string;\n    /** counter tag shown for item */\n    tag: CounterTagProps | undefined;\n    /** counter component class name */\n    counterClassName?: string;\n    /** icon component class name */\n    iconClassName?: string;\n    /** IconComponent custom icon component */\n    iconComponent?: FC;\n    /** iconName name of anvil icon */\n    iconName?: IconPropsStrict['name'];\n}\n\n/** Content for navigation items */\nexport const HeaderNavigationItemContent: FC<HeaderNavigationItemContentPropsStrict> = ({\n    title,\n    titleClassName,\n    counterClassName,\n    iconClassName,\n    iconComponent: IconComponent,\n    iconName,\n    tag,\n}) => {\n    const iconClass = classNames(Styles.navigationIcon, iconClassName);\n    return (\n        <Fragment>\n            {IconComponent ? (\n                <i className={iconClass}>\n                    <IconComponent />\n                </i>\n            ) : iconName ? (\n                <Icon name={iconName} className={iconClass} />\n            ) : (\n                <i className={iconClass} />\n            )}\n\n            {!!title && (\n                <span className={classNames(Styles.navigationItemTitle, titleClassName)}>\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\ninterface HeaderNavigationItemPropsStrict extends HeaderNavigationItemData {\n    minimized: boolean;\n    main: boolean;\n}\n\n/** Navigation main menu item */\nexport const HeaderNavigationItem: FC<HeaderNavigationItemPropsStrict> = ({\n    id,\n    to,\n    counter,\n    title,\n    hint,\n    className,\n    iconClassName,\n    iconComponent,\n    iconName,\n    isActive,\n    main,\n    minimized,\n    tag,\n}) => {\n    const NavigationComponent = useContext(NavigationComponentContext);\n\n    return withTooltip(\n        <NavigationComponent\n            data-cy={`navigation-item-${id}`}\n            data-pendo={`navigation-item-${id}`}\n            key={id}\n            to={to}\n            title={hint}\n            className={classNames(\n                Styles.navigationItem,\n                main ? Styles.navigationItemMain : Styles.navigationItemOverflow,\n                className,\n                {\n                    [Styles.navigationItemActive]: isActive === true,\n                }\n            )}\n            isActive={typeof isActive === 'function' ? isActive : undefined}\n            activeClassName={Styles.navigationItemActive}\n        >\n            <HeaderNavigationItemContent\n                title={minimized ? undefined : title}\n                titleClassName={main ? '' : 'm-l-half'}\n                tag={getCounterTag(counter, tag)}\n                iconComponent={iconComponent}\n                iconClassName={iconClassName}\n                iconName={iconName}\n            />\n        </NavigationComponent>,\n        minimized ? title : undefined\n    );\n};\n"],"names":["Icon","classNames","Fragment","useContext","NavigationComponentContext","getCounterTag","CounterTag","Styles","withTooltip","HeaderNavigationItemContent","title","titleClassName","counterClassName","iconClassName","iconComponent","IconComponent","iconName","tag","iconClass","navigationIcon","i","className","name","span","navigationItemTitle","data","navigationItemCounter","longClassName","navigationItemCounterLong","HeaderNavigationItem","id","to","counter","hint","isActive","main","minimized","NavigationComponent","data-cy","data-pendo","navigationItem","navigationItemMain","navigationItemOverflow","navigationItemActive","undefined","activeClassName"],"mappings":";AAAA,SAASA,IAAI,QAAyB,8BAA8B;AACpE,OAAOC,gBAAgB,aAAa;AACpC,SAAaC,QAAQ,EAAEC,UAAU,QAAQ,QAAQ;AACjD,SAASC,0BAA0B,QAAQ,iCAAiC;AAE5E,SAASC,aAAa,QAAQ,uBAAuB;AACrD,SAASC,UAAU,QAAyB,iBAAiB;AAC7D,YAAYC,YAAY,kCAAkC;AAC1D,SAASC,WAAW,QAAQ,iBAAiB;AAmB7C,iCAAiC,GACjC,OAAO,MAAMC,8BAA0E,CAAC,EACpFC,KAAK,EACLC,cAAc,EACdC,gBAAgB,EAChBC,aAAa,EACbC,eAAeC,aAAa,EAC5BC,QAAQ,EACRC,GAAG,EACN;IACG,MAAMC,YAAYjB,WAAWM,OAAOY,cAAc,EAAEN;IACpD,qBACI,MAACX;;YACIa,8BACG,KAACK;gBAAEC,WAAWH;0BACV,cAAA,KAACH;iBAELC,yBACA,KAAChB;gBAAKsB,MAAMN;gBAAUK,WAAWH;+BAEjC,KAACE;gBAAEC,WAAWH;;YAGjB,CAAC,CAACR,uBACC,KAACa;gBAAKF,WAAWpB,WAAWM,OAAOiB,mBAAmB,EAAEb;0BACnDD;;YAIR,CAAC,CAACO,qBACC,KAACX;gBACGmB,MAAMR;gBACNI,WAAWpB,WAAWM,OAAOmB,qBAAqB,EAAEd;gBACpDe,eAAepB,OAAOqB,yBAAyB;;;;AAKnE,EAAE;AAOF,8BAA8B,GAC9B,OAAO,MAAMC,uBAA4D,CAAC,EACtEC,EAAE,EACFC,EAAE,EACFC,OAAO,EACPtB,KAAK,EACLuB,IAAI,EACJZ,SAAS,EACTR,aAAa,EACbC,aAAa,EACbE,QAAQ,EACRkB,QAAQ,EACRC,IAAI,EACJC,SAAS,EACTnB,GAAG,EACN;IACG,MAAMoB,sBAAsBlC,WAAWC;IAEvC,OAAOI,0BACH,KAAC6B;QACGC,WAAS,CAAC,gBAAgB,EAAER,IAAI;QAChCS,cAAY,CAAC,gBAAgB,EAAET,IAAI;QAEnCC,IAAIA;QACJrB,OAAOuB;QACPZ,WAAWpB,WACPM,OAAOiC,cAAc,EACrBL,OAAO5B,OAAOkC,kBAAkB,GAAGlC,OAAOmC,sBAAsB,EAChErB,WACA;YACI,CAACd,OAAOoC,oBAAoB,CAAC,EAAET,aAAa;QAChD;QAEJA,UAAU,OAAOA,aAAa,aAAaA,WAAWU;QACtDC,iBAAiBtC,OAAOoC,oBAAoB;kBAE5C,cAAA,KAAClC;YACGC,OAAO0B,YAAYQ,YAAYlC;YAC/BC,gBAAgBwB,OAAO,KAAK;YAC5BlB,KAAKZ,cAAc2B,SAASf;YAC5BH,eAAeA;YACfD,eAAeA;YACfG,UAAUA;;OApBTc,KAuBTM,YAAY1B,QAAQkC;AAE5B,EAAE"}

package/dist/components/header-navigation/header-navigation-extra-stacked.stories.d.ts

@@ -1,9 +0,0 @@
-declare const _default: {
-    title: string;
-    component: import("react").FC<import("../..").HeaderNavigationLinkProps>;
-    decorators: ((Story: any) => import("react/jsx-runtime").JSX.Element)[];
-    parameters: {};
-};
-export default _default;
-export { ExtraWithTooltip, ExtraLink, ExtraTrigger, ExtraWithLabel, } from './header-navigation-extra.stories';
-//# sourceMappingURL=header-navigation-extra-stacked.stories.d.ts.map

package/dist/components/header-navigation/header-navigation-extra-stacked.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"header-navigation-extra-stacked.stories.d.ts","sourceRoot":"","sources":["../../../src/components/header-navigation/header-navigation-extra-stacked.stories.tsx"],"names":[],"mappings":";;;;;;AAMA,wBAKE;AAEF,OAAO,EACH,gBAAgB,EAChB,SAAS,EACT,YAAY,EACZ,cAAc,GACjB,MAAM,mCAAmC,CAAC"}

package/dist/components/header-navigation/header-navigation-extra.stories.d.ts

@@ -1,12 +0,0 @@
-declare const _default: {
-    title: string;
-    component: import("react").FC<import("../..").HeaderNavigationLinkProps>;
-    decorators: ((Story: any) => import("react/jsx-runtime").JSX.Element)[];
-    parameters: {};
-};
-export default _default;
-export declare const ExtraLink: () => import("react/jsx-runtime").JSX.Element;
-export declare const ExtraTrigger: () => import("react/jsx-runtime").JSX.Element;
-export declare const ExtraWithTooltip: () => import("react/jsx-runtime").JSX.Element;
-export declare const ExtraWithLabel: () => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=header-navigation-extra.stories.d.ts.map

package/dist/components/header-navigation/header-navigation-extra.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"header-navigation-extra.stories.d.ts","sourceRoot":"","sources":["../../../src/components/header-navigation/header-navigation-extra.stories.tsx"],"names":[],"mappings":";;;;;;AAeA,wBAKE;AAEF,eAAO,MAAM,SAAS,+CAWrB,CAAC;AAEF,eAAO,MAAM,YAAY,+CAUxB,CAAC;AAEF,eAAO,MAAM,gBAAgB,+CA0B5B,CAAC;AA2CF,eAAO,MAAM,cAAc,+CAyB1B,CAAC"}

package/dist/components/header-navigation/header-navigation-links.d.ts

@@ -1,11 +0,0 @@
-import { FC, ReactNode } from 'react';
-import { HeaderNavigationLinkProps, HeaderNavigationTriggerProps } from '../../utils/navigation-legacy';
-/** Navigation extra item with link */
-export declare const HeaderNavigationLink: FC<HeaderNavigationLinkProps>;
-/** Navigation extra item with icon button */
-export declare const HeaderNavigationTrigger: FC<HeaderNavigationTriggerProps>;
-/** Navigation extra item with custom content */
-export declare const HeaderNavigationTriggerCustom: FC<Omit<HeaderNavigationTriggerProps, 'counter' | 'iconSize' | 'iconName' | 'iconComponent' | 'iconClassName' | 'icon' | 'iconActive'> & {
-    children: ReactNode;
-}>;
-//# sourceMappingURL=header-navigation-links.d.ts.map

package/dist/components/header-navigation/header-navigation-links.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"header-navigation-links.d.ts","sourceRoot":"","sources":["../../../src/components/header-navigation/header-navigation-links.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,EAAE,EAAE,SAAS,EAAc,MAAM,OAAO,CAAC;AAElD,OAAO,EACH,yBAAyB,EACzB,4BAA4B,EAC/B,MAAM,+BAA+B,CAAC;AAMvC,sCAAsC;AACtC,eAAO,MAAM,oBAAoB,EAAE,EAAE,CAAC,yBAAyB,CAgD9D,CAAC;AAEF,6CAA6C;AAC7C,eAAO,MAAM,uBAAuB,EAAE,EAAE,CAAC,4BAA4B,CA6CpE,CAAC;AAEF,gDAAgD;AAChD,eAAO,MAAM,6BAA6B,EAAE,EAAE,CAC1C,IAAI,CACA,4BAA4B,EAC1B,SAAS,GACT,UAAU,GACV,UAAU,GACV,eAAe,GACf,eAAe,GACf,MAAM,GACN,YAAY,CACjB,GAAG;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,CAkB1B,CAAC"}

package/dist/components/header-navigation/header-navigation-links.js

@@ -1,62 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createElement as _createElement } from "react";
-import classNames from 'classnames';
-import { useContext } from 'react';
-import { NavigationComponentContext } from '../../utils/navigation-context';
-import { getCounterTag } from '../../utils/side-nav';
-import { HeaderNavigationItemContent } from './header-navigation-content';
-import * as Styles from './header-navigation.module.less';
-import { withTooltip } from './with-tooltip';
-/** Navigation extra item with link */ export const HeaderNavigationLink = ({ id, to, counter, hint, tooltip, className, icon, iconActive, iconClassName, iconComponent, iconName, isActive, label, labelClassName, tag, target, title, ...rest })=>{
-    const NavigationComponent = useContext(NavigationComponentContext);
-    return withTooltip(/*#__PURE__*/ _createElement(NavigationComponent, {
-        "data-cy": `navigation-link-${id}`,
-        "data-pendo": `navigation-link-${id}`,
-        ...rest,
-        key: id,
-        to: to,
-        title: hint,
-        className: classNames(Styles.navigationLink, Styles.navigationItem, className, {
-            [Styles.navigationItemActive]: isActive === true
-        }),
-        isActive: typeof isActive === 'function' ? isActive : undefined,
-        activeClassName: Styles.navigationItemActive,
-        target: target
-    }, /*#__PURE__*/ _jsx(HeaderNavigationItemContent, {
-        tag: getCounterTag(counter, tag),
-        iconComponent: iconComponent,
-        iconClassName: iconClassName,
-        iconName: iconName,
-        title: label,
-        titleClassName: labelClassName
-    })), tooltip);
-};
-/** Navigation extra item with icon button */ export const HeaderNavigationTrigger = ({ id, className, counter, icon, iconActive, iconClassName, iconComponent, iconName, isActive, label, labelClassName, hint, tag, tooltip, title, ...rest })=>{
-    return withTooltip(/*#__PURE__*/ _jsx("div", {
-        "data-cy": `navigation-trigger-${id}`,
-        "data-pendo": `navigation-trigger-${id}`,
-        ...rest,
-        title: hint,
-        className: classNames(Styles.navigationItem, Styles.navigationLink, {
-            [Styles.navigationItemActive]: isActive === true
-        }, 'cursor-pointer', className),
-        children: /*#__PURE__*/ _jsx(HeaderNavigationItemContent, {
-            tag: getCounterTag(counter, tag),
-            iconComponent: iconComponent,
-            iconClassName: iconClassName,
-            iconName: iconName,
-            title: label,
-            titleClassName: labelClassName
-        })
-    }), tooltip);
-};
-/** Navigation extra item with custom content */ export const HeaderNavigationTriggerCustom = ({ children, id, className, tooltip, title, ...rest })=>withTooltip(/*#__PURE__*/ _jsx("div", {
-        "data-cy": `navigation-custom-${id}`,
-        "data-pendo": `navigation-custom-${id}`,
-        ...rest,
-        title: title,
-        className: classNames(Styles.navigationItem, Styles.navigationLink, 'cursor-pointer', className),
-        children: children
-    }), tooltip);
-
-//# sourceMappingURL=header-navigation-links.js.map

package/dist/components/header-navigation/header-navigation-links.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/components/header-navigation/header-navigation-links.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { FC, ReactNode, useContext } from 'react';\nimport { NavigationComponentContext } from '../../utils/navigation-context';\nimport {\n    HeaderNavigationLinkProps,\n    HeaderNavigationTriggerProps,\n} from '../../utils/navigation-legacy';\nimport { getCounterTag } from '../../utils/side-nav';\nimport { HeaderNavigationItemContent } from './header-navigation-content';\nimport * as Styles from './header-navigation.module.less';\nimport { withTooltip } from './with-tooltip';\n\n/** Navigation extra item with link */\nexport const HeaderNavigationLink: FC<HeaderNavigationLinkProps> = ({\n    id,\n    to,\n    counter,\n    hint,\n    tooltip,\n    className,\n    icon,\n    iconActive,\n    iconClassName,\n    iconComponent,\n    iconName,\n    isActive,\n    label,\n    labelClassName,\n    tag,\n    target,\n    title,\n    ...rest\n}) => {\n    const NavigationComponent = useContext(NavigationComponentContext);\n\n    return withTooltip(\n        <NavigationComponent\n            data-cy={`navigation-link-${id}`}\n            data-pendo={`navigation-link-${id}`}\n            {...rest}\n            key={id}\n            to={to}\n            title={hint}\n            className={classNames(Styles.navigationLink, Styles.navigationItem, className, {\n                [Styles.navigationItemActive]: isActive === true,\n            })}\n            isActive={typeof isActive === 'function' ? isActive : undefined}\n            activeClassName={Styles.navigationItemActive}\n            target={target}\n        >\n            <HeaderNavigationItemContent\n                tag={getCounterTag(counter, tag)}\n                iconComponent={iconComponent}\n                iconClassName={iconClassName}\n                iconName={iconName}\n                title={label}\n                titleClassName={labelClassName}\n            />\n        </NavigationComponent>,\n        tooltip\n    );\n};\n\n/** Navigation extra item with icon button */\nexport const HeaderNavigationTrigger: FC<HeaderNavigationTriggerProps> = ({\n    id,\n    className,\n    counter,\n    icon,\n    iconActive,\n    iconClassName,\n    iconComponent,\n    iconName,\n    isActive,\n    label,\n    labelClassName,\n    hint,\n    tag,\n    tooltip,\n    title,\n    ...rest\n}) => {\n    return withTooltip(\n        <div\n            data-cy={`navigation-trigger-${id}`}\n            data-pendo={`navigation-trigger-${id}`}\n            {...rest}\n            title={hint}\n            className={classNames(\n                Styles.navigationItem,\n                Styles.navigationLink,\n                {\n                    [Styles.navigationItemActive]: isActive === true,\n                },\n                'cursor-pointer',\n                className\n            )}\n        >\n            <HeaderNavigationItemContent\n                tag={getCounterTag(counter, tag)}\n                iconComponent={iconComponent}\n                iconClassName={iconClassName}\n                iconName={iconName}\n                title={label}\n                titleClassName={labelClassName}\n            />\n        </div>,\n        tooltip\n    );\n};\n\n/** Navigation extra item with custom content */\nexport const HeaderNavigationTriggerCustom: FC<\n    Omit<\n        HeaderNavigationTriggerProps,\n        | 'counter'\n        | 'iconSize'\n        | 'iconName'\n        | 'iconComponent'\n        | 'iconClassName'\n        | 'icon'\n        | 'iconActive'\n    > & { children: ReactNode }\n> = ({ children, id, className, tooltip, title, ...rest }) =>\n    withTooltip(\n        <div\n            data-cy={`navigation-custom-${id}`}\n            data-pendo={`navigation-custom-${id}`}\n            {...rest}\n            title={title}\n            className={classNames(\n                Styles.navigationItem,\n                Styles.navigationLink,\n                'cursor-pointer',\n                className\n            )}\n        >\n            {children}\n        </div>,\n        tooltip\n    );\n"],"names":["classNames","useContext","NavigationComponentContext","getCounterTag","HeaderNavigationItemContent","Styles","withTooltip","HeaderNavigationLink","id","to","counter","hint","tooltip","className","icon","iconActive","iconClassName","iconComponent","iconName","isActive","label","labelClassName","tag","target","title","rest","NavigationComponent","data-cy","data-pendo","key","navigationLink","navigationItem","navigationItemActive","undefined","activeClassName","titleClassName","HeaderNavigationTrigger","div","HeaderNavigationTriggerCustom","children"],"mappings":";;AAAA,OAAOA,gBAAgB,aAAa;AACpC,SAAwBC,UAAU,QAAQ,QAAQ;AAClD,SAASC,0BAA0B,QAAQ,iCAAiC;AAK5E,SAASC,aAAa,QAAQ,uBAAuB;AACrD,SAASC,2BAA2B,QAAQ,8BAA8B;AAC1E,YAAYC,YAAY,kCAAkC;AAC1D,SAASC,WAAW,QAAQ,iBAAiB;AAE7C,oCAAoC,GACpC,OAAO,MAAMC,uBAAsD,CAAC,EAChEC,EAAE,EACFC,EAAE,EACFC,OAAO,EACPC,IAAI,EACJC,OAAO,EACPC,SAAS,EACTC,IAAI,EACJC,UAAU,EACVC,aAAa,EACbC,aAAa,EACbC,QAAQ,EACRC,QAAQ,EACRC,KAAK,EACLC,cAAc,EACdC,GAAG,EACHC,MAAM,EACNC,KAAK,EACL,GAAGC,MACN;IACG,MAAMC,sBAAsBzB,WAAWC;IAEvC,OAAOI,0BACH,eAACoB;QACGC,WAAS,CAAC,gBAAgB,EAAEnB,IAAI;QAChCoB,cAAY,CAAC,gBAAgB,EAAEpB,IAAI;QAClC,GAAGiB,IAAI;QACRI,KAAKrB;QACLC,IAAIA;QACJe,OAAOb;QACPE,WAAWb,WAAWK,OAAOyB,cAAc,EAAEzB,OAAO0B,cAAc,EAAElB,WAAW;YAC3E,CAACR,OAAO2B,oBAAoB,CAAC,EAAEb,aAAa;QAChD;QACAA,UAAU,OAAOA,aAAa,aAAaA,WAAWc;QACtDC,iBAAiB7B,OAAO2B,oBAAoB;QAC5CT,QAAQA;qBAER,KAACnB;QACGkB,KAAKnB,cAAcO,SAASY;QAC5BL,eAAeA;QACfD,eAAeA;QACfE,UAAUA;QACVM,OAAOJ;QACPe,gBAAgBd;SAGxBT;AAER,EAAE;AAEF,2CAA2C,GAC3C,OAAO,MAAMwB,0BAA4D,CAAC,EACtE5B,EAAE,EACFK,SAAS,EACTH,OAAO,EACPI,IAAI,EACJC,UAAU,EACVC,aAAa,EACbC,aAAa,EACbC,QAAQ,EACRC,QAAQ,EACRC,KAAK,EACLC,cAAc,EACdV,IAAI,EACJW,GAAG,EACHV,OAAO,EACPY,KAAK,EACL,GAAGC,MACN;IACG,OAAOnB,0BACH,KAAC+B;QACGV,WAAS,CAAC,mBAAmB,EAAEnB,IAAI;QACnCoB,cAAY,CAAC,mBAAmB,EAAEpB,IAAI;QACrC,GAAGiB,IAAI;QACRD,OAAOb;QACPE,WAAWb,WACPK,OAAO0B,cAAc,EACrB1B,OAAOyB,cAAc,EACrB;YACI,CAACzB,OAAO2B,oBAAoB,CAAC,EAAEb,aAAa;QAChD,GACA,kBACAN;kBAGJ,cAAA,KAACT;YACGkB,KAAKnB,cAAcO,SAASY;YAC5BL,eAAeA;YACfD,eAAeA;YACfE,UAAUA;YACVM,OAAOJ;YACPe,gBAAgBd;;QAGxBT;AAER,EAAE;AAEF,8CAA8C,GAC9C,OAAO,MAAM0B,gCAWT,CAAC,EAAEC,QAAQ,EAAE/B,EAAE,EAAEK,SAAS,EAAED,OAAO,EAAEY,KAAK,EAAE,GAAGC,MAAM,GACrDnB,0BACI,KAAC+B;QACGV,WAAS,CAAC,kBAAkB,EAAEnB,IAAI;QAClCoB,cAAY,CAAC,kBAAkB,EAAEpB,IAAI;QACpC,GAAGiB,IAAI;QACRD,OAAOA;QACPX,WAAWb,WACPK,OAAO0B,cAAc,EACrB1B,OAAOyB,cAAc,EACrB,kBACAjB;kBAGH0B;QAEL3B,SACF"}

package/dist/components/header-navigation/header-navigation-stacked.stories.d.ts

@@ -1,12 +0,0 @@
-import { FC } from 'react';
-declare const _default: {
-    title: string;
-    component: FC<import("./header-navigation").HeaderNavigationStackedProps>;
-    parameters: {};
-    decorators: ((Story: any) => import("react/jsx-runtime").JSX.Element)[];
-};
-export default _default;
-export declare const DefaultNavigation: () => import("react/jsx-runtime").JSX.Element;
-export declare const WithLogoTextAndOverflow: () => import("react/jsx-runtime").JSX.Element;
-export declare const WithAllMonolithData: () => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=header-navigation-stacked.stories.d.ts.map

package/dist/components/header-navigation/header-navigation-stacked.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"header-navigation-stacked.stories.d.ts","sourceRoot":"","sources":["../../../src/components/header-navigation/header-navigation-stacked.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;;;;;;;AASrC,wBAKE;AAIF,eAAO,MAAM,iBAAiB,+CAa7B,CAAC;AAEF,eAAO,MAAM,uBAAuB,+CAmBnC,CAAC;AAQF,eAAO,MAAM,mBAAmB,+CAoF/B,CAAC"}

package/dist/components/header-navigation/header-navigation-stories.module.less

@@ -1,6 +0,0 @@
-/* stylelint-disable no-descending-specificity */
-@import (reference) '@servicetitan/tokens/core/tokens.less';
-
-.rocket-icon {
-    transform: scale(0.9) translate(2px, -2px) rotate(45deg);
-}

package/dist/components/header-navigation/header-navigation-stories.module.less.d.ts

@@ -1,3 +0,0 @@
-export const __esModule: true;
-export const rocketIcon: string;
-

package/dist/components/header-navigation/header-navigation.d.ts

@@ -1,59 +0,0 @@
-import { PopoverPropsStrict } from '@servicetitan/design-system';
-import { FC, ReactElement, ReactNode } from 'react';
-import { HeaderNavigationItemData } from '../../utils/navigation-legacy';
-export interface HeaderNavigationOverflowProps {
-    direction: PopoverPropsStrict['direction'];
-    width: PopoverPropsStrict['width'];
-    portal?: boolean;
-}
-export interface HeaderNavigationProps {
-    /** extra navigation */
-    children?: ReactNode;
-    /** container class name */
-    className?: string;
-    /** extra navigation container class name */
-    rightClassName?: string;
-    /** container id */
-    id?: string;
-    /** left content (usually used for logo) */
-    left?: ReactElement;
-    /** left container class name */
-    leftClassName?: string;
-    /** minimal width for navigation bar */
-    minWidth?: number;
-    /** main navigation items */
-    items?: HeaderNavigationItemData[];
-    /** main navigation overflow items */
-    itemsOverflow?: HeaderNavigationItemData[];
-    /** props for main items overflow component */
-    overflow?: HeaderNavigationOverflowProps;
-}
-export declare const HeaderNavigation: FC<HeaderNavigationProps>;
-export interface HeaderNavigationStackedProps {
-    /** container class name */
-    className?: string;
-    /** extra navigation */
-    right?: ReactNode;
-    /** extra navigation container class name */
-    rightClassName?: string;
-    /** container id */
-    id?: string;
-    /** left content (usually used for logo) */
-    left?: ReactElement;
-    /** left container class name */
-    leftClassName?: string;
-    /** center content */
-    center?: ReactElement;
-    /** center container class name */
-    centerClassName?: string;
-    /** minimal width for navigation bar */
-    minWidth?: number;
-    /** main navigation items */
-    items?: HeaderNavigationItemData[];
-    /** main navigation overflow items */
-    itemsOverflow?: HeaderNavigationItemData[];
-    /** props for main items overflow component */
-    overflow?: HeaderNavigationOverflowProps;
-}
-export declare const HeaderNavigationStacked: FC<HeaderNavigationStackedProps>;
-//# sourceMappingURL=header-navigation.d.ts.map

package/dist/components/header-navigation/header-navigation.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"header-navigation.d.ts","sourceRoot":"","sources":["../../../src/components/header-navigation/header-navigation.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAEhF,OAAO,EAAE,EAAE,EAAE,YAAY,EAAE,SAAS,EAA4C,MAAM,OAAO,CAAC;AAE9F,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AAWzE,MAAM,WAAW,6BAA6B;IAC1C,SAAS,EAAE,kBAAkB,CAAC,WAAW,CAAC,CAAC;IAC3C,KAAK,EAAE,kBAAkB,CAAC,OAAO,CAAC,CAAC;IACnC,MAAM,CAAC,EAAE,OAAO,CAAC;CACpB;AA0CD,MAAM,WAAW,qBAAqB;IAClC,uBAAuB;IACvB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4CAA4C;IAC5C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mBAAmB;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,2CAA2C;IAC3C,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,gCAAgC;IAChC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,uCAAuC;IACvC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4BAA4B;IAC5B,KAAK,CAAC,EAAE,wBAAwB,EAAE,CAAC;IACnC,qCAAqC;IACrC,aAAa,CAAC,EAAE,wBAAwB,EAAE,CAAC;IAC3C,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,6BAA6B,CAAC;CAC5C;AAQD,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CAiGtD,CAAC;AAEF,MAAM,WAAW,4BAA4B;IACzC,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uBAAuB;IACvB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,4CAA4C;IAC5C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mBAAmB;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,2CAA2C;IAC3C,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,gCAAgC;IAChC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qBAAqB;IACrB,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,kCAAkC;IAClC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,uCAAuC;IACvC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4BAA4B;IAC5B,KAAK,CAAC,EAAE,wBAAwB,EAAE,CAAC;IACnC,qCAAqC;IACrC,aAAa,CAAC,EAAE,wBAAwB,EAAE,CAAC;IAC3C,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,6BAA6B,CAAC;CAC5C;AAED,eAAO,MAAM,uBAAuB,EAAE,EAAE,CAAC,4BAA4B,CA8GpE,CAAC"}

package/dist/components/header-navigation/header-navigation.js

@@ -1,228 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { createElement as _createElement } from "react";
-import { Icon, Popover } from '@servicetitan/design-system';
-import classNames from 'classnames';
-import { useCallback, useEffect, useRef, useState } from 'react';
-import { NavigationLegacyContext } from '../../utils/navigation-context';
-import { HeaderNavigationItem } from './header-navigation-content';
-import * as Styles from './header-navigation.module.less';
-function useForceUpdate() {
-    const [, setTick] = useState(0);
-    return useCallback(()=>{
-        setTick((tick)=>tick + 1);
-    }, []);
-}
-const HeaderNavigationOverflow = ({ items, overflow })=>{
-    const [isOpen, setIsOpen] = useState(false);
-    var _overflow_direction, _overflow_width;
-    return /*#__PURE__*/ _jsx(Popover, {
-        open: isOpen,
-        trigger: /*#__PURE__*/ _jsx(Icon, {
-            name: "more_vert",
-            size: "24px",
-            className: "c-pointer",
-            onClick: ()=>setIsOpen(true),
-            color: "white",
-            "data-cy": "navigation-overflow-trigger",
-            "data-pendo": "navigation-overflow-trigger"
-        }),
-        direction: (_overflow_direction = overflow === null || overflow === void 0 ? void 0 : overflow.direction) !== null && _overflow_direction !== void 0 ? _overflow_direction : 'bl',
-        width: (_overflow_width = overflow === null || overflow === void 0 ? void 0 : overflow.width) !== null && _overflow_width !== void 0 ? _overflow_width : 'xs',
-        portal: overflow === null || overflow === void 0 ? void 0 : overflow.portal,
-        onClickOutside: ()=>setIsOpen(false),
-        wrapperClassName: "d-if-i align-items-center",
-        popoverContentClassName: Styles.overflowPopover,
-        children: /*#__PURE__*/ _jsx("div", {
-            onClick: ()=>setIsOpen(false),
-            className: Styles.navigationOverflow,
-            "data-cy": "navigation-overflow-content",
-            children: items.map((item)=>/*#__PURE__*/ _createElement(HeaderNavigationItem, {
-                    ...item,
-                    key: item.id,
-                    minimized: false,
-                    main: false
-                }))
-        })
-    });
-};
-var MinimizedState = /*#__PURE__*/ function(MinimizedState) {
-    MinimizedState[MinimizedState["Calculating"] = 0] = "Calculating";
-    MinimizedState[MinimizedState["Minimized"] = 1] = "Minimized";
-    MinimizedState[MinimizedState["Full"] = 2] = "Full";
-    return MinimizedState;
-}(MinimizedState || {});
-export const HeaderNavigation = ({ children, className, id, items, itemsOverflow, left, leftClassName, rightClassName, minWidth = 800, overflow })=>{
-    const leftRef = useRef(null);
-    const rightRef = useRef(null);
-    const centerRef = useRef(null);
-    const navigationRef = useRef(null);
-    const forceUpdate = useForceUpdate();
-    const [minimized, setMinimized] = useState(0);
-    useEffect(()=>{
-        const handleResize = ()=>{
-            setMinimized(0);
-            forceUpdate();
-        };
-        window.addEventListener('resize', handleResize);
-        return ()=>window.removeEventListener('resize', handleResize);
-    }, [
-        forceUpdate
-    ]);
-    useEffect(()=>{
-        setMinimized(0);
-        forceUpdate();
-    }, [
-        items,
-        itemsOverflow,
-        forceUpdate
-    ]);
-    const updateIsMinimized = ()=>{
-        if (centerRef.current && navigationRef.current) {
-            if (navigationRef.current.clientWidth > centerRef.current.clientWidth) {
-                setMinimized(1);
-            } else if (minimized === 0) {
-                setMinimized(2);
-            }
-        }
-    };
-    useEffect(()=>{
-        updateIsMinimized();
-    });
-    return /*#__PURE__*/ _jsx(NavigationLegacyContext.Provider, {
-        value: true,
-        children: /*#__PURE__*/ _jsxs("div", {
-            className: classNames(Styles.header, className, {
-                [Styles.calculating]: minimized === 0
-            }),
-            style: {
-                minWidth: `${minWidth}px`
-            },
-            id: id,
-            "data-cy": "header-navigation",
-            children: [
-                /*#__PURE__*/ _jsx("div", {
-                    className: leftClassName,
-                    ref: leftRef,
-                    "data-cy": "navigation-left",
-                    children: left
-                }),
-                /*#__PURE__*/ _jsx("div", {
-                    ref: centerRef,
-                    className: classNames('d-if flex-grow-1 flex-basis-0 justify-content-center', Styles.center),
-                    "data-cy": "navigation-items",
-                    children: /*#__PURE__*/ _jsxs("div", {
-                        ref: navigationRef,
-                        className: classNames('d-if'),
-                        children: [
-                            items === null || items === void 0 ? void 0 : items.map((item)=>/*#__PURE__*/ _createElement(HeaderNavigationItem, {
-                                    ...item,
-                                    minimized: minimized === 1,
-                                    main: true,
-                                    key: item.id
-                                })),
-                            !!(itemsOverflow === null || itemsOverflow === void 0 ? void 0 : itemsOverflow.length) && /*#__PURE__*/ _jsx(HeaderNavigationOverflow, {
-                                items: itemsOverflow,
-                                overflow: overflow
-                            })
-                        ]
-                    })
-                }),
-                /*#__PURE__*/ _jsx("div", {
-                    className: classNames('d-f flex-row justify-content-end align-items-center', Styles.right, rightClassName),
-                    ref: rightRef,
-                    "data-cy": "navigation-right",
-                    children: children
-                })
-            ]
-        })
-    });
-};
-export const HeaderNavigationStacked = ({ className, id, items, itemsOverflow, left, leftClassName, right, rightClassName, center, centerClassName, minWidth = 800, overflow })=>{
-    const bottomRef = useRef(null);
-    const navigationRef = useRef(null);
-    const forceUpdate = useForceUpdate();
-    const [minimized, setMinimized] = useState(0);
-    useEffect(()=>{
-        const handleResize = ()=>{
-            setMinimized(0);
-            forceUpdate();
-        };
-        window.addEventListener('resize', handleResize);
-        return ()=>window.removeEventListener('resize', handleResize);
-    }, [
-        forceUpdate
-    ]);
-    useEffect(()=>{
-        setMinimized(0);
-        forceUpdate();
-    }, [
-        items,
-        itemsOverflow,
-        forceUpdate
-    ]);
-    const updateIsMinimized = ()=>{
-        if (bottomRef.current && navigationRef.current) {
-            if (navigationRef.current.clientWidth + 16 > bottomRef.current.clientWidth) {
-                setMinimized(1);
-            } else if (minimized === 0) {
-                setMinimized(2);
-            }
-        }
-    };
-    useEffect(()=>{
-        updateIsMinimized();
-    });
-    return /*#__PURE__*/ _jsx(NavigationLegacyContext.Provider, {
-        value: true,
-        children: /*#__PURE__*/ _jsxs("div", {
-            className: classNames(Styles.headerStacked, {
-                [Styles.calculating]: minimized === 0
-            }, className),
-            style: {
-                minWidth: `${minWidth}px`
-            },
-            id: id,
-            "data-cy": "header-navigation",
-            children: [
-                /*#__PURE__*/ _jsx("div", {
-                    className: classNames(Styles.heTopLeft, leftClassName),
-                    "data-cy": "navigation-left",
-                    children: left
-                }),
-                /*#__PURE__*/ _jsx("div", {
-                    className: classNames(Styles.heTopCenter, centerClassName),
-                    "data-cy": "navigation-center",
-                    children: center
-                }),
-                /*#__PURE__*/ _jsx("div", {
-                    className: classNames('d-f flex-row justify-content-end align-items-center', Styles.heTopRight, rightClassName),
-                    "data-cy": "navigation-right",
-                    children: right
-                }),
-                /*#__PURE__*/ _jsx("div", {
-                    ref: bottomRef,
-                    className: classNames(Styles.heBottom, 'd-if flex-grow-1 flex-basis-0 justify-content-center', Styles.center),
-                    "data-cy": "navigation-items",
-                    children: /*#__PURE__*/ _jsxs("div", {
-                        ref: navigationRef,
-                        className: classNames('d-if'),
-                        children: [
-                            items === null || items === void 0 ? void 0 : items.map((item)=>/*#__PURE__*/ _createElement(HeaderNavigationItem, {
-                                    ...item,
-                                    minimized: minimized === 1,
-                                    main: true,
-                                    key: item.id
-                                })),
-                            !!(itemsOverflow === null || itemsOverflow === void 0 ? void 0 : itemsOverflow.length) && /*#__PURE__*/ _jsx(HeaderNavigationOverflow, {
-                                items: itemsOverflow,
-                                overflow: overflow
-                            })
-                        ]
-                    })
-                })
-            ]
-        })
-    });
-};
-
-//# sourceMappingURL=header-navigation.js.map

package/dist/components/header-navigation/header-navigation.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/components/header-navigation/header-navigation.tsx"],"sourcesContent":["import { Icon, Popover, PopoverPropsStrict } from '@servicetitan/design-system';\nimport classNames from 'classnames';\nimport { FC, ReactElement, ReactNode, useCallback, useEffect, useRef, useState } from 'react';\nimport { NavigationLegacyContext } from '../../utils/navigation-context';\nimport { HeaderNavigationItemData } from '../../utils/navigation-legacy';\nimport { HeaderNavigationItem } from './header-navigation-content';\nimport * as Styles from './header-navigation.module.less';\n\nfunction useForceUpdate() {\n    const [, setTick] = useState(0);\n    return useCallback(() => {\n        setTick(tick => tick + 1);\n    }, []);\n}\n\nexport interface HeaderNavigationOverflowProps {\n    direction: PopoverPropsStrict['direction'];\n    width: PopoverPropsStrict['width'];\n    portal?: boolean;\n}\n\nconst HeaderNavigationOverflow: FC<{\n    items: HeaderNavigationItemData[];\n    overflow?: HeaderNavigationOverflowProps;\n}> = ({ items, overflow }) => {\n    const [isOpen, setIsOpen] = useState(false);\n\n    return (\n        <Popover\n            open={isOpen}\n            trigger={\n                <Icon\n                    name=\"more_vert\"\n                    size=\"24px\"\n                    className=\"c-pointer\"\n                    onClick={() => setIsOpen(true)}\n                    color=\"white\"\n                    data-cy=\"navigation-overflow-trigger\"\n                    data-pendo=\"navigation-overflow-trigger\"\n                />\n            }\n            direction={overflow?.direction ?? 'bl'}\n            width={overflow?.width ?? 'xs'}\n            portal={overflow?.portal}\n            onClickOutside={() => setIsOpen(false)}\n            wrapperClassName=\"d-if-i align-items-center\"\n            popoverContentClassName={Styles.overflowPopover}\n        >\n            <div\n                onClick={() => setIsOpen(false)}\n                className={Styles.navigationOverflow}\n                data-cy=\"navigation-overflow-content\"\n            >\n                {items.map(item => (\n                    <HeaderNavigationItem {...item} key={item.id} minimized={false} main={false} />\n                ))}\n            </div>\n        </Popover>\n    );\n};\n\nexport interface HeaderNavigationProps {\n    /** extra navigation */\n    children?: ReactNode;\n    /** container class name */\n    className?: string;\n    /** extra navigation container class name */\n    rightClassName?: string;\n    /** container id */\n    id?: string;\n    /** left content (usually used for logo) */\n    left?: ReactElement;\n    /** left container class name */\n    leftClassName?: string;\n    /** minimal width for navigation bar */\n    minWidth?: number;\n    /** main navigation items */\n    items?: HeaderNavigationItemData[];\n    /** main navigation overflow items */\n    itemsOverflow?: HeaderNavigationItemData[];\n    /** props for main items overflow component */\n    overflow?: HeaderNavigationOverflowProps;\n}\n\nenum MinimizedState {\n    Calculating,\n    Minimized,\n    Full,\n}\n\nexport const HeaderNavigation: FC<HeaderNavigationProps> = ({\n    children,\n    className,\n    id,\n    items,\n    itemsOverflow,\n    left,\n    leftClassName,\n    rightClassName,\n    minWidth = 800,\n    overflow,\n}) => {\n    const leftRef = useRef<HTMLDivElement>(null);\n    const rightRef = useRef<HTMLDivElement>(null);\n    const centerRef = useRef<HTMLDivElement>(null);\n    const navigationRef = useRef<HTMLDivElement>(null);\n    const forceUpdate = useForceUpdate();\n    const [minimized, setMinimized] = useState(MinimizedState.Calculating);\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    useEffect(() => {\n        setMinimized(MinimizedState.Calculating);\n        forceUpdate();\n    }, [items, itemsOverflow, forceUpdate]);\n\n    const updateIsMinimized = () => {\n        if (centerRef.current && navigationRef.current) {\n            if (navigationRef.current.clientWidth > centerRef.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    return (\n        <NavigationLegacyContext.Provider value>\n            <div\n                className={classNames(Styles.header, className, {\n                    [Styles.calculating]: minimized === MinimizedState.Calculating,\n                })}\n                style={{ minWidth: `${minWidth}px` }}\n                id={id}\n                data-cy=\"header-navigation\"\n            >\n                <div className={leftClassName} ref={leftRef} data-cy=\"navigation-left\">\n                    {left}\n                </div>\n                <div\n                    ref={centerRef}\n                    className={classNames(\n                        'd-if flex-grow-1 flex-basis-0 justify-content-center',\n                        Styles.center\n                    )}\n                    data-cy=\"navigation-items\"\n                >\n                    <div ref={navigationRef} className={classNames('d-if')}>\n                        {items?.map(item => (\n                            <HeaderNavigationItem\n                                {...item}\n                                minimized={minimized === MinimizedState.Minimized}\n                                main\n                                key={item.id}\n                            />\n                        ))}\n                        {!!itemsOverflow?.length && (\n                            <HeaderNavigationOverflow items={itemsOverflow} overflow={overflow} />\n                        )}\n                    </div>\n                </div>\n                <div\n                    className={classNames(\n                        'd-f flex-row justify-content-end align-items-center',\n                        Styles.right,\n                        rightClassName\n                    )}\n                    ref={rightRef}\n                    data-cy=\"navigation-right\"\n                >\n                    {children}\n                </div>\n            </div>\n        </NavigationLegacyContext.Provider>\n    );\n};\n\nexport interface HeaderNavigationStackedProps {\n    /** container class name */\n    className?: string;\n    /** extra navigation */\n    right?: ReactNode;\n    /** extra navigation container class name */\n    rightClassName?: string;\n    /** container id */\n    id?: string;\n    /** left content (usually used for logo) */\n    left?: ReactElement;\n    /** left container class name */\n    leftClassName?: string;\n    /** center content */\n    center?: ReactElement;\n    /** center container class name */\n    centerClassName?: string;\n    /** minimal width for navigation bar */\n    minWidth?: number;\n    /** main navigation items */\n    items?: HeaderNavigationItemData[];\n    /** main navigation overflow items */\n    itemsOverflow?: HeaderNavigationItemData[];\n    /** props for main items overflow component */\n    overflow?: HeaderNavigationOverflowProps;\n}\n\nexport const HeaderNavigationStacked: FC<HeaderNavigationStackedProps> = ({\n    className,\n    id,\n    items,\n    itemsOverflow,\n    left,\n    leftClassName,\n    right,\n    rightClassName,\n    center,\n    centerClassName,\n    minWidth = 800,\n    overflow,\n}) => {\n    const bottomRef = useRef<HTMLDivElement>(null);\n    const navigationRef = useRef<HTMLDivElement>(null);\n    const forceUpdate = useForceUpdate();\n    const [minimized, setMinimized] = useState(MinimizedState.Calculating);\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    useEffect(() => {\n        setMinimized(MinimizedState.Calculating);\n        forceUpdate();\n    }, [items, itemsOverflow, forceUpdate]);\n\n    const updateIsMinimized = () => {\n        if (bottomRef.current && navigationRef.current) {\n            if (navigationRef.current.clientWidth + 16 > bottomRef.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    return (\n        <NavigationLegacyContext.Provider value>\n            <div\n                className={classNames(\n                    Styles.headerStacked,\n                    {\n                        [Styles.calculating]: minimized === MinimizedState.Calculating,\n                    },\n                    className\n                )}\n                style={{ minWidth: `${minWidth}px` }}\n                id={id}\n                data-cy=\"header-navigation\"\n            >\n                <div\n                    className={classNames(Styles.heTopLeft, leftClassName)}\n                    data-cy=\"navigation-left\"\n                >\n                    {left}\n                </div>\n                <div\n                    className={classNames(Styles.heTopCenter, centerClassName)}\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                    {right}\n                </div>\n                <div\n                    ref={bottomRef}\n                    className={classNames(\n                        Styles.heBottom,\n                        'd-if flex-grow-1 flex-basis-0 justify-content-center',\n                        Styles.center\n                    )}\n                    data-cy=\"navigation-items\"\n                >\n                    <div ref={navigationRef} className={classNames('d-if')}>\n                        {items?.map(item => (\n                            <HeaderNavigationItem\n                                {...item}\n                                minimized={minimized === MinimizedState.Minimized}\n                                main\n                                key={item.id}\n                            />\n                        ))}\n                        {!!itemsOverflow?.length && (\n                            <HeaderNavigationOverflow items={itemsOverflow} overflow={overflow} />\n                        )}\n                    </div>\n                </div>\n            </div>\n        </NavigationLegacyContext.Provider>\n    );\n};\n"],"names":["Icon","Popover","classNames","useCallback","useEffect","useRef","useState","NavigationLegacyContext","HeaderNavigationItem","Styles","useForceUpdate","setTick","tick","HeaderNavigationOverflow","items","overflow","isOpen","setIsOpen","open","trigger","name","size","className","onClick","color","data-cy","data-pendo","direction","width","portal","onClickOutside","wrapperClassName","popoverContentClassName","overflowPopover","div","navigationOverflow","map","item","key","id","minimized","main","MinimizedState","HeaderNavigation","children","itemsOverflow","left","leftClassName","rightClassName","minWidth","leftRef","rightRef","centerRef","navigationRef","forceUpdate","setMinimized","handleResize","window","addEventListener","removeEventListener","updateIsMinimized","current","clientWidth","Provider","value","header","calculating","style","ref","center","length","right","HeaderNavigationStacked","centerClassName","bottomRef","headerStacked","heTopLeft","heTopCenter","heTopRight","heBottom"],"mappings":"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"}