@lendi/navbar 7.13.0 → 7.13.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.
Files changed (8) hide show
  1. package/dist/declarations/src/Header/Header.d.ts +5 -0
  2. package/dist/declarations/src/Header/HeaderBase.d.ts +1 -1
  3. package/dist/declarations/src/Header/Nav.d.ts +1 -0
  4. package/dist/declarations/src/Header/shared.styles.d.ts +3 -0
  5. package/dist/navbar.cjs.dev.js +41 -29
  6. package/dist/navbar.cjs.prod.js +48 -31
  7. package/dist/navbar.esm.js +41 -29
  8. package/package.json +1 -1
package/dist/declarations/src/Header/Header.d.ts CHANGED
@@ -2,8 +2,13 @@ import React from 'react';
2
2
  import { NavElements } from './Nav';
3
3
  import { ChatProps } from '../shared/CommPanelProvider';
4
4
  export interface HeaderProps {
5
+ /** Handler for apply now button clicks */
5
6
  handleApplyNow: () => void;
7
+ /** Handler for logout */
6
8
  onLogout: () => void;
9
+ /** Structure for building out the nav.
10
+ * See canvas tab for full structure
11
+ * */
7
12
  navOptions?: NavElements[];
8
13
  }
9
14
  export declare const Header: React.FC<HeaderProps & Pick<ChatProps, "topOffset"> & (import("..").SimpleNavbarProps | import("..").MultiNavbarProps)>;
package/dist/declarations/src/Header/HeaderBase.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import type { GlobalProps } from '@lendi-ui/commons/utils';
3
- export declare const HeaderPaddingSmall = 12;
3
+ export declare const HeaderPaddingSmall = 10;
4
4
  export declare const HeaderPaddingLarge = 24;
5
5
  export interface HeaderBaseProps extends GlobalProps {
6
6
  navSlot: React.ReactNode;
package/dist/declarations/src/Header/Nav.d.ts CHANGED
@@ -14,6 +14,7 @@ export interface NavElements extends NavItemProps {
14
14
  export interface NavSubItems extends NavRestrictedProp {
15
15
  label: string;
16
16
  link: string;
17
+ isActive?: boolean;
17
18
  }
18
19
  export declare const NAV_MENU_ITEMS: NavElements[];
19
20
  interface NavTypes {
package/dist/declarations/src/Header/shared.styles.d.ts CHANGED
@@ -1,3 +1,4 @@
1
+ export declare const LargeTweakpoint = "67rem";
1
2
  export declare const Px: import("styled-components").FlattenSimpleInterpolation;
2
3
  export declare const Py: import("styled-components").FlattenSimpleInterpolation;
3
4
  export declare const MenuPadding: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
@@ -7,6 +8,8 @@ export declare const insetFocusVisible: import("styled-components").FlattenInter
7
8
  export declare const focusVisible: import("styled-components").FlattenSimpleInterpolation;
8
9
  export declare const StyledHR: import("styled-components").StyledComponent<"hr", import("styled-components").DefaultTheme, {}, never>;
9
10
  export declare const HideFromLarge: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
11
+ export declare const HideFromTweakLarge: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
12
+ export declare const ShowFromTweakLarge: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
10
13
  export declare const ShowFromLarge: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
11
14
  export declare const HideFromMedium: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
12
15
  export declare const ShowFromMedium: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
package/dist/navbar.cjs.dev.js CHANGED
@@ -136,7 +136,7 @@ function _taggedTemplateLiteral(strings, raw) {
136
136
  }));
137
137
  }
138
138
 
139
- var _templateObject$e, _templateObject2$5, _templateObject3$3, _templateObject4$2, _templateObject5$1;
139
+ var _templateObject$e, _templateObject2$5, _templateObject3$2, _templateObject4$1, _templateObject5$1;
140
140
  var StyledHeaderLogo = styled__default["default"](Logo__default["default"]).withConfig({
141
141
  displayName: "style__StyledHeaderLogo",
142
142
  componentId: "lui__sc-17ip4hk-0"
@@ -156,7 +156,7 @@ var StyledHeaderLogo = styled__default["default"](Logo__default["default"]).with
156
156
  } = _ref3;
157
157
  return Theme.select('logo.logoName')({
158
158
  theme
159
- }) === 'LendiLogo' ? styled.css(["", ";", ";"], breakpoint.gte('tablet')(_templateObject$e || (_templateObject$e = _taggedTemplateLiteral(["\n width: auto;\n height: 28px;\n "]))), breakpoint.gte('desktop')(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteral(["\n width: auto;\n height: 36px;\n "])))) : styled.css(["", ";", ";"], breakpoint.gte('tablet')(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteral(["\n width: auto;\n height: 28px;\n "]))), breakpoint.gte('desktop')(_templateObject4$2 || (_templateObject4$2 = _taggedTemplateLiteral(["\n width: auto;\n height: 36px;\n "]))));
159
+ }) === 'LendiLogo' ? styled.css(["", ";", ";"], breakpoint.gte('tablet')(_templateObject$e || (_templateObject$e = _taggedTemplateLiteral(["\n width: auto;\n height: 28px;\n "]))), breakpoint.gte('desktop')(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteral(["\n width: auto;\n height: 36px;\n "])))) : styled.css(["", ";", ";"], breakpoint.gte('tablet')(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteral(["\n width: auto;\n height: 28px;\n "]))), breakpoint.gte('desktop')(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteral(["\n width: auto;\n height: 36px;\n "]))));
160
160
  });
161
161
  var LogoLink$1 = styled__default["default"].a.withConfig({
162
162
  displayName: "style__LogoLink",
@@ -1235,7 +1235,7 @@ var slideOutRight = styled.keyframes(["0%{transform:translate3d(0,0,0);}100%{tra
1235
1235
  var StyledSlideoutMenu$1 = styled__default["default"].div.withConfig({
1236
1236
  displayName: "SlideoutMenuBase__StyledSlideoutMenu",
1237
1237
  componentId: "lui__sc-msuqad-0"
1238
- })(["display:none;width:100%;position:fixed;height:100%;top:0;bottom:0;right:0;z-index:2;animation-fill-mode:forwards;animation-duration:0.3s;animation-timing-function:ease;", " &.is-open{transform:translate3d(0,0,0);display:block;}&.slide-in-right{animation-name:", ";}&.slide-out-right{animation-name:", ";}", ""], breakpoint.gte('sm')(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteral(["\n width: ", ";;\n "])), utils$1.pxToRem(375)), slideInRight, slideOutRight, _ref => {
1238
+ })(["display:none;width:100%;position:fixed;top:0;bottom:0;right:0;z-index:2;animation-fill-mode:forwards;animation-duration:0.3s;animation-timing-function:ease;", " &.is-open{transform:translate3d(0,0,0);display:block;}&.slide-in-right{animation-name:", ";}&.slide-out-right{animation-name:", ";}", ""], breakpoint.gte('sm')(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteral(["\n width: ", ";;\n "])), utils$1.pxToRem(375)), slideInRight, slideOutRight, _ref => {
1239
1239
  var {
1240
1240
  topOffset
1241
1241
  } = _ref;
@@ -1363,7 +1363,7 @@ var CommPanelWrapper = styled__default["default"](SlideoutMenuBase).withConfig({
1363
1363
  var {
1364
1364
  toTheTop
1365
1365
  } = _ref2;
1366
- return toTheTop && styled.css(["top:0;z-index:999;height:100%;"]);
1366
+ return toTheTop && styled.css(["top:0;z-index:999;"]);
1367
1367
  });
1368
1368
 
1369
1369
  var withCommPanelWrapper = Component => // eslint-disable-next-line react/display-name
@@ -2287,7 +2287,8 @@ var MultiNavbarComponent = _ref => {
2287
2287
 
2288
2288
  var MultiNavbar = withErrorProvider(launchdarkly.withLendiLDProvider(withCommPanel(withDomainChat(MultiNavbarComponent))));
2289
2289
 
2290
- var _templateObject$3, _templateObject2$2, _templateObject3$2, _templateObject4$1, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
2290
+ var _templateObject$3, _templateObject2$2, _templateObject3$1, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
2291
+ var LargeTweakpoint = '67rem';
2291
2292
  var Px = styled.css(["padding-left:", ";padding-right:", ";"], utils$1.pxToRem(16), utils$1.pxToRem(16));
2292
2293
  var Py = styled.css(["padding-top:", ";padding-bottom:", ";"], utils$1.pxToRem(24), utils$1.pxToRem(24));
2293
2294
  var MenuPadding = styled__default["default"].div.withConfig({
@@ -2296,7 +2297,7 @@ var MenuPadding = styled__default["default"].div.withConfig({
2296
2297
  })(["", ";", ";"], Px, Py);
2297
2298
  var listReset = styled.css(["margin:0;list-style:none;padding:0;"]);
2298
2299
  var buttonReset = styled.css(["border:0;border-radius:0;background:none;width:100%;white-space:nowrap;text-decoration:none;margin:0;cursor:pointer;"]);
2299
- var insetFocusVisible = styled.css(["&:focus-visible{outline:0;box-shadow:inset ", " 0.125rem 0.125rem 0 0,inset ", " -0.125rem -0.125rem 0 0,inset ", " 0.25rem 0.25rem 0 0,inset ", " -0.25rem -0.25rem 0 0;}"], () => getColour__default["default"]('border', 'interaction', {
2300
+ var insetFocusVisible = styled.css(["&:focus-visible{background-color:#331745;outline:0;box-shadow:inset ", " 0.125rem 0.125rem 0 0,inset ", " -0.125rem -0.125rem 0 0,inset ", " 0.25rem 0.25rem 0 0,inset ", " -0.25rem -0.25rem 0 0;}"], () => getColour__default["default"]('border', 'interaction', {
2300
2301
  state: 'focus'
2301
2302
  }), () => getColour__default["default"]('border', 'interaction', {
2302
2303
  state: 'focus'
@@ -2306,41 +2307,49 @@ var StyledHR = styled__default["default"].hr.withConfig({
2306
2307
  displayName: "sharedstyles__StyledHR",
2307
2308
  componentId: "lui__sc-631j2u-1"
2308
2309
  })(["margin-top:", ";margin-bottom:", ";&:last-child{margin-bottom:0;}"], utils$1.pxToRem(24), utils$1.pxToRem(24));
2309
- var HideFromLarge = styled__default["default"].div.withConfig({
2310
+ styled__default["default"].div.withConfig({
2310
2311
  displayName: "sharedstyles__HideFromLarge",
2311
2312
  componentId: "lui__sc-631j2u-2"
2312
2313
  })(["display:block;", ""], breakpoint.gte('lg')(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteral(["\n display: none;\n "]))));
2313
- var ShowFromLarge = styled__default["default"].div.withConfig({
2314
- displayName: "sharedstyles__ShowFromLarge",
2314
+ var HideFromTweakLarge = styled__default["default"].div.withConfig({
2315
+ displayName: "sharedstyles__HideFromTweakLarge",
2315
2316
  componentId: "lui__sc-631j2u-3"
2317
+ })(["display:block;@media (min-width:", "){display:none;}"], LargeTweakpoint);
2318
+ var ShowFromTweakLarge = styled__default["default"].div.withConfig({
2319
+ displayName: "sharedstyles__ShowFromTweakLarge",
2320
+ componentId: "lui__sc-631j2u-4"
2321
+ })(["display:none;@media (min-width:", "){display:block;}"], LargeTweakpoint);
2322
+ styled__default["default"].div.withConfig({
2323
+ displayName: "sharedstyles__ShowFromLarge",
2324
+ componentId: "lui__sc-631j2u-5"
2316
2325
  })(["display:none;", ""], breakpoint.gte('lg')(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteral(["\n display: block;\n "]))));
2317
2326
  var HideFromMedium = styled__default["default"].div.withConfig({
2318
2327
  displayName: "sharedstyles__HideFromMedium",
2319
- componentId: "lui__sc-631j2u-4"
2320
- })(["display:block;", ""], breakpoint.gte('md')(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteral(["\n display: none;\n "]))));
2328
+ componentId: "lui__sc-631j2u-6"
2329
+ })(["display:block;", ""], breakpoint.gte('md')(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteral(["\n display: none;\n "]))));
2321
2330
  var ShowFromMedium = styled__default["default"].div.withConfig({
2322
2331
  displayName: "sharedstyles__ShowFromMedium",
2323
- componentId: "lui__sc-631j2u-5"
2324
- })(["display:none;", ""], breakpoint.gte('md')(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteral(["\n display: block;\n "]))));
2332
+ componentId: "lui__sc-631j2u-7"
2333
+ })(["display:none;", ""], breakpoint.gte('md')(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n display: block;\n "]))));
2325
2334
  var ShowFromSmall = styled__default["default"].div.withConfig({
2326
2335
  displayName: "sharedstyles__ShowFromSmall",
2327
- componentId: "lui__sc-631j2u-6"
2336
+ componentId: "lui__sc-631j2u-8"
2328
2337
  })(["display:none;", ""], breakpoint.gte('sm')(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n display: block;\n "]))));
2329
2338
  styled__default["default"].div.withConfig({
2330
2339
  displayName: "sharedstyles__HideFromSmall",
2331
- componentId: "lui__sc-631j2u-7"
2340
+ componentId: "lui__sc-631j2u-9"
2332
2341
  })(["display:block;", ""], breakpoint.gte('sm')(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n display: none;\n "]))));
2333
2342
  var ShowAtSmallOnly = styled__default["default"].div.withConfig({
2334
2343
  displayName: "sharedstyles__ShowAtSmallOnly",
2335
- componentId: "lui__sc-631j2u-8"
2344
+ componentId: "lui__sc-631j2u-10"
2336
2345
  })(["display:none;", ";"], breakpoint.between('xs', 'sm')(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n display: block;\n "]))));
2337
2346
  var ShowAtMediumOnly = styled__default["default"].div.withConfig({
2338
2347
  displayName: "sharedstyles__ShowAtMediumOnly",
2339
- componentId: "lui__sc-631j2u-9"
2348
+ componentId: "lui__sc-631j2u-11"
2340
2349
  })(["display:none;", ";"], breakpoint.between('sm', 'lg')(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n display: block;\n "]))));
2341
2350
  var SrOnlySpan = styled__default["default"].span.withConfig({
2342
2351
  displayName: "sharedstyles__SrOnlySpan",
2343
- componentId: "lui__sc-631j2u-10"
2352
+ componentId: "lui__sc-631j2u-12"
2344
2353
  })(["", ";"], utils$1.srOnly);
2345
2354
 
2346
2355
  var _excluded$7 = ["children", "isOpen", "onClick"],
@@ -2355,7 +2364,7 @@ var _excluded$7 = ["children", "isOpen", "onClick"],
2355
2364
  var StyledNavButton = styled__default["default"].button.withConfig({
2356
2365
  displayName: "NavButtons__StyledNavButton",
2357
2366
  componentId: "lui__sc-1rf7mpw-0"
2358
- })(["", ";color:", ";background-color:", ";font-family:", ";font-weight:", ";-webkit-font-smoothing:antialiased;-moz-font-smoothing:'grayscale';font-size:", ";line-height:1.5;padding:", " ", ";display:flex;align-items:center;justify-content:space-between;&:hover{color:", ";}", " ", ""], () => buttonReset, () => getColour__default["default"]('text', 'inverse'), () => getColour__default["default"]('interaction', 'main'), () => getTypography__default["default"]('button1', 'fontFamily'), () => getTypography__default["default"]('button1', 'fontWeight'), utils$1.pxToRem(16), utils$1.pxToRem(12), utils$1.pxToRem(12), () => getColour__default["default"]('interaction', 'emphasis'), _ref => {
2367
+ })(["", ";color:", ";background-color:", ";font-family:", ";font-weight:", ";-webkit-font-smoothing:antialiased;-moz-font-smoothing:'grayscale';font-size:", ";line-height:1.5;padding:", " ", ";display:flex;align-items:center;justify-content:space-between;&:hover{color:", ";}", " ", ""], () => buttonReset, () => getColour__default["default"]('text', 'inverse'), () => getColour__default["default"]('interaction', 'main'), () => getTypography__default["default"]('button1', 'fontFamily'), () => getTypography__default["default"]('button1', 'fontWeight'), utils$1.pxToRem(16), utils$1.pxToRem(12), utils$1.pxToRem(16), () => getColour__default["default"]('interaction', 'emphasis'), _ref => {
2359
2368
  var {
2360
2369
  isOpen
2361
2370
  } = _ref;
@@ -2455,8 +2464,8 @@ var Dropdown = /*#__PURE__*/React.forwardRef(DropdownComponent);
2455
2464
 
2456
2465
  var _excluded$5 = ["navSlot", "ctaSlot"];
2457
2466
 
2458
- var _templateObject$2, _templateObject2$1, _templateObject3$1, _templateObject4;
2459
- var HeaderPaddingSmall = 12;
2467
+ var _templateObject$2, _templateObject2$1;
2468
+ var HeaderPaddingSmall = 10;
2460
2469
  var HeaderPaddingLarge = 24;
2461
2470
  var StyledHeader = styled__default["default"].header.withConfig({
2462
2471
  displayName: "HeaderBase__StyledHeader",
@@ -2469,15 +2478,15 @@ var HeaderInner = styled__default["default"].div.withConfig({
2469
2478
  var LogoLink = styled__default["default"].a.withConfig({
2470
2479
  displayName: "HeaderBase__LogoLink",
2471
2480
  componentId: "lui__sc-1ik75ai-2"
2472
- })(["width:", ";height:", ";order:1;display:inline-block;", " ", ""], utils$1.pxToRem(87), utils$1.pxToRem(16), breakpoint.gte('md')(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral(["\n width: ", ";\n height: ", ";\n margin-right: ", ";\n "])), utils$1.pxToRem(150), utils$1.pxToRem(28), utils$1.pxToRem(36)), focusVisible);
2481
+ })(["width:", ";height:", ";order:1;flex:0 0 auto;", " ", ""], utils$1.pxToRem(87), utils$1.pxToRem(16), breakpoint.gte('md')(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral(["\n width: ", ";\n height: ", ";\n margin-right: ", ";\n "])), utils$1.pxToRem(150), utils$1.pxToRem(28), utils$1.pxToRem(32)), focusVisible);
2473
2482
  var StyledNavSlot = styled__default["default"].div.withConfig({
2474
2483
  displayName: "HeaderBase__StyledNavSlot",
2475
2484
  componentId: "lui__sc-1ik75ai-3"
2476
- })(["order:3;", ""], breakpoint.gte('lg')(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteral(["\n order: 2;\n "]))));
2485
+ })(["order:3;@media (min-width:", "){order:2;}"], LargeTweakpoint);
2477
2486
  var StyledCtaSlot = styled__default["default"].div.withConfig({
2478
2487
  displayName: "HeaderBase__StyledCtaSlot",
2479
2488
  componentId: "lui__sc-1ik75ai-4"
2480
- })(["margin-left:auto;order:2;", ""], breakpoint.gte('lg')(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n order: 3;\n "]))));
2489
+ })(["margin-left:auto;order:2;@media (min-width:", "){order:3;}"], LargeTweakpoint);
2481
2490
  var HeaderBase = _ref => {
2482
2491
  var {
2483
2492
  navSlot,
@@ -2611,7 +2620,7 @@ var _excluded$3 = ["children", "href", "background", "isActive", "isExternal", "
2611
2620
  * @todo Helper functions: getTypography you have to specify each property of the font you need should this be simpler
2612
2621
  * @todo Colors: Access the color palette or update to semantic values
2613
2622
  */
2614
- var MenuItemStyles = styled.css(["padding:", " ", ";color:", ";font-family:", ";font-weight:", ";font-size:", ";line-height:1.5;text-decoration:none;&:hover{background-color:#633482;}&:focus{background-color:#331745;}", ""], utils$1.pxToRem(12), utils$1.pxToRem(16), () => getColour__default["default"]('text', 'inverse'), () => getTypography__default["default"]('body1', 'fontFamily'), () => getTypography__default["default"]('body1', 'fontWeight'), utils$1.pxToRem(16), insetFocusVisible);
2623
+ var MenuItemStyles = styled.css(["padding:", " ", ";color:", ";font-family:", ";font-weight:", ";font-size:", ";line-height:1.5;text-decoration:none;&:hover{background-color:#633482;}", ""], utils$1.pxToRem(12), utils$1.pxToRem(16), () => getColour__default["default"]('text', 'inverse'), () => getTypography__default["default"]('body1', 'fontFamily'), () => getTypography__default["default"]('body1', 'fontWeight'), utils$1.pxToRem(16), insetFocusVisible);
2615
2624
  var StyledMenuLink = styled__default["default"].a.withConfig({
2616
2625
  displayName: "MenuLink__StyledMenuLink",
2617
2626
  componentId: "lui__sc-dpbddc-0"
@@ -2704,7 +2713,8 @@ var NAV_MENU_ITEMS = [{
2704
2713
  label: 'Home Loans',
2705
2714
  children: [{
2706
2715
  label: 'Buy a new home loan',
2707
- link: '/home-loans/first-home-buyer'
2716
+ link: '/home-loans/first-home-buyer',
2717
+ isActive: true
2708
2718
  }, {
2709
2719
  label: 'Refinance my home loan',
2710
2720
  link: '/home-loans/refinance'
@@ -2807,6 +2817,7 @@ var Nav = _ref3 => {
2807
2817
  var hideChildItem = isRestricted && childItem.hasRestriction;
2808
2818
  return !hideChildItem && /*#__PURE__*/jsxRuntime.jsx(MenuLink, {
2809
2819
  href: childItem.link,
2820
+ isActive: childItem.isActive,
2810
2821
  onClick: () => {
2811
2822
  var event = {
2812
2823
  category: analytics$1.EventCategory.NAVBAR,
@@ -2838,6 +2849,7 @@ var Nav = _ref3 => {
2838
2849
  var hideChildItem = isRestricted && childItem.hasRestriction;
2839
2850
  return !hideChildItem && /*#__PURE__*/jsxRuntime.jsx(MenuLink, {
2840
2851
  href: childItem.link,
2852
+ isActive: childItem.isActive,
2841
2853
  onClick: () => {
2842
2854
  var event = {
2843
2855
  category: analytics$1.EventCategory.NAVBAR,
@@ -3402,7 +3414,7 @@ var CtaNav = _ref => {
3402
3414
  } = _ref;
3403
3415
  return /*#__PURE__*/jsxRuntime.jsxs(Layout.Spacer, {
3404
3416
  xalign: "center",
3405
- children: [/*#__PURE__*/jsxRuntime.jsx(ShowFromLarge, {
3417
+ children: [/*#__PURE__*/jsxRuntime.jsx(ShowFromTweakLarge, {
3406
3418
  children: /*#__PURE__*/jsxRuntime.jsx(TalkToExpertButton, {
3407
3419
  openCommPanel: openCommPanel
3408
3420
  })
@@ -3500,12 +3512,12 @@ var HeaderWithContext = _ref => {
3500
3512
  return /*#__PURE__*/jsxRuntime.jsx(RestrictionProvider, {
3501
3513
  children: /*#__PURE__*/jsxRuntime.jsx(HeaderBase, {
3502
3514
  navSlot: /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
3503
- children: [/*#__PURE__*/jsxRuntime.jsx(ShowFromLarge, {
3515
+ children: [/*#__PURE__*/jsxRuntime.jsx(ShowFromTweakLarge, {
3504
3516
  children: /*#__PURE__*/jsxRuntime.jsx(Nav, {
3505
3517
  navOptions: navOptions,
3506
3518
  isRestricted: isRestricted
3507
3519
  })
3508
- }), /*#__PURE__*/jsxRuntime.jsx(HideFromLarge, {
3520
+ }), /*#__PURE__*/jsxRuntime.jsx(HideFromTweakLarge, {
3509
3521
  children: /*#__PURE__*/jsxRuntime.jsx(HamburgerMenu, {
3510
3522
  handleApplyNowClick: handleApplyNow,
3511
3523
  application: application,
package/dist/navbar.cjs.prod.js CHANGED
@@ -46,7 +46,7 @@ function _objectSpread2(target) {
46
46
  return target;
47
47
  }
48
48
 
49
- var _templateObject$e, _templateObject2$5, _templateObject3$3, _templateObject4$2, _templateObject5$1, analytics = navbarAnalyticsEvent => {
49
+ var _templateObject$e, _templateObject2$5, _templateObject3$2, _templateObject4$1, _templateObject5$1, analytics = navbarAnalyticsEvent => {
50
50
  window && window.analytics ? analytics$1.trackEvent(_objectSpread2({}, navbarAnalyticsEvent)) : console.error("Segment is not loaded");
51
51
  };
52
52
 
@@ -71,7 +71,7 @@ var _templateObject$d, _templateObject$c, _templateObject2$4, StyledHeaderLogo =
71
71
  var {theme: theme} = _ref3;
72
72
  return "LendiLogo" === Theme.select("logo.logoName")({
73
73
  theme: theme
74
- }) ? styled.css([ "", ";", ";" ], breakpoint.gte("tablet")(_templateObject$e || (_templateObject$e = _taggedTemplateLiteral([ "\n width: auto;\n height: 28px;\n " ]))), breakpoint.gte("desktop")(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteral([ "\n width: auto;\n height: 36px;\n " ])))) : styled.css([ "", ";", ";" ], breakpoint.gte("tablet")(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteral([ "\n width: auto;\n height: 28px;\n " ]))), breakpoint.gte("desktop")(_templateObject4$2 || (_templateObject4$2 = _taggedTemplateLiteral([ "\n width: auto;\n height: 36px;\n " ]))));
74
+ }) ? styled.css([ "", ";", ";" ], breakpoint.gte("tablet")(_templateObject$e || (_templateObject$e = _taggedTemplateLiteral([ "\n width: auto;\n height: 28px;\n " ]))), breakpoint.gte("desktop")(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteral([ "\n width: auto;\n height: 36px;\n " ])))) : styled.css([ "", ";", ";" ], breakpoint.gte("tablet")(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteral([ "\n width: auto;\n height: 28px;\n " ]))), breakpoint.gte("desktop")(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteral([ "\n width: auto;\n height: 36px;\n " ]))));
75
75
  })), LogoLink$1 = styled__default.default.a.withConfig({
76
76
  displayName: "style__LogoLink",
77
77
  componentId: "lui__sc-17ip4hk-1"
@@ -590,7 +590,7 @@ function _asyncPoll() {
590
590
  })), _asyncPoll.apply(this, arguments);
591
591
  }
592
592
 
593
- var _templateObject$7, _templateObject2$3, _templateObject$6, _templateObject$5, _templateObject$4, _templateObject$3, _templateObject2$2, _templateObject3$2, _templateObject4$1, _templateObject5, _templateObject6, _templateObject7, _templateObject8, extraWaiting = function() {
593
+ var _templateObject$7, _templateObject2$3, _templateObject$6, _templateObject$5, _templateObject$4, _templateObject$3, _templateObject2$2, _templateObject3$1, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, extraWaiting = function() {
594
594
  var _ref = _asyncToGenerator((function*() {
595
595
  yield new Promise((resolve => setTimeout(resolve, 5e3)));
596
596
  }));
@@ -726,7 +726,7 @@ var _templateObject$7, _templateObject2$3, _templateObject$6, _templateObject$5,
726
726
  }, _excluded$9 = [ "children", "className", "isOpen", "handleClose", "topOffset" ], IS_OPEN_DATA_ATTRIBUTE = "data-slideout-isOpen", slideInRight = styled.keyframes([ "0%{transform:translate3d(100%,0,0);}100%{transform:translate3d(0,0,0);}" ]), slideOutRight = styled.keyframes([ "0%{transform:translate3d(0,0,0);}100%{transform:translate3d(100%,0,0);}" ]), StyledSlideoutMenu$1 = styled__default.default.div.withConfig({
727
727
  displayName: "SlideoutMenuBase__StyledSlideoutMenu",
728
728
  componentId: "lui__sc-msuqad-0"
729
- })([ "display:none;width:100%;position:fixed;height:100%;top:0;bottom:0;right:0;z-index:2;animation-fill-mode:forwards;animation-duration:0.3s;animation-timing-function:ease;", " &.is-open{transform:translate3d(0,0,0);display:block;}&.slide-in-right{animation-name:", ";}&.slide-out-right{animation-name:", ";}", "" ], breakpoint.gte("sm")(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteral([ "\n width: ", ";;\n " ])), utils$1.pxToRem(375)), slideInRight, slideOutRight, (_ref => {
729
+ })([ "display:none;width:100%;position:fixed;top:0;bottom:0;right:0;z-index:2;animation-fill-mode:forwards;animation-duration:0.3s;animation-timing-function:ease;", " &.is-open{transform:translate3d(0,0,0);display:block;}&.slide-in-right{animation-name:", ";}&.slide-out-right{animation-name:", ";}", "" ], breakpoint.gte("sm")(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteral([ "\n width: ", ";;\n " ])), utils$1.pxToRem(375)), slideInRight, slideOutRight, (_ref => {
730
730
  var {topOffset: topOffset} = _ref;
731
731
  return topOffset && breakpoint.map(topOffset, (value => value && "top: ".concat(value)));
732
732
  })), BodyStyles = styled.createGlobalStyle([ "", "" ], (_ref2 => {
@@ -779,7 +779,7 @@ var _templateObject$7, _templateObject2$3, _templateObject$6, _templateObject$5,
779
779
  if (!toTheTop) return topOffset ? breakpoint.map(topOffset, (value => value && "top: ".concat(value, ";"))) : styled.css([ "top:", ";", ";" ], navTokens.size.height.navbar.mobile.value, breakpoint.gte("desktop")(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteral([ "\n top: ", ";\n " ])), navTokens.size.height.navbar.desktop.value));
780
780
  }), (_ref2 => {
781
781
  var {toTheTop: toTheTop} = _ref2;
782
- return toTheTop && styled.css([ "top:0;z-index:999;height:100%;" ]);
782
+ return toTheTop && styled.css([ "top:0;z-index:999;" ]);
783
783
  })), withCommPanelWrapper = Component => props => {
784
784
  var {onException: onException} = useError(), {isCommPanelOpen: isCommPanelOpen, openCommPanel: openCommPanel, closeCommPanel: closeCommPanel, openChat: openChat} = commPanel.useCommPanel(), [hasUnread, setHasUnread] = React__default.default.useState(!1), [isOtherUserOnline, setIsOtherUserOnline] = React__default.default.useState(!1), [breakpoint$1, setBreakpoint] = React__default.default.useState();
785
785
  breakpoint.useBreakpoint(setBreakpoint);
@@ -1452,51 +1452,65 @@ var _templateObject$7, _templateObject2$3, _templateObject$6, _templateObject$5,
1452
1452
  }) ]
1453
1453
  })) ]
1454
1454
  });
1455
- }, MultiNavbar = withErrorProvider(launchdarkly.withLendiLDProvider(withCommPanel(withDomainChat(MultiNavbarComponent)))), Px = styled.css([ "padding-left:", ";padding-right:", ";" ], utils$1.pxToRem(16), utils$1.pxToRem(16)), Py = styled.css([ "padding-top:", ";padding-bottom:", ";" ], utils$1.pxToRem(24), utils$1.pxToRem(24)), MenuPadding = styled__default.default.div.withConfig({
1455
+ }, MultiNavbar = withErrorProvider(launchdarkly.withLendiLDProvider(withCommPanel(withDomainChat(MultiNavbarComponent)))), LargeTweakpoint = "67rem", Px = styled.css([ "padding-left:", ";padding-right:", ";" ], utils$1.pxToRem(16), utils$1.pxToRem(16)), Py = styled.css([ "padding-top:", ";padding-bottom:", ";" ], utils$1.pxToRem(24), utils$1.pxToRem(24)), MenuPadding = styled__default.default.div.withConfig({
1456
1456
  displayName: "sharedstyles__MenuPadding",
1457
1457
  componentId: "lui__sc-631j2u-0"
1458
- })([ "", ";", ";" ], Px, Py), listReset = styled.css([ "margin:0;list-style:none;padding:0;" ]), buttonReset = styled.css([ "border:0;border-radius:0;background:none;width:100%;white-space:nowrap;text-decoration:none;margin:0;cursor:pointer;" ]), insetFocusVisible = styled.css([ "&:focus-visible{outline:0;box-shadow:inset ", " 0.125rem 0.125rem 0 0,inset ", " -0.125rem -0.125rem 0 0,inset ", " 0.25rem 0.25rem 0 0,inset ", " -0.25rem -0.25rem 0 0;}" ], (() => getColour__default.default("border", "interaction", {
1458
+ })([ "", ";", ";" ], Px, Py), listReset = styled.css([ "margin:0;list-style:none;padding:0;" ]), buttonReset = styled.css([ "border:0;border-radius:0;background:none;width:100%;white-space:nowrap;text-decoration:none;margin:0;cursor:pointer;" ]), insetFocusVisible = styled.css([ "&:focus-visible{background-color:#331745;outline:0;box-shadow:inset ", " 0.125rem 0.125rem 0 0,inset ", " -0.125rem -0.125rem 0 0,inset ", " 0.25rem 0.25rem 0 0,inset ", " -0.25rem -0.25rem 0 0;}" ], (() => getColour__default.default("border", "interaction", {
1459
1459
  state: "focus"
1460
1460
  })), (() => getColour__default.default("border", "interaction", {
1461
1461
  state: "focus"
1462
1462
  })), (() => getColour__default.default("fill", "main")), (() => getColour__default.default("fill", "main"))), focusVisible = styled.css([ "&:focus-visible{outline:0;box-shadow:", ";}" ], borders.getFocusRing()), StyledHR = styled__default.default.hr.withConfig({
1463
1463
  displayName: "sharedstyles__StyledHR",
1464
1464
  componentId: "lui__sc-631j2u-1"
1465
- })([ "margin-top:", ";margin-bottom:", ";&:last-child{margin-bottom:0;}" ], utils$1.pxToRem(24), utils$1.pxToRem(24)), HideFromLarge = styled__default.default.div.withConfig({
1465
+ })([ "margin-top:", ";margin-bottom:", ";&:last-child{margin-bottom:0;}" ], utils$1.pxToRem(24), utils$1.pxToRem(24));
1466
+
1467
+ styled__default.default.div.withConfig({
1466
1468
  displayName: "sharedstyles__HideFromLarge",
1467
1469
  componentId: "lui__sc-631j2u-2"
1468
- })([ "display:block;", "" ], breakpoint.gte("lg")(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteral([ "\n display: none;\n " ])))), ShowFromLarge = styled__default.default.div.withConfig({
1469
- displayName: "sharedstyles__ShowFromLarge",
1470
+ })([ "display:block;", "" ], breakpoint.gte("lg")(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteral([ "\n display: none;\n " ]))));
1471
+
1472
+ var HideFromTweakLarge = styled__default.default.div.withConfig({
1473
+ displayName: "sharedstyles__HideFromTweakLarge",
1470
1474
  componentId: "lui__sc-631j2u-3"
1471
- })([ "display:none;", "" ], breakpoint.gte("lg")(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteral([ "\n display: block;\n " ])))), HideFromMedium = styled__default.default.div.withConfig({
1472
- displayName: "sharedstyles__HideFromMedium",
1475
+ })([ "display:block;@media (min-width:", "){display:none;}" ], LargeTweakpoint), ShowFromTweakLarge = styled__default.default.div.withConfig({
1476
+ displayName: "sharedstyles__ShowFromTweakLarge",
1473
1477
  componentId: "lui__sc-631j2u-4"
1474
- })([ "display:block;", "" ], breakpoint.gte("md")(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteral([ "\n display: none;\n " ])))), ShowFromMedium = styled__default.default.div.withConfig({
1475
- displayName: "sharedstyles__ShowFromMedium",
1478
+ })([ "display:none;@media (min-width:", "){display:block;}" ], LargeTweakpoint);
1479
+
1480
+ styled__default.default.div.withConfig({
1481
+ displayName: "sharedstyles__ShowFromLarge",
1476
1482
  componentId: "lui__sc-631j2u-5"
1477
- })([ "display:none;", "" ], breakpoint.gte("md")(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteral([ "\n display: block;\n " ])))), ShowFromSmall = styled__default.default.div.withConfig({
1478
- displayName: "sharedstyles__ShowFromSmall",
1483
+ })([ "display:none;", "" ], breakpoint.gte("lg")(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteral([ "\n display: block;\n " ]))));
1484
+
1485
+ var HideFromMedium = styled__default.default.div.withConfig({
1486
+ displayName: "sharedstyles__HideFromMedium",
1479
1487
  componentId: "lui__sc-631j2u-6"
1488
+ })([ "display:block;", "" ], breakpoint.gte("md")(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteral([ "\n display: none;\n " ])))), ShowFromMedium = styled__default.default.div.withConfig({
1489
+ displayName: "sharedstyles__ShowFromMedium",
1490
+ componentId: "lui__sc-631j2u-7"
1491
+ })([ "display:none;", "" ], breakpoint.gte("md")(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral([ "\n display: block;\n " ])))), ShowFromSmall = styled__default.default.div.withConfig({
1492
+ displayName: "sharedstyles__ShowFromSmall",
1493
+ componentId: "lui__sc-631j2u-8"
1480
1494
  })([ "display:none;", "" ], breakpoint.gte("sm")(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral([ "\n display: block;\n " ]))));
1481
1495
 
1482
1496
  styled__default.default.div.withConfig({
1483
1497
  displayName: "sharedstyles__HideFromSmall",
1484
- componentId: "lui__sc-631j2u-7"
1498
+ componentId: "lui__sc-631j2u-9"
1485
1499
  })([ "display:block;", "" ], breakpoint.gte("sm")(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral([ "\n display: none;\n " ]))));
1486
1500
 
1487
- var _templateObject$2, _templateObject2$1, _templateObject3$1, _templateObject4, _templateObject$1, _templateObject, _templateObject2, _templateObject3, ShowAtSmallOnly = styled__default.default.div.withConfig({
1501
+ var _templateObject$2, _templateObject2$1, _templateObject$1, _templateObject, _templateObject2, _templateObject3, ShowAtSmallOnly = styled__default.default.div.withConfig({
1488
1502
  displayName: "sharedstyles__ShowAtSmallOnly",
1489
- componentId: "lui__sc-631j2u-8"
1503
+ componentId: "lui__sc-631j2u-10"
1490
1504
  })([ "display:none;", ";" ], breakpoint.between("xs", "sm")(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral([ "\n display: block;\n " ])))), ShowAtMediumOnly = styled__default.default.div.withConfig({
1491
1505
  displayName: "sharedstyles__ShowAtMediumOnly",
1492
- componentId: "lui__sc-631j2u-9"
1506
+ componentId: "lui__sc-631j2u-11"
1493
1507
  })([ "display:none;", ";" ], breakpoint.between("sm", "lg")(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral([ "\n display: block;\n " ])))), SrOnlySpan = styled__default.default.span.withConfig({
1494
1508
  displayName: "sharedstyles__SrOnlySpan",
1495
- componentId: "lui__sc-631j2u-10"
1509
+ componentId: "lui__sc-631j2u-12"
1496
1510
  })([ "", ";" ], utils$1.srOnly), _excluded$7 = [ "children", "isOpen", "onClick" ], _excluded2$1 = [ "children", "href", "onClick" ], StyledNavButton = styled__default.default.button.withConfig({
1497
1511
  displayName: "NavButtons__StyledNavButton",
1498
1512
  componentId: "lui__sc-1rf7mpw-0"
1499
- })([ "", ";color:", ";background-color:", ";font-family:", ";font-weight:", ";-webkit-font-smoothing:antialiased;-moz-font-smoothing:'grayscale';font-size:", ";line-height:1.5;padding:", " ", ";display:flex;align-items:center;justify-content:space-between;&:hover{color:", ";}", " ", "" ], (() => buttonReset), (() => getColour__default.default("text", "inverse")), (() => getColour__default.default("interaction", "main")), (() => getTypography__default.default("button1", "fontFamily")), (() => getTypography__default.default("button1", "fontWeight")), utils$1.pxToRem(16), utils$1.pxToRem(12), utils$1.pxToRem(12), (() => getColour__default.default("interaction", "emphasis")), (_ref => {
1513
+ })([ "", ";color:", ";background-color:", ";font-family:", ";font-weight:", ";-webkit-font-smoothing:antialiased;-moz-font-smoothing:'grayscale';font-size:", ";line-height:1.5;padding:", " ", ";display:flex;align-items:center;justify-content:space-between;&:hover{color:", ";}", " ", "" ], (() => buttonReset), (() => getColour__default.default("text", "inverse")), (() => getColour__default.default("interaction", "main")), (() => getTypography__default.default("button1", "fontFamily")), (() => getTypography__default.default("button1", "fontWeight")), utils$1.pxToRem(16), utils$1.pxToRem(12), utils$1.pxToRem(16), (() => getColour__default.default("interaction", "emphasis")), (_ref => {
1500
1514
  var {isOpen: isOpen} = _ref;
1501
1515
  return isOpen && "color: ".concat(getColour__default.default("interaction", "emphasis"), ";");
1502
1516
  }), insetFocusVisible), StyledNavButtonText = styled__default.default.span.withConfig({
@@ -1551,7 +1565,7 @@ var _templateObject$2, _templateObject2$1, _templateObject3$1, _templateObject4,
1551
1565
  }, globalProps), {}, {
1552
1566
  children: children
1553
1567
  }));
1554
- }, Dropdown = React.forwardRef(DropdownComponent), _excluded$5 = [ "navSlot", "ctaSlot" ], HeaderPaddingSmall = 12, HeaderPaddingLarge = 24, StyledHeader = styled__default.default.header.withConfig({
1568
+ }, Dropdown = React.forwardRef(DropdownComponent), _excluded$5 = [ "navSlot", "ctaSlot" ], HeaderPaddingSmall = 10, HeaderPaddingLarge = 24, StyledHeader = styled__default.default.header.withConfig({
1555
1569
  displayName: "HeaderBase__StyledHeader",
1556
1570
  componentId: "lui__sc-1ik75ai-0"
1557
1571
  })([ "background:", ";position:sticky;top:0;padding:", " 0;", "" ], (() => getColour__default.default("fill", "contrast")), utils$1.pxToRem(HeaderPaddingSmall), breakpoint.gte("md")(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral([ "\n padding: ", " 0;\n " ])), utils$1.pxToRem(HeaderPaddingLarge))), HeaderInner = styled__default.default.div.withConfig({
@@ -1560,13 +1574,13 @@ var _templateObject$2, _templateObject2$1, _templateObject3$1, _templateObject4,
1560
1574
  })([ "display:flex;align-items:center;" ]), LogoLink = styled__default.default.a.withConfig({
1561
1575
  displayName: "HeaderBase__LogoLink",
1562
1576
  componentId: "lui__sc-1ik75ai-2"
1563
- })([ "width:", ";height:", ";order:1;display:inline-block;", " ", "" ], utils$1.pxToRem(87), utils$1.pxToRem(16), breakpoint.gte("md")(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral([ "\n width: ", ";\n height: ", ";\n margin-right: ", ";\n " ])), utils$1.pxToRem(150), utils$1.pxToRem(28), utils$1.pxToRem(36)), focusVisible), StyledNavSlot = styled__default.default.div.withConfig({
1577
+ })([ "width:", ";height:", ";order:1;flex:0 0 auto;", " ", "" ], utils$1.pxToRem(87), utils$1.pxToRem(16), breakpoint.gte("md")(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral([ "\n width: ", ";\n height: ", ";\n margin-right: ", ";\n " ])), utils$1.pxToRem(150), utils$1.pxToRem(28), utils$1.pxToRem(32)), focusVisible), StyledNavSlot = styled__default.default.div.withConfig({
1564
1578
  displayName: "HeaderBase__StyledNavSlot",
1565
1579
  componentId: "lui__sc-1ik75ai-3"
1566
- })([ "order:3;", "" ], breakpoint.gte("lg")(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteral([ "\n order: 2;\n " ])))), StyledCtaSlot = styled__default.default.div.withConfig({
1580
+ })([ "order:3;@media (min-width:", "){order:2;}" ], LargeTweakpoint), StyledCtaSlot = styled__default.default.div.withConfig({
1567
1581
  displayName: "HeaderBase__StyledCtaSlot",
1568
1582
  componentId: "lui__sc-1ik75ai-4"
1569
- })([ "margin-left:auto;order:2;", "" ], breakpoint.gte("lg")(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral([ "\n order: 3;\n " ])))), HeaderBase = _ref => {
1583
+ })([ "margin-left:auto;order:2;@media (min-width:", "){order:3;}" ], LargeTweakpoint), HeaderBase = _ref => {
1570
1584
  var {navSlot: navSlot, ctaSlot: ctaSlot} = _ref, props = _objectWithoutProperties(_ref, _excluded$5), globalProps = utils$1.filterGlobalProps(props);
1571
1585
  return jsxRuntime.jsx(StyledHeader, _objectSpread2(_objectSpread2({
1572
1586
  role: "banner"
@@ -1642,7 +1656,7 @@ var _templateObject$2, _templateObject2$1, _templateObject3$1, _templateObject4,
1642
1656
  })
1643
1657
  }) ]
1644
1658
  }));
1645
- }, _excluded$3 = [ "children", "href", "background", "isActive", "isExternal", "onClick" ], _excluded2 = [ "children", "onClick" ], MenuItemStyles = styled.css([ "padding:", " ", ";color:", ";font-family:", ";font-weight:", ";font-size:", ";line-height:1.5;text-decoration:none;&:hover{background-color:#633482;}&:focus{background-color:#331745;}", "" ], utils$1.pxToRem(12), utils$1.pxToRem(16), (() => getColour__default.default("text", "inverse")), (() => getTypography__default.default("body1", "fontFamily")), (() => getTypography__default.default("body1", "fontWeight")), utils$1.pxToRem(16), insetFocusVisible), StyledMenuLink = styled__default.default.a.withConfig({
1659
+ }, _excluded$3 = [ "children", "href", "background", "isActive", "isExternal", "onClick" ], _excluded2 = [ "children", "onClick" ], MenuItemStyles = styled.css([ "padding:", " ", ";color:", ";font-family:", ";font-weight:", ";font-size:", ";line-height:1.5;text-decoration:none;&:hover{background-color:#633482;}", "" ], utils$1.pxToRem(12), utils$1.pxToRem(16), (() => getColour__default.default("text", "inverse")), (() => getTypography__default.default("body1", "fontFamily")), (() => getTypography__default.default("body1", "fontWeight")), utils$1.pxToRem(16), insetFocusVisible), StyledMenuLink = styled__default.default.a.withConfig({
1646
1660
  displayName: "MenuLink__StyledMenuLink",
1647
1661
  componentId: "lui__sc-dpbddc-0"
1648
1662
  })([ "", " background-color:", ";display:flex;align-items:center;justify-content:space-between;position:relative;", "" ], (() => MenuItemStyles), (_ref => {
@@ -1693,7 +1707,8 @@ var _templateObject$2, _templateObject2$1, _templateObject3$1, _templateObject4,
1693
1707
  label: "Home Loans",
1694
1708
  children: [ {
1695
1709
  label: "Buy a new home loan",
1696
- link: "/home-loans/first-home-buyer"
1710
+ link: "/home-loans/first-home-buyer",
1711
+ isActive: !0
1697
1712
  }, {
1698
1713
  label: "Refinance my home loan",
1699
1714
  link: "/home-loans/refinance"
@@ -1767,6 +1782,7 @@ var _templateObject$2, _templateObject2$1, _templateObject3$1, _templateObject4,
1767
1782
  label: item.label,
1768
1783
  children: null === (_item$children = item.children) || void 0 === _item$children ? void 0 : _item$children.map(((childItem, index) => !(isRestricted && childItem.hasRestriction) && jsxRuntime.jsx(MenuLink, {
1769
1784
  href: childItem.link,
1785
+ isActive: childItem.isActive,
1770
1786
  onClick: () => {
1771
1787
  var event = {
1772
1788
  category: analytics$1.EventCategory.NAVBAR,
@@ -1795,6 +1811,7 @@ var _templateObject$2, _templateObject2$1, _templateObject3$1, _templateObject4,
1795
1811
  },
1796
1812
  children: null === (_item$children2 = item.children) || void 0 === _item$children2 ? void 0 : _item$children2.map(((childItem, index) => !(isRestricted && childItem.hasRestriction) && jsxRuntime.jsx(MenuLink, {
1797
1813
  href: childItem.link,
1814
+ isActive: childItem.isActive,
1798
1815
  onClick: () => {
1799
1816
  var event = {
1800
1817
  category: analytics$1.EventCategory.NAVBAR,
@@ -2219,7 +2236,7 @@ var _templateObject$2, _templateObject2$1, _templateObject3$1, _templateObject4,
2219
2236
  var {handleApplyNowClick: handleApplyNowClick, session: session, application: application, teamMember: teamMember, isRestricted: isRestricted, openCommPanel: openCommPanel, onLogout: onLogout} = _ref;
2220
2237
  return jsxRuntime.jsxs(Layout.Spacer, {
2221
2238
  xalign: "center",
2222
- children: [ jsxRuntime.jsx(ShowFromLarge, {
2239
+ children: [ jsxRuntime.jsx(ShowFromTweakLarge, {
2223
2240
  children: jsxRuntime.jsx(TalkToExpertButton, {
2224
2241
  openCommPanel: openCommPanel
2225
2242
  })
@@ -2286,12 +2303,12 @@ var _templateObject$2, _templateObject2$1, _templateObject3$1, _templateObject4,
2286
2303
  return jsxRuntime.jsx(RestrictionProvider, {
2287
2304
  children: jsxRuntime.jsx(HeaderBase, {
2288
2305
  navSlot: jsxRuntime.jsxs(jsxRuntime.Fragment, {
2289
- children: [ jsxRuntime.jsx(ShowFromLarge, {
2306
+ children: [ jsxRuntime.jsx(ShowFromTweakLarge, {
2290
2307
  children: jsxRuntime.jsx(Nav, {
2291
2308
  navOptions: navOptions,
2292
2309
  isRestricted: isRestricted
2293
2310
  })
2294
- }), jsxRuntime.jsx(HideFromLarge, {
2311
+ }), jsxRuntime.jsx(HideFromTweakLarge, {
2295
2312
  children: jsxRuntime.jsx(HamburgerMenu, {
2296
2313
  handleApplyNowClick: handleApplyNow,
2297
2314
  application: application,
package/dist/navbar.esm.js CHANGED
@@ -109,7 +109,7 @@ function _taggedTemplateLiteral(strings, raw) {
109
109
  }));
110
110
  }
111
111
 
112
- var _templateObject$e, _templateObject2$5, _templateObject3$3, _templateObject4$2, _templateObject5$1;
112
+ var _templateObject$e, _templateObject2$5, _templateObject3$2, _templateObject4$1, _templateObject5$1;
113
113
  var StyledHeaderLogo = styled(Logo).withConfig({
114
114
  displayName: "style__StyledHeaderLogo",
115
115
  componentId: "lui__sc-17ip4hk-0"
@@ -129,7 +129,7 @@ var StyledHeaderLogo = styled(Logo).withConfig({
129
129
  } = _ref3;
130
130
  return select('logo.logoName')({
131
131
  theme
132
- }) === 'LendiLogo' ? css(["", ";", ";"], gte('tablet')(_templateObject$e || (_templateObject$e = _taggedTemplateLiteral(["\n width: auto;\n height: 28px;\n "]))), gte('desktop')(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteral(["\n width: auto;\n height: 36px;\n "])))) : css(["", ";", ";"], gte('tablet')(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteral(["\n width: auto;\n height: 28px;\n "]))), gte('desktop')(_templateObject4$2 || (_templateObject4$2 = _taggedTemplateLiteral(["\n width: auto;\n height: 36px;\n "]))));
132
+ }) === 'LendiLogo' ? css(["", ";", ";"], gte('tablet')(_templateObject$e || (_templateObject$e = _taggedTemplateLiteral(["\n width: auto;\n height: 28px;\n "]))), gte('desktop')(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteral(["\n width: auto;\n height: 36px;\n "])))) : css(["", ";", ";"], gte('tablet')(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteral(["\n width: auto;\n height: 28px;\n "]))), gte('desktop')(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteral(["\n width: auto;\n height: 36px;\n "]))));
133
133
  });
134
134
  var LogoLink$1 = styled.a.withConfig({
135
135
  displayName: "style__LogoLink",
@@ -1208,7 +1208,7 @@ var slideOutRight = keyframes(["0%{transform:translate3d(0,0,0);}100%{transform:
1208
1208
  var StyledSlideoutMenu$1 = styled.div.withConfig({
1209
1209
  displayName: "SlideoutMenuBase__StyledSlideoutMenu",
1210
1210
  componentId: "lui__sc-msuqad-0"
1211
- })(["display:none;width:100%;position:fixed;height:100%;top:0;bottom:0;right:0;z-index:2;animation-fill-mode:forwards;animation-duration:0.3s;animation-timing-function:ease;", " &.is-open{transform:translate3d(0,0,0);display:block;}&.slide-in-right{animation-name:", ";}&.slide-out-right{animation-name:", ";}", ""], gte('sm')(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteral(["\n width: ", ";;\n "])), pxToRem(375)), slideInRight, slideOutRight, _ref => {
1211
+ })(["display:none;width:100%;position:fixed;top:0;bottom:0;right:0;z-index:2;animation-fill-mode:forwards;animation-duration:0.3s;animation-timing-function:ease;", " &.is-open{transform:translate3d(0,0,0);display:block;}&.slide-in-right{animation-name:", ";}&.slide-out-right{animation-name:", ";}", ""], gte('sm')(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteral(["\n width: ", ";;\n "])), pxToRem(375)), slideInRight, slideOutRight, _ref => {
1212
1212
  var {
1213
1213
  topOffset
1214
1214
  } = _ref;
@@ -1336,7 +1336,7 @@ var CommPanelWrapper = styled(SlideoutMenuBase).withConfig({
1336
1336
  var {
1337
1337
  toTheTop
1338
1338
  } = _ref2;
1339
- return toTheTop && css(["top:0;z-index:999;height:100%;"]);
1339
+ return toTheTop && css(["top:0;z-index:999;"]);
1340
1340
  });
1341
1341
 
1342
1342
  var withCommPanelWrapper = Component => // eslint-disable-next-line react/display-name
@@ -2260,7 +2260,8 @@ var MultiNavbarComponent = _ref => {
2260
2260
 
2261
2261
  var MultiNavbar = withErrorProvider(withLendiLDProvider(withCommPanel(withDomainChat(MultiNavbarComponent))));
2262
2262
 
2263
- var _templateObject$3, _templateObject2$2, _templateObject3$2, _templateObject4$1, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
2263
+ var _templateObject$3, _templateObject2$2, _templateObject3$1, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
2264
+ var LargeTweakpoint = '67rem';
2264
2265
  var Px = css(["padding-left:", ";padding-right:", ";"], pxToRem(16), pxToRem(16));
2265
2266
  var Py = css(["padding-top:", ";padding-bottom:", ";"], pxToRem(24), pxToRem(24));
2266
2267
  var MenuPadding = styled.div.withConfig({
@@ -2269,7 +2270,7 @@ var MenuPadding = styled.div.withConfig({
2269
2270
  })(["", ";", ";"], Px, Py);
2270
2271
  var listReset = css(["margin:0;list-style:none;padding:0;"]);
2271
2272
  var buttonReset = css(["border:0;border-radius:0;background:none;width:100%;white-space:nowrap;text-decoration:none;margin:0;cursor:pointer;"]);
2272
- var insetFocusVisible = css(["&:focus-visible{outline:0;box-shadow:inset ", " 0.125rem 0.125rem 0 0,inset ", " -0.125rem -0.125rem 0 0,inset ", " 0.25rem 0.25rem 0 0,inset ", " -0.25rem -0.25rem 0 0;}"], () => getColour('border', 'interaction', {
2273
+ var insetFocusVisible = css(["&:focus-visible{background-color:#331745;outline:0;box-shadow:inset ", " 0.125rem 0.125rem 0 0,inset ", " -0.125rem -0.125rem 0 0,inset ", " 0.25rem 0.25rem 0 0,inset ", " -0.25rem -0.25rem 0 0;}"], () => getColour('border', 'interaction', {
2273
2274
  state: 'focus'
2274
2275
  }), () => getColour('border', 'interaction', {
2275
2276
  state: 'focus'
@@ -2279,41 +2280,49 @@ var StyledHR = styled.hr.withConfig({
2279
2280
  displayName: "sharedstyles__StyledHR",
2280
2281
  componentId: "lui__sc-631j2u-1"
2281
2282
  })(["margin-top:", ";margin-bottom:", ";&:last-child{margin-bottom:0;}"], pxToRem(24), pxToRem(24));
2282
- var HideFromLarge = styled.div.withConfig({
2283
+ styled.div.withConfig({
2283
2284
  displayName: "sharedstyles__HideFromLarge",
2284
2285
  componentId: "lui__sc-631j2u-2"
2285
2286
  })(["display:block;", ""], gte('lg')(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteral(["\n display: none;\n "]))));
2286
- var ShowFromLarge = styled.div.withConfig({
2287
- displayName: "sharedstyles__ShowFromLarge",
2287
+ var HideFromTweakLarge = styled.div.withConfig({
2288
+ displayName: "sharedstyles__HideFromTweakLarge",
2288
2289
  componentId: "lui__sc-631j2u-3"
2290
+ })(["display:block;@media (min-width:", "){display:none;}"], LargeTweakpoint);
2291
+ var ShowFromTweakLarge = styled.div.withConfig({
2292
+ displayName: "sharedstyles__ShowFromTweakLarge",
2293
+ componentId: "lui__sc-631j2u-4"
2294
+ })(["display:none;@media (min-width:", "){display:block;}"], LargeTweakpoint);
2295
+ styled.div.withConfig({
2296
+ displayName: "sharedstyles__ShowFromLarge",
2297
+ componentId: "lui__sc-631j2u-5"
2289
2298
  })(["display:none;", ""], gte('lg')(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteral(["\n display: block;\n "]))));
2290
2299
  var HideFromMedium = styled.div.withConfig({
2291
2300
  displayName: "sharedstyles__HideFromMedium",
2292
- componentId: "lui__sc-631j2u-4"
2293
- })(["display:block;", ""], gte('md')(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteral(["\n display: none;\n "]))));
2301
+ componentId: "lui__sc-631j2u-6"
2302
+ })(["display:block;", ""], gte('md')(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteral(["\n display: none;\n "]))));
2294
2303
  var ShowFromMedium = styled.div.withConfig({
2295
2304
  displayName: "sharedstyles__ShowFromMedium",
2296
- componentId: "lui__sc-631j2u-5"
2297
- })(["display:none;", ""], gte('md')(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteral(["\n display: block;\n "]))));
2305
+ componentId: "lui__sc-631j2u-7"
2306
+ })(["display:none;", ""], gte('md')(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n display: block;\n "]))));
2298
2307
  var ShowFromSmall = styled.div.withConfig({
2299
2308
  displayName: "sharedstyles__ShowFromSmall",
2300
- componentId: "lui__sc-631j2u-6"
2309
+ componentId: "lui__sc-631j2u-8"
2301
2310
  })(["display:none;", ""], gte('sm')(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n display: block;\n "]))));
2302
2311
  styled.div.withConfig({
2303
2312
  displayName: "sharedstyles__HideFromSmall",
2304
- componentId: "lui__sc-631j2u-7"
2313
+ componentId: "lui__sc-631j2u-9"
2305
2314
  })(["display:block;", ""], gte('sm')(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n display: none;\n "]))));
2306
2315
  var ShowAtSmallOnly = styled.div.withConfig({
2307
2316
  displayName: "sharedstyles__ShowAtSmallOnly",
2308
- componentId: "lui__sc-631j2u-8"
2317
+ componentId: "lui__sc-631j2u-10"
2309
2318
  })(["display:none;", ";"], between('xs', 'sm')(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n display: block;\n "]))));
2310
2319
  var ShowAtMediumOnly = styled.div.withConfig({
2311
2320
  displayName: "sharedstyles__ShowAtMediumOnly",
2312
- componentId: "lui__sc-631j2u-9"
2321
+ componentId: "lui__sc-631j2u-11"
2313
2322
  })(["display:none;", ";"], between('sm', 'lg')(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n display: block;\n "]))));
2314
2323
  var SrOnlySpan = styled.span.withConfig({
2315
2324
  displayName: "sharedstyles__SrOnlySpan",
2316
- componentId: "lui__sc-631j2u-10"
2325
+ componentId: "lui__sc-631j2u-12"
2317
2326
  })(["", ";"], srOnly);
2318
2327
 
2319
2328
  var _excluded$7 = ["children", "isOpen", "onClick"],
@@ -2328,7 +2337,7 @@ var _excluded$7 = ["children", "isOpen", "onClick"],
2328
2337
  var StyledNavButton = styled.button.withConfig({
2329
2338
  displayName: "NavButtons__StyledNavButton",
2330
2339
  componentId: "lui__sc-1rf7mpw-0"
2331
- })(["", ";color:", ";background-color:", ";font-family:", ";font-weight:", ";-webkit-font-smoothing:antialiased;-moz-font-smoothing:'grayscale';font-size:", ";line-height:1.5;padding:", " ", ";display:flex;align-items:center;justify-content:space-between;&:hover{color:", ";}", " ", ""], () => buttonReset, () => getColour('text', 'inverse'), () => getColour('interaction', 'main'), () => getTypography('button1', 'fontFamily'), () => getTypography('button1', 'fontWeight'), pxToRem(16), pxToRem(12), pxToRem(12), () => getColour('interaction', 'emphasis'), _ref => {
2340
+ })(["", ";color:", ";background-color:", ";font-family:", ";font-weight:", ";-webkit-font-smoothing:antialiased;-moz-font-smoothing:'grayscale';font-size:", ";line-height:1.5;padding:", " ", ";display:flex;align-items:center;justify-content:space-between;&:hover{color:", ";}", " ", ""], () => buttonReset, () => getColour('text', 'inverse'), () => getColour('interaction', 'main'), () => getTypography('button1', 'fontFamily'), () => getTypography('button1', 'fontWeight'), pxToRem(16), pxToRem(12), pxToRem(16), () => getColour('interaction', 'emphasis'), _ref => {
2332
2341
  var {
2333
2342
  isOpen
2334
2343
  } = _ref;
@@ -2428,8 +2437,8 @@ var Dropdown = /*#__PURE__*/forwardRef(DropdownComponent);
2428
2437
 
2429
2438
  var _excluded$5 = ["navSlot", "ctaSlot"];
2430
2439
 
2431
- var _templateObject$2, _templateObject2$1, _templateObject3$1, _templateObject4;
2432
- var HeaderPaddingSmall = 12;
2440
+ var _templateObject$2, _templateObject2$1;
2441
+ var HeaderPaddingSmall = 10;
2433
2442
  var HeaderPaddingLarge = 24;
2434
2443
  var StyledHeader = styled.header.withConfig({
2435
2444
  displayName: "HeaderBase__StyledHeader",
@@ -2442,15 +2451,15 @@ var HeaderInner = styled.div.withConfig({
2442
2451
  var LogoLink = styled.a.withConfig({
2443
2452
  displayName: "HeaderBase__LogoLink",
2444
2453
  componentId: "lui__sc-1ik75ai-2"
2445
- })(["width:", ";height:", ";order:1;display:inline-block;", " ", ""], pxToRem(87), pxToRem(16), gte('md')(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral(["\n width: ", ";\n height: ", ";\n margin-right: ", ";\n "])), pxToRem(150), pxToRem(28), pxToRem(36)), focusVisible);
2454
+ })(["width:", ";height:", ";order:1;flex:0 0 auto;", " ", ""], pxToRem(87), pxToRem(16), gte('md')(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral(["\n width: ", ";\n height: ", ";\n margin-right: ", ";\n "])), pxToRem(150), pxToRem(28), pxToRem(32)), focusVisible);
2446
2455
  var StyledNavSlot = styled.div.withConfig({
2447
2456
  displayName: "HeaderBase__StyledNavSlot",
2448
2457
  componentId: "lui__sc-1ik75ai-3"
2449
- })(["order:3;", ""], gte('lg')(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteral(["\n order: 2;\n "]))));
2458
+ })(["order:3;@media (min-width:", "){order:2;}"], LargeTweakpoint);
2450
2459
  var StyledCtaSlot = styled.div.withConfig({
2451
2460
  displayName: "HeaderBase__StyledCtaSlot",
2452
2461
  componentId: "lui__sc-1ik75ai-4"
2453
- })(["margin-left:auto;order:2;", ""], gte('lg')(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n order: 3;\n "]))));
2462
+ })(["margin-left:auto;order:2;@media (min-width:", "){order:3;}"], LargeTweakpoint);
2454
2463
  var HeaderBase = _ref => {
2455
2464
  var {
2456
2465
  navSlot,
@@ -2584,7 +2593,7 @@ var _excluded$3 = ["children", "href", "background", "isActive", "isExternal", "
2584
2593
  * @todo Helper functions: getTypography you have to specify each property of the font you need should this be simpler
2585
2594
  * @todo Colors: Access the color palette or update to semantic values
2586
2595
  */
2587
- var MenuItemStyles = css(["padding:", " ", ";color:", ";font-family:", ";font-weight:", ";font-size:", ";line-height:1.5;text-decoration:none;&:hover{background-color:#633482;}&:focus{background-color:#331745;}", ""], pxToRem(12), pxToRem(16), () => getColour('text', 'inverse'), () => getTypography('body1', 'fontFamily'), () => getTypography('body1', 'fontWeight'), pxToRem(16), insetFocusVisible);
2596
+ var MenuItemStyles = css(["padding:", " ", ";color:", ";font-family:", ";font-weight:", ";font-size:", ";line-height:1.5;text-decoration:none;&:hover{background-color:#633482;}", ""], pxToRem(12), pxToRem(16), () => getColour('text', 'inverse'), () => getTypography('body1', 'fontFamily'), () => getTypography('body1', 'fontWeight'), pxToRem(16), insetFocusVisible);
2588
2597
  var StyledMenuLink = styled.a.withConfig({
2589
2598
  displayName: "MenuLink__StyledMenuLink",
2590
2599
  componentId: "lui__sc-dpbddc-0"
@@ -2677,7 +2686,8 @@ var NAV_MENU_ITEMS = [{
2677
2686
  label: 'Home Loans',
2678
2687
  children: [{
2679
2688
  label: 'Buy a new home loan',
2680
- link: '/home-loans/first-home-buyer'
2689
+ link: '/home-loans/first-home-buyer',
2690
+ isActive: true
2681
2691
  }, {
2682
2692
  label: 'Refinance my home loan',
2683
2693
  link: '/home-loans/refinance'
@@ -2780,6 +2790,7 @@ var Nav = _ref3 => {
2780
2790
  var hideChildItem = isRestricted && childItem.hasRestriction;
2781
2791
  return !hideChildItem && /*#__PURE__*/jsx(MenuLink, {
2782
2792
  href: childItem.link,
2793
+ isActive: childItem.isActive,
2783
2794
  onClick: () => {
2784
2795
  var event = {
2785
2796
  category: EventCategory.NAVBAR,
@@ -2811,6 +2822,7 @@ var Nav = _ref3 => {
2811
2822
  var hideChildItem = isRestricted && childItem.hasRestriction;
2812
2823
  return !hideChildItem && /*#__PURE__*/jsx(MenuLink, {
2813
2824
  href: childItem.link,
2825
+ isActive: childItem.isActive,
2814
2826
  onClick: () => {
2815
2827
  var event = {
2816
2828
  category: EventCategory.NAVBAR,
@@ -3375,7 +3387,7 @@ var CtaNav = _ref => {
3375
3387
  } = _ref;
3376
3388
  return /*#__PURE__*/jsxs(Spacer, {
3377
3389
  xalign: "center",
3378
- children: [/*#__PURE__*/jsx(ShowFromLarge, {
3390
+ children: [/*#__PURE__*/jsx(ShowFromTweakLarge, {
3379
3391
  children: /*#__PURE__*/jsx(TalkToExpertButton, {
3380
3392
  openCommPanel: openCommPanel
3381
3393
  })
@@ -3473,12 +3485,12 @@ var HeaderWithContext = _ref => {
3473
3485
  return /*#__PURE__*/jsx(RestrictionProvider, {
3474
3486
  children: /*#__PURE__*/jsx(HeaderBase, {
3475
3487
  navSlot: /*#__PURE__*/jsxs(Fragment, {
3476
- children: [/*#__PURE__*/jsx(ShowFromLarge, {
3488
+ children: [/*#__PURE__*/jsx(ShowFromTweakLarge, {
3477
3489
  children: /*#__PURE__*/jsx(Nav, {
3478
3490
  navOptions: navOptions,
3479
3491
  isRestricted: isRestricted
3480
3492
  })
3481
- }), /*#__PURE__*/jsx(HideFromLarge, {
3493
+ }), /*#__PURE__*/jsx(HideFromTweakLarge, {
3482
3494
  children: /*#__PURE__*/jsx(HamburgerMenu, {
3483
3495
  handleApplyNowClick: handleApplyNow,
3484
3496
  application: application,
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@lendi/navbar",
3
3
  "access": "restricted",
4
- "version": "7.13.0",
4
+ "version": "7.13.2",
5
5
  "license": "ISC",
6
6
  "source": "src/index.tsx",
7
7
  "main": "dist/navbar.cjs.js",