@laerdal/life-react-components 1.10.3-dev.18 → 1.10.3-dev.20

package/dist/Dropdown/DropdownFilter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Dropdown/DropdownFilter.tsx"],"names":["React","COLORS","ArrowDropDown","ArrowDropUp","Information","TechnicalWarning","LoadingIndicator","StyledField","Dropdown","InputField","DropdownContent","Size","AutofilledMessage","ErrorMessage","defaultOnMouseDownHandler","useActionWithin","useClickOutsideRef","useFocusOutsideRef","useFocusVisibleRef","IconButton","SystemIcons","DropdownFilter","forwardRef","ref","id","list","placeholder","onSelect","onInputChange","value","required","messageOnNoResults","disabled","readOnly","scrollable","activeValidationMessage","autofilledMessage","size","disableFiltering","buttonFontSize","margin","loading","onFocus","onBlur","rest","useState","isOpen","setIsOpen","input","setInput","placeholderSearch","setPlaceholderSearch","restartFilter","setRestartFilter","selectedItem","setSelectedItem","selectedValues","setSelectedValues","focused","setFocused","init","setInit","styledFieldRef","inputRef","clearButtonRef","useRef","useImperativeHandle","current","containerRef","handleInputKeyDown","e","key","preventDefault","useEffect","length","val","item","find","a","displayLabel","undefined","handleInputClear","focus","focusVisible","detail","renderInput","stopPropagation","blur","Math","floor","random","target","marginLeft","Small","neutral_600","itemsType","multiSelect","action","onValueUpdate","values","items","critical_400"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { COLORS } from '../styles';\nimport { ArrowDropDown, ArrowDropUp, Information, TechnicalWarning } from '../icons/systemicons/SystemIcons';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { StyledField, Dropdown, InputField } from './CommonStyling';\nimport DropdownContent, { DropdownItem } from './DropdownContent';\nimport { Size } from '../types';\nimport { AutofilledMessage, ErrorMessage } from '../InputFields';\nimport { defaultOnMouseDownHandler, useActionWithin, useClickOutsideRef, useFocusOutsideRef, useFocusVisibleRef } from '../common';\nimport { IconButton } from '../Button';\nimport { SystemIcons } from '../icons';\n\ninterface DropdownFilterProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onSelect' | 'size' | 'list' | 'autoComplete' | 'type' | 'placeholder' | 'onKeyDown' | 'value' | 'onChange' | 'required' | 'tabIndex' | 'disabled' | 'readOnly'> {\n  list: DropdownItem[];\n  placeholder?: string;\n\n  value?: string;\n  onSelect?: (value: string) => void;\n  onInputChange?: (input: string) => void;\n\n  required?: boolean;\n  disabled?: boolean;\n  readOnly?: boolean;\n  loading?: boolean;\n\n  disableFiltering?: boolean;\n\n  messageOnNoResults?: string;\n  activeValidationMessage?: string;\n  autofilledMessage?: string;\n  size?: Size.Small | Size.Medium;\n\n  buttonFontSize?: string;\n  margin?: string;\n  scrollable?: boolean;\n}\n\nconst DropdownFilter = React.forwardRef( ({\n                                            id,\n                                            list,\n                                            placeholder,\n                                            onSelect,\n                                            onInputChange,\n                                            value,\n                                            required,\n                                            messageOnNoResults,\n                                            disabled,\n                                            readOnly,\n                                            scrollable,\n                                            activeValidationMessage,\n                                            autofilledMessage,\n                                            size,\n                                            disableFiltering,\n                                            buttonFontSize,\n                                            margin = '4px 0',\n                                            loading,\n                                            onFocus,\n                                            onBlur,\n                                            ...rest\n                                          }: DropdownFilterProps, ref) => {\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [input, setInput] = React.useState<string>();\n  const [placeholderSearch, setPlaceholderSearch] = React.useState<string>(placeholder || '');\n  const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n  const [selectedItem, setSelectedItem] = React.useState<DropdownItem>();\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [init, setInit] = React.useState<boolean>(true);\n\n  const styledFieldRef = useFocusVisibleRef();\n  const inputRef = useFocusVisibleRef([styledFieldRef]);\n  const clearButtonRef = React.useRef<HTMLButtonElement>(null);\n\n  useActionWithin(styledFieldRef, input && !readOnly && !disabled ? [clearButtonRef] : []);\n\n  React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\n\n  const containerRef = useClickOutsideRef(\n    () => setIsOpen(false),\n    [],\n    useFocusOutsideRef(() => setIsOpen(false)),\n  );\n\n  const handleInputKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (e.key === 'Esc' || e.key === 'Escape') {\n      e.preventDefault();\n    }\n    if (e.key === 'ArrowDown' || e.key === 'Down' || e.key === 'ArrowUp' || e.key === 'Up') {\n      e.preventDefault();\n      if (!isOpen) {\n        setIsOpen(true);\n      }\n    }\n  };\n\n  React.useEffect(() => {\n    setInit(true);\n    setSelectedValues(!!value ? [value] : []);\n  }, [value]);\n\n  React.useEffect(() => {\n    if (selectedValues?.length) {\n      const val = selectedValues[0];\n      const item = list.find((a) => a.value === val);\n      setSelectedItem(item);\n      setInput(item?.displayLabel ?? item?.value ?? '');\n      onSelect && !init && onSelect(val);\n    } else {\n      setSelectedItem(undefined);\n      onSelect && !init && onSelect('');\n      setInput('');\n    }\n  }, [selectedValues]);\n\n  React.useEffect(() => {\n    if (!isOpen) {\n      if (!!selectedItem) {\n        setInput(selectedItem?.displayLabel ?? selectedItem?.value ?? '');\n      } else {\n        setInput('');\n      }\n    }\n\n    setRestartFilter(true);\n  }, [isOpen, selectedItem]);\n\n  const handleInputClear = (e: any) => {\n    setInput('');\n    setSelectedValues([]);\n    onSelect && onSelect('');\n    inputRef.current?.focus({ focusVisible: e?.detail !== 1 } as any);\n  };\n\n  const renderInput = () => {\n    return (\n      <StyledField\n        ref={styledFieldRef}\n        className={size ? size : ''}\n        onClick={(e: any) => {\n          if (!readOnly && !disabled) {\n            e.stopPropagation();\n            setIsOpen(!isOpen);\n            if (isOpen) {\n              inputRef.current?.blur();\n            } else {\n              inputRef.current?.focus();\n            }\n          }\n        }}\n        disabled={disabled || false}\n        readOnly={readOnly || false}\n        isPlaceholder={!input}\n        fontSize={buttonFontSize}\n        showValidationMessage={!!activeValidationMessage}\n        onMouseDown={defaultOnMouseDownHandler}\n        data-testid={`otherdiv_${id}`}>\n        <InputField\n          id={id}\n          ref={inputRef}\n          autoComplete={'off-' + Math.floor(Math.random() * 999999999999)}\n          type=\"search\"\n          placeholder={placeholderSearch}\n          onKeyDown={handleInputKeyDown}\n          value={input || ''}\n          onChange={(e: any) => {\n            if (!e.target.value) {\n              setSelectedValues([]);\n            }\n            if (!readOnly && !disabled && e.target.value !== input) {\n              setRestartFilter(false);\n              setIsOpen(true);\n              setInput(e.target.value);\n              if (onInputChange) {\n                onInputChange(e.target.value || '');\n              }\n            }\n          }}\n          onFocus={(e) => {\n            setPlaceholderSearch('');\n            onFocus && onFocus(e);\n          }}\n          onBlur={(e) => {\n            setPlaceholderSearch(placeholder || '');\n            onBlur && onBlur(e);\n          }}\n          required={required}\n          tabIndex={disabled || readOnly ? -1 : 0}\n          disabled={disabled || false}\n          {...rest}\n        />\n        {input && !readOnly && !disabled && !loading && (\n          <IconButton action={handleInputClear} ref={clearButtonRef} useTransparentBackground={true} shape={'circular'} style={{ marginLeft: '-4px' }} variant={'secondary'}>\n            <SystemIcons.Clear />\n          </IconButton>\n        )}\n\n        {!disabled && !readOnly && loading && (\n          <div style={{ marginLeft: '-4xp' }}>\n            <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} />\n          </div>\n        )}\n\n        <div className={'dropdown-arrow'}>\n          {isOpen && !readOnly && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''} /> : <ArrowDropDown size=\"24px\" className={size ? size : ''} />}\n        </div>\n      </StyledField>\n    );\n  };\n\n  return (\n    <>\n      <Dropdown ref={containerRef} disabled={disabled} isButton={false} readOnly={readOnly} className={size ? size : ''} margin={margin}>\n        {renderInput()}\n        {!readOnly && !disabled && (\n          <DropdownContent\n            containerRef={containerRef}\n            isOpen={isOpen && !loading}\n            messageOnNoResults={messageOnNoResults ?? ''}\n            selectedValues={selectedValues}\n            setSelectedValues={setSelectedValues}\n            size={size ?? Size.Small}\n            focused={focused}\n            setFocused={setFocused}\n            outline={false}\n            customizationProps={{\n              itemsType: 'normal',\n              scrollable: scrollable,\n              multiSelect: false,\n              action: () => {},\n              onValueUpdate: (values: string[]) => {\n                setRestartFilter(true);\n                setInit(false);\n              },\n              items: list,\n            }}\n            filter={!disableFiltering && !restartFilter ? input || '' : ''}\n            setIsOpen={setIsOpen}\n            isButton={false}\n            id={`${id}_dropdowncontent`}\n          />\n        )}\n      </Dropdown>\n      {activeValidationMessage && (\n        <ErrorMessage className={size || ''}>\n          <TechnicalWarning color={COLORS.critical_400} />\n          <span>{activeValidationMessage}</span>\n        </ErrorMessage>\n      )}\n      {autofilledMessage && (\n        <AutofilledMessage className={size || ''}>\n          <Information color={COLORS.neutral_600} />\n          <span>{autofilledMessage}</span>\n        </AutofilledMessage>\n      )}\n    </>\n  );\n});\n\nexport default DropdownFilter;\n"],"file":"DropdownFilter.js"}
+{"version":3,"sources":["../../src/Dropdown/DropdownFilter.tsx"],"names":["React","COLORS","ArrowDropDown","ArrowDropUp","Information","TechnicalWarning","LoadingIndicator","StyledField","Dropdown","InputField","DropdownContent","Size","AutofilledMessage","ErrorMessage","defaultOnMouseDownHandler","useActionWithin","useClickOutsideRef","useFocusOutsideRef","useFocusVisibleRef","IconButton","SystemIcons","DropdownFilter","forwardRef","ref","id","list","placeholder","onSelect","onInputChange","value","required","messageOnNoResults","disabled","readOnly","scrollable","activeValidationMessage","autofilledMessage","size","disableFiltering","buttonFontSize","margin","loading","onFocus","onBlur","rest","useState","isOpen","setIsOpen","input","setInput","placeholderSearch","setPlaceholderSearch","restartFilter","setRestartFilter","selectedItem","setSelectedItem","selectedValues","setSelectedValues","focused","setFocused","init","setInit","styledFieldRef","inputRef","clearButtonRef","useRef","useImperativeHandle","current","containerRef","handleInputKeyDown","e","key","preventDefault","useEffect","length","val","item","find","a","displayLabel","undefined","handleInputClear","focus","focusVisible","detail","renderInput","stopPropagation","blur","Math","floor","random","target","marginLeft","Small","neutral_600","itemsType","multiSelect","action","onValueUpdate","values","items","critical_400"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { COLORS } from '../styles';\nimport { ArrowDropDown, ArrowDropUp, Information, TechnicalWarning } from '../icons/systemicons/SystemIcons';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { StyledField, Dropdown, InputField } from './CommonStyling';\nimport DropdownContent, { DropdownItem } from './DropdownContent';\nimport { Size } from '../types';\nimport { AutofilledMessage, ErrorMessage } from '../InputFields';\nimport { defaultOnMouseDownHandler, useActionWithin, useClickOutsideRef, useFocusOutsideRef, useFocusVisibleRef } from '../common';\nimport { IconButton } from '../Button';\nimport { SystemIcons } from '../icons';\n\ninterface DropdownFilterProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onSelect' | 'size' | 'list' | 'autoComplete' | 'type' | 'placeholder' | 'onKeyDown' | 'value' | 'onChange' | 'required' | 'tabIndex' | 'disabled' | 'readOnly'> {\n  list: DropdownItem[];\n  placeholder?: string;\n\n  value?: string;\n  onSelect?: (value: string) => void;\n  onInputChange?: (input: string) => void;\n\n  required?: boolean;\n  disabled?: boolean;\n  readOnly?: boolean;\n  loading?: boolean;\n\n  disableFiltering?: boolean;\n\n  messageOnNoResults?: string;\n  activeValidationMessage?: string;\n  autofilledMessage?: string;\n  size?: Size.Small | Size.Medium;\n\n  buttonFontSize?: string;\n  margin?: string;\n  scrollable?: boolean;\n}\n\nconst DropdownFilter = React.forwardRef( ({\n                                            id,\n                                            list,\n                                            placeholder,\n                                            onSelect,\n                                            onInputChange,\n                                            value,\n                                            required,\n                                            messageOnNoResults,\n                                            disabled,\n                                            readOnly,\n                                            scrollable,\n                                            activeValidationMessage,\n                                            autofilledMessage,\n                                            size,\n                                            disableFiltering,\n                                            buttonFontSize,\n                                            margin = '4px 0',\n                                            loading,\n                                            onFocus,\n                                            onBlur,\n                                            ...rest\n                                          }: DropdownFilterProps, ref) => {\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [input, setInput] = React.useState<string>();\n  const [placeholderSearch, setPlaceholderSearch] = React.useState<string>(placeholder || '');\n  const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n  const [selectedItem, setSelectedItem] = React.useState<DropdownItem>();\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [init, setInit] = React.useState<boolean>(true);\n\n  const styledFieldRef = useFocusVisibleRef();\n  const inputRef = useFocusVisibleRef([styledFieldRef]);\n  const clearButtonRef = React.useRef<HTMLButtonElement>(null);\n\n  useActionWithin(styledFieldRef, input && !readOnly && !disabled ? [clearButtonRef] : []);\n\n  React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\n\n  const containerRef = useClickOutsideRef(\n    () => setIsOpen(false),\n    [],\n    useFocusOutsideRef(() => setIsOpen(false)),\n  );\n\n  const handleInputKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (e.key === 'Esc' || e.key === 'Escape') {\n      e.preventDefault();\n    }\n    if (e.key === 'ArrowDown' || e.key === 'Down' || e.key === 'ArrowUp' || e.key === 'Up') {\n      e.preventDefault();\n      if (!isOpen) {\n        setIsOpen(true);\n      }\n    }\n  };\n\n  React.useEffect(() => {\n    setInit(true);\n    setSelectedValues(!!value ? [value] : []);\n  }, [value]);\n\n  React.useEffect(() => {\n    if (selectedValues?.length) {\n      const val = selectedValues[0];\n      const item = list.find((a) => a.value === val);\n      setSelectedItem(item);\n      setInput(item?.displayLabel ?? item?.value ?? '');\n      onSelect && !init && onSelect(val);\n    } else {\n      setSelectedItem(undefined);\n      onSelect && !init && onSelect('');\n      setInput('');\n    }\n  }, [selectedValues]);\n\n  React.useEffect(() => {\n    if (!isOpen) {\n      if (!!selectedItem) {\n        setInput(selectedItem?.displayLabel ?? selectedItem?.value ?? '');\n      } else {\n        setInput('');\n      }\n    }\n\n    setRestartFilter(true);\n  }, [isOpen, selectedItem]);\n\n  const handleInputClear = (e: any) => {\n    setInput('');\n    setSelectedValues([]);\n    onSelect && onSelect('');\n    inputRef.current?.focus({ focusVisible: e?.detail !== 1 } as any);\n  };\n\n  const renderInput = () => {\n    return (\n      <StyledField\n        ref={styledFieldRef}\n        className={size ? size : ''}\n        onClick={(e: any) => {\n          if (!readOnly && !disabled) {\n            e.stopPropagation();\n            setIsOpen(!isOpen);\n            if (isOpen) {\n              inputRef.current?.blur();\n            } else {\n              inputRef.current?.focus();\n            }\n          }\n        }}\n        disabled={disabled || false}\n        readOnly={readOnly || false}\n        isPlaceholder={!input}\n        fontSize={buttonFontSize}\n        showValidationMessage={!!activeValidationMessage}\n        onMouseDown={defaultOnMouseDownHandler}\n        data-testid={`otherdiv_${id}`}>\n        <InputField\n          id={id}\n          ref={inputRef}\n          autoComplete={'off-' + Math.floor(Math.random() * 999999999999)}\n          type=\"search\"\n          placeholder={placeholderSearch}\n          onKeyDown={handleInputKeyDown}\n          value={input || ''}\n          onChange={(e: any) => {\n            if (!e.target.value) {\n              setSelectedValues([]);\n            }\n            if (!readOnly && !disabled && e.target.value !== input) {\n              setRestartFilter(false);\n              setIsOpen(true);\n              setInput(e.target.value);\n              if (onInputChange) {\n                onInputChange(e.target.value || '');\n              }\n            }\n          }}\n          onFocus={(e) => {\n            setPlaceholderSearch('');\n            onFocus && onFocus(e);\n          }}\n          onBlur={(e) => {\n            setPlaceholderSearch(placeholder || '');\n            onBlur && onBlur(e);\n          }}\n          required={required}\n          tabIndex={disabled || readOnly ? -1 : 0}\n          disabled={disabled || false}\n          {...rest}\n        />\n        {input && !readOnly && !disabled && !loading && (\n          <IconButton action={handleInputClear} ref={clearButtonRef} useTransparentBackground={true} shape={'circular'} style={{ marginLeft: '-4px' }} variant={'secondary'}>\n            <SystemIcons.Clear />\n          </IconButton>\n        )}\n\n        {!disabled && !readOnly && loading && (\n          <div style={{ marginLeft: '-4xp' }}>\n            <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} />\n          </div>\n        )}\n\n        <div className={'dropdown-arrow'}>\n          {isOpen && !readOnly && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''} /> : <ArrowDropDown size=\"24px\" className={size ? size : ''} />}\n        </div>\n      </StyledField>\n    );\n  };\n\n  return (\n    <>\n      <Dropdown ref={containerRef} disabled={disabled} isButton={false} readOnly={readOnly} className={size ? size : ''} margin={margin}>\n        {renderInput()}\n        {!readOnly && !disabled && (\n          <DropdownContent\n            isOpen={isOpen && !loading}\n            messageOnNoResults={messageOnNoResults ?? ''}\n            selectedValues={selectedValues}\n            setSelectedValues={setSelectedValues}\n            size={size ?? Size.Small}\n            focused={focused}\n            setFocused={setFocused}\n            outline={false}\n            customizationProps={{\n              itemsType: 'normal',\n              scrollable: scrollable,\n              multiSelect: false,\n              action: () => {},\n              onValueUpdate: (values: string[]) => {\n                setRestartFilter(true);\n                setInit(false);\n              },\n              items: list,\n            }}\n            filter={!disableFiltering && !restartFilter ? input || '' : ''}\n            setIsOpen={setIsOpen}\n            alignLeft={false}\n            isButton={false}\n            id={`${id}_dropdowncontent`}\n          />\n        )}\n      </Dropdown>\n      {activeValidationMessage && (\n        <ErrorMessage className={size || ''}>\n          <TechnicalWarning color={COLORS.critical_400} />\n          <span>{activeValidationMessage}</span>\n        </ErrorMessage>\n      )}\n      {autofilledMessage && (\n        <AutofilledMessage className={size || ''}>\n          <Information color={COLORS.neutral_600} />\n          <span>{autofilledMessage}</span>\n        </AutofilledMessage>\n      )}\n    </>\n  );\n});\n\nexport default DropdownFilter;\n"],"file":"DropdownFilter.js"}

package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs

@@ -37,8 +37,6 @@ var _SystemIcons = require("../icons/systemicons/SystemIcons");
 
 var _UserMenu = _interopRequireDefault(require("./desktop/UserMenu"));
 
-var _useClickOutside = _interopRequireDefault(require("../hooks/useClickOutside"));
-
 var _CommonStyles = require("./mobile/CommonStyles");
 
 var _Button = require("../Button");
@@ -47,6 +45,8 @@ var _DesktopActions = _interopRequireDefault(require("./desktop/DesktopActions")
 
 var _rooks = require("rooks");
 
+var _common = require("../common");
+
 var _jsxRuntime = require("react/jsx-runtime");
 
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
@@ -89,7 +89,8 @@ var GlobalNavigationBar = function GlobalNavigationBar(_ref) {
       desktop = _ref.desktop,
       testId = _ref.testId,
       _ref$useMaxWidth = _ref.useMaxWidth,
-      useMaxWidth = _ref$useMaxWidth === void 0 ? true : _ref$useMaxWidth;
+      useMaxWidth = _ref$useMaxWidth === void 0 ? true : _ref$useMaxWidth,
+      maxWidth = _ref.maxWidth;
 
   var _React$useState = React.useState(false),
       _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
@@ -103,8 +104,6 @@ var GlobalNavigationBar = function GlobalNavigationBar(_ref) {
       showUserMenu = _React$useState4[0],
       setShowUserMenu = _React$useState4[1];
 
-  var mobileMenuRef = React.useRef(null);
-  var userMenuRef = React.useRef(null);
   var actionsRef = React.useRef(null);
   var profileButtonRef = React.useRef();
   profileButtonRef.current = actionsRef === null || actionsRef === void 0 ? void 0 : (_actionsRef$current = actionsRef.current) === null || _actionsRef$current === void 0 ? void 0 : (_actionsRef$current$b = _actionsRef$current.buttons) === null || _actionsRef$current$b === void 0 ? void 0 : (_actionsRef$current$b2 = _actionsRef$current$b.find(function (a) {
@@ -118,10 +117,10 @@ var GlobalNavigationBar = function GlobalNavigationBar(_ref) {
       avatarRight = _React$useState6[0],
       setAvatarRight = _React$useState6[1];
 
-  (0, _useClickOutside.default)(userMenuRef, function () {
+  var userMenuRef = (0, _common.useClickOutsideRef)(function () {
     return setShowUserMenu(false);
   }, [profileButtonRef]);
-  (0, _useClickOutside.default)(mobileMenuRef, function () {
+  var mobileMenuRef = (0, _common.useClickOutsideRef)(function () {
     return setShowMobileMenu(false);
   }, [mobileMenuButtonRef]);
   React.useEffect(function () {
@@ -145,6 +144,7 @@ var GlobalNavigationBar = function GlobalNavigationBar(_ref) {
       "data-testid": testId,
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Layouts.PageWidth, {
         useMaxWidth: useMaxWidth,
+        maxWidth: maxWidth,
         children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(RowLayout, {
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Logo.default, {
             name: name || '',
@@ -221,6 +221,7 @@ var GlobalNavigationBar = function GlobalNavigationBar(_ref) {
 GlobalNavigationBar.propTypes = {
   isAuthenticated: _propTypes.default.bool,
   useMaxWidth: _propTypes.default.bool,
+  maxWidth: _propTypes.default.number,
   name: _propTypes.default.string,
   logo: _propTypes.default.shape({
     onClick: _propTypes.default.func,

package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/GlobalNavigationBar/GlobalNavigationBar.tsx"],"names":["HeaderWrapper","styled","header","COLORS","neutral_200","Z_INDEXES","sticky_menu","BREAKPOINTS","SMALL","MEDIUM","RowLayout","div","HamburgerButton","RightSide","MobileMenuBackdrop","backdrop","fadeIn","fadeOut","UserMenuWrapper","white","props","offsetRight","window","innerWidth","GlobalNavigationBar","name","isAuthenticated","logo","profile","mobile","desktop","testId","useMaxWidth","React","useState","showMobileMenu","setShowMobileMenu","wasMobileMenuOpen","showUserMenu","setShowUserMenu","mobileMenuRef","useRef","userMenuRef","actionsRef","profileButtonRef","current","buttons","find","a","type","ref","mobileMenuButtonRef","rightSideRef","avatarRight","setAvatarRight","useEffect","handleResize","profileRightOffset","getBoundingClientRect","right","addEventListener","removeEventListener","showBetaTag","onClick","to","items","filter","pinned","reverseRightSideOrder","action","user","some"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport Logo from './Logo';\nimport MainMenu from './desktop/MainMenu';\nimport {PageWidth} from '../Layouts';\nimport {COLORS, BREAKPOINTS} from '../styles';\nimport RightSideNav from './desktop/RightSideNav';\nimport MobileMenu from './mobile/MobileMenu';\nimport {Menu} from '../icons/systemicons/SystemIcons';\nimport UserMenu from './desktop/UserMenu';\nimport useClickOutside from '../hooks/useClickOutside';\nimport {fadeIn, fadeOut, Menu as MobileMenuWrapper} from './mobile/CommonStyles';\nimport {Z_INDEXES} from '../styles';\nimport {\n  DesktopNavigationMenuProps, MenuProfileButton,\n  MobileNavigationMenuProps,\n  ProfileMenu\n} from './types';\nimport {IconButton} from '../Button';\nimport DesktopActions, {DesktopActionsRef} from './desktop/DesktopActions';\nimport {usePreviousImmediate} from 'rooks';\n\nconst HeaderWrapper = styled.header`\n  background: white;\n  border-bottom: 1px solid ${COLORS.neutral_200};\n\n  z-index: ${Z_INDEXES.sticky_menu};\n  position: relative;\n\n  height: 48px;\n\n  ${BREAKPOINTS.SMALL} {\n    height: 56px;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    height: 64px;\n  }\n\n  @media all and (-ms-high-contrast: none) {\n    height: auto;\n  }\n\n  @media print {\n    border-bottom: none;\n  }\n`;\n\nconst RowLayout = styled.div`\n  display: flex;\n`;\n\n\nconst HamburgerButton = styled.div`\n  ${BREAKPOINTS.SMALL} button {\n    height: 56px;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    display: none;\n  }\n`;\n\nconst RightSide = styled.div`\n  display: flex;\n  margin: 0 0 0 auto;\n\n  &.reverse {\n    ${HamburgerButton} {\n      order: -1;\n    }\n\n    flex-direction: row-reverse;\n  }\n`;\n\nconst MobileMenuBackdrop = styled.div`\n  background: rgba(0, 0, 0, 0.5);\n  display: flex;\n  position: fixed;\n  left: 0;\n  top: 0;\n  bottom: 0;\n  right: 0;\n  height: 100vh;\n  width: 100vw;\n  overflow: hidden;\n  z-index: ${Z_INDEXES.backdrop};\n  visibility: hidden;\n\n\n  &.open {\n    visibility: visible;\n    animation: ${fadeIn} 0.3s ease-in-out;\n  }\n\n  &.closed {\n    visibility: hidden;\n    animation: ${fadeOut} 0.3s ease-in-out;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    visibility: hidden !important;\n  }\n`;\n\nconst UserMenuWrapper = styled.div<{ offsetRight?: number }>`\n  background-color: ${COLORS.white};\n  display: flex;\n  position: absolute;\n\n  ${BREAKPOINTS.MEDIUM} {\n    top: 56px;\n    right: ${(props) => (props.offsetRight ? `${window.innerWidth - props.offsetRight + 296}px` : '10%')};\n  }\n`;\n\n\ntype GlobalNavigationBarProps = {\n  isAuthenticated?: boolean;\n  useMaxWidth?: boolean;\n\n  name?: string;\n  logo?: { onClick?: () => void; to?: string; showBetaTag?: boolean; };\n\n  profile?: ProfileMenu;\n\n  mobile?: MobileNavigationMenuProps;\n  desktop?: DesktopNavigationMenuProps;\n\n  testId?: string;\n};\n\n/**\n * @param props\n * @constructor\n * @description This component is a global navigation header bar\n */\nconst GlobalNavigationBar = ({\n                               name,\n                               isAuthenticated,\n                               logo,\n                               profile,\n                               mobile,\n                               desktop,\n                               testId,\n                               useMaxWidth = true,\n                             }: GlobalNavigationBarProps): React.ReactElement<GlobalNavigationBarProps> => {\n  const [showMobileMenu, setShowMobileMenu] = React.useState(false);\n  const wasMobileMenuOpen = usePreviousImmediate(showMobileMenu);\n\n  const [showUserMenu, setShowUserMenu] = React.useState(false);\n  const mobileMenuRef = React.useRef(null);\n  const userMenuRef = React.useRef<HTMLDivElement>(null);\n\n  const actionsRef = React.useRef<DesktopActionsRef>(null);\n  const profileButtonRef = React.useRef<HTMLButtonElement | null>() as React.MutableRefObject<HTMLButtonElement | null | undefined>;\n  profileButtonRef.current = actionsRef?.current?.buttons?.find(a => a.type === 'profile')?.ref?.current;\n\n  const mobileMenuButtonRef = React.useRef<HTMLButtonElement>(null);\n\n  const rightSideRef = React.useRef(null);\n  const [avatarRight, setAvatarRight] = React.useState<number>(0);\n\n\n  useClickOutside(userMenuRef, () => setShowUserMenu(false), [profileButtonRef]);\n  useClickOutside(mobileMenuRef, () => setShowMobileMenu(false), [mobileMenuButtonRef]);\n\n  React.useEffect(() => {\n    if (!profileButtonRef.current) return;\n\n    const handleResize = () => {\n      const profileRightOffset = profileButtonRef.current?.getBoundingClientRect()?.right;\n      setAvatarRight(profileRightOffset || 0);\n    };\n\n    handleResize();\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, [profileButtonRef.current]);\n\n\n  return (\n    <>\n      <HeaderWrapper data-testid={testId}>\n        <PageWidth useMaxWidth={useMaxWidth}>\n          <RowLayout>\n            <Logo name={name || ''} showBetaTag={logo?.showBetaTag} onClick={logo?.onClick} to={logo?.to}/>\n            {\n              isAuthenticated &&\n              <MainMenu items={desktop?.items.filter(a => !a.pinned) || []} rightSideRef={rightSideRef}/>\n            }\n            <RightSide className={`${desktop?.reverseRightSideOrder ? 'reverse' : ''}`}\n                       ref={rightSideRef}>\n              <RightSideNav items={desktop?.items?.filter(a => a.pinned)} action={desktop?.action}/>\n              <DesktopActions ref={actionsRef}\n                              buttons={desktop?.buttons}\n                              onShowUserMenu={() => setShowUserMenu(!showUserMenu)}\n                              user={profile?.user}/>\n              <HamburgerButton hidden={!isAuthenticated}>\n                <IconButton action={() => setShowMobileMenu(!showMobileMenu)}\n                            ref={mobileMenuButtonRef}\n                            shape={'circular'}\n                            variant={'secondary'}>\n                  <Menu size=\"24px\"/>\n                </IconButton>\n              </HamburgerButton>\n            </RightSide>\n          </RowLayout>\n        </PageWidth>\n      </HeaderWrapper>\n      <MobileMenuBackdrop className={showMobileMenu ? 'open' : !showUserMenu && wasMobileMenuOpen ? 'closed' : ''}>\n        <MobileMenuWrapper ref={mobileMenuRef}\n                           role=\"menu\"\n                           aria-labelledby=\"UserMenuButton\">\n          <MobileMenu {...mobile}\n                      show={showMobileMenu}\n                      onClose={() => setShowMobileMenu(false)}\n                      profile={profile}/>\n        </MobileMenuWrapper>\n      </MobileMenuBackdrop>\n      {\n        desktop?.buttons?.some(a => a.type === 'profile') && !!profile &&\n        <UserMenuWrapper ref={userMenuRef}\n                         offsetRight={avatarRight}\n                         data-testid=\"testUserMenuWrapper\">\n          <UserMenu {...profile}\n                    show={showUserMenu}\n                    onHideUserMenu={() => setShowUserMenu(false)}/>\n        </UserMenuWrapper>\n      }\n    </>\n  );\n};\n\nexport default GlobalNavigationBar;\n"],"file":"GlobalNavigationBar.cjs"}
+{"version":3,"sources":["../../src/GlobalNavigationBar/GlobalNavigationBar.tsx"],"names":["HeaderWrapper","styled","header","COLORS","neutral_200","Z_INDEXES","sticky_menu","BREAKPOINTS","SMALL","MEDIUM","RowLayout","div","HamburgerButton","RightSide","MobileMenuBackdrop","backdrop","fadeIn","fadeOut","UserMenuWrapper","white","props","offsetRight","window","innerWidth","GlobalNavigationBar","name","isAuthenticated","logo","profile","mobile","desktop","testId","useMaxWidth","maxWidth","React","useState","showMobileMenu","setShowMobileMenu","wasMobileMenuOpen","showUserMenu","setShowUserMenu","actionsRef","useRef","profileButtonRef","current","buttons","find","a","type","ref","mobileMenuButtonRef","rightSideRef","avatarRight","setAvatarRight","userMenuRef","mobileMenuRef","useEffect","handleResize","profileRightOffset","getBoundingClientRect","right","addEventListener","removeEventListener","showBetaTag","onClick","to","items","filter","pinned","reverseRightSideOrder","action","user","some"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport Logo from './Logo';\nimport MainMenu from './desktop/MainMenu';\nimport {PageWidth} from '../Layouts';\nimport {COLORS, BREAKPOINTS} from '../styles';\nimport RightSideNav from './desktop/RightSideNav';\nimport MobileMenu from './mobile/MobileMenu';\nimport {Menu} from '../icons/systemicons/SystemIcons';\nimport UserMenu from './desktop/UserMenu';\nimport {fadeIn, fadeOut, Menu as MobileMenuWrapper} from './mobile/CommonStyles';\nimport {Z_INDEXES} from '../styles';\nimport {\n  DesktopNavigationMenuProps, MenuProfileButton,\n  MobileNavigationMenuProps,\n  ProfileMenu\n} from './types';\nimport {IconButton} from '../Button';\nimport DesktopActions, {DesktopActionsRef} from './desktop/DesktopActions';\nimport {usePreviousImmediate} from 'rooks';\nimport {useClickOutsideRef} from '../common';\n\nconst HeaderWrapper = styled.header`\n  background: white;\n  border-bottom: 1px solid ${COLORS.neutral_200};\n\n  z-index: ${Z_INDEXES.sticky_menu};\n  position: relative;\n\n  height: 48px;\n\n  ${BREAKPOINTS.SMALL} {\n    height: 56px;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    height: 64px;\n  }\n\n  @media all and (-ms-high-contrast: none) {\n    height: auto;\n  }\n\n  @media print {\n    border-bottom: none;\n  }\n`;\n\nconst RowLayout = styled.div`\n  display: flex;\n`;\n\n\nconst HamburgerButton = styled.div`\n  ${BREAKPOINTS.SMALL} button {\n    height: 56px;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    display: none;\n  }\n`;\n\nconst RightSide = styled.div`\n  display: flex;\n  margin: 0 0 0 auto;\n\n  &.reverse {\n    ${HamburgerButton} {\n      order: -1;\n    }\n\n    flex-direction: row-reverse;\n  }\n`;\n\nconst MobileMenuBackdrop = styled.div`\n  background: rgba(0, 0, 0, 0.5);\n  display: flex;\n  position: fixed;\n  left: 0;\n  top: 0;\n  bottom: 0;\n  right: 0;\n  height: 100vh;\n  width: 100vw;\n  overflow: hidden;\n  z-index: ${Z_INDEXES.backdrop};\n  visibility: hidden;\n\n\n  &.open {\n    visibility: visible;\n    animation: ${fadeIn} 0.3s ease-in-out;\n  }\n\n  &.closed {\n    visibility: hidden;\n    animation: ${fadeOut} 0.3s ease-in-out;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    visibility: hidden !important;\n  }\n`;\n\nconst UserMenuWrapper = styled.div<{ offsetRight?: number }>`\n  background-color: ${COLORS.white};\n  display: flex;\n  position: absolute;\n\n  ${BREAKPOINTS.MEDIUM} {\n    top: 56px;\n    right: ${(props) => (props.offsetRight ? `${window.innerWidth - props.offsetRight + 296}px` : '10%')};\n  }\n`;\n\n\ntype GlobalNavigationBarProps = {\n  isAuthenticated?: boolean;\n  useMaxWidth?: boolean;\n  maxWidth?: number;\n\n  name?: string;\n  logo?: { onClick?: () => void; to?: string; showBetaTag?: boolean; };\n\n  profile?: ProfileMenu;\n\n  mobile?: MobileNavigationMenuProps;\n  desktop?: DesktopNavigationMenuProps;\n\n  testId?: string;\n};\n\n/**\n * @param props\n * @constructor\n * @description This component is a global navigation header bar\n */\nconst GlobalNavigationBar = ({\n                               name,\n                               isAuthenticated,\n                               logo,\n                               profile,\n                               mobile,\n                               desktop,\n                               testId,\n                               useMaxWidth = true,\n                               maxWidth,\n                             }: GlobalNavigationBarProps): React.ReactElement<GlobalNavigationBarProps> => {\n  const [showMobileMenu, setShowMobileMenu] = React.useState(false);\n  const wasMobileMenuOpen = usePreviousImmediate(showMobileMenu);\n\n  const [showUserMenu, setShowUserMenu] = React.useState(false);\n\n  const actionsRef = React.useRef<DesktopActionsRef>(null);\n  const profileButtonRef = React.useRef<HTMLButtonElement | null>() as React.MutableRefObject<HTMLButtonElement | null | undefined>;\n  profileButtonRef.current = actionsRef?.current?.buttons?.find(a => a.type === 'profile')?.ref?.current;\n\n  const mobileMenuButtonRef = React.useRef<HTMLButtonElement>(null);\n\n  const rightSideRef = React.useRef(null);\n  const [avatarRight, setAvatarRight] = React.useState<number>(0);\n\n\n  const userMenuRef = useClickOutsideRef(() => setShowUserMenu(false), [profileButtonRef]);\n  const mobileMenuRef = useClickOutsideRef(() => setShowMobileMenu(false), [mobileMenuButtonRef]);\n\n  React.useEffect(() => {\n    if (!profileButtonRef.current) return;\n\n    const handleResize = () => {\n      const profileRightOffset = profileButtonRef.current?.getBoundingClientRect()?.right;\n      setAvatarRight(profileRightOffset || 0);\n    };\n\n    handleResize();\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, [profileButtonRef.current]);\n\n\n  return (\n    <>\n      <HeaderWrapper data-testid={testId}>\n        <PageWidth useMaxWidth={useMaxWidth} maxWidth={maxWidth}>\n          <RowLayout>\n            <Logo name={name || ''} showBetaTag={logo?.showBetaTag} onClick={logo?.onClick} to={logo?.to}/>\n            {\n              isAuthenticated &&\n              <MainMenu items={desktop?.items.filter(a => !a.pinned) || []} rightSideRef={rightSideRef}/>\n            }\n            <RightSide className={`${desktop?.reverseRightSideOrder ? 'reverse' : ''}`}\n                       ref={rightSideRef}>\n              <RightSideNav items={desktop?.items?.filter(a => a.pinned)} action={desktop?.action}/>\n              <DesktopActions ref={actionsRef}\n                              buttons={desktop?.buttons}\n                              onShowUserMenu={() => setShowUserMenu(!showUserMenu)}\n                              user={profile?.user}/>\n              <HamburgerButton hidden={!isAuthenticated}>\n                <IconButton action={() => setShowMobileMenu(!showMobileMenu)}\n                            ref={mobileMenuButtonRef}\n                            shape={'circular'}\n                            variant={'secondary'}>\n                  <Menu size=\"24px\"/>\n                </IconButton>\n              </HamburgerButton>\n            </RightSide>\n          </RowLayout>\n        </PageWidth>\n      </HeaderWrapper>\n      <MobileMenuBackdrop className={showMobileMenu ? 'open' : !showUserMenu && wasMobileMenuOpen ? 'closed' : ''}>\n        <MobileMenuWrapper ref={mobileMenuRef}\n                           role=\"menu\"\n                           aria-labelledby=\"UserMenuButton\">\n          <MobileMenu {...mobile}\n                      show={showMobileMenu}\n                      onClose={() => setShowMobileMenu(false)}\n                      profile={profile}/>\n        </MobileMenuWrapper>\n      </MobileMenuBackdrop>\n      {\n        desktop?.buttons?.some(a => a.type === 'profile') && !!profile &&\n        <UserMenuWrapper ref={userMenuRef}\n                         offsetRight={avatarRight}\n                         data-testid=\"testUserMenuWrapper\">\n          <UserMenu {...profile}\n                    show={showUserMenu}\n                    onHideUserMenu={() => setShowUserMenu(false)}/>\n        </UserMenuWrapper>\n      }\n    </>\n  );\n};\n\nexport default GlobalNavigationBar;\n"],"file":"GlobalNavigationBar.cjs"}

package/dist/GlobalNavigationBar/GlobalNavigationBar.d.ts

@@ -3,6 +3,7 @@ import { DesktopNavigationMenuProps, MobileNavigationMenuProps, ProfileMenu } fr
 declare type GlobalNavigationBarProps = {
     isAuthenticated?: boolean;
     useMaxWidth?: boolean;
+    maxWidth?: number;
     name?: string;
     logo?: {
         onClick?: () => void;
@@ -19,5 +20,5 @@ declare type GlobalNavigationBarProps = {
  * @constructor
  * @description This component is a global navigation header bar
  */
-declare const GlobalNavigationBar: ({ name, isAuthenticated, logo, profile, mobile, desktop, testId, useMaxWidth, }: GlobalNavigationBarProps) => React.ReactElement<GlobalNavigationBarProps>;
+declare const GlobalNavigationBar: ({ name, isAuthenticated, logo, profile, mobile, desktop, testId, useMaxWidth, maxWidth, }: GlobalNavigationBarProps) => React.ReactElement<GlobalNavigationBarProps>;
 export default GlobalNavigationBar;

package/dist/GlobalNavigationBar/GlobalNavigationBar.js

@@ -19,12 +19,12 @@ import RightSideNav from './desktop/RightSideNav';
 import MobileMenu from './mobile/MobileMenu';
 import { Menu } from '../icons/systemicons/SystemIcons';
 import UserMenu from './desktop/UserMenu';
-import useClickOutside from '../hooks/useClickOutside';
 import { fadeIn, fadeOut, Menu as MobileMenuWrapper } from './mobile/CommonStyles';
 import { Z_INDEXES } from '../styles';
 import { IconButton } from '../Button';
 import DesktopActions from './desktop/DesktopActions';
 import { usePreviousImmediate } from 'rooks';
+import { useClickOutsideRef } from '../common';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -53,7 +53,8 @@ var GlobalNavigationBar = function GlobalNavigationBar(_ref) {
       desktop = _ref.desktop,
       testId = _ref.testId,
       _ref$useMaxWidth = _ref.useMaxWidth,
-      useMaxWidth = _ref$useMaxWidth === void 0 ? true : _ref$useMaxWidth;
+      useMaxWidth = _ref$useMaxWidth === void 0 ? true : _ref$useMaxWidth,
+      maxWidth = _ref.maxWidth;
 
   var _React$useState = React.useState(false),
       _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -67,8 +68,6 @@ var GlobalNavigationBar = function GlobalNavigationBar(_ref) {
       showUserMenu = _React$useState4[0],
       setShowUserMenu = _React$useState4[1];
 
-  var mobileMenuRef = React.useRef(null);
-  var userMenuRef = React.useRef(null);
   var actionsRef = React.useRef(null);
   var profileButtonRef = React.useRef();
   profileButtonRef.current = actionsRef === null || actionsRef === void 0 ? void 0 : (_actionsRef$current = actionsRef.current) === null || _actionsRef$current === void 0 ? void 0 : (_actionsRef$current$b = _actionsRef$current.buttons) === null || _actionsRef$current$b === void 0 ? void 0 : (_actionsRef$current$b2 = _actionsRef$current$b.find(function (a) {
@@ -82,10 +81,10 @@ var GlobalNavigationBar = function GlobalNavigationBar(_ref) {
       avatarRight = _React$useState6[0],
       setAvatarRight = _React$useState6[1];
 
-  useClickOutside(userMenuRef, function () {
+  var userMenuRef = useClickOutsideRef(function () {
     return setShowUserMenu(false);
   }, [profileButtonRef]);
-  useClickOutside(mobileMenuRef, function () {
+  var mobileMenuRef = useClickOutsideRef(function () {
     return setShowMobileMenu(false);
   }, [mobileMenuButtonRef]);
   React.useEffect(function () {
@@ -109,6 +108,7 @@ var GlobalNavigationBar = function GlobalNavigationBar(_ref) {
       "data-testid": testId,
       children: /*#__PURE__*/_jsx(PageWidth, {
         useMaxWidth: useMaxWidth,
+        maxWidth: maxWidth,
         children: /*#__PURE__*/_jsxs(RowLayout, {
           children: [/*#__PURE__*/_jsx(Logo, {
             name: name || '',
@@ -185,6 +185,7 @@ var GlobalNavigationBar = function GlobalNavigationBar(_ref) {
 GlobalNavigationBar.propTypes = {
   isAuthenticated: _pt.bool,
   useMaxWidth: _pt.bool,
+  maxWidth: _pt.number,
   name: _pt.string,
   logo: _pt.shape({
     onClick: _pt.func,

package/dist/GlobalNavigationBar/GlobalNavigationBar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/GlobalNavigationBar/GlobalNavigationBar.tsx"],"names":["React","styled","Logo","MainMenu","PageWidth","COLORS","BREAKPOINTS","RightSideNav","MobileMenu","Menu","UserMenu","useClickOutside","fadeIn","fadeOut","MobileMenuWrapper","Z_INDEXES","IconButton","DesktopActions","usePreviousImmediate","HeaderWrapper","header","neutral_200","sticky_menu","SMALL","MEDIUM","RowLayout","div","HamburgerButton","RightSide","MobileMenuBackdrop","backdrop","UserMenuWrapper","white","props","offsetRight","window","innerWidth","GlobalNavigationBar","name","isAuthenticated","logo","profile","mobile","desktop","testId","useMaxWidth","useState","showMobileMenu","setShowMobileMenu","wasMobileMenuOpen","showUserMenu","setShowUserMenu","mobileMenuRef","useRef","userMenuRef","actionsRef","profileButtonRef","current","buttons","find","a","type","ref","mobileMenuButtonRef","rightSideRef","avatarRight","setAvatarRight","useEffect","handleResize","profileRightOffset","getBoundingClientRect","right","addEventListener","removeEventListener","showBetaTag","onClick","to","items","filter","pinned","reverseRightSideOrder","action","user","some"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport Logo from './Logo';\nimport MainMenu from './desktop/MainMenu';\nimport {PageWidth} from '../Layouts';\nimport {COLORS, BREAKPOINTS} from '../styles';\nimport RightSideNav from './desktop/RightSideNav';\nimport MobileMenu from './mobile/MobileMenu';\nimport {Menu} from '../icons/systemicons/SystemIcons';\nimport UserMenu from './desktop/UserMenu';\nimport useClickOutside from '../hooks/useClickOutside';\nimport {fadeIn, fadeOut, Menu as MobileMenuWrapper} from './mobile/CommonStyles';\nimport {Z_INDEXES} from '../styles';\nimport {\n  DesktopNavigationMenuProps, MenuProfileButton,\n  MobileNavigationMenuProps,\n  ProfileMenu\n} from './types';\nimport {IconButton} from '../Button';\nimport DesktopActions, {DesktopActionsRef} from './desktop/DesktopActions';\nimport {usePreviousImmediate} from 'rooks';\n\nconst HeaderWrapper = styled.header`\n  background: white;\n  border-bottom: 1px solid ${COLORS.neutral_200};\n\n  z-index: ${Z_INDEXES.sticky_menu};\n  position: relative;\n\n  height: 48px;\n\n  ${BREAKPOINTS.SMALL} {\n    height: 56px;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    height: 64px;\n  }\n\n  @media all and (-ms-high-contrast: none) {\n    height: auto;\n  }\n\n  @media print {\n    border-bottom: none;\n  }\n`;\n\nconst RowLayout = styled.div`\n  display: flex;\n`;\n\n\nconst HamburgerButton = styled.div`\n  ${BREAKPOINTS.SMALL} button {\n    height: 56px;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    display: none;\n  }\n`;\n\nconst RightSide = styled.div`\n  display: flex;\n  margin: 0 0 0 auto;\n\n  &.reverse {\n    ${HamburgerButton} {\n      order: -1;\n    }\n\n    flex-direction: row-reverse;\n  }\n`;\n\nconst MobileMenuBackdrop = styled.div`\n  background: rgba(0, 0, 0, 0.5);\n  display: flex;\n  position: fixed;\n  left: 0;\n  top: 0;\n  bottom: 0;\n  right: 0;\n  height: 100vh;\n  width: 100vw;\n  overflow: hidden;\n  z-index: ${Z_INDEXES.backdrop};\n  visibility: hidden;\n\n\n  &.open {\n    visibility: visible;\n    animation: ${fadeIn} 0.3s ease-in-out;\n  }\n\n  &.closed {\n    visibility: hidden;\n    animation: ${fadeOut} 0.3s ease-in-out;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    visibility: hidden !important;\n  }\n`;\n\nconst UserMenuWrapper = styled.div<{ offsetRight?: number }>`\n  background-color: ${COLORS.white};\n  display: flex;\n  position: absolute;\n\n  ${BREAKPOINTS.MEDIUM} {\n    top: 56px;\n    right: ${(props) => (props.offsetRight ? `${window.innerWidth - props.offsetRight + 296}px` : '10%')};\n  }\n`;\n\n\ntype GlobalNavigationBarProps = {\n  isAuthenticated?: boolean;\n  useMaxWidth?: boolean;\n\n  name?: string;\n  logo?: { onClick?: () => void; to?: string; showBetaTag?: boolean; };\n\n  profile?: ProfileMenu;\n\n  mobile?: MobileNavigationMenuProps;\n  desktop?: DesktopNavigationMenuProps;\n\n  testId?: string;\n};\n\n/**\n * @param props\n * @constructor\n * @description This component is a global navigation header bar\n */\nconst GlobalNavigationBar = ({\n                               name,\n                               isAuthenticated,\n                               logo,\n                               profile,\n                               mobile,\n                               desktop,\n                               testId,\n                               useMaxWidth = true,\n                             }: GlobalNavigationBarProps): React.ReactElement<GlobalNavigationBarProps> => {\n  const [showMobileMenu, setShowMobileMenu] = React.useState(false);\n  const wasMobileMenuOpen = usePreviousImmediate(showMobileMenu);\n\n  const [showUserMenu, setShowUserMenu] = React.useState(false);\n  const mobileMenuRef = React.useRef(null);\n  const userMenuRef = React.useRef<HTMLDivElement>(null);\n\n  const actionsRef = React.useRef<DesktopActionsRef>(null);\n  const profileButtonRef = React.useRef<HTMLButtonElement | null>() as React.MutableRefObject<HTMLButtonElement | null | undefined>;\n  profileButtonRef.current = actionsRef?.current?.buttons?.find(a => a.type === 'profile')?.ref?.current;\n\n  const mobileMenuButtonRef = React.useRef<HTMLButtonElement>(null);\n\n  const rightSideRef = React.useRef(null);\n  const [avatarRight, setAvatarRight] = React.useState<number>(0);\n\n\n  useClickOutside(userMenuRef, () => setShowUserMenu(false), [profileButtonRef]);\n  useClickOutside(mobileMenuRef, () => setShowMobileMenu(false), [mobileMenuButtonRef]);\n\n  React.useEffect(() => {\n    if (!profileButtonRef.current) return;\n\n    const handleResize = () => {\n      const profileRightOffset = profileButtonRef.current?.getBoundingClientRect()?.right;\n      setAvatarRight(profileRightOffset || 0);\n    };\n\n    handleResize();\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, [profileButtonRef.current]);\n\n\n  return (\n    <>\n      <HeaderWrapper data-testid={testId}>\n        <PageWidth useMaxWidth={useMaxWidth}>\n          <RowLayout>\n            <Logo name={name || ''} showBetaTag={logo?.showBetaTag} onClick={logo?.onClick} to={logo?.to}/>\n            {\n              isAuthenticated &&\n              <MainMenu items={desktop?.items.filter(a => !a.pinned) || []} rightSideRef={rightSideRef}/>\n            }\n            <RightSide className={`${desktop?.reverseRightSideOrder ? 'reverse' : ''}`}\n                       ref={rightSideRef}>\n              <RightSideNav items={desktop?.items?.filter(a => a.pinned)} action={desktop?.action}/>\n              <DesktopActions ref={actionsRef}\n                              buttons={desktop?.buttons}\n                              onShowUserMenu={() => setShowUserMenu(!showUserMenu)}\n                              user={profile?.user}/>\n              <HamburgerButton hidden={!isAuthenticated}>\n                <IconButton action={() => setShowMobileMenu(!showMobileMenu)}\n                            ref={mobileMenuButtonRef}\n                            shape={'circular'}\n                            variant={'secondary'}>\n                  <Menu size=\"24px\"/>\n                </IconButton>\n              </HamburgerButton>\n            </RightSide>\n          </RowLayout>\n        </PageWidth>\n      </HeaderWrapper>\n      <MobileMenuBackdrop className={showMobileMenu ? 'open' : !showUserMenu && wasMobileMenuOpen ? 'closed' : ''}>\n        <MobileMenuWrapper ref={mobileMenuRef}\n                           role=\"menu\"\n                           aria-labelledby=\"UserMenuButton\">\n          <MobileMenu {...mobile}\n                      show={showMobileMenu}\n                      onClose={() => setShowMobileMenu(false)}\n                      profile={profile}/>\n        </MobileMenuWrapper>\n      </MobileMenuBackdrop>\n      {\n        desktop?.buttons?.some(a => a.type === 'profile') && !!profile &&\n        <UserMenuWrapper ref={userMenuRef}\n                         offsetRight={avatarRight}\n                         data-testid=\"testUserMenuWrapper\">\n          <UserMenu {...profile}\n                    show={showUserMenu}\n                    onHideUserMenu={() => setShowUserMenu(false)}/>\n        </UserMenuWrapper>\n      }\n    </>\n  );\n};\n\nexport default GlobalNavigationBar;\n"],"file":"GlobalNavigationBar.js"}
+{"version":3,"sources":["../../src/GlobalNavigationBar/GlobalNavigationBar.tsx"],"names":["React","styled","Logo","MainMenu","PageWidth","COLORS","BREAKPOINTS","RightSideNav","MobileMenu","Menu","UserMenu","fadeIn","fadeOut","MobileMenuWrapper","Z_INDEXES","IconButton","DesktopActions","usePreviousImmediate","useClickOutsideRef","HeaderWrapper","header","neutral_200","sticky_menu","SMALL","MEDIUM","RowLayout","div","HamburgerButton","RightSide","MobileMenuBackdrop","backdrop","UserMenuWrapper","white","props","offsetRight","window","innerWidth","GlobalNavigationBar","name","isAuthenticated","logo","profile","mobile","desktop","testId","useMaxWidth","maxWidth","useState","showMobileMenu","setShowMobileMenu","wasMobileMenuOpen","showUserMenu","setShowUserMenu","actionsRef","useRef","profileButtonRef","current","buttons","find","a","type","ref","mobileMenuButtonRef","rightSideRef","avatarRight","setAvatarRight","userMenuRef","mobileMenuRef","useEffect","handleResize","profileRightOffset","getBoundingClientRect","right","addEventListener","removeEventListener","showBetaTag","onClick","to","items","filter","pinned","reverseRightSideOrder","action","user","some"],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AAEA,OAAOC,IAAP,MAAiB,QAAjB;AACA,OAAOC,QAAP,MAAqB,oBAArB;AACA,SAAQC,SAAR,QAAwB,YAAxB;AACA,SAAQC,MAAR,EAAgBC,WAAhB,QAAkC,WAAlC;AACA,OAAOC,YAAP,MAAyB,wBAAzB;AACA,OAAOC,UAAP,MAAuB,qBAAvB;AACA,SAAQC,IAAR,QAAmB,kCAAnB;AACA,OAAOC,QAAP,MAAqB,oBAArB;AACA,SAAQC,MAAR,EAAgBC,OAAhB,EAAyBH,IAAI,IAAII,iBAAjC,QAAyD,uBAAzD;AACA,SAAQC,SAAR,QAAwB,WAAxB;AAMA,SAAQC,UAAR,QAAyB,WAAzB;AACA,OAAOC,cAAP,MAAgD,0BAAhD;AACA,SAAQC,oBAAR,QAAmC,OAAnC;AACA,SAAQC,kBAAR,QAAiC,WAAjC;;;;AAEA,IAAMC,aAAa,GAAGlB,MAAM,CAACmB,MAAV,iYAEUf,MAAM,CAACgB,WAFjB,EAINP,SAAS,CAACQ,WAJJ,EASfhB,WAAW,CAACiB,KATG,EAafjB,WAAW,CAACkB,MAbG,CAAnB;AA0BA,IAAMC,SAAS,GAAGxB,MAAM,CAACyB,GAAV,2FAAf;AAKA,IAAMC,eAAe,GAAG1B,MAAM,CAACyB,GAAV,wJACjBpB,WAAW,CAACiB,KADK,EAKjBjB,WAAW,CAACkB,MALK,CAArB;AAUA,IAAMI,SAAS,GAAG3B,MAAM,CAACyB,GAAV,kNAKTC,eALS,CAAf;AAaA,IAAME,kBAAkB,GAAG5B,MAAM,CAACyB,GAAV,sgBAWXZ,SAAS,CAACgB,QAXC,EAiBPnB,MAjBO,EAsBPC,OAtBO,EAyBpBN,WAAW,CAACkB,MAzBQ,CAAxB;AA8BA,IAAMO,eAAe,GAAG9B,MAAM,CAACyB,GAAV,iMACCrB,MAAM,CAAC2B,KADR,EAKjB1B,WAAW,CAACkB,MALK,EAOR,UAACS,KAAD;AAAA,SAAYA,KAAK,CAACC,WAAN,aAAuBC,MAAM,CAACC,UAAP,GAAoBH,KAAK,CAACC,WAA1B,GAAwC,GAA/D,UAAyE,KAArF;AAAA,CAPQ,CAArB;;AA4BA;AACA;AACA;AACA;AACA;AACA,IAAMG,mBAAmB,GAAG,SAAtBA,mBAAsB,OAU+E;AAAA;;AAAA,MAT5EC,IAS4E,QAT5EA,IAS4E;AAAA,MAR5EC,eAQ4E,QAR5EA,eAQ4E;AAAA,MAP5EC,IAO4E,QAP5EA,IAO4E;AAAA,MAN5EC,OAM4E,QAN5EA,OAM4E;AAAA,MAL5EC,MAK4E,QAL5EA,MAK4E;AAAA,MAJ5EC,OAI4E,QAJ5EA,OAI4E;AAAA,MAH5EC,MAG4E,QAH5EA,MAG4E;AAAA,8BAF5EC,WAE4E;AAAA,MAF5EA,WAE4E,iCAF9D,IAE8D;AAAA,MAD5EC,QAC4E,QAD5EA,QAC4E;;AACzG,wBAA4C9C,KAAK,CAAC+C,QAAN,CAAe,KAAf,CAA5C;AAAA;AAAA,MAAOC,cAAP;AAAA,MAAuBC,iBAAvB;;AACA,MAAMC,iBAAiB,GAAGjC,oBAAoB,CAAC+B,cAAD,CAA9C;;AAEA,yBAAwChD,KAAK,CAAC+C,QAAN,CAAe,KAAf,CAAxC;AAAA;AAAA,MAAOI,YAAP;AAAA,MAAqBC,eAArB;;AAEA,MAAMC,UAAU,GAAGrD,KAAK,CAACsD,MAAN,CAAgC,IAAhC,CAAnB;AACA,MAAMC,gBAAgB,GAAGvD,KAAK,CAACsD,MAAN,EAAzB;AACAC,EAAAA,gBAAgB,CAACC,OAAjB,GAA2BH,UAA3B,aAA2BA,UAA3B,8CAA2BA,UAAU,CAAEG,OAAvC,iFAA2B,oBAAqBC,OAAhD,oFAA2B,sBAA8BC,IAA9B,CAAmC,UAAAC,CAAC;AAAA,WAAIA,CAAC,CAACC,IAAF,KAAW,SAAf;AAAA,GAApC,CAA3B,qFAA2B,uBAA+DC,GAA1F,2DAA2B,uBAAoEL,OAA/F;AAEA,MAAMM,mBAAmB,GAAG9D,KAAK,CAACsD,MAAN,CAAgC,IAAhC,CAA5B;AAEA,MAAMS,YAAY,GAAG/D,KAAK,CAACsD,MAAN,CAAa,IAAb,CAArB;;AACA,yBAAsCtD,KAAK,CAAC+C,QAAN,CAAuB,CAAvB,CAAtC;AAAA;AAAA,MAAOiB,WAAP;AAAA,MAAoBC,cAApB;;AAGA,MAAMC,WAAW,GAAGhD,kBAAkB,CAAC;AAAA,WAAMkC,eAAe,CAAC,KAAD,CAArB;AAAA,GAAD,EAA+B,CAACG,gBAAD,CAA/B,CAAtC;AACA,MAAMY,aAAa,GAAGjD,kBAAkB,CAAC;AAAA,WAAM+B,iBAAiB,CAAC,KAAD,CAAvB;AAAA,GAAD,EAAiC,CAACa,mBAAD,CAAjC,CAAxC;AAEA9D,EAAAA,KAAK,CAACoE,SAAN,CAAgB,YAAM;AACpB,QAAI,CAACb,gBAAgB,CAACC,OAAtB,EAA+B;;AAE/B,QAAMa,YAAY,GAAG,SAAfA,YAAe,GAAM;AAAA;;AACzB,UAAMC,kBAAkB,4BAAGf,gBAAgB,CAACC,OAApB,oFAAG,sBAA0Be,qBAA1B,EAAH,2DAAG,uBAAmDC,KAA9E;AACAP,MAAAA,cAAc,CAACK,kBAAkB,IAAI,CAAvB,CAAd;AACD,KAHD;;AAKAD,IAAAA,YAAY;AACZlC,IAAAA,MAAM,CAACsC,gBAAP,CAAwB,QAAxB,EAAkCJ,YAAlC;AACA,WAAO;AAAA,aAAMlC,MAAM,CAACuC,mBAAP,CAA2B,QAA3B,EAAqCL,YAArC,CAAN;AAAA,KAAP;AACD,GAXD,EAWG,CAACd,gBAAgB,CAACC,OAAlB,CAXH;AAcA,sBACE;AAAA,4BACE,KAAC,aAAD;AAAe,qBAAaZ,MAA5B;AAAA,6BACE,KAAC,SAAD;AAAW,QAAA,WAAW,EAAEC,WAAxB;AAAqC,QAAA,QAAQ,EAAEC,QAA/C;AAAA,+BACE,MAAC,SAAD;AAAA,kCACE,KAAC,IAAD;AAAM,YAAA,IAAI,EAAER,IAAI,IAAI,EAApB;AAAwB,YAAA,WAAW,EAAEE,IAAF,aAAEA,IAAF,uBAAEA,IAAI,CAAEmC,WAA3C;AAAwD,YAAA,OAAO,EAAEnC,IAAF,aAAEA,IAAF,uBAAEA,IAAI,CAAEoC,OAAvE;AAAgF,YAAA,EAAE,EAAEpC,IAAF,aAAEA,IAAF,uBAAEA,IAAI,CAAEqC;AAA1F,YADF,EAGItC,eAAe,iBACf,KAAC,QAAD;AAAU,YAAA,KAAK,EAAE,CAAAI,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAEmC,KAAT,CAAeC,MAAf,CAAsB,UAAApB,CAAC;AAAA,qBAAI,CAACA,CAAC,CAACqB,MAAP;AAAA,aAAvB,MAAyC,EAA1D;AAA8D,YAAA,YAAY,EAAEjB;AAA5E,YAJJ,eAME,MAAC,SAAD;AAAW,YAAA,SAAS,YAAKpB,OAAO,SAAP,IAAAA,OAAO,WAAP,IAAAA,OAAO,CAAEsC,qBAAT,GAAiC,SAAjC,GAA6C,EAAlD,CAApB;AACW,YAAA,GAAG,EAAElB,YADhB;AAAA,oCAEE,KAAC,YAAD;AAAc,cAAA,KAAK,EAAEpB,OAAF,aAAEA,OAAF,yCAAEA,OAAO,CAAEmC,KAAX,mDAAE,eAAgBC,MAAhB,CAAuB,UAAApB,CAAC;AAAA,uBAAIA,CAAC,CAACqB,MAAN;AAAA,eAAxB,CAArB;AAA4D,cAAA,MAAM,EAAErC,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEuC;AAA7E,cAFF,eAGE,KAAC,cAAD;AAAgB,cAAA,GAAG,EAAE7B,UAArB;AACgB,cAAA,OAAO,EAAEV,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEc,OADlC;AAEgB,cAAA,cAAc,EAAE;AAAA,uBAAML,eAAe,CAAC,CAACD,YAAF,CAArB;AAAA,eAFhC;AAGgB,cAAA,IAAI,EAAEV,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAE0C;AAH/B,cAHF,eAOE,KAAC,eAAD;AAAiB,cAAA,MAAM,EAAE,CAAC5C,eAA1B;AAAA,qCACE,KAAC,UAAD;AAAY,gBAAA,MAAM,EAAE;AAAA,yBAAMU,iBAAiB,CAAC,CAACD,cAAF,CAAvB;AAAA,iBAApB;AACY,gBAAA,GAAG,EAAEc,mBADjB;AAEY,gBAAA,KAAK,EAAE,UAFnB;AAGY,gBAAA,OAAO,EAAE,WAHrB;AAAA,uCAIE,KAAC,IAAD;AAAM,kBAAA,IAAI,EAAC;AAAX;AAJF;AADF,cAPF;AAAA,YANF;AAAA;AADF;AADF,MADF,eA4BE,KAAC,kBAAD;AAAoB,MAAA,SAAS,EAAEd,cAAc,GAAG,MAAH,GAAY,CAACG,YAAD,IAAiBD,iBAAjB,GAAqC,QAArC,GAAgD,EAAzG;AAAA,6BACE,KAAC,iBAAD;AAAmB,QAAA,GAAG,EAAEiB,aAAxB;AACmB,QAAA,IAAI,EAAC,MADxB;AAEmB,2BAAgB,gBAFnC;AAAA,+BAGE,KAAC,UAAD,kCAAgBzB,MAAhB;AACY,UAAA,IAAI,EAAEM,cADlB;AAEY,UAAA,OAAO,EAAE;AAAA,mBAAMC,iBAAiB,CAAC,KAAD,CAAvB;AAAA,WAFrB;AAGY,UAAA,OAAO,EAAER;AAHrB;AAHF;AADF,MA5BF,EAuCI,CAAAE,OAAO,SAAP,IAAAA,OAAO,WAAP,gCAAAA,OAAO,CAAEc,OAAT,sEAAkB2B,IAAlB,CAAuB,UAAAzB,CAAC;AAAA,aAAIA,CAAC,CAACC,IAAF,KAAW,SAAf;AAAA,KAAxB,MAAqD,CAAC,CAACnB,OAAvD,iBACA,KAAC,eAAD;AAAiB,MAAA,GAAG,EAAEyB,WAAtB;AACiB,MAAA,WAAW,EAAEF,WAD9B;AAEiB,qBAAY,qBAF7B;AAAA,6BAGE,KAAC,QAAD,kCAAcvB,OAAd;AACU,QAAA,IAAI,EAAEU,YADhB;AAEU,QAAA,cAAc,EAAE;AAAA,iBAAMC,eAAe,CAAC,KAAD,CAArB;AAAA;AAF1B;AAHF,MAxCJ;AAAA,IADF;AAmDD,CA9FD;;;AApBEb,EAAAA,e;AACAM,EAAAA,W;AACAC,EAAAA,Q;AAEAR,EAAAA,I;AACAE,EAAAA,I;AAASoC,IAAAA,O;AAAsBC,IAAAA,E;AAAaF,IAAAA,W;;AAO5C/B,EAAAA,M;;AAwGF,eAAeP,mBAAf","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport Logo from './Logo';\nimport MainMenu from './desktop/MainMenu';\nimport {PageWidth} from '../Layouts';\nimport {COLORS, BREAKPOINTS} from '../styles';\nimport RightSideNav from './desktop/RightSideNav';\nimport MobileMenu from './mobile/MobileMenu';\nimport {Menu} from '../icons/systemicons/SystemIcons';\nimport UserMenu from './desktop/UserMenu';\nimport {fadeIn, fadeOut, Menu as MobileMenuWrapper} from './mobile/CommonStyles';\nimport {Z_INDEXES} from '../styles';\nimport {\n  DesktopNavigationMenuProps, MenuProfileButton,\n  MobileNavigationMenuProps,\n  ProfileMenu\n} from './types';\nimport {IconButton} from '../Button';\nimport DesktopActions, {DesktopActionsRef} from './desktop/DesktopActions';\nimport {usePreviousImmediate} from 'rooks';\nimport {useClickOutsideRef} from '../common';\n\nconst HeaderWrapper = styled.header`\n  background: white;\n  border-bottom: 1px solid ${COLORS.neutral_200};\n\n  z-index: ${Z_INDEXES.sticky_menu};\n  position: relative;\n\n  height: 48px;\n\n  ${BREAKPOINTS.SMALL} {\n    height: 56px;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    height: 64px;\n  }\n\n  @media all and (-ms-high-contrast: none) {\n    height: auto;\n  }\n\n  @media print {\n    border-bottom: none;\n  }\n`;\n\nconst RowLayout = styled.div`\n  display: flex;\n`;\n\n\nconst HamburgerButton = styled.div`\n  ${BREAKPOINTS.SMALL} button {\n    height: 56px;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    display: none;\n  }\n`;\n\nconst RightSide = styled.div`\n  display: flex;\n  margin: 0 0 0 auto;\n\n  &.reverse {\n    ${HamburgerButton} {\n      order: -1;\n    }\n\n    flex-direction: row-reverse;\n  }\n`;\n\nconst MobileMenuBackdrop = styled.div`\n  background: rgba(0, 0, 0, 0.5);\n  display: flex;\n  position: fixed;\n  left: 0;\n  top: 0;\n  bottom: 0;\n  right: 0;\n  height: 100vh;\n  width: 100vw;\n  overflow: hidden;\n  z-index: ${Z_INDEXES.backdrop};\n  visibility: hidden;\n\n\n  &.open {\n    visibility: visible;\n    animation: ${fadeIn} 0.3s ease-in-out;\n  }\n\n  &.closed {\n    visibility: hidden;\n    animation: ${fadeOut} 0.3s ease-in-out;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    visibility: hidden !important;\n  }\n`;\n\nconst UserMenuWrapper = styled.div<{ offsetRight?: number }>`\n  background-color: ${COLORS.white};\n  display: flex;\n  position: absolute;\n\n  ${BREAKPOINTS.MEDIUM} {\n    top: 56px;\n    right: ${(props) => (props.offsetRight ? `${window.innerWidth - props.offsetRight + 296}px` : '10%')};\n  }\n`;\n\n\ntype GlobalNavigationBarProps = {\n  isAuthenticated?: boolean;\n  useMaxWidth?: boolean;\n  maxWidth?: number;\n\n  name?: string;\n  logo?: { onClick?: () => void; to?: string; showBetaTag?: boolean; };\n\n  profile?: ProfileMenu;\n\n  mobile?: MobileNavigationMenuProps;\n  desktop?: DesktopNavigationMenuProps;\n\n  testId?: string;\n};\n\n/**\n * @param props\n * @constructor\n * @description This component is a global navigation header bar\n */\nconst GlobalNavigationBar = ({\n                               name,\n                               isAuthenticated,\n                               logo,\n                               profile,\n                               mobile,\n                               desktop,\n                               testId,\n                               useMaxWidth = true,\n                               maxWidth,\n                             }: GlobalNavigationBarProps): React.ReactElement<GlobalNavigationBarProps> => {\n  const [showMobileMenu, setShowMobileMenu] = React.useState(false);\n  const wasMobileMenuOpen = usePreviousImmediate(showMobileMenu);\n\n  const [showUserMenu, setShowUserMenu] = React.useState(false);\n\n  const actionsRef = React.useRef<DesktopActionsRef>(null);\n  const profileButtonRef = React.useRef<HTMLButtonElement | null>() as React.MutableRefObject<HTMLButtonElement | null | undefined>;\n  profileButtonRef.current = actionsRef?.current?.buttons?.find(a => a.type === 'profile')?.ref?.current;\n\n  const mobileMenuButtonRef = React.useRef<HTMLButtonElement>(null);\n\n  const rightSideRef = React.useRef(null);\n  const [avatarRight, setAvatarRight] = React.useState<number>(0);\n\n\n  const userMenuRef = useClickOutsideRef(() => setShowUserMenu(false), [profileButtonRef]);\n  const mobileMenuRef = useClickOutsideRef(() => setShowMobileMenu(false), [mobileMenuButtonRef]);\n\n  React.useEffect(() => {\n    if (!profileButtonRef.current) return;\n\n    const handleResize = () => {\n      const profileRightOffset = profileButtonRef.current?.getBoundingClientRect()?.right;\n      setAvatarRight(profileRightOffset || 0);\n    };\n\n    handleResize();\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, [profileButtonRef.current]);\n\n\n  return (\n    <>\n      <HeaderWrapper data-testid={testId}>\n        <PageWidth useMaxWidth={useMaxWidth} maxWidth={maxWidth}>\n          <RowLayout>\n            <Logo name={name || ''} showBetaTag={logo?.showBetaTag} onClick={logo?.onClick} to={logo?.to}/>\n            {\n              isAuthenticated &&\n              <MainMenu items={desktop?.items.filter(a => !a.pinned) || []} rightSideRef={rightSideRef}/>\n            }\n            <RightSide className={`${desktop?.reverseRightSideOrder ? 'reverse' : ''}`}\n                       ref={rightSideRef}>\n              <RightSideNav items={desktop?.items?.filter(a => a.pinned)} action={desktop?.action}/>\n              <DesktopActions ref={actionsRef}\n                              buttons={desktop?.buttons}\n                              onShowUserMenu={() => setShowUserMenu(!showUserMenu)}\n                              user={profile?.user}/>\n              <HamburgerButton hidden={!isAuthenticated}>\n                <IconButton action={() => setShowMobileMenu(!showMobileMenu)}\n                            ref={mobileMenuButtonRef}\n                            shape={'circular'}\n                            variant={'secondary'}>\n                  <Menu size=\"24px\"/>\n                </IconButton>\n              </HamburgerButton>\n            </RightSide>\n          </RowLayout>\n        </PageWidth>\n      </HeaderWrapper>\n      <MobileMenuBackdrop className={showMobileMenu ? 'open' : !showUserMenu && wasMobileMenuOpen ? 'closed' : ''}>\n        <MobileMenuWrapper ref={mobileMenuRef}\n                           role=\"menu\"\n                           aria-labelledby=\"UserMenuButton\">\n          <MobileMenu {...mobile}\n                      show={showMobileMenu}\n                      onClose={() => setShowMobileMenu(false)}\n                      profile={profile}/>\n        </MobileMenuWrapper>\n      </MobileMenuBackdrop>\n      {\n        desktop?.buttons?.some(a => a.type === 'profile') && !!profile &&\n        <UserMenuWrapper ref={userMenuRef}\n                         offsetRight={avatarRight}\n                         data-testid=\"testUserMenuWrapper\">\n          <UserMenu {...profile}\n                    show={showUserMenu}\n                    onHideUserMenu={() => setShowUserMenu(false)}/>\n        </UserMenuWrapper>\n      }\n    </>\n  );\n};\n\nexport default GlobalNavigationBar;\n"],"file":"GlobalNavigationBar.js"}

package/dist/GlobalNavigationBar/desktop/MainMenu.cjs

@@ -106,6 +106,9 @@ var MainMenu = function MainMenu(_ref) {
       window.removeEventListener('resize', recalculateNumberOfItemsAllowed);
     };
   }, []);
+  React.useEffect(function () {
+    recalculateNumberOfItemsAllowed();
+  }, [items.length]);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(NavContainer, {
     className: "GlobalNavigationMainMenu",
     ref: mainMenuRef,
@@ -116,17 +119,14 @@ var MainMenu = function MainMenu(_ref) {
         exact: no.exact,
         className: "disabled",
         onMouseDown: _common.defaultOnMouseDownHandler,
-        onClick: function onClick() {
-          return no.action && no.action();
-        },
         children: no === null || no === void 0 ? void 0 : no.label
       }, no.label) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_NavItem.NavItem, {
         as: _reactRouterDom.NavLink,
         exact: no.exact,
         to: no.to || '',
         onMouseDown: _common.defaultOnMouseDownHandler,
-        onClick: function onClick() {
-          return no.action && no.action();
+        onClick: function onClick(e) {
+          return no.action && no.action(e);
         },
         children: no === null || no === void 0 ? void 0 : no.label
       }, no.label);

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"names":["NavContainer","styled","div","BREAKPOINTS","MEDIUM","NavButton","button","COLORS","white","ExtendedMenuWrapper","props","floatRight","ExtendedSection","MainMenu","items","rightSideRef","React","useState","showExtendedMenu","setShowExtendedMenu","extendedMenuRef","useRef","menuButtonRef","mainMenuRef","numberOfItemsAllowed","setNumberOfItemsAllowed","widthOfItem","recalculateNumberOfItemsAllowed","current","number","Math","floor","offsetLeft","handleClickExtendedMenuAction","handleClickOutside","e","contains","target","useEffect","document","addEventListener","window","removeEventListener","map","no","index","disabled","exact","defaultOnMouseDownHandler","action","label","NavLink","to","length","slice"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {NavLink} from 'react-router-dom';\nimport styled from 'styled-components';\n\nimport {NavItem} from '../../NavItem';\nimport {MoreHorizontal} from '../../icons/systemicons/SystemIcons';\nimport {COLORS, BREAKPOINTS} from '../../styles';\nimport ExtendedMainMenu from './ExtendedMainMenu';\nimport {IconButton} from '../../Button';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuNavigationItemTypeItem} from '../types';\n\nconst NavContainer = styled.div<{ open: boolean }>`\n  display: none;\n  justify-content: center;\n  align-items: center;\n\n  ${BREAKPOINTS.MEDIUM} {\n    display: flex;\n  }\n\n  a {\n    text-decoration: none;\n  }\n`;\n\nconst NavButton = styled.button`\n  background: ${COLORS.white};\n  border: 0;\n`;\n\ninterface ExtendedMenuWrapperProps {\n  floatRight: boolean;\n}\n\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\n  display: flex;\n  margin-left: ${props => (props.floatRight ? 'auto' : 'unset')};\n\n  position: absolute;\n  flex-direction: column;\n  left: 290px;\n  top: 22px;\n\n  height: 0;\n  width: 0;\n\n  &:focus-within,\n  &:hover,\n  &.open {\n    background: ${COLORS.white};\n  }\n`;\n\nconst ExtendedSection = styled.div`\n  position: relative;\n`;\n\ntype Props = {\n  items: MenuNavigationItemTypeItem[];\n  rightSideRef?: React.RefObject<HTMLDivElement> | null | undefined;\n};\n\nconst MainMenu = ({items, rightSideRef}: Props): React.ReactElement<Props> => {\n  const [showExtendedMenu, setShowExtendedMenu] = React.useState(false);\n  const extendedMenuRef = React.useRef<any>(null);\n  const menuButtonRef = React.useRef<HTMLButtonElement>(null);\n  const mainMenuRef: React.RefObject<HTMLDivElement> | null | undefined = React.useRef(null);\n  const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\n\n  const widthOfItem = 150;\n  const recalculateNumberOfItemsAllowed = () => {\n    if (rightSideRef?.current && mainMenuRef?.current) {\n      const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\n      if (number !== numberOfItemsAllowed) {\n        setNumberOfItemsAllowed(number);\n      }\n    }\n  };\n\n  const handleClickExtendedMenuAction = () => {\n    setShowExtendedMenu(false);\n  };\n\n  const handleClickOutside = (e: any) => {\n    if (!extendedMenuRef?.current?.contains(e.target) && !menuButtonRef?.current?.contains(e.target)) {\n      setShowExtendedMenu(false);\n    }\n  };\n\n  React.useEffect(() => {\n    recalculateNumberOfItemsAllowed();\n    // Bind the event listener\n    document.addEventListener('click', handleClickOutside);\n    window.addEventListener('resize', recalculateNumberOfItemsAllowed);\n    return () => {\n      // Unbind the event listener on clean up\n      document.removeEventListener('click', handleClickOutside);\n      window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\n    };\n  }, []);\n\n  return (\n    <NavContainer className=\"GlobalNavigationMainMenu\" ref={mainMenuRef} open={showExtendedMenu}>\n      {items?.map((no: MenuNavigationItemTypeItem, index: number) =>\n        index > numberOfItemsAllowed - 2 ? null : no?.disabled ? (\n          <NavItem as={NavButton}\n                   exact={no.exact}\n                   className=\"disabled\"\n                   key={no.label}\n                   onMouseDown={defaultOnMouseDownHandler}\n                   onClick={() => no.action && no.action()}>\n            {no?.label}\n          </NavItem>\n        ) : (\n          <NavItem as={NavLink}\n                   exact={no.exact}\n                   to={no.to || ''}\n                   key={no.label}\n                   onMouseDown={defaultOnMouseDownHandler}\n                   onClick={() => no.action && no.action()}>\n            {no?.label}\n          </NavItem>\n        ),\n      )}\n      {items.length + 1 > numberOfItemsAllowed && (\n        <ExtendedSection>\n          <IconButton\n            ref={menuButtonRef}\n            variant={'secondary'}\n            shape={'circular'}\n            action={() => {\n              setShowExtendedMenu(!showExtendedMenu)\n            }}>\n            <MoreHorizontal size=\"24px\"/>\n          </IconButton>\n          <ExtendedMenuWrapper ref={extendedMenuRef} className={showExtendedMenu ? 'open' : ''} floatRight={false}>\n            <ExtendedMainMenu clickMenuAction={handleClickExtendedMenuAction}\n                              navigationOptions={items.slice(numberOfItemsAllowed - 1)}/>\n          </ExtendedMenuWrapper>\n        </ExtendedSection>\n      )}\n    </NavContainer>\n  );\n};\n\nexport default MainMenu;\n"],"file":"MainMenu.cjs"}
+{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"names":["NavContainer","styled","div","BREAKPOINTS","MEDIUM","NavButton","button","COLORS","white","ExtendedMenuWrapper","props","floatRight","ExtendedSection","MainMenu","items","rightSideRef","React","useState","showExtendedMenu","setShowExtendedMenu","extendedMenuRef","useRef","menuButtonRef","mainMenuRef","numberOfItemsAllowed","setNumberOfItemsAllowed","widthOfItem","recalculateNumberOfItemsAllowed","current","number","Math","floor","offsetLeft","handleClickExtendedMenuAction","handleClickOutside","e","contains","target","useEffect","document","addEventListener","window","removeEventListener","length","map","no","index","disabled","exact","defaultOnMouseDownHandler","label","NavLink","to","action","slice"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {NavLink} from 'react-router-dom';\nimport styled from 'styled-components';\n\nimport {NavItem} from '../../NavItem';\nimport {MoreHorizontal} from '../../icons/systemicons/SystemIcons';\nimport {COLORS, BREAKPOINTS} from '../../styles';\nimport ExtendedMainMenu from './ExtendedMainMenu';\nimport {IconButton} from '../../Button';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuNavigationItemTypeItem} from '../types';\n\nconst NavContainer = styled.div<{ open: boolean }>`\n  display: none;\n  justify-content: center;\n  align-items: center;\n\n  ${BREAKPOINTS.MEDIUM} {\n    display: flex;\n  }\n\n  a {\n    text-decoration: none;\n  }\n`;\n\nconst NavButton = styled.button`\n  background: ${COLORS.white};\n  border: 0;\n`;\n\ninterface ExtendedMenuWrapperProps {\n  floatRight: boolean;\n}\n\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\n  display: flex;\n  margin-left: ${props => (props.floatRight ? 'auto' : 'unset')};\n\n  position: absolute;\n  flex-direction: column;\n  left: 290px;\n  top: 22px;\n\n  height: 0;\n  width: 0;\n\n  &:focus-within,\n  &:hover,\n  &.open {\n    background: ${COLORS.white};\n  }\n`;\n\nconst ExtendedSection = styled.div`\n  position: relative;\n`;\n\ntype Props = {\n  items: MenuNavigationItemTypeItem[];\n  rightSideRef?: React.RefObject<HTMLDivElement> | null | undefined;\n};\n\nconst MainMenu = ({items, rightSideRef}: Props): React.ReactElement<Props> => {\n  const [showExtendedMenu, setShowExtendedMenu] = React.useState(false);\n  const extendedMenuRef = React.useRef<any>(null);\n  const menuButtonRef = React.useRef<HTMLButtonElement>(null);\n  const mainMenuRef: React.RefObject<HTMLDivElement> | null | undefined = React.useRef(null);\n  const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\n\n  const widthOfItem = 150;\n  const recalculateNumberOfItemsAllowed = () => {\n    if (rightSideRef?.current && mainMenuRef?.current) {\n      const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\n      if (number !== numberOfItemsAllowed) {\n        setNumberOfItemsAllowed(number);\n      }\n    }\n  };\n\n  const handleClickExtendedMenuAction = () => {\n    setShowExtendedMenu(false);\n  };\n\n  const handleClickOutside = (e: any) => {\n    if (!extendedMenuRef?.current?.contains(e.target) && !menuButtonRef?.current?.contains(e.target)) {\n      setShowExtendedMenu(false);\n    }\n  };\n\n  React.useEffect(() => {\n    recalculateNumberOfItemsAllowed();\n    // Bind the event listener\n    document.addEventListener('click', handleClickOutside);\n    window.addEventListener('resize', recalculateNumberOfItemsAllowed);\n    return () => {\n      // Unbind the event listener on clean up\n      document.removeEventListener('click', handleClickOutside);\n      window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\n    };\n  }, []);\n\n  React.useEffect(() => {\n    recalculateNumberOfItemsAllowed();\n  }, [items.length])\n\n  return (\n    <NavContainer className=\"GlobalNavigationMainMenu\" ref={mainMenuRef} open={showExtendedMenu}>\n      {items?.map((no: MenuNavigationItemTypeItem, index: number) =>\n        index > numberOfItemsAllowed - 2 ? null : no?.disabled ? (\n          <NavItem as={NavButton}\n                   exact={no.exact}\n                   className=\"disabled\"\n                   key={no.label}\n                   onMouseDown={defaultOnMouseDownHandler}>\n            {no?.label}\n          </NavItem>\n        ) : (\n          <NavItem as={NavLink}\n                   exact={no.exact}\n                   to={no.to || ''}\n                   key={no.label}\n                   onMouseDown={defaultOnMouseDownHandler}\n                   onClick={(e: React.MouseEvent) => no.action && no.action(e)}>\n            {no?.label}\n          </NavItem>\n        ),\n      )}\n      {items.length + 1 > numberOfItemsAllowed && (\n        <ExtendedSection>\n          <IconButton\n            ref={menuButtonRef}\n            variant={'secondary'}\n            shape={'circular'}\n            action={() => {\n              setShowExtendedMenu(!showExtendedMenu)\n            }}>\n            <MoreHorizontal size=\"24px\"/>\n          </IconButton>\n          <ExtendedMenuWrapper ref={extendedMenuRef} className={showExtendedMenu ? 'open' : ''} floatRight={false}>\n            <ExtendedMainMenu clickMenuAction={handleClickExtendedMenuAction}\n                              navigationOptions={items.slice(numberOfItemsAllowed - 1)}/>\n          </ExtendedMenuWrapper>\n        </ExtendedSection>\n      )}\n    </NavContainer>\n  );\n};\n\nexport default MainMenu;\n"],"file":"MainMenu.cjs"}

package/dist/GlobalNavigationBar/desktop/MainMenu.js

@@ -77,6 +77,9 @@ var MainMenu = function MainMenu(_ref) {
       window.removeEventListener('resize', recalculateNumberOfItemsAllowed);
     };
   }, []);
+  React.useEffect(function () {
+    recalculateNumberOfItemsAllowed();
+  }, [items.length]);
   return /*#__PURE__*/_jsxs(NavContainer, {
     className: "GlobalNavigationMainMenu",
     ref: mainMenuRef,
@@ -87,17 +90,14 @@ var MainMenu = function MainMenu(_ref) {
         exact: no.exact,
         className: "disabled",
         onMouseDown: defaultOnMouseDownHandler,
-        onClick: function onClick() {
-          return no.action && no.action();
-        },
         children: no === null || no === void 0 ? void 0 : no.label
       }, no.label) : /*#__PURE__*/_jsx(NavItem, {
         as: NavLink,
         exact: no.exact,
         to: no.to || '',
         onMouseDown: defaultOnMouseDownHandler,
-        onClick: function onClick() {
-          return no.action && no.action();
+        onClick: function onClick(e) {
+          return no.action && no.action(e);
         },
         children: no === null || no === void 0 ? void 0 : no.label
       }, no.label);

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"names":["React","NavLink","styled","NavItem","MoreHorizontal","COLORS","BREAKPOINTS","ExtendedMainMenu","IconButton","defaultOnMouseDownHandler","NavContainer","div","MEDIUM","NavButton","button","white","ExtendedMenuWrapper","props","floatRight","ExtendedSection","MainMenu","items","rightSideRef","useState","showExtendedMenu","setShowExtendedMenu","extendedMenuRef","useRef","menuButtonRef","mainMenuRef","numberOfItemsAllowed","setNumberOfItemsAllowed","widthOfItem","recalculateNumberOfItemsAllowed","current","number","Math","floor","offsetLeft","handleClickExtendedMenuAction","handleClickOutside","e","contains","target","useEffect","document","addEventListener","window","removeEventListener","map","no","index","disabled","exact","action","label","to","length","slice"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {NavLink} from 'react-router-dom';\nimport styled from 'styled-components';\n\nimport {NavItem} from '../../NavItem';\nimport {MoreHorizontal} from '../../icons/systemicons/SystemIcons';\nimport {COLORS, BREAKPOINTS} from '../../styles';\nimport ExtendedMainMenu from './ExtendedMainMenu';\nimport {IconButton} from '../../Button';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuNavigationItemTypeItem} from '../types';\n\nconst NavContainer = styled.div<{ open: boolean }>`\n  display: none;\n  justify-content: center;\n  align-items: center;\n\n  ${BREAKPOINTS.MEDIUM} {\n    display: flex;\n  }\n\n  a {\n    text-decoration: none;\n  }\n`;\n\nconst NavButton = styled.button`\n  background: ${COLORS.white};\n  border: 0;\n`;\n\ninterface ExtendedMenuWrapperProps {\n  floatRight: boolean;\n}\n\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\n  display: flex;\n  margin-left: ${props => (props.floatRight ? 'auto' : 'unset')};\n\n  position: absolute;\n  flex-direction: column;\n  left: 290px;\n  top: 22px;\n\n  height: 0;\n  width: 0;\n\n  &:focus-within,\n  &:hover,\n  &.open {\n    background: ${COLORS.white};\n  }\n`;\n\nconst ExtendedSection = styled.div`\n  position: relative;\n`;\n\ntype Props = {\n  items: MenuNavigationItemTypeItem[];\n  rightSideRef?: React.RefObject<HTMLDivElement> | null | undefined;\n};\n\nconst MainMenu = ({items, rightSideRef}: Props): React.ReactElement<Props> => {\n  const [showExtendedMenu, setShowExtendedMenu] = React.useState(false);\n  const extendedMenuRef = React.useRef<any>(null);\n  const menuButtonRef = React.useRef<HTMLButtonElement>(null);\n  const mainMenuRef: React.RefObject<HTMLDivElement> | null | undefined = React.useRef(null);\n  const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\n\n  const widthOfItem = 150;\n  const recalculateNumberOfItemsAllowed = () => {\n    if (rightSideRef?.current && mainMenuRef?.current) {\n      const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\n      if (number !== numberOfItemsAllowed) {\n        setNumberOfItemsAllowed(number);\n      }\n    }\n  };\n\n  const handleClickExtendedMenuAction = () => {\n    setShowExtendedMenu(false);\n  };\n\n  const handleClickOutside = (e: any) => {\n    if (!extendedMenuRef?.current?.contains(e.target) && !menuButtonRef?.current?.contains(e.target)) {\n      setShowExtendedMenu(false);\n    }\n  };\n\n  React.useEffect(() => {\n    recalculateNumberOfItemsAllowed();\n    // Bind the event listener\n    document.addEventListener('click', handleClickOutside);\n    window.addEventListener('resize', recalculateNumberOfItemsAllowed);\n    return () => {\n      // Unbind the event listener on clean up\n      document.removeEventListener('click', handleClickOutside);\n      window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\n    };\n  }, []);\n\n  return (\n    <NavContainer className=\"GlobalNavigationMainMenu\" ref={mainMenuRef} open={showExtendedMenu}>\n      {items?.map((no: MenuNavigationItemTypeItem, index: number) =>\n        index > numberOfItemsAllowed - 2 ? null : no?.disabled ? (\n          <NavItem as={NavButton}\n                   exact={no.exact}\n                   className=\"disabled\"\n                   key={no.label}\n                   onMouseDown={defaultOnMouseDownHandler}\n                   onClick={() => no.action && no.action()}>\n            {no?.label}\n          </NavItem>\n        ) : (\n          <NavItem as={NavLink}\n                   exact={no.exact}\n                   to={no.to || ''}\n                   key={no.label}\n                   onMouseDown={defaultOnMouseDownHandler}\n                   onClick={() => no.action && no.action()}>\n            {no?.label}\n          </NavItem>\n        ),\n      )}\n      {items.length + 1 > numberOfItemsAllowed && (\n        <ExtendedSection>\n          <IconButton\n            ref={menuButtonRef}\n            variant={'secondary'}\n            shape={'circular'}\n            action={() => {\n              setShowExtendedMenu(!showExtendedMenu)\n            }}>\n            <MoreHorizontal size=\"24px\"/>\n          </IconButton>\n          <ExtendedMenuWrapper ref={extendedMenuRef} className={showExtendedMenu ? 'open' : ''} floatRight={false}>\n            <ExtendedMainMenu clickMenuAction={handleClickExtendedMenuAction}\n                              navigationOptions={items.slice(numberOfItemsAllowed - 1)}/>\n          </ExtendedMenuWrapper>\n        </ExtendedSection>\n      )}\n    </NavContainer>\n  );\n};\n\nexport default MainMenu;\n"],"file":"MainMenu.js"}
+{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"names":["React","NavLink","styled","NavItem","MoreHorizontal","COLORS","BREAKPOINTS","ExtendedMainMenu","IconButton","defaultOnMouseDownHandler","NavContainer","div","MEDIUM","NavButton","button","white","ExtendedMenuWrapper","props","floatRight","ExtendedSection","MainMenu","items","rightSideRef","useState","showExtendedMenu","setShowExtendedMenu","extendedMenuRef","useRef","menuButtonRef","mainMenuRef","numberOfItemsAllowed","setNumberOfItemsAllowed","widthOfItem","recalculateNumberOfItemsAllowed","current","number","Math","floor","offsetLeft","handleClickExtendedMenuAction","handleClickOutside","e","contains","target","useEffect","document","addEventListener","window","removeEventListener","length","map","no","index","disabled","exact","label","to","action","slice"],"mappings":";;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAAQC,OAAR,QAAsB,kBAAtB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AAEA,SAAQC,OAAR,QAAsB,eAAtB;AACA,SAAQC,cAAR,QAA6B,qCAA7B;AACA,SAAQC,MAAR,EAAgBC,WAAhB,QAAkC,cAAlC;AACA,OAAOC,gBAAP,MAA6B,oBAA7B;AACA,SAAQC,UAAR,QAAyB,cAAzB;AACA,SAAQC,yBAAR,QAAwC,cAAxC;;;AAGA,IAAMC,YAAY,GAAGR,MAAM,CAACS,GAAV,6NAKdL,WAAW,CAACM,MALE,CAAlB;AAcA,IAAMC,SAAS,GAAGX,MAAM,CAACY,MAAV,6GACCT,MAAM,CAACU,KADR,CAAf;AASA,IAAMC,mBAAmB,GAAGd,MAAM,CAACS,GAAV,0SAER,UAAAM,KAAK;AAAA,SAAKA,KAAK,CAACC,UAAN,GAAmB,MAAnB,GAA4B,OAAjC;AAAA,CAFG,EAePb,MAAM,CAACU,KAfA,CAAzB;AAmBA,IAAMI,eAAe,GAAGjB,MAAM,CAACS,GAAV,gGAArB;;AASA,IAAMS,QAAQ,GAAG,SAAXA,QAAW,OAA6D;AAAA,MAA3DC,KAA2D,QAA3DA,KAA2D;AAAA,MAApDC,YAAoD,QAApDA,YAAoD;;AAC5E,wBAAgDtB,KAAK,CAACuB,QAAN,CAAe,KAAf,CAAhD;AAAA;AAAA,MAAOC,gBAAP;AAAA,MAAyBC,mBAAzB;;AACA,MAAMC,eAAe,GAAG1B,KAAK,CAAC2B,MAAN,CAAkB,IAAlB,CAAxB;AACA,MAAMC,aAAa,GAAG5B,KAAK,CAAC2B,MAAN,CAAgC,IAAhC,CAAtB;AACA,MAAME,WAA+D,GAAG7B,KAAK,CAAC2B,MAAN,CAAa,IAAb,CAAxE;;AACA,yBAAwD3B,KAAK,CAACuB,QAAN,CAAuB,CAAvB,CAAxD;AAAA;AAAA,MAAOO,oBAAP;AAAA,MAA6BC,uBAA7B;;AAEA,MAAMC,WAAW,GAAG,GAApB;;AACA,MAAMC,+BAA+B,GAAG,SAAlCA,+BAAkC,GAAM;AAC5C,QAAIX,YAAY,SAAZ,IAAAA,YAAY,WAAZ,IAAAA,YAAY,CAAEY,OAAd,IAAyBL,WAAzB,aAAyBA,WAAzB,eAAyBA,WAAW,CAAEK,OAA1C,EAAmD;AAAA;;AACjD,UAAMC,MAAM,GAAGC,IAAI,CAACC,KAAL,CAAW,CAAC,CAAAf,YAAY,SAAZ,IAAAA,YAAY,WAAZ,qCAAAA,YAAY,CAAEY,OAAd,gFAAuBI,UAAvB,KAAoCT,WAApC,aAAoCA,WAApC,+CAAoCA,WAAW,CAAEK,OAAjD,yDAAoC,qBAAsBI,UAA1D,CAAD,IAAyEN,WAApF,CAAf;;AACA,UAAIG,MAAM,KAAKL,oBAAf,EAAqC;AACnCC,QAAAA,uBAAuB,CAACI,MAAD,CAAvB;AACD;AACF;AACF,GAPD;;AASA,MAAMI,6BAA6B,GAAG,SAAhCA,6BAAgC,GAAM;AAC1Cd,IAAAA,mBAAmB,CAAC,KAAD,CAAnB;AACD,GAFD;;AAIA,MAAMe,kBAAkB,GAAG,SAArBA,kBAAqB,CAACC,CAAD,EAAY;AAAA;;AACrC,QAAI,EAACf,eAAD,aAACA,eAAD,wCAACA,eAAe,CAAEQ,OAAlB,kDAAC,sBAA0BQ,QAA1B,CAAmCD,CAAC,CAACE,MAArC,CAAD,KAAiD,EAACf,aAAD,aAACA,aAAD,wCAACA,aAAa,CAAEM,OAAhB,kDAAC,sBAAwBQ,QAAxB,CAAiCD,CAAC,CAACE,MAAnC,CAAD,CAArD,EAAkG;AAChGlB,MAAAA,mBAAmB,CAAC,KAAD,CAAnB;AACD;AACF,GAJD;;AAMAzB,EAAAA,KAAK,CAAC4C,SAAN,CAAgB,YAAM;AACpBX,IAAAA,+BAA+B,GADX,CAEpB;;AACAY,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,OAA1B,EAAmCN,kBAAnC;AACAO,IAAAA,MAAM,CAACD,gBAAP,CAAwB,QAAxB,EAAkCb,+BAAlC;AACA,WAAO,YAAM;AACX;AACAY,MAAAA,QAAQ,CAACG,mBAAT,CAA6B,OAA7B,EAAsCR,kBAAtC;AACAO,MAAAA,MAAM,CAACC,mBAAP,CAA2B,QAA3B,EAAqCf,+BAArC;AACD,KAJD;AAKD,GAVD,EAUG,EAVH;AAYAjC,EAAAA,KAAK,CAAC4C,SAAN,CAAgB,YAAM;AACpBX,IAAAA,+BAA+B;AAChC,GAFD,EAEG,CAACZ,KAAK,CAAC4B,MAAP,CAFH;AAIA,sBACE,MAAC,YAAD;AAAc,IAAA,SAAS,EAAC,0BAAxB;AAAmD,IAAA,GAAG,EAAEpB,WAAxD;AAAqE,IAAA,IAAI,EAAEL,gBAA3E;AAAA,eACGH,KADH,aACGA,KADH,uBACGA,KAAK,CAAE6B,GAAP,CAAW,UAACC,EAAD,EAAiCC,KAAjC;AAAA,aACVA,KAAK,GAAGtB,oBAAoB,GAAG,CAA/B,GAAmC,IAAnC,GAA0CqB,EAAE,SAAF,IAAAA,EAAE,WAAF,IAAAA,EAAE,CAAEE,QAAJ,gBACxC,KAAC,OAAD;AAAS,QAAA,EAAE,EAAExC,SAAb;AACS,QAAA,KAAK,EAAEsC,EAAE,CAACG,KADnB;AAES,QAAA,SAAS,EAAC,UAFnB;AAIS,QAAA,WAAW,EAAE7C,yBAJtB;AAAA,kBAKG0C,EALH,aAKGA,EALH,uBAKGA,EAAE,CAAEI;AALP,SAGcJ,EAAE,CAACI,KAHjB,CADwC,gBASxC,KAAC,OAAD;AAAS,QAAA,EAAE,EAAEtD,OAAb;AACS,QAAA,KAAK,EAAEkD,EAAE,CAACG,KADnB;AAES,QAAA,EAAE,EAAEH,EAAE,CAACK,EAAH,IAAS,EAFtB;AAIS,QAAA,WAAW,EAAE/C,yBAJtB;AAKS,QAAA,OAAO,EAAE,iBAACgC,CAAD;AAAA,iBAAyBU,EAAE,CAACM,MAAH,IAAaN,EAAE,CAACM,MAAH,CAAUhB,CAAV,CAAtC;AAAA,SALlB;AAAA,kBAMGU,EANH,aAMGA,EANH,uBAMGA,EAAE,CAAEI;AANP,SAGcJ,EAAE,CAACI,KAHjB,CAVQ;AAAA,KAAX,CADH,EAqBGlC,KAAK,CAAC4B,MAAN,GAAe,CAAf,GAAmBnB,oBAAnB,iBACC,MAAC,eAAD;AAAA,8BACE,KAAC,UAAD;AACE,QAAA,GAAG,EAAEF,aADP;AAEE,QAAA,OAAO,EAAE,WAFX;AAGE,QAAA,KAAK,EAAE,UAHT;AAIE,QAAA,MAAM,EAAE,kBAAM;AACZH,UAAAA,mBAAmB,CAAC,CAACD,gBAAF,CAAnB;AACD,SANH;AAAA,+BAOE,KAAC,cAAD;AAAgB,UAAA,IAAI,EAAC;AAArB;AAPF,QADF,eAUE,KAAC,mBAAD;AAAqB,QAAA,GAAG,EAAEE,eAA1B;AAA2C,QAAA,SAAS,EAAEF,gBAAgB,GAAG,MAAH,GAAY,EAAlF;AAAsF,QAAA,UAAU,EAAE,KAAlG;AAAA,+BACE,KAAC,gBAAD;AAAkB,UAAA,eAAe,EAAEe,6BAAnC;AACkB,UAAA,iBAAiB,EAAElB,KAAK,CAACqC,KAAN,CAAY5B,oBAAoB,GAAG,CAAnC;AADrC;AADF,QAVF;AAAA,MAtBJ;AAAA,IADF;AAyCD,CApFD;;;AAJET,EAAAA,K;;AA0FF,eAAeD,QAAf","sourcesContent":["import * as React from 'react';\nimport {NavLink} from 'react-router-dom';\nimport styled from 'styled-components';\n\nimport {NavItem} from '../../NavItem';\nimport {MoreHorizontal} from '../../icons/systemicons/SystemIcons';\nimport {COLORS, BREAKPOINTS} from '../../styles';\nimport ExtendedMainMenu from './ExtendedMainMenu';\nimport {IconButton} from '../../Button';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuNavigationItemTypeItem} from '../types';\n\nconst NavContainer = styled.div<{ open: boolean }>`\n  display: none;\n  justify-content: center;\n  align-items: center;\n\n  ${BREAKPOINTS.MEDIUM} {\n    display: flex;\n  }\n\n  a {\n    text-decoration: none;\n  }\n`;\n\nconst NavButton = styled.button`\n  background: ${COLORS.white};\n  border: 0;\n`;\n\ninterface ExtendedMenuWrapperProps {\n  floatRight: boolean;\n}\n\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\n  display: flex;\n  margin-left: ${props => (props.floatRight ? 'auto' : 'unset')};\n\n  position: absolute;\n  flex-direction: column;\n  left: 290px;\n  top: 22px;\n\n  height: 0;\n  width: 0;\n\n  &:focus-within,\n  &:hover,\n  &.open {\n    background: ${COLORS.white};\n  }\n`;\n\nconst ExtendedSection = styled.div`\n  position: relative;\n`;\n\ntype Props = {\n  items: MenuNavigationItemTypeItem[];\n  rightSideRef?: React.RefObject<HTMLDivElement> | null | undefined;\n};\n\nconst MainMenu = ({items, rightSideRef}: Props): React.ReactElement<Props> => {\n  const [showExtendedMenu, setShowExtendedMenu] = React.useState(false);\n  const extendedMenuRef = React.useRef<any>(null);\n  const menuButtonRef = React.useRef<HTMLButtonElement>(null);\n  const mainMenuRef: React.RefObject<HTMLDivElement> | null | undefined = React.useRef(null);\n  const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\n\n  const widthOfItem = 150;\n  const recalculateNumberOfItemsAllowed = () => {\n    if (rightSideRef?.current && mainMenuRef?.current) {\n      const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\n      if (number !== numberOfItemsAllowed) {\n        setNumberOfItemsAllowed(number);\n      }\n    }\n  };\n\n  const handleClickExtendedMenuAction = () => {\n    setShowExtendedMenu(false);\n  };\n\n  const handleClickOutside = (e: any) => {\n    if (!extendedMenuRef?.current?.contains(e.target) && !menuButtonRef?.current?.contains(e.target)) {\n      setShowExtendedMenu(false);\n    }\n  };\n\n  React.useEffect(() => {\n    recalculateNumberOfItemsAllowed();\n    // Bind the event listener\n    document.addEventListener('click', handleClickOutside);\n    window.addEventListener('resize', recalculateNumberOfItemsAllowed);\n    return () => {\n      // Unbind the event listener on clean up\n      document.removeEventListener('click', handleClickOutside);\n      window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\n    };\n  }, []);\n\n  React.useEffect(() => {\n    recalculateNumberOfItemsAllowed();\n  }, [items.length])\n\n  return (\n    <NavContainer className=\"GlobalNavigationMainMenu\" ref={mainMenuRef} open={showExtendedMenu}>\n      {items?.map((no: MenuNavigationItemTypeItem, index: number) =>\n        index > numberOfItemsAllowed - 2 ? null : no?.disabled ? (\n          <NavItem as={NavButton}\n                   exact={no.exact}\n                   className=\"disabled\"\n                   key={no.label}\n                   onMouseDown={defaultOnMouseDownHandler}>\n            {no?.label}\n          </NavItem>\n        ) : (\n          <NavItem as={NavLink}\n                   exact={no.exact}\n                   to={no.to || ''}\n                   key={no.label}\n                   onMouseDown={defaultOnMouseDownHandler}\n                   onClick={(e: React.MouseEvent) => no.action && no.action(e)}>\n            {no?.label}\n          </NavItem>\n        ),\n      )}\n      {items.length + 1 > numberOfItemsAllowed && (\n        <ExtendedSection>\n          <IconButton\n            ref={menuButtonRef}\n            variant={'secondary'}\n            shape={'circular'}\n            action={() => {\n              setShowExtendedMenu(!showExtendedMenu)\n            }}>\n            <MoreHorizontal size=\"24px\"/>\n          </IconButton>\n          <ExtendedMenuWrapper ref={extendedMenuRef} className={showExtendedMenu ? 'open' : ''} floatRight={false}>\n            <ExtendedMainMenu clickMenuAction={handleClickExtendedMenuAction}\n                              navigationOptions={items.slice(numberOfItemsAllowed - 1)}/>\n          </ExtendedMenuWrapper>\n        </ExtendedSection>\n      )}\n    </NavContainer>\n  );\n};\n\nexport default MainMenu;\n"],"file":"MainMenu.js"}

package/dist/GlobalNavigationBar/desktop/RightSideNav.cjs

@@ -56,8 +56,8 @@ var RightSideNav = function RightSideNav(_ref) {
         exact: item === null || item === void 0 ? void 0 : item.exact,
         to: (item === null || item === void 0 ? void 0 : item.to) || '',
         onMouseDown: _common.defaultOnMouseDownHandler,
-        onClick: function onClick() {
-          return item.action && item.action();
+        onClick: function onClick(e) {
+          return item.action && item.action(e);
         },
         children: item === null || item === void 0 ? void 0 : item.label
       }, item === null || item === void 0 ? void 0 : item.label);

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"names":["NavContainer","styled","div","BREAKPOINTS","SMALL","MEDIUM","SecondaryButton","Button","ComponentTextStyle","Bold","RightSideNav","items","action","getNavItem","item","disabled","label","NavLink","exact","to","defaultOnMouseDownHandler","reverse","map","no"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AAEA;;;;;;;;;;AAGA,IAAMA,YAAY,GAAGC,0BAAOC,GAAV,yWAUdC,oBAAYC,KAVE,EAcdD,oBAAYE,MAdE,CAAlB;;AA0BA,IAAMC,eAAe,GAAG,+BAAOC,cAAP,CAAH,qIAIjB,+BAAkBC,2BAAmBC,IAArC,EAA2C,OAA3C,CAJiB,CAArB;;AAYA,IAAMC,YAAY,GAAG,SAAfA,YAAe,OAAuD;AAAA,MAArDC,KAAqD,QAArDA,KAAqD;AAAA,MAA9CC,MAA8C,QAA9CA,MAA8C;;AAC1E,MAAMC,UAAU,GAAG,SAAbA,UAAa,CAACC,IAAD,EAAsC;AACvD,QAAIA,IAAJ,aAAIA,IAAJ,eAAIA,IAAI,CAAEC,QAAV,EAAoB;AAClB,0BACE,qBAAC,gBAAD;AAAS,QAAA,EAAE,EAAER,cAAb;AAAqB,QAAA,SAAS,EAAC,UAA/B;AAAA,kBACGO,IADH,aACGA,IADH,uBACGA,IAAI,CAAEE;AADT,SAA+CF,IAA/C,aAA+CA,IAA/C,uBAA+CA,IAAI,CAAEE,KAArD,CADF;AAKD,KAND,MAMO;AACL,0BACE,qBAAC,gBAAD;AACE,QAAA,EAAE,EAAEC,uBADN;AAEE,QAAA,KAAK,EAAEH,IAAF,aAAEA,IAAF,uBAAEA,IAAI,CAAEI,KAFf;AAGE,QAAA,EAAE,EAAE,CAAAJ,IAAI,SAAJ,IAAAA,IAAI,WAAJ,YAAAA,IAAI,CAAEK,EAAN,KAAY,EAHlB;AAKE,QAAA,WAAW,EAAEC,iCALf;AAME,QAAA,OAAO,EAAE;AAAA,iBAAMN,IAAI,CAACF,MAAL,IAAeE,IAAI,CAACF,MAAL,EAArB;AAAA,SANX;AAAA,kBAOGE,IAPH,aAOGA,IAPH,uBAOGA,IAAI,CAAEE;AAPT,SAIOF,IAJP,aAIOA,IAJP,uBAIOA,IAAI,CAAEE,KAJb,CADF;AAWD;AACF,GApBD;;AAqBA,sBACE,sBAAC,YAAD;AAAA,eACGL,KADH,aACGA,KADH,uBACGA,KAAK,CAAEU,OAAP,GAAiBC,GAAjB,CAAqB,UAAAC,EAAE;AAAA,aAAIV,UAAU,CAACU,EAAD,CAAd;AAAA,KAAvB,CADH,EAIIX,MAAM,iBACN,qBAAC,eAAD;AAAiB,MAAA,OAAO,EAAC,WAAzB;AAAqC,MAAA,OAAO,EAAEA,MAAF,aAAEA,MAAF,uBAAEA,MAAM,CAAEA,MAAtD;AAAA,gBACGA,MAAM,CAACI;AADV,MALJ;AAAA,IADF;AAYD,CAlCD;;;AAJEL,EAAAA,K;;eAwCaD,Y","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\n\nimport {NavItem} from '../../NavItem';\nimport {BREAKPOINTS, ComponentTextStyle} from '../../styles';\nimport {Button} from '../../Button';\nimport {ComponentMStyling} from '../../styles';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuButton, MenuNavigationItemTypeItem} from '../types';\n\nconst NavContainer = styled.div`\n  display: flex;\n  margin: auto 0 auto auto;\n  align-items: center;\n  height: 48px;\n\n  a {\n    text-decoration: none;\n  }\n\n  ${BREAKPOINTS.SMALL} {\n    height: 56px;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    height: 64px;\n  }\n\n  button,\n  div {\n    &:hover {\n      cursor: pointer;\n    }\n  }\n`;\n\nconst SecondaryButton = styled(Button)`\n  height: 40px;\n  margin: 0 8px;\n\n  ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\n`;\n\ntype Props = {\n  items?: MenuNavigationItemTypeItem[];\n  action?: MenuButton;\n};\n\nconst RightSideNav = ({items, action}: Props): React.ReactElement<Props> => {\n  const getNavItem = (item: MenuNavigationItemTypeItem) => {\n    if (item?.disabled) {\n      return (\n        <NavItem as={Button} className=\"disabled\" key={item?.label}>\n          {item?.label}\n        </NavItem>\n      );\n    } else {\n      return (\n        <NavItem\n          as={NavLink}\n          exact={item?.exact}\n          to={item?.to || ''}\n          key={item?.label}\n          onMouseDown={defaultOnMouseDownHandler}\n          onClick={() => item.action && item.action()}>\n          {item?.label}\n        </NavItem>\n      );\n    }\n  };\n  return (\n    <NavContainer>\n      {items?.reverse().map(no => getNavItem(no))}\n\n      {\n        action &&\n        <SecondaryButton variant=\"secondary\" onClick={action?.action}>\n          {action.label}\n        </SecondaryButton>\n      }\n    </NavContainer>\n  );\n};\n\nexport default RightSideNav;\n"],"file":"RightSideNav.cjs"}
+{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"names":["NavContainer","styled","div","BREAKPOINTS","SMALL","MEDIUM","SecondaryButton","Button","ComponentTextStyle","Bold","RightSideNav","items","action","getNavItem","item","disabled","label","NavLink","exact","to","defaultOnMouseDownHandler","e","reverse","map","no"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AAEA;;;;;;;;;;AAGA,IAAMA,YAAY,GAAGC,0BAAOC,GAAV,yWAUdC,oBAAYC,KAVE,EAcdD,oBAAYE,MAdE,CAAlB;;AA0BA,IAAMC,eAAe,GAAG,+BAAOC,cAAP,CAAH,qIAIjB,+BAAkBC,2BAAmBC,IAArC,EAA2C,OAA3C,CAJiB,CAArB;;AAYA,IAAMC,YAAY,GAAG,SAAfA,YAAe,OAAuD;AAAA,MAArDC,KAAqD,QAArDA,KAAqD;AAAA,MAA9CC,MAA8C,QAA9CA,MAA8C;;AAC1E,MAAMC,UAAU,GAAG,SAAbA,UAAa,CAACC,IAAD,EAAsC;AACvD,QAAIA,IAAJ,aAAIA,IAAJ,eAAIA,IAAI,CAAEC,QAAV,EAAoB;AAClB,0BACE,qBAAC,gBAAD;AAAS,QAAA,EAAE,EAAER,cAAb;AAAqB,QAAA,SAAS,EAAC,UAA/B;AAAA,kBACGO,IADH,aACGA,IADH,uBACGA,IAAI,CAAEE;AADT,SAA+CF,IAA/C,aAA+CA,IAA/C,uBAA+CA,IAAI,CAAEE,KAArD,CADF;AAKD,KAND,MAMO;AACL,0BACE,qBAAC,gBAAD;AACE,QAAA,EAAE,EAAEC,uBADN;AAEE,QAAA,KAAK,EAAEH,IAAF,aAAEA,IAAF,uBAAEA,IAAI,CAAEI,KAFf;AAGE,QAAA,EAAE,EAAE,CAAAJ,IAAI,SAAJ,IAAAA,IAAI,WAAJ,YAAAA,IAAI,CAAEK,EAAN,KAAY,EAHlB;AAKE,QAAA,WAAW,EAAEC,iCALf;AAME,QAAA,OAAO,EAAE,iBAACC,CAAD;AAAA,iBAAwBP,IAAI,CAACF,MAAL,IAAeE,IAAI,CAACF,MAAL,CAAYS,CAAZ,CAAvC;AAAA,SANX;AAAA,kBAOGP,IAPH,aAOGA,IAPH,uBAOGA,IAAI,CAAEE;AAPT,SAIOF,IAJP,aAIOA,IAJP,uBAIOA,IAAI,CAAEE,KAJb,CADF;AAWD;AACF,GApBD;;AAqBA,sBACE,sBAAC,YAAD;AAAA,eACGL,KADH,aACGA,KADH,uBACGA,KAAK,CAAEW,OAAP,GAAiBC,GAAjB,CAAqB,UAAAC,EAAE;AAAA,aAAIX,UAAU,CAACW,EAAD,CAAd;AAAA,KAAvB,CADH,EAIIZ,MAAM,iBACN,qBAAC,eAAD;AAAiB,MAAA,OAAO,EAAC,WAAzB;AAAqC,MAAA,OAAO,EAAEA,MAAF,aAAEA,MAAF,uBAAEA,MAAM,CAAEA,MAAtD;AAAA,gBACGA,MAAM,CAACI;AADV,MALJ;AAAA,IADF;AAYD,CAlCD;;;AAJEL,EAAAA,K;;eAwCaD,Y","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\n\nimport {NavItem} from '../../NavItem';\nimport {BREAKPOINTS, ComponentTextStyle} from '../../styles';\nimport {Button} from '../../Button';\nimport {ComponentMStyling} from '../../styles';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuButton, MenuNavigationItemTypeItem} from '../types';\n\nconst NavContainer = styled.div`\n  display: flex;\n  margin: auto 0 auto auto;\n  align-items: center;\n  height: 48px;\n\n  a {\n    text-decoration: none;\n  }\n\n  ${BREAKPOINTS.SMALL} {\n    height: 56px;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    height: 64px;\n  }\n\n  button,\n  div {\n    &:hover {\n      cursor: pointer;\n    }\n  }\n`;\n\nconst SecondaryButton = styled(Button)`\n  height: 40px;\n  margin: 0 8px;\n\n  ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\n`;\n\ntype Props = {\n  items?: MenuNavigationItemTypeItem[];\n  action?: MenuButton;\n};\n\nconst RightSideNav = ({items, action}: Props): React.ReactElement<Props> => {\n  const getNavItem = (item: MenuNavigationItemTypeItem) => {\n    if (item?.disabled) {\n      return (\n        <NavItem as={Button} className=\"disabled\" key={item?.label}>\n          {item?.label}\n        </NavItem>\n      );\n    } else {\n      return (\n        <NavItem\n          as={NavLink}\n          exact={item?.exact}\n          to={item?.to || ''}\n          key={item?.label}\n          onMouseDown={defaultOnMouseDownHandler}\n          onClick={(e:React.MouseEvent) => item.action && item.action(e)}>\n          {item?.label}\n        </NavItem>\n      );\n    }\n  };\n  return (\n    <NavContainer>\n      {items?.reverse().map(no => getNavItem(no))}\n\n      {\n        action &&\n        <SecondaryButton variant=\"secondary\" onClick={action?.action}>\n          {action.label}\n        </SecondaryButton>\n      }\n    </NavContainer>\n  );\n};\n\nexport default RightSideNav;\n"],"file":"RightSideNav.cjs"}