@wordpress/components 30.5.1-next.f56bd8138.0 → 30.6.1-next.b8c8708f3.0

package/build-module/modal/index.js

@@ -1,38 +1,23 @@
-/**
- * External dependencies
- */
-import clsx from 'clsx';
-
-/**
- * WordPress dependencies
- */
-import { createPortal, useCallback, useEffect, useRef, useState, forwardRef, useLayoutEffect, createContext, useContext } from '@wordpress/element';
-import { useInstanceId, useFocusReturn, useFocusOnMount, useConstrainedTabbing, useMergeRefs } from '@wordpress/compose';
-import { __ } from '@wordpress/i18n';
-import { close } from '@wordpress/icons';
-import { getScrollContainer } from '@wordpress/dom';
-
-/**
- * Internal dependencies
- */
-import * as ariaHelper from './aria-helper';
-import Button from '../button';
-import StyleProvider from '../style-provider';
-import { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';
-import { Spacer } from '../spacer';
-import { useModalExitAnimation } from './use-modal-exit-animation';
-
-// Used to track and dismiss the prior modal when another opens unless nested.
+import clsx from "clsx";
+import { createPortal, useCallback, useEffect, useRef, useState, forwardRef, useLayoutEffect, createContext, useContext } from "@wordpress/element";
+import { useInstanceId, useFocusReturn, useFocusOnMount, useConstrainedTabbing, useMergeRefs } from "@wordpress/compose";
+import { __ } from "@wordpress/i18n";
+import { close } from "@wordpress/icons";
+import { getScrollContainer } from "@wordpress/dom";
+import * as ariaHelper from "./aria-helper";
+import Button from "../button";
+import StyleProvider from "../style-provider";
+import { withIgnoreIMEEvents } from "../utils/with-ignore-ime-events";
+import { Spacer } from "../spacer";
+import { useModalExitAnimation } from "./use-modal-exit-animation";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-const ModalContext = createContext(new Set());
-ModalContext.displayName = 'ModalContext';
-
-// Used to track body class names applied while modals are open.
-const bodyOpenClasses = new Map();
+const ModalContext = createContext(/* @__PURE__ */ new Set());
+ModalContext.displayName = "ModalContext";
+const bodyOpenClasses = /* @__PURE__ */ new Map();
 function UnforwardedModal(props, forwardedRef) {
   const {
-    bodyOpenClassName = 'modal-open',
-    role = 'dialog',
+    bodyOpenClassName = "modal-open",
+    role = "dialog",
     title = null,
     focusOnMount = true,
     shouldCloseOnEsc = true,
@@ -40,8 +25,8 @@ function UnforwardedModal(props, forwardedRef) {
     isDismissible = true,
     /* Accessibility. */
     aria = {
-      labelledby: undefined,
-      describedby: undefined
+      labelledby: void 0,
+      describedby: void 0
     },
     onRequestClose,
     icon,
@@ -60,16 +45,7 @@ function UnforwardedModal(props, forwardedRef) {
   const ref = useRef();
   const instanceId = useInstanceId(Modal);
   const headingId = title ? `components-modal-header-${instanceId}` : aria.labelledby;
-
-  // The focus hook does not support 'firstContentElement' but this is a valid
-  // value for the Modal's focusOnMount prop. The following code ensures the focus
-  // hook will focus the first focusable node within the element to which it is applied.
-  // When `firstContentElement` is passed as the value of the focusOnMount prop,
-  // the focus hook is applied to the Modal's content element.
-  // Otherwise, the focus hook is applied to the Modal's ref. This ensures that the
-  // focus hook will focus the first element in the Modal's **content** when
-  // `firstContentElement` is passed.
-  const focusOnMountRef = useFocusOnMount(focusOnMount === 'firstContentElement' ? 'firstElement' : focusOnMount);
+  const focusOnMountRef = useFocusOnMount(focusOnMount === "firstContentElement" ? "firstElement" : focusOnMount);
   const constrainedTabbingRef = useConstrainedTabbing();
   const focusReturnRef = useFocusReturn();
   const contentRef = useRef(null);
@@ -77,13 +53,11 @@ function UnforwardedModal(props, forwardedRef) {
   const [hasScrolledContent, setHasScrolledContent] = useState(false);
   const [hasScrollableContent, setHasScrollableContent] = useState(false);
   let sizeClass;
-  if (isFullScreen || size === 'fill') {
-    sizeClass = 'is-full-screen';
+  if (isFullScreen || size === "fill") {
+    sizeClass = "is-full-screen";
   } else if (size) {
     sizeClass = `has-size-${size}`;
   }
-
-  // Determines whether the Modal content is scrollable and updates the state.
   const isContentScrollable = useCallback(() => {
     if (!contentRef.current) {
       return;
@@ -95,47 +69,30 @@ function UnforwardedModal(props, forwardedRef) {
       setHasScrollableContent(false);
     }
   }, [contentRef]);
-
-  // Accessibly isolates/unisolates the modal.
   useEffect(() => {
     ariaHelper.modalize(ref.current);
     return () => ariaHelper.unmodalize();
   }, []);
-
-  // Keeps a fresh ref for the subsequent effect.
   const onRequestCloseRef = useRef();
   useEffect(() => {
     onRequestCloseRef.current = onRequestClose;
   }, [onRequestClose]);
-
-  // The list of `onRequestClose` callbacks of open (non-nested) Modals. Only
-  // one should remain open at a time and the list enables closing prior ones.
   const dismissers = useContext(ModalContext);
-  // Used for the tracking and dismissing any nested modals.
-  const [nestedDismissers] = useState(() => new Set());
-
-  // Updates the stack tracking open modals at this level and calls
-  // onRequestClose for any prior and/or nested modals as applicable.
+  const [nestedDismissers] = useState(() => /* @__PURE__ */ new Set());
   useEffect(() => {
-    // add this modal instance to the dismissers set
     dismissers.add(onRequestCloseRef);
-    // request that all the other modals close themselves
     for (const dismisser of dismissers) {
       if (dismisser !== onRequestCloseRef) {
         dismisser.current?.();
       }
     }
     return () => {
-      // request that all the nested modals close themselves
       for (const dismisser of nestedDismissers) {
         dismisser.current?.();
       }
-      // remove this modal instance from the dismissers set
       dismissers.delete(onRequestCloseRef);
     };
   }, [dismissers, nestedDismissers]);
-
-  // Adds/removes the value of bodyOpenClassName to body element.
   useEffect(() => {
     var _bodyOpenClasses$get;
     const theClass = bodyOpenClassName;
@@ -158,8 +115,6 @@ function UnforwardedModal(props, forwardedRef) {
     frameStyle,
     overlayClassname
   } = useModalExitAnimation();
-
-  // Calls the isContentScrollable callback when the Modal children container resizes.
   useLayoutEffect(() => {
     if (!window.ResizeObserver || !childrenContainerRef.current) {
       return;
@@ -172,12 +127,12 @@ function UnforwardedModal(props, forwardedRef) {
     };
   }, [isContentScrollable, childrenContainerRef]);
   function handleEscapeKeyDown(event) {
-    if (shouldCloseOnEsc && (event.code === 'Escape' || event.key === 'Escape') && !event.defaultPrevented) {
+    if (shouldCloseOnEsc && (event.code === "Escape" || event.key === "Escape") && !event.defaultPrevented) {
       event.preventDefault();
       closeModal().then(() => onRequestClose(event));
     }
   }
-  const onContentContainerScroll = useCallback(e => {
+  const onContentContainerScroll = useCallback((e) => {
     var _e$currentTarget$scro;
     const scrollY = (_e$currentTarget$scro = e?.currentTarget?.scrollTop) !== null && _e$currentTarget$scro !== void 0 ? _e$currentTarget$scro : -1;
     if (!hasScrolledContent && scrollY > 0) {
@@ -188,10 +143,9 @@ function UnforwardedModal(props, forwardedRef) {
   }, [hasScrolledContent]);
   let pressTarget = null;
   const overlayPressHandlers = {
-    onPointerDown: event => {
+    onPointerDown: (event) => {
       if (event.target === event.currentTarget) {
         pressTarget = event.target;
-        // Avoids focus changing so that focus return works as expected.
         event.preventDefault();
       }
     },
@@ -212,109 +166,81 @@ function UnforwardedModal(props, forwardedRef) {
       }
     }
   };
-  const modal =
-  /*#__PURE__*/
-  // eslint-disable-next-line jsx-a11y/no-static-element-interactions
-  _jsx("div", {
-    ref: useMergeRefs([ref, forwardedRef]),
-    className: clsx('components-modal__screen-overlay', overlayClassname, overlayClassnameProp),
-    onKeyDown: withIgnoreIMEEvents(handleEscapeKeyDown),
-    ...(shouldCloseOnClickOutside ? overlayPressHandlers : {}),
-    children: /*#__PURE__*/_jsx(StyleProvider, {
-      document: document,
-      children: /*#__PURE__*/_jsx("div", {
-        className: clsx('components-modal__frame', sizeClass, className),
-        style: {
-          ...frameStyle,
-          ...style
-        },
-        ref: useMergeRefs([frameRef, constrainedTabbingRef, focusReturnRef, focusOnMount !== 'firstContentElement' ? focusOnMountRef : null]),
-        role: role,
-        "aria-label": contentLabel,
-        "aria-labelledby": contentLabel ? undefined : headingId,
-        "aria-describedby": aria.describedby,
-        tabIndex: -1,
-        onKeyDown: onKeyDown,
-        children: /*#__PURE__*/_jsxs("div", {
-          className: clsx('components-modal__content', {
-            'hide-header': __experimentalHideHeader,
-            'is-scrollable': hasScrollableContent,
-            'has-scrolled-content': hasScrolledContent
-          }),
-          role: "document",
-          onScroll: onContentContainerScroll,
-          ref: contentRef,
-          "aria-label": hasScrollableContent ? __('Scrollable section') : undefined,
-          tabIndex: hasScrollableContent ? 0 : undefined,
-          children: [!__experimentalHideHeader && /*#__PURE__*/_jsxs("div", {
-            className: "components-modal__header",
-            children: [/*#__PURE__*/_jsxs("div", {
-              className: "components-modal__header-heading-container",
-              children: [icon && /*#__PURE__*/_jsx("span", {
-                className: "components-modal__icon-container",
-                "aria-hidden": true,
-                children: icon
-              }), title && /*#__PURE__*/_jsx("h1", {
-                id: headingId,
-                className: "components-modal__header-heading",
-                children: title
-              })]
-            }), headerActions, isDismissible && /*#__PURE__*/_jsxs(_Fragment, {
-              children: [/*#__PURE__*/_jsx(Spacer, {
-                marginBottom: 0,
-                marginLeft: 2
-              }), /*#__PURE__*/_jsx(Button, {
-                size: "compact",
-                onClick: event => closeModal().then(() => onRequestClose(event)),
-                icon: close,
-                label: closeButtonLabel || __('Close')
+  const modal = (
+    // eslint-disable-next-line jsx-a11y/no-static-element-interactions
+    /* @__PURE__ */ _jsx("div", {
+      ref: useMergeRefs([ref, forwardedRef]),
+      className: clsx("components-modal__screen-overlay", overlayClassname, overlayClassnameProp),
+      onKeyDown: withIgnoreIMEEvents(handleEscapeKeyDown),
+      ...shouldCloseOnClickOutside ? overlayPressHandlers : {},
+      children: /* @__PURE__ */ _jsx(StyleProvider, {
+        document,
+        children: /* @__PURE__ */ _jsx("div", {
+          className: clsx("components-modal__frame", sizeClass, className),
+          style: {
+            ...frameStyle,
+            ...style
+          },
+          ref: useMergeRefs([frameRef, constrainedTabbingRef, focusReturnRef, focusOnMount !== "firstContentElement" ? focusOnMountRef : null]),
+          role,
+          "aria-label": contentLabel,
+          "aria-labelledby": contentLabel ? void 0 : headingId,
+          "aria-describedby": aria.describedby,
+          tabIndex: -1,
+          onKeyDown,
+          children: /* @__PURE__ */ _jsxs("div", {
+            className: clsx("components-modal__content", {
+              "hide-header": __experimentalHideHeader,
+              "is-scrollable": hasScrollableContent,
+              "has-scrolled-content": hasScrolledContent
+            }),
+            role: "document",
+            onScroll: onContentContainerScroll,
+            ref: contentRef,
+            "aria-label": hasScrollableContent ? __("Scrollable section") : void 0,
+            tabIndex: hasScrollableContent ? 0 : void 0,
+            children: [!__experimentalHideHeader && /* @__PURE__ */ _jsxs("div", {
+              className: "components-modal__header",
+              children: [/* @__PURE__ */ _jsxs("div", {
+                className: "components-modal__header-heading-container",
+                children: [icon && /* @__PURE__ */ _jsx("span", {
+                  className: "components-modal__icon-container",
+                  "aria-hidden": true,
+                  children: icon
+                }), title && /* @__PURE__ */ _jsx("h1", {
+                  id: headingId,
+                  className: "components-modal__header-heading",
+                  children: title
+                })]
+              }), headerActions, isDismissible && /* @__PURE__ */ _jsxs(_Fragment, {
+                children: [/* @__PURE__ */ _jsx(Spacer, {
+                  marginBottom: 0,
+                  marginLeft: 2
+                }), /* @__PURE__ */ _jsx(Button, {
+                  size: "compact",
+                  onClick: (event) => closeModal().then(() => onRequestClose(event)),
+                  icon: close,
+                  label: closeButtonLabel || __("Close")
+                })]
               })]
+            }), /* @__PURE__ */ _jsx("div", {
+              ref: useMergeRefs([childrenContainerRef, focusOnMount === "firstContentElement" ? focusOnMountRef : null]),
+              children
             })]
-          }), /*#__PURE__*/_jsx("div", {
-            ref: useMergeRefs([childrenContainerRef, focusOnMount === 'firstContentElement' ? focusOnMountRef : null]),
-            children: children
-          })]
+          })
         })
       })
     })
-  });
-  return createPortal(/*#__PURE__*/_jsx(ModalContext.Provider, {
+  );
+  return createPortal(/* @__PURE__ */ _jsx(ModalContext.Provider, {
     value: nestedDismissers,
     children: modal
   }), document.body);
 }
-
-/**
- * Modals give users information and choices related to a task they’re trying to
- * accomplish. They can contain critical information, require decisions, or
- * involve multiple tasks.
- *
- * ```jsx
- * import { Button, Modal } from '@wordpress/components';
- * import { useState } from '@wordpress/element';
- *
- * const MyModal = () => {
- *   const [ isOpen, setOpen ] = useState( false );
- *   const openModal = () => setOpen( true );
- *   const closeModal = () => setOpen( false );
- *
- *   return (
- *     <>
- *       <Button variant="secondary" onClick={ openModal }>
- *         Open Modal
- *       </Button>
- *       { isOpen && (
- *         <Modal title="This is my modal" onRequestClose={ closeModal }>
- *           <Button variant="secondary" onClick={ closeModal }>
- *             My custom close button
- *           </Button>
- *         </Modal>
- *       ) }
- *     </>
- *   );
- * };
- * ```
- */
-export const Modal = forwardRef(UnforwardedModal);
-export default Modal;
-//# sourceMappingURL=index.js.map
+const Modal = forwardRef(UnforwardedModal);
+var modal_default = Modal;
+export {
+  Modal,
+  modal_default as default
+};
+//# sourceMappingURL=index.js.map

package/build-module/modal/index.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["clsx","createPortal","useCallback","useEffect","useRef","useState","forwardRef","useLayoutEffect","createContext","useContext","useInstanceId","useFocusReturn","useFocusOnMount","useConstrainedTabbing","useMergeRefs","__","close","getScrollContainer","ariaHelper","Button","StyleProvider","withIgnoreIMEEvents","Spacer","useModalExitAnimation","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","ModalContext","Set","displayName","bodyOpenClasses","Map","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","overlayClassnameProp","className","contentLabel","onKeyDown","isFullScreen","size","headerActions","__experimentalHideHeader","ref","instanceId","Modal","headingId","focusOnMountRef","constrainedTabbingRef","focusReturnRef","contentRef","childrenContainerRef","hasScrolledContent","setHasScrolledContent","hasScrollableContent","setHasScrollableContent","sizeClass","isContentScrollable","current","closestScrollContainer","modalize","unmodalize","onRequestCloseRef","dismissers","nestedDismissers","add","dismisser","delete","_bodyOpenClasses$get","theClass","oneMore","get","set","document","body","classList","oneLess","remove","closeModal","frameRef","frameStyle","overlayClassname","window","ResizeObserver","resizeObserver","observe","disconnect","handleEscapeKeyDown","event","code","key","defaultPrevented","preventDefault","then","onContentContainerScroll","e","_e$currentTarget$scro","scrollY","currentTarget","scrollTop","pressTarget","overlayPressHandlers","onPointerDown","target","onPointerUp","button","isSameTarget","modal","tabIndex","onScroll","id","marginBottom","marginLeft","onClick","label","Provider","value"],"sources":["@wordpress/components/src/modal/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreatePortal,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tforwardRef,\n\tuseLayoutEffect,\n\tcreateContext,\n\tuseContext,\n} from '@wordpress/element';\nimport {\n\tuseInstanceId,\n\tuseFocusReturn,\n\tuseFocusOnMount,\n\tuseConstrainedTabbing,\n\tuseMergeRefs,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { close } from '@wordpress/icons';\nimport { getScrollContainer } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport * as ariaHelper from './aria-helper';\nimport Button from '../button';\nimport StyleProvider from '../style-provider';\nimport type { ModalProps } from './types';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\nimport { Spacer } from '../spacer';\nimport { useModalExitAnimation } from './use-modal-exit-animation';\n\n// Used to track and dismiss the prior modal when another opens unless nested.\ntype Dismissers = Set<\n\tReact.RefObject< ModalProps[ 'onRequestClose' ] | undefined >\n>;\nconst ModalContext = createContext< Dismissers >( new Set() );\nModalContext.displayName = 'ModalContext';\n\n// Used to track body class names applied while modals are open.\nconst bodyOpenClasses = new Map< string, number >();\n\nfunction UnforwardedModal(\n\tprops: ModalProps,\n\tforwardedRef: React.ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\tbodyOpenClassName = 'modal-open',\n\t\trole = 'dialog',\n\t\ttitle = null,\n\t\tfocusOnMount = true,\n\t\tshouldCloseOnEsc = true,\n\t\tshouldCloseOnClickOutside = true,\n\t\tisDismissible = true,\n\t\t/* Accessibility. */\n\t\taria = {\n\t\t\tlabelledby: undefined,\n\t\t\tdescribedby: undefined,\n\t\t},\n\t\tonRequestClose,\n\t\ticon,\n\t\tcloseButtonLabel,\n\t\tchildren,\n\t\tstyle,\n\t\toverlayClassName: overlayClassnameProp,\n\t\tclassName,\n\t\tcontentLabel,\n\t\tonKeyDown,\n\t\tisFullScreen = false,\n\t\tsize,\n\t\theaderActions = null,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\n\t// The focus hook does not support 'firstContentElement' but this is a valid\n\t// value for the Modal's focusOnMount prop. The following code ensures the focus\n\t// hook will focus the first focusable node within the element to which it is applied.\n\t// When `firstContentElement` is passed as the value of the focusOnMount prop,\n\t// the focus hook is applied to the Modal's content element.\n\t// Otherwise, the focus hook is applied to the Modal's ref. This ensures that the\n\t// focus hook will focus the first element in the Modal's **content** when\n\t// `firstContentElement` is passed.\n\tconst focusOnMountRef = useFocusOnMount(\n\t\tfocusOnMount === 'firstContentElement' ? 'firstElement' : focusOnMount\n\t);\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusReturnRef = useFocusReturn();\n\tconst contentRef = useRef< HTMLDivElement >( null );\n\tconst childrenContainerRef = useRef< HTMLDivElement >( null );\n\n\tconst [ hasScrolledContent, setHasScrolledContent ] = useState( false );\n\tconst [ hasScrollableContent, setHasScrollableContent ] = useState( false );\n\n\tlet sizeClass;\n\tif ( isFullScreen || size === 'fill' ) {\n\t\tsizeClass = 'is-full-screen';\n\t} else if ( size ) {\n\t\tsizeClass = `has-size-${ size }`;\n\t}\n\n\t// Determines whether the Modal content is scrollable and updates the state.\n\tconst isContentScrollable = useCallback( () => {\n\t\tif ( ! contentRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst closestScrollContainer = getScrollContainer( contentRef.current );\n\n\t\tif ( contentRef.current === closestScrollContainer ) {\n\t\t\tsetHasScrollableContent( true );\n\t\t} else {\n\t\t\tsetHasScrollableContent( false );\n\t\t}\n\t}, [ contentRef ] );\n\n\t// Accessibly isolates/unisolates the modal.\n\tuseEffect( () => {\n\t\tariaHelper.modalize( ref.current );\n\t\treturn () => ariaHelper.unmodalize();\n\t}, [] );\n\n\t// Keeps a fresh ref for the subsequent effect.\n\tconst onRequestCloseRef = useRef< ModalProps[ 'onRequestClose' ] >();\n\tuseEffect( () => {\n\t\tonRequestCloseRef.current = onRequestClose;\n\t}, [ onRequestClose ] );\n\n\t// The list of `onRequestClose` callbacks of open (non-nested) Modals. Only\n\t// one should remain open at a time and the list enables closing prior ones.\n\tconst dismissers = useContext( ModalContext );\n\t// Used for the tracking and dismissing any nested modals.\n\tconst [ nestedDismissers ] = useState< Dismissers >( () => new Set() );\n\n\t// Updates the stack tracking open modals at this level and calls\n\t// onRequestClose for any prior and/or nested modals as applicable.\n\tuseEffect( () => {\n\t\t// add this modal instance to the dismissers set\n\t\tdismissers.add( onRequestCloseRef );\n\t\t// request that all the other modals close themselves\n\t\tfor ( const dismisser of dismissers ) {\n\t\t\tif ( dismisser !== onRequestCloseRef ) {\n\t\t\t\tdismisser.current?.();\n\t\t\t}\n\t\t}\n\t\treturn () => {\n\t\t\t// request that all the nested modals close themselves\n\t\t\tfor ( const dismisser of nestedDismissers ) {\n\t\t\t\tdismisser.current?.();\n\t\t\t}\n\t\t\t// remove this modal instance from the dismissers set\n\t\t\tdismissers.delete( onRequestCloseRef );\n\t\t};\n\t}, [ dismissers, nestedDismissers ] );\n\n\t// Adds/removes the value of bodyOpenClassName to body element.\n\tuseEffect( () => {\n\t\tconst theClass = bodyOpenClassName;\n\t\tconst oneMore = 1 + ( bodyOpenClasses.get( theClass ) ?? 0 );\n\t\tbodyOpenClasses.set( theClass, oneMore );\n\t\tdocument.body.classList.add( bodyOpenClassName );\n\t\treturn () => {\n\t\t\tconst oneLess = bodyOpenClasses.get( theClass )! - 1;\n\t\t\tif ( oneLess === 0 ) {\n\t\t\t\tdocument.body.classList.remove( theClass );\n\t\t\t\tbodyOpenClasses.delete( theClass );\n\t\t\t} else {\n\t\t\t\tbodyOpenClasses.set( theClass, oneLess );\n\t\t\t}\n\t\t};\n\t}, [ bodyOpenClassName ] );\n\n\tconst { closeModal, frameRef, frameStyle, overlayClassname } =\n\t\tuseModalExitAnimation();\n\n\t// Calls the isContentScrollable callback when the Modal children container resizes.\n\tuseLayoutEffect( () => {\n\t\tif ( ! window.ResizeObserver || ! childrenContainerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst resizeObserver = new ResizeObserver( isContentScrollable );\n\t\tresizeObserver.observe( childrenContainerRef.current );\n\n\t\tisContentScrollable();\n\n\t\treturn () => {\n\t\t\tresizeObserver.disconnect();\n\t\t};\n\t}, [ isContentScrollable, childrenContainerRef ] );\n\n\tfunction handleEscapeKeyDown(\n\t\tevent: React.KeyboardEvent< HTMLDivElement >\n\t) {\n\t\tif (\n\t\t\tshouldCloseOnEsc &&\n\t\t\t( event.code === 'Escape' || event.key === 'Escape' ) &&\n\t\t\t! event.defaultPrevented\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tcloseModal().then( () => onRequestClose( event ) );\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: React.UIEvent< HTMLDivElement > ) => {\n\t\t\tconst scrollY = e?.currentTarget?.scrollTop ?? -1;\n\n\t\t\tif ( ! hasScrolledContent && scrollY > 0 ) {\n\t\t\t\tsetHasScrolledContent( true );\n\t\t\t} else if ( hasScrolledContent && scrollY <= 0 ) {\n\t\t\t\tsetHasScrolledContent( false );\n\t\t\t}\n\t\t},\n\t\t[ hasScrolledContent ]\n\t);\n\n\tlet pressTarget: EventTarget | null = null;\n\tconst overlayPressHandlers: {\n\t\tonPointerDown: React.PointerEventHandler< HTMLDivElement >;\n\t\tonPointerUp: React.PointerEventHandler< HTMLDivElement >;\n\t} = {\n\t\tonPointerDown: ( event ) => {\n\t\t\tif ( event.target === event.currentTarget ) {\n\t\t\t\tpressTarget = event.target;\n\t\t\t\t// Avoids focus changing so that focus return works as expected.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t// Closes the modal with two exceptions. 1. Opening the context menu on\n\t\t// the overlay. 2. Pressing on the overlay then dragging the pointer\n\t\t// over the modal and releasing. Due to the modal being a child of the\n\t\t// overlay, such a gesture is a `click` on the overlay and cannot be\n\t\t// excepted by a `click` handler. Thus the tactic of handling\n\t\t// `pointerup` and comparing its target to that of the `pointerdown`.\n\t\tonPointerUp: ( { target, button } ) => {\n\t\t\tconst isSameTarget = target === pressTarget;\n\t\t\tpressTarget = null;\n\t\t\tif ( button === 0 && isSameTarget ) {\n\t\t\t\tcloseModal().then( () => onRequestClose() );\n\t\t\t}\n\t\t},\n\t};\n\n\tconst modal = (\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div\n\t\t\tref={ useMergeRefs( [ ref, forwardedRef ] ) }\n\t\t\tclassName={ clsx(\n\t\t\t\t'components-modal__screen-overlay',\n\t\t\t\toverlayClassname,\n\t\t\t\toverlayClassnameProp\n\t\t\t) }\n\t\t\tonKeyDown={ withIgnoreIMEEvents( handleEscapeKeyDown ) }\n\t\t\t{ ...( shouldCloseOnClickOutside ? overlayPressHandlers : {} ) }\n\t\t>\n\t\t\t<StyleProvider document={ document }>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t'components-modal__frame',\n\t\t\t\t\t\tsizeClass,\n\t\t\t\t\t\tclassName\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t...frameStyle,\n\t\t\t\t\t\t...style,\n\t\t\t\t\t} }\n\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\tframeRef,\n\t\t\t\t\t\tconstrainedTabbingRef,\n\t\t\t\t\t\tfocusReturnRef,\n\t\t\t\t\t\tfocusOnMount !== 'firstContentElement'\n\t\t\t\t\t\t\t? focusOnMountRef\n\t\t\t\t\t\t\t: null,\n\t\t\t\t\t] ) }\n\t\t\t\t\trole={ role }\n\t\t\t\t\taria-label={ contentLabel }\n\t\t\t\t\taria-labelledby={ contentLabel ? undefined : headingId }\n\t\t\t\t\taria-describedby={ aria.describedby }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ clsx( 'components-modal__content', {\n\t\t\t\t\t\t\t'hide-header': __experimentalHideHeader,\n\t\t\t\t\t\t\t'is-scrollable': hasScrollableContent,\n\t\t\t\t\t\t\t'has-scrolled-content': hasScrolledContent,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\trole=\"document\"\n\t\t\t\t\t\tonScroll={ onContentContainerScroll }\n\t\t\t\t\t\tref={ contentRef }\n\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\thasScrollableContent\n\t\t\t\t\t\t\t\t? __( 'Scrollable section' )\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\ttabIndex={ hasScrollableContent ? 0 : undefined }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ! __experimentalHideHeader && (\n\t\t\t\t\t\t\t<div className=\"components-modal__header\">\n\t\t\t\t\t\t\t\t<div className=\"components-modal__header-heading-container\">\n\t\t\t\t\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__icon-container\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ icon }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ title && (\n\t\t\t\t\t\t\t\t\t\t<h1\n\t\t\t\t\t\t\t\t\t\t\tid={ headingId }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__header-heading\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{ headerActions }\n\t\t\t\t\t\t\t\t{ isDismissible && (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<Spacer\n\t\t\t\t\t\t\t\t\t\t\tmarginBottom={ 0 }\n\t\t\t\t\t\t\t\t\t\t\tmarginLeft={ 2 }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\t\t\t\t\tonClick={ (\n\t\t\t\t\t\t\t\t\t\t\t\tevent: React.MouseEvent< HTMLButtonElement >\n\t\t\t\t\t\t\t\t\t\t\t) =>\n\t\t\t\t\t\t\t\t\t\t\t\tcloseModal().then( () =>\n\t\t\t\t\t\t\t\t\t\t\t\t\tonRequestClose( event )\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel ||\n\t\t\t\t\t\t\t\t\t\t\t\t__( 'Close' )\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\t\t\tchildrenContainerRef,\n\t\t\t\t\t\t\t\tfocusOnMount === 'firstContentElement'\n\t\t\t\t\t\t\t\t\t? focusOnMountRef\n\t\t\t\t\t\t\t\t\t: null,\n\t\t\t\t\t\t\t] ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</StyleProvider>\n\t\t</div>\n\t);\n\n\treturn createPortal(\n\t\t<ModalContext.Provider value={ nestedDismissers }>\n\t\t\t{ modal }\n\t\t</ModalContext.Provider>,\n\t\tdocument.body\n\t);\n}\n\n/**\n * Modals give users information and choices related to a task they’re trying to\n * accomplish. They can contain critical information, require decisions, or\n * involve multiple tasks.\n *\n * ```jsx\n * import { Button, Modal } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyModal = () => {\n *   const [ isOpen, setOpen ] = useState( false );\n *   const openModal = () => setOpen( true );\n *   const closeModal = () => setOpen( false );\n *\n *   return (\n *     <>\n *       <Button variant=\"secondary\" onClick={ openModal }>\n *         Open Modal\n *       </Button>\n *       { isOpen && (\n *         <Modal title=\"This is my modal\" onRequestClose={ closeModal }>\n *           <Button variant=\"secondary\" onClick={ closeModal }>\n *             My custom close button\n *           </Button>\n *         </Modal>\n *       ) }\n *     </>\n *   );\n * };\n * ```\n */\nexport const Modal = forwardRef( UnforwardedModal );\n\nexport default Modal;\n"],"mappings":"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","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../src/modal/index.tsx"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { createPortal, useCallback, useEffect, useRef, useState, forwardRef, useLayoutEffect, createContext, useContext } from '@wordpress/element';\nimport { useInstanceId, useFocusReturn, useFocusOnMount, useConstrainedTabbing, useMergeRefs } from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { close } from '@wordpress/icons';\nimport { getScrollContainer } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport * as ariaHelper from './aria-helper';\nimport Button from '../button';\nimport StyleProvider from '../style-provider';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\nimport { Spacer } from '../spacer';\nimport { useModalExitAnimation } from './use-modal-exit-animation';\n\n// Used to track and dismiss the prior modal when another opens unless nested.\nimport { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nconst ModalContext = createContext(new Set());\nModalContext.displayName = 'ModalContext';\n\n// Used to track body class names applied while modals are open.\nconst bodyOpenClasses = new Map();\nfunction UnforwardedModal(props, forwardedRef) {\n  const {\n    bodyOpenClassName = 'modal-open',\n    role = 'dialog',\n    title = null,\n    focusOnMount = true,\n    shouldCloseOnEsc = true,\n    shouldCloseOnClickOutside = true,\n    isDismissible = true,\n    /* Accessibility. */\n    aria = {\n      labelledby: undefined,\n      describedby: undefined\n    },\n    onRequestClose,\n    icon,\n    closeButtonLabel,\n    children,\n    style,\n    overlayClassName: overlayClassnameProp,\n    className,\n    contentLabel,\n    onKeyDown,\n    isFullScreen = false,\n    size,\n    headerActions = null,\n    __experimentalHideHeader = false\n  } = props;\n  const ref = useRef();\n  const instanceId = useInstanceId(Modal);\n  const headingId = title ? `components-modal-header-${instanceId}` : aria.labelledby;\n\n  // The focus hook does not support 'firstContentElement' but this is a valid\n  // value for the Modal's focusOnMount prop. The following code ensures the focus\n  // hook will focus the first focusable node within the element to which it is applied.\n  // When `firstContentElement` is passed as the value of the focusOnMount prop,\n  // the focus hook is applied to the Modal's content element.\n  // Otherwise, the focus hook is applied to the Modal's ref. This ensures that the\n  // focus hook will focus the first element in the Modal's **content** when\n  // `firstContentElement` is passed.\n  const focusOnMountRef = useFocusOnMount(focusOnMount === 'firstContentElement' ? 'firstElement' : focusOnMount);\n  const constrainedTabbingRef = useConstrainedTabbing();\n  const focusReturnRef = useFocusReturn();\n  const contentRef = useRef(null);\n  const childrenContainerRef = useRef(null);\n  const [hasScrolledContent, setHasScrolledContent] = useState(false);\n  const [hasScrollableContent, setHasScrollableContent] = useState(false);\n  let sizeClass;\n  if (isFullScreen || size === 'fill') {\n    sizeClass = 'is-full-screen';\n  } else if (size) {\n    sizeClass = `has-size-${size}`;\n  }\n\n  // Determines whether the Modal content is scrollable and updates the state.\n  const isContentScrollable = useCallback(() => {\n    if (!contentRef.current) {\n      return;\n    }\n    const closestScrollContainer = getScrollContainer(contentRef.current);\n    if (contentRef.current === closestScrollContainer) {\n      setHasScrollableContent(true);\n    } else {\n      setHasScrollableContent(false);\n    }\n  }, [contentRef]);\n\n  // Accessibly isolates/unisolates the modal.\n  useEffect(() => {\n    ariaHelper.modalize(ref.current);\n    return () => ariaHelper.unmodalize();\n  }, []);\n\n  // Keeps a fresh ref for the subsequent effect.\n  const onRequestCloseRef = useRef();\n  useEffect(() => {\n    onRequestCloseRef.current = onRequestClose;\n  }, [onRequestClose]);\n\n  // The list of `onRequestClose` callbacks of open (non-nested) Modals. Only\n  // one should remain open at a time and the list enables closing prior ones.\n  const dismissers = useContext(ModalContext);\n  // Used for the tracking and dismissing any nested modals.\n  const [nestedDismissers] = useState(() => new Set());\n\n  // Updates the stack tracking open modals at this level and calls\n  // onRequestClose for any prior and/or nested modals as applicable.\n  useEffect(() => {\n    // add this modal instance to the dismissers set\n    dismissers.add(onRequestCloseRef);\n    // request that all the other modals close themselves\n    for (const dismisser of dismissers) {\n      if (dismisser !== onRequestCloseRef) {\n        dismisser.current?.();\n      }\n    }\n    return () => {\n      // request that all the nested modals close themselves\n      for (const dismisser of nestedDismissers) {\n        dismisser.current?.();\n      }\n      // remove this modal instance from the dismissers set\n      dismissers.delete(onRequestCloseRef);\n    };\n  }, [dismissers, nestedDismissers]);\n\n  // Adds/removes the value of bodyOpenClassName to body element.\n  useEffect(() => {\n    var _bodyOpenClasses$get;\n    const theClass = bodyOpenClassName;\n    const oneMore = 1 + ((_bodyOpenClasses$get = bodyOpenClasses.get(theClass)) !== null && _bodyOpenClasses$get !== void 0 ? _bodyOpenClasses$get : 0);\n    bodyOpenClasses.set(theClass, oneMore);\n    document.body.classList.add(bodyOpenClassName);\n    return () => {\n      const oneLess = bodyOpenClasses.get(theClass) - 1;\n      if (oneLess === 0) {\n        document.body.classList.remove(theClass);\n        bodyOpenClasses.delete(theClass);\n      } else {\n        bodyOpenClasses.set(theClass, oneLess);\n      }\n    };\n  }, [bodyOpenClassName]);\n  const {\n    closeModal,\n    frameRef,\n    frameStyle,\n    overlayClassname\n  } = useModalExitAnimation();\n\n  // Calls the isContentScrollable callback when the Modal children container resizes.\n  useLayoutEffect(() => {\n    if (!window.ResizeObserver || !childrenContainerRef.current) {\n      return;\n    }\n    const resizeObserver = new ResizeObserver(isContentScrollable);\n    resizeObserver.observe(childrenContainerRef.current);\n    isContentScrollable();\n    return () => {\n      resizeObserver.disconnect();\n    };\n  }, [isContentScrollable, childrenContainerRef]);\n  function handleEscapeKeyDown(event) {\n    if (shouldCloseOnEsc && (event.code === 'Escape' || event.key === 'Escape') && !event.defaultPrevented) {\n      event.preventDefault();\n      closeModal().then(() => onRequestClose(event));\n    }\n  }\n  const onContentContainerScroll = useCallback(e => {\n    var _e$currentTarget$scro;\n    const scrollY = (_e$currentTarget$scro = e?.currentTarget?.scrollTop) !== null && _e$currentTarget$scro !== void 0 ? _e$currentTarget$scro : -1;\n    if (!hasScrolledContent && scrollY > 0) {\n      setHasScrolledContent(true);\n    } else if (hasScrolledContent && scrollY <= 0) {\n      setHasScrolledContent(false);\n    }\n  }, [hasScrolledContent]);\n  let pressTarget = null;\n  const overlayPressHandlers = {\n    onPointerDown: event => {\n      if (event.target === event.currentTarget) {\n        pressTarget = event.target;\n        // Avoids focus changing so that focus return works as expected.\n        event.preventDefault();\n      }\n    },\n    // Closes the modal with two exceptions. 1. Opening the context menu on\n    // the overlay. 2. Pressing on the overlay then dragging the pointer\n    // over the modal and releasing. Due to the modal being a child of the\n    // overlay, such a gesture is a `click` on the overlay and cannot be\n    // excepted by a `click` handler. Thus the tactic of handling\n    // `pointerup` and comparing its target to that of the `pointerdown`.\n    onPointerUp: ({\n      target,\n      button\n    }) => {\n      const isSameTarget = target === pressTarget;\n      pressTarget = null;\n      if (button === 0 && isSameTarget) {\n        closeModal().then(() => onRequestClose());\n      }\n    }\n  };\n  const modal =\n  /*#__PURE__*/\n  // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n  _jsx(\"div\", {\n    ref: useMergeRefs([ref, forwardedRef]),\n    className: clsx('components-modal__screen-overlay', overlayClassname, overlayClassnameProp),\n    onKeyDown: withIgnoreIMEEvents(handleEscapeKeyDown),\n    ...(shouldCloseOnClickOutside ? overlayPressHandlers : {}),\n    children: /*#__PURE__*/_jsx(StyleProvider, {\n      document: document,\n      children: /*#__PURE__*/_jsx(\"div\", {\n        className: clsx('components-modal__frame', sizeClass, className),\n        style: {\n          ...frameStyle,\n          ...style\n        },\n        ref: useMergeRefs([frameRef, constrainedTabbingRef, focusReturnRef, focusOnMount !== 'firstContentElement' ? focusOnMountRef : null]),\n        role: role,\n        \"aria-label\": contentLabel,\n        \"aria-labelledby\": contentLabel ? undefined : headingId,\n        \"aria-describedby\": aria.describedby,\n        tabIndex: -1,\n        onKeyDown: onKeyDown,\n        children: /*#__PURE__*/_jsxs(\"div\", {\n          className: clsx('components-modal__content', {\n            'hide-header': __experimentalHideHeader,\n            'is-scrollable': hasScrollableContent,\n            'has-scrolled-content': hasScrolledContent\n          }),\n          role: \"document\",\n          onScroll: onContentContainerScroll,\n          ref: contentRef,\n          \"aria-label\": hasScrollableContent ? __('Scrollable section') : undefined,\n          tabIndex: hasScrollableContent ? 0 : undefined,\n          children: [!__experimentalHideHeader && /*#__PURE__*/_jsxs(\"div\", {\n            className: \"components-modal__header\",\n            children: [/*#__PURE__*/_jsxs(\"div\", {\n              className: \"components-modal__header-heading-container\",\n              children: [icon && /*#__PURE__*/_jsx(\"span\", {\n                className: \"components-modal__icon-container\",\n                \"aria-hidden\": true,\n                children: icon\n              }), title && /*#__PURE__*/_jsx(\"h1\", {\n                id: headingId,\n                className: \"components-modal__header-heading\",\n                children: title\n              })]\n            }), headerActions, isDismissible && /*#__PURE__*/_jsxs(_Fragment, {\n              children: [/*#__PURE__*/_jsx(Spacer, {\n                marginBottom: 0,\n                marginLeft: 2\n              }), /*#__PURE__*/_jsx(Button, {\n                size: \"compact\",\n                onClick: event => closeModal().then(() => onRequestClose(event)),\n                icon: close,\n                label: closeButtonLabel || __('Close')\n              })]\n            })]\n          }), /*#__PURE__*/_jsx(\"div\", {\n            ref: useMergeRefs([childrenContainerRef, focusOnMount === 'firstContentElement' ? focusOnMountRef : null]),\n            children: children\n          })]\n        })\n      })\n    })\n  });\n  return createPortal(/*#__PURE__*/_jsx(ModalContext.Provider, {\n    value: nestedDismissers,\n    children: modal\n  }), document.body);\n}\n\n/**\n * Modals give users information and choices related to a task they\u2019re trying to\n * accomplish. They can contain critical information, require decisions, or\n * involve multiple tasks.\n *\n * ```jsx\n * import { Button, Modal } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyModal = () => {\n *   const [ isOpen, setOpen ] = useState( false );\n *   const openModal = () => setOpen( true );\n *   const closeModal = () => setOpen( false );\n *\n *   return (\n *     <>\n *       <Button variant=\"secondary\" onClick={ openModal }>\n *         Open Modal\n *       </Button>\n *       { isOpen && (\n *         <Modal title=\"This is my modal\" onRequestClose={ closeModal }>\n *           <Button variant=\"secondary\" onClick={ closeModal }>\n *             My custom close button\n *           </Button>\n *         </Modal>\n *       ) }\n *     </>\n *   );\n * };\n * ```\n */\nexport const Modal = forwardRef(UnforwardedModal);\nexport default Modal;"],
+  "mappings": "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",
+  "names": []
+}

package/build-module/modal/types.js

@@ -1,2 +1 @@
-export {};
-//# sourceMappingURL=types.js.map
+//# sourceMappingURL=types.js.map

package/build-module/modal/types.js.map

@@ -1 +1,7 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/modal/types.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport type { useFocusOnMount } from '@wordpress/compose';\n\nexport type ModalProps = {\n\taria?: {\n\t\t/**\n\t\t * If this property is added, it will be added to the modal content\n\t\t * `div` as `aria-describedby`.\n\t\t */\n\t\tdescribedby?: string;\n\t\t/**\n\t\t * If this property is added, it will be added to the modal content\n\t\t * `div` as `aria-labelledby`. Use this when you are rendering the title\n\t\t * yourself within the modal's content area instead of using the `title`\n\t\t * prop. This ensures the title is usable by assistive technology.\n\t\t *\n\t\t * Titles are required for accessibility reasons, see `contentLabel` and\n\t\t * `title` for other ways to provide a title.\n\t\t */\n\t\tlabelledby?: string;\n\t};\n\t/**\n\t * Class name added to the body element when the modal is open.\n\t *\n\t * @default 'modal-open'\n\t */\n\tbodyOpenClassName?: string;\n\t/**\n\t * The children elements.\n\t */\n\tchildren: React.ReactNode;\n\t/**\n\t * If this property is added, it will an additional class name to the modal\n\t * content `div`.\n\t */\n\tclassName?: string;\n\t/**\n\t * Label on the close button.\n\t *\n\t * @default `__( 'Close' )`\n\t */\n\tcloseButtonLabel?: string;\n\t/**\n\t * If this property is added, it will be added to the modal content `div` as\n\t * `aria-label`.\n\t *\n\t * Titles are required for accessibility reasons, see `aria.labelledby` and\n\t * `title` for other ways to provide a title.\n\t */\n\tcontentLabel?: string;\n\t/**\n\t * If this property is true, it will focus the first tabbable element\n\t * rendered in the modal.\n\t *\n\t * @default true\n\t */\n\tfocusOnMount?:\n\t\t| Parameters< typeof useFocusOnMount >[ 0 ]\n\t\t| 'firstContentElement';\n\t/**\n\t * Elements that are injected into the modal header to the left of the close button (if rendered).\n\t * Hidden if `__experimentalHideHeader` is `true`.\n\t *\n\t * @default null\n\t */\n\theaderActions?: React.ReactNode;\n\n\t/**\n\t * If this property is added, an icon will be added before the title.\n\t */\n\ticon?: JSX.Element;\n\t/**\n\t * If this property is set to false, the modal will not display a close icon\n\t * and cannot be dismissed.\n\t *\n\t * @default true\n\t */\n\tisDismissible?: boolean;\n\t/**\n\t * This property when set to `true` will render a full screen modal.\n\t *\n\t * @default false\n\t */\n\tisFullScreen?: boolean;\n\t/**\n\t * If this property is added it will cause the modal to render at a preset\n\t * width, or expand to fill the screen. This prop will be ignored if\n\t * `isFullScreen` is set to `true`.\n\t *\n\t * Note: `Modal`'s width can also be controlled by adjusting the width of the\n\t * modal's contents, or via CSS using the `style` prop.\n\t */\n\tsize?: 'small' | 'medium' | 'large' | 'fill';\n\t/**\n\t *  Handle the key down on the modal frame `div`.\n\t */\n\tonKeyDown?: React.KeyboardEventHandler< HTMLDivElement >;\n\t/**\n\t * This function is called to indicate that the modal should be closed.\n\t */\n\tonRequestClose: (\n\t\tevent?: React.KeyboardEvent< HTMLDivElement > | React.SyntheticEvent\n\t) => void;\n\t/**\n\t * If this property is added, it will an additional class name to the modal\n\t * overlay `div`.\n\t */\n\toverlayClassName?: string;\n\t/**\n\t * If this property is added, it will override the default role of the\n\t * modal.\n\t *\n\t * @default 'dialog'\n\t */\n\trole?: React.AriaRole;\n\t/**\n\t * If this property is added, it will determine whether the modal requests\n\t * to close when a mouse click occurs outside of the modal content.\n\t *\n\t * @default true\n\t */\n\tshouldCloseOnClickOutside?: boolean;\n\t/**\n\t * If this property is added, it will determine whether the modal requests\n\t * to close when the escape key is pressed.\n\t *\n\t * @default true\n\t */\n\tshouldCloseOnEsc?: boolean;\n\t/**\n\t * If this property is added, it will be added to the modal frame `div`.\n\t */\n\tstyle?: React.CSSProperties;\n\t/**\n\t * This property is used as the modal header's title.\n\t *\n\t * Titles are required for accessibility reasons, see `aria.labelledby` and\n\t * `contentLabel` for other ways to provide a title.\n\t */\n\ttitle?: string;\n\t/**\n\t * When set to `true`, the Modal's header (including the icon, title and\n\t * close button) will not be rendered.\n\t *\n\t * _Warning_: This property is still experimental. “Experimental” means this\n\t * is an early implementation subject to drastic and breaking changes.\n\t *\n\t * @default false\n\t */\n\t__experimentalHideHeader?: boolean;\n};\n"],"mappings":"","ignoreList":[]}
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/build-module/modal/use-modal-exit-animation.js

@@ -1,26 +1,15 @@
-/**
- * WordPress dependencies
- */
-import { useReducedMotion } from '@wordpress/compose';
-import { useCallback, useRef, useState } from '@wordpress/element';
-
-/**
- * Internal dependencies
- */
-import { CONFIG } from '../utils';
-import warning from '@wordpress/warning';
-
-// Animation duration (ms) extracted to JS in order to be used on a setTimeout.
+import { useReducedMotion } from "@wordpress/compose";
+import { useCallback, useRef, useState } from "@wordpress/element";
+import { CONFIG } from "../utils";
+import warning from "@wordpress/warning";
 const FRAME_ANIMATION_DURATION = CONFIG.transitionDuration;
 const FRAME_ANIMATION_DURATION_NUMBER = Number.parseInt(CONFIG.transitionDuration);
-const EXIT_ANIMATION_NAME = 'components-modal__disappear-animation';
-export function useModalExitAnimation() {
+const EXIT_ANIMATION_NAME = "components-modal__disappear-animation";
+function useModalExitAnimation() {
   const frameRef = useRef();
   const [isAnimatingOut, setIsAnimatingOut] = useState(false);
   const isReducedMotion = useReducedMotion();
-  const closeModal = useCallback(() => new Promise(closeModalResolve => {
-    // Grab a "stable" reference of the frame element, since
-    // the value held by the react ref might change at runtime.
+  const closeModal = useCallback(() => new Promise((closeModalResolve) => {
     const frameEl = frameRef.current;
     if (isReducedMotion) {
       closeModalResolve();
@@ -32,37 +21,42 @@ export function useModalExitAnimation() {
       return;
     }
     let handleAnimationEnd;
-    const startAnimation = () => new Promise(animationResolve => {
-      handleAnimationEnd = e => {
+    const startAnimation = () => new Promise((animationResolve) => {
+      handleAnimationEnd = (e) => {
         if (e.animationName === EXIT_ANIMATION_NAME) {
           animationResolve();
         }
       };
-      frameEl.addEventListener('animationend', handleAnimationEnd);
+      frameEl.addEventListener("animationend", handleAnimationEnd);
       setIsAnimatingOut(true);
     });
-    const animationTimeout = () => new Promise(timeoutResolve => {
-      setTimeout(() => timeoutResolve(),
-      // Allow an extra 20% of the animation duration for the
-      // animationend event to fire, in case the animation frame is
-      // slightly delayes by some other events in the event loop.
-      FRAME_ANIMATION_DURATION_NUMBER * 1.2);
+    const animationTimeout = () => new Promise((timeoutResolve) => {
+      setTimeout(
+        () => timeoutResolve(),
+        // Allow an extra 20% of the animation duration for the
+        // animationend event to fire, in case the animation frame is
+        // slightly delayes by some other events in the event loop.
+        FRAME_ANIMATION_DURATION_NUMBER * 1.2
+      );
     });
     Promise.race([startAnimation(), animationTimeout()]).then(() => {
       if (handleAnimationEnd) {
-        frameEl.removeEventListener('animationend', handleAnimationEnd);
+        frameEl.removeEventListener("animationend", handleAnimationEnd);
       }
       setIsAnimatingOut(false);
       closeModalResolve();
     });
   }), [isReducedMotion]);
   return {
-    overlayClassname: isAnimatingOut ? 'is-animating-out' : undefined,
+    overlayClassname: isAnimatingOut ? "is-animating-out" : void 0,
     frameRef,
     frameStyle: {
-      '--modal-frame-animation-duration': `${FRAME_ANIMATION_DURATION}`
+      "--modal-frame-animation-duration": `${FRAME_ANIMATION_DURATION}`
     },
     closeModal
   };
 }
-//# sourceMappingURL=use-modal-exit-animation.js.map
+export {
+  useModalExitAnimation
+};
+//# sourceMappingURL=use-modal-exit-animation.js.map

package/build-module/modal/use-modal-exit-animation.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["useReducedMotion","useCallback","useRef","useState","CONFIG","warning","FRAME_ANIMATION_DURATION","transitionDuration","FRAME_ANIMATION_DURATION_NUMBER","Number","parseInt","EXIT_ANIMATION_NAME","useModalExitAnimation","frameRef","isAnimatingOut","setIsAnimatingOut","isReducedMotion","closeModal","Promise","closeModalResolve","frameEl","current","globalThis","SCRIPT_DEBUG","handleAnimationEnd","startAnimation","animationResolve","e","animationName","addEventListener","animationTimeout","timeoutResolve","setTimeout","race","then","removeEventListener","overlayClassname","undefined","frameStyle"],"sources":["@wordpress/components/src/modal/use-modal-exit-animation.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useReducedMotion } from '@wordpress/compose';\nimport { useCallback, useRef, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { CONFIG } from '../utils';\nimport warning from '@wordpress/warning';\n\n// Animation duration (ms) extracted to JS in order to be used on a setTimeout.\nconst FRAME_ANIMATION_DURATION = CONFIG.transitionDuration;\nconst FRAME_ANIMATION_DURATION_NUMBER = Number.parseInt(\n\tCONFIG.transitionDuration\n);\n\nconst EXIT_ANIMATION_NAME = 'components-modal__disappear-animation';\n\nexport function useModalExitAnimation() {\n\tconst frameRef = useRef< HTMLDivElement >();\n\tconst [ isAnimatingOut, setIsAnimatingOut ] = useState( false );\n\tconst isReducedMotion = useReducedMotion();\n\n\tconst closeModal = useCallback(\n\t\t() =>\n\t\t\tnew Promise< void >( ( closeModalResolve ) => {\n\t\t\t\t// Grab a \"stable\" reference of the frame element, since\n\t\t\t\t// the value held by the react ref might change at runtime.\n\t\t\t\tconst frameEl = frameRef.current;\n\n\t\t\t\tif ( isReducedMotion ) {\n\t\t\t\t\tcloseModalResolve();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tif ( ! frameEl ) {\n\t\t\t\t\twarning(\n\t\t\t\t\t\t\"wp.components.Modal: the Modal component can't be closed with an exit animation because of a missing reference to the modal frame element.\"\n\t\t\t\t\t);\n\t\t\t\t\tcloseModalResolve();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tlet handleAnimationEnd:\n\t\t\t\t\t| undefined\n\t\t\t\t\t| ( ( e: AnimationEvent ) => void );\n\n\t\t\t\tconst startAnimation = () =>\n\t\t\t\t\tnew Promise< void >( ( animationResolve ) => {\n\t\t\t\t\t\thandleAnimationEnd = ( e: AnimationEvent ) => {\n\t\t\t\t\t\t\tif ( e.animationName === EXIT_ANIMATION_NAME ) {\n\t\t\t\t\t\t\t\tanimationResolve();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\tframeEl.addEventListener(\n\t\t\t\t\t\t\t'animationend',\n\t\t\t\t\t\t\thandleAnimationEnd\n\t\t\t\t\t\t);\n\t\t\t\t\t\tsetIsAnimatingOut( true );\n\t\t\t\t\t} );\n\t\t\t\tconst animationTimeout = () =>\n\t\t\t\t\tnew Promise< void >( ( timeoutResolve ) => {\n\t\t\t\t\t\tsetTimeout(\n\t\t\t\t\t\t\t() => timeoutResolve(),\n\t\t\t\t\t\t\t// Allow an extra 20% of the animation duration for the\n\t\t\t\t\t\t\t// animationend event to fire, in case the animation frame is\n\t\t\t\t\t\t\t// slightly delayes by some other events in the event loop.\n\t\t\t\t\t\t\tFRAME_ANIMATION_DURATION_NUMBER * 1.2\n\t\t\t\t\t\t);\n\t\t\t\t\t} );\n\n\t\t\t\tPromise.race( [ startAnimation(), animationTimeout() ] ).then(\n\t\t\t\t\t() => {\n\t\t\t\t\t\tif ( handleAnimationEnd ) {\n\t\t\t\t\t\t\tframeEl.removeEventListener(\n\t\t\t\t\t\t\t\t'animationend',\n\t\t\t\t\t\t\t\thandleAnimationEnd\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t\tsetIsAnimatingOut( false );\n\t\t\t\t\t\tcloseModalResolve();\n\t\t\t\t\t}\n\t\t\t\t);\n\t\t\t} ),\n\t\t[ isReducedMotion ]\n\t);\n\n\treturn {\n\t\toverlayClassname: isAnimatingOut ? 'is-animating-out' : undefined,\n\t\tframeRef,\n\t\tframeStyle: {\n\t\t\t'--modal-frame-animation-duration': `${ FRAME_ANIMATION_DURATION }`,\n\t\t},\n\t\tcloseModal,\n\t};\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,gBAAgB,QAAQ,oBAAoB;AACrD,SAASC,WAAW,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,oBAAoB;;AAElE;AACA;AACA;AACA,SAASC,MAAM,QAAQ,UAAU;AACjC,OAAOC,OAAO,MAAM,oBAAoB;;AAExC;AACA,MAAMC,wBAAwB,GAAGF,MAAM,CAACG,kBAAkB;AAC1D,MAAMC,+BAA+B,GAAGC,MAAM,CAACC,QAAQ,CACtDN,MAAM,CAACG,kBACR,CAAC;AAED,MAAMI,mBAAmB,GAAG,uCAAuC;AAEnE,OAAO,SAASC,qBAAqBA,CAAA,EAAG;EACvC,MAAMC,QAAQ,GAAGX,MAAM,CAAmB,CAAC;EAC3C,MAAM,CAAEY,cAAc,EAAEC,iBAAiB,CAAE,GAAGZ,QAAQ,CAAE,KAAM,CAAC;EAC/D,MAAMa,eAAe,GAAGhB,gBAAgB,CAAC,CAAC;EAE1C,MAAMiB,UAAU,GAAGhB,WAAW,CAC7B,MACC,IAAIiB,OAAO,CAAYC,iBAAiB,IAAM;IAC7C;IACA;IACA,MAAMC,OAAO,GAAGP,QAAQ,CAACQ,OAAO;IAEhC,IAAKL,eAAe,EAAG;MACtBG,iBAAiB,CAAC,CAAC;MACnB;IACD;IAEA,IAAK,CAAEC,OAAO,EAAG;MAChBE,UAAA,CAAAC,YAAA,YAAAlB,OAAO,CACN,4IACD,CAAC;MACDc,iBAAiB,CAAC,CAAC;MACnB;IACD;IAEA,IAAIK,kBAEgC;IAEpC,MAAMC,cAAc,GAAGA,CAAA,KACtB,IAAIP,OAAO,CAAYQ,gBAAgB,IAAM;MAC5CF,kBAAkB,GAAKG,CAAiB,IAAM;QAC7C,IAAKA,CAAC,CAACC,aAAa,KAAKjB,mBAAmB,EAAG;UAC9Ce,gBAAgB,CAAC,CAAC;QACnB;MACD,CAAC;MAEDN,OAAO,CAACS,gBAAgB,CACvB,cAAc,EACdL,kBACD,CAAC;MACDT,iBAAiB,CAAE,IAAK,CAAC;IAC1B,CAAE,CAAC;IACJ,MAAMe,gBAAgB,GAAGA,CAAA,KACxB,IAAIZ,OAAO,CAAYa,cAAc,IAAM;MAC1CC,UAAU,CACT,MAAMD,cAAc,CAAC,CAAC;MACtB;MACA;MACA;MACAvB,+BAA+B,GAAG,GACnC,CAAC;IACF,CAAE,CAAC;IAEJU,OAAO,CAACe,IAAI,CAAE,CAAER,cAAc,CAAC,CAAC,EAAEK,gBAAgB,CAAC,CAAC,CAAG,CAAC,CAACI,IAAI,CAC5D,MAAM;MACL,IAAKV,kBAAkB,EAAG;QACzBJ,OAAO,CAACe,mBAAmB,CAC1B,cAAc,EACdX,kBACD,CAAC;MACF;MACAT,iBAAiB,CAAE,KAAM,CAAC;MAC1BI,iBAAiB,CAAC,CAAC;IACpB,CACD,CAAC;EACF,CAAE,CAAC,EACJ,CAAEH,eAAe,CAClB,CAAC;EAED,OAAO;IACNoB,gBAAgB,EAAEtB,cAAc,GAAG,kBAAkB,GAAGuB,SAAS;IACjExB,QAAQ;IACRyB,UAAU,EAAE;MACX,kCAAkC,EAAE,GAAIhC,wBAAwB;IACjE,CAAC;IACDW;EACD,CAAC;AACF","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../src/modal/use-modal-exit-animation.ts"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useReducedMotion } from '@wordpress/compose';\nimport { useCallback, useRef, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { CONFIG } from '../utils';\nimport warning from '@wordpress/warning';\n\n// Animation duration (ms) extracted to JS in order to be used on a setTimeout.\nconst FRAME_ANIMATION_DURATION = CONFIG.transitionDuration;\nconst FRAME_ANIMATION_DURATION_NUMBER = Number.parseInt(CONFIG.transitionDuration);\nconst EXIT_ANIMATION_NAME = 'components-modal__disappear-animation';\nexport function useModalExitAnimation() {\n  const frameRef = useRef();\n  const [isAnimatingOut, setIsAnimatingOut] = useState(false);\n  const isReducedMotion = useReducedMotion();\n  const closeModal = useCallback(() => new Promise(closeModalResolve => {\n    // Grab a \"stable\" reference of the frame element, since\n    // the value held by the react ref might change at runtime.\n    const frameEl = frameRef.current;\n    if (isReducedMotion) {\n      closeModalResolve();\n      return;\n    }\n    if (!frameEl) {\n      globalThis.SCRIPT_DEBUG === true ? warning(\"wp.components.Modal: the Modal component can't be closed with an exit animation because of a missing reference to the modal frame element.\") : void 0;\n      closeModalResolve();\n      return;\n    }\n    let handleAnimationEnd;\n    const startAnimation = () => new Promise(animationResolve => {\n      handleAnimationEnd = e => {\n        if (e.animationName === EXIT_ANIMATION_NAME) {\n          animationResolve();\n        }\n      };\n      frameEl.addEventListener('animationend', handleAnimationEnd);\n      setIsAnimatingOut(true);\n    });\n    const animationTimeout = () => new Promise(timeoutResolve => {\n      setTimeout(() => timeoutResolve(),\n      // Allow an extra 20% of the animation duration for the\n      // animationend event to fire, in case the animation frame is\n      // slightly delayes by some other events in the event loop.\n      FRAME_ANIMATION_DURATION_NUMBER * 1.2);\n    });\n    Promise.race([startAnimation(), animationTimeout()]).then(() => {\n      if (handleAnimationEnd) {\n        frameEl.removeEventListener('animationend', handleAnimationEnd);\n      }\n      setIsAnimatingOut(false);\n      closeModalResolve();\n    });\n  }), [isReducedMotion]);\n  return {\n    overlayClassname: isAnimatingOut ? 'is-animating-out' : undefined,\n    frameRef,\n    frameStyle: {\n      '--modal-frame-animation-duration': `${FRAME_ANIMATION_DURATION}`\n    },\n    closeModal\n  };\n}"],
+  "mappings": "AAGA,SAAS,wBAAwB;AACjC,SAAS,aAAa,QAAQ,gBAAgB;AAK9C,SAAS,cAAc;AACvB,OAAO,aAAa;AAGpB,MAAM,2BAA2B,OAAO;AACxC,MAAM,kCAAkC,OAAO,SAAS,OAAO,kBAAkB;AACjF,MAAM,sBAAsB;AACrB,SAAS,wBAAwB;AACtC,QAAM,WAAW,OAAO;AACxB,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,SAAS,KAAK;AAC1D,QAAM,kBAAkB,iBAAiB;AACzC,QAAM,aAAa,YAAY,MAAM,IAAI,QAAQ,uBAAqB;AAGpE,UAAM,UAAU,SAAS;AACzB,QAAI,iBAAiB;AACnB,wBAAkB;AAClB;AAAA,IACF;AACA,QAAI,CAAC,SAAS;AACZ,iBAAW,iBAAiB,OAAO,QAAQ,4IAA4I,IAAI;AAC3L,wBAAkB;AAClB;AAAA,IACF;AACA,QAAI;AACJ,UAAM,iBAAiB,MAAM,IAAI,QAAQ,sBAAoB;AAC3D,2BAAqB,OAAK;AACxB,YAAI,EAAE,kBAAkB,qBAAqB;AAC3C,2BAAiB;AAAA,QACnB;AAAA,MACF;AACA,cAAQ,iBAAiB,gBAAgB,kBAAkB;AAC3D,wBAAkB,IAAI;AAAA,IACxB,CAAC;AACD,UAAM,mBAAmB,MAAM,IAAI,QAAQ,oBAAkB;AAC3D;AAAA,QAAW,MAAM,eAAe;AAAA;AAAA;AAAA;AAAA,QAIhC,kCAAkC;AAAA,MAAG;AAAA,IACvC,CAAC;AACD,YAAQ,KAAK,CAAC,eAAe,GAAG,iBAAiB,CAAC,CAAC,EAAE,KAAK,MAAM;AAC9D,UAAI,oBAAoB;AACtB,gBAAQ,oBAAoB,gBAAgB,kBAAkB;AAAA,MAChE;AACA,wBAAkB,KAAK;AACvB,wBAAkB;AAAA,IACpB,CAAC;AAAA,EACH,CAAC,GAAG,CAAC,eAAe,CAAC;AACrB,SAAO;AAAA,IACL,kBAAkB,iBAAiB,qBAAqB;AAAA,IACxD;AAAA,IACA,YAAY;AAAA,MACV,oCAAoC,GAAG,wBAAwB;AAAA,IACjE;AAAA,IACA;AAAA,EACF;AACF;",
+  "names": []
+}