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

package/dist/GlobalNavigationBar/UserMenu/MobileUserMenu.js

@@ -1,146 +0,0 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
-import _pt from "prop-types";
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
-
-import * as React from 'react';
-import styled from 'styled-components';
-import { BREAKPOINTS, COLORS, ComponentTextStyle, scrollBarStyling } from '../../styles';
-import MenuLink from './MenuLink';
-import { Size } from '../../types';
-import { Button, IconButton } from '../../Button';
-import { ArrowLineLeft, Close } from '../../icons/systemicons/SystemIcons';
-import { flowDown, Right, UserMenuSectionListStyling } from '../mobile/CommonStyles';
-import { ComponentSStyling } from '../../styles/typography';
-import { Z_INDEXES } from '../../styles/z-indexes';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-var Menu = styled.ul(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  list-style: none;\n  margin: 0;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: none;\n  -webkit-animation: ", " 0.2s ease-in-out;\n  animation: ", " 0.2s ease-in-out;\n  position: absolute;\n  border-radius: 4px;\n  z-index: ", ";\n  height: 100%;\n  width: 320px;\n  padding-inline-start: 0;\n  overflow-y: scroll;\n  ", " {\n    min-width: 360px;\n  }\n\n  .open & {\n    display: flex;\n    flex-direction: column;\n  }\n\n  .signOutButton {\n    height: 40px !important;\n    width: 288px !important;\n\n    ", " {\n      width: 328px !important;\n    }\n  }\n\n  ", ";\n"])), COLORS.white, flowDown, flowDown, Z_INDEXES.fixed_menu, BREAKPOINTS.SMALL, BREAKPOINTS.SMALL, scrollBarStyling(Size.Small));
-var MenuSection = styled.li(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  padding: 8px 0;\n  position: relative;\n\n  .disabled-link {\n    color: #21212150;\n    pointer-events: none;\n    key-events: none;\n  }\n"])));
-var MenuSectionList = styled.ul(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  list-style: none;\n  margin: 0;\n  overflow-y: unset !important;\n  padding-inline-start: 0;\n  ", ";\n"])), UserMenuSectionListStyling);
-var Top = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  padding: 22px 12px 0 12px;\n  color: ", ";\n\n  h3 {\n    margin-block-start: 0 !important;\n    margin-block-end: 0 !important;\n    margin-inline-start: 0;\n    margin-inline-end: 0;\n    margin-left: 24px;\n\n    ", "\n  }\n"])), COLORS.neutral_600, ComponentSStyling(ComponentTextStyle.Regular, 'inherit'));
-var LabelLine = styled.span(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  height: 32px;\n  background-color: ", ";\n  padding-left: 24px;\n  display: flex;\n  line-height: 32px;\n"])), COLORS.neutral_20);
-var StyledMenulink = styled(MenuLink)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 48px;\n  margin: 0;\n  \n  & a {\n    height: 100%;\n  }\n"])));
-
-var MobileUserMenu = function MobileUserMenu(_ref) {
-  var accountMenuHeader = _ref.accountMenuHeader,
-      firstName = _ref.firstName,
-      lastName = _ref.lastName,
-      email = _ref.email,
-      organizationName = _ref.organizationName,
-      clickMenuAction = _ref.clickMenuAction,
-      accountSection = _ref.accountSection,
-      organizationSection = _ref.organizationSection,
-      supportSection = _ref.supportSection,
-      signOut = _ref.signOut,
-      signOutLabel = _ref.signOutLabel;
-  React.useEffect(function () {
-    function handleKeyPress(e) {
-      if (e.keyCode === 27) {
-        clickMenuAction();
-      }
-    }
-
-    document.addEventListener('keydown', handleKeyPress, false);
-    return function () {
-      document.removeEventListener('keydown', handleKeyPress, false);
-    };
-  }, [clickMenuAction]);
-  return /*#__PURE__*/_jsxs(Menu, {
-    onClick: function onClick() {},
-    role: "menu",
-    "aria-labelledby": "UserMenuButton",
-    children: [/*#__PURE__*/_jsxs(Top, {
-      children: [/*#__PURE__*/_jsx(IconButton, {
-        variant: "secondary",
-        shape: "circular",
-        action: clickMenuAction,
-        isInMobileMenu: true,
-        children: /*#__PURE__*/_jsx(ArrowLineLeft, {
-          size: "24px",
-          color: COLORS.neutral_600
-        })
-      }), /*#__PURE__*/_jsx("h3", {
-        children: accountMenuHeader
-      }), /*#__PURE__*/_jsx(Right, {
-        children: /*#__PURE__*/_jsx(IconButton, {
-          variant: "secondary",
-          shape: "circular",
-          action: clickMenuAction,
-          isInMobileMenu: true,
-          children: /*#__PURE__*/_jsx(Close, {
-            size: "24px"
-          })
-        })
-      })]
-    }, "MobileUserMenuTopSection"), accountSection && (accountSection === null || accountSection === void 0 ? void 0 : accountSection.length) > 0 && /*#__PURE__*/_jsxs(MenuSection, {
-      children: [/*#__PURE__*/_jsx(LabelLine, {
-        "data-hj-suppress": true,
-        children: "".concat(firstName, " ").concat(lastName)
-      }), /*#__PURE__*/_jsx(MenuSectionList, {
-        children: accountSection === null || accountSection === void 0 ? void 0 : accountSection.map(function (element) {
-          return /*#__PURE__*/_jsx(StyledMenulink, {
-            to: element === null || element === void 0 ? void 0 : element.to,
-            menuText: element === null || element === void 0 ? void 0 : element.label
-          }, element === null || element === void 0 ? void 0 : element.to);
-        })
-      })]
-    }, "MobileAccountSection"), organizationSection && (organizationSection === null || organizationSection === void 0 ? void 0 : organizationSection.length) > 0 && /*#__PURE__*/_jsxs(MenuSection, {
-      children: [/*#__PURE__*/_jsx(LabelLine, {
-        children: organizationName || ''
-      }), /*#__PURE__*/_jsx(MenuSectionList, {
-        children: organizationSection === null || organizationSection === void 0 ? void 0 : organizationSection.map(function (element) {
-          return /*#__PURE__*/_jsx(StyledMenulink, {
-            to: element === null || element === void 0 ? void 0 : element.to,
-            menuText: element === null || element === void 0 ? void 0 : element.label
-          }, element === null || element === void 0 ? void 0 : element.to);
-        })
-      })]
-    }, "MObileOrganizationSection"), supportSection && (supportSection === null || supportSection === void 0 ? void 0 : supportSection.length) > 0 && /*#__PURE__*/_jsxs(MenuSection, {
-      children: [/*#__PURE__*/_jsx(LabelLine, {
-        children: ''
-      }), /*#__PURE__*/_jsx(MenuSectionList, {
-        children: supportSection === null || supportSection === void 0 ? void 0 : supportSection.map(function (element) {
-          return /*#__PURE__*/_jsx(StyledMenulink, {
-            isExternal: element.isExternal,
-            to: element === null || element === void 0 ? void 0 : element.to,
-            menuText: element === null || element === void 0 ? void 0 : element.label
-          }, element === null || element === void 0 ? void 0 : element.to);
-        })
-      })]
-    }, "MobileSupportSection"), signOut && /*#__PURE__*/_jsx("div", {
-      style: {
-        display: 'flex',
-        margin: 'auto 0 12px 0'
-      },
-      children: /*#__PURE__*/_jsx(Button, {
-        style: {
-          width: '90%',
-          margin: '0 auto'
-        },
-        variant: "secondary",
-        onClick: function onClick(e) {
-          e.preventDefault();
-          signOut(e);
-        },
-        children: signOutLabel
-      })
-    }, "SignoutButton")]
-  });
-};
-
-MobileUserMenu.propTypes = {
-  accountMenuHeader: _pt.string.isRequired,
-  firstName: _pt.string.isRequired,
-  lastName: _pt.string.isRequired,
-  email: _pt.string.isRequired,
-  organizationName: _pt.string.isRequired,
-  clickMenuAction: _pt.func.isRequired,
-  accountSection: _pt.array,
-  organizationSection: _pt.array,
-  supportSection: _pt.array,
-  signOut: _pt.func,
-  signOutLabel: _pt.string
-};
-export default MobileUserMenu;
-//# sourceMappingURL=MobileUserMenu.js.map

package/dist/GlobalNavigationBar/UserMenu/MobileUserMenu.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/UserMenu/MobileUserMenu.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","ComponentTextStyle","scrollBarStyling","MenuLink","Size","Button","IconButton","ArrowLineLeft","Close","flowDown","Right","UserMenuSectionListStyling","ComponentSStyling","Z_INDEXES","Menu","ul","white","fixed_menu","SMALL","Small","MenuSection","li","MenuSectionList","Top","div","neutral_600","Regular","LabelLine","span","neutral_20","StyledMenulink","MobileUserMenu","accountMenuHeader","firstName","lastName","email","organizationName","clickMenuAction","accountSection","organizationSection","supportSection","signOut","signOutLabel","useEffect","handleKeyPress","e","keyCode","document","addEventListener","removeEventListener","length","map","element","to","label","isExternal","display","margin","width","preventDefault"],"mappings":"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","sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, scrollBarStyling} from '../../styles';\r\n\r\nimport MenuLink from './MenuLink';\r\nimport {Size, UserMenuItem} from '../../types';\r\nimport {Button, IconButton} from '../../Button';\r\nimport {ArrowLineLeft, Close} from '../../icons/systemicons/SystemIcons';\r\nimport {flowDown, Right, UserMenuSectionListStyling} from '../mobile/CommonStyles';\r\nimport {ComponentSStyling} from '../../styles/typography';\r\nimport {Z_INDEXES} from '../../styles/z-indexes';\r\n\r\nconst Menu = styled.ul`\r\n  list-style: none;\r\n  margin: 0;\r\n  background-color: ${COLORS.white};\r\n  box-sizing: border-box;\r\n  display: none;\r\n  -webkit-animation: ${flowDown} 0.2s ease-in-out;\r\n  animation: ${flowDown} 0.2s ease-in-out;\r\n  position: absolute;\r\n  border-radius: 4px;\r\n  z-index: ${Z_INDEXES.fixed_menu};\r\n  height: 100%;\r\n  width: 320px;\r\n  padding-inline-start: 0;\r\n  overflow-y: scroll;\r\n  ${BREAKPOINTS.SMALL} {\r\n    min-width: 360px;\r\n  }\r\n\r\n  .open & {\r\n    display: flex;\r\n    flex-direction: column;\r\n  }\r\n\r\n  .signOutButton {\r\n    height: 40px !important;\r\n    width: 288px !important;\r\n\r\n    ${BREAKPOINTS.SMALL} {\r\n      width: 328px !important;\r\n    }\r\n  }\r\n\r\n  ${scrollBarStyling(Size.Small)};\r\n`;\r\n\r\nconst MenuSection = styled.li`\r\n  padding: 8px 0;\r\n  position: relative;\r\n\r\n  .disabled-link {\r\n    color: #21212150;\r\n    pointer-events: none;\r\n    key-events: none;\r\n  }\r\n`;\r\n\r\nconst MenuSectionList = styled.ul`\r\n  list-style: none;\r\n  margin: 0;\r\n  overflow-y: unset !important;\r\n  padding-inline-start: 0;\r\n  ${UserMenuSectionListStyling};\r\n`;\r\n\r\nconst Top = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n  align-items: center;\r\n  padding: 22px 12px 0 12px;\r\n  color: ${COLORS.neutral_600};\r\n\r\n  h3 {\r\n    margin-block-start: 0 !important;\r\n    margin-block-end: 0 !important;\r\n    margin-inline-start: 0;\r\n    margin-inline-end: 0;\r\n    margin-left: 24px;\r\n\r\n    ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\r\n  }\r\n`;\r\n\r\nconst LabelLine = styled.span`\r\n  height: 32px;\r\n  background-color: ${COLORS.neutral_20};\r\n  padding-left: 24px;\r\n  display: flex;\r\n  line-height: 32px;\r\n`;\r\n\r\nconst StyledMenulink = styled(MenuLink)`\r\n  width: 100%;\r\n  height: 48px;\r\n  margin: 0;\r\n  \r\n  & a {\r\n    height: 100%;\r\n  }\r\n`;\r\n\r\ninterface Props {\r\n  accountMenuHeader: string;\r\n  firstName: string;\r\n  lastName: string;\r\n  email: string;\r\n  organizationName: string;\r\n  clickMenuAction: () => void;\r\n  accountSection?: UserMenuItem[];\r\n  organizationSection?: UserMenuItem[];\r\n  supportSection?: UserMenuItem[];\r\n  signOut?: (e: any) => void;\r\n  signOutLabel?: string;\r\n}\r\n\r\nconst MobileUserMenu = ({\r\n  accountMenuHeader,\r\n  firstName,\r\n  lastName,\r\n  email,\r\n  organizationName,\r\n  clickMenuAction,\r\n  accountSection,\r\n  organizationSection,\r\n  supportSection,\r\n  signOut,\r\n  signOutLabel,\r\n}: Props) => {\r\n  React.useEffect(() => {\r\n    function handleKeyPress(e: any) {\r\n      if (e.keyCode === 27) {\r\n        clickMenuAction();\r\n      }\r\n    }\r\n\r\n    document.addEventListener('keydown', handleKeyPress, false);\r\n    return () => {\r\n      document.removeEventListener('keydown', handleKeyPress, false);\r\n    };\r\n  }, [clickMenuAction]);\r\n\r\n  return (\r\n    <Menu onClick={() => {}} role=\"menu\" aria-labelledby=\"UserMenuButton\">\r\n      <Top key=\"MobileUserMenuTopSection\">\r\n        <IconButton variant=\"secondary\" shape=\"circular\" action={clickMenuAction} isInMobileMenu={true}>\r\n          <ArrowLineLeft size=\"24px\" color={COLORS.neutral_600} />\r\n        </IconButton>\r\n        <h3>{accountMenuHeader}</h3>\r\n        <Right>\r\n          <IconButton variant=\"secondary\" shape=\"circular\" action={clickMenuAction} isInMobileMenu={true}>\r\n            <Close size=\"24px\" />\r\n          </IconButton>\r\n        </Right>\r\n      </Top>\r\n      {accountSection && accountSection?.length > 0 && (\r\n        <MenuSection key=\"MobileAccountSection\">\r\n          <LabelLine data-hj-suppress>{`${firstName} ${lastName}`}</LabelLine>\r\n          <MenuSectionList>\r\n            {accountSection?.map((element) => (\r\n              <StyledMenulink key={element?.to} to={element?.to} menuText={element?.label} />\r\n            ))}\r\n          </MenuSectionList>\r\n        </MenuSection>\r\n      )}\r\n      {organizationSection && organizationSection?.length > 0 && (\r\n        <MenuSection key=\"MObileOrganizationSection\">\r\n          <LabelLine>{organizationName || ''}</LabelLine>\r\n          <MenuSectionList>\r\n            {organizationSection?.map((element) => (\r\n              <StyledMenulink key={element?.to} to={element?.to} menuText={element?.label} />\r\n            ))}\r\n          </MenuSectionList>\r\n        </MenuSection>\r\n      )}\r\n\r\n      {supportSection && supportSection?.length > 0 && (\r\n        <MenuSection key=\"MobileSupportSection\">\r\n          <LabelLine>{''}</LabelLine>\r\n          <MenuSectionList>\r\n            {supportSection?.map((element) => (\r\n              <StyledMenulink key={element?.to} isExternal={element.isExternal} to={element?.to} menuText={element?.label} />\r\n            ))}\r\n          </MenuSectionList>\r\n        </MenuSection>\r\n      )}\r\n      {signOut && (\r\n        <div key=\"SignoutButton\" style={{ display: 'flex', margin: 'auto 0 12px 0' }}>\r\n          <Button\r\n            style={{ width: '90%', margin: '0 auto' }}\r\n            variant=\"secondary\"\r\n            onClick={(e) => {\r\n              e.preventDefault();\r\n              signOut(e);\r\n            }}>\r\n            {signOutLabel}\r\n          </Button>\r\n        </div>\r\n      )}\r\n    </Menu>\r\n  );\r\n};\r\n\r\nexport default MobileUserMenu;\r\n"],"file":"MobileUserMenu.js"}

package/dist/GlobalNavigationBar/UserMenu/UserMenu.cjs

@@ -1,168 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var React = _interopRequireWildcard(require("react"));
-
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-
-var _Button = require("../../Button");
-
-var _styles = require("../../styles");
-
-var _Avatar = _interopRequireWildcard(require("../Avatar"));
-
-var _MenuLink = _interopRequireDefault(require("./MenuLink"));
-
-var _types = require("../../types");
-
-var _CommonStyles = require("../mobile/CommonStyles");
-
-var _typography = require("../../styles/typography");
-
-var _zIndexes = require("../../styles/z-indexes");
-
-var _jsxRuntime = require("react/jsx-runtime");
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-var Menu = _styledComponents.default.ul(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: none;\n  min-width: 312px;\n  -webkit-animation: ", " 0.2s ease-in-out;\n  animation: ", " 0.2s ease-in-out;\n  position: absolute;\n  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);\n  border-radius: 4px;\n  border: 1px solid ", ";\n  z-index: ", ";\n\n  .open & {\n    display: block;\n  }\n  \n  .sign-out{\n    width: 90%;\n    box-sizing: border-box;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin: 8px auto 12px auto;\n  }\n"])), _styles.COLORS.white, _CommonStyles.flowDown, _CommonStyles.flowDown, _styles.COLORS.neutral_200, _zIndexes.Z_INDEXES.fixed_menu);
-
-var MenuSection = _styledComponents.default.li(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  padding: 8px 0;\n  position: relative;\n\n  &:not(:first-of-type)::before {\n    content: '';\n    position: absolute;\n    background: ", ";\n    height: 1px;\n    top: 0;\n    left: 16px;\n    right: 16px;\n  }\n\n  .disabled-link {\n    color: #21212150;\n    pointer-events: none;\n    key-events: none;\n  }\n"])), _styles.COLORS.neutral_100);
-
-var MenuSectionList = _styledComponents.default.ul(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  list-style: none;\n  margin: 0;\n  padding: 0;\n\n  ", ";\n"])), _CommonStyles.UserMenuSectionListStyling);
-
-var StyledAvatarContainer = (0, _styledComponents.default)(_Avatar.AvatarContainer)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  margin: 25px 0 0 25px;\n  pointer-events: none;\n"])));
-
-var AvatarAndName = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: row;\n\n  h5 {\n    margin: 28px 0 0 20px;\n    ", "\n  }\n  span {\n    margin: 0 0 0 20px;\n    ", "\n  }\n"])), (0, _typography.HeadlineXXSStyling)(_styles.COLORS.neutral_600), (0, _typography.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600));
-
-var NameAndEmail = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: column;\n"])));
-
-var OrganizationName = _styledComponents.default.span(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  margin-left: 25px;\n  ", "\n"])), (0, _typography.ComponentXSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.neutral_600));
-
-var UserMenu = function UserMenu(_ref) {
-  var firstName = _ref.firstName,
-      lastName = _ref.lastName,
-      email = _ref.email,
-      organizationName = _ref.organizationName,
-      clickMenuAction = _ref.clickMenuAction,
-      accountSection = _ref.accountSection,
-      organizationSection = _ref.organizationSection,
-      supportSection = _ref.supportSection,
-      signOut = _ref.signOut,
-      signOutLabel = _ref.signOutLabel;
-  React.useEffect(function () {
-    function handleKeyPress(e) {
-      if (e.keyCode === 27) {
-        clickMenuAction();
-      }
-    }
-
-    document.addEventListener('keydown', handleKeyPress, false);
-    return function () {
-      document.removeEventListener('keydown', handleKeyPress, false);
-    };
-  }, [clickMenuAction]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Menu, {
-    onClick: clickMenuAction,
-    role: "menu",
-    "aria-labelledby": "UserMenuButton",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(AvatarAndName, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(StyledAvatarContainer, {
-        hidePadding: true,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Avatar.default, {
-          size: 48,
-          firstName: firstName,
-          lastName: lastName,
-          color: _styles.COLORS.primary_500,
-          profileMenuLink: "#TODO"
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(NameAndEmail, {
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("h5", {
-          "data-hj-suppress": true,
-          children: "".concat(firstName, " ").concat(lastName)
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          "data-hj-suppress": true,
-          children: email
-        })]
-      })]
-    }, "AvatarAndNameSection"), accountSection && (accountSection === null || accountSection === void 0 ? void 0 : accountSection.length) > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuSection, {
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuSectionList, {
-        children: accountSection === null || accountSection === void 0 ? void 0 : accountSection.map(function (element) {
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuLink.default, {
-            to: element === null || element === void 0 ? void 0 : element.to,
-            menuText: element === null || element === void 0 ? void 0 : element.label,
-            Icon: element === null || element === void 0 ? void 0 : element.icon,
-            onClick: element === null || element === void 0 ? void 0 : element.onClick
-          }, element === null || element === void 0 ? void 0 : element.to);
-        })
-      })
-    }, "MobileAccountSection"), organizationSection && (organizationSection === null || organizationSection === void 0 ? void 0 : organizationSection.length) > 0 && /*#__PURE__*/(0, _jsxRuntime.jsxs)(MenuSection, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(OrganizationName, {
-        children: organizationName || ''
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuSectionList, {
-        children: organizationSection === null || organizationSection === void 0 ? void 0 : organizationSection.map(function (element) {
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuLink.default, {
-            to: element === null || element === void 0 ? void 0 : element.to,
-            menuText: element === null || element === void 0 ? void 0 : element.label,
-            Icon: element === null || element === void 0 ? void 0 : element.icon,
-            onClick: element === null || element === void 0 ? void 0 : element.onClick
-          }, element === null || element === void 0 ? void 0 : element.to);
-        })
-      })]
-    }, "MobileOrganizationSection"), /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuSection, {
-      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(MenuSectionList, {
-        children: [supportSection === null || supportSection === void 0 ? void 0 : supportSection.map(function (element) {
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuLink.default, {
-            isExternal: element.isExternal,
-            to: element === null || element === void 0 ? void 0 : element.to,
-            menuText: element === null || element === void 0 ? void 0 : element.label,
-            Icon: element === null || element === void 0 ? void 0 : element.icon,
-            onClick: element === null || element === void 0 ? void 0 : element.onClick
-          }, element === null || element === void 0 ? void 0 : element.to);
-        }), signOut && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.Button, {
-          width: "90%",
-          className: "UserMenuLink sign-out",
-          variant: "secondary",
-          size: _types.Size.Large,
-          onClick: function onClick(e) {
-            e.preventDefault();
-            signOut(e);
-          },
-          children: signOutLabel
-        })]
-      })
-    }, "MobileSupportSection")]
-  });
-};
-
-UserMenu.propTypes = {
-  firstName: _propTypes.default.string.isRequired,
-  lastName: _propTypes.default.string.isRequired,
-  email: _propTypes.default.string.isRequired,
-  organizationName: _propTypes.default.string.isRequired,
-  clickMenuAction: _propTypes.default.func.isRequired,
-  accountSection: _propTypes.default.array,
-  organizationSection: _propTypes.default.array,
-  supportSection: _propTypes.default.array,
-  signOut: _propTypes.default.func,
-  signOutLabel: _propTypes.default.string
-};
-var _default = UserMenu;
-exports.default = _default;
-//# sourceMappingURL=UserMenu.cjs.map

package/dist/GlobalNavigationBar/UserMenu/UserMenu.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/UserMenu/UserMenu.tsx"],"names":["Menu","styled","ul","COLORS","white","flowDown","neutral_200","Z_INDEXES","fixed_menu","MenuSection","li","neutral_100","MenuSectionList","UserMenuSectionListStyling","StyledAvatarContainer","AvatarContainer","AvatarAndName","div","neutral_600","ComponentTextStyle","Regular","NameAndEmail","OrganizationName","span","Bold","UserMenu","firstName","lastName","email","organizationName","clickMenuAction","accountSection","organizationSection","supportSection","signOut","signOutLabel","React","useEffect","handleKeyPress","e","keyCode","document","addEventListener","removeEventListener","primary_500","length","map","element","to","label","icon","onClick","isExternal","Size","Large","preventDefault"],"mappings":"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","sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport {Button} from '../../Button';\r\nimport {COLORS, ComponentTextStyle} from '../../styles';\r\nimport Avatar, {AvatarContainer} from '../Avatar';\r\nimport MenuLink from './MenuLink';\r\nimport { UserMenuItem, Size } from '../../types';\r\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\r\nimport {ComponentXSStyling, HeadlineXXSStyling} from '../../styles/typography';\r\nimport {Z_INDEXES} from '../../styles/z-indexes';\r\n\r\nconst Menu = styled.ul`\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0;\r\n  background-color: ${COLORS.white};\r\n  box-sizing: border-box;\r\n  display: none;\r\n  min-width: 312px;\r\n  -webkit-animation: ${flowDown} 0.2s ease-in-out;\r\n  animation: ${flowDown} 0.2s ease-in-out;\r\n  position: absolute;\r\n  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);\r\n  border-radius: 4px;\r\n  border: 1px solid ${COLORS.neutral_200};\r\n  z-index: ${Z_INDEXES.fixed_menu};\r\n\r\n  .open & {\r\n    display: block;\r\n  }\r\n  \r\n  .sign-out{\r\n    width: 90%;\r\n    box-sizing: border-box;\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    margin: 8px auto 12px auto;\r\n  }\r\n`;\r\n\r\nconst MenuSection = styled.li`\r\n  padding: 8px 0;\r\n  position: relative;\r\n\r\n  &:not(:first-of-type)::before {\r\n    content: '';\r\n    position: absolute;\r\n    background: ${COLORS.neutral_100};\r\n    height: 1px;\r\n    top: 0;\r\n    left: 16px;\r\n    right: 16px;\r\n  }\r\n\r\n  .disabled-link {\r\n    color: #21212150;\r\n    pointer-events: none;\r\n    key-events: none;\r\n  }\r\n`;\r\n\r\nconst MenuSectionList = styled.ul`\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0;\r\n\r\n  ${UserMenuSectionListStyling};\r\n`;\r\n\r\nconst StyledAvatarContainer = styled(AvatarContainer)`\r\n  margin: 25px 0 0 25px;\r\n  pointer-events: none;\r\n`;\r\n\r\nconst AvatarAndName = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n\r\n  h5 {\r\n    margin: 28px 0 0 20px;\r\n    ${HeadlineXXSStyling(COLORS.neutral_600)}\r\n  }\r\n  span {\r\n    margin: 0 0 0 20px;\r\n    ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\r\n  }\r\n`;\r\n\r\nconst NameAndEmail = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n`;\r\n\r\nconst OrganizationName = styled.span`\r\n  margin-left: 25px;\r\n  ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\r\n`;\r\n\r\ninterface Props {\r\n  firstName: string;\r\n  lastName: string;\r\n  email: string;\r\n  organizationName: string;\r\n  clickMenuAction: () => void;\r\n  accountSection?: UserMenuItem[];\r\n  organizationSection?: UserMenuItem[];\r\n  supportSection?: UserMenuItem[];\r\n  signOut?: (e: any) => void;\r\n  signOutLabel?: string;\r\n}\r\n\r\nconst UserMenu = ({ firstName, lastName, email, organizationName, clickMenuAction, accountSection, organizationSection, supportSection, signOut, signOutLabel }: Props) => {\r\n  React.useEffect(() => {\r\n    function handleKeyPress(e: any) {\r\n      if (e.keyCode === 27) {\r\n        clickMenuAction();\r\n      }\r\n    }\r\n\r\n    document.addEventListener('keydown', handleKeyPress, false);\r\n    return () => {\r\n      document.removeEventListener('keydown', handleKeyPress, false);\r\n    };\r\n  }, [clickMenuAction]);\r\n\r\n  return (\r\n    <Menu onClick={clickMenuAction} role=\"menu\" aria-labelledby=\"UserMenuButton\">\r\n      <AvatarAndName key=\"AvatarAndNameSection\">\r\n        <StyledAvatarContainer hidePadding={true}>\r\n          <Avatar size={48} firstName={firstName} lastName={lastName} color={COLORS.primary_500} profileMenuLink=\"#TODO\" />\r\n        </StyledAvatarContainer>\r\n        <NameAndEmail>\r\n          <h5 data-hj-suppress>{`${firstName} ${lastName}`}</h5>\r\n          <span data-hj-suppress>{email}</span>\r\n        </NameAndEmail>\r\n      </AvatarAndName>\r\n      {accountSection && accountSection?.length > 0 && (\r\n        <MenuSection key=\"MobileAccountSection\">\r\n          <MenuSectionList>\r\n            {accountSection?.map(element => (\r\n              <MenuLink key={element?.to} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\r\n            ))}\r\n          </MenuSectionList>\r\n        </MenuSection>\r\n      )}\r\n\r\n      {organizationSection && organizationSection?.length > 0 && (\r\n        <MenuSection key=\"MobileOrganizationSection\">\r\n          <OrganizationName>{organizationName || ''}</OrganizationName>\r\n          <MenuSectionList>\r\n            {organizationSection?.map(element => (\r\n              <MenuLink key={element?.to} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\r\n            ))}\r\n          </MenuSectionList>\r\n        </MenuSection>\r\n      )}\r\n\r\n      <MenuSection key=\"MobileSupportSection\">\r\n        <MenuSectionList>\r\n          {supportSection?.map(element => (\r\n            <MenuLink key={element?.to} isExternal={element.isExternal} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\r\n          ))}\r\n          {signOut && (\r\n            <Button\r\n              width=\"90%\"\r\n              className=\"UserMenuLink sign-out\"\r\n              variant=\"secondary\"\r\n              size={Size.Large}\r\n              onClick={e => {\r\n                e.preventDefault();\r\n                signOut(e);\r\n              }}>\r\n              {signOutLabel}\r\n            </Button>\r\n          )}\r\n        </MenuSectionList>\r\n      </MenuSection>\r\n    </Menu>\r\n  );\r\n};\r\n\r\nexport default UserMenu;\r\n"],"file":"UserMenu.cjs"}

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

@@ -1,15 +0,0 @@
-import { UserMenuItem } from '../../types';
-interface Props {
-    firstName: string;
-    lastName: string;
-    email: string;
-    organizationName: string;
-    clickMenuAction: () => void;
-    accountSection?: UserMenuItem[];
-    organizationSection?: UserMenuItem[];
-    supportSection?: UserMenuItem[];
-    signOut?: (e: any) => void;
-    signOutLabel?: string;
-}
-declare const UserMenu: ({ firstName, lastName, email, organizationName, clickMenuAction, accountSection, organizationSection, supportSection, signOut, signOutLabel }: Props) => JSX.Element;
-export default UserMenu;

package/dist/GlobalNavigationBar/UserMenu/UserMenu.js

@@ -1,135 +0,0 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
-import _pt from "prop-types";
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
-
-import * as React from 'react';
-import styled from 'styled-components';
-import { Button } from '../../Button';
-import { COLORS, ComponentTextStyle } from '../../styles';
-import Avatar, { AvatarContainer } from '../Avatar';
-import MenuLink from './MenuLink';
-import { Size } from '../../types';
-import { flowDown, UserMenuSectionListStyling } from '../mobile/CommonStyles';
-import { ComponentXSStyling, HeadlineXXSStyling } from '../../styles/typography';
-import { Z_INDEXES } from '../../styles/z-indexes';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-var Menu = styled.ul(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: none;\n  min-width: 312px;\n  -webkit-animation: ", " 0.2s ease-in-out;\n  animation: ", " 0.2s ease-in-out;\n  position: absolute;\n  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);\n  border-radius: 4px;\n  border: 1px solid ", ";\n  z-index: ", ";\n\n  .open & {\n    display: block;\n  }\n  \n  .sign-out{\n    width: 90%;\n    box-sizing: border-box;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin: 8px auto 12px auto;\n  }\n"])), COLORS.white, flowDown, flowDown, COLORS.neutral_200, Z_INDEXES.fixed_menu);
-var MenuSection = styled.li(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  padding: 8px 0;\n  position: relative;\n\n  &:not(:first-of-type)::before {\n    content: '';\n    position: absolute;\n    background: ", ";\n    height: 1px;\n    top: 0;\n    left: 16px;\n    right: 16px;\n  }\n\n  .disabled-link {\n    color: #21212150;\n    pointer-events: none;\n    key-events: none;\n  }\n"])), COLORS.neutral_100);
-var MenuSectionList = styled.ul(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  list-style: none;\n  margin: 0;\n  padding: 0;\n\n  ", ";\n"])), UserMenuSectionListStyling);
-var StyledAvatarContainer = styled(AvatarContainer)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  margin: 25px 0 0 25px;\n  pointer-events: none;\n"])));
-var AvatarAndName = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n\n  h5 {\n    margin: 28px 0 0 20px;\n    ", "\n  }\n  span {\n    margin: 0 0 0 20px;\n    ", "\n  }\n"])), HeadlineXXSStyling(COLORS.neutral_600), ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600));
-var NameAndEmail = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n"])));
-var OrganizationName = styled.span(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  margin-left: 25px;\n  ", "\n"])), ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600));
-
-var UserMenu = function UserMenu(_ref) {
-  var firstName = _ref.firstName,
-      lastName = _ref.lastName,
-      email = _ref.email,
-      organizationName = _ref.organizationName,
-      clickMenuAction = _ref.clickMenuAction,
-      accountSection = _ref.accountSection,
-      organizationSection = _ref.organizationSection,
-      supportSection = _ref.supportSection,
-      signOut = _ref.signOut,
-      signOutLabel = _ref.signOutLabel;
-  React.useEffect(function () {
-    function handleKeyPress(e) {
-      if (e.keyCode === 27) {
-        clickMenuAction();
-      }
-    }
-
-    document.addEventListener('keydown', handleKeyPress, false);
-    return function () {
-      document.removeEventListener('keydown', handleKeyPress, false);
-    };
-  }, [clickMenuAction]);
-  return /*#__PURE__*/_jsxs(Menu, {
-    onClick: clickMenuAction,
-    role: "menu",
-    "aria-labelledby": "UserMenuButton",
-    children: [/*#__PURE__*/_jsxs(AvatarAndName, {
-      children: [/*#__PURE__*/_jsx(StyledAvatarContainer, {
-        hidePadding: true,
-        children: /*#__PURE__*/_jsx(Avatar, {
-          size: 48,
-          firstName: firstName,
-          lastName: lastName,
-          color: COLORS.primary_500,
-          profileMenuLink: "#TODO"
-        })
-      }), /*#__PURE__*/_jsxs(NameAndEmail, {
-        children: [/*#__PURE__*/_jsx("h5", {
-          "data-hj-suppress": true,
-          children: "".concat(firstName, " ").concat(lastName)
-        }), /*#__PURE__*/_jsx("span", {
-          "data-hj-suppress": true,
-          children: email
-        })]
-      })]
-    }, "AvatarAndNameSection"), accountSection && (accountSection === null || accountSection === void 0 ? void 0 : accountSection.length) > 0 && /*#__PURE__*/_jsx(MenuSection, {
-      children: /*#__PURE__*/_jsx(MenuSectionList, {
-        children: accountSection === null || accountSection === void 0 ? void 0 : accountSection.map(function (element) {
-          return /*#__PURE__*/_jsx(MenuLink, {
-            to: element === null || element === void 0 ? void 0 : element.to,
-            menuText: element === null || element === void 0 ? void 0 : element.label,
-            Icon: element === null || element === void 0 ? void 0 : element.icon,
-            onClick: element === null || element === void 0 ? void 0 : element.onClick
-          }, element === null || element === void 0 ? void 0 : element.to);
-        })
-      })
-    }, "MobileAccountSection"), organizationSection && (organizationSection === null || organizationSection === void 0 ? void 0 : organizationSection.length) > 0 && /*#__PURE__*/_jsxs(MenuSection, {
-      children: [/*#__PURE__*/_jsx(OrganizationName, {
-        children: organizationName || ''
-      }), /*#__PURE__*/_jsx(MenuSectionList, {
-        children: organizationSection === null || organizationSection === void 0 ? void 0 : organizationSection.map(function (element) {
-          return /*#__PURE__*/_jsx(MenuLink, {
-            to: element === null || element === void 0 ? void 0 : element.to,
-            menuText: element === null || element === void 0 ? void 0 : element.label,
-            Icon: element === null || element === void 0 ? void 0 : element.icon,
-            onClick: element === null || element === void 0 ? void 0 : element.onClick
-          }, element === null || element === void 0 ? void 0 : element.to);
-        })
-      })]
-    }, "MobileOrganizationSection"), /*#__PURE__*/_jsx(MenuSection, {
-      children: /*#__PURE__*/_jsxs(MenuSectionList, {
-        children: [supportSection === null || supportSection === void 0 ? void 0 : supportSection.map(function (element) {
-          return /*#__PURE__*/_jsx(MenuLink, {
-            isExternal: element.isExternal,
-            to: element === null || element === void 0 ? void 0 : element.to,
-            menuText: element === null || element === void 0 ? void 0 : element.label,
-            Icon: element === null || element === void 0 ? void 0 : element.icon,
-            onClick: element === null || element === void 0 ? void 0 : element.onClick
-          }, element === null || element === void 0 ? void 0 : element.to);
-        }), signOut && /*#__PURE__*/_jsx(Button, {
-          width: "90%",
-          className: "UserMenuLink sign-out",
-          variant: "secondary",
-          size: Size.Large,
-          onClick: function onClick(e) {
-            e.preventDefault();
-            signOut(e);
-          },
-          children: signOutLabel
-        })]
-      })
-    }, "MobileSupportSection")]
-  });
-};
-
-UserMenu.propTypes = {
-  firstName: _pt.string.isRequired,
-  lastName: _pt.string.isRequired,
-  email: _pt.string.isRequired,
-  organizationName: _pt.string.isRequired,
-  clickMenuAction: _pt.func.isRequired,
-  accountSection: _pt.array,
-  organizationSection: _pt.array,
-  supportSection: _pt.array,
-  signOut: _pt.func,
-  signOutLabel: _pt.string
-};
-export default UserMenu;
-//# sourceMappingURL=UserMenu.js.map

package/dist/GlobalNavigationBar/UserMenu/UserMenu.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/UserMenu/UserMenu.tsx"],"names":["React","styled","Button","COLORS","ComponentTextStyle","Avatar","AvatarContainer","MenuLink","Size","flowDown","UserMenuSectionListStyling","ComponentXSStyling","HeadlineXXSStyling","Z_INDEXES","Menu","ul","white","neutral_200","fixed_menu","MenuSection","li","neutral_100","MenuSectionList","StyledAvatarContainer","AvatarAndName","div","neutral_600","Regular","NameAndEmail","OrganizationName","span","Bold","UserMenu","firstName","lastName","email","organizationName","clickMenuAction","accountSection","organizationSection","supportSection","signOut","signOutLabel","useEffect","handleKeyPress","e","keyCode","document","addEventListener","removeEventListener","primary_500","length","map","element","to","label","icon","onClick","isExternal","Large","preventDefault"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,MAAR,QAAqB,cAArB;AACA,SAAQC,MAAR,EAAgBC,kBAAhB,QAAyC,cAAzC;AACA,OAAOC,MAAP,IAAgBC,eAAhB,QAAsC,WAAtC;AACA,OAAOC,QAAP,MAAqB,YAArB;AACA,SAAuBC,IAAvB,QAAmC,aAAnC;AACA,SAAQC,QAAR,EAAkBC,0BAAlB,QAAmD,wBAAnD;AACA,SAAQC,kBAAR,EAA4BC,kBAA5B,QAAqD,yBAArD;AACA,SAAQC,SAAR,QAAwB,wBAAxB;;;AAEA,IAAMC,IAAI,GAAGb,MAAM,CAACc,EAAV,8oBAIYZ,MAAM,CAACa,KAJnB,EAQaP,QARb,EASKA,QATL,EAaYN,MAAM,CAACc,WAbnB,EAcGJ,SAAS,CAACK,UAdb,CAAV;AA8BA,IAAMC,WAAW,GAAGlB,MAAM,CAACmB,EAAV,sYAOCjB,MAAM,CAACkB,WAPR,CAAjB;AAqBA,IAAMC,eAAe,GAAGrB,MAAM,CAACc,EAAV,uIAKjBL,0BALiB,CAArB;AAQA,IAAMa,qBAAqB,GAAGtB,MAAM,CAACK,eAAD,CAAT,4HAA3B;AAKA,IAAMkB,aAAa,GAAGvB,MAAM,CAACwB,GAAV,2NAMbb,kBAAkB,CAACT,MAAM,CAACuB,WAAR,CANL,EAUbf,kBAAkB,CAACP,kBAAkB,CAACuB,OAApB,EAA6BxB,MAAM,CAACuB,WAApC,CAVL,CAAnB;AAcA,IAAME,YAAY,GAAG3B,MAAM,CAACwB,GAAV,sHAAlB;AAKA,IAAMI,gBAAgB,GAAG5B,MAAM,CAAC6B,IAAV,wGAElBnB,kBAAkB,CAACP,kBAAkB,CAAC2B,IAApB,EAA0B5B,MAAM,CAACuB,WAAjC,CAFA,CAAtB;;AAkBA,IAAMM,QAAQ,GAAG,SAAXA,QAAW,OAA0J;AAAA,MAAvJC,SAAuJ,QAAvJA,SAAuJ;AAAA,MAA5IC,QAA4I,QAA5IA,QAA4I;AAAA,MAAlIC,KAAkI,QAAlIA,KAAkI;AAAA,MAA3HC,gBAA2H,QAA3HA,gBAA2H;AAAA,MAAzGC,eAAyG,QAAzGA,eAAyG;AAAA,MAAxFC,cAAwF,QAAxFA,cAAwF;AAAA,MAAxEC,mBAAwE,QAAxEA,mBAAwE;AAAA,MAAnDC,cAAmD,QAAnDA,cAAmD;AAAA,MAAnCC,OAAmC,QAAnCA,OAAmC;AAAA,MAA1BC,YAA0B,QAA1BA,YAA0B;AACzK1C,EAAAA,KAAK,CAAC2C,SAAN,CAAgB,YAAM;AACpB,aAASC,cAAT,CAAwBC,CAAxB,EAAgC;AAC9B,UAAIA,CAAC,CAACC,OAAF,KAAc,EAAlB,EAAsB;AACpBT,QAAAA,eAAe;AAChB;AACF;;AAEDU,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,SAA1B,EAAqCJ,cAArC,EAAqD,KAArD;AACA,WAAO,YAAM;AACXG,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,SAA7B,EAAwCL,cAAxC,EAAwD,KAAxD;AACD,KAFD;AAGD,GAXD,EAWG,CAACP,eAAD,CAXH;AAaA,sBACE,MAAC,IAAD;AAAM,IAAA,OAAO,EAAEA,eAAf;AAAgC,IAAA,IAAI,EAAC,MAArC;AAA4C,uBAAgB,gBAA5D;AAAA,4BACE,MAAC,aAAD;AAAA,8BACE,KAAC,qBAAD;AAAuB,QAAA,WAAW,EAAE,IAApC;AAAA,+BACE,KAAC,MAAD;AAAQ,UAAA,IAAI,EAAE,EAAd;AAAkB,UAAA,SAAS,EAAEJ,SAA7B;AAAwC,UAAA,QAAQ,EAAEC,QAAlD;AAA4D,UAAA,KAAK,EAAE/B,MAAM,CAAC+C,WAA1E;AAAuF,UAAA,eAAe,EAAC;AAAvG;AADF,QADF,eAIE,MAAC,YAAD;AAAA,gCACE;AAAI,kCAAJ;AAAA,8BAAyBjB,SAAzB,cAAsCC,QAAtC;AAAA,UADF,eAEE;AAAM,kCAAN;AAAA,oBAAwBC;AAAxB,UAFF;AAAA,QAJF;AAAA,OAAmB,sBAAnB,CADF,EAUGG,cAAc,IAAI,CAAAA,cAAc,SAAd,IAAAA,cAAc,WAAd,YAAAA,cAAc,CAAEa,MAAhB,IAAyB,CAA3C,iBACC,KAAC,WAAD;AAAA,6BACE,KAAC,eAAD;AAAA,kBACGb,cADH,aACGA,cADH,uBACGA,cAAc,CAAEc,GAAhB,CAAoB,UAAAC,OAAO;AAAA,8BAC1B,KAAC,QAAD;AAA4B,YAAA,EAAE,EAAEA,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEC,EAAzC;AAA6C,YAAA,QAAQ,EAAED,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEE,KAAhE;AAAuE,YAAA,IAAI,EAAEF,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEG,IAAtF;AAA4F,YAAA,OAAO,EAAEH,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEI;AAA9G,aAAeJ,OAAf,aAAeA,OAAf,uBAAeA,OAAO,CAAEC,EAAxB,CAD0B;AAAA,SAA3B;AADH;AADF,OAAiB,sBAAjB,CAXJ,EAoBGf,mBAAmB,IAAI,CAAAA,mBAAmB,SAAnB,IAAAA,mBAAmB,WAAnB,YAAAA,mBAAmB,CAAEY,MAArB,IAA8B,CAArD,iBACC,MAAC,WAAD;AAAA,8BACE,KAAC,gBAAD;AAAA,kBAAmBf,gBAAgB,IAAI;AAAvC,QADF,eAEE,KAAC,eAAD;AAAA,kBACGG,mBADH,aACGA,mBADH,uBACGA,mBAAmB,CAAEa,GAArB,CAAyB,UAAAC,OAAO;AAAA,8BAC/B,KAAC,QAAD;AAA4B,YAAA,EAAE,EAAEA,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEC,EAAzC;AAA6C,YAAA,QAAQ,EAAED,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEE,KAAhE;AAAuE,YAAA,IAAI,EAAEF,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEG,IAAtF;AAA4F,YAAA,OAAO,EAAEH,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEI;AAA9G,aAAeJ,OAAf,aAAeA,OAAf,uBAAeA,OAAO,CAAEC,EAAxB,CAD+B;AAAA,SAAhC;AADH,QAFF;AAAA,OAAiB,2BAAjB,CArBJ,eA+BE,KAAC,WAAD;AAAA,6BACE,MAAC,eAAD;AAAA,mBACGd,cADH,aACGA,cADH,uBACGA,cAAc,CAAEY,GAAhB,CAAoB,UAAAC,OAAO;AAAA,8BAC1B,KAAC,QAAD;AAA4B,YAAA,UAAU,EAAEA,OAAO,CAACK,UAAhD;AAA4D,YAAA,EAAE,EAAEL,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEC,EAAzE;AAA6E,YAAA,QAAQ,EAAED,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEE,KAAhG;AAAuG,YAAA,IAAI,EAAEF,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEG,IAAtH;AAA4H,YAAA,OAAO,EAAEH,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEI;AAA9I,aAAeJ,OAAf,aAAeA,OAAf,uBAAeA,OAAO,CAAEC,EAAxB,CAD0B;AAAA,SAA3B,CADH,EAIGb,OAAO,iBACN,KAAC,MAAD;AACE,UAAA,KAAK,EAAC,KADR;AAEE,UAAA,SAAS,EAAC,uBAFZ;AAGE,UAAA,OAAO,EAAC,WAHV;AAIE,UAAA,IAAI,EAAEjC,IAAI,CAACmD,KAJb;AAKE,UAAA,OAAO,EAAE,iBAAAd,CAAC,EAAI;AACZA,YAAAA,CAAC,CAACe,cAAF;AACAnB,YAAAA,OAAO,CAACI,CAAD,CAAP;AACD,WARH;AAAA,oBASGH;AATH,UALJ;AAAA;AADF,OAAiB,sBAAjB,CA/BF;AAAA,IADF;AAsDD,CApED;;;AAZET,EAAAA,S;AACAC,EAAAA,Q;AACAC,EAAAA,K;AACAC,EAAAA,gB;AACAC,EAAAA,e;AACAC,EAAAA,c;AACAC,EAAAA,mB;AACAC,EAAAA,c;AACAC,EAAAA,O;AACAC,EAAAA,Y;;AAyEF,eAAeV,QAAf","sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport {Button} from '../../Button';\r\nimport {COLORS, ComponentTextStyle} from '../../styles';\r\nimport Avatar, {AvatarContainer} from '../Avatar';\r\nimport MenuLink from './MenuLink';\r\nimport { UserMenuItem, Size } from '../../types';\r\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\r\nimport {ComponentXSStyling, HeadlineXXSStyling} from '../../styles/typography';\r\nimport {Z_INDEXES} from '../../styles/z-indexes';\r\n\r\nconst Menu = styled.ul`\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0;\r\n  background-color: ${COLORS.white};\r\n  box-sizing: border-box;\r\n  display: none;\r\n  min-width: 312px;\r\n  -webkit-animation: ${flowDown} 0.2s ease-in-out;\r\n  animation: ${flowDown} 0.2s ease-in-out;\r\n  position: absolute;\r\n  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);\r\n  border-radius: 4px;\r\n  border: 1px solid ${COLORS.neutral_200};\r\n  z-index: ${Z_INDEXES.fixed_menu};\r\n\r\n  .open & {\r\n    display: block;\r\n  }\r\n  \r\n  .sign-out{\r\n    width: 90%;\r\n    box-sizing: border-box;\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    margin: 8px auto 12px auto;\r\n  }\r\n`;\r\n\r\nconst MenuSection = styled.li`\r\n  padding: 8px 0;\r\n  position: relative;\r\n\r\n  &:not(:first-of-type)::before {\r\n    content: '';\r\n    position: absolute;\r\n    background: ${COLORS.neutral_100};\r\n    height: 1px;\r\n    top: 0;\r\n    left: 16px;\r\n    right: 16px;\r\n  }\r\n\r\n  .disabled-link {\r\n    color: #21212150;\r\n    pointer-events: none;\r\n    key-events: none;\r\n  }\r\n`;\r\n\r\nconst MenuSectionList = styled.ul`\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0;\r\n\r\n  ${UserMenuSectionListStyling};\r\n`;\r\n\r\nconst StyledAvatarContainer = styled(AvatarContainer)`\r\n  margin: 25px 0 0 25px;\r\n  pointer-events: none;\r\n`;\r\n\r\nconst AvatarAndName = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n\r\n  h5 {\r\n    margin: 28px 0 0 20px;\r\n    ${HeadlineXXSStyling(COLORS.neutral_600)}\r\n  }\r\n  span {\r\n    margin: 0 0 0 20px;\r\n    ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\r\n  }\r\n`;\r\n\r\nconst NameAndEmail = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n`;\r\n\r\nconst OrganizationName = styled.span`\r\n  margin-left: 25px;\r\n  ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\r\n`;\r\n\r\ninterface Props {\r\n  firstName: string;\r\n  lastName: string;\r\n  email: string;\r\n  organizationName: string;\r\n  clickMenuAction: () => void;\r\n  accountSection?: UserMenuItem[];\r\n  organizationSection?: UserMenuItem[];\r\n  supportSection?: UserMenuItem[];\r\n  signOut?: (e: any) => void;\r\n  signOutLabel?: string;\r\n}\r\n\r\nconst UserMenu = ({ firstName, lastName, email, organizationName, clickMenuAction, accountSection, organizationSection, supportSection, signOut, signOutLabel }: Props) => {\r\n  React.useEffect(() => {\r\n    function handleKeyPress(e: any) {\r\n      if (e.keyCode === 27) {\r\n        clickMenuAction();\r\n      }\r\n    }\r\n\r\n    document.addEventListener('keydown', handleKeyPress, false);\r\n    return () => {\r\n      document.removeEventListener('keydown', handleKeyPress, false);\r\n    };\r\n  }, [clickMenuAction]);\r\n\r\n  return (\r\n    <Menu onClick={clickMenuAction} role=\"menu\" aria-labelledby=\"UserMenuButton\">\r\n      <AvatarAndName key=\"AvatarAndNameSection\">\r\n        <StyledAvatarContainer hidePadding={true}>\r\n          <Avatar size={48} firstName={firstName} lastName={lastName} color={COLORS.primary_500} profileMenuLink=\"#TODO\" />\r\n        </StyledAvatarContainer>\r\n        <NameAndEmail>\r\n          <h5 data-hj-suppress>{`${firstName} ${lastName}`}</h5>\r\n          <span data-hj-suppress>{email}</span>\r\n        </NameAndEmail>\r\n      </AvatarAndName>\r\n      {accountSection && accountSection?.length > 0 && (\r\n        <MenuSection key=\"MobileAccountSection\">\r\n          <MenuSectionList>\r\n            {accountSection?.map(element => (\r\n              <MenuLink key={element?.to} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\r\n            ))}\r\n          </MenuSectionList>\r\n        </MenuSection>\r\n      )}\r\n\r\n      {organizationSection && organizationSection?.length > 0 && (\r\n        <MenuSection key=\"MobileOrganizationSection\">\r\n          <OrganizationName>{organizationName || ''}</OrganizationName>\r\n          <MenuSectionList>\r\n            {organizationSection?.map(element => (\r\n              <MenuLink key={element?.to} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\r\n            ))}\r\n          </MenuSectionList>\r\n        </MenuSection>\r\n      )}\r\n\r\n      <MenuSection key=\"MobileSupportSection\">\r\n        <MenuSectionList>\r\n          {supportSection?.map(element => (\r\n            <MenuLink key={element?.to} isExternal={element.isExternal} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\r\n          ))}\r\n          {signOut && (\r\n            <Button\r\n              width=\"90%\"\r\n              className=\"UserMenuLink sign-out\"\r\n              variant=\"secondary\"\r\n              size={Size.Large}\r\n              onClick={e => {\r\n                e.preventDefault();\r\n                signOut(e);\r\n              }}>\r\n              {signOutLabel}\r\n            </Button>\r\n          )}\r\n        </MenuSectionList>\r\n      </MenuSection>\r\n    </Menu>\r\n  );\r\n};\r\n\r\nexport default UserMenu;\r\n"],"file":"UserMenu.js"}