@laerdal/life-react-components 1.10.3-dev.9.full → 1.11.0-dev.4

package/dist/Modals/ModalContainer.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Modals/ModalContainer.tsx"],"names":["ModalContainerStyles","content","top","left","right","bottom","marginRight","width","height","borderRadius","boxSizing","margin","overflow","boxShadow","BOXSHADOWS","BOXSHADOW_L3","modalTransitions","Z_INDEXES","backdrop","modal","ModalContainer","ReactModal","defaultStyles","overlay","backgroundColor","document","querySelector","head","getElementsByTagName","style","createElement","setAttribute","appendChild","createTextNode","props","showModal","preventScroll","window","scrollY","prevProps","prevState","scroll","snapshot","resetScroll","id","closeModal","children","padding","minWidth","maxWidth","zIndex","parseInt","zIndexValue","Math","min","max","toast","stylesConfiguration","Object","assign","styles","getElementById","offset","openInstances","setState","body","position","state","scrollTo","React","Component"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport ReactModal from 'react-modal';\nimport {BOXSHADOWS} from '../styles';\nimport {Z_INDEXES} from '../styles';\n\nconst ModalContainerStyles = {\n  content: {\n    top: '50%',\n    left: '50%',\n    right: 'auto',\n    bottom: 'auto',\n    marginRight: '-50%',\n    width: '640px',\n    height: '320px',\n    borderRadius: '8px',\n    boxSizing: 'border-box' as any,\n    margin: 0,\n    overflow: 'auto',\n    boxShadow: BOXSHADOWS.BOXSHADOW_L3,\n  },\n};\n\n//override modal classes to define the animations\nconst modalTransitions = `\n.ReactModal__Overlay {\n  opacity: 0;\n  z-index: ${Z_INDEXES.backdrop};\n}\n\n.ReactModal__Overlay--after-open {\n  opacity: 1;\n  transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content{\n  z-index: ${Z_INDEXES.modal};\n  opacity:0;\n  transform: translate(-50%, -50%) scale(1.1, 1.1);\n}\n\n.ReactModal__Content--after-open{\n  opacity: 1;\n  transform: translate(-50%, -50%) scale(1.0, 1.0);\n  transition: transform 150ms ease-in-out, opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Overlay--before-close {\n  opacity: 0;\n  transition: opacity 120ms linear;\n}\n\n.ReactModal__Content--before-close{\n  opacity: 0;\n  transform: translate(-50%, -50%) scale(1.1, 1.1);\n  transition: transform 120ms ease-in-out, opacity 120ms cubic-bezier(0.55, 0.05, 0.67, 0.19);\n}\n`;\n\n\ntype ModalContainerProps = {\n  id?: string;\n  showModal: boolean;\n  closeModal: () => void;\n  children: any;\n  height?: any;\n  width?: any;\n  overflow?: string;\n  padding?: string;\n  minWidth?: string;\n  maxWidth?: string;\n  zIndex?: number;\n};\n\ntype ModalContainerState = {\n  scroll: number;\n};\n\nclass ModalContainer extends React.Component<ModalContainerProps, ModalContainerState> {\n  private static openInstances = 0;\n\n  componentDidMount() {\n    if (ReactModal.defaultStyles.overlay) {\n      ReactModal.defaultStyles.overlay.backgroundColor = 'rgba(0,0,0,0.5)';\n    }\n\n    //append style node to override modal transition classes\n    if (!document.querySelector('[modal-custom-styling=\"active\"]')) {\n      const head = document.head || document.getElementsByTagName('head')[0];\n      const style = document.createElement('style');\n      style.setAttribute('modal-custom-styling', 'active');\n      head.appendChild(style);\n      style.appendChild(document.createTextNode(modalTransitions));\n    }\n\n    if (this.props.showModal) {\n      this.preventScroll(window.scrollY);\n    }\n  }\n\n  getSnapshotBeforeUpdate(prevProps: Readonly<ModalContainerProps>, prevState: Readonly<ModalContainerState>): { scroll: number } {\n    return {scroll: window.scrollY};\n  }\n\n  componentDidUpdate(prevProps: Readonly<ModalContainerProps>, prevState: Readonly<ModalContainerState>, snapshot?: { scroll: number }) {\n    if (this.props.showModal && !prevProps.showModal) {\n      this.preventScroll(snapshot!.scroll);\n    }\n    if (!this.props.showModal && prevProps.showModal) {\n      this.resetScroll();\n    }\n  }\n\n  componentWillUnmount() {\n    if (this.props.showModal) {\n      this.resetScroll();\n    }\n  }\n\n  render() {\n    const {\n      id,\n      showModal,\n      closeModal,\n      children,\n      height = 'auto',\n      width = 'auto',\n      overflow = 'visible',\n      padding,\n      minWidth = '',\n      maxWidth = '',\n      zIndex = parseInt(Z_INDEXES.modal)\n    } = this.props;\n\n    // should be at least z-index of modal and below z-index of toast\n    const zIndexValue = Math.min(Math.max(zIndex, +Z_INDEXES.modal), +Z_INDEXES.toast - 1);\n    const stylesConfiguration = Object.assign({...ModalContainerStyles.content}, {\n      height,\n      width,\n      padding,\n      overflow,\n      minWidth,\n      maxWidth,\n      zIndex: zIndexValue\n    });\n    const styles = {content: stylesConfiguration};\n\n    return (\n      <ReactModal id={id}\n                  isOpen={showModal}\n                  closeTimeoutMS={120}\n                  onRequestClose={() => closeModal()}\n                  style={styles}\n                  appElement={document.getElementById('root') || ''}>\n        {children}\n      </ReactModal>\n    );\n  }\n\n  private preventScroll(offset: number) {\n    if (!ModalContainer.openInstances) {\n      this.setState({scroll: offset});\n      document.body.style.position = 'fixed';\n      document.body.style.left = `0px`;\n      document.body.style.right = `0px`;\n      document.body.style.top = `-${offset}px`;\n    }\n    ModalContainer.openInstances++\n  }\n\n  private resetScroll() {\n    ModalContainer.openInstances--;\n    if (!ModalContainer.openInstances) {\n      //@ts-ignore\n      document.body.style.position = null;\n      //@ts-ignore\n      document.body.style.left = null;\n      //@ts-ignore\n      document.body.style.top = null;\n      //@ts-ignore\n      document.body.style.right = null;\n      this.state.scroll && window.scrollTo(0, this.state.scroll);\n      this.setState({scroll: 0});\n    }\n  }\n}\n\nexport default ModalContainer;\n"],"file":"ModalContainer.cjs"}
+{"version":3,"sources":["../../src/Modals/ModalContainer.tsx"],"names":["ModalContainerStyles","content","top","left","right","bottom","marginRight","width","height","borderRadius","boxSizing","margin","overflow","boxShadow","BOXSHADOWS","BOXSHADOW_L3","modalTransitions","Z_INDEXES","backdrop","modal","ModalContainer","ReactModal","defaultStyles","overlay","backgroundColor","document","querySelector","head","getElementsByTagName","style","createElement","setAttribute","appendChild","createTextNode","props","showModal","preventScroll","window","scrollY","prevProps","prevState","scroll","snapshot","resetScroll","id","closeModal","children","padding","minWidth","maxWidth","zIndex","parseInt","zIndexValue","Math","min","max","toast","stylesConfiguration","Object","assign","styles","getElementById","offset","openInstances","setState","body","position","state","scrollTo","React","Component"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport ReactModal from 'react-modal';\nimport {BOXSHADOWS} from '../styles';\nimport {Z_INDEXES} from '../styles';\nimport styled, {keyframes} from 'styled-components';\n\nconst ModalContainerStyles = {\n  content: {\n    top: 'auto',\n    left: 'auto',\n    right: 'auto',\n    bottom: 'auto',\n    marginRight: '-50%',\n    width: '640px',\n    height: '320px',\n    borderRadius: '8px',\n    boxSizing: 'border-box' as any,\n    margin: 0,\n    overflow: 'auto',\n    boxShadow: BOXSHADOWS.BOXSHADOW_L3,\n  },\n};\n\n//override modal classes to define the animations\nconst modalTransitions = `\n\n@keyframes modalOpenAnimation {\n  from{\n    transform: scale(1.1, 1.1);\n  }\n  to {\n    transform: scale(1, 1);\n  }\n}\n\n.ReactModal__Overlay {\n  opacity: 0;\n  z-index: ${Z_INDEXES.backdrop};\n  display:flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.ReactModal__Overlay--after-open {\n  opacity: 1;\n  transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content{\n  z-index: ${Z_INDEXES.modal};\n  opacity:0;\n  transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content--after-open{\n  opacity: 1;\n  animation: modalOpenAnimation 150ms ease-in-out;\n}\n\n.ReactModal__Overlay--before-close {\n  opacity: 0;\n  transition: opacity 120ms linear;\n}\n\n.ReactModal__Content--before-close{\n  opacity: 0;\n  transform: scale(1.1, 1.1);\n  transition: transform 120ms ease-in-out, opacity 120ms cubic-bezier(0.55, 0.05, 0.67, 0.19);\n}\n`;\n\n\ntype ModalContainerProps = {\n  id?: string;\n  showModal: boolean;\n  closeModal: () => void;\n  children: any;\n  height?: any;\n  width?: any;\n  overflow?: string;\n  padding?: string;\n  minWidth?: string;\n  maxWidth?: string;\n  zIndex?: number;\n};\n\ntype ModalContainerState = {\n  scroll: number;\n};\n\nclass ModalContainer extends React.Component<ModalContainerProps, ModalContainerState> {\n  private static openInstances = 0;\n\n  componentDidMount() {\n    if (ReactModal.defaultStyles.overlay) {\n      ReactModal.defaultStyles.overlay.backgroundColor = 'rgba(0,0,0,0.5)';\n    }\n\n    //append style node to override modal transition classes\n    if (!document.querySelector('[modal-custom-styling=\"active\"]')) {\n      const head = document.head || document.getElementsByTagName('head')[0];\n      const style = document.createElement('style');\n      style.setAttribute('modal-custom-styling', 'active');\n      head.appendChild(style);\n      style.appendChild(document.createTextNode(modalTransitions));\n    }\n\n    if (this.props.showModal) {\n      this.preventScroll(window.scrollY);\n    }\n  }\n\n  getSnapshotBeforeUpdate(prevProps: Readonly<ModalContainerProps>, prevState: Readonly<ModalContainerState>): { scroll: number } {\n    return {scroll: window.scrollY};\n  }\n\n  componentDidUpdate(prevProps: Readonly<ModalContainerProps>, prevState: Readonly<ModalContainerState>, snapshot?: { scroll: number }) {\n    if (this.props.showModal && !prevProps.showModal) {\n      this.preventScroll(snapshot!.scroll);\n    }\n    if (!this.props.showModal && prevProps.showModal) {\n      this.resetScroll();\n    }\n  }\n\n  componentWillUnmount() {\n    if (this.props.showModal) {\n      this.resetScroll();\n    }\n  }\n\n  render() {\n    const {\n      id,\n      showModal,\n      closeModal,\n      children,\n      height = 'auto',\n      width = 'auto',\n      overflow = 'visible',\n      padding,\n      minWidth = '',\n      maxWidth = '',\n      zIndex = parseInt(Z_INDEXES.modal)\n    } = this.props;\n\n    // should be at least z-index of modal and below z-index of toast\n    const zIndexValue = Math.min(Math.max(zIndex, +Z_INDEXES.modal), +Z_INDEXES.toast - 1);\n    const stylesConfiguration = Object.assign({...ModalContainerStyles.content}, {\n      height,\n      width,\n      padding,\n      overflow,\n      minWidth,\n      maxWidth,\n      zIndex: zIndexValue\n    });\n    const styles = {content: stylesConfiguration};\n\n    return (\n      <ReactModal id={id}\n                  isOpen={showModal}\n                  closeTimeoutMS={120}\n                  onRequestClose={() => closeModal()}\n                  style={styles}\n                  appElement={document.getElementById('root') || ''}>\n        {children}\n      </ReactModal>\n    );\n  }\n\n  private preventScroll(offset: number) {\n    if (!ModalContainer.openInstances) {\n      this.setState({scroll: offset});\n      document.body.style.position = 'fixed';\n      document.body.style.left = `0px`;\n      document.body.style.right = `0px`;\n      document.body.style.top = `-${offset}px`;\n    }\n    ModalContainer.openInstances++\n  }\n\n  private resetScroll() {\n    ModalContainer.openInstances--;\n    if (!ModalContainer.openInstances) {\n      //@ts-ignore\n      document.body.style.position = null;\n      //@ts-ignore\n      document.body.style.left = null;\n      //@ts-ignore\n      document.body.style.top = null;\n      //@ts-ignore\n      document.body.style.right = null;\n      this.state.scroll && window.scrollTo(0, this.state.scroll);\n      this.setState({scroll: 0});\n    }\n  }\n}\n\nexport default ModalContainer;\n"],"file":"ModalContainer.cjs"}

package/dist/Modals/ModalContainer.js

@@ -21,8 +21,8 @@ import { Z_INDEXES } from '../styles';
 import { jsx as _jsx } from "react/jsx-runtime";
 var ModalContainerStyles = {
   content: {
-    top: '50%',
-    left: '50%',
+    top: 'auto',
+    left: 'auto',
     right: 'auto',
     bottom: 'auto',
     marginRight: '-50%',
@@ -36,7 +36,7 @@ var ModalContainerStyles = {
   }
 }; //override modal classes to define the animations
 
-var modalTransitions = "\n.ReactModal__Overlay {\n  opacity: 0;\n  z-index: ".concat(Z_INDEXES.backdrop, ";\n}\n\n.ReactModal__Overlay--after-open {\n  opacity: 1;\n  transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content{\n  z-index: ").concat(Z_INDEXES.modal, ";\n  opacity:0;\n  transform: translate(-50%, -50%) scale(1.1, 1.1);\n}\n\n.ReactModal__Content--after-open{\n  opacity: 1;\n  transform: translate(-50%, -50%) scale(1.0, 1.0);\n  transition: transform 150ms ease-in-out, opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Overlay--before-close {\n  opacity: 0;\n  transition: opacity 120ms linear;\n}\n\n.ReactModal__Content--before-close{\n  opacity: 0;\n  transform: translate(-50%, -50%) scale(1.1, 1.1);\n  transition: transform 120ms ease-in-out, opacity 120ms cubic-bezier(0.55, 0.05, 0.67, 0.19);\n}\n");
+var modalTransitions = "\n\n@keyframes modalOpenAnimation {\n  from{\n    transform: scale(1.1, 1.1);\n  }\n  to {\n    transform: scale(1, 1);\n  }\n}\n\n.ReactModal__Overlay {\n  opacity: 0;\n  z-index: ".concat(Z_INDEXES.backdrop, ";\n  display:flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.ReactModal__Overlay--after-open {\n  opacity: 1;\n  transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content{\n  z-index: ").concat(Z_INDEXES.modal, ";\n  opacity:0;\n  transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content--after-open{\n  opacity: 1;\n  animation: modalOpenAnimation 150ms ease-in-out;\n}\n\n.ReactModal__Overlay--before-close {\n  opacity: 0;\n  transition: opacity 120ms linear;\n}\n\n.ReactModal__Content--before-close{\n  opacity: 0;\n  transform: scale(1.1, 1.1);\n  transition: transform 120ms ease-in-out, opacity 120ms cubic-bezier(0.55, 0.05, 0.67, 0.19);\n}\n");
 
 var ModalContainer = /*#__PURE__*/function (_React$Component) {
   _inherits(ModalContainer, _React$Component);

package/dist/Modals/ModalContainer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Modals/ModalContainer.tsx"],"names":["React","ReactModal","BOXSHADOWS","Z_INDEXES","ModalContainerStyles","content","top","left","right","bottom","marginRight","width","height","borderRadius","boxSizing","margin","overflow","boxShadow","BOXSHADOW_L3","modalTransitions","backdrop","modal","ModalContainer","defaultStyles","overlay","backgroundColor","document","querySelector","head","getElementsByTagName","style","createElement","setAttribute","appendChild","createTextNode","props","showModal","preventScroll","window","scrollY","prevProps","prevState","scroll","snapshot","resetScroll","id","closeModal","children","padding","minWidth","maxWidth","zIndex","parseInt","zIndexValue","Math","min","max","toast","stylesConfiguration","Object","assign","styles","getElementById","offset","openInstances","setState","body","position","state","scrollTo","Component"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport ReactModal from 'react-modal';\nimport {BOXSHADOWS} from '../styles';\nimport {Z_INDEXES} from '../styles';\n\nconst ModalContainerStyles = {\n  content: {\n    top: '50%',\n    left: '50%',\n    right: 'auto',\n    bottom: 'auto',\n    marginRight: '-50%',\n    width: '640px',\n    height: '320px',\n    borderRadius: '8px',\n    boxSizing: 'border-box' as any,\n    margin: 0,\n    overflow: 'auto',\n    boxShadow: BOXSHADOWS.BOXSHADOW_L3,\n  },\n};\n\n//override modal classes to define the animations\nconst modalTransitions = `\n.ReactModal__Overlay {\n  opacity: 0;\n  z-index: ${Z_INDEXES.backdrop};\n}\n\n.ReactModal__Overlay--after-open {\n  opacity: 1;\n  transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content{\n  z-index: ${Z_INDEXES.modal};\n  opacity:0;\n  transform: translate(-50%, -50%) scale(1.1, 1.1);\n}\n\n.ReactModal__Content--after-open{\n  opacity: 1;\n  transform: translate(-50%, -50%) scale(1.0, 1.0);\n  transition: transform 150ms ease-in-out, opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Overlay--before-close {\n  opacity: 0;\n  transition: opacity 120ms linear;\n}\n\n.ReactModal__Content--before-close{\n  opacity: 0;\n  transform: translate(-50%, -50%) scale(1.1, 1.1);\n  transition: transform 120ms ease-in-out, opacity 120ms cubic-bezier(0.55, 0.05, 0.67, 0.19);\n}\n`;\n\n\ntype ModalContainerProps = {\n  id?: string;\n  showModal: boolean;\n  closeModal: () => void;\n  children: any;\n  height?: any;\n  width?: any;\n  overflow?: string;\n  padding?: string;\n  minWidth?: string;\n  maxWidth?: string;\n  zIndex?: number;\n};\n\ntype ModalContainerState = {\n  scroll: number;\n};\n\nclass ModalContainer extends React.Component<ModalContainerProps, ModalContainerState> {\n  private static openInstances = 0;\n\n  componentDidMount() {\n    if (ReactModal.defaultStyles.overlay) {\n      ReactModal.defaultStyles.overlay.backgroundColor = 'rgba(0,0,0,0.5)';\n    }\n\n    //append style node to override modal transition classes\n    if (!document.querySelector('[modal-custom-styling=\"active\"]')) {\n      const head = document.head || document.getElementsByTagName('head')[0];\n      const style = document.createElement('style');\n      style.setAttribute('modal-custom-styling', 'active');\n      head.appendChild(style);\n      style.appendChild(document.createTextNode(modalTransitions));\n    }\n\n    if (this.props.showModal) {\n      this.preventScroll(window.scrollY);\n    }\n  }\n\n  getSnapshotBeforeUpdate(prevProps: Readonly<ModalContainerProps>, prevState: Readonly<ModalContainerState>): { scroll: number } {\n    return {scroll: window.scrollY};\n  }\n\n  componentDidUpdate(prevProps: Readonly<ModalContainerProps>, prevState: Readonly<ModalContainerState>, snapshot?: { scroll: number }) {\n    if (this.props.showModal && !prevProps.showModal) {\n      this.preventScroll(snapshot!.scroll);\n    }\n    if (!this.props.showModal && prevProps.showModal) {\n      this.resetScroll();\n    }\n  }\n\n  componentWillUnmount() {\n    if (this.props.showModal) {\n      this.resetScroll();\n    }\n  }\n\n  render() {\n    const {\n      id,\n      showModal,\n      closeModal,\n      children,\n      height = 'auto',\n      width = 'auto',\n      overflow = 'visible',\n      padding,\n      minWidth = '',\n      maxWidth = '',\n      zIndex = parseInt(Z_INDEXES.modal)\n    } = this.props;\n\n    // should be at least z-index of modal and below z-index of toast\n    const zIndexValue = Math.min(Math.max(zIndex, +Z_INDEXES.modal), +Z_INDEXES.toast - 1);\n    const stylesConfiguration = Object.assign({...ModalContainerStyles.content}, {\n      height,\n      width,\n      padding,\n      overflow,\n      minWidth,\n      maxWidth,\n      zIndex: zIndexValue\n    });\n    const styles = {content: stylesConfiguration};\n\n    return (\n      <ReactModal id={id}\n                  isOpen={showModal}\n                  closeTimeoutMS={120}\n                  onRequestClose={() => closeModal()}\n                  style={styles}\n                  appElement={document.getElementById('root') || ''}>\n        {children}\n      </ReactModal>\n    );\n  }\n\n  private preventScroll(offset: number) {\n    if (!ModalContainer.openInstances) {\n      this.setState({scroll: offset});\n      document.body.style.position = 'fixed';\n      document.body.style.left = `0px`;\n      document.body.style.right = `0px`;\n      document.body.style.top = `-${offset}px`;\n    }\n    ModalContainer.openInstances++\n  }\n\n  private resetScroll() {\n    ModalContainer.openInstances--;\n    if (!ModalContainer.openInstances) {\n      //@ts-ignore\n      document.body.style.position = null;\n      //@ts-ignore\n      document.body.style.left = null;\n      //@ts-ignore\n      document.body.style.top = null;\n      //@ts-ignore\n      document.body.style.right = null;\n      this.state.scroll && window.scrollTo(0, this.state.scroll);\n      this.setState({scroll: 0});\n    }\n  }\n}\n\nexport default ModalContainer;\n"],"file":"ModalContainer.js"}
+{"version":3,"sources":["../../src/Modals/ModalContainer.tsx"],"names":["React","ReactModal","BOXSHADOWS","Z_INDEXES","ModalContainerStyles","content","top","left","right","bottom","marginRight","width","height","borderRadius","boxSizing","margin","overflow","boxShadow","BOXSHADOW_L3","modalTransitions","backdrop","modal","ModalContainer","defaultStyles","overlay","backgroundColor","document","querySelector","head","getElementsByTagName","style","createElement","setAttribute","appendChild","createTextNode","props","showModal","preventScroll","window","scrollY","prevProps","prevState","scroll","snapshot","resetScroll","id","closeModal","children","padding","minWidth","maxWidth","zIndex","parseInt","zIndexValue","Math","min","max","toast","stylesConfiguration","Object","assign","styles","getElementById","offset","openInstances","setState","body","position","state","scrollTo","Component"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport ReactModal from 'react-modal';\nimport {BOXSHADOWS} from '../styles';\nimport {Z_INDEXES} from '../styles';\nimport styled, {keyframes} from 'styled-components';\n\nconst ModalContainerStyles = {\n  content: {\n    top: 'auto',\n    left: 'auto',\n    right: 'auto',\n    bottom: 'auto',\n    marginRight: '-50%',\n    width: '640px',\n    height: '320px',\n    borderRadius: '8px',\n    boxSizing: 'border-box' as any,\n    margin: 0,\n    overflow: 'auto',\n    boxShadow: BOXSHADOWS.BOXSHADOW_L3,\n  },\n};\n\n//override modal classes to define the animations\nconst modalTransitions = `\n\n@keyframes modalOpenAnimation {\n  from{\n    transform: scale(1.1, 1.1);\n  }\n  to {\n    transform: scale(1, 1);\n  }\n}\n\n.ReactModal__Overlay {\n  opacity: 0;\n  z-index: ${Z_INDEXES.backdrop};\n  display:flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.ReactModal__Overlay--after-open {\n  opacity: 1;\n  transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content{\n  z-index: ${Z_INDEXES.modal};\n  opacity:0;\n  transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content--after-open{\n  opacity: 1;\n  animation: modalOpenAnimation 150ms ease-in-out;\n}\n\n.ReactModal__Overlay--before-close {\n  opacity: 0;\n  transition: opacity 120ms linear;\n}\n\n.ReactModal__Content--before-close{\n  opacity: 0;\n  transform: scale(1.1, 1.1);\n  transition: transform 120ms ease-in-out, opacity 120ms cubic-bezier(0.55, 0.05, 0.67, 0.19);\n}\n`;\n\n\ntype ModalContainerProps = {\n  id?: string;\n  showModal: boolean;\n  closeModal: () => void;\n  children: any;\n  height?: any;\n  width?: any;\n  overflow?: string;\n  padding?: string;\n  minWidth?: string;\n  maxWidth?: string;\n  zIndex?: number;\n};\n\ntype ModalContainerState = {\n  scroll: number;\n};\n\nclass ModalContainer extends React.Component<ModalContainerProps, ModalContainerState> {\n  private static openInstances = 0;\n\n  componentDidMount() {\n    if (ReactModal.defaultStyles.overlay) {\n      ReactModal.defaultStyles.overlay.backgroundColor = 'rgba(0,0,0,0.5)';\n    }\n\n    //append style node to override modal transition classes\n    if (!document.querySelector('[modal-custom-styling=\"active\"]')) {\n      const head = document.head || document.getElementsByTagName('head')[0];\n      const style = document.createElement('style');\n      style.setAttribute('modal-custom-styling', 'active');\n      head.appendChild(style);\n      style.appendChild(document.createTextNode(modalTransitions));\n    }\n\n    if (this.props.showModal) {\n      this.preventScroll(window.scrollY);\n    }\n  }\n\n  getSnapshotBeforeUpdate(prevProps: Readonly<ModalContainerProps>, prevState: Readonly<ModalContainerState>): { scroll: number } {\n    return {scroll: window.scrollY};\n  }\n\n  componentDidUpdate(prevProps: Readonly<ModalContainerProps>, prevState: Readonly<ModalContainerState>, snapshot?: { scroll: number }) {\n    if (this.props.showModal && !prevProps.showModal) {\n      this.preventScroll(snapshot!.scroll);\n    }\n    if (!this.props.showModal && prevProps.showModal) {\n      this.resetScroll();\n    }\n  }\n\n  componentWillUnmount() {\n    if (this.props.showModal) {\n      this.resetScroll();\n    }\n  }\n\n  render() {\n    const {\n      id,\n      showModal,\n      closeModal,\n      children,\n      height = 'auto',\n      width = 'auto',\n      overflow = 'visible',\n      padding,\n      minWidth = '',\n      maxWidth = '',\n      zIndex = parseInt(Z_INDEXES.modal)\n    } = this.props;\n\n    // should be at least z-index of modal and below z-index of toast\n    const zIndexValue = Math.min(Math.max(zIndex, +Z_INDEXES.modal), +Z_INDEXES.toast - 1);\n    const stylesConfiguration = Object.assign({...ModalContainerStyles.content}, {\n      height,\n      width,\n      padding,\n      overflow,\n      minWidth,\n      maxWidth,\n      zIndex: zIndexValue\n    });\n    const styles = {content: stylesConfiguration};\n\n    return (\n      <ReactModal id={id}\n                  isOpen={showModal}\n                  closeTimeoutMS={120}\n                  onRequestClose={() => closeModal()}\n                  style={styles}\n                  appElement={document.getElementById('root') || ''}>\n        {children}\n      </ReactModal>\n    );\n  }\n\n  private preventScroll(offset: number) {\n    if (!ModalContainer.openInstances) {\n      this.setState({scroll: offset});\n      document.body.style.position = 'fixed';\n      document.body.style.left = `0px`;\n      document.body.style.right = `0px`;\n      document.body.style.top = `-${offset}px`;\n    }\n    ModalContainer.openInstances++\n  }\n\n  private resetScroll() {\n    ModalContainer.openInstances--;\n    if (!ModalContainer.openInstances) {\n      //@ts-ignore\n      document.body.style.position = null;\n      //@ts-ignore\n      document.body.style.left = null;\n      //@ts-ignore\n      document.body.style.top = null;\n      //@ts-ignore\n      document.body.style.right = null;\n      this.state.scroll && window.scrollTo(0, this.state.scroll);\n      this.setState({scroll: 0});\n    }\n  }\n}\n\nexport default ModalContainer;\n"],"file":"ModalContainer.js"}

package/dist/Modals/ModalDialog.cjs

@@ -147,7 +147,7 @@ var ModalDialog = function ModalDialog(_ref) {
   };
 
   var ModalTitle = function ModalTitle(title, size) {
-    if (typeof size === 'string') {
+    if (typeof title === 'string') {
       switch (size) {
         case _types.Size.Small:
           return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ComponentM, {
@@ -174,9 +174,7 @@ var ModalDialog = function ModalDialog(_ref) {
           });
       }
     } else {
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-        children: title
-      });
+      return title;
     }
   };
 
@@ -342,7 +340,7 @@ var ModalDialog = function ModalDialog(_ref) {
         }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ModalStyles.ModalTitleSection, {
           children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_ModalStyles.FlexContainer, {
             children: [!(topImage || topImageWithFallbacksProps) && ModalBackButton(), title && ModalTitle(title, size)]
-          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ModalStyles.ModalHeaderActions, {
+          }), (tooltip || !(topImage || topImageWithFallbacksProps)) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ModalStyles.ModalHeaderActions, {
             children: [tooltip && ModalTootip(tooltip), !(topImage || topImageWithFallbacksProps) && ModalCloseButton(closeAction)]
           })]
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ModalStyles.ModalBody, {

package/dist/Modals/ModalDialog.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Modals/ModalDialog.tsx"],"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"],"mappings":"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","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  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 size === '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            <ModalHeaderActions>\n              {tooltip && ModalTootip(tooltip)}\n              {!(topImage || topImageWithFallbacksProps) && ModalCloseButton(closeAction)}\n            </ModalHeaderActions>\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"],"file":"ModalDialog.cjs"}
+{"version":3,"sources":["../../src/Modals/ModalDialog.tsx"],"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"],"mappings":"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","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  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"],"file":"ModalDialog.cjs"}

package/dist/Modals/ModalDialog.js

@@ -10,7 +10,6 @@ import { ModalNote } from './ModalNote';
 import { TooltipWrapper } from '../Tooltips';
 import { HyperLink, ImageWithFallbacks } from '..';
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var ModalDialog = function ModalDialog(_ref) {
   var size = _ref.size,
@@ -128,7 +127,7 @@ export var ModalDialog = function ModalDialog(_ref) {
   };
 
   var ModalTitle = function ModalTitle(title, size) {
-    if (typeof size === 'string') {
+    if (typeof title === 'string') {
       switch (size) {
         case Size.Small:
           return /*#__PURE__*/_jsx(ComponentM, {
@@ -155,9 +154,7 @@ export var ModalDialog = function ModalDialog(_ref) {
           });
       }
     } else {
-      return /*#__PURE__*/_jsx(_Fragment, {
-        children: title
-      });
+      return title;
     }
   };
 
@@ -323,7 +320,7 @@ export var ModalDialog = function ModalDialog(_ref) {
         }), /*#__PURE__*/_jsxs(ModalTitleSection, {
           children: [/*#__PURE__*/_jsxs(FlexContainer, {
             children: [!(topImage || topImageWithFallbacksProps) && ModalBackButton(), title && ModalTitle(title, size)]
-          }), /*#__PURE__*/_jsxs(ModalHeaderActions, {
+          }), (tooltip || !(topImage || topImageWithFallbacksProps)) && /*#__PURE__*/_jsxs(ModalHeaderActions, {
             children: [tooltip && ModalTootip(tooltip), !(topImage || topImageWithFallbacksProps) && ModalCloseButton(closeAction)]
           })]
         }), /*#__PURE__*/_jsx(ModalBody, {

package/dist/Modals/ModalDialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Modals/ModalDialog.tsx"],"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"],"mappings":";AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,MAAT,EAAiBC,UAAjB,QAAmC,WAAnC;AACA,SAASC,aAAT,EAAwBC,KAAxB,EAA+BC,IAA/B,QAA2C,kCAA3C;AACA,SAASC,MAAT,EAAiBC,UAAjB,EAA6BC,UAA7B,EAAyCC,kBAAzC,EAA6DC,WAA7D,QAAgF,WAAhF;AACA,SAASC,IAAT,QAAqB,UAArB;AACA,OAAOC,cAAP,MAA2B,kBAA3B;AACA,SACEC,iBADF,EAEEC,kBAFF,EAGEC,MAHF,EAIEC,aAJF,EAKEC,SALF,EAMEC,WANF,EAOEC,kBAPF,EAQEC,2BARF,EASEC,iBATF,EAUEC,iBAVF,EAWEC,kBAXF,EAYEC,YAZF,EAaEC,cAbF,QAcO,eAdP;AAgBA,SAASC,SAAT,QAA0B,aAA1B;AACA,SAASC,cAAT,QAA+B,aAA/B;AAEA,SAASC,SAAT,EAAoBC,kBAApB,QAA8C,IAA9C;;;;AA0BA,OAAO,IAAMC,WAAmD,GAAG,SAAtDA,WAAsD,OAsB7D;AAAA,MArBJC,IAqBI,QArBJA,IAqBI;AAAA,MApBJC,WAoBI,QApBJA,WAoBI;AAAA,MAnBJC,uBAmBI,QAnBJA,uBAmBI;AAAA,MAlBJC,KAkBI,QAlBJA,KAkBI;AAAA,MAjBJC,QAiBI,QAjBJA,QAiBI;AAAA,MAhBJC,0BAgBI,QAhBJA,0BAgBI;AAAA,MAfJC,iBAeI,QAfJA,iBAeI;AAAA,MAdJC,OAcI,QAdJA,OAcI;AAAA,MAbJC,gBAaI,QAbJA,gBAaI;AAAA,MAZJC,UAYI,QAZJA,UAYI;AAAA,MAXJC,WAWI,QAXJA,WAWI;AAAA,MAVJC,YAUI,QAVJA,YAUI;AAAA,MATJC,OASI,QATJA,OASI;AAAA,MARJC,QAQI,QARJA,QAQI;AAAA,MAPJC,IAOI,QAPJA,IAOI;AAAA,MANJC,KAMI,QANJA,KAMI;AAAA,MALJC,IAKI,QALJA,IAKI;AAAA,MAJJC,MAII,QAJJA,MAII;AAAA,MAHJC,eAGI,QAHJA,eAGI;AAAA,MAFJC,KAEI,QAFJA,KAEI;AAAA,MADJC,iBACI,QADJA,iBACI;;AACJ,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB,YAAQrB,IAAR;AACE,WAAKpB,IAAI,CAAC0C,KAAV;AACE,eAAO,OAAP;;AACF,WAAK1C,IAAI,CAAC2C,KAAV;AACE,eAAO,OAAP;;AACF,WAAK3C,IAAI,CAAC4C,MAAV;AACA;AACE,eAAO,OAAP;AAPJ;AASD,GAVD;;AAYA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB,YAAQzB,IAAR;AACE,WAAKpB,IAAI,CAAC0C,KAAV;AACE,eAAO,OAAP;;AACF,WAAK1C,IAAI,CAAC2C,KAAV;AACE,eAAO,OAAP;;AACF,WAAK3C,IAAI,CAAC4C,MAAV;AACA;AACE,eAAO,OAAP;AAPJ;AASD,GAVD;;AAYA,MAAME,cAAc,GAAG,SAAjBA,cAAiB,GAAM;AAC3B,YAAQ1B,IAAR;AACE,WAAKpB,IAAI,CAAC0C,KAAV;AACE,eAAO,GAAP;;AACF,WAAK1C,IAAI,CAAC4C,MAAV;AACE,eAAO,GAAP;;AACF,WAAK5C,IAAI,CAAC2C,KAAV;AACE,eAAO,GAAP;;AACF;AACE,eAAO,GAAP;AARJ;AAUD,GAXD;;AAaA,MAAMI,eAAe,GAAG,SAAlBA,eAAkB,GAAM;AAC5B,YAAQ3B,IAAR;AACE,WAAKpB,IAAI,CAAC0C,KAAV;AACE,eAAO,MAAP;;AACF,WAAK1C,IAAI,CAAC4C,MAAV;AACE,eAAO,MAAP;;AACF,WAAK5C,IAAI,CAAC2C,KAAV;AACE,eAAO,MAAP;;AACF;AACE,eAAO,MAAP;AARJ;AAUD,GAXD;;AAaA,MAAMK,UAAU,GAAG,SAAbA,UAAa,GAAM;AACvB,YAAQ5B,IAAR;AACE,WAAKpB,IAAI,CAAC0C,KAAV;AACE,eAAO,eAAP;;AACF,WAAK1C,IAAI,CAAC4C,MAAV;AACE,eAAO,gBAAP;;AACF,WAAK5C,IAAI,CAAC2C,KAAV;AACE,eAAO,MAAP;;AACF;AACE,eAAO,gBAAP;AARJ;AAUD,GAXD;;AAaA,MAAMM,YAAY,GAAG,SAAfA,YAAe,GAAM;AACzB,YAAQ7B,IAAR;AACE,WAAKpB,IAAI,CAAC0C,KAAV;AACE,eAAO,oBAAP;;AACF,WAAK1C,IAAI,CAAC4C,MAAV;AACE,eAAO,oBAAP;;AACF,WAAK5C,IAAI,CAAC2C,KAAV;AACE,eAAO,oBAAP;;AACF;AACE,eAAO,oBAAP;AARJ;AAUD,GAXD;;AAaA,MAAMO,UAAU,GAAG,SAAbA,UAAa,CAAC3B,KAAD,EAAkCH,IAAlC,EAAkD;AACnE,QAAI,OAAOA,IAAP,KAAgB,QAApB,EAA8B;AAC5B,cAAQA,IAAR;AACE,aAAKpB,IAAI,CAAC0C,KAAV;AACE,8BAAO,KAAC,UAAD;AAAY,YAAA,SAAS,EAAE5C,kBAAkB,CAACqD,IAA1C;AAAA,sBAAiD5B;AAAjD,YAAP;;AACF,aAAKvB,IAAI,CAAC4C,MAAV;AACE,8BAAO,KAAC,UAAD;AAAY,YAAA,SAAS,EAAE9C,kBAAkB,CAACqD,IAA1C;AAAA,sBAAiD5B;AAAjD,YAAP;;AACF,aAAKvB,IAAI,CAAC2C,KAAV;AACE,8BAAO,KAAC,WAAD;AAAa,YAAA,SAAS,EAAE7C,kBAAkB,CAACqD,IAA3C;AAAA,sBAAkD5B;AAAlD,YAAP;;AACF;AACE,8BAAO,KAAC,UAAD;AAAY,YAAA,SAAS,EAAEzB,kBAAkB,CAACqD,IAA1C;AAAA,sBAAiD5B;AAAjD,YAAP;AARJ;AAUD,KAXD,MAWO;AACL,0BAAO;AAAA,kBAAGA;AAAH,QAAP;AACD;AACF,GAfD;;AAiBA,MAAM6B,WAAW,GAAG,SAAdA,WAAc,CAACpB,OAAD,EAAqB;AACvC,wBACE,KAAC,kBAAD;AAAA,6BACE,KAAC,cAAD;AAAgB,QAAA,KAAK,EAAC,IAAtB;AAA2B,QAAA,IAAI,EAAEhC,IAAI,CAACqD,MAAtC;AAA8C,QAAA,KAAK,EAAC,QAApD;AAA6D,QAAA,QAAQ,EAAC,KAAtE;AAA4E,QAAA,SAAS,EAAE,KAAvF;AAA8F,QAAA,KAAK,EAAErB,OAArG;AAAA,+BACE,KAAC,UAAD;AAAY,UAAA,OAAO,EAAC,WAApB;AAAgC,UAAA,KAAK,EAAC,UAAtC;AAAiD,UAAA,MAAM,EAAE,kBAAM,CAAE,CAAjE;AAAA,iCACE,KAAC,IAAD;AAAM,YAAA,IAAI,EAAC,MAAX;AAAkB,YAAA,KAAK,EAAErC,MAAM,CAAC2D;AAAhC;AADF;AADF;AADF,MADF;AASD,GAVD;;AAYA,MAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,OAAD,EAAkB;AACzC,wBACE,KAAC,kBAAD;AAAoB,MAAA,QAAQ,EAAE,CAAC,CAAChC,QAAF,IAAc,CAAC,CAACC,0BAA9C;AAA0E,MAAA,IAAI,EAAEL,IAAhF;AAAA,6BACE,KAAC,UAAD;AAAY,QAAA,OAAO,EAAC,WAApB;AAAgC,QAAA,KAAK,EAAC,UAAtC;AAAiD,QAAA,MAAM,EAAE;AAAA,iBAAMoC,OAAO,EAAb;AAAA,SAAzD;AAA0E,QAAA,YAAY,EAAE,EAAxF;AAAA,+BACE,KAAC,KAAD;AAAO,UAAA,IAAI,EAAC,MAAZ;AAAmB,UAAA,KAAK,EAAE7D,MAAM,CAAC8D;AAAjC;AADF;AADF,MADF;AAOD,GARD;;AAUA,MAAMC,eAAe,GAAG,SAAlBA,eAAkB,GAAM;AAC5B,QAAI7B,UAAJ,EAAgB;AACd,0BACE,KAAC,iBAAD;AAAmB,QAAA,QAAQ,EAAE,CAAC,CAACL,QAAF,IAAc,CAAC,CAACC,0BAA7C;AAAyE,QAAA,IAAI,EAAEL,IAA/E;AAAA,+BACE,KAAC,UAAD;AAAY,UAAA,OAAO,EAAC,WAApB;AAAgC,UAAA,KAAK,EAAC,UAAtC;AAAiD,UAAA,MAAM,EAAE;AAAA,mBAAMS,UAAU,EAAhB;AAAA,WAAzD;AAA6E,UAAA,YAAY,EAAE,EAA3F;AAAA,iCACE,KAAC,aAAD;AAAe,YAAA,IAAI,EAAC,MAApB;AAA2B,YAAA,KAAK,EAAElC,MAAM,CAAC8D;AAAzC;AADF;AADF,QADF;AAOD;AACF,GAVD;;AAYA,MAAME,wBAAwB,GAAG,SAA3BA,wBAA2B,CAACvB,IAAD,EAA2B;AAC1D,wBAAO/C,KAAK,CAACuE,YAAN,CAAmBxB,IAAnB,EAA+C;AAAEhB,MAAAA,IAAI,EAAEA,IAAI,KAAKpB,IAAI,CAAC0C,KAAd,GAAsB,MAAtB,GAA+BtB,IAAI,KAAKpB,IAAI,CAAC2C,KAAd,GAAsB,MAAtB,GAA+B;AAAtE,KAA/C,CAAP;AACD,GAFD;;AAIA,MAAMkB,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACjC,gBAAD,EAAwC;AAAA;;AAC/D,QAAQkC,IAAR,GAAqDlC,gBAArD,CAAQkC,IAAR;AAAA,QAAcC,UAAd,GAAqDnC,gBAArD,CAAcmC,UAAd;AAAA,QAA0BC,QAA1B,GAAqDpC,gBAArD,CAA0BoC,QAA1B;AAAA,QAAoC5B,IAApC,GAAqDR,gBAArD,CAAoCQ,IAApC;AAAA,QAA0C6B,MAA1C,GAAqDrC,gBAArD,CAA0CqC,MAA1C;;AACA,YAAQF,UAAR;AACE,WAAK,QAAL;AACE,4BACE,KAAC,MAAD;AACE,UAAA,EAAE,EAAE,oBADN;AAEE,UAAA,IAAI,EAAGnC,gBAAH,aAAGA,gBAAH,uBAAGA,gBAAD,CAAwCsC,IAFhD;AAGE,UAAA,QAAQ,EAAEF,QAHZ;AAIE,UAAA,OAAO,EAAGpC,gBAAH,aAAGA,gBAAH,uBAAGA,gBAAD,CAAwCuC,OAJnD;AAKE,UAAA,IAAI,EAAE/B,IALR;AAME,UAAA,IAAI,EAAEhB,IANR;AAOE,UAAA,OAAO,EAAE6C,MAPX;AAQE,UAAA,OAAO,cAAGrC,gBAAH,aAAGA,gBAAH,uBAAGA,gBAAD,CAAwCwC,OAA1C,+CAAqD,WAR9D;AASE,UAAA,KAAK,EAAE;AAAEC,YAAAA,KAAK,EAAE,CAAC,CAAV;AAAaC,YAAAA,WAAW,EAAE;AAA1B,WATT;AAAA,oBAUGR;AAVH,UADF;;AAcF,WAAK,WAAL;AACE,4BACE,MAAC,SAAD;AACE,UAAA,EAAE,EAAC,uBADL;AAEE,UAAA,SAAS,EAAC,eAFZ;AAGE,UAAA,IAAI,EAAGlC,gBAAD,CAA0C2C,IAHlD;AAIE,UAAA,QAAQ,EAAEP,QAJZ;AAKE,UAAA,OAAO,EAAC,SALV;AAME,UAAA,OAAO,EAAE,iBAACQ,CAAD,EAAO;AACd,gBAAIP,MAAJ,EAAY;AACVO,cAAAA,CAAC,CAACC,cAAF;AACAR,cAAAA,MAAM,CAACO,CAAD,CAAN;AACD;AACF,WAXH;AAAA,qBAYGpC,IAAI,IAAIuB,wBAAwB,CAACvB,IAAD,CAZnC,EAaG0B,IAbH;AAAA,UADF;;AAiBF,WAAK,MAAL;AACE,4BACE;AAAK,UAAA,SAAS,EAAC,oBAAf;AAAA,qBACG1B,IAAI,IAAIuB,wBAAwB,CAACvB,IAAD,CADnC,eAEE;AAAA,sBAAO0B;AAAP,YAFF;AAAA,UADF;AAnCJ;AA0CD,GA5CD;;AA8CA,sBACE,KAAC,cAAD;AACE,IAAA,SAAS,EAAEzC,WADb;AAEE,IAAA,UAAU,EAAEC,uBAFd;AAGE,IAAA,QAAQ,EAAEmB,WAAW,EAHvB;AAIE,IAAA,QAAQ,EAAEI,WAAW,EAJvB;AAKE,IAAA,MAAM,EAAC,MALT;AAME,IAAA,OAAO,EAAEG,UAAU,EANrB;AAOE,IAAA,MAAM,EAAEX,MAPV;AAQE,IAAA,KAAK,EAAEE,KART;AAAA,2BASE,KAAC,MAAD;AAAA,6BACE;AAAM,QAAA,QAAQ,EAAER,YAAhB;AAA8B,QAAA,KAAK,EAAE;AAAE2C,UAAAA,OAAO,EAAE,MAAX;AAAmBC,UAAAA,aAAa,EAAE,QAAlC;AAA4CC,UAAAA,SAAS,EAAE3B,YAAY;AAAnE,SAArC;AAAA,mBACG,CAACzB,QAAQ,IAAIC,0BAAb,kBACC,MAAC,iBAAD;AAAmB,UAAA,IAAI,EAAEL,IAAzB;AAA+B,UAAA,OAAO,EAAE0B,cAAc,EAAtD;AAA0D,UAAA,YAAY,EAAEC,eAAe,EAAvF;AAAA,kCACE,MAAC,cAAD;AAAgB,YAAA,OAAO,EAAED,cAAc,EAAvC;AAAA,uBACGpB,iBAAiB,iBAAI,KAAC,YAAD;AAAc,cAAA,OAAO,EAAEoB,cAAc;AAArC,cADxB,EAEGtB,QAAQ,iBAAI;AAAK,cAAA,GAAG,EAAEA,QAAV;AAAoB,cAAA,GAAG,EAAC;AAAxB,cAFf,EAGG,CAACA,QAAD,IAAaC,0BAAb,iBACC,KAAC,kBAAD;AACE,cAAA,MAAM,EAAEA,0BAA0B,CAACoD,MADrC;AAEE,cAAA,GAAG,EAAEpD,0BAA0B,CAACqD,GAFlC;AAGE,cAAA,SAAS,EAAErD,0BAA0B,CAACsD,SAHxC;AAIE,cAAA,GAAG,EAAEtD,0BAA0B,CAACuD;AAJlC,cAJJ;AAAA,YADF,eAaE,MAAC,2BAAD;AAA6B,YAAA,aAAa,EAAE,CAAC,CAACnD,UAA9C;AAAA,uBACG6B,eAAe,EADlB,EAEGH,gBAAgB,CAACzB,WAAD,CAFnB;AAAA,YAbF;AAAA,UAFJ,eAqBE,MAAC,iBAAD;AAAA,kCACE,MAAC,aAAD;AAAA,uBACG,EAAEN,QAAQ,IAAIC,0BAAd,KAA6CiC,eAAe,EAD/D,EAEGnC,KAAK,IAAI2B,UAAU,CAAC3B,KAAD,EAAQH,IAAR,CAFtB;AAAA,YADF,eAKE,MAAC,kBAAD;AAAA,uBACGY,OAAO,IAAIoB,WAAW,CAACpB,OAAD,CADzB,EAEG,EAAER,QAAQ,IAAIC,0BAAd,KAA6C8B,gBAAgB,CAACzB,WAAD,CAFhE;AAAA,YALF;AAAA,UArBF,eAgCE,KAAC,SAAD;AAAW,UAAA,IAAI,EAAEV,IAAjB;AAAuB,UAAA,QAAQ,EAAEkB,eAAjC;AAAkD,UAAA,iBAAiB,EAAEE,iBAArE;AAAA,oBACGP;AADH,UAhCF,EAoCGC,IAAI,iBAAI,KAAC,SAAD;AAAW,UAAA,IAAI,EAAEA,IAAjB;AAAuB,UAAA,KAAK,EAAEC,KAA9B;AAAqC,UAAA,IAAI,EAAEf,IAA3C;AAAiD,UAAA,IAAI,EAAEgB;AAAvD,UApCX,eAsCE,MAAC,WAAD;AAAa,UAAA,IAAI,EAAEhB,IAAnB;AAAA,qBACGQ,gBAAgB,IAAIiC,gBAAgB,CAACjC,gBAAD,CADvC,EAEGD,OAFH,aAEGA,OAFH,uBAEGA,OAAO,CAAEsD,GAAT,CAAa,UAACC,CAAD,EAAIC,CAAJ;AAAA,gCACZ,KAAC,MAAD;AAAwB,cAAA,IAAI,EAAED,CAAC,CAAC9C,IAAhC;AAAsC,cAAA,EAAE,EAAE8C,CAAC,CAACE,EAA5C;AAAgD,cAAA,QAAQ,EAAEF,CAAC,CAAClB,QAA5D;AAAsE,cAAA,OAAO,EAAEkB,CAAC,CAACf,OAAjF;AAA0F,cAAA,IAAI,EAAE/C,IAAhG;AAAsG,cAAA,OAAO,EAAE8D,CAAC,CAACjB,MAAjH;AAAyH,cAAA,IAAI,EAAEiB,CAAC,CAAChB,IAAjI;AAAuI,cAAA,OAAO,EAAEgB,CAAC,CAACd,OAAlJ;AAAA,wBACGc,CAAC,CAACpB;AADL,eAAaoB,CAAC,CAACE,EAAF,IAAQD,CAArB,CADY;AAAA,WAAb,CAFH;AAAA,UAtCF;AAAA;AADF;AATF,IADF;AA6DD,CArQM;;AArBL9D,EAAAA,W;AACAC,EAAAA,uB;AACAC,EAAAA,K;AACAC,EAAAA,Q;AAEAE,EAAAA,iB;AACAC,EAAAA,O;AAEAK,EAAAA,O;AACAH,EAAAA,U;AACAC,EAAAA,W;AACAC,EAAAA,Y;AACAG,EAAAA,I;AACAC,EAAAA,K;AACAC,EAAAA,I;AACAC,EAAAA,M;AACAC,EAAAA,e;AACAC,EAAAA,K;AACAC,EAAAA,iB;;AA0QF,eAAerB,WAAf","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  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 size === '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            <ModalHeaderActions>\n              {tooltip && ModalTootip(tooltip)}\n              {!(topImage || topImageWithFallbacksProps) && ModalCloseButton(closeAction)}\n            </ModalHeaderActions>\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"],"file":"ModalDialog.js"}
+{"version":3,"sources":["../../src/Modals/ModalDialog.tsx"],"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"],"mappings":"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","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  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"],"file":"ModalDialog.js"}

package/dist/Modals/ModalStyles.cjs

@@ -33,14 +33,14 @@ var ModalHeader = _styledComponents.default.section(_templateObject || (_templat
 });
 
 exports.ModalHeader = ModalHeader;
-var StyledModalHeader = (0, _styledComponents.default)(ModalHeader)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  flex: 1 0 calc(50% - 5px);\n  flex-direction: column;\n  flex-basis: auto;\n  position: relative;\n  text-align: left;\n  height: ", ";\n  img {\n    width: 100%;\n    height: ", ";\n    object-fit: cover;\n    border-radius: 8px 8px 0 0;\n  }\n"])), function (props) {
+var StyledModalHeader = (0, _styledComponents.default)(ModalHeader)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  flex: 1 0 calc(50% - 5px);\n  flex-direction: column;\n  flex-basis: auto;\n  text-align: left;\n  height: ", ";\n  img {\n    width: 100%;\n    height: ", ";\n    object-fit: cover;\n    border-radius: 8px 8px 0 0;\n  }\n"])), function (props) {
   return props.$height ? "".concat(props.$height - (props.size === 'small' ? 16 : props.size === 'large' ? 32 : 24), "px") : '';
 }, function (props) {
   return "".concat(props.$height, "px");
 });
 exports.StyledModalHeader = StyledModalHeader;
 
-var ImageContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ", ";\n\n  #imgWithFallbackLoadingIndicator {\n    position: absolute;\n    left: 50%;\n    top: 0;\n  }\n"])), function (props) {
+var ImageContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ", ";\n\n  #imgWithFallbackLoadingIndicator {\n    position: absolute;\n    left: 50%;\n    top: 0;\n  }\n"])), function (props) {
   return "".concat(props.$height, "px");
 });
 
@@ -72,7 +72,7 @@ var ModalHeaderActions = _styledComponents.default.div(_templateObject8 || (_tem
 
 exports.ModalHeaderActions = ModalHeaderActions;
 
-var FlexContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n"])));
+var FlexContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  width: 100%;\n"])));
 
 exports.FlexContainer = FlexContainer;
 

package/dist/Modals/ModalStyles.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Modals/ModalStyles.ts"],"names":["ModalHeader","styled","section","props","marginBottom","StyledModalHeader","$height","size","ImageContainer","div","ImageOverlay","Column","ModalTitleSection","ModalHeaderActionsWithImage","hasBackButton","ModalHeaderActions","FlexContainer","ModalHoverModifier","CloseButtonWrapper","hasImage","css","BackButtonWrapper","ModalTitle","h5","fontSize","ModalNoteSection","getBackgroundColor","state","getNoteMessageColor","ModalBody","overflow","hasContentBorders","COLORS","neutral_100","Size","Small","ModalFooter","Large","neutral_600","correct_100","warning_100","critical_100","primary_100","correct_700","warning_700","critical_700","primary_700"],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { COLORS } from '..';\nimport { scrollBarStyling } from '../styles';\nimport { Size } from '../types';\n\n/**\n * Modal styles\n */\nexport const ModalHeader = styled.section<{ marginBottom?: string }>`\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: ${(props) => props.marginBottom || '24px'};\n`;\n\nexport const StyledModalHeader = styled(ModalHeader)<{ marginBottom?: string; size?: string; $height?: number }>`\n  flex: 1 0 calc(50% - 5px);\n  flex-direction: column;\n  flex-basis: auto;\n  position: relative;\n  text-align: left;\n  height: ${(props) => (props.$height ? `${props.$height - (props.size === 'small' ? 16 : props.size === 'large' ? 32 : 24)}px` : '')};\n  img {\n    width: 100%;\n    height: ${(props) => `${props.$height}px`};\n    object-fit: cover;\n    border-radius: 8px 8px 0 0;\n  }\n`;\n\nexport const ImageContainer = styled.div<{ $height: number }>`\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ${(props) => `${props.$height}px`};\n\n  #imgWithFallbackLoadingIndicator {\n    position: absolute;\n    left: 50%;\n    top: 0;\n  }\n`;\n\nexport const ImageOverlay = styled.div<{ $height: number }>`\n  position: absolute;\n  content: '';\n  top: 0;\n  left: 0;\n  height: ${(props) => `${props.$height}px`};\n  width: 100%;\n  background: rgba(255, 255, 255, 0.5);\n  border-radius: 8px 8px 0 0;\n\n  :after {\n    position: absolute;\n    height: ${(props) => `${props.$height}px`};\n    border-radius: 8px 8px 0 0;\n    content: '';\n    top: 0;\n    left: 0;\n    width: 100%;\n    background: #888888;\n    mix-blend-mode: saturation;\n  }\n`;\n\nexport const Column = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: stretch;\n  height: 100%;\n`;\n\nexport const ModalTitleSection = styled.section`\n  word-break: break-word;\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n`;\n\nexport const ModalHeaderActionsWithImage = styled.div<{ hasBackButton?: boolean }>`\n  display: flex;\n  flex-direction: ${(props) => (!props.hasBackButton ? 'row-reverse' : 'row')};\n  justify-content: space-between;\n  width: 100%;\n  z-index: 1;\n`;\n\nexport const ModalHeaderActions = styled.div`\n  display: flex;\n  margin: -12px -12px 0 0;\n`;\n\nexport const FlexContainer = styled.div`\n  display: flex;\n`;\n\nexport const ModalHoverModifier = styled.div`\n  button:hover {\n    cursor: help !important;\n  }\n`;\n\nexport const CloseButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    ${(props) =>\n      props.hasImage\n        ? css`\n            margin: -12px -12px 0 0 !important;\n          `\n        : css`\n            left: unset;\n          `}\n  }\n`;\n\nexport const BackButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    margin: -12px 0 0 -12px !important;\n  }\n`;\n\nexport const ModalTitle = styled.h5<{ fontSize?: string }>`\n  margin: 0;\n  font-size: ${(props) => props.fontSize || '1.25em'};\n  font-weight: bold;\n`;\n\nexport const ModalNoteSection = styled.section<{ state: string; size?: string }>`\n  background-color: ${(props) => getBackgroundColor(props.state)};\n  font-size: ${(props) => (props?.size === 'small' ? `16px` : props?.size === 'large' ? '20px' : '18px')};\n  margin-top: ${(props) => (props?.size === 'small' ? `0px` : props?.size === 'large' ? '16px' : '4px')};\n  margin-bottom: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '24px' : '16px')};\n  display: flex;\n  flex-direction: row;\n  padding: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '16px' : '12px')};\n  border-radius: 2px;\n\n  span {\n    display: block;\n    width: calc(100% - 32px);\n    margin-left: 8px;\n    color: ${(props) => getNoteMessageColor(props.state)};\n  }\n`;\n\nexport const ModalBody = styled.section<{ size?: string; overflow?: string; hasContentBorders?: boolean }>`\n  flex: 1 1 auto;\n  overflow: ${(props) => props?.overflow ?? 'unset'};\n  margin: ${(props) => (props?.size === 'small' ? `8px 0` : props?.size === 'large' ? '16px 0' : '12px 0')};\n\n  border-top: ${(props) => (props?.hasContentBorders ? `1px solid ${COLORS.neutral_100}` : 'none')};\n  border-bottom: ${(props) => (props?.hasContentBorders ? `1px solid ${COLORS.neutral_100}` : 'none')};\n\n  ${scrollBarStyling(Size.Small)}\n`;\n\nexport const ModalFooter = styled.section<{ size?: Size }>`\n  display: flex;\n  justify-content: flex-end;\n\n  gap: ${(props) => (props?.size === 'large' ? `16px` : '8px')};\n\n  .footer-action {\n    order: -1;\n    margin-right: auto;\n    display: flex;\n    align-items: center;\n    font-size: ${(props) => (props?.size === 'small' ? `16px` : props?.size === 'large' ? '20px' : '18px')};\n    gap: ${(props) => (props?.size === Size.Large ? `8px` : props?.size === Size.Small ? '4px' : '6px')};\n  }\n\n  .footer-action.note {\n    color: ${COLORS.neutral_600};\n  }\n`;\n\nexport const getBackgroundColor = (state: string) => {\n  switch (state) {\n    case 'positive':\n      return COLORS.correct_100;\n    case 'warning':\n      return COLORS.warning_100;\n    case 'critical':\n      return COLORS.critical_100;\n    default:\n      return COLORS.primary_100;\n  }\n};\n\nexport const getNoteMessageColor = (state: string) => {\n  switch (state) {\n    case 'positive':\n      return COLORS.correct_700;\n    case 'warning':\n      return COLORS.warning_700;\n    case 'critical':\n      return COLORS.critical_700;\n    default:\n      return COLORS.primary_700;\n  }\n};\n"],"file":"ModalStyles.cjs"}
+{"version":3,"sources":["../../src/Modals/ModalStyles.ts"],"names":["ModalHeader","styled","section","props","marginBottom","StyledModalHeader","$height","size","ImageContainer","div","ImageOverlay","Column","ModalTitleSection","ModalHeaderActionsWithImage","hasBackButton","ModalHeaderActions","FlexContainer","ModalHoverModifier","CloseButtonWrapper","hasImage","css","BackButtonWrapper","ModalTitle","h5","fontSize","ModalNoteSection","getBackgroundColor","state","getNoteMessageColor","ModalBody","overflow","hasContentBorders","COLORS","neutral_100","Size","Small","ModalFooter","Large","neutral_600","correct_100","warning_100","critical_100","primary_100","correct_700","warning_700","critical_700","primary_700"],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { COLORS } from '..';\nimport { scrollBarStyling } from '../styles';\nimport { Size } from '../types';\n\n/**\n * Modal styles\n */\nexport const ModalHeader = styled.section<{ marginBottom?: string }>`\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: ${(props) => props.marginBottom || '24px'};\n`;\n\nexport const StyledModalHeader = styled(ModalHeader)<{ marginBottom?: string; size?: string; $height?: number }>`\n  flex: 1 0 calc(50% - 5px);\n  flex-direction: column;\n  flex-basis: auto;\n  text-align: left;\n  height: ${(props) => (props.$height ? `${props.$height - (props.size === 'small' ? 16 : props.size === 'large' ? 32 : 24)}px` : '')};\n  img {\n    width: 100%;\n    height: ${(props) => `${props.$height}px`};\n    object-fit: cover;\n    border-radius: 8px 8px 0 0;\n  }\n`;\n\nexport const ImageContainer = styled.div<{ $height: number }>`\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ${(props) => `${props.$height}px`};\n\n  #imgWithFallbackLoadingIndicator {\n    position: absolute;\n    left: 50%;\n    top: 0;\n  }\n`;\n\nexport const ImageOverlay = styled.div<{ $height: number }>`\n  position: absolute;\n  content: '';\n  top: 0;\n  left: 0;\n  height: ${(props) => `${props.$height}px`};\n  width: 100%;\n  background: rgba(255, 255, 255, 0.5);\n  border-radius: 8px 8px 0 0;\n\n  :after {\n    position: absolute;\n    height: ${(props) => `${props.$height}px`};\n    border-radius: 8px 8px 0 0;\n    content: '';\n    top: 0;\n    left: 0;\n    width: 100%;\n    background: #888888;\n    mix-blend-mode: saturation;\n  }\n`;\n\nexport const Column = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: stretch;\n  height: 100%;\n`;\n\nexport const ModalTitleSection = styled.section`\n  word-break: break-word;\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n`;\n\nexport const ModalHeaderActionsWithImage = styled.div<{ hasBackButton?: boolean }>`\n  display: flex;\n  flex-direction: ${(props) => (!props.hasBackButton ? 'row-reverse' : 'row')};\n  justify-content: space-between;\n  width: 100%;\n  z-index: 1;\n`;\n\nexport const ModalHeaderActions = styled.div`\n  display: flex;\n  margin: -12px -12px 0 0;\n`;\n\nexport const FlexContainer = styled.div`\n  display: flex;\n  width: 100%;\n`;\n\nexport const ModalHoverModifier = styled.div`\n  button:hover {\n    cursor: help !important;\n  }\n`;\n\nexport const CloseButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    ${(props) =>\n      props.hasImage\n        ? css`\n            margin: -12px -12px 0 0 !important;\n          `\n        : css`\n            left: unset;\n          `}\n  }\n`;\n\nexport const BackButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    margin: -12px 0 0 -12px !important;\n  }\n`;\n\nexport const ModalTitle = styled.h5<{ fontSize?: string }>`\n  margin: 0;\n  font-size: ${(props) => props.fontSize || '1.25em'};\n  font-weight: bold;\n`;\n\nexport const ModalNoteSection = styled.section<{ state: string; size?: string }>`\n  background-color: ${(props) => getBackgroundColor(props.state)};\n  font-size: ${(props) => (props?.size === 'small' ? `16px` : props?.size === 'large' ? '20px' : '18px')};\n  margin-top: ${(props) => (props?.size === 'small' ? `0px` : props?.size === 'large' ? '16px' : '4px')};\n  margin-bottom: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '24px' : '16px')};\n  display: flex;\n  flex-direction: row;\n  padding: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '16px' : '12px')};\n  border-radius: 2px;\n\n  span {\n    display: block;\n    width: calc(100% - 32px);\n    margin-left: 8px;\n    color: ${(props) => getNoteMessageColor(props.state)};\n  }\n`;\n\nexport const ModalBody = styled.section<{ size?: string; overflow?: string; hasContentBorders?: boolean }>`\n  flex: 1 1 auto;\n  overflow: ${(props) => props?.overflow ?? 'unset'};\n  margin: ${(props) => (props?.size === 'small' ? `8px 0` : props?.size === 'large' ? '16px 0' : '12px 0')};\n\n  border-top: ${(props) => (props?.hasContentBorders ? `1px solid ${COLORS.neutral_100}` : 'none')};\n  border-bottom: ${(props) => (props?.hasContentBorders ? `1px solid ${COLORS.neutral_100}` : 'none')};\n\n  ${scrollBarStyling(Size.Small)}\n`;\n\nexport const ModalFooter = styled.section<{ size?: Size }>`\n  display: flex;\n  justify-content: flex-end;\n\n  gap: ${(props) => (props?.size === 'large' ? `16px` : '8px')};\n\n  .footer-action {\n    order: -1;\n    margin-right: auto;\n    display: flex;\n    align-items: center;\n    font-size: ${(props) => (props?.size === 'small' ? `16px` : props?.size === 'large' ? '20px' : '18px')};\n    gap: ${(props) => (props?.size === Size.Large ? `8px` : props?.size === Size.Small ? '4px' : '6px')};\n  }\n\n  .footer-action.note {\n    color: ${COLORS.neutral_600};\n  }\n`;\n\nexport const getBackgroundColor = (state: string) => {\n  switch (state) {\n    case 'positive':\n      return COLORS.correct_100;\n    case 'warning':\n      return COLORS.warning_100;\n    case 'critical':\n      return COLORS.critical_100;\n    default:\n      return COLORS.primary_100;\n  }\n};\n\nexport const getNoteMessageColor = (state: string) => {\n  switch (state) {\n    case 'positive':\n      return COLORS.correct_700;\n    case 'warning':\n      return COLORS.warning_700;\n    case 'critical':\n      return COLORS.critical_700;\n    default:\n      return COLORS.primary_700;\n  }\n};\n"],"file":"ModalStyles.cjs"}

package/dist/Modals/ModalStyles.js

@@ -13,12 +13,12 @@ import { Size } from '../types';
 export var ModalHeader = styled.section(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: ", ";\n"])), function (props) {
   return props.marginBottom || '24px';
 });
-export var StyledModalHeader = styled(ModalHeader)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  flex: 1 0 calc(50% - 5px);\n  flex-direction: column;\n  flex-basis: auto;\n  position: relative;\n  text-align: left;\n  height: ", ";\n  img {\n    width: 100%;\n    height: ", ";\n    object-fit: cover;\n    border-radius: 8px 8px 0 0;\n  }\n"])), function (props) {
+export var StyledModalHeader = styled(ModalHeader)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  flex: 1 0 calc(50% - 5px);\n  flex-direction: column;\n  flex-basis: auto;\n  text-align: left;\n  height: ", ";\n  img {\n    width: 100%;\n    height: ", ";\n    object-fit: cover;\n    border-radius: 8px 8px 0 0;\n  }\n"])), function (props) {
   return props.$height ? "".concat(props.$height - (props.size === 'small' ? 16 : props.size === 'large' ? 32 : 24), "px") : '';
 }, function (props) {
   return "".concat(props.$height, "px");
 });
-export var ImageContainer = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ", ";\n\n  #imgWithFallbackLoadingIndicator {\n    position: absolute;\n    left: 50%;\n    top: 0;\n  }\n"])), function (props) {
+export var ImageContainer = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ", ";\n\n  #imgWithFallbackLoadingIndicator {\n    position: absolute;\n    left: 50%;\n    top: 0;\n  }\n"])), function (props) {
   return "".concat(props.$height, "px");
 });
 export var ImageOverlay = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  position: absolute;\n  content: '';\n  top: 0;\n  left: 0;\n  height: ", ";\n  width: 100%;\n  background: rgba(255, 255, 255, 0.5);\n  border-radius: 8px 8px 0 0;\n\n  :after {\n    position: absolute;\n    height: ", ";\n    border-radius: 8px 8px 0 0;\n    content: '';\n    top: 0;\n    left: 0;\n    width: 100%;\n    background: #888888;\n    mix-blend-mode: saturation;\n  }\n"])), function (props) {
@@ -32,7 +32,7 @@ export var ModalHeaderActionsWithImage = styled.div(_templateObject7 || (_templa
   return !props.hasBackButton ? 'row-reverse' : 'row';
 });
 export var ModalHeaderActions = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  display: flex;\n  margin: -12px -12px 0 0;\n"])));
-export var FlexContainer = styled.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  display: flex;\n"])));
+export var FlexContainer = styled.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n"])));
 export var ModalHoverModifier = styled.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  button:hover {\n    cursor: help !important;\n  }\n"])));
 export var CloseButtonWrapper = styled.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n  button {\n    ", "\n  }\n"])), function (props) {
   return props.hasImage ? css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n            margin: -12px -12px 0 0 !important;\n          "]))) : css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n            left: unset;\n          "])));

package/dist/Modals/ModalStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Modals/ModalStyles.ts"],"names":["styled","css","COLORS","scrollBarStyling","Size","ModalHeader","section","props","marginBottom","StyledModalHeader","$height","size","ImageContainer","div","ImageOverlay","Column","ModalTitleSection","ModalHeaderActionsWithImage","hasBackButton","ModalHeaderActions","FlexContainer","ModalHoverModifier","CloseButtonWrapper","hasImage","BackButtonWrapper","ModalTitle","h5","fontSize","ModalNoteSection","getBackgroundColor","state","getNoteMessageColor","ModalBody","overflow","hasContentBorders","neutral_100","Small","ModalFooter","Large","neutral_600","correct_100","warning_100","critical_100","primary_100","correct_700","warning_700","critical_700","primary_700"],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { COLORS } from '..';\nimport { scrollBarStyling } from '../styles';\nimport { Size } from '../types';\n\n/**\n * Modal styles\n */\nexport const ModalHeader = styled.section<{ marginBottom?: string }>`\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: ${(props) => props.marginBottom || '24px'};\n`;\n\nexport const StyledModalHeader = styled(ModalHeader)<{ marginBottom?: string; size?: string; $height?: number }>`\n  flex: 1 0 calc(50% - 5px);\n  flex-direction: column;\n  flex-basis: auto;\n  position: relative;\n  text-align: left;\n  height: ${(props) => (props.$height ? `${props.$height - (props.size === 'small' ? 16 : props.size === 'large' ? 32 : 24)}px` : '')};\n  img {\n    width: 100%;\n    height: ${(props) => `${props.$height}px`};\n    object-fit: cover;\n    border-radius: 8px 8px 0 0;\n  }\n`;\n\nexport const ImageContainer = styled.div<{ $height: number }>`\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ${(props) => `${props.$height}px`};\n\n  #imgWithFallbackLoadingIndicator {\n    position: absolute;\n    left: 50%;\n    top: 0;\n  }\n`;\n\nexport const ImageOverlay = styled.div<{ $height: number }>`\n  position: absolute;\n  content: '';\n  top: 0;\n  left: 0;\n  height: ${(props) => `${props.$height}px`};\n  width: 100%;\n  background: rgba(255, 255, 255, 0.5);\n  border-radius: 8px 8px 0 0;\n\n  :after {\n    position: absolute;\n    height: ${(props) => `${props.$height}px`};\n    border-radius: 8px 8px 0 0;\n    content: '';\n    top: 0;\n    left: 0;\n    width: 100%;\n    background: #888888;\n    mix-blend-mode: saturation;\n  }\n`;\n\nexport const Column = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: stretch;\n  height: 100%;\n`;\n\nexport const ModalTitleSection = styled.section`\n  word-break: break-word;\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n`;\n\nexport const ModalHeaderActionsWithImage = styled.div<{ hasBackButton?: boolean }>`\n  display: flex;\n  flex-direction: ${(props) => (!props.hasBackButton ? 'row-reverse' : 'row')};\n  justify-content: space-between;\n  width: 100%;\n  z-index: 1;\n`;\n\nexport const ModalHeaderActions = styled.div`\n  display: flex;\n  margin: -12px -12px 0 0;\n`;\n\nexport const FlexContainer = styled.div`\n  display: flex;\n`;\n\nexport const ModalHoverModifier = styled.div`\n  button:hover {\n    cursor: help !important;\n  }\n`;\n\nexport const CloseButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    ${(props) =>\n      props.hasImage\n        ? css`\n            margin: -12px -12px 0 0 !important;\n          `\n        : css`\n            left: unset;\n          `}\n  }\n`;\n\nexport const BackButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    margin: -12px 0 0 -12px !important;\n  }\n`;\n\nexport const ModalTitle = styled.h5<{ fontSize?: string }>`\n  margin: 0;\n  font-size: ${(props) => props.fontSize || '1.25em'};\n  font-weight: bold;\n`;\n\nexport const ModalNoteSection = styled.section<{ state: string; size?: string }>`\n  background-color: ${(props) => getBackgroundColor(props.state)};\n  font-size: ${(props) => (props?.size === 'small' ? `16px` : props?.size === 'large' ? '20px' : '18px')};\n  margin-top: ${(props) => (props?.size === 'small' ? `0px` : props?.size === 'large' ? '16px' : '4px')};\n  margin-bottom: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '24px' : '16px')};\n  display: flex;\n  flex-direction: row;\n  padding: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '16px' : '12px')};\n  border-radius: 2px;\n\n  span {\n    display: block;\n    width: calc(100% - 32px);\n    margin-left: 8px;\n    color: ${(props) => getNoteMessageColor(props.state)};\n  }\n`;\n\nexport const ModalBody = styled.section<{ size?: string; overflow?: string; hasContentBorders?: boolean }>`\n  flex: 1 1 auto;\n  overflow: ${(props) => props?.overflow ?? 'unset'};\n  margin: ${(props) => (props?.size === 'small' ? `8px 0` : props?.size === 'large' ? '16px 0' : '12px 0')};\n\n  border-top: ${(props) => (props?.hasContentBorders ? `1px solid ${COLORS.neutral_100}` : 'none')};\n  border-bottom: ${(props) => (props?.hasContentBorders ? `1px solid ${COLORS.neutral_100}` : 'none')};\n\n  ${scrollBarStyling(Size.Small)}\n`;\n\nexport const ModalFooter = styled.section<{ size?: Size }>`\n  display: flex;\n  justify-content: flex-end;\n\n  gap: ${(props) => (props?.size === 'large' ? `16px` : '8px')};\n\n  .footer-action {\n    order: -1;\n    margin-right: auto;\n    display: flex;\n    align-items: center;\n    font-size: ${(props) => (props?.size === 'small' ? `16px` : props?.size === 'large' ? '20px' : '18px')};\n    gap: ${(props) => (props?.size === Size.Large ? `8px` : props?.size === Size.Small ? '4px' : '6px')};\n  }\n\n  .footer-action.note {\n    color: ${COLORS.neutral_600};\n  }\n`;\n\nexport const getBackgroundColor = (state: string) => {\n  switch (state) {\n    case 'positive':\n      return COLORS.correct_100;\n    case 'warning':\n      return COLORS.warning_100;\n    case 'critical':\n      return COLORS.critical_100;\n    default:\n      return COLORS.primary_100;\n  }\n};\n\nexport const getNoteMessageColor = (state: string) => {\n  switch (state) {\n    case 'positive':\n      return COLORS.correct_700;\n    case 'warning':\n      return COLORS.warning_700;\n    case 'critical':\n      return COLORS.critical_700;\n    default:\n      return COLORS.primary_700;\n  }\n};\n"],"file":"ModalStyles.js"}
+{"version":3,"sources":["../../src/Modals/ModalStyles.ts"],"names":["styled","css","COLORS","scrollBarStyling","Size","ModalHeader","section","props","marginBottom","StyledModalHeader","$height","size","ImageContainer","div","ImageOverlay","Column","ModalTitleSection","ModalHeaderActionsWithImage","hasBackButton","ModalHeaderActions","FlexContainer","ModalHoverModifier","CloseButtonWrapper","hasImage","BackButtonWrapper","ModalTitle","h5","fontSize","ModalNoteSection","getBackgroundColor","state","getNoteMessageColor","ModalBody","overflow","hasContentBorders","neutral_100","Small","ModalFooter","Large","neutral_600","correct_100","warning_100","critical_100","primary_100","correct_700","warning_700","critical_700","primary_700"],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { COLORS } from '..';\nimport { scrollBarStyling } from '../styles';\nimport { Size } from '../types';\n\n/**\n * Modal styles\n */\nexport const ModalHeader = styled.section<{ marginBottom?: string }>`\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: ${(props) => props.marginBottom || '24px'};\n`;\n\nexport const StyledModalHeader = styled(ModalHeader)<{ marginBottom?: string; size?: string; $height?: number }>`\n  flex: 1 0 calc(50% - 5px);\n  flex-direction: column;\n  flex-basis: auto;\n  text-align: left;\n  height: ${(props) => (props.$height ? `${props.$height - (props.size === 'small' ? 16 : props.size === 'large' ? 32 : 24)}px` : '')};\n  img {\n    width: 100%;\n    height: ${(props) => `${props.$height}px`};\n    object-fit: cover;\n    border-radius: 8px 8px 0 0;\n  }\n`;\n\nexport const ImageContainer = styled.div<{ $height: number }>`\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ${(props) => `${props.$height}px`};\n\n  #imgWithFallbackLoadingIndicator {\n    position: absolute;\n    left: 50%;\n    top: 0;\n  }\n`;\n\nexport const ImageOverlay = styled.div<{ $height: number }>`\n  position: absolute;\n  content: '';\n  top: 0;\n  left: 0;\n  height: ${(props) => `${props.$height}px`};\n  width: 100%;\n  background: rgba(255, 255, 255, 0.5);\n  border-radius: 8px 8px 0 0;\n\n  :after {\n    position: absolute;\n    height: ${(props) => `${props.$height}px`};\n    border-radius: 8px 8px 0 0;\n    content: '';\n    top: 0;\n    left: 0;\n    width: 100%;\n    background: #888888;\n    mix-blend-mode: saturation;\n  }\n`;\n\nexport const Column = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: stretch;\n  height: 100%;\n`;\n\nexport const ModalTitleSection = styled.section`\n  word-break: break-word;\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n`;\n\nexport const ModalHeaderActionsWithImage = styled.div<{ hasBackButton?: boolean }>`\n  display: flex;\n  flex-direction: ${(props) => (!props.hasBackButton ? 'row-reverse' : 'row')};\n  justify-content: space-between;\n  width: 100%;\n  z-index: 1;\n`;\n\nexport const ModalHeaderActions = styled.div`\n  display: flex;\n  margin: -12px -12px 0 0;\n`;\n\nexport const FlexContainer = styled.div`\n  display: flex;\n  width: 100%;\n`;\n\nexport const ModalHoverModifier = styled.div`\n  button:hover {\n    cursor: help !important;\n  }\n`;\n\nexport const CloseButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    ${(props) =>\n      props.hasImage\n        ? css`\n            margin: -12px -12px 0 0 !important;\n          `\n        : css`\n            left: unset;\n          `}\n  }\n`;\n\nexport const BackButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    margin: -12px 0 0 -12px !important;\n  }\n`;\n\nexport const ModalTitle = styled.h5<{ fontSize?: string }>`\n  margin: 0;\n  font-size: ${(props) => props.fontSize || '1.25em'};\n  font-weight: bold;\n`;\n\nexport const ModalNoteSection = styled.section<{ state: string; size?: string }>`\n  background-color: ${(props) => getBackgroundColor(props.state)};\n  font-size: ${(props) => (props?.size === 'small' ? `16px` : props?.size === 'large' ? '20px' : '18px')};\n  margin-top: ${(props) => (props?.size === 'small' ? `0px` : props?.size === 'large' ? '16px' : '4px')};\n  margin-bottom: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '24px' : '16px')};\n  display: flex;\n  flex-direction: row;\n  padding: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '16px' : '12px')};\n  border-radius: 2px;\n\n  span {\n    display: block;\n    width: calc(100% - 32px);\n    margin-left: 8px;\n    color: ${(props) => getNoteMessageColor(props.state)};\n  }\n`;\n\nexport const ModalBody = styled.section<{ size?: string; overflow?: string; hasContentBorders?: boolean }>`\n  flex: 1 1 auto;\n  overflow: ${(props) => props?.overflow ?? 'unset'};\n  margin: ${(props) => (props?.size === 'small' ? `8px 0` : props?.size === 'large' ? '16px 0' : '12px 0')};\n\n  border-top: ${(props) => (props?.hasContentBorders ? `1px solid ${COLORS.neutral_100}` : 'none')};\n  border-bottom: ${(props) => (props?.hasContentBorders ? `1px solid ${COLORS.neutral_100}` : 'none')};\n\n  ${scrollBarStyling(Size.Small)}\n`;\n\nexport const ModalFooter = styled.section<{ size?: Size }>`\n  display: flex;\n  justify-content: flex-end;\n\n  gap: ${(props) => (props?.size === 'large' ? `16px` : '8px')};\n\n  .footer-action {\n    order: -1;\n    margin-right: auto;\n    display: flex;\n    align-items: center;\n    font-size: ${(props) => (props?.size === 'small' ? `16px` : props?.size === 'large' ? '20px' : '18px')};\n    gap: ${(props) => (props?.size === Size.Large ? `8px` : props?.size === Size.Small ? '4px' : '6px')};\n  }\n\n  .footer-action.note {\n    color: ${COLORS.neutral_600};\n  }\n`;\n\nexport const getBackgroundColor = (state: string) => {\n  switch (state) {\n    case 'positive':\n      return COLORS.correct_100;\n    case 'warning':\n      return COLORS.warning_100;\n    case 'critical':\n      return COLORS.critical_100;\n    default:\n      return COLORS.primary_100;\n  }\n};\n\nexport const getNoteMessageColor = (state: string) => {\n  switch (state) {\n    case 'positive':\n      return COLORS.correct_700;\n    case 'warning':\n      return COLORS.warning_700;\n    case 'critical':\n      return COLORS.critical_700;\n    default:\n      return COLORS.primary_700;\n  }\n};\n"],"file":"ModalStyles.js"}