@servicetitan/navigation 11.1.1 → 11.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/titan-layout/layout-header.module.less +0 -6
- package/dist/components/titan-layout/layout-logo.d.ts +3 -5
- package/dist/components/titan-layout/layout-logo.d.ts.map +1 -1
- package/dist/components/titan-layout/layout-logo.js +10 -7
- package/dist/components/titan-layout/layout-logo.js.map +1 -1
- package/package.json +2 -2
- package/src/components/titan-layout/layout-header.module.less +0 -6
- package/src/components/titan-layout/layout-logo.tsx +16 -15
|
@@ -1,12 +1,10 @@
|
|
|
1
|
-
import { FC, ReactNode } from 'react';
|
|
2
|
-
|
|
3
|
-
export interface TitanLayoutLogoProps {
|
|
1
|
+
import { ComponentPropsWithoutRef, FC, ReactNode } from 'react';
|
|
2
|
+
export type TitanLayoutLogoProps = Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'style' | 'title'> & {
|
|
4
3
|
title?: string | boolean;
|
|
5
4
|
postfix?: ReactNode;
|
|
6
|
-
logoWrapper?: WrapperProps;
|
|
7
5
|
mantleFill?: string;
|
|
8
6
|
to?: string;
|
|
9
|
-
}
|
|
7
|
+
};
|
|
10
8
|
export declare const isLogoCompany: (props: TitanLayoutLogoProps | undefined, isMobile: boolean) => boolean;
|
|
11
9
|
export declare const isLogoCustom: (props: TitanLayoutLogoProps | undefined, isMobile: boolean) => boolean;
|
|
12
10
|
export declare const isLogoText: (props: TitanLayoutLogoProps | undefined, isMobile: boolean) => boolean;
|
|
@@ -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;
|
|
1
|
+
{"version":3,"file":"layout-logo.d.ts","sourceRoot":"","sources":["../../../src/components/titan-layout/layout-logo.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,wBAAwB,EAAE,EAAE,EAAY,SAAS,EAAE,MAAM,OAAO,CAAC;AAO1E,MAAM,MAAM,oBAAoB,GAAG,IAAI,CACnC,wBAAwB,CAAC,KAAK,CAAC,EAC/B,UAAU,GAAG,OAAO,GAAG,OAAO,CACjC,GAAG;IACA,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,EAAE,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAIF,eAAO,MAAM,aAAa,GAAI,OAAO,oBAAoB,GAAG,SAAS,EAAE,UAAU,OAAO,YAClD,CAAC;AACvC,eAAO,MAAM,YAAY,GAAI,OAAO,oBAAoB,GAAG,SAAS,EAAE,UAAU,OAAO,YAC7B,CAAC;AAC3D,eAAO,MAAM,UAAU,GAAI,OAAO,oBAAoB,GAAG,SAAS,EAAE,UAAU,OAAO,YACpC,CAAC;AAElD,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,oBAAoB,CAkC/C,CAAC"}
|
|
@@ -12,40 +12,43 @@ export const isLogoCustom = (props, isMobile)=>!isLogoCompany(props, isMobile) &
|
|
|
12
12
|
export const isLogoText = (props, isMobile)=>typeof (props === null || props === void 0 ? void 0 : props.title) === 'string' && !isMobile;
|
|
13
13
|
export const LayoutLogo = (props)=>{
|
|
14
14
|
const { NavigationComponent, breakpoint: { isMobile } } = useTitanLayoutContext();
|
|
15
|
-
const
|
|
15
|
+
const { title, postfix, mantleFill, to, ...rest } = props;
|
|
16
|
+
const Wrapper = to ? NavigationComponent : EmptyWrapper;
|
|
16
17
|
const showCompanyTitle = isLogoCompany(props, isMobile);
|
|
17
18
|
return /*#__PURE__*/ _jsxs("div", {
|
|
18
19
|
className: classNames(Styles.logo),
|
|
19
20
|
"data-cy": "navigation-left",
|
|
20
21
|
children: [
|
|
21
22
|
showCompanyTitle ? /*#__PURE__*/ _jsx("div", {
|
|
23
|
+
...rest,
|
|
22
24
|
className: Styles.logoCompanyWrapper,
|
|
23
25
|
children: /*#__PURE__*/ _jsx(Wrapper, {
|
|
24
|
-
to:
|
|
26
|
+
to: to,
|
|
25
27
|
className: Styles.logoLink,
|
|
26
28
|
children: /*#__PURE__*/ _jsx(LogoCompanyTitle, {})
|
|
27
29
|
})
|
|
28
30
|
}) : /*#__PURE__*/ _jsxs(Fragment, {
|
|
29
31
|
children: [
|
|
30
32
|
/*#__PURE__*/ _jsx("div", {
|
|
33
|
+
...rest,
|
|
31
34
|
className: Styles.logoShortWrapper,
|
|
32
35
|
children: /*#__PURE__*/ _jsx(Wrapper, {
|
|
33
|
-
to:
|
|
36
|
+
to: to,
|
|
34
37
|
className: Styles.logoLink,
|
|
35
38
|
children: /*#__PURE__*/ _jsx(LogoTitanSvg, {
|
|
36
|
-
mantleFill:
|
|
39
|
+
mantleFill: mantleFill
|
|
37
40
|
})
|
|
38
41
|
})
|
|
39
42
|
}),
|
|
40
43
|
isLogoText(props, isMobile) && /*#__PURE__*/ _jsx(LogoTitanTitle, {
|
|
41
44
|
className: Styles.logoTitle,
|
|
42
|
-
children:
|
|
45
|
+
children: title
|
|
43
46
|
})
|
|
44
47
|
]
|
|
45
48
|
}),
|
|
46
|
-
!isMobile &&
|
|
49
|
+
!isMobile && postfix && /*#__PURE__*/ _jsx("div", {
|
|
47
50
|
className: Styles.logoPostfix,
|
|
48
|
-
children:
|
|
51
|
+
children: postfix
|
|
49
52
|
})
|
|
50
53
|
]
|
|
51
54
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/titan-layout/layout-logo.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { FC, Fragment, ReactNode } from 'react';\nimport { LogoCompanyTitle } from '../logo/logo-company-title';\nimport { LogoTitanSvg } from '../logo/logo-titan';\nimport { LogoTitanTitle
|
|
1
|
+
{"version":3,"sources":["../../../src/components/titan-layout/layout-logo.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { ComponentPropsWithoutRef, FC, Fragment, ReactNode } from 'react';\nimport { LogoCompanyTitle } from '../logo/logo-company-title';\nimport { LogoTitanSvg } from '../logo/logo-titan';\nimport { LogoTitanTitle } from '../logo/logo-titan-text';\nimport { useTitanLayoutContext } from './layout-context';\nimport * as Styles from './layout-header.module.less';\n\nexport type TitanLayoutLogoProps = Omit<\n ComponentPropsWithoutRef<'div'>,\n 'children' | 'style' | 'title'\n> & {\n title?: string | boolean;\n postfix?: ReactNode;\n mantleFill?: string;\n to?: string;\n};\n\nconst EmptyWrapper: FC<any> = ({ children }) => children;\n\nexport const isLogoCompany = (props: TitanLayoutLogoProps | undefined, isMobile: boolean) =>\n props?.title === true && !isMobile;\nexport const isLogoCustom = (props: TitanLayoutLogoProps | undefined, isMobile: boolean) =>\n !isLogoCompany(props, isMobile) && !!props?.mantleFill;\nexport const isLogoText = (props: TitanLayoutLogoProps | undefined, isMobile: boolean) =>\n typeof props?.title === 'string' && !isMobile;\n\nexport const LayoutLogo: FC<TitanLayoutLogoProps> = props => {\n const {\n NavigationComponent,\n breakpoint: { isMobile },\n } = useTitanLayoutContext();\n const { title, postfix, mantleFill, to, ...rest } = props;\n const Wrapper: FC<any> = to ? NavigationComponent : EmptyWrapper;\n const showCompanyTitle = isLogoCompany(props, isMobile);\n\n return (\n <div className={classNames(Styles.logo)} data-cy=\"navigation-left\">\n {showCompanyTitle ? (\n <div {...rest} className={Styles.logoCompanyWrapper}>\n <Wrapper to={to} className={Styles.logoLink}>\n <LogoCompanyTitle />\n </Wrapper>\n </div>\n ) : (\n <Fragment>\n <div {...rest} className={Styles.logoShortWrapper}>\n <Wrapper to={to} className={Styles.logoLink}>\n <LogoTitanSvg mantleFill={mantleFill} />\n </Wrapper>\n </div>\n\n {isLogoText(props, isMobile) && (\n <LogoTitanTitle className={Styles.logoTitle}>{title}</LogoTitanTitle>\n )}\n </Fragment>\n )}\n\n {!isMobile && postfix && <div className={Styles.logoPostfix}>{postfix}</div>}\n </div>\n );\n};\n"],"names":["classNames","Fragment","LogoCompanyTitle","LogoTitanSvg","LogoTitanTitle","useTitanLayoutContext","Styles","EmptyWrapper","children","isLogoCompany","props","isMobile","title","isLogoCustom","mantleFill","isLogoText","LayoutLogo","NavigationComponent","breakpoint","postfix","to","rest","Wrapper","showCompanyTitle","div","className","logo","data-cy","logoCompanyWrapper","logoLink","logoShortWrapper","logoTitle","logoPostfix"],"mappings":";AAAA,OAAOA,gBAAgB,aAAa;AACpC,SAAuCC,QAAQ,QAAmB,QAAQ;AAC1E,SAASC,gBAAgB,QAAQ,6BAA6B;AAC9D,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,cAAc,QAAQ,0BAA0B;AACzD,SAASC,qBAAqB,QAAQ,mBAAmB;AACzD,YAAYC,YAAY,8BAA8B;AAYtD,MAAMC,eAAwB,CAAC,EAAEC,QAAQ,EAAE,GAAKA;AAEhD,OAAO,MAAMC,gBAAgB,CAACC,OAAyCC,WACnED,CAAAA,kBAAAA,4BAAAA,MAAOE,KAAK,MAAK,QAAQ,CAACD,SAAS;AACvC,OAAO,MAAME,eAAe,CAACH,OAAyCC,WAClE,CAACF,cAAcC,OAAOC,aAAa,CAAC,EAACD,kBAAAA,4BAAAA,MAAOI,UAAU,EAAC;AAC3D,OAAO,MAAMC,aAAa,CAACL,OAAyCC,WAChE,QAAOD,kBAAAA,4BAAAA,MAAOE,KAAK,MAAK,YAAY,CAACD,SAAS;AAElD,OAAO,MAAMK,aAAuCN,CAAAA;IAChD,MAAM,EACFO,mBAAmB,EACnBC,YAAY,EAAEP,QAAQ,EAAE,EAC3B,GAAGN;IACJ,MAAM,EAAEO,KAAK,EAAEO,OAAO,EAAEL,UAAU,EAAEM,EAAE,EAAE,GAAGC,MAAM,GAAGX;IACpD,MAAMY,UAAmBF,KAAKH,sBAAsBV;IACpD,MAAMgB,mBAAmBd,cAAcC,OAAOC;IAE9C,qBACI,MAACa;QAAIC,WAAWzB,WAAWM,OAAOoB,IAAI;QAAGC,WAAQ;;YAC5CJ,iCACG,KAACC;gBAAK,GAAGH,IAAI;gBAAEI,WAAWnB,OAAOsB,kBAAkB;0BAC/C,cAAA,KAACN;oBAAQF,IAAIA;oBAAIK,WAAWnB,OAAOuB,QAAQ;8BACvC,cAAA,KAAC3B;;+BAIT,MAACD;;kCACG,KAACuB;wBAAK,GAAGH,IAAI;wBAAEI,WAAWnB,OAAOwB,gBAAgB;kCAC7C,cAAA,KAACR;4BAAQF,IAAIA;4BAAIK,WAAWnB,OAAOuB,QAAQ;sCACvC,cAAA,KAAC1B;gCAAaW,YAAYA;;;;oBAIjCC,WAAWL,OAAOC,2BACf,KAACP;wBAAeqB,WAAWnB,OAAOyB,SAAS;kCAAGnB;;;;YAKzD,CAACD,YAAYQ,yBAAW,KAACK;gBAAIC,WAAWnB,OAAO0B,WAAW;0BAAGb;;;;AAG1E,EAAE"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@servicetitan/navigation",
|
|
3
|
-
"version": "11.1.
|
|
3
|
+
"version": "11.1.2",
|
|
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": "c0642952ccc58829c0d57db99b5098485c216fe9"
|
|
46
46
|
}
|
|
@@ -1,18 +1,20 @@
|
|
|
1
1
|
import classNames from 'classnames';
|
|
2
|
-
import { FC, Fragment, ReactNode } from 'react';
|
|
2
|
+
import { ComponentPropsWithoutRef, FC, Fragment, ReactNode } from 'react';
|
|
3
3
|
import { LogoCompanyTitle } from '../logo/logo-company-title';
|
|
4
4
|
import { LogoTitanSvg } from '../logo/logo-titan';
|
|
5
|
-
import { LogoTitanTitle
|
|
5
|
+
import { LogoTitanTitle } from '../logo/logo-titan-text';
|
|
6
6
|
import { useTitanLayoutContext } from './layout-context';
|
|
7
7
|
import * as Styles from './layout-header.module.less';
|
|
8
8
|
|
|
9
|
-
export
|
|
9
|
+
export type TitanLayoutLogoProps = Omit<
|
|
10
|
+
ComponentPropsWithoutRef<'div'>,
|
|
11
|
+
'children' | 'style' | 'title'
|
|
12
|
+
> & {
|
|
10
13
|
title?: string | boolean;
|
|
11
14
|
postfix?: ReactNode;
|
|
12
|
-
logoWrapper?: WrapperProps;
|
|
13
15
|
mantleFill?: string;
|
|
14
16
|
to?: string;
|
|
15
|
-
}
|
|
17
|
+
};
|
|
16
18
|
|
|
17
19
|
const EmptyWrapper: FC<any> = ({ children }) => children;
|
|
18
20
|
|
|
@@ -28,34 +30,33 @@ export const LayoutLogo: FC<TitanLayoutLogoProps> = props => {
|
|
|
28
30
|
NavigationComponent,
|
|
29
31
|
breakpoint: { isMobile },
|
|
30
32
|
} = useTitanLayoutContext();
|
|
31
|
-
const
|
|
33
|
+
const { title, postfix, mantleFill, to, ...rest } = props;
|
|
34
|
+
const Wrapper: FC<any> = to ? NavigationComponent : EmptyWrapper;
|
|
32
35
|
const showCompanyTitle = isLogoCompany(props, isMobile);
|
|
33
36
|
|
|
34
37
|
return (
|
|
35
38
|
<div className={classNames(Styles.logo)} data-cy="navigation-left">
|
|
36
39
|
{showCompanyTitle ? (
|
|
37
|
-
<div className={Styles.logoCompanyWrapper}>
|
|
38
|
-
<Wrapper to={
|
|
40
|
+
<div {...rest} className={Styles.logoCompanyWrapper}>
|
|
41
|
+
<Wrapper to={to} className={Styles.logoLink}>
|
|
39
42
|
<LogoCompanyTitle />
|
|
40
43
|
</Wrapper>
|
|
41
44
|
</div>
|
|
42
45
|
) : (
|
|
43
46
|
<Fragment>
|
|
44
|
-
<div className={Styles.logoShortWrapper}>
|
|
45
|
-
<Wrapper to={
|
|
46
|
-
<LogoTitanSvg mantleFill={
|
|
47
|
+
<div {...rest} className={Styles.logoShortWrapper}>
|
|
48
|
+
<Wrapper to={to} className={Styles.logoLink}>
|
|
49
|
+
<LogoTitanSvg mantleFill={mantleFill} />
|
|
47
50
|
</Wrapper>
|
|
48
51
|
</div>
|
|
49
52
|
|
|
50
53
|
{isLogoText(props, isMobile) && (
|
|
51
|
-
<LogoTitanTitle className={Styles.logoTitle}>{
|
|
54
|
+
<LogoTitanTitle className={Styles.logoTitle}>{title}</LogoTitanTitle>
|
|
52
55
|
)}
|
|
53
56
|
</Fragment>
|
|
54
57
|
)}
|
|
55
58
|
|
|
56
|
-
{!isMobile &&
|
|
57
|
-
<div className={Styles.logoPostfix}>{props.postfix}</div>
|
|
58
|
-
)}
|
|
59
|
+
{!isMobile && postfix && <div className={Styles.logoPostfix}>{postfix}</div>}
|
|
59
60
|
</div>
|
|
60
61
|
);
|
|
61
62
|
};
|