@servicetitan/navigation 11.1.0 → 11.1.1

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.
Files changed (8) hide show
  1. package/dist/components/titan-layout/layout-header.module.less +17 -1
  2. package/dist/components/titan-layout/layout-header.module.less.d.ts +1 -0
  3. package/dist/components/titan-layout/layout-logo.js +2 -0
  4. package/dist/components/titan-layout/layout-logo.js.map +1 -1
  5. package/package.json +2 -2
  6. package/src/components/titan-layout/layout-header.module.less +17 -1
  7. package/src/components/titan-layout/layout-header.module.less.d.ts +1 -0
  8. package/src/components/titan-layout/layout-logo.tsx +2 -2
package/dist/components/titan-layout/layout-header.module.less CHANGED
@@ -182,7 +182,8 @@
182
182
  padding-left: 10px;
183
183
  padding-right: 10px;
184
184
 
185
- svg {
185
+ svg,
186
+ .logo-link {
186
187
  height: 28px;
187
188
  }
188
189
  }
@@ -190,12 +191,27 @@
190
191
  max-height: 100%;
191
192
  width: auto;
192
193
  }
194
+ .logo-link {
195
+ color: inherit;
196
+ text-decoration: none;
197
+ outline: none;
198
+
199
+ &:active,
200
+ &:hover {
201
+ color: inherit;
202
+ text-decoration: none;
203
+ }
204
+ }
193
205
  }
194
206
 
195
207
  .header-desktop {
196
208
  .logo-company-wrapper {
197
209
  height: 41px;
198
210
  padding-left: 6px;
211
+
212
+ .logo-link {
213
+ height: 41px;
214
+ }
199
215
  }
200
216
  .logo-postfix {
201
217
  margin-left: @spacing-1;
package/dist/components/titan-layout/layout-header.module.less.d.ts CHANGED
@@ -19,6 +19,7 @@ export const headerStacked: string;
19
19
  export const headerStackedNav: string;
20
20
  export const logo: string;
21
21
  export const logoCompanyWrapper: string;
22
+ export const logoLink: string;
22
23
  export const logoPostfix: string;
23
24
  export const logoShortWrapper: string;
24
25
  export const logoTitle: string;
package/dist/components/titan-layout/layout-logo.js CHANGED
@@ -22,6 +22,7 @@ export const LayoutLogo = (props)=>{
22
22
  className: Styles.logoCompanyWrapper,
23
23
  children: /*#__PURE__*/ _jsx(Wrapper, {
24
24
  to: props.to,
25
+ className: Styles.logoLink,
25
26
  children: /*#__PURE__*/ _jsx(LogoCompanyTitle, {})
26
27
  })
27
28
  }) : /*#__PURE__*/ _jsxs(Fragment, {
@@ -30,6 +31,7 @@ export const LayoutLogo = (props)=>{
30
31
  className: Styles.logoShortWrapper,
31
32
  children: /*#__PURE__*/ _jsx(Wrapper, {
32
33
  to: props.to,
34
+ className: Styles.logoLink,
33
35
  children: /*#__PURE__*/ _jsx(LogoTitanSvg, {
34
36
  mantleFill: props.mantleFill
35
37
  })
package/dist/components/titan-layout/layout-logo.js.map CHANGED
@@ -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, WrapperProps } from '../logo/logo-titan-text';\nimport { useTitanLayoutContext } from './layout-context';\nimport * as Styles from './layout-header.module.less';\n\nexport interface TitanLayoutLogoProps {\n title?: string | boolean;\n postfix?: ReactNode;\n logoWrapper?: WrapperProps;\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 Wrapper: FC<any> = props.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 className={Styles.logoCompanyWrapper}>\n <Wrapper to={props.to}>\n <LogoCompanyTitle />\n </Wrapper>\n </div>\n ) : (\n <Fragment>\n <div className={Styles.logoShortWrapper}>\n <Wrapper to={props.to}>\n <LogoTitanSvg mantleFill={props.mantleFill} />\n </Wrapper>\n </div>\n\n {isLogoText(props, isMobile) && (\n <LogoTitanTitle className={Styles.logoTitle}>{props.title}</LogoTitanTitle>\n )}\n </Fragment>\n )}\n\n {!isMobile && props.postfix && (\n <div className={Styles.logoPostfix}>{props.postfix}</div>\n )}\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","Wrapper","to","showCompanyTitle","div","className","logo","data-cy","logoCompanyWrapper","logoShortWrapper","logoTitle","postfix","logoPostfix"],"mappings":";AAAA,OAAOA,gBAAgB,aAAa;AACpC,SAAaC,QAAQ,QAAmB,QAAQ;AAChD,SAASC,gBAAgB,QAAQ,6BAA6B;AAC9D,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,cAAc,QAAsB,0BAA0B;AACvE,SAASC,qBAAqB,QAAQ,mBAAmB;AACzD,YAAYC,YAAY,8BAA8B;AAUtD,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,MAAMc,UAAmBT,MAAMU,EAAE,GAAGH,sBAAsBV;IAC1D,MAAMc,mBAAmBZ,cAAcC,OAAOC;IAE9C,qBACI,MAACW;QAAIC,WAAWvB,WAAWM,OAAOkB,IAAI;QAAGC,WAAQ;;YAC5CJ,iCACG,KAACC;gBAAIC,WAAWjB,OAAOoB,kBAAkB;0BACrC,cAAA,KAACP;oBAAQC,IAAIV,MAAMU,EAAE;8BACjB,cAAA,KAAClB;;+BAIT,MAACD;;kCACG,KAACqB;wBAAIC,WAAWjB,OAAOqB,gBAAgB;kCACnC,cAAA,KAACR;4BAAQC,IAAIV,MAAMU,EAAE;sCACjB,cAAA,KAACjB;gCAAaW,YAAYJ,MAAMI,UAAU;;;;oBAIjDC,WAAWL,OAAOC,2BACf,KAACP;wBAAemB,WAAWjB,OAAOsB,SAAS;kCAAGlB,MAAME,KAAK;;;;YAKpE,CAACD,YAAYD,MAAMmB,OAAO,kBACvB,KAACP;gBAAIC,WAAWjB,OAAOwB,WAAW;0BAAGpB,MAAMmB,OAAO;;;;AAIlE,EAAE"}
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, WrapperProps } from '../logo/logo-titan-text';\nimport { useTitanLayoutContext } from './layout-context';\nimport * as Styles from './layout-header.module.less';\n\nexport interface TitanLayoutLogoProps {\n title?: string | boolean;\n postfix?: ReactNode;\n logoWrapper?: WrapperProps;\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 Wrapper: FC<any> = props.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 className={Styles.logoCompanyWrapper}>\n <Wrapper to={props.to} className={Styles.logoLink}>\n <LogoCompanyTitle />\n </Wrapper>\n </div>\n ) : (\n <Fragment>\n <div className={Styles.logoShortWrapper}>\n <Wrapper to={props.to} className={Styles.logoLink}>\n <LogoTitanSvg mantleFill={props.mantleFill} />\n </Wrapper>\n </div>\n\n {isLogoText(props, isMobile) && (\n <LogoTitanTitle className={Styles.logoTitle}>{props.title}</LogoTitanTitle>\n )}\n </Fragment>\n )}\n\n {!isMobile && props.postfix && (\n <div className={Styles.logoPostfix}>{props.postfix}</div>\n )}\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","Wrapper","to","showCompanyTitle","div","className","logo","data-cy","logoCompanyWrapper","logoLink","logoShortWrapper","logoTitle","postfix","logoPostfix"],"mappings":";AAAA,OAAOA,gBAAgB,aAAa;AACpC,SAAaC,QAAQ,QAAmB,QAAQ;AAChD,SAASC,gBAAgB,QAAQ,6BAA6B;AAC9D,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,cAAc,QAAsB,0BAA0B;AACvE,SAASC,qBAAqB,QAAQ,mBAAmB;AACzD,YAAYC,YAAY,8BAA8B;AAUtD,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,MAAMc,UAAmBT,MAAMU,EAAE,GAAGH,sBAAsBV;IAC1D,MAAMc,mBAAmBZ,cAAcC,OAAOC;IAE9C,qBACI,MAACW;QAAIC,WAAWvB,WAAWM,OAAOkB,IAAI;QAAGC,WAAQ;;YAC5CJ,iCACG,KAACC;gBAAIC,WAAWjB,OAAOoB,kBAAkB;0BACrC,cAAA,KAACP;oBAAQC,IAAIV,MAAMU,EAAE;oBAAEG,WAAWjB,OAAOqB,QAAQ;8BAC7C,cAAA,KAACzB;;+BAIT,MAACD;;kCACG,KAACqB;wBAAIC,WAAWjB,OAAOsB,gBAAgB;kCACnC,cAAA,KAACT;4BAAQC,IAAIV,MAAMU,EAAE;4BAAEG,WAAWjB,OAAOqB,QAAQ;sCAC7C,cAAA,KAACxB;gCAAaW,YAAYJ,MAAMI,UAAU;;;;oBAIjDC,WAAWL,OAAOC,2BACf,KAACP;wBAAemB,WAAWjB,OAAOuB,SAAS;kCAAGnB,MAAME,KAAK;;;;YAKpE,CAACD,YAAYD,MAAMoB,OAAO,kBACvB,KAACR;gBAAIC,WAAWjB,OAAOyB,WAAW;0BAAGrB,MAAMoB,OAAO;;;;AAIlE,EAAE"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@servicetitan/navigation",
3
- "version": "11.1.0",
3
+ "version": "11.1.1",
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": "e3dfbcd9f507c9f4373502a0e0d835f8e9fe2f2a"
45
+ "gitHead": "fc3ac25baf0fac6c2295807f9fb31afe4aa5da70"
46
46
  }
package/src/components/titan-layout/layout-header.module.less CHANGED
@@ -182,7 +182,8 @@
182
182
  padding-left: 10px;
183
183
  padding-right: 10px;
184
184
 
185
- svg {
185
+ svg,
186
+ .logo-link {
186
187
  height: 28px;
187
188
  }
188
189
  }
@@ -190,12 +191,27 @@
190
191
  max-height: 100%;
191
192
  width: auto;
192
193
  }
194
+ .logo-link {
195
+ color: inherit;
196
+ text-decoration: none;
197
+ outline: none;
198
+
199
+ &:active,
200
+ &:hover {
201
+ color: inherit;
202
+ text-decoration: none;
203
+ }
204
+ }
193
205
  }
194
206
 
195
207
  .header-desktop {
196
208
  .logo-company-wrapper {
197
209
  height: 41px;
198
210
  padding-left: 6px;
211
+
212
+ .logo-link {
213
+ height: 41px;
214
+ }
199
215
  }
200
216
  .logo-postfix {
201
217
  margin-left: @spacing-1;
package/src/components/titan-layout/layout-header.module.less.d.ts CHANGED
@@ -19,6 +19,7 @@ export const headerStacked: string;
19
19
  export const headerStackedNav: string;
20
20
  export const logo: string;
21
21
  export const logoCompanyWrapper: string;
22
+ export const logoLink: string;
22
23
  export const logoPostfix: string;
23
24
  export const logoShortWrapper: string;
24
25
  export const logoTitle: string;
package/src/components/titan-layout/layout-logo.tsx CHANGED
@@ -35,14 +35,14 @@ export const LayoutLogo: FC<TitanLayoutLogoProps> = props => {
35
35
  <div className={classNames(Styles.logo)} data-cy="navigation-left">
36
36
  {showCompanyTitle ? (
37
37
  <div className={Styles.logoCompanyWrapper}>
38
- <Wrapper to={props.to}>
38
+ <Wrapper to={props.to} className={Styles.logoLink}>
39
39
  <LogoCompanyTitle />
40
40
  </Wrapper>
41
41
  </div>
42
42
  ) : (
43
43
  <Fragment>
44
44
  <div className={Styles.logoShortWrapper}>
45
- <Wrapper to={props.to}>
45
+ <Wrapper to={props.to} className={Styles.logoLink}>
46
46
  <LogoTitanSvg mantleFill={props.mantleFill} />
47
47
  </Wrapper>
48
48
  </div>