@laerdal/life-react-components 3.0.1-dev.9 → 3.1.0

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":"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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.js"}

package/dist/GlobalNavigationBar/mobile/ExitMenuButton.cjs

@@ -1,49 +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 _SystemIcons = require("../../icons/systemicons/SystemIcons");
-
-var _CommonStyles = require("./CommonStyles");
-
-var _jsxRuntime = require("react/jsx-runtime");
-
-var _templateObject;
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-var StyledButton = (0, _styledComponents.default)(_CommonStyles.Button)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  padding: 0;\n  height: 36px;\n"])));
-
-var ExitMenuButton = function ExitMenuButton(_ref) {
-  var closeMenu = _ref.closeMenu;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledButton, {
-    onClick: closeMenu,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.Close, {
-      size: "24px"
-    })
-  });
-};
-
-ExitMenuButton.propTypes = {
-  closeMenu: _propTypes.default.func.isRequired
-};
-var _default = ExitMenuButton;
-exports.default = _default;
-//# sourceMappingURL=ExitMenuButton.cjs.map

package/dist/GlobalNavigationBar/mobile/ExitMenuButton.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/ExitMenuButton.tsx"],"names":["StyledButton","Button","ExitMenuButton","closeMenu"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,IAAMA,YAAY,GAAG,+BAAOC,oBAAP,CAAH,qHAAlB;;AASA,IAAMC,cAAc,GAAG,SAAjBA,cAAiB,OAAqD;AAAA,MAAlDC,SAAkD,QAAlDA,SAAkD;AAC1E,sBACE,qBAAC,YAAD;AAAc,IAAA,OAAO,EAAEA,SAAvB;AAAA,2BACE,qBAAC,kBAAD;AAAO,MAAA,IAAI,EAAC;AAAZ;AADF,IADF;AAKD,CAND;;;AAHEA,EAAAA,S;;eAWaD,c","sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { Close } from '../../icons/systemicons/SystemIcons';\r\nimport { Button } from './CommonStyles';\r\n\r\nconst StyledButton = styled(Button)`\r\n  padding: 0;\r\n  height: 36px;\r\n`;\r\n\r\ntype Props = {\r\n  closeMenu: () => void;\r\n};\r\n\r\nconst ExitMenuButton = ({ closeMenu }: Props): React.ReactElement<Props> => {\r\n  return (\r\n    <StyledButton onClick={closeMenu}>\r\n      <Close size=\"24px\" />\r\n    </StyledButton>\r\n  );\r\n};\r\n\r\nexport default ExitMenuButton;\r\n"],"file":"ExitMenuButton.cjs"}

package/dist/GlobalNavigationBar/mobile/ExitMenuButton.d.ts

@@ -1,6 +0,0 @@
-import * as React from 'react';
-declare type Props = {
-    closeMenu: () => void;
-};
-declare const ExitMenuButton: ({ closeMenu }: Props) => React.ReactElement<Props>;
-export default ExitMenuButton;

package/dist/GlobalNavigationBar/mobile/ExitMenuButton.js

@@ -1,27 +0,0 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
-import _pt from "prop-types";
-
-var _templateObject;
-
-import * as React from 'react';
-import styled from 'styled-components';
-import { Close } from '../../icons/systemicons/SystemIcons';
-import { Button } from './CommonStyles';
-import { jsx as _jsx } from "react/jsx-runtime";
-var StyledButton = styled(Button)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  padding: 0;\n  height: 36px;\n"])));
-
-var ExitMenuButton = function ExitMenuButton(_ref) {
-  var closeMenu = _ref.closeMenu;
-  return /*#__PURE__*/_jsx(StyledButton, {
-    onClick: closeMenu,
-    children: /*#__PURE__*/_jsx(Close, {
-      size: "24px"
-    })
-  });
-};
-
-ExitMenuButton.propTypes = {
-  closeMenu: _pt.func.isRequired
-};
-export default ExitMenuButton;
-//# sourceMappingURL=ExitMenuButton.js.map

package/dist/GlobalNavigationBar/mobile/ExitMenuButton.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/ExitMenuButton.tsx"],"names":["React","styled","Close","Button","StyledButton","ExitMenuButton","closeMenu"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAASC,KAAT,QAAsB,qCAAtB;AACA,SAASC,MAAT,QAAuB,gBAAvB;;AAEA,IAAMC,YAAY,GAAGH,MAAM,CAACE,MAAD,CAAT,uGAAlB;;AASA,IAAME,cAAc,GAAG,SAAjBA,cAAiB,OAAqD;AAAA,MAAlDC,SAAkD,QAAlDA,SAAkD;AAC1E,sBACE,KAAC,YAAD;AAAc,IAAA,OAAO,EAAEA,SAAvB;AAAA,2BACE,KAAC,KAAD;AAAO,MAAA,IAAI,EAAC;AAAZ;AADF,IADF;AAKD,CAND;;;AAHEA,EAAAA,S;;AAWF,eAAeD,cAAf","sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { Close } from '../../icons/systemicons/SystemIcons';\r\nimport { Button } from './CommonStyles';\r\n\r\nconst StyledButton = styled(Button)`\r\n  padding: 0;\r\n  height: 36px;\r\n`;\r\n\r\ntype Props = {\r\n  closeMenu: () => void;\r\n};\r\n\r\nconst ExitMenuButton = ({ closeMenu }: Props): React.ReactElement<Props> => {\r\n  return (\r\n    <StyledButton onClick={closeMenu}>\r\n      <Close size=\"24px\" />\r\n    </StyledButton>\r\n  );\r\n};\r\n\r\nexport default ExitMenuButton;\r\n"],"file":"ExitMenuButton.js"}

package/dist/GlobalNavigationBar/mobile/MobileActionMenu.cjs

@@ -1,91 +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 _Actions = _interopRequireDefault(require("../Actions"));
-
-var _ExitMenuButton = _interopRequireDefault(require("./ExitMenuButton"));
-
-var _CommonStyles = require("./CommonStyles");
-
-var _jsxRuntime = require("react/jsx-runtime");
-
-var _templateObject;
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-var FirstRowLayout = (0, _styledComponents.default)(_CommonStyles.RowLayout)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  margin-top: 5px;\n"])));
-
-var MobileActionMenu = function MobileActionMenu(_ref) {
-  var clickMenuAction = _ref.clickMenuAction,
-      navigationOptions = _ref.navigationOptions,
-      firstName = _ref.firstName,
-      lastName = _ref.lastName,
-      actionList = _ref.actionList;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_CommonStyles.Menu, {
-    role: "menu",
-    "aria-labelledby": "UserMenuButton",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(FirstRowLayout, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Actions.default, {
-          actions: actionList,
-          firstName: firstName,
-          lastName: lastName,
-          isInMobileMenu: true,
-          useUserMenu: false,
-          setShowUserMenu: function setShowUserMenu() {}
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_CommonStyles.Right, {
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ExitMenuButton.default, {
-          closeMenu: clickMenuAction
-        })
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_CommonStyles.MenuSection, {
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CommonStyles.MenuSectionList, {
-        children: navigationOptions === null || navigationOptions === void 0 ? void 0 : navigationOptions.map(function (no) {
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
-            onClick: function onClick() {
-              return clickMenuAction();
-            },
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CommonStyles.MenuLink, {
-              to: no.to,
-              role: "menuitem",
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-                children: no.label
-              })
-            })
-          }, no.label);
-        })
-      })
-    })]
-  });
-};
-
-MobileActionMenu.propTypes = {
-  name: _propTypes.default.string.isRequired,
-  mainNavLabel: _propTypes.default.string,
-  navigationOptions: _propTypes.default.array,
-  clickMenuAction: _propTypes.default.func.isRequired,
-  firstName: _propTypes.default.string,
-  lastName: _propTypes.default.string
-};
-var _default = MobileActionMenu;
-exports.default = _default;
-//# sourceMappingURL=MobileActionMenu.cjs.map

package/dist/GlobalNavigationBar/mobile/MobileActionMenu.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileActionMenu.tsx"],"names":["FirstRowLayout","RowLayout","MobileActionMenu","clickMenuAction","navigationOptions","firstName","lastName","actionList","map","no","to","label","name","mainNavLabel"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;;;;;;;AAEA,IAAMA,cAAc,GAAG,+BAAOC,uBAAP,CAAH,yGAApB;;AAeA,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,OAAoF;AAAA,MAAjFC,eAAiF,QAAjFA,eAAiF;AAAA,MAAhEC,iBAAgE,QAAhEA,iBAAgE;AAAA,MAA7CC,SAA6C,QAA7CA,SAA6C;AAAA,MAAlCC,QAAkC,QAAlCA,QAAkC;AAAA,MAAxBC,UAAwB,QAAxBA,UAAwB;AAC3G,sBACE,sBAAC,kBAAD;AAAM,IAAA,IAAI,EAAC,MAAX;AAAkB,uBAAgB,gBAAlC;AAAA,4BACE,sBAAC,cAAD;AAAA,8BACE;AAAA,+BACE,qBAAC,gBAAD;AAAS,UAAA,OAAO,EAAEA,UAAlB;AAA8B,UAAA,SAAS,EAAEF,SAAzC;AAAoD,UAAA,QAAQ,EAAEC,QAA9D;AAAwE,UAAA,cAAc,EAAE,IAAxF;AAA8F,UAAA,WAAW,EAAE,KAA3G;AAAkH,UAAA,eAAe,EAAE,2BAAM,CAAE;AAA3I;AADF,QADF,eAIE,qBAAC,mBAAD;AAAA,+BACE,qBAAC,uBAAD;AAAgB,UAAA,SAAS,EAAEH;AAA3B;AADF,QAJF;AAAA,MADF,eASE,qBAAC,yBAAD;AAAA,6BACE,qBAAC,6BAAD;AAAA,kBACGC,iBADH,aACGA,iBADH,uBACGA,iBAAiB,CAAEI,GAAnB,CAAuB,UAAAC,EAAE;AAAA,8BACxB;AAAmB,YAAA,OAAO,EAAE;AAAA,qBAAMN,eAAe,EAArB;AAAA,aAA5B;AAAA,mCACE,qBAAC,sBAAD;AAAU,cAAA,EAAE,EAAEM,EAAE,CAACC,EAAjB;AAAqB,cAAA,IAAI,EAAC,UAA1B;AAAA,qCACE;AAAA,0BAAMD,EAAE,CAACE;AAAT;AADF;AADF,aAASF,EAAE,CAACE,KAAZ,CADwB;AAAA,SAAzB;AADH;AADF,MATF;AAAA,IADF;AAuBD,CAxBD;;;AAVEC,EAAAA,I;AACAC,EAAAA,Y;AACAT,EAAAA,iB;AAEAD,EAAAA,e;AACAE,EAAAA,S;AACAC,EAAAA,Q;;eA8BaJ,gB","sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { NavOption, ActionOptions } from '../../types';\r\nimport Actions from '../Actions';\r\nimport ExitMenuButton from './ExitMenuButton';\r\nimport { Menu, Right, MenuSection, MenuSectionList, MenuLink, RowLayout } from './CommonStyles';\r\n\r\nconst FirstRowLayout = styled(RowLayout)`\r\n  margin-top: 5px;\r\n`;\r\n\r\ntype Props = {\r\n  name: string;\r\n  mainNavLabel?: string;\r\n  navigationOptions?: NavOption[];\r\n  actions?: ActionOptions;\r\n  clickMenuAction: () => void;\r\n  firstName?: string;\r\n  lastName?: string;\r\n  actionList?: ActionOptions;\r\n};\r\n\r\nconst MobileActionMenu = ({ clickMenuAction, navigationOptions, firstName, lastName, actionList }: Props) => {\r\n  return (\r\n    <Menu role=\"menu\" aria-labelledby=\"UserMenuButton\">\r\n      <FirstRowLayout>\r\n        <>\r\n          <Actions actions={actionList} firstName={firstName} lastName={lastName} isInMobileMenu={true} useUserMenu={false} setShowUserMenu={() => {}} />\r\n        </>\r\n        <Right>\r\n          <ExitMenuButton closeMenu={clickMenuAction} />\r\n        </Right>\r\n      </FirstRowLayout>\r\n      <MenuSection>\r\n        <MenuSectionList>\r\n          {navigationOptions?.map(no => (\r\n            <li key={no.label} onClick={() => clickMenuAction()}>\r\n              <MenuLink to={no.to} role=\"menuitem\">\r\n                <div>{no.label}</div>\r\n              </MenuLink>\r\n            </li>\r\n          ))}\r\n        </MenuSectionList>\r\n      </MenuSection>\r\n    </Menu>\r\n  );\r\n};\r\n\r\nexport default MobileActionMenu;\r\n"],"file":"MobileActionMenu.cjs"}

package/dist/GlobalNavigationBar/mobile/MobileActionMenu.d.ts

@@ -1,13 +0,0 @@
-import { NavOption, ActionOptions } from '../../types';
-declare type Props = {
-    name: string;
-    mainNavLabel?: string;
-    navigationOptions?: NavOption[];
-    actions?: ActionOptions;
-    clickMenuAction: () => void;
-    firstName?: string;
-    lastName?: string;
-    actionList?: ActionOptions;
-};
-declare const MobileActionMenu: ({ clickMenuAction, navigationOptions, firstName, lastName, actionList }: Props) => JSX.Element;
-export default MobileActionMenu;

package/dist/GlobalNavigationBar/mobile/MobileActionMenu.js

@@ -1,70 +0,0 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
-import _pt from "prop-types";
-
-var _templateObject;
-
-import * as React from 'react';
-import styled from 'styled-components';
-import Actions from '../Actions';
-import ExitMenuButton from './ExitMenuButton';
-import { Menu, Right, MenuSection, MenuSectionList, MenuLink, RowLayout } from './CommonStyles';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-var FirstRowLayout = styled(RowLayout)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  margin-top: 5px;\n"])));
-
-var MobileActionMenu = function MobileActionMenu(_ref) {
-  var clickMenuAction = _ref.clickMenuAction,
-      navigationOptions = _ref.navigationOptions,
-      firstName = _ref.firstName,
-      lastName = _ref.lastName,
-      actionList = _ref.actionList;
-  return /*#__PURE__*/_jsxs(Menu, {
-    role: "menu",
-    "aria-labelledby": "UserMenuButton",
-    children: [/*#__PURE__*/_jsxs(FirstRowLayout, {
-      children: [/*#__PURE__*/_jsx(_Fragment, {
-        children: /*#__PURE__*/_jsx(Actions, {
-          actions: actionList,
-          firstName: firstName,
-          lastName: lastName,
-          isInMobileMenu: true,
-          useUserMenu: false,
-          setShowUserMenu: function setShowUserMenu() {}
-        })
-      }), /*#__PURE__*/_jsx(Right, {
-        children: /*#__PURE__*/_jsx(ExitMenuButton, {
-          closeMenu: clickMenuAction
-        })
-      })]
-    }), /*#__PURE__*/_jsx(MenuSection, {
-      children: /*#__PURE__*/_jsx(MenuSectionList, {
-        children: navigationOptions === null || navigationOptions === void 0 ? void 0 : navigationOptions.map(function (no) {
-          return /*#__PURE__*/_jsx("li", {
-            onClick: function onClick() {
-              return clickMenuAction();
-            },
-            children: /*#__PURE__*/_jsx(MenuLink, {
-              to: no.to,
-              role: "menuitem",
-              children: /*#__PURE__*/_jsx("div", {
-                children: no.label
-              })
-            })
-          }, no.label);
-        })
-      })
-    })]
-  });
-};
-
-MobileActionMenu.propTypes = {
-  name: _pt.string.isRequired,
-  mainNavLabel: _pt.string,
-  navigationOptions: _pt.array,
-  clickMenuAction: _pt.func.isRequired,
-  firstName: _pt.string,
-  lastName: _pt.string
-};
-export default MobileActionMenu;
-//# sourceMappingURL=MobileActionMenu.js.map

package/dist/GlobalNavigationBar/mobile/MobileActionMenu.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileActionMenu.tsx"],"names":["React","styled","Actions","ExitMenuButton","Menu","Right","MenuSection","MenuSectionList","MenuLink","RowLayout","FirstRowLayout","MobileActionMenu","clickMenuAction","navigationOptions","firstName","lastName","actionList","map","no","to","label","name","mainNavLabel"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AAEA,OAAOC,OAAP,MAAoB,YAApB;AACA,OAAOC,cAAP,MAA2B,kBAA3B;AACA,SAASC,IAAT,EAAeC,KAAf,EAAsBC,WAAtB,EAAmCC,eAAnC,EAAoDC,QAApD,EAA8DC,SAA9D,QAA+E,gBAA/E;;;;AAEA,IAAMC,cAAc,GAAGT,MAAM,CAACQ,SAAD,CAAT,2FAApB;;AAeA,IAAME,gBAAgB,GAAG,SAAnBA,gBAAmB,OAAoF;AAAA,MAAjFC,eAAiF,QAAjFA,eAAiF;AAAA,MAAhEC,iBAAgE,QAAhEA,iBAAgE;AAAA,MAA7CC,SAA6C,QAA7CA,SAA6C;AAAA,MAAlCC,QAAkC,QAAlCA,QAAkC;AAAA,MAAxBC,UAAwB,QAAxBA,UAAwB;AAC3G,sBACE,MAAC,IAAD;AAAM,IAAA,IAAI,EAAC,MAAX;AAAkB,uBAAgB,gBAAlC;AAAA,4BACE,MAAC,cAAD;AAAA,8BACE;AAAA,+BACE,KAAC,OAAD;AAAS,UAAA,OAAO,EAAEA,UAAlB;AAA8B,UAAA,SAAS,EAAEF,SAAzC;AAAoD,UAAA,QAAQ,EAAEC,QAA9D;AAAwE,UAAA,cAAc,EAAE,IAAxF;AAA8F,UAAA,WAAW,EAAE,KAA3G;AAAkH,UAAA,eAAe,EAAE,2BAAM,CAAE;AAA3I;AADF,QADF,eAIE,KAAC,KAAD;AAAA,+BACE,KAAC,cAAD;AAAgB,UAAA,SAAS,EAAEH;AAA3B;AADF,QAJF;AAAA,MADF,eASE,KAAC,WAAD;AAAA,6BACE,KAAC,eAAD;AAAA,kBACGC,iBADH,aACGA,iBADH,uBACGA,iBAAiB,CAAEI,GAAnB,CAAuB,UAAAC,EAAE;AAAA,8BACxB;AAAmB,YAAA,OAAO,EAAE;AAAA,qBAAMN,eAAe,EAArB;AAAA,aAA5B;AAAA,mCACE,KAAC,QAAD;AAAU,cAAA,EAAE,EAAEM,EAAE,CAACC,EAAjB;AAAqB,cAAA,IAAI,EAAC,UAA1B;AAAA,qCACE;AAAA,0BAAMD,EAAE,CAACE;AAAT;AADF;AADF,aAASF,EAAE,CAACE,KAAZ,CADwB;AAAA,SAAzB;AADH;AADF,MATF;AAAA,IADF;AAuBD,CAxBD;;;AAVEC,EAAAA,I;AACAC,EAAAA,Y;AACAT,EAAAA,iB;AAEAD,EAAAA,e;AACAE,EAAAA,S;AACAC,EAAAA,Q;;AA8BF,eAAeJ,gBAAf","sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { NavOption, ActionOptions } from '../../types';\r\nimport Actions from '../Actions';\r\nimport ExitMenuButton from './ExitMenuButton';\r\nimport { Menu, Right, MenuSection, MenuSectionList, MenuLink, RowLayout } from './CommonStyles';\r\n\r\nconst FirstRowLayout = styled(RowLayout)`\r\n  margin-top: 5px;\r\n`;\r\n\r\ntype Props = {\r\n  name: string;\r\n  mainNavLabel?: string;\r\n  navigationOptions?: NavOption[];\r\n  actions?: ActionOptions;\r\n  clickMenuAction: () => void;\r\n  firstName?: string;\r\n  lastName?: string;\r\n  actionList?: ActionOptions;\r\n};\r\n\r\nconst MobileActionMenu = ({ clickMenuAction, navigationOptions, firstName, lastName, actionList }: Props) => {\r\n  return (\r\n    <Menu role=\"menu\" aria-labelledby=\"UserMenuButton\">\r\n      <FirstRowLayout>\r\n        <>\r\n          <Actions actions={actionList} firstName={firstName} lastName={lastName} isInMobileMenu={true} useUserMenu={false} setShowUserMenu={() => {}} />\r\n        </>\r\n        <Right>\r\n          <ExitMenuButton closeMenu={clickMenuAction} />\r\n        </Right>\r\n      </FirstRowLayout>\r\n      <MenuSection>\r\n        <MenuSectionList>\r\n          {navigationOptions?.map(no => (\r\n            <li key={no.label} onClick={() => clickMenuAction()}>\r\n              <MenuLink to={no.to} role=\"menuitem\">\r\n                <div>{no.label}</div>\r\n              </MenuLink>\r\n            </li>\r\n          ))}\r\n        </MenuSectionList>\r\n      </MenuSection>\r\n    </Menu>\r\n  );\r\n};\r\n\r\nexport default MobileActionMenu;\r\n"],"file":"MobileActionMenu.js"}

package/dist/LinearProgression/LinearProgression.cjs

@@ -1,132 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.LinearProgressionVariant = exports.LinearProgressionType = exports.LineFill = exports.Line = exports.Dot = exports.Bar = void 0;
-
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _types = require("../types");
-
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-
-var _styles = require("../styles");
-
-var _jsxRuntime = require("react/jsx-runtime");
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-
-var Bar = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  flex: 1;\n  height: 6px;\n\n  &.small {\n    height: 6px;\n  }\n\n  &.medium {\n    height: 8px;\n  }\n\n  &.large {\n    height: 12px;\n  }\n\n  background-color: ", ";\n\n  &.active {\n    background-color: ", ";\n  }\n\n  &.current {\n    background-color: ", ";\n  }\n\n  &.inverted {\n    background-color: ", ";\n  }\n\n  &.inverted.active {\n    background-color: ", ";\n  }\n\n  &.inverted.current {\n    background-color: ", ";\n  }\n\n"])), _styles.COLORS.neutral_100, _styles.COLORS.accent1_400, _styles.COLORS.accent1_800, _styles.COLORS.neutral_600, _styles.COLORS.accent1_400, _styles.COLORS.white);
-
-exports.Bar = Bar;
-
-var Dot = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n\n\n  &:after {\n    content: '';\n    display: block;\n    width: 6px;\n    height: 6px;\n    border-radius: 50%;\n    background-color: ", ";\n  }\n\n  &.small {\n    &:after {\n      width: 6px;\n      height: 6px;\n    }\n\n    &.current:after {\n      width: 10px;\n      height: 10px;\n    }\n  }\n\n  &.medium {\n    &:after {\n      width: 8px;\n      height: 8px;\n    }\n\n    &.current:after {\n      width: 12px;\n      height: 12px;\n    }\n  }\n\n  &.large {\n    &:after {\n      width: 12px;\n      height: 12px;\n    }\n\n    &.current:after {\n      width: 16px;\n      height: 16px;\n    }\n  }\n\n\n  &.active:after {\n    background-color: ", ";\n  }\n\n  &.current:after {\n    background-color: ", ";\n  }\n\n  &.inverted:after {\n    background-color: ", ";\n  }\n\n  &.inverted.active:after {\n    background-color: ", ";\n  }\n\n  &.inverted.current:after {\n    background-color: ", ";\n  }\n"])), _styles.COLORS.neutral_400, _styles.COLORS.accent1_600, _styles.COLORS.accent1_800, _styles.COLORS.neutral_400, _styles.COLORS.accent1_400, _styles.COLORS.white);
-
-exports.Dot = Dot;
-
-var LineFill = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  height: 100%;\n  max-width: 100%;\n  position: absolute;\n  z-index: 1;\n"])));
-
-exports.LineFill = LineFill;
-
-var Line = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  flex: 1;\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  position: relative;\n\n  &:after {\n    content: '';\n    display: block;\n    height: 100%;\n    background-color: ", ";\n    position: absolute;\n    right: 0;\n  }\n\n  &:before {\n    content: '';\n    display: block;\n    height: 100%;\n    background-color: ", ";\n    position: absolute;\n    left: 0;\n  }\n\n  &.small {\n    height: 6px;\n    border-radius: 4px;\n\n    ", " {\n      border-radius: 4px;\n    }\n\n    &:after {\n      width: 3px;\n      border-top-right-radius: 6px;\n      border-bottom-right-radius: 6px;\n    }\n\n    &:before {\n      width: 3px;\n      border-top-left-radius: 6px;\n      border-bottom-left-radius: 6px;\n    }\n  }\n\n  &.medium {\n    height: 8px;\n    border-radius: 4px;\n\n    ", " {\n      border-radius: 4px;\n    }\n\n    &:after {\n      width: 4px;\n      border-top-right-radius: 8px;\n      border-bottom-right-radius: 8px;\n    }\n\n    &:before {\n      width: 4px;\n      border-top-left-radius: 8px;\n      border-bottom-left-radius: 8px;\n    }\n  }\n\n  &.large {\n    height: 12px;\n    border-radius: 6px;\n\n    ", " {\n      border-radius: 6px;\n    }\n\n    &:after {\n      width: 6px;\n      border-top-right-radius: 12px;\n      border-bottom-right-radius: 12px;\n    }\n\n    &:before {\n      width: 6px;\n      border-top-left-radius: 12px;\n      border-bottom-left-radius: 12px;\n    }\n  }\n\n  background-color: ", ";\n\n  ", " {\n    background-color: ", ";\n  }\n\n  &.inverted {\n    background-color: ", ";\n\n    &:after,\n    &:before {\n      background-color: ", ";\n    }\n\n    ", " {\n      background-color: ", ";\n    }\n  }\n"])), _styles.COLORS.neutral_500, _styles.COLORS.neutral_500, LineFill, LineFill, LineFill, _styles.COLORS.neutral_100, LineFill, _styles.COLORS.accent1_500, _styles.COLORS.neutral_700, _styles.COLORS.neutral_400, LineFill, _styles.COLORS.accent1_400);
-
-exports.Line = Line;
-
-var Wrapper = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  display: flex;\n  align-items: center;\n  flex-direction: row;\n  gap: 4px;\n  height: 16px;\n\n  &.small {\n    gap: 4px;\n\n    ", ":first-of-type {\n      border-top-left-radius: 6px;\n      border-bottom-left-radius: 6px;\n    }\n\n    ", ":last-of-type {\n      border-top-right-radius: 6px;\n      border-bottom-right-radius: 6px;\n    }\n\n  }\n\n  &.medium {\n    gap: 6px;\n\n    ", ":first-of-type {\n      border-top-left-radius: 8px;\n      border-bottom-left-radius: 8px;\n    }\n\n    ", ":last-of-type {\n      border-top-right-radius: 8px;\n      border-bottom-right-radius: 8px;\n    }\n  }\n\n  &.large {\n    gap: 8px;\n\n    ", ":first-of-type {\n      border-top-left-radius: 12px;\n      border-bottom-left-radius: 12px;\n    }\n\n    ", ":last-of-type {\n      border-top-right-radius: 12px;\n      border-bottom-right-radius: 12px;\n    }\n  }\n"])), Bar, Bar, Bar, Bar, Bar, Bar);
-
-var LinearProgressionType;
-exports.LinearProgressionType = LinearProgressionType;
-
-(function (LinearProgressionType) {
-  LinearProgressionType["Dots"] = "dots";
-  LinearProgressionType["Line"] = "line";
-  LinearProgressionType["Bars"] = "bars";
-})(LinearProgressionType || (exports.LinearProgressionType = LinearProgressionType = {}));
-
-var LinearProgressionVariant;
-exports.LinearProgressionVariant = LinearProgressionVariant;
-
-(function (LinearProgressionVariant) {
-  LinearProgressionVariant["Normal"] = "normal";
-  LinearProgressionVariant["Inverted"] = "inverted";
-})(LinearProgressionVariant || (exports.LinearProgressionVariant = LinearProgressionVariant = {}));
-
-var LinearProgression = function LinearProgression(_ref) {
-  var _ref$size = _ref.size,
-      size = _ref$size === void 0 ? _types.Size.Medium : _ref$size,
-      _ref$type = _ref.type,
-      type = _ref$type === void 0 ? LinearProgressionType.Line : _ref$type,
-      _ref$variant = _ref.variant,
-      variant = _ref$variant === void 0 ? LinearProgressionVariant.Normal : _ref$variant,
-      value = _ref.value,
-      max = _ref.max;
-
-  var renderBars = function renderBars() {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-      children: Array.from(Array(max).keys()).map(function (i) {
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(Bar, {
-          className: "".concat(Math.ceil(value) >= i + 1 ? 'active' : '', " ").concat(Math.ceil(value) === i + 1 ? 'current' : '', " ").concat(variant, " ").concat(size)
-        }, i);
-      })
-    });
-  };
-
-  var renderDots = function renderDots() {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-      children: Array.from(Array(max).keys()).map(function (i) {
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(Dot, {
-          className: "".concat(Math.ceil(value) >= i + 1 ? 'active' : '', " ").concat(Math.ceil(value) === i + 1 ? 'current' : '', " ").concat(variant, " ").concat(size)
-        }, i);
-      })
-    });
-  };
-
-  var renderLine = function renderLine() {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Line, {
-        className: "".concat(variant, " ").concat(size),
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(LineFill, {
-          style: {
-            width: "".concat(value / max * 100, "%")
-          }
-        })
-      })
-    });
-  };
-
-  var render = function render() {
-    switch (type) {
-      case LinearProgressionType.Bars:
-        return renderBars();
-
-      case LinearProgressionType.Dots:
-        return renderDots();
-
-      case LinearProgressionType.Line:
-      default:
-        return renderLine();
-    }
-  };
-
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Wrapper, {
-    className: "".concat(size, " ").concat(type, " ").concat(variant),
-    children: render()
-  });
-};
-
-LinearProgression.propTypes = {
-  type: _propTypes.default.oneOf(["dots", "line", "bars"]),
-  variant: _propTypes.default.oneOf(["normal", "inverted"]),
-  value: _propTypes.default.number.isRequired,
-  max: _propTypes.default.number.isRequired
-};
-var _default = LinearProgression;
-exports.default = _default;
-//# sourceMappingURL=LinearProgression.cjs.map

package/dist/LinearProgression/LinearProgression.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/LinearProgression/LinearProgression.tsx"],"names":["Bar","styled","div","COLORS","neutral_100","accent1_400","accent1_800","neutral_600","white","Dot","neutral_400","accent1_600","LineFill","Line","neutral_500","accent1_500","neutral_700","Wrapper","LinearProgressionType","LinearProgressionVariant","LinearProgression","size","Size","Medium","type","variant","Normal","value","max","renderBars","Array","from","keys","map","i","Math","ceil","renderDots","renderLine","width","render","Bars","Dots"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport {Size} from '../types';\r\nimport styled from 'styled-components';\r\nimport {COLORS} from '../styles';\r\n\r\nexport const Bar = styled.div`\r\n  flex: 1;\r\n  height: 6px;\r\n\r\n  &.small {\r\n    height: 6px;\r\n  }\r\n\r\n  &.medium {\r\n    height: 8px;\r\n  }\r\n\r\n  &.large {\r\n    height: 12px;\r\n  }\r\n\r\n  background-color: ${COLORS.neutral_100};\r\n\r\n  &.active {\r\n    background-color: ${COLORS.accent1_400};\r\n  }\r\n\r\n  &.current {\r\n    background-color: ${COLORS.accent1_800};\r\n  }\r\n\r\n  &.inverted {\r\n    background-color: ${COLORS.neutral_600};\r\n  }\r\n\r\n  &.inverted.active {\r\n    background-color: ${COLORS.accent1_400};\r\n  }\r\n\r\n  &.inverted.current {\r\n    background-color: ${COLORS.white};\r\n  }\r\n\r\n`;\r\n\r\nexport const Dot = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 16px;\r\n  height: 16px;\r\n\r\n\r\n  &:after {\r\n    content: '';\r\n    display: block;\r\n    width: 6px;\r\n    height: 6px;\r\n    border-radius: 50%;\r\n    background-color: ${COLORS.neutral_400};\r\n  }\r\n\r\n  &.small {\r\n    &:after {\r\n      width: 6px;\r\n      height: 6px;\r\n    }\r\n\r\n    &.current:after {\r\n      width: 10px;\r\n      height: 10px;\r\n    }\r\n  }\r\n\r\n  &.medium {\r\n    &:after {\r\n      width: 8px;\r\n      height: 8px;\r\n    }\r\n\r\n    &.current:after {\r\n      width: 12px;\r\n      height: 12px;\r\n    }\r\n  }\r\n\r\n  &.large {\r\n    &:after {\r\n      width: 12px;\r\n      height: 12px;\r\n    }\r\n\r\n    &.current:after {\r\n      width: 16px;\r\n      height: 16px;\r\n    }\r\n  }\r\n\r\n\r\n  &.active:after {\r\n    background-color: ${COLORS.accent1_600};\r\n  }\r\n\r\n  &.current:after {\r\n    background-color: ${COLORS.accent1_800};\r\n  }\r\n\r\n  &.inverted:after {\r\n    background-color: ${COLORS.neutral_400};\r\n  }\r\n\r\n  &.inverted.active:after {\r\n    background-color: ${COLORS.accent1_400};\r\n  }\r\n\r\n  &.inverted.current:after {\r\n    background-color: ${COLORS.white};\r\n  }\r\n`;\r\n\r\nexport const LineFill = styled.div`\r\n  height: 100%;\r\n  max-width: 100%;\r\n  position: absolute;\r\n  z-index: 1;\r\n`;\r\n\r\nexport const Line = styled.div`\r\n  flex: 1;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: flex-start;\r\n  position: relative;\r\n\r\n  &:after {\r\n    content: '';\r\n    display: block;\r\n    height: 100%;\r\n    background-color: ${COLORS.neutral_500};\r\n    position: absolute;\r\n    right: 0;\r\n  }\r\n\r\n  &:before {\r\n    content: '';\r\n    display: block;\r\n    height: 100%;\r\n    background-color: ${COLORS.neutral_500};\r\n    position: absolute;\r\n    left: 0;\r\n  }\r\n\r\n  &.small {\r\n    height: 6px;\r\n    border-radius: 4px;\r\n\r\n    ${LineFill} {\r\n      border-radius: 4px;\r\n    }\r\n\r\n    &:after {\r\n      width: 3px;\r\n      border-top-right-radius: 6px;\r\n      border-bottom-right-radius: 6px;\r\n    }\r\n\r\n    &:before {\r\n      width: 3px;\r\n      border-top-left-radius: 6px;\r\n      border-bottom-left-radius: 6px;\r\n    }\r\n  }\r\n\r\n  &.medium {\r\n    height: 8px;\r\n    border-radius: 4px;\r\n\r\n    ${LineFill} {\r\n      border-radius: 4px;\r\n    }\r\n\r\n    &:after {\r\n      width: 4px;\r\n      border-top-right-radius: 8px;\r\n      border-bottom-right-radius: 8px;\r\n    }\r\n\r\n    &:before {\r\n      width: 4px;\r\n      border-top-left-radius: 8px;\r\n      border-bottom-left-radius: 8px;\r\n    }\r\n  }\r\n\r\n  &.large {\r\n    height: 12px;\r\n    border-radius: 6px;\r\n\r\n    ${LineFill} {\r\n      border-radius: 6px;\r\n    }\r\n\r\n    &:after {\r\n      width: 6px;\r\n      border-top-right-radius: 12px;\r\n      border-bottom-right-radius: 12px;\r\n    }\r\n\r\n    &:before {\r\n      width: 6px;\r\n      border-top-left-radius: 12px;\r\n      border-bottom-left-radius: 12px;\r\n    }\r\n  }\r\n\r\n  background-color: ${COLORS.neutral_100};\r\n\r\n  ${LineFill} {\r\n    background-color: ${COLORS.accent1_500};\r\n  }\r\n\r\n  &.inverted {\r\n    background-color: ${COLORS.neutral_700};\r\n\r\n    &:after,\r\n    &:before {\r\n      background-color: ${COLORS.neutral_400};\r\n    }\r\n\r\n    ${LineFill} {\r\n      background-color: ${COLORS.accent1_400};\r\n    }\r\n  }\r\n`;\r\n\r\nconst Wrapper = styled.div`\r\n  width: 100%;\r\n  display: flex;\r\n  align-items: center;\r\n  flex-direction: row;\r\n  gap: 4px;\r\n  height: 16px;\r\n\r\n  &.small {\r\n    gap: 4px;\r\n\r\n    ${Bar}:first-of-type {\r\n      border-top-left-radius: 6px;\r\n      border-bottom-left-radius: 6px;\r\n    }\r\n\r\n    ${Bar}:last-of-type {\r\n      border-top-right-radius: 6px;\r\n      border-bottom-right-radius: 6px;\r\n    }\r\n\r\n  }\r\n\r\n  &.medium {\r\n    gap: 6px;\r\n\r\n    ${Bar}:first-of-type {\r\n      border-top-left-radius: 8px;\r\n      border-bottom-left-radius: 8px;\r\n    }\r\n\r\n    ${Bar}:last-of-type {\r\n      border-top-right-radius: 8px;\r\n      border-bottom-right-radius: 8px;\r\n    }\r\n  }\r\n\r\n  &.large {\r\n    gap: 8px;\r\n\r\n    ${Bar}:first-of-type {\r\n      border-top-left-radius: 12px;\r\n      border-bottom-left-radius: 12px;\r\n    }\r\n\r\n    ${Bar}:last-of-type {\r\n      border-top-right-radius: 12px;\r\n      border-bottom-right-radius: 12px;\r\n    }\r\n  }\r\n`;\r\n\r\nexport enum LinearProgressionType {\r\n  Dots = 'dots',\r\n  Line = 'line',\r\n  Bars = 'bars',\r\n}\r\n\r\nexport enum LinearProgressionVariant {\r\n  Normal = 'normal',\r\n  Inverted = 'inverted',\r\n}\r\n\r\nexport interface LinearProgressionProps {\r\n  size?: Size.Small | Size.Medium | Size.Large;\r\n  type?: LinearProgressionType;\r\n  variant?: LinearProgressionVariant;\r\n\r\n  value: number;\r\n  max: number;\r\n}\r\n\r\nconst LinearProgression: React.FunctionComponent<LinearProgressionProps> = ({\r\n                                                                              size = Size.Medium,\r\n                                                                              type = LinearProgressionType.Line,\r\n                                                                              variant = LinearProgressionVariant.Normal,\r\n                                                                              value,\r\n                                                                              max\r\n                                                                            }) => {\r\n\r\n  const renderBars = () => (\r\n    <>\r\n      {Array.from(Array(max).keys()).map(i => (\r\n        <Bar key={i}\r\n             className={`${Math.ceil(value) >= i + 1 ? 'active' : ''} ${Math.ceil(value) === i + 1 ? 'current' : ''} ${variant} ${size}`}/>\r\n      ))}\r\n    </>\r\n  )\r\n\r\n\r\n  const renderDots = () =>\r\n    <>\r\n      {Array.from(Array(max).keys()).map(i => (\r\n        <Dot key={i}\r\n             className={`${Math.ceil(value) >= i + 1 ? 'active' : ''} ${Math.ceil(value) === i + 1 ? 'current' : ''} ${variant} ${size}`}/>\r\n      ))}\r\n    </>\r\n\r\n  const renderLine = () =>\r\n    <>\r\n      <Line className={`${variant} ${size}`}>\r\n        <LineFill style={{width: `${value / max * 100}%`}}/>\r\n      </Line>\r\n    </>\r\n\r\n\r\n  const render = () => {\r\n    switch (type) {\r\n      case LinearProgressionType.Bars:\r\n        return renderBars();\r\n      case LinearProgressionType.Dots:\r\n        return renderDots();\r\n      case LinearProgressionType.Line:\r\n      default:\r\n        return renderLine();\r\n    }\r\n  }\r\n\r\n  return (\r\n    <Wrapper className={`${size} ${type} ${variant}`}>\r\n      {render()}\r\n    </Wrapper>\r\n  )\r\n};\r\n\r\nexport default LinearProgression;\r\n"],"file":"LinearProgression.cjs"}