@laerdal/life-react-components 1.9.9-dev.30.full → 1.9.9-dev.32
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/GlobalNavigationBar/desktop/UserMenu.cjs +2 -2
- package/dist/GlobalNavigationBar/desktop/UserMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/desktop/UserMenu.js +2 -2
- package/dist/GlobalNavigationBar/desktop/UserMenu.js.map +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenuContent.cjs +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenuContent.cjs.map +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenuContent.js +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenuContent.js.map +1 -1
- package/dist/Switcher/MobileSwitcherMenu.cjs +1 -1
- package/dist/Switcher/MobileSwitcherMenu.cjs.map +1 -1
- package/dist/Switcher/MobileSwitcherMenu.js +1 -1
- package/dist/Switcher/MobileSwitcherMenu.js.map +1 -1
- package/dist/Switcher/SwitcherMenuItem.cjs +16 -16
- package/dist/Switcher/SwitcherMenuItem.cjs.map +1 -1
- package/dist/Switcher/SwitcherMenuItem.d.ts +9 -2
- package/dist/Switcher/SwitcherMenuItem.js +16 -10
- package/dist/Switcher/SwitcherMenuItem.js.map +1 -1
- package/dist/types.cjs.map +1 -1
- package/dist/types.d.ts +0 -8
- package/dist/types.js.map +1 -1
- package/package.json +1 -1
|
@@ -65,9 +65,9 @@ var UserSectionInfo = _styledComponents.default.div(_templateObject9 || (_templa
|
|
|
65
65
|
|
|
66
66
|
var UserSectionInfoName = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n ", "\n"])), (0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.neutral_600));
|
|
67
67
|
|
|
68
|
-
var UserSectionInfoEmail = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n ", "\n"])), (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_500));
|
|
68
|
+
var UserSectionInfoEmail = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n word-break: break-all;\n ", "\n"])), (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_500));
|
|
69
69
|
|
|
70
|
-
var UserSectionInfoLink = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n padding: 2px 0;\n display: flex;\n align-items: center;\n gap: 4px;\n ", "\n
|
|
70
|
+
var UserSectionInfoLink = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n padding: 2px 0;\n display: flex;\n align-items: center;\n gap: 4px;\n\n ", "\n svg {\n width: 16px;\n height: 16px;\n }\n"])), (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Bold, null));
|
|
71
71
|
|
|
72
72
|
var UserSection = _styledComponents.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: row;\n padding: 0 24px 8px 24px;\n gap: 16px;\n"])));
|
|
73
73
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"names":["UserMenuScrollContainer","styled","div","UserMenuPinnedContainer","UserMenuWrapper","COLORS","white","Z_INDEXES","off_canvas","Breakpoints","MEDIUM","flowDown","BOXSHADOWS","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","ComponentTextStyle","Bold","neutral_500","MenuSectionList","UserMenuSectionListStyling","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","neutral_600","UserSectionInfoEmail","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","navigate","isActiveRoute","React","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Size","Large","preventDefault"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n BOXSHADOWS,\n COLORS,\n ComponentLStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n margin: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n width: 320px;\n\n position: absolute;\n\n &.show {\n display: block;\n }\n\n top: 0;\n right: 0;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n flex-flow: column;\n\n\n ${Breakpoints.MEDIUM} {\n flex-flow: initial;\n top: initial;\n right: initial;\n height: initial;\n animation: ${flowDown} 0.2s ease-in-out;\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n border-radius: 8px;\n border: 1px solid ${COLORS.neutral_200};\n z-index: ${Z_INDEXES.fixed_menu};\n padding: 24px 0;\n }\n`;\n\n\nconst MenuSection = styled.div`\n padding: 4px 0;\n display: flex;\n flex-direction: column;\n width: 100%;\n\n &.divider {\n border-top: 1px solid ${COLORS.neutral_200};\n }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n align-items: center;\n justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n display: flex;\n align-items: center;\n padding: 8px 24px 4px 24px;\n box-sizing: border-box;\n min-height: 32px;\n background-color: ${COLORS.neutral_20};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n margin: 0;\n padding: 0;\n\n ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n pointer-events: none;\n\n button {\n padding: 0 !important;\n }\n\n button > div {\n width: 48px !important;\n height: 48px !important;\n border-radius: 50% !important;\n }\n`;\n\nconst UserSectionInfo = styled.div`\n padding: 2px 0;\n display: flex;\n flex-direction: column;\n gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n padding: 2px 0;\n display: flex;\n align-items: center;\n gap: 4px;\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n\n svg {\n width: 16px;\n height: 16px;\n }\n`;\n\nconst UserSection = styled.div`\n display: flex;\n flex-direction: row;\n padding: 0 24px 8px 24px;\n gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n show?: boolean;\n onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n const {navigate, isActiveRoute} = useNavigationHelper();\n\n React.useEffect(() => {\n if (!onHideUserMenu) return;\n\n function handleKeyPress(e: any) {\n if (e.key === 'Escape' || e.key === 'Esc') {\n onHideUserMenu();\n }\n }\n\n document.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [onHideUserMenu]);\n\n const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n <MenuItem key={index}\n id={`profile_${index}`}\n active={!item.external && isActiveRoute(item.to, !!item.exact)}\n item={{\n value: item.to,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n }}\n onClickHandler={() => {\n item.action && item.action();\n navigate(item.to, !!item.external);\n }}/>\n\n return (\n <UserMenuWrapper onClick={onHideUserMenu}\n className={show ? 'show' : ''}\n role=\"menu\"\n aria-labelledby=\"UserMenuButton\">\n <UserMenuScrollContainer>\n <UserSection>\n <UserSectionAvatar>\n <ProfileButton onClick={() => {\n }}\n tabIndex={-1}\n initials={user.firstName[0] + user.lastName[0]}/>\n </UserSectionAvatar>\n <UserSectionInfo>\n <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n {\n user.link &&\n <HyperLink variant={'default'}\n href={user.link.href}\n target={user.link.target}\n id={user.link.id}\n onClick={user.link.onClick}>\n <UserSectionInfoLink>\n <span>\n {user.link.label}\n </span>\n {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n </UserSectionInfoLink>\n </HyperLink>\n }\n </UserSectionInfo>\n </UserSection>\n {\n sections.filter(a => !a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n </UserMenuScrollContainer>\n <UserMenuPinnedContainer>\n {\n sections.filter(a => !!a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n {\n signOut &&\n <SignOutActionWrapper>\n <Button width={'272px'}\n variant=\"secondary\"\n icon={<SystemIcons.Logout/>}\n size={Size.Large}\n onClick={e => {\n e.preventDefault();\n signOut?.action();\n }}>\n {signOut?.label}\n </Button>\n </SignOutActionWrapper>\n }\n </UserMenuPinnedContainer>\n </UserMenuWrapper>\n );\n};\n\nexport default UserMenu;\n"],"file":"UserMenu.cjs"}
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"names":["UserMenuScrollContainer","styled","div","UserMenuPinnedContainer","UserMenuWrapper","COLORS","white","Z_INDEXES","off_canvas","Breakpoints","MEDIUM","flowDown","BOXSHADOWS","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","ComponentTextStyle","Bold","neutral_500","MenuSectionList","UserMenuSectionListStyling","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","neutral_600","UserSectionInfoEmail","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","navigate","isActiveRoute","React","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Size","Large","preventDefault"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AASA;;AACA;;AACA;;AACA;;AAGA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,IAAMA,uBAAuB,GAAGC,0BAAOC,GAAV,iGAA7B;;AAIA,IAAMC,uBAAuB,GAAGF,0BAAOC,GAAV,qFAA7B;;AAGA,IAAME,eAAe,GAAGH,0BAAOC,GAAV,2lBAECG,eAAOC,KAFR,EAeRC,kBAAUC,UAfF,EAoBjBC,qBAAYC,MApBK,EAyBJC,sBAzBI,EA0BHC,mBAAWC,kBA1BR,EA4BGR,eAAOS,WA5BV,EA6BNP,kBAAUQ,UA7BJ,CAArB;;AAmCA,IAAMC,WAAW,GAAGf,0BAAOC,GAAV,+NAOWG,eAAOS,WAPlB,CAAjB;;AAWA,IAAMG,oBAAoB,GAAG,+BAAOD,WAAP,CAAH,2IAA1B;;AAKA,IAAME,iBAAiB,GAAGjB,0BAAOC,GAAV,sPAMDG,eAAOc,UANN,EAQnB,+BAAkBC,2BAAmBC,IAArC,EAA2ChB,eAAOiB,WAAlD,CARmB,CAAvB;;AAWA,IAAMC,eAAe,GAAGtB,0BAAOC,GAAV,gIAIjBsB,wCAJiB,CAArB;;AAQA,IAAMC,iBAAiB,GAAGxB,0BAAOC,GAAV,uRAAvB;;AAcA,IAAMwB,eAAe,GAAGzB,0BAAOC,GAAV,oKAArB;;AAOA,IAAMyB,mBAAmB,GAAG1B,0BAAOC,GAAV,kGACrB,+BAAkBkB,2BAAmBC,IAArC,EAA2ChB,eAAOuB,WAAlD,CADqB,CAAzB;;AAIA,IAAMC,oBAAoB,GAAG5B,0BAAOC,GAAV,4HAEtB,gCAAmBkB,2BAAmBU,OAAtC,EAA+CzB,eAAOiB,WAAtD,CAFsB,CAA1B;;AAKA,IAAMS,mBAAmB,GAAG9B,0BAAOC,GAAV,iOAMrB,gCAAmBkB,2BAAmBC,IAAtC,EAA4C,IAA5C,CANqB,CAAzB;;AAaA,IAAMW,WAAW,GAAG/B,0BAAOC,GAAV,8KAAjB;;AAYA,IAAM+B,QAAQ,GAAG,SAAXA,QAAW,OAA2E;AAAA,MAAzEC,IAAyE,QAAzEA,IAAyE;AAAA,MAAnEC,IAAmE,QAAnEA,IAAmE;AAAA,MAA7DC,cAA6D,QAA7DA,cAA6D;AAAA,MAA7CC,QAA6C,QAA7CA,QAA6C;AAAA,MAAnCC,OAAmC,QAAnCA,OAAmC;AAAA,MAA1BC,KAA0B,QAA1BA,KAA0B;;AAE1F,6BAAkC,4CAAlC;AAAA,MAAOC,QAAP,wBAAOA,QAAP;AAAA,MAAiBC,aAAjB,wBAAiBA,aAAjB;;AAEAC,EAAAA,KAAK,CAACC,SAAN,CAAgB,YAAM;AACpB,QAAI,CAACP,cAAL,EAAqB;;AAErB,aAASQ,cAAT,CAAwBC,CAAxB,EAAgC;AAC9B,UAAIA,CAAC,CAACC,GAAF,KAAU,QAAV,IAAsBD,CAAC,CAACC,GAAF,KAAU,KAApC,EAA2C;AACzCV,QAAAA,cAAc;AACf;AACF;;AAEDW,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,SAA1B,EAAqCJ,cAArC,EAAqD,KAArD;AACA,WAAO,YAAM;AACXG,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,SAA7B,EAAwCL,cAAxC,EAAwD,KAAxD;AACD,KAFD;AAGD,GAbD,EAaG,CAACR,cAAD,CAbH;;AAeA,MAAMc,UAAU,GAAG,SAAbA,UAAa,CAACC,IAAD,EAA2BC,OAA3B,EAA2DC,KAA3D;AAAA,wBACjB,qBAAC,kBAAD;AACU,MAAA,EAAE,oBAAaA,KAAb,CADZ;AAEU,MAAA,MAAM,EAAE,CAACF,IAAI,CAACG,QAAN,IAAkBb,aAAa,CAACU,IAAI,CAACI,EAAN,EAAU,CAAC,CAACJ,IAAI,CAACK,KAAjB,CAFjD;AAGU,MAAA,IAAI,EAAE;AACJC,QAAAA,KAAK,EAAEN,IAAI,CAACI,EADR;AAEJG,QAAAA,QAAQ,EAAEP,IAAI,CAACO,QAFX;AAGJC,QAAAA,IAAI,EAAER,IAAI,CAACQ,IAHP;AAIJC,QAAAA,YAAY,EAAET,IAAI,CAACZ;AAJf,OAHhB;AASU,MAAA,cAAc,EAAE,0BAAM;AACpBY,QAAAA,IAAI,CAACU,MAAL,IAAeV,IAAI,CAACU,MAAL,EAAf;AACArB,QAAAA,QAAQ,CAACW,IAAI,CAACI,EAAN,EAAU,CAAC,CAACJ,IAAI,CAACG,QAAjB,CAAR;AACD;AAZX,OAAeD,KAAf,CADiB;AAAA,GAAnB;;AAeA,sBACE,sBAAC,eAAD;AAAiB,IAAA,OAAO,EAAEjB,cAA1B;AACiB,IAAA,SAAS,EAAEF,IAAI,GAAG,MAAH,GAAY,EAD5C;AAEiB,IAAA,IAAI,EAAC,MAFtB;AAGiB,uBAAgB,gBAHjC;AAAA,4BAIE,sBAAC,uBAAD;AAAA,8BACE,sBAAC,WAAD;AAAA,gCACE,qBAAC,iBAAD;AAAA,iCACE,qBAAC,4BAAD;AAAe,YAAA,OAAO,EAAE,mBAAM,CAC7B,CADD;AAEe,YAAA,QAAQ,EAAE,CAAC,CAF1B;AAGe,YAAA,QAAQ,EAAEC,IAAI,CAAC2B,SAAL,CAAe,CAAf,IAAoB3B,IAAI,CAAC4B,QAAL,CAAc,CAAd;AAH7C;AADF,UADF,eAOE,sBAAC,eAAD;AAAA,kCACE,qBAAC,mBAAD;AAAqB,oCAArB;AAAA,gCAA0C5B,IAAI,CAAC2B,SAA/C,cAA4D3B,IAAI,CAAC4B,QAAjE;AAAA,YADF,eAEE,qBAAC,oBAAD;AAAsB,oCAAtB;AAAA,sBAAwC5B,IAAI,CAAC6B;AAA7C,YAFF,EAII7B,IAAI,CAAC8B,IAAL,iBACA,qBAAC,oBAAD;AAAW,YAAA,OAAO,EAAE,SAApB;AACW,YAAA,IAAI,EAAE9B,IAAI,CAAC8B,IAAL,CAAUC,IAD3B;AAEW,YAAA,MAAM,EAAE/B,IAAI,CAAC8B,IAAL,CAAUE,MAF7B;AAGW,YAAA,EAAE,EAAEhC,IAAI,CAAC8B,IAAL,CAAUG,EAHzB;AAIW,YAAA,OAAO,EAAEjC,IAAI,CAAC8B,IAAL,CAAUI,OAJ9B;AAAA,mCAKE,sBAAC,mBAAD;AAAA,sCACE;AAAA,0BACGlC,IAAI,CAAC8B,IAAL,CAAU1B;AADb,gBADF,EAIGJ,IAAI,CAAC8B,IAAL,CAAUN,IAAV,iBAAkBjB,KAAK,CAAC4B,YAAN,CAAmBnC,IAAI,CAAC8B,IAAL,CAAUN,IAA7B,EAAmC;AAACY,gBAAAA,IAAI,EAAE;AAAP,eAAnC,CAJrB;AAAA;AALF,YALJ;AAAA,UAPF;AAAA,QADF,EA6BIlC,QAAQ,CAACmC,MAAT,CAAgB,UAAAC,CAAC;AAAA,eAAI,CAACA,CAAC,CAACC,MAAP;AAAA,OAAjB,EAAgCC,GAAhC,CAAoC,UAACvB,OAAD,EAAUC,KAAV;AAAA,4BAClC,sBAAC,WAAD;AAAyB,UAAA,SAAS,EAAED,OAAO,CAACwB,OAAR,GAAkB,SAAlB,GAA8B,EAAlE;AAAA,qBACGxB,OAAO,CAACb,KAAR,iBAAiB,qBAAC,iBAAD;AAAA,sBAAoBa,OAAO,CAACb;AAA5B,YADpB,eAEE,qBAAC,eAAD;AAAA,sBACGa,OAAO,CAACyB,KAAR,CAAcF,GAAd,CAAkB,UAACxB,IAAD,EAAOE,KAAP;AAAA,qBAAiBH,UAAU,CAACC,IAAD,EAAOC,OAAP,EAAgBC,KAAhB,CAA3B;AAAA,aAAlB;AADH,aAAsBA,KAAtB,CAFF;AAAA,WAAkBA,KAAlB,CADkC;AAAA,OAApC,CA7BJ;AAAA,MAJF,eA2CE,sBAAC,uBAAD;AAAA,iBAEIhB,QAAQ,CAACmC,MAAT,CAAgB,UAAAC,CAAC;AAAA,eAAI,CAAC,CAACA,CAAC,CAACC,MAAR;AAAA,OAAjB,EAAiCC,GAAjC,CAAqC,UAACvB,OAAD,EAAUC,KAAV;AAAA,4BACnC,sBAAC,WAAD;AAAyB,UAAA,SAAS,EAAED,OAAO,CAACwB,OAAR,IAAmBvB,KAAK,KAAK,CAA7B,GAAiC,SAAjC,GAA6C,EAAjF;AAAA,qBACGD,OAAO,CAACb,KAAR,iBAAiB,qBAAC,iBAAD;AAAA,sBAAoBa,OAAO,CAACb;AAA5B,YADpB,eAEE,qBAAC,eAAD;AAAA,sBACGa,OAAO,CAACyB,KAAR,CAAcF,GAAd,CAAkB,UAACxB,IAAD,EAAOE,KAAP;AAAA,qBAAiBH,UAAU,CAACC,IAAD,EAAOC,OAAP,EAAgBC,KAAhB,CAA3B;AAAA,aAAlB;AADH,aAAsBA,KAAtB,CAFF;AAAA,WAAkBA,KAAlB,CADmC;AAAA,OAArC,CAFJ,EAYIf,OAAO,iBACP,qBAAC,oBAAD;AAAA,+BACE,qBAAC,cAAD;AAAQ,UAAA,KAAK,EAAE,OAAf;AACQ,UAAA,OAAO,EAAC,WADhB;AAEQ,UAAA,IAAI,eAAE,qBAAC,kBAAD,CAAa,MAAb,KAFd;AAGQ,UAAA,IAAI,EAAEwC,YAAKC,KAHnB;AAIQ,UAAA,OAAO,EAAE,iBAAAlC,CAAC,EAAI;AACZA,YAAAA,CAAC,CAACmC,cAAF;AACA1C,YAAAA,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAEuB,MAAT;AACD,WAPT;AAAA,oBAQGvB,OARH,aAQGA,OARH,uBAQGA,OAAO,CAAEC;AARZ;AADF,QAbJ;AAAA,MA3CF;AAAA,IADF;AAyED,CA3GD;;;AAJEL,EAAAA,I;AACAE,EAAAA,c;;eAgHaH,Q","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n BOXSHADOWS,\n COLORS,\n ComponentLStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n margin: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n width: 320px;\n\n position: absolute;\n\n &.show {\n display: block;\n }\n\n top: 0;\n right: 0;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n flex-flow: column;\n\n\n ${Breakpoints.MEDIUM} {\n flex-flow: initial;\n top: initial;\n right: initial;\n height: initial;\n animation: ${flowDown} 0.2s ease-in-out;\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n border-radius: 8px;\n border: 1px solid ${COLORS.neutral_200};\n z-index: ${Z_INDEXES.fixed_menu};\n padding: 24px 0;\n }\n`;\n\n\nconst MenuSection = styled.div`\n padding: 4px 0;\n display: flex;\n flex-direction: column;\n width: 100%;\n\n &.divider {\n border-top: 1px solid ${COLORS.neutral_200};\n }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n align-items: center;\n justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n display: flex;\n align-items: center;\n padding: 8px 24px 4px 24px;\n box-sizing: border-box;\n min-height: 32px;\n background-color: ${COLORS.neutral_20};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n margin: 0;\n padding: 0;\n\n ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n pointer-events: none;\n\n button {\n padding: 0 !important;\n }\n\n button > div {\n width: 48px !important;\n height: 48px !important;\n border-radius: 50% !important;\n }\n`;\n\nconst UserSectionInfo = styled.div`\n padding: 2px 0;\n display: flex;\n flex-direction: column;\n gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n word-break: break-all;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n padding: 2px 0;\n display: flex;\n align-items: center;\n gap: 4px;\n\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n svg {\n width: 16px;\n height: 16px;\n }\n`;\n\nconst UserSection = styled.div`\n display: flex;\n flex-direction: row;\n padding: 0 24px 8px 24px;\n gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n show?: boolean;\n onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n const {navigate, isActiveRoute} = useNavigationHelper();\n\n React.useEffect(() => {\n if (!onHideUserMenu) return;\n\n function handleKeyPress(e: any) {\n if (e.key === 'Escape' || e.key === 'Esc') {\n onHideUserMenu();\n }\n }\n\n document.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [onHideUserMenu]);\n\n const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n <MenuItem key={index}\n id={`profile_${index}`}\n active={!item.external && isActiveRoute(item.to, !!item.exact)}\n item={{\n value: item.to,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n }}\n onClickHandler={() => {\n item.action && item.action();\n navigate(item.to, !!item.external);\n }}/>\n\n return (\n <UserMenuWrapper onClick={onHideUserMenu}\n className={show ? 'show' : ''}\n role=\"menu\"\n aria-labelledby=\"UserMenuButton\">\n <UserMenuScrollContainer>\n <UserSection>\n <UserSectionAvatar>\n <ProfileButton onClick={() => {\n }}\n tabIndex={-1}\n initials={user.firstName[0] + user.lastName[0]}/>\n </UserSectionAvatar>\n <UserSectionInfo>\n <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n {\n user.link &&\n <HyperLink variant={'default'}\n href={user.link.href}\n target={user.link.target}\n id={user.link.id}\n onClick={user.link.onClick}>\n <UserSectionInfoLink>\n <span>\n {user.link.label}\n </span>\n {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n </UserSectionInfoLink>\n </HyperLink>\n }\n </UserSectionInfo>\n </UserSection>\n {\n sections.filter(a => !a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n </UserMenuScrollContainer>\n <UserMenuPinnedContainer>\n {\n sections.filter(a => !!a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n {\n signOut &&\n <SignOutActionWrapper>\n <Button width={'272px'}\n variant=\"secondary\"\n icon={<SystemIcons.Logout/>}\n size={Size.Large}\n onClick={e => {\n e.preventDefault();\n signOut?.action();\n }}>\n {signOut?.label}\n </Button>\n </SignOutActionWrapper>\n }\n </UserMenuPinnedContainer>\n </UserMenuWrapper>\n );\n};\n\nexport default UserMenu;\n"],"file":"UserMenu.cjs"}
|
|
@@ -27,8 +27,8 @@ var MenuSectionList = styled.div(_templateObject7 || (_templateObject7 = _tagged
|
|
|
27
27
|
var UserSectionAvatar = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n pointer-events: none;\n\n button {\n padding: 0 !important;\n }\n\n button > div {\n width: 48px !important;\n height: 48px !important;\n border-radius: 50% !important;\n }\n"])));
|
|
28
28
|
var UserSectionInfo = styled.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n padding: 2px 0;\n display: flex;\n flex-direction: column;\n gap: 4px;\n"])));
|
|
29
29
|
var UserSectionInfoName = styled.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n ", "\n"])), ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600));
|
|
30
|
-
var UserSectionInfoEmail = styled.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n ", "\n"])), ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500));
|
|
31
|
-
var UserSectionInfoLink = styled.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n padding: 2px 0;\n display: flex;\n align-items: center;\n gap: 4px;\n ", "\n
|
|
30
|
+
var UserSectionInfoEmail = styled.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n word-break: break-all;\n ", "\n"])), ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500));
|
|
31
|
+
var UserSectionInfoLink = styled.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n padding: 2px 0;\n display: flex;\n align-items: center;\n gap: 4px;\n\n ", "\n svg {\n width: 16px;\n height: 16px;\n }\n"])), ComponentXSStyling(ComponentTextStyle.Bold, null));
|
|
32
32
|
var UserSection = styled.div(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: row;\n padding: 0 24px 8px 24px;\n gap: 16px;\n"])));
|
|
33
33
|
|
|
34
34
|
var UserMenu = function UserMenu(_ref) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"names":["React","styled","Button","BOXSHADOWS","COLORS","ComponentLStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","Size","flowDown","UserMenuSectionListStyling","SystemIcons","HyperLink","Breakpoints","MenuItem","useNavigationHelper","ProfileButton","UserMenuScrollContainer","div","UserMenuPinnedContainer","UserMenuWrapper","white","off_canvas","MEDIUM","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","Bold","neutral_500","MenuSectionList","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","neutral_600","UserSectionInfoEmail","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","navigate","isActiveRoute","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Large","preventDefault"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n BOXSHADOWS,\n COLORS,\n ComponentLStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n margin: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n width: 320px;\n\n position: absolute;\n\n &.show {\n display: block;\n }\n\n top: 0;\n right: 0;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n flex-flow: column;\n\n\n ${Breakpoints.MEDIUM} {\n flex-flow: initial;\n top: initial;\n right: initial;\n height: initial;\n animation: ${flowDown} 0.2s ease-in-out;\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n border-radius: 8px;\n border: 1px solid ${COLORS.neutral_200};\n z-index: ${Z_INDEXES.fixed_menu};\n padding: 24px 0;\n }\n`;\n\n\nconst MenuSection = styled.div`\n padding: 4px 0;\n display: flex;\n flex-direction: column;\n width: 100%;\n\n &.divider {\n border-top: 1px solid ${COLORS.neutral_200};\n }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n align-items: center;\n justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n display: flex;\n align-items: center;\n padding: 8px 24px 4px 24px;\n box-sizing: border-box;\n min-height: 32px;\n background-color: ${COLORS.neutral_20};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n margin: 0;\n padding: 0;\n\n ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n pointer-events: none;\n\n button {\n padding: 0 !important;\n }\n\n button > div {\n width: 48px !important;\n height: 48px !important;\n border-radius: 50% !important;\n }\n`;\n\nconst UserSectionInfo = styled.div`\n padding: 2px 0;\n display: flex;\n flex-direction: column;\n gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n padding: 2px 0;\n display: flex;\n align-items: center;\n gap: 4px;\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n\n svg {\n width: 16px;\n height: 16px;\n }\n`;\n\nconst UserSection = styled.div`\n display: flex;\n flex-direction: row;\n padding: 0 24px 8px 24px;\n gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n show?: boolean;\n onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n const {navigate, isActiveRoute} = useNavigationHelper();\n\n React.useEffect(() => {\n if (!onHideUserMenu) return;\n\n function handleKeyPress(e: any) {\n if (e.key === 'Escape' || e.key === 'Esc') {\n onHideUserMenu();\n }\n }\n\n document.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [onHideUserMenu]);\n\n const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n <MenuItem key={index}\n id={`profile_${index}`}\n active={!item.external && isActiveRoute(item.to, !!item.exact)}\n item={{\n value: item.to,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n }}\n onClickHandler={() => {\n item.action && item.action();\n navigate(item.to, !!item.external);\n }}/>\n\n return (\n <UserMenuWrapper onClick={onHideUserMenu}\n className={show ? 'show' : ''}\n role=\"menu\"\n aria-labelledby=\"UserMenuButton\">\n <UserMenuScrollContainer>\n <UserSection>\n <UserSectionAvatar>\n <ProfileButton onClick={() => {\n }}\n tabIndex={-1}\n initials={user.firstName[0] + user.lastName[0]}/>\n </UserSectionAvatar>\n <UserSectionInfo>\n <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n {\n user.link &&\n <HyperLink variant={'default'}\n href={user.link.href}\n target={user.link.target}\n id={user.link.id}\n onClick={user.link.onClick}>\n <UserSectionInfoLink>\n <span>\n {user.link.label}\n </span>\n {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n </UserSectionInfoLink>\n </HyperLink>\n }\n </UserSectionInfo>\n </UserSection>\n {\n sections.filter(a => !a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n </UserMenuScrollContainer>\n <UserMenuPinnedContainer>\n {\n sections.filter(a => !!a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n {\n signOut &&\n <SignOutActionWrapper>\n <Button width={'272px'}\n variant=\"secondary\"\n icon={<SystemIcons.Logout/>}\n size={Size.Large}\n onClick={e => {\n e.preventDefault();\n signOut?.action();\n }}>\n {signOut?.label}\n </Button>\n </SignOutActionWrapper>\n }\n </UserMenuPinnedContainer>\n </UserMenuWrapper>\n );\n};\n\nexport default UserMenu;\n"],"file":"UserMenu.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"names":["React","styled","Button","BOXSHADOWS","COLORS","ComponentLStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","Size","flowDown","UserMenuSectionListStyling","SystemIcons","HyperLink","Breakpoints","MenuItem","useNavigationHelper","ProfileButton","UserMenuScrollContainer","div","UserMenuPinnedContainer","UserMenuWrapper","white","off_canvas","MEDIUM","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","Bold","neutral_500","MenuSectionList","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","neutral_600","UserSectionInfoEmail","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","navigate","isActiveRoute","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Large","preventDefault"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n BOXSHADOWS,\n COLORS,\n ComponentLStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n margin: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n width: 320px;\n\n position: absolute;\n\n &.show {\n display: block;\n }\n\n top: 0;\n right: 0;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n flex-flow: column;\n\n\n ${Breakpoints.MEDIUM} {\n flex-flow: initial;\n top: initial;\n right: initial;\n height: initial;\n animation: ${flowDown} 0.2s ease-in-out;\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n border-radius: 8px;\n border: 1px solid ${COLORS.neutral_200};\n z-index: ${Z_INDEXES.fixed_menu};\n padding: 24px 0;\n }\n`;\n\n\nconst MenuSection = styled.div`\n padding: 4px 0;\n display: flex;\n flex-direction: column;\n width: 100%;\n\n &.divider {\n border-top: 1px solid ${COLORS.neutral_200};\n }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n align-items: center;\n justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n display: flex;\n align-items: center;\n padding: 8px 24px 4px 24px;\n box-sizing: border-box;\n min-height: 32px;\n background-color: ${COLORS.neutral_20};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n margin: 0;\n padding: 0;\n\n ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n pointer-events: none;\n\n button {\n padding: 0 !important;\n }\n\n button > div {\n width: 48px !important;\n height: 48px !important;\n border-radius: 50% !important;\n }\n`;\n\nconst UserSectionInfo = styled.div`\n padding: 2px 0;\n display: flex;\n flex-direction: column;\n gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n word-break: break-all;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n padding: 2px 0;\n display: flex;\n align-items: center;\n gap: 4px;\n\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n svg {\n width: 16px;\n height: 16px;\n }\n`;\n\nconst UserSection = styled.div`\n display: flex;\n flex-direction: row;\n padding: 0 24px 8px 24px;\n gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n show?: boolean;\n onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n const {navigate, isActiveRoute} = useNavigationHelper();\n\n React.useEffect(() => {\n if (!onHideUserMenu) return;\n\n function handleKeyPress(e: any) {\n if (e.key === 'Escape' || e.key === 'Esc') {\n onHideUserMenu();\n }\n }\n\n document.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [onHideUserMenu]);\n\n const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n <MenuItem key={index}\n id={`profile_${index}`}\n active={!item.external && isActiveRoute(item.to, !!item.exact)}\n item={{\n value: item.to,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n }}\n onClickHandler={() => {\n item.action && item.action();\n navigate(item.to, !!item.external);\n }}/>\n\n return (\n <UserMenuWrapper onClick={onHideUserMenu}\n className={show ? 'show' : ''}\n role=\"menu\"\n aria-labelledby=\"UserMenuButton\">\n <UserMenuScrollContainer>\n <UserSection>\n <UserSectionAvatar>\n <ProfileButton onClick={() => {\n }}\n tabIndex={-1}\n initials={user.firstName[0] + user.lastName[0]}/>\n </UserSectionAvatar>\n <UserSectionInfo>\n <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n {\n user.link &&\n <HyperLink variant={'default'}\n href={user.link.href}\n target={user.link.target}\n id={user.link.id}\n onClick={user.link.onClick}>\n <UserSectionInfoLink>\n <span>\n {user.link.label}\n </span>\n {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n </UserSectionInfoLink>\n </HyperLink>\n }\n </UserSectionInfo>\n </UserSection>\n {\n sections.filter(a => !a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n </UserMenuScrollContainer>\n <UserMenuPinnedContainer>\n {\n sections.filter(a => !!a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n {\n signOut &&\n <SignOutActionWrapper>\n <Button width={'272px'}\n variant=\"secondary\"\n icon={<SystemIcons.Logout/>}\n size={Size.Large}\n onClick={e => {\n e.preventDefault();\n signOut?.action();\n }}>\n {signOut?.label}\n </Button>\n </SignOutActionWrapper>\n }\n </UserMenuPinnedContainer>\n </UserMenuWrapper>\n );\n};\n\nexport default UserMenu;\n"],"file":"UserMenu.js"}
|
|
@@ -41,7 +41,7 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _temp
|
|
|
41
41
|
|
|
42
42
|
var HeaderText = _styledComponents.default.div(_templateObject || (_templateObject = (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));
|
|
43
43
|
|
|
44
|
-
var HeaderNote = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n ", "\n"])), (0, _styles.ParagraphXSStyling)(_styles.ParagraphTextStyle.Regular, _styles.COLORS.neutral_600));
|
|
44
|
+
var HeaderNote = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n word-break: break-all;\n ", "\n"])), (0, _styles.ParagraphXSStyling)(_styles.ParagraphTextStyle.Regular, _styles.COLORS.neutral_600));
|
|
45
45
|
|
|
46
46
|
var HeaderContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (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);
|
|
47
47
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenuContent.tsx"],"names":["HeaderText","styled","div","ComponentTextStyle","Bold","COLORS","neutral_600","BREAKPOINTS","SMALL","HeaderNote","ParagraphTextStyle","Regular","HeaderContainer","neutral_200","ScrollableContainer","Size","Small","MenuItemsContainer","MenuSectionContainer","MenuSectionHeader","neutral_20","neutral_500","MenuSectionList","PinnedContainer","FooterText","FooterNote","FooterLink","FooterContainer","ActionContainer","Wrapper","MobileMenuContent","header","items","footer","action","onSubMenuOpen","isSmallScreen","query","replace","navigate","isActiveRoute","React","useState","scrollable","setScrollable","updateOnResize","scrollContainerRef","dimensions","node","useEffect","clientHeight","scrollHeight","renderItem","item","index","type","label","map","Medium","value","disabled","icon","displayLabel","noteLabel","note","e","nativeEvent","stopImmediatePropagation","external","to","exact","filter","a","pinned","some","link","id","target","onClick","href"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {\n MenuButton,\n MenuGroupFooter,\n MenuGroupHeader,\n MenuNavigationItemTypeGroup,\n MenuNavigationItemTypeItem,\n MenuNavigationItemTypeSection\n} from '../types';\nimport styled from 'styled-components';\nimport {\n BREAKPOINTS,\n COLORS,\n ComponentMStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n ParagraphSStyling,\n ParagraphTextStyle,\n ParagraphXSStyling,\n scrollBarStyling\n} from '../../styles';\nimport {Size} from '../../types';\nimport {HyperLink} from '../../HyperLink';\nimport {useMediaQuery} from 'react-responsive';\nimport {Button} from '../../Button';\nimport {useNavigationHelper} from '../NavigationHelper';\nimport {MenuItem} from '../../MenuItem';\nimport {SystemIcons} from '../../icons';\nimport {useDimensionsRef} from 'rooks';\n\n\nconst HeaderText = styled.div`\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n ${BREAKPOINTS.SMALL} {\n ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n }\n`;\nconst HeaderNote = styled.div`\n ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nconst HeaderContainer = styled.div`\n margin: 0 24px;\n padding-bottom: 8px;\n box-sizing: border-box;\n border-bottom: 1px solid ${COLORS.neutral_200};\n display: flex;\n flex-direction: column;\n`;\n\n\nconst ScrollableContainer = styled.div`\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n max-height: 100%;\n\n &.scrollable {\n margin-right: 6px;\n padding-right: 10px;\n }\n\n ${scrollBarStyling(Size.Small)}\n`;\n\nconst MenuItemsContainer = styled.div`\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n padding: 8px;\n`;\n\nconst MenuSectionContainer = styled.div`\n padding-bottom: 8px;\n display: flex;\n flex-direction: column;\n width: 100%;\n\n &.divider {\n border-top: 1px solid ${COLORS.neutral_200};\n }\n`;\n\nconst MenuSectionHeader = styled.div`\n display: flex;\n align-items: center;\n padding: 8px 16px 4px 16px;\n box-sizing: border-box;\n min-height: 32px;\n background-color: ${COLORS.neutral_20};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\n\nconst PinnedContainer = styled.div`\n border-top: 1px solid ${COLORS.neutral_200};\n`;\n\nconst FooterText = styled.div`\n ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n ${BREAKPOINTS.SMALL} {\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n }\n`;\nconst FooterNote = styled.div`\n ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n ${BREAKPOINTS.SMALL} {\n ${ParagraphSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n }\n`;\nconst FooterLink = styled.div`\n a {\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n ${BREAKPOINTS.SMALL} {\n ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n }\n }\n`;\n\nconst FooterContainer = styled.div`\n padding: 8px 16px;\n box-sizing: border-box;\n border-top: 1px solid ${COLORS.neutral_200};\n display: flex;\n flex-direction: column;\n background: ${COLORS.neutral_20};\n\n ${BREAKPOINTS.SMALL} {\n padding: 16px;\n }\n`;\n\nconst ActionContainer = styled.div`\n padding: 8px 16px;\n box-sizing: border-box;\n border-top: 1px solid ${COLORS.neutral_200};\n display: flex;\n flex-direction: column;\n\n ${BREAKPOINTS.SMALL} {\n padding: 16px;\n }\n`;\n\nconst Wrapper = styled.div`\n width: 100%;\n box-sizing: border-box;\n flex-flow: column;\n display: flex;\n flex: 1;\n overflow: hidden;\n`;\n\ninterface MobileMenuContentProps {\n header?: MenuGroupHeader;\n items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\n footer?: MenuGroupFooter;\n action?: MenuButton;\n\n onSubMenuOpen?: (item: MenuNavigationItemTypeGroup) => void;\n}\n\nconst MobileMenuContent: React.FunctionComponent<MobileMenuContentProps> = ({\n header,\n items,\n footer,\n action,\n onSubMenuOpen\n }) => {\n\n const isSmallScreen = useMediaQuery({query: BREAKPOINTS.SMALL.replace('@media ', '')});\n\n const {navigate, isActiveRoute} = useNavigationHelper();\n\n const [scrollable, setScrollable] = React.useState(false);\n\n const [scrollContainerRef, dimensions, node] = useDimensionsRef({updateOnResize: true});\n\n React.useEffect(() => {\n const clientHeight = node?.clientHeight ?? 0;\n const scrollHeight = node?.scrollHeight ?? 0;\n setScrollable(scrollHeight > clientHeight);\n }, [header, dimensions, node, footer, action, items]);\n\n const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection, index: number) => {\n switch (item.type) {\n case 'section':\n return (\n <MenuSectionContainer key={index}>\n {item.label && <MenuSectionHeader>{item.label}</MenuSectionHeader>}\n <MenuSectionList>\n {item.items.map((item, index) => renderItem(item, index))}\n </MenuSectionList>\n </MenuSectionContainer>\n );\n case 'group':\n return <MenuItem key={index}\n id={'menu-item-' + index}\n size={isSmallScreen ? Size.Medium : Size.Small}\n active={false}\n item={{\n value: item.label,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n noteLabel: item.note,\n }}\n iconRight={<SystemIcons.ArrowDropRight/>}\n onClickHandler={(e) => {\n e.nativeEvent.stopImmediatePropagation();\n onSubMenuOpen && onSubMenuOpen(item);\n }}/>\n case 'item':\n default:\n return (\n <MenuItem key={index}\n id={'menu-item-' + index}\n active={!item.external && isActiveRoute(item.to, !!item.exact)}\n size={isSmallScreen ? Size.Medium : Size.Small}\n item={{\n value: item.to,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n noteLabel: item.note,\n }}\n onClickHandler={() => {\n item.action && item.action();\n navigate(item.to, !!item.external);\n }}/>\n );\n }\n }\n\n return (\n <Wrapper>\n <ScrollableContainer ref={scrollContainerRef as any} className={scrollable ? 'scrollable' : ''}>\n {\n !!header &&\n <HeaderContainer>\n <HeaderText>{header.header}</HeaderText>\n {header.note && <HeaderNote>{header.note}</HeaderNote>}\n </HeaderContainer>\n }\n <MenuItemsContainer>\n {items?.filter(a => !a.pinned).map((item, index) => renderItem(item, index))}\n </MenuItemsContainer>\n </ScrollableContainer>\n {\n items?.some(a => a.pinned) &&\n <PinnedContainer>\n <MenuItemsContainer>\n {items?.filter(a => !!a.pinned).map((item, index) => renderItem(item, index))}\n </MenuItemsContainer>\n </PinnedContainer>\n\n }\n {\n footer &&\n <FooterContainer>\n <FooterText>{footer.header}</FooterText>\n {footer.note && <FooterNote>{footer.note}</FooterNote>}\n {footer.link &&\n <FooterLink>\n <HyperLink variant={'default'}\n id={footer.link.id}\n target={footer.link.target}\n onClick={footer.link.onClick}\n href={footer.link.href}>\n {footer.link.label}\n </HyperLink>\n </FooterLink>\n }\n </FooterContainer>\n }\n {\n action &&\n <ActionContainer>\n <Button variant={'secondary'}\n size={isSmallScreen ? Size.Medium : Size.Small}\n disabled={action.disabled}\n icon={action.icon}\n onClick={action.action}>\n {action.label}\n </Button>\n </ActionContainer>\n }\n </Wrapper>\n )\n};\n\nexport default MobileMenuContent;\n"],"file":"MobileMenuContent.cjs"}
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenuContent.tsx"],"names":["HeaderText","styled","div","ComponentTextStyle","Bold","COLORS","neutral_600","BREAKPOINTS","SMALL","HeaderNote","ParagraphTextStyle","Regular","HeaderContainer","neutral_200","ScrollableContainer","Size","Small","MenuItemsContainer","MenuSectionContainer","MenuSectionHeader","neutral_20","neutral_500","MenuSectionList","PinnedContainer","FooterText","FooterNote","FooterLink","FooterContainer","ActionContainer","Wrapper","MobileMenuContent","header","items","footer","action","onSubMenuOpen","isSmallScreen","query","replace","navigate","isActiveRoute","React","useState","scrollable","setScrollable","updateOnResize","scrollContainerRef","dimensions","node","useEffect","clientHeight","scrollHeight","renderItem","item","index","type","label","map","Medium","value","disabled","icon","displayLabel","noteLabel","note","e","nativeEvent","stopImmediatePropagation","external","to","exact","filter","a","pinned","some","link","id","target","onClick","href"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {\n MenuButton,\n MenuGroupFooter,\n MenuGroupHeader,\n MenuNavigationItemTypeGroup,\n MenuNavigationItemTypeItem,\n MenuNavigationItemTypeSection\n} from '../types';\nimport styled from 'styled-components';\nimport {\n BREAKPOINTS,\n COLORS,\n ComponentMStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n ParagraphSStyling,\n ParagraphTextStyle,\n ParagraphXSStyling,\n scrollBarStyling\n} from '../../styles';\nimport {Size} from '../../types';\nimport {HyperLink} from '../../HyperLink';\nimport {useMediaQuery} from 'react-responsive';\nimport {Button} from '../../Button';\nimport {useNavigationHelper} from '../NavigationHelper';\nimport {MenuItem} from '../../MenuItem';\nimport {SystemIcons} from '../../icons';\nimport {useDimensionsRef} from 'rooks';\n\n\nconst HeaderText = styled.div`\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n ${BREAKPOINTS.SMALL} {\n ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n }\n`;\nconst HeaderNote = styled.div`\n word-break: break-all;\n ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nconst HeaderContainer = styled.div`\n margin: 0 24px;\n padding-bottom: 8px;\n box-sizing: border-box;\n border-bottom: 1px solid ${COLORS.neutral_200};\n display: flex;\n flex-direction: column;\n`;\n\n\nconst ScrollableContainer = styled.div`\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n max-height: 100%;\n\n &.scrollable {\n margin-right: 6px;\n padding-right: 10px;\n }\n\n ${scrollBarStyling(Size.Small)}\n`;\n\nconst MenuItemsContainer = styled.div`\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n padding: 8px;\n`;\n\nconst MenuSectionContainer = styled.div`\n padding-bottom: 8px;\n display: flex;\n flex-direction: column;\n width: 100%;\n\n &.divider {\n border-top: 1px solid ${COLORS.neutral_200};\n }\n`;\n\nconst MenuSectionHeader = styled.div`\n display: flex;\n align-items: center;\n padding: 8px 16px 4px 16px;\n box-sizing: border-box;\n min-height: 32px;\n background-color: ${COLORS.neutral_20};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\n\nconst PinnedContainer = styled.div`\n border-top: 1px solid ${COLORS.neutral_200};\n`;\n\nconst FooterText = styled.div`\n ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n ${BREAKPOINTS.SMALL} {\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n }\n`;\nconst FooterNote = styled.div`\n ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n ${BREAKPOINTS.SMALL} {\n ${ParagraphSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n }\n`;\nconst FooterLink = styled.div`\n a {\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n ${BREAKPOINTS.SMALL} {\n ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n }\n }\n`;\n\nconst FooterContainer = styled.div`\n padding: 8px 16px;\n box-sizing: border-box;\n border-top: 1px solid ${COLORS.neutral_200};\n display: flex;\n flex-direction: column;\n background: ${COLORS.neutral_20};\n\n ${BREAKPOINTS.SMALL} {\n padding: 16px;\n }\n`;\n\nconst ActionContainer = styled.div`\n padding: 8px 16px;\n box-sizing: border-box;\n border-top: 1px solid ${COLORS.neutral_200};\n display: flex;\n flex-direction: column;\n\n ${BREAKPOINTS.SMALL} {\n padding: 16px;\n }\n`;\n\nconst Wrapper = styled.div`\n width: 100%;\n box-sizing: border-box;\n flex-flow: column;\n display: flex;\n flex: 1;\n overflow: hidden;\n`;\n\ninterface MobileMenuContentProps {\n header?: MenuGroupHeader;\n items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\n footer?: MenuGroupFooter;\n action?: MenuButton;\n\n onSubMenuOpen?: (item: MenuNavigationItemTypeGroup) => void;\n}\n\nconst MobileMenuContent: React.FunctionComponent<MobileMenuContentProps> = ({\n header,\n items,\n footer,\n action,\n onSubMenuOpen\n }) => {\n\n const isSmallScreen = useMediaQuery({query: BREAKPOINTS.SMALL.replace('@media ', '')});\n\n const {navigate, isActiveRoute} = useNavigationHelper();\n\n const [scrollable, setScrollable] = React.useState(false);\n\n const [scrollContainerRef, dimensions, node] = useDimensionsRef({updateOnResize: true});\n\n React.useEffect(() => {\n const clientHeight = node?.clientHeight ?? 0;\n const scrollHeight = node?.scrollHeight ?? 0;\n setScrollable(scrollHeight > clientHeight);\n }, [header, dimensions, node, footer, action, items]);\n\n const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection, index: number) => {\n switch (item.type) {\n case 'section':\n return (\n <MenuSectionContainer key={index}>\n {item.label && <MenuSectionHeader>{item.label}</MenuSectionHeader>}\n <MenuSectionList>\n {item.items.map((item, index) => renderItem(item, index))}\n </MenuSectionList>\n </MenuSectionContainer>\n );\n case 'group':\n return <MenuItem key={index}\n id={'menu-item-' + index}\n size={isSmallScreen ? Size.Medium : Size.Small}\n active={false}\n item={{\n value: item.label,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n noteLabel: item.note,\n }}\n iconRight={<SystemIcons.ArrowDropRight/>}\n onClickHandler={(e) => {\n e.nativeEvent.stopImmediatePropagation();\n onSubMenuOpen && onSubMenuOpen(item);\n }}/>\n case 'item':\n default:\n return (\n <MenuItem key={index}\n id={'menu-item-' + index}\n active={!item.external && isActiveRoute(item.to, !!item.exact)}\n size={isSmallScreen ? Size.Medium : Size.Small}\n item={{\n value: item.to,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n noteLabel: item.note,\n }}\n onClickHandler={() => {\n item.action && item.action();\n navigate(item.to, !!item.external);\n }}/>\n );\n }\n }\n\n return (\n <Wrapper>\n <ScrollableContainer ref={scrollContainerRef as any} className={scrollable ? 'scrollable' : ''}>\n {\n !!header &&\n <HeaderContainer>\n <HeaderText>{header.header}</HeaderText>\n {header.note && <HeaderNote>{header.note}</HeaderNote>}\n </HeaderContainer>\n }\n <MenuItemsContainer>\n {items?.filter(a => !a.pinned).map((item, index) => renderItem(item, index))}\n </MenuItemsContainer>\n </ScrollableContainer>\n {\n items?.some(a => a.pinned) &&\n <PinnedContainer>\n <MenuItemsContainer>\n {items?.filter(a => !!a.pinned).map((item, index) => renderItem(item, index))}\n </MenuItemsContainer>\n </PinnedContainer>\n\n }\n {\n footer &&\n <FooterContainer>\n <FooterText>{footer.header}</FooterText>\n {footer.note && <FooterNote>{footer.note}</FooterNote>}\n {footer.link &&\n <FooterLink>\n <HyperLink variant={'default'}\n id={footer.link.id}\n target={footer.link.target}\n onClick={footer.link.onClick}\n href={footer.link.href}>\n {footer.link.label}\n </HyperLink>\n </FooterLink>\n }\n </FooterContainer>\n }\n {\n action &&\n <ActionContainer>\n <Button variant={'secondary'}\n size={isSmallScreen ? Size.Medium : Size.Small}\n disabled={action.disabled}\n icon={action.icon}\n onClick={action.action}>\n {action.label}\n </Button>\n </ActionContainer>\n }\n </Wrapper>\n )\n};\n\nexport default MobileMenuContent;\n"],"file":"MobileMenuContent.cjs"}
|
|
@@ -18,7 +18,7 @@ import { useDimensionsRef } from 'rooks';
|
|
|
18
18
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
19
19
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
20
20
|
var HeaderText = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n ", "\n ", " {\n ", "\n }\n"])), ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600), BREAKPOINTS.SMALL, ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600));
|
|
21
|
-
var HeaderNote = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n ", "\n"])), ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600));
|
|
21
|
+
var HeaderNote = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n word-break: break-all;\n ", "\n"])), ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600));
|
|
22
22
|
var HeaderContainer = styled.div(_templateObject3 || (_templateObject3 = _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);
|
|
23
23
|
var ScrollableContainer = styled.div(_templateObject4 || (_templateObject4 = _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"])), scrollBarStyling(Size.Small));
|
|
24
24
|
var MenuItemsContainer = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n padding: 8px;\n"])));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenuContent.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","ParagraphSStyling","ParagraphTextStyle","ParagraphXSStyling","scrollBarStyling","Size","HyperLink","useMediaQuery","Button","useNavigationHelper","MenuItem","SystemIcons","useDimensionsRef","HeaderText","div","Bold","neutral_600","SMALL","HeaderNote","Regular","HeaderContainer","neutral_200","ScrollableContainer","Small","MenuItemsContainer","MenuSectionContainer","MenuSectionHeader","neutral_20","neutral_500","MenuSectionList","PinnedContainer","FooterText","FooterNote","FooterLink","FooterContainer","ActionContainer","Wrapper","MobileMenuContent","header","items","footer","action","onSubMenuOpen","isSmallScreen","query","replace","navigate","isActiveRoute","useState","scrollable","setScrollable","updateOnResize","scrollContainerRef","dimensions","node","useEffect","clientHeight","scrollHeight","renderItem","item","index","type","label","map","Medium","value","disabled","icon","displayLabel","noteLabel","note","e","nativeEvent","stopImmediatePropagation","external","to","exact","filter","a","pinned","some","link","id","target","onClick","href"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {\n MenuButton,\n MenuGroupFooter,\n MenuGroupHeader,\n MenuNavigationItemTypeGroup,\n MenuNavigationItemTypeItem,\n MenuNavigationItemTypeSection\n} from '../types';\nimport styled from 'styled-components';\nimport {\n BREAKPOINTS,\n COLORS,\n ComponentMStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n ParagraphSStyling,\n ParagraphTextStyle,\n ParagraphXSStyling,\n scrollBarStyling\n} from '../../styles';\nimport {Size} from '../../types';\nimport {HyperLink} from '../../HyperLink';\nimport {useMediaQuery} from 'react-responsive';\nimport {Button} from '../../Button';\nimport {useNavigationHelper} from '../NavigationHelper';\nimport {MenuItem} from '../../MenuItem';\nimport {SystemIcons} from '../../icons';\nimport {useDimensionsRef} from 'rooks';\n\n\nconst HeaderText = styled.div`\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n ${BREAKPOINTS.SMALL} {\n ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n }\n`;\nconst HeaderNote = styled.div`\n ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nconst HeaderContainer = styled.div`\n margin: 0 24px;\n padding-bottom: 8px;\n box-sizing: border-box;\n border-bottom: 1px solid ${COLORS.neutral_200};\n display: flex;\n flex-direction: column;\n`;\n\n\nconst ScrollableContainer = styled.div`\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n max-height: 100%;\n\n &.scrollable {\n margin-right: 6px;\n padding-right: 10px;\n }\n\n ${scrollBarStyling(Size.Small)}\n`;\n\nconst MenuItemsContainer = styled.div`\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n padding: 8px;\n`;\n\nconst MenuSectionContainer = styled.div`\n padding-bottom: 8px;\n display: flex;\n flex-direction: column;\n width: 100%;\n\n &.divider {\n border-top: 1px solid ${COLORS.neutral_200};\n }\n`;\n\nconst MenuSectionHeader = styled.div`\n display: flex;\n align-items: center;\n padding: 8px 16px 4px 16px;\n box-sizing: border-box;\n min-height: 32px;\n background-color: ${COLORS.neutral_20};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\n\nconst PinnedContainer = styled.div`\n border-top: 1px solid ${COLORS.neutral_200};\n`;\n\nconst FooterText = styled.div`\n ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n ${BREAKPOINTS.SMALL} {\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n }\n`;\nconst FooterNote = styled.div`\n ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n ${BREAKPOINTS.SMALL} {\n ${ParagraphSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n }\n`;\nconst FooterLink = styled.div`\n a {\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n ${BREAKPOINTS.SMALL} {\n ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n }\n }\n`;\n\nconst FooterContainer = styled.div`\n padding: 8px 16px;\n box-sizing: border-box;\n border-top: 1px solid ${COLORS.neutral_200};\n display: flex;\n flex-direction: column;\n background: ${COLORS.neutral_20};\n\n ${BREAKPOINTS.SMALL} {\n padding: 16px;\n }\n`;\n\nconst ActionContainer = styled.div`\n padding: 8px 16px;\n box-sizing: border-box;\n border-top: 1px solid ${COLORS.neutral_200};\n display: flex;\n flex-direction: column;\n\n ${BREAKPOINTS.SMALL} {\n padding: 16px;\n }\n`;\n\nconst Wrapper = styled.div`\n width: 100%;\n box-sizing: border-box;\n flex-flow: column;\n display: flex;\n flex: 1;\n overflow: hidden;\n`;\n\ninterface MobileMenuContentProps {\n header?: MenuGroupHeader;\n items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\n footer?: MenuGroupFooter;\n action?: MenuButton;\n\n onSubMenuOpen?: (item: MenuNavigationItemTypeGroup) => void;\n}\n\nconst MobileMenuContent: React.FunctionComponent<MobileMenuContentProps> = ({\n header,\n items,\n footer,\n action,\n onSubMenuOpen\n }) => {\n\n const isSmallScreen = useMediaQuery({query: BREAKPOINTS.SMALL.replace('@media ', '')});\n\n const {navigate, isActiveRoute} = useNavigationHelper();\n\n const [scrollable, setScrollable] = React.useState(false);\n\n const [scrollContainerRef, dimensions, node] = useDimensionsRef({updateOnResize: true});\n\n React.useEffect(() => {\n const clientHeight = node?.clientHeight ?? 0;\n const scrollHeight = node?.scrollHeight ?? 0;\n setScrollable(scrollHeight > clientHeight);\n }, [header, dimensions, node, footer, action, items]);\n\n const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection, index: number) => {\n switch (item.type) {\n case 'section':\n return (\n <MenuSectionContainer key={index}>\n {item.label && <MenuSectionHeader>{item.label}</MenuSectionHeader>}\n <MenuSectionList>\n {item.items.map((item, index) => renderItem(item, index))}\n </MenuSectionList>\n </MenuSectionContainer>\n );\n case 'group':\n return <MenuItem key={index}\n id={'menu-item-' + index}\n size={isSmallScreen ? Size.Medium : Size.Small}\n active={false}\n item={{\n value: item.label,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n noteLabel: item.note,\n }}\n iconRight={<SystemIcons.ArrowDropRight/>}\n onClickHandler={(e) => {\n e.nativeEvent.stopImmediatePropagation();\n onSubMenuOpen && onSubMenuOpen(item);\n }}/>\n case 'item':\n default:\n return (\n <MenuItem key={index}\n id={'menu-item-' + index}\n active={!item.external && isActiveRoute(item.to, !!item.exact)}\n size={isSmallScreen ? Size.Medium : Size.Small}\n item={{\n value: item.to,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n noteLabel: item.note,\n }}\n onClickHandler={() => {\n item.action && item.action();\n navigate(item.to, !!item.external);\n }}/>\n );\n }\n }\n\n return (\n <Wrapper>\n <ScrollableContainer ref={scrollContainerRef as any} className={scrollable ? 'scrollable' : ''}>\n {\n !!header &&\n <HeaderContainer>\n <HeaderText>{header.header}</HeaderText>\n {header.note && <HeaderNote>{header.note}</HeaderNote>}\n </HeaderContainer>\n }\n <MenuItemsContainer>\n {items?.filter(a => !a.pinned).map((item, index) => renderItem(item, index))}\n </MenuItemsContainer>\n </ScrollableContainer>\n {\n items?.some(a => a.pinned) &&\n <PinnedContainer>\n <MenuItemsContainer>\n {items?.filter(a => !!a.pinned).map((item, index) => renderItem(item, index))}\n </MenuItemsContainer>\n </PinnedContainer>\n\n }\n {\n footer &&\n <FooterContainer>\n <FooterText>{footer.header}</FooterText>\n {footer.note && <FooterNote>{footer.note}</FooterNote>}\n {footer.link &&\n <FooterLink>\n <HyperLink variant={'default'}\n id={footer.link.id}\n target={footer.link.target}\n onClick={footer.link.onClick}\n href={footer.link.href}>\n {footer.link.label}\n </HyperLink>\n </FooterLink>\n }\n </FooterContainer>\n }\n {\n action &&\n <ActionContainer>\n <Button variant={'secondary'}\n size={isSmallScreen ? Size.Medium : Size.Small}\n disabled={action.disabled}\n icon={action.icon}\n onClick={action.action}>\n {action.label}\n </Button>\n </ActionContainer>\n }\n </Wrapper>\n )\n};\n\nexport default MobileMenuContent;\n"],"file":"MobileMenuContent.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenuContent.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","ParagraphSStyling","ParagraphTextStyle","ParagraphXSStyling","scrollBarStyling","Size","HyperLink","useMediaQuery","Button","useNavigationHelper","MenuItem","SystemIcons","useDimensionsRef","HeaderText","div","Bold","neutral_600","SMALL","HeaderNote","Regular","HeaderContainer","neutral_200","ScrollableContainer","Small","MenuItemsContainer","MenuSectionContainer","MenuSectionHeader","neutral_20","neutral_500","MenuSectionList","PinnedContainer","FooterText","FooterNote","FooterLink","FooterContainer","ActionContainer","Wrapper","MobileMenuContent","header","items","footer","action","onSubMenuOpen","isSmallScreen","query","replace","navigate","isActiveRoute","useState","scrollable","setScrollable","updateOnResize","scrollContainerRef","dimensions","node","useEffect","clientHeight","scrollHeight","renderItem","item","index","type","label","map","Medium","value","disabled","icon","displayLabel","noteLabel","note","e","nativeEvent","stopImmediatePropagation","external","to","exact","filter","a","pinned","some","link","id","target","onClick","href"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {\n MenuButton,\n MenuGroupFooter,\n MenuGroupHeader,\n MenuNavigationItemTypeGroup,\n MenuNavigationItemTypeItem,\n MenuNavigationItemTypeSection\n} from '../types';\nimport styled from 'styled-components';\nimport {\n BREAKPOINTS,\n COLORS,\n ComponentMStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n ParagraphSStyling,\n ParagraphTextStyle,\n ParagraphXSStyling,\n scrollBarStyling\n} from '../../styles';\nimport {Size} from '../../types';\nimport {HyperLink} from '../../HyperLink';\nimport {useMediaQuery} from 'react-responsive';\nimport {Button} from '../../Button';\nimport {useNavigationHelper} from '../NavigationHelper';\nimport {MenuItem} from '../../MenuItem';\nimport {SystemIcons} from '../../icons';\nimport {useDimensionsRef} from 'rooks';\n\n\nconst HeaderText = styled.div`\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n ${BREAKPOINTS.SMALL} {\n ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n }\n`;\nconst HeaderNote = styled.div`\n word-break: break-all;\n ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nconst HeaderContainer = styled.div`\n margin: 0 24px;\n padding-bottom: 8px;\n box-sizing: border-box;\n border-bottom: 1px solid ${COLORS.neutral_200};\n display: flex;\n flex-direction: column;\n`;\n\n\nconst ScrollableContainer = styled.div`\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n max-height: 100%;\n\n &.scrollable {\n margin-right: 6px;\n padding-right: 10px;\n }\n\n ${scrollBarStyling(Size.Small)}\n`;\n\nconst MenuItemsContainer = styled.div`\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n padding: 8px;\n`;\n\nconst MenuSectionContainer = styled.div`\n padding-bottom: 8px;\n display: flex;\n flex-direction: column;\n width: 100%;\n\n &.divider {\n border-top: 1px solid ${COLORS.neutral_200};\n }\n`;\n\nconst MenuSectionHeader = styled.div`\n display: flex;\n align-items: center;\n padding: 8px 16px 4px 16px;\n box-sizing: border-box;\n min-height: 32px;\n background-color: ${COLORS.neutral_20};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\n\nconst PinnedContainer = styled.div`\n border-top: 1px solid ${COLORS.neutral_200};\n`;\n\nconst FooterText = styled.div`\n ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n ${BREAKPOINTS.SMALL} {\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n }\n`;\nconst FooterNote = styled.div`\n ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n ${BREAKPOINTS.SMALL} {\n ${ParagraphSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n }\n`;\nconst FooterLink = styled.div`\n a {\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n ${BREAKPOINTS.SMALL} {\n ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n }\n }\n`;\n\nconst FooterContainer = styled.div`\n padding: 8px 16px;\n box-sizing: border-box;\n border-top: 1px solid ${COLORS.neutral_200};\n display: flex;\n flex-direction: column;\n background: ${COLORS.neutral_20};\n\n ${BREAKPOINTS.SMALL} {\n padding: 16px;\n }\n`;\n\nconst ActionContainer = styled.div`\n padding: 8px 16px;\n box-sizing: border-box;\n border-top: 1px solid ${COLORS.neutral_200};\n display: flex;\n flex-direction: column;\n\n ${BREAKPOINTS.SMALL} {\n padding: 16px;\n }\n`;\n\nconst Wrapper = styled.div`\n width: 100%;\n box-sizing: border-box;\n flex-flow: column;\n display: flex;\n flex: 1;\n overflow: hidden;\n`;\n\ninterface MobileMenuContentProps {\n header?: MenuGroupHeader;\n items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\n footer?: MenuGroupFooter;\n action?: MenuButton;\n\n onSubMenuOpen?: (item: MenuNavigationItemTypeGroup) => void;\n}\n\nconst MobileMenuContent: React.FunctionComponent<MobileMenuContentProps> = ({\n header,\n items,\n footer,\n action,\n onSubMenuOpen\n }) => {\n\n const isSmallScreen = useMediaQuery({query: BREAKPOINTS.SMALL.replace('@media ', '')});\n\n const {navigate, isActiveRoute} = useNavigationHelper();\n\n const [scrollable, setScrollable] = React.useState(false);\n\n const [scrollContainerRef, dimensions, node] = useDimensionsRef({updateOnResize: true});\n\n React.useEffect(() => {\n const clientHeight = node?.clientHeight ?? 0;\n const scrollHeight = node?.scrollHeight ?? 0;\n setScrollable(scrollHeight > clientHeight);\n }, [header, dimensions, node, footer, action, items]);\n\n const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection, index: number) => {\n switch (item.type) {\n case 'section':\n return (\n <MenuSectionContainer key={index}>\n {item.label && <MenuSectionHeader>{item.label}</MenuSectionHeader>}\n <MenuSectionList>\n {item.items.map((item, index) => renderItem(item, index))}\n </MenuSectionList>\n </MenuSectionContainer>\n );\n case 'group':\n return <MenuItem key={index}\n id={'menu-item-' + index}\n size={isSmallScreen ? Size.Medium : Size.Small}\n active={false}\n item={{\n value: item.label,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n noteLabel: item.note,\n }}\n iconRight={<SystemIcons.ArrowDropRight/>}\n onClickHandler={(e) => {\n e.nativeEvent.stopImmediatePropagation();\n onSubMenuOpen && onSubMenuOpen(item);\n }}/>\n case 'item':\n default:\n return (\n <MenuItem key={index}\n id={'menu-item-' + index}\n active={!item.external && isActiveRoute(item.to, !!item.exact)}\n size={isSmallScreen ? Size.Medium : Size.Small}\n item={{\n value: item.to,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n noteLabel: item.note,\n }}\n onClickHandler={() => {\n item.action && item.action();\n navigate(item.to, !!item.external);\n }}/>\n );\n }\n }\n\n return (\n <Wrapper>\n <ScrollableContainer ref={scrollContainerRef as any} className={scrollable ? 'scrollable' : ''}>\n {\n !!header &&\n <HeaderContainer>\n <HeaderText>{header.header}</HeaderText>\n {header.note && <HeaderNote>{header.note}</HeaderNote>}\n </HeaderContainer>\n }\n <MenuItemsContainer>\n {items?.filter(a => !a.pinned).map((item, index) => renderItem(item, index))}\n </MenuItemsContainer>\n </ScrollableContainer>\n {\n items?.some(a => a.pinned) &&\n <PinnedContainer>\n <MenuItemsContainer>\n {items?.filter(a => !!a.pinned).map((item, index) => renderItem(item, index))}\n </MenuItemsContainer>\n </PinnedContainer>\n\n }\n {\n footer &&\n <FooterContainer>\n <FooterText>{footer.header}</FooterText>\n {footer.note && <FooterNote>{footer.note}</FooterNote>}\n {footer.link &&\n <FooterLink>\n <HyperLink variant={'default'}\n id={footer.link.id}\n target={footer.link.target}\n onClick={footer.link.onClick}\n href={footer.link.href}>\n {footer.link.label}\n </HyperLink>\n </FooterLink>\n }\n </FooterContainer>\n }\n {\n action &&\n <ActionContainer>\n <Button variant={'secondary'}\n size={isSmallScreen ? Size.Medium : Size.Small}\n disabled={action.disabled}\n icon={action.icon}\n onClick={action.action}>\n {action.label}\n </Button>\n </ActionContainer>\n }\n </Wrapper>\n )\n};\n\nexport default MobileMenuContent;\n"],"file":"MobileMenuContent.js"}
|
|
@@ -31,7 +31,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
31
31
|
|
|
32
32
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
33
33
|
|
|
34
|
-
var Wrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 320px;\n z-index: ", ";\n height: 100%;\n\n display: flex;\n flex-direction:
|
|
34
|
+
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);
|
|
35
35
|
|
|
36
36
|
var MobileSwitcherMenu = function MobileSwitcherMenu(_ref) {
|
|
37
37
|
var label = _ref.label,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Switcher/MobileSwitcherMenu.tsx"],"names":["Wrapper","styled","div","Z_INDEXES","off_canvas","BREAKPOINTS","SMALL","MobileSwitcherMenu","label","header","note","onMenuClose","items"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAGA;;AACA;;;;;;;;;;AAEA,IAAMA,OAAO,GAAGC,0BAAOC,GAAV,
|
|
1
|
+
{"version":3,"sources":["../../src/Switcher/MobileSwitcherMenu.tsx"],"names":["Wrapper","styled","div","Z_INDEXES","off_canvas","BREAKPOINTS","SMALL","MobileSwitcherMenu","label","header","note","onMenuClose","items"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAGA;;AACA;;;;;;;;;;AAEA,IAAMA,OAAO,GAAGC,0BAAOC,GAAV,qQAEAC,kBAAUC,UAFV,EAUTC,oBAAYC,KAVH,CAAb;;AAwBA,IAAMC,kBAAkB,GAAG,SAArBA,kBAAqB,OAAsD;AAAA,MAApDC,KAAoD,QAApDA,KAAoD;AAAA,MAA7CC,MAA6C,QAA7CA,MAA6C;AAAA,MAArCC,IAAqC,QAArCA,IAAqC;AAAA,MAA/BC,WAA+B,QAA/BA,WAA+B;AAAA,MAAlBC,KAAkB,QAAlBA,KAAkB;AAC/E,sBACE,sBAAC,OAAD;AAAS,IAAA,IAAI,EAAC,MAAd;AAAqB,uBAAgB,gBAArC;AAAA,4BACE,qBAAC,yBAAD;AAAkB,MAAA,QAAQ,EAAED,WAA5B;AACkB,MAAA,KAAK,EAAEH,KADzB;AAEkB,MAAA,OAAO,EAAEG;AAF3B,MADF,eAIE,qBAAC,0BAAD;AAAmB,MAAA,MAAM,EAAE;AAACF,QAAAA,MAAM,EAANA,MAAD;AAASC,QAAAA,IAAI,EAAJA;AAAT,OAA3B;AACmB,MAAA,KAAK,EAAEE;AAD1B,MAJF;AAAA,IADF;AASD,CAVD;;;AAPEJ,EAAAA,K;AACAC,EAAAA,M;AACAC,EAAAA,I;AACAC,EAAAA,W;AACAC,EAAAA,K;;eAeaL,kB","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {BREAKPOINTS} from '../styles';\nimport {Z_INDEXES} from '../styles';\nimport {MenuNavigationItemTypeItem} from '../GlobalNavigationBar';\nimport MobileMenuHeader from '../GlobalNavigationBar/mobile/MobileMenuHeader';\nimport MobileMenuContent from '../GlobalNavigationBar/mobile/MobileMenuContent';\n\nconst Wrapper = styled.div`\n width: 320px;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n box-sizing: border-box;\n\n display: flex;\n flex-direction: column;\n gap: 8px;\n\n ${BREAKPOINTS.SMALL} {\n width: 400px;\n }\n`;\n\n\ninterface Props {\n label: string;\n header: string;\n note?: string;\n onMenuClose: () => void;\n items?: MenuNavigationItemTypeItem[];\n}\n\nconst MobileSwitcherMenu = ({label, header, note, onMenuClose, items}: Props) => {\n return (\n <Wrapper role=\"menu\" aria-labelledby=\"UserMenuButton\">\n <MobileMenuHeader onGoBack={onMenuClose}\n label={label}\n onClose={onMenuClose}/>\n <MobileMenuContent header={{header, note}}\n items={items}/>\n </Wrapper>\n );\n};\n\nexport default MobileSwitcherMenu;\n"],"file":"MobileSwitcherMenu.cjs"}
|
|
@@ -11,7 +11,7 @@ import MobileMenuHeader from '../GlobalNavigationBar/mobile/MobileMenuHeader';
|
|
|
11
11
|
import MobileMenuContent from '../GlobalNavigationBar/mobile/MobileMenuContent';
|
|
12
12
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
13
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
|
-
var Wrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n width: 320px;\n z-index: ", ";\n height: 100%;\n\n display: flex;\n flex-direction:
|
|
14
|
+
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);
|
|
15
15
|
|
|
16
16
|
var MobileSwitcherMenu = function MobileSwitcherMenu(_ref) {
|
|
17
17
|
var label = _ref.label,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Switcher/MobileSwitcherMenu.tsx"],"names":["React","styled","BREAKPOINTS","Z_INDEXES","MobileMenuHeader","MobileMenuContent","Wrapper","div","off_canvas","SMALL","MobileSwitcherMenu","label","header","note","onMenuClose","items"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,WAAR,QAA0B,WAA1B;AACA,SAAQC,SAAR,QAAwB,WAAxB;AAEA,OAAOC,gBAAP,MAA6B,gDAA7B;AACA,OAAOC,iBAAP,MAA8B,iDAA9B;;;AAEA,IAAMC,OAAO,GAAGL,MAAM,CAACM,GAAV,
|
|
1
|
+
{"version":3,"sources":["../../src/Switcher/MobileSwitcherMenu.tsx"],"names":["React","styled","BREAKPOINTS","Z_INDEXES","MobileMenuHeader","MobileMenuContent","Wrapper","div","off_canvas","SMALL","MobileSwitcherMenu","label","header","note","onMenuClose","items"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,WAAR,QAA0B,WAA1B;AACA,SAAQC,SAAR,QAAwB,WAAxB;AAEA,OAAOC,gBAAP,MAA6B,gDAA7B;AACA,OAAOC,iBAAP,MAA8B,iDAA9B;;;AAEA,IAAMC,OAAO,GAAGL,MAAM,CAACM,GAAV,uPAEAJ,SAAS,CAACK,UAFV,EAUTN,WAAW,CAACO,KAVH,CAAb;;AAwBA,IAAMC,kBAAkB,GAAG,SAArBA,kBAAqB,OAAsD;AAAA,MAApDC,KAAoD,QAApDA,KAAoD;AAAA,MAA7CC,MAA6C,QAA7CA,MAA6C;AAAA,MAArCC,IAAqC,QAArCA,IAAqC;AAAA,MAA/BC,WAA+B,QAA/BA,WAA+B;AAAA,MAAlBC,KAAkB,QAAlBA,KAAkB;AAC/E,sBACE,MAAC,OAAD;AAAS,IAAA,IAAI,EAAC,MAAd;AAAqB,uBAAgB,gBAArC;AAAA,4BACE,KAAC,gBAAD;AAAkB,MAAA,QAAQ,EAAED,WAA5B;AACkB,MAAA,KAAK,EAAEH,KADzB;AAEkB,MAAA,OAAO,EAAEG;AAF3B,MADF,eAIE,KAAC,iBAAD;AAAmB,MAAA,MAAM,EAAE;AAACF,QAAAA,MAAM,EAANA,MAAD;AAASC,QAAAA,IAAI,EAAJA;AAAT,OAA3B;AACmB,MAAA,KAAK,EAAEE;AAD1B,MAJF;AAAA,IADF;AASD,CAVD;;;AAPEJ,EAAAA,K;AACAC,EAAAA,M;AACAC,EAAAA,I;AACAC,EAAAA,W;AACAC,EAAAA,K;;AAeF,eAAeL,kBAAf","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {BREAKPOINTS} from '../styles';\nimport {Z_INDEXES} from '../styles';\nimport {MenuNavigationItemTypeItem} from '../GlobalNavigationBar';\nimport MobileMenuHeader from '../GlobalNavigationBar/mobile/MobileMenuHeader';\nimport MobileMenuContent from '../GlobalNavigationBar/mobile/MobileMenuContent';\n\nconst Wrapper = styled.div`\n width: 320px;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n box-sizing: border-box;\n\n display: flex;\n flex-direction: column;\n gap: 8px;\n\n ${BREAKPOINTS.SMALL} {\n width: 400px;\n }\n`;\n\n\ninterface Props {\n label: string;\n header: string;\n note?: string;\n onMenuClose: () => void;\n items?: MenuNavigationItemTypeItem[];\n}\n\nconst MobileSwitcherMenu = ({label, header, note, onMenuClose, items}: Props) => {\n return (\n <Wrapper role=\"menu\" aria-labelledby=\"UserMenuButton\">\n <MobileMenuHeader onGoBack={onMenuClose}\n label={label}\n onClose={onMenuClose}/>\n <MobileMenuContent header={{header, note}}\n items={items}/>\n </Wrapper>\n );\n};\n\nexport default MobileSwitcherMenu;\n"],"file":"MobileSwitcherMenu.js"}
|
|
@@ -2,8 +2,6 @@
|
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
4
|
|
|
5
|
-
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
-
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
8
6
|
value: true
|
|
9
7
|
});
|
|
@@ -11,25 +9,19 @@ exports.default = void 0;
|
|
|
11
9
|
|
|
12
10
|
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
13
11
|
|
|
14
|
-
var
|
|
12
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
|
+
|
|
14
|
+
var _react = _interopRequireDefault(require("react"));
|
|
15
15
|
|
|
16
16
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
17
17
|
|
|
18
18
|
var _styles = require("../styles");
|
|
19
19
|
|
|
20
|
-
var _typography = require("../styles/typography");
|
|
21
|
-
|
|
22
|
-
var _zIndexes = require("../styles/z-indexes");
|
|
23
|
-
|
|
24
20
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
25
21
|
|
|
26
22
|
var _templateObject, _templateObject2;
|
|
27
23
|
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
31
|
-
|
|
32
|
-
var StyledSwitcherItem = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n padding: 16px 25px;\n margin: 0 2px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n ", "\n\n text-decoration: none;\n\n svg {\n margin-right: 16px;\n }\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n left: 4px;\n top: 4px;\n bottom: 4px;\n width: 4px;\n background-color: transparent;\n border-radius: 2px;\n }\n\n &.active:not(.disabled) {\n z-index: ", ";\n font-weight: bold;\n color: ", ";\n\n &:after {\n background-color: ", ";\n }\n\n svg path {\n fill: ", ";\n }\n }\n\n &.disabled {\n color: ", ";\n background-color: ", ";\n }\n\n &:hover:not(.disabled) {\n z-index: ", ";\n color: ", ";\n background-color: ", ";\n\n svg path {\n fill: ", ";\n }\n }\n\n &:active:not(.disabled) {\n z-index: ", ";\n color: ", ";\n background-color: ", ";\n\n &:after {\n background-color: ", ";\n }\n\n svg path {\n fill: ", ";\n }\n }\n\n &:focus:not(.disabled) {\n ", "\n }\n"])), (0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600), _zIndexes.Z_INDEXES.active, _styles.COLORS.neutral_800, _styles.COLORS.primary_500, _styles.COLORS.neutral_800, _styles.COLORS.neutral_300, _styles.COLORS.neutral_100, _zIndexes.Z_INDEXES.hover, _styles.COLORS.primary_600, _styles.COLORS.primary_20, _styles.COLORS.primary_600, _zIndexes.Z_INDEXES.active, _styles.COLORS.primary_800, _styles.COLORS.primary_100, _styles.COLORS.primary_500, _styles.COLORS.primary_800, _styles.focusStyles);
|
|
24
|
+
var StyledSwitcherItem = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n padding: 16px 25px;\n margin: 0 2px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n ", "\n\n text-decoration: none;\n\n svg {\n margin-right: 16px;\n }\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n left: 4px;\n top: 4px;\n bottom: 4px;\n width: 4px;\n background-color: transparent;\n border-radius: 2px;\n }\n\n &.active:not(.disabled) {\n z-index: ", ";\n font-weight: bold;\n color: ", ";\n\n &:after {\n background-color: ", ";\n }\n\n svg path {\n fill: ", ";\n }\n }\n\n &.disabled {\n color: ", ";\n background-color: ", ";\n }\n\n &:hover:not(.disabled) {\n z-index: ", ";\n color: ", ";\n background-color: ", ";\n\n svg path {\n fill: ", ";\n }\n }\n\n &:active:not(.disabled) {\n z-index: ", ";\n color: ", ";\n background-color: ", ";\n\n &:after {\n background-color: ", ";\n }\n\n svg path {\n fill: ", ";\n }\n }\n\n &:focus:not(.disabled) {\n outline-offset: -2px;\n ", "\n }\n"])), (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600), _styles.Z_INDEXES.active, _styles.COLORS.neutral_800, _styles.COLORS.primary_500, _styles.COLORS.neutral_800, _styles.COLORS.neutral_300, _styles.COLORS.neutral_100, _styles.Z_INDEXES.hover, _styles.COLORS.primary_600, _styles.COLORS.primary_20, _styles.COLORS.primary_600, _styles.Z_INDEXES.active, _styles.COLORS.primary_800, _styles.COLORS.primary_100, _styles.COLORS.primary_500, _styles.COLORS.primary_800, _styles.focusStyles);
|
|
33
25
|
|
|
34
26
|
var A = _styledComponents.default.a(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)([""])));
|
|
35
27
|
|
|
@@ -37,7 +29,7 @@ var SwitcherMenuItem = function SwitcherMenuItem(_ref) {
|
|
|
37
29
|
var label = _ref.label,
|
|
38
30
|
url = _ref.url,
|
|
39
31
|
disabled = _ref.disabled,
|
|
40
|
-
|
|
32
|
+
icon = _ref.icon,
|
|
41
33
|
_ref$as = _ref.as,
|
|
42
34
|
as = _ref$as === void 0 ? A : _ref$as,
|
|
43
35
|
testId = _ref.testId;
|
|
@@ -50,13 +42,21 @@ var SwitcherMenuItem = function SwitcherMenuItem(_ref) {
|
|
|
50
42
|
target: "_parent",
|
|
51
43
|
className: disabled ? 'disabled' : '',
|
|
52
44
|
"data-testid": testId,
|
|
53
|
-
children: [
|
|
54
|
-
size:
|
|
55
|
-
color:
|
|
45
|
+
children: [!!icon && /*#__PURE__*/_react.default.cloneElement(icon, {
|
|
46
|
+
size: '24px',
|
|
47
|
+
color: '#666666'
|
|
56
48
|
}), label]
|
|
57
49
|
}, label);
|
|
58
50
|
};
|
|
59
51
|
|
|
52
|
+
SwitcherMenuItem.propTypes = {
|
|
53
|
+
label: _propTypes.default.string.isRequired,
|
|
54
|
+
url: _propTypes.default.string.isRequired,
|
|
55
|
+
disabled: _propTypes.default.bool,
|
|
56
|
+
icon: _propTypes.default.any,
|
|
57
|
+
as: _propTypes.default.any,
|
|
58
|
+
testId: _propTypes.default.string
|
|
59
|
+
};
|
|
60
60
|
var _default = SwitcherMenuItem;
|
|
61
61
|
exports.default = _default;
|
|
62
62
|
//# sourceMappingURL=SwitcherMenuItem.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Switcher/SwitcherMenuItem.tsx"],"names":["StyledSwitcherItem","styled","div","ComponentTextStyle","Regular","COLORS","neutral_600","Z_INDEXES","active","neutral_800","primary_500","neutral_300","neutral_100","hover","primary_600","primary_20","primary_800","primary_100","focusStyles","A","a","SwitcherMenuItem","label","url","disabled","
|
|
1
|
+
{"version":3,"sources":["../../src/Switcher/SwitcherMenuItem.tsx"],"names":["StyledSwitcherItem","styled","div","ComponentTextStyle","Regular","COLORS","neutral_600","Z_INDEXES","active","neutral_800","primary_500","neutral_300","neutral_100","hover","primary_600","primary_20","primary_800","primary_100","focusStyles","A","a","SwitcherMenuItem","label","url","disabled","icon","as","testId","window","location","href","React","cloneElement","size","color"],"mappings":";;;;;;;;;;;;;AAAA;;AACA;;AACA;;;;;;AAEA,IAAMA,kBAAkB,GAAGC,0BAAOC,GAAV,0qCASpB,+BAAkBC,2BAAmBC,OAArC,EAA8CC,eAAOC,WAArD,CAToB,EA8BTC,kBAAUC,MA9BD,EAgCXH,eAAOI,WAhCI,EAmCEJ,eAAOK,WAnCT,EAuCVL,eAAOI,WAvCG,EA4CXJ,eAAOM,WA5CI,EA6CAN,eAAOO,WA7CP,EAiDTL,kBAAUM,KAjDD,EAkDXR,eAAOS,WAlDI,EAmDAT,eAAOU,UAnDP,EAsDVV,eAAOS,WAtDG,EA2DTP,kBAAUC,MA3DD,EA4DXH,eAAOW,WA5DI,EA6DAX,eAAOY,WA7DP,EAgEEZ,eAAOK,WAhET,EAoEVL,eAAOW,WApEG,EA0ElBE,mBA1EkB,CAAxB;;AA8EA,IAAMC,CAAC,GAAGlB,0BAAOmB,CAAV,qFAAP;;AAWA,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB;AAAA,MAAEC,KAAF,QAAEA,KAAF;AAAA,MAASC,GAAT,QAASA,GAAT;AAAA,MAAcC,QAAd,QAAcA,QAAd;AAAA,MAAwBC,IAAxB,QAAwBA,IAAxB;AAAA,qBAA8BC,EAA9B;AAAA,MAA8BA,EAA9B,wBAAmCP,CAAnC;AAAA,MAAsCQ,MAAtC,QAAsCA,MAAtC;AAAA,sBACvB,sBAAC,kBAAD;AACE,IAAA,OAAO,EAAE;AAAA,aAAOC,MAAM,CAACC,QAAP,CAAgBC,IAAhB,GAAuBP,GAAG,IAAI,EAArC;AAAA,KADX;AAEE,IAAA,EAAE,EAAEG,EAFN;AAGE,IAAA,IAAI,EAAEH,GAAG,IAAI,EAHf;AAIE,IAAA,MAAM,EAAC,SAJT;AAME,IAAA,SAAS,EAAEC,QAAQ,GAAG,UAAH,GAAgB,EANrC;AAOE,mBAAaG,MAPf;AAAA,eAQG,CAAC,CAACF,IAAF,iBAAUM,eAAMC,YAAN,CAAmBP,IAAnB,EAAyB;AAACQ,MAAAA,IAAI,EAAE,MAAP;AAAeC,MAAAA,KAAK,EAAE;AAAtB,KAAzB,CARb,EASGZ,KATH;AAAA,KAKOA,KALP,CADuB;AAAA,CAAzB;;;AAREA,EAAAA,K;AACAC,EAAAA,G;AACAC,EAAAA,Q;AACAC,EAAAA,I;AACAC,EAAAA,E;AACAC,EAAAA,M;;eAiBaN,gB","sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport {Z_INDEXES, ComponentMStyling, COLORS, ComponentTextStyle, focusStyles} from '../styles';\n\nconst StyledSwitcherItem = styled.div`\n padding: 16px 25px;\n margin: 0 2px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n text-decoration: none;\n\n svg {\n margin-right: 16px;\n }\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n left: 4px;\n top: 4px;\n bottom: 4px;\n width: 4px;\n background-color: transparent;\n border-radius: 2px;\n }\n\n &.active:not(.disabled) {\n z-index: ${Z_INDEXES.active};\n font-weight: bold;\n color: ${COLORS.neutral_800};\n\n &:after {\n background-color: ${COLORS.primary_500};\n }\n\n svg path {\n fill: ${COLORS.neutral_800};\n }\n }\n\n &.disabled {\n color: ${COLORS.neutral_300};\n background-color: ${COLORS.neutral_100};\n }\n\n &:hover:not(.disabled) {\n z-index: ${Z_INDEXES.hover};\n color: ${COLORS.primary_600};\n background-color: ${COLORS.primary_20};\n\n svg path {\n fill: ${COLORS.primary_600};\n }\n }\n\n &:active:not(.disabled) {\n z-index: ${Z_INDEXES.active};\n color: ${COLORS.primary_800};\n background-color: ${COLORS.primary_100};\n\n &:after {\n background-color: ${COLORS.primary_500};\n }\n\n svg path {\n fill: ${COLORS.primary_800};\n }\n }\n\n &:focus:not(.disabled) {\n outline-offset: -2px;\n ${focusStyles}\n }\n`;\n\nconst A = styled.a``;\n\nexport interface SwitcherNavItem {\n label: string;\n url: string;\n disabled?: boolean;\n icon?: any;\n as?: any;\n testId?: string;\n}\n\nconst SwitcherMenuItem = ({label, url, disabled, icon, as = A, testId}: SwitcherNavItem) => (\n <StyledSwitcherItem\n onClick={() => (window.location.href = url || '')}\n as={as}\n href={url || ''}\n target=\"_parent\"\n key={label}\n className={disabled ? 'disabled' : ''}\n data-testid={testId}>\n {!!icon && React.cloneElement(icon, {size: '24px', color: '#666666'})}\n {label}\n </StyledSwitcherItem>\n);\n\nexport default SwitcherMenuItem;\n"],"file":"SwitcherMenuItem.cjs"}
|
|
@@ -1,3 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
export interface SwitcherNavItem {
|
|
2
|
+
label: string;
|
|
3
|
+
url: string;
|
|
4
|
+
disabled?: boolean;
|
|
5
|
+
icon?: any;
|
|
6
|
+
as?: any;
|
|
7
|
+
testId?: string;
|
|
8
|
+
}
|
|
9
|
+
declare const SwitcherMenuItem: ({ label, url, disabled, icon, as, testId }: SwitcherNavItem) => JSX.Element;
|
|
3
10
|
export default SwitcherMenuItem;
|
|
@@ -1,22 +1,20 @@
|
|
|
1
1
|
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
2
|
+
import _pt from "prop-types";
|
|
2
3
|
|
|
3
4
|
var _templateObject, _templateObject2;
|
|
4
5
|
|
|
5
|
-
import
|
|
6
|
+
import React from 'react';
|
|
6
7
|
import styled from 'styled-components';
|
|
7
|
-
import { COLORS, ComponentTextStyle, focusStyles } from '../styles';
|
|
8
|
-
import { ComponentMStyling } from '../styles/typography';
|
|
9
|
-
import { Z_INDEXES } from '../styles/z-indexes';
|
|
10
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
+
import { Z_INDEXES, ComponentMStyling, COLORS, ComponentTextStyle, focusStyles } from '../styles';
|
|
11
9
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
12
|
-
var StyledSwitcherItem = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n padding: 16px 25px;\n margin: 0 2px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n ", "\n\n text-decoration: none;\n\n svg {\n margin-right: 16px;\n }\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n left: 4px;\n top: 4px;\n bottom: 4px;\n width: 4px;\n background-color: transparent;\n border-radius: 2px;\n }\n\n &.active:not(.disabled) {\n z-index: ", ";\n font-weight: bold;\n color: ", ";\n\n &:after {\n background-color: ", ";\n }\n\n svg path {\n fill: ", ";\n }\n }\n\n &.disabled {\n color: ", ";\n background-color: ", ";\n }\n\n &:hover:not(.disabled) {\n z-index: ", ";\n color: ", ";\n background-color: ", ";\n\n svg path {\n fill: ", ";\n }\n }\n\n &:active:not(.disabled) {\n z-index: ", ";\n color: ", ";\n background-color: ", ";\n\n &:after {\n background-color: ", ";\n }\n\n svg path {\n fill: ", ";\n }\n }\n\n &:focus:not(.disabled) {\n ", "\n }\n"])), ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600), Z_INDEXES.active, COLORS.neutral_800, COLORS.primary_500, COLORS.neutral_800, COLORS.neutral_300, COLORS.neutral_100, Z_INDEXES.hover, COLORS.primary_600, COLORS.primary_20, COLORS.primary_600, Z_INDEXES.active, COLORS.primary_800, COLORS.primary_100, COLORS.primary_500, COLORS.primary_800, focusStyles);
|
|
10
|
+
var StyledSwitcherItem = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n padding: 16px 25px;\n margin: 0 2px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n ", "\n\n text-decoration: none;\n\n svg {\n margin-right: 16px;\n }\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n left: 4px;\n top: 4px;\n bottom: 4px;\n width: 4px;\n background-color: transparent;\n border-radius: 2px;\n }\n\n &.active:not(.disabled) {\n z-index: ", ";\n font-weight: bold;\n color: ", ";\n\n &:after {\n background-color: ", ";\n }\n\n svg path {\n fill: ", ";\n }\n }\n\n &.disabled {\n color: ", ";\n background-color: ", ";\n }\n\n &:hover:not(.disabled) {\n z-index: ", ";\n color: ", ";\n background-color: ", ";\n\n svg path {\n fill: ", ";\n }\n }\n\n &:active:not(.disabled) {\n z-index: ", ";\n color: ", ";\n background-color: ", ";\n\n &:after {\n background-color: ", ";\n }\n\n svg path {\n fill: ", ";\n }\n }\n\n &:focus:not(.disabled) {\n outline-offset: -2px;\n ", "\n }\n"])), ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600), Z_INDEXES.active, COLORS.neutral_800, COLORS.primary_500, COLORS.neutral_800, COLORS.neutral_300, COLORS.neutral_100, Z_INDEXES.hover, COLORS.primary_600, COLORS.primary_20, COLORS.primary_600, Z_INDEXES.active, COLORS.primary_800, COLORS.primary_100, COLORS.primary_500, COLORS.primary_800, focusStyles);
|
|
13
11
|
var A = styled.a(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral([""])));
|
|
14
12
|
|
|
15
13
|
var SwitcherMenuItem = function SwitcherMenuItem(_ref) {
|
|
16
14
|
var label = _ref.label,
|
|
17
15
|
url = _ref.url,
|
|
18
16
|
disabled = _ref.disabled,
|
|
19
|
-
|
|
17
|
+
icon = _ref.icon,
|
|
20
18
|
_ref$as = _ref.as,
|
|
21
19
|
as = _ref$as === void 0 ? A : _ref$as,
|
|
22
20
|
testId = _ref.testId;
|
|
@@ -29,12 +27,20 @@ var SwitcherMenuItem = function SwitcherMenuItem(_ref) {
|
|
|
29
27
|
target: "_parent",
|
|
30
28
|
className: disabled ? 'disabled' : '',
|
|
31
29
|
"data-testid": testId,
|
|
32
|
-
children: [
|
|
33
|
-
size:
|
|
34
|
-
color:
|
|
30
|
+
children: [!!icon && /*#__PURE__*/React.cloneElement(icon, {
|
|
31
|
+
size: '24px',
|
|
32
|
+
color: '#666666'
|
|
35
33
|
}), label]
|
|
36
34
|
}, label);
|
|
37
35
|
};
|
|
38
36
|
|
|
37
|
+
SwitcherMenuItem.propTypes = {
|
|
38
|
+
label: _pt.string.isRequired,
|
|
39
|
+
url: _pt.string.isRequired,
|
|
40
|
+
disabled: _pt.bool,
|
|
41
|
+
icon: _pt.any,
|
|
42
|
+
as: _pt.any,
|
|
43
|
+
testId: _pt.string
|
|
44
|
+
};
|
|
39
45
|
export default SwitcherMenuItem;
|
|
40
46
|
//# sourceMappingURL=SwitcherMenuItem.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Switcher/SwitcherMenuItem.tsx"],"names":["React","styled","
|
|
1
|
+
{"version":3,"sources":["../../src/Switcher/SwitcherMenuItem.tsx"],"names":["React","styled","Z_INDEXES","ComponentMStyling","COLORS","ComponentTextStyle","focusStyles","StyledSwitcherItem","div","Regular","neutral_600","active","neutral_800","primary_500","neutral_300","neutral_100","hover","primary_600","primary_20","primary_800","primary_100","A","a","SwitcherMenuItem","label","url","disabled","icon","as","testId","window","location","href","cloneElement","size","color"],"mappings":";;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,SAAR,EAAmBC,iBAAnB,EAAsCC,MAAtC,EAA8CC,kBAA9C,EAAkEC,WAAlE,QAAoF,WAApF;;AAEA,IAAMC,kBAAkB,GAAGN,MAAM,CAACO,GAAV,4pCASpBL,iBAAiB,CAACE,kBAAkB,CAACI,OAApB,EAA6BL,MAAM,CAACM,WAApC,CATG,EA8BTR,SAAS,CAACS,MA9BD,EAgCXP,MAAM,CAACQ,WAhCI,EAmCER,MAAM,CAACS,WAnCT,EAuCVT,MAAM,CAACQ,WAvCG,EA4CXR,MAAM,CAACU,WA5CI,EA6CAV,MAAM,CAACW,WA7CP,EAiDTb,SAAS,CAACc,KAjDD,EAkDXZ,MAAM,CAACa,WAlDI,EAmDAb,MAAM,CAACc,UAnDP,EAsDVd,MAAM,CAACa,WAtDG,EA2DTf,SAAS,CAACS,MA3DD,EA4DXP,MAAM,CAACe,WA5DI,EA6DAf,MAAM,CAACgB,WA7DP,EAgEEhB,MAAM,CAACS,WAhET,EAoEVT,MAAM,CAACe,WApEG,EA0ElBb,WA1EkB,CAAxB;AA8EA,IAAMe,CAAC,GAAGpB,MAAM,CAACqB,CAAV,uEAAP;;AAWA,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB;AAAA,MAAEC,KAAF,QAAEA,KAAF;AAAA,MAASC,GAAT,QAASA,GAAT;AAAA,MAAcC,QAAd,QAAcA,QAAd;AAAA,MAAwBC,IAAxB,QAAwBA,IAAxB;AAAA,qBAA8BC,EAA9B;AAAA,MAA8BA,EAA9B,wBAAmCP,CAAnC;AAAA,MAAsCQ,MAAtC,QAAsCA,MAAtC;AAAA,sBACvB,MAAC,kBAAD;AACE,IAAA,OAAO,EAAE;AAAA,aAAOC,MAAM,CAACC,QAAP,CAAgBC,IAAhB,GAAuBP,GAAG,IAAI,EAArC;AAAA,KADX;AAEE,IAAA,EAAE,EAAEG,EAFN;AAGE,IAAA,IAAI,EAAEH,GAAG,IAAI,EAHf;AAIE,IAAA,MAAM,EAAC,SAJT;AAME,IAAA,SAAS,EAAEC,QAAQ,GAAG,UAAH,GAAgB,EANrC;AAOE,mBAAaG,MAPf;AAAA,eAQG,CAAC,CAACF,IAAF,iBAAU3B,KAAK,CAACiC,YAAN,CAAmBN,IAAnB,EAAyB;AAACO,MAAAA,IAAI,EAAE,MAAP;AAAeC,MAAAA,KAAK,EAAE;AAAtB,KAAzB,CARb,EASGX,KATH;AAAA,KAKOA,KALP,CADuB;AAAA,CAAzB;;;AAREA,EAAAA,K;AACAC,EAAAA,G;AACAC,EAAAA,Q;AACAC,EAAAA,I;AACAC,EAAAA,E;AACAC,EAAAA,M;;AAiBF,eAAeN,gBAAf","sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport {Z_INDEXES, ComponentMStyling, COLORS, ComponentTextStyle, focusStyles} from '../styles';\n\nconst StyledSwitcherItem = styled.div`\n padding: 16px 25px;\n margin: 0 2px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n text-decoration: none;\n\n svg {\n margin-right: 16px;\n }\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n left: 4px;\n top: 4px;\n bottom: 4px;\n width: 4px;\n background-color: transparent;\n border-radius: 2px;\n }\n\n &.active:not(.disabled) {\n z-index: ${Z_INDEXES.active};\n font-weight: bold;\n color: ${COLORS.neutral_800};\n\n &:after {\n background-color: ${COLORS.primary_500};\n }\n\n svg path {\n fill: ${COLORS.neutral_800};\n }\n }\n\n &.disabled {\n color: ${COLORS.neutral_300};\n background-color: ${COLORS.neutral_100};\n }\n\n &:hover:not(.disabled) {\n z-index: ${Z_INDEXES.hover};\n color: ${COLORS.primary_600};\n background-color: ${COLORS.primary_20};\n\n svg path {\n fill: ${COLORS.primary_600};\n }\n }\n\n &:active:not(.disabled) {\n z-index: ${Z_INDEXES.active};\n color: ${COLORS.primary_800};\n background-color: ${COLORS.primary_100};\n\n &:after {\n background-color: ${COLORS.primary_500};\n }\n\n svg path {\n fill: ${COLORS.primary_800};\n }\n }\n\n &:focus:not(.disabled) {\n outline-offset: -2px;\n ${focusStyles}\n }\n`;\n\nconst A = styled.a``;\n\nexport interface SwitcherNavItem {\n label: string;\n url: string;\n disabled?: boolean;\n icon?: any;\n as?: any;\n testId?: string;\n}\n\nconst SwitcherMenuItem = ({label, url, disabled, icon, as = A, testId}: SwitcherNavItem) => (\n <StyledSwitcherItem\n onClick={() => (window.location.href = url || '')}\n as={as}\n href={url || ''}\n target=\"_parent\"\n key={label}\n className={disabled ? 'disabled' : ''}\n data-testid={testId}>\n {!!icon && React.cloneElement(icon, {size: '24px', color: '#666666'})}\n {label}\n </StyledSwitcherItem>\n);\n\nexport default SwitcherMenuItem;\n"],"file":"SwitcherMenuItem.js"}
|
package/dist/types.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/types.ts"],"names":["States","Size","Position","ToastColor","ToastActionType","ToastPosition","ToastEntryDirection"],"mappings":";;;;;;IAOYA,M;;;WAAAA,M;AAAAA,EAAAA,M;AAAAA,EAAAA,M;AAAAA,EAAAA,M;GAAAA,M,sBAAAA,M;;IAMAC,I;;;WAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;GAAAA,I,oBAAAA,I;;IAQAC,Q;;;WAAAA,Q;AAAAA,EAAAA,Q;AAAAA,EAAAA,Q;AAAAA,EAAAA,Q;AAAAA,EAAAA,Q;GAAAA,Q,wBAAAA,Q;;IAOAC,U;;;WAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;GAAAA,U,0BAAAA,U;;IASAC,e;;;WAAAA,e;AAAAA,EAAAA,e,CAAAA,e;AAAAA,EAAAA,e,CAAAA,e;GAAAA,e,+BAAAA,e;;IAKAC,a;;;WAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;GAAAA,a,6BAAAA,a;;IASAC,mB;;;WAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;GAAAA,mB,mCAAAA,mB","sourcesContent":["export interface Product {\n id: string;\n name: string;\n type: string;\n image: string;\n}\n\nexport enum States {\n Default = 'default',\n Valid = 'valid',\n Invalid = 'invalid',\n}\n\nexport enum Size {\n XXSmall = 'xxsmall',\n XSmall = 'xsmall',\n Small = 'small',\n Medium = 'medium',\n Large = 'large',\n}\n\nexport enum Position {\n Top = 'top',\n Bottom = 'bottom',\n Right = 'right',\n Left = 'left'\n}\n\nexport enum ToastColor {\n BLACK,\n WHITE,\n BLUE,\n GREEN,\n ORANGE,\n RED,\n}\n\nexport enum ToastActionType {\n PRIMARY,\n SECONDARY,\n}\n\nexport enum ToastPosition {\n TOPLEFT,\n TOPMIDDLE,\n TOPRIGHT,\n BOTTOMLEFT,\n BOTTOMMIDDLE,\n BOTTOMRIGHT,\n}\n\nexport enum ToastEntryDirection {\n TOP,\n BOTTOM,\n LEFT,\n RIGHT,\n}\n\nexport interface
|
|
1
|
+
{"version":3,"sources":["../src/types.ts"],"names":["States","Size","Position","ToastColor","ToastActionType","ToastPosition","ToastEntryDirection"],"mappings":";;;;;;IAOYA,M;;;WAAAA,M;AAAAA,EAAAA,M;AAAAA,EAAAA,M;AAAAA,EAAAA,M;GAAAA,M,sBAAAA,M;;IAMAC,I;;;WAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;GAAAA,I,oBAAAA,I;;IAQAC,Q;;;WAAAA,Q;AAAAA,EAAAA,Q;AAAAA,EAAAA,Q;AAAAA,EAAAA,Q;AAAAA,EAAAA,Q;GAAAA,Q,wBAAAA,Q;;IAOAC,U;;;WAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;GAAAA,U,0BAAAA,U;;IASAC,e;;;WAAAA,e;AAAAA,EAAAA,e,CAAAA,e;AAAAA,EAAAA,e,CAAAA,e;GAAAA,e,+BAAAA,e;;IAKAC,a;;;WAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;GAAAA,a,6BAAAA,a;;IASAC,mB;;;WAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;GAAAA,mB,mCAAAA,mB","sourcesContent":["export interface Product {\n id: string;\n name: string;\n type: string;\n image: string;\n}\n\nexport enum States {\n Default = 'default',\n Valid = 'valid',\n Invalid = 'invalid',\n}\n\nexport enum Size {\n XXSmall = 'xxsmall',\n XSmall = 'xsmall',\n Small = 'small',\n Medium = 'medium',\n Large = 'large',\n}\n\nexport enum Position {\n Top = 'top',\n Bottom = 'bottom',\n Right = 'right',\n Left = 'left'\n}\n\nexport enum ToastColor {\n BLACK,\n WHITE,\n BLUE,\n GREEN,\n ORANGE,\n RED,\n}\n\nexport enum ToastActionType {\n PRIMARY,\n SECONDARY,\n}\n\nexport enum ToastPosition {\n TOPLEFT,\n TOPMIDDLE,\n TOPRIGHT,\n BOTTOMLEFT,\n BOTTOMMIDDLE,\n BOTTOMRIGHT,\n}\n\nexport enum ToastEntryDirection {\n TOP,\n BOTTOM,\n LEFT,\n RIGHT,\n}\n\nexport interface NavLink {\n label: string;\n to: string;\n target?: string;\n}\n\nexport interface NavSection {\n header: string;\n links: NavLink[];\n}\n\nexport interface NavOptions {\n sections: NavSection[];\n}\n"],"file":"types.cjs"}
|
package/dist/types.d.ts
CHANGED
|
@@ -48,14 +48,6 @@ export declare enum ToastEntryDirection {
|
|
|
48
48
|
LEFT = 2,
|
|
49
49
|
RIGHT = 3
|
|
50
50
|
}
|
|
51
|
-
export interface SwitcherNavItem {
|
|
52
|
-
label: string;
|
|
53
|
-
url: string;
|
|
54
|
-
disabled?: boolean;
|
|
55
|
-
Icon?: any;
|
|
56
|
-
as?: any;
|
|
57
|
-
testId?: string;
|
|
58
|
-
}
|
|
59
51
|
export interface NavLink {
|
|
60
52
|
label: string;
|
|
61
53
|
to: string;
|
package/dist/types.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/types.ts"],"names":["States","Size","Position","ToastColor","ToastActionType","ToastPosition","ToastEntryDirection"],"mappings":"AAOA,WAAYA,MAAZ;;WAAYA,M;AAAAA,EAAAA,M;AAAAA,EAAAA,M;AAAAA,EAAAA,M;GAAAA,M,KAAAA,M;;AAMZ,WAAYC,IAAZ;;WAAYA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;GAAAA,I,KAAAA,I;;AAQZ,WAAYC,QAAZ;;WAAYA,Q;AAAAA,EAAAA,Q;AAAAA,EAAAA,Q;AAAAA,EAAAA,Q;AAAAA,EAAAA,Q;GAAAA,Q,KAAAA,Q;;AAOZ,WAAYC,UAAZ;;WAAYA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;GAAAA,U,KAAAA,U;;AASZ,WAAYC,eAAZ;;WAAYA,e;AAAAA,EAAAA,e,CAAAA,e;AAAAA,EAAAA,e,CAAAA,e;GAAAA,e,KAAAA,e;;AAKZ,WAAYC,aAAZ;;WAAYA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;GAAAA,a,KAAAA,a;;AASZ,WAAYC,mBAAZ;;WAAYA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;GAAAA,mB,KAAAA,mB","sourcesContent":["export interface Product {\n id: string;\n name: string;\n type: string;\n image: string;\n}\n\nexport enum States {\n Default = 'default',\n Valid = 'valid',\n Invalid = 'invalid',\n}\n\nexport enum Size {\n XXSmall = 'xxsmall',\n XSmall = 'xsmall',\n Small = 'small',\n Medium = 'medium',\n Large = 'large',\n}\n\nexport enum Position {\n Top = 'top',\n Bottom = 'bottom',\n Right = 'right',\n Left = 'left'\n}\n\nexport enum ToastColor {\n BLACK,\n WHITE,\n BLUE,\n GREEN,\n ORANGE,\n RED,\n}\n\nexport enum ToastActionType {\n PRIMARY,\n SECONDARY,\n}\n\nexport enum ToastPosition {\n TOPLEFT,\n TOPMIDDLE,\n TOPRIGHT,\n BOTTOMLEFT,\n BOTTOMMIDDLE,\n BOTTOMRIGHT,\n}\n\nexport enum ToastEntryDirection {\n TOP,\n BOTTOM,\n LEFT,\n RIGHT,\n}\n\nexport interface
|
|
1
|
+
{"version":3,"sources":["../src/types.ts"],"names":["States","Size","Position","ToastColor","ToastActionType","ToastPosition","ToastEntryDirection"],"mappings":"AAOA,WAAYA,MAAZ;;WAAYA,M;AAAAA,EAAAA,M;AAAAA,EAAAA,M;AAAAA,EAAAA,M;GAAAA,M,KAAAA,M;;AAMZ,WAAYC,IAAZ;;WAAYA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;GAAAA,I,KAAAA,I;;AAQZ,WAAYC,QAAZ;;WAAYA,Q;AAAAA,EAAAA,Q;AAAAA,EAAAA,Q;AAAAA,EAAAA,Q;AAAAA,EAAAA,Q;GAAAA,Q,KAAAA,Q;;AAOZ,WAAYC,UAAZ;;WAAYA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;GAAAA,U,KAAAA,U;;AASZ,WAAYC,eAAZ;;WAAYA,e;AAAAA,EAAAA,e,CAAAA,e;AAAAA,EAAAA,e,CAAAA,e;GAAAA,e,KAAAA,e;;AAKZ,WAAYC,aAAZ;;WAAYA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;GAAAA,a,KAAAA,a;;AASZ,WAAYC,mBAAZ;;WAAYA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;GAAAA,mB,KAAAA,mB","sourcesContent":["export interface Product {\n id: string;\n name: string;\n type: string;\n image: string;\n}\n\nexport enum States {\n Default = 'default',\n Valid = 'valid',\n Invalid = 'invalid',\n}\n\nexport enum Size {\n XXSmall = 'xxsmall',\n XSmall = 'xsmall',\n Small = 'small',\n Medium = 'medium',\n Large = 'large',\n}\n\nexport enum Position {\n Top = 'top',\n Bottom = 'bottom',\n Right = 'right',\n Left = 'left'\n}\n\nexport enum ToastColor {\n BLACK,\n WHITE,\n BLUE,\n GREEN,\n ORANGE,\n RED,\n}\n\nexport enum ToastActionType {\n PRIMARY,\n SECONDARY,\n}\n\nexport enum ToastPosition {\n TOPLEFT,\n TOPMIDDLE,\n TOPRIGHT,\n BOTTOMLEFT,\n BOTTOMMIDDLE,\n BOTTOMRIGHT,\n}\n\nexport enum ToastEntryDirection {\n TOP,\n BOTTOM,\n LEFT,\n RIGHT,\n}\n\nexport interface NavLink {\n label: string;\n to: string;\n target?: string;\n}\n\nexport interface NavSection {\n header: string;\n links: NavLink[];\n}\n\nexport interface NavOptions {\n sections: NavSection[];\n}\n"],"file":"types.js"}
|