npm - @wordpress/components - Versions diffs - 25.5.0 → 25.6.1 - Mend

@wordpress/components 25.5.0 → 25.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3594) hide show

package/build/sandbox/index.native.js CHANGED Viewed

@@ -1,22 +1,15 @@
 "use strict";
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 var _element = require("@wordpress/element");
 var _reactNative = require("react-native");
 var _reactNativeWebview = require("react-native-webview");
 var _compose = require("@wordpress/compose");
 var _style = _interopRequireDefault(require("./style.scss"));
 /**
  * External dependencies
  */
@@ -28,6 +21,7 @@ var _style = _interopRequireDefault(require("./style.scss"));
 /**
  * Internal dependencies
  */
 const observeAndResizeJS = `
 	(function() {
 		const { MutationObserver } = window;
@@ -192,25 +186,23 @@ const Sandbox = (0, _element.forwardRef)(function Sandbox({
   const colorScheme = (0, _compose.usePreferredColorScheme)();
   const [height, setHeight] = (0, _element.useState)(0);
   const [contentHtml, setContentHtml] = (0, _element.useState)(getHtmlDoc());
   const windowSize = _reactNative.Dimensions.get('window');
   const [isLandscape, setIsLandscape] = (0, _element.useState)(windowSize.width >= windowSize.height);
-  const wasLandscape = (0, _element.useRef)(isLandscape); // On Android, we need to recreate the WebView on any of the following actions, otherwise it disappears:
+  const wasLandscape = (0, _element.useRef)(isLandscape);
+  // On Android, we need to recreate the WebView on any of the following actions, otherwise it disappears:
   // - Device rotation
   // - Light/dark mode changes
   // For this purpose, the key prop used in the WebView will be updated with the value of the actions.
   const key = _element.Platform.select({
     android: `${url}-${isLandscape ? 'landscape' : 'portrait'}-${colorScheme}`,
     ios: url
   });
   function getHtmlDoc() {
     // Put the html snippet into a html document, and update the state to refresh the WebView,
     // we can use this in the future to inject custom styles or scripts.
     // Scripts go into the body rather than the head, to support embedded content such as Instagram
     // that expect the scripts to be part of the body.
     // Avoid comma issues with props.viewportProps.
     const addViewportProps = viewportProps.trim().replace(/(^[^,])/, ', $1');
     const htmlDoc = (0, _element.createElement)("html", {
@@ -240,11 +232,11 @@ const Sandbox = (0, _element.forwardRef)(function Sandbox({
     }))));
     return '<!DOCTYPE html>' + (0, _element.renderToString)(htmlDoc);
   }
   const getInjectedJavaScript = (0, _element.useCallback)(() => {
     // Allow parent to override the resize observers with prop.customJS (legacy support)
-    let injectedJS = customJS || observeAndResizeJS; // Add any event listeners that were passed in.
+    let injectedJS = customJS || observeAndResizeJS;
+    // Add any event listeners that were passed in.
     Object.keys(onWindowEvents).forEach(eventType => {
       injectedJS += `
 				window.addEventListener( '${eventType}', function( event ) {
@@ -253,10 +245,8 @@ const Sandbox = (0, _element.forwardRef)(function Sandbox({
     });
     return injectedJS;
   }, [customJS, onWindowEvents]);
   function updateContentHtml(forceRerender = false) {
     const newContentHtml = getHtmlDoc();
     if (forceRerender && contentHtml === newContentHtml) {
       // The re-render is forced by updating the state with empty HTML,
       // waiting for the JS code to be executed with "setImmediate" and then
@@ -267,7 +257,6 @@ const Sandbox = (0, _element.forwardRef)(function Sandbox({
       setContentHtml(newContentHtml);
     }
   }
   function getSizeStyle() {
     const contentHeight = Math.ceil(height);
     return contentHeight ? {
@@ -276,26 +265,23 @@ const Sandbox = (0, _element.forwardRef)(function Sandbox({
       aspectRatio: 1
     };
   }
   function onChangeDimensions(dimensions) {
     setIsLandscape(dimensions.window.width >= dimensions.window.height);
   }
   const onMessage = (0, _element.useCallback)(message => {
     let data = message?.nativeEvent?.data;
     try {
       data = JSON.parse(data);
     } catch (e) {
       return;
-    } // check for resize event
+    }
+    // check for resize event
     if ('resize' === data?.action) {
       setHeight(data.height);
-    } // Forward the event to parent event listeners
+    }
+    // Forward the event to parent event listeners
     Object.keys(onWindowEvents).forEach(eventType => {
       if (data?.type === eventType) {
         try {
@@ -309,13 +295,13 @@ const Sandbox = (0, _element.forwardRef)(function Sandbox({
   }, [onWindowEvents]);
   (0, _element.useEffect)(() => {
     const dimensionsChangeSubscription = _reactNative.Dimensions.addEventListener('change', onChangeDimensions);
     return () => {
       dimensionsChangeSubscription.remove();
     };
   }, []);
   (0, _element.useEffect)(() => {
-    updateContentHtml(); // Disable reason: deferring this refactor to the native team.
+    updateContentHtml();
+    // Disable reason: deferring this refactor to the native team.
     // see https://github.com/WordPress/gutenberg/pull/41166
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [html, title, type, styles, scripts]);
@@ -325,7 +311,6 @@ const Sandbox = (0, _element.forwardRef)(function Sandbox({
     if (wasLandscape.current !== isLandscape) {
       setHeight(0);
     }
     wasLandscape.current = isLandscape;
   }, [isLandscape]);
   return (0, _element.createElement)(_reactNativeWebview.WebView, {
@@ -336,7 +321,8 @@ const Sandbox = (0, _element.forwardRef)(function Sandbox({
     source: {
       baseUrl: providerUrl,
       html: contentHtml
-    } // Wildcard value is required for static HTML
+    }
+    // Wildcard value is required for static HTML
     // Reference: https://github.com/react-native-webview/react-native-webview/blob/master/docs/Reference.md#source
     ,
     originWhitelist: ['*'],
@@ -351,7 +337,6 @@ const Sandbox = (0, _element.forwardRef)(function Sandbox({
     testID: testID
   });
 });
 const workaroundStyles = _reactNative.StyleSheet.create({
   webView: {
     /**
@@ -362,8 +347,6 @@ const workaroundStyles = _reactNative.StyleSheet.create({
     opacity: 0.99
   }
 });
 var _default = (0, _element.memo)(Sandbox);
 exports.default = _default;
 //# sourceMappingURL=index.native.js.map

package/build/sandbox/index.native.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/sandbox/index.native.js"],"names":["observeAndResizeJS","style","EMPTY_ARRAY","Sandbox","containerStyle","customJS","html","lang","providerUrl","scripts","styles","title","type","url","onWindowEvents","viewportProps","onLoadEnd","testID","ref","colorScheme","height","setHeight","contentHtml","setContentHtml","getHtmlDoc","windowSize","Dimensions","get","isLandscape","setIsLandscape","width","wasLandscape","key","Platform","select","android","ios","addViewportProps","trim","replace","htmlDoc","__html","map","rules","i","src","getInjectedJavaScript","injectedJS","Object","keys","forEach","eventType","updateContentHtml","forceRerender","newContentHtml","setImmediate","getSizeStyle","contentHeight","Math","ceil","aspectRatio","onChangeDimensions","dimensions","window","onMessage","message","data","nativeEvent","JSON","parse","e","action","console","warn","dimensionsChangeSubscription","addEventListener","remove","current","sandboxStyles","baseUrl","isAndroid","workaroundStyles","webView","StyleSheet","create","opacity"],"mappings":";;;;;;;;;AASA;;AANA;;AACA;;AAeA;;AAKA;;AAxBA;AACA;AACA;;AAIA;AACA;AACA;;AAaA;AACA;AACA;AAGA,MAAMA,kBAAkB,GAAI;AAC5B;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;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CA7EA;AA+EA,MAAMC,KAAK,GAAI;AACf;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;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,CAjEA;AAmEA,MAAMC,WAAW,GAAG,EAApB;AAEA,MAAMC,OAAO,GAAG,yBAAY,SAASA,OAAT,CAC3B;AACCC,EAAAA,cADD;AAECC,EAAAA,QAFD;AAGCC,EAAAA,IAAI,GAAG,EAHR;AAICC,EAAAA,IAAI,GAAG,IAJR;AAKCC,EAAAA,WAAW,GAAG,EALf;AAMCC,EAAAA,OAAO,GAAGP,WANX;AAOCQ,EAAAA,MAAM,GAAGR,WAPV;AAQCS,EAAAA,KAAK,GAAG,EART;AASCC,EAAAA,IATD;AAUCC,EAAAA,GAVD;AAWCC,EAAAA,cAAc,GAAG,EAXlB;AAYCC,EAAAA,a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","sourcesContent":["/*\n External dependencies\n /\nimport { Dimensions, StyleSheet } from 'react-native';\nimport { WebView } from 'react-native-webview';\n\n/\n WordPress dependencies\n /\nimport {\n\tPlatform,\n\trenderToString,\n\tmemo,\n\tuseRef,\n\tuseState,\n\tuseEffect,\n\tforwardRef,\n\tuseCallback,\n} from '@wordpress/element';\nimport { usePreferredColorScheme } from '@wordpress/compose';\n\n/\n Internal dependencies\n /\nimport sandboxStyles from './style.scss';\n\nconst observeAndResizeJS = `\n\t(function() {\n\t\tconst { MutationObserver } = window;\n\n\t\tif ( ! MutationObserver \|\| ! document.body \|\| ! window.parent ) {\n\t\t\treturn;\n\t\t}\n\n\t\tfunction sendResize() {\n\t\t\tconst clientBoundingRect = document.body.getBoundingClientRect();\n\n\t\t\t// The function postMessage is exposed by the react-native-webview library\n\t\t\t// to communicate between React Native and the WebView, in this case,\n\t\t\t// we use it for notifying resize changes.\n\t\t\twindow.ReactNativeWebView.postMessage(\n\t\t\t\tJSON.stringify( {\n\t\t\t\t\taction: 'resize',\n\t\t\t\t\twidth: clientBoundingRect.width,\n\t\t\t\t\theight: clientBoundingRect.height,\n\t\t\t\t} )\n\t\t\t);\n\t\t}\n\n\t\tconst observer = new MutationObserver( sendResize );\n\t\tobserver.observe( document.body, {\n\t\t\tattributes: true,\n\t\t\tattributeOldValue: false,\n\t\t\tcharacterData: true,\n\t\t\tcharacterDataOldValue: false,\n\t\t\tchildList: true,\n\t\t\tsubtree: true,\n\t\t} );\n\n\t\twindow.addEventListener( 'load', sendResize, true );\n\n\t\t// Hack: Remove viewport unit styles, as these are relative\n\t\t// the iframe root and interfere with our mechanism for\n\t\t// determining the unconstrained page bounds.\n\t\tfunction removeViewportStyles( ruleOrNode ) {\n\t\t\tif ( ruleOrNode.style ) {\n\t\t\t\t[ 'width', 'height', 'minHeight', 'maxHeight' ].forEach( function (\n\t\t\t\t\tstyle\n\t\t\t\t) {\n\t\t\t\t\tif (\n\t\t\t\t\t\t/^\\\\d+(vmin\|vmax\|vh\|vw)$/.test( ruleOrNode.style[ style ] )\n\t\t\t\t\t) {\n\t\t\t\t\t\truleOrNode.style[ style ] = '';\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t}\n\t\t}\n\n\t\tArray.prototype.forEach.call(\n\t\t\tdocument.querySelectorAll( '[style]' ),\n\t\t\tremoveViewportStyles\n\t\t);\n\t\tArray.prototype.forEach.call(\n\t\t\tdocument.styleSheets,\n\t\t\tfunction ( stylesheet ) {\n\t\t\t\tArray.prototype.forEach.call(\n\t\t\t\t\tstylesheet.cssRules \|\| stylesheet.rules,\n\t\t\t\t\tremoveViewportStyles\n\t\t\t\t);\n\t\t\t}\n\t\t);\n\n\t\tdocument.body.style.position = 'absolute';\n\t\tdocument.body.style.width = '100%';\n\t\tdocument.body.setAttribute( 'data-resizable-iframe-connected', '' );\n\n\t\tsendResize();\n\n\t\t// Resize events can change the width of elements with 100% width, but we don't\n\t\t// get an DOM mutations for that, so do the resize when the window is resized, too.\n\t\twindow.addEventListener( 'resize', sendResize, true );\n\t\twindow.addEventListener( 'orientationchange', sendResize, true );\n\t})();\n`;\n\nconst style = `\n\tbody {\n\t\tmargin: 0;\n\t}\n\thtml,\n\tbody,\n\tbody > div,\n\tbody > div iframe {\n\t\twidth: 100%;\n\t}\n\tbody > div > {\n\t\tmargin-top: 0 !important; /* Has to have !important to override inline styles. /\n\t\tmargin-bottom: 0 !important;\n\t}\n\n\t.wp-block-embed__wrapper {\n\t\tposition: relative;\n\t}\n\n\tbody.wp-has-aspect-ratio > div iframe {\n\t\theight: 100%;\n\t\toverflow: hidden; / If it has an aspect ratio, it shouldn't scroll. /\n\t}\n\n\t/\n\t Add responsiveness to embeds with aspect ratios.\n\t \n\t These styles have been copied from the web version (https://github.com/WordPress/gutenberg/blob/7901895ca20cf61e402925e31571d659dab64721/packages/block-library/src/embed/style.scss#L42-L89) and\n\t * adapted for the native version.\n\t /\n\t.wp-has-aspect-ratio.wp-block-embed__wrapper::before {\n\t\tcontent: \"\";\n\t\tdisplay: block;\n\t\tpadding-top: 50%; // Default to 2:1 aspect ratio.\n\t}\n\t.wp-has-aspect-ratio iframe {\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tright: 0;\n\t\tbottom: 0;\n\t\tleft: 0;\n\t\theight: 100%;\n\t\twidth: 100%;\n\t}\n\t.wp-embed-aspect-21-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 42.85%; // 9 / 21 100\n\t}\n\t.wp-embed-aspect-18-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 50%; // 9 / 18 * 100\n\t}\n\t.wp-embed-aspect-16-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 56.25%; // 9 / 16 * 100\n\t}\n\t.wp-embed-aspect-4-3.wp-block-embed__wrapper::before {\n\t\tpadding-top: 75%; // 3 / 4 * 100\n\t}\n\t.wp-embed-aspect-1-1.wp-block-embed__wrapper::before {\n\t\tpadding-top: 100%; // 1 / 1 * 100\n\t}\n\t.wp-embed-aspect-9-16.wp-block-embed__wrapper::before {\n\t\tpadding-top: 177.77%; // 16 / 9 * 100\n\t}\n\t.wp-embed-aspect-1-2.wp-block-embed__wrapper::before {\n\t\tpadding-top: 200%; // 2 / 1 * 100\n\t}\n`;\n\nconst EMPTY_ARRAY = [];\n\nconst Sandbox = forwardRef( function Sandbox(\n\t{\n\t\tcontainerStyle,\n\t\tcustomJS,\n\t\thtml = '',\n\t\tlang = 'en',\n\t\tproviderUrl = '',\n\t\tscripts = EMPTY_ARRAY,\n\t\tstyles = EMPTY_ARRAY,\n\t\ttitle = '',\n\t\ttype,\n\t\turl,\n\t\tonWindowEvents = {},\n\t\tviewportProps = '',\n\t\tonLoadEnd = () => {},\n\t\ttestID,\n\t},\n\tref\n) {\n\tconst colorScheme = usePreferredColorScheme();\n\tconst [ height, setHeight ] = useState( 0 );\n\tconst [ contentHtml, setContentHtml ] = useState( getHtmlDoc() );\n\n\tconst windowSize = Dimensions.get( 'window' );\n\tconst [ isLandscape, setIsLandscape ] = useState(\n\t\twindowSize.width >= windowSize.height\n\t);\n\tconst wasLandscape = useRef( isLandscape );\n\t// On Android, we need to recreate the WebView on any of the following actions, otherwise it disappears:\n\t// - Device rotation\n\t// - Light/dark mode changes\n\t// For this purpose, the key prop used in the WebView will be updated with the value of the actions.\n\tconst key = Platform.select( {\n\t\tandroid: `${ url }-${\n\t\t\tisLandscape ? 'landscape' : 'portrait'\n\t\t}-${ colorScheme }`,\n\t\tios: url,\n\t} );\n\n\tfunction getHtmlDoc() {\n\t\t// Put the html snippet into a html document, and update the state to refresh the WebView,\n\t\t// we can use this in the future to inject custom styles or scripts.\n\t\t// Scripts go into the body rather than the head, to support embedded content such as Instagram\n\t\t// that expect the scripts to be part of the body.\n\n\t\t// Avoid comma issues with props.viewportProps.\n\t\tconst addViewportProps = viewportProps\n\t\t\t.trim()\n\t\t\t.replace( /(^[^,])/, ', $1' );\n\n\t\tconst htmlDoc = (\n\t\t\t<html lang={ lang }>\n\t\t\t\t<head>\n\t\t\t\t\t<title>{ title }</title>\n\t\t\t\t\t<meta\n\t\t\t\t\t\tname=\"viewport\"\n\t\t\t\t\t\tcontent={ `width=device-width, initial-scale=1${ addViewportProps }` }\n\t\t\t\t\t></meta>\n\t\t\t\t\t<style dangerouslySetInnerHTML={ { __html: style } } />\n\t\t\t\t\t{ styles.map( ( rules, i ) => (\n\t\t\t\t\t\t<style\n\t\t\t\t\t\t\tkey={ i }\n\t\t\t\t\t\t\tdangerouslySetInnerHTML={ { __html: rules } }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t</head>\n\t\t\t\t<body\n\t\t\t\t\tdata-resizable-iframe-connected=\"data-resizable-iframe-connected\"\n\t\t\t\t\tclassName={ type }\n\t\t\t\t>\n\t\t\t\t\t<div dangerouslySetInnerHTML={ { __html: html } } />\n\t\t\t\t\t{ scripts.map( ( src ) => (\n\t\t\t\t\t\t<script key={ src } src={ src } />\n\t\t\t\t\t) ) }\n\t\t\t\t</body>\n\t\t\t</html>\n\t\t);\n\t\treturn '<!DOCTYPE html>' + renderToString( htmlDoc );\n\t}\n\n\tconst getInjectedJavaScript = useCallback( () => {\n\t\t// Allow parent to override the resize observers with prop.customJS (legacy support)\n\t\tlet injectedJS = customJS \|\| observeAndResizeJS;\n\n\t\t// Add any event listeners that were passed in.\n\t\tObject.keys( onWindowEvents ).forEach( ( eventType ) => {\n\t\t\tinjectedJS += `\n\t\t\t\twindow.addEventListener( '${ eventType }', function( event ) {\n\t\t\t\t\twindow.ReactNativeWebView.postMessage( JSON.stringify( { type: '${ eventType }', ...event.data } ) );\n\t\t\t\t});`;\n\t\t} );\n\n\t\treturn injectedJS;\n\t}, [ customJS, onWindowEvents ] );\n\n\tfunction updateContentHtml( forceRerender = false ) {\n\t\tconst newContentHtml = getHtmlDoc();\n\n\t\tif ( forceRerender && contentHtml === newContentHtml ) {\n\t\t\t// The re-render is forced by updating the state with empty HTML,\n\t\t\t// waiting for the JS code to be executed with \"setImmediate\" and then\n\t\t\t// setting the content HTML again.\n\t\t\tsetContentHtml( '' );\n\t\t\tsetImmediate( () => setContentHtml( newContentHtml ) );\n\t\t} else {\n\t\t\tsetContentHtml( newContentHtml );\n\t\t}\n\t}\n\n\tfunction getSizeStyle() {\n\t\tconst contentHeight = Math.ceil( height );\n\n\t\treturn contentHeight ? { height: contentHeight } : { aspectRatio: 1 };\n\t}\n\n\tfunction onChangeDimensions( dimensions ) {\n\t\tsetIsLandscape( dimensions.window.width >= dimensions.window.height );\n\t}\n\n\tconst onMessage = useCallback(\n\t\t( message ) => {\n\t\t\tlet data = message?.nativeEvent?.data;\n\n\t\t\ttry {\n\t\t\t\tdata = JSON.parse( data );\n\t\t\t} catch ( e ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// check for resize event\n\t\t\tif ( 'resize' === data?.action ) {\n\t\t\t\tsetHeight( data.height );\n\t\t\t}\n\n\t\t\t// Forward the event to parent event listeners\n\t\t\tObject.keys( onWindowEvents ).forEach( ( eventType ) => {\n\t\t\t\tif ( data?.type === eventType ) {\n\t\t\t\t\ttry {\n\t\t\t\t\t\tonWindowEvents[ eventType ]( data );\n\t\t\t\t\t} catch ( e ) {\n\t\t\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\t\t\tconsole.warn(\n\t\t\t\t\t\t\t`Error handling event ${ eventType }`,\n\t\t\t\t\t\t\te\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\t\t},\n\t\t[ onWindowEvents ]\n\t);\n\n\tuseEffect( () => {\n\t\tconst dimensionsChangeSubscription = Dimensions.addEventListener(\n\t\t\t'change',\n\t\t\tonChangeDimensions\n\t\t);\n\t\treturn () => {\n\t\t\tdimensionsChangeSubscription.remove();\n\t\t};\n\t}, [] );\n\n\tuseEffect( () => {\n\t\tupdateContentHtml();\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}, [ html, title, type, styles, scripts ] );\n\n\tuseEffect( () => {\n\t\t// When device orientation changes we have to recalculate the size,\n\t\t// for this purpose we reset the current size value.\n\t\tif ( wasLandscape.current !== isLandscape ) {\n\t\t\tsetHeight( 0 );\n\t\t}\n\t\twasLandscape.current = isLandscape;\n\t}, [ isLandscape ] );\n\n\treturn (\n\t\t<WebView\n\t\t\tcontainerStyle={ [\n\t\t\t\tsandboxStyles[ 'sandbox-webview__container' ],\n\t\t\t\tcontainerStyle,\n\t\t\t] }\n\t\t\tinjectedJavaScript={ getInjectedJavaScript() }\n\t\t\tkey={ key }\n\t\t\tref={ ref }\n\t\t\tsource={ { baseUrl: providerUrl, html: contentHtml } }\n\t\t\t// Wildcard value is required for static HTML\n\t\t\t// Reference: https://github.com/react-native-webview/react-native-webview/blob/master/docs/Reference.md#source\n\t\t\toriginWhitelist={ [ '' ] }\n\t\t\tstyle={ [\n\t\t\t\tsandboxStyles[ 'sandbox-webview__content' ],\n\t\t\t\tgetSizeStyle(),\n\t\t\t\tPlatform.isAndroid && workaroundStyles.webView,\n\t\t\t] }\n\t\t\tonMessage={ onMessage }\n\t\t\tscrollEnabled={ false }\n\t\t\tsetBuiltInZoomControls={ false }\n\t\t\tshowsHorizontalScrollIndicator={ false }\n\t\t\tshowsVerticalScrollIndicator={ false }\n\t\t\tmediaPlaybackRequiresUserAction={ false }\n\t\t\tonLoadEnd={ onLoadEnd }\n\t\t\ttestID={ testID }\n\t\t/>\n\t);\n} );\n\nconst workaroundStyles = StyleSheet.create( {\n\twebView: {\n\t\t/\n\t\t The slight opacity below is a workaround for an Android crash caused from combining Android\n\t\t * 12's new scroll overflow behavior and webviews.\n\t\t * https://github.com/react-native-webview/react-native-webview/issues/1915#issuecomment-808869253\n\t\t */\n\t\topacity: 0.99,\n\t},\n} );\n\nexport default memo( Sandbox );\n"]}
1	+ {"version":3,"names":["_element","require","_reactNative","_reactNativeWebview","_compose","_style","_interopRequireDefault","observeAndResizeJS","style","EMPTY_ARRAY","Sandbox","forwardRef","containerStyle","customJS","html","lang","providerUrl","scripts","styles","title","type","url","onWindowEvents","viewportProps","onLoadEnd","testID","ref","colorScheme","usePreferredColorScheme","height","setHeight","useState","contentHtml","setContentHtml","getHtmlDoc","windowSize","Dimensions","get","isLandscape","setIsLandscape","width","wasLandscape","useRef","key","Platform","select","android","ios","addViewportProps","trim","replace","htmlDoc","createElement","name","content","dangerouslySetInnerHTML","__html","map","rules","i","className","src","renderToString","getInjectedJavaScript","useCallback","injectedJS","Object","keys","forEach","eventType","updateContentHtml","forceRerender","newContentHtml","setImmediate","getSizeStyle","contentHeight","Math","ceil","aspectRatio","onChangeDimensions","dimensions","window","onMessage","message","data","nativeEvent","JSON","parse","e","action","console","warn","useEffect","dimensionsChangeSubscription","addEventListener","remove","current","WebView","sandboxStyles","injectedJavaScript","source","baseUrl","originWhitelist","isAndroid","workaroundStyles","webView","scrollEnabled","setBuiltInZoomControls","showsHorizontalScrollIndicator","showsVerticalScrollIndicator","mediaPlaybackRequiresUserAction","StyleSheet","create","opacity","_default","memo","exports","default"],"sources":["@wordpress/components/src/sandbox/index.native.js"],"sourcesContent":["/*\n External dependencies\n /\nimport { Dimensions, StyleSheet } from 'react-native';\nimport { WebView } from 'react-native-webview';\n\n/\n WordPress dependencies\n /\nimport {\n\tPlatform,\n\trenderToString,\n\tmemo,\n\tuseRef,\n\tuseState,\n\tuseEffect,\n\tforwardRef,\n\tuseCallback,\n} from '@wordpress/element';\nimport { usePreferredColorScheme } from '@wordpress/compose';\n\n/\n Internal dependencies\n /\nimport sandboxStyles from './style.scss';\n\nconst observeAndResizeJS = `\n\t(function() {\n\t\tconst { MutationObserver } = window;\n\n\t\tif ( ! MutationObserver \|\| ! document.body \|\| ! window.parent ) {\n\t\t\treturn;\n\t\t}\n\n\t\tfunction sendResize() {\n\t\t\tconst clientBoundingRect = document.body.getBoundingClientRect();\n\n\t\t\t// The function postMessage is exposed by the react-native-webview library\n\t\t\t// to communicate between React Native and the WebView, in this case,\n\t\t\t// we use it for notifying resize changes.\n\t\t\twindow.ReactNativeWebView.postMessage(\n\t\t\t\tJSON.stringify( {\n\t\t\t\t\taction: 'resize',\n\t\t\t\t\twidth: clientBoundingRect.width,\n\t\t\t\t\theight: clientBoundingRect.height,\n\t\t\t\t} )\n\t\t\t);\n\t\t}\n\n\t\tconst observer = new MutationObserver( sendResize );\n\t\tobserver.observe( document.body, {\n\t\t\tattributes: true,\n\t\t\tattributeOldValue: false,\n\t\t\tcharacterData: true,\n\t\t\tcharacterDataOldValue: false,\n\t\t\tchildList: true,\n\t\t\tsubtree: true,\n\t\t} );\n\n\t\twindow.addEventListener( 'load', sendResize, true );\n\n\t\t// Hack: Remove viewport unit styles, as these are relative\n\t\t// the iframe root and interfere with our mechanism for\n\t\t// determining the unconstrained page bounds.\n\t\tfunction removeViewportStyles( ruleOrNode ) {\n\t\t\tif ( ruleOrNode.style ) {\n\t\t\t\t[ 'width', 'height', 'minHeight', 'maxHeight' ].forEach( function (\n\t\t\t\t\tstyle\n\t\t\t\t) {\n\t\t\t\t\tif (\n\t\t\t\t\t\t/^\\\\d+(vmin\|vmax\|vh\|vw)$/.test( ruleOrNode.style[ style ] )\n\t\t\t\t\t) {\n\t\t\t\t\t\truleOrNode.style[ style ] = '';\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t}\n\t\t}\n\n\t\tArray.prototype.forEach.call(\n\t\t\tdocument.querySelectorAll( '[style]' ),\n\t\t\tremoveViewportStyles\n\t\t);\n\t\tArray.prototype.forEach.call(\n\t\t\tdocument.styleSheets,\n\t\t\tfunction ( stylesheet ) {\n\t\t\t\tArray.prototype.forEach.call(\n\t\t\t\t\tstylesheet.cssRules \|\| stylesheet.rules,\n\t\t\t\t\tremoveViewportStyles\n\t\t\t\t);\n\t\t\t}\n\t\t);\n\n\t\tdocument.body.style.position = 'absolute';\n\t\tdocument.body.style.width = '100%';\n\t\tdocument.body.setAttribute( 'data-resizable-iframe-connected', '' );\n\n\t\tsendResize();\n\n\t\t// Resize events can change the width of elements with 100% width, but we don't\n\t\t// get an DOM mutations for that, so do the resize when the window is resized, too.\n\t\twindow.addEventListener( 'resize', sendResize, true );\n\t\twindow.addEventListener( 'orientationchange', sendResize, true );\n\t})();\n`;\n\nconst style = `\n\tbody {\n\t\tmargin: 0;\n\t}\n\thtml,\n\tbody,\n\tbody > div,\n\tbody > div iframe {\n\t\twidth: 100%;\n\t}\n\tbody > div > {\n\t\tmargin-top: 0 !important; /* Has to have !important to override inline styles. /\n\t\tmargin-bottom: 0 !important;\n\t}\n\n\t.wp-block-embed__wrapper {\n\t\tposition: relative;\n\t}\n\n\tbody.wp-has-aspect-ratio > div iframe {\n\t\theight: 100%;\n\t\toverflow: hidden; / If it has an aspect ratio, it shouldn't scroll. /\n\t}\n\n\t/\n\t Add responsiveness to embeds with aspect ratios.\n\t \n\t These styles have been copied from the web version (https://github.com/WordPress/gutenberg/blob/7901895ca20cf61e402925e31571d659dab64721/packages/block-library/src/embed/style.scss#L42-L89) and\n\t * adapted for the native version.\n\t /\n\t.wp-has-aspect-ratio.wp-block-embed__wrapper::before {\n\t\tcontent: \"\";\n\t\tdisplay: block;\n\t\tpadding-top: 50%; // Default to 2:1 aspect ratio.\n\t}\n\t.wp-has-aspect-ratio iframe {\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tright: 0;\n\t\tbottom: 0;\n\t\tleft: 0;\n\t\theight: 100%;\n\t\twidth: 100%;\n\t}\n\t.wp-embed-aspect-21-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 42.85%; // 9 / 21 100\n\t}\n\t.wp-embed-aspect-18-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 50%; // 9 / 18 * 100\n\t}\n\t.wp-embed-aspect-16-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 56.25%; // 9 / 16 * 100\n\t}\n\t.wp-embed-aspect-4-3.wp-block-embed__wrapper::before {\n\t\tpadding-top: 75%; // 3 / 4 * 100\n\t}\n\t.wp-embed-aspect-1-1.wp-block-embed__wrapper::before {\n\t\tpadding-top: 100%; // 1 / 1 * 100\n\t}\n\t.wp-embed-aspect-9-16.wp-block-embed__wrapper::before {\n\t\tpadding-top: 177.77%; // 16 / 9 * 100\n\t}\n\t.wp-embed-aspect-1-2.wp-block-embed__wrapper::before {\n\t\tpadding-top: 200%; // 2 / 1 * 100\n\t}\n`;\n\nconst EMPTY_ARRAY = [];\n\nconst Sandbox = forwardRef( function Sandbox(\n\t{\n\t\tcontainerStyle,\n\t\tcustomJS,\n\t\thtml = '',\n\t\tlang = 'en',\n\t\tproviderUrl = '',\n\t\tscripts = EMPTY_ARRAY,\n\t\tstyles = EMPTY_ARRAY,\n\t\ttitle = '',\n\t\ttype,\n\t\turl,\n\t\tonWindowEvents = {},\n\t\tviewportProps = '',\n\t\tonLoadEnd = () => {},\n\t\ttestID,\n\t},\n\tref\n) {\n\tconst colorScheme = usePreferredColorScheme();\n\tconst [ height, setHeight ] = useState( 0 );\n\tconst [ contentHtml, setContentHtml ] = useState( getHtmlDoc() );\n\n\tconst windowSize = Dimensions.get( 'window' );\n\tconst [ isLandscape, setIsLandscape ] = useState(\n\t\twindowSize.width >= windowSize.height\n\t);\n\tconst wasLandscape = useRef( isLandscape );\n\t// On Android, we need to recreate the WebView on any of the following actions, otherwise it disappears:\n\t// - Device rotation\n\t// - Light/dark mode changes\n\t// For this purpose, the key prop used in the WebView will be updated with the value of the actions.\n\tconst key = Platform.select( {\n\t\tandroid: `${ url }-${\n\t\t\tisLandscape ? 'landscape' : 'portrait'\n\t\t}-${ colorScheme }`,\n\t\tios: url,\n\t} );\n\n\tfunction getHtmlDoc() {\n\t\t// Put the html snippet into a html document, and update the state to refresh the WebView,\n\t\t// we can use this in the future to inject custom styles or scripts.\n\t\t// Scripts go into the body rather than the head, to support embedded content such as Instagram\n\t\t// that expect the scripts to be part of the body.\n\n\t\t// Avoid comma issues with props.viewportProps.\n\t\tconst addViewportProps = viewportProps\n\t\t\t.trim()\n\t\t\t.replace( /(^[^,])/, ', $1' );\n\n\t\tconst htmlDoc = (\n\t\t\t<html lang={ lang }>\n\t\t\t\t<head>\n\t\t\t\t\t<title>{ title }</title>\n\t\t\t\t\t<meta\n\t\t\t\t\t\tname=\"viewport\"\n\t\t\t\t\t\tcontent={ `width=device-width, initial-scale=1${ addViewportProps }` }\n\t\t\t\t\t></meta>\n\t\t\t\t\t<style dangerouslySetInnerHTML={ { __html: style } } />\n\t\t\t\t\t{ styles.map( ( rules, i ) => (\n\t\t\t\t\t\t<style\n\t\t\t\t\t\t\tkey={ i }\n\t\t\t\t\t\t\tdangerouslySetInnerHTML={ { __html: rules } }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t</head>\n\t\t\t\t<body\n\t\t\t\t\tdata-resizable-iframe-connected=\"data-resizable-iframe-connected\"\n\t\t\t\t\tclassName={ type }\n\t\t\t\t>\n\t\t\t\t\t<div dangerouslySetInnerHTML={ { __html: html } } />\n\t\t\t\t\t{ scripts.map( ( src ) => (\n\t\t\t\t\t\t<script key={ src } src={ src } />\n\t\t\t\t\t) ) }\n\t\t\t\t</body>\n\t\t\t</html>\n\t\t);\n\t\treturn '<!DOCTYPE html>' + renderToString( htmlDoc );\n\t}\n\n\tconst getInjectedJavaScript = useCallback( () => {\n\t\t// Allow parent to override the resize observers with prop.customJS (legacy support)\n\t\tlet injectedJS = customJS \|\| observeAndResizeJS;\n\n\t\t// Add any event listeners that were passed in.\n\t\tObject.keys( onWindowEvents ).forEach( ( eventType ) => {\n\t\t\tinjectedJS += `\n\t\t\t\twindow.addEventListener( '${ eventType }', function( event ) {\n\t\t\t\t\twindow.ReactNativeWebView.postMessage( JSON.stringify( { type: '${ eventType }', ...event.data } ) );\n\t\t\t\t});`;\n\t\t} );\n\n\t\treturn injectedJS;\n\t}, [ customJS, onWindowEvents ] );\n\n\tfunction updateContentHtml( forceRerender = false ) {\n\t\tconst newContentHtml = getHtmlDoc();\n\n\t\tif ( forceRerender && contentHtml === newContentHtml ) {\n\t\t\t// The re-render is forced by updating the state with empty HTML,\n\t\t\t// waiting for the JS code to be executed with \"setImmediate\" and then\n\t\t\t// setting the content HTML again.\n\t\t\tsetContentHtml( '' );\n\t\t\tsetImmediate( () => setContentHtml( newContentHtml ) );\n\t\t} else {\n\t\t\tsetContentHtml( newContentHtml );\n\t\t}\n\t}\n\n\tfunction getSizeStyle() {\n\t\tconst contentHeight = Math.ceil( height );\n\n\t\treturn contentHeight ? { height: contentHeight } : { aspectRatio: 1 };\n\t}\n\n\tfunction onChangeDimensions( dimensions ) {\n\t\tsetIsLandscape( dimensions.window.width >= dimensions.window.height );\n\t}\n\n\tconst onMessage = useCallback(\n\t\t( message ) => {\n\t\t\tlet data = message?.nativeEvent?.data;\n\n\t\t\ttry {\n\t\t\t\tdata = JSON.parse( data );\n\t\t\t} catch ( e ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// check for resize event\n\t\t\tif ( 'resize' === data?.action ) {\n\t\t\t\tsetHeight( data.height );\n\t\t\t}\n\n\t\t\t// Forward the event to parent event listeners\n\t\t\tObject.keys( onWindowEvents ).forEach( ( eventType ) => {\n\t\t\t\tif ( data?.type === eventType ) {\n\t\t\t\t\ttry {\n\t\t\t\t\t\tonWindowEvents[ eventType ]( data );\n\t\t\t\t\t} catch ( e ) {\n\t\t\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\t\t\tconsole.warn(\n\t\t\t\t\t\t\t`Error handling event ${ eventType }`,\n\t\t\t\t\t\t\te\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\t\t},\n\t\t[ onWindowEvents ]\n\t);\n\n\tuseEffect( () => {\n\t\tconst dimensionsChangeSubscription = Dimensions.addEventListener(\n\t\t\t'change',\n\t\t\tonChangeDimensions\n\t\t);\n\t\treturn () => {\n\t\t\tdimensionsChangeSubscription.remove();\n\t\t};\n\t}, [] );\n\n\tuseEffect( () => {\n\t\tupdateContentHtml();\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}, [ html, title, type, styles, scripts ] );\n\n\tuseEffect( () => {\n\t\t// When device orientation changes we have to recalculate the size,\n\t\t// for this purpose we reset the current size value.\n\t\tif ( wasLandscape.current !== isLandscape ) {\n\t\t\tsetHeight( 0 );\n\t\t}\n\t\twasLandscape.current = isLandscape;\n\t}, [ isLandscape ] );\n\n\treturn (\n\t\t<WebView\n\t\t\tcontainerStyle={ [\n\t\t\t\tsandboxStyles[ 'sandbox-webview__container' ],\n\t\t\t\tcontainerStyle,\n\t\t\t] }\n\t\t\tinjectedJavaScript={ getInjectedJavaScript() }\n\t\t\tkey={ key }\n\t\t\tref={ ref }\n\t\t\tsource={ { baseUrl: providerUrl, html: contentHtml } }\n\t\t\t// Wildcard value is required for static HTML\n\t\t\t// Reference: https://github.com/react-native-webview/react-native-webview/blob/master/docs/Reference.md#source\n\t\t\toriginWhitelist={ [ '' ] }\n\t\t\tstyle={ [\n\t\t\t\tsandboxStyles[ 'sandbox-webview__content' ],\n\t\t\t\tgetSizeStyle(),\n\t\t\t\tPlatform.isAndroid && workaroundStyles.webView,\n\t\t\t] }\n\t\t\tonMessage={ onMessage }\n\t\t\tscrollEnabled={ false }\n\t\t\tsetBuiltInZoomControls={ false }\n\t\t\tshowsHorizontalScrollIndicator={ false }\n\t\t\tshowsVerticalScrollIndicator={ false }\n\t\t\tmediaPlaybackRequiresUserAction={ false }\n\t\t\tonLoadEnd={ onLoadEnd }\n\t\t\ttestID={ testID }\n\t\t/>\n\t);\n} );\n\nconst workaroundStyles = StyleSheet.create( {\n\twebView: {\n\t\t/\n\t\t The slight opacity below is a workaround for an Android crash caused from combining Android\n\t\t * 12's new scroll overflow behavior and webviews.\n\t\t * https://github.com/react-native-webview/react-native-webview/issues/1915#issuecomment-808869253\n\t\t */\n\t\topacity: 0.99,\n\t},\n} );\n\nexport default memo( Sandbox );\n"],"mappings":";;;;;;;AASA,IAAAA,QAAA,GAAAC,OAAA;AANA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,mBAAA,GAAAF,OAAA;AAeA,IAAAG,QAAA,GAAAH,OAAA;AAKA,IAAAI,MAAA,GAAAC,sBAAA,CAAAL,OAAA;AAxBA;AACA;AACA;;AAIA;AACA;AACA;;AAaA;AACA;AACA;;AAGA,MAAMM,kBAAkB,GAAI;AAC5B;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;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,MAAMC,KAAK,GAAI;AACf;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;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,CAAC;AAED,MAAMC,WAAW,GAAG,EAAE;AAEtB,MAAMC,OAAO,GAAG,IAAAC,mBAAU,EAAE,SAASD,OAAOA,CAC3C;EACCE,cAAc;EACdC,QAAQ;EACRC,IAAI,GAAG,EAAE;EACTC,IAAI,GAAG,IAAI;EACXC,WAAW,GAAG,EAAE;EAChBC,OAAO,GAAGR,WAAW;EACrBS,MAAM,GAAGT,WAAW;EACpBU,KAAK,GAAG,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"}

package/build/sandbox/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources~~":[],"~~names~~":[],"~~mappings~~":"","~~sourcesContent~~":[]}
1	+ {"version":3,"names":[],"sources":["@wordpress/components/src/sandbox/types.ts"],"sourcesContent":["export type SandBoxProps = {\n\t/*\n\t The HTML to render in the body of the iframe document.\n\t \n\t @default ''\n\t /\n\thtml?: string;\n\t/\n\t The `<title>` of the iframe document.\n\t \n\t @default ''\n\t /\n\ttitle?: string;\n\t/\n\t The CSS class name to apply to the `<html>` and `<body>` elements of the iframe.\n\t /\n\ttype?: string;\n\t/\n\t An array of CSS strings to inject into the `<head>` of the iframe document.\n\t \n\t @default []\n\t /\n\tstyles?: string[];\n\t/\n\t An array of script URLs to inject as `<script>` tags into the bottom of the `<body>` of the iframe document.\n\t \n\t @default []\n\t /\n\tscripts?: string[];\n\t/\n\t The `onFocus` callback for the iframe.\n\t */\n\tonFocus?: React.DOMAttributes< HTMLIFrameElement >[ 'onFocus' ];\n};\n"],"mappings":""}

package/build/scroll-lock/index.js CHANGED Viewed

@@ -5,9 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.ScrollLock = ScrollLock;
 exports.default = void 0;
 var _element = require("@wordpress/element");
 /**
  * WordPress dependencies
  */
@@ -20,25 +18,22 @@ var _element = require("@wordpress/element");
  * as preventing default on certain touchmove events.
  */
 let previousScrollTop = 0;
 function setLocked(locked) {
   const scrollingElement = document.scrollingElement || document.body;
   if (locked) {
     previousScrollTop = scrollingElement.scrollTop;
   }
   const methodName = locked ? 'add' : 'remove';
-  scrollingElement.classList[methodName]('lockscroll'); // Adding the class to the document element seems to be necessary in iOS.
+  scrollingElement.classList[methodName]('lockscroll');
+  // Adding the class to the document element seems to be necessary in iOS.
   document.documentElement.classList[methodName]('lockscroll');
   if (!locked) {
     scrollingElement.scrollTop = previousScrollTop;
   }
 }
 let lockCounter = 0;
 /**
  * ScrollLock is a content-free React component for declaratively preventing
  * scroll bleed from modal UI to the page body. This component applies a
@@ -72,25 +67,21 @@ let lockCounter = 0;
  * };
  * ```
  */
 function ScrollLock() {
   (0, _element.useEffect)(() => {
     if (lockCounter === 0) {
       setLocked(true);
     }
     ++lockCounter;
     return () => {
       if (lockCounter === 1) {
         setLocked(false);
       }
       --lockCounter;
     };
   }, []);
   return null;
 }
 var _default = ScrollLock;
 exports.default = _default;
 //# sourceMappingURL=index.js.map

package/build/scroll-lock/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources~~":["~~@wordpress/components/src/scroll-lock/index.tsx~~"],"~~names~~":["previousScrollTop","setLocked","locked","scrollingElement","document","body","scrollTop","methodName","classList","documentElement","lockCounter","ScrollLock"],"~~mappings~~":"~~;;;;;;;;AAGA;;AAHA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA~~,~~IAAIA~~,~~iBAAiB~~,~~GAAG,CAAxB;;AAEA,SAASC,SAAT,CAAoBC,MAApB,EAAsC;AACrC,QAAMC,gBAAgB,GAAGC,QAAQ,CAACD,gBAAT,IAA6BC,QAAQ,CAACC,IAA~~/D;;AAEA,MAAKH,MAAL,EAAc;AACbF,IAAAA,iBAAiB,GAAGG,gBAAgB,CAACG,SAArC;AACA;;AAED,QAAMC,UAAU,GAAGL,MAAM,GAAG,KAAH,GAAW,QAApC;AACAC,EAAAA,gBAAgB,CAACK,SAAjB,CAA4BD,UAA5B,EAA0C,YAA1C,EARqC,CAUrC;;AACAH,EAAAA,QAAQ,CAACK,eAAT,CAAyBD,SAAzB,CAAoCD,UAApC,EAAkD,YAAlD;;AAEA,MAAK,CAAEL,MAAP,EAAgB;AACfC,IAAAA,gBAAgB,CAACG,SAAjB,GAA6BN,iBAA7B;AACA;AACD;;AAED,IAAIU,WAAW,GAAG,CAAlB;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;;AACO,SAASC,UAAT,GAA4B;AAClC,0BAAW,MAAM;AAChB,QAAKD,WAAW,KAAK,CAArB,EAAyB;AACxBT,MAAAA,SAAS,CAAE,IAAF,CAAT;AACA;;AAED,MAAES,WAAF;AAEA,WAAO,MAAM;AACZ,UAAKA,WAAW,KAAK,CAArB,EAAyB;AACxBT,QAAAA,SAAS,CAAE,KAAF,CAAT;AACA;;AAED,QAAES,WAAF;AACA,KAND;AAOA,GAdD,EAcG,EAdH;AAgBA,SAAO,IAAP;AACA;;eAEcC,U","sourcesContent":["/*\n WordPress dependencies\n /\nimport { useEffect } from '@wordpress/element';\n\n/\n * Setting `overflow: hidden` on html and body elements resets body scroll in iOS.\n * Save scroll top so we can restore it after locking scroll.\n \n NOTE: It would be cleaner and possibly safer to find a localized solution such\n * as preventing default on certain touchmove events.\n /\nlet previousScrollTop = 0;\n\nfunction setLocked( locked: boolean ) {\n\tconst scrollingElement = document.scrollingElement \|\| document.body;\n\n\tif ( locked ) {\n\t\tpreviousScrollTop = scrollingElement.scrollTop;\n\t}\n\n\tconst methodName = locked ? 'add' : 'remove';\n\tscrollingElement.classList[ methodName ]( 'lockscroll' );\n\n\t// Adding the class to the document element seems to be necessary in iOS.\n\tdocument.documentElement.classList[ methodName ]( 'lockscroll' );\n\n\tif ( ! locked ) {\n\t\tscrollingElement.scrollTop = previousScrollTop;\n\t}\n}\n\nlet lockCounter = 0;\n\n/\n ScrollLock is a content-free React component for declaratively preventing\n * scroll bleed from modal UI to the page body. This component applies a\n * `lockscroll` class to the `document.documentElement` and\n * `document.scrollingElement` elements to stop the body from scrolling. When it\n * is present, the lock is applied.\n \n ```jsx\n * import { ScrollLock, Button } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const MyScrollLock = () => {\n * const [ isScrollLocked, setIsScrollLocked ] = useState( false );\n \n const toggleLock = () => {\n * setIsScrollLocked( ( locked ) => ! locked ) );\n * };\n \n return (\n * <div>\n * <Button variant=\"secondary\" onClick={ toggleLock }>\n * Toggle scroll lock\n * </Button>\n * { isScrollLocked && <ScrollLock /> }\n * <p>\n * Scroll locked:\n * <strong>{ isScrollLocked ? 'Yes' : 'No' }</strong>\n * </p>\n * </div>\n * );\n * };\n * ```\n */\nexport function ScrollLock(): null {\n\tuseEffect( () => {\n\t\tif ( lockCounter === 0 ) {\n\t\t\tsetLocked( true );\n\t\t}\n\n\t\t++lockCounter;\n\n\t\treturn () => {\n\t\t\tif ( lockCounter === 1 ) {\n\t\t\t\tsetLocked( false );\n\t\t\t}\n\n\t\t\t--lockCounter;\n\t\t};\n\t}, [] );\n\n\treturn null;\n}\n\nexport default ScrollLock;\n"]}
1	+ {"version":3,"names":["_element","require","previousScrollTop","setLocked","locked","scrollingElement","document","body","scrollTop","methodName","classList","documentElement","lockCounter","ScrollLock","useEffect","_default","exports","default"],"sources":["@wordpress/components/src/scroll-lock/index.tsx"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { useEffect } from '@wordpress/element';\n\n/\n * Setting `overflow: hidden` on html and body elements resets body scroll in iOS.\n * Save scroll top so we can restore it after locking scroll.\n \n NOTE: It would be cleaner and possibly safer to find a localized solution such\n * as preventing default on certain touchmove events.\n /\nlet previousScrollTop = 0;\n\nfunction setLocked( locked: boolean ) {\n\tconst scrollingElement = document.scrollingElement \|\| document.body;\n\n\tif ( locked ) {\n\t\tpreviousScrollTop = scrollingElement.scrollTop;\n\t}\n\n\tconst methodName = locked ? 'add' : 'remove';\n\tscrollingElement.classList[ methodName ]( 'lockscroll' );\n\n\t// Adding the class to the document element seems to be necessary in iOS.\n\tdocument.documentElement.classList[ methodName ]( 'lockscroll' );\n\n\tif ( ! locked ) {\n\t\tscrollingElement.scrollTop = previousScrollTop;\n\t}\n}\n\nlet lockCounter = 0;\n\n/\n ScrollLock is a content-free React component for declaratively preventing\n * scroll bleed from modal UI to the page body. This component applies a\n * `lockscroll` class to the `document.documentElement` and\n * `document.scrollingElement` elements to stop the body from scrolling. When it\n * is present, the lock is applied.\n \n ```jsx\n * import { ScrollLock, Button } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const MyScrollLock = () => {\n * const [ isScrollLocked, setIsScrollLocked ] = useState( false );\n \n const toggleLock = () => {\n * setIsScrollLocked( ( locked ) => ! locked ) );\n * };\n \n return (\n * <div>\n * <Button variant=\"secondary\" onClick={ toggleLock }>\n * Toggle scroll lock\n * </Button>\n * { isScrollLocked && <ScrollLock /> }\n * <p>\n * Scroll locked:\n * <strong>{ isScrollLocked ? 'Yes' : 'No' }</strong>\n * </p>\n * </div>\n * );\n * };\n * ```\n */\nexport function ScrollLock(): null {\n\tuseEffect( () => {\n\t\tif ( lockCounter === 0 ) {\n\t\t\tsetLocked( true );\n\t\t}\n\n\t\t++lockCounter;\n\n\t\treturn () => {\n\t\t\tif ( lockCounter === 1 ) {\n\t\t\t\tsetLocked( false );\n\t\t\t}\n\n\t\t\t--lockCounter;\n\t\t};\n\t}, [] );\n\n\treturn null;\n}\n\nexport default ScrollLock;\n"],"mappings":";;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAHA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIC,iBAAiB,GAAG,CAAC;AAEzB,SAASC,SAASA,CAAEC,MAAe,EAAG;EACrC,MAAMC,gBAAgB,GAAGC,QAAQ,CAACD,gBAAgB,IAAIC,QAAQ,CAACC,IAAI;EAEnE,IAAKH,MAAM,EAAG;IACbF,iBAAiB,GAAGG,gBAAgB,CAACG,SAAS;EAC/C;EAEA,MAAMC,UAAU,GAAGL,MAAM,GAAG,KAAK,GAAG,QAAQ;EAC5CC,gBAAgB,CAACK,SAAS,CAAED,UAAU,CAAE,CAAE,YAAa,CAAC;;EAExD;EACAH,QAAQ,CAACK,eAAe,CAACD,SAAS,CAAED,UAAU,CAAE,CAAE,YAAa,CAAC;EAEhE,IAAK,CAAEL,MAAM,EAAG;IACfC,gBAAgB,CAACG,SAAS,GAAGN,iBAAiB;EAC/C;AACD;AAEA,IAAIU,WAAW,GAAG,CAAC;;AAEnB;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,SAASC,UAAUA,CAAA,EAAS;EAClC,IAAAC,kBAAS,EAAE,MAAM;IAChB,IAAKF,WAAW,KAAK,CAAC,EAAG;MACxBT,SAAS,CAAE,IAAK,CAAC;IAClB;IAEA,EAAES,WAAW;IAEb,OAAO,MAAM;MACZ,IAAKA,WAAW,KAAK,CAAC,EAAG;QACxBT,SAAS,CAAE,KAAM,CAAC;MACnB;MAEA,EAAES,WAAW;IACd,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEP,OAAO,IAAI;AACZ;AAAC,IAAAG,QAAA,GAEcF,UAAU;AAAAG,OAAA,CAAAC,OAAA,GAAAF,QAAA"}

package/build/scrollable/component.js CHANGED Viewed

@@ -4,15 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.Scrollable = void 0;
 var _element = require("@wordpress/element");
 var _context = require("../ui/context");
 var _view = require("../view");
 var _hook = require("./hook");
 /**
  * External dependencies
  */
@@ -20,12 +15,15 @@ var _hook = require("./hook");
 /**
  * Internal dependencies
  */
 function UnconnectedScrollable(props, forwardedRef) {
   const scrollableProps = (0, _hook.useScrollable)(props);
-  return (0, _element.createElement)(_view.View, { ...scrollableProps,
+  return (0, _element.createElement)(_view.View, {
+    ...scrollableProps,
     ref: forwardedRef
   });
 }
 /**
  * `Scrollable` is a layout component that content in a scrollable container.
  *
@@ -41,8 +39,6 @@ function UnconnectedScrollable(props, forwardedRef) {
  * }
  * ```
  */
 const Scrollable = (0, _context.contextConnect)(UnconnectedScrollable, 'Scrollable');
 exports.Scrollable = Scrollable;
 var _default = Scrollable;

package/build/scrollable/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources~~":["~~@wordpress/components/src/scrollable/component.tsx~~"],"~~names~~":["UnconnectedScrollable","props","forwardedRef","scrollableProps","~~Scrollable~~"],"~~mappings~~":"~~;;;;;;;;;AAQA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAMA~~,~~SAASA~~,~~qBAAT~~,~~CACCC~~,~~KADD~~,~~EAECC~~,~~YAFD~~,~~EAGE;AACD~~,QAAMC,eAAe,GAAG,yBAAeF,KAAf,CAAxB;AAEA,SAAO,4BAAC,UAAD,OAAWE,eAAX;AAA6B,IAAA,GAAG,EAAGD;AAAnC,IAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAME,UAAU,GAAG,6BAAgBJ,qBAAhB,EAAuC,YAAvC,CAAnB;;eAEQI,U","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n Internal dependencies\n /\nimport { ~~contextConnect,~~ WordPressComponentProps } from '../ui/context';\nimport { View } from '../view';\nimport { useScrollable } from './hook';\nimport type { ScrollableProps } from './types';\n\nfunction UnconnectedScrollable(\n\tprops: WordPressComponentProps< ScrollableProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst scrollableProps = useScrollable( props );\n\n\treturn <View { ...scrollableProps } ref={ forwardedRef } />;\n}\n\n/\n `Scrollable` is a layout component that content in a scrollable container.\n \n ```jsx\n * import { __experimentalScrollable as Scrollable } from `@wordpress/components`;\n \n function Example() {\n * \treturn (\n * \t\t<Scrollable style={ { maxHeight: 200 } }>\n * \t\t\t<div style={ { height: 500 } }>...</div>\n * \t\t</Scrollable>\n * \t);\n * }\n * ```\n */\nexport const Scrollable = contextConnect( UnconnectedScrollable, 'Scrollable' );\n\nexport default Scrollable;\n"]}
1	+ {"version":3,"names":["_context","require","_view","_hook","UnconnectedScrollable","props","forwardedRef","scrollableProps","useScrollable","_element","createElement","View","ref","Scrollable","contextConnect","exports","_default","default"],"sources":["@wordpress/components/src/scrollable/component.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n Internal dependencies\n /\nimport type { WordPressComponentProps } from '../ui/context';\nimport { contextConnect } from '../ui/context';\nimport { View } from '../view';\nimport { useScrollable } from './hook';\nimport type { ScrollableProps } from './types';\n\nfunction UnconnectedScrollable(\n\tprops: WordPressComponentProps< ScrollableProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst scrollableProps = useScrollable( props );\n\n\treturn <View { ...scrollableProps } ref={ forwardedRef } />;\n}\n\n/\n `Scrollable` is a layout component that content in a scrollable container.\n \n ```jsx\n * import { __experimentalScrollable as Scrollable } from `@wordpress/components`;\n \n function Example() {\n * \treturn (\n * \t\t<Scrollable style={ { maxHeight: 200 } }>\n * \t\t\t<div style={ { height: 500 } }>...</div>\n * \t\t</Scrollable>\n * \t);\n * }\n * ```\n */\nexport const Scrollable = contextConnect( UnconnectedScrollable, 'Scrollable' );\n\nexport default Scrollable;\n"],"mappings":";;;;;;;AASA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AAXA;AACA;AACA;;AAGA;AACA;AACA;;AAOA,SAASG,qBAAqBA,CAC7BC,KAAwD,EACxDC,YAAiC,EAChC;EACD,MAAMC,eAAe,GAAG,IAAAC,mBAAa,EAAEH,KAAM,CAAC;EAE9C,OAAO,IAAAI,QAAA,CAAAC,aAAA,EAACR,KAAA,CAAAS,IAAI;IAAA,GAAMJ,eAAe;IAAGK,GAAG,EAAGN;EAAc,CAAE,CAAC;AAC5D;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMO,UAAU,GAAG,IAAAC,uBAAc,EAAEV,qBAAqB,EAAE,YAAa,CAAC;AAACW,OAAA,CAAAF,UAAA,GAAAA,UAAA;AAAA,IAAAG,QAAA,GAEjEH,UAAU;AAAAE,OAAA,CAAAE,OAAA,GAAAD,QAAA"}

package/build/scrollable/hook.js CHANGED Viewed

@@ -4,26 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useScrollable = useScrollable;
 var _element = require("@wordpress/element");
 var _context = require("../ui/context");
 var styles = _interopRequireWildcard(require("./styles"));
 var _useCx = require("../utils/hooks/use-cx");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 /**
  * WordPress dependencies
  */
-/**
- * Internal dependencies
- */
 function useScrollable(props) {
   const {
     className,
@@ -33,7 +23,8 @@ function useScrollable(props) {
   } = (0, _context.useContextSystem)(props, 'Scrollable');
   const cx = (0, _useCx.useCx)();
   const classes = (0, _element.useMemo)(() => cx(styles.Scrollable, styles.scrollableScrollbar, smoothScroll && styles.smoothScroll, scrollDirection === 'x' && styles.scrollX, scrollDirection === 'y' && styles.scrollY, scrollDirection === 'auto' && styles.scrollAuto, className), [className, cx, scrollDirection, smoothScroll]);
-  return { ...otherProps,
+  return {
+    ...otherProps,
     className: classes
   };
 }

package/build/scrollable/hook.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources~~":["~~@wordpress/components/src/scrollable/hook.ts~~"],"~~names~~":["~~useScrollable~~","~~props~~","~~className~~","~~scrollDirection~~","~~smoothScroll~~","~~otherProps~~","cx","~~classes~~","~~styles~~","~~Scrollable~~","~~scrollableScrollbar~~","~~scrollX~~","~~scrollY~~","~~scrollAuto~~"],"~~mappings~~":"~~;;;;;;;AAGA;;AAKA;;AACA;;AACA;;;;;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAMO~~,~~SAASA~~,~~aAAT~~,~~CACNC~~,~~KADM~~,~~EAEL;AACD~~,~~QAAM;AACLC~~,~~IAAAA~~,~~SADK;AAELC~~,~~IAAAA~~,~~eAAe~~,~~GAAG~~,~~GAFb;AAGLC~~,~~IAAAA~~,~~YAAY~~,~~GAAG~~,~~KAHV;AAIL~~,~~OAAGC;AAJE~~,~~MAKF,+BAAkBJ~~,~~KAAlB~~,~~EAAyB~~,~~YAAzB~~,~~CALJ;AAOA~~,~~QAAMK~~,~~EAAE~~,~~GAAG~~,~~mBAAX;AAEA~~,QAAMC,OAAO,GAAG,sBACf,MACCD,EAAE,CACDE,MAAM,CAACC,UADN,EAEDD,MAAM,CAACE,mBAFN,EAGDN,YAAY,IAAII,MAAM,CAACJ,YAHtB,EAIDD,eAAe,KAAK,GAApB,IAA2BK,MAAM,CAACG,OAJjC,EAKDR,eAAe,KAAK,GAApB,IAA2BK,MAAM,CAACI,OALjC,EAMDT,eAAe,KAAK,MAApB,IAA8BK,MAAM,CAACK,UANpC,EAODX,SAPC,CAFY,EAWf,CAAEA,SAAF,EAAaI,EAAb,EAAiBH,eAAjB,EAAkCC,YAAlC,CAXe,CAAhB;AAcA,SAAO,EAAE,GAAGC,UAAL;AAAiBH,IAAAA,SAAS,EAAEK;AAA5B,GAAP;AACA","sourcesContent":["/*\n WordPress dependencies\n /\nimport { useMemo } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport { ~~useContextSystem,~~ WordPressComponentProps } from '../ui/context';\nimport as styles from './styles';\nimport { useCx } from '../utils/hooks/use-cx';\nimport type { ScrollableProps } from './types';\n\nexport function useScrollable(\n\tprops: WordPressComponentProps< ScrollableProps, 'div' >\n) {\n\tconst {\n\t\tclassName,\n\t\tscrollDirection = 'y',\n\t\tsmoothScroll = false,\n\t\t...otherProps\n\t} = useContextSystem( props, 'Scrollable' );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.Scrollable,\n\t\t\t\tstyles.scrollableScrollbar,\n\t\t\t\tsmoothScroll && styles.smoothScroll,\n\t\t\t\tscrollDirection === 'x' && styles.scrollX,\n\t\t\t\tscrollDirection === 'y' && styles.scrollY,\n\t\t\t\tscrollDirection === 'auto' && styles.scrollAuto,\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, cx, scrollDirection, smoothScroll ]\n\t);\n\n\treturn { ...otherProps, className: classes };\n}\n"]}
1	+ {"version":3,"names":["_element","require","_context","styles","_interopRequireWildcard","_useCx","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","useScrollable","props","className","scrollDirection","smoothScroll","otherProps","useContextSystem","cx","useCx","classes","useMemo","Scrollable","scrollableScrollbar","scrollX","scrollY","scrollAuto"],"sources":["@wordpress/components/src/scrollable/hook.ts"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { useMemo } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport type { WordPressComponentProps } from '../ui/context';\nimport { useContextSystem } from '../ui/context';\nimport as styles from './styles';\nimport { useCx } from '../utils/hooks/use-cx';\nimport type { ScrollableProps } from './types';\n\nexport function useScrollable(\n\tprops: WordPressComponentProps< ScrollableProps, 'div' >\n) {\n\tconst {\n\t\tclassName,\n\t\tscrollDirection = 'y',\n\t\tsmoothScroll = false,\n\t\t...otherProps\n\t} = useContextSystem( props, 'Scrollable' );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.Scrollable,\n\t\t\t\tstyles.scrollableScrollbar,\n\t\t\t\tsmoothScroll && styles.smoothScroll,\n\t\t\t\tscrollDirection === 'x' && styles.scrollX,\n\t\t\t\tscrollDirection === 'y' && styles.scrollY,\n\t\t\t\tscrollDirection === 'auto' && styles.scrollAuto,\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, cx, scrollDirection, smoothScroll ]\n\t);\n\n\treturn { ...otherProps, className: classes };\n}\n"],"mappings":";;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAMA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAC,uBAAA,CAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AAA8C,SAAAK,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAH,wBAAAO,GAAA,EAAAJ,WAAA,SAAAA,WAAA,IAAAI,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,oBAAAA,GAAA,wBAAAA,GAAA,4BAAAE,OAAA,EAAAF,GAAA,UAAAG,KAAA,GAAAR,wBAAA,CAAAC,WAAA,OAAAO,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAJ,GAAA,YAAAG,KAAA,CAAAE,GAAA,CAAAL,GAAA,SAAAM,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAX,GAAA,QAAAW,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAd,GAAA,EAAAW,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAV,GAAA,EAAAW,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAX,GAAA,CAAAW,GAAA,SAAAL,MAAA,CAAAJ,OAAA,GAAAF,GAAA,MAAAG,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAAhB,GAAA,EAAAM,MAAA,YAAAA,MAAA;AAX9C;AACA;AACA;;AAYO,SAASW,aAAaA,CAC5BC,KAAwD,EACvD;EACD,MAAM;IACLC,SAAS;IACTC,eAAe,GAAG,GAAG;IACrBC,YAAY,GAAG,KAAK;IACpB,GAAGC;EACJ,CAAC,GAAG,IAAAC,yBAAgB,EAAEL,KAAK,EAAE,YAAa,CAAC;EAE3C,MAAMM,EAAE,GAAG,IAAAC,YAAK,EAAC,CAAC;EAElB,MAAMC,OAAO,GAAG,IAAAC,gBAAO,EACtB,MACCH,EAAE,CACDhC,MAAM,CAACoC,UAAU,EACjBpC,MAAM,CAACqC,mBAAmB,EAC1BR,YAAY,IAAI7B,MAAM,CAAC6B,YAAY,EACnCD,eAAe,KAAK,GAAG,IAAI5B,MAAM,CAACsC,OAAO,EACzCV,eAAe,KAAK,GAAG,IAAI5B,MAAM,CAACuC,OAAO,EACzCX,eAAe,KAAK,MAAM,IAAI5B,MAAM,CAACwC,UAAU,EAC/Cb,SACD,CAAC,EACF,CAAEA,SAAS,EAAEK,EAAE,EAAEJ,eAAe,EAAEC,YAAY,CAC/C,CAAC;EAED,OAAO;IAAE,GAAGC,UAAU;IAAEH,SAAS,EAAEO;EAAQ,CAAC;AAC7C"}

package/build/scrollable/index.js CHANGED Viewed

@@ -1,7 +1,6 @@
 "use strict";
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -14,11 +13,8 @@ Object.defineProperty(exports, "Scrollable", {
     return _component.default;
   }
 });
 var _component = _interopRequireDefault(require("./component"));
 var _hook = require("./hook");
 Object.keys(_hook).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;

package/build/scrollable/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/scrollable/index.ts"],"~~names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AAEA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","~~sourcesContent":["export { default as Scrollable } from './component';\n\nexport * from './hook';\n"]}
1	+ {"version":3,"names":["_component","_interopRequireDefault","require","_hook","Object","keys","forEach","key","prototype","hasOwnProperty","call","_exportNames","exports","defineProperty","enumerable","get"],"sources":["@wordpress/components/src/scrollable/index.ts"],"sourcesContent":["export { default as Scrollable } from './component';\n\nexport * from './hook';\n"],"mappings":";;;;;;;;;;;;;;;AAAA,IAAAA,UAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,KAAA,GAAAD,OAAA;AAAAE,MAAA,CAAAC,IAAA,CAAAF,KAAA,EAAAG,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA;EAAA,IAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAJ,KAAA,CAAAI,GAAA;EAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,EAAAL,GAAA;IAAAO,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAZ,KAAA,CAAAI,GAAA;IAAA;EAAA;AAAA"}

package/build/scrollable/styles.js CHANGED Viewed

@@ -4,13 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.smoothScroll = exports.scrollableScrollbar = exports.scrollY = exports.scrollX = exports.scrollAuto = exports.Scrollable = exports.Content = void 0;
 var _react = require("@emotion/react");
 var _utils = require("../utils");
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 const scrollableScrollbar = /*#__PURE__*/(0, _react.css)("@media only screen and ( min-device-width: 40em ){&::-webkit-scrollbar{height:12px;width:12px;}&::-webkit-scrollbar-track{background-color:transparent;}&::-webkit-scrollbar-track{background:", _utils.CONFIG.colorScrollbarTrack, ";border-radius:8px;}&::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:", _utils.CONFIG.colorScrollbarThumb, ";border:2px solid rgba( 0, 0, 0, 0 );border-radius:7px;}&:hover::-webkit-scrollbar-thumb{background-color:", _utils.CONFIG.colorScrollbarThumbHover, ";}}" + (process.env.NODE_ENV === "production" ? "" : ";label:scrollableScrollbar;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvc2Nyb2xsYWJsZS9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBVXNDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvc2Nyb2xsYWJsZS9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IHNjcm9sbGFibGVTY3JvbGxiYXIgPSBjc3NgXG5cdEBtZWRpYSBvbmx5IHNjcmVlbiBhbmQgKCBtaW4tZGV2aWNlLXdpZHRoOiA0MGVtICkge1xuXHRcdCY6Oi13ZWJraXQtc2Nyb2xsYmFyIHtcblx0XHRcdGhlaWdodDogMTJweDtcblx0XHRcdHdpZHRoOiAxMnB4O1xuXHRcdH1cblxuXHRcdCY6Oi13ZWJraXQtc2Nyb2xsYmFyLXRyYWNrIHtcblx0XHRcdGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuXHRcdH1cblxuXHRcdCY6Oi13ZWJraXQtc2Nyb2xsYmFyLXRyYWNrIHtcblx0XHRcdGJhY2tncm91bmQ6ICR7IENPTkZJRy5jb2xvclNjcm9sbGJhclRyYWNrIH07XG5cdFx0XHRib3JkZXItcmFkaXVzOiA4cHg7XG5cdFx0fVxuXG5cdFx0Jjo6LXdlYmtpdC1zY3JvbGxiYXItdGh1bWIge1xuXHRcdFx0YmFja2dyb3VuZC1jbGlwOiBwYWRkaW5nLWJveDtcblx0XHRcdGJhY2tncm91bmQtY29sb3I6ICR7IENPTkZJRy5jb2xvclNjcm9sbGJhclRodW1iIH07XG5cdFx0XHRib3JkZXI6IDJweCBzb2xpZCByZ2JhKCAwLCAwLCAwLCAwICk7XG5cdFx0XHRib3JkZXItcmFkaXVzOiA3cHg7XG5cdFx0fVxuXG5cdFx0Jjpob3Zlcjo6LXdlYmtpdC1zY3JvbGxiYXItdGh1bWIge1xuXHRcdFx0YmFja2dyb3VuZC1jb2xvcjogJHsgQ09ORklHLmNvbG9yU2Nyb2xsYmFyVGh1bWJIb3ZlciB9O1xuXHRcdH1cblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IFNjcm9sbGFibGUgPSBjc3NgXG5cdGhlaWdodDogMTAwJTtcbmA7XG5cbmV4cG9ydCBjb25zdCBDb250ZW50ID0gY3NzYFxuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5gO1xuXG5leHBvcnQgY29uc3Qgc21vb3RoU2Nyb2xsID0gY3NzYFxuXHRzY3JvbGwtYmVoYXZpb3I6IHNtb290aDtcbmA7XG5cbmV4cG9ydCBjb25zdCBzY3JvbGxYID0gY3NzYFxuXHRvdmVyZmxvdy14OiBhdXRvO1xuXHRvdmVyZmxvdy15OiBoaWRkZW47XG5gO1xuXG5leHBvcnQgY29uc3Qgc2Nyb2xsWSA9IGNzc2Bcblx0b3ZlcmZsb3cteDogaGlkZGVuO1xuXHRvdmVyZmxvdy15OiBhdXRvO1xuYDtcblxuZXhwb3J0IGNvbnN0IHNjcm9sbEF1dG8gPSBjc3NgXG5cdG92ZXJmbG93LXk6IGF1dG87XG5gO1xuIl19 */");
 exports.scrollableScrollbar = scrollableScrollbar;
 const Scrollable = process.env.NODE_ENV === "production" ? {

package/build/scrollable/styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources~~":["~~@wordpress/components/src/scrollable/styles.ts~~"],"~~names~~":["scrollableScrollbar","css","CONFIG","colorScrollbarTrack","colorScrollbarThumb","colorScrollbarThumbHover","Scrollable","Content","smoothScroll","scrollX","scrollY","scrollAuto"],"~~mappings~~":";;;;;;;AAGA;;AAKA;;;;AAEO,MAAMA,mBAAmB,oBAAGC,UAAH,oMAYdC,cAAOC,mBAZO,kGAkBRD,cAAOE,mBAlBC,gHAwBRF,cAAOG,wBAxBC,ukEAAzB;;AA6BA,MAAMC,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAAhB;;AAIA,MAAMC,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAAb;;AAIA,MAAMC,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAAlB;;AAIA,MAAMC,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAAb;;AAKA,MAAMC,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAAb;;AAKA,MAAMC,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAAhB","sourcesContent":["/*\n External dependencies\n /\nimport { css } from '@emotion/react';\n\n/\n Internal dependencies\n */\nimport { CONFIG } from '../utils';\n\nexport const scrollableScrollbar = css`\n\t@media only screen and ( min-device-width: 40em ) {\n\t\t&::-webkit-scrollbar {\n\t\t\theight: 12px;\n\t\t\twidth: 12px;\n\t\t}\n\n\t\t&::-webkit-scrollbar-track {\n\t\t\tbackground-color: transparent;\n\t\t}\n\n\t\t&::-webkit-scrollbar-track {\n\t\t\tbackground: ${ CONFIG.colorScrollbarTrack };\n\t\t\tborder-radius: 8px;\n\t\t}\n\n\t\t&::-webkit-scrollbar-thumb {\n\t\t\tbackground-clip: padding-box;\n\t\t\tbackground-color: ${ CONFIG.colorScrollbarThumb };\n\t\t\tborder: 2px solid rgba( 0, 0, 0, 0 );\n\t\t\tborder-radius: 7px;\n\t\t}\n\n\t\t&:hover::-webkit-scrollbar-thumb {\n\t\t\tbackground-color: ${ CONFIG.colorScrollbarThumbHover };\n\t\t}\n\t}\n`;\n\nexport const Scrollable = css`\n\theight: 100%;\n`;\n\nexport const Content = css`\n\tposition: relative;\n`;\n\nexport const smoothScroll = css`\n\tscroll-behavior: smooth;\n`;\n\nexport const scrollX = css`\n\toverflow-x: auto;\n\toverflow-y: hidden;\n`;\n\nexport const scrollY = css`\n\toverflow-x: hidden;\n\toverflow-y: auto;\n`;\n\nexport const scrollAuto = css`\n\toverflow-y: auto;\n`;\n"]}
1	+ {"version":3,"names":["_react","require","_utils","_EMOTION_STRINGIFIED_CSS_ERROR__","scrollableScrollbar","css","CONFIG","colorScrollbarTrack","colorScrollbarThumb","colorScrollbarThumbHover","process","env","NODE_ENV","exports","Scrollable","name","styles","map","toString","Content","smoothScroll","scrollX","scrollY","scrollAuto"],"sources":["@wordpress/components/src/scrollable/styles.ts"],"sourcesContent":["/*\n External dependencies\n /\nimport { css } from '@emotion/react';\n\n/\n Internal dependencies\n */\nimport { CONFIG } from '../utils';\n\nexport const scrollableScrollbar = css`\n\t@media only screen and ( min-device-width: 40em ) {\n\t\t&::-webkit-scrollbar {\n\t\t\theight: 12px;\n\t\t\twidth: 12px;\n\t\t}\n\n\t\t&::-webkit-scrollbar-track {\n\t\t\tbackground-color: transparent;\n\t\t}\n\n\t\t&::-webkit-scrollbar-track {\n\t\t\tbackground: ${ CONFIG.colorScrollbarTrack };\n\t\t\tborder-radius: 8px;\n\t\t}\n\n\t\t&::-webkit-scrollbar-thumb {\n\t\t\tbackground-clip: padding-box;\n\t\t\tbackground-color: ${ CONFIG.colorScrollbarThumb };\n\t\t\tborder: 2px solid rgba( 0, 0, 0, 0 );\n\t\t\tborder-radius: 7px;\n\t\t}\n\n\t\t&:hover::-webkit-scrollbar-thumb {\n\t\t\tbackground-color: ${ CONFIG.colorScrollbarThumbHover };\n\t\t}\n\t}\n`;\n\nexport const Scrollable = css`\n\theight: 100%;\n`;\n\nexport const Content = css`\n\tposition: relative;\n`;\n\nexport const smoothScroll = css`\n\tscroll-behavior: smooth;\n`;\n\nexport const scrollX = css`\n\toverflow-x: auto;\n\toverflow-y: hidden;\n`;\n\nexport const scrollY = css`\n\toverflow-x: hidden;\n\toverflow-y: auto;\n`;\n\nexport const scrollAuto = css`\n\toverflow-y: auto;\n`;\n"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,OAAA;AAKA,IAAAC,MAAA,GAAAD,OAAA;AAAkC,SAAAE,iCAAA;AAE3B,MAAMC,mBAAmB,oBAAGC,UAAG,oMAYpBC,aAAM,CAACC,mBAAmB,kGAMpBD,aAAM,CAACE,mBAAmB,gHAM1BF,aAAM,CAACG,wBAAwB,WAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,yDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,29DAGtD;AAACC,OAAA,CAAAT,mBAAA,GAAAA,mBAAA;AAEK,MAAMU,UAAU,GAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAf;AAAA,CAEtB;AAACU,OAAA,CAAAC,UAAA,GAAAA,UAAA;AAEK,MAAMK,OAAO,GAAAT,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAf;AAAA,CAEnB;AAACU,OAAA,CAAAM,OAAA,GAAAA,OAAA;AAEK,MAAMC,YAAY,GAAAV,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAf;AAAA,CAExB;AAACU,OAAA,CAAAO,YAAA,GAAAA,YAAA;AAEK,MAAMC,OAAO,GAAAX,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAf;AAAA,CAGnB;AAACU,OAAA,CAAAQ,OAAA,GAAAA,OAAA;AAEK,MAAMC,OAAO,GAAAZ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAf;AAAA,CAGnB;AAACU,OAAA,CAAAS,OAAA,GAAAA,OAAA;AAEK,MAAMC,UAAU,GAAAb,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAf;AAAA,CAEtB;AAACU,OAAA,CAAAU,UAAA,GAAAA,UAAA"}

package/build/scrollable/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources~~":[],"~~names~~":[],"~~mappings~~":"","~~sourcesContent~~":[]}
1	+ {"version":3,"names":[],"sources":["@wordpress/components/src/scrollable/types.ts"],"sourcesContent":["/*\n External dependencies\n /\nimport type { ReactNode } from 'react';\n\nexport type ScrollableDirection = 'x' \| 'y' \| 'auto';\n\nexport type ScrollableProps = {\n\t/\n\t The children elements.\n\t /\n\tchildren: ReactNode;\n\t/\n\t Renders a scrollbar for a specific axis when content overflows.\n\t \n\t @default 'y'\n\t /\n\tscrollDirection?: ScrollableDirection;\n\t/\n\t Enables (CSS) smooth scrolling.\n\t \n\t @default false\n\t */\n\tsmoothScroll?: boolean;\n};\n"],"mappings":""}

package/build/search-control/index.js CHANGED Viewed

@@ -1,26 +1,17 @@
 "use strict";
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.SearchControl = void 0;
 var _element = require("@wordpress/element");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _compose = require("@wordpress/compose");
 var _i18n = require("@wordpress/i18n");
 var _icons = require("@wordpress/icons");
 var _button = _interopRequireDefault(require("../button"));
 var _baseControl = _interopRequireDefault(require("../base-control"));
 /**
  * External dependencies
  */
@@ -32,6 +23,7 @@ var _baseControl = _interopRequireDefault(require("../base-control"));
 /**
  * Internal dependencies
  */
 function UnforwardedSearchControl({
   __nextHasNoMarginBottom,
   className,
@@ -48,7 +40,6 @@ function UnforwardedSearchControl({
   const searchRef = (0, _element.useRef)();
   const instanceId = (0, _compose.useInstanceId)(SearchControl);
   const id = `components-search-control-${instanceId}`;
   const renderRightButton = () => {
     if (onClose) {
       return (0, _element.createElement)(_button.default, {
@@ -57,7 +48,6 @@ function UnforwardedSearchControl({
         onClick: onClose
       });
     }
     if (!!value) {
       return (0, _element.createElement)(_button.default, {
         icon: _icons.closeSmall,
@@ -68,12 +58,10 @@ function UnforwardedSearchControl({
         }
       });
     }
     return (0, _element.createElement)(_icons.Icon, {
       icon: _icons.search
     });
   };
   return (0, _element.createElement)(_baseControl.default, {
     __nextHasNoMarginBottom: __nextHasNoMarginBottom,
     label: label,
@@ -83,7 +71,8 @@ function UnforwardedSearchControl({
     className: (0, _classnames.default)(className, 'components-search-control')
   }, (0, _element.createElement)("div", {
     className: "components-search-control__input-wrapper"
-  }, (0, _element.createElement)("input", { ...restProps,
+  }, (0, _element.createElement)("input", {
+    ...restProps,
     ref: (0, _compose.useMergeRefs)([searchRef, forwardedRef]),
     className: "components-search-control__input",
     id: id,
@@ -97,6 +86,7 @@ function UnforwardedSearchControl({
     className: "components-search-control__icon"
   }, renderRightButton())));
 }
 /**
  * SearchControl components let users display a search control.
  *
@@ -116,8 +106,6 @@ function UnforwardedSearchControl({
  * }
  * ```
  */
 const SearchControl = (0, _element.forwardRef)(UnforwardedSearchControl);
 exports.SearchControl = SearchControl;
 var _default = SearchControl;