@commercetools-frontend/application-shell 22.17.2 → 22.19.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 (64) hide show
  1. package/dist/commercetools-frontend-application-shell.cjs.dev.js +4 -3
  2. package/dist/commercetools-frontend-application-shell.cjs.prod.js +4 -3
  3. package/dist/commercetools-frontend-application-shell.esm.js +4 -3
  4. package/dist/{custom-view-dev-host-a4c2526e.cjs.prod.js → custom-view-dev-host-07deb1be.cjs.prod.js} +3 -3
  5. package/dist/{custom-view-dev-host-5f8c0099.cjs.dev.js → custom-view-dev-host-86bf92ba.cjs.dev.js} +3 -3
  6. package/dist/{custom-view-dev-host-03a7e8ee.esm.js → custom-view-dev-host-aa75f95a.esm.js} +3 -3
  7. package/dist/declarations/src/components/custom-view-flop-flip-provider/custom-view-flop-flip-provider.d.ts +10 -0
  8. package/dist/declarations/src/components/custom-view-flop-flip-provider/index.d.ts +1 -0
  9. package/dist/declarations/src/components/custom-view-shell/custom-view-shell.styles.d.ts +7 -0
  10. package/dist/declarations/src/components/custom-view-shell-authenticated/custom-view-shell-authenticated.d.ts +2 -0
  11. package/dist/declarations/src/components/locale-switcher/messages.d.ts +10 -0
  12. package/dist/declarations/src/components/project-container/index.d.ts +1 -0
  13. package/dist/declarations/src/components/project-switcher/project-switcher.d.ts +1 -1
  14. package/dist/declarations/src/types/generated/mc.d.ts +11 -0
  15. package/dist/{error-apologizer-84dc825c.cjs.prod.js → error-apologizer-3a9b55fd.cjs.dev.js} +6 -1
  16. package/dist/{error-apologizer-f6793491.cjs.dev.js → error-apologizer-7bc04be1.cjs.prod.js} +6 -1
  17. package/dist/{error-apologizer-76f087f4.esm.js → error-apologizer-9bed285b.esm.js} +5 -1
  18. package/dist/{index-3d6cf404.cjs.prod.js → index-e452a65f.cjs.prod.js} +143 -87
  19. package/dist/{index-5f138907.esm.js → index-fe5ba32e.esm.js} +165 -112
  20. package/dist/{index-3a78b6af.cjs.dev.js → index-fe871c79.cjs.dev.js} +164 -109
  21. package/dist/navbar-07b74cf1.esm.js +1294 -0
  22. package/dist/{navbar-53abe300.cjs.prod.js → navbar-681a53df.cjs.prod.js} +10 -12
  23. package/dist/navbar-d502141f.cjs.dev.js +1327 -0
  24. package/dist/{oidc-callback-663e13d0.cjs.prod.js → oidc-callback-6eda6b00.cjs.prod.js} +8 -4
  25. package/dist/{oidc-callback-137a6058.esm.js → oidc-callback-75ac7f40.esm.js} +9 -6
  26. package/dist/{oidc-callback-10ec1861.cjs.dev.js → oidc-callback-b7195937.cjs.dev.js} +9 -5
  27. package/dist/{project-container-c967d69d.cjs.dev.js → project-container-4141613a.cjs.dev.js} +84 -31
  28. package/dist/{project-container-a7b22509.cjs.prod.js → project-container-554de6c1.cjs.prod.js} +84 -25
  29. package/dist/{project-container-695b6d00.esm.js → project-container-8cb0493d.esm.js} +84 -34
  30. package/dist/{project-expired-4a84dc5d.esm.js → project-expired-0424eced.esm.js} +10 -6
  31. package/dist/{project-expired-fcc5b863.cjs.dev.js → project-expired-48383ec3.cjs.dev.js} +11 -6
  32. package/dist/{project-expired-198fe545.cjs.prod.js → project-expired-5f2aa2af.cjs.prod.js} +11 -6
  33. package/dist/{project-not-found-43c7b3d9.esm.js → project-not-found-5b22b7b6.esm.js} +10 -6
  34. package/dist/{project-not-found-bd1ed00d.cjs.dev.js → project-not-found-5da8e02f.cjs.dev.js} +11 -6
  35. package/dist/{project-not-found-aee676f3.cjs.prod.js → project-not-found-e58533fe.cjs.prod.js} +11 -6
  36. package/dist/{project-not-initialized-ed2395cc.cjs.dev.js → project-not-initialized-84e3fb90.cjs.dev.js} +11 -6
  37. package/dist/{project-not-initialized-855e47a8.cjs.prod.js → project-not-initialized-8bb6ed39.cjs.prod.js} +11 -6
  38. package/dist/{project-not-initialized-3f005d66.esm.js → project-not-initialized-a94f1b5f.esm.js} +10 -6
  39. package/dist/{project-suspended-4a17383b.cjs.dev.js → project-suspended-0f034e4b.cjs.dev.js} +11 -6
  40. package/dist/{project-suspended-030ffee4.esm.js → project-suspended-11c0922f.esm.js} +10 -6
  41. package/dist/{project-suspended-3ef95f71.cjs.prod.js → project-suspended-97719959.cjs.prod.js} +11 -6
  42. package/dist/{quick-access-04797c0b.esm.js → quick-access-30f03bb7.esm.js} +4 -3
  43. package/dist/{quick-access-a40b1e0f.cjs.dev.js → quick-access-38f0f00b.cjs.dev.js} +4 -3
  44. package/dist/{quick-access-bd6496a4.cjs.prod.js → quick-access-e5dc862b.cjs.prod.js} +4 -3
  45. package/dist/{redirect-to-logout-86110e8c.cjs.dev.js → redirect-to-logout-41844c82.cjs.dev.js} +4 -3
  46. package/dist/{redirect-to-logout-9b60153e.esm.js → redirect-to-logout-7c639f12.esm.js} +4 -3
  47. package/dist/{redirect-to-logout-9b9b32c5.cjs.prod.js → redirect-to-logout-ca90976f.cjs.prod.js} +4 -3
  48. package/dist/{requests-in-flight-loader-6ab1fa05.cjs.dev.js → requests-in-flight-loader-4ac1d932.cjs.dev.js} +4 -3
  49. package/dist/{requests-in-flight-loader-f5ea48c9.cjs.prod.js → requests-in-flight-loader-b424edc1.cjs.prod.js} +4 -3
  50. package/dist/{requests-in-flight-loader-0f883386.esm.js → requests-in-flight-loader-c4a2a25c.esm.js} +4 -3
  51. package/dist/{service-page-project-switcher-b35c912b.cjs.dev.js → service-page-project-switcher-4ebb1a0d.cjs.dev.js} +1 -1
  52. package/dist/{service-page-project-switcher-7cddddfb.cjs.prod.js → service-page-project-switcher-88dd5edd.cjs.prod.js} +1 -1
  53. package/dist/{service-page-project-switcher-1b1fa2df.esm.js → service-page-project-switcher-d96a616b.esm.js} +1 -1
  54. package/dist/user-settings-menu-204c57e4.esm.js +341 -0
  55. package/dist/{user-settings-menu-1314b25d.cjs.prod.js → user-settings-menu-daa096fd.cjs.prod.js} +4 -1
  56. package/dist/user-settings-menu-f6f32579.cjs.dev.js +367 -0
  57. package/dist/{version-tracker-f54893c4.cjs.dev.js → version-tracker-45fd88f3.cjs.dev.js} +4 -3
  58. package/dist/{version-tracker-15416b7d.cjs.prod.js → version-tracker-b283cce0.cjs.prod.js} +4 -3
  59. package/dist/{version-tracker-acf36f46.esm.js → version-tracker-ee73d02f.esm.js} +4 -3
  60. package/package.json +37 -35
  61. package/dist/navbar-17317c0f.cjs.dev.js +0 -1334
  62. package/dist/navbar-2af36692.esm.js +0 -1301
  63. package/dist/user-settings-menu-60dc5e0a.cjs.dev.js +0 -364
  64. package/dist/user-settings-menu-dcbb0bd3.esm.js +0 -338
@@ -26,6 +26,7 @@ var Spacings = require('@commercetools-uikit/spacings');
26
26
  var _taggedTemplateLiteral = require('@babel/runtime-corejs3/helpers/taggedTemplateLiteral');
27
27
  var _styled = require('@emotion/styled/base');
28
28
  var react = require('@emotion/react');
29
+ var applicationComponents = require('@commercetools-frontend/application-components');
29
30
  var designSystem = require('@commercetools-uikit/design-system');
30
31
  var oidc = require('./oidc-cfa56c46.cjs.prod.js');
31
32
  var _objectWithoutProperties = require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
@@ -110,23 +111,20 @@ var _ref5 = {
110
111
  const getContainerPositionBasedOnMenuItemPosition = (isSubmenuAboveMenuItem, isSublistActiveWhileIsMenuExpanded, isSublistActiveWhileIsMenuCollapsed) => [isSublistActiveWhileIsMenuCollapsed && /*#__PURE__*/react.css(isSubmenuAboveMenuItem ? 'bottom' : 'top', ":-", oidc.NAVBAR.itemSize, ";" + ("" ), "" ), isSublistActiveWhileIsMenuExpanded && isSubmenuAboveMenuItem && _ref5, isSublistActiveWhileIsMenuExpanded && !isSubmenuAboveMenuItem && _ref4];
111
112
  const Faded = /*#__PURE__*/_styled__default["default"]("div", {
112
113
  target: "e1i568cv8"
113
- } )({
114
- name: "16qr508",
115
- styles: "position:absolute;top:-32px;height:32px;width:100%;background:linear-gradient(180deg, rgba(0, 153, 135, 0) 0%, #00b39e 100%);z-index:1"
116
- } );
114
+ } )("position:absolute;top:-32px;height:32px;width:100%;background:linear-gradient(180deg, rgba(0, 153, 135, 0) 0%, #00b39e 100%);z-index:1;visibility:", applicationComponents.designTokens.visibilityForNavbarFaded, ";" + ("" ));
117
115
  var _ref3 = {
118
116
  name: "eivff4",
119
117
  styles: "display:none"
120
118
  } ;
121
119
  const Expander = /*#__PURE__*/_styled__default["default"]("li", {
122
120
  target: "e1i568cv7"
123
- } )("display:flex;align-items:center;justify-content:center;background:linear-gradient(\n 180deg,\n ", designSystem.designTokens.colorPrimary, " 0%,\n ", designSystem.designTokens.colorPrimary25, " 100%\n );padding:", designSystem.designTokens.spacing30, " ", designSystem.designTokens.spacing25, ";", props => !props.isVisible && _ref3, "::before{content:'';position:absolute;top:", oidc.NAVBAR.itemHeight, ";height:1px;background:rgba(255, 255, 255, 0.5);width:calc(100% - 2 * ", designSystem.designTokens.spacing30, ");}:hover,:focus{background-color:", designSystem.designTokens.colorPrimary40, ";}" + ("" ));
121
+ } )("display:flex;align-items:center;justify-content:center;background:", applicationComponents.designTokens.backgroundColorForNavbarExpander, ";padding:", designSystem.designTokens.spacing30, " ", designSystem.designTokens.spacing25, ";", props => !props.isVisible && _ref3, "::before{content:'';position:absolute;top:", oidc.NAVBAR.itemHeight, ";height:1px;background:rgba(255, 255, 255, 0.5);width:calc(100% - 2 * ", designSystem.designTokens.spacing30, ");}:hover,:focus{background-color:", applicationComponents.designTokens.backgroundColorForNavbarExpanderWhenHovered, ";}" + ("" ));
124
122
  const ExpanderIcon = /*#__PURE__*/_styled__default["default"]("div", {
125
123
  target: "e1i568cv6"
126
124
  } )("height:", oidc.NAVBAR.expanderSize, ";width:", oidc.NAVBAR.expanderSize, ";border-radius:", designSystem.designTokens.borderRadius4, ";padding:", designSystem.designTokens.spacing20, ";background:rgba(255, 255, 255, 0.2);display:flex;justify-content:center;align-items:center;:hover,:focus{background:rgba(255, 255, 255, 0.3);cursor:pointer;}" + ("" ));
127
125
  const LeftNavigation = /*#__PURE__*/_styled__default["default"]("nav", {
128
126
  target: "e1i568cv5"
129
- } )("display:grid;width:", oidc.NAVBAR.widthLeftNavigation, ";background:", designSystem.designTokens.colorPrimary, ";height:100%;grid-template-rows:56px 1fr;transition:", oidc.NAVBAR.leftNavigationTransition, ";" + ("" ));
127
+ } )("display:grid;width:", oidc.NAVBAR.widthLeftNavigation, ";background:", applicationComponents.designTokens.backgroundColorForNavbar, ";height:100%;grid-template-rows:56px 1fr;transition:", oidc.NAVBAR.leftNavigationTransition, ";" + ("" ));
130
128
  const TextLinkSublistWrapper = /*#__PURE__*/_styled__default["default"]("div", {
131
129
  target: "e1i568cv4"
132
130
  } )({
@@ -155,14 +153,14 @@ const MenuList = /*#__PURE__*/_styled__default["default"]("ul", {
155
153
  props.submenuVerticalPosition === 0 && _ref2, (props.isSublistActiveWhileIsMenuExpanded || props.isSublistCollapsedAndActive || props.isSublistCollapsedAndActiveAndAbove) && /*#__PURE__*/react.css("opacity:1;display:none;text-align:left;background-color:", designSystem.designTokens.colorAccent20, ";::before{content:'';position:absolute;display:block;width:calc(", oidc.NAVBAR.sublistWidth, " + ", designSystem.designTokens.spacing20, ");height:", oidc.NAVBAR.itemSize, ";left:calc(-1 * ", designSystem.designTokens.spacing20, ");", getContainerPositionBasedOnMenuItemPosition(props.isSubmenuAboveMenuItem, props.isSublistActiveWhileIsMenuExpanded, props.isSublistActiveWhileIsMenuCollapsed), ";}" + ("" ), "" )], " & .highlighted,& .highlighted ", Title, "{color:", designSystem.designTokens.colorSurface, "!important;font-weight:", designSystem.designTokens.fontWeight600, ";}" + ("" ));
156
154
  const SublistItem = /*#__PURE__*/_styled__default["default"]("li", {
157
155
  target: "e1i568cv1"
158
- } )("display:flex;align-items:center;align-self:stretch;", props => [props.isActive && /*#__PURE__*/react.css("border-radius:", designSystem.designTokens.borderRadius4, ";background:", designSystem.designTokens.colorAccent30, ";" + ("" ), "" ), !props.isActive && /*#__PURE__*/react.css(":hover,:focus-within{color:", designSystem.designTokens.colorSurface, ";font-weight:", designSystem.designTokens.fontWeight600, ";border-radius:", designSystem.designTokens.borderRadius4, ";background:", designSystem.designTokens.colorPrimary95, ";[data-link-level='text-link-sublist']{padding:", designSystem.designTokens.spacing25, " ", designSystem.designTokens.spacing25, " ", designSystem.designTokens.spacing25, " calc(\n ", designSystem.designTokens.spacing30, " + ", designSystem.designTokens.spacing20, "\n );}}" + ("" ), "" )], ";" + ("" ));
156
+ } )("display:flex;align-items:center;align-self:stretch;", props => [props.isActive && /*#__PURE__*/react.css("border-radius:", designSystem.designTokens.borderRadius4, ";background:", applicationComponents.designTokens.backgroundColorForNavbarSubmenuItemWhenActive, ";" + ("" ), "" ), !props.isActive && /*#__PURE__*/react.css(":hover,:focus-within{color:", designSystem.designTokens.colorSurface, ";font-weight:", designSystem.designTokens.fontWeight600, ";border-radius:", designSystem.designTokens.borderRadius4, ";background:", designSystem.designTokens.colorPrimary95, ";[data-link-level='text-link-sublist']{padding:", designSystem.designTokens.spacing25, " ", designSystem.designTokens.spacing25, " ", designSystem.designTokens.spacing25, " calc(\n ", designSystem.designTokens.spacing30, " + ", designSystem.designTokens.spacing20, "\n );}}" + ("" ), "" )], ";" + ("" ));
159
157
  var _ref = {
160
158
  name: "1azakc",
161
159
  styles: "text-align:center"
162
160
  } ;
163
161
  const MenuListItem = /*#__PURE__*/_styled__default["default"]("li", {
164
162
  target: "e1i568cv0"
165
- } )("height:", oidc.NAVBAR.itemSize, ";width:", oidc.NAVBAR.itemSize, ";margin:0;background:", designSystem.designTokens.colorPrimary, ";list-style:none;cursor:pointer;", IconWrapper, "{width:auto;display:flex;justify-content:center;align-self:flex-start;}", props => [props.isRouteActive && /*#__PURE__*/react.css("background:", designSystem.designTokens.colorAccent30, ";border-radius:", designSystem.designTokens.borderRadius8, ";" + ("" ), "" ), !props.isRouteActive && /*#__PURE__*/react.css(":hover,:focus-within{background-color:", designSystem.designTokens.colorPrimary40, ";border-radius:", designSystem.designTokens.borderRadius8, ";}" + ("" ), "" ), props.isActive && /*#__PURE__*/react.css(ItemIconText, "{justify-content:flex-start;}" + ("" ), "" ), !props.isActive && /*#__PURE__*/react.css(":hover ", Icon, ">svg *:not([fill='none']),:focus-within ", Icon, ">svg *:not([fill='none']){fill:", designSystem.designTokens.colorSurface, ";}:hover .", Title, ",:focus-within ", Title, "{color:", designSystem.designTokens.colorSurface, ";}" + ("" ), "" ), props.isCollapsed && _ref], " :hover ", Title, ",:focus-within ", Title, "{margin-left:calc(", designSystem.designTokens.spacing25, " + 2px);}:hover ", Icon, ",:focus-within ", Icon, "{transform:scale(1.2);}:hover ", MenuList, ".sublist-collapsed__active,:hover ", MenuList, ".sublist-collapsed__active__above,:hover ", MenuList, ".sublist-expanded__active,:focus-within ", MenuList, ".sublist-collapsed__active,:focus-within ", MenuList, ".sublist-collapsed__active__above,:focus-within ", MenuList, ".sublist-expanded__active{display:flex;flex-direction:column;align-items:flex-start;background-color:", designSystem.designTokens.colorSurface, ";min-height:", oidc.NAVBAR.sublistItemMinHeight, ";width:", oidc.NAVBAR.sublistWidth, ";border-radius:", designSystem.designTokens.borderRadius8, ";z-index:20001;box-shadow:-2px 4px 25px 0 rgba(89, 89, 89, 0.5);}:hover ", MenuList, ".sublist-collapsed__active.sublist-collapsed__empty,:hover ", MenuList, ".sublist-collapsed__active__above.sublist-collapsed__empty,:focus-within ", MenuList, ".sublist-collapsed__active.sublist-collapsed__empty,:focus-within ", MenuList, ".sublist-collapsed__active__above.sublist-collapsed__empty{visibility:hidden;}:hover ", MenuList, ".sublist-expanded__active,:focus-within ", MenuList, ".sublist-expanded__active{left:", oidc.NAVBAR.sublistIndentationWhenExpanded, ";}" + ("" ));
163
+ } )("height:", oidc.NAVBAR.itemSize, ";width:", oidc.NAVBAR.itemSize, ";margin:0;background:", applicationComponents.designTokens.backgroundColorForNavbar, ";list-style:none;cursor:pointer;", IconWrapper, "{width:auto;display:flex;justify-content:center;}", props => [props.isRouteActive && /*#__PURE__*/react.css("background:", applicationComponents.designTokens.backgroundColorForNavbarMenuItemWhenActive, ";border-radius:", designSystem.designTokens.borderRadius8, ";" + ("" ), "" ), !props.isRouteActive && /*#__PURE__*/react.css(":hover,:focus-within{background-color:", applicationComponents.designTokens.backgroundColorForNavbarMenuItemWhenHovered, ";border-radius:", designSystem.designTokens.borderRadius8, ";}" + ("" ), "" ), props.isActive && /*#__PURE__*/react.css(ItemIconText, "{justify-content:flex-start;}" + ("" ), "" ), !props.isActive && /*#__PURE__*/react.css(":hover ", Icon, ">svg *:not([fill='none']),:focus-within ", Icon, ">svg *:not([fill='none']){fill:", designSystem.designTokens.colorSurface, ";}:hover .", Title, ",:focus-within ", Title, "{color:", designSystem.designTokens.colorSurface, ";}" + ("" ), "" ), props.isCollapsed && _ref], " :hover ", Title, ",:focus-within ", Title, "{margin-left:calc(", designSystem.designTokens.spacing25, " + 2px);}:hover ", Icon, ",:focus-within ", Icon, "{transform:scale(1.2);}:hover ", MenuList, ".sublist-collapsed__active,:hover ", MenuList, ".sublist-collapsed__active__above,:hover ", MenuList, ".sublist-expanded__active,:focus-within ", MenuList, ".sublist-collapsed__active,:focus-within ", MenuList, ".sublist-collapsed__active__above,:focus-within ", MenuList, ".sublist-expanded__active{display:flex;flex-direction:column;align-items:flex-start;background-color:", designSystem.designTokens.colorSurface, ";min-height:", oidc.NAVBAR.sublistItemMinHeight, ";width:", oidc.NAVBAR.sublistWidth, ";border-radius:", designSystem.designTokens.borderRadius8, ";z-index:20001;box-shadow:-2px 4px 25px 0 rgba(89, 89, 89, 0.5);}:hover ", MenuList, ".sublist-collapsed__active.sublist-collapsed__empty,:hover ", MenuList, ".sublist-collapsed__active__above.sublist-collapsed__empty,:focus-within ", MenuList, ".sublist-collapsed__active.sublist-collapsed__empty,:focus-within ", MenuList, ".sublist-collapsed__active__above.sublist-collapsed__empty{visibility:hidden;}:hover ", MenuList, ".sublist-expanded__active,:focus-within ", MenuList, ".sublist-expanded__active{left:", oidc.NAVBAR.sublistIndentationWhenExpanded, ";}" + ("" ));
166
164
 
167
165
  var _templateObject;
168
166
  const visible = react.keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n"])));
@@ -178,7 +176,7 @@ const ScrollableMenu = /*#__PURE__*/_styled__default["default"]("div", {
178
176
  const leftNavigationOpenStyles = /*#__PURE__*/react.css(".body__menu-open ", LeftNavigation, "{transition:", oidc.NAVBAR.leftNavigationTransition, ";width:", oidc.NAVBAR.widthLeftNavigationWhenExpanded, ";}.body__menu-open ", ScrollableMenu, "{width:", oidc.NAVBAR.widthLeftNavigationWhenExpanded, ";}.body__menu-open ", FixedMenu, "{width:", oidc.NAVBAR.widthLeftNavigationWhenExpanded, ";}.body__menu-open [data-link-level='text-link']{justify-content:start;}.body__menu-open ", MenuListItem, "{height:auto;min-height:", oidc.NAVBAR.itemSize, ";width:calc(\n ", oidc.NAVBAR.sublistIndentationWhenExpanded, " - 2 *\n ", designSystem.designTokens.spacing25, "\n );&.active{max-height:500px;transition:max-height 0.25s ease-in;", ItemIconText, "{position:relative;width:auto;margin-left:0;}}", Title, "{opacity:1;margin-left:", designSystem.designTokens.spacing25, ";color:", designSystem.designTokens.colorSurface, ";transition:", oidc.NAVBAR.leftNavigationTransition, ";animation:", visible, " 150ms cubic-bezier(1, 0, 0.58, 1);}}.body__menu-open ", ItemContent, "{width:100%;}" + ("" ), "" );
179
177
  const NavigationHeader = /*#__PURE__*/_styled__default["default"]("div", {
180
178
  target: "e1meml8k6"
181
- } )("background-color:", designSystem.designTokens.colorAccent10, ";color:", designSystem.designTokens.colorSurface, ";display:flex;justify-content:center;flex-direction:row;align-items:center;padding:", designSystem.designTokens.spacing30, ";" + ("" ));
179
+ } )("background-color:", applicationComponents.designTokens.backgroundColorForNavbarHeader, ";color:", designSystem.designTokens.colorSurface, ";display:flex;justify-content:center;flex-direction:row;align-items:center;padding:", designSystem.designTokens.spacing30, ";" + ("" ));
182
180
  const HeaderTitle = /*#__PURE__*/_styled__default["default"]("div", {
183
181
  target: "e1meml8k5"
184
182
  } )("font-weight:600;margin-left:", designSystem.designTokens.spacing20, ";transition:", oidc.NAVBAR.leftNavigationTransition, ";animation:", visible, " 150ms cubic-bezier(1, 0, 0.58, 1);" + ("" ));
@@ -519,13 +517,13 @@ const NavBarLayout = props => {
519
517
  NavBarLayout.propTypes = {};
520
518
  const NavBarHeader = /*#__PURE__*/_styled__default["default"]("div", {
521
519
  target: "epfjvz37"
522
- } )("display:flex;justify-content:center;align-items:center;padding:", designSystem.designTokens.spacing30, ";height:", oidc.DIMENSIONS.header, ";background:", designSystem.designTokens.colorAccent10, ";" + ("" ));
520
+ } )("display:flex;justify-content:center;align-items:center;padding:", designSystem.designTokens.spacing30, ";height:", oidc.DIMENSIONS.header, ";background:", applicationComponents.designTokens.backgroundColorForNavbarHeader, ";" + ("" ));
523
521
  const NavBarBody = /*#__PURE__*/_styled__default["default"]("div", {
524
522
  target: "epfjvz36"
525
- } )("display:flex;flex:1;padding:", designSystem.designTokens.spacing30, ";flex-direction:column;align-items:flex-start;gap:", designSystem.designTokens.spacing40, ";flex-shrink:0;background:#009987;position:relative;&::after{content:'';position:absolute;bottom:0;height:36px;width:calc(100% - 2 * ", designSystem.designTokens.spacing30, ");background:linear-gradient(180deg, rgba(0, 153, 135, 0) 0%, #009987 100%);}" + ("" ));
523
+ } )("display:flex;flex:1;padding:", designSystem.designTokens.spacing30, ";flex-direction:column;align-items:flex-start;gap:", designSystem.designTokens.spacing40, ";flex-shrink:0;background:", applicationComponents.designTokens.backgroundColorForNavbarSkeleton, ";position:relative;&::after{content:'';position:absolute;bottom:0;height:36px;width:calc(100% - 2 * ", designSystem.designTokens.spacing30, ");background:linear-gradient(180deg, rgba(0, 153, 135, 0) 0%, #009987 100%);visibility:", applicationComponents.designTokens.visibilityForNavbarFaded, ";}" + ("" ));
526
524
  const NavBarFooter = /*#__PURE__*/_styled__default["default"]("div", {
527
525
  target: "epfjvz35"
528
- } )("position:relative;display:flex;width:100%;flex-direction:column;background:linear-gradient(180deg, #009987 0%, #004d44 100%);padding:", designSystem.designTokens.spacing30, " ", props => props.isExpanded ? '58px' : '0px', ";justify-content:center;align-items:center;&::before{content:'';position:absolute;top:0;height:1px;width:calc(100% - 2 * ", designSystem.designTokens.spacing30, ");background:rgba(255, 255, 255, 0.5);}" + ("" ));
526
+ } )("position:relative;display:flex;width:100%;flex-direction:column;background:", applicationComponents.designTokens.backgroundColorForNavbarSkeletonFooter, ";padding:", designSystem.designTokens.spacing30, " ", props => props.isExpanded ? '58px' : '0px', ";justify-content:center;align-items:center;&::before{content:'';position:absolute;top:0;height:1px;width:calc(100% - 2 * ", designSystem.designTokens.spacing30, ");background:rgba(255, 255, 255, 0.5);}" + ("" ));
529
527
  const ExpandIcon = /*#__PURE__*/_styled__default["default"]("div", {
530
528
  target: "epfjvz34"
531
529
  } )("width:40px;height:40px;border-radius:", designSystem.designTokens.borderRadius4, ";background:rgba(255, 255, 255, 0.2);" + ("" ));