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

package/dist/src/GlobalNavigationBar/desktop/MainMenu.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-import { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';
-declare type Props = {
-    items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];
-    rightSideRef?: React.RefObject<HTMLDivElement> | null | undefined;
-};
-declare const MainMenu: ({ items, rightSideRef }: Props) => React.ReactElement<Props>;
-export default MainMenu;

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

@@ -1,175 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-import * as React from 'react';
-import { NavLink } from 'react-router-dom';
-import styled from 'styled-components';
-import { NavItem } from '../../NavItem';
-import { SystemIcons } from '../../icons';
-import { COLORS, BREAKPOINTS } from '../../styles';
-import { Menu } from './ExtendedMainMenu';
-import { SubMenu } from './SubMenu';
-import { IconButton } from '../../Button';
-import { defaultOnMouseDownHandler } from '../../common';
-import { NavItemDiv } from '../../NavItem/NavItem';
-import { checkIfContainsItem } from '../utils';
-var NavContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: none;\n  flex-grow: 1;\n  justify-content: flex-start;\n  align-items: center;\n  \n  padding: 0 16px;\n\n  ", " {\n    display: flex;\n  }\n  \n  ", " {\n    cursor: pointer;\n  }\n  ", " {\n    padding: 0 32px;\n  }\n\n  a {\n    text-decoration: none;\n  }\n"], ["\n  display: none;\n  flex-grow: 1;\n  justify-content: flex-start;\n  align-items: center;\n  \n  padding: 0 16px;\n\n  ", " {\n    display: flex;\n  }\n  \n  ", " {\n    cursor: pointer;\n  }\n  ", " {\n    padding: 0 32px;\n  }\n\n  a {\n    text-decoration: none;\n  }\n"])), BREAKPOINTS.MEDIUM, NavItemDiv, BREAKPOINTS.LARGE);
-var NavButton = styled.button(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background: ", ";\n  border: 0;\n"], ["\n  background: ", ";\n  border: 0;\n"])), COLORS.white);
-var ExtendedMenuWrapper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  margin-left: ", ";\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: ", ";\n  }\n"], ["\n  display: flex;\n  margin-left: ", ";\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: ", ";\n  }\n"])), function (props) { return (props.floatRight ? 'auto' : 'unset'); }, COLORS.white);
-var ExtendedSection = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  position: relative;\n"], ["\n  position: relative;\n"])));
-var SubMenuWrapper = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  ", " {\n    top: ", ";\n    left: ", ";\n  }\n\n  button {\n    padding-left: 0px;\n  }\n"], ["\n  ", " {\n    top: ", ";\n    left: ", ";\n  }\n\n  button {\n    padding-left: 0px;\n  }\n"])), Menu, function (props) { return (props.topLevel ? '100%' : '0px'); }, function (props) { return (props.topLevel ? '0px' : 'calc(100% - 12px)'); });
-var ExtendedMenuOption = 'extendedOption';
-var MainMenu = function (_a) {
-    var items = _a.items, rightSideRef = _a.rightSideRef;
-    var menuButtonRef = React.useRef(null);
-    //we have to use refs instead of 'state' here, because when onmouseleave is triggered for multiple nested divs, state update is not being updated in between
-    var dropdownMenusOpenedArray = React.useRef([]);
-    var mainMenuRef = React.useRef(null);
-    var _b = React.useState(1), numberOfItemsAllowed = _b[0], setNumberOfItemsAllowed = _b[1];
-    var _c = React.useState([]), subMenuRefs = _c[0], setAllSubMenuRefs = _c[1];
-    var extendedMenuOptionRef = React.createRef();
-    React.useEffect(function () {
-        setAllSubMenuRefs(items.map(function (x) { return (x.type == 'desktopgroup' ? React.createRef() : undefined); }));
-    }, [items]);
-    var _d = React.useState({}), forceUpdate = _d[1];
-    var _e = React.useState(''), activeItem = _e[0], setActiveItemId = _e[1];
-    var _f = React.useState(''), focusedItemId = _f[0], setFocusedItemId = _f[1];
-    var widthOfItem = 120;
-    var recalculateNumberOfItemsAllowed = function () {
-        var _a, _b;
-        if ((rightSideRef === null || rightSideRef === void 0 ? void 0 : rightSideRef.current) && (mainMenuRef === null || mainMenuRef === void 0 ? void 0 : mainMenuRef.current)) {
-            var number = Math.floor((((_a = rightSideRef === null || rightSideRef === void 0 ? void 0 : rightSideRef.current) === null || _a === void 0 ? void 0 : _a.offsetLeft) - ((_b = mainMenuRef === null || mainMenuRef === void 0 ? void 0 : mainMenuRef.current) === null || _b === void 0 ? void 0 : _b.offsetLeft)) / widthOfItem);
-            if (number !== numberOfItemsAllowed) {
-                setNumberOfItemsAllowed(number);
-            }
-        }
-    };
-    var onMouseLeave = function (event, id) {
-        dropdownMenusOpenedArray.current = __spreadArray([], dropdownMenusOpenedArray.current.filter(function (x) { return x != id; }), true);
-        //just trigger rerendering
-        forceUpdate({});
-    };
-    var onMouseEnter = function (event, id) {
-        var existingRefForId = dropdownMenusOpenedArray.current.find(function (x) { return x == id; });
-        if (existingRefForId == null) {
-            dropdownMenusOpenedArray.current = __spreadArray(__spreadArray([], dropdownMenusOpenedArray.current, true), [id], false);
-            //just trigger rerendering
-            forceUpdate({});
-        }
-    };
-    React.useEffect(function () {
-        recalculateNumberOfItemsAllowed();
-        // Bind the event listener
-        window.addEventListener('resize', recalculateNumberOfItemsAllowed);
-        return function () {
-            // Unbind the event listener on clean up
-            window.removeEventListener('resize', recalculateNumberOfItemsAllowed);
-        };
-    }, []);
-    React.useEffect(function () {
-        recalculateNumberOfItemsAllowed();
-    }, [items.length]);
-    var onFocus = function (event) {
-        //no open dropdowns if top level was entered
-        dropdownMenusOpenedArray.current = [];
-        forceUpdate({});
-    };
-    var onKeyDownTop = function (event) {
-        if (event.key === 'Escape' || event.key === 'Esc') {
-            dropdownMenusOpenedArray.current = [];
-            //just trigger rerendering
-            forceUpdate({});
-        }
-    };
-    var renderItem = function (item, index) {
-        if (index > numberOfItemsAllowed - 2)
-            return null;
-        if (item.type != 'desktopgroup') {
-            var _a = item, icon = _a.icon, to = _a.to, exact = _a.exact, disabled = _a.disabled, external_1 = _a.external, action_1 = _a.action, label = _a.label, note = _a.note, pinned = _a.pinned, rest = __rest(_a, ["icon", "to", "exact", "disabled", "external", "action", "label", "note", "pinned"]);
-            return (item === null || item === void 0 ? void 0 : item.disabled) ? (React.createElement(NavItem, { as: NavButton, className: "disabled", key: item.label, onMouseDown: defaultOnMouseDownHandler }, item === null || item === void 0 ? void 0 : item.label)) : (React.createElement(NavItem, __assign({ as: NavLink, onFocus: onFocus, to: to || '', key: label, onMouseDown: defaultOnMouseDownHandler, onClick: function (e) { return action_1 && action_1(e); } }, rest), item === null || item === void 0 ? void 0 : item.label));
-        }
-        else {
-            var existingRef_1 = dropdownMenusOpenedArray.current.find(function (x) { return x == item.id; });
-            var onClick = function () {
-                if (existingRef_1 == null) {
-                    dropdownMenusOpenedArray.current = __spreadArray(__spreadArray([], dropdownMenusOpenedArray.current, true), [item.id], false);
-                    //just trigger rerendering
-                    forceUpdate({});
-                }
-            };
-            var onKeyDown = function (event) {
-                if (event.key == 'Enter' || event.code == 'Space') {
-                    dropdownMenusOpenedArray.current = __spreadArray(__spreadArray([], dropdownMenusOpenedArray.current, true), [item.id], false);
-                    //just trigger rerendering
-                    forceUpdate({});
-                }
-            };
-            var containsActiveItem = checkIfContainsItem(item, activeItem);
-            return (React.createElement("div", { style: { position: 'relative' }, onMouseEnter: function (event) { var _a; return onMouseEnter(event, (_a = item.id) !== null && _a !== void 0 ? _a : ''); }, onMouseLeave: function (event) { var _a; return onMouseLeave(event, (_a = item.id) !== null && _a !== void 0 ? _a : ''); } },
-                React.createElement(NavItem, { id: item.id + '_parentOption', "aria-expanded": Boolean(existingRef_1), "aria-activedescendant": containsActiveItem ? activeItem : '', "aria-controls": item.id, role: "listbox", onFocus: onFocus, onKeyDown: onKeyDown, tabIndex: 0, className: existingRef_1 != null || checkIfContainsItem(item, activeItem) ? 'active' : '', key: item.label, to: null, onClick: onClick }, item === null || item === void 0 ? void 0 :
-                    item.label,
-                    " ",
-                    React.createElement(SystemIcons.ArrowDropDown, { size: "24px" })),
-                React.createElement(SubMenu, { ariaLabelledBy: item.id + '_parentOption', ref: subMenuRefs[index], onItemFocused: setFocusedItemId, focusedItemId: focusedItemId, activeItemId: activeItem, nestPath: [item.id], onItemStateChanged: function (item, state) {
-                        if (state) {
-                            setActiveItemId(item);
-                        }
-                        else if (item == activeItem)
-                            setActiveItemId('');
-                    }, item: item, dropdownMenusOpenedArray: dropdownMenusOpenedArray, index: index + 1, topLevel: true })));
-        }
-    };
-    var extended = dropdownMenusOpenedArray.current.find(function (x) { return x == ExtendedMenuOption; });
-    var extendedSectionKeyHandler = function (event) {
-        if (event.key == 'Enter' || event.code == 'Space') {
-            event.stopPropagation();
-            dropdownMenusOpenedArray.current = [ExtendedMenuOption];
-            forceUpdate({});
-        }
-    };
-    return (React.createElement(NavContainer, { role: "navigation", className: "GlobalNavigationMainMenu", ref: mainMenuRef, onKeyDown: onKeyDownTop }, items === null || items === void 0 ? void 0 :
-        items.map(renderItem),
-        items.length + 1 > numberOfItemsAllowed && (React.createElement(ExtendedSection, { onKeyDown: function (event) { return extendedSectionKeyHandler(event); }, onMouseEnter: function (event) { return onMouseEnter(event, ExtendedMenuOption); }, onMouseLeave: function (event) { return onMouseLeave(event, ExtendedMenuOption); } },
-            React.createElement(IconButton, { id: ExtendedMenuOption + '_parentOption', "aria-expanded": Boolean(extended), "aria-activedescendant": checkIfContainsItem({ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }, activeItem) ? activeItem : '', "aria-controls": ExtendedMenuOption, role: "listbox", ref: menuButtonRef, variant: 'secondary', shape: 'circular', action: function () { } },
-                React.createElement(SystemIcons.MoreHorizontal, { size: "24px" })),
-            React.createElement(SubMenu, { ariaLabelledBy: ExtendedMenuOption + '_parentOption', activeItemId: activeItem, onItemFocused: setFocusedItemId, focusedItemId: focusedItemId, ref: extendedMenuOptionRef, onItemStateChanged: function (item, state) {
-                    if (state)
-                        setActiveItemId(item);
-                    else if (item == activeItem)
-                        setActiveItemId('');
-                }, nestPath: [ExtendedMenuOption], item: { items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }, topLevel: true, index: 0, dropdownMenusOpenedArray: dropdownMenusOpenedArray })))));
-};
-export default MainMenu;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;

package/dist/src/GlobalNavigationBar/desktop/RightSideNav.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-import { MenuButton, MenuNavigationItemTypeItem } from '../types';
-declare type Props = {
-    items?: MenuNavigationItemTypeItem[];
-    action?: MenuButton;
-};
-declare const RightSideNav: ({ items, action }: Props) => React.ReactElement<Props>;
-export default RightSideNav;

package/dist/src/GlobalNavigationBar/desktop/RightSideNav.js

@@ -1,46 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import * as React from 'react';
-import styled from 'styled-components';
-import { NavLink } from 'react-router-dom';
-import { NavItem } from '../../NavItem';
-import { BREAKPOINTS, ComponentTextStyle } from '../../styles';
-import { Button } from '../../Button';
-import { ComponentMStyling } from '../../styles';
-import { defaultOnMouseDownHandler } from '../../common';
-import { TooltipWrapper } from "../../Tooltips";
-var NavContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: none;\n  margin: auto 0 auto auto;\n  align-items: center;\n  height: 64px;\n\n  a {\n    text-decoration: none;\n  }\n\n  ", " {\n    display: flex;\n  }\n\n  ", " {\n    height: 80px;\n  }\n\n  button,\n  div {\n    &:hover {\n      cursor: pointer;\n    }\n  }\n"], ["\n  display: none;\n  margin: auto 0 auto auto;\n  align-items: center;\n  height: 64px;\n\n  a {\n    text-decoration: none;\n  }\n\n  ", " {\n    display: flex;\n  }\n\n  ", " {\n    height: 80px;\n  }\n\n  button,\n  div {\n    &:hover {\n      cursor: pointer;\n    }\n  }\n"])), BREAKPOINTS.MEDIUM, BREAKPOINTS.LARGE);
-var StyledButton = styled(Button)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  height: 40px;\n  margin: 0 8px;\n\n  ", "\n"], ["\n  height: 40px;\n  margin: 0 8px;\n\n  ", "\n"])), ComponentMStyling(ComponentTextStyle.Bold, 'unset'));
-var RightSideNav = function (_a) {
-    var items = _a.items, action = _a.action;
-    var getNavItem = function (item) {
-        if (item === null || item === void 0 ? void 0 : item.disabled) {
-            return (React.createElement(NavItem, { as: Button, className: "disabled", key: item === null || item === void 0 ? void 0 : item.label }, item === null || item === void 0 ? void 0 : item.label));
-        }
-        else {
-            return (React.createElement(NavItem, { as: NavLink, to: (item === null || item === void 0 ? void 0 : item.to) || '', key: item === null || item === void 0 ? void 0 : item.label, onMouseDown: defaultOnMouseDownHandler, onClick: function (e) { return item.action && item.action(e); } }, item === null || item === void 0 ? void 0 : item.label));
-        }
-    };
-    return (React.createElement(NavContainer, null, items === null || items === void 0 ? void 0 :
-        items.reverse().map(function (no) { return getNavItem(no); }),
-        action && !action.tooltip &&
-            React.createElement(StyledButton, __assign({ variant: "secondary", onClick: action === null || action === void 0 ? void 0 : action.action }, action), action.label),
-        action && !!action.tooltip &&
-            React.createElement(TooltipWrapper, __assign({}, action.tooltip),
-                React.createElement(StyledButton, __assign({ variant: "secondary", onClick: action === null || action === void 0 ? void 0 : action.action }, action), action.label))));
-};
-export default RightSideNav;
-var templateObject_1, templateObject_2;

package/dist/src/GlobalNavigationBar/desktop/SubMenu.d.ts

@@ -1,21 +0,0 @@
-import * as React from 'react';
-import { MenuNavigationItemTypeDesktopGroup } from '../types';
-export declare type SubMenuProps = {
-    item: MenuNavigationItemTypeDesktopGroup;
-    index: number;
-    topLevel: boolean;
-    dropdownMenusOpenedArray: React.MutableRefObject<string[]>;
-    onSubMenuOpened?: (item: string) => void;
-    onSubMenuHidden?: (item: string) => void;
-    onItemStateChanged?: (item: string, state: boolean) => void;
-    onItemFocused?: (item: string) => void;
-    focusedItemId?: string;
-    activeItemId?: string;
-    nestPath?: string[];
-    ariaLabelledBy?: string;
-};
-export declare const SubMenuWrapper: import("styled-components").StyledComponent<"div", any, {
-    topLevel: boolean;
-    visible: boolean;
-}, never>;
-export declare const SubMenu: React.ForwardRefExoticComponent<SubMenuProps & React.RefAttributes<HTMLUListElement>>;

package/dist/src/GlobalNavigationBar/desktop/SubMenu.js

@@ -1,131 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-import * as React from 'react';
-import styled from 'styled-components';
-import { Menu, MenuSection, MenuSectionList } from './ExtendedMainMenu';
-import { Size } from '../../types';
-import { SystemIcons } from '../../icons';
-import { checkIfContainsItem } from '../utils';
-import Tabs from '../../Tabs/Tabs';
-import TabLink from '../../Tabs/TabLink';
-import { MenuItem } from '../../MenuItem';
-export var SubMenuWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", " {\n    top: ", ";\n    left: ", ";\n  }\n\n  ", "\n\n  button {\n    padding-left: 0px;\n  }\n"], ["\n  ", " {\n    top: ", ";\n    left: ", ";\n  }\n\n  ", "\n\n  button {\n    padding-left: 0px;\n  }\n"])), Menu, function (props) { return (props.topLevel ? '100%' : '0px'); }, function (props) { return (props.topLevel ? '0px' : 'calc(100% - 12px)'); }, function (props) { return (!props.visible ? 'display: none;' : ''); });
-export var SubMenu = React.forwardRef(function (_a, ref) {
-    var item = _a.item, index = _a.index, topLevel = _a.topLevel, dropdownMenusOpenedArray = _a.dropdownMenusOpenedArray, onSubMenuHidden = _a.onSubMenuHidden, onSubMenuOpened = _a.onSubMenuOpened, onItemStateChanged = _a.onItemStateChanged, focusedItemId = _a.focusedItemId, activeItemId = _a.activeItemId, nestPath = _a.nestPath, ariaLabelledBy = _a.ariaLabelledBy, onItemFocused = _a.onItemFocused;
-    var _b = React.useState({}), forceUpdate = _b[1];
-    var focusedRef = React.useRef({ index: -1 });
-    var _c = React.useState([]), allRefs = _c[0], setAllRefs = _c[1];
-    var _d = React.useState([]), subMenuRefs = _d[0], setAllSubMenuRefs = _d[1];
-    React.useEffect(function () {
-        setAllRefs(item.items.map(function (x) { return (x.type == 'desktopgroup' ? React.createRef() : React.createRef()); }));
-        setAllSubMenuRefs(item.items.map(function (x) { return (x.type == 'desktopgroup' ? React.createRef() : undefined); }));
-    }, [item]);
-    var existingRef = dropdownMenusOpenedArray.current.find(function (x) { return x == item.id; });
-    var onMouseLeave = function (event, id) {
-        dropdownMenusOpenedArray.current = __spreadArray([], dropdownMenusOpenedArray.current.filter(function (x) { return x != id; }), true);
-        //just trigger rerendering
-        onSubMenuHidden && onSubMenuHidden(id);
-        forceUpdate({});
-    };
-    var containActiveItem = false;
-    if (item.type == 'desktopgroup' && activeItemId)
-        containActiveItem = checkIfContainsItem(item, activeItemId);
-    var onMouseEnter = function (event, id) {
-        var existingRefForId = dropdownMenusOpenedArray.current.find(function (x) { return x == id; });
-        if (existingRefForId == null) {
-            dropdownMenusOpenedArray.current = __spreadArray(__spreadArray([], dropdownMenusOpenedArray.current, true), [id], false);
-            //just trigger rerendering
-            onSubMenuOpened && onSubMenuOpened(id);
-            forceUpdate({});
-        }
-    };
-    var onKeyDown = function (e) {
-        var _a;
-        if (e.key === 'ArrowUp' || e.key === 'Up') {
-            e.stopPropagation();
-            e.preventDefault();
-            if (focusedRef.current.index > 0) {
-                setNewFocusedElement(focusedRef.current.index - 1);
-            }
-        }
-        else if (e.key === 'ArrowDown' || e.key === 'Down') {
-            e.stopPropagation();
-            e.preventDefault();
-            if (focusedRef.current.index < allRefs.length - 1)
-                setNewFocusedElement(focusedRef.current.index + 1);
-        }
-        else if (e.key == 'Enter' || e.code == 'Space') {
-            e.stopPropagation();
-            if (focusedRef.current.index < 0)
-                return;
-            var focusedItem = item.items[focusedRef.current.index];
-            if (focusedItem.type == 'desktopgroup') {
-                dropdownMenusOpenedArray.current = __spreadArray(__spreadArray([], dropdownMenusOpenedArray.current, true), [focusedItem.id], false);
-                forceUpdate({});
-            }
-            else {
-                (_a = allRefs[focusedRef.current.index].current) === null || _a === void 0 ? void 0 : _a.click();
-                forceUpdate({});
-            }
-            //just trigger rerendering
-        }
-    };
-    var setNewFocusedElement = function (index) {
-        var _a, _b, _c;
-        var newFocusedElement = index >= 0 ? allRefs[index] : null;
-        var oldFocusedElement = focusedRef.current.index >= 0 ? allRefs[focusedRef.current.index] : null;
-        focusedRef.current.index = index;
-        if (oldFocusedElement)
-            (_a = oldFocusedElement === null || oldFocusedElement === void 0 ? void 0 : oldFocusedElement.current) === null || _a === void 0 ? void 0 : _a.classList.remove('dropdown-hover');
-        if (newFocusedElement && newFocusedElement !== oldFocusedElement) {
-            (_b = newFocusedElement.current) === null || _b === void 0 ? void 0 : _b.classList.add('dropdown-hover');
-            console.log(item.items[index].id);
-            onItemFocused && onItemFocused((_c = item.items[index].id) !== null && _c !== void 0 ? _c : '');
-        }
-        else if (onItemFocused)
-            onItemFocused('');
-    };
-    var onFocus = function (event) {
-        event.stopPropagation();
-        dropdownMenusOpenedArray.current = __spreadArray([], (nestPath !== null && nestPath !== void 0 ? nestPath : []), true);
-        setNewFocusedElement(0);
-        forceUpdate({});
-    };
-    var onBlur = function (event) {
-        event.stopPropagation();
-        setNewFocusedElement(-1);
-    };
-    return (React.createElement(SubMenuWrapper, { id: item.id, className: existingRef ? 'open' : '', topLevel: topLevel, visible: Boolean(existingRef) },
-        React.createElement(Menu, { role: "group", ref: ref, "aria-labelledby": ariaLabelledBy, onBlur: onBlur, onFocus: onFocus, onKeyDown: function (event) { return onKeyDown(event); }, tabIndex: 0 },
-            React.createElement(MenuSection, null,
-                React.createElement(MenuSectionList, null,
-                    React.createElement(Tabs, { size: Size.Medium }, item.items.map(function (entry, index) {
-                        var _a, _b, _c, _d;
-                        var isGroup = entry.type == 'desktopgroup';
-                        var key = isGroup ? entry.id : entry.type == 'item' ? entry.to : '';
-                        var SubItemOpened = Boolean(dropdownMenusOpenedArray.current.find(function (x) { return x == entry.id; }));
-                        if (isGroup) {
-                            return (React.createElement("div", { style: { position: 'relative' }, onMouseEnter: function (event) { return onMouseEnter(event, entry.id); }, onMouseLeave: function (event) { return onMouseLeave(event, entry.id); } },
-                                React.createElement(MenuItem, { id: entry.id + '_parentOption', "aria-expanded": Boolean(SubItemOpened), "aria-activedescendant": (_b = (_a = entry.items.find(function (x) { return x.id == focusedItemId; })) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : '', tabIndex: -1, ref: allRefs[index], "aria-controls": entry.id, role: "group", 
-                                    //id={entry.id} removing this can break something
-                                    item: {
-                                        value: (_c = entry.label) !== null && _c !== void 0 ? _c : '',
-                                    }, iconRight: React.createElement(SystemIcons.ArrowDropRight, { size: "24px" }), active: SubItemOpened || (Boolean(activeItemId) && activeItemId != '' && checkIfContainsItem(entry, activeItemId)), onClickHandler: function () { } }),
-                                React.createElement(SubMenu, { ariaLabelledBy: entry.id + '_parentOption', onItemFocused: onItemFocused, focusedItemId: focusedItemId, ref: subMenuRefs[index], nestPath: __spreadArray(__spreadArray([], (nestPath !== null && nestPath !== void 0 ? nestPath : []), true), [entry.id], false), onItemStateChanged: onItemStateChanged, activeItemId: activeItemId, dropdownMenusOpenedArray: dropdownMenusOpenedArray, item: entry, index: index + 1, topLevel: false })));
-                        }
-                        return (React.createElement(React.Fragment, null,
-                            React.createElement(TabLink, { id: entry.id, tabIndex: -1, key: key, to: isGroup ? '' : key, ref: allRefs[index], onActiveStateChanged: function (state) { return onItemStateChanged && entry.type == 'item' && onItemStateChanged(entry.to, state); }, forceDeactivate: isGroup, requiredLine: (_d = entry.label) !== null && _d !== void 0 ? _d : '', optionalLine: '', endLineIcon: isGroup ? React.createElement(SystemIcons.ArrowDropRight, { size: "24px" }) : null, OptionalLineIcon: '', disabled: entry.disabled, showNotificationDot: false, size: Size.Medium, variant: "positive" })));
-                    })))))));
-});
-var templateObject_1;

package/dist/src/GlobalNavigationBar/desktop/UserMenu.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-import { ProfileMenu } from '../types';
-interface UserMenuProps extends ProfileMenu {
-    show?: boolean;
-    onHideUserMenu: () => void;
-}
-declare const UserMenu: ({ show, user, onHideUserMenu, sections, signOut, label }: UserMenuProps) => React.JSX.Element;
-export default UserMenu;

package/dist/src/GlobalNavigationBar/desktop/UserMenu.js

@@ -1,90 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-import * as React from 'react';
-import styled from 'styled-components';
-import { Button } from '../../Button';
-import { BOXSHADOWS, COLORS, ComponentLStyling, ComponentSStyling, ComponentTextStyle, ComponentXSStyling, Z_INDEXES } from '../../styles';
-import { Size } from '../../types';
-import { flowDown, UserMenuSectionListStyling } from '../mobile/CommonStyles';
-import { SystemIcons } from '../../icons';
-import { HyperLink } from '../../HyperLink';
-import Breakpoints from '../../styles/breakpoints';
-import { MenuItem } from '../../MenuItem';
-import { useNavigationHelper } from '../../common/NavigationHelper';
-import { ProfileButton } from '../../ProfileButton';
-var UserMenuScrollContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  flex: 1;\n"], ["\n  flex: 1;\n"])));
-var UserMenuPinnedContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject([""], [""])));
-var UserMenuWrapper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  margin: 0;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: none;\n  width: 320px;\n\n  position: absolute;\n\n  &.show {\n    display: block;\n  }\n\n  top: 0;\n  right: 0;\n  z-index: ", ";\n  height: 100%;\n  flex-flow: column;\n\n\n  ", " {\n    flex-flow: initial;\n    top: initial;\n    right: initial;\n    height: initial;\n    animation: ", " 0.2s ease-in-out;\n    box-shadow: ", ";\n    border-radius: 8px;\n    border: 1px solid ", ";\n    z-index: ", ";\n    padding: 24px 0;\n  }\n"], ["\n  margin: 0;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: none;\n  width: 320px;\n\n  position: absolute;\n\n  &.show {\n    display: block;\n  }\n\n  top: 0;\n  right: 0;\n  z-index: ", ";\n  height: 100%;\n  flex-flow: column;\n\n\n  ", " {\n    flex-flow: initial;\n    top: initial;\n    right: initial;\n    height: initial;\n    animation: ", " 0.2s ease-in-out;\n    box-shadow: ", ";\n    border-radius: 8px;\n    border: 1px solid ", ";\n    z-index: ", ";\n    padding: 24px 0;\n  }\n"])), COLORS.white, Z_INDEXES.off_canvas, Breakpoints.MEDIUM, flowDown, BOXSHADOWS.BOXSHADOW_CENTERED, COLORS.neutral_200, Z_INDEXES.fixed_menu);
-var MenuSection = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  padding: 4px 0;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ", ";\n  }\n"], ["\n  padding: 4px 0;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ", ";\n  }\n"])), COLORS.neutral_200);
-var SignOutActionWrapper = styled(MenuSection)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  align-items: center;\n  justify-content: center;\n"], ["\n  align-items: center;\n  justify-content: center;\n"])));
-var MenuSectionHeader = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  padding: 8px 24px 4px 24px;\n  box-sizing: border-box;\n  min-height: 32px;\n  background-color: ", ";\n\n  ", "\n"], ["\n  display: flex;\n  align-items: center;\n  padding: 8px 24px 4px 24px;\n  box-sizing: border-box;\n  min-height: 32px;\n  background-color: ", ";\n\n  ", "\n"])), COLORS.neutral_20, ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500));
-var MenuSectionList = styled.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  margin: 0;\n  padding: 0;\n\n  ", ";\n"], ["\n  margin: 0;\n  padding: 0;\n\n  ", ";\n"])), UserMenuSectionListStyling);
-var UserSectionAvatar = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  pointer-events: none;\n\n  button {\n    padding: 0 !important;\n  }\n\n  button > div {\n    width: 48px !important;\n    height: 48px !important;\n    border-radius: 50% !important;\n  }\n"], ["\n  pointer-events: none;\n\n  button {\n    padding: 0 !important;\n  }\n\n  button > div {\n    width: 48px !important;\n    height: 48px !important;\n    border-radius: 50% !important;\n  }\n"])));
-var UserSectionInfo = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  padding: 2px 0;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n"], ["\n  padding: 2px 0;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n"])));
-var UserSectionInfoName = styled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600));
-var UserSectionInfoEmail = styled.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  word-break: break-all;\n  ", "\n"], ["\n  word-break: break-all;\n  ", "\n"])), ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500));
-var UserSectionInfoLink = styled.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  padding: 2px 0;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  ", "\n  svg {\n    width: 16px;\n    height: 16px;\n  }\n"], ["\n  padding: 2px 0;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  ", "\n  svg {\n    width: 16px;\n    height: 16px;\n  }\n"])), ComponentXSStyling(ComponentTextStyle.Bold, null));
-var UserSection = styled.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: row;\n  padding: 0 24px 8px 24px;\n  gap: 16px;\n"], ["\n  display: flex;\n  flex-direction: row;\n  padding: 0 24px 8px 24px;\n  gap: 16px;\n"])));
-var UserMenu = function (_a) {
-    var show = _a.show, user = _a.user, onHideUserMenu = _a.onHideUserMenu, sections = _a.sections, signOut = _a.signOut, label = _a.label;
-    var _b = useNavigationHelper(), navigate = _b.navigate, isActiveRoute = _b.isActiveRoute;
-    React.useEffect(function () {
-        if (!onHideUserMenu)
-            return;
-        function handleKeyPress(e) {
-            if (e.key === 'Escape' || e.key === 'Esc') {
-                onHideUserMenu();
-            }
-        }
-        document === null || document === void 0 ? void 0 : document.addEventListener('keydown', handleKeyPress, false);
-        return function () {
-            document === null || document === void 0 ? void 0 : document.removeEventListener('keydown', handleKeyPress, false);
-        };
-    }, [onHideUserMenu]);
-    var renderItem = function (item, section, index) {
-        return React.createElement(MenuItem, { key: index, id: "profile_".concat(index), active: !item.external && isActiveRoute(item.to, !!item.exact), item: {
-                value: item.to,
-                disabled: item.disabled,
-                icon: item.icon,
-                displayLabel: item.label,
-            }, onClickHandler: function (e) {
-                item.action && item.action(e);
-                navigate(item.to, !!item.external);
-            } });
-    };
-    return (React.createElement(UserMenuWrapper, { onClick: onHideUserMenu, className: show ? 'show' : '', role: "menu", "aria-labelledby": "UserMenuButton" },
-        React.createElement(UserMenuScrollContainer, null,
-            React.createElement(UserSection, null,
-                React.createElement(UserSectionAvatar, null,
-                    React.createElement(ProfileButton, { onClick: function () {
-                        }, tabIndex: -1, initials: user.firstName[0] + user.lastName[0] })),
-                React.createElement(UserSectionInfo, null,
-                    React.createElement(UserSectionInfoName, { "data-hj-suppress": true }, "".concat(user.firstName, " ").concat(user.lastName)),
-                    React.createElement(UserSectionInfoEmail, { "data-hj-suppress": true }, user.email),
-                    user.link &&
-                        React.createElement(HyperLink, { variant: 'default', href: user.link.href, target: user.link.target, id: user.link.id, onClick: user.link.onClick },
-                            React.createElement(UserSectionInfoLink, null,
-                                React.createElement("span", null, user.link.label),
-                                user.link.icon && React.cloneElement(user.link.icon, { size: '16px' }))))),
-            sections.filter(function (a) { return !a.pinned; }).map(function (section, index) {
-                return React.createElement(MenuSection, { key: index, className: section.divider ? 'divider' : '' },
-                    section.label && React.createElement(MenuSectionHeader, null, section.label),
-                    React.createElement(MenuSectionList, { key: index }, section.items.map(function (item, index) { return renderItem(item, section, index); })));
-            })),
-        React.createElement(UserMenuPinnedContainer, null,
-            sections.filter(function (a) { return !!a.pinned; }).map(function (section, index) {
-                return React.createElement(MenuSection, { key: index, className: section.divider || index === 0 ? 'divider' : '' },
-                    section.label && React.createElement(MenuSectionHeader, null, section.label),
-                    React.createElement(MenuSectionList, { key: index }, section.items.map(function (item, index) { return renderItem(item, section, index); })));
-            }),
-            signOut &&
-                React.createElement(SignOutActionWrapper, null,
-                    React.createElement(Button, { width: '272px', variant: "secondary", icon: React.createElement(SystemIcons.Logout, null), size: Size.Large, onClick: function (e) {
-                            e.preventDefault();
-                            signOut === null || signOut === void 0 ? void 0 : signOut.action();
-                        } }, signOut === null || signOut === void 0 ? void 0 : signOut.label)))));
-};
-export default UserMenu;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13;

package/dist/src/GlobalNavigationBar/index.d.ts

@@ -1,3 +0,0 @@
-import GlobalNavigationBar from './GlobalNavigationBar';
-export * from './types';
-export { GlobalNavigationBar };

package/dist/src/GlobalNavigationBar/index.js

@@ -1,3 +0,0 @@
-import GlobalNavigationBar from './GlobalNavigationBar';
-export * from './types';
-export { GlobalNavigationBar };

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

@@ -1,18 +0,0 @@
-/// <reference types="react" />
-export declare const RowLayout: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const Button: import("styled-components").StyledComponent<"button", any, {}, never>;
-export declare const fadeOut: import("styled-components").Keyframes;
-export declare const fadeIn: import("styled-components").Keyframes;
-export declare const Menu: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const Right: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SiteName: import("styled-components").StyledComponent<"span", any, {}, never>;
-export declare const MenuSection: import("styled-components").StyledComponent<"li", any, {}, never>;
-export declare const MenuSectionList: import("styled-components").StyledComponent<"ul", any, {}, never>;
-export declare const UserMenuSectionListStyling: import("styled-components").FlattenSimpleInterpolation;
-export declare const MenuLink: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react-router-dom").NavLinkProps & import("react").RefAttributes<HTMLAnchorElement>>, any, {}, never>;
-export declare const flowDown: import("styled-components").Keyframes;
-export declare const MobileMenuWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ScrollableContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const MobileHeaderText: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const MobileHeaderNote: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const MobileHeaderContainer: import("styled-components").StyledComponent<"div", any, {}, never>;

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

@@ -1,28 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-import styled, { css, keyframes } from 'styled-components';
-import { BREAKPOINTS, COLORS, ComponentMStyling, ComponentSStyling, ComponentTextStyle, ComponentXSStyling, focusStyles, scrollBarStyling, Z_INDEXES } from '../../styles';
-import { NavLink } from 'react-router-dom';
-import { Size } from '../../types';
-export var RowLayout = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n"], ["\n  display: flex;\n  align-items: center;\n"])));
-export var Button = styled.button(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  font-weight: bold;\n  border: 0;\n"], ["\n  background-color: ", ";\n  font-weight: bold;\n  border: 0;\n"])), COLORS.white);
-var flowLeft = keyframes(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  0% {\n    opacity: 0;\n    transform: translateX(100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n"], ["\n  0% {\n    opacity: 0;\n    transform: translateX(100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n"])));
-var flowRight = keyframes(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  0% {\n    opacity: 1;\n    transform: translateX(0);\n    visibility: visible;\n  }\n  to {\n    opacity: 0;\n    visibility: hidden;\n    transform: translateX(100%);\n  }\n"], ["\n  0% {\n    opacity: 1;\n    transform: translateX(0);\n    visibility: visible;\n  }\n  to {\n    opacity: 0;\n    visibility: hidden;\n    transform: translateX(100%);\n  }\n"])));
-export var fadeOut = keyframes(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  0% {\n    opacity: 1;\n    visibility: visible;\n  }\n  to {\n    opacity: 0;\n    visibility: hidden;\n  }\n"], ["\n  0% {\n    opacity: 1;\n    visibility: visible;\n  }\n  to {\n    opacity: 0;\n    visibility: hidden;\n  }\n"])));
-export var fadeIn = keyframes(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  0% {\n    opacity: 0;\n    visibility: hidden;\n  }\n  to {\n    opacity: 1;\n    visibility: visible;\n  }\n"], ["\n  0% {\n    opacity: 0;\n    visibility: hidden;\n  }\n  to {\n    opacity: 1;\n    visibility: visible;\n  }\n"])));
-export var Menu = styled.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  height: 100%;\n  background-color: ", ";\n  box-sizing: border-box;\n  right: 0;\n  top: 0;\n  position: absolute;\n  z-index: ", ";\n  align-items: center;\n\n  width: 320px;\n\n  ", " {\n    width: 400px;\n  }\n\n  .open & {\n    visibility: visible;\n    display: flex;\n    animation: ", " 0.3s ease-in-out;\n  }\n\n  .closed & {\n    visibility: hidden;\n    animation: ", " 0.3s ease-in-out;\n  }\n"], ["\n  height: 100%;\n  background-color: ", ";\n  box-sizing: border-box;\n  right: 0;\n  top: 0;\n  position: absolute;\n  z-index: ", ";\n  align-items: center;\n\n  width: 320px;\n\n  ", " {\n    width: 400px;\n  }\n\n  .open & {\n    visibility: visible;\n    display: flex;\n    animation: ", " 0.3s ease-in-out;\n  }\n\n  .closed & {\n    visibility: hidden;\n    animation: ", " 0.3s ease-in-out;\n  }\n"])), COLORS.white, Z_INDEXES.off_canvas, BREAKPOINTS.SMALL, flowLeft, flowRight);
-export var Right = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  display: flex;\n  margin-left: auto;\n"], ["\n  display: flex;\n  margin-left: auto;\n"])));
-export var SiteName = styled.span(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  color: ", ";\n  font-weight: bold;\n  font-size: 14px;\n  margin-left: 4px;\n"], ["\n  color: ", ";\n  font-weight: bold;\n  font-size: 14px;\n  margin-left: 4px;\n"])), COLORS.neutral_600);
-export var MenuSection = styled.li(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  margin-top: 16px;\n\n  .disabled-link {\n    color: #21212150;\n    pointer-events: none;\n    key-events: none;\n  }\n"], ["\n  margin-top: 16px;\n\n  .disabled-link {\n    color: #21212150;\n    pointer-events: none;\n    key-events: none;\n  }\n"])));
-export var MenuSectionList = styled.ul(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  list-style: none;\n  padding: 0;\n\n  li {\n    width: 80%;\n    height: 48px;\n    margin: 0 auto 0 12px;\n\n    a {\n      height: 100%;\n    }\n  }\n"], ["\n  list-style: none;\n  padding: 0;\n\n  li {\n    width: 80%;\n    height: 48px;\n    margin: 0 auto 0 12px;\n\n    a {\n      height: 100%;\n    }\n  }\n"])));
-export var UserMenuSectionListStyling = css(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  li {\n    position: relative;\n  }\n\n  li:hover:not(.disabled) {\n    z-index: ", ";\n    background-color: ", ";\n\n    a {\n      color: ", ";\n    }\n\n    svg {\n      color: ", ";\n    }\n  }\n\n  li:focus-within:not(.disabled) {\n    z-index: ", ";\n\n    ", "\n    a {\n      outline: none;\n    }\n  }\n\n  li:active:not(.disabled) {\n    z-index: ", ";\n    background: ", ";\n\n    a {\n      color: ", ";\n    }\n\n    svg {\n      color: ", ";\n    }\n  }\n\n  .disabled {\n    a {\n      color: ", ";\n    }\n\n    svg {\n      color: ", ";\n    }\n\n    background-color: ", ";\n  }\n"], ["\n  li {\n    position: relative;\n  }\n\n  li:hover:not(.disabled) {\n    z-index: ", ";\n    background-color: ", ";\n\n    a {\n      color: ", ";\n    }\n\n    svg {\n      color: ", ";\n    }\n  }\n\n  li:focus-within:not(.disabled) {\n    z-index: ", ";\n\n    ", "\n    a {\n      outline: none;\n    }\n  }\n\n  li:active:not(.disabled) {\n    z-index: ", ";\n    background: ", ";\n\n    a {\n      color: ", ";\n    }\n\n    svg {\n      color: ", ";\n    }\n  }\n\n  .disabled {\n    a {\n      color: ", ";\n    }\n\n    svg {\n      color: ", ";\n    }\n\n    background-color: ", ";\n  }\n"])), Z_INDEXES.hover, COLORS.primary_20, COLORS.primary_600, COLORS.primary_600, Z_INDEXES.focus, focusStyles, Z_INDEXES.active, COLORS.primary_100, COLORS.primary_800, COLORS.primary_800, COLORS.neutral_300, COLORS.neutral_300, COLORS.neutral_100);
-export var MenuLink = styled(NavLink)(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  border: none;\n  background: transparent;\n  margin: auto;\n\n  box-sizing: border-box;\n\n  ", "\n\n  text-decoration: none;\n  text-align: center;\n  align-items: center;\n  display: flex;\n"], ["\n  border: none;\n  background: transparent;\n  margin: auto;\n\n  box-sizing: border-box;\n\n  ", "\n\n  text-decoration: none;\n  text-align: center;\n  align-items: center;\n  display: flex;\n"])), ComponentMStyling(ComponentTextStyle.Regular, COLORS.black));
-export var flowDown = keyframes(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  0% {\n    opacity: 0;\n    transform: translateY(-10px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n"], ["\n  0% {\n    opacity: 0;\n    transform: translateY(-10px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n"])));
-export var MobileMenuWrapper = styled.div(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n  width: 100%;\n  box-sizing: border-box;\n  flex-flow: column;\n  display: flex;\n  flex: 1;\n  overflow: hidden;\n"], ["\n  width: 100%;\n  box-sizing: border-box;\n  flex-flow: column;\n  display: flex;\n  flex: 1;\n  overflow: hidden;\n"])));
-export var ScrollableContainer = styled.div(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n  max-height: 100%;\n\n  &.scrollable {\n    margin-right: 6px;\n    padding-right: 10px;\n  }\n\n  ", "\n  ::-webkit-scrollbar-track {\n    margin: 8px;\n  }\n"], ["\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n  max-height: 100%;\n\n  &.scrollable {\n    margin-right: 6px;\n    padding-right: 10px;\n  }\n\n  ", "\n  ::-webkit-scrollbar-track {\n    margin: 8px;\n  }\n"])), scrollBarStyling(Size.Small));
-export var MobileHeaderText = styled.div(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  ", "\n  ", " {\n    ", "\n  }\n"], ["\n  ", "\n  ", " {\n    ", "\n  }\n"])), ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600), BREAKPOINTS.SMALL, ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600));
-export var MobileHeaderNote = styled.div(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n  word-break: break-all;\n  ", "\n"], ["\n  word-break: break-all;\n  ", "\n"])), ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600));
-export var MobileHeaderContainer = styled.div(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n  margin: 0 24px;\n  padding-bottom: 8px;\n  box-sizing: border-box;\n  border-bottom: 1px solid ", ";\n  display: flex;\n  flex-direction: column;\n"], ["\n  margin: 0 24px;\n  padding-bottom: 8px;\n  box-sizing: border-box;\n  border-bottom: 1px solid ", ";\n  display: flex;\n  flex-direction: column;\n"])), COLORS.neutral_200);
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19;

package/dist/src/GlobalNavigationBar/mobile/MobileActionContainer.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-import { MenuButton } from '../types';
-interface MobileActionContainerProps extends MenuButton {
-}
-export declare const MobileActionContainer: React.FunctionComponent<MobileActionContainerProps>;
-export {};

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

@@ -1,18 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-import React from 'react';
-import styled from 'styled-components';
-import { Button } from '../../Button';
-import { BREAKPOINTS, COLORS } from '../../styles';
-import { Size } from '../../types';
-import { useMediaMatch } from "rooks";
-var ActionContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  padding: 8px 16px;\n  box-sizing: border-box;\n  border-top: 1px solid ", ";\n  display: flex;\n  flex-direction: column;\n\n  ", " {\n    padding: 16px;\n  }\n"], ["\n  padding: 8px 16px;\n  box-sizing: border-box;\n  border-top: 1px solid ", ";\n  display: flex;\n  flex-direction: column;\n\n  ", " {\n    padding: 16px;\n  }\n"])), COLORS.neutral_200, BREAKPOINTS.SMALL);
-export var MobileActionContainer = function (_a) {
-    var disabled = _a.disabled, _b = _a.variant, variant = _b === void 0 ? 'secondary' : _b, icon = _a.icon, label = _a.label, loading = _a.loading, action = _a.action;
-    var isSmallScreen = useMediaMatch(BREAKPOINTS.SMALL.replace('@media ', ''));
-    return (React.createElement(ActionContainer, null,
-        React.createElement(Button, { variant: variant, size: isSmallScreen ? Size.Medium : Size.Small, disabled: disabled, icon: icon, loading: loading, onClick: action }, label)));
-};
-var templateObject_1;

package/dist/src/GlobalNavigationBar/mobile/MobileMenu.d.ts

@@ -1,9 +0,0 @@
-import * as React from 'react';
-import { MobileNavigationMenuProps, ProfileMenu } from '../types';
-declare type Props = MobileNavigationMenuProps & {
-    profile?: ProfileMenu;
-    show?: boolean;
-    onClose: () => void;
-};
-declare const MobileMenu: ({ show, profile, buttons, label, header, items, footer, action, onClose }: Props) => React.JSX.Element;
-export default MobileMenu;