@servicetitan/navigation 2.2.1 → 2.3.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/header-navigation/header-navigation-stacked.stories.js +2 -2
- package/dist/components/header-navigation/header-navigation-stacked.stories.js.map +1 -1
- package/dist/components/header-navigation/header-navigation-tiny.stories.d.ts +11 -0
- package/dist/components/header-navigation/header-navigation-tiny.stories.d.ts.map +1 -0
- package/dist/components/header-navigation/header-navigation-tiny.stories.js +22 -0
- package/dist/components/header-navigation/header-navigation-tiny.stories.js.map +1 -0
- package/dist/components/header-navigation/header-navigation.d.ts +23 -0
- package/dist/components/header-navigation/header-navigation.d.ts.map +1 -1
- package/dist/components/header-navigation/header-navigation.js +3 -0
- package/dist/components/header-navigation/header-navigation.js.map +1 -1
- package/dist/components/header-navigation/header-navigation.module.less +53 -0
- package/dist/components/logo/logo-company-title.d.ts +1 -0
- package/dist/components/logo/logo-company-title.d.ts.map +1 -1
- package/dist/components/logo/logo-company-title.js +2 -2
- package/dist/components/logo/logo-company-title.js.map +1 -1
- package/dist/components/side-navigation/index.d.ts +2 -0
- package/dist/components/side-navigation/index.d.ts.map +1 -0
- package/dist/components/side-navigation/index.js +2 -0
- package/dist/components/side-navigation/index.js.map +1 -0
- package/dist/components/side-navigation/side-navigation.d.ts +16 -0
- package/dist/components/side-navigation/side-navigation.d.ts.map +1 -0
- package/dist/components/side-navigation/side-navigation.js +18 -0
- package/dist/components/side-navigation/side-navigation.js.map +1 -0
- package/dist/components/side-navigation/side-navigation.module.less +57 -0
- package/dist/components/side-navigation/side-navigation.stories.d.ts +10 -0
- package/dist/components/side-navigation/side-navigation.stories.d.ts.map +1 -0
- package/dist/components/side-navigation/side-navigation.stories.js +47 -0
- package/dist/components/side-navigation/side-navigation.stories.js.map +1 -0
- package/package.json +2 -2
- package/src/components/header-navigation/header-navigation-stacked.stories.tsx +2 -2
- package/src/components/header-navigation/header-navigation-tiny.stories.tsx +125 -0
- package/src/components/header-navigation/header-navigation.module.less +53 -0
- package/src/components/header-navigation/header-navigation.module.less.d.ts +1 -0
- package/src/components/header-navigation/header-navigation.tsx +70 -0
- package/src/components/logo/logo-company-title.tsx +3 -2
- package/src/components/side-navigation/index.ts +1 -0
- package/src/components/side-navigation/side-navigation.module.less +57 -0
- package/src/components/side-navigation/side-navigation.module.less.d.ts +8 -0
- package/src/components/side-navigation/side-navigation.stories.tsx +88 -0
- package/src/components/side-navigation/side-navigation.tsx +93 -0
|
@@ -33,7 +33,7 @@ const items = {
|
|
|
33
33
|
const NavLinkMock = props => (_jsx("a", { href: props.to, target: props.target, onClick: e => {
|
|
34
34
|
e.preventDefault();
|
|
35
35
|
}, className: props.className, children: props.children }));
|
|
36
|
-
export const defaultNavigation = () => (_jsx(HeaderNavigationStacked, { left: _jsx(LogoCompanyTitle, { className: "m-l-1", fill: "#fff" }), leftClassName: "d-f align-items-center", items: [
|
|
36
|
+
export const defaultNavigation = () => (_jsx(HeaderNavigationStacked, { left: _jsx(LogoCompanyTitle, { className: "m-l-1", fill: "#fff", size: "150" }), leftClassName: "d-f align-items-center", items: [
|
|
37
37
|
items.dashboard,
|
|
38
38
|
items.calendar,
|
|
39
39
|
items.calls,
|
|
@@ -51,7 +51,7 @@ export const withLogoTextAndOverflow = () => (_jsx(HeaderNavigationStacked, { le
|
|
|
51
51
|
items.fleet,
|
|
52
52
|
], itemsOverflow: [items.calls, items.accounting, items.purchasing, items.dispatch], navigationComponent: NavLinkMock }));
|
|
53
53
|
const TimeZoneOffset = () => (_jsx("div", { className: "fs-2 ff-default p-r-2", children: _jsx("span", { children: "EST (-9 hrs)" }) }));
|
|
54
|
-
export const withAllMonolithData = () => (_jsx(HeaderNavigationStacked, { left: _jsx(LogoCompanyTitle, { className: "m-l-1", fill: "#fff" }), leftClassName: "d-f align-items-center", items: [
|
|
54
|
+
export const withAllMonolithData = () => (_jsx(HeaderNavigationStacked, { left: _jsx(LogoCompanyTitle, { className: "m-l-1", fill: "#fff", size: "150" }), leftClassName: "d-f align-items-center", items: [
|
|
55
55
|
items.dashboard,
|
|
56
56
|
items.calendar,
|
|
57
57
|
items.calls,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"header-navigation-stacked.stories.js","sourceRoot":"","sources":["../../../src/components/header-navigation/header-navigation-stacked.stories.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"header-navigation-stacked.stories.js","sourceRoot":"","sources":["../../../src/components/header-navigation/header-navigation-stacked.stories.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
declare const _default: {
|
|
3
|
+
title: string;
|
|
4
|
+
component: FC<import("./header-navigation").HeaderNavigationTinyProps>;
|
|
5
|
+
parameters: {};
|
|
6
|
+
};
|
|
7
|
+
export default _default;
|
|
8
|
+
export declare const defaultNavigation: () => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const withLogoTextAndOverflow: () => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare const withAllMonolithData: () => import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
//# sourceMappingURL=header-navigation-tiny.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"header-navigation-tiny.stories.d.ts","sourceRoot":"","sources":["../../../src/components/header-navigation/header-navigation-tiny.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;;;;;;AAQrC,wBAIE;AAgCF,eAAO,MAAM,iBAAiB,+CAM7B,CAAC;AAEF,eAAO,MAAM,uBAAuB,+CAUnC,CAAC;AAQF,eAAO,MAAM,mBAAmB,+CAqD/B,CAAC"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Input, Stack } from '@servicetitan/design-system';
|
|
3
|
+
import { Fragment } from 'react';
|
|
4
|
+
import { LogoCompanyTitle } from '../logo/logo-company-title';
|
|
5
|
+
import { LogoTitan, LogoTitanTitle } from '../logo/logo-titan-text';
|
|
6
|
+
import { ProfileDropdown } from '../profile-dropdown/profile-dropdown';
|
|
7
|
+
import * as Styles from './header-navigation-stories.module.less';
|
|
8
|
+
import { HeaderNavigationLink, HeaderNavigationTiny, HeaderNavigationTrigger } from './';
|
|
9
|
+
export default {
|
|
10
|
+
title: 'Navigation/HeaderNavigationTiny',
|
|
11
|
+
component: HeaderNavigationTiny,
|
|
12
|
+
parameters: {},
|
|
13
|
+
};
|
|
14
|
+
const SearchIcon = () => (_jsx("svg", { width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("g", { transform: "translate(0,4)", children: _jsx("path", { d: "M0 15.7992V13.9992H12V15.7992H0ZM0 9.49922V7.69922H6V9.49922H0ZM0 3.19922V1.39922H6V3.19922H0ZM22.74 15.7992L17.94 10.9992C17.42 11.3992 16.86 11.6992 16.26 11.8992C15.66 12.0992 15.04 12.1992 14.4 12.1992C12.74 12.1992 11.325 11.6142 10.155 10.4442C8.985 9.27422 8.4 7.85922 8.4 6.19922C8.4 4.53922 8.985 3.12422 10.155 1.95422C11.325 0.784219 12.74 0.199219 14.4 0.199219C16.06 0.199219 17.475 0.784219 18.645 1.95422C19.815 3.12422 20.4 4.53922 20.4 6.19922C20.4 6.83922 20.3 7.45922 20.1 8.05922C19.9 8.65922 19.6 9.21922 19.2 9.73922L24 14.5392L22.74 15.7992ZM14.393 10.3992C15.5577 10.3992 16.55 9.99157 17.37 9.17627C18.19 8.36099 18.6 7.37099 18.6 6.20627C18.6 5.04157 18.1923 4.04922 17.377 3.22922C16.5618 2.40922 15.5718 1.99922 14.407 1.99922C13.2423 1.99922 12.25 2.40687 11.43 3.22217C10.61 4.03745 10.2 5.02745 10.2 6.19217C10.2 7.35687 10.6077 8.34922 11.423 9.16922C12.2382 9.98922 13.2282 10.3992 14.393 10.3992Z", fill: "white" }) }) }));
|
|
15
|
+
const NavLinkMock = props => (_jsx("a", { href: props.to, target: props.target, onClick: e => {
|
|
16
|
+
e.preventDefault();
|
|
17
|
+
}, className: props.className, children: props.children }));
|
|
18
|
+
export const defaultNavigation = () => (_jsx(HeaderNavigationTiny, { left: _jsx(LogoCompanyTitle, { className: "m-l-1", fill: "#fff", size: "150" }), leftClassName: "d-f align-items-center", navigationComponent: NavLinkMock }));
|
|
19
|
+
export const withLogoTextAndOverflow = () => (_jsx(HeaderNavigationTiny, { left: _jsxs(Stack, { alignItems: "center", children: [_jsx(LogoTitan, { mantleFill: "#2270EE", size: 48 }), _jsx(LogoTitanTitle, { className: "c-white m-l-1", children: "Commercial" })] }), navigationComponent: NavLinkMock }));
|
|
20
|
+
const TimeZoneOffset = () => (_jsx("div", { className: "fs-2 ff-default p-r-2", children: _jsx("span", { children: "EST (-9 hrs)" }) }));
|
|
21
|
+
export const withAllMonolithData = () => (_jsx(HeaderNavigationTiny, { left: _jsx(LogoCompanyTitle, { className: "m-l-1", fill: "#fff", size: "150" }), leftClassName: "d-f align-items-center", navigationComponent: NavLinkMock, right: _jsxs(Fragment, { children: [_jsx(TimeZoneOffset, {}), _jsx(HeaderNavigationLink, { id: "search", to: "https://google.com", target: "_blank", iconComponent: SearchIcon, hint: "Search: for all the questions" }), _jsx(HeaderNavigationTrigger, { id: "dialpad", iconName: "phone", counter: 2 }), _jsx(HeaderNavigationTrigger, { id: "titanAdvisor", iconName: "rocket", iconClassName: Styles.rocketIcon }), _jsx(HeaderNavigationLink, { id: "settings", to: "https://google.com", target: "_blank", iconName: "settings", "aria-label": "search", hint: "Settings", isActive: true }), _jsxs(ProfileDropdown, { children: [_jsx(ProfileDropdown.Link, { id: "tasks", to: "https://googgle.com", counter: 10, children: "Task Management" }), _jsx(ProfileDropdown.Divider, {}), _jsxs(ProfileDropdown.Link, { id: "sign-out", to: "https://googgle.com", children: ["Sign Out", ' ', _jsx("span", { className: "c-neutral-100 m-l-half t-truncate", children: "James Bond" })] }), _jsx(ProfileDropdown.Section, { id: "userid", className: "c-neutral-100 fs-1", children: "User ID: 007" })] })] }), center: _jsx(Input, { placeholder: "Search smth", size: "xsmall", className: "w-100" }), centerClassName: "d-f align-items-center" }));
|
|
22
|
+
//# sourceMappingURL=header-navigation-tiny.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"header-navigation-tiny.stories.js","sourceRoot":"","sources":["../../../src/components/header-navigation/header-navigation-tiny.stories.tsx"],"names":[],"mappings":"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"}
|
|
@@ -60,4 +60,27 @@ export interface HeaderNavigationStackedProps {
|
|
|
60
60
|
overflow?: HeaderNavigationOverflowProps;
|
|
61
61
|
}
|
|
62
62
|
export declare const HeaderNavigationStacked: FC<HeaderNavigationStackedProps>;
|
|
63
|
+
export interface HeaderNavigationTinyProps {
|
|
64
|
+
/** container class name */
|
|
65
|
+
className?: string;
|
|
66
|
+
/** extra navigation */
|
|
67
|
+
right?: ReactNode;
|
|
68
|
+
/** extra navigation container class name */
|
|
69
|
+
rightClassName?: string;
|
|
70
|
+
/** container id */
|
|
71
|
+
id?: string;
|
|
72
|
+
/** left content (usually used for logo) */
|
|
73
|
+
left?: ReactElement;
|
|
74
|
+
/** left container class name */
|
|
75
|
+
leftClassName?: string;
|
|
76
|
+
/** center content */
|
|
77
|
+
center?: ReactElement;
|
|
78
|
+
/** center container class name */
|
|
79
|
+
centerClassName?: string;
|
|
80
|
+
/** minimal width for navigation bar */
|
|
81
|
+
minWidth?: number;
|
|
82
|
+
/** navigation component used for routing */
|
|
83
|
+
navigationComponent?: FC<NavLinkComponentProps>;
|
|
84
|
+
}
|
|
85
|
+
export declare const HeaderNavigationTiny: FC<HeaderNavigationTinyProps>;
|
|
63
86
|
//# sourceMappingURL=header-navigation.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"header-navigation.d.ts","sourceRoot":"","sources":["../../../src/components/header-navigation/header-navigation.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAEhF,OAAO,EAAE,EAAE,EAAE,YAAY,EAAE,SAAS,EAA4C,MAAM,OAAO,CAAC;AAC9F,OAAO,EAAE,wBAAwB,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAYzF,MAAM,WAAW,6BAA6B;IAC1C,SAAS,EAAE,kBAAkB,CAAC,WAAW,CAAC,CAAC;IAC3C,KAAK,EAAE,kBAAkB,CAAC,OAAO,CAAC,CAAC;IACnC,MAAM,CAAC,EAAE,OAAO,CAAC;CACpB;AA0CD,MAAM,WAAW,qBAAqB;IAClC,uBAAuB;IACvB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4CAA4C;IAC5C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mBAAmB;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,2CAA2C;IAC3C,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,gCAAgC;IAChC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,uCAAuC;IACvC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4BAA4B;IAC5B,KAAK,CAAC,EAAE,wBAAwB,EAAE,CAAC;IACnC,qCAAqC;IACrC,aAAa,CAAC,EAAE,wBAAwB,EAAE,CAAC;IAC3C,4CAA4C;IAC5C,mBAAmB,CAAC,EAAE,EAAE,CAAC,qBAAqB,CAAC,CAAC;IAChD,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,6BAA6B,CAAC;CAC5C;AAQD,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CAkGtD,CAAC;AAEF,MAAM,WAAW,4BAA4B;IACzC,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uBAAuB;IACvB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,4CAA4C;IAC5C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mBAAmB;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,2CAA2C;IAC3C,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,gCAAgC;IAChC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qBAAqB;IACrB,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,kCAAkC;IAClC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,uCAAuC;IACvC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4BAA4B;IAC5B,KAAK,CAAC,EAAE,wBAAwB,EAAE,CAAC;IACnC,qCAAqC;IACrC,aAAa,CAAC,EAAE,wBAAwB,EAAE,CAAC;IAC3C,4CAA4C;IAC5C,mBAAmB,CAAC,EAAE,EAAE,CAAC,qBAAqB,CAAC,CAAC;IAChD,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,6BAA6B,CAAC;CAC5C;AAED,eAAO,MAAM,uBAAuB,EAAE,EAAE,CAAC,4BAA4B,CA+GpE,CAAC"}
|
|
1
|
+
{"version":3,"file":"header-navigation.d.ts","sourceRoot":"","sources":["../../../src/components/header-navigation/header-navigation.tsx"],"names":[],"mappings":"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"}
|
|
@@ -93,4 +93,7 @@ export const HeaderNavigationStacked = ({ className, id, items, itemsOverflow, l
|
|
|
93
93
|
[Styles.calculating]: minimized === MinimizedState.Calculating,
|
|
94
94
|
}, className), style: { minWidth: `${minWidth}px` }, id: id, "data-cy": "header-navigation", children: [_jsx("div", { className: classNames(Styles.heTopLeft, leftClassName), "data-cy": "navigation-left", children: left }), _jsx("div", { className: classNames(Styles.heTopCenter, centerClassName), "data-cy": "navigation-center", children: center }), _jsx("div", { className: classNames('d-f flex-row justify-content-end align-items-center', Styles.heTopRight, rightClassName), "data-cy": "navigation-right", children: right }), _jsx("div", { ref: bottomRef, className: classNames(Styles.heBottom, 'd-if flex-grow-1 flex-basis-0 justify-content-center', Styles.center), "data-cy": "navigation-items", children: _jsxs("div", { ref: navigationRef, className: classNames('d-if'), children: [items === null || items === void 0 ? void 0 : items.map(item => (_createElement(HeaderNavigationItem, Object.assign({}, item, { minimized: minimized === MinimizedState.Minimized, main: true, key: item.id })))), !!(itemsOverflow === null || itemsOverflow === void 0 ? void 0 : itemsOverflow.length) && (_jsx(HeaderNavigationOverflow, { items: itemsOverflow, overflow: overflow }))] }) })] }) }));
|
|
95
95
|
};
|
|
96
|
+
export const HeaderNavigationTiny = ({ className, id, left, leftClassName, right, rightClassName, center, centerClassName, minWidth = 800, navigationComponent = DefaultNavLinkComponent, }) => {
|
|
97
|
+
return (_jsx(NavLinkContext.Provider, { value: navigationComponent, children: _jsxs("div", { className: classNames(Styles.headerTiny, className), style: { minWidth: `${minWidth}px` }, id: id, "data-cy": "header-navigation", children: [_jsx("div", { className: classNames(Styles.heTopLeft, leftClassName), "data-cy": "navigation-left", children: left }), _jsx("div", { className: classNames(Styles.heTopCenter, centerClassName), "data-cy": "navigation-center", children: center }), _jsx("div", { className: classNames('d-f flex-row justify-content-end align-items-center', Styles.heTopRight, rightClassName), "data-cy": "navigation-right", children: right })] }) }));
|
|
98
|
+
};
|
|
96
99
|
//# sourceMappingURL=header-navigation.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"header-navigation.js","sourceRoot":"","sources":["../../../src/components/header-navigation/header-navigation.tsx"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"header-navigation.js","sourceRoot":"","sources":["../../../src/components/header-navigation/header-navigation.tsx"],"names":[],"mappings":"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"}
|
|
@@ -162,6 +162,59 @@
|
|
|
162
162
|
}
|
|
163
163
|
}
|
|
164
164
|
|
|
165
|
+
.header-tiny {
|
|
166
|
+
display: grid;
|
|
167
|
+
grid-template-columns: repeat(3, 1fr);
|
|
168
|
+
grid-template-rows: 48px;
|
|
169
|
+
|
|
170
|
+
background-color: @color-neutral-500;
|
|
171
|
+
|
|
172
|
+
& > * {
|
|
173
|
+
overflow-y: hidden;
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
.he-top-left {
|
|
177
|
+
grid-column: span 1;
|
|
178
|
+
}
|
|
179
|
+
|
|
180
|
+
.he-top-center {
|
|
181
|
+
grid-column: span 1;
|
|
182
|
+
}
|
|
183
|
+
|
|
184
|
+
.he-top-right {
|
|
185
|
+
grid-column: span 1;
|
|
186
|
+
|
|
187
|
+
.navigation-icon {
|
|
188
|
+
height: 20px;
|
|
189
|
+
width: 20px;
|
|
190
|
+
font-size: @typescale-4;
|
|
191
|
+
}
|
|
192
|
+
|
|
193
|
+
& > * {
|
|
194
|
+
color: @color-white;
|
|
195
|
+
}
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
:global(.profile-dropdown-image) {
|
|
199
|
+
height: 24px;
|
|
200
|
+
width: 24px;
|
|
201
|
+
}
|
|
202
|
+
|
|
203
|
+
:global(.profile-dropdown-svg) {
|
|
204
|
+
height: 20px;
|
|
205
|
+
width: 20px;
|
|
206
|
+
}
|
|
207
|
+
|
|
208
|
+
.navigation-item-counter {
|
|
209
|
+
font-size: 8px !important;
|
|
210
|
+
}
|
|
211
|
+
|
|
212
|
+
.navigation-link .navigation-item-counter {
|
|
213
|
+
top: 12px;
|
|
214
|
+
right: 0;
|
|
215
|
+
}
|
|
216
|
+
}
|
|
217
|
+
|
|
165
218
|
.navigation-icon {
|
|
166
219
|
display: inline-block;
|
|
167
220
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"logo-company-title.d.ts","sourceRoot":"","sources":["../../../src/components/logo/logo-company-title.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAG3B,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,
|
|
1
|
+
{"version":3,"file":"logo-company-title.d.ts","sourceRoot":"","sources":["../../../src/components/logo/logo-company-title.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAG3B,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,CAsBrF,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
/* tslint:disable: max-line-length */
|
|
3
|
-
export const LogoCompanyTitle = ({ className, fill, }) => {
|
|
4
|
-
return (_jsxs("svg", { className: className, width:
|
|
3
|
+
export const LogoCompanyTitle = ({ className, fill, size = '162', }) => {
|
|
4
|
+
return (_jsxs("svg", { className: className, width: size, viewBox: "0 0 322 80", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M102.9 34.5c-1-.6-3.6-1.8-5.9-1.8-2 0-3.4.8-3.4 2.3 0 1.1.7 2 3.5 2.8.6.2 1.3.4 1.9.6 2.5.8 4.3 1.9 5.4 3.3 1.1 1.4 1.7 3.2 1.7 5.4 0 6.3-4.4 9.7-11.5 9.7-3.9 0-7.3-1.3-10-3.3l2.6-6.1c1.1 1 4.5 3 7.5 3 2.3 0 3.6-1.1 3.6-2.6 0-1.7-1.1-2.4-4-3.4-1-.3-2.5-.8-3.5-1.2-2.8-1.1-5-3.6-5-7.9 0-5.2 4.3-8.9 10.7-8.9 3.6 0 7 1.1 8.6 2.2l-2.2 5.9zm11.4 12.9c0 3 1.9 4.5 4.1 4.5 1.5 0 2.6-.6 3.3-1.9h6.3c-.8 3.7-4.2 6.8-9.7 6.8-7.4 0-11.2-4.6-11.2-10.7 0-6.2 4.5-10.5 10.8-10.5 6.8 0 10.6 4 10.6 10v1.8h-14.2zm7.8-4c-.2-1-.6-3.2-3.8-3.2-2.8 0-3.5 2.2-3.7 3.2h7.5zm79.1 4c0 3 1.9 4.5 4.1 4.5 1.5 0 2.6-.6 3.3-1.9h6.3c-.8 3.7-4.2 6.8-9.7 6.8-7.4 0-11.2-4.6-11.2-10.7 0-6.2 4.5-10.5 10.8-10.5 6.8 0 10.6 4 10.6 10v1.8h-14.2zm7.7-4c-.2-1-.6-3.2-3.8-3.2-2.8 0-3.5 2.2-3.7 3.2h7.5zm-78.4-7h6.8v3.1h.2c1.6-2.8 2.9-3.6 5.1-3.6 1 0 1.8.4 2 .4v6.4c-.7-.4-1.5-.7-2.6-.7-2.4 0-4.5 2.2-4.5 5.9v8.2h-7V36.4z", fill: fill }), _jsx("path", { d: "M150.4 36.4l4.7 10.1 4.8-10.1h7.8l-10.3 19.8h-4.7l-10.2-19.8h7.9zm17-6.7c0-.5.1-1 .3-1.5.2-.5.5-.9.8-1.3.4-.4.8-.6 1.3-.8.5-.2 1-.3 1.5-.3s1 .1 1.5.3c.5.2.9.5 1.3.8.4.4.6.8.8 1.3.2.5.3 1 .3 1.5s-.1 1-.3 1.5c-.2.5-.5.9-.8 1.3-.4.4-.8.6-1.3.8-.5.2-1 .3-1.5.3s-1-.1-1.5-.3c-.5-.2-.9-.5-1.3-.8s-.6-.8-.8-1.3c-.2-.5-.3-1-.3-1.5zm.5 6.7h7v19.8h-7zm25 6.4c-1.2-.8-2.8-1.2-4.1-1.2-2.8 0-4.8 1.9-4.8 4.8 0 2.8 2 4.7 4.8 4.7 1.3 0 2.9-.4 4.1-1.4v5.9c-.7.5-2.6 1.1-4.9 1.1-6.8 0-11.2-4-11.2-10.4s4.5-10.6 11.4-10.6c1.7 0 3.3.4 4.7 1.1v6zm36.2-9.3v22.7h-7.6V33.5h-6.2v-6.4h20v6.4h-6.2zm7.1-3.8c0-.5.1-1 .3-1.5.2-.5.5-.9.8-1.3.4-.4.8-.6 1.3-.8.5-.2 1-.3 1.5-.3s1 .1 1.5.3c.5.2.9.5 1.3.8.4.4.6.8.8 1.3.2.5.3 1 .3 1.5s-.1 1-.3 1.5c-.2.5-.5.9-.8 1.3-.4.4-.8.6-1.3.8-.5.2-1 .3-1.5.3s-1-.1-1.5-.3c-.5-.2-.9-.5-1.3-.8s-.6-.8-.8-1.3c-.2-.5-.3-1-.3-1.5zm.5 6.7h7v19.8h-7zm18.7 5.8v14h-7v-14h-2.7v-5.8h2.7v-5.9h7v5.9h3.5v5.8h-3.5zm29.1-5.8h7V40c1-1.8 3.4-4 6.3-4 1.4 0 2.6.2 3.6.7 1 .5 1.8 1.1 2.5 1.9.6.7 1 1.4 1.2 2.2.2.8.3 1.8.3 2.8v12.6h-7v-10c0-1-.1-1.8-.2-2.4-.1-.6-.4-1.1-.8-1.4-.3-.3-.7-.5-1-.7-.4-.1-.8-.2-1.2-.2-1.2 0-3.7 1.2-3.7 4.5v10.1h-7V36.4zm25.4-3.5c.5 0 1.1.1 1.6.4.5.3.9.7 1.2 1.2.3.5.4 1.1.4 1.6 0 .6-.1 1.1-.4 1.6s-.7.9-1.2 1.2-1.1.4-1.6.4-1.1-.1-1.6-.4-.9-.7-1.2-1.2c-.3-.5-.4-1.1-.4-1.6 0-.6.1-1.1.4-1.6s.7-.9 1.2-1.2c.5-.2 1-.4 1.6-.4zm0 .6c-.5 0-.9.1-1.3.4-.4.2-.8.6-1 1-.2.4-.4.9-.4 1.4 0 .5.1.9.4 1.3s.6.8 1 1 .9.4 1.3.4.9-.1 1.3-.4.8-.6 1-1 .4-.9.4-1.3c0-.5-.1-.9-.4-1.4-.2-.4-.6-.8-1-1-.4-.3-.9-.4-1.3-.4zm-1.5 4.5v-3.5h1.2c.4 0 .7 0 .9.1s.3.2.4.3c.1.2.2.3.2.5 0 .3-.1.5-.3.7-.2.2-.4.3-.7.3.1.1.2.1.3.2.1.1.3.4.5.7l.4.7h-.7l-.3-.6c-.2-.4-.4-.7-.6-.8-.1-.1-.3-.1-.5-.1h-.2V38h-.6zm.6-2h.7c.3 0 .6 0 .7-.1.1-.1.2-.2.2-.4 0-.1 0-.2-.1-.3l-.2-.2c-.1 0-.3-.1-.6-.1h-.7V36zm-34.3.4h7v19.8h-7v-2.4c-1.5 1.9-3.3 2.9-5.8 2.9-5.7 0-9.9-4.4-9.9-10.5 0-6 4.1-10.3 9.8-10.3 2.5 0 4.3 1 5.9 2.7v-2.2zm-8.6 9.8c0 2.6 1.8 4.6 4.4 4.6 2.9 0 4.5-2.1 4.5-4.5 0-2.3-1.6-4.5-4.5-4.5-2.6 0-4.4 1.8-4.4 4.4zM18.3 60s2.9 1.3 2.9 2.6c0 0-.2 1-1.2 1s-2.3-1.7-2.3-2.6c0-.9.6-1 .6-1zm-3.4-15.2c0-.1-.1-.1-.1-.1h-.2c-1 .4-1.6 1.4-1.5 2.5 0 5.5 14.4 6.1 22.3 15.9.8 1.1 2.1 1.7 3.5 1.7 1.8 0 3.5-.1 5.1-.4.2 0 .3-.2.4-.3.1-.2.1-.4-.1-.5-9.5-14-27.7-10.8-29.4-18.8zm56.2-19c-.6-1.2-1.5-2.1-3.1-2.5-1.6-.4-3.1-.2-4.1.7l-3.3-1.1c-.3-.7-.6-1.5-.9-2.2-.2-.5-.6-1-1.1-1.3-2.2-1.2-8-4.2-10.2-1.2 0 0-.1.1-.3.4l-.7-.2c-.4-1.4-1.6-2.4-3.3-2.8-1-.3-2-.2-2.9.1-.6.2-.6.9 0 1.2l2.6.9c.6.2.9.9.7 1.5-.2.6-.8.9-1.4.7 0 0-1.7-.5-2.8-.9-.6-.2-1.2.4-1 1 .4 1.3 1.6 2.4 3.3 2.8 1.4.4 2.8.1 3.7-.6l.6.2c0 1.5 1.1 3.2 2.2 3.8 1.6.9 3 .1 4.7-.7 0 0 4.1 3.3 2.2 12.8-5.3.6-7.2 2.5-9.1 4.4-1.2-.5-4.8-.7-6.8-.3.5-.6 1.4-1.2 2.6-1.7.5-.2.8-.7.8-1.2 0 0 2.4-.8 2.4-1.7s-3-.8-4.2-7.3c-.2-.8-.4-1.4-1.6-1.9 0 0-.3-.7.1-1.4.5-.7.7-1.1.6-1.7-.1-.6-1-1.1-1-1.1v-1s-2.4-1.8-2.4-4.4 3.3-5.7 4.3-6.6c.1-.1.1-.1.1-.2s-.1-.1-.1-.2c-2.1-1.4-4.5-2.1-7-2-14.1 0-17.3 12.7-20.3 19-.1.1-.1.3 0 .4 3 6.1 7.8 5.6 8.1 10.7.2 4.1-.7 4.2-1.7 4.1-.6-.1-1.5-.6-2.1-1-.1-.1-.2 0-.3 0-.1.1-.1.2-.1.2.4 1.1 1.4 3.4 4.5 3.4 1.6 0 2-1.5 2-2.8v-4.6c0-.5-.1-.9-.4-1.2-1.1-.9-3.3-3.2-3.3-5.2 0-.8.6-1.3 1.2-1.3 1.2 0 2.4 1.9 3.3 4.2.2.6.5.9.8 1.1h.1s.1-.1 0-.1c-.4-1.4-.5-2.8-.5-3.5 0-.3-.1-.5-.3-.7-.9-.8-3.4-3.3-3.4-6.9 0-5 7.8-4.5 9.4-4.4.5 1.7 1.5 2.4 2.1 2.7-2.4.9-7.7 2.6-7.7 5.7 0 3.3 5.3 3 5.3 3s-.8 6.5 5.2 8.5c0 0-.9 1-4.2 1-3 0-4.5-1.4-5.2-3 0-.1-.1-.1-.2-.1s-.1 0-.2.1c-.2.4-.3 1.2.3 2.1.9 1.5 2 2.3 2 4.2 0 1.4-1.2 2.2-1.7 2.5 0 0-.1.1 0 .1 0 0 0 .1.1.1 1.2.3 6.6 1.7 10.2 3.4h.1c.4-.3 3.5-2.3 3.7-5.1 0 0 .2-1.8-2.4-2.1 0 0 1.1-.5 3.2-.5 2 0 4.3 1.7.3 10.1v.1c.6.4 5.2 3.4 8.2 6.3.1.1.2.1.3.1.1 0 .2-.1.2-.1.4-.5 1.1-1.9 1.7-5.2 0-.3.3-.6.6-.7 1.8-.5 7.8-2.5 10.4-6.2 3.1-4.3 4.2-4.8 4.2-4.8s2-1.1 1.2-4.2c-.4-1.6-2.8-5.8-5.1-10 .5.4 1.2.7 1.9.9 1.4.4 2.8.1 3.8-.5.2-.1.3-.4.3-.7 0-.3-.2-.5-.4-.6l-2.6-.9c-.6-.2-1-.9-.7-1.6.2-.6.9-1 1.5-.8l2.3.8c.2.1.5 0 .7-.2 0 .5.1.2 0-.1zm-27.6-3.2c-2.2 0-3.2-1.9-3.2-1.9s2.6 2.5 6.1.5c0-.1-.6 1.4-2.9 1.4zm-2.6 9.7s.9 3.9 2.7 5.3c0 0-.1.4-.6.4s-1.6-.9-2-3c-.6-2.1-.1-2.7-.1-2.7zm-7.1-12c-.1 0-.2-.1-.2-.2-.4-2.9.9-6.4.9-6.4s-3 2.5-2.9 6.4c-2.6-.1-6.4.2-8.6 2.1-3.1 2.7-3.6 7.8-3.7 9.1 0 .1 0 .1-.1.2H19c-.7-.5-2.5-1.9-1.2-5.4 1.5-4.4 6.3-13.5 15.9-14.1 0 0 2.9-.1 4.9.9.1 0 .1.1.1.2s0 .1-.1.2c-.8.7-3.4 3-4.3 6.8 0 .1-.1.2-.2.2h-.3zm-.9 11.4c-3.6.7-4.9-.5-4.9-1.4 0-2.9 8.1-5.1 10.4-5.1.5.7-.3.6-.7 1.7-.3 1.1-1.1 1.4-2.3 1.6-1.2.2-2.3.7-3.2 1.5-.7.7 0 1 1.5.6 1.4-.4 1.6.2 2.2 0 .6-.2.1-.9.3-1.1.4-.2 1.2.3 1.2.3l2.1 1.3-2.5 1.3c-.2.1-.4.2-.4.6 0 .5 1.3.3 1.7.3.4 0 .5.7.5.7-.7.8-2.4.8-2.4.8.4.8 2.6.7 3 .7.4 0 .5.7.7 1.7.2 1 1.7 1.5 1.7 1.5.5 1.5-1.4 2-2.6 2-7-.1-6.3-9-6.3-9zM57.8 24l5 1.6s.9 1.8-.9 1.2c-1.9-.5-3.7-1.1-3.7-1.1s-1-.6-.4-1.7zm-4.7.2c-1.1-.1-.3-2-1.1-2.1-.3 0-.4 2.1-.8 1.8-.7-.6-.2-2-.1-2.6.1-.6.4-1.4-.3-.9s-1 1.5-1.2 2.3c-.2.8.2 1.2.5 2.2.3 1-.3.6-.3.6-3.1-1.9-.8-5.8-.8-5.8 1.3-2.3 3.3-1.6 3.3-1.6.4.1.5.4.5.9s.1.7.7.8c.6.1.8.8.8 2 0 1-.7 2.4-1.2 2.4zm2.5 0s-.8-.2-.5-1.3c.1-.4.2-.4.2-1s.2-1.3.6-1.5c0 0 .8 0 .8 2.2 0 .8-1.1 1.6-1.1 1.6zm0 19.2s-2 3.9-4.7 3.9c-1.1 0-1.9-.8-1.9-1.9 0-1.1 1.4-5.1 7.2-5.1 1.4 0 2.5.3 2.5 1.1s-1.4 2.3-3.1 2zM66 39.1s-.3 2.3-3.1 2.3c-2.7 0-5.2-4-6.1-13 .7 1.1 1.4 2.1 1.9 3.3 0-1.3.6-3.4-2.2-5.6 0 0 7.4 1.6 7.6 9.3 0 1.3-.8 2.7-1.3 3.2 0 0-.3.3-.1.7.2.4.7.3 1.4-.1.8-.5 1.9-1.3 1.9-.1zm.7-9.3s-1.9.5-3.9-1.6c0 0 .8.1 1-1 0 0 1.1 2.2 2.9 2.6zM18 54.4c3.7 2.2 11.9 4.7 13.6 9.3 0 0 .6 1-2.6 1-2.4 0-3.1-.6-4.8-2.7-2.5-3.1-7.6-4.9-7.6-7.2 0 0 0-1.2 1.4-.4z", fill: fill })] }));
|
|
5
5
|
};
|
|
6
6
|
//# sourceMappingURL=logo-company-title.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"logo-company-title.js","sourceRoot":"","sources":["../../../src/components/logo/logo-company-title.tsx"],"names":[],"mappings":";AAEA,qCAAqC;AACrC,MAAM,CAAC,MAAM,gBAAgB,
|
|
1
|
+
{"version":3,"file":"logo-company-title.js","sourceRoot":"","sources":["../../../src/components/logo/logo-company-title.tsx"],"names":[],"mappings":";AAEA,qCAAqC;AACrC,MAAM,CAAC,MAAM,gBAAgB,GAA6D,CAAC,EACvF,SAAS,EACT,IAAI,EACJ,IAAI,GAAG,KAAK,GACf,EAAE,EAAE;IACD,OAAO,CACH,eACI,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,IAAI,EACX,OAAO,EAAC,YAAY,EACpB,KAAK,EAAC,4BAA4B,aAElC,eACI,CAAC,EAAC,m3BAAm3B,EACr3B,IAAI,EAAE,IAAI,GACZ,EACF,eACI,CAAC,EAAC,22KAA22K,EAC72K,IAAI,EAAE,IAAI,GACZ,IACA,CACT,CAAC;AACN,CAAC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/side-navigation/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/side-navigation/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { HeaderNavigationItemData, NavLinkComponentProps } from '../../utils/navigation';
|
|
3
|
+
export interface SideNavigationProps {
|
|
4
|
+
/** container class name */
|
|
5
|
+
className?: string;
|
|
6
|
+
/** container id */
|
|
7
|
+
id?: string;
|
|
8
|
+
/** main navigation items */
|
|
9
|
+
items?: HeaderNavigationItemData[];
|
|
10
|
+
/** navigation component used for routing */
|
|
11
|
+
navigationComponent?: FC<NavLinkComponentProps>;
|
|
12
|
+
}
|
|
13
|
+
export declare const SideNavigation: FC<SideNavigationProps>;
|
|
14
|
+
/** Side Navigation menu item */
|
|
15
|
+
export declare const SideNavigationItem: FC<HeaderNavigationItemData>;
|
|
16
|
+
//# sourceMappingURL=side-navigation.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"side-navigation.d.ts","sourceRoot":"","sources":["../../../src/components/side-navigation/side-navigation.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAC3B,OAAO,EAAE,wBAAwB,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AASzF,MAAM,WAAW,mBAAmB;IAChC,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mBAAmB;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,4BAA4B;IAC5B,KAAK,CAAC,EAAE,wBAAwB,EAAE,CAAC;IACnC,4CAA4C;IAC5C,mBAAmB,CAAC,EAAE,EAAE,CAAC,qBAAqB,CAAC,CAAC;CACnD;AAED,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAqBlD,CAAC;AAEF,gCAAgC;AAChC,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,wBAAwB,CA6C3D,CAAC"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Icon, Tooltip } from '@servicetitan/design-system';
|
|
3
|
+
import classNames from 'classnames';
|
|
4
|
+
import { DefaultNavLinkComponent, NavLinkContext, useNavLink, } from '../../utils/navigation-context';
|
|
5
|
+
import { CounterTag } from '../counter-tag';
|
|
6
|
+
import * as Styles from './side-navigation.module.less';
|
|
7
|
+
export const SideNavigation = ({ className, id, items, navigationComponent = DefaultNavLinkComponent, }) => {
|
|
8
|
+
return (_jsx(NavLinkContext.Provider, { value: navigationComponent, children: _jsx("div", { className: classNames(Styles.sideNav, className), id: id, "data-cy": "side-navigation", children: _jsx("div", { className: Styles.sideNavContent, children: items === null || items === void 0 ? void 0 : items.map(item => (_jsx(SideNavigationItem, Object.assign({}, item), item.id))) }) }) }));
|
|
9
|
+
};
|
|
10
|
+
/** Side Navigation menu item */
|
|
11
|
+
export const SideNavigationItem = ({ id, to, title, hint, counter, className, iconClassName, iconComponent: IconComponent, iconName, isActive, }) => {
|
|
12
|
+
const NavigationComponent = useNavLink();
|
|
13
|
+
const iconClass = classNames(Styles.navigationIcon, iconClassName);
|
|
14
|
+
return (_jsx(Tooltip, { el: "div", direction: "r", text: title, children: _jsxs(NavigationComponent, { "data-cy": `navigation-item-${id}`, "data-pendo": `navigation-item-${id}`, to: to, title: hint, className: classNames(Styles.navigationItem, className, {
|
|
15
|
+
[Styles.navigationItemActive]: isActive === true,
|
|
16
|
+
}), isActive: typeof isActive === 'function' ? isActive : undefined, activeClassName: Styles.navigationItemActive, children: [IconComponent ? (_jsx("i", { className: iconClass, children: _jsx(IconComponent, {}) })) : iconName ? (_jsx(Icon, { name: iconName, className: iconClass })) : (_jsx("i", { className: iconClass })), !!counter && (_jsx(CounterTag, { data: counter, className: Styles.navigationItemCounter }))] }, id) }));
|
|
17
|
+
};
|
|
18
|
+
//# sourceMappingURL=side-navigation.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"side-navigation.js","sourceRoot":"","sources":["../../../src/components/side-navigation/side-navigation.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,UAAU,MAAM,YAAY,CAAC;AAGpC,OAAO,EACH,uBAAuB,EACvB,cAAc,EACd,UAAU,GACb,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,KAAK,MAAM,MAAM,+BAA+B,CAAC;AAaxD,MAAM,CAAC,MAAM,cAAc,GAA4B,CAAC,EACpD,SAAS,EACT,EAAE,EACF,KAAK,EACL,mBAAmB,GAAG,uBAAuB,GAChD,EAAE,EAAE;IACD,OAAO,CACH,KAAC,cAAc,CAAC,QAAQ,IAAC,KAAK,EAAE,mBAAmB,YAC/C,cACI,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,OAAO,EAAE,SAAS,CAAC,EAChD,EAAE,EAAE,EAAE,aACE,iBAAiB,YAEzB,cAAK,SAAS,EAAE,MAAM,CAAC,cAAc,YAChC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAChB,KAAC,kBAAkB,oBAAmB,IAAI,GAAjB,IAAI,CAAC,EAAE,CAAc,CACjD,CAAC,GACA,GACJ,GACgB,CAC7B,CAAC;AACN,CAAC,CAAC;AAEF,gCAAgC;AAChC,MAAM,CAAC,MAAM,kBAAkB,GAAiC,CAAC,EAC7D,EAAE,EACF,EAAE,EACF,KAAK,EACL,IAAI,EACJ,OAAO,EACP,SAAS,EACT,aAAa,EACb,aAAa,EAAE,aAAa,EAC5B,QAAQ,EACR,QAAQ,GACX,EAAE,EAAE;IACD,MAAM,mBAAmB,GAAG,UAAU,EAAE,CAAC;IACzC,MAAM,SAAS,GAAG,UAAU,CAAC,MAAM,CAAC,cAAc,EAAE,aAAa,CAAC,CAAC;IAEnE,OAAO,CACH,KAAC,OAAO,IAAC,EAAE,EAAC,KAAK,EAAC,SAAS,EAAC,GAAG,EAAC,IAAI,EAAE,KAAK,YACvC,MAAC,mBAAmB,eACP,mBAAmB,EAAE,EAAE,gBACpB,mBAAmB,EAAE,EAAE,EAEnC,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,IAAI,EACX,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,cAAc,EAAE,SAAS,EAAE;gBACpD,CAAC,MAAM,CAAC,oBAAoB,CAAC,EAAE,QAAQ,KAAK,IAAI;aACnD,CAAC,EACF,QAAQ,EAAE,OAAO,QAAQ,KAAK,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAC/D,eAAe,EAAE,MAAM,CAAC,oBAAoB,aAE3C,aAAa,CAAC,CAAC,CAAC,CACb,YAAG,SAAS,EAAE,SAAS,YACnB,KAAC,aAAa,KAAG,GACjB,CACP,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CACX,KAAC,IAAI,IAAC,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,GAAI,CACjD,CAAC,CAAC,CAAC,CACA,YAAG,SAAS,EAAE,SAAS,GAAI,CAC9B,EAEA,CAAC,CAAC,OAAO,IAAI,CACV,KAAC,UAAU,IAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,CAAC,qBAAqB,GAAI,CACzE,KArBI,EAAE,CAsBW,GAChB,CACb,CAAC;AACN,CAAC,CAAC"}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
/* stylelint-disable no-descending-specificity */
|
|
2
|
+
@import (reference) '@servicetitan/tokens/core/tokens.less';
|
|
3
|
+
|
|
4
|
+
.side-nav {
|
|
5
|
+
width: 56px;
|
|
6
|
+
display: flex;
|
|
7
|
+
flex-direction: column;
|
|
8
|
+
align-items: center;
|
|
9
|
+
|
|
10
|
+
background-color: #ebebeb;
|
|
11
|
+
border-right: 1px solid #c5c5cb;
|
|
12
|
+
|
|
13
|
+
.side-nav-content {
|
|
14
|
+
display: flex;
|
|
15
|
+
flex-direction: column;
|
|
16
|
+
align-items: center;
|
|
17
|
+
overflow-y: auto;
|
|
18
|
+
margin-top: @spacing-1;
|
|
19
|
+
margin-bottom: @spacing-1;
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.navigation-item {
|
|
24
|
+
width: 56px;
|
|
25
|
+
font-family: @base-font-family;
|
|
26
|
+
color: #383838;
|
|
27
|
+
position: relative;
|
|
28
|
+
display: flex;
|
|
29
|
+
justify-content: center;
|
|
30
|
+
flex-wrap: nowrap;
|
|
31
|
+
text-wrap: nowrap;
|
|
32
|
+
|
|
33
|
+
padding-top: @spacing-1;
|
|
34
|
+
padding-bottom: @spacing-1;
|
|
35
|
+
|
|
36
|
+
&.navigation-item-active {
|
|
37
|
+
color: @color-purple-600 !important;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
&:hover:not(.navigation-item-active) {
|
|
41
|
+
opacity: 0.7;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.navigation-item-counter {
|
|
45
|
+
color: @color-white;
|
|
46
|
+
font-weight: @font-weight-semibold;
|
|
47
|
+
position: absolute;
|
|
48
|
+
right: 2px;
|
|
49
|
+
top: -2px;
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.navigation-icon {
|
|
54
|
+
height: 24px;
|
|
55
|
+
width: 24px;
|
|
56
|
+
font-size: 24px;
|
|
57
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { ComponentType, FC } from 'react';
|
|
2
|
+
declare const _default: {
|
|
3
|
+
title: string;
|
|
4
|
+
component: FC<import("./side-navigation").SideNavigationProps>;
|
|
5
|
+
decorators: ((Story: ComponentType) => import("react/jsx-runtime").JSX.Element)[];
|
|
6
|
+
parameters: {};
|
|
7
|
+
};
|
|
8
|
+
export default _default;
|
|
9
|
+
export declare const defaultSideNavigation: () => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
//# sourceMappingURL=side-navigation.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"side-navigation.stories.d.ts","sourceRoot":"","sources":["../../../src/components/side-navigation/side-navigation.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;;;;;;;AAY1C,wBAKE;AAkDF,eAAO,MAAM,qBAAqB,+CAoBjC,CAAC"}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { SideNavigation } from './';
|
|
3
|
+
const layout = (Story) => {
|
|
4
|
+
return (_jsxs("div", { className: "d-f border", style: { height: '800px' }, children: [_jsx(Story, {}), _jsx("div", { className: "flex-grow-1 flex-basis-0" })] }));
|
|
5
|
+
};
|
|
6
|
+
export default {
|
|
7
|
+
title: 'Navigation/SideNavigation',
|
|
8
|
+
component: SideNavigation,
|
|
9
|
+
decorators: [layout],
|
|
10
|
+
parameters: {},
|
|
11
|
+
};
|
|
12
|
+
const getItem = (id, data) => (Object.assign({ id, to: '/', title: id[0].toUpperCase() + id.substring(1), hint: id }, (data !== null && data !== void 0 ? data : {})));
|
|
13
|
+
const InventoryIcon = () => (_jsxs("svg", { width: "20", xmlns: "http://www.w3.org/2000/svg", viewBox: "-293 385 24 24", fill: "currentColor", children: [_jsx("polyline", { points: "-288,400.9 -282,404.3 -282,397.6 -288,394.2 -288,400.9 " }), _jsx("path", { d: "M-272,401.5c0,0.4-0.2,0.7-0.5,0.9l-7.9,4.4c-0.2,0.1-0.4,0.2-0.6,0.2s-0.4-0.1-0.6-0.2l-7.9-4.4c-0.3-0.2-0.5-0.5-0.5-0.9v-9c0-0.4,0.2-0.7,0.5-0.9l7.9-4.4c0.2-0.1,0.4-0.2,0.6-0.2s0.4,0.1,0.6,0.2l7.9,4.4c0.3,0.2,0.5,0.5,0.5,0.9V401.5 M-287,392.5 l6,3.4l5.9-3.3l-5.9-3.4L-287,392.5 M-274,400.9v-6.7l-6,3.4v6.7L-274,400.9z" })] }));
|
|
14
|
+
const items = {
|
|
15
|
+
calendar: getItem('calendar', { iconName: 'event' }),
|
|
16
|
+
calls: getItem('calls', { iconName: 'local_phone', isActive: true, counter: 12 }),
|
|
17
|
+
dashboard: getItem('dashboard', { iconName: 'odometer', isActive: true }),
|
|
18
|
+
dispatch: getItem('dispatch', { iconName: 'location_disabled', counter: 1 }),
|
|
19
|
+
fleet: getItem('fleet', { iconName: 'fleet-pro', title: 'Fleet Pro' }),
|
|
20
|
+
followUps: getItem('followUps', { iconName: 'flag', title: 'Follow Ups' }),
|
|
21
|
+
inventory: getItem('inventory', { iconName: 'toys' }),
|
|
22
|
+
purchasing: getItem('purchasing', { iconComponent: InventoryIcon }),
|
|
23
|
+
accounting: getItem('accounting', { iconName: 'assignment' }),
|
|
24
|
+
marketing: getItem('marketing', { iconName: 'bullhorn' }),
|
|
25
|
+
priceBook: getItem('priceBook', { iconName: 'book' }),
|
|
26
|
+
pointOfSale: getItem('pointOfSale', { iconName: 'cash-register' }),
|
|
27
|
+
projects: getItem('projects', { iconName: 'folder_special' }),
|
|
28
|
+
reports: getItem('reports', { iconName: 'poll' }),
|
|
29
|
+
};
|
|
30
|
+
const NavLinkMock = props => (_jsx("a", { href: props.to, target: props.target, onClick: e => {
|
|
31
|
+
e.preventDefault();
|
|
32
|
+
}, className: props.className, children: props.children }));
|
|
33
|
+
export const defaultSideNavigation = () => (_jsx(SideNavigation, { navigationComponent: NavLinkMock, items: [
|
|
34
|
+
items.dashboard,
|
|
35
|
+
items.calendar,
|
|
36
|
+
items.calls,
|
|
37
|
+
items.accounting,
|
|
38
|
+
items.dispatch,
|
|
39
|
+
items.fleet,
|
|
40
|
+
items.followUps,
|
|
41
|
+
items.inventory,
|
|
42
|
+
items.marketing,
|
|
43
|
+
items.priceBook,
|
|
44
|
+
items.pointOfSale,
|
|
45
|
+
items.reports,
|
|
46
|
+
] }));
|
|
47
|
+
//# sourceMappingURL=side-navigation.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"side-navigation.stories.js","sourceRoot":"","sources":["../../../src/components/side-navigation/side-navigation.stories.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,IAAI,CAAC;AAEpC,MAAM,MAAM,GAAG,CAAC,KAAoB,EAAE,EAAE;IACpC,OAAO,CACH,eAAK,SAAS,EAAC,YAAY,EAAC,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,aAClD,KAAC,KAAK,KAAG,EACT,cAAK,SAAS,EAAC,0BAA0B,GAAG,IAC1C,CACT,CAAC;AACN,CAAC,CAAC;AACF,eAAe;IACX,KAAK,EAAE,2BAA2B;IAClC,SAAS,EAAE,cAAc;IACzB,UAAU,EAAE,CAAC,MAAM,CAAC;IACpB,UAAU,EAAE,EAAE;CACjB,CAAC;AAEF,MAAM,OAAO,GAAG,CACZ,EAAU,EACV,IAAuC,EACf,EAAE,CAAC,iBAC3B,EAAE,EACF,EAAE,EAAE,GAAG,EACP,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC,EAC5C,IAAI,EAAE,EAAE,IACL,CAAC,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,EAAE,CAAC,EACjB,CAAC;AAEH,MAAM,aAAa,GAAG,GAAG,EAAE,CAAC,CACxB,eAAK,KAAK,EAAC,IAAI,EAAC,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,gBAAgB,EAAC,IAAI,EAAC,cAAc,aAC3F,mBAAU,MAAM,EAAC,yDAAyD,GAAG,EAC7E,eAAM,CAAC,EAAC,8TAA8T,GAAG,IACvU,CACT,CAAC;AAEF,MAAM,KAAK,GAAG;IACV,QAAQ,EAAE,OAAO,CAAC,UAAU,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC;IACpD,KAAK,EAAE,OAAO,CAAC,OAAO,EAAE,EAAE,QAAQ,EAAE,aAAa,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC;IACjF,SAAS,EAAE,OAAO,CAAC,WAAW,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;IACzE,QAAQ,EAAE,OAAO,CAAC,UAAU,EAAE,EAAE,QAAQ,EAAE,mBAAmB,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC;IAC5E,KAAK,EAAE,OAAO,CAAC,OAAO,EAAE,EAAE,QAAQ,EAAE,WAAW,EAAE,KAAK,EAAE,WAAW,EAAE,CAAC;IACtE,SAAS,EAAE,OAAO,CAAC,WAAW,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC;IAC1E,SAAS,EAAE,OAAO,CAAC,WAAW,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,CAAC;IACrD,UAAU,EAAE,OAAO,CAAC,YAAY,EAAE,EAAE,aAAa,EAAE,aAAa,EAAE,CAAC;IACnE,UAAU,EAAE,OAAO,CAAC,YAAY,EAAE,EAAE,QAAQ,EAAE,YAAY,EAAE,CAAC;IAC7D,SAAS,EAAE,OAAO,CAAC,WAAW,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,CAAC;IACzD,SAAS,EAAE,OAAO,CAAC,WAAW,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,CAAC;IACrD,WAAW,EAAE,OAAO,CAAC,aAAa,EAAE,EAAE,QAAQ,EAAE,eAAe,EAAE,CAAC;IAClE,QAAQ,EAAE,OAAO,CAAC,UAAU,EAAE,EAAE,QAAQ,EAAE,gBAAgB,EAAE,CAAC;IAC7D,OAAO,EAAE,OAAO,CAAC,SAAS,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,CAAC;CACpD,CAAC;AAEF,MAAM,WAAW,GAA8B,KAAK,CAAC,EAAE,CAAC,CACpD,YACI,IAAI,EAAE,KAAK,CAAC,EAAE,EACd,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,OAAO,EAAE,CAAC,CAAC,EAAE;QACT,CAAC,CAAC,cAAc,EAAE,CAAC;IACvB,CAAC,EACD,SAAS,EAAE,KAAK,CAAC,SAAS,YAEzB,KAAK,CAAC,QAAQ,GACf,CACP,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAAG,EAAE,CAAC,CACvC,KAAC,cAAc,IACX,mBAAmB,EAAE,WAAW,EAChC,KAAK,EAAE;QACH,KAAK,CAAC,SAAS;QACf,KAAK,CAAC,QAAQ;QACd,KAAK,CAAC,KAAK;QACX,KAAK,CAAC,UAAU;QAChB,KAAK,CAAC,QAAQ;QAEd,KAAK,CAAC,KAAK;QACX,KAAK,CAAC,SAAS;QACf,KAAK,CAAC,SAAS;QAEf,KAAK,CAAC,SAAS;QACf,KAAK,CAAC,SAAS;QACf,KAAK,CAAC,WAAW;QACjB,KAAK,CAAC,OAAO;KAChB,GACH,CACL,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@servicetitan/navigation",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.3.0",
|
|
4
4
|
"description": "Navigation components",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -43,5 +43,5 @@
|
|
|
43
43
|
"less": true,
|
|
44
44
|
"webpack": false
|
|
45
45
|
},
|
|
46
|
-
"gitHead": "
|
|
46
|
+
"gitHead": "bc2868724b59e5aa753e2f2313a6316d44407b8e"
|
|
47
47
|
}
|
|
@@ -80,7 +80,7 @@ const NavLinkMock: FC<NavLinkComponentProps> = props => (
|
|
|
80
80
|
|
|
81
81
|
export const defaultNavigation = () => (
|
|
82
82
|
<HeaderNavigationStacked
|
|
83
|
-
left={<LogoCompanyTitle className="m-l-1" fill="#fff" />}
|
|
83
|
+
left={<LogoCompanyTitle className="m-l-1" fill="#fff" size="150" />}
|
|
84
84
|
leftClassName="d-f align-items-center"
|
|
85
85
|
items={[
|
|
86
86
|
items.dashboard,
|
|
@@ -124,7 +124,7 @@ const TimeZoneOffset: FC = () => (
|
|
|
124
124
|
|
|
125
125
|
export const withAllMonolithData = () => (
|
|
126
126
|
<HeaderNavigationStacked
|
|
127
|
-
left={<LogoCompanyTitle className="m-l-1" fill="#fff" />}
|
|
127
|
+
left={<LogoCompanyTitle className="m-l-1" fill="#fff" size="150" />}
|
|
128
128
|
leftClassName="d-f align-items-center"
|
|
129
129
|
items={[
|
|
130
130
|
items.dashboard,
|
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
import { Input, Stack } from '@servicetitan/design-system';
|
|
2
|
+
import { FC, Fragment } from 'react';
|
|
3
|
+
import { NavLinkComponentProps } from '../../utils/navigation';
|
|
4
|
+
import { LogoCompanyTitle } from '../logo/logo-company-title';
|
|
5
|
+
import { LogoTitan, LogoTitanTitle } from '../logo/logo-titan-text';
|
|
6
|
+
import { ProfileDropdown } from '../profile-dropdown/profile-dropdown';
|
|
7
|
+
import * as Styles from './header-navigation-stories.module.less';
|
|
8
|
+
import { HeaderNavigationLink, HeaderNavigationTiny, HeaderNavigationTrigger } from './';
|
|
9
|
+
|
|
10
|
+
export default {
|
|
11
|
+
title: 'Navigation/HeaderNavigationTiny',
|
|
12
|
+
component: HeaderNavigationTiny,
|
|
13
|
+
parameters: {},
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
const SearchIcon = () => (
|
|
17
|
+
<svg
|
|
18
|
+
width="1em"
|
|
19
|
+
height="1em"
|
|
20
|
+
viewBox="0 0 24 24"
|
|
21
|
+
fill="none"
|
|
22
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
23
|
+
>
|
|
24
|
+
<g transform="translate(0,4)">
|
|
25
|
+
<path
|
|
26
|
+
d="M0 15.7992V13.9992H12V15.7992H0ZM0 9.49922V7.69922H6V9.49922H0ZM0 3.19922V1.39922H6V3.19922H0ZM22.74 15.7992L17.94 10.9992C17.42 11.3992 16.86 11.6992 16.26 11.8992C15.66 12.0992 15.04 12.1992 14.4 12.1992C12.74 12.1992 11.325 11.6142 10.155 10.4442C8.985 9.27422 8.4 7.85922 8.4 6.19922C8.4 4.53922 8.985 3.12422 10.155 1.95422C11.325 0.784219 12.74 0.199219 14.4 0.199219C16.06 0.199219 17.475 0.784219 18.645 1.95422C19.815 3.12422 20.4 4.53922 20.4 6.19922C20.4 6.83922 20.3 7.45922 20.1 8.05922C19.9 8.65922 19.6 9.21922 19.2 9.73922L24 14.5392L22.74 15.7992ZM14.393 10.3992C15.5577 10.3992 16.55 9.99157 17.37 9.17627C18.19 8.36099 18.6 7.37099 18.6 6.20627C18.6 5.04157 18.1923 4.04922 17.377 3.22922C16.5618 2.40922 15.5718 1.99922 14.407 1.99922C13.2423 1.99922 12.25 2.40687 11.43 3.22217C10.61 4.03745 10.2 5.02745 10.2 6.19217C10.2 7.35687 10.6077 8.34922 11.423 9.16922C12.2382 9.98922 13.2282 10.3992 14.393 10.3992Z"
|
|
27
|
+
fill="white"
|
|
28
|
+
/>
|
|
29
|
+
</g>
|
|
30
|
+
</svg>
|
|
31
|
+
);
|
|
32
|
+
|
|
33
|
+
const NavLinkMock: FC<NavLinkComponentProps> = props => (
|
|
34
|
+
<a
|
|
35
|
+
href={props.to}
|
|
36
|
+
target={props.target}
|
|
37
|
+
onClick={e => {
|
|
38
|
+
e.preventDefault();
|
|
39
|
+
}}
|
|
40
|
+
className={props.className}
|
|
41
|
+
>
|
|
42
|
+
{props.children}
|
|
43
|
+
</a>
|
|
44
|
+
);
|
|
45
|
+
|
|
46
|
+
export const defaultNavigation = () => (
|
|
47
|
+
<HeaderNavigationTiny
|
|
48
|
+
left={<LogoCompanyTitle className="m-l-1" fill="#fff" size="150" />}
|
|
49
|
+
leftClassName="d-f align-items-center"
|
|
50
|
+
navigationComponent={NavLinkMock}
|
|
51
|
+
/>
|
|
52
|
+
);
|
|
53
|
+
|
|
54
|
+
export const withLogoTextAndOverflow = () => (
|
|
55
|
+
<HeaderNavigationTiny
|
|
56
|
+
left={
|
|
57
|
+
<Stack alignItems="center">
|
|
58
|
+
<LogoTitan mantleFill="#2270EE" size={48} />
|
|
59
|
+
<LogoTitanTitle className="c-white m-l-1">Commercial</LogoTitanTitle>
|
|
60
|
+
</Stack>
|
|
61
|
+
}
|
|
62
|
+
navigationComponent={NavLinkMock}
|
|
63
|
+
/>
|
|
64
|
+
);
|
|
65
|
+
|
|
66
|
+
const TimeZoneOffset: FC = () => (
|
|
67
|
+
<div className="fs-2 ff-default p-r-2">
|
|
68
|
+
<span>EST (-9 hrs)</span>
|
|
69
|
+
</div>
|
|
70
|
+
);
|
|
71
|
+
|
|
72
|
+
export const withAllMonolithData = () => (
|
|
73
|
+
<HeaderNavigationTiny
|
|
74
|
+
left={<LogoCompanyTitle className="m-l-1" fill="#fff" size="150" />}
|
|
75
|
+
leftClassName="d-f align-items-center"
|
|
76
|
+
navigationComponent={NavLinkMock}
|
|
77
|
+
right={
|
|
78
|
+
<Fragment>
|
|
79
|
+
<TimeZoneOffset />
|
|
80
|
+
|
|
81
|
+
<HeaderNavigationLink
|
|
82
|
+
id="search"
|
|
83
|
+
to="https://google.com"
|
|
84
|
+
target="_blank"
|
|
85
|
+
iconComponent={SearchIcon}
|
|
86
|
+
hint="Search: for all the questions"
|
|
87
|
+
/>
|
|
88
|
+
|
|
89
|
+
<HeaderNavigationTrigger id="dialpad" iconName="phone" counter={2} />
|
|
90
|
+
|
|
91
|
+
<HeaderNavigationTrigger
|
|
92
|
+
id="titanAdvisor"
|
|
93
|
+
iconName="rocket"
|
|
94
|
+
iconClassName={Styles.rocketIcon}
|
|
95
|
+
/>
|
|
96
|
+
|
|
97
|
+
<HeaderNavigationLink
|
|
98
|
+
id="settings"
|
|
99
|
+
to="https://google.com"
|
|
100
|
+
target="_blank"
|
|
101
|
+
iconName="settings"
|
|
102
|
+
aria-label="search"
|
|
103
|
+
hint="Settings"
|
|
104
|
+
isActive
|
|
105
|
+
/>
|
|
106
|
+
|
|
107
|
+
<ProfileDropdown>
|
|
108
|
+
<ProfileDropdown.Link id="tasks" to="https://googgle.com" counter={10}>
|
|
109
|
+
Task Management
|
|
110
|
+
</ProfileDropdown.Link>
|
|
111
|
+
<ProfileDropdown.Divider />
|
|
112
|
+
<ProfileDropdown.Link id="sign-out" to="https://googgle.com">
|
|
113
|
+
Sign Out{' '}
|
|
114
|
+
<span className="c-neutral-100 m-l-half t-truncate">James Bond</span>
|
|
115
|
+
</ProfileDropdown.Link>
|
|
116
|
+
<ProfileDropdown.Section id="userid" className="c-neutral-100 fs-1">
|
|
117
|
+
User ID: 007
|
|
118
|
+
</ProfileDropdown.Section>
|
|
119
|
+
</ProfileDropdown>
|
|
120
|
+
</Fragment>
|
|
121
|
+
}
|
|
122
|
+
center={<Input placeholder="Search smth" size="xsmall" className="w-100" />}
|
|
123
|
+
centerClassName="d-f align-items-center"
|
|
124
|
+
/>
|
|
125
|
+
);
|
|
@@ -162,6 +162,59 @@
|
|
|
162
162
|
}
|
|
163
163
|
}
|
|
164
164
|
|
|
165
|
+
.header-tiny {
|
|
166
|
+
display: grid;
|
|
167
|
+
grid-template-columns: repeat(3, 1fr);
|
|
168
|
+
grid-template-rows: 48px;
|
|
169
|
+
|
|
170
|
+
background-color: @color-neutral-500;
|
|
171
|
+
|
|
172
|
+
& > * {
|
|
173
|
+
overflow-y: hidden;
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
.he-top-left {
|
|
177
|
+
grid-column: span 1;
|
|
178
|
+
}
|
|
179
|
+
|
|
180
|
+
.he-top-center {
|
|
181
|
+
grid-column: span 1;
|
|
182
|
+
}
|
|
183
|
+
|
|
184
|
+
.he-top-right {
|
|
185
|
+
grid-column: span 1;
|
|
186
|
+
|
|
187
|
+
.navigation-icon {
|
|
188
|
+
height: 20px;
|
|
189
|
+
width: 20px;
|
|
190
|
+
font-size: @typescale-4;
|
|
191
|
+
}
|
|
192
|
+
|
|
193
|
+
& > * {
|
|
194
|
+
color: @color-white;
|
|
195
|
+
}
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
:global(.profile-dropdown-image) {
|
|
199
|
+
height: 24px;
|
|
200
|
+
width: 24px;
|
|
201
|
+
}
|
|
202
|
+
|
|
203
|
+
:global(.profile-dropdown-svg) {
|
|
204
|
+
height: 20px;
|
|
205
|
+
width: 20px;
|
|
206
|
+
}
|
|
207
|
+
|
|
208
|
+
.navigation-item-counter {
|
|
209
|
+
font-size: 8px !important;
|
|
210
|
+
}
|
|
211
|
+
|
|
212
|
+
.navigation-link .navigation-item-counter {
|
|
213
|
+
top: 12px;
|
|
214
|
+
right: 0;
|
|
215
|
+
}
|
|
216
|
+
}
|
|
217
|
+
|
|
165
218
|
.navigation-icon {
|
|
166
219
|
display: inline-block;
|
|
167
220
|
}
|
|
@@ -7,6 +7,7 @@ export const heTopLeft: string;
|
|
|
7
7
|
export const heTopRight: string;
|
|
8
8
|
export const header: string;
|
|
9
9
|
export const headerStacked: string;
|
|
10
|
+
export const headerTiny: string;
|
|
10
11
|
export const navigationIcon: string;
|
|
11
12
|
export const navigationItem: string;
|
|
12
13
|
export const navigationItemActive: string;
|
|
@@ -331,3 +331,73 @@ export const HeaderNavigationStacked: FC<HeaderNavigationStackedProps> = ({
|
|
|
331
331
|
</NavLinkContext.Provider>
|
|
332
332
|
);
|
|
333
333
|
};
|
|
334
|
+
|
|
335
|
+
export interface HeaderNavigationTinyProps {
|
|
336
|
+
/** container class name */
|
|
337
|
+
className?: string;
|
|
338
|
+
/** extra navigation */
|
|
339
|
+
right?: ReactNode;
|
|
340
|
+
/** extra navigation container class name */
|
|
341
|
+
rightClassName?: string;
|
|
342
|
+
/** container id */
|
|
343
|
+
id?: string;
|
|
344
|
+
/** left content (usually used for logo) */
|
|
345
|
+
left?: ReactElement;
|
|
346
|
+
/** left container class name */
|
|
347
|
+
leftClassName?: string;
|
|
348
|
+
/** center content */
|
|
349
|
+
center?: ReactElement;
|
|
350
|
+
/** center container class name */
|
|
351
|
+
centerClassName?: string;
|
|
352
|
+
/** minimal width for navigation bar */
|
|
353
|
+
minWidth?: number;
|
|
354
|
+
/** navigation component used for routing */
|
|
355
|
+
navigationComponent?: FC<NavLinkComponentProps>;
|
|
356
|
+
}
|
|
357
|
+
|
|
358
|
+
export const HeaderNavigationTiny: FC<HeaderNavigationTinyProps> = ({
|
|
359
|
+
className,
|
|
360
|
+
id,
|
|
361
|
+
left,
|
|
362
|
+
leftClassName,
|
|
363
|
+
right,
|
|
364
|
+
rightClassName,
|
|
365
|
+
center,
|
|
366
|
+
centerClassName,
|
|
367
|
+
minWidth = 800,
|
|
368
|
+
navigationComponent = DefaultNavLinkComponent,
|
|
369
|
+
}) => {
|
|
370
|
+
return (
|
|
371
|
+
<NavLinkContext.Provider value={navigationComponent}>
|
|
372
|
+
<div
|
|
373
|
+
className={classNames(Styles.headerTiny, className)}
|
|
374
|
+
style={{ minWidth: `${minWidth}px` }}
|
|
375
|
+
id={id}
|
|
376
|
+
data-cy="header-navigation"
|
|
377
|
+
>
|
|
378
|
+
<div
|
|
379
|
+
className={classNames(Styles.heTopLeft, leftClassName)}
|
|
380
|
+
data-cy="navigation-left"
|
|
381
|
+
>
|
|
382
|
+
{left}
|
|
383
|
+
</div>
|
|
384
|
+
<div
|
|
385
|
+
className={classNames(Styles.heTopCenter, centerClassName)}
|
|
386
|
+
data-cy="navigation-center"
|
|
387
|
+
>
|
|
388
|
+
{center}
|
|
389
|
+
</div>
|
|
390
|
+
<div
|
|
391
|
+
className={classNames(
|
|
392
|
+
'd-f flex-row justify-content-end align-items-center',
|
|
393
|
+
Styles.heTopRight,
|
|
394
|
+
rightClassName
|
|
395
|
+
)}
|
|
396
|
+
data-cy="navigation-right"
|
|
397
|
+
>
|
|
398
|
+
{right}
|
|
399
|
+
</div>
|
|
400
|
+
</div>
|
|
401
|
+
</NavLinkContext.Provider>
|
|
402
|
+
);
|
|
403
|
+
};
|
|
@@ -1,14 +1,15 @@
|
|
|
1
1
|
import { FC } from 'react';
|
|
2
2
|
|
|
3
3
|
/* tslint:disable: max-line-length */
|
|
4
|
-
export const LogoCompanyTitle: FC<{ className?: string; fill?: string }> = ({
|
|
4
|
+
export const LogoCompanyTitle: FC<{ className?: string; fill?: string; size?: string }> = ({
|
|
5
5
|
className,
|
|
6
6
|
fill,
|
|
7
|
+
size = '162',
|
|
7
8
|
}) => {
|
|
8
9
|
return (
|
|
9
10
|
<svg
|
|
10
11
|
className={className}
|
|
11
|
-
width=
|
|
12
|
+
width={size}
|
|
12
13
|
viewBox="0 0 322 80"
|
|
13
14
|
xmlns="http://www.w3.org/2000/svg"
|
|
14
15
|
>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './side-navigation';
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
/* stylelint-disable no-descending-specificity */
|
|
2
|
+
@import (reference) '@servicetitan/tokens/core/tokens.less';
|
|
3
|
+
|
|
4
|
+
.side-nav {
|
|
5
|
+
width: 56px;
|
|
6
|
+
display: flex;
|
|
7
|
+
flex-direction: column;
|
|
8
|
+
align-items: center;
|
|
9
|
+
|
|
10
|
+
background-color: #ebebeb;
|
|
11
|
+
border-right: 1px solid #c5c5cb;
|
|
12
|
+
|
|
13
|
+
.side-nav-content {
|
|
14
|
+
display: flex;
|
|
15
|
+
flex-direction: column;
|
|
16
|
+
align-items: center;
|
|
17
|
+
overflow-y: auto;
|
|
18
|
+
margin-top: @spacing-1;
|
|
19
|
+
margin-bottom: @spacing-1;
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.navigation-item {
|
|
24
|
+
width: 56px;
|
|
25
|
+
font-family: @base-font-family;
|
|
26
|
+
color: #383838;
|
|
27
|
+
position: relative;
|
|
28
|
+
display: flex;
|
|
29
|
+
justify-content: center;
|
|
30
|
+
flex-wrap: nowrap;
|
|
31
|
+
text-wrap: nowrap;
|
|
32
|
+
|
|
33
|
+
padding-top: @spacing-1;
|
|
34
|
+
padding-bottom: @spacing-1;
|
|
35
|
+
|
|
36
|
+
&.navigation-item-active {
|
|
37
|
+
color: @color-purple-600 !important;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
&:hover:not(.navigation-item-active) {
|
|
41
|
+
opacity: 0.7;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.navigation-item-counter {
|
|
45
|
+
color: @color-white;
|
|
46
|
+
font-weight: @font-weight-semibold;
|
|
47
|
+
position: absolute;
|
|
48
|
+
right: 2px;
|
|
49
|
+
top: -2px;
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.navigation-icon {
|
|
54
|
+
height: 24px;
|
|
55
|
+
width: 24px;
|
|
56
|
+
font-size: 24px;
|
|
57
|
+
}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export const __esModule: true;
|
|
2
|
+
export const navigationIcon: string;
|
|
3
|
+
export const navigationItem: string;
|
|
4
|
+
export const navigationItemActive: string;
|
|
5
|
+
export const navigationItemCounter: string;
|
|
6
|
+
export const sideNav: string;
|
|
7
|
+
export const sideNavContent: string;
|
|
8
|
+
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
import { ComponentType, FC } from 'react';
|
|
2
|
+
import { HeaderNavigationItemData, NavLinkComponentProps } from '../../utils/navigation';
|
|
3
|
+
import { SideNavigation } from './';
|
|
4
|
+
|
|
5
|
+
const layout = (Story: ComponentType) => {
|
|
6
|
+
return (
|
|
7
|
+
<div className="d-f border" style={{ height: '800px' }}>
|
|
8
|
+
<Story />
|
|
9
|
+
<div className="flex-grow-1 flex-basis-0" />
|
|
10
|
+
</div>
|
|
11
|
+
);
|
|
12
|
+
};
|
|
13
|
+
export default {
|
|
14
|
+
title: 'Navigation/SideNavigation',
|
|
15
|
+
component: SideNavigation,
|
|
16
|
+
decorators: [layout],
|
|
17
|
+
parameters: {},
|
|
18
|
+
};
|
|
19
|
+
|
|
20
|
+
const getItem = (
|
|
21
|
+
id: string,
|
|
22
|
+
data: Partial<HeaderNavigationItemData>
|
|
23
|
+
): HeaderNavigationItemData => ({
|
|
24
|
+
id,
|
|
25
|
+
to: '/',
|
|
26
|
+
title: id[0].toUpperCase() + id.substring(1),
|
|
27
|
+
hint: id,
|
|
28
|
+
...(data ?? {}),
|
|
29
|
+
});
|
|
30
|
+
|
|
31
|
+
const InventoryIcon = () => (
|
|
32
|
+
<svg width="20" xmlns="http://www.w3.org/2000/svg" viewBox="-293 385 24 24" fill="currentColor">
|
|
33
|
+
<polyline points="-288,400.9 -282,404.3 -282,397.6 -288,394.2 -288,400.9 " />
|
|
34
|
+
<path d="M-272,401.5c0,0.4-0.2,0.7-0.5,0.9l-7.9,4.4c-0.2,0.1-0.4,0.2-0.6,0.2s-0.4-0.1-0.6-0.2l-7.9-4.4c-0.3-0.2-0.5-0.5-0.5-0.9v-9c0-0.4,0.2-0.7,0.5-0.9l7.9-4.4c0.2-0.1,0.4-0.2,0.6-0.2s0.4,0.1,0.6,0.2l7.9,4.4c0.3,0.2,0.5,0.5,0.5,0.9V401.5 M-287,392.5 l6,3.4l5.9-3.3l-5.9-3.4L-287,392.5 M-274,400.9v-6.7l-6,3.4v6.7L-274,400.9z" />
|
|
35
|
+
</svg>
|
|
36
|
+
);
|
|
37
|
+
|
|
38
|
+
const items = {
|
|
39
|
+
calendar: getItem('calendar', { iconName: 'event' }),
|
|
40
|
+
calls: getItem('calls', { iconName: 'local_phone', isActive: true, counter: 12 }),
|
|
41
|
+
dashboard: getItem('dashboard', { iconName: 'odometer', isActive: true }),
|
|
42
|
+
dispatch: getItem('dispatch', { iconName: 'location_disabled', counter: 1 }),
|
|
43
|
+
fleet: getItem('fleet', { iconName: 'fleet-pro', title: 'Fleet Pro' }),
|
|
44
|
+
followUps: getItem('followUps', { iconName: 'flag', title: 'Follow Ups' }),
|
|
45
|
+
inventory: getItem('inventory', { iconName: 'toys' }),
|
|
46
|
+
purchasing: getItem('purchasing', { iconComponent: InventoryIcon }),
|
|
47
|
+
accounting: getItem('accounting', { iconName: 'assignment' }),
|
|
48
|
+
marketing: getItem('marketing', { iconName: 'bullhorn' }),
|
|
49
|
+
priceBook: getItem('priceBook', { iconName: 'book' }),
|
|
50
|
+
pointOfSale: getItem('pointOfSale', { iconName: 'cash-register' }),
|
|
51
|
+
projects: getItem('projects', { iconName: 'folder_special' }),
|
|
52
|
+
reports: getItem('reports', { iconName: 'poll' }),
|
|
53
|
+
};
|
|
54
|
+
|
|
55
|
+
const NavLinkMock: FC<NavLinkComponentProps> = props => (
|
|
56
|
+
<a
|
|
57
|
+
href={props.to}
|
|
58
|
+
target={props.target}
|
|
59
|
+
onClick={e => {
|
|
60
|
+
e.preventDefault();
|
|
61
|
+
}}
|
|
62
|
+
className={props.className}
|
|
63
|
+
>
|
|
64
|
+
{props.children}
|
|
65
|
+
</a>
|
|
66
|
+
);
|
|
67
|
+
|
|
68
|
+
export const defaultSideNavigation = () => (
|
|
69
|
+
<SideNavigation
|
|
70
|
+
navigationComponent={NavLinkMock}
|
|
71
|
+
items={[
|
|
72
|
+
items.dashboard,
|
|
73
|
+
items.calendar,
|
|
74
|
+
items.calls,
|
|
75
|
+
items.accounting,
|
|
76
|
+
items.dispatch,
|
|
77
|
+
|
|
78
|
+
items.fleet,
|
|
79
|
+
items.followUps,
|
|
80
|
+
items.inventory,
|
|
81
|
+
|
|
82
|
+
items.marketing,
|
|
83
|
+
items.priceBook,
|
|
84
|
+
items.pointOfSale,
|
|
85
|
+
items.reports,
|
|
86
|
+
]}
|
|
87
|
+
/>
|
|
88
|
+
);
|
|
@@ -0,0 +1,93 @@
|
|
|
1
|
+
import { Icon, Tooltip } from '@servicetitan/design-system';
|
|
2
|
+
import classNames from 'classnames';
|
|
3
|
+
import { FC } from 'react';
|
|
4
|
+
import { HeaderNavigationItemData, NavLinkComponentProps } from '../../utils/navigation';
|
|
5
|
+
import {
|
|
6
|
+
DefaultNavLinkComponent,
|
|
7
|
+
NavLinkContext,
|
|
8
|
+
useNavLink,
|
|
9
|
+
} from '../../utils/navigation-context';
|
|
10
|
+
import { CounterTag } from '../counter-tag';
|
|
11
|
+
import * as Styles from './side-navigation.module.less';
|
|
12
|
+
|
|
13
|
+
export interface SideNavigationProps {
|
|
14
|
+
/** container class name */
|
|
15
|
+
className?: string;
|
|
16
|
+
/** container id */
|
|
17
|
+
id?: string;
|
|
18
|
+
/** main navigation items */
|
|
19
|
+
items?: HeaderNavigationItemData[];
|
|
20
|
+
/** navigation component used for routing */
|
|
21
|
+
navigationComponent?: FC<NavLinkComponentProps>;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
export const SideNavigation: FC<SideNavigationProps> = ({
|
|
25
|
+
className,
|
|
26
|
+
id,
|
|
27
|
+
items,
|
|
28
|
+
navigationComponent = DefaultNavLinkComponent,
|
|
29
|
+
}) => {
|
|
30
|
+
return (
|
|
31
|
+
<NavLinkContext.Provider value={navigationComponent}>
|
|
32
|
+
<div
|
|
33
|
+
className={classNames(Styles.sideNav, className)}
|
|
34
|
+
id={id}
|
|
35
|
+
data-cy="side-navigation"
|
|
36
|
+
>
|
|
37
|
+
<div className={Styles.sideNavContent}>
|
|
38
|
+
{items?.map(item => (
|
|
39
|
+
<SideNavigationItem key={item.id} {...item} />
|
|
40
|
+
))}
|
|
41
|
+
</div>
|
|
42
|
+
</div>
|
|
43
|
+
</NavLinkContext.Provider>
|
|
44
|
+
);
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
/** Side Navigation menu item */
|
|
48
|
+
export const SideNavigationItem: FC<HeaderNavigationItemData> = ({
|
|
49
|
+
id,
|
|
50
|
+
to,
|
|
51
|
+
title,
|
|
52
|
+
hint,
|
|
53
|
+
counter,
|
|
54
|
+
className,
|
|
55
|
+
iconClassName,
|
|
56
|
+
iconComponent: IconComponent,
|
|
57
|
+
iconName,
|
|
58
|
+
isActive,
|
|
59
|
+
}) => {
|
|
60
|
+
const NavigationComponent = useNavLink();
|
|
61
|
+
const iconClass = classNames(Styles.navigationIcon, iconClassName);
|
|
62
|
+
|
|
63
|
+
return (
|
|
64
|
+
<Tooltip el="div" direction="r" text={title}>
|
|
65
|
+
<NavigationComponent
|
|
66
|
+
data-cy={`navigation-item-${id}`}
|
|
67
|
+
data-pendo={`navigation-item-${id}`}
|
|
68
|
+
key={id}
|
|
69
|
+
to={to}
|
|
70
|
+
title={hint}
|
|
71
|
+
className={classNames(Styles.navigationItem, className, {
|
|
72
|
+
[Styles.navigationItemActive]: isActive === true,
|
|
73
|
+
})}
|
|
74
|
+
isActive={typeof isActive === 'function' ? isActive : undefined}
|
|
75
|
+
activeClassName={Styles.navigationItemActive}
|
|
76
|
+
>
|
|
77
|
+
{IconComponent ? (
|
|
78
|
+
<i className={iconClass}>
|
|
79
|
+
<IconComponent />
|
|
80
|
+
</i>
|
|
81
|
+
) : iconName ? (
|
|
82
|
+
<Icon name={iconName} className={iconClass} />
|
|
83
|
+
) : (
|
|
84
|
+
<i className={iconClass} />
|
|
85
|
+
)}
|
|
86
|
+
|
|
87
|
+
{!!counter && (
|
|
88
|
+
<CounterTag data={counter} className={Styles.navigationItemCounter} />
|
|
89
|
+
)}
|
|
90
|
+
</NavigationComponent>
|
|
91
|
+
</Tooltip>
|
|
92
|
+
);
|
|
93
|
+
};
|