@laerdal/life-react-components 3.5.1-dev.16 → 3.5.1-dev.18

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","jsx","_jsx","jsxs","_jsxs","UserMenuScrollContainer","div","_templateObject","_taggedTemplateLiteral","UserMenuPinnedContainer","_templateObject2","UserMenuWrapper","_templateObject3","white","off_canvas","MEDIUM","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","_templateObject4","SignOutActionWrapper","_templateObject5","MenuSectionHeader","_templateObject6","neutral_20","Bold","neutral_500","MenuSectionList","_templateObject7","UserSectionAvatar","_templateObject8","UserSectionInfo","_templateObject9","UserSectionInfoName","_templateObject10","neutral_600","UserSectionInfoEmail","_templateObject11","Regular","UserSectionInfoLink","_templateObject12","UserSection","_templateObject13","UserMenu","_ref","show","user","onHideUserMenu","sections","signOut","label","_useNavigationHelper","navigate","isActiveRoute","useEffect","_document","handleKeyPress","e","key","document","addEventListener","_document2","removeEventListener","renderItem","item","section","index","id","concat","active","external","to","exact","value","disabled","icon","displayLabel","onClickHandler","action","onClick","className","role","children","tabIndex","initials","firstName","lastName","email","link","variant","href","target","cloneElement","size","filter","a","pinned","map","divider","items","width","Logout","Large","preventDefault","propTypes","_pt","bool","func","isRequired"],"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport {Button} from '../../Button';\r\nimport {\r\n  BOXSHADOWS,\r\n  COLORS,\r\n  ComponentLStyling,\r\n  ComponentSStyling,\r\n  ComponentTextStyle,\r\n  ComponentXSStyling,\r\n  Z_INDEXES\r\n} from '../../styles';\r\nimport {Size} from '../../types';\r\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\r\nimport {SystemIcons} from '../../icons';\r\nimport {HyperLink} from '../../HyperLink';\r\nimport {MenuNavigationItem, MenuNavigationSection, ProfileMenu} from '../types';\r\nimport Breakpoints from '../../styles/breakpoints';\r\nimport {MenuItem} from '../../MenuItem';\r\nimport {useNavigationHelper} from '../../common/NavigationHelper';\r\nimport {ProfileButton} from '../../ProfileButton';\r\n\r\nconst UserMenuScrollContainer = styled.div`\r\n  flex: 1;\r\n`;\r\n\r\nconst UserMenuPinnedContainer = styled.div``;\r\n\r\n\r\nconst UserMenuWrapper = styled.div`\r\n  margin: 0;\r\n  background-color: ${COLORS.white};\r\n  box-sizing: border-box;\r\n  display: none;\r\n  width: 320px;\r\n\r\n  position: absolute;\r\n\r\n  &.show {\r\n    display: block;\r\n  }\r\n\r\n  top: 0;\r\n  right: 0;\r\n  z-index: ${Z_INDEXES.off_canvas};\r\n  height: 100%;\r\n  flex-flow: column;\r\n\r\n\r\n  ${Breakpoints.MEDIUM} {\r\n    flex-flow: initial;\r\n    top: initial;\r\n    right: initial;\r\n    height: initial;\r\n    animation: ${flowDown} 0.2s ease-in-out;\r\n    box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\r\n    border-radius: 8px;\r\n    border: 1px solid ${COLORS.neutral_200};\r\n    z-index: ${Z_INDEXES.fixed_menu};\r\n    padding: 24px 0;\r\n  }\r\n`;\r\n\r\n\r\nconst MenuSection = styled.div`\r\n  padding: 4px 0;\r\n  display: flex;\r\n  flex-direction: column;\r\n  width: 100%;\r\n\r\n  &.divider {\r\n    border-top: 1px solid ${COLORS.neutral_200};\r\n  }\r\n`;\r\n\r\nconst SignOutActionWrapper = styled(MenuSection)`\r\n  align-items: center;\r\n  justify-content: center;\r\n`;\r\n\r\nconst MenuSectionHeader = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 8px 24px 4px 24px;\r\n  box-sizing: border-box;\r\n  min-height: 32px;\r\n  background-color: ${COLORS.neutral_20};\r\n\r\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\r\n`;\r\n\r\nconst MenuSectionList = styled.div`\r\n  margin: 0;\r\n  padding: 0;\r\n\r\n  ${UserMenuSectionListStyling};\r\n`;\r\n\r\n\r\nconst UserSectionAvatar = styled.div`\r\n  pointer-events: none;\r\n\r\n  button {\r\n    padding: 0 !important;\r\n  }\r\n\r\n  button > div {\r\n    width: 48px !important;\r\n    height: 48px !important;\r\n    border-radius: 50% !important;\r\n  }\r\n`;\r\n\r\nconst UserSectionInfo = styled.div`\r\n  padding: 2px 0;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 4px;\r\n`;\r\n\r\nconst UserSectionInfoName = styled.div`\r\n  ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\r\n`;\r\n\r\nconst UserSectionInfoEmail = styled.div`\r\n  word-break: break-all;\r\n  ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\r\n`;\r\n\r\nconst UserSectionInfoLink = styled.div`\r\n  padding: 2px 0;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n\r\n  ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\r\n  svg {\r\n    width: 16px;\r\n    height: 16px;\r\n  }\r\n`;\r\n\r\nconst UserSection = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n  padding: 0 24px 8px 24px;\r\n  gap: 16px;\r\n`;\r\n\r\ninterface UserMenuProps extends ProfileMenu {\r\n  show?: boolean;\r\n  onHideUserMenu: () => void;\r\n}\r\n\r\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\r\n\r\n  const {navigate, isActiveRoute} = useNavigationHelper();\r\n\r\n  React.useEffect(() => {\r\n    if (!onHideUserMenu) return;\r\n\r\n    function handleKeyPress(e: any) {\r\n      if (e.key === 'Escape' || e.key === 'Esc') {\r\n        onHideUserMenu();\r\n      }\r\n    }\r\n\r\n    document?.addEventListener('keydown', handleKeyPress, false);\r\n    return () => {\r\n      document?.removeEventListener('keydown', handleKeyPress, false);\r\n    };\r\n  }, [onHideUserMenu]);\r\n\r\n  const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\r\n    <MenuItem key={index}\r\n              id={`profile_${index}`}\r\n              active={!item.external && isActiveRoute(item.to, !!item.exact)}\r\n              item={{\r\n                value: item.to,\r\n                disabled: item.disabled,\r\n                icon: item.icon,\r\n                displayLabel: item.label,\r\n              }}\r\n              onClickHandler={(e) => {\r\n                item.action && item.action(e);\r\n                navigate(item.to, !!item.external);\r\n              }}/>\r\n\r\n  return (\r\n    <UserMenuWrapper onClick={onHideUserMenu}\r\n                     className={show ? 'show' : ''}\r\n                     role=\"menu\"\r\n                     aria-labelledby=\"UserMenuButton\">\r\n      <UserMenuScrollContainer>\r\n        <UserSection>\r\n          <UserSectionAvatar>\r\n            <ProfileButton onClick={() => {\r\n            }}\r\n                           tabIndex={-1}\r\n                           initials={user.firstName[0] + user.lastName[0]}/>\r\n          </UserSectionAvatar>\r\n          <UserSectionInfo>\r\n            <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\r\n            <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\r\n            {\r\n              user.link &&\r\n              <HyperLink variant={'default'}\r\n                         href={user.link.href}\r\n                         target={user.link.target}\r\n                         id={user.link.id}\r\n                         onClick={user.link.onClick}>\r\n                <UserSectionInfoLink>\r\n                  <span>\r\n                    {user.link.label}\r\n                  </span>\r\n                  {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\r\n                </UserSectionInfoLink>\r\n              </HyperLink>\r\n            }\r\n          </UserSectionInfo>\r\n        </UserSection>\r\n        {\r\n          sections.filter(a => !a.pinned).map((section, index) =>\r\n            <MenuSection key={index} className={section.divider ? 'divider' : ''}>\r\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\r\n              <MenuSectionList key={index}>\r\n                {section.items.map((item, index) => renderItem(item, section, index))}\r\n              </MenuSectionList>\r\n            </MenuSection>\r\n          )\r\n        }\r\n      </UserMenuScrollContainer>\r\n      <UserMenuPinnedContainer>\r\n        {\r\n          sections.filter(a => !!a.pinned).map((section, index) =>\r\n            <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\r\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\r\n              <MenuSectionList key={index}>\r\n                {section.items.map((item, index) => renderItem(item, section, index))}\r\n              </MenuSectionList>\r\n            </MenuSection>\r\n          )\r\n        }\r\n        {\r\n          signOut &&\r\n          <SignOutActionWrapper>\r\n            <Button width={'272px'}\r\n                    variant=\"secondary\"\r\n                    icon={<SystemIcons.Logout/>}\r\n                    size={Size.Large}\r\n                    onClick={e => {\r\n                      e.preventDefault();\r\n                      signOut?.action();\r\n                    }}>\r\n              {signOut?.label}\r\n            </Button>\r\n          </SignOutActionWrapper>\r\n        }\r\n      </UserMenuPinnedContainer>\r\n    </UserMenuWrapper>\r\n  );\r\n};\r\n\r\nexport default UserMenu;\r\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAAQC,MAAM,QAAO,cAAc;AACnC,SACEC,UAAU,EACVC,MAAM,EACNC,iBAAiB,EACjBC,iBAAiB,EACjBC,kBAAkB,EAClBC,kBAAkB,EAClBC,SAAS,QACJ,cAAc;AACrB,SAAQC,IAAI,QAAO,aAAa;AAChC,SAAQC,QAAQ,EAAEC,0BAA0B,QAAO,wBAAwB;AAC3E,SAAQC,WAAW,QAAO,aAAa;AACvC,SAAQC,SAAS,QAAO,iBAAiB;AAEzC,OAAOC,WAAW,MAAM,0BAA0B;AAClD,SAAQC,QAAQ,QAAO,gBAAgB;AACvC,SAAQC,mBAAmB,QAAO,+BAA+B;AACjE,SAAQC,aAAa,QAAO,qBAAqB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAElD,IAAMC,uBAAuB,GAAGtB,MAAM,CAACuB,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,sBAEzC;AAED,IAAMC,uBAAuB,GAAG1B,MAAM,CAACuB,GAAG,CAAAI,gBAAA,KAAAA,gBAAA,GAAAF,sBAAA,QAAE;AAG5C,IAAMG,eAAe,GAAG5B,MAAM,CAACuB,GAAG,CAAAM,gBAAA,KAAAA,gBAAA,GAAAJ,sBAAA,8gBAEZtB,MAAM,CAAC2B,KAAK,EAarBtB,SAAS,CAACuB,UAAU,EAK7BjB,WAAW,CAACkB,MAAM,EAKLtB,QAAQ,EACPR,UAAU,CAAC+B,kBAAkB,EAEvB9B,MAAM,CAAC+B,WAAW,EAC3B1B,SAAS,CAAC2B,UAAU,CAGlC;AAGD,IAAMC,WAAW,GAAGpC,MAAM,CAACuB,GAAG,CAAAc,gBAAA,KAAAA,gBAAA,GAAAZ,sBAAA,kJAOFtB,MAAM,CAAC+B,WAAW,CAE7C;AAED,IAAMI,oBAAoB,GAAGtC,MAAM,CAACoC,WAAW,CAAC,CAAAG,gBAAA,KAAAA,gBAAA,GAAAd,sBAAA,8DAG/C;AAED,IAAMe,iBAAiB,GAAGxC,MAAM,CAACuB,GAAG,CAAAkB,gBAAA,KAAAA,gBAAA,GAAAhB,sBAAA,yKAMdtB,MAAM,CAACuC,UAAU,EAEnCrC,iBAAiB,CAACC,kBAAkB,CAACqC,IAAI,EAAExC,MAAM,CAACyC,WAAW,CAAC,CACjE;AAED,IAAMC,eAAe,GAAG7C,MAAM,CAACuB,GAAG,CAAAuB,gBAAA,KAAAA,gBAAA,GAAArB,sBAAA,mDAI9Bd,0BAA0B,CAC7B;AAGD,IAAMoC,iBAAiB,GAAG/C,MAAM,CAACuB,GAAG,CAAAyB,gBAAA,KAAAA,gBAAA,GAAAvB,sBAAA,0MAYnC;AAED,IAAMwB,eAAe,GAAGjD,MAAM,CAACuB,GAAG,CAAA2B,gBAAA,KAAAA,gBAAA,GAAAzB,sBAAA,uFAKjC;AAED,IAAM0B,mBAAmB,GAAGnD,MAAM,CAACuB,GAAG,CAAA6B,iBAAA,KAAAA,iBAAA,GAAA3B,sBAAA,mBAClCrB,iBAAiB,CAACE,kBAAkB,CAACqC,IAAI,EAAExC,MAAM,CAACkD,WAAW,CAAC,CACjE;AAED,IAAMC,oBAAoB,GAAGtD,MAAM,CAACuB,GAAG,CAAAgC,iBAAA,KAAAA,iBAAA,GAAA9B,sBAAA,6CAEnClB,kBAAkB,CAACD,kBAAkB,CAACkD,OAAO,EAAErD,MAAM,CAACyC,WAAW,CAAC,CACrE;AAED,IAAMa,mBAAmB,GAAGzD,MAAM,CAACuB,GAAG,CAAAmC,iBAAA,KAAAA,iBAAA,GAAAjC,sBAAA,kJAMlClB,kBAAkB,CAACD,kBAAkB,CAACqC,IAAI,EAAE,IAAI,CAAC,CAKpD;AAED,IAAMgB,WAAW,GAAG3D,MAAM,CAACuB,GAAG,CAAAqC,iBAAA,KAAAA,iBAAA,GAAAnC,sBAAA,+FAK7B;AAOD,IAAMoC,QAAQ,GAAG,SAAXA,QAAQA,CAAAC,IAAA,EAA8E;EAAA,IAAzEC,IAAI,GAAAD,IAAA,CAAJC,IAAI;IAAEC,IAAI,GAAAF,IAAA,CAAJE,IAAI;IAAEC,cAAc,GAAAH,IAAA,CAAdG,cAAc;IAAEC,QAAQ,GAAAJ,IAAA,CAARI,QAAQ;IAAEC,OAAO,GAAAL,IAAA,CAAPK,OAAO;IAAEC,KAAK,GAAAN,IAAA,CAALM,KAAK;EAErE,IAAAC,oBAAA,GAAkCrD,mBAAmB,CAAC,CAAC;IAAhDsD,QAAQ,GAAAD,oBAAA,CAARC,QAAQ;IAAEC,aAAa,GAAAF,oBAAA,CAAbE,aAAa;EAE9BxE,KAAK,CAACyE,SAAS,CAAC,YAAM;IAAA,IAAAC,SAAA;IACpB,IAAI,CAACR,cAAc,EAAE;IAErB,SAASS,cAAcA,CAACC,CAAM,EAAE;MAC9B,IAAIA,CAAC,CAACC,GAAG,KAAK,QAAQ,IAAID,CAAC,CAACC,GAAG,KAAK,KAAK,EAAE;QACzCX,cAAc,CAAC,CAAC;MAClB;IACF;IAEA,CAAAQ,SAAA,GAAAI,QAAQ,cAAAJ,SAAA,uBAARA,SAAA,CAAUK,gBAAgB,CAAC,SAAS,EAAEJ,cAAc,EAAE,KAAK,CAAC;IAC5D,OAAO,YAAM;MAAA,IAAAK,UAAA;MACX,CAAAA,UAAA,GAAAF,QAAQ,cAAAE,UAAA,uBAARA,UAAA,CAAUC,mBAAmB,CAAC,SAAS,EAAEN,cAAc,EAAE,KAAK,CAAC;IACjE,CAAC;EACH,CAAC,EAAE,CAACT,cAAc,CAAC,CAAC;EAEpB,IAAMgB,UAAU,GAAG,SAAbA,UAAUA,CAAIC,IAAwB,EAAEC,OAA8B,EAAEC,KAAa;IAAA,oBACzFjE,IAAA,CAACJ,QAAQ;MACCsE,EAAE,aAAAC,MAAA,CAAaF,KAAK,CAAG;MACvBG,MAAM,EAAE,CAACL,IAAI,CAACM,QAAQ,IAAIjB,aAAa,CAACW,IAAI,CAACO,EAAE,EAAE,CAAC,CAACP,IAAI,CAACQ,KAAK,CAAE;MAC/DR,IAAI,EAAE;QACJS,KAAK,EAAET,IAAI,CAACO,EAAE;QACdG,QAAQ,EAAEV,IAAI,CAACU,QAAQ;QACvBC,IAAI,EAAEX,IAAI,CAACW,IAAI;QACfC,YAAY,EAAEZ,IAAI,CAACd;MACrB,CAAE;MACF2B,cAAc,EAAE,SAAAA,eAACpB,CAAC,EAAK;QACrBO,IAAI,CAACc,MAAM,IAAId,IAAI,CAACc,MAAM,CAACrB,CAAC,CAAC;QAC7BL,QAAQ,CAACY,IAAI,CAACO,EAAE,EAAE,CAAC,CAACP,IAAI,CAACM,QAAQ,CAAC;MACpC;IAAE,GAZGJ,KAYF,CAAC;EAAA;EAEhB,oBACE/D,KAAA,CAACO,eAAe;IAACqE,OAAO,EAAEhC,cAAe;IACxBiC,SAAS,EAAEnC,IAAI,GAAG,MAAM,GAAG,EAAG;IAC9BoC,IAAI,EAAC,MAAM;IACX,mBAAgB,gBAAgB;IAAAC,QAAA,gBAC/C/E,KAAA,CAACC,uBAAuB;MAAA8E,QAAA,gBACtB/E,KAAA,CAACsC,WAAW;QAAAyC,QAAA,gBACVjF,IAAA,CAAC4B,iBAAiB;UAAAqD,QAAA,eAChBjF,IAAA,CAACF,aAAa;YAACgF,OAAO,EAAE,SAAAA,QAAA,EAAM,CAC9B,CAAE;YACaI,QAAQ,EAAE,CAAC,CAAE;YACbC,QAAQ,EAAEtC,IAAI,CAACuC,SAAS,CAAC,CAAC,CAAC,GAAGvC,IAAI,CAACwC,QAAQ,CAAC,CAAC;UAAE,CAAC;QAAC,CAC/C,CAAC,eACpBnF,KAAA,CAAC4B,eAAe;UAAAmD,QAAA,gBACdjF,IAAA,CAACgC,mBAAmB;YAAC,wBAAgB;YAAAiD,QAAA,KAAAd,MAAA,CAAKtB,IAAI,CAACuC,SAAS,OAAAjB,MAAA,CAAItB,IAAI,CAACwC,QAAQ;UAAA,CAAwB,CAAC,eAClGrF,IAAA,CAACmC,oBAAoB;YAAC,wBAAgB;YAAA8C,QAAA,EAAEpC,IAAI,CAACyC;UAAK,CAAuB,CAAC,EAExEzC,IAAI,CAAC0C,IAAI,iBACTvF,IAAA,CAACN,SAAS;YAAC8F,OAAO,EAAE,SAAU;YACnBC,IAAI,EAAE5C,IAAI,CAAC0C,IAAI,CAACE,IAAK;YACrBC,MAAM,EAAE7C,IAAI,CAAC0C,IAAI,CAACG,MAAO;YACzBxB,EAAE,EAAErB,IAAI,CAAC0C,IAAI,CAACrB,EAAG;YACjBY,OAAO,EAAEjC,IAAI,CAAC0C,IAAI,CAACT,OAAQ;YAAAG,QAAA,eACpC/E,KAAA,CAACoC,mBAAmB;cAAA2C,QAAA,gBAClBjF,IAAA;gBAAAiF,QAAA,EACGpC,IAAI,CAAC0C,IAAI,CAACtC;cAAK,CACZ,CAAC,EACNJ,IAAI,CAAC0C,IAAI,CAACb,IAAI,iBAAI9F,KAAK,CAAC+G,YAAY,CAAC9C,IAAI,CAAC0C,IAAI,CAACb,IAAI,EAAE;gBAACkB,IAAI,EAAE;cAAM,CAAC,CAAC;YAAA,CAClD;UAAC,CACb,CAAC;QAAA,CAEC,CAAC;MAAA,CACP,CAAC,EAEZ7C,QAAQ,CAAC8C,MAAM,CAAC,UAAAC,CAAC;QAAA,OAAI,CAACA,CAAC,CAACC,MAAM;MAAA,EAAC,CAACC,GAAG,CAAC,UAAChC,OAAO,EAAEC,KAAK;QAAA,oBACjD/D,KAAA,CAACe,WAAW;UAAa8D,SAAS,EAAEf,OAAO,CAACiC,OAAO,GAAG,SAAS,GAAG,EAAG;UAAAhB,QAAA,GAClEjB,OAAO,CAACf,KAAK,iBAAIjD,IAAA,CAACqB,iBAAiB;YAAA4D,QAAA,EAAEjB,OAAO,CAACf;UAAK,CAAoB,CAAC,eACxEjD,IAAA,CAAC0B,eAAe;YAAAuD,QAAA,EACbjB,OAAO,CAACkC,KAAK,CAACF,GAAG,CAAC,UAACjC,IAAI,EAAEE,KAAK;cAAA,OAAKH,UAAU,CAACC,IAAI,EAAEC,OAAO,EAAEC,KAAK,CAAC;YAAA;UAAC,GADjDA,KAEL,CAAC;QAAA,GAJFA,KAKL,CAAC;MAAA,CAChB,CAAC;IAAA,CAEoB,CAAC,eAC1B/D,KAAA,CAACK,uBAAuB;MAAA0E,QAAA,GAEpBlC,QAAQ,CAAC8C,MAAM,CAAC,UAAAC,CAAC;QAAA,OAAI,CAAC,CAACA,CAAC,CAACC,MAAM;MAAA,EAAC,CAACC,GAAG,CAAC,UAAChC,OAAO,EAAEC,KAAK;QAAA,oBAClD/D,KAAA,CAACe,WAAW;UAAa8D,SAAS,EAAEf,OAAO,CAACiC,OAAO,IAAIhC,KAAK,KAAK,CAAC,GAAG,SAAS,GAAG,EAAG;UAAAgB,QAAA,GACjFjB,OAAO,CAACf,KAAK,iBAAIjD,IAAA,CAACqB,iBAAiB;YAAA4D,QAAA,EAAEjB,OAAO,CAACf;UAAK,CAAoB,CAAC,eACxEjD,IAAA,CAAC0B,eAAe;YAAAuD,QAAA,EACbjB,OAAO,CAACkC,KAAK,CAACF,GAAG,CAAC,UAACjC,IAAI,EAAEE,KAAK;cAAA,OAAKH,UAAU,CAACC,IAAI,EAAEC,OAAO,EAAEC,KAAK,CAAC;YAAA;UAAC,GADjDA,KAEL,CAAC;QAAA,GAJFA,KAKL,CAAC;MAAA,CAChB,CAAC,EAGDjB,OAAO,iBACPhD,IAAA,CAACmB,oBAAoB;QAAA8D,QAAA,eACnBjF,IAAA,CAAClB,MAAM;UAACqH,KAAK,EAAE,OAAQ;UACfX,OAAO,EAAC,WAAW;UACnBd,IAAI,eAAE1E,IAAA,CAACP,WAAW,CAAC2G,MAAM,IAAC,CAAE;UAC5BR,IAAI,EAAEtG,IAAI,CAAC+G,KAAM;UACjBvB,OAAO,EAAE,SAAAA,QAAAtB,CAAC,EAAI;YACZA,CAAC,CAAC8C,cAAc,CAAC,CAAC;YAClBtD,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAE6B,MAAM,CAAC,CAAC;UACnB,CAAE;UAAAI,QAAA,EACPjC,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEC;QAAK,CACT;MAAC,CACW,CAAC;IAAA,CAEF,CAAC;EAAA,CACX,CAAC;AAEtB,CAAC;AAACP,QAAA,CAAA6D,SAAA;EA/GA3D,IAAI,EAAA4D,GAAA,CAAAC,IAAA;EACJ3D,cAAc,EAAA0D,GAAA,CAAAE,IAAA,CAAAC;AAAA;AAgHhB,eAAejE,QAAQ","ignoreList":[]}
+{"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","jsx","_jsx","jsxs","_jsxs","UserMenuScrollContainer","div","_templateObject","_taggedTemplateLiteral","UserMenuPinnedContainer","_templateObject2","UserMenuWrapper","_templateObject3","props","getColor","theme","off_canvas","MEDIUM","BOXSHADOW_CENTERED","fixed_menu","MenuSection","_templateObject4","SignOutActionWrapper","_templateObject5","MenuSectionHeader","_templateObject6","Bold","MenuSectionList","_templateObject7","UserSectionAvatar","_templateObject8","UserSectionInfo","_templateObject9","UserSectionInfoName","_templateObject10","UserSectionInfoEmail","_templateObject11","Regular","UserSectionInfoLink","_templateObject12","UserSection","_templateObject13","UserMenu","_ref","show","user","onHideUserMenu","sections","signOut","label","_useNavigationHelper","navigate","isActiveRoute","useEffect","_document","handleKeyPress","e","key","document","addEventListener","_document2","removeEventListener","renderItem","item","section","index","id","concat","active","external","to","exact","value","disabled","icon","displayLabel","onClickHandler","action","onClick","className","role","children","tabIndex","initials","firstName","lastName","email","link","variant","href","target","cloneElement","size","filter","a","pinned","map","divider","items","width","Logout","Large","preventDefault","propTypes","_pt","bool","func","isRequired"],"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport {Button} from '../../Button';\r\nimport {\r\n  BOXSHADOWS,\r\n  COLORS,\r\n  ComponentLStyling,\r\n  ComponentSStyling,\r\n  ComponentTextStyle,\r\n  ComponentXSStyling,\r\n  Z_INDEXES\r\n} from '../../styles';\r\nimport {Size} from '../../types';\r\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\r\nimport {SystemIcons} from '../../icons';\r\nimport {HyperLink} from '../../HyperLink';\r\nimport {MenuNavigationItem, MenuNavigationSection, ProfileMenu} from '../types';\r\nimport Breakpoints from '../../styles/breakpoints';\r\nimport {MenuItem} from '../../MenuItem';\r\nimport {useNavigationHelper} from '../../common/NavigationHelper';\r\nimport {ProfileButton} from '../../ProfileButton';\r\n\r\nconst UserMenuScrollContainer = styled.div`\r\n  flex: 1;\r\n`;\r\n\r\nconst UserMenuPinnedContainer = styled.div``;\r\n\r\n\r\nconst UserMenuWrapper = styled.div`\r\n  margin: 0;\r\n  background-color: ${props => COLORS.getColor('white', props.theme)};\r\n  box-sizing: border-box;\r\n  display: none;\r\n  width: 320px;\r\n\r\n  position: absolute;\r\n\r\n  &.show {\r\n    display: block;\r\n  }\r\n\r\n  top: 0;\r\n  right: 0;\r\n  z-index: ${Z_INDEXES.off_canvas};\r\n  height: 100%;\r\n  flex-flow: column;\r\n\r\n\r\n  ${Breakpoints.MEDIUM} {\r\n    flex-flow: initial;\r\n    top: initial;\r\n    right: initial;\r\n    height: initial;\r\n    animation: ${flowDown} 0.2s ease-in-out;\r\n    box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\r\n    border-radius: 8px;\r\n    border: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n    z-index: ${Z_INDEXES.fixed_menu};\r\n    padding: 24px 0;\r\n  }\r\n`;\r\n\r\n\r\nconst MenuSection = styled.div`\r\n  padding: 4px 0;\r\n  display: flex;\r\n  flex-direction: column;\r\n  width: 100%;\r\n\r\n  &.divider {\r\n    border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n  }\r\n`;\r\n\r\nconst SignOutActionWrapper = styled(MenuSection)`\r\n  align-items: center;\r\n  justify-content: center;\r\n`;\r\n\r\nconst MenuSectionHeader = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 8px 24px 4px 24px;\r\n  box-sizing: border-box;\r\n  min-height: 32px;\r\n  background-color: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n\r\n  ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_500', props.theme))}\r\n`;\r\n\r\nconst MenuSectionList = styled.div`\r\n  margin: 0;\r\n  padding: 0;\r\n\r\n  ${UserMenuSectionListStyling};\r\n`;\r\n\r\n\r\nconst UserSectionAvatar = styled.div`\r\n  pointer-events: none;\r\n\r\n  button {\r\n    padding: 0 !important;\r\n  }\r\n\r\n  button > div {\r\n    width: 48px !important;\r\n    height: 48px !important;\r\n    border-radius: 50% !important;\r\n  }\r\n`;\r\n\r\nconst UserSectionInfo = styled.div`\r\n  padding: 2px 0;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 4px;\r\n`;\r\n\r\nconst UserSectionInfoName = styled.div`\r\n  ${props => ComponentLStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n`;\r\n\r\nconst UserSectionInfoEmail = styled.div`\r\n  word-break: break-all;\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_500', props.theme))}\r\n`;\r\n\r\nconst UserSectionInfoLink = styled.div`\r\n  padding: 2px 0;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n\r\n  ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\r\n  svg {\r\n    width: 16px;\r\n    height: 16px;\r\n  }\r\n`;\r\n\r\nconst UserSection = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n  padding: 0 24px 8px 24px;\r\n  gap: 16px;\r\n`;\r\n\r\ninterface UserMenuProps extends ProfileMenu {\r\n  show?: boolean;\r\n  onHideUserMenu: () => void;\r\n}\r\n\r\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\r\n\r\n  const {navigate, isActiveRoute} = useNavigationHelper();\r\n\r\n  React.useEffect(() => {\r\n    if (!onHideUserMenu) return;\r\n\r\n    function handleKeyPress(e: any) {\r\n      if (e.key === 'Escape' || e.key === 'Esc') {\r\n        onHideUserMenu();\r\n      }\r\n    }\r\n\r\n    document?.addEventListener('keydown', handleKeyPress, false);\r\n    return () => {\r\n      document?.removeEventListener('keydown', handleKeyPress, false);\r\n    };\r\n  }, [onHideUserMenu]);\r\n\r\n  const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\r\n    <MenuItem key={index}\r\n              id={`profile_${index}`}\r\n              active={!item.external && isActiveRoute(item.to, !!item.exact)}\r\n              item={{\r\n                value: item.to,\r\n                disabled: item.disabled,\r\n                icon: item.icon,\r\n                displayLabel: item.label,\r\n              }}\r\n              onClickHandler={(e) => {\r\n                item.action && item.action(e);\r\n                navigate(item.to, !!item.external);\r\n              }}/>\r\n\r\n  return (\r\n    <UserMenuWrapper onClick={onHideUserMenu}\r\n                     className={show ? 'show' : ''}\r\n                     role=\"menu\"\r\n                     aria-labelledby=\"UserMenuButton\">\r\n      <UserMenuScrollContainer>\r\n        <UserSection>\r\n          <UserSectionAvatar>\r\n            <ProfileButton onClick={() => {\r\n            }}\r\n                           tabIndex={-1}\r\n                           initials={user.firstName[0] + user.lastName[0]}/>\r\n          </UserSectionAvatar>\r\n          <UserSectionInfo>\r\n            <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\r\n            <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\r\n            {\r\n              user.link &&\r\n              <HyperLink variant={'default'}\r\n                         href={user.link.href}\r\n                         target={user.link.target}\r\n                         id={user.link.id}\r\n                         onClick={user.link.onClick}>\r\n                <UserSectionInfoLink>\r\n                  <span>\r\n                    {user.link.label}\r\n                  </span>\r\n                  {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\r\n                </UserSectionInfoLink>\r\n              </HyperLink>\r\n            }\r\n          </UserSectionInfo>\r\n        </UserSection>\r\n        {\r\n          sections.filter(a => !a.pinned).map((section, index) =>\r\n            <MenuSection key={index} className={section.divider ? 'divider' : ''}>\r\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\r\n              <MenuSectionList key={index}>\r\n                {section.items.map((item, index) => renderItem(item, section, index))}\r\n              </MenuSectionList>\r\n            </MenuSection>\r\n          )\r\n        }\r\n      </UserMenuScrollContainer>\r\n      <UserMenuPinnedContainer>\r\n        {\r\n          sections.filter(a => !!a.pinned).map((section, index) =>\r\n            <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\r\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\r\n              <MenuSectionList key={index}>\r\n                {section.items.map((item, index) => renderItem(item, section, index))}\r\n              </MenuSectionList>\r\n            </MenuSection>\r\n          )\r\n        }\r\n        {\r\n          signOut &&\r\n          <SignOutActionWrapper>\r\n            <Button width={'272px'}\r\n                    variant=\"secondary\"\r\n                    icon={<SystemIcons.Logout/>}\r\n                    size={Size.Large}\r\n                    onClick={e => {\r\n                      e.preventDefault();\r\n                      signOut?.action();\r\n                    }}>\r\n              {signOut?.label}\r\n            </Button>\r\n          </SignOutActionWrapper>\r\n        }\r\n      </UserMenuPinnedContainer>\r\n    </UserMenuWrapper>\r\n  );\r\n};\r\n\r\nexport default UserMenu;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/GlobalNavigationBar/mobile/CommonStyles.cjs

@@ -16,7 +16,9 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 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);
+var Button = _styledComponents["default"].button(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  background-color: ", ";\n  font-weight: bold;\n  border: 0;\n"])), function (props) {
+  return _styles.COLORS.getColor('white', props.theme);
+});
 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"])));
@@ -24,19 +26,43 @@ 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);
+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"])), function (props) {
+  return _styles.COLORS.getColor('white', props.theme);
+}, _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);
+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"])), function (props) {
+  return _styles.COLORS.getColor('neutral_600', props.theme);
+});
 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);
+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, function (props) {
+  return _styles.COLORS.getColor('primary_20', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('primary_600', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('primary_600', props.theme);
+}, _styles.Z_INDEXES.focus, _styles.focusStyles, _styles.Z_INDEXES.active, function (props) {
+  return _styles.COLORS.getColor('primary_100', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('primary_800', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('primary_800', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('neutral_300', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('neutral_300', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('neutral_100', props.theme);
+});
 exports.UserMenuSectionListStyling = UserMenuSectionListStyling;
-var MenuLink = (0, _styledComponents["default"])(_reactRouterDom.NavLink)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2["default"])(["\n  border: none;\n  background: transparent;\n  margin: auto;\n\n  box-sizing: border-box;\n\n  ", "\n\n  text-decoration: none;\n  text-align: center;\n  align-items: center;\n  display: flex;\n"])), (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.black));
+var MenuLink = (0, _styledComponents["default"])(_reactRouterDom.NavLink)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2["default"])(["\n  border: none;\n  background: transparent;\n  margin: auto;\n\n  box-sizing: border-box;\n\n  ", "\n\n  text-decoration: none;\n  text-align: center;\n  align-items: center;\n  display: flex;\n"])), function (props) {
+  return (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.getColor('black', props.theme));
+});
 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;
@@ -44,10 +70,18 @@ var MobileMenuWrapper = _styledComponents["default"].div(_templateObject15 || (_
 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  ::-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));
+var MobileHeaderText = _styledComponents["default"].div(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2["default"])(["\n  ", "\n  ", " {\n    ", "\n  }\n"])), function (props) {
+  return (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.getColor('neutral_600', props.theme));
+}, _styles.BREAKPOINTS.SMALL, function (props) {
+  return (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.getColor('neutral_600', props.theme));
+});
 exports.MobileHeaderText = MobileHeaderText;
-var MobileHeaderNote = _styledComponents["default"].div(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2["default"])(["\n  word-break: break-all;\n  ", "\n"])), (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600));
+var MobileHeaderNote = _styledComponents["default"].div(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2["default"])(["\n  word-break: break-all;\n  ", "\n"])), function (props) {
+  return (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.getColor('neutral_600', props.theme));
+});
 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);
+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"])), function (props) {
+  return _styles.COLORS.getColor('neutral_200', props.theme);
+});
 exports.MobileHeaderContainer = MobileHeaderContainer;
 //# sourceMappingURL=CommonStyles.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"CommonStyles.cjs","names":["_styledComponents","_interopRequireWildcard","require","_styles","_reactRouterDom","_types","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","_templateObject9","_templateObject10","_templateObject11","_templateObject12","_templateObject13","_templateObject14","_templateObject15","_templateObject16","_templateObject17","_templateObject18","_templateObject19","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","RowLayout","styled","div","_taggedTemplateLiteral2","exports","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","ComponentXSStyling","MobileHeaderContainer","neutral_200"],"sources":["../../../src/GlobalNavigationBar/mobile/CommonStyles.ts"],"sourcesContent":["import styled, {css, keyframes} from 'styled-components';\r\nimport {\r\n  BREAKPOINTS,\r\n  COLORS,\r\n  ComponentMStyling,\r\n  ComponentSStyling,\r\n  ComponentTextStyle,\r\n  ComponentXSStyling,\r\n  focusStyles,\r\n  scrollBarStyling,\r\n  Z_INDEXES\r\n} from '../../styles';\r\nimport {NavLink} from 'react-router-dom';\r\nimport {Size} from '../../types';\r\n\r\nexport const RowLayout = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n`;\r\n\r\nexport const Button = styled.button`\r\n  background-color: ${COLORS.white};\r\n  font-weight: bold;\r\n  border: 0;\r\n`;\r\n\r\nconst flowLeft = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    transform: translateX(100%);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateX(0);\r\n  }\r\n`;\r\n\r\nconst flowRight = keyframes`\r\n  0% {\r\n    opacity: 1;\r\n    transform: translateX(0);\r\n    visibility: visible;\r\n  }\r\n  to {\r\n    opacity: 0;\r\n    visibility: hidden;\r\n    transform: translateX(100%);\r\n  }\r\n`;\r\n\r\nexport const fadeOut = keyframes`\r\n  0% {\r\n    opacity: 1;\r\n    visibility: visible;\r\n  }\r\n  to {\r\n    opacity: 0;\r\n    visibility: hidden;\r\n  }\r\n`;\r\n\r\nexport const fadeIn = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    visibility: hidden;\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    visibility: visible;\r\n  }\r\n`;\r\n\r\nexport const Menu = styled.div`\r\n  height: 100%;\r\n  background-color: ${COLORS.white};\r\n  box-sizing: border-box;\r\n  right: 0;\r\n  top: 0;\r\n  position: absolute;\r\n  z-index: ${Z_INDEXES.off_canvas};\r\n  align-items: center;\r\n\r\n  width: 320px;\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    width: 400px;\r\n  }\r\n\r\n  .open & {\r\n    visibility: visible;\r\n    display: flex;\r\n    animation: ${flowLeft} 0.3s ease-in-out;\r\n  }\r\n\r\n  .closed & {\r\n    visibility: hidden;\r\n    animation: ${flowRight} 0.3s ease-in-out;\r\n  }\r\n`;\r\n\r\nexport const Right = styled.div`\r\n  display: flex;\r\n  margin-left: auto;\r\n`;\r\n\r\nexport const SiteName = styled.span`\r\n  color: ${COLORS.neutral_600};\r\n  font-weight: bold;\r\n  font-size: 14px;\r\n  margin-left: 4px;\r\n`;\r\n\r\nexport const MenuSection = styled.li`\r\n  margin-top: 16px;\r\n\r\n  .disabled-link {\r\n    color: #21212150;\r\n    pointer-events: none;\r\n    key-events: none;\r\n  }\r\n`;\r\n\r\nexport const MenuSectionList = styled.ul`\r\n  list-style: none;\r\n  padding: 0;\r\n\r\n  li {\r\n    width: 80%;\r\n    height: 48px;\r\n    margin: 0 auto 0 12px;\r\n\r\n    a {\r\n      height: 100%;\r\n    }\r\n  }\r\n`;\r\n\r\nexport const UserMenuSectionListStyling = css`\r\n  li {\r\n    position: relative;\r\n  }\r\n\r\n  li:hover:not(.disabled) {\r\n    z-index: ${Z_INDEXES.hover};\r\n    background-color: ${COLORS.primary_20};\r\n\r\n    a {\r\n      color: ${COLORS.primary_600};\r\n    }\r\n\r\n    svg {\r\n      color: ${COLORS.primary_600};\r\n    }\r\n  }\r\n\r\n  li:focus-within:not(.disabled) {\r\n    z-index: ${Z_INDEXES.focus};\r\n\r\n    ${focusStyles}\r\n    a {\r\n      outline: none;\r\n    }\r\n  }\r\n\r\n  li:active:not(.disabled) {\r\n    z-index: ${Z_INDEXES.active};\r\n    background: ${COLORS.primary_100};\r\n\r\n    a {\r\n      color: ${COLORS.primary_800};\r\n    }\r\n\r\n    svg {\r\n      color: ${COLORS.primary_800};\r\n    }\r\n  }\r\n\r\n  .disabled {\r\n    a {\r\n      color: ${COLORS.neutral_300};\r\n    }\r\n\r\n    svg {\r\n      color: ${COLORS.neutral_300};\r\n    }\r\n\r\n    background-color: ${COLORS.neutral_100};\r\n  }\r\n`;\r\n\r\nexport const MenuLink = styled(NavLink)`\r\n  border: none;\r\n  background: transparent;\r\n  margin: auto;\r\n\r\n  box-sizing: border-box;\r\n\r\n  ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n\r\n  text-decoration: none;\r\n  text-align: center;\r\n  align-items: center;\r\n  display: flex;\r\n`;\r\n\r\nexport const flowDown = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    transform: translateY(-10px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n`;\r\n\r\nexport const MobileMenuWrapper = styled.div`\r\n  width: 100%;\r\n  box-sizing: border-box;\r\n  flex-flow: column;\r\n  display: flex;\r\n  flex: 1;\r\n  overflow: hidden;\r\n`;\r\n\r\nexport const ScrollableContainer = styled.div`\r\n  flex: 1;\r\n  display: flex;\r\n  flex-direction: column;\r\n  overflow-y: auto;\r\n  max-height: 100%;\r\n\r\n  &.scrollable {\r\n    margin-right: 6px;\r\n    padding-right: 10px;\r\n  }\r\n\r\n  ${scrollBarStyling(Size.Small)}\r\n  ::-webkit-scrollbar-track {\r\n    margin: 8px;\r\n  }\r\n`;\r\n\r\nexport const MobileHeaderText = styled.div`\r\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\r\n  ${BREAKPOINTS.SMALL} {\r\n    ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\r\n  }\r\n`;\r\nexport const MobileHeaderNote = styled.div`\r\n  word-break: break-all;\r\n  ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\r\n`;\r\n\r\nexport const MobileHeaderContainer = styled.div`\r\n  margin: 0 24px;\r\n  padding-bottom: 8px;\r\n  box-sizing: border-box;\r\n  border-bottom: 1px solid ${COLORS.neutral_200};\r\n  display: flex;\r\n  flex-direction: column;\r\n`;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"CommonStyles.cjs","names":["_styledComponents","_interopRequireWildcard","require","_styles","_reactRouterDom","_types","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","_templateObject9","_templateObject10","_templateObject11","_templateObject12","_templateObject13","_templateObject14","_templateObject15","_templateObject16","_templateObject17","_templateObject18","_templateObject19","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","RowLayout","styled","div","_taggedTemplateLiteral2","exports","Button","button","props","COLORS","getColor","theme","flowLeft","keyframes","flowRight","fadeOut","fadeIn","Menu","Z_INDEXES","off_canvas","BREAKPOINTS","SMALL","Right","SiteName","span","MenuSection","li","MenuSectionList","ul","UserMenuSectionListStyling","css","hover","focus","focusStyles","active","MenuLink","NavLink","ComponentMStyling","ComponentTextStyle","Regular","flowDown","MobileMenuWrapper","ScrollableContainer","scrollBarStyling","Size","Small","MobileHeaderText","ComponentSStyling","Bold","MobileHeaderNote","ComponentXSStyling","MobileHeaderContainer"],"sources":["../../../src/GlobalNavigationBar/mobile/CommonStyles.ts"],"sourcesContent":["import styled, {css, keyframes} from 'styled-components';\r\nimport {\r\n  BREAKPOINTS,\r\n  COLORS,\r\n  ComponentMStyling,\r\n  ComponentSStyling,\r\n  ComponentTextStyle,\r\n  ComponentXSStyling,\r\n  focusStyles,\r\n  scrollBarStyling,\r\n  Z_INDEXES\r\n} from '../../styles';\r\nimport {NavLink} from 'react-router-dom';\r\nimport {Size} from '../../types';\r\n\r\nexport const RowLayout = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n`;\r\n\r\nexport const Button = styled.button`\r\n  background-color: ${props => COLORS.getColor('white', props.theme)};\r\n  font-weight: bold;\r\n  border: 0;\r\n`;\r\n\r\nconst flowLeft = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    transform: translateX(100%);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateX(0);\r\n  }\r\n`;\r\n\r\nconst flowRight = keyframes`\r\n  0% {\r\n    opacity: 1;\r\n    transform: translateX(0);\r\n    visibility: visible;\r\n  }\r\n  to {\r\n    opacity: 0;\r\n    visibility: hidden;\r\n    transform: translateX(100%);\r\n  }\r\n`;\r\n\r\nexport const fadeOut = keyframes`\r\n  0% {\r\n    opacity: 1;\r\n    visibility: visible;\r\n  }\r\n  to {\r\n    opacity: 0;\r\n    visibility: hidden;\r\n  }\r\n`;\r\n\r\nexport const fadeIn = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    visibility: hidden;\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    visibility: visible;\r\n  }\r\n`;\r\n\r\nexport const Menu = styled.div`\r\n  height: 100%;\r\n  background-color: ${props => COLORS.getColor('white', props.theme)};\r\n  box-sizing: border-box;\r\n  right: 0;\r\n  top: 0;\r\n  position: absolute;\r\n  z-index: ${Z_INDEXES.off_canvas};\r\n  align-items: center;\r\n\r\n  width: 320px;\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    width: 400px;\r\n  }\r\n\r\n  .open & {\r\n    visibility: visible;\r\n    display: flex;\r\n    animation: ${flowLeft} 0.3s ease-in-out;\r\n  }\r\n\r\n  .closed & {\r\n    visibility: hidden;\r\n    animation: ${flowRight} 0.3s ease-in-out;\r\n  }\r\n`;\r\n\r\nexport const Right = styled.div`\r\n  display: flex;\r\n  margin-left: auto;\r\n`;\r\n\r\nexport const SiteName = styled.span`\r\n  color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n  font-weight: bold;\r\n  font-size: 14px;\r\n  margin-left: 4px;\r\n`;\r\n\r\nexport const MenuSection = styled.li`\r\n  margin-top: 16px;\r\n\r\n  .disabled-link {\r\n    color: #21212150;\r\n    pointer-events: none;\r\n    key-events: none;\r\n  }\r\n`;\r\n\r\nexport const MenuSectionList = styled.ul`\r\n  list-style: none;\r\n  padding: 0;\r\n\r\n  li {\r\n    width: 80%;\r\n    height: 48px;\r\n    margin: 0 auto 0 12px;\r\n\r\n    a {\r\n      height: 100%;\r\n    }\r\n  }\r\n`;\r\n\r\nexport const UserMenuSectionListStyling = css`\r\n  li {\r\n    position: relative;\r\n  }\r\n\r\n  li:hover:not(.disabled) {\r\n    z-index: ${Z_INDEXES.hover};\r\n    background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n\r\n    a {\r\n      color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n    }\r\n\r\n    svg {\r\n      color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n    }\r\n  }\r\n\r\n  li:focus-within:not(.disabled) {\r\n    z-index: ${Z_INDEXES.focus};\r\n\r\n    ${focusStyles}\r\n    a {\r\n      outline: none;\r\n    }\r\n  }\r\n\r\n  li:active:not(.disabled) {\r\n    z-index: ${Z_INDEXES.active};\r\n    background: ${props => COLORS.getColor('primary_100', props.theme)};\r\n\r\n    a {\r\n      color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n\r\n    svg {\r\n      color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n  }\r\n\r\n  .disabled {\r\n    a {\r\n      color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n    }\r\n\r\n    svg {\r\n      color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n    }\r\n\r\n    background-color: ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  }\r\n`;\r\n\r\nexport const MenuLink = styled(NavLink)`\r\n  border: none;\r\n  background: transparent;\r\n  margin: auto;\r\n\r\n  box-sizing: border-box;\r\n\r\n  ${props => ComponentMStyling(ComponentTextStyle.Regular, COLORS.getColor('black', props.theme))}\r\n\r\n  text-decoration: none;\r\n  text-align: center;\r\n  align-items: center;\r\n  display: flex;\r\n`;\r\n\r\nexport const flowDown = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    transform: translateY(-10px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n`;\r\n\r\nexport const MobileMenuWrapper = styled.div`\r\n  width: 100%;\r\n  box-sizing: border-box;\r\n  flex-flow: column;\r\n  display: flex;\r\n  flex: 1;\r\n  overflow: hidden;\r\n`;\r\n\r\nexport const ScrollableContainer = styled.div`\r\n  flex: 1;\r\n  display: flex;\r\n  flex-direction: column;\r\n  overflow-y: auto;\r\n  max-height: 100%;\r\n\r\n  &.scrollable {\r\n    margin-right: 6px;\r\n    padding-right: 10px;\r\n  }\r\n\r\n  ${scrollBarStyling(Size.Small)}\r\n  ::-webkit-scrollbar-track {\r\n    margin: 8px;\r\n  }\r\n`;\r\n\r\nexport const MobileHeaderText = styled.div`\r\n  ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  ${BREAKPOINTS.SMALL} {\r\n    ${props => ComponentMStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n`;\r\nexport const MobileHeaderNote = styled.div`\r\n  word-break: break-all;\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n`;\r\n\r\nexport const MobileHeaderContainer = styled.div`\r\n  margin: 0 24px;\r\n  padding-bottom: 8px;\r\n  box-sizing: border-box;\r\n  border-bottom: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n  display: flex;\r\n  flex-direction: column;\r\n`;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/GlobalNavigationBar/mobile/CommonStyles.d.ts

@@ -8,7 +8,7 @@ export declare const Right: import("styled-components").StyledComponent<"div", a
 export declare const SiteName: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const MenuSection: import("styled-components").StyledComponent<"li", any, {}, never>;
 export declare const MenuSectionList: import("styled-components").StyledComponent<"ul", any, {}, never>;
-export declare const UserMenuSectionListStyling: import("styled-components").FlattenSimpleInterpolation;
+export declare const UserMenuSectionListStyling: import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<any>>;
 export declare const MenuLink: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react-router-dom").NavLinkProps & import("react").RefAttributes<HTMLAnchorElement>>, any, {}, never>;
 export declare const flowDown: import("styled-components").Keyframes;
 export declare const MobileMenuWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/GlobalNavigationBar/mobile/CommonStyles.js

@@ -5,22 +5,56 @@ import { BREAKPOINTS, COLORS, ComponentMStyling, ComponentSStyling, ComponentTex
 import { NavLink } from 'react-router-dom';
 import { Size } from '../../types';
 export var RowLayout = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n"])));
-export var Button = styled.button(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  background-color: ", ";\n  font-weight: bold;\n  border: 0;\n"])), COLORS.white);
+export var Button = styled.button(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  background-color: ", ";\n  font-weight: bold;\n  border: 0;\n"])), function (props) {
+  return COLORS.getColor('white', props.theme);
+});
 var flowLeft = keyframes(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  0% {\n    opacity: 0;\n    transform: translateX(100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n"])));
 var flowRight = keyframes(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\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"])));
 export var fadeOut = keyframes(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  0% {\n    opacity: 1;\n    visibility: visible;\n  }\n  to {\n    opacity: 0;\n    visibility: hidden;\n  }\n"])));
 export var fadeIn = keyframes(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  0% {\n    opacity: 0;\n    visibility: hidden;\n  }\n  to {\n    opacity: 1;\n    visibility: visible;\n  }\n"])));
-export var Menu = styled.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\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"])), COLORS.white, Z_INDEXES.off_canvas, BREAKPOINTS.SMALL, flowLeft, flowRight);
+export var Menu = styled.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\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"])), function (props) {
+  return COLORS.getColor('white', props.theme);
+}, Z_INDEXES.off_canvas, BREAKPOINTS.SMALL, flowLeft, flowRight);
 export var Right = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  display: flex;\n  margin-left: auto;\n"])));
-export var SiteName = styled.span(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  color: ", ";\n  font-weight: bold;\n  font-size: 14px;\n  margin-left: 4px;\n"])), COLORS.neutral_600);
+export var SiteName = styled.span(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  color: ", ";\n  font-weight: bold;\n  font-size: 14px;\n  margin-left: 4px;\n"])), function (props) {
+  return COLORS.getColor('neutral_600', props.theme);
+});
 export var MenuSection = styled.li(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  margin-top: 16px;\n\n  .disabled-link {\n    color: #21212150;\n    pointer-events: none;\n    key-events: none;\n  }\n"])));
 export var MenuSectionList = styled.ul(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\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"])));
-export var UserMenuSectionListStyling = css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\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"])), Z_INDEXES.hover, COLORS.primary_20, COLORS.primary_600, COLORS.primary_600, Z_INDEXES.focus, focusStyles, Z_INDEXES.active, COLORS.primary_100, COLORS.primary_800, COLORS.primary_800, COLORS.neutral_300, COLORS.neutral_300, COLORS.neutral_100);
-export var MenuLink = styled(NavLink)(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  border: none;\n  background: transparent;\n  margin: auto;\n\n  box-sizing: border-box;\n\n  ", "\n\n  text-decoration: none;\n  text-align: center;\n  align-items: center;\n  display: flex;\n"])), ComponentMStyling(ComponentTextStyle.Regular, COLORS.black));
+export var UserMenuSectionListStyling = css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\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"])), Z_INDEXES.hover, function (props) {
+  return COLORS.getColor('primary_20', props.theme);
+}, function (props) {
+  return COLORS.getColor('primary_600', props.theme);
+}, function (props) {
+  return COLORS.getColor('primary_600', props.theme);
+}, Z_INDEXES.focus, focusStyles, Z_INDEXES.active, function (props) {
+  return COLORS.getColor('primary_100', props.theme);
+}, function (props) {
+  return COLORS.getColor('primary_800', props.theme);
+}, function (props) {
+  return COLORS.getColor('primary_800', props.theme);
+}, function (props) {
+  return COLORS.getColor('neutral_300', props.theme);
+}, function (props) {
+  return COLORS.getColor('neutral_300', props.theme);
+}, function (props) {
+  return COLORS.getColor('neutral_100', props.theme);
+});
+export var MenuLink = styled(NavLink)(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  border: none;\n  background: transparent;\n  margin: auto;\n\n  box-sizing: border-box;\n\n  ", "\n\n  text-decoration: none;\n  text-align: center;\n  align-items: center;\n  display: flex;\n"])), function (props) {
+  return ComponentMStyling(ComponentTextStyle.Regular, COLORS.getColor('black', props.theme));
+});
 export var flowDown = keyframes(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n  0% {\n    opacity: 0;\n    transform: translateY(-10px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n"])));
 export var MobileMenuWrapper = styled.div(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n  width: 100%;\n  box-sizing: border-box;\n  flex-flow: column;\n  display: flex;\n  flex: 1;\n  overflow: hidden;\n"])));
 export var ScrollableContainer = styled.div(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\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  ::-webkit-scrollbar-track {\n    margin: 8px;\n  }\n"])), scrollBarStyling(Size.Small));
-export var MobileHeaderText = styled.div(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n  ", "\n  ", " {\n    ", "\n  }\n"])), ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600), BREAKPOINTS.SMALL, ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600));
-export var MobileHeaderNote = styled.div(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n  word-break: break-all;\n  ", "\n"])), ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600));
-export var MobileHeaderContainer = styled.div(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\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"])), COLORS.neutral_200);
+export var MobileHeaderText = styled.div(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n  ", "\n  ", " {\n    ", "\n  }\n"])), function (props) {
+  return ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme));
+}, BREAKPOINTS.SMALL, function (props) {
+  return ComponentMStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme));
+});
+export var MobileHeaderNote = styled.div(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n  word-break: break-all;\n  ", "\n"])), function (props) {
+  return ComponentXSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme));
+});
+export var MobileHeaderContainer = styled.div(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\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"])), function (props) {
+  return COLORS.getColor('neutral_200', props.theme);
+});
 //# sourceMappingURL=CommonStyles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"CommonStyles.js","names":["styled","css","keyframes","BREAKPOINTS","COLORS","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","focusStyles","scrollBarStyling","Z_INDEXES","NavLink","Size","RowLayout","div","_templateObject","_taggedTemplateLiteral","Button","button","_templateObject2","white","flowLeft","_templateObject3","flowRight","_templateObject4","fadeOut","_templateObject5","fadeIn","_templateObject6","Menu","_templateObject7","off_canvas","SMALL","Right","_templateObject8","SiteName","span","_templateObject9","neutral_600","MenuSection","li","_templateObject10","MenuSectionList","ul","_templateObject11","UserMenuSectionListStyling","_templateObject12","hover","primary_20","primary_600","focus","active","primary_100","primary_800","neutral_300","neutral_100","MenuLink","_templateObject13","Regular","black","flowDown","_templateObject14","MobileMenuWrapper","_templateObject15","ScrollableContainer","_templateObject16","Small","MobileHeaderText","_templateObject17","Bold","MobileHeaderNote","_templateObject18","MobileHeaderContainer","_templateObject19","neutral_200"],"sources":["../../../src/GlobalNavigationBar/mobile/CommonStyles.ts"],"sourcesContent":["import styled, {css, keyframes} from 'styled-components';\r\nimport {\r\n  BREAKPOINTS,\r\n  COLORS,\r\n  ComponentMStyling,\r\n  ComponentSStyling,\r\n  ComponentTextStyle,\r\n  ComponentXSStyling,\r\n  focusStyles,\r\n  scrollBarStyling,\r\n  Z_INDEXES\r\n} from '../../styles';\r\nimport {NavLink} from 'react-router-dom';\r\nimport {Size} from '../../types';\r\n\r\nexport const RowLayout = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n`;\r\n\r\nexport const Button = styled.button`\r\n  background-color: ${COLORS.white};\r\n  font-weight: bold;\r\n  border: 0;\r\n`;\r\n\r\nconst flowLeft = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    transform: translateX(100%);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateX(0);\r\n  }\r\n`;\r\n\r\nconst flowRight = keyframes`\r\n  0% {\r\n    opacity: 1;\r\n    transform: translateX(0);\r\n    visibility: visible;\r\n  }\r\n  to {\r\n    opacity: 0;\r\n    visibility: hidden;\r\n    transform: translateX(100%);\r\n  }\r\n`;\r\n\r\nexport const fadeOut = keyframes`\r\n  0% {\r\n    opacity: 1;\r\n    visibility: visible;\r\n  }\r\n  to {\r\n    opacity: 0;\r\n    visibility: hidden;\r\n  }\r\n`;\r\n\r\nexport const fadeIn = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    visibility: hidden;\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    visibility: visible;\r\n  }\r\n`;\r\n\r\nexport const Menu = styled.div`\r\n  height: 100%;\r\n  background-color: ${COLORS.white};\r\n  box-sizing: border-box;\r\n  right: 0;\r\n  top: 0;\r\n  position: absolute;\r\n  z-index: ${Z_INDEXES.off_canvas};\r\n  align-items: center;\r\n\r\n  width: 320px;\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    width: 400px;\r\n  }\r\n\r\n  .open & {\r\n    visibility: visible;\r\n    display: flex;\r\n    animation: ${flowLeft} 0.3s ease-in-out;\r\n  }\r\n\r\n  .closed & {\r\n    visibility: hidden;\r\n    animation: ${flowRight} 0.3s ease-in-out;\r\n  }\r\n`;\r\n\r\nexport const Right = styled.div`\r\n  display: flex;\r\n  margin-left: auto;\r\n`;\r\n\r\nexport const SiteName = styled.span`\r\n  color: ${COLORS.neutral_600};\r\n  font-weight: bold;\r\n  font-size: 14px;\r\n  margin-left: 4px;\r\n`;\r\n\r\nexport const MenuSection = styled.li`\r\n  margin-top: 16px;\r\n\r\n  .disabled-link {\r\n    color: #21212150;\r\n    pointer-events: none;\r\n    key-events: none;\r\n  }\r\n`;\r\n\r\nexport const MenuSectionList = styled.ul`\r\n  list-style: none;\r\n  padding: 0;\r\n\r\n  li {\r\n    width: 80%;\r\n    height: 48px;\r\n    margin: 0 auto 0 12px;\r\n\r\n    a {\r\n      height: 100%;\r\n    }\r\n  }\r\n`;\r\n\r\nexport const UserMenuSectionListStyling = css`\r\n  li {\r\n    position: relative;\r\n  }\r\n\r\n  li:hover:not(.disabled) {\r\n    z-index: ${Z_INDEXES.hover};\r\n    background-color: ${COLORS.primary_20};\r\n\r\n    a {\r\n      color: ${COLORS.primary_600};\r\n    }\r\n\r\n    svg {\r\n      color: ${COLORS.primary_600};\r\n    }\r\n  }\r\n\r\n  li:focus-within:not(.disabled) {\r\n    z-index: ${Z_INDEXES.focus};\r\n\r\n    ${focusStyles}\r\n    a {\r\n      outline: none;\r\n    }\r\n  }\r\n\r\n  li:active:not(.disabled) {\r\n    z-index: ${Z_INDEXES.active};\r\n    background: ${COLORS.primary_100};\r\n\r\n    a {\r\n      color: ${COLORS.primary_800};\r\n    }\r\n\r\n    svg {\r\n      color: ${COLORS.primary_800};\r\n    }\r\n  }\r\n\r\n  .disabled {\r\n    a {\r\n      color: ${COLORS.neutral_300};\r\n    }\r\n\r\n    svg {\r\n      color: ${COLORS.neutral_300};\r\n    }\r\n\r\n    background-color: ${COLORS.neutral_100};\r\n  }\r\n`;\r\n\r\nexport const MenuLink = styled(NavLink)`\r\n  border: none;\r\n  background: transparent;\r\n  margin: auto;\r\n\r\n  box-sizing: border-box;\r\n\r\n  ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n\r\n  text-decoration: none;\r\n  text-align: center;\r\n  align-items: center;\r\n  display: flex;\r\n`;\r\n\r\nexport const flowDown = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    transform: translateY(-10px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n`;\r\n\r\nexport const MobileMenuWrapper = styled.div`\r\n  width: 100%;\r\n  box-sizing: border-box;\r\n  flex-flow: column;\r\n  display: flex;\r\n  flex: 1;\r\n  overflow: hidden;\r\n`;\r\n\r\nexport const ScrollableContainer = styled.div`\r\n  flex: 1;\r\n  display: flex;\r\n  flex-direction: column;\r\n  overflow-y: auto;\r\n  max-height: 100%;\r\n\r\n  &.scrollable {\r\n    margin-right: 6px;\r\n    padding-right: 10px;\r\n  }\r\n\r\n  ${scrollBarStyling(Size.Small)}\r\n  ::-webkit-scrollbar-track {\r\n    margin: 8px;\r\n  }\r\n`;\r\n\r\nexport const MobileHeaderText = styled.div`\r\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\r\n  ${BREAKPOINTS.SMALL} {\r\n    ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\r\n  }\r\n`;\r\nexport const MobileHeaderNote = styled.div`\r\n  word-break: break-all;\r\n  ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\r\n`;\r\n\r\nexport const MobileHeaderContainer = styled.div`\r\n  margin: 0 24px;\r\n  padding-bottom: 8px;\r\n  box-sizing: border-box;\r\n  border-bottom: 1px solid ${COLORS.neutral_200};\r\n  display: flex;\r\n  flex-direction: column;\r\n`;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"CommonStyles.js","names":["styled","css","keyframes","BREAKPOINTS","COLORS","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","focusStyles","scrollBarStyling","Z_INDEXES","NavLink","Size","RowLayout","div","_templateObject","_taggedTemplateLiteral","Button","button","_templateObject2","props","getColor","theme","flowLeft","_templateObject3","flowRight","_templateObject4","fadeOut","_templateObject5","fadeIn","_templateObject6","Menu","_templateObject7","off_canvas","SMALL","Right","_templateObject8","SiteName","span","_templateObject9","MenuSection","li","_templateObject10","MenuSectionList","ul","_templateObject11","UserMenuSectionListStyling","_templateObject12","hover","focus","active","MenuLink","_templateObject13","Regular","flowDown","_templateObject14","MobileMenuWrapper","_templateObject15","ScrollableContainer","_templateObject16","Small","MobileHeaderText","_templateObject17","Bold","MobileHeaderNote","_templateObject18","MobileHeaderContainer","_templateObject19"],"sources":["../../../src/GlobalNavigationBar/mobile/CommonStyles.ts"],"sourcesContent":["import styled, {css, keyframes} from 'styled-components';\r\nimport {\r\n  BREAKPOINTS,\r\n  COLORS,\r\n  ComponentMStyling,\r\n  ComponentSStyling,\r\n  ComponentTextStyle,\r\n  ComponentXSStyling,\r\n  focusStyles,\r\n  scrollBarStyling,\r\n  Z_INDEXES\r\n} from '../../styles';\r\nimport {NavLink} from 'react-router-dom';\r\nimport {Size} from '../../types';\r\n\r\nexport const RowLayout = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n`;\r\n\r\nexport const Button = styled.button`\r\n  background-color: ${props => COLORS.getColor('white', props.theme)};\r\n  font-weight: bold;\r\n  border: 0;\r\n`;\r\n\r\nconst flowLeft = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    transform: translateX(100%);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateX(0);\r\n  }\r\n`;\r\n\r\nconst flowRight = keyframes`\r\n  0% {\r\n    opacity: 1;\r\n    transform: translateX(0);\r\n    visibility: visible;\r\n  }\r\n  to {\r\n    opacity: 0;\r\n    visibility: hidden;\r\n    transform: translateX(100%);\r\n  }\r\n`;\r\n\r\nexport const fadeOut = keyframes`\r\n  0% {\r\n    opacity: 1;\r\n    visibility: visible;\r\n  }\r\n  to {\r\n    opacity: 0;\r\n    visibility: hidden;\r\n  }\r\n`;\r\n\r\nexport const fadeIn = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    visibility: hidden;\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    visibility: visible;\r\n  }\r\n`;\r\n\r\nexport const Menu = styled.div`\r\n  height: 100%;\r\n  background-color: ${props => COLORS.getColor('white', props.theme)};\r\n  box-sizing: border-box;\r\n  right: 0;\r\n  top: 0;\r\n  position: absolute;\r\n  z-index: ${Z_INDEXES.off_canvas};\r\n  align-items: center;\r\n\r\n  width: 320px;\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    width: 400px;\r\n  }\r\n\r\n  .open & {\r\n    visibility: visible;\r\n    display: flex;\r\n    animation: ${flowLeft} 0.3s ease-in-out;\r\n  }\r\n\r\n  .closed & {\r\n    visibility: hidden;\r\n    animation: ${flowRight} 0.3s ease-in-out;\r\n  }\r\n`;\r\n\r\nexport const Right = styled.div`\r\n  display: flex;\r\n  margin-left: auto;\r\n`;\r\n\r\nexport const SiteName = styled.span`\r\n  color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n  font-weight: bold;\r\n  font-size: 14px;\r\n  margin-left: 4px;\r\n`;\r\n\r\nexport const MenuSection = styled.li`\r\n  margin-top: 16px;\r\n\r\n  .disabled-link {\r\n    color: #21212150;\r\n    pointer-events: none;\r\n    key-events: none;\r\n  }\r\n`;\r\n\r\nexport const MenuSectionList = styled.ul`\r\n  list-style: none;\r\n  padding: 0;\r\n\r\n  li {\r\n    width: 80%;\r\n    height: 48px;\r\n    margin: 0 auto 0 12px;\r\n\r\n    a {\r\n      height: 100%;\r\n    }\r\n  }\r\n`;\r\n\r\nexport const UserMenuSectionListStyling = css`\r\n  li {\r\n    position: relative;\r\n  }\r\n\r\n  li:hover:not(.disabled) {\r\n    z-index: ${Z_INDEXES.hover};\r\n    background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n\r\n    a {\r\n      color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n    }\r\n\r\n    svg {\r\n      color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n    }\r\n  }\r\n\r\n  li:focus-within:not(.disabled) {\r\n    z-index: ${Z_INDEXES.focus};\r\n\r\n    ${focusStyles}\r\n    a {\r\n      outline: none;\r\n    }\r\n  }\r\n\r\n  li:active:not(.disabled) {\r\n    z-index: ${Z_INDEXES.active};\r\n    background: ${props => COLORS.getColor('primary_100', props.theme)};\r\n\r\n    a {\r\n      color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n\r\n    svg {\r\n      color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n  }\r\n\r\n  .disabled {\r\n    a {\r\n      color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n    }\r\n\r\n    svg {\r\n      color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n    }\r\n\r\n    background-color: ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  }\r\n`;\r\n\r\nexport const MenuLink = styled(NavLink)`\r\n  border: none;\r\n  background: transparent;\r\n  margin: auto;\r\n\r\n  box-sizing: border-box;\r\n\r\n  ${props => ComponentMStyling(ComponentTextStyle.Regular, COLORS.getColor('black', props.theme))}\r\n\r\n  text-decoration: none;\r\n  text-align: center;\r\n  align-items: center;\r\n  display: flex;\r\n`;\r\n\r\nexport const flowDown = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    transform: translateY(-10px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n`;\r\n\r\nexport const MobileMenuWrapper = styled.div`\r\n  width: 100%;\r\n  box-sizing: border-box;\r\n  flex-flow: column;\r\n  display: flex;\r\n  flex: 1;\r\n  overflow: hidden;\r\n`;\r\n\r\nexport const ScrollableContainer = styled.div`\r\n  flex: 1;\r\n  display: flex;\r\n  flex-direction: column;\r\n  overflow-y: auto;\r\n  max-height: 100%;\r\n\r\n  &.scrollable {\r\n    margin-right: 6px;\r\n    padding-right: 10px;\r\n  }\r\n\r\n  ${scrollBarStyling(Size.Small)}\r\n  ::-webkit-scrollbar-track {\r\n    margin: 8px;\r\n  }\r\n`;\r\n\r\nexport const MobileHeaderText = styled.div`\r\n  ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  ${BREAKPOINTS.SMALL} {\r\n    ${props => ComponentMStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n`;\r\nexport const MobileHeaderNote = styled.div`\r\n  word-break: break-all;\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n`;\r\n\r\nexport const MobileHeaderContainer = styled.div`\r\n  margin: 0 24px;\r\n  padding-bottom: 8px;\r\n  box-sizing: border-box;\r\n  border-bottom: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n  display: flex;\r\n  flex-direction: column;\r\n`;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/GlobalNavigationBar/mobile/MobileActionContainer.cjs

@@ -14,7 +14,9 @@ var _types = require("../../types");
 var _rooks = require("rooks");
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject;
-var ActionContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  padding: 8px 16px;\n  box-sizing: border-box;\n  border-top: 1px solid ", ";\n  display: flex;\n  flex-direction: column;\n\n  ", " {\n    padding: 16px;\n  }\n"])), _styles.COLORS.neutral_200, _styles.BREAKPOINTS.SMALL);
+var ActionContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  padding: 8px 16px;\n  box-sizing: border-box;\n  border-top: 1px solid ", ";\n  display: flex;\n  flex-direction: column;\n\n  ", " {\n    padding: 16px;\n  }\n"])), function (props) {
+  return _styles.COLORS.getColor('neutral_200', props.theme);
+}, _styles.BREAKPOINTS.SMALL);
 var MobileActionContainer = function MobileActionContainer(_ref) {
   var disabled = _ref.disabled,
     _ref$variant = _ref.variant,

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

@@ -1 +1 @@
-{"version":3,"file":"MobileActionContainer.cjs","names":["_react","_interopRequireDefault","require","_styledComponents","_Button","_styles","_types","_rooks","_jsxRuntime","_templateObject","ActionContainer","styled","div","_taggedTemplateLiteral2","COLORS","neutral_200","BREAKPOINTS","SMALL","MobileActionContainer","_ref","disabled","_ref$variant","variant","icon","label","loading","action","isSmallScreen","useMediaMatch","replace","jsx","children","Button","size","Size","Medium","Small","onClick","exports"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileActionContainer.tsx"],"sourcesContent":["import React from 'react';\r\nimport styled from 'styled-components';\r\nimport { Button } from '../../Button';\r\nimport { BREAKPOINTS, COLORS } from '../../styles';\r\nimport { Size } from '../../types';\r\nimport { MenuButton } from '../types';\r\nimport {useMediaMatch} from \"rooks\";\r\n\r\nconst ActionContainer = styled.div`\r\n  padding: 8px 16px;\r\n  box-sizing: border-box;\r\n  border-top: 1px solid ${COLORS.neutral_200};\r\n  display: flex;\r\n  flex-direction: column;\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    padding: 16px;\r\n  }\r\n`;\r\n\r\ninterface MobileActionContainerProps extends MenuButton {}\r\n\r\nexport const MobileActionContainer: React.FunctionComponent<MobileActionContainerProps> = ({ disabled, variant = 'secondary', icon, label, loading, action }) => {\r\n  const isSmallScreen = useMediaMatch(BREAKPOINTS.SMALL.replace('@media ', ''));\r\n\r\n  return (\r\n    <ActionContainer>\r\n      <Button variant={variant} size={isSmallScreen ? Size.Medium : Size.Small} disabled={disabled} icon={icon} loading={loading} onClick={action}>\r\n        {label}\r\n      </Button>\r\n    </ActionContainer>\r\n  );\r\n};\r\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,OAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AAEA,IAAAK,MAAA,GAAAL,OAAA;AAAoC,IAAAM,WAAA,GAAAN,OAAA;AAAA,IAAAO,eAAA;AAEpC,IAAMC,eAAe,GAAGC,4BAAM,CAACC,GAAG,CAAAH,eAAA,KAAAA,eAAA,OAAAI,uBAAA,yLAGRC,cAAM,CAACC,WAAW,EAIxCC,mBAAW,CAACC,KAAK,CAGpB;AAIM,IAAMC,qBAA0E,GAAG,SAA7EA,qBAA0EA,CAAAC,IAAA,EAA0E;EAAA,IAApEC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAAC,YAAA,GAAAF,IAAA,CAAEG,OAAO;IAAPA,OAAO,GAAAD,YAAA,cAAG,WAAW,GAAAA,YAAA;IAAEE,IAAI,GAAAJ,IAAA,CAAJI,IAAI;IAAEC,KAAK,GAAAL,IAAA,CAALK,KAAK;IAAEC,OAAO,GAAAN,IAAA,CAAPM,OAAO;IAAEC,MAAM,GAAAP,IAAA,CAANO,MAAM;EACxJ,IAAMC,aAAa,GAAG,IAAAC,oBAAa,EAACZ,mBAAW,CAACC,KAAK,CAACY,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC;EAE7E,oBACE,IAAArB,WAAA,CAAAsB,GAAA,EAACpB,eAAe;IAAAqB,QAAA,eACd,IAAAvB,WAAA,CAAAsB,GAAA,EAAC1B,OAAA,CAAA4B,MAAM;MAACV,OAAO,EAAEA,OAAQ;MAACW,IAAI,EAAEN,aAAa,GAAGO,WAAI,CAACC,MAAM,GAAGD,WAAI,CAACE,KAAM;MAAChB,QAAQ,EAAEA,QAAS;MAACG,IAAI,EAAEA,IAAK;MAACE,OAAO,EAAEA,OAAQ;MAACY,OAAO,EAAEX,MAAO;MAAAK,QAAA,EACzIP;IAAK,CACA;EAAC,CACM,CAAC;AAEtB,CAAC;AAACc,OAAA,CAAApB,qBAAA,GAAAA,qBAAA","ignoreList":[]}
+{"version":3,"file":"MobileActionContainer.cjs","names":["_react","_interopRequireDefault","require","_styledComponents","_Button","_styles","_types","_rooks","_jsxRuntime","_templateObject","ActionContainer","styled","div","_taggedTemplateLiteral2","props","COLORS","getColor","theme","BREAKPOINTS","SMALL","MobileActionContainer","_ref","disabled","_ref$variant","variant","icon","label","loading","action","isSmallScreen","useMediaMatch","replace","jsx","children","Button","size","Size","Medium","Small","onClick","exports"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileActionContainer.tsx"],"sourcesContent":["import React from 'react';\r\nimport styled from 'styled-components';\r\nimport { Button } from '../../Button';\r\nimport { BREAKPOINTS, COLORS } from '../../styles';\r\nimport { Size } from '../../types';\r\nimport { MenuButton } from '../types';\r\nimport {useMediaMatch} from \"rooks\";\r\n\r\nconst ActionContainer = styled.div`\r\n  padding: 8px 16px;\r\n  box-sizing: border-box;\r\n  border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n  display: flex;\r\n  flex-direction: column;\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    padding: 16px;\r\n  }\r\n`;\r\n\r\ninterface MobileActionContainerProps extends MenuButton {}\r\n\r\nexport const MobileActionContainer: React.FunctionComponent<MobileActionContainerProps> = ({ disabled, variant = 'secondary', icon, label, loading, action }) => {\r\n  const isSmallScreen = useMediaMatch(BREAKPOINTS.SMALL.replace('@media ', ''));\r\n\r\n  return (\r\n    <ActionContainer>\r\n      <Button variant={variant} size={isSmallScreen ? Size.Medium : Size.Small} disabled={disabled} icon={icon} loading={loading} onClick={action}>\r\n        {label}\r\n      </Button>\r\n    </ActionContainer>\r\n  );\r\n};\r\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,OAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AAEA,IAAAK,MAAA,GAAAL,OAAA;AAAoC,IAAAM,WAAA,GAAAN,OAAA;AAAA,IAAAO,eAAA;AAEpC,IAAMC,eAAe,GAAGC,4BAAM,CAACC,GAAG,CAAAH,eAAA,KAAAA,eAAA,OAAAI,uBAAA,yLAGR,UAAAC,KAAK;EAAA,OAAIC,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC;AAAA,GAI1EC,mBAAW,CAACC,KAAK,CAGpB;AAIM,IAAMC,qBAA0E,GAAG,SAA7EA,qBAA0EA,CAAAC,IAAA,EAA0E;EAAA,IAApEC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAAC,YAAA,GAAAF,IAAA,CAAEG,OAAO;IAAPA,OAAO,GAAAD,YAAA,cAAG,WAAW,GAAAA,YAAA;IAAEE,IAAI,GAAAJ,IAAA,CAAJI,IAAI;IAAEC,KAAK,GAAAL,IAAA,CAALK,KAAK;IAAEC,OAAO,GAAAN,IAAA,CAAPM,OAAO;IAAEC,MAAM,GAAAP,IAAA,CAANO,MAAM;EACxJ,IAAMC,aAAa,GAAG,IAAAC,oBAAa,EAACZ,mBAAW,CAACC,KAAK,CAACY,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC;EAE7E,oBACE,IAAAvB,WAAA,CAAAwB,GAAA,EAACtB,eAAe;IAAAuB,QAAA,eACd,IAAAzB,WAAA,CAAAwB,GAAA,EAAC5B,OAAA,CAAA8B,MAAM;MAACV,OAAO,EAAEA,OAAQ;MAACW,IAAI,EAAEN,aAAa,GAAGO,WAAI,CAACC,MAAM,GAAGD,WAAI,CAACE,KAAM;MAAChB,QAAQ,EAAEA,QAAS;MAACG,IAAI,EAAEA,IAAK;MAACE,OAAO,EAAEA,OAAQ;MAACY,OAAO,EAAEX,MAAO;MAAAK,QAAA,EACzIP;IAAK,CACA;EAAC,CACM,CAAC;AAEtB,CAAC;AAACc,OAAA,CAAApB,qBAAA,GAAAA,qBAAA","ignoreList":[]}

package/dist/GlobalNavigationBar/mobile/MobileActionContainer.js

@@ -7,7 +7,9 @@ import { BREAKPOINTS, COLORS } from '../../styles';
 import { Size } from '../../types';
 import { useMediaMatch } from "rooks";
 import { jsx as _jsx } from "react/jsx-runtime";
-var ActionContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  padding: 8px 16px;\n  box-sizing: border-box;\n  border-top: 1px solid ", ";\n  display: flex;\n  flex-direction: column;\n\n  ", " {\n    padding: 16px;\n  }\n"])), COLORS.neutral_200, BREAKPOINTS.SMALL);
+var ActionContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  padding: 8px 16px;\n  box-sizing: border-box;\n  border-top: 1px solid ", ";\n  display: flex;\n  flex-direction: column;\n\n  ", " {\n    padding: 16px;\n  }\n"])), function (props) {
+  return COLORS.getColor('neutral_200', props.theme);
+}, BREAKPOINTS.SMALL);
 export var MobileActionContainer = function MobileActionContainer(_ref) {
   var disabled = _ref.disabled,
     _ref$variant = _ref.variant,

package/dist/GlobalNavigationBar/mobile/MobileActionContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"MobileActionContainer.js","names":["React","styled","Button","BREAKPOINTS","COLORS","Size","useMediaMatch","jsx","_jsx","ActionContainer","div","_templateObject","_taggedTemplateLiteral","neutral_200","SMALL","MobileActionContainer","_ref","disabled","_ref$variant","variant","icon","label","loading","action","isSmallScreen","replace","children","size","Medium","Small","onClick"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileActionContainer.tsx"],"sourcesContent":["import React from 'react';\r\nimport styled from 'styled-components';\r\nimport { Button } from '../../Button';\r\nimport { BREAKPOINTS, COLORS } from '../../styles';\r\nimport { Size } from '../../types';\r\nimport { MenuButton } from '../types';\r\nimport {useMediaMatch} from \"rooks\";\r\n\r\nconst ActionContainer = styled.div`\r\n  padding: 8px 16px;\r\n  box-sizing: border-box;\r\n  border-top: 1px solid ${COLORS.neutral_200};\r\n  display: flex;\r\n  flex-direction: column;\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    padding: 16px;\r\n  }\r\n`;\r\n\r\ninterface MobileActionContainerProps extends MenuButton {}\r\n\r\nexport const MobileActionContainer: React.FunctionComponent<MobileActionContainerProps> = ({ disabled, variant = 'secondary', icon, label, loading, action }) => {\r\n  const isSmallScreen = useMediaMatch(BREAKPOINTS.SMALL.replace('@media ', ''));\r\n\r\n  return (\r\n    <ActionContainer>\r\n      <Button variant={variant} size={isSmallScreen ? Size.Medium : Size.Small} disabled={disabled} icon={icon} loading={loading} onClick={action}>\r\n        {label}\r\n      </Button>\r\n    </ActionContainer>\r\n  );\r\n};\r\n"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAASC,MAAM,QAAQ,cAAc;AACrC,SAASC,WAAW,EAAEC,MAAM,QAAQ,cAAc;AAClD,SAASC,IAAI,QAAQ,aAAa;AAElC,SAAQC,aAAa,QAAO,OAAO;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEpC,IAAMC,eAAe,GAAGR,MAAM,CAACS,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,6KAGRR,MAAM,CAACS,WAAW,EAIxCV,WAAW,CAACW,KAAK,CAGpB;AAID,OAAO,IAAMC,qBAA0E,GAAG,SAA7EA,qBAA0EA,CAAAC,IAAA,EAA0E;EAAA,IAApEC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAAC,YAAA,GAAAF,IAAA,CAAEG,OAAO;IAAPA,OAAO,GAAAD,YAAA,cAAG,WAAW,GAAAA,YAAA;IAAEE,IAAI,GAAAJ,IAAA,CAAJI,IAAI;IAAEC,KAAK,GAAAL,IAAA,CAALK,KAAK;IAAEC,OAAO,GAAAN,IAAA,CAAPM,OAAO;IAAEC,MAAM,GAAAP,IAAA,CAANO,MAAM;EACxJ,IAAMC,aAAa,GAAGlB,aAAa,CAACH,WAAW,CAACW,KAAK,CAACW,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC;EAE7E,oBACEjB,IAAA,CAACC,eAAe;IAAAiB,QAAA,eACdlB,IAAA,CAACN,MAAM;MAACiB,OAAO,EAAEA,OAAQ;MAACQ,IAAI,EAAEH,aAAa,GAAGnB,IAAI,CAACuB,MAAM,GAAGvB,IAAI,CAACwB,KAAM;MAACZ,QAAQ,EAAEA,QAAS;MAACG,IAAI,EAAEA,IAAK;MAACE,OAAO,EAAEA,OAAQ;MAACQ,OAAO,EAAEP,MAAO;MAAAG,QAAA,EACzIL;IAAK,CACA;EAAC,CACM,CAAC;AAEtB,CAAC","ignoreList":[]}
+{"version":3,"file":"MobileActionContainer.js","names":["React","styled","Button","BREAKPOINTS","COLORS","Size","useMediaMatch","jsx","_jsx","ActionContainer","div","_templateObject","_taggedTemplateLiteral","props","getColor","theme","SMALL","MobileActionContainer","_ref","disabled","_ref$variant","variant","icon","label","loading","action","isSmallScreen","replace","children","size","Medium","Small","onClick"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileActionContainer.tsx"],"sourcesContent":["import React from 'react';\r\nimport styled from 'styled-components';\r\nimport { Button } from '../../Button';\r\nimport { BREAKPOINTS, COLORS } from '../../styles';\r\nimport { Size } from '../../types';\r\nimport { MenuButton } from '../types';\r\nimport {useMediaMatch} from \"rooks\";\r\n\r\nconst ActionContainer = styled.div`\r\n  padding: 8px 16px;\r\n  box-sizing: border-box;\r\n  border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n  display: flex;\r\n  flex-direction: column;\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    padding: 16px;\r\n  }\r\n`;\r\n\r\ninterface MobileActionContainerProps extends MenuButton {}\r\n\r\nexport const MobileActionContainer: React.FunctionComponent<MobileActionContainerProps> = ({ disabled, variant = 'secondary', icon, label, loading, action }) => {\r\n  const isSmallScreen = useMediaMatch(BREAKPOINTS.SMALL.replace('@media ', ''));\r\n\r\n  return (\r\n    <ActionContainer>\r\n      <Button variant={variant} size={isSmallScreen ? Size.Medium : Size.Small} disabled={disabled} icon={icon} loading={loading} onClick={action}>\r\n        {label}\r\n      </Button>\r\n    </ActionContainer>\r\n  );\r\n};\r\n"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAASC,MAAM,QAAQ,cAAc;AACrC,SAASC,WAAW,EAAEC,MAAM,QAAQ,cAAc;AAClD,SAASC,IAAI,QAAQ,aAAa;AAElC,SAAQC,aAAa,QAAO,OAAO;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEpC,IAAMC,eAAe,GAAGR,MAAM,CAACS,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,6KAGR,UAAAC,KAAK;EAAA,OAAIT,MAAM,CAACU,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AAAA,GAI1EZ,WAAW,CAACa,KAAK,CAGpB;AAID,OAAO,IAAMC,qBAA0E,GAAG,SAA7EA,qBAA0EA,CAAAC,IAAA,EAA0E;EAAA,IAApEC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAAC,YAAA,GAAAF,IAAA,CAAEG,OAAO;IAAPA,OAAO,GAAAD,YAAA,cAAG,WAAW,GAAAA,YAAA;IAAEE,IAAI,GAAAJ,IAAA,CAAJI,IAAI;IAAEC,KAAK,GAAAL,IAAA,CAALK,KAAK;IAAEC,OAAO,GAAAN,IAAA,CAAPM,OAAO;IAAEC,MAAM,GAAAP,IAAA,CAANO,MAAM;EACxJ,IAAMC,aAAa,GAAGpB,aAAa,CAACH,WAAW,CAACa,KAAK,CAACW,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC;EAE7E,oBACEnB,IAAA,CAACC,eAAe;IAAAmB,QAAA,eACdpB,IAAA,CAACN,MAAM;MAACmB,OAAO,EAAEA,OAAQ;MAACQ,IAAI,EAAEH,aAAa,GAAGrB,IAAI,CAACyB,MAAM,GAAGzB,IAAI,CAAC0B,KAAM;MAACZ,QAAQ,EAAEA,QAAS;MAACG,IAAI,EAAEA,IAAK;MAACE,OAAO,EAAEA,OAAQ;MAACQ,OAAO,EAAEP,MAAO;MAAAG,QAAA,EACzIL;IAAK,CACA;EAAC,CACM,CAAC;AAEtB,CAAC","ignoreList":[]}

package/dist/GlobalNavigationBar/mobile/MobileMenu.cjs

@@ -25,7 +25,13 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 var Wrapper = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  width: 320px;\n  z-index: ", ";\n  height: 100%;\n  box-sizing: border-box;\n\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n\n  ", " {\n    width: 400px;\n  }\n"])), _styles.Z_INDEXES.off_canvas, _styles.BREAKPOINTS.SMALL);
 var SwitcherLabel = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  margin-left: auto;\n"])));
-var MobileFooter = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  height: 48px;\n\n  padding: 0 4px 0 16px;\n  border-top: 1px solid ", ";\n\n  ", "\n  ", " {\n    height: 56px;\n    padding: 4px 8px 4px 16px;\n    ", "\n  }\n"])), _styles.COLORS.neutral_200, (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.neutral_600), _styles.BREAKPOINTS.SMALL, (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.neutral_600));
+var MobileFooter = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  height: 48px;\n\n  padding: 0 4px 0 16px;\n  border-top: 1px solid ", ";\n\n  ", "\n  ", " {\n    height: 56px;\n    padding: 4px 8px 4px 16px;\n    ", "\n  }\n"])), function (props) {
+  return _styles.COLORS.getColor('neutral_200', props.theme);
+}, function (props) {
+  return (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.getColor('neutral_600', props.theme));
+}, _styles.BREAKPOINTS.SMALL, function (props) {
+  return (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.getColor('neutral_600', props.theme));
+});
 var CustomContent = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = (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"])));
 var MobileMenu = function MobileMenu(_ref) {
   var _current$header, _current$header$butto;

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

@@ -1 +1 @@
-{"version":3,"file":"MobileMenu.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_icons","_styles","_reactRouterDom","_Button","_assets","_MobileMenuHeader","_MobileMenuContent","_StackState","_rooks","_jsxRuntime","_templateObject","_templateObject2","_templateObject3","_templateObject4","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Wrapper","styled","div","_taggedTemplateLiteral2","Z_INDEXES","off_canvas","BREAKPOINTS","SMALL","SwitcherLabel","MobileFooter","COLORS","neutral_200","ComponentXSStyling","ComponentTextStyle","Bold","neutral_600","ComponentSStyling","CustomContent","MobileMenu","_ref","_current$header","_current$header$butto","show","profile","buttons","label","header","items","footer","action","onClose","_useStackState","useStackState","reset","length","push","pop","peek","isMediumScreen","useMediaMatch","LARGE","replace","location","useLocation","onSubMenuOpen","menu","type","content","customContent","custom","useEffect","setTimeout","current","switcher","find","jsxs","children","jsx","onGoBack","undefined","LaerdalLogo","height","width","Fragment","className","onClick","IconButton","variant","shape","id","SystemIcons","SwitchApp","size","propTypes","_propTypes","bool","func","isRequired","_default","exports"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport {SystemIcons} from '../../icons';\r\nimport { BREAKPOINTS, COLORS, ComponentSStyling, ComponentTextStyle, ComponentXSStyling, Z_INDEXES } from '../../styles';\r\nimport { useLocation } from 'react-router-dom';\r\nimport { IconButton } from '../../Button';\r\nimport { LaerdalLogo } from '../../assets';\r\nimport {\r\n  MenuAccountInfo,\r\n  MenuButton,\r\n  MenuNavigationItemTypeGroup,\r\n  MenuGroupFooter,\r\n  MenuGroupHeader,\r\n  MenuIconButton,\r\n  MenuNavigationItemTypeItem,\r\n  MobileNavigationMenuProps,\r\n  ProfileMenu,\r\n  MenuNavigationItemTypeSection,\r\n  MobileMenuButtonTypes,\r\n  MenuSwitcherButton,\r\n  MenuNavigationCustomSubMenu,\r\n} from '../types';\r\nimport MobileMenuHeader from './MobileMenuHeader';\r\nimport MobileMenuContent from './MobileMenuContent';\r\nimport { useStackState } from '../../common/StackState';\r\nimport { useMediaMatch } from 'rooks';\r\n\r\nconst Wrapper = styled.div`\r\n  width: 320px;\r\n  z-index: ${Z_INDEXES.off_canvas};\r\n  height: 100%;\r\n  box-sizing: border-box;\r\n\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 8px;\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    width: 400px;\r\n  }\r\n`;\r\n\r\nconst SwitcherLabel = styled.div`\r\n  margin-left: auto;\r\n`;\r\n\r\nconst MobileFooter = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n  box-sizing: border-box;\r\n  height: 48px;\r\n\r\n  padding: 0 4px 0 16px;\r\n  border-top: 1px solid ${COLORS.neutral_200};\r\n\r\n  ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\r\n  ${BREAKPOINTS.SMALL} {\r\n    height: 56px;\r\n    padding: 4px 8px 4px 16px;\r\n    ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\r\n  }\r\n`;\r\n\r\nconst CustomContent = styled.div`\r\n  width: 100%;\r\n  box-sizing: border-box;\r\n  flex-flow: column;\r\n  display: flex;\r\n  flex: 1;\r\n  overflow: hidden;\r\n`;\r\n\r\ntype Props = MobileNavigationMenuProps & {\r\n  profile?: ProfileMenu;\r\n  show?: boolean;\r\n  onClose: () => void;\r\n};\r\n\r\ninterface MenuState {\r\n  header: {\r\n    label?: string;\r\n    buttons?: MobileMenuButtonTypes[];\r\n  };\r\n  content?: {\r\n    header?: MenuGroupHeader;\r\n    items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\r\n    footer?: MenuGroupFooter;\r\n    action?: MenuButton;\r\n  };\r\n  customContent?: () => React.ReactNode;\r\n  footer?: boolean;\r\n}\r\n\r\nconst MobileMenu = ({ show, profile, buttons, label, header, items, footer, action, onClose }: Props) => {\r\n  const { reset, length, push, pop, peek } = useStackState<MenuState>();\r\n\r\n  const isMediumScreen = useMediaMatch(BREAKPOINTS.LARGE.replace('@media ', ''));\r\n\r\n  const location = useLocation();\r\n\r\n  const onSubMenuOpen = (menu?: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu) => {\r\n    switch (menu?.type) {\r\n      case 'group':\r\n        push({\r\n          header: {\r\n            label: menu.label,\r\n            buttons: menu.buttons,\r\n          },\r\n          content: {\r\n            header: menu.header,\r\n            items: menu.items,\r\n            footer: menu.footer,\r\n            action: menu.action,\r\n          },\r\n          footer: false,\r\n        });\r\n        break;\r\n      case 'custom':\r\n        push({\r\n          header: {\r\n            label: menu.label,\r\n            buttons: menu.buttons,\r\n          },\r\n          customContent: menu.custom,\r\n          footer: false,\r\n        });\r\n        break;\r\n      default:\r\n        break;\r\n    }\r\n  };\r\n\r\n  React.useEffect(() => {\r\n    onClose();\r\n  }, [location]);\r\n\r\n  React.useEffect(() => {\r\n    isMediumScreen && onClose();\r\n  }, [isMediumScreen]);\r\n\r\n  React.useEffect(() => {\r\n    setTimeout(() => {\r\n      reset({\r\n        footer: true,\r\n        header: {\r\n          label: label,\r\n          buttons: buttons,\r\n        },\r\n        content: {\r\n          header: header,\r\n          items: items,\r\n          footer: footer,\r\n          action: action,\r\n        },\r\n      });\r\n    }, 300);\r\n  }, [show]);\r\n\r\n  const current = peek();\r\n\r\n  const switcher = current?.header?.buttons?.find((a) => a.type === 'switcher') as MenuSwitcherButton;\r\n\r\n  return (\r\n    <Wrapper>\r\n      <MobileMenuHeader\r\n        buttons={current?.header.buttons}\r\n        onGoBack={length > 1 ? pop : undefined}\r\n        onSubMenuOpen={onSubMenuOpen}\r\n        profile={profile}\r\n        label={current?.header.label}\r\n        onClose={onClose}\r\n      />\r\n      {current?.customContent && <CustomContent>{current?.customContent()}</CustomContent>}\r\n      {current?.content && (\r\n        <MobileMenuContent\r\n          header={current?.content.header}\r\n          items={current?.content.items}\r\n          footer={current?.content.footer}\r\n          action={current?.content.action}\r\n          onSubMenuOpen={onSubMenuOpen}\r\n        />\r\n      )}\r\n\r\n      {current?.footer && (\r\n        <MobileFooter>\r\n          <LaerdalLogo height={'36px'} width={'66px'} />\r\n          {switcher && (\r\n            <>\r\n              <SwitcherLabel className={'globalNav-toggler'} onClick={() => switcher.action && switcher.action() && onClose()}>\r\n                {label || 'Switch site'}\r\n              </SwitcherLabel>\r\n              <IconButton variant={'secondary'} shape={'circular'} id=\"globalNavAppsButton\" action={() => switcher.action && switcher.action() && onClose()}>\r\n                <SystemIcons.SwitchApp size=\"24px\"/>\r\n              </IconButton>\r\n            </>\r\n          )}\r\n        </MobileFooter>\r\n      )}\r\n    </Wrapper>\r\n  );\r\n};\r\n\r\nexport default MobileMenu;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"MobileMenu.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_icons","_styles","_reactRouterDom","_Button","_assets","_MobileMenuHeader","_MobileMenuContent","_StackState","_rooks","_jsxRuntime","_templateObject","_templateObject2","_templateObject3","_templateObject4","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Wrapper","styled","div","_taggedTemplateLiteral2","Z_INDEXES","off_canvas","BREAKPOINTS","SMALL","SwitcherLabel","MobileFooter","props","COLORS","getColor","theme","ComponentXSStyling","ComponentTextStyle","Bold","ComponentSStyling","CustomContent","MobileMenu","_ref","_current$header","_current$header$butto","show","profile","buttons","label","header","items","footer","action","onClose","_useStackState","useStackState","reset","length","push","pop","peek","isMediumScreen","useMediaMatch","LARGE","replace","location","useLocation","onSubMenuOpen","menu","type","content","customContent","custom","useEffect","setTimeout","current","switcher","find","jsxs","children","jsx","onGoBack","undefined","LaerdalLogo","height","width","Fragment","className","onClick","IconButton","variant","shape","id","SystemIcons","SwitchApp","size","propTypes","_propTypes","bool","func","isRequired","_default","exports"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport {SystemIcons} from '../../icons';\r\nimport { BREAKPOINTS, COLORS, ComponentSStyling, ComponentTextStyle, ComponentXSStyling, Z_INDEXES } from '../../styles';\r\nimport { useLocation } from 'react-router-dom';\r\nimport { IconButton } from '../../Button';\r\nimport { LaerdalLogo } from '../../assets';\r\nimport {\r\n  MenuAccountInfo,\r\n  MenuButton,\r\n  MenuNavigationItemTypeGroup,\r\n  MenuGroupFooter,\r\n  MenuGroupHeader,\r\n  MenuIconButton,\r\n  MenuNavigationItemTypeItem,\r\n  MobileNavigationMenuProps,\r\n  ProfileMenu,\r\n  MenuNavigationItemTypeSection,\r\n  MobileMenuButtonTypes,\r\n  MenuSwitcherButton,\r\n  MenuNavigationCustomSubMenu,\r\n} from '../types';\r\nimport MobileMenuHeader from './MobileMenuHeader';\r\nimport MobileMenuContent from './MobileMenuContent';\r\nimport { useStackState } from '../../common/StackState';\r\nimport { useMediaMatch } from 'rooks';\r\n\r\nconst Wrapper = styled.div`\r\n  width: 320px;\r\n  z-index: ${Z_INDEXES.off_canvas};\r\n  height: 100%;\r\n  box-sizing: border-box;\r\n\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 8px;\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    width: 400px;\r\n  }\r\n`;\r\n\r\nconst SwitcherLabel = styled.div`\r\n  margin-left: auto;\r\n`;\r\n\r\nconst MobileFooter = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n  box-sizing: border-box;\r\n  height: 48px;\r\n\r\n  padding: 0 4px 0 16px;\r\n  border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  ${BREAKPOINTS.SMALL} {\r\n    height: 56px;\r\n    padding: 4px 8px 4px 16px;\r\n    ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n`;\r\n\r\nconst CustomContent = styled.div`\r\n  width: 100%;\r\n  box-sizing: border-box;\r\n  flex-flow: column;\r\n  display: flex;\r\n  flex: 1;\r\n  overflow: hidden;\r\n`;\r\n\r\ntype Props = MobileNavigationMenuProps & {\r\n  profile?: ProfileMenu;\r\n  show?: boolean;\r\n  onClose: () => void;\r\n};\r\n\r\ninterface MenuState {\r\n  header: {\r\n    label?: string;\r\n    buttons?: MobileMenuButtonTypes[];\r\n  };\r\n  content?: {\r\n    header?: MenuGroupHeader;\r\n    items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\r\n    footer?: MenuGroupFooter;\r\n    action?: MenuButton;\r\n  };\r\n  customContent?: () => React.ReactNode;\r\n  footer?: boolean;\r\n}\r\n\r\nconst MobileMenu = ({ show, profile, buttons, label, header, items, footer, action, onClose }: Props) => {\r\n  const { reset, length, push, pop, peek } = useStackState<MenuState>();\r\n\r\n  const isMediumScreen = useMediaMatch(BREAKPOINTS.LARGE.replace('@media ', ''));\r\n\r\n  const location = useLocation();\r\n\r\n  const onSubMenuOpen = (menu?: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu) => {\r\n    switch (menu?.type) {\r\n      case 'group':\r\n        push({\r\n          header: {\r\n            label: menu.label,\r\n            buttons: menu.buttons,\r\n          },\r\n          content: {\r\n            header: menu.header,\r\n            items: menu.items,\r\n            footer: menu.footer,\r\n            action: menu.action,\r\n          },\r\n          footer: false,\r\n        });\r\n        break;\r\n      case 'custom':\r\n        push({\r\n          header: {\r\n            label: menu.label,\r\n            buttons: menu.buttons,\r\n          },\r\n          customContent: menu.custom,\r\n          footer: false,\r\n        });\r\n        break;\r\n      default:\r\n        break;\r\n    }\r\n  };\r\n\r\n  React.useEffect(() => {\r\n    onClose();\r\n  }, [location]);\r\n\r\n  React.useEffect(() => {\r\n    isMediumScreen && onClose();\r\n  }, [isMediumScreen]);\r\n\r\n  React.useEffect(() => {\r\n    setTimeout(() => {\r\n      reset({\r\n        footer: true,\r\n        header: {\r\n          label: label,\r\n          buttons: buttons,\r\n        },\r\n        content: {\r\n          header: header,\r\n          items: items,\r\n          footer: footer,\r\n          action: action,\r\n        },\r\n      });\r\n    }, 300);\r\n  }, [show]);\r\n\r\n  const current = peek();\r\n\r\n  const switcher = current?.header?.buttons?.find((a) => a.type === 'switcher') as MenuSwitcherButton;\r\n\r\n  return (\r\n    <Wrapper>\r\n      <MobileMenuHeader\r\n        buttons={current?.header.buttons}\r\n        onGoBack={length > 1 ? pop : undefined}\r\n        onSubMenuOpen={onSubMenuOpen}\r\n        profile={profile}\r\n        label={current?.header.label}\r\n        onClose={onClose}\r\n      />\r\n      {current?.customContent && <CustomContent>{current?.customContent()}</CustomContent>}\r\n      {current?.content && (\r\n        <MobileMenuContent\r\n          header={current?.content.header}\r\n          items={current?.content.items}\r\n          footer={current?.content.footer}\r\n          action={current?.content.action}\r\n          onSubMenuOpen={onSubMenuOpen}\r\n        />\r\n      )}\r\n\r\n      {current?.footer && (\r\n        <MobileFooter>\r\n          <LaerdalLogo height={'36px'} width={'66px'} />\r\n          {switcher && (\r\n            <>\r\n              <SwitcherLabel className={'globalNav-toggler'} onClick={() => switcher.action && switcher.action() && onClose()}>\r\n                {label || 'Switch site'}\r\n              </SwitcherLabel>\r\n              <IconButton variant={'secondary'} shape={'circular'} id=\"globalNavAppsButton\" action={() => switcher.action && switcher.action() && onClose()}>\r\n                <SystemIcons.SwitchApp size=\"24px\"/>\r\n              </IconButton>\r\n            </>\r\n          )}\r\n        </MobileFooter>\r\n      )}\r\n    </Wrapper>\r\n  );\r\n};\r\n\r\nexport default MobileMenu;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/GlobalNavigationBar/mobile/MobileMenu.js

@@ -17,7 +17,13 @@ import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var Wrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 320px;\n  z-index: ", ";\n  height: 100%;\n  box-sizing: border-box;\n\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n\n  ", " {\n    width: 400px;\n  }\n"])), Z_INDEXES.off_canvas, BREAKPOINTS.SMALL);
 var SwitcherLabel = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  margin-left: auto;\n"])));
-var MobileFooter = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  height: 48px;\n\n  padding: 0 4px 0 16px;\n  border-top: 1px solid ", ";\n\n  ", "\n  ", " {\n    height: 56px;\n    padding: 4px 8px 4px 16px;\n    ", "\n  }\n"])), COLORS.neutral_200, ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600), BREAKPOINTS.SMALL, ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600));
+var MobileFooter = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  height: 48px;\n\n  padding: 0 4px 0 16px;\n  border-top: 1px solid ", ";\n\n  ", "\n  ", " {\n    height: 56px;\n    padding: 4px 8px 4px 16px;\n    ", "\n  }\n"])), function (props) {
+  return COLORS.getColor('neutral_200', props.theme);
+}, function (props) {
+  return ComponentXSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme));
+}, BREAKPOINTS.SMALL, function (props) {
+  return ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme));
+});
 var CustomContent = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  width: 100%;\n  box-sizing: border-box;\n  flex-flow: column;\n  display: flex;\n  flex: 1;\n  overflow: hidden;\n"])));
 var MobileMenu = function MobileMenu(_ref) {
   var _current$header, _current$header$butto;