@servicetitan/navigation 11.0.0-canary.237.7e21f65.0 → 11.0.0-canary.237.8bb2b7d.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/logo/logo-titan-text.d.ts +1 -1
- package/dist/components/logo/logo-titan-text.d.ts.map +1 -1
- package/dist/components/titan-layout/layout-header.module.less +1 -3
- package/dist/components/titan-layout/layout-logo.d.ts.map +1 -1
- package/dist/components/titan-layout/layout-logo.js +1 -2
- package/dist/components/titan-layout/layout-logo.js.map +1 -1
- package/dist/components/titan-layout/titan-layout.d.ts +3 -5
- package/dist/components/titan-layout/titan-layout.d.ts.map +1 -1
- package/dist/components/titan-layout/titan-layout.js +5 -9
- package/dist/components/titan-layout/titan-layout.js.map +1 -1
- package/dist/components/titan-layout/titan-layout.module.less +4 -8
- package/dist/components/titan-layout/titan-layout.stories.d.ts +0 -1
- package/dist/components/titan-layout/titan-layout.stories.d.ts.map +1 -1
- package/dist/components/titan-layout/titan-layout.stories.js +3 -4
- package/dist/components/titan-layout/titan-layout.stories.js.map +1 -1
- package/package.json +2 -2
- package/src/components/logo/logo-titan-text.tsx +1 -1
- package/src/components/titan-layout/layout-header.module.less +1 -3
- package/src/components/titan-layout/layout-logo.tsx +6 -13
- package/src/components/titan-layout/titan-layout.module.less +4 -8
- package/src/components/titan-layout/titan-layout.module.less.d.ts +0 -1
- package/src/components/titan-layout/titan-layout.stories.tsx +3 -7
- package/src/components/titan-layout/titan-layout.tsx +58 -70
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"logo-titan-text.d.ts","sourceRoot":"","sources":["../../../src/components/logo/logo-titan-text.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIrD,MAAM,MAAM,YAAY,GAAG,EAAE,CAAC;IAAE,SAAS,
|
|
1
|
+
{"version":3,"file":"logo-titan-text.d.ts","sourceRoot":"","sources":["../../../src/components/logo/logo-titan-text.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIrD,MAAM,MAAM,YAAY,GAAG,EAAE,CAAC;IAAE,SAAS,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,SAAS,CAAC;IAAC,KAAK,CAAC,EAAE,aAAa,CAAA;CAAE,CAAC,CAAC;AAEjG,MAAM,WAAW,cAAc;IAC3B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,WAAW,kBAAkB;IAC/B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,YAAY,CAAC;CAC9B;AAED,MAAM,WAAW,mBAAmB;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;CACvB;AAQD,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAoBxC,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAElD,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,EAAE,CAAC,mBAAmB,CAIxD,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CAkBhD,CAAC"}
|
|
@@ -10,7 +10,6 @@
|
|
|
10
10
|
background-color: @color-white;
|
|
11
11
|
color: @color-black;
|
|
12
12
|
border-bottom: 1px solid @color-neutral-60;
|
|
13
|
-
box-sizing: border-box;
|
|
14
13
|
|
|
15
14
|
& > * {
|
|
16
15
|
overflow-y: hidden;
|
|
@@ -131,8 +130,7 @@
|
|
|
131
130
|
// mobile
|
|
132
131
|
@media only screen and (max-width: 768px) {
|
|
133
132
|
.header {
|
|
134
|
-
padding: @spacing-
|
|
135
|
-
height: var(--nav-offset-top);
|
|
133
|
+
padding: @spacing-1 @spacing-0;
|
|
136
134
|
|
|
137
135
|
.navigation-link {
|
|
138
136
|
padding: 10px;
|
|
@@ -1 +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,
|
|
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"}
|
|
@@ -10,7 +10,6 @@ export const TitanLayoutLogo = ({ className, mantleFill, postfix, title, logoWra
|
|
|
10
10
|
const Wrapper = logoWrapper;
|
|
11
11
|
const logoSize = isMobile ? 44 : 56;
|
|
12
12
|
const logoCompanySize = 48;
|
|
13
|
-
|
|
14
|
-
return (_jsxs("div", { className: classNames('d-f align-items-center', { 'p-t-half': showCompanyTitle }, className), children: [showCompanyTitle ? (_jsx(Wrapper, { children: _jsx(LogoCompanyTitle, { height: logoCompanySize }) })) : 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 }))] })) : (_jsx(LogoTitan, { size: logoSize, mantleFill: mantleFill, logoWrapper: Wrapper })), !isMobile && postfix] }));
|
|
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] }));
|
|
15
14
|
};
|
|
16
15
|
//# sourceMappingURL=layout-logo.js.map
|
|
@@ -1 +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;
|
|
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"}
|
|
@@ -6,16 +6,14 @@ import { TitanLayoutLogoProps } from './layout-logo';
|
|
|
6
6
|
import { TitanLayoutSidebarLink, TitanLayoutSidebarTrigger } from './layout-sidebar-links';
|
|
7
7
|
type TitanLayoutChild = ReactElement<TitanLayoutContentProps> | ReactElement<TitanLayoutLogoProps>;
|
|
8
8
|
export type TitanLayoutProps = Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'style'> & {
|
|
9
|
-
|
|
9
|
+
empty?: boolean;
|
|
10
10
|
appearance?: 'legacy' | 'anvil1' | 'anvil2';
|
|
11
|
-
/** layout's content */
|
|
12
|
-
children?: TitanLayoutChild | TitanLayoutChild[];
|
|
13
|
-
/** show only content without side and top bars */
|
|
14
|
-
contentOnly?: boolean;
|
|
15
11
|
/** component used for navigation */
|
|
16
12
|
navigationComponent?: FC<NavLinkComponentProps>;
|
|
17
13
|
/** data for main navigation links */
|
|
18
14
|
navigationMainItems?: NavigationItemData[];
|
|
15
|
+
/** layout's content */
|
|
16
|
+
children?: TitanLayoutChild | TitanLayoutChild[];
|
|
19
17
|
state?: TitanLayoutState;
|
|
20
18
|
onStateChange?: (state: TitanLayoutState) => void;
|
|
21
19
|
header?: ReactElement;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"titan-layout.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/titan-layout.tsx"],"names":[],"mappings":"AACA,OAAO,EAGH,wBAAwB,EACxB,EAAE,EAEF,YAAY,EACZ,SAAS,EAOZ,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAA2B,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAEhG,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAQ/C,OAAO,EAAmB,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAEtE,OAAO,EAAE,sBAAsB,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AAK3F,KAAK,gBAAgB,GAAG,YAAY,CAAC,uBAAuB,CAAC,GAAG,YAAY,CAAC,oBAAoB,CAAC,CAAC;AAEnG,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,GAAG;IACzF,
|
|
1
|
+
{"version":3,"file":"titan-layout.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/titan-layout.tsx"],"names":[],"mappings":"AACA,OAAO,EAGH,wBAAwB,EACxB,EAAE,EAEF,YAAY,EACZ,SAAS,EAOZ,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAA2B,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAEhG,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAQ/C,OAAO,EAAmB,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAEtE,OAAO,EAAE,sBAAsB,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AAK3F,KAAK,gBAAgB,GAAG,YAAY,CAAC,uBAAuB,CAAC,GAAG,YAAY,CAAC,oBAAoB,CAAC,CAAC;AAEnG,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,GAAG;IACzF,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,UAAU,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAE5C,oCAAoC;IACpC,mBAAmB,CAAC,EAAE,EAAE,CAAC,qBAAqB,CAAC,CAAC;IAEhD,qCAAqC;IACrC,mBAAmB,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAE3C,uBAAuB;IACvB,QAAQ,CAAC,EAAE,gBAAgB,GAAG,gBAAgB,EAAE,CAAC;IAEjD,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAElD,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,GAAG,CAAC,EAAE,YAAY,CAAC;IACnB,OAAO,CAAC,EAAE,YAAY,EAAE,CAAC;IACzB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,UAAU,CAAC,EAAE,YAAY,CAAC;IAC1B,aAAa,CAAC,EAAE,YAAY,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC5B,CAAC;AAmQF,MAAM,WAAW,uBAAuB;IACpC,QAAQ,EAAE,SAAS,CAAC;CACvB;AAgDD,eAAO,MAAM,WAAW;;;;;CAKtB,CAAC"}
|
|
@@ -46,8 +46,9 @@ const useLayoutChildren = (children) => useMemo(() => Children.toArray(children)
|
|
|
46
46
|
}, {
|
|
47
47
|
logo: _jsx(TitanLayoutLogo, {}),
|
|
48
48
|
}), [children]);
|
|
49
|
-
const TitanLayoutComponent = ({ appearance = 'anvil2', id, children,
|
|
49
|
+
const TitanLayoutComponent = ({ appearance = 'anvil2', id, children, navigationComponent, header, top, profile, state, onStateChange, navigationMainItems, extraLinks, extraLinksTop, extraText, minContentWidth, sideTop, }) => {
|
|
50
50
|
const breakpoint = useTitanBreakpoint();
|
|
51
|
+
const isMobile = breakpoint.isMobile;
|
|
51
52
|
const context = useMemo(() => ({
|
|
52
53
|
NavigationComponent: navigationComponent !== null && navigationComponent !== void 0 ? navigationComponent : DefaultNavLinkComponent,
|
|
53
54
|
breakpoint,
|
|
@@ -58,9 +59,6 @@ const TitanLayoutComponent = ({ appearance = 'anvil2', id, children, contentOnly
|
|
|
58
59
|
const [mobileDrawerOpened, setMobileDrawerOpened] = useState(false);
|
|
59
60
|
const { content, logo } = useLayoutChildren(children);
|
|
60
61
|
const { hasNotifications, NotificationsContextProvider } = useNotificationsState();
|
|
61
|
-
const isMobile = breakpoint.isMobile;
|
|
62
|
-
const hasSideBar = !contentOnly && (!!(navigationMainItems === null || navigationMainItems === void 0 ? void 0 : navigationMainItems.length) || !!(sideTop === null || sideTop === void 0 ? void 0 : sideTop.length));
|
|
63
|
-
const hasTopBar = !contentOnly;
|
|
64
62
|
useEffect(() => {
|
|
65
63
|
if (variant.isAnvil1) {
|
|
66
64
|
const bodyClassName = 'of-hidden-i';
|
|
@@ -110,11 +108,9 @@ const TitanLayoutComponent = ({ appearance = 'anvil2', id, children, contentOnly
|
|
|
110
108
|
: variant.isAnvil1
|
|
111
109
|
? Styles.layoutAnvil1
|
|
112
110
|
: Styles.layoutAnvil2;
|
|
113
|
-
return (_jsx(LayoutContext.Provider, { value: context, children: _jsx(LayoutPlacementContext.Provider, { value: "unset", children: _jsxs("div", { id: id, className: classNames(Styles.layout, isMobile ? Styles.layoutMobile : Styles.layoutDesktop,
|
|
114
|
-
|
|
115
|
-
[Styles.
|
|
116
|
-
[Styles.layoutNavWide]: !isMobile && hasSideBar && !(state === null || state === void 0 ? void 0 : state.navCollapsed),
|
|
117
|
-
}, layoutClass), children: [variant.isSequent && _jsx("div", { className: Styles.topPlaceholder }), hasTopBar && (_jsx(LayoutHeader, { className: Styles.top, logo: logo, profile: isMobile ? undefined : profile, center: top, rightText: isMobile ? undefined : extraText, right: _jsxs(Fragment, { children: [extraLinksTop, !isMobile && extraLinks] }), isMobile: isMobile, hasNotifications: hasNotifications || hasMenuNotifications, onBurgerClick: onBurgerClick })), hasSideBar && (_jsx(NotificationsContextProvider, { children: _jsx(LayoutSidebar, { className: Styles.side, mobile: breakpoint.isMobile, barExpanded: !(state === null || state === void 0 ? void 0 : state.navCollapsed), onBarExpandChange: onBarExpandChange, submenuExpanded: state === null || state === void 0 ? void 0 : state.submenuExpanded, onSubmenuExpandChange: onSubmenuExpandChange, drawerOpened: mobileDrawerOpened, onDrawerOpenChange: setMobileDrawerOpened, top: sideTop, mainItems: navigationMainItems, navigationComponent: context.NavigationComponent, bottom: isMobile ? (_jsxs(Fragment, { children: [profile, extraLinks, !!extraText && (_jsx(InternalSideNavigationTrigger, { id: "__extra_text", title: extraText, submenuExpanded: undefined, dataPrefix: "navigation-extra-text", tag: undefined, icon: undefined, iconActive: undefined }))] })) : undefined }) })), _jsx(LayoutContent, { header: header, anvil2: variant.isAnvil2, anvil1: variant.isAnvil1, minWidth: minContentWidth, children: content })] }) }) }));
|
|
111
|
+
return (_jsx(LayoutContext.Provider, { value: context, children: _jsx(LayoutPlacementContext.Provider, { value: "unset", children: _jsxs("div", { id: id, className: classNames(Styles.layout, isMobile ? Styles.layoutMobile : Styles.layoutDesktop, !isMobile && (state === null || state === void 0 ? void 0 : state.navCollapsed)
|
|
112
|
+
? Styles.layoutNavSlim
|
|
113
|
+
: Styles.layoutNavWide, layoutClass), children: [variant.isSequent && _jsx("div", { className: Styles.topPlaceholder }), _jsx(LayoutHeader, { className: Styles.top, logo: logo, profile: isMobile ? undefined : profile, center: top, rightText: isMobile ? undefined : extraText, right: _jsxs(Fragment, { children: [extraLinksTop, !isMobile && extraLinks] }), isMobile: isMobile, hasNotifications: hasNotifications || hasMenuNotifications, onBurgerClick: onBurgerClick }), _jsx(NotificationsContextProvider, { children: _jsx(LayoutSidebar, { className: Styles.side, mobile: breakpoint.isMobile, barExpanded: !(state === null || state === void 0 ? void 0 : state.navCollapsed), onBarExpandChange: onBarExpandChange, submenuExpanded: state === null || state === void 0 ? void 0 : state.submenuExpanded, onSubmenuExpandChange: onSubmenuExpandChange, drawerOpened: mobileDrawerOpened, onDrawerOpenChange: setMobileDrawerOpened, top: sideTop, mainItems: navigationMainItems, navigationComponent: context.NavigationComponent, bottom: isMobile ? (_jsxs(Fragment, { children: [profile, extraLinks, !!extraText && (_jsx(InternalSideNavigationTrigger, { id: "__extra_text", title: extraText, submenuExpanded: undefined, dataPrefix: "navigation-extra-text", tag: undefined, icon: undefined, iconActive: undefined }))] })) : undefined }) }), _jsx(LayoutContent, { header: header, anvil2: variant.isAnvil2, anvil1: variant.isAnvil1, minWidth: minContentWidth, children: content })] }) }) }));
|
|
118
114
|
};
|
|
119
115
|
const TitanLayoutHeaderObserved = ({ children, heightChange }) => {
|
|
120
116
|
const ref = useRef(null);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"titan-layout.js","sourceRoot":"","sources":["../../../src/components/titan-layout/titan-layout.tsx"],"names":[],"mappings":";AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAEH,QAAQ,EAGR,QAAQ,EAGR,cAAc,EACd,WAAW,EACX,SAAS,EACT,OAAO,EACP,MAAM,EACN,QAAQ,GACX,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,uBAAuB,EAAyB,MAAM,gCAAgC,CAAC;AAChG,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,OAAO,EACH,aAAa,EACb,sBAAsB,GAGzB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,eAAe,EAAwB,MAAM,eAAe,CAAC;AACtE,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,sBAAsB,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AAC3F,OAAO,EAAE,6BAA6B,EAAE,MAAM,iCAAiC,CAAC;AAChF,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,KAAK,MAAM,MAAM,4BAA4B,CAAC;
|
|
1
|
+
{"version":3,"file":"titan-layout.js","sourceRoot":"","sources":["../../../src/components/titan-layout/titan-layout.tsx"],"names":[],"mappings":"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"}
|
|
@@ -60,15 +60,11 @@
|
|
|
60
60
|
}
|
|
61
61
|
|
|
62
62
|
.layout {
|
|
63
|
-
--nav-offset-top:
|
|
64
|
-
--nav-offset-left: 0;
|
|
63
|
+
--nav-offset-top: 49px;
|
|
65
64
|
|
|
66
|
-
&.layout-
|
|
67
|
-
--nav-offset-top:
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
&.layout-mobile.layout-top {
|
|
71
|
-
--nav-offset-top: 72px;
|
|
65
|
+
&.layout-mobile {
|
|
66
|
+
--nav-offset-top: 61px;
|
|
67
|
+
--nav-offset-left: 0;
|
|
72
68
|
}
|
|
73
69
|
|
|
74
70
|
&.layout-desktop.layout-nav-slim {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"titan-layout.stories.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/titan-layout.stories.tsx"],"names":[],"mappings":"AAsBA,UAAU,iBAAiB;IACvB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"titan-layout.stories.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/titan-layout.stories.tsx"],"names":[],"mappings":"AAsBA,UAAU,iBAAiB;IACvB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,OAAO,CAAC;CACrB;;;;;;UAeQ,iBAAiB;;AAb1B,wBAcE;AAiQF,eAAO,MAAM,iBAAiB,GAAI,MAAM,iBAAiB,4CASxD,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,MAAM,iBAAiB,4CASxD,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,MAAM,iBAAiB,4CAWxD,CAAC"}
|
|
@@ -24,7 +24,6 @@ export default {
|
|
|
24
24
|
longContent: true,
|
|
25
25
|
wideContent: false,
|
|
26
26
|
minWidth: false,
|
|
27
|
-
emptyNav: false,
|
|
28
27
|
},
|
|
29
28
|
};
|
|
30
29
|
const mainNavItems = [
|
|
@@ -56,21 +55,21 @@ const ContentHeader = () => {
|
|
|
56
55
|
const [longInfo, setLongInfo] = useState(false);
|
|
57
56
|
return (_jsxs(Fragment, { children: [_jsx(Announcement, { title: "Some info", status: "info" }), _jsx(Announcement, { title: "Some warning", status: "warning" }), _jsx("div", { className: "d-f justify-content-center align-items-center bg-purple-100-i", style: { height: longInfo ? '120px' : '48px' }, children: _jsxs("div", { className: "d-f align-items-center gap-1", children: ["custom content", ' ', _jsx(Button, { onClick: () => setLongInfo(!longInfo), size: "small", "aria-label": "test", children: longInfo ? '↑' : '↓' })] }) })] }));
|
|
58
57
|
};
|
|
59
|
-
const SearchBar = () =>
|
|
58
|
+
const SearchBar = () => _jsx(TextField, { size: "small", placeholder: "Search", className: "w-100-i" });
|
|
60
59
|
const useLayoutProps = (args) => {
|
|
61
60
|
const [state, setState] = useState(undefined);
|
|
62
61
|
return {
|
|
63
62
|
state,
|
|
64
63
|
onStateChange: setState,
|
|
65
64
|
navigationComponent: NavLinkMock,
|
|
66
|
-
navigationMainItems:
|
|
65
|
+
navigationMainItems: mainNavItems,
|
|
67
66
|
profile,
|
|
68
67
|
top: args.search ? _jsx(SearchBar, {}) : undefined,
|
|
69
68
|
header: args.header ? _jsx(ContentHeader, {}) : undefined,
|
|
70
69
|
extraLinks,
|
|
71
70
|
extraLinksTop,
|
|
72
71
|
extraText: args.extraText ? 'EST (-8 hrs)' : undefined,
|
|
73
|
-
sideTop: args.sideTop
|
|
72
|
+
sideTop: args.sideTop ? sidebarTop() : undefined,
|
|
74
73
|
minContentWidth: args.minWidth ? 900 : undefined,
|
|
75
74
|
};
|
|
76
75
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"titan-layout.stories.js","sourceRoot":"","sources":["../../../src/components/titan-layout/titan-layout.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAE,IAAI,IAAI,UAAU,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACpG,OAAO,SAAS,MAAM,6DAA6D,CAAC;AACpF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,iBAAiB,MAAM,+DAA+D,CAAC;AAC9F,OAAO,WAAW,MAAM,iEAAiE,CAAC;AAC1F,OAAO,eAAe,MAAM,oEAAoE,CAAC;AACjG,OAAO,SAAS,MAAM,sEAAsE,CAAC;AAC7F,OAAO,EAAE,IAAI,IAAI,UAAU,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAM,QAAQ,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,EACH,sBAAsB,EACtB,YAAY,EACZ,WAAW,EACX,KAAK,EACL,SAAS,EACT,oBAAoB,EACpB,gBAAgB,GACnB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,MAAM,UAAU,CAAC;AACzE,OAAO,EAAE,eAAe,EAAE,WAAW,EAAsC,MAAM,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"titan-layout.stories.js","sourceRoot":"","sources":["../../../src/components/titan-layout/titan-layout.stories.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@servicetitan/navigation",
|
|
3
|
-
"version": "11.0.0-canary.237.
|
|
3
|
+
"version": "11.0.0-canary.237.8bb2b7d.0",
|
|
4
4
|
"description": "Navigation components",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -42,5 +42,5 @@
|
|
|
42
42
|
"less": true,
|
|
43
43
|
"webpack": false
|
|
44
44
|
},
|
|
45
|
-
"gitHead": "
|
|
45
|
+
"gitHead": "8bb2b7d0a25834f28000211c21517ed40f115781"
|
|
46
46
|
}
|
|
@@ -3,7 +3,7 @@ import { CSSProperties, FC, ReactNode } from 'react';
|
|
|
3
3
|
import { LogoTitanSvg } from './logo-titan';
|
|
4
4
|
import * as Styles from './logo-titan-text.module.less';
|
|
5
5
|
|
|
6
|
-
export type WrapperProps = FC<{ className
|
|
6
|
+
export type WrapperProps = FC<{ className: string; children: ReactNode; style?: CSSProperties }>;
|
|
7
7
|
|
|
8
8
|
export interface LogoTitanProps {
|
|
9
9
|
mantleFill?: string;
|
|
@@ -10,7 +10,6 @@
|
|
|
10
10
|
background-color: @color-white;
|
|
11
11
|
color: @color-black;
|
|
12
12
|
border-bottom: 1px solid @color-neutral-60;
|
|
13
|
-
box-sizing: border-box;
|
|
14
13
|
|
|
15
14
|
& > * {
|
|
16
15
|
overflow-y: hidden;
|
|
@@ -131,8 +130,7 @@
|
|
|
131
130
|
// mobile
|
|
132
131
|
@media only screen and (max-width: 768px) {
|
|
133
132
|
.header {
|
|
134
|
-
padding: @spacing-
|
|
135
|
-
height: var(--nav-offset-top);
|
|
133
|
+
padding: @spacing-1 @spacing-0;
|
|
136
134
|
|
|
137
135
|
.navigation-link {
|
|
138
136
|
padding: 10px;
|
|
@@ -33,27 +33,20 @@ export const TitanLayoutLogo: FC<TitanLayoutLogoProps> = ({
|
|
|
33
33
|
const Wrapper = logoWrapper;
|
|
34
34
|
const logoSize = isMobile ? 44 : 56;
|
|
35
35
|
const logoCompanySize = 48;
|
|
36
|
-
const showCompanyTitle = title === true && !isMobile;
|
|
37
36
|
|
|
38
37
|
return (
|
|
39
|
-
<div
|
|
40
|
-
|
|
41
|
-
'd-f align-items-center',
|
|
42
|
-
{ 'p-t-half': showCompanyTitle },
|
|
43
|
-
className
|
|
44
|
-
)}
|
|
45
|
-
>
|
|
46
|
-
{showCompanyTitle ? (
|
|
47
|
-
<Wrapper>
|
|
48
|
-
<LogoCompanyTitle height={logoCompanySize} />
|
|
49
|
-
</Wrapper>
|
|
50
|
-
) : typeof title === 'string' ? (
|
|
38
|
+
<div className={classNames('d-f align-items-center', className)}>
|
|
39
|
+
{typeof title === 'string' ? (
|
|
51
40
|
<Fragment>
|
|
52
41
|
<LogoTitan size={logoSize} mantleFill={mantleFill} logoWrapper={Wrapper} />
|
|
53
42
|
{!isMobile && (
|
|
54
43
|
<LogoTitanTitle className="c-inherit m-l-1">{title}</LogoTitanTitle>
|
|
55
44
|
)}
|
|
56
45
|
</Fragment>
|
|
46
|
+
) : title === true && !isMobile ? (
|
|
47
|
+
<Wrapper className="">
|
|
48
|
+
<LogoCompanyTitle height={logoCompanySize} />
|
|
49
|
+
</Wrapper>
|
|
57
50
|
) : (
|
|
58
51
|
<LogoTitan size={logoSize} mantleFill={mantleFill} logoWrapper={Wrapper} />
|
|
59
52
|
)}
|
|
@@ -60,15 +60,11 @@
|
|
|
60
60
|
}
|
|
61
61
|
|
|
62
62
|
.layout {
|
|
63
|
-
--nav-offset-top:
|
|
64
|
-
--nav-offset-left: 0;
|
|
63
|
+
--nav-offset-top: 49px;
|
|
65
64
|
|
|
66
|
-
&.layout-
|
|
67
|
-
--nav-offset-top:
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
&.layout-mobile.layout-top {
|
|
71
|
-
--nav-offset-top: 72px;
|
|
65
|
+
&.layout-mobile {
|
|
66
|
+
--nav-offset-top: 61px;
|
|
67
|
+
--nav-offset-left: 0;
|
|
72
68
|
}
|
|
73
69
|
|
|
74
70
|
&.layout-desktop.layout-nav-slim {
|
|
@@ -9,7 +9,6 @@ export const layoutLegacy: string;
|
|
|
9
9
|
export const layoutMobile: string;
|
|
10
10
|
export const layoutNavSlim: string;
|
|
11
11
|
export const layoutNavWide: string;
|
|
12
|
-
export const layoutTop: string;
|
|
13
12
|
export const side: string;
|
|
14
13
|
export const top: string;
|
|
15
14
|
export const topPlaceholder: string;
|
|
@@ -28,7 +28,6 @@ interface LayoutContentArgs {
|
|
|
28
28
|
longContent: boolean;
|
|
29
29
|
wideContent: boolean;
|
|
30
30
|
minWidth: boolean;
|
|
31
|
-
emptyNav: boolean;
|
|
32
31
|
}
|
|
33
32
|
|
|
34
33
|
export default {
|
|
@@ -44,7 +43,6 @@ export default {
|
|
|
44
43
|
longContent: true,
|
|
45
44
|
wideContent: false,
|
|
46
45
|
minWidth: false,
|
|
47
|
-
emptyNav: false,
|
|
48
46
|
} as LayoutContentArgs,
|
|
49
47
|
};
|
|
50
48
|
|
|
@@ -185,9 +183,7 @@ const ContentHeader = () => {
|
|
|
185
183
|
</Fragment>
|
|
186
184
|
);
|
|
187
185
|
};
|
|
188
|
-
const SearchBar = () =>
|
|
189
|
-
<TextField size="small" placeholder="Search" className="w-100-i m-x-half-i" />
|
|
190
|
-
);
|
|
186
|
+
const SearchBar = () => <TextField size="small" placeholder="Search" className="w-100-i" />;
|
|
191
187
|
|
|
192
188
|
const useLayoutProps = (args: LayoutContentArgs): TitanLayoutProps => {
|
|
193
189
|
const [state, setState] = useState<TitanLayoutState | undefined>(undefined);
|
|
@@ -197,7 +193,7 @@ const useLayoutProps = (args: LayoutContentArgs): TitanLayoutProps => {
|
|
|
197
193
|
onStateChange: setState,
|
|
198
194
|
|
|
199
195
|
navigationComponent: NavLinkMock,
|
|
200
|
-
navigationMainItems:
|
|
196
|
+
navigationMainItems: mainNavItems,
|
|
201
197
|
|
|
202
198
|
profile,
|
|
203
199
|
top: args.search ? <SearchBar /> : undefined,
|
|
@@ -207,7 +203,7 @@ const useLayoutProps = (args: LayoutContentArgs): TitanLayoutProps => {
|
|
|
207
203
|
extraLinksTop,
|
|
208
204
|
extraText: args.extraText ? 'EST (-8 hrs)' : undefined,
|
|
209
205
|
|
|
210
|
-
sideTop: args.sideTop
|
|
206
|
+
sideTop: args.sideTop ? sidebarTop() : undefined,
|
|
211
207
|
|
|
212
208
|
minContentWidth: args.minWidth ? 900 : undefined,
|
|
213
209
|
};
|
|
@@ -35,14 +35,9 @@ import * as Styles from './titan-layout.module.less';
|
|
|
35
35
|
type TitanLayoutChild = ReactElement<TitanLayoutContentProps> | ReactElement<TitanLayoutLogoProps>;
|
|
36
36
|
|
|
37
37
|
export type TitanLayoutProps = Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'style'> & {
|
|
38
|
-
|
|
39
|
-
appearance?: 'legacy' | 'anvil1' | 'anvil2';
|
|
40
|
-
|
|
41
|
-
/** layout's content */
|
|
42
|
-
children?: TitanLayoutChild | TitanLayoutChild[];
|
|
38
|
+
empty?: boolean;
|
|
43
39
|
|
|
44
|
-
|
|
45
|
-
contentOnly?: boolean;
|
|
40
|
+
appearance?: 'legacy' | 'anvil1' | 'anvil2';
|
|
46
41
|
|
|
47
42
|
/** component used for navigation */
|
|
48
43
|
navigationComponent?: FC<NavLinkComponentProps>;
|
|
@@ -50,6 +45,9 @@ export type TitanLayoutProps = Omit<ComponentPropsWithoutRef<'div'>, 'children'
|
|
|
50
45
|
/** data for main navigation links */
|
|
51
46
|
navigationMainItems?: NavigationItemData[];
|
|
52
47
|
|
|
48
|
+
/** layout's content */
|
|
49
|
+
children?: TitanLayoutChild | TitanLayoutChild[];
|
|
50
|
+
|
|
53
51
|
state?: TitanLayoutState;
|
|
54
52
|
onStateChange?: (state: TitanLayoutState) => void;
|
|
55
53
|
|
|
@@ -119,7 +117,6 @@ const TitanLayoutComponent: FC<TitanLayoutProps> = ({
|
|
|
119
117
|
appearance = 'anvil2',
|
|
120
118
|
id,
|
|
121
119
|
children,
|
|
122
|
-
contentOnly,
|
|
123
120
|
navigationComponent,
|
|
124
121
|
header,
|
|
125
122
|
top,
|
|
@@ -134,6 +131,7 @@ const TitanLayoutComponent: FC<TitanLayoutProps> = ({
|
|
|
134
131
|
sideTop,
|
|
135
132
|
}) => {
|
|
136
133
|
const breakpoint = useTitanBreakpoint();
|
|
134
|
+
const isMobile = breakpoint.isMobile;
|
|
137
135
|
const context: TitanLayoutContextType = useMemo(
|
|
138
136
|
() => ({
|
|
139
137
|
NavigationComponent: navigationComponent ?? DefaultNavLinkComponent,
|
|
@@ -148,10 +146,6 @@ const TitanLayoutComponent: FC<TitanLayoutProps> = ({
|
|
|
148
146
|
const { content, logo } = useLayoutChildren(children);
|
|
149
147
|
const { hasNotifications, NotificationsContextProvider } = useNotificationsState();
|
|
150
148
|
|
|
151
|
-
const isMobile = breakpoint.isMobile;
|
|
152
|
-
const hasSideBar = !contentOnly && (!!navigationMainItems?.length || !!sideTop?.length);
|
|
153
|
-
const hasTopBar = !contentOnly;
|
|
154
|
-
|
|
155
149
|
useEffect(() => {
|
|
156
150
|
if (variant.isAnvil1) {
|
|
157
151
|
const bodyClassName = 'of-hidden-i';
|
|
@@ -217,70 +211,64 @@ const TitanLayoutComponent: FC<TitanLayoutProps> = ({
|
|
|
217
211
|
className={classNames(
|
|
218
212
|
Styles.layout,
|
|
219
213
|
isMobile ? Styles.layoutMobile : Styles.layoutDesktop,
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
[Styles.layoutNavWide]: !isMobile && hasSideBar && !state?.navCollapsed,
|
|
224
|
-
},
|
|
214
|
+
!isMobile && state?.navCollapsed
|
|
215
|
+
? Styles.layoutNavSlim
|
|
216
|
+
: Styles.layoutNavWide,
|
|
225
217
|
layoutClass
|
|
226
218
|
)}
|
|
227
219
|
>
|
|
228
220
|
{variant.isSequent && <div className={Styles.topPlaceholder} />}
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
221
|
+
<LayoutHeader
|
|
222
|
+
className={Styles.top}
|
|
223
|
+
logo={logo}
|
|
224
|
+
profile={isMobile ? undefined : profile}
|
|
225
|
+
center={top}
|
|
226
|
+
rightText={isMobile ? undefined : extraText}
|
|
227
|
+
right={
|
|
228
|
+
<Fragment>
|
|
229
|
+
{extraLinksTop}
|
|
230
|
+
{!isMobile && extraLinks}
|
|
231
|
+
</Fragment>
|
|
232
|
+
}
|
|
233
|
+
isMobile={isMobile}
|
|
234
|
+
hasNotifications={hasNotifications || hasMenuNotifications}
|
|
235
|
+
onBurgerClick={onBurgerClick}
|
|
236
|
+
/>
|
|
237
|
+
|
|
238
|
+
<NotificationsContextProvider>
|
|
239
|
+
<LayoutSidebar
|
|
240
|
+
className={Styles.side}
|
|
241
|
+
mobile={breakpoint.isMobile}
|
|
242
|
+
barExpanded={!state?.navCollapsed}
|
|
243
|
+
onBarExpandChange={onBarExpandChange}
|
|
244
|
+
submenuExpanded={state?.submenuExpanded}
|
|
245
|
+
onSubmenuExpandChange={onSubmenuExpandChange}
|
|
246
|
+
drawerOpened={mobileDrawerOpened}
|
|
247
|
+
onDrawerOpenChange={setMobileDrawerOpened}
|
|
248
|
+
top={sideTop}
|
|
249
|
+
mainItems={navigationMainItems}
|
|
250
|
+
navigationComponent={context.NavigationComponent}
|
|
251
|
+
bottom={
|
|
252
|
+
isMobile ? (
|
|
253
|
+
<Fragment>
|
|
254
|
+
{profile}
|
|
255
|
+
{extraLinks}
|
|
256
|
+
{!!extraText && (
|
|
257
|
+
<InternalSideNavigationTrigger
|
|
258
|
+
id="__extra_text"
|
|
259
|
+
title={extraText}
|
|
260
|
+
submenuExpanded={undefined}
|
|
261
|
+
dataPrefix="navigation-extra-text"
|
|
262
|
+
tag={undefined}
|
|
263
|
+
icon={undefined}
|
|
264
|
+
iconActive={undefined}
|
|
265
|
+
/>
|
|
266
|
+
)}
|
|
267
|
+
</Fragment>
|
|
268
|
+
) : undefined
|
|
241
269
|
}
|
|
242
|
-
isMobile={isMobile}
|
|
243
|
-
hasNotifications={hasNotifications || hasMenuNotifications}
|
|
244
|
-
onBurgerClick={onBurgerClick}
|
|
245
270
|
/>
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
{hasSideBar && (
|
|
249
|
-
<NotificationsContextProvider>
|
|
250
|
-
<LayoutSidebar
|
|
251
|
-
className={Styles.side}
|
|
252
|
-
mobile={breakpoint.isMobile}
|
|
253
|
-
barExpanded={!state?.navCollapsed}
|
|
254
|
-
onBarExpandChange={onBarExpandChange}
|
|
255
|
-
submenuExpanded={state?.submenuExpanded}
|
|
256
|
-
onSubmenuExpandChange={onSubmenuExpandChange}
|
|
257
|
-
drawerOpened={mobileDrawerOpened}
|
|
258
|
-
onDrawerOpenChange={setMobileDrawerOpened}
|
|
259
|
-
top={sideTop}
|
|
260
|
-
mainItems={navigationMainItems}
|
|
261
|
-
navigationComponent={context.NavigationComponent}
|
|
262
|
-
bottom={
|
|
263
|
-
isMobile ? (
|
|
264
|
-
<Fragment>
|
|
265
|
-
{profile}
|
|
266
|
-
{extraLinks}
|
|
267
|
-
{!!extraText && (
|
|
268
|
-
<InternalSideNavigationTrigger
|
|
269
|
-
id="__extra_text"
|
|
270
|
-
title={extraText}
|
|
271
|
-
submenuExpanded={undefined}
|
|
272
|
-
dataPrefix="navigation-extra-text"
|
|
273
|
-
tag={undefined}
|
|
274
|
-
icon={undefined}
|
|
275
|
-
iconActive={undefined}
|
|
276
|
-
/>
|
|
277
|
-
)}
|
|
278
|
-
</Fragment>
|
|
279
|
-
) : undefined
|
|
280
|
-
}
|
|
281
|
-
/>
|
|
282
|
-
</NotificationsContextProvider>
|
|
283
|
-
)}
|
|
271
|
+
</NotificationsContextProvider>
|
|
284
272
|
<LayoutContent
|
|
285
273
|
header={header}
|
|
286
274
|
anvil2={variant.isAnvil2}
|