@laerdal/life-react-components 1.10.1-dev.3.full → 1.10.1-dev.5.full
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.
|
@@ -60,9 +60,11 @@ var DesktopActions = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref)
|
|
|
60
60
|
(0, _react.useImperativeHandle)(ref, function () {
|
|
61
61
|
return {
|
|
62
62
|
buttons: elRefs.map(function (r, index) {
|
|
63
|
+
var _buttons$index;
|
|
64
|
+
|
|
63
65
|
return {
|
|
64
66
|
ref: r,
|
|
65
|
-
type: buttons === null || buttons === void 0 ? void 0 : buttons[index].type
|
|
67
|
+
type: buttons === null || buttons === void 0 ? void 0 : (_buttons$index = buttons[index]) === null || _buttons$index === void 0 ? void 0 : _buttons$index.type
|
|
66
68
|
};
|
|
67
69
|
})
|
|
68
70
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/DesktopActions.tsx"],"names":["Wrapper","styled","div","BREAKPOINTS","MEDIUM","DesktopActions","React","forwardRef","ref","buttons","user","onShowUserMenu","useState","elRefs","setElRefs","length","useEffect","Array","fill","map","createRef","r","index","type","renderItem","item","e","action","target","firstName","charAt","lastName","disabled","icon"],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,IAAMA,OAAO,GAAGC,0BAAOC,GAAV,sKAITC,oBAAYC,MAJH,CAAb;;AAoBA,IAAMC,cAAc,gBAAGC,eAAMC,UAAN,CAAiB,gBAIyBC,GAJzB,EAI+D;AAAA,MAH5DC,OAG4D,QAH5DA,OAG4D;AAAA,MAF5DC,IAE4D,QAF5DA,IAE4D;AAAA,MAD5DC,cAC4D,QAD5DA,cAC4D;;AAErG,wBAA4BL,eAAMM,QAAN,CAAqD,EAArD,CAA5B;AAAA;AAAA,MAAOC,MAAP;AAAA,MAAeC,SAAf;;AAEA,MAAMC,MAAM,GAAG,CAAAN,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAEM,MAAT,KAAmB,CAAlC;;AAEAT,iBAAMU,SAAN,CAAgB,YAAM;AACpBF,IAAAA,SAAS,CAACG,KAAK,CAACF,MAAM,IAAI,CAAX,CAAL,CAAmBG,IAAnB,CAAwB,IAAxB,EAA8BC,GAA9B,CAAkC;AAAA,0BAAMb,eAAMc,SAAN,EAAN;AAAA,KAAlC,CAAD,CAAT;AACD,GAFD,EAEG,CAACL,MAAD,CAFH;;AAIA,kCAAoBP,GAApB,EAAyB;AAAA,WAAO;AAC9BC,MAAAA,OAAO,EAAEI,MAAM,CAACM,GAAP,CAAW,UAACE,CAAD,EAAIC,KAAJ;AAAA,eAAe;AACjCd,UAAAA,GAAG,EAAEa,CAD4B;AAEjCE,UAAAA,IAAI,EAAEd,OAAF,aAAEA,OAAF,
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/DesktopActions.tsx"],"names":["Wrapper","styled","div","BREAKPOINTS","MEDIUM","DesktopActions","React","forwardRef","ref","buttons","user","onShowUserMenu","useState","elRefs","setElRefs","length","useEffect","Array","fill","map","createRef","r","index","type","renderItem","item","e","action","target","firstName","charAt","lastName","disabled","icon"],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,IAAMA,OAAO,GAAGC,0BAAOC,GAAV,sKAITC,oBAAYC,MAJH,CAAb;;AAoBA,IAAMC,cAAc,gBAAGC,eAAMC,UAAN,CAAiB,gBAIyBC,GAJzB,EAI+D;AAAA,MAH5DC,OAG4D,QAH5DA,OAG4D;AAAA,MAF5DC,IAE4D,QAF5DA,IAE4D;AAAA,MAD5DC,cAC4D,QAD5DA,cAC4D;;AAErG,wBAA4BL,eAAMM,QAAN,CAAqD,EAArD,CAA5B;AAAA;AAAA,MAAOC,MAAP;AAAA,MAAeC,SAAf;;AAEA,MAAMC,MAAM,GAAG,CAAAN,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAEM,MAAT,KAAmB,CAAlC;;AAEAT,iBAAMU,SAAN,CAAgB,YAAM;AACpBF,IAAAA,SAAS,CAACG,KAAK,CAACF,MAAM,IAAI,CAAX,CAAL,CAAmBG,IAAnB,CAAwB,IAAxB,EAA8BC,GAA9B,CAAkC;AAAA,0BAAMb,eAAMc,SAAN,EAAN;AAAA,KAAlC,CAAD,CAAT;AACD,GAFD,EAEG,CAACL,MAAD,CAFH;;AAIA,kCAAoBP,GAApB,EAAyB;AAAA,WAAO;AAC9BC,MAAAA,OAAO,EAAEI,MAAM,CAACM,GAAP,CAAW,UAACE,CAAD,EAAIC,KAAJ;AAAA;;AAAA,eAAe;AACjCd,UAAAA,GAAG,EAAEa,CAD4B;AAEjCE,UAAAA,IAAI,EAAEd,OAAF,aAAEA,OAAF,yCAAEA,OAAO,CAAGa,KAAH,CAAT,mDAAE,eAAkBC;AAFS,SAAf;AAAA,OAAX;AADqB,KAAP;AAAA,GAAzB,EAKI,CAACV,MAAD,EAASJ,OAAT,CALJ;;AAOA,MAAMe,UAAU,GAAG,SAAbA,UAAa,CAACC,IAAD,EAA8BH,KAA9B,EAAgD;AAAA;;AACjE,YAAQG,IAAI,CAACF,IAAb;AACE,WAAK,SAAL;AACE,4BAAO,qBAAC,4BAAD;AACe,UAAA,GAAG,EAAEV,MAAM,CAACS,KAAD,CAD1B;AAEe,UAAA,cAAc,EAAE,IAF/B;AAGe,UAAA,OAAO,EAAE,iBAAAI,CAAC,EAAI;AACZD,YAAAA,IAAI,CAACE,MAAL,GAAcF,IAAI,CAACE,MAAL,CAAYD,CAAZ,aAAYA,CAAZ,uBAAYA,CAAC,CAAEE,MAAf,CAAd,GAAuCjB,cAAc,EAArD;AACD,WALhB;AAMe,UAAA,IAAI,EAAE,CAACD,IAAD,iBAAS,qBAAC,kBAAD,CAAa,IAAb,KAN9B;AAOe,UAAA,QAAQ,EAAE,0BAACA,IAAD,aAACA,IAAD,0CAACA,IAAI,CAAEmB,SAAP,oDAAC,gBAAiBC,MAAjB,CAAwB,CAAxB,CAAD,yEAA+B,EAA/B,8BAAsCpB,IAAtC,aAAsCA,IAAtC,yCAAsCA,IAAI,CAAEqB,QAA5C,mDAAsC,eAAgBD,MAAhB,CAAuB,CAAvB,CAAtC,yEAAmE,EAAnE;AAPzB,WAAoBR,KAApB,CAAP;;AAQF,WAAK,QAAL;AACE,4BAAO,qBAAC,kBAAD;AACY,UAAA,GAAG,EAAET,MAAM,CAACS,KAAD,CADvB;AAEY,UAAA,OAAO,EAAE,WAFrB;AAGY,UAAA,KAAK,EAAE,UAHnB;AAIY,UAAA,QAAQ,EAAEG,IAAI,CAACO,QAJ3B;AAKY,UAAA,cAAc,EAAE,IAL5B;AAMY,UAAA,MAAM,EAAE,gBAAAN,CAAC,EAAI;AACXD,YAAAA,IAAI,CAACE,MAAL,IAAeF,IAAI,CAACE,MAAL,CAAYD,CAAZ,aAAYA,CAAZ,uBAAYA,CAAC,CAAEE,MAAf,CAAf;AACD,WARb;AAAA,oBASJH,IAAI,CAACQ;AATD,WAAiBX,KAAjB,CAAP;;AAWF,WAAK,UAAL;AACE,4BAAO,qBAAC,kBAAD;AACY,UAAA,GAAG,EAAET,MAAM,CAACS,KAAD,CADvB;AAEY,UAAA,OAAO,EAAE,WAFrB;AAGY,UAAA,KAAK,EAAE,UAHnB;AAIY,UAAA,cAAc,EAAE,IAJ5B;AAKY,UAAA,EAAE,EAAC,qBALf;AAMY,UAAA,MAAM,EAAE,gBAAAI,CAAC;AAAA,mBAAID,IAAI,CAACE,MAAL,IAAeF,IAAI,CAACE,MAAL,CAAYD,CAAZ,aAAYA,CAAZ,uBAAYA,CAAC,CAAEE,MAAf,CAAnB;AAAA,WANrB;AAAA,iCAOL,qBAAC,sBAAD;AAAW,YAAA,IAAI,EAAC;AAAhB;AAPK,WAAiBN,KAAjB,CAAP;AAvBJ;AAiCD,GAlCD;;AAoCA,sBACE,qBAAC,OAAD;AAAA,cACGb,OADH,aACGA,OADH,uBACGA,OAAO,CAAEU,GAAT,CAAa,UAACM,IAAD,EAAOH,KAAP;AAAA,aAAiBE,UAAU,CAACC,IAAD,EAAOH,KAAP,CAA3B;AAAA,KAAb;AADH,IADF;AAKD,CA9DsB,CAAvB;;;AATEb,EAAAA,O;AAEAE,EAAAA,c;;eAwEaN,c","sourcesContent":["import React, {useImperativeHandle} from 'react';\nimport styled from 'styled-components';\nimport {MenuAccountInfo, MobileMenuButtonTypes, MenuIconButton, DesktopMenuButtonTypes} from '../types';\nimport {IconButton} from '../../Button';\nimport {SwitchApp} from '../../icons/systemicons/SystemIcons';\nimport {ProfileButton} from '../../ProfileButton';\nimport {SystemIcons} from '../../icons';\nimport {BREAKPOINTS} from '../../styles';\n\nconst Wrapper = styled.div`\n align-items: center;\n \n display: none;\n ${BREAKPOINTS.MEDIUM}{\n display: flex;\n }\n`;\n\n\ninterface DesktopActionsProps {\n buttons?: DesktopMenuButtonTypes[];\n user?: MenuAccountInfo;\n onShowUserMenu: () => void;\n}\n\nexport interface DesktopActionsRef {\n buttons?: { ref: React.MutableRefObject<HTMLButtonElement | null>, type: 'profile' | 'action' | 'switcher' | undefined }[]\n}\n\nconst DesktopActions = React.forwardRef(({\n buttons,\n user,\n onShowUserMenu\n }: DesktopActionsProps, ref: React.Ref<DesktopActionsRef>) => {\n\n const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLButtonElement>[]>([]);\n\n const length = buttons?.length || 0;\n\n React.useEffect(() => {\n setElRefs(Array(length || 0).fill(null).map(() => React.createRef<HTMLButtonElement>()));\n }, [length]);\n\n useImperativeHandle(ref, () => ({\n buttons: elRefs.map((r, index) => ({\n ref: r,\n type: buttons?.[index]?.type,\n }))\n }), [elRefs, buttons]);\n\n const renderItem = (item: MobileMenuButtonTypes, index: number) => {\n switch (item.type) {\n case 'profile':\n return <ProfileButton key={index}\n ref={elRefs[index]}\n hideOnLowWidth={true}\n onClick={e => {\n item.action ? item.action(e?.target) : onShowUserMenu()\n }}\n icon={!user && <SystemIcons.User/>}\n initials={(user?.firstName?.charAt(0) ?? '') + (user?.lastName?.charAt(0) ?? '')}/>\n case 'action':\n return <IconButton key={index}\n ref={elRefs[index]}\n variant={'secondary'}\n shape={'circular'}\n disabled={item.disabled}\n hideOnLowWidth={true}\n action={e => {\n item.action && item.action(e?.target);\n }}>\n {item.icon}\n </IconButton>\n case 'switcher':\n return <IconButton key={index}\n ref={elRefs[index]}\n variant={'secondary'}\n shape={'circular'}\n hideOnLowWidth={true}\n id=\"globalNavAppsButton\"\n action={e => item.action && item.action(e?.target)}>\n <SwitchApp size=\"24px\"/>\n </IconButton>\n }\n }\n\n return (\n <Wrapper>\n {buttons?.map((item, index) => renderItem(item, index))}\n </Wrapper>\n )\n});\n\n\nexport default DesktopActions;\n"],"file":"DesktopActions.cjs"}
|
|
@@ -32,9 +32,11 @@ var DesktopActions = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
32
32
|
useImperativeHandle(ref, function () {
|
|
33
33
|
return {
|
|
34
34
|
buttons: elRefs.map(function (r, index) {
|
|
35
|
+
var _buttons$index;
|
|
36
|
+
|
|
35
37
|
return {
|
|
36
38
|
ref: r,
|
|
37
|
-
type: buttons === null || buttons === void 0 ? void 0 : buttons[index].type
|
|
39
|
+
type: buttons === null || buttons === void 0 ? void 0 : (_buttons$index = buttons[index]) === null || _buttons$index === void 0 ? void 0 : _buttons$index.type
|
|
38
40
|
};
|
|
39
41
|
})
|
|
40
42
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/DesktopActions.tsx"],"names":["React","useImperativeHandle","styled","IconButton","SwitchApp","ProfileButton","SystemIcons","BREAKPOINTS","Wrapper","div","MEDIUM","DesktopActions","forwardRef","ref","buttons","user","onShowUserMenu","useState","elRefs","setElRefs","length","useEffect","Array","fill","map","createRef","r","index","type","renderItem","item","e","action","target","firstName","charAt","lastName","disabled","icon"],"mappings":";;;;;;AAAA,OAAOA,KAAP,IAAeC,mBAAf,QAAyC,OAAzC;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AAEA,SAAQC,UAAR,QAAyB,cAAzB;AACA,SAAQC,SAAR,QAAwB,qCAAxB;AACA,SAAQC,aAAR,QAA4B,qBAA5B;AACA,SAAQC,WAAR,QAA0B,aAA1B;AACA,SAAQC,WAAR,QAA0B,cAA1B;;AAEA,IAAMC,OAAO,GAAGN,MAAM,CAACO,GAAV,wJAITF,WAAW,CAACG,MAJH,CAAb;AAoBA,IAAMC,cAAc,gBAAGX,KAAK,CAACY,UAAN,CAAiB,gBAIyBC,GAJzB,EAI+D;AAAA,MAH5DC,OAG4D,QAH5DA,OAG4D;AAAA,MAF5DC,IAE4D,QAF5DA,IAE4D;AAAA,MAD5DC,cAC4D,QAD5DA,cAC4D;;AAErG,wBAA4BhB,KAAK,CAACiB,QAAN,CAAqD,EAArD,CAA5B;AAAA;AAAA,MAAOC,MAAP;AAAA,MAAeC,SAAf;;AAEA,MAAMC,MAAM,GAAG,CAAAN,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAEM,MAAT,KAAmB,CAAlC;AAEApB,EAAAA,KAAK,CAACqB,SAAN,CAAgB,YAAM;AACpBF,IAAAA,SAAS,CAACG,KAAK,CAACF,MAAM,IAAI,CAAX,CAAL,CAAmBG,IAAnB,CAAwB,IAAxB,EAA8BC,GAA9B,CAAkC;AAAA,0BAAMxB,KAAK,CAACyB,SAAN,EAAN;AAAA,KAAlC,CAAD,CAAT;AACD,GAFD,EAEG,CAACL,MAAD,CAFH;AAIAnB,EAAAA,mBAAmB,CAACY,GAAD,EAAM;AAAA,WAAO;AAC9BC,MAAAA,OAAO,EAAEI,MAAM,CAACM,GAAP,CAAW,UAACE,CAAD,EAAIC,KAAJ;AAAA,eAAe;AACjCd,UAAAA,GAAG,EAAEa,CAD4B;AAEjCE,UAAAA,IAAI,EAAEd,OAAF,aAAEA,OAAF,
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/DesktopActions.tsx"],"names":["React","useImperativeHandle","styled","IconButton","SwitchApp","ProfileButton","SystemIcons","BREAKPOINTS","Wrapper","div","MEDIUM","DesktopActions","forwardRef","ref","buttons","user","onShowUserMenu","useState","elRefs","setElRefs","length","useEffect","Array","fill","map","createRef","r","index","type","renderItem","item","e","action","target","firstName","charAt","lastName","disabled","icon"],"mappings":"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","sourcesContent":["import React, {useImperativeHandle} from 'react';\nimport styled from 'styled-components';\nimport {MenuAccountInfo, MobileMenuButtonTypes, MenuIconButton, DesktopMenuButtonTypes} from '../types';\nimport {IconButton} from '../../Button';\nimport {SwitchApp} from '../../icons/systemicons/SystemIcons';\nimport {ProfileButton} from '../../ProfileButton';\nimport {SystemIcons} from '../../icons';\nimport {BREAKPOINTS} from '../../styles';\n\nconst Wrapper = styled.div`\n align-items: center;\n \n display: none;\n ${BREAKPOINTS.MEDIUM}{\n display: flex;\n }\n`;\n\n\ninterface DesktopActionsProps {\n buttons?: DesktopMenuButtonTypes[];\n user?: MenuAccountInfo;\n onShowUserMenu: () => void;\n}\n\nexport interface DesktopActionsRef {\n buttons?: { ref: React.MutableRefObject<HTMLButtonElement | null>, type: 'profile' | 'action' | 'switcher' | undefined }[]\n}\n\nconst DesktopActions = React.forwardRef(({\n buttons,\n user,\n onShowUserMenu\n }: DesktopActionsProps, ref: React.Ref<DesktopActionsRef>) => {\n\n const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLButtonElement>[]>([]);\n\n const length = buttons?.length || 0;\n\n React.useEffect(() => {\n setElRefs(Array(length || 0).fill(null).map(() => React.createRef<HTMLButtonElement>()));\n }, [length]);\n\n useImperativeHandle(ref, () => ({\n buttons: elRefs.map((r, index) => ({\n ref: r,\n type: buttons?.[index]?.type,\n }))\n }), [elRefs, buttons]);\n\n const renderItem = (item: MobileMenuButtonTypes, index: number) => {\n switch (item.type) {\n case 'profile':\n return <ProfileButton key={index}\n ref={elRefs[index]}\n hideOnLowWidth={true}\n onClick={e => {\n item.action ? item.action(e?.target) : onShowUserMenu()\n }}\n icon={!user && <SystemIcons.User/>}\n initials={(user?.firstName?.charAt(0) ?? '') + (user?.lastName?.charAt(0) ?? '')}/>\n case 'action':\n return <IconButton key={index}\n ref={elRefs[index]}\n variant={'secondary'}\n shape={'circular'}\n disabled={item.disabled}\n hideOnLowWidth={true}\n action={e => {\n item.action && item.action(e?.target);\n }}>\n {item.icon}\n </IconButton>\n case 'switcher':\n return <IconButton key={index}\n ref={elRefs[index]}\n variant={'secondary'}\n shape={'circular'}\n hideOnLowWidth={true}\n id=\"globalNavAppsButton\"\n action={e => item.action && item.action(e?.target)}>\n <SwitchApp size=\"24px\"/>\n </IconButton>\n }\n }\n\n return (\n <Wrapper>\n {buttons?.map((item, index) => renderItem(item, index))}\n </Wrapper>\n )\n});\n\n\nexport default DesktopActions;\n"],"file":"DesktopActions.js"}
|