@contentful/f36-modal 4.1.1 → 4.1.5

package/CHANGELOG.md

@@ -3,6 +3,41 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [4.1.5](https://github.com/contentful/forma-36/compare/@contentful/f36-modal@4.1.4...@contentful/f36-modal@4.1.5) (2022-01-31)
+
+**Note:** Version bump only for package @contentful/f36-modal
+
+
+
+
+
+## [4.1.4](https://github.com/contentful/forma-36/compare/@contentful/f36-modal@4.1.3...@contentful/f36-modal@4.1.4) (2022-01-31)
+
+**Note:** Version bump only for package @contentful/f36-modal
+
+
+
+
+
+## [4.1.3](https://github.com/contentful/forma-36/compare/@contentful/f36-modal@4.1.2...@contentful/f36-modal@4.1.3) (2022-01-27)
+
+
+### Bug Fixes
+
+* fix Modal defaults, adjust docs ([#1827](https://github.com/contentful/forma-36/issues/1827)) ([7a262f0](https://github.com/contentful/forma-36/commit/7a262f0719492fba16e0557e7fc3316eeacd2a21))
+
+
+
+
+
+## [4.1.2](https://github.com/contentful/forma-36/compare/@contentful/f36-modal@4.1.1...@contentful/f36-modal@4.1.2) (2022-01-26)
+
+**Note:** Version bump only for package @contentful/f36-modal
+
+
+
+
+
 ## [4.1.1](https://github.com/contentful/forma-36/compare/@contentful/f36-modal@4.1.0...@contentful/f36-modal@4.1.1) (2022-01-19)
 
 **Note:** Version bump only for package @contentful/f36-modal

package/dist/main.js

@@ -234,7 +234,7 @@ function $854b6d713fe70fc9$var$focusFirstWithinNode(node) {
         }
     }
 }
-function $854b6d713fe70fc9$export$2b77a92f1a5ad772({ allowHeightOverflow: allowHeightOverflow , position: position , shouldCloseOnEscapePress: shouldCloseOnEscapePress , shouldCloseOnOverlayClick: shouldCloseOnOverlayClick , size: size , testId: testId , topOffset: topOffset , aria: aria , ...otherProps }) {
+function $854b6d713fe70fc9$export$2b77a92f1a5ad772({ allowHeightOverflow: allowHeightOverflow = false , position: position = 'center' , shouldCloseOnEscapePress: shouldCloseOnEscapePress = true , shouldCloseOnOverlayClick: shouldCloseOnOverlayClick = true , size: size = 'medium' , testId: testId = 'cf-ui-modal' , topOffset: topOffset = '50px' , aria: aria , ...otherProps }) {
     const contentRef = $7x5iO$react.useRef(null);
     const props = {
         ...otherProps,
@@ -307,17 +307,7 @@ function $854b6d713fe70fc9$export$2b77a92f1a5ad772({ allowHeightOverflow: allowH
         className: styles.modal,
         "data-modal-root": true
     }, typeof otherProps.children === 'function' ? otherProps.children(props) : renderDefault())));
-} // Use defaultProps instead of default values in the function to allow the
-// Storybook to import and use these values
-$854b6d713fe70fc9$export$2b77a92f1a5ad772.defaultProps = {
-    allowHeightOverflow: false,
-    position: 'center',
-    shouldCloseOnEscapePress: true,
-    shouldCloseOnOverlayClick: true,
-    size: 'medium',
-    testId: 'cf-ui-modal',
-    topOffset: '50px'
-};
+}
 
 
 

package/dist/main.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/components/modal/index.ts","packages/components/modal/src/index.ts","packages/components/modal/src/CompoundModal.tsx","packages/components/modal/src/Modal.tsx","packages/components/modal/src/ModalHeader/ModalHeader.tsx","packages/components/modal/src/ModalHeader/ModalHeader.styles.ts","packages/components/modal/src/ModalContent/ModalContent.tsx","packages/components/modal/src/ModalContent/ModalContent.styles.ts","packages/components/modal/src/Modal.styles.ts","packages/components/modal/src/ModalControls/ModalControls.tsx","packages/components/modal/src/ModalConfirm/ModalConfirm.tsx","packages/components/modal/src/ModalLauncher/ModalLauncher.tsx"],"sourcesContent":["export * from './src/index';\n","export { Modal } from './CompoundModal';\nexport type { ModalProps } from './Modal';\nexport { ModalConfirm } from './ModalConfirm/ModalConfirm';\nexport type { ModalConfirmProps } from './ModalConfirm/ModalConfirm';\nexport { ModalContent } from './ModalContent/ModalContent';\nexport type { ModalContentProps } from './ModalContent/ModalContent';\nexport { ModalControls } from './ModalControls/ModalControls';\nexport type { ModalControlsProps } from './ModalControls/ModalControls';\nexport { ModalHeader } from './ModalHeader/ModalHeader';\nexport type { ModalHeaderProps } from './ModalHeader/ModalHeader';\nexport { ModalLauncher } from './ModalLauncher/ModalLauncher';\n","import { Modal as OriginalModal } from './Modal';\nimport { ModalContent } from './ModalContent/ModalContent';\nimport { ModalHeader } from './ModalHeader/ModalHeader';\nimport { ModalControls } from './ModalControls/ModalControls';\n\ntype CompoundModal = typeof OriginalModal & {\n  Content: typeof ModalContent;\n  Header: typeof ModalHeader;\n  Controls: typeof ModalControls;\n};\n\nexport const Modal = OriginalModal as CompoundModal;\nModal.Content = ModalContent;\nModal.Header = ModalHeader;\nModal.Controls = ModalControls;\n","import * as React from 'react';\nimport ReactModal from 'react-modal';\n\nimport { Box } from '@contentful/f36-core';\nimport type { CommonProps } from '@contentful/f36-core';\n\nimport { ModalHeader, ModalHeaderProps } from './ModalHeader/ModalHeader';\nimport { ModalContent, ModalContentProps } from './ModalContent/ModalContent';\nimport { getModalStyles } from './Modal.styles';\nimport type { ModalSizeType, ModalPositionType } from './types';\n\nconst ModalSizesMapper = {\n  medium: '520px',\n  small: '400px',\n  large: '700px',\n  fullWidth: '100vw',\n  zen: '100vw',\n};\n\nexport interface ModalProps extends CommonProps {\n  /**\n   * When true, the dialog is shown.\n   */\n  isShown: boolean;\n\n  /**\n   * Function that will be run when the modal is requested to be closed, prior to actually closing.\n   */\n  onClose: ReactModal.Props['onRequestClose'];\n\n  /**\n   * Function that will be run after the modal has opened.\n   */\n  onAfterOpen?: ReactModal.Props['onAfterOpen'];\n\n  /**\n   * Additional aria attributes\n   */\n  aria?: ReactModal.Props['aria'];\n\n  /**\n   * Boolean indicating if clicking the overlay should close the overlay.\n   */\n  shouldCloseOnOverlayClick?: boolean;\n  /**\n   * Boolean indicating if pressing the esc key should close the overlay.\n   */\n  shouldCloseOnEscapePress?: boolean;\n  /**\n   * Indicating if modal is centered or linked to the top\n   */\n  position?: ModalPositionType;\n  /**\n      Top offset if position is 'top'\n    */\n  topOffset?: number | string;\n  /**\n      Modal title that is used in header\n    */\n  title?: string;\n  /**\n      Size of the modal window\n    */\n  size?: ModalSizeType;\n  /**\n   * Are modals higher than viewport allowed\n   */\n  allowHeightOverflow?: boolean;\n\n  /**\n   * Optional props to override ModalHeader behaviour\n   */\n  modalHeaderProps?: Partial<ModalHeaderProps>;\n\n  /**\n   * Optional props to override ModalContent behaviour\n   */\n  modalContentProps?: Partial<ModalContentProps>;\n\n  /**\n   * Optional property to set initial focus\n   */\n  initialFocusRef?: React.RefObject<HTMLElement>;\n\n  children: React.ReactNode | RenderModal;\n}\n\ntype RenderModal = (modalProps: ModalProps) => React.ReactNode;\n\nfunction focusFirstWithinNode(node: HTMLElement) {\n  if (node && node.querySelectorAll) {\n    const elements = node.querySelectorAll('input, button');\n    if (elements.length > 0) {\n      const firstElement = elements[0];\n      // @ts-expect-error focus might be missing\n      if (typeof firstElement.focus === 'function') {\n        // @ts-expect-error focus might be missing\n        firstElement.focus();\n      }\n    }\n  }\n}\n\nexport function Modal({\n  allowHeightOverflow,\n  position,\n  shouldCloseOnEscapePress,\n  shouldCloseOnOverlayClick,\n  size,\n  testId,\n  topOffset,\n  aria,\n  ...otherProps\n}: ModalProps) {\n  const contentRef = React.useRef<HTMLDivElement>(null);\n\n  const props = {\n    ...otherProps,\n    allowHeightOverflow,\n    position,\n    shouldCloseOnEscapePress,\n    shouldCloseOnOverlayClick,\n    size,\n    testId,\n    topOffset,\n  };\n\n  const styles = getModalStyles({\n    position,\n    size,\n    allowHeightOverflow,\n    className: otherProps.className,\n  });\n\n  React.useEffect(() => {\n    if (props.isShown) {\n      setTimeout(() => {\n        if (props.initialFocusRef && props.initialFocusRef.current) {\n          if (props.initialFocusRef.current.focus) {\n            props.initialFocusRef.current.focus();\n          }\n        } else if (contentRef.current) {\n          focusFirstWithinNode(contentRef.current);\n        }\n      }, 100);\n    }\n  }, [props.isShown, props.initialFocusRef]);\n\n  const renderDefault = () => {\n    return (\n      <React.Fragment>\n        {otherProps.title && (\n          <ModalHeader\n            title={otherProps.title}\n            onClose={props.onClose}\n            {...otherProps.modalHeaderProps}\n          />\n        )}\n        <ModalContent {...otherProps.modalContentProps}>\n          {otherProps.children}\n        </ModalContent>\n      </React.Fragment>\n    );\n  };\n\n  return (\n    <ReactModal\n      ariaHideApp={false}\n      aria={aria}\n      onRequestClose={props.onClose}\n      isOpen={otherProps.isShown}\n      onAfterOpen={props.onAfterOpen}\n      shouldCloseOnEsc={shouldCloseOnEscapePress}\n      shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n      shouldFocusAfterRender\n      shouldReturnFocusAfterClose\n      portalClassName={styles.portal}\n      className={{\n        base: styles.base.root,\n        afterOpen: styles.base.afterOpen,\n        beforeClose: styles.base.beforeClose,\n      }}\n      style={{\n        content: {\n          top: position === 'center' ? 0 : topOffset,\n        },\n      }}\n      overlayClassName={{\n        base: styles.modalOverlay.root,\n        afterOpen: styles.modalOverlay.afterOpen,\n        beforeClose: styles.modalOverlay.beforeClose,\n      }}\n      closeTimeoutMS={300}\n      contentRef={(ref) => {\n        contentRef.current = ref;\n      }}\n    >\n      <Box\n        testId={testId}\n        style={{\n          width: ModalSizesMapper[size] || size,\n        }}\n        className={styles.modal}\n        data-modal-root\n      >\n        {typeof otherProps.children === 'function'\n          ? otherProps.children(props)\n          : renderDefault()}\n      </Box>\n    </ReactModal>\n  );\n}\n\n// Use defaultProps instead of default values in the function to allow the\n// Storybook to import and use these values\nModal.defaultProps = {\n  allowHeightOverflow: false,\n  position: 'center',\n  shouldCloseOnEscapePress: true,\n  shouldCloseOnOverlayClick: true,\n  size: 'medium',\n  testId: 'cf-ui-modal',\n  topOffset: '50px',\n};\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { CloseIcon } from '@contentful/f36-icons';\nimport { Flex } from '@contentful/f36-core';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Button } from '@contentful/f36-button';\nimport { Subheading } from '@contentful/f36-typography';\n\nimport { getModalHeaderStyles } from './ModalHeader.styles';\n\ninterface ModalHeaderInternalProps extends CommonProps {\n  title: string;\n  onClose?: Function;\n}\n\nexport type ModalHeaderProps = PropsWithHTMLElement<\n  ModalHeaderInternalProps,\n  'div'\n>;\n\nexport function ModalHeader({\n  onClose,\n  title,\n  testId = 'cf-ui-modal-header',\n  className,\n  ...otherProps\n}: ModalHeaderProps): React.ReactElement {\n  const styles = getModalHeaderStyles();\n\n  return (\n    <Flex\n      {...otherProps}\n      className={cx(styles.root, className)}\n      testId={testId}\n      alignItems=\"center\"\n      justifyContent=\"space-between\"\n    >\n      <Subheading as=\"h1\" isTruncated marginBottom=\"none\">\n        {title}\n      </Subheading>\n      {onClose && (\n        <Flex alignItems=\"center\" className={styles.buttonContainer}>\n          <Button\n            variant=\"transparent\"\n            aria-label=\"Close\"\n            startIcon={<CloseIcon size=\"small\" />}\n            onClick={() => {\n              onClose();\n            }}\n            size=\"small\"\n          />\n        </Flex>\n      )}\n    </Flex>\n  );\n}\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getModalHeaderStyles() {\n  return {\n    root: css({\n      position: 'relative',\n      padding: `${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingL}`,\n      borderRadius: `${tokens.borderRadiusMedium} ${tokens.borderRadiusMedium} 0 0`,\n      borderBottom: `1px solid ${tokens.gray300}`,\n    }),\n    buttonContainer: css({\n      position: 'relative',\n      width: tokens.spacing2Xl,\n      height: tokens.spacingL,\n      button: {\n        position: 'absolute',\n        top: `calc(-1 * ${tokens.spacing2Xs})`,\n        right: 0,\n      },\n    }),\n  };\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Box } from '@contentful/f36-core';\nimport { getModalContentStyles } from './ModalContent.styles';\n\ninterface ModalContentInternalProps extends CommonProps {\n  children: React.ReactNode;\n}\n\nexport type ModalContentProps = PropsWithHTMLElement<\n  ModalContentInternalProps,\n  'div'\n>;\n\nexport function ModalContent({\n  testId = 'cf-ui-modal-content',\n  className,\n  children,\n  ...otherProps\n}: ModalContentProps) {\n  const styles = getModalContentStyles();\n  return (\n    <Box\n      {...otherProps}\n      as=\"div\"\n      className={cx(styles.root, className)}\n      testId={testId}\n    >\n      {children}\n    </Box>\n  );\n}\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport function getModalContentStyles() {\n  return {\n    root: css({\n      padding: `${tokens.spacingM} ${tokens.spacingL}`,\n      color: tokens.gray700,\n      fontSize: tokens.fontSizeM,\n      fontFamily: tokens.fontStackPrimary,\n      lineHeight: tokens.lineHeightM,\n      overflowY: 'auto',\n      overflowX: 'auto',\n      boxSizing: 'border-box',\n    }),\n  };\n}\n","import tokens from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport type { ModalPositionType, ModalSizeType } from './types';\n\nexport function getModalStyles(props: {\n  size: ModalSizeType;\n  position: ModalPositionType;\n  allowHeightOverflow?: boolean;\n  className?: string;\n}) {\n  const modal = cx(\n    css({\n      transition: `opacity ${tokens.transitionDurationLong} ${tokens.transitionEasingDefault}, transform ${tokens.transitionDurationDefault} ${tokens.transitionEasingCubicBezier}`,\n      opacity: '0.5',\n      margin: tokens.spacing2Xl,\n      transform: 'scale(0.85)',\n      backgroundColor: tokens.colorWhite,\n      borderRadius: tokens.borderRadiusMedium,\n      boxShadow: tokens.boxShadowHeavy,\n      maxHeight: `calc(100vh - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n      maxWidth: `calc(100vw - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n      overflow: 'hidden',\n      display: 'flex',\n      flexDirection: 'column',\n    }),\n    props.allowHeightOverflow\n      ? css({\n          overflow: 'auto',\n          maxHeight: 'none',\n        })\n      : null,\n    props.size === 'zen'\n      ? css({\n          maxWidth: 'none',\n          maxHeight: 'none',\n          margin: 0,\n          height: '100%',\n          width: '100%',\n        })\n      : null,\n    props.className,\n  );\n\n  return {\n    portal: css({\n      display: 'block',\n    }),\n    base: {\n      root: cx(\n        css({\n          zIndex: tokens.zIndexModalContent,\n          position: 'relative',\n          padding: 0,\n          display: 'inline-block',\n          margin: '0 auto',\n          textAlign: 'left',\n          outline: 'none',\n        }),\n        props.size === 'zen'\n          ? css({\n              width: '100%',\n              height: '100%',\n            })\n          : null,\n      ),\n      afterOpen: css({\n        '[data-modal-root]': {\n          transform: 'scale(1)',\n          opacity: '1',\n        },\n      }),\n      beforeClose: css({\n        '[data-modal-root]': {\n          opacity: '0.5',\n          transform: 'scale(0.85)',\n        },\n      }),\n    },\n    modalOverlay: {\n      root: cx(\n        css({\n          display: 'flex',\n          alignItems: 'baseline',\n          flexWrap: 'wrap',\n          top: 0,\n          right: 0,\n          bottom: 0,\n          left: 0,\n          zIndex: tokens.zIndexModal,\n          opacity: 0,\n          transition: `opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n          position: 'fixed',\n          overflowY: 'auto',\n          backgroundColor: 'rgba(12, 20, 28, 0.74902)',\n          textAlign: 'center',\n        }),\n        props.position === 'center'\n          ? css({\n              alignItems: 'center',\n              justifyContent: 'center',\n            })\n          : null,\n      ),\n      afterOpen: css({\n        opacity: '1 !important',\n      }),\n      beforeClose: css({\n        opacity: 0,\n      }),\n    },\n    modal,\n  };\n}\n","import React from 'react';\n\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Flex } from '@contentful/f36-core';\nimport { ButtonGroup } from '@contentful/f36-button';\n\ninterface ModalControlsInternalProps extends CommonProps {\n  children: React.ReactElement[] | React.ReactElement;\n}\n\nexport type ModalControlsProps = PropsWithHTMLElement<\n  ModalControlsInternalProps,\n  'div'\n>;\n\nexport function ModalControls({\n  testId = 'cf-ui-modal-controls',\n  className,\n  children,\n  ...otherProps\n}: ModalControlsProps): React.ReactElement {\n  return (\n    <Flex\n      {...otherProps}\n      className={className}\n      testId={testId}\n      flexDirection=\"row\"\n      justifyContent=\"flex-end\"\n      margin=\"spacingL\"\n      marginTop=\"none\"\n    >\n      <ButtonGroup variant=\"spaced\" spacing=\"spacingS\">\n        {children}\n      </ButtonGroup>\n    </Flex>\n  );\n}\n","import React from 'react';\n\nimport { Modal } from '../CompoundModal';\nimport { ModalProps } from '../Modal';\nimport type { ModalSizeType } from '../types';\nimport type { ModalHeaderProps } from '../ModalHeader/ModalHeader';\nimport type { ModalContentProps } from '../ModalContent/ModalContent';\nimport type { ModalControlsProps } from '../ModalControls/ModalControls';\nimport { Button } from '@contentful/f36-button';\n\nexport interface ModalConfirmProps {\n  /**\n   * When true, the dialog is shown.\n   */\n  isShown: boolean;\n  /**\n   * Function that will be called when the confirm button is clicked. This does not close the ModalConfirm.\n   */\n  onConfirm(): void;\n  /**\n   * Function that will be called when the cancel button is clicked. This does not close the ModalConfirm.\n   */\n  onCancel: ModalProps['onClose'];\n  /**\n      Modal title that is used in header\n    */\n  title?: string;\n  /**\n   * Label of the confirm button\n   */\n  confirmLabel?: string | false;\n  /**\n   * Label of the cancel button\n   */\n  cancelLabel?: string | false;\n  /**\n   * The intent of the ModalConfirm. Used for the Button.\n   */\n  intent?: 'primary' | 'positive' | 'negative';\n  /**\n      Size of the modal window\n    */\n  size?: ModalSizeType;\n  /**\n   * Boolean indicating if clicking the overlay should close the overlay.\n   */\n  shouldCloseOnOverlayClick?: boolean;\n  /**\n   * Boolean indicating if pressing the esc key should close the overlay.\n   */\n  shouldCloseOnEscapePress?: boolean;\n  /**\n   * When true, the confirm button is set to disabled.\n   */\n  isConfirmDisabled?: boolean;\n  /**\n   * When true, the confirm button is set to loading.\n   */\n  isConfirmLoading?: boolean;\n  /**\n   * Are modals higher than viewport allowed\n   */\n  allowHeightOverflow?: boolean;\n\n  /**\n   * Optional props to override ModalHeader behaviour\n   */\n  modalHeaderProps?: Partial<ModalHeaderProps>;\n\n  /**\n   * Optional props to override ModalContent behaviour\n   */\n  modalContentProps?: Partial<ModalContentProps>;\n\n  /**\n   * Optional props to override ModalControl behaviour\n   */\n  modalControlsProps?: Partial<ModalControlsProps>;\n\n  /**\n   * Optional property to set initial focus\n   */\n  initialFocusRef?: React.RefObject<HTMLElement>;\n\n  testId?: string;\n  confirmTestId?: string;\n  cancelTestId?: string;\n  children: React.ReactNode;\n}\n\nexport function ModalConfirm({\n  allowHeightOverflow = false,\n  cancelLabel = 'Cancel',\n  cancelTestId = 'cf-ui-modal-confirm-cancel-button',\n  children,\n  confirmLabel = 'Confirm',\n  confirmTestId = 'cf-ui-modal-confirm-confirm-button',\n  intent = 'positive',\n  isConfirmDisabled = false,\n  isConfirmLoading = false,\n  isShown,\n  modalContentProps,\n  modalControlsProps,\n  modalHeaderProps,\n  onCancel,\n  onConfirm,\n  shouldCloseOnEscapePress = true,\n  shouldCloseOnOverlayClick = true,\n  size = 'medium',\n  testId = 'cf-ui-modal-confirm',\n  title = 'Are you sure?',\n  initialFocusRef,\n}: ModalConfirmProps) {\n  const cancelRef = React.useRef(null);\n\n  const confirmButton = confirmLabel ? (\n    <Button\n      testId={confirmTestId}\n      isDisabled={isConfirmDisabled}\n      isLoading={isConfirmLoading}\n      variant={intent}\n      size=\"small\"\n      onClick={() => onConfirm()}\n    >\n      {confirmLabel}\n    </Button>\n  ) : null;\n\n  const cancelButton = cancelLabel ? (\n    <Button\n      testId={cancelTestId}\n      variant=\"secondary\"\n      onClick={onCancel}\n      size=\"small\"\n      ref={initialFocusRef || cancelRef}\n    >\n      {cancelLabel}\n    </Button>\n  ) : null;\n\n  return (\n    <Modal\n      testId={testId}\n      isShown={isShown}\n      onClose={onCancel}\n      size={size}\n      shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n      shouldCloseOnEscapePress={shouldCloseOnEscapePress}\n      allowHeightOverflow={allowHeightOverflow}\n      initialFocusRef={cancelRef}\n    >\n      {() => {\n        return (\n          <React.Fragment>\n            <Modal.Header title={title || ''} {...modalHeaderProps} />\n            <Modal.Content {...modalContentProps}>{children}</Modal.Content>\n            <Modal.Controls {...modalControlsProps}>\n              {cancelButton}\n              {confirmButton}\n            </Modal.Controls>\n          </React.Fragment>\n        );\n      }}\n    </Modal>\n  );\n}\n","/* global Promise */\nimport ReactDOM from 'react-dom';\n\n// @todo: change any to unknown\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ninterface ModalLauncherComponentRendererProps<T = any> {\n  isShown: boolean;\n  onClose: (result?: T) => void;\n}\n\ninterface ModalLauncherOpenOptions {\n  /**\n   * Unique id to be used as identifier for the modal contianer\n   */\n  modalId?: string;\n  /**\n   * ms before removing the component from the tree\n   * @default 300\n   */\n  delay?: number;\n}\n\ninterface CloseModalData {\n  delay: number;\n  render: (args: ModalLauncherComponentRendererProps<any>) => void;\n  currentConfig: ModalLauncherComponentRendererProps<any>;\n}\n\nconst getRoot = (rootElId: string): HTMLElement => {\n  // Reuse the container if we find it\n  let rootDom = document.getElementById(rootElId);\n  if (rootDom !== null) {\n    return rootDom;\n  }\n\n  // Otherwise create it\n  rootDom = document.createElement('div');\n  rootDom.setAttribute('id', rootElId);\n  document.body.appendChild(rootDom);\n  return rootDom;\n};\n\nconst openModalsIds: Map<string, CloseModalData> = new Map();\nfunction closeAll() {\n  openModalsIds.forEach(async ({ render, currentConfig, delay }, rootElId) => {\n    const config = { ...currentConfig, isShown: false };\n    render(config);\n    await new Promise((resolveDelay) => setTimeout(resolveDelay, delay));\n    ReactDOM.unmountComponentAtNode(getRoot(rootElId));\n    openModalsIds.delete(rootElId);\n  });\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction open<T = any>(\n  componentRenderer: (\n    props: ModalLauncherComponentRendererProps<T>,\n  ) => JSX.Element,\n  options: ModalLauncherOpenOptions = {},\n): Promise<T> {\n  options = { delay: 300, ...options };\n\n  // Allow components to specify if they wish to reuse the modal container\n  const rootElId = `modals-root${options.modalId || Date.now()}`;\n  const rootDom = getRoot(rootElId);\n\n  return new Promise((resolve) => {\n    let currentConfig = { onClose, isShown: true };\n\n    function render({\n      onClose,\n      isShown,\n    }: ModalLauncherComponentRendererProps<T>) {\n      ReactDOM.render(componentRenderer({ onClose, isShown }), rootDom);\n    }\n\n    async function onClose(arg?: T) {\n      currentConfig = {\n        ...currentConfig,\n        isShown: false,\n      };\n      render(currentConfig);\n      await new Promise((resolveDelay) =>\n        setTimeout(resolveDelay, options.delay),\n      );\n      ReactDOM.unmountComponentAtNode(rootDom);\n      rootDom.remove();\n      openModalsIds.delete(rootElId);\n      resolve(arg);\n    }\n\n    render(currentConfig);\n    openModalsIds.set(rootElId, {\n      render,\n      currentConfig,\n      delay: options.delay,\n    });\n  });\n}\n\nexport const ModalLauncher = {\n  open,\n  closeAll,\n};\n"],"names":["Modal","ModalProps","ModalConfirm","ModalConfirmProps","ModalContent","ModalContentProps","ModalControls","ModalControlsProps","ModalHeader","ModalHeaderProps","ModalLauncher","OriginalModal","CompoundModal","Content","Header","Controls","React","ReactModal","Box","CommonProps","getModalStyles","ModalSizeType","ModalPositionType","ModalSizesMapper","medium","small","large","fullWidth","zen","isShown","onClose","Props","onAfterOpen","aria","shouldCloseOnOverlayClick","shouldCloseOnEscapePress","position","topOffset","title","size","allowHeightOverflow","modalHeaderProps","Partial","modalContentProps","initialFocusRef","RefObject","HTMLElement","children","ReactNode","RenderModal","modalProps","focusFirstWithinNode","node","querySelectorAll","elements","length","firstElement","focus","testId","otherProps","contentRef","useRef","HTMLDivElement","props","styles","className","useEffect","setTimeout","current","renderDefault","portal","base","root","afterOpen","beforeClose","content","top","modalOverlay","ref","width","modal","defaultProps","CloseIcon","Flex","PropsWithHTMLElement","Button","Subheading","getModalHeaderStyles","ModalHeaderInternalProps","Function","ReactElement","buttonContainer","tokens","padding","spacingM","spacingL","borderRadius","borderRadiusMedium","borderBottom","gray300","spacing2Xl","height","button","spacing2Xs","right","getModalContentStyles","ModalContentInternalProps","color","gray700","fontSize","fontSizeM","fontFamily","fontStackPrimary","lineHeight","lineHeightM","overflowY","overflowX","boxSizing","transition","transitionDurationLong","transitionEasingDefault","transitionDurationDefault","transitionEasingCubicBezier","opacity","margin","transform","backgroundColor","colorWhite","boxShadow","boxShadowHeavy","maxHeight","fontBaseDefault","maxWidth","overflow","display","flexDirection","zIndex","zIndexModalContent","textAlign","outline","alignItems","flexWrap","bottom","left","zIndexModal","ButtonGroup","ModalControlsInternalProps","onConfirm","onCancel","confirmLabel","cancelLabel","intent","isConfirmDisabled","isConfirmLoading","modalControlsProps","confirmTestId","cancelTestId","cancelRef","confirmButton","cancelButton","ReactDOM","ModalLauncherComponentRendererProps","result","T","ModalLauncherOpenOptions","modalId","delay","CloseModalData","render","args","currentConfig","getRoot","rootElId","rootDom","document","getElementById","createElement","setAttribute","body","appendChild","openModalsIds","Map","closeAll","forEach","config","Promise","resolveDelay","unmountComponentAtNode","delete","open","componentRenderer","JSX","Element","options","Date","now","resolve","arg","remove","set"],"version":3,"file":"main.js.map"}
+{"mappings":"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","sources":["packages/components/modal/index.ts","packages/components/modal/src/index.ts","packages/components/modal/src/CompoundModal.tsx","packages/components/modal/src/Modal.tsx","packages/components/modal/src/ModalHeader/ModalHeader.tsx","packages/components/modal/src/ModalHeader/ModalHeader.styles.ts","packages/components/modal/src/ModalContent/ModalContent.tsx","packages/components/modal/src/ModalContent/ModalContent.styles.ts","packages/components/modal/src/Modal.styles.ts","packages/components/modal/src/ModalControls/ModalControls.tsx","packages/components/modal/src/ModalConfirm/ModalConfirm.tsx","packages/components/modal/src/ModalLauncher/ModalLauncher.tsx"],"sourcesContent":["export * from './src/index';\n","export { Modal } from './CompoundModal';\nexport type { ModalProps } from './Modal';\nexport { ModalConfirm } from './ModalConfirm/ModalConfirm';\nexport type { ModalConfirmProps } from './ModalConfirm/ModalConfirm';\nexport { ModalContent } from './ModalContent/ModalContent';\nexport type { ModalContentProps } from './ModalContent/ModalContent';\nexport { ModalControls } from './ModalControls/ModalControls';\nexport type { ModalControlsProps } from './ModalControls/ModalControls';\nexport { ModalHeader } from './ModalHeader/ModalHeader';\nexport type { ModalHeaderProps } from './ModalHeader/ModalHeader';\nexport { ModalLauncher } from './ModalLauncher/ModalLauncher';\n","import { Modal as OriginalModal } from './Modal';\nimport { ModalContent } from './ModalContent/ModalContent';\nimport { ModalHeader } from './ModalHeader/ModalHeader';\nimport { ModalControls } from './ModalControls/ModalControls';\n\ntype CompoundModal = typeof OriginalModal & {\n  Content: typeof ModalContent;\n  Header: typeof ModalHeader;\n  Controls: typeof ModalControls;\n};\n\nexport const Modal = OriginalModal as CompoundModal;\nModal.Content = ModalContent;\nModal.Header = ModalHeader;\nModal.Controls = ModalControls;\n","import * as React from 'react';\nimport ReactModal from 'react-modal';\n\nimport { Box } from '@contentful/f36-core';\nimport type { CommonProps } from '@contentful/f36-core';\n\nimport { ModalHeader, ModalHeaderProps } from './ModalHeader/ModalHeader';\nimport { ModalContent, ModalContentProps } from './ModalContent/ModalContent';\nimport { getModalStyles } from './Modal.styles';\nimport type { ModalSizeType, ModalPositionType } from './types';\n\nconst ModalSizesMapper = {\n  medium: '520px',\n  small: '400px',\n  large: '700px',\n  fullWidth: '100vw',\n  zen: '100vw',\n};\n\nexport interface ModalProps extends CommonProps {\n  /**\n   * When true, the dialog is shown.\n   */\n  isShown: boolean;\n\n  /**\n   * Function that will be run when the modal is requested to be closed, prior to actually closing.\n   */\n  onClose: ReactModal.Props['onRequestClose'];\n\n  /**\n   * Function that will be run after the modal has opened.\n   */\n  onAfterOpen?: ReactModal.Props['onAfterOpen'];\n\n  /**\n   * Additional aria attributes\n   */\n  aria?: ReactModal.Props['aria'];\n\n  /**\n   * Boolean indicating if clicking the overlay should close the overlay.\n   * @default true\n   */\n  shouldCloseOnOverlayClick?: boolean;\n  /**\n   * Boolean indicating if pressing the esc key should close the overlay.\n   * @default true\n   */\n  shouldCloseOnEscapePress?: boolean;\n  /**\n   * Indicating if modal is centered or linked to the top\n   * @default center\n   */\n  position?: ModalPositionType;\n  /**\n   * Top offset if position is 'top'\n   * @default 50px\n   */\n  topOffset?: number | string;\n  /**\n   * Modal title that is used in header\n   */\n  title?: string;\n  /**\n   * Size of the modal window\n   * @default medium\n   */\n  size?: ModalSizeType;\n  /**\n   * Are modals higher than viewport allowed\n   * @default false\n   */\n  allowHeightOverflow?: boolean;\n\n  /**\n   * Optional props to override ModalHeader behaviour\n   */\n  modalHeaderProps?: Partial<ModalHeaderProps>;\n\n  /**\n   * Optional props to override ModalContent behaviour\n   */\n  modalContentProps?: Partial<ModalContentProps>;\n\n  /**\n   * Optional property to set initial focus\n   */\n  initialFocusRef?: React.RefObject<HTMLElement>;\n\n  children: React.ReactNode | RenderModal;\n}\n\ntype RenderModal = (modalProps: ModalProps) => React.ReactNode;\n\nfunction focusFirstWithinNode(node: HTMLElement) {\n  if (node && node.querySelectorAll) {\n    const elements = node.querySelectorAll('input, button');\n    if (elements.length > 0) {\n      const firstElement = elements[0];\n      // @ts-expect-error focus might be missing\n      if (typeof firstElement.focus === 'function') {\n        // @ts-expect-error focus might be missing\n        firstElement.focus();\n      }\n    }\n  }\n}\n\nexport function Modal({\n  allowHeightOverflow = false,\n  position = 'center',\n  shouldCloseOnEscapePress = true,\n  shouldCloseOnOverlayClick = true,\n  size = 'medium',\n  testId = 'cf-ui-modal',\n  topOffset = '50px',\n  aria,\n  ...otherProps\n}: ModalProps) {\n  const contentRef = React.useRef<HTMLDivElement>(null);\n\n  const props = {\n    ...otherProps,\n    allowHeightOverflow,\n    position,\n    shouldCloseOnEscapePress,\n    shouldCloseOnOverlayClick,\n    size,\n    testId,\n    topOffset,\n  };\n\n  const styles = getModalStyles({\n    position,\n    size,\n    allowHeightOverflow,\n    className: otherProps.className,\n  });\n\n  React.useEffect(() => {\n    if (props.isShown) {\n      setTimeout(() => {\n        if (props.initialFocusRef && props.initialFocusRef.current) {\n          if (props.initialFocusRef.current.focus) {\n            props.initialFocusRef.current.focus();\n          }\n        } else if (contentRef.current) {\n          focusFirstWithinNode(contentRef.current);\n        }\n      }, 100);\n    }\n  }, [props.isShown, props.initialFocusRef]);\n\n  const renderDefault = () => {\n    return (\n      <React.Fragment>\n        {otherProps.title && (\n          <ModalHeader\n            title={otherProps.title}\n            onClose={props.onClose}\n            {...otherProps.modalHeaderProps}\n          />\n        )}\n        <ModalContent {...otherProps.modalContentProps}>\n          {otherProps.children}\n        </ModalContent>\n      </React.Fragment>\n    );\n  };\n\n  return (\n    <ReactModal\n      ariaHideApp={false}\n      aria={aria}\n      onRequestClose={props.onClose}\n      isOpen={otherProps.isShown}\n      onAfterOpen={props.onAfterOpen}\n      shouldCloseOnEsc={shouldCloseOnEscapePress}\n      shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n      shouldFocusAfterRender\n      shouldReturnFocusAfterClose\n      portalClassName={styles.portal}\n      className={{\n        base: styles.base.root,\n        afterOpen: styles.base.afterOpen,\n        beforeClose: styles.base.beforeClose,\n      }}\n      style={{\n        content: {\n          top: position === 'center' ? 0 : topOffset,\n        },\n      }}\n      overlayClassName={{\n        base: styles.modalOverlay.root,\n        afterOpen: styles.modalOverlay.afterOpen,\n        beforeClose: styles.modalOverlay.beforeClose,\n      }}\n      closeTimeoutMS={300}\n      contentRef={(ref) => {\n        contentRef.current = ref;\n      }}\n    >\n      <Box\n        testId={testId}\n        style={{\n          width: ModalSizesMapper[size] || size,\n        }}\n        className={styles.modal}\n        data-modal-root\n      >\n        {typeof otherProps.children === 'function'\n          ? otherProps.children(props)\n          : renderDefault()}\n      </Box>\n    </ReactModal>\n  );\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { CloseIcon } from '@contentful/f36-icons';\nimport { Flex } from '@contentful/f36-core';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Button } from '@contentful/f36-button';\nimport { Subheading } from '@contentful/f36-typography';\n\nimport { getModalHeaderStyles } from './ModalHeader.styles';\n\ninterface ModalHeaderInternalProps extends CommonProps {\n  title: string;\n  onClose?: Function;\n}\n\nexport type ModalHeaderProps = PropsWithHTMLElement<\n  ModalHeaderInternalProps,\n  'div'\n>;\n\nexport function ModalHeader({\n  onClose,\n  title,\n  testId = 'cf-ui-modal-header',\n  className,\n  ...otherProps\n}: ModalHeaderProps): React.ReactElement {\n  const styles = getModalHeaderStyles();\n\n  return (\n    <Flex\n      {...otherProps}\n      className={cx(styles.root, className)}\n      testId={testId}\n      alignItems=\"center\"\n      justifyContent=\"space-between\"\n    >\n      <Subheading as=\"h1\" isTruncated marginBottom=\"none\">\n        {title}\n      </Subheading>\n      {onClose && (\n        <Flex alignItems=\"center\" className={styles.buttonContainer}>\n          <Button\n            variant=\"transparent\"\n            aria-label=\"Close\"\n            startIcon={<CloseIcon size=\"small\" />}\n            onClick={() => {\n              onClose();\n            }}\n            size=\"small\"\n          />\n        </Flex>\n      )}\n    </Flex>\n  );\n}\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getModalHeaderStyles() {\n  return {\n    root: css({\n      position: 'relative',\n      padding: `${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingL}`,\n      borderRadius: `${tokens.borderRadiusMedium} ${tokens.borderRadiusMedium} 0 0`,\n      borderBottom: `1px solid ${tokens.gray300}`,\n    }),\n    buttonContainer: css({\n      position: 'relative',\n      width: tokens.spacing2Xl,\n      height: tokens.spacingL,\n      button: {\n        position: 'absolute',\n        top: `calc(-1 * ${tokens.spacing2Xs})`,\n        right: 0,\n      },\n    }),\n  };\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Box } from '@contentful/f36-core';\nimport { getModalContentStyles } from './ModalContent.styles';\n\ninterface ModalContentInternalProps extends CommonProps {\n  children: React.ReactNode;\n}\n\nexport type ModalContentProps = PropsWithHTMLElement<\n  ModalContentInternalProps,\n  'div'\n>;\n\nexport function ModalContent({\n  testId = 'cf-ui-modal-content',\n  className,\n  children,\n  ...otherProps\n}: ModalContentProps) {\n  const styles = getModalContentStyles();\n  return (\n    <Box\n      {...otherProps}\n      as=\"div\"\n      className={cx(styles.root, className)}\n      testId={testId}\n    >\n      {children}\n    </Box>\n  );\n}\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport function getModalContentStyles() {\n  return {\n    root: css({\n      padding: `${tokens.spacingM} ${tokens.spacingL}`,\n      color: tokens.gray700,\n      fontSize: tokens.fontSizeM,\n      fontFamily: tokens.fontStackPrimary,\n      lineHeight: tokens.lineHeightM,\n      overflowY: 'auto',\n      overflowX: 'auto',\n      boxSizing: 'border-box',\n    }),\n  };\n}\n","import tokens from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport type { ModalPositionType, ModalSizeType } from './types';\n\nexport function getModalStyles(props: {\n  size: ModalSizeType;\n  position: ModalPositionType;\n  allowHeightOverflow?: boolean;\n  className?: string;\n}) {\n  const modal = cx(\n    css({\n      transition: `opacity ${tokens.transitionDurationLong} ${tokens.transitionEasingDefault}, transform ${tokens.transitionDurationDefault} ${tokens.transitionEasingCubicBezier}`,\n      opacity: '0.5',\n      margin: tokens.spacing2Xl,\n      transform: 'scale(0.85)',\n      backgroundColor: tokens.colorWhite,\n      borderRadius: tokens.borderRadiusMedium,\n      boxShadow: tokens.boxShadowHeavy,\n      maxHeight: `calc(100vh - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n      maxWidth: `calc(100vw - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n      overflow: 'hidden',\n      display: 'flex',\n      flexDirection: 'column',\n    }),\n    props.allowHeightOverflow\n      ? css({\n          overflow: 'auto',\n          maxHeight: 'none',\n        })\n      : null,\n    props.size === 'zen'\n      ? css({\n          maxWidth: 'none',\n          maxHeight: 'none',\n          margin: 0,\n          height: '100%',\n          width: '100%',\n        })\n      : null,\n    props.className,\n  );\n\n  return {\n    portal: css({\n      display: 'block',\n    }),\n    base: {\n      root: cx(\n        css({\n          zIndex: tokens.zIndexModalContent,\n          position: 'relative',\n          padding: 0,\n          display: 'inline-block',\n          margin: '0 auto',\n          textAlign: 'left',\n          outline: 'none',\n        }),\n        props.size === 'zen'\n          ? css({\n              width: '100%',\n              height: '100%',\n            })\n          : null,\n      ),\n      afterOpen: css({\n        '[data-modal-root]': {\n          transform: 'scale(1)',\n          opacity: '1',\n        },\n      }),\n      beforeClose: css({\n        '[data-modal-root]': {\n          opacity: '0.5',\n          transform: 'scale(0.85)',\n        },\n      }),\n    },\n    modalOverlay: {\n      root: cx(\n        css({\n          display: 'flex',\n          alignItems: 'baseline',\n          flexWrap: 'wrap',\n          top: 0,\n          right: 0,\n          bottom: 0,\n          left: 0,\n          zIndex: tokens.zIndexModal,\n          opacity: 0,\n          transition: `opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n          position: 'fixed',\n          overflowY: 'auto',\n          backgroundColor: 'rgba(12, 20, 28, 0.74902)',\n          textAlign: 'center',\n        }),\n        props.position === 'center'\n          ? css({\n              alignItems: 'center',\n              justifyContent: 'center',\n            })\n          : null,\n      ),\n      afterOpen: css({\n        opacity: '1 !important',\n      }),\n      beforeClose: css({\n        opacity: 0,\n      }),\n    },\n    modal,\n  };\n}\n","import React from 'react';\n\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Flex } from '@contentful/f36-core';\nimport { ButtonGroup } from '@contentful/f36-button';\n\ninterface ModalControlsInternalProps extends CommonProps {\n  children: React.ReactElement[] | React.ReactElement;\n}\n\nexport type ModalControlsProps = PropsWithHTMLElement<\n  ModalControlsInternalProps,\n  'div'\n>;\n\nexport function ModalControls({\n  testId = 'cf-ui-modal-controls',\n  className,\n  children,\n  ...otherProps\n}: ModalControlsProps): React.ReactElement {\n  return (\n    <Flex\n      {...otherProps}\n      className={className}\n      testId={testId}\n      flexDirection=\"row\"\n      justifyContent=\"flex-end\"\n      margin=\"spacingL\"\n      marginTop=\"none\"\n    >\n      <ButtonGroup variant=\"spaced\" spacing=\"spacingS\">\n        {children}\n      </ButtonGroup>\n    </Flex>\n  );\n}\n","import React from 'react';\n\nimport { Modal } from '../CompoundModal';\nimport { ModalProps } from '../Modal';\nimport type { ModalSizeType } from '../types';\nimport type { ModalHeaderProps } from '../ModalHeader/ModalHeader';\nimport type { ModalContentProps } from '../ModalContent/ModalContent';\nimport type { ModalControlsProps } from '../ModalControls/ModalControls';\nimport { Button } from '@contentful/f36-button';\n\nexport interface ModalConfirmProps {\n  /**\n   * When true, the dialog is shown.\n   */\n  isShown: boolean;\n  /**\n   * Function that will be called when the confirm button is clicked. This does not close the ModalConfirm.\n   */\n  onConfirm(): void;\n  /**\n   * Function that will be called when the cancel button is clicked. This does not close the ModalConfirm.\n   */\n  onCancel: ModalProps['onClose'];\n  /**\n      Modal title that is used in header\n    */\n  title?: string;\n  /**\n   * Label of the confirm button\n   */\n  confirmLabel?: string | false;\n  /**\n   * Label of the cancel button\n   */\n  cancelLabel?: string | false;\n  /**\n   * The intent of the ModalConfirm. Used for the Button.\n   */\n  intent?: 'primary' | 'positive' | 'negative';\n  /**\n      Size of the modal window\n    */\n  size?: ModalSizeType;\n  /**\n   * Boolean indicating if clicking the overlay should close the overlay.\n   */\n  shouldCloseOnOverlayClick?: boolean;\n  /**\n   * Boolean indicating if pressing the esc key should close the overlay.\n   */\n  shouldCloseOnEscapePress?: boolean;\n  /**\n   * When true, the confirm button is set to disabled.\n   */\n  isConfirmDisabled?: boolean;\n  /**\n   * When true, the confirm button is set to loading.\n   */\n  isConfirmLoading?: boolean;\n  /**\n   * Are modals higher than viewport allowed\n   */\n  allowHeightOverflow?: boolean;\n\n  /**\n   * Optional props to override ModalHeader behaviour\n   */\n  modalHeaderProps?: Partial<ModalHeaderProps>;\n\n  /**\n   * Optional props to override ModalContent behaviour\n   */\n  modalContentProps?: Partial<ModalContentProps>;\n\n  /**\n   * Optional props to override ModalControl behaviour\n   */\n  modalControlsProps?: Partial<ModalControlsProps>;\n\n  /**\n   * Optional property to set initial focus\n   */\n  initialFocusRef?: React.RefObject<HTMLElement>;\n\n  testId?: string;\n  confirmTestId?: string;\n  cancelTestId?: string;\n  children: React.ReactNode;\n}\n\nexport function ModalConfirm({\n  allowHeightOverflow = false,\n  cancelLabel = 'Cancel',\n  cancelTestId = 'cf-ui-modal-confirm-cancel-button',\n  children,\n  confirmLabel = 'Confirm',\n  confirmTestId = 'cf-ui-modal-confirm-confirm-button',\n  intent = 'positive',\n  isConfirmDisabled = false,\n  isConfirmLoading = false,\n  isShown,\n  modalContentProps,\n  modalControlsProps,\n  modalHeaderProps,\n  onCancel,\n  onConfirm,\n  shouldCloseOnEscapePress = true,\n  shouldCloseOnOverlayClick = true,\n  size = 'medium',\n  testId = 'cf-ui-modal-confirm',\n  title = 'Are you sure?',\n  initialFocusRef,\n}: ModalConfirmProps) {\n  const cancelRef = React.useRef(null);\n\n  const confirmButton = confirmLabel ? (\n    <Button\n      testId={confirmTestId}\n      isDisabled={isConfirmDisabled}\n      isLoading={isConfirmLoading}\n      variant={intent}\n      size=\"small\"\n      onClick={() => onConfirm()}\n    >\n      {confirmLabel}\n    </Button>\n  ) : null;\n\n  const cancelButton = cancelLabel ? (\n    <Button\n      testId={cancelTestId}\n      variant=\"secondary\"\n      onClick={onCancel}\n      size=\"small\"\n      ref={initialFocusRef || cancelRef}\n    >\n      {cancelLabel}\n    </Button>\n  ) : null;\n\n  return (\n    <Modal\n      testId={testId}\n      isShown={isShown}\n      onClose={onCancel}\n      size={size}\n      shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n      shouldCloseOnEscapePress={shouldCloseOnEscapePress}\n      allowHeightOverflow={allowHeightOverflow}\n      initialFocusRef={cancelRef}\n    >\n      {() => {\n        return (\n          <React.Fragment>\n            <Modal.Header title={title || ''} {...modalHeaderProps} />\n            <Modal.Content {...modalContentProps}>{children}</Modal.Content>\n            <Modal.Controls {...modalControlsProps}>\n              {cancelButton}\n              {confirmButton}\n            </Modal.Controls>\n          </React.Fragment>\n        );\n      }}\n    </Modal>\n  );\n}\n","/* global Promise */\nimport ReactDOM from 'react-dom';\n\n// @todo: change any to unknown\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ninterface ModalLauncherComponentRendererProps<T = any> {\n  isShown: boolean;\n  onClose: (result?: T) => void;\n}\n\ninterface ModalLauncherOpenOptions {\n  /**\n   * Unique id to be used as identifier for the modal contianer\n   */\n  modalId?: string;\n  /**\n   * ms before removing the component from the tree\n   * @default 300\n   */\n  delay?: number;\n}\n\ninterface CloseModalData {\n  delay: number;\n  render: (args: ModalLauncherComponentRendererProps<any>) => void;\n  currentConfig: ModalLauncherComponentRendererProps<any>;\n}\n\nconst getRoot = (rootElId: string): HTMLElement => {\n  // Reuse the container if we find it\n  let rootDom = document.getElementById(rootElId);\n  if (rootDom !== null) {\n    return rootDom;\n  }\n\n  // Otherwise create it\n  rootDom = document.createElement('div');\n  rootDom.setAttribute('id', rootElId);\n  document.body.appendChild(rootDom);\n  return rootDom;\n};\n\nconst openModalsIds: Map<string, CloseModalData> = new Map();\nfunction closeAll() {\n  openModalsIds.forEach(async ({ render, currentConfig, delay }, rootElId) => {\n    const config = { ...currentConfig, isShown: false };\n    render(config);\n    await new Promise((resolveDelay) => setTimeout(resolveDelay, delay));\n    ReactDOM.unmountComponentAtNode(getRoot(rootElId));\n    openModalsIds.delete(rootElId);\n  });\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction open<T = any>(\n  componentRenderer: (\n    props: ModalLauncherComponentRendererProps<T>,\n  ) => JSX.Element,\n  options: ModalLauncherOpenOptions = {},\n): Promise<T> {\n  options = { delay: 300, ...options };\n\n  // Allow components to specify if they wish to reuse the modal container\n  const rootElId = `modals-root${options.modalId || Date.now()}`;\n  const rootDom = getRoot(rootElId);\n\n  return new Promise((resolve) => {\n    let currentConfig = { onClose, isShown: true };\n\n    function render({\n      onClose,\n      isShown,\n    }: ModalLauncherComponentRendererProps<T>) {\n      ReactDOM.render(componentRenderer({ onClose, isShown }), rootDom);\n    }\n\n    async function onClose(arg?: T) {\n      currentConfig = {\n        ...currentConfig,\n        isShown: false,\n      };\n      render(currentConfig);\n      await new Promise((resolveDelay) =>\n        setTimeout(resolveDelay, options.delay),\n      );\n      ReactDOM.unmountComponentAtNode(rootDom);\n      rootDom.remove();\n      openModalsIds.delete(rootElId);\n      resolve(arg);\n    }\n\n    render(currentConfig);\n    openModalsIds.set(rootElId, {\n      render,\n      currentConfig,\n      delay: options.delay,\n    });\n  });\n}\n\nexport const ModalLauncher = {\n  open,\n  closeAll,\n};\n"],"names":["Modal","ModalProps","ModalConfirm","ModalConfirmProps","ModalContent","ModalContentProps","ModalControls","ModalControlsProps","ModalHeader","ModalHeaderProps","ModalLauncher","OriginalModal","CompoundModal","Content","Header","Controls","React","ReactModal","Box","CommonProps","getModalStyles","ModalSizeType","ModalPositionType","ModalSizesMapper","medium","small","large","fullWidth","zen","isShown","onClose","Props","onAfterOpen","aria","shouldCloseOnOverlayClick","shouldCloseOnEscapePress","position","topOffset","title","size","allowHeightOverflow","modalHeaderProps","Partial","modalContentProps","initialFocusRef","RefObject","HTMLElement","children","ReactNode","RenderModal","modalProps","focusFirstWithinNode","node","querySelectorAll","elements","length","firstElement","focus","testId","otherProps","contentRef","useRef","HTMLDivElement","props","styles","className","useEffect","setTimeout","current","renderDefault","portal","base","root","afterOpen","beforeClose","content","top","modalOverlay","ref","width","modal","CloseIcon","Flex","PropsWithHTMLElement","Button","Subheading","getModalHeaderStyles","ModalHeaderInternalProps","Function","ReactElement","buttonContainer","tokens","padding","spacingM","spacingL","borderRadius","borderRadiusMedium","borderBottom","gray300","spacing2Xl","height","button","spacing2Xs","right","getModalContentStyles","ModalContentInternalProps","color","gray700","fontSize","fontSizeM","fontFamily","fontStackPrimary","lineHeight","lineHeightM","overflowY","overflowX","boxSizing","transition","transitionDurationLong","transitionEasingDefault","transitionDurationDefault","transitionEasingCubicBezier","opacity","margin","transform","backgroundColor","colorWhite","boxShadow","boxShadowHeavy","maxHeight","fontBaseDefault","maxWidth","overflow","display","flexDirection","zIndex","zIndexModalContent","textAlign","outline","alignItems","flexWrap","bottom","left","zIndexModal","ButtonGroup","ModalControlsInternalProps","onConfirm","onCancel","confirmLabel","cancelLabel","intent","isConfirmDisabled","isConfirmLoading","modalControlsProps","confirmTestId","cancelTestId","cancelRef","confirmButton","cancelButton","ReactDOM","ModalLauncherComponentRendererProps","result","T","ModalLauncherOpenOptions","modalId","delay","CloseModalData","render","args","currentConfig","getRoot","rootElId","rootDom","document","getElementById","createElement","setAttribute","body","appendChild","openModalsIds","Map","closeAll","forEach","config","Promise","resolveDelay","unmountComponentAtNode","delete","open","componentRenderer","JSX","Element","options","Date","now","resolve","arg","remove","set"],"version":3,"file":"main.js.map"}

package/dist/module.js

@@ -215,7 +215,7 @@ function $bfd2aa2f2cc9e088$var$focusFirstWithinNode(node) {
         }
     }
 }
-function $bfd2aa2f2cc9e088$export$2b77a92f1a5ad772({ allowHeightOverflow: allowHeightOverflow , position: position , shouldCloseOnEscapePress: shouldCloseOnEscapePress , shouldCloseOnOverlayClick: shouldCloseOnOverlayClick , size: size , testId: testId , topOffset: topOffset , aria: aria , ...otherProps }) {
+function $bfd2aa2f2cc9e088$export$2b77a92f1a5ad772({ allowHeightOverflow: allowHeightOverflow = false , position: position = 'center' , shouldCloseOnEscapePress: shouldCloseOnEscapePress = true , shouldCloseOnOverlayClick: shouldCloseOnOverlayClick = true , size: size = 'medium' , testId: testId = 'cf-ui-modal' , topOffset: topOffset = '50px' , aria: aria , ...otherProps }) {
     const contentRef = $8jMle$useRef(null);
     const props = {
         ...otherProps,
@@ -288,17 +288,7 @@ function $bfd2aa2f2cc9e088$export$2b77a92f1a5ad772({ allowHeightOverflow: allowH
         className: styles.modal,
         "data-modal-root": true
     }, typeof otherProps.children === 'function' ? otherProps.children(props) : renderDefault())));
-} // Use defaultProps instead of default values in the function to allow the
-// Storybook to import and use these values
-$bfd2aa2f2cc9e088$export$2b77a92f1a5ad772.defaultProps = {
-    allowHeightOverflow: false,
-    position: 'center',
-    shouldCloseOnEscapePress: true,
-    shouldCloseOnOverlayClick: true,
-    size: 'medium',
-    testId: 'cf-ui-modal',
-    topOffset: '50px'
-};
+}
 
 
 

package/dist/module.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/components/modal/index.ts","packages/components/modal/src/index.ts","packages/components/modal/src/CompoundModal.tsx","packages/components/modal/src/Modal.tsx","packages/components/modal/src/ModalHeader/ModalHeader.tsx","packages/components/modal/src/ModalHeader/ModalHeader.styles.ts","packages/components/modal/src/ModalContent/ModalContent.tsx","packages/components/modal/src/ModalContent/ModalContent.styles.ts","packages/components/modal/src/Modal.styles.ts","packages/components/modal/src/ModalControls/ModalControls.tsx","packages/components/modal/src/ModalConfirm/ModalConfirm.tsx","packages/components/modal/src/ModalLauncher/ModalLauncher.tsx"],"sourcesContent":["export * from './src/index';\n","export { Modal } from './CompoundModal';\nexport type { ModalProps } from './Modal';\nexport { ModalConfirm } from './ModalConfirm/ModalConfirm';\nexport type { ModalConfirmProps } from './ModalConfirm/ModalConfirm';\nexport { ModalContent } from './ModalContent/ModalContent';\nexport type { ModalContentProps } from './ModalContent/ModalContent';\nexport { ModalControls } from './ModalControls/ModalControls';\nexport type { ModalControlsProps } from './ModalControls/ModalControls';\nexport { ModalHeader } from './ModalHeader/ModalHeader';\nexport type { ModalHeaderProps } from './ModalHeader/ModalHeader';\nexport { ModalLauncher } from './ModalLauncher/ModalLauncher';\n","import { Modal as OriginalModal } from './Modal';\nimport { ModalContent } from './ModalContent/ModalContent';\nimport { ModalHeader } from './ModalHeader/ModalHeader';\nimport { ModalControls } from './ModalControls/ModalControls';\n\ntype CompoundModal = typeof OriginalModal & {\n  Content: typeof ModalContent;\n  Header: typeof ModalHeader;\n  Controls: typeof ModalControls;\n};\n\nexport const Modal = OriginalModal as CompoundModal;\nModal.Content = ModalContent;\nModal.Header = ModalHeader;\nModal.Controls = ModalControls;\n","import * as React from 'react';\nimport ReactModal from 'react-modal';\n\nimport { Box } from '@contentful/f36-core';\nimport type { CommonProps } from '@contentful/f36-core';\n\nimport { ModalHeader, ModalHeaderProps } from './ModalHeader/ModalHeader';\nimport { ModalContent, ModalContentProps } from './ModalContent/ModalContent';\nimport { getModalStyles } from './Modal.styles';\nimport type { ModalSizeType, ModalPositionType } from './types';\n\nconst ModalSizesMapper = {\n  medium: '520px',\n  small: '400px',\n  large: '700px',\n  fullWidth: '100vw',\n  zen: '100vw',\n};\n\nexport interface ModalProps extends CommonProps {\n  /**\n   * When true, the dialog is shown.\n   */\n  isShown: boolean;\n\n  /**\n   * Function that will be run when the modal is requested to be closed, prior to actually closing.\n   */\n  onClose: ReactModal.Props['onRequestClose'];\n\n  /**\n   * Function that will be run after the modal has opened.\n   */\n  onAfterOpen?: ReactModal.Props['onAfterOpen'];\n\n  /**\n   * Additional aria attributes\n   */\n  aria?: ReactModal.Props['aria'];\n\n  /**\n   * Boolean indicating if clicking the overlay should close the overlay.\n   */\n  shouldCloseOnOverlayClick?: boolean;\n  /**\n   * Boolean indicating if pressing the esc key should close the overlay.\n   */\n  shouldCloseOnEscapePress?: boolean;\n  /**\n   * Indicating if modal is centered or linked to the top\n   */\n  position?: ModalPositionType;\n  /**\n      Top offset if position is 'top'\n    */\n  topOffset?: number | string;\n  /**\n      Modal title that is used in header\n    */\n  title?: string;\n  /**\n      Size of the modal window\n    */\n  size?: ModalSizeType;\n  /**\n   * Are modals higher than viewport allowed\n   */\n  allowHeightOverflow?: boolean;\n\n  /**\n   * Optional props to override ModalHeader behaviour\n   */\n  modalHeaderProps?: Partial<ModalHeaderProps>;\n\n  /**\n   * Optional props to override ModalContent behaviour\n   */\n  modalContentProps?: Partial<ModalContentProps>;\n\n  /**\n   * Optional property to set initial focus\n   */\n  initialFocusRef?: React.RefObject<HTMLElement>;\n\n  children: React.ReactNode | RenderModal;\n}\n\ntype RenderModal = (modalProps: ModalProps) => React.ReactNode;\n\nfunction focusFirstWithinNode(node: HTMLElement) {\n  if (node && node.querySelectorAll) {\n    const elements = node.querySelectorAll('input, button');\n    if (elements.length > 0) {\n      const firstElement = elements[0];\n      // @ts-expect-error focus might be missing\n      if (typeof firstElement.focus === 'function') {\n        // @ts-expect-error focus might be missing\n        firstElement.focus();\n      }\n    }\n  }\n}\n\nexport function Modal({\n  allowHeightOverflow,\n  position,\n  shouldCloseOnEscapePress,\n  shouldCloseOnOverlayClick,\n  size,\n  testId,\n  topOffset,\n  aria,\n  ...otherProps\n}: ModalProps) {\n  const contentRef = React.useRef<HTMLDivElement>(null);\n\n  const props = {\n    ...otherProps,\n    allowHeightOverflow,\n    position,\n    shouldCloseOnEscapePress,\n    shouldCloseOnOverlayClick,\n    size,\n    testId,\n    topOffset,\n  };\n\n  const styles = getModalStyles({\n    position,\n    size,\n    allowHeightOverflow,\n    className: otherProps.className,\n  });\n\n  React.useEffect(() => {\n    if (props.isShown) {\n      setTimeout(() => {\n        if (props.initialFocusRef && props.initialFocusRef.current) {\n          if (props.initialFocusRef.current.focus) {\n            props.initialFocusRef.current.focus();\n          }\n        } else if (contentRef.current) {\n          focusFirstWithinNode(contentRef.current);\n        }\n      }, 100);\n    }\n  }, [props.isShown, props.initialFocusRef]);\n\n  const renderDefault = () => {\n    return (\n      <React.Fragment>\n        {otherProps.title && (\n          <ModalHeader\n            title={otherProps.title}\n            onClose={props.onClose}\n            {...otherProps.modalHeaderProps}\n          />\n        )}\n        <ModalContent {...otherProps.modalContentProps}>\n          {otherProps.children}\n        </ModalContent>\n      </React.Fragment>\n    );\n  };\n\n  return (\n    <ReactModal\n      ariaHideApp={false}\n      aria={aria}\n      onRequestClose={props.onClose}\n      isOpen={otherProps.isShown}\n      onAfterOpen={props.onAfterOpen}\n      shouldCloseOnEsc={shouldCloseOnEscapePress}\n      shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n      shouldFocusAfterRender\n      shouldReturnFocusAfterClose\n      portalClassName={styles.portal}\n      className={{\n        base: styles.base.root,\n        afterOpen: styles.base.afterOpen,\n        beforeClose: styles.base.beforeClose,\n      }}\n      style={{\n        content: {\n          top: position === 'center' ? 0 : topOffset,\n        },\n      }}\n      overlayClassName={{\n        base: styles.modalOverlay.root,\n        afterOpen: styles.modalOverlay.afterOpen,\n        beforeClose: styles.modalOverlay.beforeClose,\n      }}\n      closeTimeoutMS={300}\n      contentRef={(ref) => {\n        contentRef.current = ref;\n      }}\n    >\n      <Box\n        testId={testId}\n        style={{\n          width: ModalSizesMapper[size] || size,\n        }}\n        className={styles.modal}\n        data-modal-root\n      >\n        {typeof otherProps.children === 'function'\n          ? otherProps.children(props)\n          : renderDefault()}\n      </Box>\n    </ReactModal>\n  );\n}\n\n// Use defaultProps instead of default values in the function to allow the\n// Storybook to import and use these values\nModal.defaultProps = {\n  allowHeightOverflow: false,\n  position: 'center',\n  shouldCloseOnEscapePress: true,\n  shouldCloseOnOverlayClick: true,\n  size: 'medium',\n  testId: 'cf-ui-modal',\n  topOffset: '50px',\n};\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { CloseIcon } from '@contentful/f36-icons';\nimport { Flex } from '@contentful/f36-core';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Button } from '@contentful/f36-button';\nimport { Subheading } from '@contentful/f36-typography';\n\nimport { getModalHeaderStyles } from './ModalHeader.styles';\n\ninterface ModalHeaderInternalProps extends CommonProps {\n  title: string;\n  onClose?: Function;\n}\n\nexport type ModalHeaderProps = PropsWithHTMLElement<\n  ModalHeaderInternalProps,\n  'div'\n>;\n\nexport function ModalHeader({\n  onClose,\n  title,\n  testId = 'cf-ui-modal-header',\n  className,\n  ...otherProps\n}: ModalHeaderProps): React.ReactElement {\n  const styles = getModalHeaderStyles();\n\n  return (\n    <Flex\n      {...otherProps}\n      className={cx(styles.root, className)}\n      testId={testId}\n      alignItems=\"center\"\n      justifyContent=\"space-between\"\n    >\n      <Subheading as=\"h1\" isTruncated marginBottom=\"none\">\n        {title}\n      </Subheading>\n      {onClose && (\n        <Flex alignItems=\"center\" className={styles.buttonContainer}>\n          <Button\n            variant=\"transparent\"\n            aria-label=\"Close\"\n            startIcon={<CloseIcon size=\"small\" />}\n            onClick={() => {\n              onClose();\n            }}\n            size=\"small\"\n          />\n        </Flex>\n      )}\n    </Flex>\n  );\n}\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getModalHeaderStyles() {\n  return {\n    root: css({\n      position: 'relative',\n      padding: `${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingL}`,\n      borderRadius: `${tokens.borderRadiusMedium} ${tokens.borderRadiusMedium} 0 0`,\n      borderBottom: `1px solid ${tokens.gray300}`,\n    }),\n    buttonContainer: css({\n      position: 'relative',\n      width: tokens.spacing2Xl,\n      height: tokens.spacingL,\n      button: {\n        position: 'absolute',\n        top: `calc(-1 * ${tokens.spacing2Xs})`,\n        right: 0,\n      },\n    }),\n  };\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Box } from '@contentful/f36-core';\nimport { getModalContentStyles } from './ModalContent.styles';\n\ninterface ModalContentInternalProps extends CommonProps {\n  children: React.ReactNode;\n}\n\nexport type ModalContentProps = PropsWithHTMLElement<\n  ModalContentInternalProps,\n  'div'\n>;\n\nexport function ModalContent({\n  testId = 'cf-ui-modal-content',\n  className,\n  children,\n  ...otherProps\n}: ModalContentProps) {\n  const styles = getModalContentStyles();\n  return (\n    <Box\n      {...otherProps}\n      as=\"div\"\n      className={cx(styles.root, className)}\n      testId={testId}\n    >\n      {children}\n    </Box>\n  );\n}\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport function getModalContentStyles() {\n  return {\n    root: css({\n      padding: `${tokens.spacingM} ${tokens.spacingL}`,\n      color: tokens.gray700,\n      fontSize: tokens.fontSizeM,\n      fontFamily: tokens.fontStackPrimary,\n      lineHeight: tokens.lineHeightM,\n      overflowY: 'auto',\n      overflowX: 'auto',\n      boxSizing: 'border-box',\n    }),\n  };\n}\n","import tokens from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport type { ModalPositionType, ModalSizeType } from './types';\n\nexport function getModalStyles(props: {\n  size: ModalSizeType;\n  position: ModalPositionType;\n  allowHeightOverflow?: boolean;\n  className?: string;\n}) {\n  const modal = cx(\n    css({\n      transition: `opacity ${tokens.transitionDurationLong} ${tokens.transitionEasingDefault}, transform ${tokens.transitionDurationDefault} ${tokens.transitionEasingCubicBezier}`,\n      opacity: '0.5',\n      margin: tokens.spacing2Xl,\n      transform: 'scale(0.85)',\n      backgroundColor: tokens.colorWhite,\n      borderRadius: tokens.borderRadiusMedium,\n      boxShadow: tokens.boxShadowHeavy,\n      maxHeight: `calc(100vh - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n      maxWidth: `calc(100vw - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n      overflow: 'hidden',\n      display: 'flex',\n      flexDirection: 'column',\n    }),\n    props.allowHeightOverflow\n      ? css({\n          overflow: 'auto',\n          maxHeight: 'none',\n        })\n      : null,\n    props.size === 'zen'\n      ? css({\n          maxWidth: 'none',\n          maxHeight: 'none',\n          margin: 0,\n          height: '100%',\n          width: '100%',\n        })\n      : null,\n    props.className,\n  );\n\n  return {\n    portal: css({\n      display: 'block',\n    }),\n    base: {\n      root: cx(\n        css({\n          zIndex: tokens.zIndexModalContent,\n          position: 'relative',\n          padding: 0,\n          display: 'inline-block',\n          margin: '0 auto',\n          textAlign: 'left',\n          outline: 'none',\n        }),\n        props.size === 'zen'\n          ? css({\n              width: '100%',\n              height: '100%',\n            })\n          : null,\n      ),\n      afterOpen: css({\n        '[data-modal-root]': {\n          transform: 'scale(1)',\n          opacity: '1',\n        },\n      }),\n      beforeClose: css({\n        '[data-modal-root]': {\n          opacity: '0.5',\n          transform: 'scale(0.85)',\n        },\n      }),\n    },\n    modalOverlay: {\n      root: cx(\n        css({\n          display: 'flex',\n          alignItems: 'baseline',\n          flexWrap: 'wrap',\n          top: 0,\n          right: 0,\n          bottom: 0,\n          left: 0,\n          zIndex: tokens.zIndexModal,\n          opacity: 0,\n          transition: `opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n          position: 'fixed',\n          overflowY: 'auto',\n          backgroundColor: 'rgba(12, 20, 28, 0.74902)',\n          textAlign: 'center',\n        }),\n        props.position === 'center'\n          ? css({\n              alignItems: 'center',\n              justifyContent: 'center',\n            })\n          : null,\n      ),\n      afterOpen: css({\n        opacity: '1 !important',\n      }),\n      beforeClose: css({\n        opacity: 0,\n      }),\n    },\n    modal,\n  };\n}\n","import React from 'react';\n\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Flex } from '@contentful/f36-core';\nimport { ButtonGroup } from '@contentful/f36-button';\n\ninterface ModalControlsInternalProps extends CommonProps {\n  children: React.ReactElement[] | React.ReactElement;\n}\n\nexport type ModalControlsProps = PropsWithHTMLElement<\n  ModalControlsInternalProps,\n  'div'\n>;\n\nexport function ModalControls({\n  testId = 'cf-ui-modal-controls',\n  className,\n  children,\n  ...otherProps\n}: ModalControlsProps): React.ReactElement {\n  return (\n    <Flex\n      {...otherProps}\n      className={className}\n      testId={testId}\n      flexDirection=\"row\"\n      justifyContent=\"flex-end\"\n      margin=\"spacingL\"\n      marginTop=\"none\"\n    >\n      <ButtonGroup variant=\"spaced\" spacing=\"spacingS\">\n        {children}\n      </ButtonGroup>\n    </Flex>\n  );\n}\n","import React from 'react';\n\nimport { Modal } from '../CompoundModal';\nimport { ModalProps } from '../Modal';\nimport type { ModalSizeType } from '../types';\nimport type { ModalHeaderProps } from '../ModalHeader/ModalHeader';\nimport type { ModalContentProps } from '../ModalContent/ModalContent';\nimport type { ModalControlsProps } from '../ModalControls/ModalControls';\nimport { Button } from '@contentful/f36-button';\n\nexport interface ModalConfirmProps {\n  /**\n   * When true, the dialog is shown.\n   */\n  isShown: boolean;\n  /**\n   * Function that will be called when the confirm button is clicked. This does not close the ModalConfirm.\n   */\n  onConfirm(): void;\n  /**\n   * Function that will be called when the cancel button is clicked. This does not close the ModalConfirm.\n   */\n  onCancel: ModalProps['onClose'];\n  /**\n      Modal title that is used in header\n    */\n  title?: string;\n  /**\n   * Label of the confirm button\n   */\n  confirmLabel?: string | false;\n  /**\n   * Label of the cancel button\n   */\n  cancelLabel?: string | false;\n  /**\n   * The intent of the ModalConfirm. Used for the Button.\n   */\n  intent?: 'primary' | 'positive' | 'negative';\n  /**\n      Size of the modal window\n    */\n  size?: ModalSizeType;\n  /**\n   * Boolean indicating if clicking the overlay should close the overlay.\n   */\n  shouldCloseOnOverlayClick?: boolean;\n  /**\n   * Boolean indicating if pressing the esc key should close the overlay.\n   */\n  shouldCloseOnEscapePress?: boolean;\n  /**\n   * When true, the confirm button is set to disabled.\n   */\n  isConfirmDisabled?: boolean;\n  /**\n   * When true, the confirm button is set to loading.\n   */\n  isConfirmLoading?: boolean;\n  /**\n   * Are modals higher than viewport allowed\n   */\n  allowHeightOverflow?: boolean;\n\n  /**\n   * Optional props to override ModalHeader behaviour\n   */\n  modalHeaderProps?: Partial<ModalHeaderProps>;\n\n  /**\n   * Optional props to override ModalContent behaviour\n   */\n  modalContentProps?: Partial<ModalContentProps>;\n\n  /**\n   * Optional props to override ModalControl behaviour\n   */\n  modalControlsProps?: Partial<ModalControlsProps>;\n\n  /**\n   * Optional property to set initial focus\n   */\n  initialFocusRef?: React.RefObject<HTMLElement>;\n\n  testId?: string;\n  confirmTestId?: string;\n  cancelTestId?: string;\n  children: React.ReactNode;\n}\n\nexport function ModalConfirm({\n  allowHeightOverflow = false,\n  cancelLabel = 'Cancel',\n  cancelTestId = 'cf-ui-modal-confirm-cancel-button',\n  children,\n  confirmLabel = 'Confirm',\n  confirmTestId = 'cf-ui-modal-confirm-confirm-button',\n  intent = 'positive',\n  isConfirmDisabled = false,\n  isConfirmLoading = false,\n  isShown,\n  modalContentProps,\n  modalControlsProps,\n  modalHeaderProps,\n  onCancel,\n  onConfirm,\n  shouldCloseOnEscapePress = true,\n  shouldCloseOnOverlayClick = true,\n  size = 'medium',\n  testId = 'cf-ui-modal-confirm',\n  title = 'Are you sure?',\n  initialFocusRef,\n}: ModalConfirmProps) {\n  const cancelRef = React.useRef(null);\n\n  const confirmButton = confirmLabel ? (\n    <Button\n      testId={confirmTestId}\n      isDisabled={isConfirmDisabled}\n      isLoading={isConfirmLoading}\n      variant={intent}\n      size=\"small\"\n      onClick={() => onConfirm()}\n    >\n      {confirmLabel}\n    </Button>\n  ) : null;\n\n  const cancelButton = cancelLabel ? (\n    <Button\n      testId={cancelTestId}\n      variant=\"secondary\"\n      onClick={onCancel}\n      size=\"small\"\n      ref={initialFocusRef || cancelRef}\n    >\n      {cancelLabel}\n    </Button>\n  ) : null;\n\n  return (\n    <Modal\n      testId={testId}\n      isShown={isShown}\n      onClose={onCancel}\n      size={size}\n      shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n      shouldCloseOnEscapePress={shouldCloseOnEscapePress}\n      allowHeightOverflow={allowHeightOverflow}\n      initialFocusRef={cancelRef}\n    >\n      {() => {\n        return (\n          <React.Fragment>\n            <Modal.Header title={title || ''} {...modalHeaderProps} />\n            <Modal.Content {...modalContentProps}>{children}</Modal.Content>\n            <Modal.Controls {...modalControlsProps}>\n              {cancelButton}\n              {confirmButton}\n            </Modal.Controls>\n          </React.Fragment>\n        );\n      }}\n    </Modal>\n  );\n}\n","/* global Promise */\nimport ReactDOM from 'react-dom';\n\n// @todo: change any to unknown\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ninterface ModalLauncherComponentRendererProps<T = any> {\n  isShown: boolean;\n  onClose: (result?: T) => void;\n}\n\ninterface ModalLauncherOpenOptions {\n  /**\n   * Unique id to be used as identifier for the modal contianer\n   */\n  modalId?: string;\n  /**\n   * ms before removing the component from the tree\n   * @default 300\n   */\n  delay?: number;\n}\n\ninterface CloseModalData {\n  delay: number;\n  render: (args: ModalLauncherComponentRendererProps<any>) => void;\n  currentConfig: ModalLauncherComponentRendererProps<any>;\n}\n\nconst getRoot = (rootElId: string): HTMLElement => {\n  // Reuse the container if we find it\n  let rootDom = document.getElementById(rootElId);\n  if (rootDom !== null) {\n    return rootDom;\n  }\n\n  // Otherwise create it\n  rootDom = document.createElement('div');\n  rootDom.setAttribute('id', rootElId);\n  document.body.appendChild(rootDom);\n  return rootDom;\n};\n\nconst openModalsIds: Map<string, CloseModalData> = new Map();\nfunction closeAll() {\n  openModalsIds.forEach(async ({ render, currentConfig, delay }, rootElId) => {\n    const config = { ...currentConfig, isShown: false };\n    render(config);\n    await new Promise((resolveDelay) => setTimeout(resolveDelay, delay));\n    ReactDOM.unmountComponentAtNode(getRoot(rootElId));\n    openModalsIds.delete(rootElId);\n  });\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction open<T = any>(\n  componentRenderer: (\n    props: ModalLauncherComponentRendererProps<T>,\n  ) => JSX.Element,\n  options: ModalLauncherOpenOptions = {},\n): Promise<T> {\n  options = { delay: 300, ...options };\n\n  // Allow components to specify if they wish to reuse the modal container\n  const rootElId = `modals-root${options.modalId || Date.now()}`;\n  const rootDom = getRoot(rootElId);\n\n  return new Promise((resolve) => {\n    let currentConfig = { onClose, isShown: true };\n\n    function render({\n      onClose,\n      isShown,\n    }: ModalLauncherComponentRendererProps<T>) {\n      ReactDOM.render(componentRenderer({ onClose, isShown }), rootDom);\n    }\n\n    async function onClose(arg?: T) {\n      currentConfig = {\n        ...currentConfig,\n        isShown: false,\n      };\n      render(currentConfig);\n      await new Promise((resolveDelay) =>\n        setTimeout(resolveDelay, options.delay),\n      );\n      ReactDOM.unmountComponentAtNode(rootDom);\n      rootDom.remove();\n      openModalsIds.delete(rootElId);\n      resolve(arg);\n    }\n\n    render(currentConfig);\n    openModalsIds.set(rootElId, {\n      render,\n      currentConfig,\n      delay: options.delay,\n    });\n  });\n}\n\nexport const ModalLauncher = {\n  open,\n  closeAll,\n};\n"],"names":["Modal","ModalProps","ModalConfirm","ModalConfirmProps","ModalContent","ModalContentProps","ModalControls","ModalControlsProps","ModalHeader","ModalHeaderProps","ModalLauncher","OriginalModal","CompoundModal","Content","Header","Controls","React","ReactModal","Box","CommonProps","getModalStyles","ModalSizeType","ModalPositionType","ModalSizesMapper","medium","small","large","fullWidth","zen","isShown","onClose","Props","onAfterOpen","aria","shouldCloseOnOverlayClick","shouldCloseOnEscapePress","position","topOffset","title","size","allowHeightOverflow","modalHeaderProps","Partial","modalContentProps","initialFocusRef","RefObject","HTMLElement","children","ReactNode","RenderModal","modalProps","focusFirstWithinNode","node","querySelectorAll","elements","length","firstElement","focus","testId","otherProps","contentRef","useRef","HTMLDivElement","props","styles","className","useEffect","setTimeout","current","renderDefault","portal","base","root","afterOpen","beforeClose","content","top","modalOverlay","ref","width","modal","defaultProps","CloseIcon","Flex","PropsWithHTMLElement","Button","Subheading","getModalHeaderStyles","ModalHeaderInternalProps","Function","ReactElement","buttonContainer","tokens","padding","spacingM","spacingL","borderRadius","borderRadiusMedium","borderBottom","gray300","spacing2Xl","height","button","spacing2Xs","right","getModalContentStyles","ModalContentInternalProps","color","gray700","fontSize","fontSizeM","fontFamily","fontStackPrimary","lineHeight","lineHeightM","overflowY","overflowX","boxSizing","transition","transitionDurationLong","transitionEasingDefault","transitionDurationDefault","transitionEasingCubicBezier","opacity","margin","transform","backgroundColor","colorWhite","boxShadow","boxShadowHeavy","maxHeight","fontBaseDefault","maxWidth","overflow","display","flexDirection","zIndex","zIndexModalContent","textAlign","outline","alignItems","flexWrap","bottom","left","zIndexModal","ButtonGroup","ModalControlsInternalProps","onConfirm","onCancel","confirmLabel","cancelLabel","intent","isConfirmDisabled","isConfirmLoading","modalControlsProps","confirmTestId","cancelTestId","cancelRef","confirmButton","cancelButton","ReactDOM","ModalLauncherComponentRendererProps","result","T","ModalLauncherOpenOptions","modalId","delay","CloseModalData","render","args","currentConfig","getRoot","rootElId","rootDom","document","getElementById","createElement","setAttribute","body","appendChild","openModalsIds","Map","closeAll","forEach","config","Promise","resolveDelay","unmountComponentAtNode","delete","open","componentRenderer","JSX","Element","options","Date","now","resolve","arg","remove","set"],"version":3,"file":"module.js.map"}
+{"mappings":"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","sources":["packages/components/modal/index.ts","packages/components/modal/src/index.ts","packages/components/modal/src/CompoundModal.tsx","packages/components/modal/src/Modal.tsx","packages/components/modal/src/ModalHeader/ModalHeader.tsx","packages/components/modal/src/ModalHeader/ModalHeader.styles.ts","packages/components/modal/src/ModalContent/ModalContent.tsx","packages/components/modal/src/ModalContent/ModalContent.styles.ts","packages/components/modal/src/Modal.styles.ts","packages/components/modal/src/ModalControls/ModalControls.tsx","packages/components/modal/src/ModalConfirm/ModalConfirm.tsx","packages/components/modal/src/ModalLauncher/ModalLauncher.tsx"],"sourcesContent":["export * from './src/index';\n","export { Modal } from './CompoundModal';\nexport type { ModalProps } from './Modal';\nexport { ModalConfirm } from './ModalConfirm/ModalConfirm';\nexport type { ModalConfirmProps } from './ModalConfirm/ModalConfirm';\nexport { ModalContent } from './ModalContent/ModalContent';\nexport type { ModalContentProps } from './ModalContent/ModalContent';\nexport { ModalControls } from './ModalControls/ModalControls';\nexport type { ModalControlsProps } from './ModalControls/ModalControls';\nexport { ModalHeader } from './ModalHeader/ModalHeader';\nexport type { ModalHeaderProps } from './ModalHeader/ModalHeader';\nexport { ModalLauncher } from './ModalLauncher/ModalLauncher';\n","import { Modal as OriginalModal } from './Modal';\nimport { ModalContent } from './ModalContent/ModalContent';\nimport { ModalHeader } from './ModalHeader/ModalHeader';\nimport { ModalControls } from './ModalControls/ModalControls';\n\ntype CompoundModal = typeof OriginalModal & {\n  Content: typeof ModalContent;\n  Header: typeof ModalHeader;\n  Controls: typeof ModalControls;\n};\n\nexport const Modal = OriginalModal as CompoundModal;\nModal.Content = ModalContent;\nModal.Header = ModalHeader;\nModal.Controls = ModalControls;\n","import * as React from 'react';\nimport ReactModal from 'react-modal';\n\nimport { Box } from '@contentful/f36-core';\nimport type { CommonProps } from '@contentful/f36-core';\n\nimport { ModalHeader, ModalHeaderProps } from './ModalHeader/ModalHeader';\nimport { ModalContent, ModalContentProps } from './ModalContent/ModalContent';\nimport { getModalStyles } from './Modal.styles';\nimport type { ModalSizeType, ModalPositionType } from './types';\n\nconst ModalSizesMapper = {\n  medium: '520px',\n  small: '400px',\n  large: '700px',\n  fullWidth: '100vw',\n  zen: '100vw',\n};\n\nexport interface ModalProps extends CommonProps {\n  /**\n   * When true, the dialog is shown.\n   */\n  isShown: boolean;\n\n  /**\n   * Function that will be run when the modal is requested to be closed, prior to actually closing.\n   */\n  onClose: ReactModal.Props['onRequestClose'];\n\n  /**\n   * Function that will be run after the modal has opened.\n   */\n  onAfterOpen?: ReactModal.Props['onAfterOpen'];\n\n  /**\n   * Additional aria attributes\n   */\n  aria?: ReactModal.Props['aria'];\n\n  /**\n   * Boolean indicating if clicking the overlay should close the overlay.\n   * @default true\n   */\n  shouldCloseOnOverlayClick?: boolean;\n  /**\n   * Boolean indicating if pressing the esc key should close the overlay.\n   * @default true\n   */\n  shouldCloseOnEscapePress?: boolean;\n  /**\n   * Indicating if modal is centered or linked to the top\n   * @default center\n   */\n  position?: ModalPositionType;\n  /**\n   * Top offset if position is 'top'\n   * @default 50px\n   */\n  topOffset?: number | string;\n  /**\n   * Modal title that is used in header\n   */\n  title?: string;\n  /**\n   * Size of the modal window\n   * @default medium\n   */\n  size?: ModalSizeType;\n  /**\n   * Are modals higher than viewport allowed\n   * @default false\n   */\n  allowHeightOverflow?: boolean;\n\n  /**\n   * Optional props to override ModalHeader behaviour\n   */\n  modalHeaderProps?: Partial<ModalHeaderProps>;\n\n  /**\n   * Optional props to override ModalContent behaviour\n   */\n  modalContentProps?: Partial<ModalContentProps>;\n\n  /**\n   * Optional property to set initial focus\n   */\n  initialFocusRef?: React.RefObject<HTMLElement>;\n\n  children: React.ReactNode | RenderModal;\n}\n\ntype RenderModal = (modalProps: ModalProps) => React.ReactNode;\n\nfunction focusFirstWithinNode(node: HTMLElement) {\n  if (node && node.querySelectorAll) {\n    const elements = node.querySelectorAll('input, button');\n    if (elements.length > 0) {\n      const firstElement = elements[0];\n      // @ts-expect-error focus might be missing\n      if (typeof firstElement.focus === 'function') {\n        // @ts-expect-error focus might be missing\n        firstElement.focus();\n      }\n    }\n  }\n}\n\nexport function Modal({\n  allowHeightOverflow = false,\n  position = 'center',\n  shouldCloseOnEscapePress = true,\n  shouldCloseOnOverlayClick = true,\n  size = 'medium',\n  testId = 'cf-ui-modal',\n  topOffset = '50px',\n  aria,\n  ...otherProps\n}: ModalProps) {\n  const contentRef = React.useRef<HTMLDivElement>(null);\n\n  const props = {\n    ...otherProps,\n    allowHeightOverflow,\n    position,\n    shouldCloseOnEscapePress,\n    shouldCloseOnOverlayClick,\n    size,\n    testId,\n    topOffset,\n  };\n\n  const styles = getModalStyles({\n    position,\n    size,\n    allowHeightOverflow,\n    className: otherProps.className,\n  });\n\n  React.useEffect(() => {\n    if (props.isShown) {\n      setTimeout(() => {\n        if (props.initialFocusRef && props.initialFocusRef.current) {\n          if (props.initialFocusRef.current.focus) {\n            props.initialFocusRef.current.focus();\n          }\n        } else if (contentRef.current) {\n          focusFirstWithinNode(contentRef.current);\n        }\n      }, 100);\n    }\n  }, [props.isShown, props.initialFocusRef]);\n\n  const renderDefault = () => {\n    return (\n      <React.Fragment>\n        {otherProps.title && (\n          <ModalHeader\n            title={otherProps.title}\n            onClose={props.onClose}\n            {...otherProps.modalHeaderProps}\n          />\n        )}\n        <ModalContent {...otherProps.modalContentProps}>\n          {otherProps.children}\n        </ModalContent>\n      </React.Fragment>\n    );\n  };\n\n  return (\n    <ReactModal\n      ariaHideApp={false}\n      aria={aria}\n      onRequestClose={props.onClose}\n      isOpen={otherProps.isShown}\n      onAfterOpen={props.onAfterOpen}\n      shouldCloseOnEsc={shouldCloseOnEscapePress}\n      shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n      shouldFocusAfterRender\n      shouldReturnFocusAfterClose\n      portalClassName={styles.portal}\n      className={{\n        base: styles.base.root,\n        afterOpen: styles.base.afterOpen,\n        beforeClose: styles.base.beforeClose,\n      }}\n      style={{\n        content: {\n          top: position === 'center' ? 0 : topOffset,\n        },\n      }}\n      overlayClassName={{\n        base: styles.modalOverlay.root,\n        afterOpen: styles.modalOverlay.afterOpen,\n        beforeClose: styles.modalOverlay.beforeClose,\n      }}\n      closeTimeoutMS={300}\n      contentRef={(ref) => {\n        contentRef.current = ref;\n      }}\n    >\n      <Box\n        testId={testId}\n        style={{\n          width: ModalSizesMapper[size] || size,\n        }}\n        className={styles.modal}\n        data-modal-root\n      >\n        {typeof otherProps.children === 'function'\n          ? otherProps.children(props)\n          : renderDefault()}\n      </Box>\n    </ReactModal>\n  );\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { CloseIcon } from '@contentful/f36-icons';\nimport { Flex } from '@contentful/f36-core';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Button } from '@contentful/f36-button';\nimport { Subheading } from '@contentful/f36-typography';\n\nimport { getModalHeaderStyles } from './ModalHeader.styles';\n\ninterface ModalHeaderInternalProps extends CommonProps {\n  title: string;\n  onClose?: Function;\n}\n\nexport type ModalHeaderProps = PropsWithHTMLElement<\n  ModalHeaderInternalProps,\n  'div'\n>;\n\nexport function ModalHeader({\n  onClose,\n  title,\n  testId = 'cf-ui-modal-header',\n  className,\n  ...otherProps\n}: ModalHeaderProps): React.ReactElement {\n  const styles = getModalHeaderStyles();\n\n  return (\n    <Flex\n      {...otherProps}\n      className={cx(styles.root, className)}\n      testId={testId}\n      alignItems=\"center\"\n      justifyContent=\"space-between\"\n    >\n      <Subheading as=\"h1\" isTruncated marginBottom=\"none\">\n        {title}\n      </Subheading>\n      {onClose && (\n        <Flex alignItems=\"center\" className={styles.buttonContainer}>\n          <Button\n            variant=\"transparent\"\n            aria-label=\"Close\"\n            startIcon={<CloseIcon size=\"small\" />}\n            onClick={() => {\n              onClose();\n            }}\n            size=\"small\"\n          />\n        </Flex>\n      )}\n    </Flex>\n  );\n}\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getModalHeaderStyles() {\n  return {\n    root: css({\n      position: 'relative',\n      padding: `${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingL}`,\n      borderRadius: `${tokens.borderRadiusMedium} ${tokens.borderRadiusMedium} 0 0`,\n      borderBottom: `1px solid ${tokens.gray300}`,\n    }),\n    buttonContainer: css({\n      position: 'relative',\n      width: tokens.spacing2Xl,\n      height: tokens.spacingL,\n      button: {\n        position: 'absolute',\n        top: `calc(-1 * ${tokens.spacing2Xs})`,\n        right: 0,\n      },\n    }),\n  };\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Box } from '@contentful/f36-core';\nimport { getModalContentStyles } from './ModalContent.styles';\n\ninterface ModalContentInternalProps extends CommonProps {\n  children: React.ReactNode;\n}\n\nexport type ModalContentProps = PropsWithHTMLElement<\n  ModalContentInternalProps,\n  'div'\n>;\n\nexport function ModalContent({\n  testId = 'cf-ui-modal-content',\n  className,\n  children,\n  ...otherProps\n}: ModalContentProps) {\n  const styles = getModalContentStyles();\n  return (\n    <Box\n      {...otherProps}\n      as=\"div\"\n      className={cx(styles.root, className)}\n      testId={testId}\n    >\n      {children}\n    </Box>\n  );\n}\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport function getModalContentStyles() {\n  return {\n    root: css({\n      padding: `${tokens.spacingM} ${tokens.spacingL}`,\n      color: tokens.gray700,\n      fontSize: tokens.fontSizeM,\n      fontFamily: tokens.fontStackPrimary,\n      lineHeight: tokens.lineHeightM,\n      overflowY: 'auto',\n      overflowX: 'auto',\n      boxSizing: 'border-box',\n    }),\n  };\n}\n","import tokens from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport type { ModalPositionType, ModalSizeType } from './types';\n\nexport function getModalStyles(props: {\n  size: ModalSizeType;\n  position: ModalPositionType;\n  allowHeightOverflow?: boolean;\n  className?: string;\n}) {\n  const modal = cx(\n    css({\n      transition: `opacity ${tokens.transitionDurationLong} ${tokens.transitionEasingDefault}, transform ${tokens.transitionDurationDefault} ${tokens.transitionEasingCubicBezier}`,\n      opacity: '0.5',\n      margin: tokens.spacing2Xl,\n      transform: 'scale(0.85)',\n      backgroundColor: tokens.colorWhite,\n      borderRadius: tokens.borderRadiusMedium,\n      boxShadow: tokens.boxShadowHeavy,\n      maxHeight: `calc(100vh - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n      maxWidth: `calc(100vw - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n      overflow: 'hidden',\n      display: 'flex',\n      flexDirection: 'column',\n    }),\n    props.allowHeightOverflow\n      ? css({\n          overflow: 'auto',\n          maxHeight: 'none',\n        })\n      : null,\n    props.size === 'zen'\n      ? css({\n          maxWidth: 'none',\n          maxHeight: 'none',\n          margin: 0,\n          height: '100%',\n          width: '100%',\n        })\n      : null,\n    props.className,\n  );\n\n  return {\n    portal: css({\n      display: 'block',\n    }),\n    base: {\n      root: cx(\n        css({\n          zIndex: tokens.zIndexModalContent,\n          position: 'relative',\n          padding: 0,\n          display: 'inline-block',\n          margin: '0 auto',\n          textAlign: 'left',\n          outline: 'none',\n        }),\n        props.size === 'zen'\n          ? css({\n              width: '100%',\n              height: '100%',\n            })\n          : null,\n      ),\n      afterOpen: css({\n        '[data-modal-root]': {\n          transform: 'scale(1)',\n          opacity: '1',\n        },\n      }),\n      beforeClose: css({\n        '[data-modal-root]': {\n          opacity: '0.5',\n          transform: 'scale(0.85)',\n        },\n      }),\n    },\n    modalOverlay: {\n      root: cx(\n        css({\n          display: 'flex',\n          alignItems: 'baseline',\n          flexWrap: 'wrap',\n          top: 0,\n          right: 0,\n          bottom: 0,\n          left: 0,\n          zIndex: tokens.zIndexModal,\n          opacity: 0,\n          transition: `opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n          position: 'fixed',\n          overflowY: 'auto',\n          backgroundColor: 'rgba(12, 20, 28, 0.74902)',\n          textAlign: 'center',\n        }),\n        props.position === 'center'\n          ? css({\n              alignItems: 'center',\n              justifyContent: 'center',\n            })\n          : null,\n      ),\n      afterOpen: css({\n        opacity: '1 !important',\n      }),\n      beforeClose: css({\n        opacity: 0,\n      }),\n    },\n    modal,\n  };\n}\n","import React from 'react';\n\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Flex } from '@contentful/f36-core';\nimport { ButtonGroup } from '@contentful/f36-button';\n\ninterface ModalControlsInternalProps extends CommonProps {\n  children: React.ReactElement[] | React.ReactElement;\n}\n\nexport type ModalControlsProps = PropsWithHTMLElement<\n  ModalControlsInternalProps,\n  'div'\n>;\n\nexport function ModalControls({\n  testId = 'cf-ui-modal-controls',\n  className,\n  children,\n  ...otherProps\n}: ModalControlsProps): React.ReactElement {\n  return (\n    <Flex\n      {...otherProps}\n      className={className}\n      testId={testId}\n      flexDirection=\"row\"\n      justifyContent=\"flex-end\"\n      margin=\"spacingL\"\n      marginTop=\"none\"\n    >\n      <ButtonGroup variant=\"spaced\" spacing=\"spacingS\">\n        {children}\n      </ButtonGroup>\n    </Flex>\n  );\n}\n","import React from 'react';\n\nimport { Modal } from '../CompoundModal';\nimport { ModalProps } from '../Modal';\nimport type { ModalSizeType } from '../types';\nimport type { ModalHeaderProps } from '../ModalHeader/ModalHeader';\nimport type { ModalContentProps } from '../ModalContent/ModalContent';\nimport type { ModalControlsProps } from '../ModalControls/ModalControls';\nimport { Button } from '@contentful/f36-button';\n\nexport interface ModalConfirmProps {\n  /**\n   * When true, the dialog is shown.\n   */\n  isShown: boolean;\n  /**\n   * Function that will be called when the confirm button is clicked. This does not close the ModalConfirm.\n   */\n  onConfirm(): void;\n  /**\n   * Function that will be called when the cancel button is clicked. This does not close the ModalConfirm.\n   */\n  onCancel: ModalProps['onClose'];\n  /**\n      Modal title that is used in header\n    */\n  title?: string;\n  /**\n   * Label of the confirm button\n   */\n  confirmLabel?: string | false;\n  /**\n   * Label of the cancel button\n   */\n  cancelLabel?: string | false;\n  /**\n   * The intent of the ModalConfirm. Used for the Button.\n   */\n  intent?: 'primary' | 'positive' | 'negative';\n  /**\n      Size of the modal window\n    */\n  size?: ModalSizeType;\n  /**\n   * Boolean indicating if clicking the overlay should close the overlay.\n   */\n  shouldCloseOnOverlayClick?: boolean;\n  /**\n   * Boolean indicating if pressing the esc key should close the overlay.\n   */\n  shouldCloseOnEscapePress?: boolean;\n  /**\n   * When true, the confirm button is set to disabled.\n   */\n  isConfirmDisabled?: boolean;\n  /**\n   * When true, the confirm button is set to loading.\n   */\n  isConfirmLoading?: boolean;\n  /**\n   * Are modals higher than viewport allowed\n   */\n  allowHeightOverflow?: boolean;\n\n  /**\n   * Optional props to override ModalHeader behaviour\n   */\n  modalHeaderProps?: Partial<ModalHeaderProps>;\n\n  /**\n   * Optional props to override ModalContent behaviour\n   */\n  modalContentProps?: Partial<ModalContentProps>;\n\n  /**\n   * Optional props to override ModalControl behaviour\n   */\n  modalControlsProps?: Partial<ModalControlsProps>;\n\n  /**\n   * Optional property to set initial focus\n   */\n  initialFocusRef?: React.RefObject<HTMLElement>;\n\n  testId?: string;\n  confirmTestId?: string;\n  cancelTestId?: string;\n  children: React.ReactNode;\n}\n\nexport function ModalConfirm({\n  allowHeightOverflow = false,\n  cancelLabel = 'Cancel',\n  cancelTestId = 'cf-ui-modal-confirm-cancel-button',\n  children,\n  confirmLabel = 'Confirm',\n  confirmTestId = 'cf-ui-modal-confirm-confirm-button',\n  intent = 'positive',\n  isConfirmDisabled = false,\n  isConfirmLoading = false,\n  isShown,\n  modalContentProps,\n  modalControlsProps,\n  modalHeaderProps,\n  onCancel,\n  onConfirm,\n  shouldCloseOnEscapePress = true,\n  shouldCloseOnOverlayClick = true,\n  size = 'medium',\n  testId = 'cf-ui-modal-confirm',\n  title = 'Are you sure?',\n  initialFocusRef,\n}: ModalConfirmProps) {\n  const cancelRef = React.useRef(null);\n\n  const confirmButton = confirmLabel ? (\n    <Button\n      testId={confirmTestId}\n      isDisabled={isConfirmDisabled}\n      isLoading={isConfirmLoading}\n      variant={intent}\n      size=\"small\"\n      onClick={() => onConfirm()}\n    >\n      {confirmLabel}\n    </Button>\n  ) : null;\n\n  const cancelButton = cancelLabel ? (\n    <Button\n      testId={cancelTestId}\n      variant=\"secondary\"\n      onClick={onCancel}\n      size=\"small\"\n      ref={initialFocusRef || cancelRef}\n    >\n      {cancelLabel}\n    </Button>\n  ) : null;\n\n  return (\n    <Modal\n      testId={testId}\n      isShown={isShown}\n      onClose={onCancel}\n      size={size}\n      shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n      shouldCloseOnEscapePress={shouldCloseOnEscapePress}\n      allowHeightOverflow={allowHeightOverflow}\n      initialFocusRef={cancelRef}\n    >\n      {() => {\n        return (\n          <React.Fragment>\n            <Modal.Header title={title || ''} {...modalHeaderProps} />\n            <Modal.Content {...modalContentProps}>{children}</Modal.Content>\n            <Modal.Controls {...modalControlsProps}>\n              {cancelButton}\n              {confirmButton}\n            </Modal.Controls>\n          </React.Fragment>\n        );\n      }}\n    </Modal>\n  );\n}\n","/* global Promise */\nimport ReactDOM from 'react-dom';\n\n// @todo: change any to unknown\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ninterface ModalLauncherComponentRendererProps<T = any> {\n  isShown: boolean;\n  onClose: (result?: T) => void;\n}\n\ninterface ModalLauncherOpenOptions {\n  /**\n   * Unique id to be used as identifier for the modal contianer\n   */\n  modalId?: string;\n  /**\n   * ms before removing the component from the tree\n   * @default 300\n   */\n  delay?: number;\n}\n\ninterface CloseModalData {\n  delay: number;\n  render: (args: ModalLauncherComponentRendererProps<any>) => void;\n  currentConfig: ModalLauncherComponentRendererProps<any>;\n}\n\nconst getRoot = (rootElId: string): HTMLElement => {\n  // Reuse the container if we find it\n  let rootDom = document.getElementById(rootElId);\n  if (rootDom !== null) {\n    return rootDom;\n  }\n\n  // Otherwise create it\n  rootDom = document.createElement('div');\n  rootDom.setAttribute('id', rootElId);\n  document.body.appendChild(rootDom);\n  return rootDom;\n};\n\nconst openModalsIds: Map<string, CloseModalData> = new Map();\nfunction closeAll() {\n  openModalsIds.forEach(async ({ render, currentConfig, delay }, rootElId) => {\n    const config = { ...currentConfig, isShown: false };\n    render(config);\n    await new Promise((resolveDelay) => setTimeout(resolveDelay, delay));\n    ReactDOM.unmountComponentAtNode(getRoot(rootElId));\n    openModalsIds.delete(rootElId);\n  });\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction open<T = any>(\n  componentRenderer: (\n    props: ModalLauncherComponentRendererProps<T>,\n  ) => JSX.Element,\n  options: ModalLauncherOpenOptions = {},\n): Promise<T> {\n  options = { delay: 300, ...options };\n\n  // Allow components to specify if they wish to reuse the modal container\n  const rootElId = `modals-root${options.modalId || Date.now()}`;\n  const rootDom = getRoot(rootElId);\n\n  return new Promise((resolve) => {\n    let currentConfig = { onClose, isShown: true };\n\n    function render({\n      onClose,\n      isShown,\n    }: ModalLauncherComponentRendererProps<T>) {\n      ReactDOM.render(componentRenderer({ onClose, isShown }), rootDom);\n    }\n\n    async function onClose(arg?: T) {\n      currentConfig = {\n        ...currentConfig,\n        isShown: false,\n      };\n      render(currentConfig);\n      await new Promise((resolveDelay) =>\n        setTimeout(resolveDelay, options.delay),\n      );\n      ReactDOM.unmountComponentAtNode(rootDom);\n      rootDom.remove();\n      openModalsIds.delete(rootElId);\n      resolve(arg);\n    }\n\n    render(currentConfig);\n    openModalsIds.set(rootElId, {\n      render,\n      currentConfig,\n      delay: options.delay,\n    });\n  });\n}\n\nexport const ModalLauncher = {\n  open,\n  closeAll,\n};\n"],"names":["Modal","ModalProps","ModalConfirm","ModalConfirmProps","ModalContent","ModalContentProps","ModalControls","ModalControlsProps","ModalHeader","ModalHeaderProps","ModalLauncher","OriginalModal","CompoundModal","Content","Header","Controls","React","ReactModal","Box","CommonProps","getModalStyles","ModalSizeType","ModalPositionType","ModalSizesMapper","medium","small","large","fullWidth","zen","isShown","onClose","Props","onAfterOpen","aria","shouldCloseOnOverlayClick","shouldCloseOnEscapePress","position","topOffset","title","size","allowHeightOverflow","modalHeaderProps","Partial","modalContentProps","initialFocusRef","RefObject","HTMLElement","children","ReactNode","RenderModal","modalProps","focusFirstWithinNode","node","querySelectorAll","elements","length","firstElement","focus","testId","otherProps","contentRef","useRef","HTMLDivElement","props","styles","className","useEffect","setTimeout","current","renderDefault","portal","base","root","afterOpen","beforeClose","content","top","modalOverlay","ref","width","modal","CloseIcon","Flex","PropsWithHTMLElement","Button","Subheading","getModalHeaderStyles","ModalHeaderInternalProps","Function","ReactElement","buttonContainer","tokens","padding","spacingM","spacingL","borderRadius","borderRadiusMedium","borderBottom","gray300","spacing2Xl","height","button","spacing2Xs","right","getModalContentStyles","ModalContentInternalProps","color","gray700","fontSize","fontSizeM","fontFamily","fontStackPrimary","lineHeight","lineHeightM","overflowY","overflowX","boxSizing","transition","transitionDurationLong","transitionEasingDefault","transitionDurationDefault","transitionEasingCubicBezier","opacity","margin","transform","backgroundColor","colorWhite","boxShadow","boxShadowHeavy","maxHeight","fontBaseDefault","maxWidth","overflow","display","flexDirection","zIndex","zIndexModalContent","textAlign","outline","alignItems","flexWrap","bottom","left","zIndexModal","ButtonGroup","ModalControlsInternalProps","onConfirm","onCancel","confirmLabel","cancelLabel","intent","isConfirmDisabled","isConfirmLoading","modalControlsProps","confirmTestId","cancelTestId","cancelRef","confirmButton","cancelButton","ReactDOM","ModalLauncherComponentRendererProps","result","T","ModalLauncherOpenOptions","modalId","delay","CloseModalData","render","args","currentConfig","getRoot","rootElId","rootDom","document","getElementById","createElement","setAttribute","body","appendChild","openModalsIds","Map","closeAll","forEach","config","Promise","resolveDelay","unmountComponentAtNode","delete","open","componentRenderer","JSX","Element","options","Date","now","resolve","arg","remove","set"],"version":3,"file":"module.js.map"}

package/dist/types.d.ts

@@ -33,30 +33,36 @@ export interface ModalProps extends CommonProps {
     aria?: ReactModal.Props['aria'];
     /**
      * Boolean indicating if clicking the overlay should close the overlay.
+     * @default true
      */
     shouldCloseOnOverlayClick?: boolean;
     /**
      * Boolean indicating if pressing the esc key should close the overlay.
+     * @default true
      */
     shouldCloseOnEscapePress?: boolean;
     /**
      * Indicating if modal is centered or linked to the top
+     * @default center
      */
     position?: ModalPositionType;
     /**
-        Top offset if position is 'top'
-      */
+     * Top offset if position is 'top'
+     * @default 50px
+     */
     topOffset?: number | string;
     /**
-        Modal title that is used in header
-      */
+     * Modal title that is used in header
+     */
     title?: string;
     /**
-        Size of the modal window
-      */
+     * Size of the modal window
+     * @default medium
+     */
     size?: ModalSizeType;
     /**
      * Are modals higher than viewport allowed
+     * @default false
      */
     allowHeightOverflow?: boolean;
     /**

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/components/modal/src/ModalHeader/ModalHeader.styles.ts","packages/components/modal/src/ModalHeader/ModalHeader.tsx","packages/components/modal/src/ModalContent/ModalContent.styles.ts","packages/components/modal/src/ModalContent/ModalContent.tsx","packages/components/modal/src/types.ts","packages/components/modal/src/Modal.styles.ts","packages/components/modal/src/Modal.tsx","packages/components/modal/src/ModalControls/ModalControls.tsx","packages/components/modal/src/CompoundModal.tsx","packages/components/modal/src/ModalConfirm/ModalConfirm.tsx","packages/components/modal/src/ModalLauncher/ModalLauncher.tsx","packages/components/modal/src/index.ts","packages/components/modal/index.ts"],"sourcesContent":["import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getModalHeaderStyles() {\n  return {\n    root: css({\n      position: 'relative',\n      padding: `${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingL}`,\n      borderRadius: `${tokens.borderRadiusMedium} ${tokens.borderRadiusMedium} 0 0`,\n      borderBottom: `1px solid ${tokens.gray300}`,\n    }),\n    buttonContainer: css({\n      position: 'relative',\n      width: tokens.spacing2Xl,\n      height: tokens.spacingL,\n      button: {\n        position: 'absolute',\n        top: `calc(-1 * ${tokens.spacing2Xs})`,\n        right: 0,\n      },\n    }),\n  };\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { CloseIcon } from '@contentful/f36-icons';\nimport { Flex } from '@contentful/f36-core';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Button } from '@contentful/f36-button';\nimport { Subheading } from '@contentful/f36-typography';\n\nimport { getModalHeaderStyles } from './ModalHeader.styles';\n\ninterface ModalHeaderInternalProps extends CommonProps {\n  title: string;\n  onClose?: Function;\n}\n\nexport type ModalHeaderProps = PropsWithHTMLElement<\n  ModalHeaderInternalProps,\n  'div'\n>;\n\nexport function ModalHeader({\n  onClose,\n  title,\n  testId = 'cf-ui-modal-header',\n  className,\n  ...otherProps\n}: ModalHeaderProps): React.ReactElement {\n  const styles = getModalHeaderStyles();\n\n  return (\n    <Flex\n      {...otherProps}\n      className={cx(styles.root, className)}\n      testId={testId}\n      alignItems=\"center\"\n      justifyContent=\"space-between\"\n    >\n      <Subheading as=\"h1\" isTruncated marginBottom=\"none\">\n        {title}\n      </Subheading>\n      {onClose && (\n        <Flex alignItems=\"center\" className={styles.buttonContainer}>\n          <Button\n            variant=\"transparent\"\n            aria-label=\"Close\"\n            startIcon={<CloseIcon size=\"small\" />}\n            onClick={() => {\n              onClose();\n            }}\n            size=\"small\"\n          />\n        </Flex>\n      )}\n    </Flex>\n  );\n}\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport function getModalContentStyles() {\n  return {\n    root: css({\n      padding: `${tokens.spacingM} ${tokens.spacingL}`,\n      color: tokens.gray700,\n      fontSize: tokens.fontSizeM,\n      fontFamily: tokens.fontStackPrimary,\n      lineHeight: tokens.lineHeightM,\n      overflowY: 'auto',\n      overflowX: 'auto',\n      boxSizing: 'border-box',\n    }),\n  };\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Box } from '@contentful/f36-core';\nimport { getModalContentStyles } from './ModalContent.styles';\n\ninterface ModalContentInternalProps extends CommonProps {\n  children: React.ReactNode;\n}\n\nexport type ModalContentProps = PropsWithHTMLElement<\n  ModalContentInternalProps,\n  'div'\n>;\n\nexport function ModalContent({\n  testId = 'cf-ui-modal-content',\n  className,\n  children,\n  ...otherProps\n}: ModalContentProps) {\n  const styles = getModalContentStyles();\n  return (\n    <Box\n      {...otherProps}\n      as=\"div\"\n      className={cx(styles.root, className)}\n      testId={testId}\n    >\n      {children}\n    </Box>\n  );\n}\n","export type ModalSizeType =\n  | 'small'\n  | 'medium'\n  | 'large'\n  | 'fullWidth'\n  | 'zen'\n  | string\n  | number;\n\nexport type ModalPositionType = 'center' | 'top';\n","import tokens from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport type { ModalPositionType, ModalSizeType } from './types';\n\nexport function getModalStyles(props: {\n  size: ModalSizeType;\n  position: ModalPositionType;\n  allowHeightOverflow?: boolean;\n  className?: string;\n}) {\n  const modal = cx(\n    css({\n      transition: `opacity ${tokens.transitionDurationLong} ${tokens.transitionEasingDefault}, transform ${tokens.transitionDurationDefault} ${tokens.transitionEasingCubicBezier}`,\n      opacity: '0.5',\n      margin: tokens.spacing2Xl,\n      transform: 'scale(0.85)',\n      backgroundColor: tokens.colorWhite,\n      borderRadius: tokens.borderRadiusMedium,\n      boxShadow: tokens.boxShadowHeavy,\n      maxHeight: `calc(100vh - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n      maxWidth: `calc(100vw - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n      overflow: 'hidden',\n      display: 'flex',\n      flexDirection: 'column',\n    }),\n    props.allowHeightOverflow\n      ? css({\n          overflow: 'auto',\n          maxHeight: 'none',\n        })\n      : null,\n    props.size === 'zen'\n      ? css({\n          maxWidth: 'none',\n          maxHeight: 'none',\n          margin: 0,\n          height: '100%',\n          width: '100%',\n        })\n      : null,\n    props.className,\n  );\n\n  return {\n    portal: css({\n      display: 'block',\n    }),\n    base: {\n      root: cx(\n        css({\n          zIndex: tokens.zIndexModalContent,\n          position: 'relative',\n          padding: 0,\n          display: 'inline-block',\n          margin: '0 auto',\n          textAlign: 'left',\n          outline: 'none',\n        }),\n        props.size === 'zen'\n          ? css({\n              width: '100%',\n              height: '100%',\n            })\n          : null,\n      ),\n      afterOpen: css({\n        '[data-modal-root]': {\n          transform: 'scale(1)',\n          opacity: '1',\n        },\n      }),\n      beforeClose: css({\n        '[data-modal-root]': {\n          opacity: '0.5',\n          transform: 'scale(0.85)',\n        },\n      }),\n    },\n    modalOverlay: {\n      root: cx(\n        css({\n          display: 'flex',\n          alignItems: 'baseline',\n          flexWrap: 'wrap',\n          top: 0,\n          right: 0,\n          bottom: 0,\n          left: 0,\n          zIndex: tokens.zIndexModal,\n          opacity: 0,\n          transition: `opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n          position: 'fixed',\n          overflowY: 'auto',\n          backgroundColor: 'rgba(12, 20, 28, 0.74902)',\n          textAlign: 'center',\n        }),\n        props.position === 'center'\n          ? css({\n              alignItems: 'center',\n              justifyContent: 'center',\n            })\n          : null,\n      ),\n      afterOpen: css({\n        opacity: '1 !important',\n      }),\n      beforeClose: css({\n        opacity: 0,\n      }),\n    },\n    modal,\n  };\n}\n","import * as React from 'react';\nimport ReactModal from 'react-modal';\n\nimport { Box } from '@contentful/f36-core';\nimport type { CommonProps } from '@contentful/f36-core';\n\nimport { ModalHeader, ModalHeaderProps } from './ModalHeader/ModalHeader';\nimport { ModalContent, ModalContentProps } from './ModalContent/ModalContent';\nimport { getModalStyles } from './Modal.styles';\nimport type { ModalSizeType, ModalPositionType } from './types';\n\nconst ModalSizesMapper = {\n  medium: '520px',\n  small: '400px',\n  large: '700px',\n  fullWidth: '100vw',\n  zen: '100vw',\n};\n\nexport interface ModalProps extends CommonProps {\n  /**\n   * When true, the dialog is shown.\n   */\n  isShown: boolean;\n\n  /**\n   * Function that will be run when the modal is requested to be closed, prior to actually closing.\n   */\n  onClose: ReactModal.Props['onRequestClose'];\n\n  /**\n   * Function that will be run after the modal has opened.\n   */\n  onAfterOpen?: ReactModal.Props['onAfterOpen'];\n\n  /**\n   * Additional aria attributes\n   */\n  aria?: ReactModal.Props['aria'];\n\n  /**\n   * Boolean indicating if clicking the overlay should close the overlay.\n   */\n  shouldCloseOnOverlayClick?: boolean;\n  /**\n   * Boolean indicating if pressing the esc key should close the overlay.\n   */\n  shouldCloseOnEscapePress?: boolean;\n  /**\n   * Indicating if modal is centered or linked to the top\n   */\n  position?: ModalPositionType;\n  /**\n      Top offset if position is 'top'\n    */\n  topOffset?: number | string;\n  /**\n      Modal title that is used in header\n    */\n  title?: string;\n  /**\n      Size of the modal window\n    */\n  size?: ModalSizeType;\n  /**\n   * Are modals higher than viewport allowed\n   */\n  allowHeightOverflow?: boolean;\n\n  /**\n   * Optional props to override ModalHeader behaviour\n   */\n  modalHeaderProps?: Partial<ModalHeaderProps>;\n\n  /**\n   * Optional props to override ModalContent behaviour\n   */\n  modalContentProps?: Partial<ModalContentProps>;\n\n  /**\n   * Optional property to set initial focus\n   */\n  initialFocusRef?: React.RefObject<HTMLElement>;\n\n  children: React.ReactNode | RenderModal;\n}\n\ntype RenderModal = (modalProps: ModalProps) => React.ReactNode;\n\nfunction focusFirstWithinNode(node: HTMLElement) {\n  if (node && node.querySelectorAll) {\n    const elements = node.querySelectorAll('input, button');\n    if (elements.length > 0) {\n      const firstElement = elements[0];\n      // @ts-expect-error focus might be missing\n      if (typeof firstElement.focus === 'function') {\n        // @ts-expect-error focus might be missing\n        firstElement.focus();\n      }\n    }\n  }\n}\n\nexport function Modal({\n  allowHeightOverflow,\n  position,\n  shouldCloseOnEscapePress,\n  shouldCloseOnOverlayClick,\n  size,\n  testId,\n  topOffset,\n  aria,\n  ...otherProps\n}: ModalProps) {\n  const contentRef = React.useRef<HTMLDivElement>(null);\n\n  const props = {\n    ...otherProps,\n    allowHeightOverflow,\n    position,\n    shouldCloseOnEscapePress,\n    shouldCloseOnOverlayClick,\n    size,\n    testId,\n    topOffset,\n  };\n\n  const styles = getModalStyles({\n    position,\n    size,\n    allowHeightOverflow,\n    className: otherProps.className,\n  });\n\n  React.useEffect(() => {\n    if (props.isShown) {\n      setTimeout(() => {\n        if (props.initialFocusRef && props.initialFocusRef.current) {\n          if (props.initialFocusRef.current.focus) {\n            props.initialFocusRef.current.focus();\n          }\n        } else if (contentRef.current) {\n          focusFirstWithinNode(contentRef.current);\n        }\n      }, 100);\n    }\n  }, [props.isShown, props.initialFocusRef]);\n\n  const renderDefault = () => {\n    return (\n      <React.Fragment>\n        {otherProps.title && (\n          <ModalHeader\n            title={otherProps.title}\n            onClose={props.onClose}\n            {...otherProps.modalHeaderProps}\n          />\n        )}\n        <ModalContent {...otherProps.modalContentProps}>\n          {otherProps.children}\n        </ModalContent>\n      </React.Fragment>\n    );\n  };\n\n  return (\n    <ReactModal\n      ariaHideApp={false}\n      aria={aria}\n      onRequestClose={props.onClose}\n      isOpen={otherProps.isShown}\n      onAfterOpen={props.onAfterOpen}\n      shouldCloseOnEsc={shouldCloseOnEscapePress}\n      shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n      shouldFocusAfterRender\n      shouldReturnFocusAfterClose\n      portalClassName={styles.portal}\n      className={{\n        base: styles.base.root,\n        afterOpen: styles.base.afterOpen,\n        beforeClose: styles.base.beforeClose,\n      }}\n      style={{\n        content: {\n          top: position === 'center' ? 0 : topOffset,\n        },\n      }}\n      overlayClassName={{\n        base: styles.modalOverlay.root,\n        afterOpen: styles.modalOverlay.afterOpen,\n        beforeClose: styles.modalOverlay.beforeClose,\n      }}\n      closeTimeoutMS={300}\n      contentRef={(ref) => {\n        contentRef.current = ref;\n      }}\n    >\n      <Box\n        testId={testId}\n        style={{\n          width: ModalSizesMapper[size] || size,\n        }}\n        className={styles.modal}\n        data-modal-root\n      >\n        {typeof otherProps.children === 'function'\n          ? otherProps.children(props)\n          : renderDefault()}\n      </Box>\n    </ReactModal>\n  );\n}\n\n// Use defaultProps instead of default values in the function to allow the\n// Storybook to import and use these values\nModal.defaultProps = {\n  allowHeightOverflow: false,\n  position: 'center',\n  shouldCloseOnEscapePress: true,\n  shouldCloseOnOverlayClick: true,\n  size: 'medium',\n  testId: 'cf-ui-modal',\n  topOffset: '50px',\n};\n","import React from 'react';\n\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Flex } from '@contentful/f36-core';\nimport { ButtonGroup } from '@contentful/f36-button';\n\ninterface ModalControlsInternalProps extends CommonProps {\n  children: React.ReactElement[] | React.ReactElement;\n}\n\nexport type ModalControlsProps = PropsWithHTMLElement<\n  ModalControlsInternalProps,\n  'div'\n>;\n\nexport function ModalControls({\n  testId = 'cf-ui-modal-controls',\n  className,\n  children,\n  ...otherProps\n}: ModalControlsProps): React.ReactElement {\n  return (\n    <Flex\n      {...otherProps}\n      className={className}\n      testId={testId}\n      flexDirection=\"row\"\n      justifyContent=\"flex-end\"\n      margin=\"spacingL\"\n      marginTop=\"none\"\n    >\n      <ButtonGroup variant=\"spaced\" spacing=\"spacingS\">\n        {children}\n      </ButtonGroup>\n    </Flex>\n  );\n}\n","import { Modal as OriginalModal } from './Modal';\nimport { ModalContent } from './ModalContent/ModalContent';\nimport { ModalHeader } from './ModalHeader/ModalHeader';\nimport { ModalControls } from './ModalControls/ModalControls';\n\ntype CompoundModal = typeof OriginalModal & {\n  Content: typeof ModalContent;\n  Header: typeof ModalHeader;\n  Controls: typeof ModalControls;\n};\n\nexport const Modal = OriginalModal as CompoundModal;\nModal.Content = ModalContent;\nModal.Header = ModalHeader;\nModal.Controls = ModalControls;\n","import React from 'react';\n\nimport { Modal } from '../CompoundModal';\nimport { ModalProps } from '../Modal';\nimport type { ModalSizeType } from '../types';\nimport type { ModalHeaderProps } from '../ModalHeader/ModalHeader';\nimport type { ModalContentProps } from '../ModalContent/ModalContent';\nimport type { ModalControlsProps } from '../ModalControls/ModalControls';\nimport { Button } from '@contentful/f36-button';\n\nexport interface ModalConfirmProps {\n  /**\n   * When true, the dialog is shown.\n   */\n  isShown: boolean;\n  /**\n   * Function that will be called when the confirm button is clicked. This does not close the ModalConfirm.\n   */\n  onConfirm(): void;\n  /**\n   * Function that will be called when the cancel button is clicked. This does not close the ModalConfirm.\n   */\n  onCancel: ModalProps['onClose'];\n  /**\n      Modal title that is used in header\n    */\n  title?: string;\n  /**\n   * Label of the confirm button\n   */\n  confirmLabel?: string | false;\n  /**\n   * Label of the cancel button\n   */\n  cancelLabel?: string | false;\n  /**\n   * The intent of the ModalConfirm. Used for the Button.\n   */\n  intent?: 'primary' | 'positive' | 'negative';\n  /**\n      Size of the modal window\n    */\n  size?: ModalSizeType;\n  /**\n   * Boolean indicating if clicking the overlay should close the overlay.\n   */\n  shouldCloseOnOverlayClick?: boolean;\n  /**\n   * Boolean indicating if pressing the esc key should close the overlay.\n   */\n  shouldCloseOnEscapePress?: boolean;\n  /**\n   * When true, the confirm button is set to disabled.\n   */\n  isConfirmDisabled?: boolean;\n  /**\n   * When true, the confirm button is set to loading.\n   */\n  isConfirmLoading?: boolean;\n  /**\n   * Are modals higher than viewport allowed\n   */\n  allowHeightOverflow?: boolean;\n\n  /**\n   * Optional props to override ModalHeader behaviour\n   */\n  modalHeaderProps?: Partial<ModalHeaderProps>;\n\n  /**\n   * Optional props to override ModalContent behaviour\n   */\n  modalContentProps?: Partial<ModalContentProps>;\n\n  /**\n   * Optional props to override ModalControl behaviour\n   */\n  modalControlsProps?: Partial<ModalControlsProps>;\n\n  /**\n   * Optional property to set initial focus\n   */\n  initialFocusRef?: React.RefObject<HTMLElement>;\n\n  testId?: string;\n  confirmTestId?: string;\n  cancelTestId?: string;\n  children: React.ReactNode;\n}\n\nexport function ModalConfirm({\n  allowHeightOverflow = false,\n  cancelLabel = 'Cancel',\n  cancelTestId = 'cf-ui-modal-confirm-cancel-button',\n  children,\n  confirmLabel = 'Confirm',\n  confirmTestId = 'cf-ui-modal-confirm-confirm-button',\n  intent = 'positive',\n  isConfirmDisabled = false,\n  isConfirmLoading = false,\n  isShown,\n  modalContentProps,\n  modalControlsProps,\n  modalHeaderProps,\n  onCancel,\n  onConfirm,\n  shouldCloseOnEscapePress = true,\n  shouldCloseOnOverlayClick = true,\n  size = 'medium',\n  testId = 'cf-ui-modal-confirm',\n  title = 'Are you sure?',\n  initialFocusRef,\n}: ModalConfirmProps) {\n  const cancelRef = React.useRef(null);\n\n  const confirmButton = confirmLabel ? (\n    <Button\n      testId={confirmTestId}\n      isDisabled={isConfirmDisabled}\n      isLoading={isConfirmLoading}\n      variant={intent}\n      size=\"small\"\n      onClick={() => onConfirm()}\n    >\n      {confirmLabel}\n    </Button>\n  ) : null;\n\n  const cancelButton = cancelLabel ? (\n    <Button\n      testId={cancelTestId}\n      variant=\"secondary\"\n      onClick={onCancel}\n      size=\"small\"\n      ref={initialFocusRef || cancelRef}\n    >\n      {cancelLabel}\n    </Button>\n  ) : null;\n\n  return (\n    <Modal\n      testId={testId}\n      isShown={isShown}\n      onClose={onCancel}\n      size={size}\n      shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n      shouldCloseOnEscapePress={shouldCloseOnEscapePress}\n      allowHeightOverflow={allowHeightOverflow}\n      initialFocusRef={cancelRef}\n    >\n      {() => {\n        return (\n          <React.Fragment>\n            <Modal.Header title={title || ''} {...modalHeaderProps} />\n            <Modal.Content {...modalContentProps}>{children}</Modal.Content>\n            <Modal.Controls {...modalControlsProps}>\n              {cancelButton}\n              {confirmButton}\n            </Modal.Controls>\n          </React.Fragment>\n        );\n      }}\n    </Modal>\n  );\n}\n","/* global Promise */\nimport ReactDOM from 'react-dom';\n\n// @todo: change any to unknown\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ninterface ModalLauncherComponentRendererProps<T = any> {\n  isShown: boolean;\n  onClose: (result?: T) => void;\n}\n\ninterface ModalLauncherOpenOptions {\n  /**\n   * Unique id to be used as identifier for the modal contianer\n   */\n  modalId?: string;\n  /**\n   * ms before removing the component from the tree\n   * @default 300\n   */\n  delay?: number;\n}\n\ninterface CloseModalData {\n  delay: number;\n  render: (args: ModalLauncherComponentRendererProps<any>) => void;\n  currentConfig: ModalLauncherComponentRendererProps<any>;\n}\n\nconst getRoot = (rootElId: string): HTMLElement => {\n  // Reuse the container if we find it\n  let rootDom = document.getElementById(rootElId);\n  if (rootDom !== null) {\n    return rootDom;\n  }\n\n  // Otherwise create it\n  rootDom = document.createElement('div');\n  rootDom.setAttribute('id', rootElId);\n  document.body.appendChild(rootDom);\n  return rootDom;\n};\n\nconst openModalsIds: Map<string, CloseModalData> = new Map();\nfunction closeAll() {\n  openModalsIds.forEach(async ({ render, currentConfig, delay }, rootElId) => {\n    const config = { ...currentConfig, isShown: false };\n    render(config);\n    await new Promise((resolveDelay) => setTimeout(resolveDelay, delay));\n    ReactDOM.unmountComponentAtNode(getRoot(rootElId));\n    openModalsIds.delete(rootElId);\n  });\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction open<T = any>(\n  componentRenderer: (\n    props: ModalLauncherComponentRendererProps<T>,\n  ) => JSX.Element,\n  options: ModalLauncherOpenOptions = {},\n): Promise<T> {\n  options = { delay: 300, ...options };\n\n  // Allow components to specify if they wish to reuse the modal container\n  const rootElId = `modals-root${options.modalId || Date.now()}`;\n  const rootDom = getRoot(rootElId);\n\n  return new Promise((resolve) => {\n    let currentConfig = { onClose, isShown: true };\n\n    function render({\n      onClose,\n      isShown,\n    }: ModalLauncherComponentRendererProps<T>) {\n      ReactDOM.render(componentRenderer({ onClose, isShown }), rootDom);\n    }\n\n    async function onClose(arg?: T) {\n      currentConfig = {\n        ...currentConfig,\n        isShown: false,\n      };\n      render(currentConfig);\n      await new Promise((resolveDelay) =>\n        setTimeout(resolveDelay, options.delay),\n      );\n      ReactDOM.unmountComponentAtNode(rootDom);\n      rootDom.remove();\n      openModalsIds.delete(rootElId);\n      resolve(arg);\n    }\n\n    render(currentConfig);\n    openModalsIds.set(rootElId, {\n      render,\n      currentConfig,\n      delay: options.delay,\n    });\n  });\n}\n\nexport const ModalLauncher = {\n  open,\n  closeAll,\n};\n","export { Modal } from './CompoundModal';\nexport type { ModalProps } from './Modal';\nexport { ModalConfirm } from './ModalConfirm/ModalConfirm';\nexport type { ModalConfirmProps } from './ModalConfirm/ModalConfirm';\nexport { ModalContent } from './ModalContent/ModalContent';\nexport type { ModalContentProps } from './ModalContent/ModalContent';\nexport { ModalControls } from './ModalControls/ModalControls';\nexport type { ModalControlsProps } from './ModalControls/ModalControls';\nexport { ModalHeader } from './ModalHeader/ModalHeader';\nexport type { ModalHeaderProps } from './ModalHeader/ModalHeader';\nexport { ModalLauncher } from './ModalLauncher/ModalLauncher';\n","export * from './src/index';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
+{"mappings":";;;ACUA,kCAAmC,SAAQ,WAAW;IACpD,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,QAAQ,CAAC;CACpB;AAED,+BAA+B,qBAC7B,wBAAwB,EACxB,KAAK,CACN,CAAC;AAEF,4BAA4B,EAC1B,OAAO,EACP,KAAK,EACL,MAA6B,EAC7B,SAAS,EACT,GAAG,UAAU,EACd,EAAE,gBAAgB,GAAG,MAAM,YAAY,CA6BvC;AEjDD,mCAAoC,SAAQ,WAAW;IACrD,QAAQ,EAAE,MAAM,SAAS,CAAC;CAC3B;AAED,gCAAgC,qBAC9B,yBAAyB,EACzB,KAAK,CACN,CAAC;AAEF,6BAA6B,EAC3B,MAA8B,EAC9B,SAAS,EACT,QAAQ,EACR,GAAG,UAAU,EACd,EAAE,iBAAiB,eAYnB;AChCD,qBACI,OAAO,GACP,QAAQ,GACR,OAAO,GACP,WAAW,GACX,KAAK,GACL,MAAM,GACN,MAAM,CAAC;AAEX,yBAAgC,QAAQ,GAAG,KAAK,CAAC;AEUjD,2BAA4B,SAAQ,WAAW;IAC7C;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;IAEjB;;OAEG;IACH,OAAO,EAAE,WAAW,KAAK,CAAC,gBAAgB,CAAC,CAAC;IAE5C;;OAEG;IACH,WAAW,CAAC,EAAE,WAAW,KAAK,CAAC,aAAa,CAAC,CAAC;IAE9C;;OAEG;IACH,IAAI,CAAC,EAAE,WAAW,KAAK,CAAC,MAAM,CAAC,CAAC;IAEhC;;;OAGG;IACH,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC;;;OAGG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC;;;OAGG;IACH,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAC;IAE7C;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;IAE/C;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,SAAS,CAAC,WAAW,CAAC,CAAC;IAE/C,QAAQ,EAAE,MAAM,SAAS,GAAG,WAAW,CAAC;CACzC;AAED,mBAAmB,CAAC,UAAU,EAAE,UAAU,KAAK,MAAM,SAAS,CAAC;AAgB/D,yBAAsB,EACpB,mBAA2B,EAC3B,QAAmB,EACnB,wBAA+B,EAC/B,yBAAgC,EAChC,IAAe,EACf,MAAsB,EACtB,SAAkB,EAClB,IAAI,EACJ,GAAG,UAAU,EACd,EAAE,UAAU,eAkGZ;ACnND,oCAAqC,SAAQ,WAAW;IACtD,QAAQ,EAAE,MAAM,YAAY,EAAE,GAAG,MAAM,YAAY,CAAC;CACrD;AAED,iCAAiC,qBAC/B,0BAA0B,EAC1B,KAAK,CACN,CAAC;AAEF,8BAA8B,EAC5B,MAA+B,EAC/B,SAAS,EACT,QAAQ,EACR,GAAG,UAAU,EACd,EAAE,kBAAkB,GAAG,MAAM,YAAY,CAgBzC;AC/BD,qBAAqB,cAAoB,GAAG;IAC1C,OAAO,EAAE,mBAAmB,CAAC;IAC7B,MAAM,EAAE,kBAAkB,CAAC;IAC3B,QAAQ,EAAE,oBAAoB,CAAC;CAChC,CAAC;AAEF,OAAO,MAAM,oBAAsC,CAAC;ACDpD;IACE;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,SAAS,IAAI,IAAI,CAAC;IAClB;;OAEG;IACH,QAAQ,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC;IAChC;;QAEI;IACJ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IAC9B;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IAC7B;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,UAAU,CAAC;IAC7C;;QAEI;IACJ,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB;;OAEG;IACH,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC;;OAEG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAC;IAE7C;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;IAE/C;;OAEG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,CAAC;IAEjD;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,SAAS,CAAC,WAAW,CAAC,CAAC;IAE/C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,EAAE,MAAM,SAAS,CAAC;CAC3B;AAED,6BAA6B,EAC3B,mBAA2B,EAC3B,WAAsB,EACtB,YAAkD,EAClD,QAAQ,EACR,YAAwB,EACxB,aAAoD,EACpD,MAAmB,EACnB,iBAAyB,EACzB,gBAAwB,EACxB,OAAO,EACP,iBAAiB,EACjB,kBAAkB,EAClB,gBAAgB,EAChB,QAAQ,EACR,SAAS,EACT,wBAA+B,EAC/B,yBAAgC,EAChC,IAAe,EACf,MAA8B,EAC9B,KAAuB,EACvB,eAAe,GAChB,EAAE,iBAAiB,eAqDnB;AChKD,8CAA8C,CAAC,GAAG,GAAG;IACnD,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,KAAK,IAAI,CAAC;CAC/B;AAED;IACE;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAuBD,kCAQC;AAGD,sBAAc,CAAC,GAAG,GAAG,EACnB,iBAAiB,EAAE,CACjB,KAAK,EAAE,oCAAoC,CAAC,CAAC,KAC1C,IAAI,OAAO,EAChB,OAAO,GAAE,wBAA6B,GACrC,OAAO,CAAC,CAAC,CAAC,CAuCZ;AAED,OAAO,MAAM;;;CAGZ,CAAC","sources":["packages/components/modal/src/ModalHeader/ModalHeader.styles.ts","packages/components/modal/src/ModalHeader/ModalHeader.tsx","packages/components/modal/src/ModalContent/ModalContent.styles.ts","packages/components/modal/src/ModalContent/ModalContent.tsx","packages/components/modal/src/types.ts","packages/components/modal/src/Modal.styles.ts","packages/components/modal/src/Modal.tsx","packages/components/modal/src/ModalControls/ModalControls.tsx","packages/components/modal/src/CompoundModal.tsx","packages/components/modal/src/ModalConfirm/ModalConfirm.tsx","packages/components/modal/src/ModalLauncher/ModalLauncher.tsx","packages/components/modal/src/index.ts","packages/components/modal/index.ts"],"sourcesContent":["import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getModalHeaderStyles() {\n  return {\n    root: css({\n      position: 'relative',\n      padding: `${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingL}`,\n      borderRadius: `${tokens.borderRadiusMedium} ${tokens.borderRadiusMedium} 0 0`,\n      borderBottom: `1px solid ${tokens.gray300}`,\n    }),\n    buttonContainer: css({\n      position: 'relative',\n      width: tokens.spacing2Xl,\n      height: tokens.spacingL,\n      button: {\n        position: 'absolute',\n        top: `calc(-1 * ${tokens.spacing2Xs})`,\n        right: 0,\n      },\n    }),\n  };\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { CloseIcon } from '@contentful/f36-icons';\nimport { Flex } from '@contentful/f36-core';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Button } from '@contentful/f36-button';\nimport { Subheading } from '@contentful/f36-typography';\n\nimport { getModalHeaderStyles } from './ModalHeader.styles';\n\ninterface ModalHeaderInternalProps extends CommonProps {\n  title: string;\n  onClose?: Function;\n}\n\nexport type ModalHeaderProps = PropsWithHTMLElement<\n  ModalHeaderInternalProps,\n  'div'\n>;\n\nexport function ModalHeader({\n  onClose,\n  title,\n  testId = 'cf-ui-modal-header',\n  className,\n  ...otherProps\n}: ModalHeaderProps): React.ReactElement {\n  const styles = getModalHeaderStyles();\n\n  return (\n    <Flex\n      {...otherProps}\n      className={cx(styles.root, className)}\n      testId={testId}\n      alignItems=\"center\"\n      justifyContent=\"space-between\"\n    >\n      <Subheading as=\"h1\" isTruncated marginBottom=\"none\">\n        {title}\n      </Subheading>\n      {onClose && (\n        <Flex alignItems=\"center\" className={styles.buttonContainer}>\n          <Button\n            variant=\"transparent\"\n            aria-label=\"Close\"\n            startIcon={<CloseIcon size=\"small\" />}\n            onClick={() => {\n              onClose();\n            }}\n            size=\"small\"\n          />\n        </Flex>\n      )}\n    </Flex>\n  );\n}\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport function getModalContentStyles() {\n  return {\n    root: css({\n      padding: `${tokens.spacingM} ${tokens.spacingL}`,\n      color: tokens.gray700,\n      fontSize: tokens.fontSizeM,\n      fontFamily: tokens.fontStackPrimary,\n      lineHeight: tokens.lineHeightM,\n      overflowY: 'auto',\n      overflowX: 'auto',\n      boxSizing: 'border-box',\n    }),\n  };\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Box } from '@contentful/f36-core';\nimport { getModalContentStyles } from './ModalContent.styles';\n\ninterface ModalContentInternalProps extends CommonProps {\n  children: React.ReactNode;\n}\n\nexport type ModalContentProps = PropsWithHTMLElement<\n  ModalContentInternalProps,\n  'div'\n>;\n\nexport function ModalContent({\n  testId = 'cf-ui-modal-content',\n  className,\n  children,\n  ...otherProps\n}: ModalContentProps) {\n  const styles = getModalContentStyles();\n  return (\n    <Box\n      {...otherProps}\n      as=\"div\"\n      className={cx(styles.root, className)}\n      testId={testId}\n    >\n      {children}\n    </Box>\n  );\n}\n","export type ModalSizeType =\n  | 'small'\n  | 'medium'\n  | 'large'\n  | 'fullWidth'\n  | 'zen'\n  | string\n  | number;\n\nexport type ModalPositionType = 'center' | 'top';\n","import tokens from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport type { ModalPositionType, ModalSizeType } from './types';\n\nexport function getModalStyles(props: {\n  size: ModalSizeType;\n  position: ModalPositionType;\n  allowHeightOverflow?: boolean;\n  className?: string;\n}) {\n  const modal = cx(\n    css({\n      transition: `opacity ${tokens.transitionDurationLong} ${tokens.transitionEasingDefault}, transform ${tokens.transitionDurationDefault} ${tokens.transitionEasingCubicBezier}`,\n      opacity: '0.5',\n      margin: tokens.spacing2Xl,\n      transform: 'scale(0.85)',\n      backgroundColor: tokens.colorWhite,\n      borderRadius: tokens.borderRadiusMedium,\n      boxShadow: tokens.boxShadowHeavy,\n      maxHeight: `calc(100vh - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n      maxWidth: `calc(100vw - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n      overflow: 'hidden',\n      display: 'flex',\n      flexDirection: 'column',\n    }),\n    props.allowHeightOverflow\n      ? css({\n          overflow: 'auto',\n          maxHeight: 'none',\n        })\n      : null,\n    props.size === 'zen'\n      ? css({\n          maxWidth: 'none',\n          maxHeight: 'none',\n          margin: 0,\n          height: '100%',\n          width: '100%',\n        })\n      : null,\n    props.className,\n  );\n\n  return {\n    portal: css({\n      display: 'block',\n    }),\n    base: {\n      root: cx(\n        css({\n          zIndex: tokens.zIndexModalContent,\n          position: 'relative',\n          padding: 0,\n          display: 'inline-block',\n          margin: '0 auto',\n          textAlign: 'left',\n          outline: 'none',\n        }),\n        props.size === 'zen'\n          ? css({\n              width: '100%',\n              height: '100%',\n            })\n          : null,\n      ),\n      afterOpen: css({\n        '[data-modal-root]': {\n          transform: 'scale(1)',\n          opacity: '1',\n        },\n      }),\n      beforeClose: css({\n        '[data-modal-root]': {\n          opacity: '0.5',\n          transform: 'scale(0.85)',\n        },\n      }),\n    },\n    modalOverlay: {\n      root: cx(\n        css({\n          display: 'flex',\n          alignItems: 'baseline',\n          flexWrap: 'wrap',\n          top: 0,\n          right: 0,\n          bottom: 0,\n          left: 0,\n          zIndex: tokens.zIndexModal,\n          opacity: 0,\n          transition: `opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n          position: 'fixed',\n          overflowY: 'auto',\n          backgroundColor: 'rgba(12, 20, 28, 0.74902)',\n          textAlign: 'center',\n        }),\n        props.position === 'center'\n          ? css({\n              alignItems: 'center',\n              justifyContent: 'center',\n            })\n          : null,\n      ),\n      afterOpen: css({\n        opacity: '1 !important',\n      }),\n      beforeClose: css({\n        opacity: 0,\n      }),\n    },\n    modal,\n  };\n}\n","import * as React from 'react';\nimport ReactModal from 'react-modal';\n\nimport { Box } from '@contentful/f36-core';\nimport type { CommonProps } from '@contentful/f36-core';\n\nimport { ModalHeader, ModalHeaderProps } from './ModalHeader/ModalHeader';\nimport { ModalContent, ModalContentProps } from './ModalContent/ModalContent';\nimport { getModalStyles } from './Modal.styles';\nimport type { ModalSizeType, ModalPositionType } from './types';\n\nconst ModalSizesMapper = {\n  medium: '520px',\n  small: '400px',\n  large: '700px',\n  fullWidth: '100vw',\n  zen: '100vw',\n};\n\nexport interface ModalProps extends CommonProps {\n  /**\n   * When true, the dialog is shown.\n   */\n  isShown: boolean;\n\n  /**\n   * Function that will be run when the modal is requested to be closed, prior to actually closing.\n   */\n  onClose: ReactModal.Props['onRequestClose'];\n\n  /**\n   * Function that will be run after the modal has opened.\n   */\n  onAfterOpen?: ReactModal.Props['onAfterOpen'];\n\n  /**\n   * Additional aria attributes\n   */\n  aria?: ReactModal.Props['aria'];\n\n  /**\n   * Boolean indicating if clicking the overlay should close the overlay.\n   * @default true\n   */\n  shouldCloseOnOverlayClick?: boolean;\n  /**\n   * Boolean indicating if pressing the esc key should close the overlay.\n   * @default true\n   */\n  shouldCloseOnEscapePress?: boolean;\n  /**\n   * Indicating if modal is centered or linked to the top\n   * @default center\n   */\n  position?: ModalPositionType;\n  /**\n   * Top offset if position is 'top'\n   * @default 50px\n   */\n  topOffset?: number | string;\n  /**\n   * Modal title that is used in header\n   */\n  title?: string;\n  /**\n   * Size of the modal window\n   * @default medium\n   */\n  size?: ModalSizeType;\n  /**\n   * Are modals higher than viewport allowed\n   * @default false\n   */\n  allowHeightOverflow?: boolean;\n\n  /**\n   * Optional props to override ModalHeader behaviour\n   */\n  modalHeaderProps?: Partial<ModalHeaderProps>;\n\n  /**\n   * Optional props to override ModalContent behaviour\n   */\n  modalContentProps?: Partial<ModalContentProps>;\n\n  /**\n   * Optional property to set initial focus\n   */\n  initialFocusRef?: React.RefObject<HTMLElement>;\n\n  children: React.ReactNode | RenderModal;\n}\n\ntype RenderModal = (modalProps: ModalProps) => React.ReactNode;\n\nfunction focusFirstWithinNode(node: HTMLElement) {\n  if (node && node.querySelectorAll) {\n    const elements = node.querySelectorAll('input, button');\n    if (elements.length > 0) {\n      const firstElement = elements[0];\n      // @ts-expect-error focus might be missing\n      if (typeof firstElement.focus === 'function') {\n        // @ts-expect-error focus might be missing\n        firstElement.focus();\n      }\n    }\n  }\n}\n\nexport function Modal({\n  allowHeightOverflow = false,\n  position = 'center',\n  shouldCloseOnEscapePress = true,\n  shouldCloseOnOverlayClick = true,\n  size = 'medium',\n  testId = 'cf-ui-modal',\n  topOffset = '50px',\n  aria,\n  ...otherProps\n}: ModalProps) {\n  const contentRef = React.useRef<HTMLDivElement>(null);\n\n  const props = {\n    ...otherProps,\n    allowHeightOverflow,\n    position,\n    shouldCloseOnEscapePress,\n    shouldCloseOnOverlayClick,\n    size,\n    testId,\n    topOffset,\n  };\n\n  const styles = getModalStyles({\n    position,\n    size,\n    allowHeightOverflow,\n    className: otherProps.className,\n  });\n\n  React.useEffect(() => {\n    if (props.isShown) {\n      setTimeout(() => {\n        if (props.initialFocusRef && props.initialFocusRef.current) {\n          if (props.initialFocusRef.current.focus) {\n            props.initialFocusRef.current.focus();\n          }\n        } else if (contentRef.current) {\n          focusFirstWithinNode(contentRef.current);\n        }\n      }, 100);\n    }\n  }, [props.isShown, props.initialFocusRef]);\n\n  const renderDefault = () => {\n    return (\n      <React.Fragment>\n        {otherProps.title && (\n          <ModalHeader\n            title={otherProps.title}\n            onClose={props.onClose}\n            {...otherProps.modalHeaderProps}\n          />\n        )}\n        <ModalContent {...otherProps.modalContentProps}>\n          {otherProps.children}\n        </ModalContent>\n      </React.Fragment>\n    );\n  };\n\n  return (\n    <ReactModal\n      ariaHideApp={false}\n      aria={aria}\n      onRequestClose={props.onClose}\n      isOpen={otherProps.isShown}\n      onAfterOpen={props.onAfterOpen}\n      shouldCloseOnEsc={shouldCloseOnEscapePress}\n      shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n      shouldFocusAfterRender\n      shouldReturnFocusAfterClose\n      portalClassName={styles.portal}\n      className={{\n        base: styles.base.root,\n        afterOpen: styles.base.afterOpen,\n        beforeClose: styles.base.beforeClose,\n      }}\n      style={{\n        content: {\n          top: position === 'center' ? 0 : topOffset,\n        },\n      }}\n      overlayClassName={{\n        base: styles.modalOverlay.root,\n        afterOpen: styles.modalOverlay.afterOpen,\n        beforeClose: styles.modalOverlay.beforeClose,\n      }}\n      closeTimeoutMS={300}\n      contentRef={(ref) => {\n        contentRef.current = ref;\n      }}\n    >\n      <Box\n        testId={testId}\n        style={{\n          width: ModalSizesMapper[size] || size,\n        }}\n        className={styles.modal}\n        data-modal-root\n      >\n        {typeof otherProps.children === 'function'\n          ? otherProps.children(props)\n          : renderDefault()}\n      </Box>\n    </ReactModal>\n  );\n}\n","import React from 'react';\n\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Flex } from '@contentful/f36-core';\nimport { ButtonGroup } from '@contentful/f36-button';\n\ninterface ModalControlsInternalProps extends CommonProps {\n  children: React.ReactElement[] | React.ReactElement;\n}\n\nexport type ModalControlsProps = PropsWithHTMLElement<\n  ModalControlsInternalProps,\n  'div'\n>;\n\nexport function ModalControls({\n  testId = 'cf-ui-modal-controls',\n  className,\n  children,\n  ...otherProps\n}: ModalControlsProps): React.ReactElement {\n  return (\n    <Flex\n      {...otherProps}\n      className={className}\n      testId={testId}\n      flexDirection=\"row\"\n      justifyContent=\"flex-end\"\n      margin=\"spacingL\"\n      marginTop=\"none\"\n    >\n      <ButtonGroup variant=\"spaced\" spacing=\"spacingS\">\n        {children}\n      </ButtonGroup>\n    </Flex>\n  );\n}\n","import { Modal as OriginalModal } from './Modal';\nimport { ModalContent } from './ModalContent/ModalContent';\nimport { ModalHeader } from './ModalHeader/ModalHeader';\nimport { ModalControls } from './ModalControls/ModalControls';\n\ntype CompoundModal = typeof OriginalModal & {\n  Content: typeof ModalContent;\n  Header: typeof ModalHeader;\n  Controls: typeof ModalControls;\n};\n\nexport const Modal = OriginalModal as CompoundModal;\nModal.Content = ModalContent;\nModal.Header = ModalHeader;\nModal.Controls = ModalControls;\n","import React from 'react';\n\nimport { Modal } from '../CompoundModal';\nimport { ModalProps } from '../Modal';\nimport type { ModalSizeType } from '../types';\nimport type { ModalHeaderProps } from '../ModalHeader/ModalHeader';\nimport type { ModalContentProps } from '../ModalContent/ModalContent';\nimport type { ModalControlsProps } from '../ModalControls/ModalControls';\nimport { Button } from '@contentful/f36-button';\n\nexport interface ModalConfirmProps {\n  /**\n   * When true, the dialog is shown.\n   */\n  isShown: boolean;\n  /**\n   * Function that will be called when the confirm button is clicked. This does not close the ModalConfirm.\n   */\n  onConfirm(): void;\n  /**\n   * Function that will be called when the cancel button is clicked. This does not close the ModalConfirm.\n   */\n  onCancel: ModalProps['onClose'];\n  /**\n      Modal title that is used in header\n    */\n  title?: string;\n  /**\n   * Label of the confirm button\n   */\n  confirmLabel?: string | false;\n  /**\n   * Label of the cancel button\n   */\n  cancelLabel?: string | false;\n  /**\n   * The intent of the ModalConfirm. Used for the Button.\n   */\n  intent?: 'primary' | 'positive' | 'negative';\n  /**\n      Size of the modal window\n    */\n  size?: ModalSizeType;\n  /**\n   * Boolean indicating if clicking the overlay should close the overlay.\n   */\n  shouldCloseOnOverlayClick?: boolean;\n  /**\n   * Boolean indicating if pressing the esc key should close the overlay.\n   */\n  shouldCloseOnEscapePress?: boolean;\n  /**\n   * When true, the confirm button is set to disabled.\n   */\n  isConfirmDisabled?: boolean;\n  /**\n   * When true, the confirm button is set to loading.\n   */\n  isConfirmLoading?: boolean;\n  /**\n   * Are modals higher than viewport allowed\n   */\n  allowHeightOverflow?: boolean;\n\n  /**\n   * Optional props to override ModalHeader behaviour\n   */\n  modalHeaderProps?: Partial<ModalHeaderProps>;\n\n  /**\n   * Optional props to override ModalContent behaviour\n   */\n  modalContentProps?: Partial<ModalContentProps>;\n\n  /**\n   * Optional props to override ModalControl behaviour\n   */\n  modalControlsProps?: Partial<ModalControlsProps>;\n\n  /**\n   * Optional property to set initial focus\n   */\n  initialFocusRef?: React.RefObject<HTMLElement>;\n\n  testId?: string;\n  confirmTestId?: string;\n  cancelTestId?: string;\n  children: React.ReactNode;\n}\n\nexport function ModalConfirm({\n  allowHeightOverflow = false,\n  cancelLabel = 'Cancel',\n  cancelTestId = 'cf-ui-modal-confirm-cancel-button',\n  children,\n  confirmLabel = 'Confirm',\n  confirmTestId = 'cf-ui-modal-confirm-confirm-button',\n  intent = 'positive',\n  isConfirmDisabled = false,\n  isConfirmLoading = false,\n  isShown,\n  modalContentProps,\n  modalControlsProps,\n  modalHeaderProps,\n  onCancel,\n  onConfirm,\n  shouldCloseOnEscapePress = true,\n  shouldCloseOnOverlayClick = true,\n  size = 'medium',\n  testId = 'cf-ui-modal-confirm',\n  title = 'Are you sure?',\n  initialFocusRef,\n}: ModalConfirmProps) {\n  const cancelRef = React.useRef(null);\n\n  const confirmButton = confirmLabel ? (\n    <Button\n      testId={confirmTestId}\n      isDisabled={isConfirmDisabled}\n      isLoading={isConfirmLoading}\n      variant={intent}\n      size=\"small\"\n      onClick={() => onConfirm()}\n    >\n      {confirmLabel}\n    </Button>\n  ) : null;\n\n  const cancelButton = cancelLabel ? (\n    <Button\n      testId={cancelTestId}\n      variant=\"secondary\"\n      onClick={onCancel}\n      size=\"small\"\n      ref={initialFocusRef || cancelRef}\n    >\n      {cancelLabel}\n    </Button>\n  ) : null;\n\n  return (\n    <Modal\n      testId={testId}\n      isShown={isShown}\n      onClose={onCancel}\n      size={size}\n      shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n      shouldCloseOnEscapePress={shouldCloseOnEscapePress}\n      allowHeightOverflow={allowHeightOverflow}\n      initialFocusRef={cancelRef}\n    >\n      {() => {\n        return (\n          <React.Fragment>\n            <Modal.Header title={title || ''} {...modalHeaderProps} />\n            <Modal.Content {...modalContentProps}>{children}</Modal.Content>\n            <Modal.Controls {...modalControlsProps}>\n              {cancelButton}\n              {confirmButton}\n            </Modal.Controls>\n          </React.Fragment>\n        );\n      }}\n    </Modal>\n  );\n}\n","/* global Promise */\nimport ReactDOM from 'react-dom';\n\n// @todo: change any to unknown\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ninterface ModalLauncherComponentRendererProps<T = any> {\n  isShown: boolean;\n  onClose: (result?: T) => void;\n}\n\ninterface ModalLauncherOpenOptions {\n  /**\n   * Unique id to be used as identifier for the modal contianer\n   */\n  modalId?: string;\n  /**\n   * ms before removing the component from the tree\n   * @default 300\n   */\n  delay?: number;\n}\n\ninterface CloseModalData {\n  delay: number;\n  render: (args: ModalLauncherComponentRendererProps<any>) => void;\n  currentConfig: ModalLauncherComponentRendererProps<any>;\n}\n\nconst getRoot = (rootElId: string): HTMLElement => {\n  // Reuse the container if we find it\n  let rootDom = document.getElementById(rootElId);\n  if (rootDom !== null) {\n    return rootDom;\n  }\n\n  // Otherwise create it\n  rootDom = document.createElement('div');\n  rootDom.setAttribute('id', rootElId);\n  document.body.appendChild(rootDom);\n  return rootDom;\n};\n\nconst openModalsIds: Map<string, CloseModalData> = new Map();\nfunction closeAll() {\n  openModalsIds.forEach(async ({ render, currentConfig, delay }, rootElId) => {\n    const config = { ...currentConfig, isShown: false };\n    render(config);\n    await new Promise((resolveDelay) => setTimeout(resolveDelay, delay));\n    ReactDOM.unmountComponentAtNode(getRoot(rootElId));\n    openModalsIds.delete(rootElId);\n  });\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction open<T = any>(\n  componentRenderer: (\n    props: ModalLauncherComponentRendererProps<T>,\n  ) => JSX.Element,\n  options: ModalLauncherOpenOptions = {},\n): Promise<T> {\n  options = { delay: 300, ...options };\n\n  // Allow components to specify if they wish to reuse the modal container\n  const rootElId = `modals-root${options.modalId || Date.now()}`;\n  const rootDom = getRoot(rootElId);\n\n  return new Promise((resolve) => {\n    let currentConfig = { onClose, isShown: true };\n\n    function render({\n      onClose,\n      isShown,\n    }: ModalLauncherComponentRendererProps<T>) {\n      ReactDOM.render(componentRenderer({ onClose, isShown }), rootDom);\n    }\n\n    async function onClose(arg?: T) {\n      currentConfig = {\n        ...currentConfig,\n        isShown: false,\n      };\n      render(currentConfig);\n      await new Promise((resolveDelay) =>\n        setTimeout(resolveDelay, options.delay),\n      );\n      ReactDOM.unmountComponentAtNode(rootDom);\n      rootDom.remove();\n      openModalsIds.delete(rootElId);\n      resolve(arg);\n    }\n\n    render(currentConfig);\n    openModalsIds.set(rootElId, {\n      render,\n      currentConfig,\n      delay: options.delay,\n    });\n  });\n}\n\nexport const ModalLauncher = {\n  open,\n  closeAll,\n};\n","export { Modal } from './CompoundModal';\nexport type { ModalProps } from './Modal';\nexport { ModalConfirm } from './ModalConfirm/ModalConfirm';\nexport type { ModalConfirmProps } from './ModalConfirm/ModalConfirm';\nexport { ModalContent } from './ModalContent/ModalContent';\nexport type { ModalContentProps } from './ModalContent/ModalContent';\nexport { ModalControls } from './ModalControls/ModalControls';\nexport type { ModalControlsProps } from './ModalControls/ModalControls';\nexport { ModalHeader } from './ModalHeader/ModalHeader';\nexport type { ModalHeaderProps } from './ModalHeader/ModalHeader';\nexport { ModalLauncher } from './ModalLauncher/ModalLauncher';\n","export * from './src/index';\n"],"names":[],"version":3,"file":"types.d.ts.map"}

package/package.json

@@ -1,17 +1,17 @@
 {
   "name": "@contentful/f36-modal",
-  "version": "4.1.1",
+  "version": "4.1.5",
   "description": "Forma 36: Modal component",
   "scripts": {
     "build": "parcel build index.ts"
   },
   "dependencies": {
     "@babel/runtime": "^7.6.2",
-    "@contentful/f36-button": "^4.1.1",
-    "@contentful/f36-core": "^4.0.1",
-    "@contentful/f36-icons": "^4.0.1",
+    "@contentful/f36-button": "^4.1.4",
+    "@contentful/f36-core": "^4.1.1",
+    "@contentful/f36-icons": "^4.0.3",
     "@contentful/f36-tokens": "^4.0.0",
-    "@contentful/f36-typography": "^4.0.1",
+    "@contentful/f36-typography": "^4.1.1",
     "@types/react-modal": "^3.12.1",
     "emotion": "^10.0.17",
     "react-modal": "^3.14.3"
@@ -37,5 +37,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "b2a34adf373d390409fdcaed98eaa0d453e68464"
+  "gitHead": "721631baa9a9904e6c4fa2224885604e23d3d21f"
 }