@servicetitan/navigation 11.0.0-canary.237.6c48c6d.0 → 11.0.0-canary.237.7d5e2c9.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.
Files changed (17) hide show
  1. package/dist/components/titan-layout/layout-header.d.ts.map +1 -1
  2. package/dist/components/titan-layout/layout-header.js +1 -1
  3. package/dist/components/titan-layout/layout-header.js.map +1 -1
  4. package/dist/components/titan-layout/layout-header.module.less +46 -54
  5. package/dist/components/titan-layout/titan-layout.d.ts.map +1 -1
  6. package/dist/components/titan-layout/titan-layout.js +35 -15
  7. package/dist/components/titan-layout/titan-layout.js.map +1 -1
  8. package/dist/components/titan-layout/titan-layout.module.less +2 -2
  9. package/dist/utils/use-breakpoint.js +1 -1
  10. package/dist/utils/use-breakpoint.js.map +1 -1
  11. package/package.json +2 -2
  12. package/src/components/titan-layout/layout-header.module.less +46 -54
  13. package/src/components/titan-layout/layout-header.module.less.d.ts +2 -0
  14. package/src/components/titan-layout/layout-header.tsx +5 -1
  15. package/src/components/titan-layout/titan-layout.module.less +2 -2
  16. package/src/components/titan-layout/titan-layout.tsx +99 -46
  17. package/src/utils/use-breakpoint.ts +1 -1
package/dist/components/titan-layout/layout-header.d.ts.map CHANGED
@@ -1 +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,QAAQ,EAAE,OAAO,CAAC;IAClB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;CAC3C,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CA4D9C,CAAC"}
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,QAAQ,EAAE,OAAO,CAAC;IAClB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;CAC3C,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAgE9C,CAAC"}
package/dist/components/titan-layout/layout-header.js CHANGED
@@ -5,6 +5,6 @@ import { LayoutPlacementContext } from './layout-context';
5
5
  import { LayoutHeaderNavigationTrigger } from './layout-header-links';
6
6
  import * as Styles from './layout-header.module.less';
7
7
  export const LayoutHeader = ({ className, right, rightText, rightClassName, center, centerClassName, isMobile, hasNotifications, logo, profile, onBurgerClick, ...rest }) => {
8
- 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: [isMobile && (_jsx(LayoutHeaderNavigationTrigger, { id: "burger", title: "", icon: SvgBurgerMenu, iconActive: SvgBurgerMenu, className: "m-r-1", onClick: onBurgerClick, tag: { value: hasNotifications } })), logo] }), _jsx("div", { className: classNames(Styles.heTopCenter, 'd-f align-items-center justify-content-center', 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] })] }) }));
8
+ return (_jsx(LayoutPlacementContext.Provider, { value: "top", children: _jsxs("div", { className: classNames(Styles.header, isMobile ? Styles.headerMobile : Styles.headerDesktop, className), ...rest, "data-cy": "header-navigation", children: [_jsxs("div", { className: classNames(Styles.heTopLeft), "data-cy": "navigation-left", children: [isMobile && (_jsx(LayoutHeaderNavigationTrigger, { id: "burger", title: "", icon: SvgBurgerMenu, iconActive: SvgBurgerMenu, className: "m-r-1", onClick: onBurgerClick, tag: { value: hasNotifications } })), logo] }), _jsx("div", { className: classNames(Styles.heTopCenter, 'd-f align-items-center justify-content-center', 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] })] }) }));
9
9
  };
10
10
  //# sourceMappingURL=layout-header.js.map
package/dist/components/titan-layout/layout-header.js.map CHANGED
@@ -1 +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,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,6BAA6B,EAAE,MAAM,uBAAuB,CAAC;AACtE,OAAO,KAAK,MAAM,MAAM,6BAA6B,CAAC;AA2BtD,MAAM,CAAC,MAAM,YAAY,GAA0B,CAAC,EAChD,SAAS,EACT,KAAK,EACL,SAAS,EACT,cAAc,EACd,MAAM,EACN,eAAe,EACf,QAAQ,EACR,gBAAgB,EAChB,IAAI,EACJ,OAAO,EACP,aAAa,EACb,GAAG,IAAI,EACV,EAAE,EAAE;IACD,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,QAAQ,IAAI,CACT,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,EACtB,GAAG,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE,GAClC,CACL,EACA,IAAI,IACH,EACN,cACI,SAAS,EAAE,UAAU,CACjB,MAAM,CAAC,WAAW,EAClB,+CAA+C,EAC/C,eAAe,CAClB,aACO,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"}
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,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,6BAA6B,EAAE,MAAM,uBAAuB,CAAC;AACtE,OAAO,KAAK,MAAM,MAAM,6BAA6B,CAAC;AA2BtD,MAAM,CAAC,MAAM,YAAY,GAA0B,CAAC,EAChD,SAAS,EACT,KAAK,EACL,SAAS,EACT,cAAc,EACd,MAAM,EACN,eAAe,EACf,QAAQ,EACR,gBAAgB,EAChB,IAAI,EACJ,OAAO,EACP,aAAa,EACb,GAAG,IAAI,EACV,EAAE,EAAE;IACD,OAAO,CACH,KAAC,sBAAsB,CAAC,QAAQ,IAAC,KAAK,EAAC,KAAK,YACxC,eACI,SAAS,EAAE,UAAU,CACjB,MAAM,CAAC,MAAM,EACb,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,aAAa,EACrD,SAAS,CACZ,KACG,IAAI,aACA,mBAAmB,aAE3B,eAAK,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,SAAS,CAAC,aAAU,iBAAiB,aAClE,QAAQ,IAAI,CACT,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,EACtB,GAAG,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE,GAClC,CACL,EACA,IAAI,IACH,EACN,cACI,SAAS,EAAE,UAAU,CACjB,MAAM,CAAC,WAAW,EAClB,+CAA+C,EAC/C,eAAe,CAClB,aACO,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"}
package/dist/components/titan-layout/layout-header.module.less CHANGED
@@ -90,29 +90,59 @@
90
90
  }
91
91
  }
92
92
 
93
+ .header-mobile {
94
+ padding: @spacing-2 @spacing-0;
95
+ height: var(--nav-offset-top);
96
+
97
+ --nav-top-content-height: 40px;
98
+
99
+ .navigation-link {
100
+ padding: 10px;
101
+ }
102
+
103
+ .he-top-center {
104
+ max-width: unset;
105
+ flex: 1;
106
+ margin-left: @spacing-3;
107
+ margin-right: @spacing-3;
108
+ }
109
+
110
+ .he-top-left {
111
+ margin-left: @spacing-half;
112
+ }
113
+
114
+ .he-top-right {
115
+ margin-right: @spacing-half;
116
+ }
117
+ }
118
+
93
119
  // desktop
94
- @media only screen and (min-width: 768px) {
95
- .header {
96
- height: var(--nav-offset-top);
97
- .navigation-link {
98
- margin: 6px 2px;
99
- padding: 6px 6px;
100
- }
120
+ .header-desktop {
121
+ height: var(--nav-offset-top);
122
+ .navigation-link {
123
+ margin: 6px 2px;
124
+ padding: 6px 6px;
101
125
 
102
- .he-top-left {
103
- padding-left: @spacing-1;
104
- }
105
- .he-top-center {
106
- flex: 1;
107
- margin-left: @spacing-2;
108
- margin-right: @spacing-2;
109
- max-width: 400px;
126
+ .navigation-item-counter {
127
+ min-width: 12px !important;
128
+ height: 12px !important;
110
129
  }
111
130
  }
131
+
132
+ .he-top-left {
133
+ padding-left: @spacing-1;
134
+ }
135
+ .he-top-center {
136
+ flex: 1;
137
+ margin-left: @spacing-2;
138
+ margin-right: @spacing-2;
139
+ max-width: 400px;
140
+ }
112
141
  }
142
+
113
143
  // desktop wide
114
144
  @media only screen and (min-width: 1200px) {
115
- .header {
145
+ .header-desktop {
116
146
  display: grid;
117
147
  grid-template-columns: repeat(3, 1fr);
118
148
  grid-template-rows: 48px;
@@ -129,35 +159,6 @@
129
159
  }
130
160
  }
131
161
 
132
- // mobile
133
- @media only screen and (max-width: 768px) {
134
- .header {
135
- padding: @spacing-2 @spacing-0;
136
- height: var(--nav-offset-top);
137
-
138
- --nav-top-content-height: 40px;
139
-
140
- .navigation-link {
141
- padding: 10px;
142
- }
143
-
144
- .he-top-center {
145
- max-width: unset;
146
- flex: 1;
147
- margin-left: @spacing-3;
148
- margin-right: @spacing-3;
149
- }
150
-
151
- .he-top-left {
152
- margin-left: @spacing-half;
153
- }
154
-
155
- .he-top-right {
156
- margin-right: @spacing-half;
157
- }
158
- }
159
- }
160
-
161
162
  .navigation-link {
162
163
  // styles specific to extra nav links
163
164
  color: @color-black;
@@ -190,12 +191,3 @@
190
191
  right: -8px;
191
192
  }
192
193
  }
193
-
194
- @media only screen and (min-width: 768px) {
195
- .navigation-link {
196
- .navigation-item-counter {
197
- min-width: 12px !important;
198
- height: 12px !important;
199
- }
200
- }
201
- }
package/dist/components/titan-layout/titan-layout.d.ts.map CHANGED
@@ -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,wBAAwB;IACxB,UAAU,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAE5C,uBAAuB;IACvB,QAAQ,CAAC,EAAE,gBAAgB,GAAG,gBAAgB,EAAE,CAAC;IAEjD,kDAAkD;IAClD,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB,oCAAoC;IACpC,mBAAmB,CAAC,EAAE,EAAE,CAAC,qBAAqB,CAAC,CAAC;IAEhD,qCAAqC;IACrC,mBAAmB,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAE3C,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;AAuRF,MAAM,WAAW,uBAAuB;IACpC,QAAQ,EAAE,SAAS,CAAC;CACvB;AA0DD,eAAO,MAAM,WAAW;;;;;CAKtB,CAAC"}
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,wBAAwB;IACxB,UAAU,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAE5C,uBAAuB;IACvB,QAAQ,CAAC,EAAE,gBAAgB,GAAG,gBAAgB,EAAE,CAAC;IAEjD,kDAAkD;IAClD,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB,oCAAoC;IACpC,mBAAmB,CAAC,EAAE,EAAE,CAAC,qBAAqB,CAAC,CAAC;IAEhD,qCAAqC;IACrC,mBAAmB,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAE3C,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;AA0TF,MAAM,WAAW,uBAAuB;IACpC,QAAQ,EAAE,SAAS,CAAC;CACvB;AA4ED,eAAO,MAAM,WAAW;;;;;CAKtB,CAAC"}
package/dist/components/titan-layout/titan-layout.js CHANGED
@@ -58,6 +58,10 @@ const TitanLayoutComponent = ({ appearance = 'anvil2', id, children, contentOnly
58
58
  const [mobileDrawerOpened, setMobileDrawerOpened] = useState(false);
59
59
  const { content, logo } = useLayoutChildren(children);
60
60
  const { hasNotifications, NotificationsContextProvider } = useNotificationsState();
61
+ const [anvil2Styles, setAnvil2Styles] = useState({});
62
+ const updateIndicatorsHeight = useCallback((offset) => {
63
+ setAnvil2Styles({ '--offset': `calc(var(--nav-offset-top) + ${offset}px)` });
64
+ }, []);
61
65
  const isMobile = breakpoint.isMobile;
62
66
  const hasSideBar = !contentOnly && (!!(navigationMainItems === null || navigationMainItems === void 0 ? void 0 : navigationMainItems.length) || !!(sideTop === null || sideTop === void 0 ? void 0 : sideTop.length));
63
67
  const hasTopBar = !contentOnly;
@@ -109,10 +113,22 @@ const TitanLayoutComponent = ({ appearance = 'anvil2', id, children, contentOnly
109
113
  if (variant.isAnvil2 || !minContentWidth) {
110
114
  return undefined;
111
115
  }
112
- if (variant.isAnvil1 && breakpoint.width < minContentWidth) {
116
+ if (breakpoint.width < minContentWidth) {
113
117
  return minContentWidth;
114
118
  }
115
119
  }, [variant, minContentWidth, breakpoint.width]);
120
+ const contentStyles = useMemo(() => {
121
+ if (variant.isAnvil2) {
122
+ return anvil2Styles;
123
+ }
124
+ if (variant.isLegacy && limitContentWidth) {
125
+ return {
126
+ display: 'flex',
127
+ flexDirection: 'column',
128
+ minHeight: '100vh',
129
+ };
130
+ }
131
+ }, [variant, anvil2Styles, limitContentWidth]);
116
132
  const layoutClass = variant.isLegacy
117
133
  ? Styles.layoutLegacy
118
134
  : variant.isAnvil1
@@ -122,7 +138,7 @@ const TitanLayoutComponent = ({ appearance = 'anvil2', id, children, contentOnly
122
138
  [Styles.layoutTop]: hasTopBar,
123
139
  [Styles.layoutNavSlim]: !isMobile && hasSideBar && (state === null || state === void 0 ? void 0 : state.navCollapsed),
124
140
  [Styles.layoutNavWide]: !isMobile && hasSideBar && !(state === null || state === void 0 ? void 0 : state.navCollapsed),
125
- }, 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: limitContentWidth, children: content })] }) }) }));
141
+ }, layoutClass), style: contentStyles, 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 }) })), variant.isAnvil1 ? (_jsx(LayoutContentAnvil1, { header: header, minWidth: limitContentWidth, children: content })) : variant.isLegacy ? (_jsx(LayoutContentLegacy, { header: header, minWidth: limitContentWidth, children: content })) : (_jsx(LayoutContentAnvil2, { header: header, onHeaderHeightChange: updateIndicatorsHeight, children: content }))] }) }) }));
126
142
  };
127
143
  const TitanLayoutHeaderObserved = ({ children, heightChange }) => {
128
144
  const ref = useRef(null);
@@ -147,21 +163,25 @@ const TitanLayoutHeaderObserved = ({ children, heightChange }) => {
147
163
  }, [heightChange]);
148
164
  return (_jsx("div", { ref: ref, className: Styles.contentHeader, "data-cy": "layout-content-header", children: children }));
149
165
  };
166
+ const TitanLayoutHeader = ({ children }) => {
167
+ return (_jsx("div", { className: Styles.contentHeader, "data-cy": "layout-content-header", children: children }));
168
+ };
150
169
  const TitanLayoutContent = ({ children }) => children;
151
- const LayoutContent = ({ anvil1, anvil2, children, header, minWidth }) => {
152
- const [anvil2Styles, setAnvil2Styles] = useState({});
153
- const updateIndicatorsHeight = useCallback((offset) => {
154
- setAnvil2Styles({ '--offset': `calc(var(--nav-offset-top) + ${offset}px)` });
155
- }, []);
156
- const contentStyles = useMemo(() => ({
157
- ...(anvil1 && minWidth ? { overflowX: 'auto' } : {}),
158
- ...(anvil2 ? anvil2Styles : {}),
159
- }), [anvil1, anvil2, minWidth, anvil2Styles]);
170
+ const LayoutContentAnvil2 = ({ children, header, onHeaderHeightChange }) => {
171
+ return (_jsxs(Fragment, { children: [_jsx(TitanLayoutHeaderObserved, { heightChange: onHeaderHeightChange, children: header }), children] }));
172
+ };
173
+ const LayoutContentAnvil1 = ({ children, header, minWidth }) => {
174
+ const innerContentStyles = useMemo(() => ({
175
+ ...(minWidth ? { minWidth: `${minWidth}px` } : {}),
176
+ }), [minWidth]);
177
+ return (_jsxs(Fragment, { children: [_jsx(TitanLayoutHeader, { children: header }), _jsx("div", { className: classNames(Styles.content, { 'of-x-auto': !!minWidth }), "data-cy": "layout-content", children: _jsx("div", { className: "position-relative d-f flex-grow-1 flex-basis-0 of-hidden", style: innerContentStyles, children: children }) })] }));
178
+ };
179
+ const LayoutContentLegacy = ({ children, header, minWidth }) => {
160
180
  const innerContentStyles = useMemo(() => ({
161
- ...(anvil1 && minWidth ? { minWidth: `${minWidth}px` } : {}),
162
- }), [anvil1, minWidth]);
163
- return (_jsxs(Fragment, { children: [!!header &&
164
- (anvil2 ? (_jsx(TitanLayoutHeaderObserved, { heightChange: updateIndicatorsHeight, children: header })) : (_jsx("div", { className: Styles.contentHeader, "data-cy": "layout-content-header", children: header }))), _jsx("div", { className: Styles.content, style: contentStyles, "data-cy": "layout-content", children: anvil1 ? (_jsx("div", { className: "position-relative d-f flex-grow-1 flex-basis-0 of-hidden", style: innerContentStyles, children: children })) : (children) })] }));
181
+ position: 'relative',
182
+ minWidth: `${minWidth}px`,
183
+ }), [minWidth]);
184
+ return (_jsxs(Fragment, { children: [_jsx(TitanLayoutHeader, { children: header }), minWidth ? (_jsx("div", { className: "of-x-auto flex-basis-0 flex-grow-1", children: _jsx("div", { style: innerContentStyles, children: children }) })) : (children)] }));
165
185
  };
166
186
  export const TitanLayout = Object.assign(TitanLayoutComponent, {
167
187
  Content: TitanLayoutContent,
package/dist/components/titan-layout/titan-layout.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"titan-layout.js","sourceRoot":"","sources":["../../../src/components/titan-layout/titan-layout.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"titan-layout.js","sourceRoot":"","sources":["../../../src/components/titan-layout/titan-layout.tsx"],"names":[],"mappings":"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"}
package/dist/components/titan-layout/titan-layout.module.less CHANGED
@@ -59,8 +59,8 @@
59
59
  }
60
60
 
61
61
  .layout {
62
- --nav-offset-top: 0;
63
- --nav-offset-left: 0;
62
+ --nav-offset-top: 0px;
63
+ --nav-offset-left: 0px;
64
64
 
65
65
  &.layout-desktop.layout-top {
66
66
  --nav-offset-top: 48px;
package/dist/utils/use-breakpoint.js CHANGED
@@ -6,7 +6,7 @@ export const useTitanBreakpoint = () => {
6
6
  var _a, _b;
7
7
  return ({
8
8
  name: (_a = breakpoint === null || breakpoint === void 0 ? void 0 : breakpoint.name) !== null && _a !== void 0 ? _a : 'xl',
9
- isMobile: breakpoint ? breakpoint.innerWidth <= 768 : false,
9
+ isMobile: breakpoint ? breakpoint.innerWidth < 768 : false,
10
10
  width: (_b = breakpoint === null || breakpoint === void 0 ? void 0 : breakpoint.innerWidth) !== null && _b !== void 0 ? _b : 0,
11
11
  });
12
12
  }, [breakpoint]);
package/dist/utils/use-breakpoint.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"use-breakpoint.js","sourceRoot":"","sources":["../../src/utils/use-breakpoint.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAC5E,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAQhC,MAAM,CAAC,MAAM,kBAAkB,GAAG,GAAoB,EAAE;IACpD,MAAM,UAAU,GAAG,aAAa,EAAE,CAAC;IAEnC,OAAO,OAAO,CACV,GAAG,EAAE;;QAAC,OAAA,CAAC;YACH,IAAI,EAAE,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,IAAI,mCAAI,IAAI;YAC9B,QAAQ,EAAE,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,UAAU,IAAI,GAAG,CAAC,CAAC,CAAC,KAAK;YAC3D,KAAK,EAAE,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,UAAU,mCAAI,CAAC;SACrC,CAAC,CAAA;KAAA,EACF,CAAC,UAAU,CAAC,CACf,CAAC;AACN,CAAC,CAAC"}
1
+ {"version":3,"file":"use-breakpoint.js","sourceRoot":"","sources":["../../src/utils/use-breakpoint.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAC5E,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAQhC,MAAM,CAAC,MAAM,kBAAkB,GAAG,GAAoB,EAAE;IACpD,MAAM,UAAU,GAAG,aAAa,EAAE,CAAC;IAEnC,OAAO,OAAO,CACV,GAAG,EAAE;;QAAC,OAAA,CAAC;YACH,IAAI,EAAE,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,IAAI,mCAAI,IAAI;YAC9B,QAAQ,EAAE,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,UAAU,GAAG,GAAG,CAAC,CAAC,CAAC,KAAK;YAC1D,KAAK,EAAE,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,UAAU,mCAAI,CAAC;SACrC,CAAC,CAAA;KAAA,EACF,CAAC,UAAU,CAAC,CACf,CAAC;AACN,CAAC,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@servicetitan/navigation",
3
- "version": "11.0.0-canary.237.6c48c6d.0",
3
+ "version": "11.0.0-canary.237.7d5e2c9.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": "6c48c6d20cb5235b2f7d85ccd067303d02a22352"
45
+ "gitHead": "7d5e2c9a3547a4d61a5ef937f36ceb050bcff01d"
46
46
  }
package/src/components/titan-layout/layout-header.module.less CHANGED
@@ -90,29 +90,59 @@
90
90
  }
91
91
  }
92
92
 
93
+ .header-mobile {
94
+ padding: @spacing-2 @spacing-0;
95
+ height: var(--nav-offset-top);
96
+
97
+ --nav-top-content-height: 40px;
98
+
99
+ .navigation-link {
100
+ padding: 10px;
101
+ }
102
+
103
+ .he-top-center {
104
+ max-width: unset;
105
+ flex: 1;
106
+ margin-left: @spacing-3;
107
+ margin-right: @spacing-3;
108
+ }
109
+
110
+ .he-top-left {
111
+ margin-left: @spacing-half;
112
+ }
113
+
114
+ .he-top-right {
115
+ margin-right: @spacing-half;
116
+ }
117
+ }
118
+
93
119
  // desktop
94
- @media only screen and (min-width: 768px) {
95
- .header {
96
- height: var(--nav-offset-top);
97
- .navigation-link {
98
- margin: 6px 2px;
99
- padding: 6px 6px;
100
- }
120
+ .header-desktop {
121
+ height: var(--nav-offset-top);
122
+ .navigation-link {
123
+ margin: 6px 2px;
124
+ padding: 6px 6px;
101
125
 
102
- .he-top-left {
103
- padding-left: @spacing-1;
104
- }
105
- .he-top-center {
106
- flex: 1;
107
- margin-left: @spacing-2;
108
- margin-right: @spacing-2;
109
- max-width: 400px;
126
+ .navigation-item-counter {
127
+ min-width: 12px !important;
128
+ height: 12px !important;
110
129
  }
111
130
  }
131
+
132
+ .he-top-left {
133
+ padding-left: @spacing-1;
134
+ }
135
+ .he-top-center {
136
+ flex: 1;
137
+ margin-left: @spacing-2;
138
+ margin-right: @spacing-2;
139
+ max-width: 400px;
140
+ }
112
141
  }
142
+
113
143
  // desktop wide
114
144
  @media only screen and (min-width: 1200px) {
115
- .header {
145
+ .header-desktop {
116
146
  display: grid;
117
147
  grid-template-columns: repeat(3, 1fr);
118
148
  grid-template-rows: 48px;
@@ -129,35 +159,6 @@
129
159
  }
130
160
  }
131
161
 
132
- // mobile
133
- @media only screen and (max-width: 768px) {
134
- .header {
135
- padding: @spacing-2 @spacing-0;
136
- height: var(--nav-offset-top);
137
-
138
- --nav-top-content-height: 40px;
139
-
140
- .navigation-link {
141
- padding: 10px;
142
- }
143
-
144
- .he-top-center {
145
- max-width: unset;
146
- flex: 1;
147
- margin-left: @spacing-3;
148
- margin-right: @spacing-3;
149
- }
150
-
151
- .he-top-left {
152
- margin-left: @spacing-half;
153
- }
154
-
155
- .he-top-right {
156
- margin-right: @spacing-half;
157
- }
158
- }
159
- }
160
-
161
162
  .navigation-link {
162
163
  // styles specific to extra nav links
163
164
  color: @color-black;
@@ -190,12 +191,3 @@
190
191
  right: -8px;
191
192
  }
192
193
  }
193
-
194
- @media only screen and (min-width: 768px) {
195
- .navigation-link {
196
- .navigation-item-counter {
197
- min-width: 12px !important;
198
- height: 12px !important;
199
- }
200
- }
201
- }
package/src/components/titan-layout/layout-header.module.less.d.ts CHANGED
@@ -4,6 +4,8 @@ export const heTopLeft: string;
4
4
  export const heTopRight: string;
5
5
  export const heTopRightText: string;
6
6
  export const header: string;
7
+ export const headerDesktop: string;
8
+ export const headerMobile: string;
7
9
  export const navigationIcon: string;
8
10
  export const navigationIconActive: string;
9
11
  export const navigationItemActive: string;
package/src/components/titan-layout/layout-header.tsx CHANGED
@@ -47,7 +47,11 @@ export const LayoutHeader: FC<LayoutHeaderProps> = ({
47
47
  return (
48
48
  <LayoutPlacementContext.Provider value="top">
49
49
  <div
50
- className={classNames(Styles.header, className)}
50
+ className={classNames(
51
+ Styles.header,
52
+ isMobile ? Styles.headerMobile : Styles.headerDesktop,
53
+ className
54
+ )}
51
55
  {...rest}
52
56
  data-cy="header-navigation"
53
57
  >
package/src/components/titan-layout/titan-layout.module.less CHANGED
@@ -59,8 +59,8 @@
59
59
  }
60
60
 
61
61
  .layout {
62
- --nav-offset-top: 0;
63
- --nav-offset-left: 0;
62
+ --nav-offset-top: 0px;
63
+ --nav-offset-left: 0px;
64
64
 
65
65
  &.layout-desktop.layout-top {
66
66
  --nav-offset-top: 48px;
package/src/components/titan-layout/titan-layout.tsx CHANGED
@@ -147,6 +147,10 @@ const TitanLayoutComponent: FC<TitanLayoutProps> = ({
147
147
  const [mobileDrawerOpened, setMobileDrawerOpened] = useState(false);
148
148
  const { content, logo } = useLayoutChildren(children);
149
149
  const { hasNotifications, NotificationsContextProvider } = useNotificationsState();
150
+ const [anvil2Styles, setAnvil2Styles] = useState<object>({});
151
+ const updateIndicatorsHeight = useCallback((offset: number) => {
152
+ setAnvil2Styles({ '--offset': `calc(var(--nav-offset-top) + ${offset}px)` });
153
+ }, []);
150
154
 
151
155
  const isMobile = breakpoint.isMobile;
152
156
  const hasSideBar = !contentOnly && (!!navigationMainItems?.length || !!sideTop?.length);
@@ -208,11 +212,25 @@ const TitanLayoutComponent: FC<TitanLayoutProps> = ({
208
212
  return undefined;
209
213
  }
210
214
 
211
- if (variant.isAnvil1 && breakpoint.width < minContentWidth) {
215
+ if (breakpoint.width < minContentWidth) {
212
216
  return minContentWidth;
213
217
  }
214
218
  }, [variant, minContentWidth, breakpoint.width]);
215
219
 
220
+ const contentStyles = useMemo(() => {
221
+ if (variant.isAnvil2) {
222
+ return anvil2Styles;
223
+ }
224
+
225
+ if (variant.isLegacy && limitContentWidth) {
226
+ return {
227
+ display: 'flex',
228
+ flexDirection: 'column',
229
+ minHeight: '100vh',
230
+ };
231
+ }
232
+ }, [variant, anvil2Styles, limitContentWidth]);
233
+
216
234
  const layoutClass = variant.isLegacy
217
235
  ? Styles.layoutLegacy
218
236
  : variant.isAnvil1
@@ -234,6 +252,7 @@ const TitanLayoutComponent: FC<TitanLayoutProps> = ({
234
252
  },
235
253
  layoutClass
236
254
  )}
255
+ style={contentStyles}
237
256
  >
238
257
  {variant.isSequent && <div className={Styles.topPlaceholder} />}
239
258
  {hasTopBar && (
@@ -291,14 +310,23 @@ const TitanLayoutComponent: FC<TitanLayoutProps> = ({
291
310
  />
292
311
  </NotificationsContextProvider>
293
312
  )}
294
- <LayoutContent
295
- header={header}
296
- anvil2={variant.isAnvil2}
297
- anvil1={variant.isAnvil1}
298
- minWidth={limitContentWidth}
299
- >
300
- {content}
301
- </LayoutContent>
313
+
314
+ {variant.isAnvil1 ? (
315
+ <LayoutContentAnvil1 header={header} minWidth={limitContentWidth}>
316
+ {content}
317
+ </LayoutContentAnvil1>
318
+ ) : variant.isLegacy ? (
319
+ <LayoutContentLegacy header={header} minWidth={limitContentWidth}>
320
+ {content}
321
+ </LayoutContentLegacy>
322
+ ) : (
323
+ <LayoutContentAnvil2
324
+ header={header}
325
+ onHeaderHeightChange={updateIndicatorsHeight}
326
+ >
327
+ {content}
328
+ </LayoutContentAnvil2>
329
+ )}
302
330
  </div>
303
331
  </LayoutPlacementContext.Provider>
304
332
  </LayoutContext.Provider>
@@ -339,63 +367,88 @@ const TitanLayoutHeaderObserved: FC<{
339
367
  </div>
340
368
  );
341
369
  };
370
+ const TitanLayoutHeader: FC<{ children: ReactNode }> = ({ children }) => {
371
+ return (
372
+ <div className={Styles.contentHeader} data-cy="layout-content-header">
373
+ {children}
374
+ </div>
375
+ );
376
+ };
342
377
 
343
378
  export interface TitanLayoutContentProps {
344
379
  children: ReactNode;
345
380
  }
346
381
  const TitanLayoutContent: FC<TitanLayoutContentProps> = ({ children }) => children;
347
382
 
348
- const LayoutContent: FC<{
383
+ const LayoutContentAnvil2: FC<{
349
384
  children: ReactNode;
350
385
  header?: ReactNode;
351
- anvil1: boolean;
352
- anvil2: boolean;
353
- minWidth: number | undefined;
354
- }> = ({ anvil1, anvil2, children, header, minWidth }) => {
355
- const [anvil2Styles, setAnvil2Styles] = useState<object>({});
356
- const updateIndicatorsHeight = useCallback((offset: number) => {
357
- setAnvil2Styles({ '--offset': `calc(var(--nav-offset-top) + ${offset}px)` });
358
- }, []);
386
+ onHeaderHeightChange?: (height: number) => void;
387
+ }> = ({ children, header, onHeaderHeightChange }) => {
388
+ return (
389
+ <Fragment>
390
+ <TitanLayoutHeaderObserved heightChange={onHeaderHeightChange}>
391
+ {header}
392
+ </TitanLayoutHeaderObserved>
393
+ {children}
394
+ </Fragment>
395
+ );
396
+ };
359
397
 
360
- const contentStyles: CSSProperties = useMemo(
398
+ const LayoutContentAnvil1: FC<{
399
+ children: ReactNode;
400
+ header?: ReactNode;
401
+ minWidth?: number;
402
+ }> = ({ children, header, minWidth }) => {
403
+ const innerContentStyles: CSSProperties = useMemo(
361
404
  () => ({
362
- ...(anvil1 && minWidth ? { overflowX: 'auto' } : {}),
363
- ...(anvil2 ? anvil2Styles : {}),
405
+ ...(minWidth ? { minWidth: `${minWidth}px` } : {}),
364
406
  }),
365
- [anvil1, anvil2, minWidth, anvil2Styles]
407
+ [minWidth]
366
408
  );
367
409
 
410
+ return (
411
+ <Fragment>
412
+ <TitanLayoutHeader>{header}</TitanLayoutHeader>
413
+ <div
414
+ className={classNames(Styles.content, { 'of-x-auto': !!minWidth })}
415
+ data-cy="layout-content"
416
+ >
417
+ <div
418
+ className="position-relative d-f flex-grow-1 flex-basis-0 of-hidden"
419
+ style={innerContentStyles}
420
+ >
421
+ {children}
422
+ </div>
423
+ </div>
424
+ </Fragment>
425
+ );
426
+ };
427
+
428
+ const LayoutContentLegacy: FC<{
429
+ children: ReactNode;
430
+ header?: ReactNode;
431
+ minWidth: number | undefined;
432
+ }> = ({ children, header, minWidth }) => {
368
433
  const innerContentStyles: CSSProperties = useMemo(
369
434
  () => ({
370
- ...(anvil1 && minWidth ? { minWidth: `${minWidth}px` } : {}),
435
+ position: 'relative',
436
+ minWidth: `${minWidth}px`,
371
437
  }),
372
- [anvil1, minWidth]
438
+ [minWidth]
373
439
  );
374
440
 
375
441
  return (
376
442
  <Fragment>
377
- {!!header &&
378
- (anvil2 ? (
379
- <TitanLayoutHeaderObserved heightChange={updateIndicatorsHeight}>
380
- {header}
381
- </TitanLayoutHeaderObserved>
382
- ) : (
383
- <div className={Styles.contentHeader} data-cy="layout-content-header">
384
- {header}
385
- </div>
386
- ))}
387
- <div className={Styles.content} style={contentStyles} data-cy="layout-content">
388
- {anvil1 ? (
389
- <div
390
- className="position-relative d-f flex-grow-1 flex-basis-0 of-hidden"
391
- style={innerContentStyles}
392
- >
393
- {children}
394
- </div>
395
- ) : (
396
- children
397
- )}
398
- </div>
443
+ <TitanLayoutHeader>{header}</TitanLayoutHeader>
444
+
445
+ {minWidth ? (
446
+ <div className="of-x-auto flex-basis-0 flex-grow-1">
447
+ <div style={innerContentStyles}>{children}</div>
448
+ </div>
449
+ ) : (
450
+ children
451
+ )}
399
452
  </Fragment>
400
453
  );
401
454
  };
package/src/utils/use-breakpoint.ts CHANGED
@@ -13,7 +13,7 @@ export const useTitanBreakpoint = (): TitanBreakpoint => {
13
13
  return useMemo(
14
14
  () => ({
15
15
  name: breakpoint?.name ?? 'xl',
16
- isMobile: breakpoint ? breakpoint.innerWidth <= 768 : false,
16
+ isMobile: breakpoint ? breakpoint.innerWidth < 768 : false,
17
17
  width: breakpoint?.innerWidth ?? 0,
18
18
  }),
19
19
  [breakpoint]