@laerdal/life-react-components 1.4.1-dev.11 → 1.4.1-dev.14.full

package/dist/cjs/Modals/Modal.js

@@ -1,92 +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 = exports.ModalCloseButton = 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 _SystemIcons = require("../icons/systemicons/SystemIcons");
-
-var _styles = require("../styles");
-
-var _ModalStyles = require("./ModalStyles");
-
-var _jsxRuntime = require("react/jsx-runtime");
-
-var _templateObject, _templateObject2;
-
-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; }
-
-/**
- * Modal styles
- */
-var Column = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: column;\n  justify-content: stretch;\n  height: 100%;\n"])));
-
-var StyledButton = (0, _styledComponents.default)(_Button.IconButton)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n"])));
-
-var ModalCloseButton = function ModalCloseButton(_ref) {
-  var onClick = _ref.onClick;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledButton, {
-    variant: "secondary",
-    shape: "square",
-    action: onClick,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.Close, {
-      size: "24px",
-      color: _styles.COLORS.black
-    })
-  });
-};
-
-exports.ModalCloseButton = ModalCloseButton;
-
-var Modal = function Modal(_ref2) {
-  var children = _ref2.children;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Column, {
-    children: children
-  });
-};
-
-Modal.propTypes = {
-  children: _propTypes.default.any.isRequired
-};
-
-Modal.Header = function (_ref3) {
-  var children = _ref3.children;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ModalStyles.ModalHeader, {
-    children: children
-  });
-};
-
-Modal.Body = function (_ref4) {
-  var children = _ref4.children;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ModalStyles.ModalBody, {
-    children: children
-  });
-};
-
-Modal.Footer = function (_ref5) {
-  var children = _ref5.children;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ModalStyles.ModalFooter, {
-    children: children
-  });
-};
-
-var _default = Modal;
-exports.default = _default;
-//# sourceMappingURL=Modal.js.map

package/dist/cjs/Modals/Modal.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/Modals/Modal.tsx"],"names":["Column","styled","div","StyledButton","IconButton","ModalCloseButton","onClick","COLORS","black","Modal","children","Header","Body","Footer"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA;AACA;AACA;AACA,IAAMA,MAAM,GAAGC,0BAAOC,GAAV,gLAAZ;;AAOA,IAAMC,YAAY,GAAG,+BAAOC,kBAAP,CAAH,yGAAlB;;AAIO,IAAMC,gBAAkE,GAAG,SAArEA,gBAAqE,OAAiB;AAAA,MAAdC,OAAc,QAAdA,OAAc;AACjG,sBACE,qBAAC,YAAD;AAAc,IAAA,OAAO,EAAC,WAAtB;AAAkC,IAAA,KAAK,EAAC,QAAxC;AAAiD,IAAA,MAAM,EAAEA,OAAzD;AAAA,2BACE,qBAAC,kBAAD;AAAO,MAAA,IAAI,EAAC,MAAZ;AAAmB,MAAA,KAAK,EAAEC,eAAOC;AAAjC;AADF,IADF;AAKD,CANM;;;;AAYP,IAAMC,KAAK,GAAG,SAARA,KAAQ;AAAA,MAAGC,QAAH,SAAGA,QAAH;AAAA,sBAA8B,qBAAC,MAAD;AAAA,cAASA;AAAT,IAA9B;AAAA,CAAd;;;AAHEA,EAAAA,Q;;;AAKFD,KAAK,CAACE,MAAN,GAAe;AAAA,MAAGD,QAAH,SAAGA,QAAH;AAAA,sBAA8B,qBAAC,wBAAD;AAAA,cAAcA;AAAd,IAA9B;AAAA,CAAf;;AAEAD,KAAK,CAACG,IAAN,GAAa;AAAA,MAAGF,QAAH,SAAGA,QAAH;AAAA,sBAA8B,qBAAC,sBAAD;AAAA,cAAYA;AAAZ,IAA9B;AAAA,CAAb;;AAEAD,KAAK,CAACI,MAAN,GAAe;AAAA,MAAGH,QAAH,SAAGA,QAAH;AAAA,sBAA8B,qBAAC,wBAAD;AAAA,cAAcA;AAAd,IAA9B;AAAA,CAAf;;eAEeD,K","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { IconButton } from '../Button';\nimport { Close } from '../icons/systemicons/SystemIcons';\nimport { COLORS } from '../styles';\nimport { ModalHeader, ModalBody, ModalFooter } from './ModalStyles';\n\n/**\n * Modal styles\n */\nconst Column = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: stretch;\n  height: 100%;\n`;\n\nconst StyledButton = styled(IconButton)`\n  display: flex;\n`;\n\nexport const ModalCloseButton: React.FunctionComponent<{ onClick: () => void }> = ({ onClick }) => {\n  return (\n    <StyledButton variant=\"secondary\" shape=\"square\" action={onClick}>\n      <Close size=\"24px\" color={COLORS.black} />\n    </StyledButton>\n  );\n};\n\ntype ModalProps = {\n  children: any;\n};\n\nconst Modal = ({ children }: ModalProps) => <Column>{children}</Column>;\n\nModal.Header = ({ children }: ModalProps) => <ModalHeader>{children}</ModalHeader>;\n\nModal.Body = ({ children }: ModalProps) => <ModalBody>{children}</ModalBody>;\n\nModal.Footer = ({ children }: ModalProps) => <ModalFooter>{children}</ModalFooter>;\n\nexport default Modal;\n"],"file":"Modal.js"}

package/dist/cjs/Modals/ModalContainer.js

@@ -1,176 +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 _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var React = _interopRequireWildcard(require("react"));
-
-var _reactModal = _interopRequireDefault(require("react-modal"));
-
-var _styles = require("../styles");
-
-var _zIndexes = require("../styles/z-indexes");
-
-var _jsxRuntime = require("react/jsx-runtime");
-
-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; }
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-var ModalContainerStyles = {
-  content: {
-    top: '50%',
-    left: '50%',
-    right: 'auto',
-    bottom: 'auto',
-    marginRight: '-50%',
-    width: '640px',
-    height: '320px',
-    borderRadius: '8px',
-    boxSizing: 'border-box',
-    margin: 0,
-    overflow: 'auto',
-    boxShadow: _styles.BOXSHADOWS.BOXSHADOW_L3
-  }
-}; //override modal classes to define the animations
-
-var modalTransitions = "\n.ReactModal__Overlay {\n  opacity: 0;\n  z-index: ".concat(_zIndexes.Z_INDEXES.backdrop, ";\n}\n\n.ReactModal__Overlay--after-open {\n  opacity: 1;\n  transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content{\n  z-index: ").concat(_zIndexes.Z_INDEXES.modal, ";\n  opacity:0;\n  transform: translate(-50%, -50%) scale(1.1, 1.1);\n}\n\n.ReactModal__Content--after-open{\n  opacity: 1;\n  transform: translate(-50%, -50%) scale(1.0, 1.0);\n  transition: transform 150ms ease-in-out, opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Overlay--before-close {\n  opacity: 0;\n  transition: opacity 120ms linear;\n}\n\n.ReactModal__Content--before-close{\n  opacity: 0;\n  transform: translate(-50%, -50%) scale(1.1, 1.1);\n  transition: transform 120ms ease-in-out, opacity 120ms cubic-bezier(0.55, 0.05, 0.67, 0.19);\n}\n\n.ReactModal__Body--open,\n.ReactModal__Html--open {\n  overflow: hidden;\n}\n");
-
-var ModalContainer = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2.default)(ModalContainer, _React$Component);
-
-  var _super = _createSuper(ModalContainer);
-
-  function ModalContainer() {
-    var _this;
-
-    (0, _classCallCheck2.default)(this, ModalContainer);
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
-    _this = _super.call.apply(_super, [this].concat(args));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "GetSize", function () {
-      var modalHeight = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'auto';
-      var modalWidth = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'auto';
-      return {
-        height: modalHeight,
-        width: modalWidth
-      };
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "GetOverflow", function () {
-      var modalOverflow = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'visible';
-      return modalOverflow;
-    });
-    return _this;
-  }
-
-  (0, _createClass2.default)(ModalContainer, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      if (_reactModal.default.defaultStyles.overlay) {
-        _reactModal.default.defaultStyles.overlay.backgroundColor = 'rgba(0,0,0,0.5)';
-      } //append style node to override modal transition classes
-
-
-      if (!document.querySelector('[modal-custom-styling="active"]')) {
-        var head = document.head || document.getElementsByTagName('head')[0];
-        var style = document.createElement('style');
-        style.setAttribute('modal-custom-styling', 'active');
-        head.appendChild(style);
-        style.appendChild(document.createTextNode(modalTransitions));
-      }
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-          id = _this$props.id,
-          showModal = _this$props.showModal,
-          closeModal = _this$props.closeModal,
-          children = _this$props.children,
-          modalHeight = _this$props.modalHeight,
-          modalWidth = _this$props.modalWidth,
-          modalOverflow = _this$props.modalOverflow,
-          padding = _this$props.padding,
-          _this$props$minWidth = _this$props.minWidth,
-          minWidth = _this$props$minWidth === void 0 ? '' : _this$props$minWidth,
-          _this$props$maxWidth = _this$props.maxWidth,
-          maxWidth = _this$props$maxWidth === void 0 ? '' : _this$props$maxWidth;
-      var sizes = this.GetSize(modalHeight, modalWidth);
-      var height = sizes.height,
-          width = sizes.width;
-      var overflow = this.GetOverflow(modalOverflow);
-      var stylesConfiguration = Object.assign(_objectSpread({}, ModalContainerStyles.content), {
-        height: height,
-        width: width,
-        padding: padding,
-        overflow: overflow,
-        minWidth: minWidth,
-        maxWidth: maxWidth
-      });
-      var styles = {
-        content: stylesConfiguration
-      };
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactModal.default, {
-        id: id,
-        isOpen: showModal,
-        closeTimeoutMS: 120,
-        onRequestClose: function onRequestClose() {
-          return closeModal();
-        },
-        style: styles,
-        appElement: document.getElementById('root') || '',
-        children: children
-      });
-    }
-  }]);
-  return ModalContainer;
-}(React.Component);
-
-(0, _defineProperty2.default)(ModalContainer, "propTypes", {
-  id: _propTypes.default.string,
-  showModal: _propTypes.default.bool.isRequired,
-  closeModal: _propTypes.default.func.isRequired,
-  children: _propTypes.default.any.isRequired,
-  modalHeight: _propTypes.default.any,
-  modalWidth: _propTypes.default.any,
-  modalOverflow: _propTypes.default.string,
-  padding: _propTypes.default.string,
-  minWidth: _propTypes.default.string,
-  maxWidth: _propTypes.default.string
-});
-var _default = ModalContainer;
-exports.default = _default;
-//# sourceMappingURL=ModalContainer.js.map

package/dist/cjs/Modals/ModalContainer.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/Modals/ModalContainer.tsx"],"names":["ModalContainerStyles","content","top","left","right","bottom","marginRight","width","height","borderRadius","boxSizing","margin","overflow","boxShadow","BOXSHADOWS","BOXSHADOW_L3","modalTransitions","Z_INDEXES","backdrop","modal","ModalContainer","modalHeight","modalWidth","modalOverflow","ReactModal","defaultStyles","overlay","backgroundColor","document","querySelector","head","getElementsByTagName","style","createElement","setAttribute","appendChild","createTextNode","props","id","showModal","closeModal","children","padding","minWidth","maxWidth","sizes","GetSize","GetOverflow","stylesConfiguration","Object","assign","styles","getElementById","React","Component"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport ReactModal from 'react-modal';\nimport { BOXSHADOWS } from '../styles';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nconst ModalContainerStyles = {\n  content: {\n    top: '50%',\n    left: '50%',\n    right: 'auto',\n    bottom: 'auto',\n    marginRight: '-50%',\n    width: '640px',\n    height: '320px',\n    borderRadius: '8px',\n    boxSizing: 'border-box' as any,\n    margin: 0,\n    overflow: 'auto',\n    boxShadow: BOXSHADOWS.BOXSHADOW_L3,\n  },\n};\n\n//override modal classes to define the animations\nconst modalTransitions = `\n.ReactModal__Overlay {\n  opacity: 0;\n  z-index: ${Z_INDEXES.backdrop};\n}\n\n.ReactModal__Overlay--after-open {\n  opacity: 1;\n  transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content{\n  z-index: ${Z_INDEXES.modal};\n  opacity:0;\n  transform: translate(-50%, -50%) scale(1.1, 1.1);\n}\n\n.ReactModal__Content--after-open{\n  opacity: 1;\n  transform: translate(-50%, -50%) scale(1.0, 1.0);\n  transition: transform 150ms ease-in-out, opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Overlay--before-close {\n  opacity: 0;\n  transition: opacity 120ms linear;\n}\n\n.ReactModal__Content--before-close{\n  opacity: 0;\n  transform: translate(-50%, -50%) scale(1.1, 1.1);\n  transition: transform 120ms ease-in-out, opacity 120ms cubic-bezier(0.55, 0.05, 0.67, 0.19);\n}\n\n.ReactModal__Body--open,\n.ReactModal__Html--open {\n  overflow: hidden;\n}\n`;\n\ntype ModalContainerProps = {\n  id?: string;\n  showModal: boolean;\n  closeModal: () => void;\n  children: any;\n  modalHeight?: any;\n  modalWidth?: any;\n  modalOverflow?: string;\n  padding?: string;\n  minWidth?: string;\n  maxWidth?: string;\n};\n\ntype ModalContainerState = {};\n\nclass ModalContainer extends React.Component<ModalContainerProps, ModalContainerState> {\n  componentDidMount() {\n    if (ReactModal.defaultStyles.overlay) {\n      ReactModal.defaultStyles.overlay.backgroundColor = 'rgba(0,0,0,0.5)';\n    }\n\n    //append style node to override modal transition classes\n    if (!document.querySelector('[modal-custom-styling=\"active\"]')) {\n      const head = document.head || document.getElementsByTagName('head')[0];\n      const style = document.createElement('style');\n      style.setAttribute('modal-custom-styling', 'active');\n      head.appendChild(style);\n      style.appendChild(document.createTextNode(modalTransitions));\n    }\n  }\n\n  GetSize = (modalHeight: string = 'auto', modalWidth: string = 'auto') => ({ height: modalHeight, width: modalWidth });\n  GetOverflow = (modalOverflow: string = 'visible') => modalOverflow;\n  render() {\n    const { id, showModal, closeModal, children, modalHeight, modalWidth, modalOverflow, padding, minWidth = '', maxWidth = '' } = this.props;\n    const sizes = this.GetSize(modalHeight, modalWidth);\n    const { height, width } = sizes;\n    const overflow = this.GetOverflow(modalOverflow);\n    const stylesConfiguration = Object.assign({ ...ModalContainerStyles.content }, { height, width, padding, overflow, minWidth, maxWidth });\n    const styles = { content: stylesConfiguration };\n\n    return (\n      <ReactModal id={id} isOpen={showModal} closeTimeoutMS={120} onRequestClose={() => closeModal()} style={styles} appElement={document.getElementById('root') || ''}>\n        {children}\n      </ReactModal>\n    );\n  }\n}\n\nexport default ModalContainer;\n"],"file":"ModalContainer.js"}

package/dist/cjs/Modals/ModalDialog.js

@@ -1,348 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.ModalDialog = void 0;
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _Button = require("../Button");
-
-var _SystemIcons = require("../icons/systemicons/SystemIcons");
-
-var _styles = require("../styles");
-
-var _types = require("../types");
-
-var _ModalContainer = _interopRequireDefault(require("./ModalContainer"));
-
-var _ModalStyles = require("./ModalStyles");
-
-var _ModalNote = require("./ModalNote");
-
-var _Tooltips = require("../Tooltips");
-
-var _ = require("..");
-
-var _jsxRuntime = require("react/jsx-runtime");
-
-var ModalDialog = function ModalDialog(_ref) {
-  var size = _ref.size,
-      isModalOpen = _ref.isModalOpen,
-      closeModalAndClearInput = _ref.closeModalAndClearInput,
-      title = _ref.title,
-      topImage = _ref.topImage,
-      buttons = _ref.buttons,
-      leftFooterAction = _ref.leftFooterAction,
-      backButton = _ref.backButton,
-      closeAction = _ref.closeAction,
-      submitAction = _ref.submitAction,
-      tooltip = _ref.tooltip,
-      children = _ref.children,
-      note = _ref.note,
-      state = _ref.state,
-      icon = _ref.icon;
-
-  var getMinWidth = function getMinWidth() {
-    switch (size) {
-      case _types.Size.Small:
-        return '320px';
-
-      case _types.Size.Large:
-        return '640px';
-
-      case _types.Size.Medium:
-      default:
-        return '480px';
-    }
-  };
-
-  var getMaxWidth = function getMaxWidth() {
-    switch (size) {
-      case _types.Size.Small:
-        return '480px';
-
-      case _types.Size.Large:
-        return '720px';
-
-      case _types.Size.Medium:
-      default:
-        return '640px';
-    }
-  };
-
-  var getImageHeight = function getImageHeight() {
-    switch (size) {
-      case _types.Size.Small:
-        return 160;
-
-      case _types.Size.Medium:
-        return 200;
-
-      case _types.Size.Large:
-        return 240;
-
-      default:
-        return 200;
-    }
-  };
-
-  var getMarginBottom = function getMarginBottom() {
-    switch (size) {
-      case _types.Size.Small:
-        return '16px';
-
-      case _types.Size.Medium:
-        return '24px';
-
-      case _types.Size.Large:
-        return '32px';
-
-      default:
-        return '24px';
-    }
-  };
-
-  var getPadding = function getPadding() {
-    switch (size) {
-      case _types.Size.Small:
-        return '16px 16px 8px';
-
-      case _types.Size.Medium:
-        return '24px 24px 20px';
-
-      case _types.Size.Large:
-        return '32px';
-
-      default:
-        return '24px 24px 16px';
-    }
-  };
-
-  var ModalTitle = function ModalTitle(title, size) {
-    switch (size) {
-      case _types.Size.Small:
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ComponentM, {
-          textStyle: _styles.ComponentTextStyle.Bold,
-          children: title
-        });
-
-      case _types.Size.Medium:
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ComponentL, {
-          textStyle: _styles.ComponentTextStyle.Bold,
-          children: title
-        });
-
-      case _types.Size.Large:
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ComponentXL, {
-          textStyle: _styles.ComponentTextStyle.Bold,
-          children: title
-        });
-
-      default:
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ComponentL, {
-          textStyle: _styles.ComponentTextStyle.Bold,
-          children: title
-        });
-    }
-  };
-
-  var ModalTootip = function ModalTootip(tooltip) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ModalStyles.ModalHoverModifier, {
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltips.TooltipWrapper, {
-        delay: "0s",
-        size: _types.Size.XSmall,
-        align: "center",
-        position: "top",
-        withArrow: false,
-        label: tooltip,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
-          variant: "secondary",
-          shape: "circular",
-          action: function action() {},
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.Help, {
-            size: "24px",
-            color: _styles.COLORS.neutral_600
-          })
-        })
-      })
-    });
-  };
-
-  var ModalCloseButton = function ModalCloseButton(onClick) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ModalStyles.CloseButtonWrapper, {
-      hasImage: !!topImage,
-      size: size,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
-        variant: "secondary",
-        shape: "circular",
-        action: function action() {
-          return onClick();
-        },
-        borderRadius: 48,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.Close, {
-          size: "24px",
-          color: _styles.COLORS.black
-        })
-      })
-    });
-  };
-
-  var ModalBackButton = function ModalBackButton() {
-    if (backButton) {
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ModalStyles.BackButtonWrapper, {
-        hasImage: !!topImage,
-        size: size,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
-          variant: "secondary",
-          shape: "circular",
-          action: function action() {
-            return backButton();
-          },
-          borderRadius: 48,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.ArrowLineLeft, {
-            size: "24px",
-            color: _styles.COLORS.black
-          })
-        })
-      });
-    }
-  };
-
-  var getLeftActionIconElement = function getLeftActionIconElement(icon) {
-    return /*#__PURE__*/_react.default.cloneElement(icon, {
-      size: size === _types.Size.Small ? '20px' : size === _types.Size.Large ? '28px' : '24px'
-    });
-  };
-
-  var LeftFooterAction = function LeftFooterAction(leftFooterAction) {
-    var _variant;
-
-    var text = leftFooterAction.text,
-        actionType = leftFooterAction.actionType,
-        disabled = leftFooterAction.disabled,
-        icon = leftFooterAction.icon,
-        action = leftFooterAction.action;
-
-    switch (actionType) {
-      case 'button':
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.Button, {
-          id: 'left-action-button',
-          type: leftFooterAction === null || leftFooterAction === void 0 ? void 0 : leftFooterAction.type,
-          disabled: disabled,
-          loading: leftFooterAction === null || leftFooterAction === void 0 ? void 0 : leftFooterAction.loading,
-          icon: icon,
-          size: size,
-          onClick: action,
-          variant: (_variant = leftFooterAction === null || leftFooterAction === void 0 ? void 0 : leftFooterAction.variant) !== null && _variant !== void 0 ? _variant : 'secondary',
-          style: {
-            order: -1,
-            marginRight: 'auto'
-          },
-          children: text
-        });
-
-      case 'hyperlink':
-        return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.HyperLink, {
-          id: "left-action-hyperlink",
-          className: "footer-action",
-          href: leftFooterAction.href,
-          disabled: disabled,
-          variant: "default",
-          onClick: function onClick(e) {
-            if (action) {
-              e.preventDefault();
-              action(e);
-            }
-          },
-          children: [icon && getLeftActionIconElement(icon), text]
-        });
-
-      case 'note':
-        return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-          className: "footer-action note",
-          children: [icon && getLeftActionIconElement(icon), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-            children: text
-          })]
-        });
-    }
-  };
-
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ModalContainer.default, {
-    showModal: isModalOpen,
-    closeModal: closeModalAndClearInput,
-    minWidth: getMinWidth(),
-    maxWidth: getMaxWidth(),
-    modalHeight: "auto",
-    padding: getPadding(),
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ModalStyles.Column, {
-      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("form", {
-        onSubmit: submitAction,
-        children: [topImage && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ModalStyles.StyledModalHeader, {
-          size: size,
-          height: getImageHeight(),
-          marginBottom: getMarginBottom(),
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-            src: topImage,
-            alt: "Modal top"
-          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ModalStyles.ModalHeaderActionsWithImage, {
-            hasBackButton: !!backButton,
-            children: [ModalBackButton(), ModalCloseButton(closeAction)]
-          })]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ModalStyles.ModalTitleSection, {
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_ModalStyles.FlexContainer, {
-            children: [!topImage && ModalBackButton(), title && ModalTitle(title, size)]
-          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ModalStyles.ModalHeaderActions, {
-            children: [tooltip && ModalTootip(tooltip), !topImage && ModalCloseButton(closeAction)]
-          })]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ModalStyles.ModalBody, {
-          size: size,
-          children: children
-        }), note && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ModalNote.ModalNote, {
-          note: note,
-          state: state,
-          size: size,
-          icon: icon
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ModalStyles.ModalFooter, {
-          size: size,
-          children: [leftFooterAction && LeftFooterAction(leftFooterAction), buttons === null || buttons === void 0 ? void 0 : buttons.map(function (b, i) {
-            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.Button, {
-              id: b.id,
-              disabled: b.disabled,
-              loading: b.loading,
-              size: size,
-              onClick: b.action,
-              type: b.type,
-              variant: b.variant,
-              children: b.text
-            }, b.id || i);
-          })]
-        })]
-      })
-    })
-  });
-};
-
-exports.ModalDialog = ModalDialog;
-ModalDialog.propTypes = {
-  isModalOpen: _propTypes.default.bool.isRequired,
-  closeModalAndClearInput: _propTypes.default.any.isRequired,
-  title: _propTypes.default.string,
-  topImage: _propTypes.default.any,
-  buttons: _propTypes.default.array,
-  tooltip: _propTypes.default.string,
-  backButton: _propTypes.default.func,
-  closeAction: _propTypes.default.func.isRequired,
-  submitAction: _propTypes.default.func.isRequired,
-  note: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
-  state: _propTypes.default.string,
-  icon: _propTypes.default.node
-};
-var _default = ModalDialog;
-exports.default = _default;
-//# sourceMappingURL=ModalDialog.js.map