@servicetitan/navigation 13.0.0-canary.256.5761ed1.0 → 13.0.0-canary.256.6f02f8b.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.
- package/dist/components/titan-layout/interface.d.ts +1 -1
- package/dist/components/titan-layout/interface.d.ts.map +1 -1
- package/dist/components/titan-layout/interface.js.map +1 -1
- package/dist/components/titan-layout/layout-sidebar-links-internal.d.ts +4 -10
- package/dist/components/titan-layout/layout-sidebar-links-internal.d.ts.map +1 -1
- package/dist/components/titan-layout/layout-sidebar-links-internal.js +50 -53
- package/dist/components/titan-layout/layout-sidebar-links-internal.js.map +1 -1
- package/dist/components/titan-layout/layout-sidebar-links.d.ts.map +1 -1
- package/dist/components/titan-layout/layout-sidebar-links.js +2 -4
- package/dist/components/titan-layout/layout-sidebar-links.js.map +1 -1
- package/dist/components/titan-layout/layout-sidebar.d.ts +1 -1
- package/dist/components/titan-layout/layout-sidebar.d.ts.map +1 -1
- package/dist/components/titan-layout/layout-sidebar.js +2 -4
- package/dist/components/titan-layout/layout-sidebar.js.map +1 -1
- package/dist/components/titan-layout/layout-sidebar.module.less +66 -22
- package/dist/components/titan-layout/titan-layout-default.stories.d.ts.map +1 -1
- package/dist/components/titan-layout/titan-layout.d.ts.map +1 -1
- package/dist/components/titan-layout/titan-layout.js +9 -5
- package/dist/components/titan-layout/titan-layout.js.map +1 -1
- package/package.json +2 -2
- package/src/components/titan-layout/interface.ts +1 -1
- package/src/components/titan-layout/layout-sidebar-links-internal.tsx +37 -54
- package/src/components/titan-layout/layout-sidebar-links.tsx +0 -2
- package/src/components/titan-layout/layout-sidebar.module.less +66 -22
- package/src/components/titan-layout/layout-sidebar.tsx +5 -5
- package/src/components/titan-layout/titan-layout-default.stories.tsx +9 -4
- package/src/components/titan-layout/titan-layout.tsx +5 -3
|
@@ -10,7 +10,7 @@ export interface TitanLayoutLinkWrapperProps {
|
|
|
10
10
|
export type TitanLayoutLinkWrapper = FC<TitanLayoutLinkWrapperProps>;
|
|
11
11
|
export interface TitanLayoutState {
|
|
12
12
|
navCollapsed: boolean;
|
|
13
|
-
|
|
13
|
+
submenusExpanded?: string[];
|
|
14
14
|
}
|
|
15
15
|
export interface TitanLayoutLinkExtraProps {
|
|
16
16
|
showTitle?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interface.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/interface.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,wBAAwB,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1E,OAAO,EAAE,6BAA6B,EAAE,MAAM,kBAAkB,CAAC;AAEjE,MAAM,WAAW,2BAA2B;IACxC,QAAQ,EAAE,SAAS,CAAC;IACpB,OAAO,EAAE,6BAA6B,CAAC;IACvC,QAAQ,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,MAAM,sBAAsB,GAAG,EAAE,CAAC,2BAA2B,CAAC,CAAC;AAErE,MAAM,WAAW,gBAAgB;IAC7B,YAAY,EAAE,OAAO,CAAC;IACtB,
|
|
1
|
+
{"version":3,"file":"interface.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/interface.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,wBAAwB,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1E,OAAO,EAAE,6BAA6B,EAAE,MAAM,kBAAkB,CAAC;AAEjE,MAAM,WAAW,2BAA2B;IACxC,QAAQ,EAAE,SAAS,CAAC;IACpB,OAAO,EAAE,6BAA6B,CAAC;IACvC,QAAQ,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,MAAM,sBAAsB,GAAG,EAAE,CAAC,2BAA2B,CAAC,CAAC;AAErE,MAAM,WAAW,gBAAgB;IAC7B,YAAY,EAAE,OAAO,CAAC;IACtB,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;CAC/B;AAED,MAAM,WAAW,yBAAyB;IACtC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,WAAW,wBAAwB;IACrC,OAAO,EAAE,eAAe,CAAC;CAC5B;AAED,MAAM,MAAM,oBAAoB,GAAG;IAC/B,cAAc;IACd,EAAE,EAAE,MAAM,CAAC;IACX,gBAAgB;IAChB,EAAE,EAAE,MAAM,CAAC;IACX,iBAAiB;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,+FAA+F;IAC/F,QAAQ,CAAC,EAAE,OAAO,GAAG,CAAC,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,CAAC;IACrD,yCAAyC;IACzC,IAAI,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC;IACnC,uCAAuC;IACvC,UAAU,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC;IACzC,kFAAkF;IAClF,GAAG,CAAC,EAAE,cAAc,CAAC;IACrB,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,qCAAqC;IACrC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,+DAA+D;IAC/D,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,mCAAmC;IACnC,KAAK,CAAC,EAAE,yBAAyB,CAAC;IAClC,uDAAuD;IACvD,IAAI,CAAC,EAAE,wBAAwB,CAAC;CACnC,GAAG,IAAI,CAAC,wBAAwB,CAAC,GAAG,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,CAAC;AAE9D,MAAM,MAAM,uBAAuB,GAAG;IAClC,cAAc;IACd,EAAE,EAAE,MAAM,CAAC;IACX,iBAAiB;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,mBAAmB;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,yCAAyC;IACzC,IAAI,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC;IACnC,uCAAuC;IACvC,UAAU,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC;IACzC,kFAAkF;IAClF,GAAG,CAAC,EAAE,cAAc,CAAC;IACrB,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,qCAAqC;IACrC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,+DAA+D;IAC/D,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,mCAAmC;IACnC,KAAK,CAAC,EAAE,yBAAyB,CAAC;IAClC,kDAAkD;IAClD,IAAI,CAAC,EAAE,wBAAwB,CAAC;CACnC,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/titan-layout/interface.ts"],"sourcesContent":["import { IconProps } from '@servicetitan/anvil2';\nimport { ComponentPropsWithoutRef, FC, ReactNode } from 'react';\nimport { CounterTagData, CounterTagValue } from '../../utils/counter-tag';\nimport { TitanLayoutSidebarContextType } from './layout-context';\n\nexport interface TitanLayoutLinkWrapperProps {\n children: ReactNode;\n context: TitanLayoutSidebarContextType;\n isMobile: boolean;\n}\n\nexport type TitanLayoutLinkWrapper = FC<TitanLayoutLinkWrapperProps>;\n\nexport interface TitanLayoutState {\n navCollapsed: boolean;\n
|
|
1
|
+
{"version":3,"sources":["../../../src/components/titan-layout/interface.ts"],"sourcesContent":["import { IconProps } from '@servicetitan/anvil2';\nimport { ComponentPropsWithoutRef, FC, ReactNode } from 'react';\nimport { CounterTagData, CounterTagValue } from '../../utils/counter-tag';\nimport { TitanLayoutSidebarContextType } from './layout-context';\n\nexport interface TitanLayoutLinkWrapperProps {\n children: ReactNode;\n context: TitanLayoutSidebarContextType;\n isMobile: boolean;\n}\n\nexport type TitanLayoutLinkWrapper = FC<TitanLayoutLinkWrapperProps>;\n\nexport interface TitanLayoutState {\n navCollapsed: boolean;\n submenusExpanded?: string[];\n}\n\nexport interface TitanLayoutLinkExtraProps {\n showTitle?: boolean;\n flashing?: boolean;\n}\n\nexport interface TitanLayoutLinkSideProps {\n counter: CounterTagValue;\n}\n\nexport type TitanLayoutLinkProps = {\n /** link id */\n id: string;\n /** link href */\n to: string;\n /** link title */\n title: string;\n /** callback to return active state. By default, it compares link href with current pathname */\n isActive?: boolean | ((pathname: string) => boolean);\n /** svg icon (anvil2) of inactive item */\n icon: IconProps['svg'] | undefined;\n /** svg icon (anvil2) of active item */\n iconActive: IconProps['svg'] | undefined;\n /** item tag (optional). shown if it is set and value is true or greater than 0 */\n tag?: CounterTagData;\n counter?: CounterTagValue;\n /** class name of link item */\n className?: string;\n\n /** tooltip text (for extra links) */\n tooltip?: string;\n /** wrapper component for link element (used for side links) */\n wrapper?: TitanLayoutLinkWrapper;\n /** props for extra link element */\n extra?: TitanLayoutLinkExtraProps;\n /** props for side nav link element (mobile version) */\n side?: TitanLayoutLinkSideProps;\n} & Omit<ComponentPropsWithoutRef<'a'>, 'children' | 'title'>;\n\nexport type TitanLayoutTriggerProps = {\n /** link id */\n id: string;\n /** link title */\n title: string;\n /** active state */\n isActive?: boolean;\n /** svg icon (anvil2) of inactive item */\n icon: IconProps['svg'] | undefined;\n /** svg icon (anvil2) of active item */\n iconActive: IconProps['svg'] | undefined;\n /** item tag (optional). shown if it is set and value is true or greater than 0 */\n tag?: CounterTagData;\n counter?: CounterTagValue;\n /** class name of link item */\n className?: string;\n\n /** tooltip text (for extra links) */\n tooltip?: string;\n /** wrapper component for link element (used for side links) */\n wrapper?: TitanLayoutLinkWrapper;\n /** props for extra link element */\n extra?: TitanLayoutLinkExtraProps;\n /** props for nav link element (mobile version) */\n side?: TitanLayoutLinkSideProps;\n} & Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'>;\n"],"names":[],"mappings":"AAwDA,WAyBgE"}
|
|
@@ -1,14 +1,12 @@
|
|
|
1
1
|
import { IconProps } from '@servicetitan/anvil2';
|
|
2
|
-
import { FC, MouseEvent, ReactNode } from 'react';
|
|
2
|
+
import { ComponentPropsWithoutRef, FC, MouseEvent, ReactNode } from 'react';
|
|
3
3
|
import { BadgeTagProps } from '../badge-tag';
|
|
4
4
|
import { NavigationComponentProps } from './interface-internal';
|
|
5
5
|
export interface InternalSideNavigationItemContentProps {
|
|
6
6
|
icon: IconProps['svg'] | undefined;
|
|
7
7
|
iconActive: IconProps['svg'] | undefined;
|
|
8
8
|
title: string;
|
|
9
|
-
submenuExpanded: boolean | undefined;
|
|
10
9
|
tag: BadgeTagProps | undefined;
|
|
11
|
-
onExpandToggle?: (e: MouseEvent<never>) => void;
|
|
12
10
|
}
|
|
13
11
|
/** Side Navigation menu item (for internal usage) */
|
|
14
12
|
export declare const InternalSideNavigationLink: FC<NavigationComponentProps & {
|
|
@@ -20,9 +18,7 @@ export declare const InternalSideNavigationLink: FC<NavigationComponentProps & {
|
|
|
20
18
|
iconActive: IconProps['svg'] | undefined;
|
|
21
19
|
className: string | undefined;
|
|
22
20
|
tag: BadgeTagProps | undefined;
|
|
23
|
-
|
|
24
|
-
onExpandToggle?: (e: MouseEvent<never>) => void;
|
|
25
|
-
}>;
|
|
21
|
+
} & Omit<ComponentPropsWithoutRef<'a'>, 'children' | 'title'>>;
|
|
26
22
|
/** Side Navigation menu trigger (for internal usage) */
|
|
27
23
|
export declare const InternalSideNavigationTrigger: FC<{
|
|
28
24
|
id: string;
|
|
@@ -31,11 +27,9 @@ export declare const InternalSideNavigationTrigger: FC<{
|
|
|
31
27
|
icon: IconProps['svg'] | undefined;
|
|
32
28
|
iconActive: IconProps['svg'] | undefined;
|
|
33
29
|
className: string | undefined;
|
|
34
|
-
submenuExpanded: boolean | undefined;
|
|
35
30
|
tag: BadgeTagProps | undefined;
|
|
36
31
|
onClick?: (e: MouseEvent<never>) => void;
|
|
37
|
-
|
|
38
|
-
}>;
|
|
32
|
+
} & Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'>>;
|
|
39
33
|
export declare const InternalSideNavigationGroupLink: FC<NavigationComponentProps & {
|
|
40
34
|
id: string;
|
|
41
35
|
to: string;
|
|
@@ -65,7 +59,7 @@ export declare const InternalSideNavigationGroup: FC<NavigationComponentProps &
|
|
|
65
59
|
tag: BadgeTagProps | undefined;
|
|
66
60
|
children: ReactNode;
|
|
67
61
|
submenuExpanded: boolean;
|
|
68
|
-
onExpandToggle?: (e: MouseEvent<never>) => void;
|
|
69
62
|
onClick?: (e: MouseEvent<never>) => void;
|
|
63
|
+
onExpandToggle(e: MouseEvent<never>): void;
|
|
70
64
|
}>;
|
|
71
65
|
//# sourceMappingURL=layout-sidebar-links-internal.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layout-sidebar-links-internal.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-sidebar-links-internal.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"layout-sidebar-links-internal.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-sidebar-links-internal.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { Icon } from '@servicetitan/anvil2';
|
|
2
|
+
import { Button, Icon } from '@servicetitan/anvil2';
|
|
3
3
|
import SvgGroupCollapse from '@servicetitan/anvil2/assets/icons/material/round/expand_less.svg';
|
|
4
4
|
import SvgGroupExpand from '@servicetitan/anvil2/assets/icons/material/round/expand_more.svg';
|
|
5
5
|
import classNames from 'classnames';
|
|
6
6
|
import { Fragment } from 'react';
|
|
7
7
|
import { BadgeTag } from '../badge-tag';
|
|
8
8
|
import * as Styles from './layout-sidebar.module.less';
|
|
9
|
-
const InternalSideNavigationItemContent = ({ icon, iconActive, tag, title
|
|
9
|
+
const InternalSideNavigationItemContent = ({ icon, iconActive, tag, title })=>/*#__PURE__*/ _jsxs(Fragment, {
|
|
10
10
|
children: [
|
|
11
11
|
/*#__PURE__*/ _jsxs("div", {
|
|
12
12
|
className: Styles.navItemIconWrapper,
|
|
@@ -28,21 +28,6 @@ const InternalSideNavigationItemContent = ({ icon, iconActive, tag, title, subme
|
|
|
28
28
|
data: tag,
|
|
29
29
|
className: Styles.navItemCounter,
|
|
30
30
|
longClassName: Styles.navItemCounterLong
|
|
31
|
-
}),
|
|
32
|
-
typeof submenuExpanded === 'boolean' && /*#__PURE__*/ _jsxs("div", {
|
|
33
|
-
className: Styles.navItemGroupToggleWrapper,
|
|
34
|
-
children: [
|
|
35
|
-
/*#__PURE__*/ _jsx(Icon, {
|
|
36
|
-
svg: submenuExpanded ? SvgGroupCollapse : SvgGroupExpand,
|
|
37
|
-
className: Styles.navItemGroupToggle,
|
|
38
|
-
onClick: onExpandToggle
|
|
39
|
-
}),
|
|
40
|
-
/*#__PURE__*/ _jsx("div", {
|
|
41
|
-
className: Styles.navItemGroupToggleClick,
|
|
42
|
-
"data-cy": "nav-item-group-expand",
|
|
43
|
-
onClick: onExpandToggle
|
|
44
|
-
})
|
|
45
|
-
]
|
|
46
31
|
})
|
|
47
32
|
]
|
|
48
33
|
}),
|
|
@@ -55,7 +40,7 @@ const InternalSideNavigationItemContent = ({ icon, iconActive, tag, title, subme
|
|
|
55
40
|
})
|
|
56
41
|
]
|
|
57
42
|
});
|
|
58
|
-
/** Side Navigation menu item (for internal usage) */ export const InternalSideNavigationLink = ({ id, to, title, isActive, icon, iconActive, className, tag, navigationComponent: NavigationComponent,
|
|
43
|
+
/** Side Navigation menu item (for internal usage) */ export const InternalSideNavigationLink = ({ id, to, title, isActive, icon, iconActive, className, tag, navigationComponent: NavigationComponent, ...rest })=>{
|
|
59
44
|
return /*#__PURE__*/ _jsx(NavigationComponent, {
|
|
60
45
|
"data-cy": `navigation-item-${id}`,
|
|
61
46
|
"data-pendo": `navigation-item-${id}`,
|
|
@@ -70,14 +55,12 @@ const InternalSideNavigationItemContent = ({ icon, iconActive, tag, title, subme
|
|
|
70
55
|
children: /*#__PURE__*/ _jsx(InternalSideNavigationItemContent, {
|
|
71
56
|
icon: icon,
|
|
72
57
|
iconActive: iconActive,
|
|
73
|
-
submenuExpanded: submenuExpanded,
|
|
74
|
-
onExpandToggle: onExpandToggle,
|
|
75
58
|
title: title,
|
|
76
59
|
tag: tag
|
|
77
60
|
})
|
|
78
61
|
});
|
|
79
62
|
};
|
|
80
|
-
/** Side Navigation menu trigger (for internal usage) */ export const InternalSideNavigationTrigger = ({ id, title, isActive, icon, iconActive, className,
|
|
63
|
+
/** Side Navigation menu trigger (for internal usage) */ export const InternalSideNavigationTrigger = ({ id, title, isActive, icon, iconActive, className, tag, ...rest })=>{
|
|
81
64
|
return /*#__PURE__*/ _jsx("div", {
|
|
82
65
|
"data-cy": `navigation-item-${id}`,
|
|
83
66
|
"data-pendo": `navigation-item-${id}`,
|
|
@@ -88,8 +71,6 @@ const InternalSideNavigationItemContent = ({ icon, iconActive, tag, title, subme
|
|
|
88
71
|
[Styles.navItemIconSwitch]: !!icon && !!iconActive
|
|
89
72
|
}),
|
|
90
73
|
children: /*#__PURE__*/ _jsx(InternalSideNavigationItemContent, {
|
|
91
|
-
submenuExpanded: submenuExpanded,
|
|
92
|
-
onExpandToggle: onExpandToggle,
|
|
93
74
|
icon: icon,
|
|
94
75
|
iconActive: iconActive,
|
|
95
76
|
title: title,
|
|
@@ -119,16 +100,15 @@ export const InternalSideNavigationGroupLink = ({ id, to, title, isActive, class
|
|
|
119
100
|
]
|
|
120
101
|
}, id);
|
|
121
102
|
};
|
|
122
|
-
export const InternalSideNavigationGroupTrigger = ({ id, title, isActive, className, tag,
|
|
103
|
+
export const InternalSideNavigationGroupTrigger = ({ id, title, isActive, className, tag, ...rest })=>{
|
|
123
104
|
return /*#__PURE__*/ _jsxs("div", {
|
|
124
105
|
"data-cy": `navigation-item-${id}`,
|
|
125
106
|
"data-pendo": `navigation-item-${id}`,
|
|
126
107
|
...rest,
|
|
127
108
|
className: classNames(Styles.submenuItem, {
|
|
128
|
-
[Styles.submenuLink]: !!onClick,
|
|
109
|
+
[Styles.submenuLink]: !!rest.onClick,
|
|
129
110
|
[Styles.submenuLinkActive]: isActive === true
|
|
130
111
|
}),
|
|
131
|
-
onClick: onClick,
|
|
132
112
|
children: [
|
|
133
113
|
/*#__PURE__*/ _jsx("span", {
|
|
134
114
|
children: title
|
|
@@ -146,37 +126,54 @@ export const InternalSideNavigationGroupDivider = ()=>{
|
|
|
146
126
|
});
|
|
147
127
|
};
|
|
148
128
|
export const InternalSideNavigationGroup = ({ id, to, title, isActive, icon, iconActive, className, tag, children, submenuExpanded, onExpandToggle, onClick, navigationComponent, ...rest })=>{
|
|
129
|
+
const onRootClickCapture = (e)=>{
|
|
130
|
+
if (!submenuExpanded) {
|
|
131
|
+
onExpandToggle === null || onExpandToggle === void 0 ? void 0 : onExpandToggle(e);
|
|
132
|
+
e.preventDefault();
|
|
133
|
+
e.stopPropagation();
|
|
134
|
+
}
|
|
135
|
+
};
|
|
149
136
|
return /*#__PURE__*/ _jsxs("div", {
|
|
150
137
|
className: classNames(Styles.navGroupWrapper),
|
|
151
138
|
children: [
|
|
152
|
-
/*#__PURE__*/
|
|
139
|
+
/*#__PURE__*/ _jsxs("div", {
|
|
153
140
|
className: Styles.navGroupItem,
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
to
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
141
|
+
onClickCapture: onRootClickCapture,
|
|
142
|
+
children: [
|
|
143
|
+
to ? /*#__PURE__*/ _jsx(InternalSideNavigationLink, {
|
|
144
|
+
id: id,
|
|
145
|
+
to: to,
|
|
146
|
+
title: title,
|
|
147
|
+
isActive: isActive,
|
|
148
|
+
icon: icon,
|
|
149
|
+
iconActive: iconActive,
|
|
150
|
+
tag: tag,
|
|
151
|
+
className: className,
|
|
152
|
+
...rest,
|
|
153
|
+
navigationComponent: navigationComponent
|
|
154
|
+
}) : /*#__PURE__*/ _jsx(InternalSideNavigationTrigger, {
|
|
155
|
+
id: id,
|
|
156
|
+
title: title,
|
|
157
|
+
isActive: isActive === true || undefined,
|
|
158
|
+
icon: icon,
|
|
159
|
+
iconActive: iconActive,
|
|
160
|
+
tag: tag,
|
|
161
|
+
className: className,
|
|
162
|
+
...rest
|
|
163
|
+
}),
|
|
164
|
+
/*#__PURE__*/ _jsx("div", {
|
|
165
|
+
className: Styles.navItemGroupToggleWrapper,
|
|
166
|
+
children: /*#__PURE__*/ _jsx(Button, {
|
|
167
|
+
appearance: "secondary",
|
|
168
|
+
size: "small",
|
|
169
|
+
icon: submenuExpanded ? SvgGroupCollapse : SvgGroupExpand,
|
|
170
|
+
className: Styles.navItemGroupToggle,
|
|
171
|
+
onClick: onExpandToggle,
|
|
172
|
+
"aria-label": "Toggle submenu",
|
|
173
|
+
"data-cy": "nav-item-group-expand"
|
|
174
|
+
})
|
|
175
|
+
})
|
|
176
|
+
]
|
|
180
177
|
}),
|
|
181
178
|
/*#__PURE__*/ _jsx("div", {
|
|
182
179
|
className: classNames(Styles.submenuWrapper, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/titan-layout/layout-sidebar-links-internal.tsx"],"sourcesContent":["import { Icon, IconProps } from '@servicetitan/anvil2';\nimport SvgGroupCollapse from '@servicetitan/anvil2/assets/icons/material/round/expand_less.svg';\nimport SvgGroupExpand from '@servicetitan/anvil2/assets/icons/material/round/expand_more.svg';\nimport classNames from 'classnames';\nimport { FC, Fragment, MouseEvent, ReactNode } from 'react';\n\nimport { BadgeTag, BadgeTagProps } from '../badge-tag';\nimport { NavigationComponentProps } from './interface-internal';\nimport * as Styles from './layout-sidebar.module.less';\n\nexport interface InternalSideNavigationItemContentProps {\n icon: IconProps['svg'] | undefined;\n iconActive: IconProps['svg'] | undefined;\n title: string;\n submenuExpanded: boolean | undefined;\n tag: BadgeTagProps | undefined;\n onExpandToggle?: (e: MouseEvent<never>) => void;\n}\n\nconst InternalSideNavigationItemContent: FC<InternalSideNavigationItemContentProps> = ({\n icon,\n iconActive,\n tag,\n title,\n submenuExpanded,\n onExpandToggle,\n}) => (\n <Fragment>\n <div className={Styles.navItemIconWrapper}>\n {icon && (\n <Icon svg={icon} className={classNames(Styles.navIcon, Styles.navIconInactive)} />\n )}\n {iconActive && (\n <Icon\n svg={iconActive}\n className={classNames(Styles.navIcon, Styles.navIconActive)}\n />\n )}\n\n <div className={Styles.navItemTextExpanded} data-cy=\"nav-item-label\">\n {title}\n </div>\n {!!tag && (\n <BadgeTag\n data={tag}\n className={Styles.navItemCounter}\n longClassName={Styles.navItemCounterLong}\n />\n )}\n {typeof submenuExpanded === 'boolean' && (\n <div className={Styles.navItemGroupToggleWrapper}>\n <Icon\n svg={submenuExpanded ? SvgGroupCollapse : SvgGroupExpand}\n className={Styles.navItemGroupToggle}\n onClick={onExpandToggle}\n />\n <div\n className={Styles.navItemGroupToggleClick}\n data-cy=\"nav-item-group-expand\"\n onClick={onExpandToggle}\n />\n </div>\n )}\n </div>\n\n <div\n className={classNames(Styles.navItemTextCollapsed, {\n [Styles.navItemTextSmall]: !!title && title.length >= 10,\n })}\n data-cy=\"nav-item-label\"\n >\n {title}\n </div>\n </Fragment>\n);\n\n/** Side Navigation menu item (for internal usage) */\nexport const InternalSideNavigationLink: FC<\n NavigationComponentProps & {\n id: string;\n to: string;\n title: string;\n isActive: boolean | ((pathname: string) => boolean) | undefined;\n icon: IconProps['svg'] | undefined;\n iconActive: IconProps['svg'] | undefined;\n className: string | undefined;\n tag: BadgeTagProps | undefined;\n\n submenuExpanded: boolean | undefined;\n onExpandToggle?: (e: MouseEvent<never>) => void;\n }\n> = ({\n id,\n to,\n title,\n isActive,\n icon,\n iconActive,\n className,\n tag,\n\n navigationComponent: NavigationComponent,\n submenuExpanded,\n onExpandToggle,\n ...rest\n}) => {\n return (\n <NavigationComponent\n data-cy={`navigation-item-${id}`}\n data-pendo={`navigation-item-${id}`}\n {...rest}\n className={classNames(Styles.navItem, Styles.navLink, className, {\n [Styles.navItemActive]: isActive === true,\n [Styles.navItemIconSwitch]: !!icon && !!iconActive,\n })}\n to={to}\n isActive={typeof isActive === 'function' ? isActive : undefined}\n activeClassName={Styles.navItemActive}\n >\n <InternalSideNavigationItemContent\n icon={icon}\n iconActive={iconActive}\n submenuExpanded={submenuExpanded}\n onExpandToggle={onExpandToggle}\n title={title}\n tag={tag}\n />\n </NavigationComponent>\n );\n};\n\n/** Side Navigation menu trigger (for internal usage) */\nexport const InternalSideNavigationTrigger: FC<{\n id: string;\n title: string;\n isActive: boolean | undefined;\n icon: IconProps['svg'] | undefined;\n iconActive: IconProps['svg'] | undefined;\n className: string | undefined;\n\n submenuExpanded: boolean | undefined;\n tag: BadgeTagProps | undefined;\n onClick?: (e: MouseEvent<never>) => void;\n onExpandToggle?: (e: MouseEvent<never>) => void;\n}> = ({\n id,\n title,\n isActive,\n icon,\n iconActive,\n className,\n\n submenuExpanded,\n tag,\n onExpandToggle,\n ...rest\n}) => {\n return (\n <div\n data-cy={`navigation-item-${id}`}\n data-pendo={`navigation-item-${id}`}\n {...rest}\n className={classNames(Styles.navItem, className, {\n [Styles.navLink]: !!rest.onClick,\n [Styles.navItemActive]: isActive === true,\n [Styles.navItemIconSwitch]: !!icon && !!iconActive,\n })}\n >\n <InternalSideNavigationItemContent\n submenuExpanded={submenuExpanded}\n onExpandToggle={onExpandToggle}\n icon={icon}\n iconActive={iconActive}\n title={title}\n tag={tag}\n />\n </div>\n );\n};\n\nexport const InternalSideNavigationGroupLink: FC<\n NavigationComponentProps & {\n id: string;\n to: string;\n title: string;\n isActive: boolean | ((pathname: string) => boolean) | undefined;\n className: string | undefined;\n tag: BadgeTagProps | undefined;\n\n parentId: string;\n }\n> = ({\n id,\n to,\n title,\n isActive,\n className,\n tag,\n\n parentId,\n navigationComponent: NavigationComponent,\n ...rest\n}) => {\n return (\n <NavigationComponent\n key={id}\n data-cy={`navigation-item-${parentId}--${id}`}\n data-pendo={`navigation-item-${parentId}--${id}`}\n {...rest}\n to={to}\n className={classNames(Styles.submenuItem, Styles.submenuLink, className, {\n [Styles.submenuLinkActive]: isActive === true,\n })}\n isActive={typeof isActive === 'function' ? isActive : undefined}\n activeClassName={Styles.submenuLinkActive}\n >\n <span>{title}</span>\n <BadgeTag data={tag} className={Styles.submenuLinkCounter} />\n </NavigationComponent>\n );\n};\n\nexport const InternalSideNavigationGroupTrigger: FC<{\n id: string;\n title: string;\n isActive: boolean | ((pathname: string) => boolean) | undefined;\n className: string | undefined;\n tag: BadgeTagProps | undefined;\n\n onClick?: (e: MouseEvent<any>) => void;\n}> = ({\n id,\n title,\n isActive,\n className,\n tag,\n\n onClick,\n ...rest\n}) => {\n return (\n <div\n data-cy={`navigation-item-${id}`}\n data-pendo={`navigation-item-${id}`}\n key={id}\n {...rest}\n className={classNames(Styles.submenuItem, {\n [Styles.submenuLink]: !!onClick,\n [Styles.submenuLinkActive]: isActive === true,\n })}\n onClick={onClick}\n >\n <span>{title}</span>\n <BadgeTag data={tag} className={Styles.submenuLinkCounter} />\n </div>\n );\n};\n\nexport const InternalSideNavigationGroupDivider = () => {\n return <div className={Styles.divider} />;\n};\n\nexport const InternalSideNavigationGroup: FC<\n NavigationComponentProps & {\n id: string;\n to: string | undefined;\n title: string;\n isActive: boolean | ((pathname: string) => boolean) | undefined;\n icon: IconProps['svg'] | undefined;\n iconActive: IconProps['svg'] | undefined;\n className: string | undefined;\n tag: BadgeTagProps | undefined;\n\n children: ReactNode;\n submenuExpanded: boolean;\n onExpandToggle?: (e: MouseEvent<never>) => void;\n onClick?: (e: MouseEvent<never>) => void;\n }\n> = ({\n id,\n to,\n title,\n isActive,\n icon,\n iconActive,\n className,\n tag,\n\n children,\n submenuExpanded,\n onExpandToggle,\n onClick,\n navigationComponent,\n ...rest\n}) => {\n return (\n <div className={classNames(Styles.navGroupWrapper)}>\n <div className={Styles.navGroupItem}>\n {to ? (\n <InternalSideNavigationLink\n id={id}\n to={to}\n title={title}\n isActive={isActive}\n icon={icon}\n iconActive={iconActive}\n tag={tag}\n className={className}\n {...rest}\n submenuExpanded={submenuExpanded}\n onExpandToggle={onExpandToggle}\n navigationComponent={navigationComponent}\n />\n ) : (\n <InternalSideNavigationTrigger\n id={id}\n title={title}\n isActive={isActive === true || undefined}\n icon={icon}\n iconActive={iconActive}\n tag={tag}\n className={className}\n {...rest}\n submenuExpanded={submenuExpanded}\n onExpandToggle={onExpandToggle}\n onClick={onClick}\n />\n )}\n </div>\n <div\n className={classNames(Styles.submenuWrapper, {\n [Styles.submenuWrapperCollapsed]: !submenuExpanded,\n })}\n data-cy={`navigation-submenu-${id}`}\n >\n <div className={Styles.submenu}>{children}</div>\n </div>\n </div>\n );\n};\n"],"names":["Icon","SvgGroupCollapse","SvgGroupExpand","classNames","Fragment","BadgeTag","Styles","InternalSideNavigationItemContent","icon","iconActive","tag","title","submenuExpanded","onExpandToggle","div","className","navItemIconWrapper","svg","navIcon","navIconInactive","navIconActive","navItemTextExpanded","data-cy","data","navItemCounter","longClassName","navItemCounterLong","navItemGroupToggleWrapper","navItemGroupToggle","onClick","navItemGroupToggleClick","navItemTextCollapsed","navItemTextSmall","length","InternalSideNavigationLink","id","to","isActive","navigationComponent","NavigationComponent","rest","data-pendo","navItem","navLink","navItemActive","navItemIconSwitch","undefined","activeClassName","InternalSideNavigationTrigger","InternalSideNavigationGroupLink","parentId","submenuItem","submenuLink","submenuLinkActive","span","submenuLinkCounter","InternalSideNavigationGroupTrigger","InternalSideNavigationGroupDivider","divider","InternalSideNavigationGroup","children","navGroupWrapper","navGroupItem","submenuWrapper","submenuWrapperCollapsed","submenu"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/titan-layout/layout-sidebar-links-internal.tsx"],"sourcesContent":["import { Button, Icon, IconProps } from '@servicetitan/anvil2';\nimport SvgGroupCollapse from '@servicetitan/anvil2/assets/icons/material/round/expand_less.svg';\nimport SvgGroupExpand from '@servicetitan/anvil2/assets/icons/material/round/expand_more.svg';\nimport classNames from 'classnames';\nimport { ComponentPropsWithoutRef, FC, Fragment, MouseEvent, ReactNode } from 'react';\n\nimport { BadgeTag, BadgeTagProps } from '../badge-tag';\nimport { NavigationComponentProps } from './interface-internal';\nimport * as Styles from './layout-sidebar.module.less';\n\nexport interface InternalSideNavigationItemContentProps {\n icon: IconProps['svg'] | undefined;\n iconActive: IconProps['svg'] | undefined;\n title: string;\n tag: BadgeTagProps | undefined;\n}\n\nconst InternalSideNavigationItemContent: FC<InternalSideNavigationItemContentProps> = ({\n icon,\n iconActive,\n tag,\n title,\n}) => (\n <Fragment>\n <div className={Styles.navItemIconWrapper}>\n {icon && (\n <Icon svg={icon} className={classNames(Styles.navIcon, Styles.navIconInactive)} />\n )}\n {iconActive && (\n <Icon\n svg={iconActive}\n className={classNames(Styles.navIcon, Styles.navIconActive)}\n />\n )}\n\n <div className={Styles.navItemTextExpanded} data-cy=\"nav-item-label\">\n {title}\n </div>\n {!!tag && (\n <BadgeTag\n data={tag}\n className={Styles.navItemCounter}\n longClassName={Styles.navItemCounterLong}\n />\n )}\n </div>\n\n <div\n className={classNames(Styles.navItemTextCollapsed, {\n [Styles.navItemTextSmall]: !!title && title.length >= 10,\n })}\n data-cy=\"nav-item-label\"\n >\n {title}\n </div>\n </Fragment>\n);\n\n/** Side Navigation menu item (for internal usage) */\nexport const InternalSideNavigationLink: FC<\n NavigationComponentProps & {\n id: string;\n to: string;\n title: string;\n isActive: boolean | ((pathname: string) => boolean) | undefined;\n icon: IconProps['svg'] | undefined;\n iconActive: IconProps['svg'] | undefined;\n className: string | undefined;\n tag: BadgeTagProps | undefined;\n } & Omit<ComponentPropsWithoutRef<'a'>, 'children' | 'title'>\n> = ({\n id,\n to,\n title,\n isActive,\n icon,\n iconActive,\n className,\n tag,\n\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 className={classNames(Styles.navItem, Styles.navLink, className, {\n [Styles.navItemActive]: isActive === true,\n [Styles.navItemIconSwitch]: !!icon && !!iconActive,\n })}\n to={to}\n isActive={typeof isActive === 'function' ? isActive : undefined}\n activeClassName={Styles.navItemActive}\n >\n <InternalSideNavigationItemContent\n icon={icon}\n iconActive={iconActive}\n title={title}\n tag={tag}\n />\n </NavigationComponent>\n );\n};\n\n/** Side Navigation menu trigger (for internal usage) */\nexport const InternalSideNavigationTrigger: FC<\n {\n id: string;\n title: string;\n isActive: boolean | undefined;\n icon: IconProps['svg'] | undefined;\n iconActive: IconProps['svg'] | undefined;\n className: string | undefined;\n\n tag: BadgeTagProps | undefined;\n onClick?: (e: MouseEvent<never>) => void;\n } & Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'>\n> = ({\n id,\n title,\n isActive,\n icon,\n iconActive,\n className,\n\n tag,\n ...rest\n}) => {\n return (\n <div\n data-cy={`navigation-item-${id}`}\n data-pendo={`navigation-item-${id}`}\n {...rest}\n className={classNames(Styles.navItem, className, {\n [Styles.navLink]: !!rest.onClick,\n [Styles.navItemActive]: isActive === true,\n [Styles.navItemIconSwitch]: !!icon && !!iconActive,\n })}\n >\n <InternalSideNavigationItemContent\n icon={icon}\n iconActive={iconActive}\n title={title}\n tag={tag}\n />\n </div>\n );\n};\n\nexport const InternalSideNavigationGroupLink: FC<\n NavigationComponentProps & {\n id: string;\n to: string;\n title: string;\n isActive: boolean | ((pathname: string) => boolean) | undefined;\n className: string | undefined;\n tag: BadgeTagProps | undefined;\n\n parentId: string;\n }\n> = ({\n id,\n to,\n title,\n isActive,\n className,\n tag,\n\n parentId,\n navigationComponent: NavigationComponent,\n ...rest\n}) => {\n return (\n <NavigationComponent\n key={id}\n data-cy={`navigation-item-${parentId}--${id}`}\n data-pendo={`navigation-item-${parentId}--${id}`}\n {...rest}\n to={to}\n className={classNames(Styles.submenuItem, Styles.submenuLink, className, {\n [Styles.submenuLinkActive]: isActive === true,\n })}\n isActive={typeof isActive === 'function' ? isActive : undefined}\n activeClassName={Styles.submenuLinkActive}\n >\n <span>{title}</span>\n <BadgeTag data={tag} className={Styles.submenuLinkCounter} />\n </NavigationComponent>\n );\n};\n\nexport const InternalSideNavigationGroupTrigger: FC<{\n id: string;\n title: string;\n isActive: boolean | ((pathname: string) => boolean) | undefined;\n className: string | undefined;\n tag: BadgeTagProps | undefined;\n\n onClick?: (e: MouseEvent<any>) => void;\n}> = ({\n id,\n title,\n isActive,\n className,\n tag,\n\n ...rest\n}) => {\n return (\n <div\n data-cy={`navigation-item-${id}`}\n data-pendo={`navigation-item-${id}`}\n key={id}\n {...rest}\n className={classNames(Styles.submenuItem, {\n [Styles.submenuLink]: !!rest.onClick,\n [Styles.submenuLinkActive]: isActive === true,\n })}\n >\n <span>{title}</span>\n <BadgeTag data={tag} className={Styles.submenuLinkCounter} />\n </div>\n );\n};\n\nexport const InternalSideNavigationGroupDivider = () => {\n return <div className={Styles.divider} />;\n};\n\nexport const InternalSideNavigationGroup: FC<\n NavigationComponentProps & {\n id: string;\n to: string | undefined;\n title: string;\n isActive: boolean | ((pathname: string) => boolean) | undefined;\n icon: IconProps['svg'] | undefined;\n iconActive: IconProps['svg'] | undefined;\n className: string | undefined;\n tag: BadgeTagProps | undefined;\n\n children: ReactNode;\n submenuExpanded: boolean;\n onClick?: (e: MouseEvent<never>) => void;\n onExpandToggle(e: MouseEvent<never>): void;\n }\n> = ({\n id,\n to,\n title,\n isActive,\n icon,\n iconActive,\n className,\n tag,\n\n children,\n submenuExpanded,\n onExpandToggle,\n onClick,\n navigationComponent,\n ...rest\n}) => {\n const onRootClickCapture = (e: MouseEvent<never>) => {\n if (!submenuExpanded) {\n onExpandToggle?.(e);\n e.preventDefault();\n e.stopPropagation();\n }\n };\n return (\n <div className={classNames(Styles.navGroupWrapper)}>\n <div className={Styles.navGroupItem} onClickCapture={onRootClickCapture}>\n {to ? (\n <InternalSideNavigationLink\n id={id}\n to={to}\n title={title}\n isActive={isActive}\n icon={icon}\n iconActive={iconActive}\n tag={tag}\n className={className}\n {...rest}\n navigationComponent={navigationComponent}\n />\n ) : (\n <InternalSideNavigationTrigger\n id={id}\n title={title}\n isActive={isActive === true || undefined}\n icon={icon}\n iconActive={iconActive}\n tag={tag}\n className={className}\n {...rest}\n />\n )}\n\n <div className={Styles.navItemGroupToggleWrapper}>\n <Button\n appearance=\"secondary\"\n size=\"small\"\n icon={submenuExpanded ? SvgGroupCollapse : SvgGroupExpand}\n className={Styles.navItemGroupToggle}\n onClick={onExpandToggle}\n aria-label=\"Toggle submenu\"\n data-cy=\"nav-item-group-expand\"\n />\n </div>\n </div>\n <div\n className={classNames(Styles.submenuWrapper, {\n [Styles.submenuWrapperCollapsed]: !submenuExpanded,\n })}\n data-cy={`navigation-submenu-${id}`}\n >\n <div className={Styles.submenu}>{children}</div>\n </div>\n </div>\n );\n};\n"],"names":["Button","Icon","SvgGroupCollapse","SvgGroupExpand","classNames","Fragment","BadgeTag","Styles","InternalSideNavigationItemContent","icon","iconActive","tag","title","div","className","navItemIconWrapper","svg","navIcon","navIconInactive","navIconActive","navItemTextExpanded","data-cy","data","navItemCounter","longClassName","navItemCounterLong","navItemTextCollapsed","navItemTextSmall","length","InternalSideNavigationLink","id","to","isActive","navigationComponent","NavigationComponent","rest","data-pendo","navItem","navLink","navItemActive","navItemIconSwitch","undefined","activeClassName","InternalSideNavigationTrigger","onClick","InternalSideNavigationGroupLink","parentId","submenuItem","submenuLink","submenuLinkActive","span","submenuLinkCounter","InternalSideNavigationGroupTrigger","InternalSideNavigationGroupDivider","divider","InternalSideNavigationGroup","children","submenuExpanded","onExpandToggle","onRootClickCapture","e","preventDefault","stopPropagation","navGroupWrapper","navGroupItem","onClickCapture","navItemGroupToggleWrapper","appearance","size","navItemGroupToggle","aria-label","submenuWrapper","submenuWrapperCollapsed","submenu"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layout-sidebar-links.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-sidebar-links.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAC;AAqB5E,gCAAgC;AAChC,wBAAgB,iBAAiB,CAAC,EAC9B,EAAE,EACF,EAAE,EACF,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,UAAU,EACV,OAAO,EACP,GAAG,EACH,SAAS,EAET,OAAO,EACP,OAAO,EACP,KAAK,EACL,IAAI,EACJ,GAAG,IAAI,EACV,EAAE,oBAAoB,
|
|
1
|
+
{"version":3,"file":"layout-sidebar-links.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-sidebar-links.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAC;AAqB5E,gCAAgC;AAChC,wBAAgB,iBAAiB,CAAC,EAC9B,EAAE,EACF,EAAE,EACF,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,UAAU,EACV,OAAO,EACP,GAAG,EACH,SAAS,EAET,OAAO,EACP,OAAO,EACP,KAAK,EACL,IAAI,EACJ,GAAG,IAAI,EACV,EAAE,oBAAoB,2CAgCtB;AAED,mCAAmC;AACnC,wBAAgB,oBAAoB,CAAC,EACjC,EAAE,EACF,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,UAAU,EACV,OAAO,EACP,GAAG,EACH,SAAS,EAET,OAAO,EACP,OAAO,EACP,KAAK,EACL,IAAI,EACJ,GAAG,IAAI,EACV,EAAE,uBAAuB,2CA4BzB"}
|
|
@@ -27,8 +27,7 @@ const WrappedLink = ({ children, isMobile, wrapper: WrapperComponent })=>{
|
|
|
27
27
|
tag: tagData,
|
|
28
28
|
className: className,
|
|
29
29
|
...rest,
|
|
30
|
-
navigationComponent: NavigationComponent
|
|
31
|
-
submenuExpanded: undefined
|
|
30
|
+
navigationComponent: NavigationComponent
|
|
32
31
|
});
|
|
33
32
|
return wrapper ? /*#__PURE__*/ _jsx(WrappedLink, {
|
|
34
33
|
isMobile: isMobile,
|
|
@@ -50,8 +49,7 @@ const WrappedLink = ({ children, isMobile, wrapper: WrapperComponent })=>{
|
|
|
50
49
|
iconActive: iconActive,
|
|
51
50
|
tag: tagData,
|
|
52
51
|
className: className,
|
|
53
|
-
...rest
|
|
54
|
-
submenuExpanded: undefined
|
|
52
|
+
...rest
|
|
55
53
|
});
|
|
56
54
|
return wrapper ? /*#__PURE__*/ _jsx(WrappedLink, {
|
|
57
55
|
isMobile: isMobile,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/titan-layout/layout-sidebar-links.tsx"],"sourcesContent":["import { FC, ReactElement } from 'react';\nimport { getCounterTag } from '../../utils/side-nav';\nimport { TitanLayoutLinkProps, TitanLayoutTriggerProps } from './interface';\nimport { useTitanLayoutContext } from './layout-context';\nimport {\n InternalSideNavigationLink,\n InternalSideNavigationTrigger,\n} from './layout-sidebar-links-internal';\nimport { useNotificationsContext } from './notifications-context';\n\nconst WrappedLink: FC<{\n children: ReactElement<any>;\n wrapper: NonNullable<TitanLayoutLinkProps['wrapper']>;\n isMobile: boolean;\n}> = ({ children, isMobile, wrapper: WrapperComponent }) => {\n const { sidebar } = useTitanLayoutContext();\n return (\n <WrapperComponent isMobile={isMobile} context={sidebar}>\n {children}\n </WrapperComponent>\n );\n};\n\n/** Side Navigation menu link */\nexport function LayoutSidebarLink({\n id,\n to,\n title,\n isActive,\n icon,\n iconActive,\n counter,\n tag,\n className,\n\n tooltip,\n wrapper,\n extra,\n side,\n ...rest\n}: TitanLayoutLinkProps) {\n const {\n NavigationComponent,\n breakpoint: { isMobile },\n } = useTitanLayoutContext();\n const { onNotificationsUpdate } = useNotificationsContext();\n const tagData = getCounterTag(side?.counter ?? counter, tag);\n\n onNotificationsUpdate(id, !!tagData);\n\n const element = (\n <InternalSideNavigationLink\n id={id}\n to={to}\n title={title}\n isActive={isActive}\n icon={icon}\n iconActive={iconActive}\n tag={tagData}\n className={className}\n {...rest}\n navigationComponent={NavigationComponent}\n
|
|
1
|
+
{"version":3,"sources":["../../../src/components/titan-layout/layout-sidebar-links.tsx"],"sourcesContent":["import { FC, ReactElement } from 'react';\nimport { getCounterTag } from '../../utils/side-nav';\nimport { TitanLayoutLinkProps, TitanLayoutTriggerProps } from './interface';\nimport { useTitanLayoutContext } from './layout-context';\nimport {\n InternalSideNavigationLink,\n InternalSideNavigationTrigger,\n} from './layout-sidebar-links-internal';\nimport { useNotificationsContext } from './notifications-context';\n\nconst WrappedLink: FC<{\n children: ReactElement<any>;\n wrapper: NonNullable<TitanLayoutLinkProps['wrapper']>;\n isMobile: boolean;\n}> = ({ children, isMobile, wrapper: WrapperComponent }) => {\n const { sidebar } = useTitanLayoutContext();\n return (\n <WrapperComponent isMobile={isMobile} context={sidebar}>\n {children}\n </WrapperComponent>\n );\n};\n\n/** Side Navigation menu link */\nexport function LayoutSidebarLink({\n id,\n to,\n title,\n isActive,\n icon,\n iconActive,\n counter,\n tag,\n className,\n\n tooltip,\n wrapper,\n extra,\n side,\n ...rest\n}: TitanLayoutLinkProps) {\n const {\n NavigationComponent,\n breakpoint: { isMobile },\n } = useTitanLayoutContext();\n const { onNotificationsUpdate } = useNotificationsContext();\n const tagData = getCounterTag(side?.counter ?? counter, tag);\n\n onNotificationsUpdate(id, !!tagData);\n\n const element = (\n <InternalSideNavigationLink\n id={id}\n to={to}\n title={title}\n isActive={isActive}\n icon={icon}\n iconActive={iconActive}\n tag={tagData}\n className={className}\n {...rest}\n navigationComponent={NavigationComponent}\n />\n );\n\n return wrapper ? (\n <WrappedLink isMobile={isMobile} wrapper={wrapper}>\n {element}\n </WrappedLink>\n ) : (\n element\n );\n}\n\n/** Side Navigation menu trigger */\nexport function LayoutSidebarTrigger({\n id,\n title,\n isActive,\n icon,\n iconActive,\n counter,\n tag,\n className,\n\n tooltip,\n wrapper,\n extra,\n side,\n ...rest\n}: TitanLayoutTriggerProps) {\n const {\n breakpoint: { isMobile },\n } = useTitanLayoutContext();\n const { onNotificationsUpdate } = useNotificationsContext();\n const tagData = getCounterTag(side?.counter ?? counter, tag);\n\n onNotificationsUpdate(id, !!tagData);\n\n const element = (\n <InternalSideNavigationTrigger\n id={id}\n title={title}\n isActive={isActive}\n icon={icon}\n iconActive={iconActive}\n tag={tagData}\n className={className}\n {...rest}\n />\n );\n return wrapper ? (\n <WrappedLink isMobile={isMobile} wrapper={wrapper}>\n {element}\n </WrappedLink>\n ) : (\n element\n );\n}\n"],"names":["getCounterTag","useTitanLayoutContext","InternalSideNavigationLink","InternalSideNavigationTrigger","useNotificationsContext","WrappedLink","children","isMobile","wrapper","WrapperComponent","sidebar","context","LayoutSidebarLink","id","to","title","isActive","icon","iconActive","counter","tag","className","tooltip","extra","side","rest","NavigationComponent","breakpoint","onNotificationsUpdate","tagData","element","navigationComponent","LayoutSidebarTrigger"],"mappings":";AACA,SAASA,aAAa,QAAQ,uBAAuB;AAErD,SAASC,qBAAqB,QAAQ,mBAAmB;AACzD,SACIC,0BAA0B,EAC1BC,6BAA6B,QAC1B,kCAAkC;AACzC,SAASC,uBAAuB,QAAQ,0BAA0B;AAElE,MAAMC,cAID,CAAC,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,SAASC,gBAAgB,EAAE;IACnD,MAAM,EAAEC,OAAO,EAAE,GAAGT;IACpB,qBACI,KAACQ;QAAiBF,UAAUA;QAAUI,SAASD;kBAC1CJ;;AAGb;AAEA,8BAA8B,GAC9B,OAAO,SAASM,kBAAkB,EAC9BC,EAAE,EACFC,EAAE,EACFC,KAAK,EACLC,QAAQ,EACRC,IAAI,EACJC,UAAU,EACVC,OAAO,EACPC,GAAG,EACHC,SAAS,EAETC,OAAO,EACPd,OAAO,EACPe,KAAK,EACLC,IAAI,EACJ,GAAGC,MACgB;IACnB,MAAM,EACFC,mBAAmB,EACnBC,YAAY,EAAEpB,QAAQ,EAAE,EAC3B,GAAGN;IACJ,MAAM,EAAE2B,qBAAqB,EAAE,GAAGxB;QACJoB;IAA9B,MAAMK,UAAU7B,cAAcwB,CAAAA,gBAAAA,iBAAAA,2BAAAA,KAAML,OAAO,cAAbK,2BAAAA,gBAAiBL,SAASC;IAExDQ,sBAAsBf,IAAI,CAAC,CAACgB;IAE5B,MAAMC,wBACF,KAAC5B;QACGW,IAAIA;QACJC,IAAIA;QACJC,OAAOA;QACPC,UAAUA;QACVC,MAAMA;QACNC,YAAYA;QACZE,KAAKS;QACLR,WAAWA;QACV,GAAGI,IAAI;QACRM,qBAAqBL;;IAI7B,OAAOlB,wBACH,KAACH;QAAYE,UAAUA;QAAUC,SAASA;kBACrCsB;SAGLA;AAER;AAEA,iCAAiC,GACjC,OAAO,SAASE,qBAAqB,EACjCnB,EAAE,EACFE,KAAK,EACLC,QAAQ,EACRC,IAAI,EACJC,UAAU,EACVC,OAAO,EACPC,GAAG,EACHC,SAAS,EAETC,OAAO,EACPd,OAAO,EACPe,KAAK,EACLC,IAAI,EACJ,GAAGC,MACmB;IACtB,MAAM,EACFE,YAAY,EAAEpB,QAAQ,EAAE,EAC3B,GAAGN;IACJ,MAAM,EAAE2B,qBAAqB,EAAE,GAAGxB;QACJoB;IAA9B,MAAMK,UAAU7B,cAAcwB,CAAAA,gBAAAA,iBAAAA,2BAAAA,KAAML,OAAO,cAAbK,2BAAAA,gBAAiBL,SAASC;IAExDQ,sBAAsBf,IAAI,CAAC,CAACgB;IAE5B,MAAMC,wBACF,KAAC3B;QACGU,IAAIA;QACJE,OAAOA;QACPC,UAAUA;QACVC,MAAMA;QACNC,YAAYA;QACZE,KAAKS;QACLR,WAAWA;QACV,GAAGI,IAAI;;IAGhB,OAAOjB,wBACH,KAACH;QAAYE,UAAUA;QAAUC,SAASA;kBACrCsB;SAGLA;AAER"}
|
|
@@ -7,7 +7,7 @@ export interface LayoutSidebarProps {
|
|
|
7
7
|
bottom?: ReactElement;
|
|
8
8
|
mainItems?: NavigationItemData[];
|
|
9
9
|
barExpanded: boolean;
|
|
10
|
-
|
|
10
|
+
submenusExpanded: string[] | undefined;
|
|
11
11
|
drawerOpened: boolean;
|
|
12
12
|
mobile: boolean;
|
|
13
13
|
navigationComponent: FC<NavLinkComponentProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layout-sidebar.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-sidebar.tsx"],"names":[],"mappings":"AAKA,OAAO,EAEH,EAAE,EAGF,YAAY,EAGf,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,kBAAkB,EAAyB,MAAM,wBAAwB,CAAC;AACnF,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAavE,MAAM,WAAW,kBAAkB;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,YAAY,EAAE,CAAC;IACrB,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,SAAS,CAAC,EAAE,kBAAkB,EAAE,CAAC;IACjC,WAAW,EAAE,OAAO,CAAC;IACrB,
|
|
1
|
+
{"version":3,"file":"layout-sidebar.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-sidebar.tsx"],"names":[],"mappings":"AAKA,OAAO,EAEH,EAAE,EAGF,YAAY,EAGf,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,kBAAkB,EAAyB,MAAM,wBAAwB,CAAC;AACnF,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAavE,MAAM,WAAW,kBAAkB;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,YAAY,EAAE,CAAC;IACrB,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,SAAS,CAAC,EAAE,kBAAkB,EAAE,CAAC;IACjC,WAAW,EAAE,OAAO,CAAC;IACrB,gBAAgB,EAAE,MAAM,EAAE,GAAG,SAAS,CAAC;IACvC,YAAY,EAAE,OAAO,CAAC;IACtB,MAAM,EAAE,OAAO,CAAC;IAChB,mBAAmB,EAAE,EAAE,CAAC,qBAAqB,CAAC,CAAC;IAC/C,iBAAiB,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI,CAAC;IAC3C,kBAAkB,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI,CAAC;IAC5C,qBAAqB,CAAC,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,GAAG,IAAI,CAAC;CAC9D;AAED,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CAmGhD,CAAC"}
|
|
@@ -10,7 +10,7 @@ import { LayoutPlacementContext, useTitanLayoutContext } from './layout-context'
|
|
|
10
10
|
import { InternalSideNavigationGroup, InternalSideNavigationGroupLink, InternalSideNavigationLink } from './layout-sidebar-links-internal';
|
|
11
11
|
import * as Styles from './layout-sidebar.module.less';
|
|
12
12
|
import { withTooltip } from './with-tooltip';
|
|
13
|
-
export const LayoutSidebar = ({ className, mobile, barExpanded,
|
|
13
|
+
export const LayoutSidebar = ({ className, mobile, barExpanded, submenusExpanded, drawerOpened, onBarExpandChange, onSubmenuExpandChange, onDrawerOpenChange, mainItems, top, bottom, navigationComponent })=>{
|
|
14
14
|
const closeDrawer = ()=>{
|
|
15
15
|
if (mobile) {
|
|
16
16
|
onDrawerOpenChange === null || onDrawerOpenChange === void 0 ? void 0 : onDrawerOpenChange(false);
|
|
@@ -51,7 +51,7 @@ export const LayoutSidebar = ({ className, mobile, barExpanded, submenuExpanded,
|
|
|
51
51
|
children: mainItems === null || mainItems === void 0 ? void 0 : mainItems.map((item)=>item.submenu ? /*#__PURE__*/ _jsx(SideNavigationGroupItem, {
|
|
52
52
|
item: item,
|
|
53
53
|
barExpanded: mobile ? drawerOpened : barExpanded,
|
|
54
|
-
submenuExpanded: !!item.id &&
|
|
54
|
+
submenuExpanded: !!item.id && !!(submenusExpanded === null || submenusExpanded === void 0 ? void 0 : submenusExpanded.includes(item.id)),
|
|
55
55
|
onSubmenuExpand: onSubmenuExpandChange,
|
|
56
56
|
navigationComponent: navigationComponent
|
|
57
57
|
}, item.id) : /*#__PURE__*/ _jsx(InternalSideNavigationLink, {
|
|
@@ -63,7 +63,6 @@ export const LayoutSidebar = ({ className, mobile, barExpanded, submenuExpanded,
|
|
|
63
63
|
iconActive: item.iconActive,
|
|
64
64
|
className: item.className,
|
|
65
65
|
tag: getSubmenuGroupTag(item.submenu, getCounterTag(item.counter, item.tag)),
|
|
66
|
-
submenuExpanded: undefined,
|
|
67
66
|
navigationComponent: navigationComponent
|
|
68
67
|
}, item.id))
|
|
69
68
|
}),
|
|
@@ -167,7 +166,6 @@ LayoutSidebar.displayName = 'LayoutSidebar';
|
|
|
167
166
|
iconActive: item.iconActive,
|
|
168
167
|
className: item.className,
|
|
169
168
|
tag: tag,
|
|
170
|
-
submenuExpanded: undefined,
|
|
171
169
|
navigationComponent: navigationComponent
|
|
172
170
|
})
|
|
173
171
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/titan-layout/layout-sidebar.tsx"],"sourcesContent":["import { Icon, Popover, Text, ThemeProvider } from '@servicetitan/anvil2';\nimport SvgClose from '@servicetitan/anvil2/assets/icons/material/round/close.svg';\nimport SvgCollapse from '@servicetitan/anvil2/assets/icons/st/gnav_menu_collapse.svg';\nimport SvgExpand from '@servicetitan/anvil2/assets/icons/st/gnav_menu_expand.svg';\nimport classNames from 'classnames';\nimport {\n Children,\n FC,\n Fragment,\n MouseEvent,\n ReactElement,\n isValidElement,\n useCallback,\n} from 'react';\nimport { NavigationItemData, NavigationSubmenuData } from '../../utils/navigation';\nimport { NavLinkComponentProps } from '../../utils/navigation-context';\nimport { getCounterTag, getSubmenuGroupTag } from '../../utils/side-nav';\nimport { NavigationComponentProps } from './interface-internal';\nimport { LayoutPlacementContext, useTitanLayoutContext } from './layout-context';\nimport {\n InternalSideNavigationGroup,\n InternalSideNavigationGroupLink,\n InternalSideNavigationLink,\n} from './layout-sidebar-links-internal';\nimport * as Styles from './layout-sidebar.module.less';\n\nimport { withTooltip } from './with-tooltip';\n\nexport interface LayoutSidebarProps {\n className?: string;\n top?: ReactElement[];\n bottom?: ReactElement;\n mainItems?: NavigationItemData[];\n barExpanded: boolean;\n submenuExpanded: string | undefined;\n drawerOpened: boolean;\n mobile: boolean;\n navigationComponent: FC<NavLinkComponentProps>;\n onBarExpandChange(expanded: boolean): void;\n onDrawerOpenChange(expanded: boolean): void;\n onSubmenuExpandChange(id: string, expanded: boolean): void;\n}\n\nexport const LayoutSidebar: FC<LayoutSidebarProps> = ({\n className,\n mobile,\n barExpanded,\n submenuExpanded,\n drawerOpened,\n onBarExpandChange,\n onSubmenuExpandChange,\n onDrawerOpenChange,\n mainItems,\n top,\n bottom,\n navigationComponent,\n}) => {\n const closeDrawer = () => {\n if (mobile) {\n onDrawerOpenChange?.(false);\n }\n };\n\n return (\n <LayoutPlacementContext.Provider value=\"side\">\n {mobile && drawerOpened && (\n <div className={Styles.navDrawerBackdrop} onClick={closeDrawer} />\n )}\n <div\n className={classNames(\n Styles.nav,\n mobile && Styles.navDrawer,\n mobile && drawerOpened && Styles.navDrawerOpened,\n !mobile && (barExpanded ? Styles.navWide : Styles.navSlim),\n className\n )}\n data-cy=\"side-navigation\"\n onClick={closeDrawer}\n >\n <ThemeProvider mode=\"dark\" className={Styles.navMain}>\n {mobile && (\n <div className={Styles.navCloseWrapper}>\n <div\n className={Styles.navClose}\n onClick={() => onBarExpandChange(false)}\n >\n <Icon svg={SvgClose} size=\"large\" />\n </div>\n </div>\n )}\n {!!top?.length && <SidebarTop>{top}</SidebarTop>}\n\n <div data-cy=\"navigation-items\">\n {mainItems?.map(item =>\n item.submenu ? (\n <SideNavigationGroupItem\n key={item.id}\n item={item}\n barExpanded={mobile ? drawerOpened : barExpanded}\n submenuExpanded={!!item.id && submenuExpanded === item.id}\n onSubmenuExpand={onSubmenuExpandChange}\n navigationComponent={navigationComponent}\n />\n ) : (\n <InternalSideNavigationLink\n key={item.id}\n id={item.id}\n to={item.to}\n title={item.title}\n isActive={item.isActive}\n icon={item.icon}\n iconActive={item.iconActive}\n className={item.className}\n tag={getSubmenuGroupTag(\n item.submenu,\n getCounterTag(item.counter, item.tag)\n )}\n submenuExpanded={undefined}\n navigationComponent={navigationComponent}\n />\n )\n )}\n </div>\n\n {!!bottom && <SidebarBottom>{bottom}</SidebarBottom>}\n </ThemeProvider>\n\n {!mobile && (\n <div className={Styles.navFooter}>\n <div className={Styles.divider} />\n <div className={Styles.toggleWrapper}>\n <SideNavigationOptionsToggle\n appearance={barExpanded ? 'collapse-button' : 'expand'}\n onExpandedChange={() => onBarExpandChange(!barExpanded)}\n />\n </div>\n </div>\n )}\n </div>\n </LayoutPlacementContext.Provider>\n );\n};\nLayoutSidebar.displayName = 'LayoutSidebar';\n\n/** Side Navigation options toggle */\nconst SideNavigationOptionsToggle: FC<{\n appearance: 'expand' | 'collapse' | 'collapse-button';\n onExpandedChange?(expanded: boolean): void;\n}> = ({ appearance, onExpandedChange }) =>\n withTooltip(\n <div\n data-cy=\"navigation-left-options\"\n data-pendo=\"navigation-left-options\"\n className={classNames(Styles.toggle)}\n onClick={() => onExpandedChange?.(appearance === 'expand')}\n >\n <div className={Styles.toggleContent}>\n <div className={Styles.toggleIconWrapper}>\n <Icon\n className={Styles.toggleIcon}\n svg={appearance === 'expand' ? SvgExpand : SvgCollapse}\n />\n </div>\n\n {appearance === 'collapse-button' && (\n <span className={Styles.toggleText}>Collapse Menu</span>\n )}\n </div>\n </div>,\n appearance === 'expand'\n ? 'Expand Menu'\n : appearance === 'collapse'\n ? 'Collapse Menu'\n : undefined,\n { placement: 'right' }\n );\n\n/** Side Navigation menu item */\nconst SideNavigationGroupItem: FC<{\n item: NavigationItemData;\n navigationComponent: FC<NavLinkComponentProps>;\n barExpanded: boolean;\n submenuExpanded: boolean;\n onSubmenuExpand: undefined | ((id: string, expanded: boolean) => void);\n}> = ({ item, onSubmenuExpand, barExpanded, submenuExpanded, navigationComponent }) => {\n const onExpandToggle = useCallback(\n (e: MouseEvent<never>) => {\n e.preventDefault();\n e.stopPropagation();\n\n if (item.id) {\n onSubmenuExpand?.(item.id, !submenuExpanded);\n }\n },\n [item.id, submenuExpanded, onSubmenuExpand]\n );\n const {\n sidebar: {\n styles: { popoverContent },\n },\n } = useTitanLayoutContext();\n\n const tag = getSubmenuGroupTag(item.submenu, getCounterTag(item.counter, item.tag));\n\n return barExpanded ? (\n <InternalSideNavigationGroup\n id={item.id}\n to={item.to}\n title={item.title}\n isActive={item.isActive}\n icon={item.icon}\n iconActive={item.iconActive}\n className={item.className}\n tag={tag}\n submenuExpanded={submenuExpanded}\n onExpandToggle={onExpandToggle}\n navigationComponent={navigationComponent}\n >\n <SideNavigationGroupContent\n parentId={item.id}\n groups={item.submenu?.groups ?? []}\n navigationComponent={navigationComponent}\n />\n </InternalSideNavigationGroup>\n ) : (\n <Popover placement=\"right-start\" openOnHover delay={500}>\n <Popover.Trigger>\n {(triggerProps: any) => (\n <div {...triggerProps}>\n <InternalSideNavigationLink\n id={item.id}\n to={item.to}\n title={item.title}\n isActive={item.isActive}\n icon={item.icon}\n iconActive={item.iconActive}\n className={item.className}\n tag={tag}\n submenuExpanded={undefined}\n navigationComponent={navigationComponent}\n />\n </div>\n )}\n </Popover.Trigger>\n <Popover.Content style={popoverContent} className=\"z-global-nav-i\">\n <div className={Styles.submenuPopover}>\n <Text\n variant=\"headline\"\n el=\"h4\"\n size=\"small\"\n className=\"c-white m-b-half-i m-t-1\"\n >\n {item.title}\n </Text>\n <SideNavigationGroupContent\n parentId={item.id}\n groups={item.submenu?.groups ?? []}\n navigationComponent={navigationComponent}\n />\n </div>\n </Popover.Content>\n </Popover>\n );\n};\nconst SideNavigationGroupContent: FC<\n NavigationSubmenuData & NavigationComponentProps & { parentId: string }\n> = ({ groups, parentId, navigationComponent }) => {\n return (\n <Fragment>\n {groups.reduce((out, group, index) => {\n if (!group.links.length) {\n return out;\n }\n\n const title = group.title?.trim() ?? '';\n /* eslint-disable react/no-array-index-key */\n out.push(\n <Text\n key={`:group:${parentId}:${index}:title`}\n variant=\"eyebrow\"\n className={classNames(Styles.submenuGroupHeader, {\n [Styles.submenuGroupHeaderEmpty]: !title,\n })}\n >\n {title}\n </Text>\n );\n out.push(\n ...group.links.map((link, index) => (\n <InternalSideNavigationGroupLink\n key={`:${parentId}:${link.id}:${index}`}\n id={link.id}\n to={link.to}\n title={link.title}\n isActive={link.isActive}\n className={undefined}\n tag={getCounterTag(link.counter, link.tag)}\n parentId={parentId}\n navigationComponent={navigationComponent}\n />\n ))\n );\n /* eslint-enable react/no-array-index-key */\n\n return out;\n }, [] as ReactElement[])}\n </Fragment>\n );\n};\n\nfunction SidebarTop({ children }: any) {\n const list = Children.map(children, child => {\n return child && isValidElement(child) ? child : null;\n });\n return list?.length ? (\n <ThemeProvider mode=\"dark\" className={Styles.navTop} data-cy=\"navigation-items-top\">\n {list}\n <div className={Styles.divider} />\n </ThemeProvider>\n ) : null;\n}\n\nfunction SidebarBottom({ children }: any) {\n return (\n <ThemeProvider mode=\"dark\" className={Styles.navBottom} data-cy=\"navigation-items-bottom\">\n <div className={Styles.divider} />\n {children}\n </ThemeProvider>\n );\n}\n"],"names":["Icon","Popover","Text","ThemeProvider","SvgClose","SvgCollapse","SvgExpand","classNames","Children","Fragment","isValidElement","useCallback","getCounterTag","getSubmenuGroupTag","LayoutPlacementContext","useTitanLayoutContext","InternalSideNavigationGroup","InternalSideNavigationGroupLink","InternalSideNavigationLink","Styles","withTooltip","LayoutSidebar","className","mobile","barExpanded","submenuExpanded","drawerOpened","onBarExpandChange","onSubmenuExpandChange","onDrawerOpenChange","mainItems","top","bottom","navigationComponent","closeDrawer","Provider","value","div","navDrawerBackdrop","onClick","nav","navDrawer","navDrawerOpened","navWide","navSlim","data-cy","mode","navMain","navCloseWrapper","navClose","svg","size","length","SidebarTop","map","item","submenu","SideNavigationGroupItem","id","onSubmenuExpand","to","title","isActive","icon","iconActive","tag","counter","undefined","SidebarBottom","navFooter","divider","toggleWrapper","SideNavigationOptionsToggle","appearance","onExpandedChange","displayName","data-pendo","toggle","toggleContent","toggleIconWrapper","toggleIcon","span","toggleText","placement","onExpandToggle","e","preventDefault","stopPropagation","sidebar","styles","popoverContent","SideNavigationGroupContent","parentId","groups","openOnHover","delay","Trigger","triggerProps","Content","style","submenuPopover","variant","el","reduce","out","group","index","links","trim","push","submenuGroupHeader","submenuGroupHeaderEmpty","link","children","list","child","navTop","navBottom"],"mappings":";AAAA,SAASA,IAAI,EAAEC,OAAO,EAAEC,IAAI,EAAEC,aAAa,QAAQ,uBAAuB;AAC1E,OAAOC,cAAc,6DAA6D;AAClF,OAAOC,iBAAiB,8DAA8D;AACtF,OAAOC,eAAe,4DAA4D;AAClF,OAAOC,gBAAgB,aAAa;AACpC,SACIC,QAAQ,EAERC,QAAQ,EAGRC,cAAc,EACdC,WAAW,QACR,QAAQ;AAGf,SAASC,aAAa,EAAEC,kBAAkB,QAAQ,uBAAuB;AAEzE,SAASC,sBAAsB,EAAEC,qBAAqB,QAAQ,mBAAmB;AACjF,SACIC,2BAA2B,EAC3BC,+BAA+B,EAC/BC,0BAA0B,QACvB,kCAAkC;AACzC,YAAYC,YAAY,+BAA+B;AAEvD,SAASC,WAAW,QAAQ,iBAAiB;AAiB7C,OAAO,MAAMC,gBAAwC,CAAC,EAClDC,SAAS,EACTC,MAAM,EACNC,WAAW,EACXC,eAAe,EACfC,YAAY,EACZC,iBAAiB,EACjBC,qBAAqB,EACrBC,kBAAkB,EAClBC,SAAS,EACTC,GAAG,EACHC,MAAM,EACNC,mBAAmB,EACtB;IACG,MAAMC,cAAc;QAChB,IAAIX,QAAQ;YACRM,+BAAAA,yCAAAA,mBAAqB;QACzB;IACJ;IAEA,qBACI,MAACf,uBAAuBqB,QAAQ;QAACC,OAAM;;YAClCb,UAAUG,8BACP,KAACW;gBAAIf,WAAWH,OAAOmB,iBAAiB;gBAAEC,SAASL;;0BAEvD,MAACG;gBACGf,WAAWf,WACPY,OAAOqB,GAAG,EACVjB,UAAUJ,OAAOsB,SAAS,EAC1BlB,UAAUG,gBAAgBP,OAAOuB,eAAe,EAChD,CAACnB,UAAWC,CAAAA,cAAcL,OAAOwB,OAAO,GAAGxB,OAAOyB,OAAO,AAAD,GACxDtB;gBAEJuB,WAAQ;gBACRN,SAASL;;kCAET,MAAC/B;wBAAc2C,MAAK;wBAAOxB,WAAWH,OAAO4B,OAAO;;4BAC/CxB,wBACG,KAACc;gCAAIf,WAAWH,OAAO6B,eAAe;0CAClC,cAAA,KAACX;oCACGf,WAAWH,OAAO8B,QAAQ;oCAC1BV,SAAS,IAAMZ,kBAAkB;8CAEjC,cAAA,KAAC3B;wCAAKkD,KAAK9C;wCAAU+C,MAAK;;;;4BAIrC,CAAC,EAACpB,gBAAAA,0BAAAA,IAAKqB,MAAM,mBAAI,KAACC;0CAAYtB;;0CAE/B,KAACM;gCAAIQ,WAAQ;0CACRf,sBAAAA,gCAAAA,UAAWwB,GAAG,CAACC,CAAAA,OACZA,KAAKC,OAAO,iBACR,KAACC;wCAEGF,MAAMA;wCACN/B,aAAaD,SAASG,eAAeF;wCACrCC,iBAAiB,CAAC,CAAC8B,KAAKG,EAAE,IAAIjC,oBAAoB8B,KAAKG,EAAE;wCACzDC,iBAAiB/B;wCACjBK,qBAAqBA;uCALhBsB,KAAKG,EAAE,kBAQhB,KAACxC;wCAEGwC,IAAIH,KAAKG,EAAE;wCACXE,IAAIL,KAAKK,EAAE;wCACXC,OAAON,KAAKM,KAAK;wCACjBC,UAAUP,KAAKO,QAAQ;wCACvBC,MAAMR,KAAKQ,IAAI;wCACfC,YAAYT,KAAKS,UAAU;wCAC3B1C,WAAWiC,KAAKjC,SAAS;wCACzB2C,KAAKpD,mBACD0C,KAAKC,OAAO,EACZ5C,cAAc2C,KAAKW,OAAO,EAAEX,KAAKU,GAAG;wCAExCxC,iBAAiB0C;wCACjBlC,qBAAqBA;uCAbhBsB,KAAKG,EAAE;;4BAmB3B,CAAC,CAAC1B,wBAAU,KAACoC;0CAAepC;;;;oBAGhC,CAACT,wBACE,MAACc;wBAAIf,WAAWH,OAAOkD,SAAS;;0CAC5B,KAAChC;gCAAIf,WAAWH,OAAOmD,OAAO;;0CAC9B,KAACjC;gCAAIf,WAAWH,OAAOoD,aAAa;0CAChC,cAAA,KAACC;oCACGC,YAAYjD,cAAc,oBAAoB;oCAC9CkD,kBAAkB,IAAM/C,kBAAkB,CAACH;;;;;;;;;AAQ3E,EAAE;AACFH,cAAcsD,WAAW,GAAG;AAE5B,mCAAmC,GACnC,MAAMH,8BAGD,CAAC,EAAEC,UAAU,EAAEC,gBAAgB,EAAE,GAClCtD,0BACI,KAACiB;QACGQ,WAAQ;QACR+B,cAAW;QACXtD,WAAWf,WAAWY,OAAO0D,MAAM;QACnCtC,SAAS,IAAMmC,6BAAAA,uCAAAA,iBAAmBD,eAAe;kBAEjD,cAAA,MAACpC;YAAIf,WAAWH,OAAO2D,aAAa;;8BAChC,KAACzC;oBAAIf,WAAWH,OAAO4D,iBAAiB;8BACpC,cAAA,KAAC/E;wBACGsB,WAAWH,OAAO6D,UAAU;wBAC5B9B,KAAKuB,eAAe,WAAWnE,YAAYD;;;gBAIlDoE,eAAe,mCACZ,KAACQ;oBAAK3D,WAAWH,OAAO+D,UAAU;8BAAE;;;;QAIhDT,eAAe,WACT,gBACAA,eAAe,aACb,kBACAN,WACR;QAAEgB,WAAW;IAAQ;AAG7B,8BAA8B,GAC9B,MAAM1B,0BAMD,CAAC,EAAEF,IAAI,EAAEI,eAAe,EAAEnC,WAAW,EAAEC,eAAe,EAAEQ,mBAAmB,EAAE;QAoC1DsB,eAoCQA;IAvE5B,MAAM6B,iBAAiBzE,YACnB,CAAC0E;QACGA,EAAEC,cAAc;QAChBD,EAAEE,eAAe;QAEjB,IAAIhC,KAAKG,EAAE,EAAE;YACTC,4BAAAA,sCAAAA,gBAAkBJ,KAAKG,EAAE,EAAE,CAACjC;QAChC;IACJ,GACA;QAAC8B,KAAKG,EAAE;QAAEjC;QAAiBkC;KAAgB;IAE/C,MAAM,EACF6B,SAAS,EACLC,QAAQ,EAAEC,cAAc,EAAE,EAC7B,EACJ,GAAG3E;IAEJ,MAAMkD,MAAMpD,mBAAmB0C,KAAKC,OAAO,EAAE5C,cAAc2C,KAAKW,OAAO,EAAEX,KAAKU,GAAG;QAkB7DV,sBAoCQA;IApD5B,OAAO/B,4BACH,KAACR;QACG0C,IAAIH,KAAKG,EAAE;QACXE,IAAIL,KAAKK,EAAE;QACXC,OAAON,KAAKM,KAAK;QACjBC,UAAUP,KAAKO,QAAQ;QACvBC,MAAMR,KAAKQ,IAAI;QACfC,YAAYT,KAAKS,UAAU;QAC3B1C,WAAWiC,KAAKjC,SAAS;QACzB2C,KAAKA;QACLxC,iBAAiBA;QACjB2D,gBAAgBA;QAChBnD,qBAAqBA;kBAErB,cAAA,KAAC0D;YACGC,UAAUrC,KAAKG,EAAE;YACjBmC,QAAQtC,CAAAA,wBAAAA,gBAAAA,KAAKC,OAAO,cAAZD,oCAAAA,cAAcsC,MAAM,cAApBtC,kCAAAA,uBAAwB,EAAE;YAClCtB,qBAAqBA;;uBAI7B,MAAChC;QAAQkF,WAAU;QAAcW,WAAW;QAACC,OAAO;;0BAChD,KAAC9F,QAAQ+F,OAAO;0BACX,CAACC,6BACE,KAAC5D;wBAAK,GAAG4D,YAAY;kCACjB,cAAA,KAAC/E;4BACGwC,IAAIH,KAAKG,EAAE;4BACXE,IAAIL,KAAKK,EAAE;4BACXC,OAAON,KAAKM,KAAK;4BACjBC,UAAUP,KAAKO,QAAQ;4BACvBC,MAAMR,KAAKQ,IAAI;4BACfC,YAAYT,KAAKS,UAAU;4BAC3B1C,WAAWiC,KAAKjC,SAAS;4BACzB2C,KAAKA;4BACLxC,iBAAiB0C;4BACjBlC,qBAAqBA;;;;0BAKrC,KAAChC,QAAQiG,OAAO;gBAACC,OAAOT;gBAAgBpE,WAAU;0BAC9C,cAAA,MAACe;oBAAIf,WAAWH,OAAOiF,cAAc;;sCACjC,KAAClG;4BACGmG,SAAQ;4BACRC,IAAG;4BACHnD,MAAK;4BACL7B,WAAU;sCAETiC,KAAKM,KAAK;;sCAEf,KAAC8B;4BACGC,UAAUrC,KAAKG,EAAE;4BACjBmC,QAAQtC,CAAAA,yBAAAA,iBAAAA,KAAKC,OAAO,cAAZD,qCAAAA,eAAcsC,MAAM,cAApBtC,mCAAAA,wBAAwB,EAAE;4BAClCtB,qBAAqBA;;;;;;;AAM7C;AACA,MAAM0D,6BAEF,CAAC,EAAEE,MAAM,EAAED,QAAQ,EAAE3D,mBAAmB,EAAE;IAC1C,qBACI,KAACxB;kBACIoF,OAAOU,MAAM,CAAC,CAACC,KAAKC,OAAOC;gBAKVD;YAJd,IAAI,CAACA,MAAME,KAAK,CAACvD,MAAM,EAAE;gBACrB,OAAOoD;YACX;gBAEcC;YAAd,MAAM5C,QAAQ4C,CAAAA,qBAAAA,eAAAA,MAAM5C,KAAK,cAAX4C,mCAAAA,aAAaG,IAAI,gBAAjBH,+BAAAA,oBAAuB;YACrC,2CAA2C,GAC3CD,IAAIK,IAAI,eACJ,KAAC3G;gBAEGmG,SAAQ;gBACR/E,WAAWf,WAAWY,OAAO2F,kBAAkB,EAAE;oBAC7C,CAAC3F,OAAO4F,uBAAuB,CAAC,EAAE,CAAClD;gBACvC;0BAECA;eANI,CAAC,OAAO,EAAE+B,SAAS,CAAC,EAAEc,MAAM,MAAM,CAAC;YAShDF,IAAIK,IAAI,IACDJ,MAAME,KAAK,CAACrD,GAAG,CAAC,CAAC0D,MAAMN,sBACtB,KAACzF;oBAEGyC,IAAIsD,KAAKtD,EAAE;oBACXE,IAAIoD,KAAKpD,EAAE;oBACXC,OAAOmD,KAAKnD,KAAK;oBACjBC,UAAUkD,KAAKlD,QAAQ;oBACvBxC,WAAW6C;oBACXF,KAAKrD,cAAcoG,KAAK9C,OAAO,EAAE8C,KAAK/C,GAAG;oBACzC2B,UAAUA;oBACV3D,qBAAqBA;mBARhB,CAAC,CAAC,EAAE2D,SAAS,CAAC,EAAEoB,KAAKtD,EAAE,CAAC,CAAC,EAAEgD,OAAO;YAYnD,0CAA0C,GAE1C,OAAOF;QACX,GAAG,EAAE;;AAGjB;AAEA,SAASnD,WAAW,EAAE4D,QAAQ,EAAO;IACjC,MAAMC,OAAO1G,SAAS8C,GAAG,CAAC2D,UAAUE,CAAAA;QAChC,OAAOA,uBAASzG,eAAeyG,SAASA,QAAQ;IACpD;IACA,OAAOD,CAAAA,iBAAAA,2BAAAA,KAAM9D,MAAM,kBACf,MAACjD;QAAc2C,MAAK;QAAOxB,WAAWH,OAAOiG,MAAM;QAAEvE,WAAQ;;YACxDqE;0BACD,KAAC7E;gBAAIf,WAAWH,OAAOmD,OAAO;;;SAElC;AACR;AAEA,SAASF,cAAc,EAAE6C,QAAQ,EAAO;IACpC,qBACI,MAAC9G;QAAc2C,MAAK;QAAOxB,WAAWH,OAAOkG,SAAS;QAAExE,WAAQ;;0BAC5D,KAACR;gBAAIf,WAAWH,OAAOmD,OAAO;;YAC7B2C;;;AAGb"}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/titan-layout/layout-sidebar.tsx"],"sourcesContent":["import { Icon, Popover, Text, ThemeProvider } from '@servicetitan/anvil2';\nimport SvgClose from '@servicetitan/anvil2/assets/icons/material/round/close.svg';\nimport SvgCollapse from '@servicetitan/anvil2/assets/icons/st/gnav_menu_collapse.svg';\nimport SvgExpand from '@servicetitan/anvil2/assets/icons/st/gnav_menu_expand.svg';\nimport classNames from 'classnames';\nimport {\n Children,\n FC,\n Fragment,\n MouseEvent,\n ReactElement,\n isValidElement,\n useCallback,\n} from 'react';\nimport { NavigationItemData, NavigationSubmenuData } from '../../utils/navigation';\nimport { NavLinkComponentProps } from '../../utils/navigation-context';\nimport { getCounterTag, getSubmenuGroupTag } from '../../utils/side-nav';\nimport { NavigationComponentProps } from './interface-internal';\nimport { LayoutPlacementContext, useTitanLayoutContext } from './layout-context';\nimport {\n InternalSideNavigationGroup,\n InternalSideNavigationGroupLink,\n InternalSideNavigationLink,\n} from './layout-sidebar-links-internal';\nimport * as Styles from './layout-sidebar.module.less';\n\nimport { withTooltip } from './with-tooltip';\n\nexport interface LayoutSidebarProps {\n className?: string;\n top?: ReactElement[];\n bottom?: ReactElement;\n mainItems?: NavigationItemData[];\n barExpanded: boolean;\n submenusExpanded: string[] | undefined;\n drawerOpened: boolean;\n mobile: boolean;\n navigationComponent: FC<NavLinkComponentProps>;\n onBarExpandChange(expanded: boolean): void;\n onDrawerOpenChange(expanded: boolean): void;\n onSubmenuExpandChange(id: string, expanded: boolean): void;\n}\n\nexport const LayoutSidebar: FC<LayoutSidebarProps> = ({\n className,\n mobile,\n barExpanded,\n submenusExpanded,\n drawerOpened,\n onBarExpandChange,\n onSubmenuExpandChange,\n onDrawerOpenChange,\n mainItems,\n top,\n bottom,\n navigationComponent,\n}) => {\n const closeDrawer = () => {\n if (mobile) {\n onDrawerOpenChange?.(false);\n }\n };\n\n return (\n <LayoutPlacementContext.Provider value=\"side\">\n {mobile && drawerOpened && (\n <div className={Styles.navDrawerBackdrop} onClick={closeDrawer} />\n )}\n <div\n className={classNames(\n Styles.nav,\n mobile && Styles.navDrawer,\n mobile && drawerOpened && Styles.navDrawerOpened,\n !mobile && (barExpanded ? Styles.navWide : Styles.navSlim),\n className\n )}\n data-cy=\"side-navigation\"\n onClick={closeDrawer}\n >\n <ThemeProvider mode=\"dark\" className={Styles.navMain}>\n {mobile && (\n <div className={Styles.navCloseWrapper}>\n <div\n className={Styles.navClose}\n onClick={() => onBarExpandChange(false)}\n >\n <Icon svg={SvgClose} size=\"large\" />\n </div>\n </div>\n )}\n {!!top?.length && <SidebarTop>{top}</SidebarTop>}\n\n <div data-cy=\"navigation-items\">\n {mainItems?.map(item =>\n item.submenu ? (\n <SideNavigationGroupItem\n key={item.id}\n item={item}\n barExpanded={mobile ? drawerOpened : barExpanded}\n submenuExpanded={\n !!item.id && !!submenusExpanded?.includes(item.id)\n }\n onSubmenuExpand={onSubmenuExpandChange}\n navigationComponent={navigationComponent}\n />\n ) : (\n <InternalSideNavigationLink\n key={item.id}\n id={item.id}\n to={item.to}\n title={item.title}\n isActive={item.isActive}\n icon={item.icon}\n iconActive={item.iconActive}\n className={item.className}\n tag={getSubmenuGroupTag(\n item.submenu,\n getCounterTag(item.counter, item.tag)\n )}\n navigationComponent={navigationComponent}\n />\n )\n )}\n </div>\n\n {!!bottom && <SidebarBottom>{bottom}</SidebarBottom>}\n </ThemeProvider>\n\n {!mobile && (\n <div className={Styles.navFooter}>\n <div className={Styles.divider} />\n <div className={Styles.toggleWrapper}>\n <SideNavigationOptionsToggle\n appearance={barExpanded ? 'collapse-button' : 'expand'}\n onExpandedChange={() => onBarExpandChange(!barExpanded)}\n />\n </div>\n </div>\n )}\n </div>\n </LayoutPlacementContext.Provider>\n );\n};\nLayoutSidebar.displayName = 'LayoutSidebar';\n\n/** Side Navigation options toggle */\nconst SideNavigationOptionsToggle: FC<{\n appearance: 'expand' | 'collapse' | 'collapse-button';\n onExpandedChange?(expanded: boolean): void;\n}> = ({ appearance, onExpandedChange }) =>\n withTooltip(\n <div\n data-cy=\"navigation-left-options\"\n data-pendo=\"navigation-left-options\"\n className={classNames(Styles.toggle)}\n onClick={() => onExpandedChange?.(appearance === 'expand')}\n >\n <div className={Styles.toggleContent}>\n <div className={Styles.toggleIconWrapper}>\n <Icon\n className={Styles.toggleIcon}\n svg={appearance === 'expand' ? SvgExpand : SvgCollapse}\n />\n </div>\n\n {appearance === 'collapse-button' && (\n <span className={Styles.toggleText}>Collapse Menu</span>\n )}\n </div>\n </div>,\n appearance === 'expand'\n ? 'Expand Menu'\n : appearance === 'collapse'\n ? 'Collapse Menu'\n : undefined,\n { placement: 'right' }\n );\n\n/** Side Navigation menu item */\nconst SideNavigationGroupItem: FC<{\n item: NavigationItemData;\n navigationComponent: FC<NavLinkComponentProps>;\n barExpanded: boolean;\n submenuExpanded: boolean;\n onSubmenuExpand: undefined | ((id: string, expanded: boolean) => void);\n}> = ({ item, onSubmenuExpand, barExpanded, submenuExpanded, navigationComponent }) => {\n const onExpandToggle = useCallback(\n (e: MouseEvent<never>) => {\n e.preventDefault();\n e.stopPropagation();\n\n if (item.id) {\n onSubmenuExpand?.(item.id, !submenuExpanded);\n }\n },\n [item.id, submenuExpanded, onSubmenuExpand]\n );\n const {\n sidebar: {\n styles: { popoverContent },\n },\n } = useTitanLayoutContext();\n\n const tag = getSubmenuGroupTag(item.submenu, getCounterTag(item.counter, item.tag));\n\n return barExpanded ? (\n <InternalSideNavigationGroup\n id={item.id}\n to={item.to}\n title={item.title}\n isActive={item.isActive}\n icon={item.icon}\n iconActive={item.iconActive}\n className={item.className}\n tag={tag}\n submenuExpanded={submenuExpanded}\n onExpandToggle={onExpandToggle}\n navigationComponent={navigationComponent}\n >\n <SideNavigationGroupContent\n parentId={item.id}\n groups={item.submenu?.groups ?? []}\n navigationComponent={navigationComponent}\n />\n </InternalSideNavigationGroup>\n ) : (\n <Popover placement=\"right-start\" openOnHover delay={500}>\n <Popover.Trigger>\n {(triggerProps: any) => (\n <div {...triggerProps}>\n <InternalSideNavigationLink\n id={item.id}\n to={item.to}\n title={item.title}\n isActive={item.isActive}\n icon={item.icon}\n iconActive={item.iconActive}\n className={item.className}\n tag={tag}\n navigationComponent={navigationComponent}\n />\n </div>\n )}\n </Popover.Trigger>\n <Popover.Content style={popoverContent} className=\"z-global-nav-i\">\n <div className={Styles.submenuPopover}>\n <Text\n variant=\"headline\"\n el=\"h4\"\n size=\"small\"\n className=\"c-white m-b-half-i m-t-1\"\n >\n {item.title}\n </Text>\n <SideNavigationGroupContent\n parentId={item.id}\n groups={item.submenu?.groups ?? []}\n navigationComponent={navigationComponent}\n />\n </div>\n </Popover.Content>\n </Popover>\n );\n};\nconst SideNavigationGroupContent: FC<\n NavigationSubmenuData & NavigationComponentProps & { parentId: string }\n> = ({ groups, parentId, navigationComponent }) => {\n return (\n <Fragment>\n {groups.reduce((out, group, index) => {\n if (!group.links.length) {\n return out;\n }\n\n const title = group.title?.trim() ?? '';\n /* eslint-disable react/no-array-index-key */\n out.push(\n <Text\n key={`:group:${parentId}:${index}:title`}\n variant=\"eyebrow\"\n className={classNames(Styles.submenuGroupHeader, {\n [Styles.submenuGroupHeaderEmpty]: !title,\n })}\n >\n {title}\n </Text>\n );\n out.push(\n ...group.links.map((link, index) => (\n <InternalSideNavigationGroupLink\n key={`:${parentId}:${link.id}:${index}`}\n id={link.id}\n to={link.to}\n title={link.title}\n isActive={link.isActive}\n className={undefined}\n tag={getCounterTag(link.counter, link.tag)}\n parentId={parentId}\n navigationComponent={navigationComponent}\n />\n ))\n );\n /* eslint-enable react/no-array-index-key */\n\n return out;\n }, [] as ReactElement[])}\n </Fragment>\n );\n};\n\nfunction SidebarTop({ children }: any) {\n const list = Children.map(children, child => {\n return child && isValidElement(child) ? child : null;\n });\n return list?.length ? (\n <ThemeProvider mode=\"dark\" className={Styles.navTop} data-cy=\"navigation-items-top\">\n {list}\n <div className={Styles.divider} />\n </ThemeProvider>\n ) : null;\n}\n\nfunction SidebarBottom({ children }: any) {\n return (\n <ThemeProvider mode=\"dark\" className={Styles.navBottom} data-cy=\"navigation-items-bottom\">\n <div className={Styles.divider} />\n {children}\n </ThemeProvider>\n );\n}\n"],"names":["Icon","Popover","Text","ThemeProvider","SvgClose","SvgCollapse","SvgExpand","classNames","Children","Fragment","isValidElement","useCallback","getCounterTag","getSubmenuGroupTag","LayoutPlacementContext","useTitanLayoutContext","InternalSideNavigationGroup","InternalSideNavigationGroupLink","InternalSideNavigationLink","Styles","withTooltip","LayoutSidebar","className","mobile","barExpanded","submenusExpanded","drawerOpened","onBarExpandChange","onSubmenuExpandChange","onDrawerOpenChange","mainItems","top","bottom","navigationComponent","closeDrawer","Provider","value","div","navDrawerBackdrop","onClick","nav","navDrawer","navDrawerOpened","navWide","navSlim","data-cy","mode","navMain","navCloseWrapper","navClose","svg","size","length","SidebarTop","map","item","submenu","SideNavigationGroupItem","submenuExpanded","id","includes","onSubmenuExpand","to","title","isActive","icon","iconActive","tag","counter","SidebarBottom","navFooter","divider","toggleWrapper","SideNavigationOptionsToggle","appearance","onExpandedChange","displayName","data-pendo","toggle","toggleContent","toggleIconWrapper","toggleIcon","span","toggleText","undefined","placement","onExpandToggle","e","preventDefault","stopPropagation","sidebar","styles","popoverContent","SideNavigationGroupContent","parentId","groups","openOnHover","delay","Trigger","triggerProps","Content","style","submenuPopover","variant","el","reduce","out","group","index","links","trim","push","submenuGroupHeader","submenuGroupHeaderEmpty","link","children","list","child","navTop","navBottom"],"mappings":"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"}
|