@servicetitan/navigation 10.7.0 → 11.0.0-canary.237.0ce6038.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-extra.stories.d.ts.map +1 -1
- package/dist/components/header-navigation/header-navigation-extra.stories.js +5 -5
- package/dist/components/header-navigation/header-navigation-extra.stories.js.map +1 -1
- package/dist/components/header-navigation/header-navigation-links.d.ts.map +1 -1
- package/dist/components/header-navigation/header-navigation-links.js +2 -2
- package/dist/components/header-navigation/header-navigation-links.js.map +1 -1
- package/dist/components/header-navigation/header-navigation-stacked.stories.d.ts.map +1 -1
- package/dist/components/header-navigation/header-navigation-stacked.stories.js +1 -1
- package/dist/components/header-navigation/header-navigation-stacked.stories.js.map +1 -1
- package/dist/components/header-navigation/header-navigation.stories.d.ts.map +1 -1
- package/dist/components/header-navigation/header-navigation.stories.js +2 -2
- package/dist/components/header-navigation/header-navigation.stories.js.map +1 -1
- package/dist/components/header-navigation/with-tooltip.d.ts +1 -1
- package/dist/components/header-navigation/with-tooltip.d.ts.map +1 -1
- package/dist/components/left-navigation/header-navigation-tiny.stories.d.ts.map +1 -1
- package/dist/components/left-navigation/header-navigation-tiny.stories.js +2 -2
- package/dist/components/left-navigation/header-navigation-tiny.stories.js.map +1 -1
- package/dist/components/links.d.ts.map +1 -1
- package/dist/components/links.js +7 -7
- package/dist/components/links.js.map +1 -1
- 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/profile-dropdown/profile-dropdown.d.ts +6 -3
- package/dist/components/profile-dropdown/profile-dropdown.d.ts.map +1 -1
- package/dist/components/profile-dropdown/profile-dropdown.js +7 -8
- package/dist/components/profile-dropdown/profile-dropdown.js.map +1 -1
- package/dist/components/profile-dropdown/profile-dropdown.module.less +4 -0
- package/dist/components/profile-dropdown/profile-dropdown.stories.js +2 -2
- package/dist/components/profile-dropdown/profile-dropdown.stories.js.map +1 -1
- package/dist/components/titan-layout/index.d.ts +6 -0
- package/dist/components/titan-layout/index.d.ts.map +1 -0
- package/dist/components/titan-layout/index.js +6 -0
- package/dist/components/titan-layout/index.js.map +1 -0
- package/dist/components/titan-layout/interface-internal.d.ts +6 -0
- package/dist/components/titan-layout/interface-internal.d.ts.map +1 -0
- package/dist/components/titan-layout/interface-internal.js +2 -0
- package/dist/components/titan-layout/interface-internal.js.map +1 -0
- package/dist/components/titan-layout/interface.d.ts +21 -0
- package/dist/components/titan-layout/interface.d.ts.map +1 -0
- package/dist/components/titan-layout/interface.js +2 -0
- package/dist/components/titan-layout/interface.js.map +1 -0
- package/dist/components/titan-layout/layout-context.d.ts +20 -0
- package/dist/components/titan-layout/layout-context.d.ts.map +1 -0
- package/dist/components/titan-layout/layout-context.js +12 -0
- package/dist/components/titan-layout/layout-context.js.map +1 -0
- package/dist/components/titan-layout/layout-header-links.d.ts +7 -0
- package/dist/components/titan-layout/layout-header-links.d.ts.map +1 -0
- package/dist/components/titan-layout/layout-header-links.js +32 -0
- package/dist/components/titan-layout/layout-header-links.js.map +1 -0
- package/dist/components/titan-layout/layout-header.d.ts +20 -0
- package/dist/components/titan-layout/layout-header.d.ts.map +1 -0
- package/dist/components/titan-layout/layout-header.js +11 -0
- package/dist/components/titan-layout/layout-header.js.map +1 -0
- package/dist/components/titan-layout/layout-header.module.less +154 -0
- package/dist/components/titan-layout/layout-logo.d.ts +12 -0
- package/dist/components/titan-layout/layout-logo.d.ts.map +1 -0
- package/dist/components/titan-layout/layout-logo.js +15 -0
- package/dist/components/titan-layout/layout-logo.js.map +1 -0
- package/dist/components/titan-layout/layout-logo.stories.d.ts +13 -0
- package/dist/components/titan-layout/layout-logo.stories.d.ts.map +1 -0
- package/dist/components/titan-layout/layout-logo.stories.js +17 -0
- package/dist/components/titan-layout/layout-logo.stories.js.map +1 -0
- package/dist/components/titan-layout/layout-profile.d.ts +9 -0
- package/dist/components/titan-layout/layout-profile.d.ts.map +1 -0
- package/dist/components/titan-layout/layout-profile.js +44 -0
- package/dist/components/titan-layout/layout-profile.js.map +1 -0
- package/dist/components/titan-layout/layout-profile.stories.d.ts +13 -0
- package/dist/components/titan-layout/layout-profile.stories.d.ts.map +1 -0
- package/dist/components/titan-layout/layout-profile.stories.js +13 -0
- package/dist/components/titan-layout/layout-profile.stories.js.map +1 -0
- package/dist/components/titan-layout/layout-sidebar-links-internal.d.ts +46 -0
- package/dist/components/titan-layout/layout-sidebar-links-internal.d.ts.map +1 -0
- package/dist/components/titan-layout/layout-sidebar-links-internal.js +61 -0
- package/dist/components/titan-layout/layout-sidebar-links-internal.js.map +1 -0
- package/dist/components/titan-layout/layout-sidebar-links.d.ts +6 -0
- package/dist/components/titan-layout/layout-sidebar-links.d.ts.map +1 -0
- package/dist/components/titan-layout/layout-sidebar-links.js +21 -0
- package/dist/components/titan-layout/layout-sidebar-links.js.map +1 -0
- package/dist/components/titan-layout/layout-sidebar.d.ts +17 -0
- package/dist/components/titan-layout/layout-sidebar.d.ts.map +1 -0
- package/dist/components/titan-layout/layout-sidebar.js +65 -0
- package/dist/components/titan-layout/layout-sidebar.js.map +1 -0
- package/dist/components/titan-layout/layout-sidebar.module.less +513 -0
- package/dist/components/titan-layout/titan-layout.d.ts +36 -0
- package/dist/components/titan-layout/titan-layout.d.ts.map +1 -0
- package/dist/components/titan-layout/titan-layout.js +109 -0
- package/dist/components/titan-layout/titan-layout.js.map +1 -0
- package/dist/components/titan-layout/titan-layout.module.less +76 -0
- package/dist/components/titan-layout/titan-layout.stories.d.ts +18 -0
- package/dist/components/titan-layout/titan-layout.stories.d.ts.map +1 -0
- package/dist/components/titan-layout/titan-layout.stories.js +62 -0
- package/dist/components/titan-layout/titan-layout.stories.js.map +1 -0
- package/dist/components/titan-layout/with-tooltip.d.ts +4 -0
- package/dist/components/titan-layout/with-tooltip.d.ts.map +1 -0
- package/dist/components/titan-layout/with-tooltip.js +4 -0
- package/dist/components/titan-layout/with-tooltip.js.map +1 -0
- package/dist/index.d.ts +2 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -1
- package/dist/index.js.map +1 -1
- package/dist/test/data.d.ts.map +1 -1
- package/dist/test/data.js +3 -3
- package/dist/test/data.js.map +1 -1
- package/dist/utils/navigation-legacy.d.ts +3 -1
- package/dist/utils/navigation-legacy.d.ts.map +1 -1
- package/dist/utils/use-breakpoint.d.ts +7 -0
- package/dist/utils/use-breakpoint.d.ts.map +1 -0
- package/dist/utils/use-breakpoint.js +13 -0
- package/dist/utils/use-breakpoint.js.map +1 -0
- package/package.json +5 -6
- package/src/components/header-navigation/header-navigation-extra.stories.tsx +7 -0
- package/src/components/header-navigation/header-navigation-links.tsx +2 -0
- package/src/components/header-navigation/header-navigation-stacked.stories.tsx +4 -0
- package/src/components/header-navigation/header-navigation.stories.tsx +5 -0
- package/src/components/left-navigation/header-navigation-tiny.stories.tsx +6 -0
- package/src/components/left-navigation/side-navigation-links.tsx +1 -1
- package/src/components/links.tsx +33 -13
- package/src/components/logo/logo-company-title.tsx +8 -6
- package/src/components/profile-dropdown/profile-dropdown.module.less +4 -0
- package/src/components/profile-dropdown/profile-dropdown.stories.tsx +4 -4
- package/src/components/profile-dropdown/profile-dropdown.tsx +43 -46
- package/src/components/titan-layout/index.ts +5 -0
- package/src/components/titan-layout/interface-internal.ts +6 -0
- package/src/components/titan-layout/interface.ts +26 -0
- package/src/components/titan-layout/layout-context.tsx +30 -0
- package/src/components/titan-layout/layout-header-links.tsx +144 -0
- package/src/components/titan-layout/layout-header.module.less +154 -0
- package/src/components/titan-layout/layout-header.module.less.d.ts +16 -0
- package/src/components/titan-layout/layout-header.tsx +86 -0
- package/src/components/titan-layout/layout-logo.stories.tsx +31 -0
- package/src/components/titan-layout/layout-logo.tsx +57 -0
- package/src/components/titan-layout/layout-profile.stories.tsx +37 -0
- package/src/components/titan-layout/layout-profile.tsx +116 -0
- package/src/components/titan-layout/layout-sidebar-links-internal.tsx +265 -0
- package/src/components/titan-layout/layout-sidebar-links.tsx +56 -0
- package/src/components/titan-layout/layout-sidebar.module.less +513 -0
- package/src/components/titan-layout/layout-sidebar.module.less.d.ts +48 -0
- package/src/components/titan-layout/layout-sidebar.tsx +295 -0
- package/src/components/titan-layout/titan-layout.module.less +76 -0
- package/src/components/titan-layout/titan-layout.module.less.d.ts +13 -0
- package/src/components/titan-layout/titan-layout.stories.tsx +194 -0
- package/src/components/titan-layout/titan-layout.tsx +272 -0
- package/src/components/titan-layout/with-tooltip.tsx +16 -0
- package/src/index.ts +2 -1
- package/src/test/data.tsx +3 -2
- package/src/utils/navigation-legacy.ts +3 -1
- package/src/utils/use-breakpoint.ts +19 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"interface-internal.js","sourceRoot":"","sources":["../../../src/components/titan-layout/interface-internal.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { FC, ReactElement } from 'react';
|
|
2
|
+
import { NavigationItemData } from '../../utils/navigation';
|
|
3
|
+
import { TitanLayoutSidebarContextType } from './layout-context';
|
|
4
|
+
export interface TitanLayoutSidebarLinkWrapperProps {
|
|
5
|
+
children: ReactElement<TitanLayoutSidebarLinkProps> | ReactElement<TitanLayoutSidebarTriggerProps>;
|
|
6
|
+
context: TitanLayoutSidebarContextType;
|
|
7
|
+
}
|
|
8
|
+
export interface TitanLayoutSidebarLinkProps extends Omit<NavigationItemData, 'submenu'> {
|
|
9
|
+
wrapper?: FC<TitanLayoutSidebarLinkWrapperProps>;
|
|
10
|
+
}
|
|
11
|
+
export interface TitanLayoutSidebarTriggerProps extends Omit<TitanLayoutSidebarLinkProps, 'to' | 'isActive'> {
|
|
12
|
+
isActive?: boolean;
|
|
13
|
+
wrapper?: FC<TitanLayoutSidebarLinkWrapperProps>;
|
|
14
|
+
onClick?: () => void;
|
|
15
|
+
onMobileClick?: () => void;
|
|
16
|
+
}
|
|
17
|
+
export interface TitanLayoutState {
|
|
18
|
+
navCollapsed: boolean;
|
|
19
|
+
submenuExpanded?: string;
|
|
20
|
+
}
|
|
21
|
+
//# sourceMappingURL=interface.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"interface.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/interface.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,6BAA6B,EAAE,MAAM,kBAAkB,CAAC;AAEjE,MAAM,WAAW,kCAAkC;IAC/C,QAAQ,EACF,YAAY,CAAC,2BAA2B,CAAC,GACzC,YAAY,CAAC,8BAA8B,CAAC,CAAC;IACnD,OAAO,EAAE,6BAA6B,CAAC;CAC1C;AAED,MAAM,WAAW,2BAA4B,SAAQ,IAAI,CAAC,kBAAkB,EAAE,SAAS,CAAC;IACpF,OAAO,CAAC,EAAE,EAAE,CAAC,kCAAkC,CAAC,CAAC;CACpD;AACD,MAAM,WAAW,8BACb,SAAQ,IAAI,CAAC,2BAA2B,EAAE,IAAI,GAAG,UAAU,CAAC;IAC5D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,EAAE,CAAC,kCAAkC,CAAC,CAAC;IACjD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED,MAAM,WAAW,gBAAgB;IAC7B,YAAY,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC5B"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"interface.js","sourceRoot":"","sources":["../../../src/components/titan-layout/interface.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { CSSProperties, FC } from 'react';
|
|
2
|
+
import { NavLinkComponentProps } from '../../utils/navigation-context';
|
|
3
|
+
import { TitanBreakpoint } from '../../utils/use-breakpoint';
|
|
4
|
+
export interface TitanLayoutSidebarContextType {
|
|
5
|
+
styles: {
|
|
6
|
+
popoverContent: CSSProperties;
|
|
7
|
+
};
|
|
8
|
+
}
|
|
9
|
+
export type TitanLayoutPlacement = 'top' | 'side' | 'unset';
|
|
10
|
+
export interface TitanLayoutContextType {
|
|
11
|
+
NavigationComponent: FC<NavLinkComponentProps>;
|
|
12
|
+
breakpoint: TitanBreakpoint;
|
|
13
|
+
isTitanLayout: boolean;
|
|
14
|
+
sidebar: TitanLayoutSidebarContextType;
|
|
15
|
+
}
|
|
16
|
+
export declare const LayoutContext: import("react").Context<TitanLayoutContextType>;
|
|
17
|
+
export declare const useTitanLayoutContext: () => TitanLayoutContextType;
|
|
18
|
+
export declare const LayoutPlacementContext: import("react").Context<TitanLayoutPlacement | undefined>;
|
|
19
|
+
export declare const useTitanLayoutPlacementContext: () => TitanLayoutPlacement | undefined;
|
|
20
|
+
//# sourceMappingURL=layout-context.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-context.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-context.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,EAAE,EAA6B,MAAM,OAAO,CAAC;AACrE,OAAO,EAA2B,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAChG,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAE7D,MAAM,WAAW,6BAA6B;IAC1C,MAAM,EAAE;QACJ,cAAc,EAAE,aAAa,CAAC;KACjC,CAAC;CACL;AAED,MAAM,MAAM,oBAAoB,GAAG,KAAK,GAAG,MAAM,GAAG,OAAO,CAAC;AAE5D,MAAM,WAAW,sBAAsB;IACnC,mBAAmB,EAAE,EAAE,CAAC,qBAAqB,CAAC,CAAC;IAC/C,UAAU,EAAE,eAAe,CAAC;IAC5B,aAAa,EAAE,OAAO,CAAC;IACvB,OAAO,EAAE,6BAA6B,CAAC;CAC1C;AAED,eAAO,MAAM,aAAa,iDAKxB,CAAC;AAEH,eAAO,MAAM,qBAAqB,8BAAkC,CAAC;AAErE,eAAO,MAAM,sBAAsB,2DAA6D,CAAC;AACjG,eAAO,MAAM,8BAA8B,wCAA2C,CAAC"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { createContext, useContext } from 'react';
|
|
2
|
+
import { DefaultNavLinkComponent } from '../../utils/navigation-context';
|
|
3
|
+
export const LayoutContext = createContext({
|
|
4
|
+
NavigationComponent: DefaultNavLinkComponent,
|
|
5
|
+
breakpoint: { name: 'lg', isMobile: false },
|
|
6
|
+
isTitanLayout: false,
|
|
7
|
+
sidebar: { styles: { popoverContent: {} } },
|
|
8
|
+
});
|
|
9
|
+
export const useTitanLayoutContext = () => useContext(LayoutContext);
|
|
10
|
+
export const LayoutPlacementContext = createContext(undefined);
|
|
11
|
+
export const useTitanLayoutPlacementContext = () => useContext(LayoutPlacementContext);
|
|
12
|
+
//# sourceMappingURL=layout-context.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-context.js","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-context.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACrE,OAAO,EAAE,uBAAuB,EAAyB,MAAM,gCAAgC,CAAC;AAkBhG,MAAM,CAAC,MAAM,aAAa,GAAG,aAAa,CAAyB;IAC/D,mBAAmB,EAAE,uBAAuB;IAC5C,UAAU,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE;IAC3C,aAAa,EAAE,KAAK;IACpB,OAAO,EAAE,EAAE,MAAM,EAAE,EAAE,cAAc,EAAE,EAAE,EAAE,EAAE;CAC9C,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAAG,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;AAErE,MAAM,CAAC,MAAM,sBAAsB,GAAG,aAAa,CAAmC,SAAS,CAAC,CAAC;AACjG,MAAM,CAAC,MAAM,8BAA8B,GAAG,GAAG,EAAE,CAAC,UAAU,CAAC,sBAAsB,CAAC,CAAC"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { HeaderNavigationLinkProps, HeaderNavigationTriggerProps } from '../../utils/navigation-legacy';
|
|
3
|
+
/** Navigation extra item with link */
|
|
4
|
+
export declare const LayoutHeaderNavigationLink: FC<HeaderNavigationLinkProps>;
|
|
5
|
+
/** Navigation extra item with icon button */
|
|
6
|
+
export declare const LayoutHeaderNavigationTrigger: FC<HeaderNavigationTriggerProps>;
|
|
7
|
+
//# sourceMappingURL=layout-header-links.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-header-links.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-header-links.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;AACrC,OAAO,EACH,yBAAyB,EACzB,4BAA4B,EAC/B,MAAM,+BAA+B,CAAC;AA4CvC,sCAAsC;AACtC,eAAO,MAAM,0BAA0B,EAAE,EAAE,CAAC,yBAAyB,CA+CpE,CAAC;AAEF,6CAA6C;AAC7C,eAAO,MAAM,6BAA6B,EAAE,EAAE,CAAC,4BAA4B,CA0C1E,CAAC"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { createElement as _createElement } from "react";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { Icon } from '@servicetitan/anvil2';
|
|
4
|
+
import classNames from 'classnames';
|
|
5
|
+
import { Fragment } from 'react';
|
|
6
|
+
import { getCounterTag } from '../../utils/side-nav';
|
|
7
|
+
import { CounterTag } from '../counter-tag';
|
|
8
|
+
// use v1 tooltips due to bug with v2 in monolith
|
|
9
|
+
import { withTooltip } from '../header-navigation/with-tooltip';
|
|
10
|
+
import { useTitanLayoutContext } from './layout-context';
|
|
11
|
+
import * as Styles from './layout-header.module.less';
|
|
12
|
+
/** Content for navigation items */
|
|
13
|
+
const HeaderNavigationItemContent = ({ counterClassName, icon, iconActive, label, labelClassName, tag }) => {
|
|
14
|
+
return (_jsxs(Fragment, { children: [!!icon && _jsx(Icon, { svg: icon, className: Styles.navigationIcon }), !!iconActive && (_jsx(Icon, { svg: iconActive, className: classNames(Styles.navigationIcon, Styles.navigationIconActive) })), !!label && (_jsx("span", { className: classNames(Styles.navigationItemLabel, labelClassName), children: label })), !!tag && (_jsx(CounterTag, { data: tag, className: classNames(Styles.navigationItemCounter, counterClassName), longClassName: Styles.navigationItemCounterLong }))] }));
|
|
15
|
+
};
|
|
16
|
+
/** Navigation extra item with link */
|
|
17
|
+
export const LayoutHeaderNavigationLink = ({ id, to, hint, tooltip, className, counter, icon, iconActive, iconClassName, iconComponent, iconName, isActive, label, labelClassName, tag, target, ...rest }) => {
|
|
18
|
+
const { NavigationComponent } = useTitanLayoutContext();
|
|
19
|
+
return withTooltip(_createElement(NavigationComponent, { "data-cy": `navigation-link-${id}`, "data-pendo": `navigation-link-${id}`, ...rest, key: id, to: to, title: hint, className: classNames(Styles.navigationLink, className, {
|
|
20
|
+
[Styles.navigationItemActive]: isActive === true,
|
|
21
|
+
[Styles.navigationItemIconState]: !!icon && !!iconActive,
|
|
22
|
+
}), isActive: typeof isActive === 'function' ? isActive : undefined, activeClassName: Styles.navigationItemActive, target: target },
|
|
23
|
+
_jsx(HeaderNavigationItemContent, { tag: getCounterTag(counter, tag), icon: icon, iconActive: iconActive, label: label, labelClassName: labelClassName })), tooltip);
|
|
24
|
+
};
|
|
25
|
+
/** Navigation extra item with icon button */
|
|
26
|
+
export const LayoutHeaderNavigationTrigger = ({ id, className, counter, icon, iconActive, iconName, isActive, hint, label, labelClassName, tag, tooltip, title, titleClassName, ...rest }) => {
|
|
27
|
+
return withTooltip(_jsx("div", { "data-cy": `navigation-trigger-${id}`, "data-pendo": `navigation-trigger-${id}`, ...rest, title: hint, className: classNames(Styles.navigationLink, {
|
|
28
|
+
[Styles.navigationItemActive]: isActive === true,
|
|
29
|
+
[Styles.navigationItemIconState]: !!icon && !!iconActive,
|
|
30
|
+
}, 'cursor-pointer', className), children: _jsx(HeaderNavigationItemContent, { tag: getCounterTag(counter, tag), icon: isActive && iconActive ? iconActive : icon, label: label, labelClassName: labelClassName }) }), tooltip);
|
|
31
|
+
};
|
|
32
|
+
//# sourceMappingURL=layout-header-links.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-header-links.js","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-header-links.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { ComponentPropsWithoutRef, FC, ReactElement, ReactNode } from 'react';
|
|
2
|
+
import { TitanLayoutLogoProps } from './layout-logo';
|
|
3
|
+
export interface TitanLayoutHeaderLogoProps {
|
|
4
|
+
title?: true | string;
|
|
5
|
+
mantleFill?: string;
|
|
6
|
+
to?: string;
|
|
7
|
+
}
|
|
8
|
+
export type LayoutHeaderProps = Omit<ComponentPropsWithoutRef<'div'>, 'children'> & {
|
|
9
|
+
right?: ReactNode;
|
|
10
|
+
rightText?: string;
|
|
11
|
+
rightClassName?: string;
|
|
12
|
+
id?: string;
|
|
13
|
+
center?: ReactElement;
|
|
14
|
+
centerClassName?: string;
|
|
15
|
+
logo: ReactElement<TitanLayoutLogoProps>;
|
|
16
|
+
profile?: ReactElement;
|
|
17
|
+
onBurgerClick?: (e: MouseEvent) => void;
|
|
18
|
+
};
|
|
19
|
+
export declare const LayoutHeader: FC<LayoutHeaderProps>;
|
|
20
|
+
//# sourceMappingURL=layout-header.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-header.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-header.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,wBAAwB,EAAE,EAAE,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAI9E,OAAO,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAErD,MAAM,WAAW,0BAA0B;IACvC,KAAK,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,EAAE,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IAChF,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,IAAI,EAAE,YAAY,CAAC,oBAAoB,CAAC,CAAC;IACzC,OAAO,CAAC,EAAE,YAAY,CAAC;IAEvB,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;CAC3C,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAuD9C,CAAC"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import SvgBurgerMenu from '@servicetitan/anvil2/assets/icons/material/round/menu.svg';
|
|
3
|
+
import classNames from 'classnames';
|
|
4
|
+
import { LayoutPlacementContext, useTitanLayoutContext } from './layout-context';
|
|
5
|
+
import { LayoutHeaderNavigationTrigger } from './layout-header-links';
|
|
6
|
+
import * as Styles from './layout-header.module.less';
|
|
7
|
+
export const LayoutHeader = ({ className, right, rightText, rightClassName, center, centerClassName, logo, profile, onBurgerClick, ...rest }) => {
|
|
8
|
+
const { breakpoint } = useTitanLayoutContext();
|
|
9
|
+
return (_jsx(LayoutPlacementContext.Provider, { value: "top", children: _jsxs("div", { className: classNames(Styles.header, className), ...rest, "data-cy": "header-navigation", children: [_jsxs("div", { className: classNames(Styles.heTopLeft), "data-cy": "navigation-left", children: [breakpoint.isMobile && (_jsx(LayoutHeaderNavigationTrigger, { id: "burger", title: "", icon: SvgBurgerMenu, iconActive: SvgBurgerMenu, className: "m-r-1", onClick: onBurgerClick })), logo] }), _jsx("div", { className: classNames(Styles.heTopCenter, centerClassName), "data-cy": "navigation-center", children: center }), _jsxs("div", { className: classNames('d-f flex-row justify-content-end align-items-center', Styles.heTopRight, rightClassName), "data-cy": "navigation-right", children: [!!rightText && _jsx("div", { className: Styles.heTopRightText, children: rightText }), right, profile] })] }) }));
|
|
10
|
+
};
|
|
11
|
+
//# sourceMappingURL=layout-header.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-header.js","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-header.tsx"],"names":[],"mappings":";AAAA,OAAO,aAAa,MAAM,2DAA2D,CAAC;AACtF,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,EAAE,sBAAsB,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AACjF,OAAO,EAAE,6BAA6B,EAAE,MAAM,uBAAuB,CAAC;AACtE,OAAO,KAAK,MAAM,MAAM,6BAA6B,CAAC;AAyBtD,MAAM,CAAC,MAAM,YAAY,GAA0B,CAAC,EAChD,SAAS,EACT,KAAK,EACL,SAAS,EACT,cAAc,EACd,MAAM,EACN,eAAe,EACf,IAAI,EACJ,OAAO,EACP,aAAa,EACb,GAAG,IAAI,EACV,EAAE,EAAE;IACD,MAAM,EAAE,UAAU,EAAE,GAAG,qBAAqB,EAAE,CAAC;IAE/C,OAAO,CACH,KAAC,sBAAsB,CAAC,QAAQ,IAAC,KAAK,EAAC,KAAK,YACxC,eACI,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,KAC3C,IAAI,aACA,mBAAmB,aAE3B,eAAK,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,SAAS,CAAC,aAAU,iBAAiB,aAClE,UAAU,CAAC,QAAQ,IAAI,CACpB,KAAC,6BAA6B,IAC1B,EAAE,EAAC,QAAQ,EACX,KAAK,EAAC,EAAE,EACR,IAAI,EAAE,aAAa,EACnB,UAAU,EAAE,aAAa,EACzB,SAAS,EAAC,OAAO,EACjB,OAAO,EAAE,aAAa,GACxB,CACL,EACA,IAAI,IACH,EACN,cACI,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,WAAW,EAAE,eAAe,CAAC,aAClD,mBAAmB,YAE1B,MAAM,GACL,EACN,eACI,SAAS,EAAE,UAAU,CACjB,qDAAqD,EACrD,MAAM,CAAC,UAAU,EACjB,cAAc,CACjB,aACO,kBAAkB,aAEzB,CAAC,CAAC,SAAS,IAAI,cAAK,SAAS,EAAE,MAAM,CAAC,cAAc,YAAG,SAAS,GAAO,EACvE,KAAK,EACL,OAAO,IACN,IACJ,GACwB,CACrC,CAAC;AACN,CAAC,CAAC"}
|
|
@@ -0,0 +1,154 @@
|
|
|
1
|
+
/* stylelint-disable no-descending-specificity */
|
|
2
|
+
@import (reference) '@servicetitan/tokens/core/tokens.less';
|
|
3
|
+
|
|
4
|
+
@size-links-tiny: 24px;
|
|
5
|
+
|
|
6
|
+
.header {
|
|
7
|
+
display: grid;
|
|
8
|
+
|
|
9
|
+
background-color: @color-white;
|
|
10
|
+
color: @color-black;
|
|
11
|
+
border-bottom: 1px solid @color-neutral-60;
|
|
12
|
+
|
|
13
|
+
& > * {
|
|
14
|
+
overflow-y: hidden;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.he-top-left {
|
|
18
|
+
grid-column: span 1;
|
|
19
|
+
display: flex;
|
|
20
|
+
align-items: center;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.he-top-center {
|
|
24
|
+
grid-column: span 1;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.he-top-right {
|
|
28
|
+
grid-column: span 1;
|
|
29
|
+
|
|
30
|
+
& > * {
|
|
31
|
+
color: @color-black;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.he-top-right-text {
|
|
35
|
+
font-size: @typescale-2;
|
|
36
|
+
font-weight: @font-weight-bold;
|
|
37
|
+
font-family: @base-font-family;
|
|
38
|
+
margin-right: @spacing-1;
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
:global(.profile-dropdown-image) {
|
|
43
|
+
height: 24px;
|
|
44
|
+
width: 24px;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
:global(.profile-dropdown-trigger) {
|
|
48
|
+
height: 32px;
|
|
49
|
+
font-size: @size-links-tiny;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.navigation-link {
|
|
53
|
+
border-radius: 12px;
|
|
54
|
+
font-size: @size-links-tiny;
|
|
55
|
+
color: inherit;
|
|
56
|
+
|
|
57
|
+
&.navigation-item-active:not(.navigation-item-overflow) {
|
|
58
|
+
background-color: @color-blue-100 !important;
|
|
59
|
+
color: @color-blue-500 !important;
|
|
60
|
+
}
|
|
61
|
+
&:hover:not(.navigation-item-active):not(.navigation-item-overflow) {
|
|
62
|
+
background-color: rgba(0, 0, 0, 0.12) !important;
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
&.navigation-item-icon-state.navigation-item-active {
|
|
66
|
+
.navigation-icon:not(.navigation-icon-active) {
|
|
67
|
+
display: none;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.navigation-icon.navigation-icon-active[data-anv][data-anv] {
|
|
71
|
+
display: block;
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.navigation-icon[data-anv][data-anv] {
|
|
77
|
+
display: inline-block;
|
|
78
|
+
color: inherit;
|
|
79
|
+
height: 24px;
|
|
80
|
+
width: 24px;
|
|
81
|
+
|
|
82
|
+
> svg {
|
|
83
|
+
height: @size-links-tiny;
|
|
84
|
+
width: @size-links-tiny;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
&.navigation-icon-active {
|
|
88
|
+
display: none;
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
// desktop
|
|
94
|
+
@media only screen and (min-width: 768px) {
|
|
95
|
+
.header {
|
|
96
|
+
grid-template-columns: repeat(3, 1fr);
|
|
97
|
+
grid-template-rows: 48px;
|
|
98
|
+
|
|
99
|
+
.navigation-link {
|
|
100
|
+
margin: 6px 2px;
|
|
101
|
+
padding: 6px 6px;
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
.he-top-left {
|
|
106
|
+
padding-left: @spacing-1;
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
// mobile
|
|
111
|
+
@media only screen and (max-width: 768px) {
|
|
112
|
+
.header {
|
|
113
|
+
grid-template-columns: repeat(3, 1fr);
|
|
114
|
+
grid-template-rows: 44px;
|
|
115
|
+
|
|
116
|
+
padding: @spacing-1 @spacing-half;
|
|
117
|
+
|
|
118
|
+
.navigation-link {
|
|
119
|
+
padding: 10px;
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
.navigation-link {
|
|
125
|
+
// styles specific to extra nav links
|
|
126
|
+
color: @color-black;
|
|
127
|
+
position: relative;
|
|
128
|
+
display: flex;
|
|
129
|
+
align-items: center;
|
|
130
|
+
flex-wrap: nowrap;
|
|
131
|
+
text-wrap: nowrap;
|
|
132
|
+
|
|
133
|
+
.navigation-item-counter {
|
|
134
|
+
color: @color-white;
|
|
135
|
+
font-weight: @font-weight-semibold;
|
|
136
|
+
font-size: 8px !important;
|
|
137
|
+
min-width: 12px;
|
|
138
|
+
position: absolute;
|
|
139
|
+
top: 4px;
|
|
140
|
+
right: -2px;
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
.navigation-item-label {
|
|
144
|
+
color: inherit;
|
|
145
|
+
font-size: @typescale-1;
|
|
146
|
+
font-family: @base-font-family;
|
|
147
|
+
font-weight: @font-weight-semibold;
|
|
148
|
+
margin-left: @spacing-half;
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
&.navigation-item-counter-long {
|
|
152
|
+
right: -8px;
|
|
153
|
+
}
|
|
154
|
+
}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { FC, ReactNode } from 'react';
|
|
2
|
+
import { WrapperProps } from '../logo/logo-titan-text';
|
|
3
|
+
export interface TitanLayoutLogoProps {
|
|
4
|
+
/** container class name */
|
|
5
|
+
className?: string;
|
|
6
|
+
title?: string | boolean;
|
|
7
|
+
postfix?: ReactNode;
|
|
8
|
+
logoWrapper?: WrapperProps;
|
|
9
|
+
mantleFill?: string;
|
|
10
|
+
}
|
|
11
|
+
export declare const TitanLayoutLogo: FC<TitanLayoutLogoProps>;
|
|
12
|
+
//# sourceMappingURL=layout-logo.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-logo.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-logo.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,EAAE,EAAY,SAAS,EAAE,MAAM,OAAO,CAAC;AAEhD,OAAO,EAA6B,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAGlF,MAAM,WAAW,oBAAoB;IACjC,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAEzB,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB,WAAW,CAAC,EAAE,YAAY,CAAC;IAE3B,UAAU,CAAC,EAAE,MAAM,CAAC;CACvB;AAID,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CAmCpD,CAAC"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import classNames from 'classnames';
|
|
3
|
+
import { Fragment } from 'react';
|
|
4
|
+
import { LogoCompanyTitle } from '../logo/logo-company-title';
|
|
5
|
+
import { LogoTitan, LogoTitanTitle } from '../logo/logo-titan-text';
|
|
6
|
+
import { useTitanLayoutContext } from './layout-context';
|
|
7
|
+
const EmptyWrapper = ({ children }) => children;
|
|
8
|
+
export const TitanLayoutLogo = ({ className, mantleFill, postfix, title, logoWrapper = EmptyWrapper, }) => {
|
|
9
|
+
const { breakpoint: { isMobile }, } = useTitanLayoutContext();
|
|
10
|
+
const Wrapper = logoWrapper;
|
|
11
|
+
const logoSize = isMobile ? 44 : 56;
|
|
12
|
+
const logoCompanySize = 48;
|
|
13
|
+
return (_jsxs("div", { className: classNames('d-f align-items-center', className), children: [typeof title === 'string' ? (_jsxs(Fragment, { children: [_jsx(LogoTitan, { size: logoSize, mantleFill: mantleFill, logoWrapper: Wrapper }), !isMobile && (_jsx(LogoTitanTitle, { className: "c-inherit m-l-1", children: title }))] })) : title === true && !isMobile ? (_jsx(Wrapper, { className: "", children: _jsx(LogoCompanyTitle, { height: logoCompanySize }) })) : (_jsx(LogoTitan, { size: logoSize, mantleFill: mantleFill, logoWrapper: Wrapper })), !isMobile && postfix] }));
|
|
14
|
+
};
|
|
15
|
+
//# sourceMappingURL=layout-logo.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-logo.js","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-logo.tsx"],"names":[],"mappings":";AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAM,QAAQ,EAAa,MAAM,OAAO,CAAC;AAChD,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,cAAc,EAAgB,MAAM,yBAAyB,CAAC;AAClF,OAAO,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAezD,MAAM,YAAY,GAAY,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,QAAQ,CAAC;AAEzD,MAAM,CAAC,MAAM,eAAe,GAA6B,CAAC,EACtD,SAAS,EACT,UAAU,EACV,OAAO,EACP,KAAK,EACL,WAAW,GAAG,YAAY,GAC7B,EAAE,EAAE;IACD,MAAM,EACF,UAAU,EAAE,EAAE,QAAQ,EAAE,GAC3B,GAAG,qBAAqB,EAAE,CAAC;IAE5B,MAAM,OAAO,GAAG,WAAW,CAAC;IAC5B,MAAM,QAAQ,GAAG,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;IACpC,MAAM,eAAe,GAAG,EAAE,CAAC;IAE3B,OAAO,CACH,eAAK,SAAS,EAAE,UAAU,CAAC,wBAAwB,EAAE,SAAS,CAAC,aAC1D,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,CACzB,MAAC,QAAQ,eACL,KAAC,SAAS,IAAC,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,EAAE,WAAW,EAAE,OAAO,GAAI,EAC1E,CAAC,QAAQ,IAAI,CACV,KAAC,cAAc,IAAC,SAAS,EAAC,iBAAiB,YAAE,KAAK,GAAkB,CACvE,IACM,CACd,CAAC,CAAC,CAAC,KAAK,KAAK,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAC9B,KAAC,OAAO,IAAC,SAAS,EAAC,EAAE,YACjB,KAAC,gBAAgB,IAAC,MAAM,EAAE,eAAe,GAAI,GACvC,CACb,CAAC,CAAC,CAAC,CACA,KAAC,SAAS,IAAC,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,EAAE,WAAW,EAAE,OAAO,GAAI,CAC9E,EAEA,CAAC,QAAQ,IAAI,OAAO,IACnB,CACT,CAAC;AACN,CAAC,CAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { TitanLayoutLogoProps } from './layout-logo';
|
|
2
|
+
declare const _default: {
|
|
3
|
+
title: string;
|
|
4
|
+
component: import("react").FC<TitanLayoutLogoProps>;
|
|
5
|
+
decorators: ((Story: any) => import("react/jsx-runtime").JSX.Element)[];
|
|
6
|
+
parameters: {};
|
|
7
|
+
};
|
|
8
|
+
export default _default;
|
|
9
|
+
export declare const LogoDefault: () => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare const LogoCompanyTitle: () => import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
export declare const LogoCommercial: () => import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export declare const LogoWithPostfix: () => import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
//# sourceMappingURL=layout-logo.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-logo.stories.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-logo.stories.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAmB,oBAAoB,EAAE,MAAM,eAAe,CAAC;;;;;;;AAUtE,wBAKE;AAEF,eAAO,MAAM,WAAW,+CAAuC,CAAC;AAEhE,eAAO,MAAM,gBAAgB,+CAA6C,CAAC;AAE3E,eAAO,MAAM,cAAc,+CAE1B,CAAC;AAEF,eAAO,MAAM,eAAe,+CAE3B,CAAC"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Chip } from '@servicetitan/anvil2';
|
|
3
|
+
import { withAnvil, withDefaultRedirects, withMemoryRouter } from '../../test/data';
|
|
4
|
+
import { TitanLayoutLogo } from './layout-logo';
|
|
5
|
+
import { TitanLayout } from './titan-layout';
|
|
6
|
+
const withTitanLayout = (element) => () => (_jsxs(TitanLayout, { navigationMainItems: [], children: [element, _jsx(TitanLayout.Content, { children: "logo" })] }));
|
|
7
|
+
export default {
|
|
8
|
+
title: 'Navigation/TitanLayoutLogo',
|
|
9
|
+
component: TitanLayoutLogo,
|
|
10
|
+
decorators: [withDefaultRedirects, withMemoryRouter, withAnvil],
|
|
11
|
+
parameters: {},
|
|
12
|
+
};
|
|
13
|
+
export const LogoDefault = withTitanLayout(_jsx(TitanLayoutLogo, {}));
|
|
14
|
+
export const LogoCompanyTitle = withTitanLayout(_jsx(TitanLayoutLogo, { title: true }));
|
|
15
|
+
export const LogoCommercial = withTitanLayout(_jsx(TitanLayoutLogo, { title: "Commercial", mantleFill: "#2270EE" }));
|
|
16
|
+
export const LogoWithPostfix = withTitanLayout(_jsx(TitanLayoutLogo, { title: true, postfix: _jsx(Chip, { className: "m-l-2-i", label: "demo" }) }));
|
|
17
|
+
//# sourceMappingURL=layout-logo.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-logo.stories.js","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-logo.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAE5C,OAAO,EAAE,SAAS,EAAE,oBAAoB,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACpF,OAAO,EAAE,eAAe,EAAwB,MAAM,eAAe,CAAC;AACtE,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C,MAAM,eAAe,GAAG,CAAC,OAA2C,EAAE,EAAE,CAAC,GAAG,EAAE,CAAC,CAC3E,MAAC,WAAW,IAAC,mBAAmB,EAAE,EAAE,aAC/B,OAAO,EACR,KAAC,WAAW,CAAC,OAAO,uBAA2B,IACrC,CACjB,CAAC;AAEF,eAAe;IACX,KAAK,EAAE,4BAA4B;IACnC,SAAS,EAAE,eAAe;IAC1B,UAAU,EAAE,CAAC,oBAAoB,EAAE,gBAAgB,EAAE,SAAS,CAAC;IAC/D,UAAU,EAAE,EAAE;CACjB,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,eAAe,CAAC,KAAC,eAAe,KAAG,CAAC,CAAC;AAEhE,MAAM,CAAC,MAAM,gBAAgB,GAAG,eAAe,CAAC,KAAC,eAAe,IAAC,KAAK,SAAG,CAAC,CAAC;AAE3E,MAAM,CAAC,MAAM,cAAc,GAAG,eAAe,CACzC,KAAC,eAAe,IAAC,KAAK,EAAC,YAAY,EAAC,UAAU,EAAC,SAAS,GAAG,CAC9D,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,eAAe,CAC1C,KAAC,eAAe,IAAC,KAAK,QAAC,OAAO,EAAE,KAAC,IAAI,IAAC,SAAS,EAAC,SAAS,EAAC,KAAK,EAAC,MAAM,GAAG,GAAI,CAChF,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { ProfileDropdownLinkProps, ProfileDropdownProps, ProfileDropdownSectionProps } from '../profile-dropdown/profile-dropdown';
|
|
3
|
+
export type { ProfileDropdownProps, ProfileDropdownSectionProps, ProfileDropdownLinkProps, } from '../profile-dropdown/profile-dropdown';
|
|
4
|
+
export declare const ProfileDropdown: FC<ProfileDropdownProps> & {
|
|
5
|
+
Divider: FC;
|
|
6
|
+
Link: FC<ProfileDropdownLinkProps>;
|
|
7
|
+
Section: FC<ProfileDropdownSectionProps>;
|
|
8
|
+
};
|
|
9
|
+
//# sourceMappingURL=layout-profile.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-profile.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-profile.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;AAErC,OAAO,EAEH,wBAAwB,EACxB,oBAAoB,EACpB,2BAA2B,EAC9B,MAAM,sCAAsC,CAAC;AAU9C,YAAY,EACR,oBAAoB,EACpB,2BAA2B,EAC3B,wBAAwB,GAC3B,MAAM,sCAAsC,CAAC;AAuF9C,eAAO,MAAM,eAAe;;;;CAI1B,CAAC"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import SvgAccountActive from '@servicetitan/anvil2/assets/icons/st/gnav_account_active.svg';
|
|
3
|
+
import SvgAccountInactive from '@servicetitan/anvil2/assets/icons/st/gnav_account_inactive.svg';
|
|
4
|
+
import { useState } from 'react';
|
|
5
|
+
import { NavigationComponentContext } from '../../utils/navigation-context';
|
|
6
|
+
import { ProfileDropdown as DesktopProfileDropdown, } from '../profile-dropdown/profile-dropdown';
|
|
7
|
+
import { useTitanLayoutContext } from './layout-context';
|
|
8
|
+
import { InternalSideNavigationGroup, InternalSideNavigationGroupDivider, InternalSideNavigationGroupLink, InternalSideNavigationGroupTrigger, } from './layout-sidebar-links-internal';
|
|
9
|
+
const ProfileDropdownContent = props => {
|
|
10
|
+
const { breakpoint, NavigationComponent } = useTitanLayoutContext();
|
|
11
|
+
return breakpoint.isMobile ? (_jsx(MobileProfileDropdown, { ...props, navigationComponent: NavigationComponent })) : (_jsx(NavigationComponentContext.Provider, { value: NavigationComponent, children: _jsx(DesktopProfileDropdown, { ...props }) }));
|
|
12
|
+
};
|
|
13
|
+
ProfileDropdownContent.displayName = 'ProfileDropdown';
|
|
14
|
+
const MobileProfileDropdown = ({ children, ...props }) => {
|
|
15
|
+
const [expanded, setExpanded] = useState(false);
|
|
16
|
+
const onExpandToggle = () => setExpanded(!expanded);
|
|
17
|
+
return (_jsx(InternalSideNavigationGroup, { id: "__profile", to: undefined, title: "Profile", icon: SvgAccountInactive, iconActive: SvgAccountActive, isActive: expanded, ...props, submenuExpanded: expanded, onExpandToggle: onExpandToggle, onClick: onExpandToggle, tag: undefined, children: children }));
|
|
18
|
+
};
|
|
19
|
+
const ProfileDropdownDivider = () => {
|
|
20
|
+
const { breakpoint } = useTitanLayoutContext();
|
|
21
|
+
return breakpoint.isMobile ? (_jsx(InternalSideNavigationGroupDivider, {})) : (_jsx(DesktopProfileDropdown.Divider, {}));
|
|
22
|
+
};
|
|
23
|
+
const ProfileDropdownSection = props => {
|
|
24
|
+
const { breakpoint } = useTitanLayoutContext();
|
|
25
|
+
return breakpoint.isMobile ? (_jsx(MobileProfileDropdownSection, { ...props })) : (_jsx(DesktopProfileDropdown.Section, { ...props }));
|
|
26
|
+
};
|
|
27
|
+
const MobileProfileDropdownSection = props => {
|
|
28
|
+
const title = typeof props.children === 'string' ? props.children : undefined;
|
|
29
|
+
return title ? (_jsx(InternalSideNavigationGroupTrigger, { id: props.id, title: title, onClick: props.onClick })) : null;
|
|
30
|
+
};
|
|
31
|
+
const ProfileDropdownLink = props => {
|
|
32
|
+
const { breakpoint, NavigationComponent } = useTitanLayoutContext();
|
|
33
|
+
return breakpoint.isMobile ? (_jsx(MobileProfileDropdownLink, { ...props, navigationComponent: NavigationComponent })) : (_jsx(DesktopProfileDropdown.Link, { ...props }));
|
|
34
|
+
};
|
|
35
|
+
const MobileProfileDropdownLink = ({ to, navigationComponent, ...props }) => {
|
|
36
|
+
const title = typeof props.children === 'string' ? props.children : undefined;
|
|
37
|
+
return title ? (_jsx(InternalSideNavigationGroupLink, { ...props, to: to, title: title, navigationComponent: navigationComponent })) : null;
|
|
38
|
+
};
|
|
39
|
+
export const ProfileDropdown = Object.assign(ProfileDropdownContent, {
|
|
40
|
+
Divider: ProfileDropdownDivider,
|
|
41
|
+
Link: ProfileDropdownLink,
|
|
42
|
+
Section: ProfileDropdownSection,
|
|
43
|
+
});
|
|
44
|
+
//# sourceMappingURL=layout-profile.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-profile.js","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-profile.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
declare const _default: {
|
|
2
|
+
title: string;
|
|
3
|
+
component: import("react").FC<import("./layout-profile").ProfileDropdownProps> & {
|
|
4
|
+
Divider: import("react").FC;
|
|
5
|
+
Link: import("react").FC<import("./layout-profile").ProfileDropdownLinkProps>;
|
|
6
|
+
Section: import("react").FC<import("./layout-profile").ProfileDropdownSectionProps>;
|
|
7
|
+
};
|
|
8
|
+
decorators: ((Story: any) => import("react/jsx-runtime").JSX.Element)[];
|
|
9
|
+
parameters: {};
|
|
10
|
+
};
|
|
11
|
+
export default _default;
|
|
12
|
+
export declare const ProfileDefault: () => import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
//# sourceMappingURL=layout-profile.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-profile.stories.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-profile.stories.tsx"],"names":[],"mappings":";;;;;;;;;;AAWA,wBAKE;AAEF,eAAO,MAAM,cAAc,+CAkB1B,CAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { withAnvil, withDefaultRedirects, withMemoryRouter } from '../../test/data';
|
|
3
|
+
import { ProfileDropdown } from './layout-profile';
|
|
4
|
+
import { TitanLayout } from './titan-layout';
|
|
5
|
+
const withTitanLayout = (element) => () => (_jsx(TitanLayout, { navigationMainItems: [], profile: element, children: _jsx(TitanLayout.Content, { children: "profile" }) }));
|
|
6
|
+
export default {
|
|
7
|
+
title: 'Navigation/TitanLayoutProfile',
|
|
8
|
+
component: ProfileDropdown,
|
|
9
|
+
decorators: [withDefaultRedirects, withMemoryRouter, withAnvil],
|
|
10
|
+
parameters: {},
|
|
11
|
+
};
|
|
12
|
+
export const ProfileDefault = withTitanLayout(_jsxs(ProfileDropdown, { children: [_jsx(ProfileDropdown.Link, { id: "first", to: "https://google.com", children: "first link" }), _jsx(ProfileDropdown.Section, { id: "second", onClick: () => alert('second click'), children: "second link" }), _jsx(ProfileDropdown.Divider, {}), _jsx(ProfileDropdown.Section, { id: "content", children: "some content" }), _jsx(ProfileDropdown.Divider, {}), _jsx(ProfileDropdown.Divider, {}), _jsx(ProfileDropdown.Divider, {}), _jsx(ProfileDropdown.Link, { id: "third", to: "third", children: "third link" }), _jsx(ProfileDropdown.Divider, {})] }));
|
|
13
|
+
//# sourceMappingURL=layout-profile.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-profile.stories.js","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-profile.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,SAAS,EAAE,oBAAoB,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACpF,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C,MAAM,eAAe,GAAG,CAAC,OAAqB,EAAE,EAAE,CAAC,GAAG,EAAE,CAAC,CACrD,KAAC,WAAW,IAAC,mBAAmB,EAAE,EAAE,EAAE,OAAO,EAAE,OAAO,YAClD,KAAC,WAAW,CAAC,OAAO,0BAA8B,GACxC,CACjB,CAAC;AAEF,eAAe;IACX,KAAK,EAAE,+BAA+B;IACtC,SAAS,EAAE,eAAe;IAC1B,UAAU,EAAE,CAAC,oBAAoB,EAAE,gBAAgB,EAAE,SAAS,CAAC;IAC/D,UAAU,EAAE,EAAE;CACjB,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,eAAe,CACzC,MAAC,eAAe,eACZ,KAAC,eAAe,CAAC,IAAI,IAAC,EAAE,EAAC,OAAO,EAAC,EAAE,EAAC,oBAAoB,2BAEjC,EACvB,KAAC,eAAe,CAAC,OAAO,IAAC,EAAE,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,cAAc,CAAC,4BAE/C,EAC1B,KAAC,eAAe,CAAC,OAAO,KAAG,EAC3B,KAAC,eAAe,CAAC,OAAO,IAAC,EAAE,EAAC,SAAS,6BAAuC,EAC5E,KAAC,eAAe,CAAC,OAAO,KAAG,EAC3B,KAAC,eAAe,CAAC,OAAO,KAAG,EAC3B,KAAC,eAAe,CAAC,OAAO,KAAG,EAC3B,KAAC,eAAe,CAAC,IAAI,IAAC,EAAE,EAAC,OAAO,EAAC,EAAE,EAAC,OAAO,2BAEpB,EACvB,KAAC,eAAe,CAAC,OAAO,KAAG,IACb,CACrB,CAAC"}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { FC, MouseEvent, ReactNode } from 'react';
|
|
2
|
+
import { NavigationItemData, NavigationSubmenuItemData } from '../../utils/navigation';
|
|
3
|
+
import { BadgeTagProps } from '../badge-tag';
|
|
4
|
+
import { TitanLayoutSidebarTriggerProps } from './interface';
|
|
5
|
+
import { NavigationComponentProps } from './interface-internal';
|
|
6
|
+
export interface InternalSideNavigationItemContentProps extends Omit<NavigationItemData, 'iconName' | 'to' | 'counter' | 'tag'> {
|
|
7
|
+
submenuExpanded: boolean | undefined;
|
|
8
|
+
tag: BadgeTagProps | undefined;
|
|
9
|
+
onExpandToggle?: (e: MouseEvent<never>) => void;
|
|
10
|
+
}
|
|
11
|
+
export declare const InternalSideNavigationItemContent: FC<InternalSideNavigationItemContentProps>;
|
|
12
|
+
export interface InternalSideNavigationLinkProps extends Omit<NavigationItemData, 'iconName' | 'counter' | 'tag'>, NavigationComponentProps {
|
|
13
|
+
submenuExpanded: boolean | undefined;
|
|
14
|
+
dataPrefix?: string;
|
|
15
|
+
tag: BadgeTagProps | undefined;
|
|
16
|
+
onExpandToggle?: (e: MouseEvent<never>) => void;
|
|
17
|
+
}
|
|
18
|
+
export declare const internalNavigationContentContainerProps: ({ className, icon, iconActive, iconComponent, id, isActive, prefix, isLink, }: Omit<TitanLayoutSidebarTriggerProps, "isActive" | "tag"> & {
|
|
19
|
+
prefix: string;
|
|
20
|
+
isActive?: any;
|
|
21
|
+
isLink: boolean;
|
|
22
|
+
}) => {
|
|
23
|
+
'data-cy': string;
|
|
24
|
+
'data-pendo': string;
|
|
25
|
+
className: string;
|
|
26
|
+
};
|
|
27
|
+
/** Side Navigation menu item (for internal usage) */
|
|
28
|
+
export declare const InternalSideNavigationLink: FC<InternalSideNavigationLinkProps>;
|
|
29
|
+
/** Side Navigation menu trigger (for internal usage) */
|
|
30
|
+
export declare const InternalSideNavigationTrigger: FC<Omit<InternalSideNavigationLinkProps, 'to' | 'navigationComponent'> & {
|
|
31
|
+
onClick?: () => void;
|
|
32
|
+
}>;
|
|
33
|
+
export declare const InternalSideNavigationGroupLink: FC<NavigationSubmenuItemData & NavigationComponentProps>;
|
|
34
|
+
export declare const InternalSideNavigationGroupTrigger: FC<Omit<NavigationSubmenuItemData, 'to'> & {
|
|
35
|
+
onClick?: (e: MouseEvent<any>) => void;
|
|
36
|
+
}>;
|
|
37
|
+
export declare const InternalSideNavigationGroupDivider: () => import("react/jsx-runtime").JSX.Element;
|
|
38
|
+
export declare const InternalSideNavigationGroup: FC<Omit<NavigationItemData, 'tag' | 'counter' | 'to'> & NavigationComponentProps & {
|
|
39
|
+
children: ReactNode;
|
|
40
|
+
submenuExpanded: boolean;
|
|
41
|
+
onExpandToggle?: (e: MouseEvent<never>) => void;
|
|
42
|
+
tag: BadgeTagProps | undefined;
|
|
43
|
+
to: NavigationItemData['to'] | undefined;
|
|
44
|
+
onClick?: () => void;
|
|
45
|
+
}>;
|
|
46
|
+
//# sourceMappingURL=layout-sidebar-links-internal.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-sidebar-links-internal.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-sidebar-links-internal.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,EAAE,EAAY,UAAU,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC5D,OAAO,EAAE,kBAAkB,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AAEvF,OAAO,EAAY,aAAa,EAAE,MAAM,cAAc,CAAC;AACvD,OAAO,EAAE,8BAA8B,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,EAAE,wBAAwB,EAAE,MAAM,sBAAsB,CAAC;AAGhE,MAAM,WAAW,sCACb,SAAQ,IAAI,CAAC,kBAAkB,EAAE,UAAU,GAAG,IAAI,GAAG,SAAS,GAAG,KAAK,CAAC;IACvE,eAAe,EAAE,OAAO,GAAG,SAAS,CAAC;IACrC,GAAG,EAAE,aAAa,GAAG,SAAS,CAAC;IAC/B,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC;CACnD;AAED,eAAO,MAAM,iCAAiC,EAAE,EAAE,CAAC,sCAAsC,CAqExF,CAAC;AAEF,MAAM,WAAW,+BACb,SAAQ,IAAI,CAAC,kBAAkB,EAAE,UAAU,GAAG,SAAS,GAAG,KAAK,CAAC,EAC5D,wBAAwB;IAC5B,eAAe,EAAE,OAAO,GAAG,SAAS,CAAC;IACrC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,GAAG,EAAE,aAAa,GAAG,SAAS,CAAC;IAC/B,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC;CACnD;AAED,eAAO,MAAM,uCAAuC,GAAI,+EASrD,IAAI,CAAC,8BAA8B,EAAE,UAAU,GAAG,KAAK,CAAC,GAAG;IAC1D,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,MAAM,EAAE,OAAO,CAAC;CACnB;;;;CAQC,CAAC;AAEH,qDAAqD;AACrD,eAAO,MAAM,0BAA0B,EAAE,EAAE,CAAC,+BAA+B,CA8B1E,CAAC;AAEF,wDAAwD;AACxD,eAAO,MAAM,6BAA6B,EAAE,EAAE,CAC1C,IAAI,CAAC,+BAA+B,EAAE,IAAI,GAAG,qBAAqB,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CAAE,CAoBjG,CAAC;AAEF,eAAO,MAAM,+BAA+B,EAAE,EAAE,CAC5C,yBAAyB,GAAG,wBAAwB,CAkBvD,CAAC;AAEF,eAAO,MAAM,kCAAkC,EAAE,EAAE,CAC/C,IAAI,CAAC,yBAAyB,EAAE,IAAI,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,GAAG,CAAC,KAAK,IAAI,CAAA;CAAE,CAiBrF,CAAC;AAEF,eAAO,MAAM,kCAAkC,+CAE9C,CAAC;AAEF,eAAO,MAAM,2BAA2B,EAAE,EAAE,CACxC,IAAI,CAAC,kBAAkB,EAAE,KAAK,GAAG,SAAS,GAAG,IAAI,CAAC,GAC9C,wBAAwB,GAAG;IACvB,QAAQ,EAAE,SAAS,CAAC;IACpB,eAAe,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC;IAChD,GAAG,EAAE,aAAa,GAAG,SAAS,CAAC;IAC/B,EAAE,EAAE,kBAAkB,CAAC,IAAI,CAAC,GAAG,SAAS,CAAC;IACzC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB,CA8BR,CAAC"}
|