@laerdal/life-react-components 2.3.0 → 2.3.1-dev.1

package/dist/Modals/ModalContent.cjs

@@ -16,7 +16,7 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _styles = require("../styles");
 var _Tooltips = require("../Tooltips");
 var _Button = require("../Button");
-var _SystemIcons = require("../icons/systemicons/SystemIcons");
+var _icons = require("../icons");
 var _HyperLink = require("../HyperLink");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["icon"],
@@ -26,7 +26,7 @@ var _excluded = ["icon"],
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12;
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-var HeaderText = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n\n  padding: 12px 0 12px 12px;\n  gap: 4px\n"])));
+var HeaderText = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n\n  padding: 12px 0 12px 12px;\n  gap: 4px;\n  \n  &:not(:first-child) {\n    padding-left: 0 !important;\n  }\n  \n"])));
 var HeaderTitle = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n"])), (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.black));
 var HeaderNote = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n"])), (0, _styles.ComponentXXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600));
 var HeaderActions = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: row;\n"])));
@@ -55,7 +55,7 @@ var ModalContent = function ModalContent(props) {
           cursor: 'help'
         },
         action: function action() {},
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.Help, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.Help, {
           size: "24px",
           color: _styles.COLORS.neutral_600
         })
@@ -132,7 +132,12 @@ var ModalContent = function ModalContent(props) {
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(Wrapper, {
       className: (_props$size = props.size) !== null && _props$size !== void 0 ? _props$size : _types.Size.Medium,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(Header, {
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(HeaderText, {
+        children: [props.onBack && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
+          variant: "secondary",
+          shape: "circular",
+          action: props.onBack,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.ArrowLineLeft, {})
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(HeaderText, {
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(HeaderTitle, {
             children: props.title
           }), !!props.note && /*#__PURE__*/(0, _jsxRuntime.jsx)(HeaderNote, {
@@ -145,7 +150,7 @@ var ModalContent = function ModalContent(props) {
             variant: "secondary",
             shape: "circular",
             action: props.closeAction,
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.Close, {
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.Close, {
               size: "24px",
               color: _styles.COLORS.neutral_600
             })
@@ -178,6 +183,7 @@ var ModalContent = function ModalContent(props) {
 ModalContent.propTypes = {
   isModalOpen: _propTypes.default.bool.isRequired,
   closeAction: _propTypes.default.func.isRequired,
+  onBack: _propTypes.default.func,
   title: _propTypes.default.string.isRequired,
   note: _propTypes.default.string,
   headerActions: _propTypes.default.array,

package/dist/Modals/ModalContent.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ModalContent.cjs","names":["HeaderText","styled","div","HeaderTitle","ComponentMStyling","ComponentTextStyle","Bold","COLORS","black","HeaderNote","ComponentXXSStyling","Regular","neutral_600","HeaderActions","Header","TooltipContainer","Content","scrollBarStyling","Size","Small","FooterLeftContainer","FooterLeftNote","FooterLeftLink","ComponentSStyling","primary_500","FooterRightContainer","Footer","Wrapper","ComponentLStyling","ComponentXSStyling","ComponentXLStyling","ModalContent","props","tooltip","XSmall","cursor","headerActions","map","action","index","icon","rest","id","getLeftActionIconElement","leftFooterAction","React","cloneElement","size","Large","actionType","text","variant","e","preventDefault","isModalOpen","closeAction","Medium","title","note","children","footerActions","item","a","key","zIndex"],"sources":["../../src/Modals/ModalContent.tsx"],"sourcesContent":["import React from 'react';\nimport {Size} from '../types';\nimport {ButtonAction, IconButtonAction, LeftFooterAction, LeftFooterButton, LeftFooterHyperlink} from './ModalTypes';\nimport {ModalContainer} from './index';\nimport styled from 'styled-components';\nimport {\n  COLORS,\n  ComponentLStyling,\n  ComponentMStyling, ComponentSStyling,\n  ComponentTextStyle, ComponentXLStyling,\n  ComponentXSStyling,\n  ComponentXXSStyling,\n  scrollBarStyling\n} from '../styles';\nimport {TooltipContainer, TooltipWrapper} from '../Tooltips';\nimport {Button, IconButton} from '../Button';\nimport {Close, Help} from '../icons/systemicons/SystemIcons';\nimport {HyperLink} from '../HyperLink';\n\nconst HeaderText = styled.div`\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n\n  padding: 12px 0 12px 12px;\n  gap: 4px\n`;\nconst HeaderTitle = styled.div`\n  ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.black)}\n`;\nconst HeaderNote = styled.div`\n  ${ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nconst HeaderActions = styled.div`\n  display: flex;\n  flex-direction: row;\n`;\n\nconst Header = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 4px;\n\n  ${TooltipContainer} {\n    height: max-content;\n  }\n`;\n\nconst Content = styled.div`\n  margin-right: 8px;\n  padding: 0 8px 0 16px;\n  overflow: auto;\n\n  ${scrollBarStyling(Size.Small)}\n`;\n\nconst FooterLeftContainer = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nconst FooterLeftNote = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 4px;\n\n  ${ComponentXXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst FooterLeftLink = styled.div`\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.primary_500)}\n  a {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: 4px;\n  }\n`;\n\nconst FooterRightContainer = styled.div`\n  gap: 8px;\n  margin-left: auto;\n`\n\nconst Footer = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 8px 16px;\n`;\n\n\nconst Wrapper = styled.div`\n  display: flex;\n  flex-direction: column;\n  width: max-content;\n\n  max-height: calc(100vh - 32px);\n  max-width: calc(100vw - 32px);\n\n  &.medium {\n    max-height: calc(100vh - 64px);\n    max-width: calc(100vw - 64px);\n\n    ${Header} {\n      padding: 12px 12px 4px 12px;\n\n      ${HeaderText} {\n        padding: 12px 0 12px 12px;\n        gap: 4px;\n\n        ${HeaderTitle} {\n          ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n        }\n\n        ${HeaderNote} {\n          ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n        }\n      }\n    }\n\n    ${Content} {\n      padding: 0 16px 0 24px;\n    }\n\n    ${Footer} {\n      padding: 12px 24px 20px 24px;\n\n      ${FooterLeftNote} {\n        ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n        gap: 6px;\n      }\n\n      ${FooterLeftLink} {\n        a {\n          gap: 6px;\n        }\n\n        ${ComponentMStyling(ComponentTextStyle.Bold, null)}\n      }\n\n      ${FooterRightContainer} {\n        gap: 8px;\n      }\n    }\n  }\n\n  &.large {\n    max-height: calc(100vh - 112px);\n    max-width: calc(100vw - 112px);\n\n    ${Header} {\n      padding: 20px 20px 4px 20px;\n\n      ${HeaderText} {\n        padding: 10px 0 10px 12px;\n        gap: 8px;\n\n        ${HeaderTitle} {\n          ${ComponentXLStyling(ComponentTextStyle.Bold, null)}\n        }\n\n        ${HeaderNote} {\n          ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n        }\n      }\n    }\n\n    ${Content} {\n      padding: 0 24px 0 32px;\n    }\n\n    ${Footer} {\n      padding: 16px 32px 32px 32px;\n\n      ${FooterLeftNote} {\n        ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n        gap: 8px;\n      }\n\n      ${FooterLeftLink} {\n        a {\n          gap: 8px;\n        }\n\n        ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n      }\n\n      ${FooterRightContainer} {\n        gap: 16px;\n      }\n    }\n  }\n`;\n\n\ninterface ModalContentProps {\n  size?: Size.Small | Size.Medium | Size.Large;\n  isModalOpen: boolean;\n  closeAction: () => void;\n  title: string;\n  note?: string;\n  headerActions?: IconButtonAction[];\n  footerActions?: ButtonAction[];\n  leftFooterAction?: LeftFooterAction;\n  tooltip?: string;\n  zIndex?: number;\n  children?: React.ReactNode;\n}\n\nconst ModalContent: React.FC<ModalContentProps> = (props) => {\n\n  const tooltip = () =>\n    !!props.tooltip &&\n    <TooltipWrapper delay=\"0s\" size={Size.XSmall} align=\"center\" position=\"bottom\" withArrow={false}\n                    label={props.tooltip}>\n      <IconButton variant=\"secondary\" shape=\"circular\" style={{cursor: 'help'}} action={() => {\n      }}>\n        <Help size=\"24px\" color={COLORS.neutral_600}/>\n      </IconButton>\n    </TooltipWrapper>;\n\n  const headerActions = () => props.headerActions?.map((action, index) => {\n      const {icon, ...rest} = action;\n      return <IconButton key={action.id || index}\n                         {...rest}>\n        {icon}\n      </IconButton>\n    }\n  );\n\n  const getLeftActionIconElement = () =>\n    !!props.leftFooterAction?.icon &&\n    React.cloneElement(props.leftFooterAction?.icon as React.ReactElement, {\n      size:\n        props.size === Size.Small\n          ? '20px'\n          : props.size === Size.Large\n            ? '28px'\n            : '24px'\n    });\n\n  const leftFooterAction = () => {\n    if (!props.leftFooterAction) return null;\n\n    switch (props.leftFooterAction.actionType) {\n      case 'button': {\n        const {text, variant, action, ...rest} = props.leftFooterAction as LeftFooterButton;\n        return (\n          <Button{...rest}\n                 size={props.size}\n                 onClick={action}\n                 variant={variant ?? 'secondary'}>\n            {text}\n          </Button>\n        );\n      }\n      case 'hyperlink': {\n        const {text, variant, action, ...rest} = props.leftFooterAction as LeftFooterHyperlink;\n        return (\n          <FooterLeftLink>\n            <HyperLink {...rest}\n                       variant={variant ?? 'default'}\n                       onClick={(e) => {\n                         if (action) {\n                           e.preventDefault();\n                           action(e);\n                         }\n                       }}>\n              {getLeftActionIconElement()}\n              {text}\n            </HyperLink>\n          </FooterLeftLink>\n        );\n\n      }\n      case 'note': {\n        const {text} = props.leftFooterAction;\n        return (\n          <FooterLeftNote>\n            {getLeftActionIconElement()}\n            <span>{text}</span>\n          </FooterLeftNote>\n        );\n      }\n    }\n  };\n\n\n  return (\n    <ModalContainer showModal={props.isModalOpen} closeModal={props.closeAction}>\n      <Wrapper className={props.size ?? Size.Medium}>\n        <Header>\n          <HeaderText>\n            <HeaderTitle>{props.title}</HeaderTitle>\n            {!!props.note && <HeaderNote>{props.note}</HeaderNote>}\n          </HeaderText>\n          <HeaderActions>\n            {tooltip()}\n            {headerActions()}\n            <IconButton dataTestId={'content-modal-close-button'} id={'content-modal-close-button'} variant=\"secondary\" shape=\"circular\"\n                        action={props.closeAction}>\n              <Close size=\"24px\" color={COLORS.neutral_600}/>\n            </IconButton>\n          </HeaderActions>\n        </Header>\n        <Content>\n          {props.children}\n        </Content>\n        <Footer>\n          <FooterLeftContainer>\n            {leftFooterAction()}\n          </FooterLeftContainer>\n          <FooterRightContainer>\n            {props.footerActions?.map((item, index) => {\n                const {action, text, ...rest} = item;\n                return <Button key={rest.id || index}\n                               {...rest}\n                               onClick={action}\n                               size={props.size}\n                               onKeyDown={a => (a.key === 'Enter' || a.key === ' ') && action!(a)}>\n                  {text}\n                </Button>\n              }\n            )}\n          </FooterRightContainer>\n        </Footer>\n      </Wrapper>\n    </ModalContainer>\n  );\n};\n\nexport default ModalContent;\n"],"mappings":"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"}
+{"version":3,"file":"ModalContent.cjs","names":["HeaderText","styled","div","HeaderTitle","ComponentMStyling","ComponentTextStyle","Bold","COLORS","black","HeaderNote","ComponentXXSStyling","Regular","neutral_600","HeaderActions","Header","TooltipContainer","Content","scrollBarStyling","Size","Small","FooterLeftContainer","FooterLeftNote","FooterLeftLink","ComponentSStyling","primary_500","FooterRightContainer","Footer","Wrapper","ComponentLStyling","ComponentXSStyling","ComponentXLStyling","ModalContent","props","tooltip","XSmall","cursor","headerActions","map","action","index","icon","rest","id","getLeftActionIconElement","leftFooterAction","React","cloneElement","size","Large","actionType","text","variant","e","preventDefault","isModalOpen","closeAction","Medium","onBack","title","note","children","footerActions","item","a","key","zIndex"],"sources":["../../src/Modals/ModalContent.tsx"],"sourcesContent":["import React from 'react';\nimport {Size} from '../types';\nimport {ButtonAction, IconButtonAction, LeftFooterAction, LeftFooterButton, LeftFooterHyperlink} from './ModalTypes';\nimport {ModalContainer} from './index';\nimport styled from 'styled-components';\nimport {\n  COLORS,\n  ComponentLStyling,\n  ComponentMStyling, ComponentSStyling,\n  ComponentTextStyle, ComponentXLStyling,\n  ComponentXSStyling,\n  ComponentXXSStyling,\n  scrollBarStyling\n} from '../styles';\nimport {TooltipContainer, TooltipWrapper} from '../Tooltips';\nimport {Button, IconButton} from '../Button';\nimport {SystemIcons} from '../icons';\nimport {HyperLink} from '../HyperLink';\n\nconst HeaderText = styled.div`\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n\n  padding: 12px 0 12px 12px;\n  gap: 4px;\n  \n  &:not(:first-child) {\n    padding-left: 0 !important;\n  }\n  \n`;\nconst HeaderTitle = styled.div`\n  ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.black)}\n`;\nconst HeaderNote = styled.div`\n  ${ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nconst HeaderActions = styled.div`\n  display: flex;\n  flex-direction: row;\n`;\n\nconst Header = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 4px;\n\n  ${TooltipContainer} {\n    height: max-content;\n  }\n`;\n\nconst Content = styled.div`\n  margin-right: 8px;\n  padding: 0 8px 0 16px;\n  overflow: auto;\n\n  ${scrollBarStyling(Size.Small)}\n`;\n\nconst FooterLeftContainer = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nconst FooterLeftNote = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 4px;\n\n  ${ComponentXXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst FooterLeftLink = styled.div`\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.primary_500)}\n  a {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: 4px;\n  }\n`;\n\nconst FooterRightContainer = styled.div`\n  gap: 8px;\n  margin-left: auto;\n`\n\nconst Footer = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 8px 16px;\n`;\n\n\nconst Wrapper = styled.div`\n  display: flex;\n  flex-direction: column;\n  width: max-content;\n\n  max-height: calc(100vh - 32px);\n  max-width: calc(100vw - 32px);\n\n  &.medium {\n    max-height: calc(100vh - 64px);\n    max-width: calc(100vw - 64px);\n\n    ${Header} {\n      padding: 12px 12px 4px 12px;\n\n      ${HeaderText} {\n        padding: 12px 0 12px 12px;\n        gap: 4px;\n\n        ${HeaderTitle} {\n          ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n        }\n\n        ${HeaderNote} {\n          ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n        }\n      }\n    }\n\n    ${Content} {\n      padding: 0 16px 0 24px;\n    }\n\n    ${Footer} {\n      padding: 12px 24px 20px 24px;\n\n      ${FooterLeftNote} {\n        ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n        gap: 6px;\n      }\n\n      ${FooterLeftLink} {\n        a {\n          gap: 6px;\n        }\n\n        ${ComponentMStyling(ComponentTextStyle.Bold, null)}\n      }\n\n      ${FooterRightContainer} {\n        gap: 8px;\n      }\n    }\n  }\n\n  &.large {\n    max-height: calc(100vh - 112px);\n    max-width: calc(100vw - 112px);\n\n    ${Header} {\n      padding: 20px 20px 4px 20px;\n\n      ${HeaderText} {\n        padding: 10px 0 10px 12px;\n        gap: 8px;\n\n        ${HeaderTitle} {\n          ${ComponentXLStyling(ComponentTextStyle.Bold, null)}\n        }\n\n        ${HeaderNote} {\n          ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n        }\n      }\n    }\n\n    ${Content} {\n      padding: 0 24px 0 32px;\n    }\n\n    ${Footer} {\n      padding: 16px 32px 32px 32px;\n\n      ${FooterLeftNote} {\n        ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n        gap: 8px;\n      }\n\n      ${FooterLeftLink} {\n        a {\n          gap: 8px;\n        }\n\n        ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n      }\n\n      ${FooterRightContainer} {\n        gap: 16px;\n      }\n    }\n  }\n`;\n\n\ninterface ModalContentProps {\n  size?: Size.Small | Size.Medium | Size.Large;\n  isModalOpen: boolean;\n  closeAction: () => void;\n  onBack?: () => void;\n  title: string;\n  note?: string;\n  headerActions?: IconButtonAction[];\n  footerActions?: ButtonAction[];\n  leftFooterAction?: LeftFooterAction;\n  tooltip?: string;\n  zIndex?: number;\n  children?: React.ReactNode;\n}\n\nconst ModalContent: React.FC<ModalContentProps> = (props) => {\n\n  const tooltip = () =>\n    !!props.tooltip &&\n    <TooltipWrapper delay=\"0s\" size={Size.XSmall} align=\"center\" position=\"bottom\" withArrow={false}\n                    label={props.tooltip}>\n      <IconButton variant=\"secondary\" shape=\"circular\" style={{cursor: 'help'}} action={() => {\n      }}>\n        <SystemIcons.Help size=\"24px\" color={COLORS.neutral_600}/>\n      </IconButton>\n    </TooltipWrapper>;\n\n  const headerActions = () => props.headerActions?.map((action, index) => {\n      const {icon, ...rest} = action;\n      return <IconButton key={action.id || index}\n                         {...rest}>\n        {icon}\n      </IconButton>\n    }\n  );\n\n  const getLeftActionIconElement = () =>\n    !!props.leftFooterAction?.icon &&\n    React.cloneElement(props.leftFooterAction?.icon as React.ReactElement, {\n      size:\n        props.size === Size.Small\n          ? '20px'\n          : props.size === Size.Large\n            ? '28px'\n            : '24px'\n    });\n\n  const leftFooterAction = () => {\n    if (!props.leftFooterAction) return null;\n\n    switch (props.leftFooterAction.actionType) {\n      case 'button': {\n        const {text, variant, action, ...rest} = props.leftFooterAction as LeftFooterButton;\n        return (\n          <Button{...rest}\n                 size={props.size}\n                 onClick={action}\n                 variant={variant ?? 'secondary'}>\n            {text}\n          </Button>\n        );\n      }\n      case 'hyperlink': {\n        const {text, variant, action, ...rest} = props.leftFooterAction as LeftFooterHyperlink;\n        return (\n          <FooterLeftLink>\n            <HyperLink {...rest}\n                       variant={variant ?? 'default'}\n                       onClick={(e) => {\n                         if (action) {\n                           e.preventDefault();\n                           action(e);\n                         }\n                       }}>\n              {getLeftActionIconElement()}\n              {text}\n            </HyperLink>\n          </FooterLeftLink>\n        );\n\n      }\n      case 'note': {\n        const {text} = props.leftFooterAction;\n        return (\n          <FooterLeftNote>\n            {getLeftActionIconElement()}\n            <span>{text}</span>\n          </FooterLeftNote>\n        );\n      }\n    }\n  };\n\n\n  return (\n    <ModalContainer showModal={props.isModalOpen} closeModal={props.closeAction}>\n      <Wrapper className={props.size ?? Size.Medium}>\n        <Header>\n          {\n            props.onBack &&\n            <IconButton variant=\"secondary\" shape=\"circular\" action={props.onBack}>\n              <SystemIcons.ArrowLineLeft/>\n            </IconButton>\n          }\n          <HeaderText>\n            <HeaderTitle>{props.title}</HeaderTitle>\n            {!!props.note && <HeaderNote>{props.note}</HeaderNote>}\n          </HeaderText>\n          <HeaderActions>\n            {tooltip()}\n            {headerActions()}\n            <IconButton dataTestId={'content-modal-close-button'} id={'content-modal-close-button'} variant=\"secondary\" shape=\"circular\"\n                        action={props.closeAction}>\n              <SystemIcons.Close size=\"24px\" color={COLORS.neutral_600}/>\n            </IconButton>\n          </HeaderActions>\n        </Header>\n        <Content>\n          {props.children}\n        </Content>\n        <Footer>\n          <FooterLeftContainer>\n            {leftFooterAction()}\n          </FooterLeftContainer>\n          <FooterRightContainer>\n            {props.footerActions?.map((item, index) => {\n                const {action, text, ...rest} = item;\n                return <Button key={rest.id || index}\n                               {...rest}\n                               onClick={action}\n                               size={props.size}\n                               onKeyDown={a => (a.key === 'Enter' || a.key === ' ') && action!(a)}>\n                  {text}\n                </Button>\n              }\n            )}\n          </FooterRightContainer>\n        </Footer>\n      </Wrapper>\n    </ModalContainer>\n  );\n};\n\nexport default ModalContent;\n"],"mappings":"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"}

package/dist/Modals/ModalContent.d.ts

@@ -5,6 +5,7 @@ interface ModalContentProps {
     size?: Size.Small | Size.Medium | Size.Large;
     isModalOpen: boolean;
     closeAction: () => void;
+    onBack?: () => void;
     title: string;
     note?: string;
     headerActions?: IconButtonAction[];

package/dist/Modals/ModalContent.js

@@ -16,11 +16,11 @@ import styled from 'styled-components';
 import { COLORS, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle, ComponentXLStyling, ComponentXSStyling, ComponentXXSStyling, scrollBarStyling } from '../styles';
 import { TooltipContainer, TooltipWrapper } from '../Tooltips';
 import { Button, IconButton } from '../Button';
-import { Close, Help } from '../icons/systemicons/SystemIcons';
+import { SystemIcons } from '../icons';
 import { HyperLink } from '../HyperLink';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-var HeaderText = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n\n  padding: 12px 0 12px 12px;\n  gap: 4px\n"])));
+var HeaderText = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n\n  padding: 12px 0 12px 12px;\n  gap: 4px;\n  \n  &:not(:first-child) {\n    padding-left: 0 !important;\n  }\n  \n"])));
 var HeaderTitle = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  ", "\n"])), ComponentMStyling(ComponentTextStyle.Bold, COLORS.black));
 var HeaderNote = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  ", "\n"])), ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600));
 var HeaderActions = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n"])));
@@ -49,7 +49,7 @@ var ModalContent = function ModalContent(props) {
           cursor: 'help'
         },
         action: function action() {},
-        children: /*#__PURE__*/_jsx(Help, {
+        children: /*#__PURE__*/_jsx(SystemIcons.Help, {
           size: "24px",
           color: COLORS.neutral_600
         })
@@ -126,7 +126,12 @@ var ModalContent = function ModalContent(props) {
     children: /*#__PURE__*/_jsxs(Wrapper, {
       className: (_props$size = props.size) !== null && _props$size !== void 0 ? _props$size : Size.Medium,
       children: [/*#__PURE__*/_jsxs(Header, {
-        children: [/*#__PURE__*/_jsxs(HeaderText, {
+        children: [props.onBack && /*#__PURE__*/_jsx(IconButton, {
+          variant: "secondary",
+          shape: "circular",
+          action: props.onBack,
+          children: /*#__PURE__*/_jsx(SystemIcons.ArrowLineLeft, {})
+        }), /*#__PURE__*/_jsxs(HeaderText, {
           children: [/*#__PURE__*/_jsx(HeaderTitle, {
             children: props.title
           }), !!props.note && /*#__PURE__*/_jsx(HeaderNote, {
@@ -139,7 +144,7 @@ var ModalContent = function ModalContent(props) {
             variant: "secondary",
             shape: "circular",
             action: props.closeAction,
-            children: /*#__PURE__*/_jsx(Close, {
+            children: /*#__PURE__*/_jsx(SystemIcons.Close, {
               size: "24px",
               color: COLORS.neutral_600
             })
@@ -172,6 +177,7 @@ var ModalContent = function ModalContent(props) {
 ModalContent.propTypes = {
   isModalOpen: _pt.bool.isRequired,
   closeAction: _pt.func.isRequired,
+  onBack: _pt.func,
   title: _pt.string.isRequired,
   note: _pt.string,
   headerActions: _pt.array,

package/dist/Modals/ModalContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalContent.js","names":["React","Size","ModalContainer","styled","COLORS","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXLStyling","ComponentXSStyling","ComponentXXSStyling","scrollBarStyling","TooltipContainer","TooltipWrapper","Button","IconButton","Close","Help","HyperLink","HeaderText","div","HeaderTitle","Bold","black","HeaderNote","Regular","neutral_600","HeaderActions","Header","Content","Small","FooterLeftContainer","FooterLeftNote","FooterLeftLink","primary_500","FooterRightContainer","Footer","Wrapper","ModalContent","props","tooltip","XSmall","cursor","headerActions","map","action","index","icon","rest","id","getLeftActionIconElement","leftFooterAction","cloneElement","size","Large","actionType","text","variant","e","preventDefault","isModalOpen","closeAction","Medium","title","note","children","footerActions","item","a","key","zIndex"],"sources":["../../src/Modals/ModalContent.tsx"],"sourcesContent":["import React from 'react';\nimport {Size} from '../types';\nimport {ButtonAction, IconButtonAction, LeftFooterAction, LeftFooterButton, LeftFooterHyperlink} from './ModalTypes';\nimport {ModalContainer} from './index';\nimport styled from 'styled-components';\nimport {\n  COLORS,\n  ComponentLStyling,\n  ComponentMStyling, ComponentSStyling,\n  ComponentTextStyle, ComponentXLStyling,\n  ComponentXSStyling,\n  ComponentXXSStyling,\n  scrollBarStyling\n} from '../styles';\nimport {TooltipContainer, TooltipWrapper} from '../Tooltips';\nimport {Button, IconButton} from '../Button';\nimport {Close, Help} from '../icons/systemicons/SystemIcons';\nimport {HyperLink} from '../HyperLink';\n\nconst HeaderText = styled.div`\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n\n  padding: 12px 0 12px 12px;\n  gap: 4px\n`;\nconst HeaderTitle = styled.div`\n  ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.black)}\n`;\nconst HeaderNote = styled.div`\n  ${ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nconst HeaderActions = styled.div`\n  display: flex;\n  flex-direction: row;\n`;\n\nconst Header = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 4px;\n\n  ${TooltipContainer} {\n    height: max-content;\n  }\n`;\n\nconst Content = styled.div`\n  margin-right: 8px;\n  padding: 0 8px 0 16px;\n  overflow: auto;\n\n  ${scrollBarStyling(Size.Small)}\n`;\n\nconst FooterLeftContainer = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nconst FooterLeftNote = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 4px;\n\n  ${ComponentXXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst FooterLeftLink = styled.div`\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.primary_500)}\n  a {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: 4px;\n  }\n`;\n\nconst FooterRightContainer = styled.div`\n  gap: 8px;\n  margin-left: auto;\n`\n\nconst Footer = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 8px 16px;\n`;\n\n\nconst Wrapper = styled.div`\n  display: flex;\n  flex-direction: column;\n  width: max-content;\n\n  max-height: calc(100vh - 32px);\n  max-width: calc(100vw - 32px);\n\n  &.medium {\n    max-height: calc(100vh - 64px);\n    max-width: calc(100vw - 64px);\n\n    ${Header} {\n      padding: 12px 12px 4px 12px;\n\n      ${HeaderText} {\n        padding: 12px 0 12px 12px;\n        gap: 4px;\n\n        ${HeaderTitle} {\n          ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n        }\n\n        ${HeaderNote} {\n          ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n        }\n      }\n    }\n\n    ${Content} {\n      padding: 0 16px 0 24px;\n    }\n\n    ${Footer} {\n      padding: 12px 24px 20px 24px;\n\n      ${FooterLeftNote} {\n        ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n        gap: 6px;\n      }\n\n      ${FooterLeftLink} {\n        a {\n          gap: 6px;\n        }\n\n        ${ComponentMStyling(ComponentTextStyle.Bold, null)}\n      }\n\n      ${FooterRightContainer} {\n        gap: 8px;\n      }\n    }\n  }\n\n  &.large {\n    max-height: calc(100vh - 112px);\n    max-width: calc(100vw - 112px);\n\n    ${Header} {\n      padding: 20px 20px 4px 20px;\n\n      ${HeaderText} {\n        padding: 10px 0 10px 12px;\n        gap: 8px;\n\n        ${HeaderTitle} {\n          ${ComponentXLStyling(ComponentTextStyle.Bold, null)}\n        }\n\n        ${HeaderNote} {\n          ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n        }\n      }\n    }\n\n    ${Content} {\n      padding: 0 24px 0 32px;\n    }\n\n    ${Footer} {\n      padding: 16px 32px 32px 32px;\n\n      ${FooterLeftNote} {\n        ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n        gap: 8px;\n      }\n\n      ${FooterLeftLink} {\n        a {\n          gap: 8px;\n        }\n\n        ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n      }\n\n      ${FooterRightContainer} {\n        gap: 16px;\n      }\n    }\n  }\n`;\n\n\ninterface ModalContentProps {\n  size?: Size.Small | Size.Medium | Size.Large;\n  isModalOpen: boolean;\n  closeAction: () => void;\n  title: string;\n  note?: string;\n  headerActions?: IconButtonAction[];\n  footerActions?: ButtonAction[];\n  leftFooterAction?: LeftFooterAction;\n  tooltip?: string;\n  zIndex?: number;\n  children?: React.ReactNode;\n}\n\nconst ModalContent: React.FC<ModalContentProps> = (props) => {\n\n  const tooltip = () =>\n    !!props.tooltip &&\n    <TooltipWrapper delay=\"0s\" size={Size.XSmall} align=\"center\" position=\"bottom\" withArrow={false}\n                    label={props.tooltip}>\n      <IconButton variant=\"secondary\" shape=\"circular\" style={{cursor: 'help'}} action={() => {\n      }}>\n        <Help size=\"24px\" color={COLORS.neutral_600}/>\n      </IconButton>\n    </TooltipWrapper>;\n\n  const headerActions = () => props.headerActions?.map((action, index) => {\n      const {icon, ...rest} = action;\n      return <IconButton key={action.id || index}\n                         {...rest}>\n        {icon}\n      </IconButton>\n    }\n  );\n\n  const getLeftActionIconElement = () =>\n    !!props.leftFooterAction?.icon &&\n    React.cloneElement(props.leftFooterAction?.icon as React.ReactElement, {\n      size:\n        props.size === Size.Small\n          ? '20px'\n          : props.size === Size.Large\n            ? '28px'\n            : '24px'\n    });\n\n  const leftFooterAction = () => {\n    if (!props.leftFooterAction) return null;\n\n    switch (props.leftFooterAction.actionType) {\n      case 'button': {\n        const {text, variant, action, ...rest} = props.leftFooterAction as LeftFooterButton;\n        return (\n          <Button{...rest}\n                 size={props.size}\n                 onClick={action}\n                 variant={variant ?? 'secondary'}>\n            {text}\n          </Button>\n        );\n      }\n      case 'hyperlink': {\n        const {text, variant, action, ...rest} = props.leftFooterAction as LeftFooterHyperlink;\n        return (\n          <FooterLeftLink>\n            <HyperLink {...rest}\n                       variant={variant ?? 'default'}\n                       onClick={(e) => {\n                         if (action) {\n                           e.preventDefault();\n                           action(e);\n                         }\n                       }}>\n              {getLeftActionIconElement()}\n              {text}\n            </HyperLink>\n          </FooterLeftLink>\n        );\n\n      }\n      case 'note': {\n        const {text} = props.leftFooterAction;\n        return (\n          <FooterLeftNote>\n            {getLeftActionIconElement()}\n            <span>{text}</span>\n          </FooterLeftNote>\n        );\n      }\n    }\n  };\n\n\n  return (\n    <ModalContainer showModal={props.isModalOpen} closeModal={props.closeAction}>\n      <Wrapper className={props.size ?? Size.Medium}>\n        <Header>\n          <HeaderText>\n            <HeaderTitle>{props.title}</HeaderTitle>\n            {!!props.note && <HeaderNote>{props.note}</HeaderNote>}\n          </HeaderText>\n          <HeaderActions>\n            {tooltip()}\n            {headerActions()}\n            <IconButton dataTestId={'content-modal-close-button'} id={'content-modal-close-button'} variant=\"secondary\" shape=\"circular\"\n                        action={props.closeAction}>\n              <Close size=\"24px\" color={COLORS.neutral_600}/>\n            </IconButton>\n          </HeaderActions>\n        </Header>\n        <Content>\n          {props.children}\n        </Content>\n        <Footer>\n          <FooterLeftContainer>\n            {leftFooterAction()}\n          </FooterLeftContainer>\n          <FooterRightContainer>\n            {props.footerActions?.map((item, index) => {\n                const {action, text, ...rest} = item;\n                return <Button key={rest.id || index}\n                               {...rest}\n                               onClick={action}\n                               size={props.size}\n                               onKeyDown={a => (a.key === 'Enter' || a.key === ' ') && action!(a)}>\n                  {text}\n                </Button>\n              }\n            )}\n          </FooterRightContainer>\n        </Footer>\n      </Wrapper>\n    </ModalContainer>\n  );\n};\n\nexport default ModalContent;\n"],"mappings":"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"}
+{"version":3,"file":"ModalContent.js","names":["React","Size","ModalContainer","styled","COLORS","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXLStyling","ComponentXSStyling","ComponentXXSStyling","scrollBarStyling","TooltipContainer","TooltipWrapper","Button","IconButton","SystemIcons","HyperLink","HeaderText","div","HeaderTitle","Bold","black","HeaderNote","Regular","neutral_600","HeaderActions","Header","Content","Small","FooterLeftContainer","FooterLeftNote","FooterLeftLink","primary_500","FooterRightContainer","Footer","Wrapper","ModalContent","props","tooltip","XSmall","cursor","headerActions","map","action","index","icon","rest","id","getLeftActionIconElement","leftFooterAction","cloneElement","size","Large","actionType","text","variant","e","preventDefault","isModalOpen","closeAction","Medium","onBack","title","note","children","footerActions","item","a","key","zIndex"],"sources":["../../src/Modals/ModalContent.tsx"],"sourcesContent":["import React from 'react';\nimport {Size} from '../types';\nimport {ButtonAction, IconButtonAction, LeftFooterAction, LeftFooterButton, LeftFooterHyperlink} from './ModalTypes';\nimport {ModalContainer} from './index';\nimport styled from 'styled-components';\nimport {\n  COLORS,\n  ComponentLStyling,\n  ComponentMStyling, ComponentSStyling,\n  ComponentTextStyle, ComponentXLStyling,\n  ComponentXSStyling,\n  ComponentXXSStyling,\n  scrollBarStyling\n} from '../styles';\nimport {TooltipContainer, TooltipWrapper} from '../Tooltips';\nimport {Button, IconButton} from '../Button';\nimport {SystemIcons} from '../icons';\nimport {HyperLink} from '../HyperLink';\n\nconst HeaderText = styled.div`\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n\n  padding: 12px 0 12px 12px;\n  gap: 4px;\n  \n  &:not(:first-child) {\n    padding-left: 0 !important;\n  }\n  \n`;\nconst HeaderTitle = styled.div`\n  ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.black)}\n`;\nconst HeaderNote = styled.div`\n  ${ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nconst HeaderActions = styled.div`\n  display: flex;\n  flex-direction: row;\n`;\n\nconst Header = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 4px;\n\n  ${TooltipContainer} {\n    height: max-content;\n  }\n`;\n\nconst Content = styled.div`\n  margin-right: 8px;\n  padding: 0 8px 0 16px;\n  overflow: auto;\n\n  ${scrollBarStyling(Size.Small)}\n`;\n\nconst FooterLeftContainer = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nconst FooterLeftNote = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 4px;\n\n  ${ComponentXXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst FooterLeftLink = styled.div`\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.primary_500)}\n  a {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: 4px;\n  }\n`;\n\nconst FooterRightContainer = styled.div`\n  gap: 8px;\n  margin-left: auto;\n`\n\nconst Footer = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 8px 16px;\n`;\n\n\nconst Wrapper = styled.div`\n  display: flex;\n  flex-direction: column;\n  width: max-content;\n\n  max-height: calc(100vh - 32px);\n  max-width: calc(100vw - 32px);\n\n  &.medium {\n    max-height: calc(100vh - 64px);\n    max-width: calc(100vw - 64px);\n\n    ${Header} {\n      padding: 12px 12px 4px 12px;\n\n      ${HeaderText} {\n        padding: 12px 0 12px 12px;\n        gap: 4px;\n\n        ${HeaderTitle} {\n          ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n        }\n\n        ${HeaderNote} {\n          ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n        }\n      }\n    }\n\n    ${Content} {\n      padding: 0 16px 0 24px;\n    }\n\n    ${Footer} {\n      padding: 12px 24px 20px 24px;\n\n      ${FooterLeftNote} {\n        ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n        gap: 6px;\n      }\n\n      ${FooterLeftLink} {\n        a {\n          gap: 6px;\n        }\n\n        ${ComponentMStyling(ComponentTextStyle.Bold, null)}\n      }\n\n      ${FooterRightContainer} {\n        gap: 8px;\n      }\n    }\n  }\n\n  &.large {\n    max-height: calc(100vh - 112px);\n    max-width: calc(100vw - 112px);\n\n    ${Header} {\n      padding: 20px 20px 4px 20px;\n\n      ${HeaderText} {\n        padding: 10px 0 10px 12px;\n        gap: 8px;\n\n        ${HeaderTitle} {\n          ${ComponentXLStyling(ComponentTextStyle.Bold, null)}\n        }\n\n        ${HeaderNote} {\n          ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n        }\n      }\n    }\n\n    ${Content} {\n      padding: 0 24px 0 32px;\n    }\n\n    ${Footer} {\n      padding: 16px 32px 32px 32px;\n\n      ${FooterLeftNote} {\n        ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n        gap: 8px;\n      }\n\n      ${FooterLeftLink} {\n        a {\n          gap: 8px;\n        }\n\n        ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n      }\n\n      ${FooterRightContainer} {\n        gap: 16px;\n      }\n    }\n  }\n`;\n\n\ninterface ModalContentProps {\n  size?: Size.Small | Size.Medium | Size.Large;\n  isModalOpen: boolean;\n  closeAction: () => void;\n  onBack?: () => void;\n  title: string;\n  note?: string;\n  headerActions?: IconButtonAction[];\n  footerActions?: ButtonAction[];\n  leftFooterAction?: LeftFooterAction;\n  tooltip?: string;\n  zIndex?: number;\n  children?: React.ReactNode;\n}\n\nconst ModalContent: React.FC<ModalContentProps> = (props) => {\n\n  const tooltip = () =>\n    !!props.tooltip &&\n    <TooltipWrapper delay=\"0s\" size={Size.XSmall} align=\"center\" position=\"bottom\" withArrow={false}\n                    label={props.tooltip}>\n      <IconButton variant=\"secondary\" shape=\"circular\" style={{cursor: 'help'}} action={() => {\n      }}>\n        <SystemIcons.Help size=\"24px\" color={COLORS.neutral_600}/>\n      </IconButton>\n    </TooltipWrapper>;\n\n  const headerActions = () => props.headerActions?.map((action, index) => {\n      const {icon, ...rest} = action;\n      return <IconButton key={action.id || index}\n                         {...rest}>\n        {icon}\n      </IconButton>\n    }\n  );\n\n  const getLeftActionIconElement = () =>\n    !!props.leftFooterAction?.icon &&\n    React.cloneElement(props.leftFooterAction?.icon as React.ReactElement, {\n      size:\n        props.size === Size.Small\n          ? '20px'\n          : props.size === Size.Large\n            ? '28px'\n            : '24px'\n    });\n\n  const leftFooterAction = () => {\n    if (!props.leftFooterAction) return null;\n\n    switch (props.leftFooterAction.actionType) {\n      case 'button': {\n        const {text, variant, action, ...rest} = props.leftFooterAction as LeftFooterButton;\n        return (\n          <Button{...rest}\n                 size={props.size}\n                 onClick={action}\n                 variant={variant ?? 'secondary'}>\n            {text}\n          </Button>\n        );\n      }\n      case 'hyperlink': {\n        const {text, variant, action, ...rest} = props.leftFooterAction as LeftFooterHyperlink;\n        return (\n          <FooterLeftLink>\n            <HyperLink {...rest}\n                       variant={variant ?? 'default'}\n                       onClick={(e) => {\n                         if (action) {\n                           e.preventDefault();\n                           action(e);\n                         }\n                       }}>\n              {getLeftActionIconElement()}\n              {text}\n            </HyperLink>\n          </FooterLeftLink>\n        );\n\n      }\n      case 'note': {\n        const {text} = props.leftFooterAction;\n        return (\n          <FooterLeftNote>\n            {getLeftActionIconElement()}\n            <span>{text}</span>\n          </FooterLeftNote>\n        );\n      }\n    }\n  };\n\n\n  return (\n    <ModalContainer showModal={props.isModalOpen} closeModal={props.closeAction}>\n      <Wrapper className={props.size ?? Size.Medium}>\n        <Header>\n          {\n            props.onBack &&\n            <IconButton variant=\"secondary\" shape=\"circular\" action={props.onBack}>\n              <SystemIcons.ArrowLineLeft/>\n            </IconButton>\n          }\n          <HeaderText>\n            <HeaderTitle>{props.title}</HeaderTitle>\n            {!!props.note && <HeaderNote>{props.note}</HeaderNote>}\n          </HeaderText>\n          <HeaderActions>\n            {tooltip()}\n            {headerActions()}\n            <IconButton dataTestId={'content-modal-close-button'} id={'content-modal-close-button'} variant=\"secondary\" shape=\"circular\"\n                        action={props.closeAction}>\n              <SystemIcons.Close size=\"24px\" color={COLORS.neutral_600}/>\n            </IconButton>\n          </HeaderActions>\n        </Header>\n        <Content>\n          {props.children}\n        </Content>\n        <Footer>\n          <FooterLeftContainer>\n            {leftFooterAction()}\n          </FooterLeftContainer>\n          <FooterRightContainer>\n            {props.footerActions?.map((item, index) => {\n                const {action, text, ...rest} = item;\n                return <Button key={rest.id || index}\n                               {...rest}\n                               onClick={action}\n                               size={props.size}\n                               onKeyDown={a => (a.key === 'Enter' || a.key === ' ') && action!(a)}>\n                  {text}\n                </Button>\n              }\n            )}\n          </FooterRightContainer>\n        </Footer>\n      </Wrapper>\n    </ModalContainer>\n  );\n};\n\nexport default ModalContent;\n"],"mappings":"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"}

package/dist/Modals/ModalDialog.cjs

@@ -8,7 +8,7 @@ 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 _icons = require("../icons");
 var _styles = require("../styles");
 var _types = require("../types");
 var _ModalContainer = _interopRequireDefault(require("./ModalContainer"));
@@ -150,7 +150,7 @@ var ModalDialog = function ModalDialog(_ref) {
           variant: "secondary",
           shape: "circular",
           action: function action() {},
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.Help, {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.Help, {
             size: "24px",
             color: _styles.COLORS.neutral_600
           })
@@ -169,7 +169,7 @@ var ModalDialog = function ModalDialog(_ref) {
           return onClick();
         },
         borderRadius: 48,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.Close, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.Close, {
           size: "24px",
           color: _styles.COLORS.black
         })
@@ -188,7 +188,7 @@ var ModalDialog = function ModalDialog(_ref) {
             return backButton();
           },
           borderRadius: 48,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.ArrowLineLeft, {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.ArrowLineLeft, {
             size: "24px",
             color: _styles.COLORS.black
           })

package/dist/Modals/ModalDialog.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ModalDialog.cjs","names":["ModalDialog","size","isModalOpen","closeModalAndClearInput","title","topImage","topImageWithFallbacksProps","topImageGrayscale","buttons","leftFooterAction","backButton","closeAction","submitAction","tooltip","children","note","state","icon","zIndex","contentOverflow","width","hasContentBorders","getMinWidth","Size","Small","Large","Medium","getMaxWidth","getImageHeight","getMarginBottom","getPadding","getMaxHeight","ModalTitle","ComponentTextStyle","Bold","ModalTootip","XSmall","COLORS","neutral_600","ModalCloseButton","onClick","black","ModalBackButton","getLeftActionIconElement","React","cloneElement","LeftFooterAction","text","actionType","disabled","action","type","loading","variant","order","marginRight","href","e","preventDefault","display","flexDirection","maxHeight","loader","alt","fallbacks","src","map","b","i","id"],"sources":["../../src/Modals/ModalDialog.tsx"],"sourcesContent":["import React from 'react';\nimport { Button, IconButton } from '../Button';\nimport { ArrowLineLeft, Close, Help } from '../icons/systemicons/SystemIcons';\nimport { COLORS, ComponentL, ComponentM, ComponentTextStyle, ComponentXL } from '../styles';\nimport { Size } from '../types';\nimport ModalContainer from './ModalContainer';\nimport {\n  BackButtonWrapper,\n  CloseButtonWrapper,\n  Column,\n  FlexContainer,\n  ModalBody,\n  ModalFooter,\n  ModalHeaderActions,\n  ModalHeaderActionsWithImage,\n  ModalTitleSection,\n  StyledModalHeader,\n  ModalHoverModifier,\n  ImageOverlay,\n  ImageContainer,\n} from './ModalStyles';\n\nimport { ModalNote } from './ModalNote';\nimport { TooltipWrapper } from '../Tooltips';\nimport { ButtonAction, LeftFooterAction, LeftFooterButton, LeftFooterHyperlink } from './ModalTypes';\nimport { HyperLink, ImageWithFallbacks } from '..';\nimport { ImageWithFallbacksProps } from '../Image/ImageWithFallbacks';\n\ninterface NewModalProps {\n  size?: Size;\n  isModalOpen: boolean;\n  children?: React.ReactNode;\n  closeModalAndClearInput: any;\n  title?: string | React.ReactNode;\n  topImage?: any;\n  topImageWithFallbacksProps?: ImageWithFallbacksProps;\n  topImageGrayscale?: boolean;\n  buttons?: ButtonAction[];\n  leftFooterAction?: LeftFooterAction;\n  tooltip?: string;\n  backButton?: () => void;\n  closeAction: () => void;\n  submitAction: (event?: React.FormEvent<HTMLFormElement> | undefined) => void;\n  note?: string | React.ReactNode;\n  state?: string;\n  icon?: React.ReactNode;\n  zIndex?: number;\n  contentOverflow?: string;\n  width?: string;\n  hasContentBorders?: boolean;\n}\n\nexport const ModalDialog: React.FunctionComponent<NewModalProps> = ({\n  size,\n  isModalOpen,\n  closeModalAndClearInput,\n  title,\n  topImage,\n  topImageWithFallbacksProps,\n  topImageGrayscale,\n  buttons,\n  leftFooterAction,\n  backButton,\n  closeAction,\n  submitAction,\n  tooltip,\n  children,\n  note,\n  state,\n  icon,\n  zIndex,\n  contentOverflow,\n  width,\n  hasContentBorders,\n}) => {\n  const getMinWidth = () => {\n    switch (size) {\n      case Size.Small:\n        return '320px';\n      case Size.Large:\n        return '640px';\n      case Size.Medium:\n      default:\n        return '480px';\n    }\n  };\n\n  const getMaxWidth = () => {\n    switch (size) {\n      case Size.Small:\n        return '480px';\n      case Size.Large:\n        return '720px';\n      case Size.Medium:\n      default:\n        return '640px';\n    }\n  };\n\n  const getImageHeight = () => {\n    switch (size) {\n      case Size.Small:\n        return 160;\n      case Size.Medium:\n        return 200;\n      case Size.Large:\n        return 240;\n      default:\n        return 200;\n    }\n  };\n\n  const getMarginBottom = () => {\n    switch (size) {\n      case Size.Small:\n        return '16px';\n      case Size.Medium:\n        return '24px';\n      case Size.Large:\n        return '32px';\n      default:\n        return '24px';\n    }\n  };\n\n  const getPadding = () => {\n    switch (size) {\n      case Size.Small:\n        return '16px 16px 8px';\n      case Size.Medium:\n        return '24px 24px 20px';\n      case Size.Large:\n        return '32px';\n      default:\n        return '24px 24px 16px';\n    }\n  };\n\n  const getMaxHeight = () => {\n    switch (size) {\n      case Size.Small:\n        return 'calc(100vh - 56px)';\n      case Size.Medium:\n        return 'calc(100vh - 76px)';\n      case Size.Large:\n        return 'calc(100vh - 96px)';\n      default:\n        return 'calc(100vh - 72px)';\n    }\n  };\n\n  const ModalTitle = (title: string | React.ReactNode, size?: Size) => {\n    if (typeof title === 'string') {\n      switch (size) {\n        case Size.Small:\n          return <ComponentM textStyle={ComponentTextStyle.Bold}>{title}</ComponentM>;\n        case Size.Medium:\n          return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n        case Size.Large:\n          return <ComponentXL textStyle={ComponentTextStyle.Bold}>{title}</ComponentXL>;\n        default:\n          return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n      }\n    } else {\n      return title;\n    }\n  };\n\n  const ModalTootip = (tooltip: string) => {\n    return (\n      <ModalHoverModifier>\n        <TooltipWrapper delay=\"0s\" size={Size.XSmall} align=\"center\" position=\"top\" withArrow={false} label={tooltip}>\n          <IconButton variant=\"secondary\" shape=\"circular\" action={() => {}}>\n            <Help size=\"24px\" color={COLORS.neutral_600} />\n          </IconButton>\n        </TooltipWrapper>\n      </ModalHoverModifier>\n    );\n  };\n\n  const ModalCloseButton = (onClick: any) => {\n    return (\n      <CloseButtonWrapper hasImage={!!topImage || !!topImageWithFallbacksProps} size={size}>\n        <IconButton variant=\"secondary\" shape=\"circular\" action={() => onClick()} borderRadius={48}>\n          <Close size=\"24px\" color={COLORS.black} />\n        </IconButton>\n      </CloseButtonWrapper>\n    );\n  };\n\n  const ModalBackButton = () => {\n    if (backButton) {\n      return (\n        <BackButtonWrapper hasImage={!!topImage || !!topImageWithFallbacksProps} size={size}>\n          <IconButton variant=\"secondary\" shape=\"circular\" action={() => backButton()} borderRadius={48}>\n            <ArrowLineLeft size=\"24px\" color={COLORS.black} />\n          </IconButton>\n        </BackButtonWrapper>\n      );\n    }\n  };\n\n  const getLeftActionIconElement = (icon: React.ReactNode) => {\n    return React.cloneElement(icon as React.ReactElement, { size: size === Size.Small ? '20px' : size === Size.Large ? '28px' : '24px' });\n  };\n\n  const LeftFooterAction = (leftFooterAction: LeftFooterAction) => {\n    const { text, actionType, disabled, icon, action } = leftFooterAction;\n    switch (actionType) {\n      case 'button':\n        return (\n          <Button\n            id={'left-action-button'}\n            type={(leftFooterAction as LeftFooterButton)?.type}\n            disabled={disabled}\n            loading={(leftFooterAction as LeftFooterButton)?.loading}\n            icon={icon}\n            size={size}\n            onClick={action}\n            variant={(leftFooterAction as LeftFooterButton)?.variant ?? 'secondary'}\n            style={{ order: -1, marginRight: 'auto' }}>\n            {text}\n          </Button>\n        );\n      case 'hyperlink':\n        return (\n          <HyperLink\n            id=\"left-action-hyperlink\"\n            className=\"footer-action\"\n            href={(leftFooterAction as LeftFooterHyperlink).href}\n            disabled={disabled}\n            variant=\"default\"\n            onClick={(e) => {\n              if (action) {\n                e.preventDefault();\n                action(e);\n              }\n            }}>\n            {icon && getLeftActionIconElement(icon)}\n            {text}\n          </HyperLink>\n        );\n      case 'note':\n        return (\n          <div className=\"footer-action note\">\n            {icon && getLeftActionIconElement(icon)}\n            <span>{text}</span>\n          </div>\n        );\n    }\n  };\n\n  return (\n    <ModalContainer\n      showModal={isModalOpen}\n      closeModal={closeModalAndClearInput}\n      minWidth={getMinWidth()}\n      maxWidth={getMaxWidth()}\n      height=\"auto\"\n      padding={getPadding()}\n      zIndex={zIndex}\n      width={width}>\n      <Column>\n        <form onSubmit={submitAction} style={{ display: 'flex', flexDirection: 'column', maxHeight: getMaxHeight() }}>\n          {(topImage || topImageWithFallbacksProps) && (\n            <StyledModalHeader size={size} $height={getImageHeight()} marginBottom={getMarginBottom()}>\n              <ImageContainer $height={getImageHeight()}>\n                {topImageGrayscale && <ImageOverlay $height={getImageHeight()} />}\n                {topImage && <img src={topImage} alt=\"Modal top\" />}\n                {!topImage && topImageWithFallbacksProps && (\n                  <ImageWithFallbacks\n                    loader={topImageWithFallbacksProps.loader}\n                    alt={topImageWithFallbacksProps.alt}\n                    fallbacks={topImageWithFallbacksProps.fallbacks}\n                    src={topImageWithFallbacksProps.src}\n                  />\n                )}\n              </ImageContainer>\n              <ModalHeaderActionsWithImage hasBackButton={!!backButton}>\n                {ModalBackButton()}\n                {ModalCloseButton(closeAction)}\n              </ModalHeaderActionsWithImage>\n            </StyledModalHeader>\n          )}\n          <ModalTitleSection>\n            <FlexContainer>\n              {!(topImage || topImageWithFallbacksProps) && ModalBackButton()}\n              {title && ModalTitle(title, size)}\n            </FlexContainer>\n            {(tooltip || !(topImage || topImageWithFallbacksProps)) && (\n              <ModalHeaderActions>\n                {tooltip && ModalTootip(tooltip)}\n                {!(topImage || topImageWithFallbacksProps) && ModalCloseButton(closeAction)}\n              </ModalHeaderActions>\n            )}\n          </ModalTitleSection>\n\n          <ModalBody size={size} overflow={contentOverflow} hasContentBorders={hasContentBorders}>\n            {children}\n          </ModalBody>\n\n          {note && <ModalNote note={note} state={state} size={size} icon={icon} />}\n\n          <ModalFooter size={size}>\n            {leftFooterAction && LeftFooterAction(leftFooterAction)}\n            {buttons?.map((b, i) => (\n              <Button key={b.id || i} icon={b.icon} id={b.id} disabled={b.disabled} loading={b.loading} size={size} onClick={b.action} type={b.type} variant={b.variant}>\n                {b.text}\n              </Button>\n            ))}\n          </ModalFooter>\n        </form>\n      </Column>\n    </ModalContainer>\n  );\n};\n\nexport default ModalDialog;\n"],"mappings":";;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAgBA;AACA;AAEA;AAAmD;AA2B5C,IAAMA,WAAmD,GAAG,SAAtDA,WAAmD,OAsB1D;EAAA,IArBJC,IAAI,QAAJA,IAAI;IACJC,WAAW,QAAXA,WAAW;IACXC,uBAAuB,QAAvBA,uBAAuB;IACvBC,KAAK,QAALA,KAAK;IACLC,QAAQ,QAARA,QAAQ;IACRC,0BAA0B,QAA1BA,0BAA0B;IAC1BC,iBAAiB,QAAjBA,iBAAiB;IACjBC,OAAO,QAAPA,OAAO;IACPC,gBAAgB,QAAhBA,gBAAgB;IAChBC,UAAU,QAAVA,UAAU;IACVC,WAAW,QAAXA,WAAW;IACXC,YAAY,QAAZA,YAAY;IACZC,OAAO,QAAPA,OAAO;IACPC,QAAQ,QAARA,QAAQ;IACRC,IAAI,QAAJA,IAAI;IACJC,KAAK,QAALA,KAAK;IACLC,IAAI,QAAJA,IAAI;IACJC,MAAM,QAANA,MAAM;IACNC,eAAe,QAAfA,eAAe;IACfC,KAAK,QAALA,KAAK;IACLC,iBAAiB,QAAjBA,iBAAiB;EAEjB,IAAMC,WAAW,GAAG,SAAdA,WAAW,GAAS;IACxB,QAAQrB,IAAI;MACV,KAAKsB,WAAI,CAACC,KAAK;QACb,OAAO,OAAO;MAChB,KAAKD,WAAI,CAACE,KAAK;QACb,OAAO,OAAO;MAChB,KAAKF,WAAI,CAACG,MAAM;MAChB;QACE,OAAO,OAAO;IAAC;EAErB,CAAC;EAED,IAAMC,WAAW,GAAG,SAAdA,WAAW,GAAS;IACxB,QAAQ1B,IAAI;MACV,KAAKsB,WAAI,CAACC,KAAK;QACb,OAAO,OAAO;MAChB,KAAKD,WAAI,CAACE,KAAK;QACb,OAAO,OAAO;MAChB,KAAKF,WAAI,CAACG,MAAM;MAChB;QACE,OAAO,OAAO;IAAC;EAErB,CAAC;EAED,IAAME,cAAc,GAAG,SAAjBA,cAAc,GAAS;IAC3B,QAAQ3B,IAAI;MACV,KAAKsB,WAAI,CAACC,KAAK;QACb,OAAO,GAAG;MACZ,KAAKD,WAAI,CAACG,MAAM;QACd,OAAO,GAAG;MACZ,KAAKH,WAAI,CAACE,KAAK;QACb,OAAO,GAAG;MACZ;QACE,OAAO,GAAG;IAAC;EAEjB,CAAC;EAED,IAAMI,eAAe,GAAG,SAAlBA,eAAe,GAAS;IAC5B,QAAQ5B,IAAI;MACV,KAAKsB,WAAI,CAACC,KAAK;QACb,OAAO,MAAM;MACf,KAAKD,WAAI,CAACG,MAAM;QACd,OAAO,MAAM;MACf,KAAKH,WAAI,CAACE,KAAK;QACb,OAAO,MAAM;MACf;QACE,OAAO,MAAM;IAAC;EAEpB,CAAC;EAED,IAAMK,UAAU,GAAG,SAAbA,UAAU,GAAS;IACvB,QAAQ7B,IAAI;MACV,KAAKsB,WAAI,CAACC,KAAK;QACb,OAAO,eAAe;MACxB,KAAKD,WAAI,CAACG,MAAM;QACd,OAAO,gBAAgB;MACzB,KAAKH,WAAI,CAACE,KAAK;QACb,OAAO,MAAM;MACf;QACE,OAAO,gBAAgB;IAAC;EAE9B,CAAC;EAED,IAAMM,YAAY,GAAG,SAAfA,YAAY,GAAS;IACzB,QAAQ9B,IAAI;MACV,KAAKsB,WAAI,CAACC,KAAK;QACb,OAAO,oBAAoB;MAC7B,KAAKD,WAAI,CAACG,MAAM;QACd,OAAO,oBAAoB;MAC7B,KAAKH,WAAI,CAACE,KAAK;QACb,OAAO,oBAAoB;MAC7B;QACE,OAAO,oBAAoB;IAAC;EAElC,CAAC;EAED,IAAMO,UAAU,GAAG,SAAbA,UAAU,CAAI5B,KAA+B,EAAEH,IAAW,EAAK;IACnE,IAAI,OAAOG,KAAK,KAAK,QAAQ,EAAE;MAC7B,QAAQH,IAAI;QACV,KAAKsB,WAAI,CAACC,KAAK;UACb,oBAAO,qBAAC,kBAAU;YAAC,SAAS,EAAES,0BAAkB,CAACC,IAAK;YAAA,UAAE9B;UAAK,EAAc;QAC7E,KAAKmB,WAAI,CAACG,MAAM;UACd,oBAAO,qBAAC,kBAAU;YAAC,SAAS,EAAEO,0BAAkB,CAACC,IAAK;YAAA,UAAE9B;UAAK,EAAc;QAC7E,KAAKmB,WAAI,CAACE,KAAK;UACb,oBAAO,qBAAC,mBAAW;YAAC,SAAS,EAAEQ,0BAAkB,CAACC,IAAK;YAAA,UAAE9B;UAAK,EAAe;QAC/E;UACE,oBAAO,qBAAC,kBAAU;YAAC,SAAS,EAAE6B,0BAAkB,CAACC,IAAK;YAAA,UAAE9B;UAAK,EAAc;MAAC;IAElF,CAAC,MAAM;MACL,OAAOA,KAAK;IACd;EACF,CAAC;EAED,IAAM+B,WAAW,GAAG,SAAdA,WAAW,CAAItB,OAAe,EAAK;IACvC,oBACE,qBAAC,+BAAkB;MAAA,uBACjB,qBAAC,wBAAc;QAAC,KAAK,EAAC,IAAI;QAAC,IAAI,EAAEU,WAAI,CAACa,MAAO;QAAC,KAAK,EAAC,QAAQ;QAAC,QAAQ,EAAC,KAAK;QAAC,SAAS,EAAE,KAAM;QAAC,KAAK,EAAEvB,OAAQ;QAAA,uBAC3G,qBAAC,kBAAU;UAAC,OAAO,EAAC,WAAW;UAAC,KAAK,EAAC,UAAU;UAAC,MAAM,EAAE,kBAAM,CAAC,CAAE;UAAA,uBAChE,qBAAC,iBAAI;YAAC,IAAI,EAAC,MAAM;YAAC,KAAK,EAAEwB,cAAM,CAACC;UAAY;QAAG;MACpC;IACE,EACE;EAEzB,CAAC;EAED,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAgB,CAAIC,OAAY,EAAK;IACzC,oBACE,qBAAC,+BAAkB;MAAC,QAAQ,EAAE,CAAC,CAACnC,QAAQ,IAAI,CAAC,CAACC,0BAA2B;MAAC,IAAI,EAAEL,IAAK;MAAA,uBACnF,qBAAC,kBAAU;QAAC,OAAO,EAAC,WAAW;QAAC,KAAK,EAAC,UAAU;QAAC,MAAM,EAAE;UAAA,OAAMuC,OAAO,EAAE;QAAA,CAAC;QAAC,YAAY,EAAE,EAAG;QAAA,uBACzF,qBAAC,kBAAK;UAAC,IAAI,EAAC,MAAM;UAAC,KAAK,EAAEH,cAAM,CAACI;QAAM;MAAG;IAC/B,EACM;EAEzB,CAAC;EAED,IAAMC,eAAe,GAAG,SAAlBA,eAAe,GAAS;IAC5B,IAAIhC,UAAU,EAAE;MACd,oBACE,qBAAC,8BAAiB;QAAC,QAAQ,EAAE,CAAC,CAACL,QAAQ,IAAI,CAAC,CAACC,0BAA2B;QAAC,IAAI,EAAEL,IAAK;QAAA,uBAClF,qBAAC,kBAAU;UAAC,OAAO,EAAC,WAAW;UAAC,KAAK,EAAC,UAAU;UAAC,MAAM,EAAE;YAAA,OAAMS,UAAU,EAAE;UAAA,CAAC;UAAC,YAAY,EAAE,EAAG;UAAA,uBAC5F,qBAAC,0BAAa;YAAC,IAAI,EAAC,MAAM;YAAC,KAAK,EAAE2B,cAAM,CAACI;UAAM;QAAG;MACvC,EACK;IAExB;EACF,CAAC;EAED,IAAME,wBAAwB,GAAG,SAA3BA,wBAAwB,CAAI1B,IAAqB,EAAK;IAC1D,oBAAO2B,cAAK,CAACC,YAAY,CAAC5B,IAAI,EAAwB;MAAEhB,IAAI,EAAEA,IAAI,KAAKsB,WAAI,CAACC,KAAK,GAAG,MAAM,GAAGvB,IAAI,KAAKsB,WAAI,CAACE,KAAK,GAAG,MAAM,GAAG;IAAO,CAAC,CAAC;EACvI,CAAC;EAED,IAAMqB,gBAAgB,GAAG,SAAnBA,gBAAgB,CAAIrC,gBAAkC,EAAK;IAAA;IAC/D,IAAQsC,IAAI,GAAyCtC,gBAAgB,CAA7DsC,IAAI;MAAEC,UAAU,GAA6BvC,gBAAgB,CAAvDuC,UAAU;MAAEC,QAAQ,GAAmBxC,gBAAgB,CAA3CwC,QAAQ;MAAEhC,IAAI,GAAaR,gBAAgB,CAAjCQ,IAAI;MAAEiC,MAAM,GAAKzC,gBAAgB,CAA3ByC,MAAM;IAChD,QAAQF,UAAU;MAChB,KAAK,QAAQ;QACX,oBACE,qBAAC,cAAM;UACL,EAAE,EAAE,oBAAqB;UACzB,IAAI,EAAGvC,gBAAgB,aAAhBA,gBAAgB,uBAAhBA,gBAAgB,CAAuB0C,IAAK;UACnD,QAAQ,EAAEF,QAAS;UACnB,OAAO,EAAGxC,gBAAgB,aAAhBA,gBAAgB,uBAAhBA,gBAAgB,CAAuB2C,OAAQ;UACzD,IAAI,EAAEnC,IAAK;UACX,IAAI,EAAEhB,IAAK;UACX,OAAO,EAAEiD,MAAO;UAChB,OAAO,cAAGzC,gBAAgB,aAAhBA,gBAAgB,uBAAhBA,gBAAgB,CAAuB4C,OAAO,+CAAI,WAAY;UACxE,KAAK,EAAE;YAAEC,KAAK,EAAE,CAAC,CAAC;YAAEC,WAAW,EAAE;UAAO,CAAE;UAAA,UACzCR;QAAI,EACE;MAEb,KAAK,WAAW;QACd,oBACE,sBAAC,WAAS;UACR,EAAE,EAAC,uBAAuB;UAC1B,SAAS,EAAC,eAAe;UACzB,IAAI,EAAGtC,gBAAgB,CAAyB+C,IAAK;UACrD,QAAQ,EAAEP,QAAS;UACnB,OAAO,EAAC,SAAS;UACjB,OAAO,EAAE,iBAACQ,CAAC,EAAK;YACd,IAAIP,MAAM,EAAE;cACVO,CAAC,CAACC,cAAc,EAAE;cAClBR,MAAM,CAACO,CAAC,CAAC;YACX;UACF,CAAE;UAAA,WACDxC,IAAI,IAAI0B,wBAAwB,CAAC1B,IAAI,CAAC,EACtC8B,IAAI;QAAA,EACK;MAEhB,KAAK,MAAM;QACT,oBACE;UAAK,SAAS,EAAC,oBAAoB;UAAA,WAChC9B,IAAI,IAAI0B,wBAAwB,CAAC1B,IAAI,CAAC,eACvC;YAAA,UAAO8B;UAAI,EAAQ;QAAA,EACf;IACN;EAER,CAAC;EAED,oBACE,qBAAC,uBAAc;IACb,SAAS,EAAE7C,WAAY;IACvB,UAAU,EAAEC,uBAAwB;IACpC,QAAQ,EAAEmB,WAAW,EAAG;IACxB,QAAQ,EAAEK,WAAW,EAAG;IACxB,MAAM,EAAC,MAAM;IACb,OAAO,EAAEG,UAAU,EAAG;IACtB,MAAM,EAAEZ,MAAO;IACf,KAAK,EAAEE,KAAM;IAAA,uBACb,qBAAC,mBAAM;MAAA,uBACL;QAAM,QAAQ,EAAER,YAAa;QAAC,KAAK,EAAE;UAAE+C,OAAO,EAAE,MAAM;UAAEC,aAAa,EAAE,QAAQ;UAAEC,SAAS,EAAE9B,YAAY;QAAG,CAAE;QAAA,WAC1G,CAAC1B,QAAQ,IAAIC,0BAA0B,kBACtC,sBAAC,8BAAiB;UAAC,IAAI,EAAEL,IAAK;UAAC,OAAO,EAAE2B,cAAc,EAAG;UAAC,YAAY,EAAEC,eAAe,EAAG;UAAA,wBACxF,sBAAC,2BAAc;YAAC,OAAO,EAAED,cAAc,EAAG;YAAA,WACvCrB,iBAAiB,iBAAI,qBAAC,yBAAY;cAAC,OAAO,EAAEqB,cAAc;YAAG,EAAG,EAChEvB,QAAQ,iBAAI;cAAK,GAAG,EAAEA,QAAS;cAAC,GAAG,EAAC;YAAW,EAAG,EAClD,CAACA,QAAQ,IAAIC,0BAA0B,iBACtC,qBAAC,oBAAkB;cACjB,MAAM,EAAEA,0BAA0B,CAACwD,MAAO;cAC1C,GAAG,EAAExD,0BAA0B,CAACyD,GAAI;cACpC,SAAS,EAAEzD,0BAA0B,CAAC0D,SAAU;cAChD,GAAG,EAAE1D,0BAA0B,CAAC2D;YAAI,EAEvC;UAAA,EACc,eACjB,sBAAC,wCAA2B;YAAC,aAAa,EAAE,CAAC,CAACvD,UAAW;YAAA,WACtDgC,eAAe,EAAE,EACjBH,gBAAgB,CAAC5B,WAAW,CAAC;UAAA,EACF;QAAA,EAEjC,eACD,sBAAC,8BAAiB;UAAA,wBAChB,sBAAC,0BAAa;YAAA,WACX,EAAEN,QAAQ,IAAIC,0BAA0B,CAAC,IAAIoC,eAAe,EAAE,EAC9DtC,KAAK,IAAI4B,UAAU,CAAC5B,KAAK,EAAEH,IAAI,CAAC;UAAA,EACnB,EACf,CAACY,OAAO,IAAI,EAAER,QAAQ,IAAIC,0BAA0B,CAAC,kBACpD,sBAAC,+BAAkB;YAAA,WAChBO,OAAO,IAAIsB,WAAW,CAACtB,OAAO,CAAC,EAC/B,EAAER,QAAQ,IAAIC,0BAA0B,CAAC,IAAIiC,gBAAgB,CAAC5B,WAAW,CAAC;UAAA,EAE9E;QAAA,EACiB,eAEpB,qBAAC,sBAAS;UAAC,IAAI,EAAEV,IAAK;UAAC,QAAQ,EAAEkB,eAAgB;UAAC,iBAAiB,EAAEE,iBAAkB;UAAA,UACpFP;QAAQ,EACC,EAEXC,IAAI,iBAAI,qBAAC,oBAAS;UAAC,IAAI,EAAEA,IAAK;UAAC,KAAK,EAAEC,KAAM;UAAC,IAAI,EAAEf,IAAK;UAAC,IAAI,EAAEgB;QAAK,EAAG,eAExE,sBAAC,wBAAW;UAAC,IAAI,EAAEhB,IAAK;UAAA,WACrBQ,gBAAgB,IAAIqC,gBAAgB,CAACrC,gBAAgB,CAAC,EACtDD,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAE0D,GAAG,CAAC,UAACC,CAAC,EAAEC,CAAC;YAAA,oBACjB,qBAAC,cAAM;cAAiB,IAAI,EAAED,CAAC,CAAClD,IAAK;cAAC,EAAE,EAAEkD,CAAC,CAACE,EAAG;cAAC,QAAQ,EAAEF,CAAC,CAAClB,QAAS;cAAC,OAAO,EAAEkB,CAAC,CAACf,OAAQ;cAAC,IAAI,EAAEnD,IAAK;cAAC,OAAO,EAAEkE,CAAC,CAACjB,MAAO;cAAC,IAAI,EAAEiB,CAAC,CAAChB,IAAK;cAAC,OAAO,EAAEgB,CAAC,CAACd,OAAQ;cAAA,UACvJc,CAAC,CAACpB;YAAI,GADIoB,CAAC,CAACE,EAAE,IAAID,CAAC,CAEb;UAAA,CACV,CAAC;QAAA,EACU;MAAA;IACT;EACA,EACM;AAErB,CAAC;AAAC;AAAA;EA7RAlE,WAAW;EACXY,QAAQ;EACRX,uBAAuB;EACvBC,KAAK;EACLC,QAAQ;EAERE,iBAAiB;EACjBC,OAAO;EAEPK,OAAO;EACPH,UAAU;EACVC,WAAW;EACXC,YAAY;EACZG,IAAI;EACJC,KAAK;EACLC,IAAI;EACJC,MAAM;EACNC,eAAe;EACfC,KAAK;EACLC,iBAAiB;AAAA;AAAA,eA4QJrB,WAAW;AAAA"}
+{"version":3,"file":"ModalDialog.cjs","names":["ModalDialog","size","isModalOpen","closeModalAndClearInput","title","topImage","topImageWithFallbacksProps","topImageGrayscale","buttons","leftFooterAction","backButton","closeAction","submitAction","tooltip","children","note","state","icon","zIndex","contentOverflow","width","hasContentBorders","getMinWidth","Size","Small","Large","Medium","getMaxWidth","getImageHeight","getMarginBottom","getPadding","getMaxHeight","ModalTitle","ComponentTextStyle","Bold","ModalTootip","XSmall","COLORS","neutral_600","ModalCloseButton","onClick","black","ModalBackButton","getLeftActionIconElement","React","cloneElement","LeftFooterAction","text","actionType","disabled","action","type","loading","variant","order","marginRight","href","e","preventDefault","display","flexDirection","maxHeight","loader","alt","fallbacks","src","map","b","i","id"],"sources":["../../src/Modals/ModalDialog.tsx"],"sourcesContent":["import React from 'react';\nimport { Button, IconButton } from '../Button';\nimport { SystemIcons } from '../icons';\nimport { COLORS, ComponentL, ComponentM, ComponentTextStyle, ComponentXL } from '../styles';\nimport { Size } from '../types';\nimport ModalContainer from './ModalContainer';\nimport {\n  BackButtonWrapper,\n  CloseButtonWrapper,\n  Column,\n  FlexContainer,\n  ModalBody,\n  ModalFooter,\n  ModalHeaderActions,\n  ModalHeaderActionsWithImage,\n  ModalTitleSection,\n  StyledModalHeader,\n  ModalHoverModifier,\n  ImageOverlay,\n  ImageContainer,\n} from './ModalStyles';\n\nimport { ModalNote } from './ModalNote';\nimport { TooltipWrapper } from '../Tooltips';\nimport { ButtonAction, LeftFooterAction, LeftFooterButton, LeftFooterHyperlink } from './ModalTypes';\nimport { HyperLink, ImageWithFallbacks } from '..';\nimport { ImageWithFallbacksProps } from '../Image/ImageWithFallbacks';\n\ninterface NewModalProps {\n  size?: Size;\n  isModalOpen: boolean;\n  children?: React.ReactNode;\n  closeModalAndClearInput: any;\n  title?: string | React.ReactNode;\n  topImage?: any;\n  topImageWithFallbacksProps?: ImageWithFallbacksProps;\n  topImageGrayscale?: boolean;\n  buttons?: ButtonAction[];\n  leftFooterAction?: LeftFooterAction;\n  tooltip?: string;\n  backButton?: () => void;\n  closeAction: () => void;\n  submitAction: (event?: React.FormEvent<HTMLFormElement> | undefined) => void;\n  note?: string | React.ReactNode;\n  state?: string;\n  icon?: React.ReactNode;\n  zIndex?: number;\n  contentOverflow?: string;\n  width?: string;\n  hasContentBorders?: boolean;\n}\n\nexport const ModalDialog: React.FunctionComponent<NewModalProps> = ({\n  size,\n  isModalOpen,\n  closeModalAndClearInput,\n  title,\n  topImage,\n  topImageWithFallbacksProps,\n  topImageGrayscale,\n  buttons,\n  leftFooterAction,\n  backButton,\n  closeAction,\n  submitAction,\n  tooltip,\n  children,\n  note,\n  state,\n  icon,\n  zIndex,\n  contentOverflow,\n  width,\n  hasContentBorders,\n}) => {\n  const getMinWidth = () => {\n    switch (size) {\n      case Size.Small:\n        return '320px';\n      case Size.Large:\n        return '640px';\n      case Size.Medium:\n      default:\n        return '480px';\n    }\n  };\n\n  const getMaxWidth = () => {\n    switch (size) {\n      case Size.Small:\n        return '480px';\n      case Size.Large:\n        return '720px';\n      case Size.Medium:\n      default:\n        return '640px';\n    }\n  };\n\n  const getImageHeight = () => {\n    switch (size) {\n      case Size.Small:\n        return 160;\n      case Size.Medium:\n        return 200;\n      case Size.Large:\n        return 240;\n      default:\n        return 200;\n    }\n  };\n\n  const getMarginBottom = () => {\n    switch (size) {\n      case Size.Small:\n        return '16px';\n      case Size.Medium:\n        return '24px';\n      case Size.Large:\n        return '32px';\n      default:\n        return '24px';\n    }\n  };\n\n  const getPadding = () => {\n    switch (size) {\n      case Size.Small:\n        return '16px 16px 8px';\n      case Size.Medium:\n        return '24px 24px 20px';\n      case Size.Large:\n        return '32px';\n      default:\n        return '24px 24px 16px';\n    }\n  };\n\n  const getMaxHeight = () => {\n    switch (size) {\n      case Size.Small:\n        return 'calc(100vh - 56px)';\n      case Size.Medium:\n        return 'calc(100vh - 76px)';\n      case Size.Large:\n        return 'calc(100vh - 96px)';\n      default:\n        return 'calc(100vh - 72px)';\n    }\n  };\n\n  const ModalTitle = (title: string | React.ReactNode, size?: Size) => {\n    if (typeof title === 'string') {\n      switch (size) {\n        case Size.Small:\n          return <ComponentM textStyle={ComponentTextStyle.Bold}>{title}</ComponentM>;\n        case Size.Medium:\n          return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n        case Size.Large:\n          return <ComponentXL textStyle={ComponentTextStyle.Bold}>{title}</ComponentXL>;\n        default:\n          return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n      }\n    } else {\n      return title;\n    }\n  };\n\n  const ModalTootip = (tooltip: string) => {\n    return (\n      <ModalHoverModifier>\n        <TooltipWrapper delay=\"0s\" size={Size.XSmall} align=\"center\" position=\"top\" withArrow={false} label={tooltip}>\n          <IconButton variant=\"secondary\" shape=\"circular\" action={() => {}}>\n            <SystemIcons.Help size=\"24px\" color={COLORS.neutral_600} />\n          </IconButton>\n        </TooltipWrapper>\n      </ModalHoverModifier>\n    );\n  };\n\n  const ModalCloseButton = (onClick: any) => {\n    return (\n      <CloseButtonWrapper hasImage={!!topImage || !!topImageWithFallbacksProps} size={size}>\n        <IconButton variant=\"secondary\" shape=\"circular\" action={() => onClick()} borderRadius={48}>\n          <SystemIcons.Close size=\"24px\" color={COLORS.black} />\n        </IconButton>\n      </CloseButtonWrapper>\n    );\n  };\n\n  const ModalBackButton = () => {\n    if (backButton) {\n      return (\n        <BackButtonWrapper hasImage={!!topImage || !!topImageWithFallbacksProps} size={size}>\n          <IconButton variant=\"secondary\" shape=\"circular\" action={() => backButton()} borderRadius={48}>\n            <SystemIcons.ArrowLineLeft size=\"24px\" color={COLORS.black} />\n          </IconButton>\n        </BackButtonWrapper>\n      );\n    }\n  };\n\n  const getLeftActionIconElement = (icon: React.ReactNode) => {\n    return React.cloneElement(icon as React.ReactElement, { size: size === Size.Small ? '20px' : size === Size.Large ? '28px' : '24px' });\n  };\n\n  const LeftFooterAction = (leftFooterAction: LeftFooterAction) => {\n    const { text, actionType, disabled, icon, action } = leftFooterAction;\n    switch (actionType) {\n      case 'button':\n        return (\n          <Button\n            id={'left-action-button'}\n            type={(leftFooterAction as LeftFooterButton)?.type}\n            disabled={disabled}\n            loading={(leftFooterAction as LeftFooterButton)?.loading}\n            icon={icon}\n            size={size}\n            onClick={action}\n            variant={(leftFooterAction as LeftFooterButton)?.variant ?? 'secondary'}\n            style={{ order: -1, marginRight: 'auto' }}>\n            {text}\n          </Button>\n        );\n      case 'hyperlink':\n        return (\n          <HyperLink\n            id=\"left-action-hyperlink\"\n            className=\"footer-action\"\n            href={(leftFooterAction as LeftFooterHyperlink).href}\n            disabled={disabled}\n            variant=\"default\"\n            onClick={(e) => {\n              if (action) {\n                e.preventDefault();\n                action(e);\n              }\n            }}>\n            {icon && getLeftActionIconElement(icon)}\n            {text}\n          </HyperLink>\n        );\n      case 'note':\n        return (\n          <div className=\"footer-action note\">\n            {icon && getLeftActionIconElement(icon)}\n            <span>{text}</span>\n          </div>\n        );\n    }\n  };\n\n  return (\n    <ModalContainer\n      showModal={isModalOpen}\n      closeModal={closeModalAndClearInput}\n      minWidth={getMinWidth()}\n      maxWidth={getMaxWidth()}\n      height=\"auto\"\n      padding={getPadding()}\n      zIndex={zIndex}\n      width={width}>\n      <Column>\n        <form onSubmit={submitAction} style={{ display: 'flex', flexDirection: 'column', maxHeight: getMaxHeight() }}>\n          {(topImage || topImageWithFallbacksProps) && (\n            <StyledModalHeader size={size} $height={getImageHeight()} marginBottom={getMarginBottom()}>\n              <ImageContainer $height={getImageHeight()}>\n                {topImageGrayscale && <ImageOverlay $height={getImageHeight()} />}\n                {topImage && <img src={topImage} alt=\"Modal top\" />}\n                {!topImage && topImageWithFallbacksProps && (\n                  <ImageWithFallbacks\n                    loader={topImageWithFallbacksProps.loader}\n                    alt={topImageWithFallbacksProps.alt}\n                    fallbacks={topImageWithFallbacksProps.fallbacks}\n                    src={topImageWithFallbacksProps.src}\n                  />\n                )}\n              </ImageContainer>\n              <ModalHeaderActionsWithImage hasBackButton={!!backButton}>\n                {ModalBackButton()}\n                {ModalCloseButton(closeAction)}\n              </ModalHeaderActionsWithImage>\n            </StyledModalHeader>\n          )}\n          <ModalTitleSection>\n            <FlexContainer>\n              {!(topImage || topImageWithFallbacksProps) && ModalBackButton()}\n              {title && ModalTitle(title, size)}\n            </FlexContainer>\n            {(tooltip || !(topImage || topImageWithFallbacksProps)) && (\n              <ModalHeaderActions>\n                {tooltip && ModalTootip(tooltip)}\n                {!(topImage || topImageWithFallbacksProps) && ModalCloseButton(closeAction)}\n              </ModalHeaderActions>\n            )}\n          </ModalTitleSection>\n\n          <ModalBody size={size} overflow={contentOverflow} hasContentBorders={hasContentBorders}>\n            {children}\n          </ModalBody>\n\n          {note && <ModalNote note={note} state={state} size={size} icon={icon} />}\n\n          <ModalFooter size={size}>\n            {leftFooterAction && LeftFooterAction(leftFooterAction)}\n            {buttons?.map((b, i) => (\n              <Button key={b.id || i} icon={b.icon} id={b.id} disabled={b.disabled} loading={b.loading} size={size} onClick={b.action} type={b.type} variant={b.variant}>\n                {b.text}\n              </Button>\n            ))}\n          </ModalFooter>\n        </form>\n      </Column>\n    </ModalContainer>\n  );\n};\n\nexport default ModalDialog;\n"],"mappings":"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"}

package/dist/Modals/ModalDialog.js

@@ -1,7 +1,7 @@
 import _pt from "prop-types";
 import React from 'react';
 import { Button, IconButton } from '../Button';
-import { ArrowLineLeft, Close, Help } from '../icons/systemicons/SystemIcons';
+import { SystemIcons } from '../icons';
 import { COLORS, ComponentL, ComponentM, ComponentTextStyle, ComponentXL } from '../styles';
 import { Size } from '../types';
 import ModalContainer from './ModalContainer';
@@ -144,7 +144,7 @@ export var ModalDialog = function ModalDialog(_ref) {
           variant: "secondary",
           shape: "circular",
           action: function action() {},
-          children: /*#__PURE__*/_jsx(Help, {
+          children: /*#__PURE__*/_jsx(SystemIcons.Help, {
             size: "24px",
             color: COLORS.neutral_600
           })
@@ -163,7 +163,7 @@ export var ModalDialog = function ModalDialog(_ref) {
           return onClick();
         },
         borderRadius: 48,
-        children: /*#__PURE__*/_jsx(Close, {
+        children: /*#__PURE__*/_jsx(SystemIcons.Close, {
           size: "24px",
           color: COLORS.black
         })
@@ -182,7 +182,7 @@ export var ModalDialog = function ModalDialog(_ref) {
             return backButton();
           },
           borderRadius: 48,
-          children: /*#__PURE__*/_jsx(ArrowLineLeft, {
+          children: /*#__PURE__*/_jsx(SystemIcons.ArrowLineLeft, {
             size: "24px",
             color: COLORS.black
           })

package/dist/Modals/ModalDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalDialog.js","names":["React","Button","IconButton","ArrowLineLeft","Close","Help","COLORS","ComponentL","ComponentM","ComponentTextStyle","ComponentXL","Size","ModalContainer","BackButtonWrapper","CloseButtonWrapper","Column","FlexContainer","ModalBody","ModalFooter","ModalHeaderActions","ModalHeaderActionsWithImage","ModalTitleSection","StyledModalHeader","ModalHoverModifier","ImageOverlay","ImageContainer","ModalNote","TooltipWrapper","HyperLink","ImageWithFallbacks","ModalDialog","size","isModalOpen","closeModalAndClearInput","title","topImage","topImageWithFallbacksProps","topImageGrayscale","buttons","leftFooterAction","backButton","closeAction","submitAction","tooltip","children","note","state","icon","zIndex","contentOverflow","width","hasContentBorders","getMinWidth","Small","Large","Medium","getMaxWidth","getImageHeight","getMarginBottom","getPadding","getMaxHeight","ModalTitle","Bold","ModalTootip","XSmall","neutral_600","ModalCloseButton","onClick","black","ModalBackButton","getLeftActionIconElement","cloneElement","LeftFooterAction","text","actionType","disabled","action","type","loading","variant","order","marginRight","href","e","preventDefault","display","flexDirection","maxHeight","loader","alt","fallbacks","src","map","b","i","id"],"sources":["../../src/Modals/ModalDialog.tsx"],"sourcesContent":["import React from 'react';\nimport { Button, IconButton } from '../Button';\nimport { ArrowLineLeft, Close, Help } from '../icons/systemicons/SystemIcons';\nimport { COLORS, ComponentL, ComponentM, ComponentTextStyle, ComponentXL } from '../styles';\nimport { Size } from '../types';\nimport ModalContainer from './ModalContainer';\nimport {\n  BackButtonWrapper,\n  CloseButtonWrapper,\n  Column,\n  FlexContainer,\n  ModalBody,\n  ModalFooter,\n  ModalHeaderActions,\n  ModalHeaderActionsWithImage,\n  ModalTitleSection,\n  StyledModalHeader,\n  ModalHoverModifier,\n  ImageOverlay,\n  ImageContainer,\n} from './ModalStyles';\n\nimport { ModalNote } from './ModalNote';\nimport { TooltipWrapper } from '../Tooltips';\nimport { ButtonAction, LeftFooterAction, LeftFooterButton, LeftFooterHyperlink } from './ModalTypes';\nimport { HyperLink, ImageWithFallbacks } from '..';\nimport { ImageWithFallbacksProps } from '../Image/ImageWithFallbacks';\n\ninterface NewModalProps {\n  size?: Size;\n  isModalOpen: boolean;\n  children?: React.ReactNode;\n  closeModalAndClearInput: any;\n  title?: string | React.ReactNode;\n  topImage?: any;\n  topImageWithFallbacksProps?: ImageWithFallbacksProps;\n  topImageGrayscale?: boolean;\n  buttons?: ButtonAction[];\n  leftFooterAction?: LeftFooterAction;\n  tooltip?: string;\n  backButton?: () => void;\n  closeAction: () => void;\n  submitAction: (event?: React.FormEvent<HTMLFormElement> | undefined) => void;\n  note?: string | React.ReactNode;\n  state?: string;\n  icon?: React.ReactNode;\n  zIndex?: number;\n  contentOverflow?: string;\n  width?: string;\n  hasContentBorders?: boolean;\n}\n\nexport const ModalDialog: React.FunctionComponent<NewModalProps> = ({\n  size,\n  isModalOpen,\n  closeModalAndClearInput,\n  title,\n  topImage,\n  topImageWithFallbacksProps,\n  topImageGrayscale,\n  buttons,\n  leftFooterAction,\n  backButton,\n  closeAction,\n  submitAction,\n  tooltip,\n  children,\n  note,\n  state,\n  icon,\n  zIndex,\n  contentOverflow,\n  width,\n  hasContentBorders,\n}) => {\n  const getMinWidth = () => {\n    switch (size) {\n      case Size.Small:\n        return '320px';\n      case Size.Large:\n        return '640px';\n      case Size.Medium:\n      default:\n        return '480px';\n    }\n  };\n\n  const getMaxWidth = () => {\n    switch (size) {\n      case Size.Small:\n        return '480px';\n      case Size.Large:\n        return '720px';\n      case Size.Medium:\n      default:\n        return '640px';\n    }\n  };\n\n  const getImageHeight = () => {\n    switch (size) {\n      case Size.Small:\n        return 160;\n      case Size.Medium:\n        return 200;\n      case Size.Large:\n        return 240;\n      default:\n        return 200;\n    }\n  };\n\n  const getMarginBottom = () => {\n    switch (size) {\n      case Size.Small:\n        return '16px';\n      case Size.Medium:\n        return '24px';\n      case Size.Large:\n        return '32px';\n      default:\n        return '24px';\n    }\n  };\n\n  const getPadding = () => {\n    switch (size) {\n      case Size.Small:\n        return '16px 16px 8px';\n      case Size.Medium:\n        return '24px 24px 20px';\n      case Size.Large:\n        return '32px';\n      default:\n        return '24px 24px 16px';\n    }\n  };\n\n  const getMaxHeight = () => {\n    switch (size) {\n      case Size.Small:\n        return 'calc(100vh - 56px)';\n      case Size.Medium:\n        return 'calc(100vh - 76px)';\n      case Size.Large:\n        return 'calc(100vh - 96px)';\n      default:\n        return 'calc(100vh - 72px)';\n    }\n  };\n\n  const ModalTitle = (title: string | React.ReactNode, size?: Size) => {\n    if (typeof title === 'string') {\n      switch (size) {\n        case Size.Small:\n          return <ComponentM textStyle={ComponentTextStyle.Bold}>{title}</ComponentM>;\n        case Size.Medium:\n          return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n        case Size.Large:\n          return <ComponentXL textStyle={ComponentTextStyle.Bold}>{title}</ComponentXL>;\n        default:\n          return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n      }\n    } else {\n      return title;\n    }\n  };\n\n  const ModalTootip = (tooltip: string) => {\n    return (\n      <ModalHoverModifier>\n        <TooltipWrapper delay=\"0s\" size={Size.XSmall} align=\"center\" position=\"top\" withArrow={false} label={tooltip}>\n          <IconButton variant=\"secondary\" shape=\"circular\" action={() => {}}>\n            <Help size=\"24px\" color={COLORS.neutral_600} />\n          </IconButton>\n        </TooltipWrapper>\n      </ModalHoverModifier>\n    );\n  };\n\n  const ModalCloseButton = (onClick: any) => {\n    return (\n      <CloseButtonWrapper hasImage={!!topImage || !!topImageWithFallbacksProps} size={size}>\n        <IconButton variant=\"secondary\" shape=\"circular\" action={() => onClick()} borderRadius={48}>\n          <Close size=\"24px\" color={COLORS.black} />\n        </IconButton>\n      </CloseButtonWrapper>\n    );\n  };\n\n  const ModalBackButton = () => {\n    if (backButton) {\n      return (\n        <BackButtonWrapper hasImage={!!topImage || !!topImageWithFallbacksProps} size={size}>\n          <IconButton variant=\"secondary\" shape=\"circular\" action={() => backButton()} borderRadius={48}>\n            <ArrowLineLeft size=\"24px\" color={COLORS.black} />\n          </IconButton>\n        </BackButtonWrapper>\n      );\n    }\n  };\n\n  const getLeftActionIconElement = (icon: React.ReactNode) => {\n    return React.cloneElement(icon as React.ReactElement, { size: size === Size.Small ? '20px' : size === Size.Large ? '28px' : '24px' });\n  };\n\n  const LeftFooterAction = (leftFooterAction: LeftFooterAction) => {\n    const { text, actionType, disabled, icon, action } = leftFooterAction;\n    switch (actionType) {\n      case 'button':\n        return (\n          <Button\n            id={'left-action-button'}\n            type={(leftFooterAction as LeftFooterButton)?.type}\n            disabled={disabled}\n            loading={(leftFooterAction as LeftFooterButton)?.loading}\n            icon={icon}\n            size={size}\n            onClick={action}\n            variant={(leftFooterAction as LeftFooterButton)?.variant ?? 'secondary'}\n            style={{ order: -1, marginRight: 'auto' }}>\n            {text}\n          </Button>\n        );\n      case 'hyperlink':\n        return (\n          <HyperLink\n            id=\"left-action-hyperlink\"\n            className=\"footer-action\"\n            href={(leftFooterAction as LeftFooterHyperlink).href}\n            disabled={disabled}\n            variant=\"default\"\n            onClick={(e) => {\n              if (action) {\n                e.preventDefault();\n                action(e);\n              }\n            }}>\n            {icon && getLeftActionIconElement(icon)}\n            {text}\n          </HyperLink>\n        );\n      case 'note':\n        return (\n          <div className=\"footer-action note\">\n            {icon && getLeftActionIconElement(icon)}\n            <span>{text}</span>\n          </div>\n        );\n    }\n  };\n\n  return (\n    <ModalContainer\n      showModal={isModalOpen}\n      closeModal={closeModalAndClearInput}\n      minWidth={getMinWidth()}\n      maxWidth={getMaxWidth()}\n      height=\"auto\"\n      padding={getPadding()}\n      zIndex={zIndex}\n      width={width}>\n      <Column>\n        <form onSubmit={submitAction} style={{ display: 'flex', flexDirection: 'column', maxHeight: getMaxHeight() }}>\n          {(topImage || topImageWithFallbacksProps) && (\n            <StyledModalHeader size={size} $height={getImageHeight()} marginBottom={getMarginBottom()}>\n              <ImageContainer $height={getImageHeight()}>\n                {topImageGrayscale && <ImageOverlay $height={getImageHeight()} />}\n                {topImage && <img src={topImage} alt=\"Modal top\" />}\n                {!topImage && topImageWithFallbacksProps && (\n                  <ImageWithFallbacks\n                    loader={topImageWithFallbacksProps.loader}\n                    alt={topImageWithFallbacksProps.alt}\n                    fallbacks={topImageWithFallbacksProps.fallbacks}\n                    src={topImageWithFallbacksProps.src}\n                  />\n                )}\n              </ImageContainer>\n              <ModalHeaderActionsWithImage hasBackButton={!!backButton}>\n                {ModalBackButton()}\n                {ModalCloseButton(closeAction)}\n              </ModalHeaderActionsWithImage>\n            </StyledModalHeader>\n          )}\n          <ModalTitleSection>\n            <FlexContainer>\n              {!(topImage || topImageWithFallbacksProps) && ModalBackButton()}\n              {title && ModalTitle(title, size)}\n            </FlexContainer>\n            {(tooltip || !(topImage || topImageWithFallbacksProps)) && (\n              <ModalHeaderActions>\n                {tooltip && ModalTootip(tooltip)}\n                {!(topImage || topImageWithFallbacksProps) && ModalCloseButton(closeAction)}\n              </ModalHeaderActions>\n            )}\n          </ModalTitleSection>\n\n          <ModalBody size={size} overflow={contentOverflow} hasContentBorders={hasContentBorders}>\n            {children}\n          </ModalBody>\n\n          {note && <ModalNote note={note} state={state} size={size} icon={icon} />}\n\n          <ModalFooter size={size}>\n            {leftFooterAction && LeftFooterAction(leftFooterAction)}\n            {buttons?.map((b, i) => (\n              <Button key={b.id || i} icon={b.icon} id={b.id} disabled={b.disabled} loading={b.loading} size={size} onClick={b.action} type={b.type} variant={b.variant}>\n                {b.text}\n              </Button>\n            ))}\n          </ModalFooter>\n        </form>\n      </Column>\n    </ModalContainer>\n  );\n};\n\nexport default ModalDialog;\n"],"mappings":"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"}
+{"version":3,"file":"ModalDialog.js","names":["React","Button","IconButton","SystemIcons","COLORS","ComponentL","ComponentM","ComponentTextStyle","ComponentXL","Size","ModalContainer","BackButtonWrapper","CloseButtonWrapper","Column","FlexContainer","ModalBody","ModalFooter","ModalHeaderActions","ModalHeaderActionsWithImage","ModalTitleSection","StyledModalHeader","ModalHoverModifier","ImageOverlay","ImageContainer","ModalNote","TooltipWrapper","HyperLink","ImageWithFallbacks","ModalDialog","size","isModalOpen","closeModalAndClearInput","title","topImage","topImageWithFallbacksProps","topImageGrayscale","buttons","leftFooterAction","backButton","closeAction","submitAction","tooltip","children","note","state","icon","zIndex","contentOverflow","width","hasContentBorders","getMinWidth","Small","Large","Medium","getMaxWidth","getImageHeight","getMarginBottom","getPadding","getMaxHeight","ModalTitle","Bold","ModalTootip","XSmall","neutral_600","ModalCloseButton","onClick","black","ModalBackButton","getLeftActionIconElement","cloneElement","LeftFooterAction","text","actionType","disabled","action","type","loading","variant","order","marginRight","href","e","preventDefault","display","flexDirection","maxHeight","loader","alt","fallbacks","src","map","b","i","id"],"sources":["../../src/Modals/ModalDialog.tsx"],"sourcesContent":["import React from 'react';\nimport { Button, IconButton } from '../Button';\nimport { SystemIcons } from '../icons';\nimport { COLORS, ComponentL, ComponentM, ComponentTextStyle, ComponentXL } from '../styles';\nimport { Size } from '../types';\nimport ModalContainer from './ModalContainer';\nimport {\n  BackButtonWrapper,\n  CloseButtonWrapper,\n  Column,\n  FlexContainer,\n  ModalBody,\n  ModalFooter,\n  ModalHeaderActions,\n  ModalHeaderActionsWithImage,\n  ModalTitleSection,\n  StyledModalHeader,\n  ModalHoverModifier,\n  ImageOverlay,\n  ImageContainer,\n} from './ModalStyles';\n\nimport { ModalNote } from './ModalNote';\nimport { TooltipWrapper } from '../Tooltips';\nimport { ButtonAction, LeftFooterAction, LeftFooterButton, LeftFooterHyperlink } from './ModalTypes';\nimport { HyperLink, ImageWithFallbacks } from '..';\nimport { ImageWithFallbacksProps } from '../Image/ImageWithFallbacks';\n\ninterface NewModalProps {\n  size?: Size;\n  isModalOpen: boolean;\n  children?: React.ReactNode;\n  closeModalAndClearInput: any;\n  title?: string | React.ReactNode;\n  topImage?: any;\n  topImageWithFallbacksProps?: ImageWithFallbacksProps;\n  topImageGrayscale?: boolean;\n  buttons?: ButtonAction[];\n  leftFooterAction?: LeftFooterAction;\n  tooltip?: string;\n  backButton?: () => void;\n  closeAction: () => void;\n  submitAction: (event?: React.FormEvent<HTMLFormElement> | undefined) => void;\n  note?: string | React.ReactNode;\n  state?: string;\n  icon?: React.ReactNode;\n  zIndex?: number;\n  contentOverflow?: string;\n  width?: string;\n  hasContentBorders?: boolean;\n}\n\nexport const ModalDialog: React.FunctionComponent<NewModalProps> = ({\n  size,\n  isModalOpen,\n  closeModalAndClearInput,\n  title,\n  topImage,\n  topImageWithFallbacksProps,\n  topImageGrayscale,\n  buttons,\n  leftFooterAction,\n  backButton,\n  closeAction,\n  submitAction,\n  tooltip,\n  children,\n  note,\n  state,\n  icon,\n  zIndex,\n  contentOverflow,\n  width,\n  hasContentBorders,\n}) => {\n  const getMinWidth = () => {\n    switch (size) {\n      case Size.Small:\n        return '320px';\n      case Size.Large:\n        return '640px';\n      case Size.Medium:\n      default:\n        return '480px';\n    }\n  };\n\n  const getMaxWidth = () => {\n    switch (size) {\n      case Size.Small:\n        return '480px';\n      case Size.Large:\n        return '720px';\n      case Size.Medium:\n      default:\n        return '640px';\n    }\n  };\n\n  const getImageHeight = () => {\n    switch (size) {\n      case Size.Small:\n        return 160;\n      case Size.Medium:\n        return 200;\n      case Size.Large:\n        return 240;\n      default:\n        return 200;\n    }\n  };\n\n  const getMarginBottom = () => {\n    switch (size) {\n      case Size.Small:\n        return '16px';\n      case Size.Medium:\n        return '24px';\n      case Size.Large:\n        return '32px';\n      default:\n        return '24px';\n    }\n  };\n\n  const getPadding = () => {\n    switch (size) {\n      case Size.Small:\n        return '16px 16px 8px';\n      case Size.Medium:\n        return '24px 24px 20px';\n      case Size.Large:\n        return '32px';\n      default:\n        return '24px 24px 16px';\n    }\n  };\n\n  const getMaxHeight = () => {\n    switch (size) {\n      case Size.Small:\n        return 'calc(100vh - 56px)';\n      case Size.Medium:\n        return 'calc(100vh - 76px)';\n      case Size.Large:\n        return 'calc(100vh - 96px)';\n      default:\n        return 'calc(100vh - 72px)';\n    }\n  };\n\n  const ModalTitle = (title: string | React.ReactNode, size?: Size) => {\n    if (typeof title === 'string') {\n      switch (size) {\n        case Size.Small:\n          return <ComponentM textStyle={ComponentTextStyle.Bold}>{title}</ComponentM>;\n        case Size.Medium:\n          return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n        case Size.Large:\n          return <ComponentXL textStyle={ComponentTextStyle.Bold}>{title}</ComponentXL>;\n        default:\n          return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n      }\n    } else {\n      return title;\n    }\n  };\n\n  const ModalTootip = (tooltip: string) => {\n    return (\n      <ModalHoverModifier>\n        <TooltipWrapper delay=\"0s\" size={Size.XSmall} align=\"center\" position=\"top\" withArrow={false} label={tooltip}>\n          <IconButton variant=\"secondary\" shape=\"circular\" action={() => {}}>\n            <SystemIcons.Help size=\"24px\" color={COLORS.neutral_600} />\n          </IconButton>\n        </TooltipWrapper>\n      </ModalHoverModifier>\n    );\n  };\n\n  const ModalCloseButton = (onClick: any) => {\n    return (\n      <CloseButtonWrapper hasImage={!!topImage || !!topImageWithFallbacksProps} size={size}>\n        <IconButton variant=\"secondary\" shape=\"circular\" action={() => onClick()} borderRadius={48}>\n          <SystemIcons.Close size=\"24px\" color={COLORS.black} />\n        </IconButton>\n      </CloseButtonWrapper>\n    );\n  };\n\n  const ModalBackButton = () => {\n    if (backButton) {\n      return (\n        <BackButtonWrapper hasImage={!!topImage || !!topImageWithFallbacksProps} size={size}>\n          <IconButton variant=\"secondary\" shape=\"circular\" action={() => backButton()} borderRadius={48}>\n            <SystemIcons.ArrowLineLeft size=\"24px\" color={COLORS.black} />\n          </IconButton>\n        </BackButtonWrapper>\n      );\n    }\n  };\n\n  const getLeftActionIconElement = (icon: React.ReactNode) => {\n    return React.cloneElement(icon as React.ReactElement, { size: size === Size.Small ? '20px' : size === Size.Large ? '28px' : '24px' });\n  };\n\n  const LeftFooterAction = (leftFooterAction: LeftFooterAction) => {\n    const { text, actionType, disabled, icon, action } = leftFooterAction;\n    switch (actionType) {\n      case 'button':\n        return (\n          <Button\n            id={'left-action-button'}\n            type={(leftFooterAction as LeftFooterButton)?.type}\n            disabled={disabled}\n            loading={(leftFooterAction as LeftFooterButton)?.loading}\n            icon={icon}\n            size={size}\n            onClick={action}\n            variant={(leftFooterAction as LeftFooterButton)?.variant ?? 'secondary'}\n            style={{ order: -1, marginRight: 'auto' }}>\n            {text}\n          </Button>\n        );\n      case 'hyperlink':\n        return (\n          <HyperLink\n            id=\"left-action-hyperlink\"\n            className=\"footer-action\"\n            href={(leftFooterAction as LeftFooterHyperlink).href}\n            disabled={disabled}\n            variant=\"default\"\n            onClick={(e) => {\n              if (action) {\n                e.preventDefault();\n                action(e);\n              }\n            }}>\n            {icon && getLeftActionIconElement(icon)}\n            {text}\n          </HyperLink>\n        );\n      case 'note':\n        return (\n          <div className=\"footer-action note\">\n            {icon && getLeftActionIconElement(icon)}\n            <span>{text}</span>\n          </div>\n        );\n    }\n  };\n\n  return (\n    <ModalContainer\n      showModal={isModalOpen}\n      closeModal={closeModalAndClearInput}\n      minWidth={getMinWidth()}\n      maxWidth={getMaxWidth()}\n      height=\"auto\"\n      padding={getPadding()}\n      zIndex={zIndex}\n      width={width}>\n      <Column>\n        <form onSubmit={submitAction} style={{ display: 'flex', flexDirection: 'column', maxHeight: getMaxHeight() }}>\n          {(topImage || topImageWithFallbacksProps) && (\n            <StyledModalHeader size={size} $height={getImageHeight()} marginBottom={getMarginBottom()}>\n              <ImageContainer $height={getImageHeight()}>\n                {topImageGrayscale && <ImageOverlay $height={getImageHeight()} />}\n                {topImage && <img src={topImage} alt=\"Modal top\" />}\n                {!topImage && topImageWithFallbacksProps && (\n                  <ImageWithFallbacks\n                    loader={topImageWithFallbacksProps.loader}\n                    alt={topImageWithFallbacksProps.alt}\n                    fallbacks={topImageWithFallbacksProps.fallbacks}\n                    src={topImageWithFallbacksProps.src}\n                  />\n                )}\n              </ImageContainer>\n              <ModalHeaderActionsWithImage hasBackButton={!!backButton}>\n                {ModalBackButton()}\n                {ModalCloseButton(closeAction)}\n              </ModalHeaderActionsWithImage>\n            </StyledModalHeader>\n          )}\n          <ModalTitleSection>\n            <FlexContainer>\n              {!(topImage || topImageWithFallbacksProps) && ModalBackButton()}\n              {title && ModalTitle(title, size)}\n            </FlexContainer>\n            {(tooltip || !(topImage || topImageWithFallbacksProps)) && (\n              <ModalHeaderActions>\n                {tooltip && ModalTootip(tooltip)}\n                {!(topImage || topImageWithFallbacksProps) && ModalCloseButton(closeAction)}\n              </ModalHeaderActions>\n            )}\n          </ModalTitleSection>\n\n          <ModalBody size={size} overflow={contentOverflow} hasContentBorders={hasContentBorders}>\n            {children}\n          </ModalBody>\n\n          {note && <ModalNote note={note} state={state} size={size} icon={icon} />}\n\n          <ModalFooter size={size}>\n            {leftFooterAction && LeftFooterAction(leftFooterAction)}\n            {buttons?.map((b, i) => (\n              <Button key={b.id || i} icon={b.icon} id={b.id} disabled={b.disabled} loading={b.loading} size={size} onClick={b.action} type={b.type} variant={b.variant}>\n                {b.text}\n              </Button>\n            ))}\n          </ModalFooter>\n        </form>\n      </Column>\n    </ModalContainer>\n  );\n};\n\nexport default ModalDialog;\n"],"mappings":"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"}

package/dist/Modals/ModalNote.cjs

@@ -9,7 +9,7 @@ exports.default = exports.ModalNote = void 0;
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var React = _interopRequireWildcard(require("react"));
 var _ = require("..");
-var _SystemIcons = require("../icons/systemicons/SystemIcons");
+var _icons = require("../icons");
 var _ModalStyles = require("./ModalStyles");
 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); }
@@ -26,7 +26,7 @@ var ModalNote = function ModalNote(_ref) {
       return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ModalStyles.ModalNoteSection, {
         state: stateVal,
         size: size,
-        children: [icon ? icon : /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.CheckMark, {
+        children: [icon ? icon : /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.CheckMark, {
           color: _.COLORS.correct_500
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
           children: note
@@ -36,7 +36,7 @@ var ModalNote = function ModalNote(_ref) {
       return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ModalStyles.ModalNoteSection, {
         state: stateVal,
         size: size,
-        children: [icon ? icon : /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.TechnicalWarning, {
+        children: [icon ? icon : /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.TechnicalWarning, {
           color: _.COLORS.warning_500
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
           children: note
@@ -46,7 +46,7 @@ var ModalNote = function ModalNote(_ref) {
       return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ModalStyles.ModalNoteSection, {
         state: stateVal,
         size: size,
-        children: [icon ? icon : /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.TechnicalWarning, {
+        children: [icon ? icon : /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.TechnicalWarning, {
           color: _.COLORS.warning_500
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
           children: note
@@ -56,7 +56,7 @@ var ModalNote = function ModalNote(_ref) {
       return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ModalStyles.ModalNoteSection, {
         state: stateVal,
         size: size,
-        children: [icon ? icon : /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.Information, {
+        children: [icon ? icon : /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.Information, {
           color: _.COLORS.primary_500,
           className: size
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {