@laerdal/life-react-components 2.0.1-dev.9.full → 2.1.0-dev.3

package/dist/GlobalNavigationBar/desktop/RightSideNav.js.map

@@ -1 +1 @@
-{"version":3,"file":"RightSideNav.js","names":["React","styled","NavLink","NavItem","BREAKPOINTS","ComponentTextStyle","Button","ComponentMStyling","defaultOnMouseDownHandler","NavContainer","div","SMALL","LARGE","SecondaryButton","Bold","RightSideNav","items","action","getNavItem","item","disabled","label","to","e","reverse","map","no"],"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\n\nimport {NavItem} from '../../NavItem';\nimport {BREAKPOINTS, ComponentTextStyle} from '../../styles';\nimport {Button} from '../../Button';\nimport {ComponentMStyling} from '../../styles';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuButton, MenuNavigationItemTypeItem} from '../types';\n\nconst NavContainer = styled.div`\n  display: flex;\n  margin: auto 0 auto auto;\n  align-items: center;\n  height: 48px;\n\n  a {\n    text-decoration: none;\n  }\n\n  ${BREAKPOINTS.SMALL} {\n    height: 56px;\n  }\n\n  ${BREAKPOINTS.LARGE} {\n    height: 64px;\n  }\n\n  button,\n  div {\n    &:hover {\n      cursor: pointer;\n    }\n  }\n`;\n\nconst SecondaryButton = styled(Button)`\n  height: 40px;\n  margin: 0 8px;\n\n  ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\n`;\n\ntype Props = {\n  items?: MenuNavigationItemTypeItem[];\n  action?: MenuButton;\n};\n\nconst RightSideNav = ({items, action}: Props): React.ReactElement<Props> => {\n  const getNavItem = (item: MenuNavigationItemTypeItem) => {\n    if (item?.disabled) {\n      return (\n        <NavItem as={Button} className=\"disabled\" key={item?.label}>\n          {item?.label}\n        </NavItem>\n      );\n    } else {\n      return (\n        <NavItem\n          as={NavLink}\n          to={item?.to || ''}\n          key={item?.label}\n          onMouseDown={defaultOnMouseDownHandler}\n          onClick={(e:React.MouseEvent) => item.action && item.action(e)}>\n          {item?.label}\n        </NavItem>\n      );\n    }\n  };\n  return (\n    <NavContainer>\n      {items?.reverse().map(no => getNavItem(no))}\n\n      {\n        action &&\n        <SecondaryButton variant=\"secondary\" onClick={action?.action}>\n          {action.label}\n        </SecondaryButton>\n      }\n    </NavContainer>\n  );\n};\n\nexport default RightSideNav;\n"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,OAAR,QAAsB,kBAAtB;AAEA,SAAQC,OAAR,QAAsB,eAAtB;AACA,SAAQC,WAAR,EAAqBC,kBAArB,QAA8C,cAA9C;AACA,SAAQC,MAAR,QAAqB,cAArB;AACA,SAAQC,iBAAR,QAAgC,cAAhC;AACA,SAAQC,yBAAR,QAAwC,cAAxC;;;AAGA,IAAMC,YAAY,GAAGR,MAAM,CAACS,GAAV,2VAUdN,WAAW,CAACO,KAVE,EAcdP,WAAW,CAACQ,KAdE,CAAlB;AA0BA,IAAMC,eAAe,GAAGZ,MAAM,CAACK,MAAD,CAAT,uHAIjBC,iBAAiB,CAACF,kBAAkB,CAACS,IAApB,EAA0B,OAA1B,CAJA,CAArB;;AAYA,IAAMC,YAAY,GAAG,SAAfA,YAAe,OAAuD;EAAA,IAArDC,KAAqD,QAArDA,KAAqD;EAAA,IAA9CC,MAA8C,QAA9CA,MAA8C;;EAC1E,IAAMC,UAAU,GAAG,SAAbA,UAAa,CAACC,IAAD,EAAsC;IACvD,IAAIA,IAAJ,aAAIA,IAAJ,eAAIA,IAAI,CAAEC,QAAV,EAAoB;MAClB,oBACE,KAAC,OAAD;QAAS,EAAE,EAAEd,MAAb;QAAqB,SAAS,EAAC,UAA/B;QAAA,UACGa,IADH,aACGA,IADH,uBACGA,IAAI,CAAEE;MADT,GAA+CF,IAA/C,aAA+CA,IAA/C,uBAA+CA,IAAI,CAAEE,KAArD,CADF;IAKD,CAND,MAMO;MACL,oBACE,KAAC,OAAD;QACE,EAAE,EAAEnB,OADN;QAEE,EAAE,EAAE,CAAAiB,IAAI,SAAJ,IAAAA,IAAI,WAAJ,YAAAA,IAAI,CAAEG,EAAN,KAAY,EAFlB;QAIE,WAAW,EAAEd,yBAJf;QAKE,OAAO,EAAE,iBAACe,CAAD;UAAA,OAAwBJ,IAAI,CAACF,MAAL,IAAeE,IAAI,CAACF,MAAL,CAAYM,CAAZ,CAAvC;QAAA,CALX;QAAA,UAMGJ,IANH,aAMGA,IANH,uBAMGA,IAAI,CAAEE;MANT,GAGOF,IAHP,aAGOA,IAHP,uBAGOA,IAAI,CAAEE,KAHb,CADF;IAUD;EACF,CAnBD;;EAoBA,oBACE,MAAC,YAAD;IAAA,WACGL,KADH,aACGA,KADH,uBACGA,KAAK,CAAEQ,OAAP,GAAiBC,GAAjB,CAAqB,UAAAC,EAAE;MAAA,OAAIR,UAAU,CAACQ,EAAD,CAAd;IAAA,CAAvB,CADH,EAIIT,MAAM,iBACN,KAAC,eAAD;MAAiB,OAAO,EAAC,WAAzB;MAAqC,OAAO,EAAEA,MAAF,aAAEA,MAAF,uBAAEA,MAAM,CAAEA,MAAtD;MAAA,UACGA,MAAM,CAACI;IADV,EALJ;EAAA,EADF;AAYD,CAjCD;;;EAJEL,K;;AAuCF,eAAeD,YAAf"}
+{"version":3,"file":"RightSideNav.js","names":["React","styled","NavLink","NavItem","BREAKPOINTS","ComponentTextStyle","Button","ComponentMStyling","defaultOnMouseDownHandler","NavContainer","div","SMALL","LARGE","SecondaryButton","Bold","RightSideNav","items","action","getNavItem","item","disabled","label","to","e","reverse","map","no"],"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\n\nimport {NavItem} from '../../NavItem';\nimport {BREAKPOINTS, ComponentTextStyle} from '../../styles';\nimport {Button} from '../../Button';\nimport {ComponentMStyling} from '../../styles';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuButton, MenuNavigationItemTypeItem} from '../types';\n\nconst NavContainer = styled.div`\n  display: flex;\n  margin: auto 0 auto auto;\n  align-items: center;\n  height: 48px;\n\n  a {\n    text-decoration: none;\n  }\n\n  ${BREAKPOINTS.SMALL} {\n    height: 56px;\n  }\n\n  ${BREAKPOINTS.LARGE} {\n    height: 64px;\n  }\n\n  button,\n  div {\n    &:hover {\n      cursor: pointer;\n    }\n  }\n`;\n\nconst SecondaryButton = styled(Button)`\n  height: 40px;\n  margin: 0 8px;\n\n  ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\n`;\n\ntype Props = {\n  items?: MenuNavigationItemTypeItem[];\n  action?: MenuButton;\n};\n\nconst RightSideNav = ({items, action}: Props): React.ReactElement<Props> => {\n  const getNavItem = (item: MenuNavigationItemTypeItem) => {\n    if (item?.disabled) {\n      return (\n        <NavItem as={Button} className=\"disabled\" key={item?.label}>\n          {item?.label}\n        </NavItem>\n      );\n    } else {\n      return (\n        <NavItem\n          as={NavLink}\n          to={item?.to || ''}\n          key={item?.label}\n          onMouseDown={defaultOnMouseDownHandler}\n          onClick={(e:React.MouseEvent) => item.action && item.action(e)}>\n          {item?.label}\n        </NavItem>\n      );\n    }\n  };\n  return (\n    <NavContainer>\n      {items?.reverse().map(no => getNavItem(no))}\n\n      {\n        action &&\n        <SecondaryButton variant=\"secondary\" onClick={action?.action}>\n          {action.label}\n        </SecondaryButton>\n      }\n    </NavContainer>\n  );\n};\n\nexport default RightSideNav;\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAAQC,OAAO,QAAO,kBAAkB;AAExC,SAAQC,OAAO,QAAO,eAAe;AACrC,SAAQC,WAAW,EAAEC,kBAAkB,QAAO,cAAc;AAC5D,SAAQC,MAAM,QAAO,cAAc;AACnC,SAAQC,iBAAiB,QAAO,cAAc;AAC9C,SAAQC,yBAAyB,QAAO,cAAc;AAAC;AAAA;AAGvD,IAAMC,YAAY,GAAGR,MAAM,CAACS,GAAG,2VAU3BN,WAAW,CAACO,KAAK,EAIjBP,WAAW,CAACQ,KAAK,CAUpB;AAED,IAAMC,eAAe,GAAGZ,MAAM,CAACK,MAAM,CAAC,uHAIlCC,iBAAiB,CAACF,kBAAkB,CAACS,IAAI,EAAE,OAAO,CAAC,CACtD;AAOD,IAAMC,YAAY,GAAG,SAAfA,YAAY,OAA0D;EAAA,IAArDC,KAAK,QAALA,KAAK;IAAEC,MAAM,QAANA,MAAM;EAClC,IAAMC,UAAU,GAAG,SAAbA,UAAU,CAAIC,IAAgC,EAAK;IACvD,IAAIA,IAAI,aAAJA,IAAI,eAAJA,IAAI,CAAEC,QAAQ,EAAE;MAClB,oBACE,KAAC,OAAO;QAAC,EAAE,EAAEd,MAAO;QAAC,SAAS,EAAC,UAAU;QAAA,UACtCa,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE;MAAK,GADiCF,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE,KAAK,CAEhD;IAEd,CAAC,MAAM;MACL,oBACE,KAAC,OAAO;QACN,EAAE,EAAEnB,OAAQ;QACZ,EAAE,EAAE,CAAAiB,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEG,EAAE,KAAI,EAAG;QAEnB,WAAW,EAAEd,yBAA0B;QACvC,OAAO,EAAE,iBAACe,CAAkB;UAAA,OAAKJ,IAAI,CAACF,MAAM,IAAIE,IAAI,CAACF,MAAM,CAACM,CAAC,CAAC;QAAA,CAAC;QAAA,UAC9DJ,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE;MAAK,GAHPF,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE,KAAK,CAIR;IAEd;EACF,CAAC;EACD,oBACE,MAAC,YAAY;IAAA,WACVL,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEQ,OAAO,EAAE,CAACC,GAAG,CAAC,UAAAC,EAAE;MAAA,OAAIR,UAAU,CAACQ,EAAE,CAAC;IAAA,EAAC,EAGzCT,MAAM,iBACN,KAAC,eAAe;MAAC,OAAO,EAAC,WAAW;MAAC,OAAO,EAAEA,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEA,MAAO;MAAA,UAC1DA,MAAM,CAACI;IAAK,EACG;EAAA,EAEP;AAEnB,CAAC;AAAC;EArCAL,KAAK;AAAA;AAuCP,eAAeD,YAAY"}

package/dist/GlobalNavigationBar/desktop/UserMenu.cjs

@@ -1,103 +1,64 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _Button = require("../../Button");
-
 var _styles = require("../../styles");
-
 var _types = require("../../types");
-
 var _CommonStyles = require("../mobile/CommonStyles");
-
 var _icons = require("../../icons");
-
 var _HyperLink = require("../../HyperLink");
-
 var _breakpoints = _interopRequireDefault(require("../../styles/breakpoints"));
-
 var _MenuItem = require("../../MenuItem");
-
 var _NavigationHelper = require("../../common/NavigationHelper");
-
 var _ProfileButton = require("../../ProfileButton");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 var UserMenuScrollContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  flex: 1;\n"])));
-
 var UserMenuPinnedContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)([""])));
-
 var UserMenuWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  margin: 0;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: none;\n  width: 320px;\n\n  position: absolute;\n\n  &.show {\n    display: block;\n  }\n\n  top: 0;\n  right: 0;\n  z-index: ", ";\n  height: 100%;\n  flex-flow: column;\n\n\n  ", " {\n    flex-flow: initial;\n    top: initial;\n    right: initial;\n    height: initial;\n    animation: ", " 0.2s ease-in-out;\n    box-shadow: ", ";\n    border-radius: 8px;\n    border: 1px solid ", ";\n    z-index: ", ";\n    padding: 24px 0;\n  }\n"])), _styles.COLORS.white, _styles.Z_INDEXES.off_canvas, _breakpoints.default.MEDIUM, _CommonStyles.flowDown, _styles.BOXSHADOWS.BOXSHADOW_CENTERED, _styles.COLORS.neutral_200, _styles.Z_INDEXES.fixed_menu);
-
 var MenuSection = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  padding: 4px 0;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ", ";\n  }\n"])), _styles.COLORS.neutral_200);
-
 var SignOutActionWrapper = (0, _styledComponents.default)(MenuSection)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  align-items: center;\n  justify-content: center;\n"])));
-
 var MenuSectionHeader = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  padding: 8px 24px 4px 24px;\n  box-sizing: border-box;\n  min-height: 32px;\n  background-color: ", ";\n\n  ", "\n"])), _styles.COLORS.neutral_20, (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.neutral_500));
-
 var MenuSectionList = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  margin: 0;\n  padding: 0;\n\n  ", ";\n"])), _CommonStyles.UserMenuSectionListStyling);
-
 var UserSectionAvatar = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n  pointer-events: none;\n\n  button {\n    padding: 0 !important;\n  }\n\n  button > div {\n    width: 48px !important;\n    height: 48px !important;\n    border-radius: 50% !important;\n  }\n"])));
-
 var UserSectionInfo = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n  padding: 2px 0;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n"])));
-
 var UserSectionInfoName = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n"])), (0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.neutral_600));
-
 var UserSectionInfoEmail = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n  word-break: break-all;\n  ", "\n"])), (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_500));
-
 var UserSectionInfoLink = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n  padding: 2px 0;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  ", "\n  svg {\n    width: 16px;\n    height: 16px;\n  }\n"])), (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Bold, null));
-
 var UserSection = _styledComponents.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: row;\n  padding: 0 24px 8px 24px;\n  gap: 16px;\n"])));
-
 var UserMenu = function UserMenu(_ref) {
   var show = _ref.show,
-      user = _ref.user,
-      onHideUserMenu = _ref.onHideUserMenu,
-      sections = _ref.sections,
-      signOut = _ref.signOut,
-      label = _ref.label;
-
+    user = _ref.user,
+    onHideUserMenu = _ref.onHideUserMenu,
+    sections = _ref.sections,
+    signOut = _ref.signOut,
+    label = _ref.label;
   var _useNavigationHelper = (0, _NavigationHelper.useNavigationHelper)(),
-      navigate = _useNavigationHelper.navigate,
-      isActiveRoute = _useNavigationHelper.isActiveRoute;
-
+    navigate = _useNavigationHelper.navigate,
+    isActiveRoute = _useNavigationHelper.isActiveRoute;
   React.useEffect(function () {
     if (!onHideUserMenu) return;
-
     function handleKeyPress(e) {
       if (e.key === 'Escape' || e.key === 'Esc') {
         onHideUserMenu();
       }
     }
-
     document.addEventListener('keydown', handleKeyPress, false);
     return function () {
       document.removeEventListener('keydown', handleKeyPress, false);
     };
   }, [onHideUserMenu]);
-
   var renderItem = function renderItem(item, section, index) {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuItem.MenuItem, {
       id: "profile_".concat(index),
@@ -114,7 +75,6 @@ var UserMenu = function UserMenu(_ref) {
       }
     }, index);
   };
-
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(UserMenuWrapper, {
     onClick: onHideUserMenu,
     className: show ? 'show' : '',
@@ -194,7 +154,6 @@ var UserMenu = function UserMenu(_ref) {
     })]
   });
 };
-
 UserMenu.propTypes = {
   show: _propTypes.default.bool,
   onHideUserMenu: _propTypes.default.func.isRequired

package/dist/GlobalNavigationBar/desktop/UserMenu.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"UserMenu.cjs","names":["UserMenuScrollContainer","styled","div","UserMenuPinnedContainer","UserMenuWrapper","COLORS","white","Z_INDEXES","off_canvas","Breakpoints","MEDIUM","flowDown","BOXSHADOWS","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","ComponentSStyling","ComponentTextStyle","Bold","neutral_500","MenuSectionList","UserMenuSectionListStyling","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","ComponentLStyling","neutral_600","UserSectionInfoEmail","ComponentXSStyling","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","useNavigationHelper","navigate","isActiveRoute","React","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Size","Large","preventDefault"],"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n  BOXSHADOWS,\n  COLORS,\n  ComponentLStyling,\n  ComponentSStyling,\n  ComponentTextStyle,\n  ComponentXSStyling,\n  Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../../common/NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n  flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n  margin: 0;\n  background-color: ${COLORS.white};\n  box-sizing: border-box;\n  display: none;\n  width: 320px;\n\n  position: absolute;\n\n  &.show {\n    display: block;\n  }\n\n  top: 0;\n  right: 0;\n  z-index: ${Z_INDEXES.off_canvas};\n  height: 100%;\n  flex-flow: column;\n\n\n  ${Breakpoints.MEDIUM} {\n    flex-flow: initial;\n    top: initial;\n    right: initial;\n    height: initial;\n    animation: ${flowDown} 0.2s ease-in-out;\n    box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n    border-radius: 8px;\n    border: 1px solid ${COLORS.neutral_200};\n    z-index: ${Z_INDEXES.fixed_menu};\n    padding: 24px 0;\n  }\n`;\n\n\nconst MenuSection = styled.div`\n  padding: 4px 0;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ${COLORS.neutral_200};\n  }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n  align-items: center;\n  justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n  display: flex;\n  align-items: center;\n  padding: 8px 24px 4px 24px;\n  box-sizing: border-box;\n  min-height: 32px;\n  background-color: ${COLORS.neutral_20};\n\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n  margin: 0;\n  padding: 0;\n\n  ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n  pointer-events: none;\n\n  button {\n    padding: 0 !important;\n  }\n\n  button > div {\n    width: 48px !important;\n    height: 48px !important;\n    border-radius: 50% !important;\n  }\n`;\n\nconst UserSectionInfo = styled.div`\n  padding: 2px 0;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n  ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n  word-break: break-all;\n  ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n  padding: 2px 0;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n  svg {\n    width: 16px;\n    height: 16px;\n  }\n`;\n\nconst UserSection = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 0 24px 8px 24px;\n  gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n  show?: boolean;\n  onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n  const {navigate, isActiveRoute} = useNavigationHelper();\n\n  React.useEffect(() => {\n    if (!onHideUserMenu) return;\n\n    function handleKeyPress(e: any) {\n      if (e.key === 'Escape' || e.key === 'Esc') {\n        onHideUserMenu();\n      }\n    }\n\n    document.addEventListener('keydown', handleKeyPress, false);\n    return () => {\n      document.removeEventListener('keydown', handleKeyPress, false);\n    };\n  }, [onHideUserMenu]);\n\n  const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n    <MenuItem key={index}\n              id={`profile_${index}`}\n              active={!item.external && isActiveRoute(item.to, !!item.exact)}\n              item={{\n                value: item.to,\n                disabled: item.disabled,\n                icon: item.icon,\n                displayLabel: item.label,\n              }}\n              onClickHandler={(e) => {\n                item.action && item.action(e);\n                navigate(item.to, !!item.external);\n              }}/>\n\n  return (\n    <UserMenuWrapper onClick={onHideUserMenu}\n                     className={show ? 'show' : ''}\n                     role=\"menu\"\n                     aria-labelledby=\"UserMenuButton\">\n      <UserMenuScrollContainer>\n        <UserSection>\n          <UserSectionAvatar>\n            <ProfileButton onClick={() => {\n            }}\n                           tabIndex={-1}\n                           initials={user.firstName[0] + user.lastName[0]}/>\n          </UserSectionAvatar>\n          <UserSectionInfo>\n            <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n            <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n            {\n              user.link &&\n              <HyperLink variant={'default'}\n                         href={user.link.href}\n                         target={user.link.target}\n                         id={user.link.id}\n                         onClick={user.link.onClick}>\n                <UserSectionInfoLink>\n                  <span>\n                    {user.link.label}\n                  </span>\n                  {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n                </UserSectionInfoLink>\n              </HyperLink>\n            }\n          </UserSectionInfo>\n        </UserSection>\n        {\n          sections.filter(a => !a.pinned).map((section, index) =>\n            <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n              <MenuSectionList key={index}>\n                {section.items.map((item, index) => renderItem(item, section, index))}\n              </MenuSectionList>\n            </MenuSection>\n          )\n        }\n      </UserMenuScrollContainer>\n      <UserMenuPinnedContainer>\n        {\n          sections.filter(a => !!a.pinned).map((section, index) =>\n            <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n              <MenuSectionList key={index}>\n                {section.items.map((item, index) => renderItem(item, section, index))}\n              </MenuSectionList>\n            </MenuSection>\n          )\n        }\n        {\n          signOut &&\n          <SignOutActionWrapper>\n            <Button width={'272px'}\n                    variant=\"secondary\"\n                    icon={<SystemIcons.Logout/>}\n                    size={Size.Large}\n                    onClick={e => {\n                      e.preventDefault();\n                      signOut?.action();\n                    }}>\n              {signOut?.label}\n            </Button>\n          </SignOutActionWrapper>\n        }\n      </UserMenuPinnedContainer>\n    </UserMenuWrapper>\n  );\n};\n\nexport default UserMenu;\n"],"mappings":"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"}
+{"version":3,"file":"UserMenu.cjs","names":["UserMenuScrollContainer","styled","div","UserMenuPinnedContainer","UserMenuWrapper","COLORS","white","Z_INDEXES","off_canvas","Breakpoints","MEDIUM","flowDown","BOXSHADOWS","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","ComponentSStyling","ComponentTextStyle","Bold","neutral_500","MenuSectionList","UserMenuSectionListStyling","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","ComponentLStyling","neutral_600","UserSectionInfoEmail","ComponentXSStyling","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","useNavigationHelper","navigate","isActiveRoute","React","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Size","Large","preventDefault"],"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n  BOXSHADOWS,\n  COLORS,\n  ComponentLStyling,\n  ComponentSStyling,\n  ComponentTextStyle,\n  ComponentXSStyling,\n  Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../../common/NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n  flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n  margin: 0;\n  background-color: ${COLORS.white};\n  box-sizing: border-box;\n  display: none;\n  width: 320px;\n\n  position: absolute;\n\n  &.show {\n    display: block;\n  }\n\n  top: 0;\n  right: 0;\n  z-index: ${Z_INDEXES.off_canvas};\n  height: 100%;\n  flex-flow: column;\n\n\n  ${Breakpoints.MEDIUM} {\n    flex-flow: initial;\n    top: initial;\n    right: initial;\n    height: initial;\n    animation: ${flowDown} 0.2s ease-in-out;\n    box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n    border-radius: 8px;\n    border: 1px solid ${COLORS.neutral_200};\n    z-index: ${Z_INDEXES.fixed_menu};\n    padding: 24px 0;\n  }\n`;\n\n\nconst MenuSection = styled.div`\n  padding: 4px 0;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ${COLORS.neutral_200};\n  }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n  align-items: center;\n  justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n  display: flex;\n  align-items: center;\n  padding: 8px 24px 4px 24px;\n  box-sizing: border-box;\n  min-height: 32px;\n  background-color: ${COLORS.neutral_20};\n\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n  margin: 0;\n  padding: 0;\n\n  ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n  pointer-events: none;\n\n  button {\n    padding: 0 !important;\n  }\n\n  button > div {\n    width: 48px !important;\n    height: 48px !important;\n    border-radius: 50% !important;\n  }\n`;\n\nconst UserSectionInfo = styled.div`\n  padding: 2px 0;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n  ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n  word-break: break-all;\n  ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n  padding: 2px 0;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n  svg {\n    width: 16px;\n    height: 16px;\n  }\n`;\n\nconst UserSection = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 0 24px 8px 24px;\n  gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n  show?: boolean;\n  onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n  const {navigate, isActiveRoute} = useNavigationHelper();\n\n  React.useEffect(() => {\n    if (!onHideUserMenu) return;\n\n    function handleKeyPress(e: any) {\n      if (e.key === 'Escape' || e.key === 'Esc') {\n        onHideUserMenu();\n      }\n    }\n\n    document.addEventListener('keydown', handleKeyPress, false);\n    return () => {\n      document.removeEventListener('keydown', handleKeyPress, false);\n    };\n  }, [onHideUserMenu]);\n\n  const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n    <MenuItem key={index}\n              id={`profile_${index}`}\n              active={!item.external && isActiveRoute(item.to, !!item.exact)}\n              item={{\n                value: item.to,\n                disabled: item.disabled,\n                icon: item.icon,\n                displayLabel: item.label,\n              }}\n              onClickHandler={(e) => {\n                item.action && item.action(e);\n                navigate(item.to, !!item.external);\n              }}/>\n\n  return (\n    <UserMenuWrapper onClick={onHideUserMenu}\n                     className={show ? 'show' : ''}\n                     role=\"menu\"\n                     aria-labelledby=\"UserMenuButton\">\n      <UserMenuScrollContainer>\n        <UserSection>\n          <UserSectionAvatar>\n            <ProfileButton onClick={() => {\n            }}\n                           tabIndex={-1}\n                           initials={user.firstName[0] + user.lastName[0]}/>\n          </UserSectionAvatar>\n          <UserSectionInfo>\n            <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n            <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n            {\n              user.link &&\n              <HyperLink variant={'default'}\n                         href={user.link.href}\n                         target={user.link.target}\n                         id={user.link.id}\n                         onClick={user.link.onClick}>\n                <UserSectionInfoLink>\n                  <span>\n                    {user.link.label}\n                  </span>\n                  {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n                </UserSectionInfoLink>\n              </HyperLink>\n            }\n          </UserSectionInfo>\n        </UserSection>\n        {\n          sections.filter(a => !a.pinned).map((section, index) =>\n            <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n              <MenuSectionList key={index}>\n                {section.items.map((item, index) => renderItem(item, section, index))}\n              </MenuSectionList>\n            </MenuSection>\n          )\n        }\n      </UserMenuScrollContainer>\n      <UserMenuPinnedContainer>\n        {\n          sections.filter(a => !!a.pinned).map((section, index) =>\n            <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n              <MenuSectionList key={index}>\n                {section.items.map((item, index) => renderItem(item, section, index))}\n              </MenuSectionList>\n            </MenuSection>\n          )\n        }\n        {\n          signOut &&\n          <SignOutActionWrapper>\n            <Button width={'272px'}\n                    variant=\"secondary\"\n                    icon={<SystemIcons.Logout/>}\n                    size={Size.Large}\n                    onClick={e => {\n                      e.preventDefault();\n                      signOut?.action();\n                    }}>\n              {signOut?.label}\n            </Button>\n          </SignOutActionWrapper>\n        }\n      </UserMenuPinnedContainer>\n    </UserMenuWrapper>\n  );\n};\n\nexport default UserMenu;\n"],"mappings":"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"}

package/dist/GlobalNavigationBar/desktop/UserMenu.js

@@ -1,8 +1,6 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
 import _pt from "prop-types";
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
-
 import * as React from 'react';
 import styled from 'styled-components';
 import { Button } from '../../Button';
@@ -30,34 +28,28 @@ var UserSectionInfoName = styled.div(_templateObject10 || (_templateObject10 = _
 var UserSectionInfoEmail = styled.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n  word-break: break-all;\n  ", "\n"])), ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500));
 var UserSectionInfoLink = styled.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n  padding: 2px 0;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  ", "\n  svg {\n    width: 16px;\n    height: 16px;\n  }\n"])), ComponentXSStyling(ComponentTextStyle.Bold, null));
 var UserSection = styled.div(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  padding: 0 24px 8px 24px;\n  gap: 16px;\n"])));
-
 var UserMenu = function UserMenu(_ref) {
   var show = _ref.show,
-      user = _ref.user,
-      onHideUserMenu = _ref.onHideUserMenu,
-      sections = _ref.sections,
-      signOut = _ref.signOut,
-      label = _ref.label;
-
+    user = _ref.user,
+    onHideUserMenu = _ref.onHideUserMenu,
+    sections = _ref.sections,
+    signOut = _ref.signOut,
+    label = _ref.label;
   var _useNavigationHelper = useNavigationHelper(),
-      navigate = _useNavigationHelper.navigate,
-      isActiveRoute = _useNavigationHelper.isActiveRoute;
-
+    navigate = _useNavigationHelper.navigate,
+    isActiveRoute = _useNavigationHelper.isActiveRoute;
   React.useEffect(function () {
     if (!onHideUserMenu) return;
-
     function handleKeyPress(e) {
       if (e.key === 'Escape' || e.key === 'Esc') {
         onHideUserMenu();
       }
     }
-
     document.addEventListener('keydown', handleKeyPress, false);
     return function () {
       document.removeEventListener('keydown', handleKeyPress, false);
     };
   }, [onHideUserMenu]);
-
   var renderItem = function renderItem(item, section, index) {
     return /*#__PURE__*/_jsx(MenuItem, {
       id: "profile_".concat(index),
@@ -74,7 +66,6 @@ var UserMenu = function UserMenu(_ref) {
       }
     }, index);
   };
-
   return /*#__PURE__*/_jsxs(UserMenuWrapper, {
     onClick: onHideUserMenu,
     className: show ? 'show' : '',
@@ -154,7 +145,6 @@ var UserMenu = function UserMenu(_ref) {
     })]
   });
 };
-
 UserMenu.propTypes = {
   show: _pt.bool,
   onHideUserMenu: _pt.func.isRequired

package/dist/GlobalNavigationBar/desktop/UserMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserMenu.js","names":["React","styled","Button","BOXSHADOWS","COLORS","ComponentLStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","Size","flowDown","UserMenuSectionListStyling","SystemIcons","HyperLink","Breakpoints","MenuItem","useNavigationHelper","ProfileButton","UserMenuScrollContainer","div","UserMenuPinnedContainer","UserMenuWrapper","white","off_canvas","MEDIUM","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","Bold","neutral_500","MenuSectionList","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","neutral_600","UserSectionInfoEmail","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","navigate","isActiveRoute","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Large","preventDefault"],"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n  BOXSHADOWS,\n  COLORS,\n  ComponentLStyling,\n  ComponentSStyling,\n  ComponentTextStyle,\n  ComponentXSStyling,\n  Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../../common/NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n  flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n  margin: 0;\n  background-color: ${COLORS.white};\n  box-sizing: border-box;\n  display: none;\n  width: 320px;\n\n  position: absolute;\n\n  &.show {\n    display: block;\n  }\n\n  top: 0;\n  right: 0;\n  z-index: ${Z_INDEXES.off_canvas};\n  height: 100%;\n  flex-flow: column;\n\n\n  ${Breakpoints.MEDIUM} {\n    flex-flow: initial;\n    top: initial;\n    right: initial;\n    height: initial;\n    animation: ${flowDown} 0.2s ease-in-out;\n    box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n    border-radius: 8px;\n    border: 1px solid ${COLORS.neutral_200};\n    z-index: ${Z_INDEXES.fixed_menu};\n    padding: 24px 0;\n  }\n`;\n\n\nconst MenuSection = styled.div`\n  padding: 4px 0;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ${COLORS.neutral_200};\n  }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n  align-items: center;\n  justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n  display: flex;\n  align-items: center;\n  padding: 8px 24px 4px 24px;\n  box-sizing: border-box;\n  min-height: 32px;\n  background-color: ${COLORS.neutral_20};\n\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n  margin: 0;\n  padding: 0;\n\n  ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n  pointer-events: none;\n\n  button {\n    padding: 0 !important;\n  }\n\n  button > div {\n    width: 48px !important;\n    height: 48px !important;\n    border-radius: 50% !important;\n  }\n`;\n\nconst UserSectionInfo = styled.div`\n  padding: 2px 0;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n  ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n  word-break: break-all;\n  ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n  padding: 2px 0;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n  svg {\n    width: 16px;\n    height: 16px;\n  }\n`;\n\nconst UserSection = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 0 24px 8px 24px;\n  gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n  show?: boolean;\n  onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n  const {navigate, isActiveRoute} = useNavigationHelper();\n\n  React.useEffect(() => {\n    if (!onHideUserMenu) return;\n\n    function handleKeyPress(e: any) {\n      if (e.key === 'Escape' || e.key === 'Esc') {\n        onHideUserMenu();\n      }\n    }\n\n    document.addEventListener('keydown', handleKeyPress, false);\n    return () => {\n      document.removeEventListener('keydown', handleKeyPress, false);\n    };\n  }, [onHideUserMenu]);\n\n  const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n    <MenuItem key={index}\n              id={`profile_${index}`}\n              active={!item.external && isActiveRoute(item.to, !!item.exact)}\n              item={{\n                value: item.to,\n                disabled: item.disabled,\n                icon: item.icon,\n                displayLabel: item.label,\n              }}\n              onClickHandler={(e) => {\n                item.action && item.action(e);\n                navigate(item.to, !!item.external);\n              }}/>\n\n  return (\n    <UserMenuWrapper onClick={onHideUserMenu}\n                     className={show ? 'show' : ''}\n                     role=\"menu\"\n                     aria-labelledby=\"UserMenuButton\">\n      <UserMenuScrollContainer>\n        <UserSection>\n          <UserSectionAvatar>\n            <ProfileButton onClick={() => {\n            }}\n                           tabIndex={-1}\n                           initials={user.firstName[0] + user.lastName[0]}/>\n          </UserSectionAvatar>\n          <UserSectionInfo>\n            <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n            <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n            {\n              user.link &&\n              <HyperLink variant={'default'}\n                         href={user.link.href}\n                         target={user.link.target}\n                         id={user.link.id}\n                         onClick={user.link.onClick}>\n                <UserSectionInfoLink>\n                  <span>\n                    {user.link.label}\n                  </span>\n                  {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n                </UserSectionInfoLink>\n              </HyperLink>\n            }\n          </UserSectionInfo>\n        </UserSection>\n        {\n          sections.filter(a => !a.pinned).map((section, index) =>\n            <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n              <MenuSectionList key={index}>\n                {section.items.map((item, index) => renderItem(item, section, index))}\n              </MenuSectionList>\n            </MenuSection>\n          )\n        }\n      </UserMenuScrollContainer>\n      <UserMenuPinnedContainer>\n        {\n          sections.filter(a => !!a.pinned).map((section, index) =>\n            <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n              <MenuSectionList key={index}>\n                {section.items.map((item, index) => renderItem(item, section, index))}\n              </MenuSectionList>\n            </MenuSection>\n          )\n        }\n        {\n          signOut &&\n          <SignOutActionWrapper>\n            <Button width={'272px'}\n                    variant=\"secondary\"\n                    icon={<SystemIcons.Logout/>}\n                    size={Size.Large}\n                    onClick={e => {\n                      e.preventDefault();\n                      signOut?.action();\n                    }}>\n              {signOut?.label}\n            </Button>\n          </SignOutActionWrapper>\n        }\n      </UserMenuPinnedContainer>\n    </UserMenuWrapper>\n  );\n};\n\nexport default UserMenu;\n"],"mappings":"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"}
+{"version":3,"file":"UserMenu.js","names":["React","styled","Button","BOXSHADOWS","COLORS","ComponentLStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","Size","flowDown","UserMenuSectionListStyling","SystemIcons","HyperLink","Breakpoints","MenuItem","useNavigationHelper","ProfileButton","UserMenuScrollContainer","div","UserMenuPinnedContainer","UserMenuWrapper","white","off_canvas","MEDIUM","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","Bold","neutral_500","MenuSectionList","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","neutral_600","UserSectionInfoEmail","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","navigate","isActiveRoute","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Large","preventDefault"],"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n  BOXSHADOWS,\n  COLORS,\n  ComponentLStyling,\n  ComponentSStyling,\n  ComponentTextStyle,\n  ComponentXSStyling,\n  Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../../common/NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n  flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n  margin: 0;\n  background-color: ${COLORS.white};\n  box-sizing: border-box;\n  display: none;\n  width: 320px;\n\n  position: absolute;\n\n  &.show {\n    display: block;\n  }\n\n  top: 0;\n  right: 0;\n  z-index: ${Z_INDEXES.off_canvas};\n  height: 100%;\n  flex-flow: column;\n\n\n  ${Breakpoints.MEDIUM} {\n    flex-flow: initial;\n    top: initial;\n    right: initial;\n    height: initial;\n    animation: ${flowDown} 0.2s ease-in-out;\n    box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n    border-radius: 8px;\n    border: 1px solid ${COLORS.neutral_200};\n    z-index: ${Z_INDEXES.fixed_menu};\n    padding: 24px 0;\n  }\n`;\n\n\nconst MenuSection = styled.div`\n  padding: 4px 0;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ${COLORS.neutral_200};\n  }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n  align-items: center;\n  justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n  display: flex;\n  align-items: center;\n  padding: 8px 24px 4px 24px;\n  box-sizing: border-box;\n  min-height: 32px;\n  background-color: ${COLORS.neutral_20};\n\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n  margin: 0;\n  padding: 0;\n\n  ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n  pointer-events: none;\n\n  button {\n    padding: 0 !important;\n  }\n\n  button > div {\n    width: 48px !important;\n    height: 48px !important;\n    border-radius: 50% !important;\n  }\n`;\n\nconst UserSectionInfo = styled.div`\n  padding: 2px 0;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n  ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n  word-break: break-all;\n  ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n  padding: 2px 0;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n  svg {\n    width: 16px;\n    height: 16px;\n  }\n`;\n\nconst UserSection = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 0 24px 8px 24px;\n  gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n  show?: boolean;\n  onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n  const {navigate, isActiveRoute} = useNavigationHelper();\n\n  React.useEffect(() => {\n    if (!onHideUserMenu) return;\n\n    function handleKeyPress(e: any) {\n      if (e.key === 'Escape' || e.key === 'Esc') {\n        onHideUserMenu();\n      }\n    }\n\n    document.addEventListener('keydown', handleKeyPress, false);\n    return () => {\n      document.removeEventListener('keydown', handleKeyPress, false);\n    };\n  }, [onHideUserMenu]);\n\n  const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n    <MenuItem key={index}\n              id={`profile_${index}`}\n              active={!item.external && isActiveRoute(item.to, !!item.exact)}\n              item={{\n                value: item.to,\n                disabled: item.disabled,\n                icon: item.icon,\n                displayLabel: item.label,\n              }}\n              onClickHandler={(e) => {\n                item.action && item.action(e);\n                navigate(item.to, !!item.external);\n              }}/>\n\n  return (\n    <UserMenuWrapper onClick={onHideUserMenu}\n                     className={show ? 'show' : ''}\n                     role=\"menu\"\n                     aria-labelledby=\"UserMenuButton\">\n      <UserMenuScrollContainer>\n        <UserSection>\n          <UserSectionAvatar>\n            <ProfileButton onClick={() => {\n            }}\n                           tabIndex={-1}\n                           initials={user.firstName[0] + user.lastName[0]}/>\n          </UserSectionAvatar>\n          <UserSectionInfo>\n            <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n            <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n            {\n              user.link &&\n              <HyperLink variant={'default'}\n                         href={user.link.href}\n                         target={user.link.target}\n                         id={user.link.id}\n                         onClick={user.link.onClick}>\n                <UserSectionInfoLink>\n                  <span>\n                    {user.link.label}\n                  </span>\n                  {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n                </UserSectionInfoLink>\n              </HyperLink>\n            }\n          </UserSectionInfo>\n        </UserSection>\n        {\n          sections.filter(a => !a.pinned).map((section, index) =>\n            <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n              <MenuSectionList key={index}>\n                {section.items.map((item, index) => renderItem(item, section, index))}\n              </MenuSectionList>\n            </MenuSection>\n          )\n        }\n      </UserMenuScrollContainer>\n      <UserMenuPinnedContainer>\n        {\n          sections.filter(a => !!a.pinned).map((section, index) =>\n            <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n              <MenuSectionList key={index}>\n                {section.items.map((item, index) => renderItem(item, section, index))}\n              </MenuSectionList>\n            </MenuSection>\n          )\n        }\n        {\n          signOut &&\n          <SignOutActionWrapper>\n            <Button width={'272px'}\n                    variant=\"secondary\"\n                    icon={<SystemIcons.Logout/>}\n                    size={Size.Large}\n                    onClick={e => {\n                      e.preventDefault();\n                      signOut?.action();\n                    }}>\n              {signOut?.label}\n            </Button>\n          </SignOutActionWrapper>\n        }\n      </UserMenuPinnedContainer>\n    </UserMenuWrapper>\n  );\n};\n\nexport default UserMenu;\n"],"mappings":"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"}

package/dist/GlobalNavigationBar/index.cjs

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -14,11 +13,8 @@ Object.defineProperty(exports, "GlobalNavigationBar", {
     return _GlobalNavigationBar.default;
   }
 });
-
 var _GlobalNavigationBar = _interopRequireDefault(require("./GlobalNavigationBar"));
-
 var _types = require("./types");
-
 Object.keys(_types).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;

package/dist/GlobalNavigationBar/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":[],"sources":["../../src/GlobalNavigationBar/index.tsx"],"sourcesContent":["import GlobalNavigationBar from './GlobalNavigationBar';\n\nexport * from './types';\n\nexport {GlobalNavigationBar};\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AAEA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
+{"version":3,"file":"index.cjs","names":[],"sources":["../../src/GlobalNavigationBar/index.tsx"],"sourcesContent":["import GlobalNavigationBar from './GlobalNavigationBar';\n\nexport * from './types';\n\nexport {GlobalNavigationBar};\n"],"mappings":";;;;;;;;;;;;;;;AAAA;AAEA;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}

package/dist/GlobalNavigationBar/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["GlobalNavigationBar"],"sources":["../../src/GlobalNavigationBar/index.tsx"],"sourcesContent":["import GlobalNavigationBar from './GlobalNavigationBar';\n\nexport * from './types';\n\nexport {GlobalNavigationBar};\n"],"mappings":"AAAA,OAAOA,mBAAP,MAAgC,uBAAhC;AAEA,cAAc,SAAd;AAEA,SAAQA,mBAAR"}
+{"version":3,"file":"index.js","names":["GlobalNavigationBar"],"sources":["../../src/GlobalNavigationBar/index.tsx"],"sourcesContent":["import GlobalNavigationBar from './GlobalNavigationBar';\n\nexport * from './types';\n\nexport {GlobalNavigationBar};\n"],"mappings":"AAAA,OAAOA,mBAAmB,MAAM,uBAAuB;AAEvD,cAAc,SAAS;AAEvB,SAAQA,mBAAmB"}

package/dist/GlobalNavigationBar/mobile/CommonStyles.cjs

@@ -1,36 +1,22 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.flowDown = exports.fadeOut = exports.fadeIn = exports.UserMenuSectionListStyling = exports.SiteName = exports.ScrollableContainer = exports.RowLayout = exports.Right = exports.MobileMenuWrapper = exports.MobileHeaderText = exports.MobileHeaderNote = exports.MobileHeaderContainer = exports.MenuSectionList = exports.MenuSection = exports.MenuLink = exports.Menu = exports.Button = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
-
 var _styles = require("../../styles");
-
 var _reactRouterDom = require("react-router-dom");
-
 var _types = require("../../types");
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19;
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 var RowLayout = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n"])));
-
 exports.RowLayout = RowLayout;
-
 var Button = _styledComponents.default.button(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  background-color: ", ";\n  font-weight: bold;\n  border: 0;\n"])), _styles.COLORS.white);
-
 exports.Button = Button;
 var flowLeft = (0, _styledComponents.keyframes)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  0% {\n    opacity: 0;\n    transform: translateX(100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n"])));
 var flowRight = (0, _styledComponents.keyframes)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  0% {\n    opacity: 1;\n    transform: translateX(0);\n    visibility: visible;\n  }\n  to {\n    opacity: 0;\n    visibility: hidden;\n    transform: translateX(100%);\n  }\n"])));
@@ -38,25 +24,15 @@ var fadeOut = (0, _styledComponents.keyframes)(_templateObject5 || (_templateObj
 exports.fadeOut = fadeOut;
 var fadeIn = (0, _styledComponents.keyframes)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  0% {\n    opacity: 0;\n    visibility: hidden;\n  }\n  to {\n    opacity: 1;\n    visibility: visible;\n  }\n"])));
 exports.fadeIn = fadeIn;
-
 var Menu = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  height: 100%;\n  background-color: ", ";\n  box-sizing: border-box;\n  right: 0;\n  top: 0;\n  position: absolute;\n  z-index: ", ";\n  align-items: center;\n\n  width: 320px;\n\n  ", " {\n    width: 400px;\n  }\n\n  .open & {\n    visibility: visible;\n    display: flex;\n    animation: ", " 0.3s ease-in-out;\n  }\n\n  .closed & {\n    visibility: hidden;\n    animation: ", " 0.3s ease-in-out;\n  }\n"])), _styles.COLORS.white, _styles.Z_INDEXES.off_canvas, _styles.BREAKPOINTS.SMALL, flowLeft, flowRight);
-
 exports.Menu = Menu;
-
 var Right = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  margin-left: auto;\n"])));
-
 exports.Right = Right;
-
 var SiteName = _styledComponents.default.span(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n  color: ", ";\n  font-weight: bold;\n  font-size: 14px;\n  margin-left: 4px;\n"])), _styles.COLORS.neutral_600);
-
 exports.SiteName = SiteName;
-
 var MenuSection = _styledComponents.default.li(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n  margin-top: 16px;\n\n  .disabled-link {\n    color: #21212150;\n    pointer-events: none;\n    key-events: none;\n  }\n"])));
-
 exports.MenuSection = MenuSection;
-
 var MenuSectionList = _styledComponents.default.ul(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n  list-style: none;\n  padding: 0;\n\n  li {\n    width: 80%;\n    height: 48px;\n    margin: 0 auto 0 12px;\n\n    a {\n      height: 100%;\n    }\n  }\n"])));
-
 exports.MenuSectionList = MenuSectionList;
 var UserMenuSectionListStyling = (0, _styledComponents.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n  li {\n    position: relative;\n  }\n\n  li:hover:not(.disabled) {\n    z-index: ", ";\n    background-color: ", ";\n\n    a {\n      color: ", ";\n    }\n\n    svg {\n      color: ", ";\n    }\n  }\n\n  li:focus-within:not(.disabled) {\n    z-index: ", ";\n\n    ", "\n    a {\n      outline: none;\n    }\n  }\n\n  li:active:not(.disabled) {\n    z-index: ", ";\n    background: ", ";\n\n    a {\n      color: ", ";\n    }\n\n    svg {\n      color: ", ";\n    }\n  }\n\n  .disabled {\n    a {\n      color: ", ";\n    }\n\n    svg {\n      color: ", ";\n    }\n\n    background-color: ", ";\n  }\n"])), _styles.Z_INDEXES.hover, _styles.COLORS.primary_20, _styles.COLORS.primary_600, _styles.COLORS.primary_600, _styles.Z_INDEXES.focus, _styles.focusStyles, _styles.Z_INDEXES.active, _styles.COLORS.primary_100, _styles.COLORS.primary_800, _styles.COLORS.primary_800, _styles.COLORS.neutral_300, _styles.COLORS.neutral_300, _styles.COLORS.neutral_100);
 exports.UserMenuSectionListStyling = UserMenuSectionListStyling;
@@ -64,24 +40,14 @@ var MenuLink = (0, _styledComponents.default)(_reactRouterDom.NavLink)(_template
 exports.MenuLink = MenuLink;
 var flowDown = (0, _styledComponents.keyframes)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n  0% {\n    opacity: 0;\n    transform: translateY(-10px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n"])));
 exports.flowDown = flowDown;
-
 var MobileMenuWrapper = _styledComponents.default.div(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  box-sizing: border-box;\n  flex-flow: column;\n  display: flex;\n  flex: 1;\n  overflow: hidden;\n"])));
-
 exports.MobileMenuWrapper = MobileMenuWrapper;
-
 var ScrollableContainer = _styledComponents.default.div(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2.default)(["\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n  max-height: 100%;\n\n  &.scrollable {\n    margin-right: 6px;\n    padding-right: 10px;\n  }\n\n  ", "\n\n  ::-webkit-scrollbar-track {\n    margin: 8px;\n  }\n"])), (0, _styles.scrollBarStyling)(_types.Size.Small));
-
 exports.ScrollableContainer = ScrollableContainer;
-
 var MobileHeaderText = _styledComponents.default.div(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  ", " {\n    ", "\n  }\n"])), (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.neutral_600), _styles.BREAKPOINTS.SMALL, (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.neutral_600));
-
 exports.MobileHeaderText = MobileHeaderText;
-
 var MobileHeaderNote = _styledComponents.default.div(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2.default)(["\n  word-break: break-all;\n  ", "\n"])), (0, _styles.ParagraphXSStyling)(_styles.ParagraphTextStyle.Regular, _styles.COLORS.neutral_600));
-
 exports.MobileHeaderNote = MobileHeaderNote;
-
 var MobileHeaderContainer = _styledComponents.default.div(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2.default)(["\n  margin: 0 24px;\n  padding-bottom: 8px;\n  box-sizing: border-box;\n  border-bottom: 1px solid ", ";\n  display: flex;\n  flex-direction: column;\n"])), _styles.COLORS.neutral_200);
-
 exports.MobileHeaderContainer = MobileHeaderContainer;
 //# sourceMappingURL=CommonStyles.cjs.map

package/dist/GlobalNavigationBar/mobile/CommonStyles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"CommonStyles.cjs","names":["RowLayout","styled","div","Button","button","COLORS","white","flowLeft","keyframes","flowRight","fadeOut","fadeIn","Menu","Z_INDEXES","off_canvas","BREAKPOINTS","SMALL","Right","SiteName","span","neutral_600","MenuSection","li","MenuSectionList","ul","UserMenuSectionListStyling","css","hover","primary_20","primary_600","focus","focusStyles","active","primary_100","primary_800","neutral_300","neutral_100","MenuLink","NavLink","ComponentMStyling","ComponentTextStyle","Regular","black","flowDown","MobileMenuWrapper","ScrollableContainer","scrollBarStyling","Size","Small","MobileHeaderText","ComponentSStyling","Bold","MobileHeaderNote","ParagraphXSStyling","ParagraphTextStyle","MobileHeaderContainer","neutral_200"],"sources":["../../../src/GlobalNavigationBar/mobile/CommonStyles.ts"],"sourcesContent":["import styled, { css, keyframes } from 'styled-components';\nimport { BREAKPOINTS, COLORS, ComponentSStyling, focusStyles, scrollBarStyling, ParagraphXSStyling, ParagraphTextStyle } from '../../styles';\nimport { NavLink } from 'react-router-dom';\nimport { ComponentMStyling, ComponentTextStyle } from '../../styles';\nimport { Z_INDEXES } from '../../styles';\nimport { Size } from '../../types';\n\nexport const RowLayout = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nexport const Button = styled.button`\n  background-color: ${COLORS.white};\n  font-weight: bold;\n  border: 0;\n`;\n\nconst flowLeft = keyframes`\n  0% {\n    opacity: 0;\n    transform: translateX(100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n`;\n\nconst flowRight = keyframes`\n  0% {\n    opacity: 1;\n    transform: translateX(0);\n    visibility: visible;\n  }\n  to {\n    opacity: 0;\n    visibility: hidden;\n    transform: translateX(100%);\n  }\n`;\n\nexport const fadeOut = keyframes`\n  0% {\n    opacity: 1;\n    visibility: visible;\n  }\n  to {\n    opacity: 0;\n    visibility: hidden;\n  }\n`;\n\nexport const fadeIn = keyframes`\n  0% {\n    opacity: 0;\n    visibility: hidden;\n  }\n  to {\n    opacity: 1;\n    visibility: visible;\n  }\n`;\n\nexport const Menu = styled.div`\n  height: 100%;\n  background-color: ${COLORS.white};\n  box-sizing: border-box;\n  right: 0;\n  top: 0;\n  position: absolute;\n  z-index: ${Z_INDEXES.off_canvas};\n  align-items: center;\n\n  width: 320px;\n\n  ${BREAKPOINTS.SMALL} {\n    width: 400px;\n  }\n\n  .open & {\n    visibility: visible;\n    display: flex;\n    animation: ${flowLeft} 0.3s ease-in-out;\n  }\n\n  .closed & {\n    visibility: hidden;\n    animation: ${flowRight} 0.3s ease-in-out;\n  }\n`;\n\nexport const Right = styled.div`\n  display: flex;\n  margin-left: auto;\n`;\n\nexport const SiteName = styled.span`\n  color: ${COLORS.neutral_600};\n  font-weight: bold;\n  font-size: 14px;\n  margin-left: 4px;\n`;\n\nexport const MenuSection = styled.li`\n  margin-top: 16px;\n\n  .disabled-link {\n    color: #21212150;\n    pointer-events: none;\n    key-events: none;\n  }\n`;\n\nexport const MenuSectionList = styled.ul`\n  list-style: none;\n  padding: 0;\n\n  li {\n    width: 80%;\n    height: 48px;\n    margin: 0 auto 0 12px;\n\n    a {\n      height: 100%;\n    }\n  }\n`;\n\nexport const UserMenuSectionListStyling = css`\n  li {\n    position: relative;\n  }\n\n  li:hover:not(.disabled) {\n    z-index: ${Z_INDEXES.hover};\n    background-color: ${COLORS.primary_20};\n\n    a {\n      color: ${COLORS.primary_600};\n    }\n\n    svg {\n      color: ${COLORS.primary_600};\n    }\n  }\n\n  li:focus-within:not(.disabled) {\n    z-index: ${Z_INDEXES.focus};\n\n    ${focusStyles}\n    a {\n      outline: none;\n    }\n  }\n\n  li:active:not(.disabled) {\n    z-index: ${Z_INDEXES.active};\n    background: ${COLORS.primary_100};\n\n    a {\n      color: ${COLORS.primary_800};\n    }\n\n    svg {\n      color: ${COLORS.primary_800};\n    }\n  }\n\n  .disabled {\n    a {\n      color: ${COLORS.neutral_300};\n    }\n\n    svg {\n      color: ${COLORS.neutral_300};\n    }\n\n    background-color: ${COLORS.neutral_100};\n  }\n`;\n\nexport const MenuLink = styled(NavLink)`\n  border: none;\n  background: transparent;\n  margin: auto;\n\n  box-sizing: border-box;\n\n  ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n\n  text-decoration: none;\n  text-align: center;\n  align-items: center;\n  display: flex;\n`;\n\nexport const flowDown = keyframes`\n  0% {\n    opacity: 0;\n    transform: translateY(-10px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n`;\n\nexport const MobileMenuWrapper = styled.div`\n  width: 100%;\n  box-sizing: border-box;\n  flex-flow: column;\n  display: flex;\n  flex: 1;\n  overflow: hidden;\n`;\n\nexport const ScrollableContainer = styled.div`\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n  max-height: 100%;\n\n  &.scrollable {\n    margin-right: 6px;\n    padding-right: 10px;\n  }\n\n  ${scrollBarStyling(Size.Small)}\n\n  ::-webkit-scrollbar-track {\n    margin: 8px;\n  }\n`;\n\nexport const MobileHeaderText = styled.div`\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  }\n`;\nexport const MobileHeaderNote = styled.div`\n  word-break: break-all;\n  ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nexport const MobileHeaderContainer = styled.div`\n  margin: 0 24px;\n  padding-bottom: 8px;\n  box-sizing: border-box;\n  border-bottom: 1px solid ${COLORS.neutral_200};\n  display: flex;\n  flex-direction: column;\n`;\n"],"mappings":";;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAGA;;;;;;;;AAEO,IAAMA,SAAS,GAAGC,yBAAA,CAAOC,GAAV,+HAAf;;;;AAKA,IAAMC,MAAM,GAAGF,yBAAA,CAAOG,MAAV,uJACGC,cAAA,CAAOC,KADV,CAAZ;;;AAMP,IAAMC,QAAQ,OAAGC,2BAAH,qNAAd;AAWA,IAAMC,SAAS,OAAGD,2BAAH,wQAAf;AAaO,IAAME,OAAO,OAAGF,2BAAH,uMAAb;;AAWA,IAAMG,MAAM,OAAGH,2BAAH,uMAAZ;;;AAWA,IAAMI,IAAI,GAAGX,yBAAA,CAAOC,GAAV,8eAEKG,cAAA,CAAOC,KAFZ,EAOJO,iBAAA,CAAUC,UAPN,EAYbC,mBAAA,CAAYC,KAZC,EAmBAT,QAnBA,EAwBAE,SAxBA,CAAV;;;;AA4BA,IAAMQ,KAAK,GAAGhB,yBAAA,CAAOC,GAAV,+HAAX;;;;AAKA,IAAMgB,QAAQ,GAAGjB,yBAAA,CAAOkB,IAAV,uKACVd,cAAA,CAAOe,WADG,CAAd;;;;AAOA,IAAMC,WAAW,GAAGpB,yBAAA,CAAOqB,EAAV,kNAAjB;;;;AAUA,IAAMC,eAAe,GAAGtB,yBAAA,CAAOuB,EAAV,mPAArB;;;AAeA,IAAMC,0BAA0B,OAAGC,qBAAH,orBAMxBb,iBAAA,CAAUc,KANc,EAOftB,cAAA,CAAOuB,UAPQ,EAUxBvB,cAAA,CAAOwB,WAViB,EAcxBxB,cAAA,CAAOwB,WAdiB,EAmBxBhB,iBAAA,CAAUiB,KAnBc,EAqBjCC,mBArBiC,EA4BxBlB,iBAAA,CAAUmB,MA5Bc,EA6BrB3B,cAAA,CAAO4B,WA7Bc,EAgCxB5B,cAAA,CAAO6B,WAhCiB,EAoCxB7B,cAAA,CAAO6B,WApCiB,EA0CxB7B,cAAA,CAAO8B,WA1CiB,EA8CxB9B,cAAA,CAAO8B,WA9CiB,EAiDf9B,cAAA,CAAO+B,WAjDQ,CAAhC;;AAqDA,IAAMC,QAAQ,GAAG,IAAApC,yBAAA,EAAOqC,uBAAP,CAAH,4RAOjB,IAAAC,yBAAA,EAAkBC,0BAAA,CAAmBC,OAArC,EAA8CpC,cAAA,CAAOqC,KAArD,CAPiB,CAAd;;AAeA,IAAMC,QAAQ,OAAGnC,2BAAH,wNAAd;;;AAWA,IAAMoC,iBAAiB,GAAG3C,yBAAA,CAAOC,GAAV,6MAAvB;;;;AASA,IAAM2C,mBAAmB,GAAG5C,yBAAA,CAAOC,GAAV,0UAY5B,IAAA4C,wBAAA,EAAiBC,WAAA,CAAKC,KAAtB,CAZ4B,CAAzB;;;;AAmBA,IAAMC,gBAAgB,GAAGhD,yBAAA,CAAOC,GAAV,2HACzB,IAAAgD,yBAAA,EAAkBV,0BAAA,CAAmBW,IAArC,EAA2C9C,cAAA,CAAOe,WAAlD,CADyB,EAEzBL,mBAAA,CAAYC,KAFa,EAGvB,IAAAuB,yBAAA,EAAkBC,0BAAA,CAAmBW,IAArC,EAA2C9C,cAAA,CAAOe,WAAlD,CAHuB,CAAtB;;;;AAMA,IAAMgC,gBAAgB,GAAGnD,yBAAA,CAAOC,GAAV,4HAEzB,IAAAmD,0BAAA,EAAmBC,0BAAA,CAAmBb,OAAtC,EAA+CpC,cAAA,CAAOe,WAAtD,CAFyB,CAAtB;;;;AAKA,IAAMmC,qBAAqB,GAAGtD,yBAAA,CAAOC,GAAV,+OAILG,cAAA,CAAOmD,WAJF,CAA3B"}
+{"version":3,"file":"CommonStyles.cjs","names":["RowLayout","styled","div","Button","button","COLORS","white","flowLeft","keyframes","flowRight","fadeOut","fadeIn","Menu","Z_INDEXES","off_canvas","BREAKPOINTS","SMALL","Right","SiteName","span","neutral_600","MenuSection","li","MenuSectionList","ul","UserMenuSectionListStyling","css","hover","primary_20","primary_600","focus","focusStyles","active","primary_100","primary_800","neutral_300","neutral_100","MenuLink","NavLink","ComponentMStyling","ComponentTextStyle","Regular","black","flowDown","MobileMenuWrapper","ScrollableContainer","scrollBarStyling","Size","Small","MobileHeaderText","ComponentSStyling","Bold","MobileHeaderNote","ParagraphXSStyling","ParagraphTextStyle","MobileHeaderContainer","neutral_200"],"sources":["../../../src/GlobalNavigationBar/mobile/CommonStyles.ts"],"sourcesContent":["import styled, { css, keyframes } from 'styled-components';\nimport { BREAKPOINTS, COLORS, ComponentSStyling, focusStyles, scrollBarStyling, ParagraphXSStyling, ParagraphTextStyle } from '../../styles';\nimport { NavLink } from 'react-router-dom';\nimport { ComponentMStyling, ComponentTextStyle } from '../../styles';\nimport { Z_INDEXES } from '../../styles';\nimport { Size } from '../../types';\n\nexport const RowLayout = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nexport const Button = styled.button`\n  background-color: ${COLORS.white};\n  font-weight: bold;\n  border: 0;\n`;\n\nconst flowLeft = keyframes`\n  0% {\n    opacity: 0;\n    transform: translateX(100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n`;\n\nconst flowRight = keyframes`\n  0% {\n    opacity: 1;\n    transform: translateX(0);\n    visibility: visible;\n  }\n  to {\n    opacity: 0;\n    visibility: hidden;\n    transform: translateX(100%);\n  }\n`;\n\nexport const fadeOut = keyframes`\n  0% {\n    opacity: 1;\n    visibility: visible;\n  }\n  to {\n    opacity: 0;\n    visibility: hidden;\n  }\n`;\n\nexport const fadeIn = keyframes`\n  0% {\n    opacity: 0;\n    visibility: hidden;\n  }\n  to {\n    opacity: 1;\n    visibility: visible;\n  }\n`;\n\nexport const Menu = styled.div`\n  height: 100%;\n  background-color: ${COLORS.white};\n  box-sizing: border-box;\n  right: 0;\n  top: 0;\n  position: absolute;\n  z-index: ${Z_INDEXES.off_canvas};\n  align-items: center;\n\n  width: 320px;\n\n  ${BREAKPOINTS.SMALL} {\n    width: 400px;\n  }\n\n  .open & {\n    visibility: visible;\n    display: flex;\n    animation: ${flowLeft} 0.3s ease-in-out;\n  }\n\n  .closed & {\n    visibility: hidden;\n    animation: ${flowRight} 0.3s ease-in-out;\n  }\n`;\n\nexport const Right = styled.div`\n  display: flex;\n  margin-left: auto;\n`;\n\nexport const SiteName = styled.span`\n  color: ${COLORS.neutral_600};\n  font-weight: bold;\n  font-size: 14px;\n  margin-left: 4px;\n`;\n\nexport const MenuSection = styled.li`\n  margin-top: 16px;\n\n  .disabled-link {\n    color: #21212150;\n    pointer-events: none;\n    key-events: none;\n  }\n`;\n\nexport const MenuSectionList = styled.ul`\n  list-style: none;\n  padding: 0;\n\n  li {\n    width: 80%;\n    height: 48px;\n    margin: 0 auto 0 12px;\n\n    a {\n      height: 100%;\n    }\n  }\n`;\n\nexport const UserMenuSectionListStyling = css`\n  li {\n    position: relative;\n  }\n\n  li:hover:not(.disabled) {\n    z-index: ${Z_INDEXES.hover};\n    background-color: ${COLORS.primary_20};\n\n    a {\n      color: ${COLORS.primary_600};\n    }\n\n    svg {\n      color: ${COLORS.primary_600};\n    }\n  }\n\n  li:focus-within:not(.disabled) {\n    z-index: ${Z_INDEXES.focus};\n\n    ${focusStyles}\n    a {\n      outline: none;\n    }\n  }\n\n  li:active:not(.disabled) {\n    z-index: ${Z_INDEXES.active};\n    background: ${COLORS.primary_100};\n\n    a {\n      color: ${COLORS.primary_800};\n    }\n\n    svg {\n      color: ${COLORS.primary_800};\n    }\n  }\n\n  .disabled {\n    a {\n      color: ${COLORS.neutral_300};\n    }\n\n    svg {\n      color: ${COLORS.neutral_300};\n    }\n\n    background-color: ${COLORS.neutral_100};\n  }\n`;\n\nexport const MenuLink = styled(NavLink)`\n  border: none;\n  background: transparent;\n  margin: auto;\n\n  box-sizing: border-box;\n\n  ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n\n  text-decoration: none;\n  text-align: center;\n  align-items: center;\n  display: flex;\n`;\n\nexport const flowDown = keyframes`\n  0% {\n    opacity: 0;\n    transform: translateY(-10px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n`;\n\nexport const MobileMenuWrapper = styled.div`\n  width: 100%;\n  box-sizing: border-box;\n  flex-flow: column;\n  display: flex;\n  flex: 1;\n  overflow: hidden;\n`;\n\nexport const ScrollableContainer = styled.div`\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n  max-height: 100%;\n\n  &.scrollable {\n    margin-right: 6px;\n    padding-right: 10px;\n  }\n\n  ${scrollBarStyling(Size.Small)}\n\n  ::-webkit-scrollbar-track {\n    margin: 8px;\n  }\n`;\n\nexport const MobileHeaderText = styled.div`\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  }\n`;\nexport const MobileHeaderNote = styled.div`\n  word-break: break-all;\n  ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nexport const MobileHeaderContainer = styled.div`\n  margin: 0 24px;\n  padding-bottom: 8px;\n  box-sizing: border-box;\n  border-bottom: 1px solid ${COLORS.neutral_200};\n  display: flex;\n  flex-direction: column;\n`;\n"],"mappings":";;;;;;;;;AAAA;AACA;AACA;AAGA;AAAmC;AAAA;AAAA;AAE5B,IAAMA,SAAS,GAAGC,yBAAM,CAACC,GAAG,+HAGlC;AAAC;AAEK,IAAMC,MAAM,GAAGF,yBAAM,CAACG,MAAM,uJACbC,cAAM,CAACC,KAAK,CAGjC;AAAC;AAEF,IAAMC,QAAQ,OAAGC,2BAAS,qNASzB;AAED,IAAMC,SAAS,OAAGD,2BAAS,wQAW1B;AAEM,IAAME,OAAO,OAAGF,2BAAS,uMAS/B;AAAC;AAEK,IAAMG,MAAM,OAAGH,2BAAS,uMAS9B;AAAC;AAEK,IAAMI,IAAI,GAAGX,yBAAM,CAACC,GAAG,8eAERG,cAAM,CAACC,KAAK,EAKrBO,iBAAS,CAACC,UAAU,EAK7BC,mBAAW,CAACC,KAAK,EAOJT,QAAQ,EAKRE,SAAS,CAEzB;AAAC;AAEK,IAAMQ,KAAK,GAAGhB,yBAAM,CAACC,GAAG,+HAG9B;AAAC;AAEK,IAAMgB,QAAQ,GAAGjB,yBAAM,CAACkB,IAAI,uKACxBd,cAAM,CAACe,WAAW,CAI5B;AAAC;AAEK,IAAMC,WAAW,GAAGpB,yBAAM,CAACqB,EAAE,kNAQnC;AAAC;AAEK,IAAMC,eAAe,GAAGtB,yBAAM,CAACuB,EAAE,mPAavC;AAAC;AAEK,IAAMC,0BAA0B,OAAGC,qBAAG,orBAM9Bb,iBAAS,CAACc,KAAK,EACNtB,cAAM,CAACuB,UAAU,EAG1BvB,cAAM,CAACwB,WAAW,EAIlBxB,cAAM,CAACwB,WAAW,EAKlBhB,iBAAS,CAACiB,KAAK,EAExBC,mBAAW,EAOFlB,iBAAS,CAACmB,MAAM,EACb3B,cAAM,CAAC4B,WAAW,EAGrB5B,cAAM,CAAC6B,WAAW,EAIlB7B,cAAM,CAAC6B,WAAW,EAMlB7B,cAAM,CAAC8B,WAAW,EAIlB9B,cAAM,CAAC8B,WAAW,EAGT9B,cAAM,CAAC+B,WAAW,CAEzC;AAAC;AAEK,IAAMC,QAAQ,GAAG,IAAApC,yBAAM,EAACqC,uBAAO,CAAC,4RAOnC,IAAAC,yBAAiB,EAACC,0BAAkB,CAACC,OAAO,EAAEpC,cAAM,CAACqC,KAAK,CAAC,CAM9D;AAAC;AAEK,IAAMC,QAAQ,OAAGnC,2BAAS,wNAShC;AAAC;AAEK,IAAMoC,iBAAiB,GAAG3C,yBAAM,CAACC,GAAG,6MAO1C;AAAC;AAEK,IAAM2C,mBAAmB,GAAG5C,yBAAM,CAACC,GAAG,0UAYzC,IAAA4C,wBAAgB,EAACC,WAAI,CAACC,KAAK,CAAC,CAK/B;AAAC;AAEK,IAAMC,gBAAgB,GAAGhD,yBAAM,CAACC,GAAG,2HACtC,IAAAgD,yBAAiB,EAACV,0BAAkB,CAACW,IAAI,EAAE9C,cAAM,CAACe,WAAW,CAAC,EAC9DL,mBAAW,CAACC,KAAK,EACf,IAAAuB,yBAAiB,EAACC,0BAAkB,CAACW,IAAI,EAAE9C,cAAM,CAACe,WAAW,CAAC,CAEnE;AAAC;AACK,IAAMgC,gBAAgB,GAAGnD,yBAAM,CAACC,GAAG,4HAEtC,IAAAmD,0BAAkB,EAACC,0BAAkB,CAACb,OAAO,EAAEpC,cAAM,CAACe,WAAW,CAAC,CACrE;AAAC;AAEK,IAAMmC,qBAAqB,GAAGtD,yBAAM,CAACC,GAAG,+OAIlBG,cAAM,CAACmD,WAAW,CAG9C;AAAC"}

package/dist/GlobalNavigationBar/mobile/CommonStyles.js

@@ -1,7 +1,5 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19;
-
 import styled, { css, keyframes } from 'styled-components';
 import { BREAKPOINTS, COLORS, ComponentSStyling, focusStyles, scrollBarStyling, ParagraphXSStyling, ParagraphTextStyle } from '../../styles';
 import { NavLink } from 'react-router-dom';