@servicetitan/navigation 9.0.0 → 9.1.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/counter-tag.d.ts +1 -4
- package/dist/components/counter-tag.d.ts.map +1 -1
- package/dist/components/counter-tag.js.map +1 -1
- package/dist/components/layout.stories.js +2 -2
- package/dist/components/layout.stories.js.map +1 -1
- package/dist/components/left-navigation/index.d.ts +2 -0
- package/dist/components/left-navigation/index.d.ts.map +1 -1
- package/dist/components/left-navigation/index.js +2 -0
- package/dist/components/left-navigation/index.js.map +1 -1
- package/dist/components/left-navigation/interface-internal.d.ts +10 -0
- package/dist/components/left-navigation/interface-internal.d.ts.map +1 -0
- package/dist/components/left-navigation/interface-internal.js +2 -0
- package/dist/components/left-navigation/interface-internal.js.map +1 -0
- package/dist/components/left-navigation/interface.d.ts +11 -0
- package/dist/components/left-navigation/interface.d.ts.map +1 -0
- package/dist/components/left-navigation/interface.js +2 -0
- package/dist/components/left-navigation/interface.js.map +1 -0
- package/dist/components/left-navigation/side-navigation-links-internal.d.ts +23 -0
- package/dist/components/left-navigation/side-navigation-links-internal.d.ts.map +1 -0
- package/dist/components/left-navigation/side-navigation-links-internal.js +29 -0
- package/dist/components/left-navigation/side-navigation-links-internal.js.map +1 -0
- package/dist/components/left-navigation/side-navigation-links.d.ts +7 -0
- package/dist/components/left-navigation/side-navigation-links.d.ts.map +1 -0
- package/dist/components/left-navigation/side-navigation-links.js +20 -0
- package/dist/components/left-navigation/side-navigation-links.js.map +1 -0
- package/dist/components/left-navigation/side-navigation.d.ts +3 -11
- package/dist/components/left-navigation/side-navigation.d.ts.map +1 -1
- package/dist/components/left-navigation/side-navigation.js +12 -27
- package/dist/components/left-navigation/side-navigation.js.map +1 -1
- package/dist/components/left-navigation/side-navigation.module.less +11 -4
- package/dist/components/left-navigation/side-navigation.stories.d.ts +1 -0
- package/dist/components/left-navigation/side-navigation.stories.d.ts.map +1 -1
- package/dist/components/left-navigation/side-navigation.stories.js +26 -7
- package/dist/components/left-navigation/side-navigation.stories.js.map +1 -1
- package/dist/test/data.d.ts +1 -0
- package/dist/test/data.d.ts.map +1 -1
- package/dist/test/data.js +3 -2
- package/dist/test/data.js.map +1 -1
- package/dist/utils/counter-tag.d.ts +8 -0
- package/dist/utils/counter-tag.d.ts.map +1 -0
- package/dist/utils/counter-tag.js +2 -0
- package/dist/utils/counter-tag.js.map +1 -0
- package/dist/utils/side-nav.d.ts +3 -0
- package/dist/utils/side-nav.d.ts.map +1 -0
- package/dist/utils/side-nav.js +27 -0
- package/dist/utils/side-nav.js.map +1 -0
- package/package.json +4 -4
- package/src/components/counter-tag.tsx +1 -5
- package/src/components/layout.stories.tsx +2 -2
- package/src/components/left-navigation/index.ts +2 -0
- package/src/components/left-navigation/interface-internal.ts +11 -0
- package/src/components/left-navigation/interface.ts +13 -0
- package/src/components/left-navigation/side-navigation-links-internal.tsx +128 -0
- package/src/components/left-navigation/side-navigation-links.tsx +39 -0
- package/src/components/left-navigation/side-navigation.module.less +11 -4
- package/src/components/left-navigation/side-navigation.module.less.d.ts +2 -1
- package/src/components/left-navigation/side-navigation.stories.tsx +66 -7
- package/src/components/left-navigation/side-navigation.tsx +28 -131
- package/src/test/data.tsx +13 -2
- package/src/utils/counter-tag.ts +11 -0
- package/src/utils/side-nav.ts +34 -0
package/dist/test/data.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"data.js","sourceRoot":"","sources":["../../src/test/data.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,QAAQ,MAAM,qEAAqE,CAAC;AAC3F,OAAO,cAAc,MAAM,oEAAoE,CAAC;AAChG,OAAO,mBAAmB,MAAM,iEAAiE,CAAC;AAClG,OAAO,aAAa,MAAM,mEAAmE,CAAC;AAC9F,OAAO,cAAc,MAAM,4DAA4D,CAAC;AACxF,OAAO,QAAQ,MAAM,8DAA8D,CAAC;AACpF,OAAO,kBAAkB,MAAM,gEAAgE,CAAC;AAChG,OAAO,YAAY,MAAM,kEAAkE,CAAC;AAC5F,OAAO,iBAAiB,MAAM,+DAA+D,CAAC;AAC9F,OAAO,WAAW,MAAM,iEAAiE,CAAC;AAC1F,OAAO,iBAAiB,MAAM,gEAAgE,CAAC;AAC/F,OAAO,WAAW,MAAM,kEAAkE,CAAC;AAC3F,OAAO,iBAAiB,MAAM,gEAAgE,CAAC;AAC/F,OAAO,WAAW,MAAM,kEAAkE,CAAC;AAC3F,OAAO,kBAAkB,MAAM,gEAAgE,CAAC;AAChG,OAAO,YAAY,MAAM,kEAAkE,CAAC;AAC5F,OAAO,kBAAkB,MAAM,gEAAgE,CAAC;AAChG,OAAO,YAAY,MAAM,kEAAkE,CAAC;AAC5F,OAAO,YAAY,MAAM,0DAA0D,CAAC;AACpF,OAAO,MAAM,MAAM,4DAA4D,CAAC;AAChF,OAAO,kBAAkB,MAAM,gEAAgE,CAAC;AAChG,OAAO,YAAY,MAAM,kEAAkE,CAAC;AAC5F,OAAO,iBAAiB,MAAM,+DAA+D,CAAC;AAC9F,OAAO,WAAW,MAAM,iEAAiE,CAAC;AAC1F,OAAO,gBAAgB,MAAM,8DAA8D,CAAC;AAC5F,OAAO,UAAU,MAAM,gEAAgE,CAAC;AACxF,OAAO,iBAAiB,MAAM,+DAA+D,CAAC;AAC9F,OAAO,WAAW,MAAM,iEAAiE,CAAC;AAC1F,OAAO,cAAc,MAAM,4DAA4D,CAAC;AACxF,OAAO,QAAQ,MAAM,8DAA8D,CAAC;AAEpF,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,6BAA6B,CAAC;AAEhE,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"data.js","sourceRoot":"","sources":["../../src/test/data.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { CounterTagProps } from '../components/counter-tag';
|
|
2
|
+
export interface CounterTagPropsStrict {
|
|
3
|
+
value: number | boolean;
|
|
4
|
+
className?: string;
|
|
5
|
+
}
|
|
6
|
+
export type CounterTagType = boolean | number | CounterTagProps;
|
|
7
|
+
export declare const isCounterPropsObject: (tag?: CounterTagType) => tag is CounterTagProps;
|
|
8
|
+
//# sourceMappingURL=counter-tag.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"counter-tag.d.ts","sourceRoot":"","sources":["../../src/utils/counter-tag.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAE5D,MAAM,WAAW,qBAAqB;IAClC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,MAAM,GAAG,eAAe,CAAC;AAEhE,eAAO,MAAM,oBAAoB,SAAU,cAAc,KAAG,GAAG,IAAI,eACtB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"counter-tag.js","sourceRoot":"","sources":["../../src/utils/counter-tag.ts"],"names":[],"mappings":"AASA,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,GAAoB,EAA0B,EAAE,CACjF,CAAC,CAAC,GAAG,IAAK,GAAW,CAAC,KAAK,KAAK,SAAS,CAAC"}
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { HeaderNavigationItemData, HeaderNavigationItemSubmenu } from './navigation';
|
|
2
|
+
export declare function getSubmenuGroupTag(submenu: HeaderNavigationItemSubmenu | undefined, defaultTag: HeaderNavigationItemData['tag']): HeaderNavigationItemData['tag'];
|
|
3
|
+
//# sourceMappingURL=side-nav.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"side-nav.d.ts","sourceRoot":"","sources":["../../src/utils/side-nav.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,wBAAwB,EAAE,2BAA2B,EAAE,MAAM,cAAc,CAAC;AAErF,wBAAgB,kBAAkB,CAC9B,OAAO,EAAE,2BAA2B,GAAG,SAAS,EAChD,UAAU,EAAE,wBAAwB,CAAC,KAAK,CAAC,GAC5C,wBAAwB,CAAC,KAAK,CAAC,CA2BjC"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { isCounterPropsObject } from './counter-tag';
|
|
2
|
+
export function getSubmenuGroupTag(submenu, defaultTag) {
|
|
3
|
+
if (!submenu) {
|
|
4
|
+
return defaultTag;
|
|
5
|
+
}
|
|
6
|
+
let tagValue = undefined;
|
|
7
|
+
for (const group of submenu.groups) {
|
|
8
|
+
for (const link of group.links) {
|
|
9
|
+
const ltv = isCounterPropsObject(link.tag)
|
|
10
|
+
? link.tag.value
|
|
11
|
+
: link.tag;
|
|
12
|
+
if (ltv) {
|
|
13
|
+
if (typeof ltv === 'number') {
|
|
14
|
+
if (typeof tagValue !== 'number') {
|
|
15
|
+
tagValue = 0;
|
|
16
|
+
}
|
|
17
|
+
tagValue += ltv;
|
|
18
|
+
}
|
|
19
|
+
else if (typeof tagValue !== 'number') {
|
|
20
|
+
tagValue = true;
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
return tagValue !== null && tagValue !== void 0 ? tagValue : defaultTag;
|
|
26
|
+
}
|
|
27
|
+
//# sourceMappingURL=side-nav.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"side-nav.js","sourceRoot":"","sources":["../../src/utils/side-nav.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAGrD,MAAM,UAAU,kBAAkB,CAC9B,OAAgD,EAChD,UAA2C;IAE3C,IAAI,CAAC,OAAO,EAAE,CAAC;QACX,OAAO,UAAU,CAAC;IACtB,CAAC;IAED,IAAI,QAAQ,GAAiC,SAAS,CAAC;IAEvD,KAAK,MAAM,KAAK,IAAI,OAAO,CAAC,MAAM,EAAE,CAAC;QACjC,KAAK,MAAM,IAAI,IAAI,KAAK,CAAC,KAAK,EAAE,CAAC;YAC7B,MAAM,GAAG,GAAiC,oBAAoB,CAAC,IAAI,CAAC,GAAG,CAAC;gBACpE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK;gBAChB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;YAEf,IAAI,GAAG,EAAE,CAAC;gBACN,IAAI,OAAO,GAAG,KAAK,QAAQ,EAAE,CAAC;oBAC1B,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE,CAAC;wBAC/B,QAAQ,GAAG,CAAC,CAAC;oBACjB,CAAC;oBACD,QAAQ,IAAI,GAAG,CAAC;gBACpB,CAAC;qBAAM,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE,CAAC;oBACtC,QAAQ,GAAG,IAAI,CAAC;gBACpB,CAAC;YACL,CAAC;QACL,CAAC;IACL,CAAC;IAED,OAAO,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,UAAU,CAAC;AAClC,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@servicetitan/navigation",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.1.0",
|
|
4
4
|
"description": "Navigation components",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -26,11 +26,11 @@
|
|
|
26
26
|
"react": ">=18.0.0"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
|
-
"@servicetitan/anvil2": "~1.
|
|
29
|
+
"@servicetitan/anvil2": "~1.22.0",
|
|
30
30
|
"@servicetitan/design-system": "~14.5.1",
|
|
31
31
|
"@servicetitan/react-ioc": "^28.3.3",
|
|
32
32
|
"@servicetitan/tokens": ">=12.1.11",
|
|
33
|
-
"@testing-library/react": "^
|
|
33
|
+
"@testing-library/react": "^16.2.0",
|
|
34
34
|
"@types/react": "~18.2.55",
|
|
35
35
|
"mobx": "~6.10.2",
|
|
36
36
|
"mobx-react": "~9.0.2",
|
|
@@ -43,5 +43,5 @@
|
|
|
43
43
|
"less": true,
|
|
44
44
|
"webpack": false
|
|
45
45
|
},
|
|
46
|
-
"gitHead": "
|
|
46
|
+
"gitHead": "366480a6638afd9eab76d1652a1094284b359e79"
|
|
47
47
|
}
|
|
@@ -1,11 +1,7 @@
|
|
|
1
1
|
import { Tag } from '@servicetitan/design-system';
|
|
2
2
|
import classNames from 'classnames';
|
|
3
3
|
import { FC } from 'react';
|
|
4
|
-
|
|
5
|
-
export interface CounterTagPropsStrict {
|
|
6
|
-
value: number | boolean;
|
|
7
|
-
className?: string;
|
|
8
|
-
}
|
|
4
|
+
import { CounterTagPropsStrict } from '../utils/counter-tag';
|
|
9
5
|
|
|
10
6
|
export interface CounterTagProps extends CounterTagPropsStrict {
|
|
11
7
|
[key: string]: any;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Page, Sidebar } from '@servicetitan/design-system';
|
|
2
|
-
import { LocationInfo, withAnvil, withMemoryRouter } from '../test/data';
|
|
2
|
+
import { LocationInfo, withAnvil, withDefaultRedirects, withMemoryRouter } from '../test/data';
|
|
3
3
|
import {
|
|
4
4
|
WithAllMonolithData,
|
|
5
5
|
WithAllMonolithDataCommercial,
|
|
@@ -13,7 +13,7 @@ import {
|
|
|
13
13
|
export default {
|
|
14
14
|
title: 'Navigation/Layout',
|
|
15
15
|
parameters: {},
|
|
16
|
-
decorators: [withMemoryRouter, withAnvil],
|
|
16
|
+
decorators: [withDefaultRedirects, withMemoryRouter, withAnvil],
|
|
17
17
|
};
|
|
18
18
|
|
|
19
19
|
export const LeftNavLayout = () => {
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { NavLinkComponentProps } from '../../utils/navigation';
|
|
3
|
+
import { SideNavigationExpandedState } from './interface';
|
|
4
|
+
|
|
5
|
+
export interface NavigationComponentProps {
|
|
6
|
+
navigationComponent: FC<NavLinkComponentProps>;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
export interface SideNavigationExpandedProps {
|
|
10
|
+
expanded?: SideNavigationExpandedState;
|
|
11
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { HeaderNavigationItemData } from '../../utils/navigation';
|
|
2
|
+
|
|
3
|
+
export interface SideNavigationExpandedState {
|
|
4
|
+
bar: boolean;
|
|
5
|
+
submenus?: string[];
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
export interface SideNavigationLinkProps
|
|
9
|
+
extends Omit<HeaderNavigationItemData, 'iconName' | 'submenu'> {}
|
|
10
|
+
export interface SideNavigationTriggerProps
|
|
11
|
+
extends Omit<SideNavigationLinkProps, 'to' | 'isActive'> {
|
|
12
|
+
isActive?: boolean;
|
|
13
|
+
}
|
|
@@ -0,0 +1,128 @@
|
|
|
1
|
+
import { Icon } from '@servicetitan/anvil2';
|
|
2
|
+
import SvgGroupCollapse from '@servicetitan/anvil2/assets/icons/material/round/expand_less.svg';
|
|
3
|
+
import SvgGroupExpand from '@servicetitan/anvil2/assets/icons/material/round/expand_more.svg';
|
|
4
|
+
|
|
5
|
+
import classNames from 'classnames';
|
|
6
|
+
import { FC, Fragment } from 'react';
|
|
7
|
+
import { HeaderNavigationItemData } from '../../utils/navigation';
|
|
8
|
+
import { CounterTag } from '../counter-tag';
|
|
9
|
+
import { SideNavigationTriggerProps } from './interface';
|
|
10
|
+
import { NavigationComponentProps, SideNavigationExpandedProps } from './interface-internal';
|
|
11
|
+
import * as Styles from './side-navigation.module.less';
|
|
12
|
+
|
|
13
|
+
export interface InternalSideNavigationItemContentProps
|
|
14
|
+
extends Omit<HeaderNavigationItemData, 'iconName' | 'to' | ''> {
|
|
15
|
+
submenuExpanded: boolean | undefined;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
export const InternalSideNavigationItemContent: FC<InternalSideNavigationItemContentProps> = ({
|
|
19
|
+
icon,
|
|
20
|
+
iconActive,
|
|
21
|
+
iconClassName,
|
|
22
|
+
iconComponent: IconComponent,
|
|
23
|
+
tag,
|
|
24
|
+
title,
|
|
25
|
+
submenuExpanded,
|
|
26
|
+
}) => (
|
|
27
|
+
<Fragment>
|
|
28
|
+
<div className={Styles.navigationItemIconWrapper}>
|
|
29
|
+
{IconComponent ? (
|
|
30
|
+
<i className={classNames(Styles.navigationIcon, iconClassName)}>
|
|
31
|
+
<IconComponent />
|
|
32
|
+
</i>
|
|
33
|
+
) : (
|
|
34
|
+
<Fragment>
|
|
35
|
+
{icon && (
|
|
36
|
+
<Icon
|
|
37
|
+
svg={icon}
|
|
38
|
+
className={classNames(
|
|
39
|
+
Styles.navigationIcon,
|
|
40
|
+
Styles.navigationIconInactive,
|
|
41
|
+
iconClassName
|
|
42
|
+
)}
|
|
43
|
+
/>
|
|
44
|
+
)}
|
|
45
|
+
{iconActive && (
|
|
46
|
+
<Icon
|
|
47
|
+
svg={iconActive}
|
|
48
|
+
className={classNames(
|
|
49
|
+
Styles.navigationIcon,
|
|
50
|
+
Styles.navigationIconActive,
|
|
51
|
+
iconClassName
|
|
52
|
+
)}
|
|
53
|
+
/>
|
|
54
|
+
)}
|
|
55
|
+
</Fragment>
|
|
56
|
+
)}
|
|
57
|
+
|
|
58
|
+
<div className={Styles.navigationItemTextExpanded}>{title}</div>
|
|
59
|
+
{!!tag && <CounterTag data={tag} className={Styles.navigationItemCounter} />}
|
|
60
|
+
{typeof submenuExpanded === 'boolean' && (
|
|
61
|
+
<Icon
|
|
62
|
+
svg={submenuExpanded ? SvgGroupCollapse : SvgGroupExpand}
|
|
63
|
+
className={Styles.navigationItemGroupToggle}
|
|
64
|
+
/>
|
|
65
|
+
)}
|
|
66
|
+
</div>
|
|
67
|
+
|
|
68
|
+
<div
|
|
69
|
+
className={classNames(Styles.navigationItemTextCollapsed, {
|
|
70
|
+
[Styles.navigationItemTextSmall]: title.length >= 10,
|
|
71
|
+
})}
|
|
72
|
+
>
|
|
73
|
+
{title}
|
|
74
|
+
</div>
|
|
75
|
+
</Fragment>
|
|
76
|
+
);
|
|
77
|
+
|
|
78
|
+
export interface InternalSideNavigationLinkProps
|
|
79
|
+
extends Omit<HeaderNavigationItemData, 'iconName'>,
|
|
80
|
+
NavigationComponentProps,
|
|
81
|
+
SideNavigationExpandedProps {
|
|
82
|
+
submenuExpanded: boolean | undefined;
|
|
83
|
+
dataPrefix?: string;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
export const internalNavigationContentContainerProps = ({
|
|
87
|
+
className,
|
|
88
|
+
icon,
|
|
89
|
+
iconActive,
|
|
90
|
+
iconComponent,
|
|
91
|
+
id,
|
|
92
|
+
isActive,
|
|
93
|
+
prefix,
|
|
94
|
+
}: Omit<SideNavigationTriggerProps, 'isActive'> & { prefix: string; isActive?: any }) => ({
|
|
95
|
+
'data-cy': `${prefix}-${id}`,
|
|
96
|
+
'data-pendo': `${prefix}-${id}`,
|
|
97
|
+
'className': classNames(Styles.navigationItem, className, {
|
|
98
|
+
[Styles.navigationItemActive]: isActive === true,
|
|
99
|
+
[Styles.navigationItemIconSwitch]: !!icon && !!iconActive && !iconComponent,
|
|
100
|
+
}),
|
|
101
|
+
});
|
|
102
|
+
|
|
103
|
+
/** Side Navigation menu item (for internal usage) */
|
|
104
|
+
export const InternalSideNavigationLink: FC<InternalSideNavigationLinkProps> = ({
|
|
105
|
+
to,
|
|
106
|
+
className,
|
|
107
|
+
dataPrefix,
|
|
108
|
+
isActive,
|
|
109
|
+
navigationComponent: NavigationComponent,
|
|
110
|
+
submenuExpanded,
|
|
111
|
+
...props
|
|
112
|
+
}) => {
|
|
113
|
+
return (
|
|
114
|
+
<NavigationComponent
|
|
115
|
+
{...internalNavigationContentContainerProps({
|
|
116
|
+
...props,
|
|
117
|
+
prefix: dataPrefix ?? 'navigation-item',
|
|
118
|
+
className,
|
|
119
|
+
isActive,
|
|
120
|
+
})}
|
|
121
|
+
to={to}
|
|
122
|
+
isActive={typeof isActive === 'function' ? isActive : undefined}
|
|
123
|
+
activeClassName={Styles.navigationItemActive}
|
|
124
|
+
>
|
|
125
|
+
<InternalSideNavigationItemContent submenuExpanded={submenuExpanded} {...props} />
|
|
126
|
+
</NavigationComponent>
|
|
127
|
+
);
|
|
128
|
+
};
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import classNames from 'classnames';
|
|
2
|
+
import { FC, useContext } from 'react';
|
|
3
|
+
import { NavigationComponentContext } from '../../utils/navigation-context';
|
|
4
|
+
import { SideNavigationLinkProps, SideNavigationTriggerProps } from './interface';
|
|
5
|
+
import {
|
|
6
|
+
InternalSideNavigationItemContent,
|
|
7
|
+
InternalSideNavigationLink,
|
|
8
|
+
internalNavigationContentContainerProps,
|
|
9
|
+
} from './side-navigation-links-internal';
|
|
10
|
+
|
|
11
|
+
/** Side Navigation menu link */
|
|
12
|
+
export const SideNavigationLink: FC<SideNavigationLinkProps> = props => {
|
|
13
|
+
const NavigationComponent = useContext(NavigationComponentContext);
|
|
14
|
+
|
|
15
|
+
return (
|
|
16
|
+
<InternalSideNavigationLink
|
|
17
|
+
{...props}
|
|
18
|
+
navigationComponent={NavigationComponent}
|
|
19
|
+
submenuExpanded={undefined}
|
|
20
|
+
dataPrefix="navigation-link"
|
|
21
|
+
/>
|
|
22
|
+
);
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
/** Side Navigation menu link */
|
|
26
|
+
export const SideNavigationTrigger: FC<SideNavigationTriggerProps> = props => {
|
|
27
|
+
return (
|
|
28
|
+
<div
|
|
29
|
+
{...internalNavigationContentContainerProps({
|
|
30
|
+
...props,
|
|
31
|
+
prefix: 'navigation-trigger',
|
|
32
|
+
className: classNames(props.className, 'cursor-pointer'),
|
|
33
|
+
isActive: props.isActive,
|
|
34
|
+
})}
|
|
35
|
+
>
|
|
36
|
+
<InternalSideNavigationItemContent submenuExpanded={undefined} {...props} />
|
|
37
|
+
</div>
|
|
38
|
+
);
|
|
39
|
+
};
|
|
@@ -44,7 +44,10 @@
|
|
|
44
44
|
padding: @spacing-half;
|
|
45
45
|
}
|
|
46
46
|
|
|
47
|
-
.navigation-item-text {
|
|
47
|
+
.navigation-item-text-expanded {
|
|
48
|
+
display: none;
|
|
49
|
+
}
|
|
50
|
+
.navigation-item-text-collapsed {
|
|
48
51
|
font-family: @base-font-family;
|
|
49
52
|
font-size: 11px;
|
|
50
53
|
line-height: 11px;
|
|
@@ -52,7 +55,7 @@
|
|
|
52
55
|
text-align: center;
|
|
53
56
|
}
|
|
54
57
|
|
|
55
|
-
.navigation-item-text.navigation-item-text-small {
|
|
58
|
+
.navigation-item-text-collapsed.navigation-item-text-small {
|
|
56
59
|
font-size: 10.5px;
|
|
57
60
|
}
|
|
58
61
|
}
|
|
@@ -81,13 +84,17 @@
|
|
|
81
84
|
padding: @spacing-1 @spacing-half;
|
|
82
85
|
}
|
|
83
86
|
|
|
84
|
-
.navigation-item-text {
|
|
87
|
+
.navigation-item-text-expanded {
|
|
85
88
|
font-family: @base-font-family;
|
|
86
89
|
font-size: @typescale-3;
|
|
87
90
|
padding-left: @spacing-1;
|
|
88
91
|
flex: 1;
|
|
89
92
|
}
|
|
90
93
|
|
|
94
|
+
.navigation-item-text-collapsed {
|
|
95
|
+
display: none;
|
|
96
|
+
}
|
|
97
|
+
|
|
91
98
|
.navigation-item-counter {
|
|
92
99
|
margin-right: @spacing-1;
|
|
93
100
|
}
|
|
@@ -190,7 +197,7 @@
|
|
|
190
197
|
}
|
|
191
198
|
|
|
192
199
|
.navigation-item-counter {
|
|
193
|
-
color: @color-
|
|
200
|
+
color: @color-black;
|
|
194
201
|
font-weight: @font-weight-semibold;
|
|
195
202
|
min-width: 12px !important;
|
|
196
203
|
min-height: 12px !important;
|
|
@@ -9,7 +9,8 @@ export const navigationItemCounter: string;
|
|
|
9
9
|
export const navigationItemGroupToggle: string;
|
|
10
10
|
export const navigationItemIconSwitch: string;
|
|
11
11
|
export const navigationItemIconWrapper: string;
|
|
12
|
-
export const
|
|
12
|
+
export const navigationItemTextCollapsed: string;
|
|
13
|
+
export const navigationItemTextExpanded: string;
|
|
13
14
|
export const navigationItemTextSmall: string;
|
|
14
15
|
export const optionsIcon: string;
|
|
15
16
|
export const optionsIconWrapper: string;
|
|
@@ -1,14 +1,26 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
1
|
+
import { Popover } from '@servicetitan/anvil2';
|
|
2
|
+
import { Page } from '@servicetitan/design-system';
|
|
3
|
+
import { ComponentType, Fragment, useState } from 'react';
|
|
4
|
+
import {
|
|
5
|
+
LocationInfo,
|
|
6
|
+
items,
|
|
7
|
+
withAnvil,
|
|
8
|
+
withDefaultRedirects,
|
|
9
|
+
withMemoryRouter,
|
|
10
|
+
} from '../../test/data';
|
|
11
|
+
import {
|
|
12
|
+
SideNavigation,
|
|
13
|
+
SideNavigationExpandedState,
|
|
14
|
+
SideNavigationLink,
|
|
15
|
+
SideNavigationTrigger,
|
|
16
|
+
} from './';
|
|
5
17
|
|
|
6
18
|
const layout = (Story: ComponentType) => {
|
|
7
19
|
return (
|
|
8
20
|
<div className="d-f border" style={{ height: '800px' }}>
|
|
9
21
|
<Story />
|
|
10
22
|
<div className="flex-grow-1 flex-basis-0">
|
|
11
|
-
<Page
|
|
23
|
+
<Page>
|
|
12
24
|
<LocationInfo />
|
|
13
25
|
</Page>
|
|
14
26
|
</div>
|
|
@@ -18,7 +30,7 @@ const layout = (Story: ComponentType) => {
|
|
|
18
30
|
export default {
|
|
19
31
|
title: 'Navigation/SideNavigation',
|
|
20
32
|
component: SideNavigation,
|
|
21
|
-
decorators: [layout, withMemoryRouter, withAnvil],
|
|
33
|
+
decorators: [layout, withDefaultRedirects, withMemoryRouter, withAnvil],
|
|
22
34
|
parameters: {},
|
|
23
35
|
};
|
|
24
36
|
|
|
@@ -44,7 +56,7 @@ export const DefaultSideNavigation = () => {
|
|
|
44
56
|
items.pointOfSale,
|
|
45
57
|
items.reports,
|
|
46
58
|
]}
|
|
47
|
-
itemsTop={
|
|
59
|
+
itemsTop={<SideNavigationLink {...items.tasks} />}
|
|
48
60
|
/>
|
|
49
61
|
);
|
|
50
62
|
};
|
|
@@ -100,3 +112,50 @@ export const SideNavigationWithSubmenu = () => {
|
|
|
100
112
|
/>
|
|
101
113
|
);
|
|
102
114
|
};
|
|
115
|
+
|
|
116
|
+
const SideLinkWithPopover = () => {
|
|
117
|
+
return (
|
|
118
|
+
<Popover placement="right" openOnHover>
|
|
119
|
+
<Popover.Trigger>
|
|
120
|
+
{props => (
|
|
121
|
+
<div {...props}>
|
|
122
|
+
<SideNavigationTrigger {...items.marketing} isActive={false} />
|
|
123
|
+
</div>
|
|
124
|
+
)}
|
|
125
|
+
</Popover.Trigger>
|
|
126
|
+
<Popover.Content>popover content</Popover.Content>
|
|
127
|
+
</Popover>
|
|
128
|
+
);
|
|
129
|
+
};
|
|
130
|
+
|
|
131
|
+
export const SideNavigationWithCustomTopElements = () => {
|
|
132
|
+
const [expanded, setExpanded] = useState<SideNavigationExpandedState | undefined>(undefined);
|
|
133
|
+
return (
|
|
134
|
+
<SideNavigation
|
|
135
|
+
expanded={expanded}
|
|
136
|
+
onExpandedChange={setExpanded}
|
|
137
|
+
items={[
|
|
138
|
+
items.dashboard,
|
|
139
|
+
items.schedule,
|
|
140
|
+
items.dispatch,
|
|
141
|
+
|
|
142
|
+
items.accountingWithSubmenu,
|
|
143
|
+
items.purchasingWithSubmenu,
|
|
144
|
+
|
|
145
|
+
items.followUpsWithSubmenu,
|
|
146
|
+
items.reports,
|
|
147
|
+
items.marketing,
|
|
148
|
+
items.priceBook,
|
|
149
|
+
|
|
150
|
+
items.projects,
|
|
151
|
+
]}
|
|
152
|
+
itemsTop={
|
|
153
|
+
<Fragment>
|
|
154
|
+
<SideNavigationLink {...items.calls} />
|
|
155
|
+
<SideNavigationLink {...items.tasks} />
|
|
156
|
+
<SideLinkWithPopover />
|
|
157
|
+
</Fragment>
|
|
158
|
+
}
|
|
159
|
+
/>
|
|
160
|
+
);
|
|
161
|
+
};
|