@wordpress/components 27.6.0 → 28.0.1

package/build/mobile/utils/use-unit-converter-to-mobile.native.js

@@ -1,13 +1,11 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useConvertUnitToMobile = exports.getValueAndUnit = exports.convertUnitToMobile = void 0;
 var _reactNative = require("react-native");
 var _element = require("@wordpress/element");
-var _globalStylesContext = _interopRequireDefault(require("../global-styles-context"));
 /**
  * External dependencies
  */
@@ -16,10 +14,6 @@ var _globalStylesContext = _interopRequireDefault(require("../global-styles-cont
  * WordPress dependencies
  */
 
-/**
- * Internal dependencies
- */
-
 const getValueAndUnit = (value, unit) => {
   const regex = /(\d+\.?\d*)(.*)/;
   const splitValue = `${value}`?.match(regex)?.filter(v => v !== '');
@@ -66,10 +60,7 @@ const convertUnitToMobile = (containerSize, globalStyles, value, unit) => {
   }
 };
 exports.convertUnitToMobile = convertUnitToMobile;
-const useConvertUnitToMobile = (value, unit) => {
-  const {
-    globalStyles: styles
-  } = (0, _element.useContext)(_globalStylesContext.default);
+const useConvertUnitToMobile = (value, unit, styles) => {
   const [windowSizes, setWindowSizes] = (0, _element.useState)(_reactNative.Dimensions.get('window'));
   (0, _element.useEffect)(() => {
     const dimensionsChangeSubscription = _reactNative.Dimensions.addEventListener('change', onDimensionsChange);

package/build/mobile/utils/use-unit-converter-to-mobile.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["_reactNative","require","_element","_globalStylesContext","_interopRequireDefault","getValueAndUnit","value","unit","regex","splitValue","match","filter","v","valueToConvert","valueUnit","undefined","exports","convertUnitToMobile","containerSize","globalStyles","width","height","fontSize","Number","vw","Math","round","vh","useConvertUnitToMobile","styles","useContext","GlobalStylesContext","windowSizes","setWindowSizes","useState","Dimensions","get","useEffect","dimensionsChangeSubscription","addEventListener","onDimensionsChange","remove","useCallback","window","useMemo"],"sources":["@wordpress/components/src/mobile/utils/use-unit-converter-to-mobile.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { Dimensions } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseContext,\n\tuseEffect,\n\tuseState,\n\tuseMemo,\n\tuseCallback,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport GlobalStylesContext from '../global-styles-context';\n\nconst getValueAndUnit = ( value, unit ) => {\n\tconst regex = /(\\d+\\.?\\d*)(.*)/;\n\n\tconst splitValue = `${ value }`\n\t\t?.match( regex )\n\t\t?.filter( ( v ) => v !== '' );\n\n\tif ( splitValue ) {\n\t\treturn {\n\t\t\tvalueToConvert: splitValue[ 1 ],\n\t\t\tvalueUnit: unit || splitValue[ 2 ],\n\t\t};\n\t}\n\treturn undefined;\n};\n\nconst convertUnitToMobile = ( containerSize, globalStyles, value, unit ) => {\n\tconst { width, height } = containerSize;\n\tconst { valueToConvert, valueUnit } = getValueAndUnit( value, unit ) || {};\n\tconst { fontSize = 16 } = globalStyles || {};\n\n\tif ( valueToConvert === undefined ) {\n\t\treturn undefined;\n\t}\n\n\tswitch ( valueUnit ) {\n\t\tcase 'rem':\n\t\tcase 'em':\n\t\t\treturn valueToConvert * fontSize;\n\t\tcase '%':\n\t\t\treturn Number( valueToConvert / 100 ) * width;\n\t\tcase 'px':\n\t\t\treturn Number( valueToConvert );\n\t\tcase 'vw':\n\t\t\tconst vw = width / 100;\n\t\t\treturn Math.round( valueToConvert * vw );\n\t\tcase 'vh':\n\t\t\tconst vh = height / 100;\n\t\t\treturn Math.round( valueToConvert * vh );\n\t\tdefault:\n\t\t\treturn Number( valueToConvert / 100 ) * width;\n\t}\n};\n\nconst useConvertUnitToMobile = ( value, unit ) => {\n\tconst { globalStyles: styles } = useContext( GlobalStylesContext );\n\tconst [ windowSizes, setWindowSizes ] = useState(\n\t\tDimensions.get( 'window' )\n\t);\n\n\tuseEffect( () => {\n\t\tconst dimensionsChangeSubscription = Dimensions.addEventListener(\n\t\t\t'change',\n\t\t\tonDimensionsChange\n\t\t);\n\n\t\treturn () => {\n\t\t\tdimensionsChangeSubscription.remove();\n\t\t};\n\t\t// Disable reason: deferring this refactor to the native team.\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [] );\n\n\tconst onDimensionsChange = useCallback( ( { window } ) => {\n\t\tsetWindowSizes( window );\n\t}, [] );\n\n\treturn useMemo( () => {\n\t\tconst { valueToConvert, valueUnit } =\n\t\t\tgetValueAndUnit( value, unit ) || {};\n\n\t\treturn convertUnitToMobile(\n\t\t\twindowSizes,\n\t\t\tstyles,\n\t\t\tvalueToConvert,\n\t\t\tvalueUnit\n\t\t);\n\t\t// Disable reason: deferring this refactor to the native team.\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ windowSizes, value, unit ] );\n};\n\nexport { convertUnitToMobile, useConvertUnitToMobile, getValueAndUnit };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_reactNative","require","_element","getValueAndUnit","value","unit","regex","splitValue","match","filter","v","valueToConvert","valueUnit","undefined","exports","convertUnitToMobile","containerSize","globalStyles","width","height","fontSize","Number","vw","Math","round","vh","useConvertUnitToMobile","styles","windowSizes","setWindowSizes","useState","Dimensions","get","useEffect","dimensionsChangeSubscription","addEventListener","onDimensionsChange","remove","useCallback","window","useMemo"],"sources":["@wordpress/components/src/mobile/utils/use-unit-converter-to-mobile.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { Dimensions } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useState, useMemo, useCallback } from '@wordpress/element';\n\nconst getValueAndUnit = ( value, unit ) => {\n\tconst regex = /(\\d+\\.?\\d*)(.*)/;\n\n\tconst splitValue = `${ value }`\n\t\t?.match( regex )\n\t\t?.filter( ( v ) => v !== '' );\n\n\tif ( splitValue ) {\n\t\treturn {\n\t\t\tvalueToConvert: splitValue[ 1 ],\n\t\t\tvalueUnit: unit || splitValue[ 2 ],\n\t\t};\n\t}\n\treturn undefined;\n};\n\nconst convertUnitToMobile = ( containerSize, globalStyles, value, unit ) => {\n\tconst { width, height } = containerSize;\n\tconst { valueToConvert, valueUnit } = getValueAndUnit( value, unit ) || {};\n\tconst { fontSize = 16 } = globalStyles || {};\n\n\tif ( valueToConvert === undefined ) {\n\t\treturn undefined;\n\t}\n\n\tswitch ( valueUnit ) {\n\t\tcase 'rem':\n\t\tcase 'em':\n\t\t\treturn valueToConvert * fontSize;\n\t\tcase '%':\n\t\t\treturn Number( valueToConvert / 100 ) * width;\n\t\tcase 'px':\n\t\t\treturn Number( valueToConvert );\n\t\tcase 'vw':\n\t\t\tconst vw = width / 100;\n\t\t\treturn Math.round( valueToConvert * vw );\n\t\tcase 'vh':\n\t\t\tconst vh = height / 100;\n\t\t\treturn Math.round( valueToConvert * vh );\n\t\tdefault:\n\t\t\treturn Number( valueToConvert / 100 ) * width;\n\t}\n};\n\nconst useConvertUnitToMobile = ( value, unit, styles ) => {\n\tconst [ windowSizes, setWindowSizes ] = useState(\n\t\tDimensions.get( 'window' )\n\t);\n\n\tuseEffect( () => {\n\t\tconst dimensionsChangeSubscription = Dimensions.addEventListener(\n\t\t\t'change',\n\t\t\tonDimensionsChange\n\t\t);\n\n\t\treturn () => {\n\t\t\tdimensionsChangeSubscription.remove();\n\t\t};\n\t\t// Disable reason: deferring this refactor to the native team.\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [] );\n\n\tconst onDimensionsChange = useCallback( ( { window } ) => {\n\t\tsetWindowSizes( window );\n\t}, [] );\n\n\treturn useMemo( () => {\n\t\tconst { valueToConvert, valueUnit } =\n\t\t\tgetValueAndUnit( value, unit ) || {};\n\n\t\treturn convertUnitToMobile(\n\t\t\twindowSizes,\n\t\t\tstyles,\n\t\t\tvalueToConvert,\n\t\t\tvalueUnit\n\t\t);\n\t\t// Disable reason: deferring this refactor to the native team.\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ windowSizes, value, unit ] );\n};\n\nexport { convertUnitToMobile, useConvertUnitToMobile, getValueAndUnit };\n"],"mappings":"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","ignoreList":[]}

package/build/modal/index.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.Modal = void 0;
-var _react = require("react");
 var _clsx = _interopRequireDefault(require("clsx"));
 var _element = require("@wordpress/element");
 var _compose = require("@wordpress/compose");
@@ -16,6 +15,7 @@ var ariaHelper = _interopRequireWildcard(require("./aria-helper"));
 var _button = _interopRequireDefault(require("../button"));
 var _styleProvider = _interopRequireDefault(require("../style-provider"));
 var _withIgnoreImeEvents = require("../utils/with-ignore-ime-events");
+var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
@@ -209,55 +209,66 @@ function UnforwardedModal(props, forwardedRef) {
     }
   };
   const modal =
+  /*#__PURE__*/
   // eslint-disable-next-line jsx-a11y/no-static-element-interactions
-  (0, _react.createElement)("div", {
+  (0, _jsxRuntime.jsx)("div", {
     ref: (0, _compose.useMergeRefs)([ref, forwardedRef]),
     className: (0, _clsx.default)('components-modal__screen-overlay', overlayClassName),
     onKeyDown: (0, _withIgnoreImeEvents.withIgnoreIMEEvents)(handleEscapeKeyDown),
-    ...(shouldCloseOnClickOutside ? overlayPressHandlers : {})
-  }, (0, _react.createElement)(_styleProvider.default, {
-    document: document
-  }, (0, _react.createElement)("div", {
-    className: (0, _clsx.default)('components-modal__frame', sizeClass, className),
-    style: style,
-    ref: (0, _compose.useMergeRefs)([constrainedTabbingRef, focusReturnRef, focusOnMount !== 'firstContentElement' ? focusOnMountRef : null]),
-    role: role,
-    "aria-label": contentLabel,
-    "aria-labelledby": contentLabel ? undefined : headingId,
-    "aria-describedby": aria.describedby,
-    tabIndex: -1,
-    onKeyDown: onKeyDown
-  }, (0, _react.createElement)("div", {
-    className: (0, _clsx.default)('components-modal__content', {
-      'hide-header': __experimentalHideHeader,
-      'is-scrollable': hasScrollableContent,
-      'has-scrolled-content': hasScrolledContent
-    }),
-    role: "document",
-    onScroll: onContentContainerScroll,
-    ref: contentRef,
-    "aria-label": hasScrollableContent ? (0, _i18n.__)('Scrollable section') : undefined,
-    tabIndex: hasScrollableContent ? 0 : undefined
-  }, !__experimentalHideHeader && (0, _react.createElement)("div", {
-    className: "components-modal__header"
-  }, (0, _react.createElement)("div", {
-    className: "components-modal__header-heading-container"
-  }, icon && (0, _react.createElement)("span", {
-    className: "components-modal__icon-container",
-    "aria-hidden": true
-  }, icon), title && (0, _react.createElement)("h1", {
-    id: headingId,
-    className: "components-modal__header-heading"
-  }, title)), headerActions, isDismissible && (0, _react.createElement)(_button.default, {
-    onClick: onRequestClose,
-    icon: _icons.close,
-    label: closeButtonLabel || (0, _i18n.__)('Close')
-  })), (0, _react.createElement)("div", {
-    ref: (0, _compose.useMergeRefs)([childrenContainerRef, focusOnMount === 'firstContentElement' ? focusOnMountRef : null])
-  }, children)))));
-  return (0, _element.createPortal)((0, _react.createElement)(ModalContext.Provider, {
-    value: nestedDismissers.current
-  }, modal), document.body);
+    ...(shouldCloseOnClickOutside ? overlayPressHandlers : {}),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styleProvider.default, {
+      document: document,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: (0, _clsx.default)('components-modal__frame', sizeClass, className),
+        style: style,
+        ref: (0, _compose.useMergeRefs)([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__*/(0, _jsxRuntime.jsxs)("div", {
+          className: (0, _clsx.default)('components-modal__content', {
+            'hide-header': __experimentalHideHeader,
+            'is-scrollable': hasScrollableContent,
+            'has-scrolled-content': hasScrolledContent
+          }),
+          role: "document",
+          onScroll: onContentContainerScroll,
+          ref: contentRef,
+          "aria-label": hasScrollableContent ? (0, _i18n.__)('Scrollable section') : undefined,
+          tabIndex: hasScrollableContent ? 0 : undefined,
+          children: [!__experimentalHideHeader && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+            className: "components-modal__header",
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+              className: "components-modal__header-heading-container",
+              children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                className: "components-modal__icon-container",
+                "aria-hidden": true,
+                children: icon
+              }), title && /*#__PURE__*/(0, _jsxRuntime.jsx)("h1", {
+                id: headingId,
+                className: "components-modal__header-heading",
+                children: title
+              })]
+            }), headerActions, isDismissible && /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.default, {
+              onClick: onRequestClose,
+              icon: _icons.close,
+              label: closeButtonLabel || (0, _i18n.__)('Close')
+            })]
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            ref: (0, _compose.useMergeRefs)([childrenContainerRef, focusOnMount === 'firstContentElement' ? focusOnMountRef : null]),
+            children: children
+          })]
+        })
+      })
+    })
+  });
+  return (0, _element.createPortal)( /*#__PURE__*/(0, _jsxRuntime.jsx)(ModalContext.Provider, {
+    value: nestedDismissers.current,
+    children: modal
+  }), document.body);
 }
 
 /**

package/build/modal/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_clsx","_interopRequireDefault","require","_element","_compose","_i18n","_icons","_dom","ariaHelper","_interopRequireWildcard","_button","_styleProvider","_withIgnoreImeEvents","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ModalContext","createContext","bodyOpenClasses","Map","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","className","contentLabel","onKeyDown","isFullScreen","size","headerActions","__experimentalHideHeader","ref","useRef","instanceId","useInstanceId","Modal","headingId","focusOnMountRef","useFocusOnMount","constrainedTabbingRef","useConstrainedTabbing","focusReturnRef","useFocusReturn","contentRef","childrenContainerRef","hasScrolledContent","setHasScrolledContent","useState","hasScrollableContent","setHasScrollableContent","sizeClass","isContentScrollable","useCallback","current","closestScrollContainer","getScrollContainer","useEffect","modalize","unmodalize","refOnRequestClose","dismissers","useContext","nestedDismissers","push","first","second","nested","shift","_bodyOpenClasses$get","theClass","oneMore","document","body","classList","add","oneLess","remove","delete","useLayoutEffect","window","ResizeObserver","resizeObserver","observe","disconnect","handleEscapeKeyDown","event","code","key","defaultPrevented","preventDefault","onContentContainerScroll","_e$currentTarget$scro","scrollY","currentTarget","scrollTop","pressTarget","overlayPressHandlers","onPointerDown","target","onPointerUp","button","isSameTarget","modal","_react","createElement","useMergeRefs","clsx","withIgnoreIMEEvents","tabIndex","onScroll","__","id","onClick","close","label","createPortal","Provider","value","exports","forwardRef","_default"],"sources":["@wordpress/components/src/modal/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type {\n\tForwardedRef,\n\tKeyboardEvent,\n\tMutableRefObject,\n\tUIEvent,\n} from 'react';\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';\n\n// Used to track and dismiss the prior modal when another opens unless nested.\nconst ModalContext = createContext<\n\tMutableRefObject< ModalProps[ 'onRequestClose' ] | undefined >[]\n>( [] );\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: 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,\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 refOnRequestClose = useRef< ModalProps[ 'onRequestClose' ] >();\n\tuseEffect( () => {\n\t\trefOnRequestClose.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 = useRef< typeof dismissers >( [] );\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\tdismissers.push( refOnRequestClose );\n\t\tconst [ first, second ] = dismissers;\n\t\tif ( second ) {\n\t\t\tfirst?.current?.();\n\t\t}\n\n\t\tconst nested = nestedDismissers.current;\n\t\treturn () => {\n\t\t\tnested[ 0 ]?.current?.();\n\t\t\tdismissers.shift();\n\t\t};\n\t}, [ dismissers ] );\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\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( event: KeyboardEvent< HTMLDivElement > ) {\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\tif ( onRequestClose ) {\n\t\t\t\tonRequestClose( event );\n\t\t\t}\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: 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\tonRequestClose();\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) }\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={ style }\n\t\t\t\t\tref={ useMergeRefs( [\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<Button\n\t\t\t\t\t\t\t\t\t\tonClick={ onRequestClose }\n\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel || __( 'Close' )\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.current }>\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,"names":["_clsx","_interopRequireDefault","require","_element","_compose","_i18n","_icons","_dom","ariaHelper","_interopRequireWildcard","_button","_styleProvider","_withIgnoreImeEvents","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ModalContext","createContext","bodyOpenClasses","Map","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","className","contentLabel","onKeyDown","isFullScreen","size","headerActions","__experimentalHideHeader","ref","useRef","instanceId","useInstanceId","Modal","headingId","focusOnMountRef","useFocusOnMount","constrainedTabbingRef","useConstrainedTabbing","focusReturnRef","useFocusReturn","contentRef","childrenContainerRef","hasScrolledContent","setHasScrolledContent","useState","hasScrollableContent","setHasScrollableContent","sizeClass","isContentScrollable","useCallback","current","closestScrollContainer","getScrollContainer","useEffect","modalize","unmodalize","refOnRequestClose","dismissers","useContext","nestedDismissers","push","first","second","nested","shift","_bodyOpenClasses$get","theClass","oneMore","document","body","classList","add","oneLess","remove","delete","useLayoutEffect","window","ResizeObserver","resizeObserver","observe","disconnect","handleEscapeKeyDown","event","code","key","defaultPrevented","preventDefault","onContentContainerScroll","_e$currentTarget$scro","scrollY","currentTarget","scrollTop","pressTarget","overlayPressHandlers","onPointerDown","target","onPointerUp","button","isSameTarget","modal","jsx","useMergeRefs","clsx","withIgnoreIMEEvents","tabIndex","jsxs","onScroll","__","id","onClick","close","label","createPortal","Provider","value","exports","forwardRef","_default"],"sources":["@wordpress/components/src/modal/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type {\n\tForwardedRef,\n\tKeyboardEvent,\n\tMutableRefObject,\n\tUIEvent,\n} from 'react';\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';\n\n// Used to track and dismiss the prior modal when another opens unless nested.\nconst ModalContext = createContext<\n\tMutableRefObject< ModalProps[ 'onRequestClose' ] | undefined >[]\n>( [] );\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: 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,\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 refOnRequestClose = useRef< ModalProps[ 'onRequestClose' ] >();\n\tuseEffect( () => {\n\t\trefOnRequestClose.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 = useRef< typeof dismissers >( [] );\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\tdismissers.push( refOnRequestClose );\n\t\tconst [ first, second ] = dismissers;\n\t\tif ( second ) {\n\t\t\tfirst?.current?.();\n\t\t}\n\n\t\tconst nested = nestedDismissers.current;\n\t\treturn () => {\n\t\t\tnested[ 0 ]?.current?.();\n\t\t\tdismissers.shift();\n\t\t};\n\t}, [ dismissers ] );\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\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( event: KeyboardEvent< HTMLDivElement > ) {\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\tif ( onRequestClose ) {\n\t\t\t\tonRequestClose( event );\n\t\t\t}\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: 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\tonRequestClose();\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) }\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={ style }\n\t\t\t\t\tref={ useMergeRefs( [\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<Button\n\t\t\t\t\t\t\t\t\t\tonClick={ onRequestClose }\n\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel || __( 'Close' )\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.current }>\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":[]}

package/build/navigable-container/container.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = require("react");
 var _element = require("@wordpress/element");
 var _dom = require("@wordpress/dom");
+var _jsxRuntime = require("react/jsx-runtime");
 /**
  * External dependencies
  */
@@ -158,14 +158,15 @@ class NavigableContainer extends _element.Component {
       forwardedRef,
       ...restProps
     } = this.props;
-    return (0, _react.createElement)("div", {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       ref: this.bindContainer,
-      ...restProps
-    }, children);
+      ...restProps,
+      children: children
+    });
   }
 }
 const forwardedNavigableContainer = (props, ref) => {
-  return (0, _react.createElement)(NavigableContainer, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(NavigableContainer, {
     ...props,
     forwardedRef: ref
   });

package/build/navigable-container/container.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_dom","noop","MENU_ITEM_ROLES","cycleValue","value","total","offset","nextValue","NavigableContainer","Component","constructor","args","onKeyDown","bind","bindContainer","getFocusableContext","getFocusableIndex","componentDidMount","container","addEventListener","componentWillUnmount","removeEventListener","ref","forwardedRef","props","current","target","onlyBrowserTabstops","finder","focus","tabbable","focusable","focusables","find","index","indexOf","event","cycle","eventToOffset","onNavigate","stopNavigationEvents","undefined","stopImmediatePropagation","targetRole","getAttribute","targetHasMenuItemRole","includes","preventDefault","activeElement","ownerDocument","context","nextIndex","length","code","render","children","restProps","_react","createElement","forwardedNavigableContainer","displayName","_default","exports","default","forwardRef"],"sources":["@wordpress/components/src/navigable-container/container.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { Component, forwardRef } from '@wordpress/element';\nimport { focus } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport type { NavigableContainerProps } from './types';\n\nconst noop = () => {};\nconst MENU_ITEM_ROLES = [ 'menuitem', 'menuitemradio', 'menuitemcheckbox' ];\n\nfunction cycleValue( value: number, total: number, offset: number ) {\n\tconst nextValue = value + offset;\n\tif ( nextValue < 0 ) {\n\t\treturn total + nextValue;\n\t} else if ( nextValue >= total ) {\n\t\treturn nextValue - total;\n\t}\n\n\treturn nextValue;\n}\n\nclass NavigableContainer extends Component< NavigableContainerProps > {\n\tcontainer?: HTMLDivElement;\n\n\tconstructor( args: NavigableContainerProps ) {\n\t\tsuper( args );\n\t\tthis.onKeyDown = this.onKeyDown.bind( this );\n\t\tthis.bindContainer = this.bindContainer.bind( this );\n\n\t\tthis.getFocusableContext = this.getFocusableContext.bind( this );\n\t\tthis.getFocusableIndex = this.getFocusableIndex.bind( this );\n\t}\n\n\tcomponentDidMount() {\n\t\tif ( ! this.container ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// We use DOM event listeners instead of React event listeners\n\t\t// because we want to catch events from the underlying DOM tree\n\t\t// The React Tree can be different from the DOM tree when using\n\t\t// portals. Block Toolbars for instance are rendered in a separate\n\t\t// React Trees.\n\t\tthis.container.addEventListener( 'keydown', this.onKeyDown );\n\t}\n\n\tcomponentWillUnmount() {\n\t\tif ( ! this.container ) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.container.removeEventListener( 'keydown', this.onKeyDown );\n\t}\n\n\tbindContainer( ref: HTMLDivElement ) {\n\t\tconst { forwardedRef } = this.props;\n\t\tthis.container = ref;\n\n\t\tif ( typeof forwardedRef === 'function' ) {\n\t\t\tforwardedRef( ref );\n\t\t} else if ( forwardedRef && 'current' in forwardedRef ) {\n\t\t\tforwardedRef.current = ref;\n\t\t}\n\t}\n\n\tgetFocusableContext( target: Element ) {\n\t\tif ( ! this.container ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tconst { onlyBrowserTabstops } = this.props;\n\t\tconst finder = onlyBrowserTabstops ? focus.tabbable : focus.focusable;\n\t\tconst focusables = finder.find( this.container );\n\n\t\tconst index = this.getFocusableIndex( focusables, target );\n\t\tif ( index > -1 && target ) {\n\t\t\treturn { index, target, focusables };\n\t\t}\n\t\treturn null;\n\t}\n\n\tgetFocusableIndex( focusables: Element[], target: Element ) {\n\t\treturn focusables.indexOf( target );\n\t}\n\n\tonKeyDown( event: KeyboardEvent ) {\n\t\tif ( this.props.onKeyDown ) {\n\t\t\tthis.props.onKeyDown( event );\n\t\t}\n\n\t\tconst { getFocusableContext } = this;\n\t\tconst {\n\t\t\tcycle = true,\n\t\t\teventToOffset,\n\t\t\tonNavigate = noop,\n\t\t\tstopNavigationEvents,\n\t\t} = this.props;\n\n\t\tconst offset = eventToOffset( event );\n\n\t\t// eventToOffset returns undefined if the event is not handled by the component.\n\t\tif ( offset !== undefined && stopNavigationEvents ) {\n\t\t\t// Prevents arrow key handlers bound to the document directly interfering.\n\t\t\tevent.stopImmediatePropagation();\n\n\t\t\t// When navigating a collection of items, prevent scroll containers\n\t\t\t// from scrolling. The preventDefault also prevents Voiceover from\n\t\t\t// 'handling' the event, as voiceover will try to use arrow keys\n\t\t\t// for highlighting text.\n\t\t\tconst targetRole = (\n\t\t\t\tevent.target as HTMLDivElement | null\n\t\t\t )?.getAttribute( 'role' );\n\t\t\tconst targetHasMenuItemRole =\n\t\t\t\t!! targetRole && MENU_ITEM_ROLES.includes( targetRole );\n\n\t\t\tif ( targetHasMenuItemRole ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\n\t\tif ( ! offset ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst activeElement = ( event.target as HTMLElement | null )\n\t\t\t?.ownerDocument?.activeElement;\n\t\tif ( ! activeElement ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst context = getFocusableContext( activeElement );\n\t\tif ( ! context ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { index, focusables } = context;\n\t\tconst nextIndex = cycle\n\t\t\t? cycleValue( index, focusables.length, offset )\n\t\t\t: index + offset;\n\n\t\tif ( nextIndex >= 0 && nextIndex < focusables.length ) {\n\t\t\tfocusables[ nextIndex ].focus();\n\t\t\tonNavigate( nextIndex, focusables[ nextIndex ] );\n\n\t\t\t// `preventDefault()` on tab to avoid having the browser move the focus\n\t\t\t// after this component has already moved it.\n\t\t\tif ( event.code === 'Tab' ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tchildren,\n\t\t\tstopNavigationEvents,\n\t\t\teventToOffset,\n\t\t\tonNavigate,\n\t\t\tonKeyDown,\n\t\t\tcycle,\n\t\t\tonlyBrowserTabstops,\n\t\t\tforwardedRef,\n\t\t\t...restProps\n\t\t} = this.props;\n\t\treturn (\n\t\t\t<div ref={ this.bindContainer } { ...restProps }>\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nconst forwardedNavigableContainer = (\n\tprops: NavigableContainerProps,\n\tref: ForwardedRef< HTMLDivElement >\n) => {\n\treturn <NavigableContainer { ...props } forwardedRef={ ref } />;\n};\nforwardedNavigableContainer.displayName = 'NavigableContainer';\n\nexport default forwardRef( forwardedNavigableContainer );\n"],"mappings":";;;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,IAAA,GAAAD,OAAA;AATA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;;AAGA,MAAME,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;AACrB,MAAMC,eAAe,GAAG,CAAE,UAAU,EAAE,eAAe,EAAE,kBAAkB,CAAE;AAE3E,SAASC,UAAUA,CAAEC,KAAa,EAAEC,KAAa,EAAEC,MAAc,EAAG;EACnE,MAAMC,SAAS,GAAGH,KAAK,GAAGE,MAAM;EAChC,IAAKC,SAAS,GAAG,CAAC,EAAG;IACpB,OAAOF,KAAK,GAAGE,SAAS;EACzB,CAAC,MAAM,IAAKA,SAAS,IAAIF,KAAK,EAAG;IAChC,OAAOE,SAAS,GAAGF,KAAK;EACzB;EAEA,OAAOE,SAAS;AACjB;AAEA,MAAMC,kBAAkB,SAASC,kBAAS,CAA4B;EAGrEC,WAAWA,CAAEC,IAA6B,EAAG;IAC5C,KAAK,CAAEA,IAAK,CAAC;IACb,IAAI,CAACC,SAAS,GAAG,IAAI,CAACA,SAAS,CAACC,IAAI,CAAE,IAAK,CAAC;IAC5C,IAAI,CAACC,aAAa,GAAG,IAAI,CAACA,aAAa,CAACD,IAAI,CAAE,IAAK,CAAC;IAEpD,IAAI,CAACE,mBAAmB,GAAG,IAAI,CAACA,mBAAmB,CAACF,IAAI,CAAE,IAAK,CAAC;IAChE,IAAI,CAACG,iBAAiB,GAAG,IAAI,CAACA,iBAAiB,CAACH,IAAI,CAAE,IAAK,CAAC;EAC7D;EAEAI,iBAAiBA,CAAA,EAAG;IACnB,IAAK,CAAE,IAAI,CAACC,SAAS,EAAG;MACvB;IACD;;IAEA;IACA;IACA;IACA;IACA;IACA,IAAI,CAACA,SAAS,CAACC,gBAAgB,CAAE,SAAS,EAAE,IAAI,CAACP,SAAU,CAAC;EAC7D;EAEAQ,oBAAoBA,CAAA,EAAG;IACtB,IAAK,CAAE,IAAI,CAACF,SAAS,EAAG;MACvB;IACD;IAEA,IAAI,CAACA,SAAS,CAACG,mBAAmB,CAAE,SAAS,EAAE,IAAI,CAACT,SAAU,CAAC;EAChE;EAEAE,aAAaA,CAAEQ,GAAmB,EAAG;IACpC,MAAM;MAAEC;IAAa,CAAC,GAAG,IAAI,CAACC,KAAK;IACnC,IAAI,CAACN,SAAS,GAAGI,GAAG;IAEpB,IAAK,OAAOC,YAAY,KAAK,UAAU,EAAG;MACzCA,YAAY,CAAED,GAAI,CAAC;IACpB,CAAC,MAAM,IAAKC,YAAY,IAAI,SAAS,IAAIA,YAAY,EAAG;MACvDA,YAAY,CAACE,OAAO,GAAGH,GAAG;IAC3B;EACD;EAEAP,mBAAmBA,CAAEW,MAAe,EAAG;IACtC,IAAK,CAAE,IAAI,CAACR,SAAS,EAAG;MACvB,OAAO,IAAI;IACZ;IAEA,MAAM;MAAES;IAAoB,CAAC,GAAG,IAAI,CAACH,KAAK;IAC1C,MAAMI,MAAM,GAAGD,mBAAmB,GAAGE,UAAK,CAACC,QAAQ,GAAGD,UAAK,CAACE,SAAS;IACrE,MAAMC,UAAU,GAAGJ,MAAM,CAACK,IAAI,CAAE,IAAI,CAACf,SAAU,CAAC;IAEhD,MAAMgB,KAAK,GAAG,IAAI,CAAClB,iBAAiB,CAAEgB,UAAU,EAAEN,MAAO,CAAC;IAC1D,IAAKQ,KAAK,GAAG,CAAC,CAAC,IAAIR,MAAM,EAAG;MAC3B,OAAO;QAAEQ,KAAK;QAAER,MAAM;QAAEM;MAAW,CAAC;IACrC;IACA,OAAO,IAAI;EACZ;EAEAhB,iBAAiBA,CAAEgB,UAAqB,EAAEN,MAAe,EAAG;IAC3D,OAAOM,UAAU,CAACG,OAAO,CAAET,MAAO,CAAC;EACpC;EAEAd,SAASA,CAAEwB,KAAoB,EAAG;IACjC,IAAK,IAAI,CAACZ,KAAK,CAACZ,SAAS,EAAG;MAC3B,IAAI,CAACY,KAAK,CAACZ,SAAS,CAAEwB,KAAM,CAAC;IAC9B;IAEA,MAAM;MAAErB;IAAoB,CAAC,GAAG,IAAI;IACpC,MAAM;MACLsB,KAAK,GAAG,IAAI;MACZC,aAAa;MACbC,UAAU,GAAGtC,IAAI;MACjBuC;IACD,CAAC,GAAG,IAAI,CAAChB,KAAK;IAEd,MAAMlB,MAAM,GAAGgC,aAAa,CAAEF,KAAM,CAAC;;IAErC;IACA,IAAK9B,MAAM,KAAKmC,SAAS,IAAID,oBAAoB,EAAG;MACnD;MACAJ,KAAK,CAACM,wBAAwB,CAAC,CAAC;;MAEhC;MACA;MACA;MACA;MACA,MAAMC,UAAU,GACfP,KAAK,CAACV,MAAM,EACTkB,YAAY,CAAE,MAAO,CAAC;MAC1B,MAAMC,qBAAqB,GAC1B,CAAC,CAAEF,UAAU,IAAIzC,eAAe,CAAC4C,QAAQ,CAAEH,UAAW,CAAC;MAExD,IAAKE,qBAAqB,EAAG;QAC5BT,KAAK,CAACW,cAAc,CAAC,CAAC;MACvB;IACD;IAEA,IAAK,CAAEzC,MAAM,EAAG;MACf;IACD;IAEA,MAAM0C,aAAa,GAAKZ,KAAK,CAACV,MAAM,EACjCuB,aAAa,EAAED,aAAa;IAC/B,IAAK,CAAEA,aAAa,EAAG;MACtB;IACD;IAEA,MAAME,OAAO,GAAGnC,mBAAmB,CAAEiC,aAAc,CAAC;IACpD,IAAK,CAAEE,OAAO,EAAG;MAChB;IACD;IAEA,MAAM;MAAEhB,KAAK;MAAEF;IAAW,CAAC,GAAGkB,OAAO;IACrC,MAAMC,SAAS,GAAGd,KAAK,GACpBlC,UAAU,CAAE+B,KAAK,EAAEF,UAAU,CAACoB,MAAM,EAAE9C,MAAO,CAAC,GAC9C4B,KAAK,GAAG5B,MAAM;IAEjB,IAAK6C,SAAS,IAAI,CAAC,IAAIA,SAAS,GAAGnB,UAAU,CAACoB,MAAM,EAAG;MACtDpB,UAAU,CAAEmB,SAAS,CAAE,CAACtB,KAAK,CAAC,CAAC;MAC/BU,UAAU,CAAEY,SAAS,EAAEnB,UAAU,CAAEmB,SAAS,CAAG,CAAC;;MAEhD;MACA;MACA,IAAKf,KAAK,CAACiB,IAAI,KAAK,KAAK,EAAG;QAC3BjB,KAAK,CAACW,cAAc,CAAC,CAAC;MACvB;IACD;EACD;EAEAO,MAAMA,CAAA,EAAG;IACR,MAAM;MACLC,QAAQ;MACRf,oBAAoB;MACpBF,aAAa;MACbC,UAAU;MACV3B,SAAS;MACTyB,KAAK;MACLV,mBAAmB;MACnBJ,YAAY;MACZ,GAAGiC;IACJ,CAAC,GAAG,IAAI,CAAChC,KAAK;IACd,OACC,IAAAiC,MAAA,CAAAC,aAAA;MAAKpC,GAAG,EAAG,IAAI,CAACR,aAAe;MAAA,GAAM0C;IAAS,GAC3CD,QACE,CAAC;EAER;AACD;AAEA,MAAMI,2BAA2B,GAAGA,CACnCnC,KAA8B,EAC9BF,GAAmC,KAC/B;EACJ,OAAO,IAAAmC,MAAA,CAAAC,aAAA,EAAClD,kBAAkB;IAAA,GAAMgB,KAAK;IAAGD,YAAY,EAAGD;EAAK,CAAE,CAAC;AAChE,CAAC;AACDqC,2BAA2B,CAACC,WAAW,GAAG,oBAAoB;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEhD,IAAAC,mBAAU,EAAEL,2BAA4B,CAAC","ignoreList":[]}
+{"version":3,"names":["_element","require","_dom","_jsxRuntime","noop","MENU_ITEM_ROLES","cycleValue","value","total","offset","nextValue","NavigableContainer","Component","constructor","args","onKeyDown","bind","bindContainer","getFocusableContext","getFocusableIndex","componentDidMount","container","addEventListener","componentWillUnmount","removeEventListener","ref","forwardedRef","props","current","target","onlyBrowserTabstops","finder","focus","tabbable","focusable","focusables","find","index","indexOf","event","cycle","eventToOffset","onNavigate","stopNavigationEvents","undefined","stopImmediatePropagation","targetRole","getAttribute","targetHasMenuItemRole","includes","preventDefault","activeElement","ownerDocument","context","nextIndex","length","code","render","children","restProps","jsx","forwardedNavigableContainer","displayName","_default","exports","default","forwardRef"],"sources":["@wordpress/components/src/navigable-container/container.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { Component, forwardRef } from '@wordpress/element';\nimport { focus } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport type { NavigableContainerProps } from './types';\n\nconst noop = () => {};\nconst MENU_ITEM_ROLES = [ 'menuitem', 'menuitemradio', 'menuitemcheckbox' ];\n\nfunction cycleValue( value: number, total: number, offset: number ) {\n\tconst nextValue = value + offset;\n\tif ( nextValue < 0 ) {\n\t\treturn total + nextValue;\n\t} else if ( nextValue >= total ) {\n\t\treturn nextValue - total;\n\t}\n\n\treturn nextValue;\n}\n\nclass NavigableContainer extends Component< NavigableContainerProps > {\n\tcontainer?: HTMLDivElement;\n\n\tconstructor( args: NavigableContainerProps ) {\n\t\tsuper( args );\n\t\tthis.onKeyDown = this.onKeyDown.bind( this );\n\t\tthis.bindContainer = this.bindContainer.bind( this );\n\n\t\tthis.getFocusableContext = this.getFocusableContext.bind( this );\n\t\tthis.getFocusableIndex = this.getFocusableIndex.bind( this );\n\t}\n\n\tcomponentDidMount() {\n\t\tif ( ! this.container ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// We use DOM event listeners instead of React event listeners\n\t\t// because we want to catch events from the underlying DOM tree\n\t\t// The React Tree can be different from the DOM tree when using\n\t\t// portals. Block Toolbars for instance are rendered in a separate\n\t\t// React Trees.\n\t\tthis.container.addEventListener( 'keydown', this.onKeyDown );\n\t}\n\n\tcomponentWillUnmount() {\n\t\tif ( ! this.container ) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.container.removeEventListener( 'keydown', this.onKeyDown );\n\t}\n\n\tbindContainer( ref: HTMLDivElement ) {\n\t\tconst { forwardedRef } = this.props;\n\t\tthis.container = ref;\n\n\t\tif ( typeof forwardedRef === 'function' ) {\n\t\t\tforwardedRef( ref );\n\t\t} else if ( forwardedRef && 'current' in forwardedRef ) {\n\t\t\tforwardedRef.current = ref;\n\t\t}\n\t}\n\n\tgetFocusableContext( target: Element ) {\n\t\tif ( ! this.container ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tconst { onlyBrowserTabstops } = this.props;\n\t\tconst finder = onlyBrowserTabstops ? focus.tabbable : focus.focusable;\n\t\tconst focusables = finder.find( this.container );\n\n\t\tconst index = this.getFocusableIndex( focusables, target );\n\t\tif ( index > -1 && target ) {\n\t\t\treturn { index, target, focusables };\n\t\t}\n\t\treturn null;\n\t}\n\n\tgetFocusableIndex( focusables: Element[], target: Element ) {\n\t\treturn focusables.indexOf( target );\n\t}\n\n\tonKeyDown( event: KeyboardEvent ) {\n\t\tif ( this.props.onKeyDown ) {\n\t\t\tthis.props.onKeyDown( event );\n\t\t}\n\n\t\tconst { getFocusableContext } = this;\n\t\tconst {\n\t\t\tcycle = true,\n\t\t\teventToOffset,\n\t\t\tonNavigate = noop,\n\t\t\tstopNavigationEvents,\n\t\t} = this.props;\n\n\t\tconst offset = eventToOffset( event );\n\n\t\t// eventToOffset returns undefined if the event is not handled by the component.\n\t\tif ( offset !== undefined && stopNavigationEvents ) {\n\t\t\t// Prevents arrow key handlers bound to the document directly interfering.\n\t\t\tevent.stopImmediatePropagation();\n\n\t\t\t// When navigating a collection of items, prevent scroll containers\n\t\t\t// from scrolling. The preventDefault also prevents Voiceover from\n\t\t\t// 'handling' the event, as voiceover will try to use arrow keys\n\t\t\t// for highlighting text.\n\t\t\tconst targetRole = (\n\t\t\t\tevent.target as HTMLDivElement | null\n\t\t\t )?.getAttribute( 'role' );\n\t\t\tconst targetHasMenuItemRole =\n\t\t\t\t!! targetRole && MENU_ITEM_ROLES.includes( targetRole );\n\n\t\t\tif ( targetHasMenuItemRole ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\n\t\tif ( ! offset ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst activeElement = ( event.target as HTMLElement | null )\n\t\t\t?.ownerDocument?.activeElement;\n\t\tif ( ! activeElement ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst context = getFocusableContext( activeElement );\n\t\tif ( ! context ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { index, focusables } = context;\n\t\tconst nextIndex = cycle\n\t\t\t? cycleValue( index, focusables.length, offset )\n\t\t\t: index + offset;\n\n\t\tif ( nextIndex >= 0 && nextIndex < focusables.length ) {\n\t\t\tfocusables[ nextIndex ].focus();\n\t\t\tonNavigate( nextIndex, focusables[ nextIndex ] );\n\n\t\t\t// `preventDefault()` on tab to avoid having the browser move the focus\n\t\t\t// after this component has already moved it.\n\t\t\tif ( event.code === 'Tab' ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tchildren,\n\t\t\tstopNavigationEvents,\n\t\t\teventToOffset,\n\t\t\tonNavigate,\n\t\t\tonKeyDown,\n\t\t\tcycle,\n\t\t\tonlyBrowserTabstops,\n\t\t\tforwardedRef,\n\t\t\t...restProps\n\t\t} = this.props;\n\t\treturn (\n\t\t\t<div ref={ this.bindContainer } { ...restProps }>\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nconst forwardedNavigableContainer = (\n\tprops: NavigableContainerProps,\n\tref: ForwardedRef< HTMLDivElement >\n) => {\n\treturn <NavigableContainer { ...props } forwardedRef={ ref } />;\n};\nforwardedNavigableContainer.displayName = 'NavigableContainer';\n\nexport default forwardRef( forwardedNavigableContainer );\n"],"mappings":"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","ignoreList":[]}

package/build/navigable-container/menu.js

@@ -7,9 +7,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.NavigableMenu = void 0;
 exports.UnforwardedNavigableMenu = UnforwardedNavigableMenu;
 exports.default = void 0;
-var _react = require("react");
 var _element = require("@wordpress/element");
 var _container = _interopRequireDefault(require("./container"));
+var _jsxRuntime = require("react/jsx-runtime");
 /**
  * External dependencies
  */
@@ -53,7 +53,7 @@ function UnforwardedNavigableMenu({
     }
     return undefined;
   };
-  return (0, _react.createElement)(_container.default, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_container.default, {
     ref: ref,
     stopNavigationEvents: true,
     onlyBrowserTabstops: false,

package/build/navigable-container/menu.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_container","_interopRequireDefault","UnforwardedNavigableMenu","role","orientation","rest","ref","eventToOffset","evt","code","next","previous","includes","undefined","_react","createElement","default","stopNavigationEvents","onlyBrowserTabstops","NavigableMenu","exports","forwardRef","_default"],"sources":["@wordpress/components/src/navigable-container/menu.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport NavigableContainer from './container';\nimport type { NavigableMenuProps } from './types';\n\nexport function UnforwardedNavigableMenu(\n\t{ role = 'menu', orientation = 'vertical', ...rest }: NavigableMenuProps,\n\tref: ForwardedRef< any >\n) {\n\tconst eventToOffset = ( evt: KeyboardEvent ) => {\n\t\tconst { code } = evt;\n\n\t\tlet next = [ 'ArrowDown' ];\n\t\tlet previous = [ 'ArrowUp' ];\n\n\t\tif ( orientation === 'horizontal' ) {\n\t\t\tnext = [ 'ArrowRight' ];\n\t\t\tprevious = [ 'ArrowLeft' ];\n\t\t}\n\n\t\tif ( orientation === 'both' ) {\n\t\t\tnext = [ 'ArrowRight', 'ArrowDown' ];\n\t\t\tprevious = [ 'ArrowLeft', 'ArrowUp' ];\n\t\t}\n\n\t\tif ( next.includes( code ) ) {\n\t\t\treturn 1;\n\t\t} else if ( previous.includes( code ) ) {\n\t\t\treturn -1;\n\t\t} else if (\n\t\t\t[ 'ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight' ].includes(\n\t\t\t\tcode\n\t\t\t)\n\t\t) {\n\t\t\t// Key press should be handled, e.g. have event propagation and\n\t\t\t// default behavior handled by NavigableContainer but not result\n\t\t\t// in an offset.\n\t\t\treturn 0;\n\t\t}\n\n\t\treturn undefined;\n\t};\n\n\treturn (\n\t\t<NavigableContainer\n\t\t\tref={ ref }\n\t\t\tstopNavigationEvents\n\t\t\tonlyBrowserTabstops={ false }\n\t\t\trole={ role }\n\t\t\taria-orientation={\n\t\t\t\trole !== 'presentation' &&\n\t\t\t\t( orientation === 'vertical' || orientation === 'horizontal' )\n\t\t\t\t\t? orientation\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\teventToOffset={ eventToOffset }\n\t\t\t{ ...rest }\n\t\t/>\n\t);\n}\n\n/**\n * A container for a navigable menu.\n *\n *  ```jsx\n *  import {\n *    NavigableMenu,\n *    Button,\n *  } from '@wordpress/components';\n *\n *  function onNavigate( index, target ) {\n *    console.log( `Navigates to ${ index }`, target );\n *  }\n *\n *  const MyNavigableContainer = () => (\n *    <div>\n *      <span>Navigable Menu:</span>\n *      <NavigableMenu onNavigate={ onNavigate } orientation=\"horizontal\">\n *        <Button variant=\"secondary\">Item 1</Button>\n *        <Button variant=\"secondary\">Item 2</Button>\n *        <Button variant=\"secondary\">Item 3</Button>\n *      </NavigableMenu>\n *    </div>\n *  );\n *  ```\n */\nexport const NavigableMenu = forwardRef( UnforwardedNavigableMenu );\n\nexport default NavigableMenu;\n"],"mappings":";;;;;;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,UAAA,GAAAC,sBAAA,CAAAF,OAAA;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAIO,SAASG,wBAAwBA,CACvC;EAAEC,IAAI,GAAG,MAAM;EAAEC,WAAW,GAAG,UAAU;EAAE,GAAGC;AAAyB,CAAC,EACxEC,GAAwB,EACvB;EACD,MAAMC,aAAa,GAAKC,GAAkB,IAAM;IAC/C,MAAM;MAAEC;IAAK,CAAC,GAAGD,GAAG;IAEpB,IAAIE,IAAI,GAAG,CAAE,WAAW,CAAE;IAC1B,IAAIC,QAAQ,GAAG,CAAE,SAAS,CAAE;IAE5B,IAAKP,WAAW,KAAK,YAAY,EAAG;MACnCM,IAAI,GAAG,CAAE,YAAY,CAAE;MACvBC,QAAQ,GAAG,CAAE,WAAW,CAAE;IAC3B;IAEA,IAAKP,WAAW,KAAK,MAAM,EAAG;MAC7BM,IAAI,GAAG,CAAE,YAAY,EAAE,WAAW,CAAE;MACpCC,QAAQ,GAAG,CAAE,WAAW,EAAE,SAAS,CAAE;IACtC;IAEA,IAAKD,IAAI,CAACE,QAAQ,CAAEH,IAAK,CAAC,EAAG;MAC5B,OAAO,CAAC;IACT,CAAC,MAAM,IAAKE,QAAQ,CAACC,QAAQ,CAAEH,IAAK,CAAC,EAAG;MACvC,OAAO,CAAC,CAAC;IACV,CAAC,MAAM,IACN,CAAE,WAAW,EAAE,SAAS,EAAE,WAAW,EAAE,YAAY,CAAE,CAACG,QAAQ,CAC7DH,IACD,CAAC,EACA;MACD;MACA;MACA;MACA,OAAO,CAAC;IACT;IAEA,OAAOI,SAAS;EACjB,CAAC;EAED,OACC,IAAAC,MAAA,CAAAC,aAAA,EAACf,UAAA,CAAAgB,OAAkB;IAClBV,GAAG,EAAGA,GAAK;IACXW,oBAAoB;IACpBC,mBAAmB,EAAG,KAAO;IAC7Bf,IAAI,EAAGA,IAAM;IACb,oBACCA,IAAI,KAAK,cAAc,KACrBC,WAAW,KAAK,UAAU,IAAIA,WAAW,KAAK,YAAY,CAAE,GAC3DA,WAAW,GACXS,SACH;IACDN,aAAa,EAAGA,aAAe;IAAA,GAC1BF;EAAI,CACT,CAAC;AAEJ;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMc,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAG,IAAAE,mBAAU,EAAEnB,wBAAyB,CAAC;AAAC,IAAAoB,QAAA,GAAAF,OAAA,CAAAJ,OAAA,GAErDG,aAAa","ignoreList":[]}
+{"version":3,"names":["_element","require","_container","_interopRequireDefault","_jsxRuntime","UnforwardedNavigableMenu","role","orientation","rest","ref","eventToOffset","evt","code","next","previous","includes","undefined","jsx","default","stopNavigationEvents","onlyBrowserTabstops","NavigableMenu","exports","forwardRef","_default"],"sources":["@wordpress/components/src/navigable-container/menu.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport NavigableContainer from './container';\nimport type { NavigableMenuProps } from './types';\n\nexport function UnforwardedNavigableMenu(\n\t{ role = 'menu', orientation = 'vertical', ...rest }: NavigableMenuProps,\n\tref: ForwardedRef< any >\n) {\n\tconst eventToOffset = ( evt: KeyboardEvent ) => {\n\t\tconst { code } = evt;\n\n\t\tlet next = [ 'ArrowDown' ];\n\t\tlet previous = [ 'ArrowUp' ];\n\n\t\tif ( orientation === 'horizontal' ) {\n\t\t\tnext = [ 'ArrowRight' ];\n\t\t\tprevious = [ 'ArrowLeft' ];\n\t\t}\n\n\t\tif ( orientation === 'both' ) {\n\t\t\tnext = [ 'ArrowRight', 'ArrowDown' ];\n\t\t\tprevious = [ 'ArrowLeft', 'ArrowUp' ];\n\t\t}\n\n\t\tif ( next.includes( code ) ) {\n\t\t\treturn 1;\n\t\t} else if ( previous.includes( code ) ) {\n\t\t\treturn -1;\n\t\t} else if (\n\t\t\t[ 'ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight' ].includes(\n\t\t\t\tcode\n\t\t\t)\n\t\t) {\n\t\t\t// Key press should be handled, e.g. have event propagation and\n\t\t\t// default behavior handled by NavigableContainer but not result\n\t\t\t// in an offset.\n\t\t\treturn 0;\n\t\t}\n\n\t\treturn undefined;\n\t};\n\n\treturn (\n\t\t<NavigableContainer\n\t\t\tref={ ref }\n\t\t\tstopNavigationEvents\n\t\t\tonlyBrowserTabstops={ false }\n\t\t\trole={ role }\n\t\t\taria-orientation={\n\t\t\t\trole !== 'presentation' &&\n\t\t\t\t( orientation === 'vertical' || orientation === 'horizontal' )\n\t\t\t\t\t? orientation\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\teventToOffset={ eventToOffset }\n\t\t\t{ ...rest }\n\t\t/>\n\t);\n}\n\n/**\n * A container for a navigable menu.\n *\n *  ```jsx\n *  import {\n *    NavigableMenu,\n *    Button,\n *  } from '@wordpress/components';\n *\n *  function onNavigate( index, target ) {\n *    console.log( `Navigates to ${ index }`, target );\n *  }\n *\n *  const MyNavigableContainer = () => (\n *    <div>\n *      <span>Navigable Menu:</span>\n *      <NavigableMenu onNavigate={ onNavigate } orientation=\"horizontal\">\n *        <Button variant=\"secondary\">Item 1</Button>\n *        <Button variant=\"secondary\">Item 2</Button>\n *        <Button variant=\"secondary\">Item 3</Button>\n *      </NavigableMenu>\n *    </div>\n *  );\n *  ```\n */\nexport const NavigableMenu = forwardRef( UnforwardedNavigableMenu );\n\nexport default NavigableMenu;\n"],"mappings":";;;;;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,UAAA,GAAAC,sBAAA,CAAAF,OAAA;AAA6C,IAAAG,WAAA,GAAAH,OAAA;AAb7C;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAIO,SAASI,wBAAwBA,CACvC;EAAEC,IAAI,GAAG,MAAM;EAAEC,WAAW,GAAG,UAAU;EAAE,GAAGC;AAAyB,CAAC,EACxEC,GAAwB,EACvB;EACD,MAAMC,aAAa,GAAKC,GAAkB,IAAM;IAC/C,MAAM;MAAEC;IAAK,CAAC,GAAGD,GAAG;IAEpB,IAAIE,IAAI,GAAG,CAAE,WAAW,CAAE;IAC1B,IAAIC,QAAQ,GAAG,CAAE,SAAS,CAAE;IAE5B,IAAKP,WAAW,KAAK,YAAY,EAAG;MACnCM,IAAI,GAAG,CAAE,YAAY,CAAE;MACvBC,QAAQ,GAAG,CAAE,WAAW,CAAE;IAC3B;IAEA,IAAKP,WAAW,KAAK,MAAM,EAAG;MAC7BM,IAAI,GAAG,CAAE,YAAY,EAAE,WAAW,CAAE;MACpCC,QAAQ,GAAG,CAAE,WAAW,EAAE,SAAS,CAAE;IACtC;IAEA,IAAKD,IAAI,CAACE,QAAQ,CAAEH,IAAK,CAAC,EAAG;MAC5B,OAAO,CAAC;IACT,CAAC,MAAM,IAAKE,QAAQ,CAACC,QAAQ,CAAEH,IAAK,CAAC,EAAG;MACvC,OAAO,CAAC,CAAC;IACV,CAAC,MAAM,IACN,CAAE,WAAW,EAAE,SAAS,EAAE,WAAW,EAAE,YAAY,CAAE,CAACG,QAAQ,CAC7DH,IACD,CAAC,EACA;MACD;MACA;MACA;MACA,OAAO,CAAC;IACT;IAEA,OAAOI,SAAS;EACjB,CAAC;EAED,oBACC,IAAAZ,WAAA,CAAAa,GAAA,EAACf,UAAA,CAAAgB,OAAkB;IAClBT,GAAG,EAAGA,GAAK;IACXU,oBAAoB;IACpBC,mBAAmB,EAAG,KAAO;IAC7Bd,IAAI,EAAGA,IAAM;IACb,oBACCA,IAAI,KAAK,cAAc,KACrBC,WAAW,KAAK,UAAU,IAAIA,WAAW,KAAK,YAAY,CAAE,GAC3DA,WAAW,GACXS,SACH;IACDN,aAAa,EAAGA,aAAe;IAAA,GAC1BF;EAAI,CACT,CAAC;AAEJ;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMa,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAG,IAAAE,mBAAU,EAAElB,wBAAyB,CAAC;AAAC,IAAAmB,QAAA,GAAAF,OAAA,CAAAJ,OAAA,GAErDG,aAAa","ignoreList":[]}

package/build/navigable-container/tabbable.js

@@ -7,9 +7,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.TabbableContainer = void 0;
 exports.UnforwardedTabbableContainer = UnforwardedTabbableContainer;
 exports.default = void 0;
-var _react = require("react");
 var _element = require("@wordpress/element");
 var _container = _interopRequireDefault(require("./container"));
+var _jsxRuntime = require("react/jsx-runtime");
 /**
  * External dependencies
  */
@@ -51,7 +51,7 @@ function UnforwardedTabbableContainer({
     }
     return undefined;
   };
-  return (0, _react.createElement)(_container.default, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_container.default, {
     ref: ref,
     stopNavigationEvents: true,
     onlyBrowserTabstops: true,

package/build/navigable-container/tabbable.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_container","_interopRequireDefault","UnforwardedTabbableContainer","eventToOffset","props","ref","innerEventToOffset","evt","code","shiftKey","undefined","_react","createElement","default","stopNavigationEvents","onlyBrowserTabstops","TabbableContainer","exports","forwardRef","_default"],"sources":["@wordpress/components/src/navigable-container/tabbable.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport NavigableContainer from './container';\nimport type { TabbableContainerProps } from './types';\n\nexport function UnforwardedTabbableContainer(\n\t{ eventToOffset, ...props }: TabbableContainerProps,\n\tref: ForwardedRef< any >\n) {\n\tconst innerEventToOffset = ( evt: KeyboardEvent ) => {\n\t\tconst { code, shiftKey } = evt;\n\t\tif ( 'Tab' === code ) {\n\t\t\treturn shiftKey ? -1 : 1;\n\t\t}\n\n\t\t// Allow custom handling of keys besides Tab.\n\t\t//\n\t\t// By default, TabbableContainer will move focus forward on Tab and\n\t\t// backward on Shift+Tab. The handler below will be used for all other\n\t\t// events. The semantics for `eventToOffset`'s return\n\t\t// values are the following:\n\t\t//\n\t\t// - +1: move focus forward\n\t\t// - -1: move focus backward\n\t\t// -  0: don't move focus, but acknowledge event and thus stop it\n\t\t// - undefined: do nothing, let the event propagate.\n\t\tif ( eventToOffset ) {\n\t\t\treturn eventToOffset( evt );\n\t\t}\n\n\t\treturn undefined;\n\t};\n\n\treturn (\n\t\t<NavigableContainer\n\t\t\tref={ ref }\n\t\t\tstopNavigationEvents\n\t\t\tonlyBrowserTabstops\n\t\t\teventToOffset={ innerEventToOffset }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\n/**\n * A container for tabbable elements.\n *\n *  ```jsx\n *  import {\n *    TabbableContainer,\n *    Button,\n *  } from '@wordpress/components';\n *\n *  function onNavigate( index, target ) {\n *    console.log( `Navigates to ${ index }`, target );\n *  }\n *\n *  const MyTabbableContainer = () => (\n *    <div>\n *      <span>Tabbable Container:</span>\n *      <TabbableContainer onNavigate={ onNavigate }>\n *        <Button variant=\"secondary\" tabIndex=\"0\">\n *          Section 1\n *        </Button>\n *        <Button variant=\"secondary\" tabIndex=\"0\">\n *          Section 2\n *        </Button>\n *        <Button variant=\"secondary\" tabIndex=\"0\">\n *          Section 3\n *        </Button>\n *        <Button variant=\"secondary\" tabIndex=\"0\">\n *          Section 4\n *        </Button>\n *      </TabbableContainer>\n *    </div>\n *  );\n *  ```\n */\nexport const TabbableContainer = forwardRef( UnforwardedTabbableContainer );\n\nexport default TabbableContainer;\n"],"mappings":";;;;;;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,UAAA,GAAAC,sBAAA,CAAAF,OAAA;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAIO,SAASG,4BAA4BA,CAC3C;EAAEC,aAAa;EAAE,GAAGC;AAA8B,CAAC,EACnDC,GAAwB,EACvB;EACD,MAAMC,kBAAkB,GAAKC,GAAkB,IAAM;IACpD,MAAM;MAAEC,IAAI;MAAEC;IAAS,CAAC,GAAGF,GAAG;IAC9B,IAAK,KAAK,KAAKC,IAAI,EAAG;MACrB,OAAOC,QAAQ,GAAG,CAAC,CAAC,GAAG,CAAC;IACzB;;IAEA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA,IAAKN,aAAa,EAAG;MACpB,OAAOA,aAAa,CAAEI,GAAI,CAAC;IAC5B;IAEA,OAAOG,SAAS;EACjB,CAAC;EAED,OACC,IAAAC,MAAA,CAAAC,aAAA,EAACZ,UAAA,CAAAa,OAAkB;IAClBR,GAAG,EAAGA,GAAK;IACXS,oBAAoB;IACpBC,mBAAmB;IACnBZ,aAAa,EAAGG,kBAAoB;IAAA,GAC/BF;EAAK,CACV,CAAC;AAEJ;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMY,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG,IAAAE,mBAAU,EAAEhB,4BAA6B,CAAC;AAAC,IAAAiB,QAAA,GAAAF,OAAA,CAAAJ,OAAA,GAE7DG,iBAAiB","ignoreList":[]}
+{"version":3,"names":["_element","require","_container","_interopRequireDefault","_jsxRuntime","UnforwardedTabbableContainer","eventToOffset","props","ref","innerEventToOffset","evt","code","shiftKey","undefined","jsx","default","stopNavigationEvents","onlyBrowserTabstops","TabbableContainer","exports","forwardRef","_default"],"sources":["@wordpress/components/src/navigable-container/tabbable.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport NavigableContainer from './container';\nimport type { TabbableContainerProps } from './types';\n\nexport function UnforwardedTabbableContainer(\n\t{ eventToOffset, ...props }: TabbableContainerProps,\n\tref: ForwardedRef< any >\n) {\n\tconst innerEventToOffset = ( evt: KeyboardEvent ) => {\n\t\tconst { code, shiftKey } = evt;\n\t\tif ( 'Tab' === code ) {\n\t\t\treturn shiftKey ? -1 : 1;\n\t\t}\n\n\t\t// Allow custom handling of keys besides Tab.\n\t\t//\n\t\t// By default, TabbableContainer will move focus forward on Tab and\n\t\t// backward on Shift+Tab. The handler below will be used for all other\n\t\t// events. The semantics for `eventToOffset`'s return\n\t\t// values are the following:\n\t\t//\n\t\t// - +1: move focus forward\n\t\t// - -1: move focus backward\n\t\t// -  0: don't move focus, but acknowledge event and thus stop it\n\t\t// - undefined: do nothing, let the event propagate.\n\t\tif ( eventToOffset ) {\n\t\t\treturn eventToOffset( evt );\n\t\t}\n\n\t\treturn undefined;\n\t};\n\n\treturn (\n\t\t<NavigableContainer\n\t\t\tref={ ref }\n\t\t\tstopNavigationEvents\n\t\t\tonlyBrowserTabstops\n\t\t\teventToOffset={ innerEventToOffset }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\n/**\n * A container for tabbable elements.\n *\n *  ```jsx\n *  import {\n *    TabbableContainer,\n *    Button,\n *  } from '@wordpress/components';\n *\n *  function onNavigate( index, target ) {\n *    console.log( `Navigates to ${ index }`, target );\n *  }\n *\n *  const MyTabbableContainer = () => (\n *    <div>\n *      <span>Tabbable Container:</span>\n *      <TabbableContainer onNavigate={ onNavigate }>\n *        <Button variant=\"secondary\" tabIndex=\"0\">\n *          Section 1\n *        </Button>\n *        <Button variant=\"secondary\" tabIndex=\"0\">\n *          Section 2\n *        </Button>\n *        <Button variant=\"secondary\" tabIndex=\"0\">\n *          Section 3\n *        </Button>\n *        <Button variant=\"secondary\" tabIndex=\"0\">\n *          Section 4\n *        </Button>\n *      </TabbableContainer>\n *    </div>\n *  );\n *  ```\n */\nexport const TabbableContainer = forwardRef( UnforwardedTabbableContainer );\n\nexport default TabbableContainer;\n"],"mappings":";;;;;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,UAAA,GAAAC,sBAAA,CAAAF,OAAA;AAA6C,IAAAG,WAAA,GAAAH,OAAA;AAb7C;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAIO,SAASI,4BAA4BA,CAC3C;EAAEC,aAAa;EAAE,GAAGC;AAA8B,CAAC,EACnDC,GAAwB,EACvB;EACD,MAAMC,kBAAkB,GAAKC,GAAkB,IAAM;IACpD,MAAM;MAAEC,IAAI;MAAEC;IAAS,CAAC,GAAGF,GAAG;IAC9B,IAAK,KAAK,KAAKC,IAAI,EAAG;MACrB,OAAOC,QAAQ,GAAG,CAAC,CAAC,GAAG,CAAC;IACzB;;IAEA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA,IAAKN,aAAa,EAAG;MACpB,OAAOA,aAAa,CAAEI,GAAI,CAAC;IAC5B;IAEA,OAAOG,SAAS;EACjB,CAAC;EAED,oBACC,IAAAT,WAAA,CAAAU,GAAA,EAACZ,UAAA,CAAAa,OAAkB;IAClBP,GAAG,EAAGA,GAAK;IACXQ,oBAAoB;IACpBC,mBAAmB;IACnBX,aAAa,EAAGG,kBAAoB;IAAA,GAC/BF;EAAK,CACV,CAAC;AAEJ;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMW,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG,IAAAE,mBAAU,EAAEf,4BAA6B,CAAC;AAAC,IAAAgB,QAAA,GAAAF,OAAA,CAAAJ,OAAA,GAE7DG,iBAAiB","ignoreList":[]}

package/build/navigation/back-button/index.js

@@ -5,13 +5,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.NavigationBackButton = void 0;
-var _react = require("react");
 var _clsx = _interopRequireDefault(require("clsx"));
 var _element = require("@wordpress/element");
 var _i18n = require("@wordpress/i18n");
 var _icons = require("@wordpress/icons");
 var _context = require("../context");
 var _navigationStyles = require("../styles/navigation-styles");
+var _jsxRuntime = require("react/jsx-runtime");
 /**
  * External dependencies
  */
@@ -47,15 +47,16 @@ function UnforwardedNavigationBackButton({
     }
   };
   const icon = (0, _i18n.isRTL)() ? _icons.chevronRight : _icons.chevronLeft;
-  return (0, _react.createElement)(_navigationStyles.MenuBackButtonUI, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_navigationStyles.MenuBackButtonUI, {
     className: classes,
     href: href,
     variant: "tertiary",
     ref: ref,
-    onClick: handleOnClick
-  }, (0, _react.createElement)(_icons.Icon, {
-    icon: icon
-  }), backButtonLabel || parentMenuTitle || (0, _i18n.__)('Back'));
+    onClick: handleOnClick,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.Icon, {
+      icon: icon
+    }), backButtonLabel || parentMenuTitle || (0, _i18n.__)('Back')]
+  });
 }
 
 /**

package/build/navigation/back-button/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_clsx","_interopRequireDefault","require","_element","_i18n","_icons","_context","_navigationStyles","UnforwardedNavigationBackButton","backButtonLabel","className","href","onClick","parentMenu","ref","setActiveMenu","navigationTree","useNavigationContext","classes","clsx","parentMenuTitle","undefined","getMenu","title","handleOnClick","event","animationDirection","isRTL","defaultPrevented","icon","chevronRight","chevronLeft","_react","createElement","MenuBackButtonUI","variant","Icon","__","NavigationBackButton","exports","forwardRef","_default","default"],"sources":["@wordpress/components/src/navigation/back-button/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport { __, isRTL } from '@wordpress/i18n';\nimport { Icon, chevronLeft, chevronRight } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { useNavigationContext } from '../context';\nimport { MenuBackButtonUI } from '../styles/navigation-styles';\n\nimport type { NavigationBackButtonProps } from '../types';\n\nfunction UnforwardedNavigationBackButton(\n\t{\n\t\tbackButtonLabel,\n\t\tclassName,\n\t\thref,\n\t\tonClick,\n\t\tparentMenu,\n\t}: NavigationBackButtonProps,\n\tref: React.ForwardedRef< HTMLAnchorElement | HTMLButtonElement >\n) {\n\tconst { setActiveMenu, navigationTree } = useNavigationContext();\n\n\tconst classes = clsx( 'components-navigation__back-button', className );\n\n\tconst parentMenuTitle =\n\t\tparentMenu !== undefined\n\t\t\t? navigationTree.getMenu( parentMenu )?.title\n\t\t\t: undefined;\n\n\tconst handleOnClick: React.MouseEventHandler< HTMLElement > = ( event ) => {\n\t\tif ( typeof onClick === 'function' ) {\n\t\t\tonClick( event );\n\t\t}\n\n\t\tconst animationDirection = isRTL() ? 'left' : 'right';\n\t\tif ( parentMenu && ! event.defaultPrevented ) {\n\t\t\tsetActiveMenu( parentMenu, animationDirection );\n\t\t}\n\t};\n\tconst icon = isRTL() ? chevronRight : chevronLeft;\n\treturn (\n\t\t<MenuBackButtonUI\n\t\t\tclassName={ classes }\n\t\t\thref={ href }\n\t\t\tvariant=\"tertiary\"\n\t\t\tref={ ref }\n\t\t\tonClick={ handleOnClick }\n\t\t>\n\t\t\t<Icon icon={ icon } />\n\t\t\t{ backButtonLabel || parentMenuTitle || __( 'Back' ) }\n\t\t</MenuBackButtonUI>\n\t);\n}\n\n/**\n * @deprecated Use `Navigator` instead.\n */\nexport const NavigationBackButton = forwardRef(\n\tUnforwardedNavigationBackButton\n);\n\nexport default NavigationBackButton;\n"],"mappings":";;;;;;;;AAGA,IAAAA,KAAA,GAAAC,sBAAA,CAAAC,OAAA;AAIA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AAKA,IAAAI,QAAA,GAAAJ,OAAA;AACA,IAAAK,iBAAA,GAAAL,OAAA;AAfA;AACA;AACA;;AAEA;AACA;AACA;;AAKA;AACA;AACA;;AAMA,SAASM,+BAA+BA,CACvC;EACCC,eAAe;EACfC,SAAS;EACTC,IAAI;EACJC,OAAO;EACPC;AAC0B,CAAC,EAC5BC,GAAgE,EAC/D;EACD,MAAM;IAAEC,aAAa;IAAEC;EAAe,CAAC,GAAG,IAAAC,6BAAoB,EAAC,CAAC;EAEhE,MAAMC,OAAO,GAAG,IAAAC,aAAI,EAAE,oCAAoC,EAAET,SAAU,CAAC;EAEvE,MAAMU,eAAe,GACpBP,UAAU,KAAKQ,SAAS,GACrBL,cAAc,CAACM,OAAO,CAAET,UAAW,CAAC,EAAEU,KAAK,GAC3CF,SAAS;EAEb,MAAMG,aAAqD,GAAKC,KAAK,IAAM;IAC1E,IAAK,OAAOb,OAAO,KAAK,UAAU,EAAG;MACpCA,OAAO,CAAEa,KAAM,CAAC;IACjB;IAEA,MAAMC,kBAAkB,GAAG,IAAAC,WAAK,EAAC,CAAC,GAAG,MAAM,GAAG,OAAO;IACrD,IAAKd,UAAU,IAAI,CAAEY,KAAK,CAACG,gBAAgB,EAAG;MAC7Cb,aAAa,CAAEF,UAAU,EAAEa,kBAAmB,CAAC;IAChD;EACD,CAAC;EACD,MAAMG,IAAI,GAAG,IAAAF,WAAK,EAAC,CAAC,GAAGG,mBAAY,GAAGC,kBAAW;EACjD,OACC,IAAAC,MAAA,CAAAC,aAAA,EAAC1B,iBAAA,CAAA2B,gBAAgB;IAChBxB,SAAS,EAAGQ,OAAS;IACrBP,IAAI,EAAGA,IAAM;IACbwB,OAAO,EAAC,UAAU;IAClBrB,GAAG,EAAGA,GAAK;IACXF,OAAO,EAAGY;EAAe,GAEzB,IAAAQ,MAAA,CAAAC,aAAA,EAAC5B,MAAA,CAAA+B,IAAI;IAACP,IAAI,EAAGA;EAAM,CAAE,CAAC,EACpBpB,eAAe,IAAIW,eAAe,IAAI,IAAAiB,QAAE,EAAE,MAAO,CAClC,CAAC;AAErB;;AAEA;AACA;AACA;AACO,MAAMC,oBAAoB,GAAAC,OAAA,CAAAD,oBAAA,GAAG,IAAAE,mBAAU,EAC7ChC,+BACD,CAAC;AAAC,IAAAiC,QAAA,GAAAF,OAAA,CAAAG,OAAA,GAEaJ,oBAAoB","ignoreList":[]}
+{"version":3,"names":["_clsx","_interopRequireDefault","require","_element","_i18n","_icons","_context","_navigationStyles","_jsxRuntime","UnforwardedNavigationBackButton","backButtonLabel","className","href","onClick","parentMenu","ref","setActiveMenu","navigationTree","useNavigationContext","classes","clsx","parentMenuTitle","undefined","getMenu","title","handleOnClick","event","animationDirection","isRTL","defaultPrevented","icon","chevronRight","chevronLeft","jsxs","MenuBackButtonUI","variant","children","jsx","Icon","__","NavigationBackButton","exports","forwardRef","_default","default"],"sources":["@wordpress/components/src/navigation/back-button/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport { __, isRTL } from '@wordpress/i18n';\nimport { Icon, chevronLeft, chevronRight } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { useNavigationContext } from '../context';\nimport { MenuBackButtonUI } from '../styles/navigation-styles';\n\nimport type { NavigationBackButtonProps } from '../types';\n\nfunction UnforwardedNavigationBackButton(\n\t{\n\t\tbackButtonLabel,\n\t\tclassName,\n\t\thref,\n\t\tonClick,\n\t\tparentMenu,\n\t}: NavigationBackButtonProps,\n\tref: React.ForwardedRef< HTMLAnchorElement | HTMLButtonElement >\n) {\n\tconst { setActiveMenu, navigationTree } = useNavigationContext();\n\n\tconst classes = clsx( 'components-navigation__back-button', className );\n\n\tconst parentMenuTitle =\n\t\tparentMenu !== undefined\n\t\t\t? navigationTree.getMenu( parentMenu )?.title\n\t\t\t: undefined;\n\n\tconst handleOnClick: React.MouseEventHandler< HTMLElement > = ( event ) => {\n\t\tif ( typeof onClick === 'function' ) {\n\t\t\tonClick( event );\n\t\t}\n\n\t\tconst animationDirection = isRTL() ? 'left' : 'right';\n\t\tif ( parentMenu && ! event.defaultPrevented ) {\n\t\t\tsetActiveMenu( parentMenu, animationDirection );\n\t\t}\n\t};\n\tconst icon = isRTL() ? chevronRight : chevronLeft;\n\treturn (\n\t\t<MenuBackButtonUI\n\t\t\tclassName={ classes }\n\t\t\thref={ href }\n\t\t\tvariant=\"tertiary\"\n\t\t\tref={ ref }\n\t\t\tonClick={ handleOnClick }\n\t\t>\n\t\t\t<Icon icon={ icon } />\n\t\t\t{ backButtonLabel || parentMenuTitle || __( 'Back' ) }\n\t\t</MenuBackButtonUI>\n\t);\n}\n\n/**\n * @deprecated Use `Navigator` instead.\n */\nexport const NavigationBackButton = forwardRef(\n\tUnforwardedNavigationBackButton\n);\n\nexport default NavigationBackButton;\n"],"mappings":";;;;;;;AAGA,IAAAA,KAAA,GAAAC,sBAAA,CAAAC,OAAA;AAIA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AAKA,IAAAI,QAAA,GAAAJ,OAAA;AACA,IAAAK,iBAAA,GAAAL,OAAA;AAA+D,IAAAM,WAAA,GAAAN,OAAA;AAf/D;AACA;AACA;;AAEA;AACA;AACA;;AAKA;AACA;AACA;;AAMA,SAASO,+BAA+BA,CACvC;EACCC,eAAe;EACfC,SAAS;EACTC,IAAI;EACJC,OAAO;EACPC;AAC0B,CAAC,EAC5BC,GAAgE,EAC/D;EACD,MAAM;IAAEC,aAAa;IAAEC;EAAe,CAAC,GAAG,IAAAC,6BAAoB,EAAC,CAAC;EAEhE,MAAMC,OAAO,GAAG,IAAAC,aAAI,EAAE,oCAAoC,EAAET,SAAU,CAAC;EAEvE,MAAMU,eAAe,GACpBP,UAAU,KAAKQ,SAAS,GACrBL,cAAc,CAACM,OAAO,CAAET,UAAW,CAAC,EAAEU,KAAK,GAC3CF,SAAS;EAEb,MAAMG,aAAqD,GAAKC,KAAK,IAAM;IAC1E,IAAK,OAAOb,OAAO,KAAK,UAAU,EAAG;MACpCA,OAAO,CAAEa,KAAM,CAAC;IACjB;IAEA,MAAMC,kBAAkB,GAAG,IAAAC,WAAK,EAAC,CAAC,GAAG,MAAM,GAAG,OAAO;IACrD,IAAKd,UAAU,IAAI,CAAEY,KAAK,CAACG,gBAAgB,EAAG;MAC7Cb,aAAa,CAAEF,UAAU,EAAEa,kBAAmB,CAAC;IAChD;EACD,CAAC;EACD,MAAMG,IAAI,GAAG,IAAAF,WAAK,EAAC,CAAC,GAAGG,mBAAY,GAAGC,kBAAW;EACjD,oBACC,IAAAxB,WAAA,CAAAyB,IAAA,EAAC1B,iBAAA,CAAA2B,gBAAgB;IAChBvB,SAAS,EAAGQ,OAAS;IACrBP,IAAI,EAAGA,IAAM;IACbuB,OAAO,EAAC,UAAU;IAClBpB,GAAG,EAAGA,GAAK;IACXF,OAAO,EAAGY,aAAe;IAAAW,QAAA,gBAEzB,IAAA5B,WAAA,CAAA6B,GAAA,EAAChC,MAAA,CAAAiC,IAAI;MAACR,IAAI,EAAGA;IAAM,CAAE,CAAC,EACpBpB,eAAe,IAAIW,eAAe,IAAI,IAAAkB,QAAE,EAAE,MAAO,CAAC;EAAA,CACnC,CAAC;AAErB;;AAEA;AACA;AACA;AACO,MAAMC,oBAAoB,GAAAC,OAAA,CAAAD,oBAAA,GAAG,IAAAE,mBAAU,EAC7CjC,+BACD,CAAC;AAAC,IAAAkC,QAAA,GAAAF,OAAA,CAAAG,OAAA,GAEaJ,oBAAoB","ignoreList":[]}