@contentful/f36-modal 4.2.5 → 4.2.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,36 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [4.2.8](https://github.com/contentful/forma-36/compare/@contentful/f36-modal@4.2.7...@contentful/f36-modal@4.2.8) (2022-03-09)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * flickering in modal close animation ([#1940](https://github.com/contentful/forma-36/issues/1940)) ([1ba910e](https://github.com/contentful/forma-36/commit/1ba910e6206991c7596ca75620c3da00aee3e0d4))
12
+
13
+
14
+
15
+
16
+
17
+ ## [4.2.7](https://github.com/contentful/forma-36/compare/@contentful/f36-modal@4.2.6...@contentful/f36-modal@4.2.7) (2022-03-09)
18
+
19
+ **Note:** Version bump only for package @contentful/f36-modal
20
+
21
+
22
+
23
+
24
+
25
+ ## [4.2.6](https://github.com/contentful/forma-36/compare/@contentful/f36-modal@4.2.5...@contentful/f36-modal@4.2.6) (2022-03-03)
26
+
27
+
28
+ ### Bug Fixes
29
+
30
+ * migrate links from master to main ([#1923](https://github.com/contentful/forma-36/issues/1923)) ([607301d](https://github.com/contentful/forma-36/commit/607301d57a2e83190d2aa298120ddb8493e8c429))
31
+
32
+
33
+
34
+
35
+
6
36
  ## [4.2.5](https://github.com/contentful/forma-36/compare/@contentful/f36-modal@4.2.4...@contentful/f36-modal@4.2.5) (2022-03-02)
7
37
 
8
38
  **Note:** Version bump only for package @contentful/f36-modal
package/dist/main.js CHANGED
@@ -98,6 +98,7 @@ function $2679bd8c144d3995$export$f50a68e3694789ee({ onClose: onClose , title: t
98
98
  size: "small"
99
99
  }))));
100
100
  }
101
+ $2679bd8c144d3995$export$f50a68e3694789ee.displayName = 'ModalHeader';
101
102
 
102
103
 
103
104
 
@@ -130,6 +131,7 @@ function $66391c55bbcf9065$export$6da19a24bf249f17({ testId: testId = 'cf-ui-mod
130
131
  testId: testId
131
132
  }, children));
132
133
  }
134
+ $66391c55bbcf9065$export$6da19a24bf249f17.displayName = 'ModalContent';
133
135
 
134
136
 
135
137
 
@@ -137,10 +139,7 @@ function $66391c55bbcf9065$export$6da19a24bf249f17({ testId: testId = 'cf-ui-mod
137
139
 
138
140
  function $a1d799ea27882387$export$9af97f4b0b4c597a(props) {
139
141
  const modal = $7x5iO$emotion.cx(/*#__PURE__*/ $7x5iO$emotion.css({
140
- transition: `opacity ${($parcel$interopDefault($7x5iO$contentfulf36tokens)).transitionDurationLong} ${($parcel$interopDefault($7x5iO$contentfulf36tokens)).transitionEasingDefault}, transform ${($parcel$interopDefault($7x5iO$contentfulf36tokens)).transitionDurationDefault} ${($parcel$interopDefault($7x5iO$contentfulf36tokens)).transitionEasingCubicBezier}`,
141
- opacity: '0.5',
142
142
  margin: ($parcel$interopDefault($7x5iO$contentfulf36tokens)).spacing2Xl,
143
- transform: 'scale(0.85)',
144
143
  backgroundColor: ($parcel$interopDefault($7x5iO$contentfulf36tokens)).colorWhite,
145
144
  borderRadius: ($parcel$interopDefault($7x5iO$contentfulf36tokens)).borderRadiusMedium,
146
145
  boxShadow: ($parcel$interopDefault($7x5iO$contentfulf36tokens)).boxShadowHeavy,
@@ -169,18 +168,20 @@ function $a1d799ea27882387$export$9af97f4b0b4c597a(props) {
169
168
  display: 'inline-block',
170
169
  margin: '0 auto',
171
170
  textAlign: 'left',
172
- outline: 'none'
171
+ outline: 'none',
172
+ transform: 'scale(0.85)',
173
+ transition: `transform ${($parcel$interopDefault($7x5iO$contentfulf36tokens)).transitionDurationDefault} ${($parcel$interopDefault($7x5iO$contentfulf36tokens)).transitionEasingDefault}`
173
174
  }), props.size === 'zen' ? /*#__PURE__*/ $7x5iO$emotion.css({
174
175
  name: "uwwqev",
175
176
  styles: "width:100%;height:100%;"
176
177
  }) : null),
177
178
  afterOpen: /*#__PURE__*/ $7x5iO$emotion.css({
178
- name: "rdgc1",
179
- styles: "[data-modal-root]{transform:scale(1);opacity:1;}"
179
+ name: "41q668",
180
+ styles: "transform:scale(1);"
180
181
  }),
181
182
  beforeClose: /*#__PURE__*/ $7x5iO$emotion.css({
182
- name: "e66ys1",
183
- styles: "[data-modal-root]{opacity:0.5;transform:scale(0.85);}"
183
+ name: "ncrqc5",
184
+ styles: "transform:scale(0.85);"
184
185
  })
185
186
  },
186
187
  modalOverlay: {
@@ -204,8 +205,8 @@ function $a1d799ea27882387$export$9af97f4b0b4c597a(props) {
204
205
  styles: "align-items:center;justify-content:center;"
205
206
  }) : null),
206
207
  afterOpen: /*#__PURE__*/ $7x5iO$emotion.css({
207
- name: "mcmk46",
208
- styles: "opacity:1 !important;"
208
+ name: "whh5e5",
209
+ styles: "opacity:1;"
209
210
  }),
210
211
  beforeClose: /*#__PURE__*/ $7x5iO$emotion.css({
211
212
  name: "q7lffx",
@@ -280,22 +281,22 @@ function $854b6d713fe70fc9$export$2b77a92f1a5ad772({ allowHeightOverflow: allowH
280
281
  shouldFocusAfterRender: true,
281
282
  shouldReturnFocusAfterClose: true,
282
283
  portalClassName: styles.portal,
283
- className: {
284
- base: styles.base.root,
285
- afterOpen: styles.base.afterOpen,
286
- beforeClose: styles.base.beforeClose
287
- },
288
284
  style: {
289
285
  content: {
290
286
  top: position === 'center' ? 0 : topOffset
291
287
  }
292
288
  },
289
+ className: {
290
+ base: styles.base.root,
291
+ afterOpen: styles.base.afterOpen,
292
+ beforeClose: styles.base.beforeClose
293
+ },
293
294
  overlayClassName: {
294
295
  base: styles.modalOverlay.root,
295
296
  afterOpen: styles.modalOverlay.afterOpen,
296
297
  beforeClose: styles.modalOverlay.beforeClose
297
298
  },
298
- closeTimeoutMS: 300,
299
+ closeTimeoutMS: 200,
299
300
  contentRef: (ref)=>{
300
301
  contentRef.current = ref;
301
302
  }
@@ -308,6 +309,7 @@ function $854b6d713fe70fc9$export$2b77a92f1a5ad772({ allowHeightOverflow: allowH
308
309
  "data-modal-root": true
309
310
  }, typeof otherProps.children === 'function' ? otherProps.children(props) : renderDefault())));
310
311
  }
312
+ $854b6d713fe70fc9$export$2b77a92f1a5ad772.displayName = 'Modal';
311
313
 
312
314
 
313
315
 
@@ -329,6 +331,7 @@ function $8b06e393320a8e77$export$c63fb08199be8e0e({ testId: testId = 'cf-ui-mod
329
331
  spacing: "spacingS"
330
332
  }, children)));
331
333
  }
334
+ $8b06e393320a8e77$export$c63fb08199be8e0e.displayName = 'ModalControls';
332
335
 
333
336
 
334
337
  const $2132db66f9439432$export$2b77a92f1a5ad772 = $854b6d713fe70fc9$export$2b77a92f1a5ad772;
@@ -373,6 +376,7 @@ function $657ddd6e4548962f$export$427af6990c8ff682({ allowHeightOverflow: allowH
373
376
  }), /*#__PURE__*/ ($parcel$interopDefault($7x5iO$react)).createElement($2132db66f9439432$export$2b77a92f1a5ad772.Content, modalContentProps, children), /*#__PURE__*/ ($parcel$interopDefault($7x5iO$react)).createElement($2132db66f9439432$export$2b77a92f1a5ad772.Controls, modalControlsProps, cancelButton, confirmButton)));
374
377
  }));
375
378
  }
379
+ $657ddd6e4548962f$export$427af6990c8ff682.displayName = 'ModalConfirm';
376
380
 
377
381
 
378
382
 
package/dist/main.js.map CHANGED
@@ -1 +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 * @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"}
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 * @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 style={{\n content: {\n top: position === 'center' ? 0 : topOffset,\n },\n }}\n className={{\n base: styles.base.root,\n afterOpen: styles.base.afterOpen,\n beforeClose: styles.base.beforeClose,\n }}\n overlayClassName={{\n base: styles.modalOverlay.root,\n afterOpen: styles.modalOverlay.afterOpen,\n beforeClose: styles.modalOverlay.beforeClose,\n }}\n closeTimeoutMS={200}\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\nModal.displayName = 'Modal';\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\nModalHeader.displayName = 'ModalHeader';\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\nModalContent.displayName = 'ModalContent';\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 margin: tokens.spacing2Xl,\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 transform: 'scale(0.85)',\n transition: `transform ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n }),\n props.size === 'zen'\n ? css({\n width: '100%',\n height: '100%',\n })\n : null,\n ),\n afterOpen: css({\n transform: 'scale(1)',\n }),\n beforeClose: css({\n transform: 'scale(0.85)',\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,\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\nModalControls.displayName = '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\nModalConfirm.displayName = 'ModalConfirm';\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","content","top","base","root","afterOpen","beforeClose","modalOverlay","ref","width","modal","displayName","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","margin","backgroundColor","colorWhite","boxShadow","boxShadowHeavy","maxHeight","fontBaseDefault","maxWidth","overflow","display","flexDirection","zIndex","zIndexModalContent","textAlign","outline","transform","transition","transitionDurationDefault","transitionEasingDefault","alignItems","flexWrap","bottom","left","zIndexModal","opacity","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 CHANGED
@@ -79,6 +79,7 @@ function $08ed4541188cb150$export$f50a68e3694789ee({ onClose: onClose , title: t
79
79
  size: "small"
80
80
  }))));
81
81
  }
82
+ $08ed4541188cb150$export$f50a68e3694789ee.displayName = 'ModalHeader';
82
83
 
83
84
 
84
85
 
@@ -111,6 +112,7 @@ function $2e16b6f9c0e7012d$export$6da19a24bf249f17({ testId: testId = 'cf-ui-mod
111
112
  testId: testId
112
113
  }, children));
113
114
  }
115
+ $2e16b6f9c0e7012d$export$6da19a24bf249f17.displayName = 'ModalContent';
114
116
 
115
117
 
116
118
 
@@ -118,10 +120,7 @@ function $2e16b6f9c0e7012d$export$6da19a24bf249f17({ testId: testId = 'cf-ui-mod
118
120
 
119
121
  function $f482f3cd8cb551fb$export$9af97f4b0b4c597a(props) {
120
122
  const modal = $8jMle$cx(/*#__PURE__*/ $8jMle$css({
121
- transition: `opacity ${$8jMle$contentfulf36tokens.transitionDurationLong} ${$8jMle$contentfulf36tokens.transitionEasingDefault}, transform ${$8jMle$contentfulf36tokens.transitionDurationDefault} ${$8jMle$contentfulf36tokens.transitionEasingCubicBezier}`,
122
- opacity: '0.5',
123
123
  margin: $8jMle$contentfulf36tokens.spacing2Xl,
124
- transform: 'scale(0.85)',
125
124
  backgroundColor: $8jMle$contentfulf36tokens.colorWhite,
126
125
  borderRadius: $8jMle$contentfulf36tokens.borderRadiusMedium,
127
126
  boxShadow: $8jMle$contentfulf36tokens.boxShadowHeavy,
@@ -150,18 +149,20 @@ function $f482f3cd8cb551fb$export$9af97f4b0b4c597a(props) {
150
149
  display: 'inline-block',
151
150
  margin: '0 auto',
152
151
  textAlign: 'left',
153
- outline: 'none'
152
+ outline: 'none',
153
+ transform: 'scale(0.85)',
154
+ transition: `transform ${$8jMle$contentfulf36tokens.transitionDurationDefault} ${$8jMle$contentfulf36tokens.transitionEasingDefault}`
154
155
  }), props.size === 'zen' ? /*#__PURE__*/ $8jMle$css({
155
156
  name: "uwwqev",
156
157
  styles: "width:100%;height:100%;"
157
158
  }) : null),
158
159
  afterOpen: /*#__PURE__*/ $8jMle$css({
159
- name: "rdgc1",
160
- styles: "[data-modal-root]{transform:scale(1);opacity:1;}"
160
+ name: "41q668",
161
+ styles: "transform:scale(1);"
161
162
  }),
162
163
  beforeClose: /*#__PURE__*/ $8jMle$css({
163
- name: "e66ys1",
164
- styles: "[data-modal-root]{opacity:0.5;transform:scale(0.85);}"
164
+ name: "ncrqc5",
165
+ styles: "transform:scale(0.85);"
165
166
  })
166
167
  },
167
168
  modalOverlay: {
@@ -185,8 +186,8 @@ function $f482f3cd8cb551fb$export$9af97f4b0b4c597a(props) {
185
186
  styles: "align-items:center;justify-content:center;"
186
187
  }) : null),
187
188
  afterOpen: /*#__PURE__*/ $8jMle$css({
188
- name: "mcmk46",
189
- styles: "opacity:1 !important;"
189
+ name: "whh5e5",
190
+ styles: "opacity:1;"
190
191
  }),
191
192
  beforeClose: /*#__PURE__*/ $8jMle$css({
192
193
  name: "q7lffx",
@@ -261,22 +262,22 @@ function $bfd2aa2f2cc9e088$export$2b77a92f1a5ad772({ allowHeightOverflow: allowH
261
262
  shouldFocusAfterRender: true,
262
263
  shouldReturnFocusAfterClose: true,
263
264
  portalClassName: styles.portal,
264
- className: {
265
- base: styles.base.root,
266
- afterOpen: styles.base.afterOpen,
267
- beforeClose: styles.base.beforeClose
268
- },
269
265
  style: {
270
266
  content: {
271
267
  top: position === 'center' ? 0 : topOffset
272
268
  }
273
269
  },
270
+ className: {
271
+ base: styles.base.root,
272
+ afterOpen: styles.base.afterOpen,
273
+ beforeClose: styles.base.beforeClose
274
+ },
274
275
  overlayClassName: {
275
276
  base: styles.modalOverlay.root,
276
277
  afterOpen: styles.modalOverlay.afterOpen,
277
278
  beforeClose: styles.modalOverlay.beforeClose
278
279
  },
279
- closeTimeoutMS: 300,
280
+ closeTimeoutMS: 200,
280
281
  contentRef: (ref)=>{
281
282
  contentRef.current = ref;
282
283
  }
@@ -289,6 +290,7 @@ function $bfd2aa2f2cc9e088$export$2b77a92f1a5ad772({ allowHeightOverflow: allowH
289
290
  "data-modal-root": true
290
291
  }, typeof otherProps.children === 'function' ? otherProps.children(props) : renderDefault())));
291
292
  }
293
+ $bfd2aa2f2cc9e088$export$2b77a92f1a5ad772.displayName = 'Modal';
292
294
 
293
295
 
294
296
 
@@ -310,6 +312,7 @@ function $12733d8c9bae35ea$export$c63fb08199be8e0e({ testId: testId = 'cf-ui-mod
310
312
  spacing: "spacingS"
311
313
  }, children)));
312
314
  }
315
+ $12733d8c9bae35ea$export$c63fb08199be8e0e.displayName = 'ModalControls';
313
316
 
314
317
 
315
318
  const $d7b21827f6622ba3$export$2b77a92f1a5ad772 = $bfd2aa2f2cc9e088$export$2b77a92f1a5ad772;
@@ -354,6 +357,7 @@ function $78040759975f86df$export$427af6990c8ff682({ allowHeightOverflow: allowH
354
357
  }), /*#__PURE__*/ $8jMle$react.createElement($d7b21827f6622ba3$export$2b77a92f1a5ad772.Content, modalContentProps, children), /*#__PURE__*/ $8jMle$react.createElement($d7b21827f6622ba3$export$2b77a92f1a5ad772.Controls, modalControlsProps, cancelButton, confirmButton)));
355
358
  }));
356
359
  }
360
+ $78040759975f86df$export$427af6990c8ff682.displayName = 'ModalConfirm';
357
361
 
358
362
 
359
363
 
@@ -1 +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 * @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"}
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 * @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 style={{\n content: {\n top: position === 'center' ? 0 : topOffset,\n },\n }}\n className={{\n base: styles.base.root,\n afterOpen: styles.base.afterOpen,\n beforeClose: styles.base.beforeClose,\n }}\n overlayClassName={{\n base: styles.modalOverlay.root,\n afterOpen: styles.modalOverlay.afterOpen,\n beforeClose: styles.modalOverlay.beforeClose,\n }}\n closeTimeoutMS={200}\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\nModal.displayName = 'Modal';\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\nModalHeader.displayName = 'ModalHeader';\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\nModalContent.displayName = 'ModalContent';\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 margin: tokens.spacing2Xl,\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 transform: 'scale(0.85)',\n transition: `transform ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n }),\n props.size === 'zen'\n ? css({\n width: '100%',\n height: '100%',\n })\n : null,\n ),\n afterOpen: css({\n transform: 'scale(1)',\n }),\n beforeClose: css({\n transform: 'scale(0.85)',\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,\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\nModalControls.displayName = '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\nModalConfirm.displayName = 'ModalConfirm';\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","content","top","base","root","afterOpen","beforeClose","modalOverlay","ref","width","modal","displayName","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","margin","backgroundColor","colorWhite","boxShadow","boxShadowHeavy","maxHeight","fontBaseDefault","maxWidth","overflow","display","flexDirection","zIndex","zIndexModalContent","textAlign","outline","transform","transition","transitionDurationDefault","transitionEasingDefault","alignItems","flexWrap","bottom","left","zIndexModal","opacity","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"}
@@ -1 +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 * @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"}
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\nModalHeader.displayName = 'ModalHeader';\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\nModalContent.displayName = 'ModalContent';\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 margin: tokens.spacing2Xl,\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 transform: 'scale(0.85)',\n transition: `transform ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n }),\n props.size === 'zen'\n ? css({\n width: '100%',\n height: '100%',\n })\n : null,\n ),\n afterOpen: css({\n transform: 'scale(1)',\n }),\n beforeClose: css({\n transform: 'scale(0.85)',\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,\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 style={{\n content: {\n top: position === 'center' ? 0 : topOffset,\n },\n }}\n className={{\n base: styles.base.root,\n afterOpen: styles.base.afterOpen,\n beforeClose: styles.base.beforeClose,\n }}\n overlayClassName={{\n base: styles.modalOverlay.root,\n afterOpen: styles.modalOverlay.afterOpen,\n beforeClose: styles.modalOverlay.beforeClose,\n }}\n closeTimeoutMS={200}\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\nModal.displayName = 'Modal';\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\nModalControls.displayName = 'ModalControls';\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\nModalConfirm.displayName = 'ModalConfirm';\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 CHANGED
@@ -1,17 +1,17 @@
1
1
  {
2
2
  "name": "@contentful/f36-modal",
3
- "version": "4.2.5",
3
+ "version": "4.2.8",
4
4
  "description": "Forma 36: Modal component",
5
5
  "scripts": {
6
6
  "build": "parcel build index.ts"
7
7
  },
8
8
  "dependencies": {
9
9
  "@babel/runtime": "^7.6.2",
10
- "@contentful/f36-button": "^4.3.3",
11
- "@contentful/f36-core": "^4.2.0",
12
- "@contentful/f36-icons": "^4.1.1",
13
- "@contentful/f36-tokens": "^4.0.0",
14
- "@contentful/f36-typography": "^4.2.0",
10
+ "@contentful/f36-button": "^4.3.5",
11
+ "@contentful/f36-core": "^4.2.2",
12
+ "@contentful/f36-icons": "^4.1.3",
13
+ "@contentful/f36-tokens": "^4.0.1",
14
+ "@contentful/f36-typography": "^4.2.2",
15
15
  "@types/react-modal": "^3.12.1",
16
16
  "emotion": "^10.0.17",
17
17
  "react-modal": "^3.14.3"
@@ -37,5 +37,5 @@
37
37
  "publishConfig": {
38
38
  "access": "public"
39
39
  },
40
- "gitHead": "2b6d93caaf3f870919bb60745634462e3456a615"
40
+ "gitHead": "09a64cc405f5b9adefe26f9c9ff63026d299cc2e"
41
41
  }