npm - @laerdal/life-react-components - Versions diffs - 3.5.0 → 3.5.2-uss.hackathon - Mend

@laerdal/life-react-components 3.5.0 → 3.5.2-uss.hackathon

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (100) hide show

package/dist/GlobalNavigationBar/desktop/DesktopActions.js CHANGED Viewed

@@ -6,7 +6,7 @@ import _pt from "prop-types";
 var _excluded = ["placement", "type", "action"],
   _excluded2 = ["placement", "type", "icon", "action"],
   _excluded3 = ["placement", "type", "action"];
-var _templateObject, _templateObject2;
+var _templateObject, _templateObject2, _templateObject3;
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React from 'react';
@@ -17,7 +17,8 @@ import { SystemIcons } from '../../icons';
 import { BREAKPOINTS } from '../../styles';
 import { jsx as _jsx } from "react/jsx-runtime";
 var Wrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  align-items: center;\n\n  display: none;\n\n  ", " {\n    display: flex;\n  }\n"])), BREAKPOINTS.MEDIUM);
-var ProfileWrapper = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  margin: 0 8px;\n"])));
+export var DesktopActionsCustomComponentWrapper = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral([""])));
+var ProfileWrapper = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  margin: 0 8px;\n"])));
 var DesktopActions = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var buttons = _ref.buttons,
     user = _ref.user,
@@ -107,6 +108,13 @@ var DesktopActions = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
             })
           }), index);
         }
+      case 'custom':
+        {
+          var content = item.content;
+          return /*#__PURE__*/_jsx(DesktopActionsCustomComponentWrapper, {
+            children: content()
+          });
+        }
     }
   };
   return /*#__PURE__*/_jsx(Wrapper, {

package/dist/GlobalNavigationBar/desktop/DesktopActions.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DesktopActions.js","names":["React","styled","IconButton","ProfileButton","SystemIcons","BREAKPOINTS","Wrapper","div","MEDIUM","ProfileWrapper","DesktopActions","forwardRef","ref","buttons","user","profileComponent","onShowUserMenu","useState","elRefs","setElRefs","length","useEffect","Array","fill","map","createRef","useImperativeHandle","r","index","type","renderItem","item","placement","action","rest","e","target","firstName","charAt","lastName","icon"],"sources":["../../../src/GlobalNavigationBar/desktop/DesktopActions.tsx"],"sourcesContent":["import React from 'react';\r\nimport styled from 'styled-components';\r\nimport {MenuAccountInfo, MobileMenuButtonTypes, DesktopMenuButtonTypes} from '../types';\r\nimport {IconButton} from '../../Button';\r\nimport {ProfileButton} from '../../ProfileButton';\r\nimport {SystemIcons} from '../../icons';\r\nimport {BREAKPOINTS} from '../../styles';\r\n\r\nconst Wrapper = styled.div`\r\n align-items: center;\r\n\r\n display: none;\r\n\r\n ${BREAKPOINTS.MEDIUM} {\r\n display: flex;\r\n }\r\n`;\r\n\r\nconst ProfileWrapper = styled.div`\r\n margin: 0 8px;\r\n`;\r\n\r\n\r\ninterface DesktopActionsProps {\r\n buttons?: DesktopMenuButtonTypes[];\r\n user?: MenuAccountInfo;\r\n profileComponent?: React.ReactNode\r\n onShowUserMenu: () => void;\r\n}\r\n\r\nexport interface DesktopActionsRef {\r\n buttons?: { ref: React.MutableRefObject<HTMLButtonElement \| null>, type: 'profile' \| 'action' \| 'switcher' \| undefined }[]\r\n}\r\n\r\nconst DesktopActions = React.forwardRef(({\r\n buttons,\r\n user,\r\n profileComponent,\r\n onShowUserMenu\r\n }: DesktopActionsProps, ref: React.Ref<DesktopActionsRef>) => {\r\n\r\n const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLButtonElement>[]>([]);\r\n\r\n const length = buttons?.length \|\| 0;\r\n\r\n React.useEffect(() => {\r\n setElRefs(Array(length \|\| 0).fill(null).map(() => React.createRef<HTMLButtonElement>()));\r\n }, [length]);\r\n\r\n React.useImperativeHandle(ref, () => ({\r\n buttons: elRefs.map((r, index) => ({\r\n ref: r,\r\n type: buttons?.[index]?.type,\r\n }))\r\n }), [elRefs, buttons]);\r\n\r\n const renderItem = (item: MobileMenuButtonTypes, index: number) => {\r\n switch (item.type) {\r\n case 'profile': {\r\n const {placement, type, action, ...rest} = item;\r\n if(!!profileComponent)\r\n return <ProfileWrapper>{profileComponent}</ProfileWrapper>;\r\n else\r\n return <ProfileWrapper>\r\n <ProfileButton key={index}\r\n ref={elRefs[index]}\r\n hideOnLowWidth={true}\r\n onClick={e => {\r\n item.action ? item.action(e?.target) : onShowUserMenu()\r\n }}\r\n icon={!user && <SystemIcons.User/>}\r\n initials={(user?.firstName?.charAt(0) ?? '') + (user?.lastName?.charAt(0) ?? '')}\r\n {...rest}/>\r\n </ProfileWrapper>\r\n }\r\n case 'action': {\r\n const {placement, type, icon, action, ...rest} = item;\r\n return <IconButton key={index}\r\n ref={elRefs[index]}\r\n variant={'secondary'}\r\n shape={'circular'}\r\n hideOnLowWidth={true}\r\n action={e => item.action && item.action(e?.target)}\r\n {...rest}>\r\n {item.icon}\r\n </IconButton>\r\n }\r\n case 'switcher': {\r\n const {placement, type, action, ...rest} = item;\r\n return <IconButton key={index}\r\n ref={elRefs[index]}\r\n variant={'secondary'}\r\n shape={'circular'}\r\n hideOnLowWidth={true}\r\n id=\"globalNavAppsButton\"\r\n action={e => item.action && item.action(e?.target)}\r\n {...rest}>\r\n <SystemIcons.SwitchApp size=\"24px\"/>\r\n </IconButton>\r\n }\r\n }\r\n }\r\n\r\n return (\r\n <Wrapper role=\"toolbar\" aria-label=\"Toolbar\">\r\n {buttons?.map((item, index) => renderItem(item, index))}\r\n </Wrapper>\r\n )\r\n});\r\n\r\n\r\nexport default DesktopActions;\r\n"],"mappings":";;;;;;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,MAAM,MAAM,mBAAmB;AAEtC,SAAQC,UAAU,QAAO,cAAc;AACvC,SAAQC,aAAa,QAAO,qBAAqB;AACjD,SAAQC,WAAW,QAAO,aAAa;AACvC,SAAQC,WAAW,QAAO,cAAc;AAAC;~~AAEzC~~,IAAMC,OAAO,GAAGL,MAAM,CAACM,GAAG,yJAKtBF,WAAW,CAACG,MAAM,CAGrB;AAED,IAAMC,~~cAAc~~,GAAGR,MAAM,CAACM,GAAG,2FAEhC;AAcD,~~IAAOG~~,cAAc,~~gBAAGV~~,KAAK,~~CAACW~~,UAAU,CAAC,gBAKwBC,GAAiC,EAAK;EAAA,IAJ5DC,OAAO,QAAPA,OAAO;IACPC,IAAI,QAAJA,IAAI;IACHC,gBAAgB,QAAhBA,gBAAgB;IACjBC,cAAc,QAAdA,cAAc;EAGvD,~~sBAA4BhB~~,KAAK,~~CAACiB~~,QAAQ,CAAuC,EAAE,CAAC;IAAA;IAA7EC,MAAM;IAAEC,SAAS;EAExB,IAAMC,MAAM,GAAG,CAAAP,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEO,MAAM,KAAI,CAAC;~~EAEnCpB~~,KAAK,~~CAACqB~~,SAAS,CAAC,YAAM;IACpBF,SAAS,CAACG,KAAK,CAACF,MAAM,IAAI,CAAC,CAAC,CAACG,IAAI,CAAC,IAAI,CAAC,CAACC,GAAG,CAAC;MAAA,~~oBAAMxB~~,KAAK,~~CAACyB~~,SAAS,EAAqB;IAAA,EAAC,CAAC;EAC1F,CAAC,EAAE,CAACL,MAAM,CAAC,CAAC;~~EAEZpB~~,KAAK,~~CAAC0B~~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~~UACzCf~~,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEW,GAAG,CAAC,UAACO,IAAI,EAAEH,KAAK;MAAA,OAAKE,UAAU,CAACC,IAAI,EAAEH,KAAK,CAAC;IAAA;EAAC,EAC/C;AAEd,CAAC,CAAC;AAAC;~~EApFDf~~,OAAO;EAEPE,gBAAgB;EAChBC,cAAc;AAAA;~~AAoFhB~~,eAAeN,cAAc"}
1	+ {"version":3,"file":"DesktopActions.js","names":["React","styled","IconButton","ProfileButton","SystemIcons","BREAKPOINTS","Wrapper","div","MEDIUM","DesktopActionsCustomComponentWrapper","ProfileWrapper","DesktopActions","forwardRef","ref","buttons","user","profileComponent","onShowUserMenu","useState","elRefs","setElRefs","length","useEffect","Array","fill","map","createRef","useImperativeHandle","r","index","type","renderItem","item","placement","action","rest","e","target","firstName","charAt","lastName","icon","content"],"sources":["../../../src/GlobalNavigationBar/desktop/DesktopActions.tsx"],"sourcesContent":["import React from 'react';\r\nimport styled from 'styled-components';\r\nimport {MenuAccountInfo, MobileMenuButtonTypes, DesktopMenuButtonTypes} from '../types';\r\nimport {IconButton} from '../../Button';\r\nimport {ProfileButton} from '../../ProfileButton';\r\nimport {SystemIcons} from '../../icons';\r\nimport {BREAKPOINTS} from '../../styles';\r\nimport { SearchBar } from 'src/InputFields';\r\nimport { Size } from 'src/types';\r\n\r\nconst Wrapper = styled.div`\r\n align-items: center;\r\n\r\n display: none;\r\n\r\n ${BREAKPOINTS.MEDIUM} {\r\n display: flex;\r\n }\r\n`;\r\n\r\nexport const DesktopActionsCustomComponentWrapper = styled.div``;\r\n\r\nconst ProfileWrapper = styled.div`\r\n margin: 0 8px;\r\n`;\r\n\r\n\r\ninterface DesktopActionsProps {\r\n buttons?: DesktopMenuButtonTypes[];\r\n user?: MenuAccountInfo;\r\n profileComponent?: React.ReactNode\r\n onShowUserMenu: () => void;\r\n}\r\n\r\nexport interface DesktopActionsRef {\r\n buttons?: { ref: React.MutableRefObject<HTMLButtonElement \| null>, type: 'profile' \| 'action' \| 'switcher' \| 'custom' \| undefined }[]\r\n}\r\n\r\nconst DesktopActions = React.forwardRef(({\r\n buttons,\r\n user,\r\n profileComponent,\r\n onShowUserMenu\r\n }: DesktopActionsProps, ref: React.Ref<DesktopActionsRef>) => {\r\n\r\n const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLButtonElement>[]>([]);\r\n\r\n const length = buttons?.length \|\| 0;\r\n\r\n React.useEffect(() => {\r\n setElRefs(Array(length \|\| 0).fill(null).map(() => React.createRef<HTMLButtonElement>()));\r\n }, [length]);\r\n\r\n React.useImperativeHandle(ref, () => ({\r\n buttons: elRefs.map((r, index) => ({\r\n ref: r,\r\n type: buttons?.[index]?.type,\r\n }))\r\n }), [elRefs, buttons]);\r\n\r\n const renderItem = (item: MobileMenuButtonTypes, index: number) => {\r\n switch (item.type) {\r\n case 'profile': {\r\n const {placement, type, action, ...rest} = item;\r\n if(!!profileComponent)\r\n return <ProfileWrapper>{profileComponent}</ProfileWrapper>;\r\n else\r\n return <ProfileWrapper>\r\n <ProfileButton key={index}\r\n ref={elRefs[index]}\r\n hideOnLowWidth={true}\r\n onClick={e => {\r\n item.action ? item.action(e?.target) : onShowUserMenu()\r\n }}\r\n icon={!user && <SystemIcons.User/>}\r\n initials={(user?.firstName?.charAt(0) ?? '') + (user?.lastName?.charAt(0) ?? '')}\r\n {...rest}/>\r\n </ProfileWrapper>\r\n }\r\n case 'action': {\r\n const {placement, type, icon, action, ...rest} = item;\r\n return <IconButton key={index}\r\n ref={elRefs[index]}\r\n variant={'secondary'}\r\n shape={'circular'}\r\n hideOnLowWidth={true}\r\n action={e => item.action && item.action(e?.target)}\r\n {...rest}>\r\n {item.icon}\r\n </IconButton>\r\n }\r\n case 'switcher': {\r\n const {placement, type, action, ...rest} = item;\r\n return <IconButton key={index}\r\n ref={elRefs[index]}\r\n variant={'secondary'}\r\n shape={'circular'}\r\n hideOnLowWidth={true}\r\n id=\"globalNavAppsButton\"\r\n action={e => item.action && item.action(e?.target)}\r\n {...rest}>\r\n <SystemIcons.SwitchApp size=\"24px\"/>\r\n </IconButton>\r\n }\r\n\r\n case 'custom': {\r\n const { content } = item;\r\n return <DesktopActionsCustomComponentWrapper>{content()}</DesktopActionsCustomComponentWrapper>;\r\n }\r\n }\r\n }\r\n\r\n return (\r\n <Wrapper role=\"toolbar\" aria-label=\"Toolbar\">\r\n {buttons?.map((item, index) => renderItem(item, index))}\r\n </Wrapper>\r\n )\r\n});\r\n\r\n\r\nexport default DesktopActions;\r\n"],"mappings":"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"}

package/dist/GlobalNavigationBar/desktop/MainMenu.cjs CHANGED Viewed

@@ -270,6 +270,8 @@ var MainMenu = function MainMenu(_ref) {
         focusedItemId: focusedItemId,
         ref: extendedMenuOptionRef,
         onItemStateChanged: function onItemStateChanged(item, state) {
+          console.log(item);
+          console.log(state);
           if (state) setActiveItemId(item);else if (item == activeItem) setActiveItemId('');
         },
         nestPath: [ExtendedMenuOption],

package/dist/GlobalNavigationBar/desktop/MainMenu.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MainMenu.cjs","names":["NavContainer","styled","div","BREAKPOINTS","MEDIUM","NavItemDiv","LARGE","NavButton","button","COLORS","white","ExtendedMenuWrapper","props","floatRight","ExtendedSection","SubMenuWrapper","Menu","topLevel","ExtendedMenuOption","MainMenu","items","rightSideRef","menuButtonRef","React","useRef","dropdownMenusOpenedArray","mainMenuRef","useState","numberOfItemsAllowed","setNumberOfItemsAllowed","subMenuRefs","setAllSubMenuRefs","extendedMenuOptionRef","createRef","useEffect","map","x","type","undefined","forceUpdate","activeItem","setActiveItemId","focusedItemId","setFocusedItemId","widthOfItem","recalculateNumberOfItemsAllowed","current","number","Math","floor","offsetLeft","onMouseLeave","event","id","filter","onMouseEnter","existingRefForId","find","window","addEventListener","removeEventListener","length","onFocus","onKeyDownTop","key","renderItem","item","index","icon","to","exact","disabled","external","action","label","note","pinned","rest","defaultOnMouseDownHandler","NavLink","e","existingRef","onClick","onKeyDown","code","containsActiveItem","checkIfContainsItem","position","Boolean","state","extended","extendedSectionKeyHandler","stopPropagation","slice"],"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { NavLink, useLocation } from 'react-router-dom';\r\nimport styled from 'styled-components';\r\nimport { NavItem } from '../../NavItem';\r\nimport {SystemIcons} from '../../icons';\r\nimport { COLORS, BREAKPOINTS } from '../../styles';\r\nimport { Menu } from './ExtendedMainMenu';\r\nimport { SubMenu } from './SubMenu';\r\nimport { IconButton } from '../../Button';\r\nimport { defaultOnMouseDownHandler } from '../../common';\r\nimport { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';\r\nimport { NavItemDiv } from '../../NavItem/NavItem';\r\nimport { checkIfContainsItem } from '../utils';\r\n\r\nconst NavContainer = styled.div`\r\n display: none;\r\n flex-grow: 1;\r\n justify-content: flex-start;\r\n align-items: center;\r\n \r\n padding: 0 16px;\r\n\r\n ${BREAKPOINTS.MEDIUM} {\r\n display: flex;\r\n }\r\n \r\n ${NavItemDiv} {\r\n cursor: pointer;\r\n }\r\n ${BREAKPOINTS.LARGE} {\r\n padding: 0 32px;\r\n }\r\n\r\n a {\r\n text-decoration: none;\r\n }\r\n`;\r\n\r\nconst NavButton = styled.button`\r\n background: ${COLORS.white};\r\n border: 0;\r\n`;\r\n\r\ninterface ExtendedMenuWrapperProps {\r\n floatRight: boolean;\r\n}\r\n\r\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\r\n display: flex;\r\n margin-left: ${(props) => (props.floatRight ? 'auto' : 'unset')};\r\n\r\n position: absolute;\r\n flex-direction: column;\r\n left: 290px;\r\n top: 22px;\r\n\r\n height: 0;\r\n width: 0;\r\n\r\n &:focus-within,\r\n &:hover,\r\n &.open {\r\n background: ${COLORS.white};\r\n }\r\n`;\r\n\r\nconst ExtendedSection = styled.div`\r\n position: relative;\r\n`;\r\n\r\nconst SubMenuWrapper = styled.div<{ topLevel: boolean }>`\r\n ${Menu} {\r\n top: ${(props) => (props.topLevel ? '100%' : '0px')};\r\n left: ${(props) => (props.topLevel ? '0px' : 'calc(100% - 12px)')};\r\n }\r\n\r\n button {\r\n padding-left: 0px;\r\n }\r\n`;\r\n\r\nconst ExtendedMenuOption = 'extendedOption';\r\n\r\ntype Props = {\r\n items: (MenuNavigationItemTypeItem \| MenuNavigationItemTypeDesktopGroup)[];\r\n rightSideRef?: React.RefObject<HTMLDivElement> \| null \| undefined;\r\n};\r\n\r\nconst MainMenu = ({ items, rightSideRef }: Props): React.ReactElement<Props> => {\r\n const menuButtonRef = React.useRef<HTMLButtonElement>(null);\r\n //we have to use refs instead of 'state' here, because when onmouseleave is triggered for multiple nested divs, state update is not being updated in between\r\n const dropdownMenusOpenedArray = React.useRef<string[]>([]);\r\n const mainMenuRef: React.RefObject<HTMLDivElement> \| null \| undefined = React.useRef(null);\r\n const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\r\n const [subMenuRefs, setAllSubMenuRefs] = React.useState<(React.RefObject<HTMLUListElement> \| undefined)[]>([]);\r\n const extendedMenuOptionRef = React.createRef<HTMLUListElement>();\r\n\r\n React.useEffect(() => {\r\n setAllSubMenuRefs(items.map((x) => (x.type == 'desktopgroup' ? React.createRef<HTMLUListElement>() : undefined)));\r\n }, [items]);\r\n\r\n const [, forceUpdate] = React.useState({});\r\n const [activeItem, setActiveItemId] = React.useState<string>('');\r\n const [focusedItemId, setFocusedItemId] = React.useState<string>('');\r\n\r\n const widthOfItem = 120;\r\n const recalculateNumberOfItemsAllowed = () => {\r\n if (rightSideRef?.current && mainMenuRef?.current) {\r\n const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\r\n if (number !== numberOfItemsAllowed) {\r\n setNumberOfItemsAllowed(number);\r\n }\r\n }\r\n };\r\n\r\n const onMouseLeave = (event: any, id: string) => {\r\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current.filter((x) => x != id)];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n };\r\n\r\n const onMouseEnter = (event: any, id: string) => {\r\n const existingRefForId = dropdownMenusOpenedArray.current.find((x) => x == id);\r\n if (existingRefForId == null) {\r\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, id];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n }\r\n };\r\n\r\n React.useEffect(() => {\r\n recalculateNumberOfItemsAllowed();\r\n // Bind the event listener\r\n window.addEventListener('resize', recalculateNumberOfItemsAllowed);\r\n return () => {\r\n // Unbind the event listener on clean up\r\n window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\r\n };\r\n }, []);\r\n\r\n React.useEffect(() => {\r\n recalculateNumberOfItemsAllowed();\r\n }, [items.length]);\r\n\r\n const onFocus = (event: React.FocusEvent<HTMLDivElement>) => {\r\n //no open dropdowns if top level was entered\r\n dropdownMenusOpenedArray.current = [];\r\n forceUpdate({});\r\n };\r\n\r\n const onKeyDownTop = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n if (event.key === 'Escape' \|\| event.key === 'Esc') {\r\n dropdownMenusOpenedArray.current = [];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n }\r\n };\r\n\r\n const renderItem = (item: MenuNavigationItemTypeItem \| MenuNavigationItemTypeDesktopGroup, index: number) => {\r\n if (index > numberOfItemsAllowed - 2) return null;\r\n if (item.type != 'desktopgroup') {\r\n const { icon, to, exact, disabled, external, action, label, note, pinned, ...rest } = item as MenuNavigationItemTypeItem;\r\n return item?.disabled ? (\r\n <NavItem as={NavButton} className=\"disabled\" key={item.label} onMouseDown={defaultOnMouseDownHandler}>\r\n {item?.label}\r\n </NavItem>\r\n ) : (\r\n <NavItem as={NavLink} onFocus={onFocus} to={to \|\| ''} key={label} onMouseDown={defaultOnMouseDownHandler} onClick={(e: React.MouseEvent) => action && action(e)} {...rest}>\r\n {item?.label}\r\n </NavItem>\r\n );\r\n } else {\r\n const existingRef = dropdownMenusOpenedArray.current.find((x) => x == item.id);\r\n const onClick = () => {\r\n if (existingRef == null) {\r\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n }\r\n };\r\n const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n if (event.key == 'Enter' \|\| event.code == 'Space') {\r\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n } \r\n };\r\n\r\n const containsActiveItem = checkIfContainsItem(item, activeItem);\r\n return (\r\n <div\r\n style={{ position: 'relative' }}\r\n onMouseEnter={(event) => onMouseEnter(event, item.id ?? '')}\r\n onMouseLeave={(event) => onMouseLeave(event, item.id ?? '')}>\r\n <NavItem\r\n id={item.id + '_parentOption'}\r\n aria-expanded={Boolean(existingRef)}\r\n aria-activedescendant={containsActiveItem ? activeItem : ''}\r\n aria-controls={item.id}\r\n role=\"listbox\"\r\n onFocus={onFocus}\r\n onKeyDown={onKeyDown}\r\n tabIndex={0}\r\n className={existingRef != null \|\| checkIfContainsItem(item, activeItem) ? 'active' : ''}\r\n key={item.label}\r\n to={null}\r\n onClick={onClick}>\r\n {item?.label} <SystemIcons.ArrowDropDown size=\"24px\" />\r\n </NavItem>\r\n <SubMenu\r\n ariaLabelledBy={item.id + '_parentOption'}\r\n ref={subMenuRefs[index]}\r\n onItemFocused={setFocusedItemId}\r\n focusedItemId={focusedItemId}\r\n activeItemId={activeItem}\r\n nestPath={[item.id]}\r\n onItemStateChanged={(item, state) => {\r\n if (state) {\r\n setActiveItemId(item);\r\n } else if (item == activeItem) setActiveItemId('');\r\n }}\r\n item={item as MenuNavigationItemTypeDesktopGroup}\r\n dropdownMenusOpenedArray={dropdownMenusOpenedArray}\r\n index={index + 1}\r\n topLevel={true}\r\n />\r\n </div>\r\n );\r\n }\r\n };\r\n\r\n\r\n const extended = dropdownMenusOpenedArray.current.find((x) => x == ExtendedMenuOption);\r\n const extendedSectionKeyHandler = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n if (event.key == 'Enter' \|\| event.code == 'Space') {\r\n event.stopPropagation();\r\n\r\n dropdownMenusOpenedArray.current = [ExtendedMenuOption];\r\n forceUpdate({});\r\n }\r\n };\r\n\r\n return (\r\n <NavContainer role=\"navigation\" className=\"GlobalNavigationMainMenu\" ref={mainMenuRef} onKeyDown={onKeyDownTop}>\r\n {items?.map(renderItem)}\r\n {items.length + 1 > numberOfItemsAllowed && (\r\n <ExtendedSection\r\n onKeyDown={(event) => extendedSectionKeyHandler(event)}\r\n onMouseEnter={(event) => onMouseEnter(event, ExtendedMenuOption)}\r\n onMouseLeave={(event) => onMouseLeave(event, ExtendedMenuOption)}>\r\n <IconButton\r\n id={ExtendedMenuOption + '_parentOption'}\r\n aria-expanded={Boolean(extended)}\r\n aria-activedescendant={checkIfContainsItem({ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }, activeItem) ? activeItem : ''}\r\n aria-controls={ExtendedMenuOption}\r\n role=\"listbox\"\r\n \r\n ref={menuButtonRef} variant={'secondary'} shape={'circular'} action={() => {}}>\r\n <SystemIcons.MoreHorizontal size=\"24px\"/>\r\n </IconButton>\r\n <SubMenu\r\n ariaLabelledBy={ExtendedMenuOption + '_parentOption'}\r\n activeItemId={activeItem}\r\n onItemFocused={setFocusedItemId}\r\n focusedItemId={focusedItemId}\r\n ref={extendedMenuOptionRef}\r\n onItemStateChanged={(item, state) => {\r\n if (state) setActiveItemId(item);\r\n else if (item == activeItem) setActiveItemId('');\r\n }}\r\n nestPath={[ExtendedMenuOption]}\r\n item={{ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }}\r\n topLevel={true}\r\n index={0}\r\n dropdownMenusOpenedArray={dropdownMenusOpenedArray}\r\n />\r\n </ExtendedSection>\r\n )}\r\n </NavContainer>\r\n );\r\n};\r\n\r\nexport default MainMenu;\r\n"],"mappings":"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"}
1	+ {"version":3,"file":"MainMenu.cjs","names":["NavContainer","styled","div","BREAKPOINTS","MEDIUM","NavItemDiv","LARGE","NavButton","button","COLORS","white","ExtendedMenuWrapper","props","floatRight","ExtendedSection","SubMenuWrapper","Menu","topLevel","ExtendedMenuOption","MainMenu","items","rightSideRef","menuButtonRef","React","useRef","dropdownMenusOpenedArray","mainMenuRef","useState","numberOfItemsAllowed","setNumberOfItemsAllowed","subMenuRefs","setAllSubMenuRefs","extendedMenuOptionRef","createRef","useEffect","map","x","type","undefined","forceUpdate","activeItem","setActiveItemId","focusedItemId","setFocusedItemId","widthOfItem","recalculateNumberOfItemsAllowed","current","number","Math","floor","offsetLeft","onMouseLeave","event","id","filter","onMouseEnter","existingRefForId","find","window","addEventListener","removeEventListener","length","onFocus","onKeyDownTop","key","renderItem","item","index","icon","to","exact","disabled","external","action","label","note","pinned","rest","defaultOnMouseDownHandler","NavLink","e","existingRef","onClick","onKeyDown","code","containsActiveItem","checkIfContainsItem","position","Boolean","state","extended","extendedSectionKeyHandler","stopPropagation","slice","console","log"],"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { NavLink, useLocation } from 'react-router-dom';\r\nimport styled from 'styled-components';\r\nimport { NavItem } from '../../NavItem';\r\nimport {SystemIcons} from '../../icons';\r\nimport { COLORS, BREAKPOINTS } from '../../styles';\r\nimport { Menu } from './ExtendedMainMenu';\r\nimport { SubMenu } from './SubMenu';\r\nimport { IconButton } from '../../Button';\r\nimport { defaultOnMouseDownHandler } from '../../common';\r\nimport { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';\r\nimport { NavItemDiv } from '../../NavItem/NavItem';\r\nimport { checkIfContainsItem } from '../utils';\r\n\r\nconst NavContainer = styled.div`\r\n display: none;\r\n flex-grow: 1;\r\n justify-content: flex-start;\r\n align-items: center;\r\n \r\n padding: 0 16px;\r\n\r\n ${BREAKPOINTS.MEDIUM} {\r\n display: flex;\r\n }\r\n \r\n ${NavItemDiv} {\r\n cursor: pointer;\r\n }\r\n ${BREAKPOINTS.LARGE} {\r\n padding: 0 32px;\r\n }\r\n\r\n a {\r\n text-decoration: none;\r\n }\r\n`;\r\n\r\nconst NavButton = styled.button`\r\n background: ${COLORS.white};\r\n border: 0;\r\n`;\r\n\r\ninterface ExtendedMenuWrapperProps {\r\n floatRight: boolean;\r\n}\r\n\r\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\r\n display: flex;\r\n margin-left: ${(props) => (props.floatRight ? 'auto' : 'unset')};\r\n\r\n position: absolute;\r\n flex-direction: column;\r\n left: 290px;\r\n top: 22px;\r\n\r\n height: 0;\r\n width: 0;\r\n\r\n &:focus-within,\r\n &:hover,\r\n &.open {\r\n background: ${COLORS.white};\r\n }\r\n`;\r\n\r\nconst ExtendedSection = styled.div`\r\n position: relative;\r\n`;\r\n\r\nconst SubMenuWrapper = styled.div<{ topLevel: boolean }>`\r\n ${Menu} {\r\n top: ${(props) => (props.topLevel ? '100%' : '0px')};\r\n left: ${(props) => (props.topLevel ? '0px' : 'calc(100% - 12px)')};\r\n }\r\n\r\n button {\r\n padding-left: 0px;\r\n }\r\n`;\r\n\r\nconst ExtendedMenuOption = 'extendedOption';\r\n\r\ntype Props = {\r\n items: (MenuNavigationItemTypeItem \| MenuNavigationItemTypeDesktopGroup)[];\r\n rightSideRef?: React.RefObject<HTMLDivElement> \| null \| undefined;\r\n};\r\n\r\nconst MainMenu = ({ items, rightSideRef }: Props): React.ReactElement<Props> => {\r\n const menuButtonRef = React.useRef<HTMLButtonElement>(null);\r\n //we have to use refs instead of 'state' here, because when onmouseleave is triggered for multiple nested divs, state update is not being updated in between\r\n const dropdownMenusOpenedArray = React.useRef<string[]>([]);\r\n const mainMenuRef: React.RefObject<HTMLDivElement> \| null \| undefined = React.useRef(null);\r\n const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\r\n const [subMenuRefs, setAllSubMenuRefs] = React.useState<(React.RefObject<HTMLUListElement> \| undefined)[]>([]);\r\n const extendedMenuOptionRef = React.createRef<HTMLUListElement>();\r\n\r\n React.useEffect(() => {\r\n setAllSubMenuRefs(items.map((x) => (x.type == 'desktopgroup' ? React.createRef<HTMLUListElement>() : undefined)));\r\n }, [items]);\r\n\r\n const [, forceUpdate] = React.useState({});\r\n const [activeItem, setActiveItemId] = React.useState<string>('');\r\n const [focusedItemId, setFocusedItemId] = React.useState<string>('');\r\n\r\n const widthOfItem = 120;\r\n const recalculateNumberOfItemsAllowed = () => {\r\n if (rightSideRef?.current && mainMenuRef?.current) {\r\n const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\r\n if (number !== numberOfItemsAllowed) {\r\n setNumberOfItemsAllowed(number);\r\n }\r\n }\r\n };\r\n\r\n const onMouseLeave = (event: any, id: string) => {\r\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current.filter((x) => x != id)];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n };\r\n\r\n const onMouseEnter = (event: any, id: string) => {\r\n const existingRefForId = dropdownMenusOpenedArray.current.find((x) => x == id);\r\n if (existingRefForId == null) {\r\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, id];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n }\r\n };\r\n\r\n React.useEffect(() => {\r\n recalculateNumberOfItemsAllowed();\r\n // Bind the event listener\r\n window.addEventListener('resize', recalculateNumberOfItemsAllowed);\r\n return () => {\r\n // Unbind the event listener on clean up\r\n window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\r\n };\r\n }, []);\r\n\r\n React.useEffect(() => {\r\n recalculateNumberOfItemsAllowed();\r\n }, [items.length]);\r\n\r\n const onFocus = (event: React.FocusEvent<HTMLDivElement>) => {\r\n //no open dropdowns if top level was entered\r\n dropdownMenusOpenedArray.current = [];\r\n forceUpdate({});\r\n };\r\n\r\n const onKeyDownTop = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n if (event.key === 'Escape' \|\| event.key === 'Esc') {\r\n dropdownMenusOpenedArray.current = [];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n }\r\n };\r\n\r\n const renderItem = (item: MenuNavigationItemTypeItem \| MenuNavigationItemTypeDesktopGroup, index: number) => {\r\n if (index > numberOfItemsAllowed - 2) return null;\r\n if (item.type != 'desktopgroup') {\r\n const { icon, to, exact, disabled, external, action, label, note, pinned, ...rest } = item as MenuNavigationItemTypeItem;\r\n return item?.disabled ? (\r\n <NavItem as={NavButton} className=\"disabled\" key={item.label} onMouseDown={defaultOnMouseDownHandler}>\r\n {item?.label}\r\n </NavItem>\r\n ) : (\r\n <NavItem as={NavLink} onFocus={onFocus} to={to \|\| ''} key={label} onMouseDown={defaultOnMouseDownHandler} onClick={(e: React.MouseEvent) => action && action(e)} {...rest}>\r\n {item?.label}\r\n </NavItem>\r\n );\r\n } else {\r\n const existingRef = dropdownMenusOpenedArray.current.find((x) => x == item.id);\r\n const onClick = () => {\r\n if (existingRef == null) {\r\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n }\r\n };\r\n const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n if (event.key == 'Enter' \|\| event.code == 'Space') {\r\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n } \r\n };\r\n\r\n const containsActiveItem = checkIfContainsItem(item, activeItem);\r\n return (\r\n <div\r\n style={{ position: 'relative' }}\r\n onMouseEnter={(event) => onMouseEnter(event, item.id ?? '')}\r\n onMouseLeave={(event) => onMouseLeave(event, item.id ?? '')}>\r\n <NavItem\r\n id={item.id + '_parentOption'}\r\n aria-expanded={Boolean(existingRef)}\r\n aria-activedescendant={containsActiveItem ? activeItem : ''}\r\n aria-controls={item.id}\r\n role=\"listbox\"\r\n onFocus={onFocus}\r\n onKeyDown={onKeyDown}\r\n tabIndex={0}\r\n className={existingRef != null \|\| checkIfContainsItem(item, activeItem) ? 'active' : ''}\r\n key={item.label}\r\n to={null}\r\n onClick={onClick}>\r\n {item?.label} <SystemIcons.ArrowDropDown size=\"24px\" />\r\n </NavItem>\r\n <SubMenu\r\n ariaLabelledBy={item.id + '_parentOption'}\r\n ref={subMenuRefs[index]}\r\n onItemFocused={setFocusedItemId}\r\n focusedItemId={focusedItemId}\r\n activeItemId={activeItem}\r\n nestPath={[item.id]}\r\n onItemStateChanged={(item, state) => {\r\n if (state) {\r\n setActiveItemId(item);\r\n } else if (item == activeItem) setActiveItemId('');\r\n }}\r\n item={item as MenuNavigationItemTypeDesktopGroup}\r\n dropdownMenusOpenedArray={dropdownMenusOpenedArray}\r\n index={index + 1}\r\n topLevel={true}\r\n />\r\n </div>\r\n );\r\n }\r\n };\r\n\r\n\r\n const extended = dropdownMenusOpenedArray.current.find((x) => x == ExtendedMenuOption);\r\n const extendedSectionKeyHandler = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n if (event.key == 'Enter' \|\| event.code == 'Space') {\r\n event.stopPropagation();\r\n\r\n dropdownMenusOpenedArray.current = [ExtendedMenuOption];\r\n forceUpdate({});\r\n }\r\n };\r\n\r\n return (\r\n <NavContainer role=\"navigation\" className=\"GlobalNavigationMainMenu\" ref={mainMenuRef} onKeyDown={onKeyDownTop}>\r\n {items?.map(renderItem)}\r\n {items.length + 1 > numberOfItemsAllowed && (\r\n <ExtendedSection\r\n onKeyDown={(event) => extendedSectionKeyHandler(event)}\r\n onMouseEnter={(event) => onMouseEnter(event, ExtendedMenuOption)}\r\n onMouseLeave={(event) => onMouseLeave(event, ExtendedMenuOption)}>\r\n <IconButton\r\n id={ExtendedMenuOption + '_parentOption'}\r\n aria-expanded={Boolean(extended)}\r\n aria-activedescendant={checkIfContainsItem({ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }, activeItem) ? activeItem : ''}\r\n aria-controls={ExtendedMenuOption}\r\n role=\"listbox\"\r\n \r\n ref={menuButtonRef} variant={'secondary'} shape={'circular'} action={() => {}}>\r\n <SystemIcons.MoreHorizontal size=\"24px\"/>\r\n </IconButton>\r\n <SubMenu\r\n ariaLabelledBy={ExtendedMenuOption + '_parentOption'}\r\n activeItemId={activeItem}\r\n onItemFocused={setFocusedItemId}\r\n focusedItemId={focusedItemId}\r\n ref={extendedMenuOptionRef}\r\n onItemStateChanged={(item, state) => {\r\n console.log(item);\r\n console.log(state);\r\n if (state) setActiveItemId(item);\r\n else if (item == activeItem) setActiveItemId('');\r\n }}\r\n nestPath={[ExtendedMenuOption]}\r\n item={{ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }}\r\n topLevel={true}\r\n index={0}\r\n dropdownMenusOpenedArray={dropdownMenusOpenedArray}\r\n />\r\n </ExtendedSection>\r\n )}\r\n </NavContainer>\r\n );\r\n};\r\n\r\nexport default MainMenu;\r\n"],"mappings":"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"}

package/dist/GlobalNavigationBar/desktop/MainMenu.js CHANGED Viewed

@@ -261,6 +261,8 @@ var MainMenu = function MainMenu(_ref) {
         focusedItemId: focusedItemId,
         ref: extendedMenuOptionRef,
         onItemStateChanged: function onItemStateChanged(item, state) {
+          console.log(item);
+          console.log(state);
           if (state) setActiveItemId(item);else if (item == activeItem) setActiveItemId('');
         },
         nestPath: [ExtendedMenuOption],

package/dist/GlobalNavigationBar/desktop/MainMenu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MainMenu.js","names":["React","NavLink","styled","NavItem","SystemIcons","COLORS","BREAKPOINTS","Menu","SubMenu","IconButton","defaultOnMouseDownHandler","NavItemDiv","checkIfContainsItem","NavContainer","div","MEDIUM","LARGE","NavButton","button","white","ExtendedMenuWrapper","props","floatRight","ExtendedSection","SubMenuWrapper","topLevel","ExtendedMenuOption","MainMenu","items","rightSideRef","menuButtonRef","useRef","dropdownMenusOpenedArray","mainMenuRef","useState","numberOfItemsAllowed","setNumberOfItemsAllowed","subMenuRefs","setAllSubMenuRefs","extendedMenuOptionRef","createRef","useEffect","map","x","type","undefined","forceUpdate","activeItem","setActiveItemId","focusedItemId","setFocusedItemId","widthOfItem","recalculateNumberOfItemsAllowed","current","number","Math","floor","offsetLeft","onMouseLeave","event","id","filter","onMouseEnter","existingRefForId","find","window","addEventListener","removeEventListener","length","onFocus","onKeyDownTop","key","renderItem","item","index","icon","to","exact","disabled","external","action","label","note","pinned","rest","e","existingRef","onClick","onKeyDown","code","containsActiveItem","position","Boolean","state","extended","extendedSectionKeyHandler","stopPropagation","slice"],"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { NavLink, useLocation } from 'react-router-dom';\r\nimport styled from 'styled-components';\r\nimport { NavItem } from '../../NavItem';\r\nimport {SystemIcons} from '../../icons';\r\nimport { COLORS, BREAKPOINTS } from '../../styles';\r\nimport { Menu } from './ExtendedMainMenu';\r\nimport { SubMenu } from './SubMenu';\r\nimport { IconButton } from '../../Button';\r\nimport { defaultOnMouseDownHandler } from '../../common';\r\nimport { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';\r\nimport { NavItemDiv } from '../../NavItem/NavItem';\r\nimport { checkIfContainsItem } from '../utils';\r\n\r\nconst NavContainer = styled.div`\r\n display: none;\r\n flex-grow: 1;\r\n justify-content: flex-start;\r\n align-items: center;\r\n \r\n padding: 0 16px;\r\n\r\n ${BREAKPOINTS.MEDIUM} {\r\n display: flex;\r\n }\r\n \r\n ${NavItemDiv} {\r\n cursor: pointer;\r\n }\r\n ${BREAKPOINTS.LARGE} {\r\n padding: 0 32px;\r\n }\r\n\r\n a {\r\n text-decoration: none;\r\n }\r\n`;\r\n\r\nconst NavButton = styled.button`\r\n background: ${COLORS.white};\r\n border: 0;\r\n`;\r\n\r\ninterface ExtendedMenuWrapperProps {\r\n floatRight: boolean;\r\n}\r\n\r\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\r\n display: flex;\r\n margin-left: ${(props) => (props.floatRight ? 'auto' : 'unset')};\r\n\r\n position: absolute;\r\n flex-direction: column;\r\n left: 290px;\r\n top: 22px;\r\n\r\n height: 0;\r\n width: 0;\r\n\r\n &:focus-within,\r\n &:hover,\r\n &.open {\r\n background: ${COLORS.white};\r\n }\r\n`;\r\n\r\nconst ExtendedSection = styled.div`\r\n position: relative;\r\n`;\r\n\r\nconst SubMenuWrapper = styled.div<{ topLevel: boolean }>`\r\n ${Menu} {\r\n top: ${(props) => (props.topLevel ? '100%' : '0px')};\r\n left: ${(props) => (props.topLevel ? '0px' : 'calc(100% - 12px)')};\r\n }\r\n\r\n button {\r\n padding-left: 0px;\r\n }\r\n`;\r\n\r\nconst ExtendedMenuOption = 'extendedOption';\r\n\r\ntype Props = {\r\n items: (MenuNavigationItemTypeItem \| MenuNavigationItemTypeDesktopGroup)[];\r\n rightSideRef?: React.RefObject<HTMLDivElement> \| null \| undefined;\r\n};\r\n\r\nconst MainMenu = ({ items, rightSideRef }: Props): React.ReactElement<Props> => {\r\n const menuButtonRef = React.useRef<HTMLButtonElement>(null);\r\n //we have to use refs instead of 'state' here, because when onmouseleave is triggered for multiple nested divs, state update is not being updated in between\r\n const dropdownMenusOpenedArray = React.useRef<string[]>([]);\r\n const mainMenuRef: React.RefObject<HTMLDivElement> \| null \| undefined = React.useRef(null);\r\n const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\r\n const [subMenuRefs, setAllSubMenuRefs] = React.useState<(React.RefObject<HTMLUListElement> \| undefined)[]>([]);\r\n const extendedMenuOptionRef = React.createRef<HTMLUListElement>();\r\n\r\n React.useEffect(() => {\r\n setAllSubMenuRefs(items.map((x) => (x.type == 'desktopgroup' ? React.createRef<HTMLUListElement>() : undefined)));\r\n }, [items]);\r\n\r\n const [, forceUpdate] = React.useState({});\r\n const [activeItem, setActiveItemId] = React.useState<string>('');\r\n const [focusedItemId, setFocusedItemId] = React.useState<string>('');\r\n\r\n const widthOfItem = 120;\r\n const recalculateNumberOfItemsAllowed = () => {\r\n if (rightSideRef?.current && mainMenuRef?.current) {\r\n const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\r\n if (number !== numberOfItemsAllowed) {\r\n setNumberOfItemsAllowed(number);\r\n }\r\n }\r\n };\r\n\r\n const onMouseLeave = (event: any, id: string) => {\r\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current.filter((x) => x != id)];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n };\r\n\r\n const onMouseEnter = (event: any, id: string) => {\r\n const existingRefForId = dropdownMenusOpenedArray.current.find((x) => x == id);\r\n if (existingRefForId == null) {\r\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, id];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n }\r\n };\r\n\r\n React.useEffect(() => {\r\n recalculateNumberOfItemsAllowed();\r\n // Bind the event listener\r\n window.addEventListener('resize', recalculateNumberOfItemsAllowed);\r\n return () => {\r\n // Unbind the event listener on clean up\r\n window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\r\n };\r\n }, []);\r\n\r\n React.useEffect(() => {\r\n recalculateNumberOfItemsAllowed();\r\n }, [items.length]);\r\n\r\n const onFocus = (event: React.FocusEvent<HTMLDivElement>) => {\r\n //no open dropdowns if top level was entered\r\n dropdownMenusOpenedArray.current = [];\r\n forceUpdate({});\r\n };\r\n\r\n const onKeyDownTop = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n if (event.key === 'Escape' \|\| event.key === 'Esc') {\r\n dropdownMenusOpenedArray.current = [];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n }\r\n };\r\n\r\n const renderItem = (item: MenuNavigationItemTypeItem \| MenuNavigationItemTypeDesktopGroup, index: number) => {\r\n if (index > numberOfItemsAllowed - 2) return null;\r\n if (item.type != 'desktopgroup') {\r\n const { icon, to, exact, disabled, external, action, label, note, pinned, ...rest } = item as MenuNavigationItemTypeItem;\r\n return item?.disabled ? (\r\n <NavItem as={NavButton} className=\"disabled\" key={item.label} onMouseDown={defaultOnMouseDownHandler}>\r\n {item?.label}\r\n </NavItem>\r\n ) : (\r\n <NavItem as={NavLink} onFocus={onFocus} to={to \|\| ''} key={label} onMouseDown={defaultOnMouseDownHandler} onClick={(e: React.MouseEvent) => action && action(e)} {...rest}>\r\n {item?.label}\r\n </NavItem>\r\n );\r\n } else {\r\n const existingRef = dropdownMenusOpenedArray.current.find((x) => x == item.id);\r\n const onClick = () => {\r\n if (existingRef == null) {\r\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n }\r\n };\r\n const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n if (event.key == 'Enter' \|\| event.code == 'Space') {\r\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n } \r\n };\r\n\r\n const containsActiveItem = checkIfContainsItem(item, activeItem);\r\n return (\r\n <div\r\n style={{ position: 'relative' }}\r\n onMouseEnter={(event) => onMouseEnter(event, item.id ?? '')}\r\n onMouseLeave={(event) => onMouseLeave(event, item.id ?? '')}>\r\n <NavItem\r\n id={item.id + '_parentOption'}\r\n aria-expanded={Boolean(existingRef)}\r\n aria-activedescendant={containsActiveItem ? activeItem : ''}\r\n aria-controls={item.id}\r\n role=\"listbox\"\r\n onFocus={onFocus}\r\n onKeyDown={onKeyDown}\r\n tabIndex={0}\r\n className={existingRef != null \|\| checkIfContainsItem(item, activeItem) ? 'active' : ''}\r\n key={item.label}\r\n to={null}\r\n onClick={onClick}>\r\n {item?.label} <SystemIcons.ArrowDropDown size=\"24px\" />\r\n </NavItem>\r\n <SubMenu\r\n ariaLabelledBy={item.id + '_parentOption'}\r\n ref={subMenuRefs[index]}\r\n onItemFocused={setFocusedItemId}\r\n focusedItemId={focusedItemId}\r\n activeItemId={activeItem}\r\n nestPath={[item.id]}\r\n onItemStateChanged={(item, state) => {\r\n if (state) {\r\n setActiveItemId(item);\r\n } else if (item == activeItem) setActiveItemId('');\r\n }}\r\n item={item as MenuNavigationItemTypeDesktopGroup}\r\n dropdownMenusOpenedArray={dropdownMenusOpenedArray}\r\n index={index + 1}\r\n topLevel={true}\r\n />\r\n </div>\r\n );\r\n }\r\n };\r\n\r\n\r\n const extended = dropdownMenusOpenedArray.current.find((x) => x == ExtendedMenuOption);\r\n const extendedSectionKeyHandler = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n if (event.key == 'Enter' \|\| event.code == 'Space') {\r\n event.stopPropagation();\r\n\r\n dropdownMenusOpenedArray.current = [ExtendedMenuOption];\r\n forceUpdate({});\r\n }\r\n };\r\n\r\n return (\r\n <NavContainer role=\"navigation\" className=\"GlobalNavigationMainMenu\" ref={mainMenuRef} onKeyDown={onKeyDownTop}>\r\n {items?.map(renderItem)}\r\n {items.length + 1 > numberOfItemsAllowed && (\r\n <ExtendedSection\r\n onKeyDown={(event) => extendedSectionKeyHandler(event)}\r\n onMouseEnter={(event) => onMouseEnter(event, ExtendedMenuOption)}\r\n onMouseLeave={(event) => onMouseLeave(event, ExtendedMenuOption)}>\r\n <IconButton\r\n id={ExtendedMenuOption + '_parentOption'}\r\n aria-expanded={Boolean(extended)}\r\n aria-activedescendant={checkIfContainsItem({ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }, activeItem) ? activeItem : ''}\r\n aria-controls={ExtendedMenuOption}\r\n role=\"listbox\"\r\n \r\n ref={menuButtonRef} variant={'secondary'} shape={'circular'} action={() => {}}>\r\n <SystemIcons.MoreHorizontal size=\"24px\"/>\r\n </IconButton>\r\n <SubMenu\r\n ariaLabelledBy={ExtendedMenuOption + '_parentOption'}\r\n activeItemId={activeItem}\r\n onItemFocused={setFocusedItemId}\r\n focusedItemId={focusedItemId}\r\n ref={extendedMenuOptionRef}\r\n onItemStateChanged={(item, state) => {\r\n if (state) setActiveItemId(item);\r\n else if (item == activeItem) setActiveItemId('');\r\n }}\r\n nestPath={[ExtendedMenuOption]}\r\n item={{ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }}\r\n topLevel={true}\r\n index={0}\r\n dropdownMenusOpenedArray={dropdownMenusOpenedArray}\r\n />\r\n </ExtendedSection>\r\n )}\r\n </NavContainer>\r\n );\r\n};\r\n\r\nexport default MainMenu;\r\n"],"mappings":"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"}
1	+ {"version":3,"file":"MainMenu.js","names":["React","NavLink","styled","NavItem","SystemIcons","COLORS","BREAKPOINTS","Menu","SubMenu","IconButton","defaultOnMouseDownHandler","NavItemDiv","checkIfContainsItem","NavContainer","div","MEDIUM","LARGE","NavButton","button","white","ExtendedMenuWrapper","props","floatRight","ExtendedSection","SubMenuWrapper","topLevel","ExtendedMenuOption","MainMenu","items","rightSideRef","menuButtonRef","useRef","dropdownMenusOpenedArray","mainMenuRef","useState","numberOfItemsAllowed","setNumberOfItemsAllowed","subMenuRefs","setAllSubMenuRefs","extendedMenuOptionRef","createRef","useEffect","map","x","type","undefined","forceUpdate","activeItem","setActiveItemId","focusedItemId","setFocusedItemId","widthOfItem","recalculateNumberOfItemsAllowed","current","number","Math","floor","offsetLeft","onMouseLeave","event","id","filter","onMouseEnter","existingRefForId","find","window","addEventListener","removeEventListener","length","onFocus","onKeyDownTop","key","renderItem","item","index","icon","to","exact","disabled","external","action","label","note","pinned","rest","e","existingRef","onClick","onKeyDown","code","containsActiveItem","position","Boolean","state","extended","extendedSectionKeyHandler","stopPropagation","slice","console","log"],"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { NavLink, useLocation } from 'react-router-dom';\r\nimport styled from 'styled-components';\r\nimport { NavItem } from '../../NavItem';\r\nimport {SystemIcons} from '../../icons';\r\nimport { COLORS, BREAKPOINTS } from '../../styles';\r\nimport { Menu } from './ExtendedMainMenu';\r\nimport { SubMenu } from './SubMenu';\r\nimport { IconButton } from '../../Button';\r\nimport { defaultOnMouseDownHandler } from '../../common';\r\nimport { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';\r\nimport { NavItemDiv } from '../../NavItem/NavItem';\r\nimport { checkIfContainsItem } from '../utils';\r\n\r\nconst NavContainer = styled.div`\r\n display: none;\r\n flex-grow: 1;\r\n justify-content: flex-start;\r\n align-items: center;\r\n \r\n padding: 0 16px;\r\n\r\n ${BREAKPOINTS.MEDIUM} {\r\n display: flex;\r\n }\r\n \r\n ${NavItemDiv} {\r\n cursor: pointer;\r\n }\r\n ${BREAKPOINTS.LARGE} {\r\n padding: 0 32px;\r\n }\r\n\r\n a {\r\n text-decoration: none;\r\n }\r\n`;\r\n\r\nconst NavButton = styled.button`\r\n background: ${COLORS.white};\r\n border: 0;\r\n`;\r\n\r\ninterface ExtendedMenuWrapperProps {\r\n floatRight: boolean;\r\n}\r\n\r\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\r\n display: flex;\r\n margin-left: ${(props) => (props.floatRight ? 'auto' : 'unset')};\r\n\r\n position: absolute;\r\n flex-direction: column;\r\n left: 290px;\r\n top: 22px;\r\n\r\n height: 0;\r\n width: 0;\r\n\r\n &:focus-within,\r\n &:hover,\r\n &.open {\r\n background: ${COLORS.white};\r\n }\r\n`;\r\n\r\nconst ExtendedSection = styled.div`\r\n position: relative;\r\n`;\r\n\r\nconst SubMenuWrapper = styled.div<{ topLevel: boolean }>`\r\n ${Menu} {\r\n top: ${(props) => (props.topLevel ? '100%' : '0px')};\r\n left: ${(props) => (props.topLevel ? '0px' : 'calc(100% - 12px)')};\r\n }\r\n\r\n button {\r\n padding-left: 0px;\r\n }\r\n`;\r\n\r\nconst ExtendedMenuOption = 'extendedOption';\r\n\r\ntype Props = {\r\n items: (MenuNavigationItemTypeItem \| MenuNavigationItemTypeDesktopGroup)[];\r\n rightSideRef?: React.RefObject<HTMLDivElement> \| null \| undefined;\r\n};\r\n\r\nconst MainMenu = ({ items, rightSideRef }: Props): React.ReactElement<Props> => {\r\n const menuButtonRef = React.useRef<HTMLButtonElement>(null);\r\n //we have to use refs instead of 'state' here, because when onmouseleave is triggered for multiple nested divs, state update is not being updated in between\r\n const dropdownMenusOpenedArray = React.useRef<string[]>([]);\r\n const mainMenuRef: React.RefObject<HTMLDivElement> \| null \| undefined = React.useRef(null);\r\n const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\r\n const [subMenuRefs, setAllSubMenuRefs] = React.useState<(React.RefObject<HTMLUListElement> \| undefined)[]>([]);\r\n const extendedMenuOptionRef = React.createRef<HTMLUListElement>();\r\n\r\n React.useEffect(() => {\r\n setAllSubMenuRefs(items.map((x) => (x.type == 'desktopgroup' ? React.createRef<HTMLUListElement>() : undefined)));\r\n }, [items]);\r\n\r\n const [, forceUpdate] = React.useState({});\r\n const [activeItem, setActiveItemId] = React.useState<string>('');\r\n const [focusedItemId, setFocusedItemId] = React.useState<string>('');\r\n\r\n const widthOfItem = 120;\r\n const recalculateNumberOfItemsAllowed = () => {\r\n if (rightSideRef?.current && mainMenuRef?.current) {\r\n const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\r\n if (number !== numberOfItemsAllowed) {\r\n setNumberOfItemsAllowed(number);\r\n }\r\n }\r\n };\r\n\r\n const onMouseLeave = (event: any, id: string) => {\r\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current.filter((x) => x != id)];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n };\r\n\r\n const onMouseEnter = (event: any, id: string) => {\r\n const existingRefForId = dropdownMenusOpenedArray.current.find((x) => x == id);\r\n if (existingRefForId == null) {\r\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, id];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n }\r\n };\r\n\r\n React.useEffect(() => {\r\n recalculateNumberOfItemsAllowed();\r\n // Bind the event listener\r\n window.addEventListener('resize', recalculateNumberOfItemsAllowed);\r\n return () => {\r\n // Unbind the event listener on clean up\r\n window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\r\n };\r\n }, []);\r\n\r\n React.useEffect(() => {\r\n recalculateNumberOfItemsAllowed();\r\n }, [items.length]);\r\n\r\n const onFocus = (event: React.FocusEvent<HTMLDivElement>) => {\r\n //no open dropdowns if top level was entered\r\n dropdownMenusOpenedArray.current = [];\r\n forceUpdate({});\r\n };\r\n\r\n const onKeyDownTop = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n if (event.key === 'Escape' \|\| event.key === 'Esc') {\r\n dropdownMenusOpenedArray.current = [];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n }\r\n };\r\n\r\n const renderItem = (item: MenuNavigationItemTypeItem \| MenuNavigationItemTypeDesktopGroup, index: number) => {\r\n if (index > numberOfItemsAllowed - 2) return null;\r\n if (item.type != 'desktopgroup') {\r\n const { icon, to, exact, disabled, external, action, label, note, pinned, ...rest } = item as MenuNavigationItemTypeItem;\r\n return item?.disabled ? (\r\n <NavItem as={NavButton} className=\"disabled\" key={item.label} onMouseDown={defaultOnMouseDownHandler}>\r\n {item?.label}\r\n </NavItem>\r\n ) : (\r\n <NavItem as={NavLink} onFocus={onFocus} to={to \|\| ''} key={label} onMouseDown={defaultOnMouseDownHandler} onClick={(e: React.MouseEvent) => action && action(e)} {...rest}>\r\n {item?.label}\r\n </NavItem>\r\n );\r\n } else {\r\n const existingRef = dropdownMenusOpenedArray.current.find((x) => x == item.id);\r\n const onClick = () => {\r\n if (existingRef == null) {\r\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n }\r\n };\r\n const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n if (event.key == 'Enter' \|\| event.code == 'Space') {\r\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\r\n //just trigger rerendering\r\n forceUpdate({});\r\n } \r\n };\r\n\r\n const containsActiveItem = checkIfContainsItem(item, activeItem);\r\n return (\r\n <div\r\n style={{ position: 'relative' }}\r\n onMouseEnter={(event) => onMouseEnter(event, item.id ?? '')}\r\n onMouseLeave={(event) => onMouseLeave(event, item.id ?? '')}>\r\n <NavItem\r\n id={item.id + '_parentOption'}\r\n aria-expanded={Boolean(existingRef)}\r\n aria-activedescendant={containsActiveItem ? activeItem : ''}\r\n aria-controls={item.id}\r\n role=\"listbox\"\r\n onFocus={onFocus}\r\n onKeyDown={onKeyDown}\r\n tabIndex={0}\r\n className={existingRef != null \|\| checkIfContainsItem(item, activeItem) ? 'active' : ''}\r\n key={item.label}\r\n to={null}\r\n onClick={onClick}>\r\n {item?.label} <SystemIcons.ArrowDropDown size=\"24px\" />\r\n </NavItem>\r\n <SubMenu\r\n ariaLabelledBy={item.id + '_parentOption'}\r\n ref={subMenuRefs[index]}\r\n onItemFocused={setFocusedItemId}\r\n focusedItemId={focusedItemId}\r\n activeItemId={activeItem}\r\n nestPath={[item.id]}\r\n onItemStateChanged={(item, state) => {\r\n if (state) {\r\n setActiveItemId(item);\r\n } else if (item == activeItem) setActiveItemId('');\r\n }}\r\n item={item as MenuNavigationItemTypeDesktopGroup}\r\n dropdownMenusOpenedArray={dropdownMenusOpenedArray}\r\n index={index + 1}\r\n topLevel={true}\r\n />\r\n </div>\r\n );\r\n }\r\n };\r\n\r\n\r\n const extended = dropdownMenusOpenedArray.current.find((x) => x == ExtendedMenuOption);\r\n const extendedSectionKeyHandler = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n if (event.key == 'Enter' \|\| event.code == 'Space') {\r\n event.stopPropagation();\r\n\r\n dropdownMenusOpenedArray.current = [ExtendedMenuOption];\r\n forceUpdate({});\r\n }\r\n };\r\n\r\n return (\r\n <NavContainer role=\"navigation\" className=\"GlobalNavigationMainMenu\" ref={mainMenuRef} onKeyDown={onKeyDownTop}>\r\n {items?.map(renderItem)}\r\n {items.length + 1 > numberOfItemsAllowed && (\r\n <ExtendedSection\r\n onKeyDown={(event) => extendedSectionKeyHandler(event)}\r\n onMouseEnter={(event) => onMouseEnter(event, ExtendedMenuOption)}\r\n onMouseLeave={(event) => onMouseLeave(event, ExtendedMenuOption)}>\r\n <IconButton\r\n id={ExtendedMenuOption + '_parentOption'}\r\n aria-expanded={Boolean(extended)}\r\n aria-activedescendant={checkIfContainsItem({ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }, activeItem) ? activeItem : ''}\r\n aria-controls={ExtendedMenuOption}\r\n role=\"listbox\"\r\n \r\n ref={menuButtonRef} variant={'secondary'} shape={'circular'} action={() => {}}>\r\n <SystemIcons.MoreHorizontal size=\"24px\"/>\r\n </IconButton>\r\n <SubMenu\r\n ariaLabelledBy={ExtendedMenuOption + '_parentOption'}\r\n activeItemId={activeItem}\r\n onItemFocused={setFocusedItemId}\r\n focusedItemId={focusedItemId}\r\n ref={extendedMenuOptionRef}\r\n onItemStateChanged={(item, state) => {\r\n console.log(item);\r\n console.log(state);\r\n if (state) setActiveItemId(item);\r\n else if (item == activeItem) setActiveItemId('');\r\n }}\r\n nestPath={[ExtendedMenuOption]}\r\n item={{ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }}\r\n topLevel={true}\r\n index={0}\r\n dropdownMenusOpenedArray={dropdownMenusOpenedArray}\r\n />\r\n </ExtendedSection>\r\n )}\r\n </NavContainer>\r\n );\r\n};\r\n\r\nexport default MainMenu;\r\n"],"mappings":"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"}

package/dist/GlobalNavigationBar/desktop/UnifedSearchComponent.cjs ADDED Viewed

@@ -0,0 +1,100 @@
+"use strict";
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var React = _interopRequireWildcard(require("react"));
+var _InputFields = require("../../InputFields");
+var _types = require("../../types");
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _UnifedSearchServiceApi = _interopRequireDefault(require("./UnifedSearchServiceApi"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _templateObject;
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var Wrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n"])));
+var SearchResult = /*#__PURE__*/(0, _createClass2.default)(function SearchResult() {
+  (0, _classCallCheck2.default)(this, SearchResult);
+  (0, _defineProperty2.default)(this, "title", void 0);
+  (0, _defineProperty2.default)(this, "description", void 0);
+  (0, _defineProperty2.default)(this, "price", void 0);
+  (0, _defineProperty2.default)(this, "url", void 0);
+  (0, _defineProperty2.default)(this, "imageUrl", void 0);
+  (0, _defineProperty2.default)(this, "isPublic", void 0);
+  (0, _defineProperty2.default)(this, "type", void 0);
+  (0, _defineProperty2.default)(this, "sku", void 0);
+  (0, _defineProperty2.default)(this, "language", void 0);
+});
+var UnifiedSearchComponent = function UnifiedSearchComponent(props) {
+  var _React$useState = React.useState(''),
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    searchTerm = _React$useState2[0],
+    setSearchTerm = _React$useState2[1];
+  var _React$useState3 = React.useState(false),
+    _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
+    loading = _React$useState4[0],
+    setLoading = _React$useState4[1];
+  var _React$useState5 = React.useState(),
+    _React$useState6 = (0, _slicedToArray2.default)(_React$useState5, 2),
+    results = _React$useState6[0],
+    setSearchResults = _React$useState6[1];
+  var key = props.key,
+    accessToken = props.accessToken,
+    ussBaseUrl = props.ussBaseUrl;
+  React.useEffect(function () {
+    _UnifedSearchServiceApi.default.storeJWT(accessToken);
+    _UnifedSearchServiceApi.default.storeBaseUrl(ussBaseUrl);
+  }, [accessToken, ussBaseUrl]);
+  var findIt = function findIt(event) {
+    event.preventDefault();
+    setLoading(true);
+    _UnifedSearchServiceApi.default.quickSearch(searchTerm).then(function (response) {
+      setSearchResults(response);
+    }).catch(function (error) {}).finally(function () {
+      setLoading(false);
+    });
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Wrapper, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputFields.SearchBar, {
+      id: "unifiedSearchInputField",
+      placeholder: "Enter your search term",
+      enterSearch: findIt,
+      setSearchTerm: setSearchTerm,
+      searchTerm: searchTerm,
+      removeSearch: function removeSearch() {
+        setSearchTerm('');
+      },
+      showDropdown: true,
+      dropdownButtonLoading: loading,
+      dropdownButtonAction: loading ? function () {} : undefined,
+      dropdownButtonLabel: loading ? 'Loading' : undefined,
+      dropdownButtonVariant: "tertiary",
+      searchList: results === null || results === void 0 ? void 0 : results.map(function (x) {
+        var _ref, _x$url;
+        return {
+          value: (_ref = (_x$url = x.url) !== null && _x$url !== void 0 ? _x$url : x.title) !== null && _ref !== void 0 ? _ref : "blank",
+          noteLabel: x.description,
+          displayLabel: x.title
+        };
+      }),
+      size: _types.Size.Medium
+    })
+  }, key);
+};
+UnifiedSearchComponent.propTypes = {
+  key: _propTypes.default.string.isRequired,
+  accessToken: _propTypes.default.string,
+  ussBaseUrl: _propTypes.default.string
+};
+var _default = UnifiedSearchComponent;
+exports.default = _default;
+//# sourceMappingURL=UnifedSearchComponent.cjs.map

package/dist/GlobalNavigationBar/desktop/UnifedSearchComponent.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"UnifedSearchComponent.cjs","names":["Wrapper","styled","div","SearchResult","UnifiedSearchComponent","props","React","useState","searchTerm","setSearchTerm","loading","setLoading","results","setSearchResults","key","accessToken","ussBaseUrl","useEffect","Api","storeJWT","storeBaseUrl","findIt","event","preventDefault","quickSearch","then","response","catch","error","finally","undefined","map","x","value","url","title","noteLabel","description","displayLabel","Size","Medium"],"sources":["../../../src/GlobalNavigationBar/desktop/UnifedSearchComponent.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { SearchBar } from '../../InputFields';\r\nimport { Size, ToastColor, ToastPosition } from '../../types';\r\nimport styled from 'styled-components';\r\nimport Api from './UnifedSearchServiceApi';\r\n\r\n\r\nconst Wrapper = styled.div`\r\n`;\r\n\r\nexport interface UnifiedSearchComponentProps {\r\n key: string;\r\n accessToken?: string;\r\n ussBaseUrl?: string;\r\n} \r\n\r\nclass SearchResult\r\n{\r\n title?: string;\r\n description?: string;\r\n price?: number;\r\n url?: string;\r\n imageUrl?: string;\r\n isPublic?: boolean;\r\n type?: string;\r\n sku?: string;\r\n language?: string;\r\n}\r\n\r\nconst UnifiedSearchComponent: React.FC<UnifiedSearchComponentProps> = (props: UnifiedSearchComponentProps) => {\r\n \r\n const [searchTerm, setSearchTerm] = React.useState('');\r\n const [loading, setLoading] = React.useState(false);\r\n const [results, setSearchResults] = React.useState<SearchResult[] | undefined>();\r\n\r\n const { key, accessToken, ussBaseUrl } = props;\r\n\r\n React.useEffect(() => {\r\n Api.storeJWT(accessToken);\r\n Api.storeBaseUrl(ussBaseUrl);\r\n }, [accessToken, ussBaseUrl]);\r\n\r\n const findIt = (event: React.FormEvent) => {\r\n event.preventDefault();\r\n setLoading(true);\r\n Api.quickSearch(searchTerm)\r\n .then((response) => {\r\n setSearchResults(response);\r\n })\r\n .catch((error) => { })\r\n .finally(() => {\r\n setLoading(false);\r\n });\r\n };\r\n\r\n return (\r\n <Wrapper key={key}>\r\n <SearchBar\r\n id=\"unifiedSearchInputField\"\r\n placeholder=\"Enter your search term\"\r\n enterSearch={findIt}\r\n setSearchTerm={setSearchTerm}\r\n searchTerm={searchTerm}\r\n removeSearch={() => {\r\n setSearchTerm('');\r\n }}\r\n showDropdown={true}\r\n dropdownButtonLoading={loading}\r\n dropdownButtonAction={loading ? () => {} : undefined}\r\n dropdownButtonLabel={loading ? 'Loading' : undefined}\r\n dropdownButtonVariant='tertiary'\r\n searchList={results?.map(x => ({\r\n value: x.url ?? x.title ?? \"blank\",\r\n noteLabel: x.description,\r\n displayLabel: x.title,\r\n }))}\r\n size={Size.Medium}\r\n />\r\n </Wrapper>\r\n );\r\n};\r\n\r\nexport default UnifiedSearchComponent;"],"mappings":";;;;;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AAA2C;AAAA;AAAA;AAAA;AAG3C,IAAMA,OAAO,GAAGC,yBAAM,CAACC,GAAG,qFACzB;AAAC,IAQIC,YAAY;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAalB,IAAMC,sBAA6D,GAAG,SAAhEA,sBAA6D,CAAIC,KAAkC,EAAK;EAE1G,sBAAoCC,KAAK,CAACC,QAAQ,CAAC,EAAE,CAAC;IAAA;IAA/CC,UAAU;IAAEC,aAAa;EAChC,uBAA8BH,KAAK,CAACC,QAAQ,CAAC,KAAK,CAAC;IAAA;IAA5CG,OAAO;IAAEC,UAAU;EAC1B,uBAAoCL,KAAK,CAACC,QAAQ,EAA8B;IAAA;IAAzEK,OAAO;IAAEC,gBAAgB;EAEhC,IAAQC,GAAG,GAA8BT,KAAK,CAAtCS,GAAG;IAAEC,WAAW,GAAiBV,KAAK,CAAjCU,WAAW;IAAEC,UAAU,GAAKX,KAAK,CAApBW,UAAU;EAEpCV,KAAK,CAACW,SAAS,CAAC,YAAM;IAClBC,+BAAG,CAACC,QAAQ,CAACJ,WAAW,CAAC;IACzBG,+BAAG,CAACE,YAAY,CAACJ,UAAU,CAAC;EAChC,CAAC,EAAE,CAACD,WAAW,EAAEC,UAAU,CAAC,CAAC;EAE7B,IAAMK,MAAM,GAAG,SAATA,MAAM,CAAIC,KAAsB,EAAK;IACvCA,KAAK,CAACC,cAAc,EAAE;IACtBZ,UAAU,CAAC,IAAI,CAAC;IAChBO,+BAAG,CAACM,WAAW,CAAChB,UAAU,CAAC,CAC1BiB,IAAI,CAAC,UAACC,QAAQ,EAAK;MAChBb,gBAAgB,CAACa,QAAQ,CAAC;IAC9B,CAAC,CAAC,CACDC,KAAK,CAAC,UAACC,KAAK,EAAK,CAAE,CAAC,CAAC,CACrBC,OAAO,CAAC,YAAM;MACXlB,UAAU,CAAC,KAAK,CAAC;IACrB,CAAC,CAAC;EACN,CAAC;EAED,oBACI,qBAAC,OAAO;IAAA,uBACR,qBAAC,sBAAS;MACL,EAAE,EAAC,yBAAyB;MAC5B,WAAW,EAAC,wBAAwB;MACpC,WAAW,EAAEU,MAAO;MACpB,aAAa,EAAEZ,aAAc;MAC7B,UAAU,EAAED,UAAW;MACvB,YAAY,EAAE,wBAAM;QAClBC,aAAa,CAAC,EAAE,CAAC;MACnB,CAAE;MACF,YAAY,EAAE,IAAK;MACnB,qBAAqB,EAAEC,OAAQ;MAC/B,oBAAoB,EAAEA,OAAO,GAAG,YAAM,CAAC,CAAC,GAAGoB,SAAU;MACrD,mBAAmB,EAAEpB,OAAO,GAAG,SAAS,GAAGoB,SAAU;MACrD,qBAAqB,EAAC,UAAU;MAChC,UAAU,EAAElB,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEmB,GAAG,CAAC,UAAAC,CAAC;QAAA;QAAA,OAAK;UAC5BC,KAAK,oBAAED,CAAC,CAACE,GAAG,2CAAIF,CAAC,CAACG,KAAK,uCAAI,OAAO;UAClCC,SAAS,EAAEJ,CAAC,CAACK,WAAW;UACxBC,YAAY,EAAEN,CAAC,CAACG;QACnB,CAAC;MAAA,CAAC,CAAE;MACJ,IAAI,EAAEI,WAAI,CAACC;IAAO;EAClB,GArBS1B,GAAG,CAsBV;AAEf,CAAC;AAAC;EArEEA,GAAG;EACHC,WAAW;EACXC,UAAU;AAAA;AAAA,eAqECZ,sBAAsB;AAAA"}

package/dist/GlobalNavigationBar/desktop/UnifedSearchComponent.d.ts ADDED Viewed

@@ -0,0 +1,8 @@
+import * as React from 'react';
+export interface UnifiedSearchComponentProps {
+    key: string;
+    accessToken?: string;
+    ussBaseUrl?: string;
+}
+declare const UnifiedSearchComponent: React.FC<UnifiedSearchComponentProps>;
+export default UnifiedSearchComponent;

package/dist/GlobalNavigationBar/desktop/UnifedSearchComponent.js ADDED Viewed

@@ -0,0 +1,89 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+import _pt from "prop-types";
+var _templateObject;
+import * as React from 'react';
+import { SearchBar } from '../../InputFields';
+import { Size } from '../../types';
+import styled from 'styled-components';
+import Api from './UnifedSearchServiceApi';
+import { jsx as _jsx } from "react/jsx-runtime";
+var Wrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n"])));
+var SearchResult = /*#__PURE__*/_createClass(function SearchResult() {
+  _classCallCheck(this, SearchResult);
+  _defineProperty(this, "title", void 0);
+  _defineProperty(this, "description", void 0);
+  _defineProperty(this, "price", void 0);
+  _defineProperty(this, "url", void 0);
+  _defineProperty(this, "imageUrl", void 0);
+  _defineProperty(this, "isPublic", void 0);
+  _defineProperty(this, "type", void 0);
+  _defineProperty(this, "sku", void 0);
+  _defineProperty(this, "language", void 0);
+});
+var UnifiedSearchComponent = function UnifiedSearchComponent(props) {
+  var _React$useState = React.useState(''),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    searchTerm = _React$useState2[0],
+    setSearchTerm = _React$useState2[1];
+  var _React$useState3 = React.useState(false),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    loading = _React$useState4[0],
+    setLoading = _React$useState4[1];
+  var _React$useState5 = React.useState(),
+    _React$useState6 = _slicedToArray(_React$useState5, 2),
+    results = _React$useState6[0],
+    setSearchResults = _React$useState6[1];
+  var key = props.key,
+    accessToken = props.accessToken,
+    ussBaseUrl = props.ussBaseUrl;
+  React.useEffect(function () {
+    Api.storeJWT(accessToken);
+    Api.storeBaseUrl(ussBaseUrl);
+  }, [accessToken, ussBaseUrl]);
+  var findIt = function findIt(event) {
+    event.preventDefault();
+    setLoading(true);
+    Api.quickSearch(searchTerm).then(function (response) {
+      setSearchResults(response);
+    }).catch(function (error) {}).finally(function () {
+      setLoading(false);
+    });
+  };
+  return /*#__PURE__*/_jsx(Wrapper, {
+    children: /*#__PURE__*/_jsx(SearchBar, {
+      id: "unifiedSearchInputField",
+      placeholder: "Enter your search term",
+      enterSearch: findIt,
+      setSearchTerm: setSearchTerm,
+      searchTerm: searchTerm,
+      removeSearch: function removeSearch() {
+        setSearchTerm('');
+      },
+      showDropdown: true,
+      dropdownButtonLoading: loading,
+      dropdownButtonAction: loading ? function () {} : undefined,
+      dropdownButtonLabel: loading ? 'Loading' : undefined,
+      dropdownButtonVariant: "tertiary",
+      searchList: results === null || results === void 0 ? void 0 : results.map(function (x) {
+        var _ref, _x$url;
+        return {
+          value: (_ref = (_x$url = x.url) !== null && _x$url !== void 0 ? _x$url : x.title) !== null && _ref !== void 0 ? _ref : "blank",
+          noteLabel: x.description,
+          displayLabel: x.title
+        };
+      }),
+      size: Size.Medium
+    })
+  }, key);
+};
+UnifiedSearchComponent.propTypes = {
+  key: _pt.string.isRequired,
+  accessToken: _pt.string,
+  ussBaseUrl: _pt.string
+};
+export default UnifiedSearchComponent;
+//# sourceMappingURL=UnifedSearchComponent.js.map

package/dist/GlobalNavigationBar/desktop/UnifedSearchComponent.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"UnifedSearchComponent.js","names":["React","SearchBar","Size","styled","Api","Wrapper","div","SearchResult","UnifiedSearchComponent","props","useState","searchTerm","setSearchTerm","loading","setLoading","results","setSearchResults","key","accessToken","ussBaseUrl","useEffect","storeJWT","storeBaseUrl","findIt","event","preventDefault","quickSearch","then","response","catch","error","finally","undefined","map","x","value","url","title","noteLabel","description","displayLabel","Medium"],"sources":["../../../src/GlobalNavigationBar/desktop/UnifedSearchComponent.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { SearchBar } from '../../InputFields';\r\nimport { Size, ToastColor, ToastPosition } from '../../types';\r\nimport styled from 'styled-components';\r\nimport Api from './UnifedSearchServiceApi';\r\n\r\n\r\nconst Wrapper = styled.div`\r\n`;\r\n\r\nexport interface UnifiedSearchComponentProps {\r\n key: string;\r\n accessToken?: string;\r\n ussBaseUrl?: string;\r\n} \r\n\r\nclass SearchResult\r\n{\r\n title?: string;\r\n description?: string;\r\n price?: number;\r\n url?: string;\r\n imageUrl?: string;\r\n isPublic?: boolean;\r\n type?: string;\r\n sku?: string;\r\n language?: string;\r\n}\r\n\r\nconst UnifiedSearchComponent: React.FC<UnifiedSearchComponentProps> = (props: UnifiedSearchComponentProps) => {\r\n \r\n const [searchTerm, setSearchTerm] = React.useState('');\r\n const [loading, setLoading] = React.useState(false);\r\n const [results, setSearchResults] = React.useState<SearchResult[] | undefined>();\r\n\r\n const { key, accessToken, ussBaseUrl } = props;\r\n\r\n React.useEffect(() => {\r\n Api.storeJWT(accessToken);\r\n Api.storeBaseUrl(ussBaseUrl);\r\n }, [accessToken, ussBaseUrl]);\r\n\r\n const findIt = (event: React.FormEvent) => {\r\n event.preventDefault();\r\n setLoading(true);\r\n Api.quickSearch(searchTerm)\r\n .then((response) => {\r\n setSearchResults(response);\r\n })\r\n .catch((error) => { })\r\n .finally(() => {\r\n setLoading(false);\r\n });\r\n };\r\n\r\n return (\r\n <Wrapper key={key}>\r\n <SearchBar\r\n id=\"unifiedSearchInputField\"\r\n placeholder=\"Enter your search term\"\r\n enterSearch={findIt}\r\n setSearchTerm={setSearchTerm}\r\n searchTerm={searchTerm}\r\n removeSearch={() => {\r\n setSearchTerm('');\r\n }}\r\n showDropdown={true}\r\n dropdownButtonLoading={loading}\r\n dropdownButtonAction={loading ? () => {} : undefined}\r\n dropdownButtonLabel={loading ? 'Loading' : undefined}\r\n dropdownButtonVariant='tertiary'\r\n searchList={results?.map(x => ({\r\n value: x.url ?? x.title ?? \"blank\",\r\n noteLabel: x.description,\r\n displayLabel: x.title,\r\n }))}\r\n size={Size.Medium}\r\n />\r\n </Wrapper>\r\n );\r\n};\r\n\r\nexport default UnifiedSearchComponent;"],"mappings":";;;;;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,SAAS,QAAQ,mBAAmB;AAC7C,SAASC,IAAI,QAAmC,aAAa;AAC7D,OAAOC,MAAM,MAAM,mBAAmB;AACtC,OAAOC,GAAG,MAAM,0BAA0B;AAAC;AAG3C,IAAMC,OAAO,GAAGF,MAAM,CAACG,GAAG,uEACzB;AAAC,IAQIC,YAAY;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAalB,IAAMC,sBAA6D,GAAG,SAAhEA,sBAA6D,CAAIC,KAAkC,EAAK;EAE1G,sBAAoCT,KAAK,CAACU,QAAQ,CAAC,EAAE,CAAC;IAAA;IAA/CC,UAAU;IAAEC,aAAa;EAChC,uBAA8BZ,KAAK,CAACU,QAAQ,CAAC,KAAK,CAAC;IAAA;IAA5CG,OAAO;IAAEC,UAAU;EAC1B,uBAAoCd,KAAK,CAACU,QAAQ,EAA8B;IAAA;IAAzEK,OAAO;IAAEC,gBAAgB;EAEhC,IAAQC,GAAG,GAA8BR,KAAK,CAAtCQ,GAAG;IAAEC,WAAW,GAAiBT,KAAK,CAAjCS,WAAW;IAAEC,UAAU,GAAKV,KAAK,CAApBU,UAAU;EAEpCnB,KAAK,CAACoB,SAAS,CAAC,YAAM;IAClBhB,GAAG,CAACiB,QAAQ,CAACH,WAAW,CAAC;IACzBd,GAAG,CAACkB,YAAY,CAACH,UAAU,CAAC;EAChC,CAAC,EAAE,CAACD,WAAW,EAAEC,UAAU,CAAC,CAAC;EAE7B,IAAMI,MAAM,GAAG,SAATA,MAAM,CAAIC,KAAsB,EAAK;IACvCA,KAAK,CAACC,cAAc,EAAE;IACtBX,UAAU,CAAC,IAAI,CAAC;IAChBV,GAAG,CAACsB,WAAW,CAACf,UAAU,CAAC,CAC1BgB,IAAI,CAAC,UAACC,QAAQ,EAAK;MAChBZ,gBAAgB,CAACY,QAAQ,CAAC;IAC9B,CAAC,CAAC,CACDC,KAAK,CAAC,UAACC,KAAK,EAAK,CAAE,CAAC,CAAC,CACrBC,OAAO,CAAC,YAAM;MACXjB,UAAU,CAAC,KAAK,CAAC;IACrB,CAAC,CAAC;EACN,CAAC;EAED,oBACI,KAAC,OAAO;IAAA,uBACR,KAAC,SAAS;MACL,EAAE,EAAC,yBAAyB;MAC5B,WAAW,EAAC,wBAAwB;MACpC,WAAW,EAAES,MAAO;MACpB,aAAa,EAAEX,aAAc;MAC7B,UAAU,EAAED,UAAW;MACvB,YAAY,EAAE,wBAAM;QAClBC,aAAa,CAAC,EAAE,CAAC;MACnB,CAAE;MACF,YAAY,EAAE,IAAK;MACnB,qBAAqB,EAAEC,OAAQ;MAC/B,oBAAoB,EAAEA,OAAO,GAAG,YAAM,CAAC,CAAC,GAAGmB,SAAU;MACrD,mBAAmB,EAAEnB,OAAO,GAAG,SAAS,GAAGmB,SAAU;MACrD,qBAAqB,EAAC,UAAU;MAChC,UAAU,EAAEjB,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEkB,GAAG,CAAC,UAAAC,CAAC;QAAA;QAAA,OAAK;UAC5BC,KAAK,oBAAED,CAAC,CAACE,GAAG,2CAAIF,CAAC,CAACG,KAAK,uCAAI,OAAO;UAClCC,SAAS,EAAEJ,CAAC,CAACK,WAAW;UACxBC,YAAY,EAAEN,CAAC,CAACG;QACnB,CAAC;MAAA,CAAC,CAAE;MACJ,IAAI,EAAEnC,IAAI,CAACuC;IAAO;EAClB,GArBSxB,GAAG,CAsBV;AAEf,CAAC;AAAC;EArEEA,GAAG;EACHC,WAAW;EACXC,UAAU;AAAA;AAqEd,eAAeX,sBAAsB"}

package/dist/GlobalNavigationBar/desktop/UnifedSearchServiceApi.cjs ADDED Viewed

@@ -0,0 +1,38 @@
+"use strict";
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var UssApi = /*#__PURE__*/(0, _createClass2.default)(function UssApi() {
+  var _this = this;
+  (0, _classCallCheck2.default)(this, UssApi);
+  (0, _defineProperty2.default)(this, "token", undefined);
+  (0, _defineProperty2.default)(this, "baseUrl", undefined);
+  (0, _defineProperty2.default)(this, "storeJWT", function (token) {
+    _this.token = token;
+  });
+  (0, _defineProperty2.default)(this, "storeBaseUrl", function (baseUrl) {
+    _this.baseUrl = baseUrl;
+  });
+  (0, _defineProperty2.default)(this, "quickSearch", function (query) {
+    return fetch("".concat(_this.baseUrl, "/api/search?query=").concat(encodeURI(query)), {
+      method: "GET",
+      headers: _this.token ? {
+        "Authorization": "Bearer ".concat(_this.token)
+      } : {}
+    }).then(function (response) {
+      return response.json();
+    }).catch(function (error) {
+      return console.log(error);
+    });
+  });
+});
+(0, _defineProperty2.default)(UssApi, "instance", new UssApi());
+var _default = UssApi.instance;
+exports.default = _default;
+//# sourceMappingURL=UnifedSearchServiceApi.cjs.map

package/dist/GlobalNavigationBar/desktop/UnifedSearchServiceApi.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"UnifedSearchServiceApi.cjs","names":["UssApi","undefined","token","baseUrl","query","fetch","encodeURI","method","headers","then","response","json","catch","error","console","log","instance"],"sources":["../../../src/GlobalNavigationBar/desktop/UnifedSearchServiceApi.tsx"],"sourcesContent":["\r\nclass UssApi {\r\n // Globally used variables within the API class.\r\n public token: string | undefined = undefined;\r\n public baseUrl: string | undefined = undefined;\r\n static instance = new UssApi();\r\n \r\n /**\r\n * Stores the Office365 access token.\r\n */\r\n storeJWT = (token: string | undefined) => {\r\n this.token = token;\r\n };\r\n\r\n /**\r\n * Stores the base URL for the API.\r\n */\r\n storeBaseUrl = (baseUrl: string | undefined) => {\r\n this.baseUrl = baseUrl;\r\n };\r\n \r\n /**\r\n * Calls USS search endpoint\r\n * @param query - query to search for\r\n * @returns Top 10 search results\r\n */\r\n quickSearch = (query: string): Promise<any> => {\r\n return fetch(`${this.baseUrl}/api/search?query=${encodeURI(query)}`, {\r\n method: \"GET\",\r\n headers: this.token ? {\r\n \"Authorization\" : `Bearer ${this.token}`\r\n } : {},\r\n })\r\n .then((response) => response.json())\r\n .catch((error) => console.log(error));\r\n };\r\n}\r\n\r\nexport default UssApi.instance;\r\n"],"mappings":";;;;;;;;;;IACMA,MAAM;EAAA;EAAA;EAAA,6CAE2BC,SAAS;EAAA,+CACPA,SAAS;EAAA,gDAMnC,UAACC,KAAyB,EAAK;IACxC,KAAI,CAACA,KAAK,GAAGA,KAAK;EACpB,CAAC;EAAA,oDAKc,UAACC,OAA2B,EAAK;IAC5C,KAAI,CAACA,OAAO,GAAIA,OAAO;EAC3B,CAAC;EAAA,mDAOa,UAACC,KAAa,EAAmB;IAC3C,OAAOC,KAAK,WAAI,KAAI,CAACF,OAAO,+BAAqBG,SAAS,CAACF,KAAK,CAAC,GAAI;MACjEG,MAAM,EAAE,KAAK;MACbC,OAAO,EAAE,KAAI,CAACN,KAAK,GAAG;QAClB,eAAe,mBAAa,KAAI,CAACA,KAAK;MAC1C,CAAC,GAAG,CAAC;IACL,CAAC,CAAC,CACDO,IAAI,CAAC,UAACC,QAAQ;MAAA,OAAKA,QAAQ,CAACC,IAAI,EAAE;IAAA,EAAC,CACnCC,KAAK,CAAC,UAACC,KAAK;MAAA,OAAKC,OAAO,CAACC,GAAG,CAACF,KAAK,CAAC;IAAA,EAAC;EAC7C,CAAC;AAAA;AAAA,8BAlCCb,MAAM,cAIU,IAAIA,MAAM,EAAE;AAAA,eAiCnBA,MAAM,CAACgB,QAAQ;AAAA"}

package/dist/GlobalNavigationBar/desktop/UnifedSearchServiceApi.d.ts ADDED Viewed

@@ -0,0 +1,21 @@
+declare class UssApi {
+    token: string | undefined;
+    baseUrl: string | undefined;
+    static instance: UssApi;
+    /**
+     * Stores the Office365 access token.
+     */
+    storeJWT: (token: string | undefined) => void;
+    /**
+     * Stores the base URL for the API.
+     */
+    storeBaseUrl: (baseUrl: string | undefined) => void;
+    /**
+     * Calls USS search endpoint
+     * @param query - query to search for
+     * @returns Top 10 search results
+     */
+    quickSearch: (query: string) => Promise<any>;
+}
+declare const _default: UssApi;
+export default _default;