@wordpress/block-editor 12.8.1 → 12.9.1-next.5a1d1283.0

package/src/hooks/auto-inserting-blocks.js

@@ -0,0 +1,232 @@
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import { addFilter } from '@wordpress/hooks';
+import { Fragment } from '@wordpress/element';
+import { PanelBody, ToggleControl } from '@wordpress/components';
+import { createHigherOrderComponent } from '@wordpress/compose';
+import { createBlock, store as blocksStore } from '@wordpress/blocks';
+import { useDispatch, useSelect } from '@wordpress/data';
+
+/**
+ * Internal dependencies
+ */
+import { InspectorControls } from '../components';
+import { store as blockEditorStore } from '../store';
+
+function AutoInsertingBlocksControl( props ) {
+	const { autoInsertedBlocksForCurrentBlock, groupedAutoInsertedBlocks } =
+		useSelect(
+			( select ) => {
+				const { getBlockTypes } = select( blocksStore );
+				const _autoInsertedBlocksForCurrentBlock =
+					getBlockTypes()?.filter(
+						( { autoInsert } ) =>
+							autoInsert && props.blockName in autoInsert
+					);
+
+				// Group by block namespace (i.e. prefix before the slash).
+				const _groupedAutoInsertedBlocks =
+					_autoInsertedBlocksForCurrentBlock?.reduce(
+						( groups, block ) => {
+							const [ namespace ] = block.name.split( '/' );
+							if ( ! groups[ namespace ] ) {
+								groups[ namespace ] = [];
+							}
+							groups[ namespace ].push( block );
+							return groups;
+						},
+						{}
+					);
+
+				return {
+					autoInsertedBlocksForCurrentBlock:
+						_autoInsertedBlocksForCurrentBlock,
+					groupedAutoInsertedBlocks: _groupedAutoInsertedBlocks,
+				};
+			},
+			[ props.blockName ]
+		);
+
+	const {
+		autoInsertedBlockClientIds,
+		blockIndex,
+		rootClientId,
+		innerBlocksLength,
+	} = useSelect(
+		( select ) => {
+			const { getBlock, getBlockIndex, getBlockRootClientId } =
+				select( blockEditorStore );
+			const _rootClientId = getBlockRootClientId( props.clientId );
+
+			const _autoInsertedBlockClientIds =
+				autoInsertedBlocksForCurrentBlock.reduce(
+					( clientIds, block ) => {
+						const relativePosition =
+							block?.autoInsert?.[ props.blockName ];
+						let candidates;
+
+						switch ( relativePosition ) {
+							case 'before':
+							case 'after':
+								// Any of the current block's siblings (with the right block type) qualifies
+								// as an auto-inserted block (inserted `before` or `after` the current one),
+								// as the block might've been auto-inserted and then moved around a bit by the user.
+								candidates =
+									getBlock( _rootClientId )?.innerBlocks;
+								break;
+
+							case 'first_child':
+							case 'last_child':
+								// Any of the current block's child blocks (with the right block type) qualifies
+								// as an auto-inserted first or last child block, as the block might've been
+								// auto-inserted and then moved around a bit by the user.
+								candidates = getBlock(
+									props.clientId
+								).innerBlocks;
+								break;
+						}
+
+						const autoInsertedBlock = candidates?.find(
+							( { name } ) => name === block.name
+						);
+
+						if ( autoInsertedBlock ) {
+							clientIds[ block.name ] =
+								autoInsertedBlock.clientId;
+						}
+
+						// TOOD: If no auto-inserted block was found in any of its designated locations,
+						// we want to check if it's present elsewhere in the block tree.
+						// If it is, we'd consider it manually inserted and would want to remove the
+						// corresponding toggle from the block inspector panel.
+
+						return clientIds;
+					},
+					{}
+				);
+
+			return {
+				blockIndex: getBlockIndex( props.clientId ),
+				innerBlocksLength: getBlock( props.clientId )?.innerBlocks
+					?.length,
+				rootClientId: _rootClientId,
+				autoInsertedBlockClientIds: _autoInsertedBlockClientIds,
+			};
+		},
+		[ autoInsertedBlocksForCurrentBlock, props.blockName, props.clientId ]
+	);
+
+	const { insertBlock, removeBlock } = useDispatch( blockEditorStore );
+
+	if ( ! autoInsertedBlocksForCurrentBlock.length ) {
+		return null;
+	}
+
+	const insertBlockIntoDesignatedLocation = ( block, relativePosition ) => {
+		switch ( relativePosition ) {
+			case 'before':
+			case 'after':
+				insertBlock(
+					block,
+					relativePosition === 'after' ? blockIndex + 1 : blockIndex,
+					rootClientId, // Insert as a child of the current block's parent
+					false
+				);
+				break;
+
+			case 'first_child':
+			case 'last_child':
+				insertBlock(
+					block,
+					// TODO: It'd be great if insertBlock() would accept negative indices for insertion.
+					relativePosition === 'first_child' ? 0 : innerBlocksLength,
+					props.clientId, // Insert as a child of the current block.
+					false
+				);
+				break;
+		}
+	};
+
+	return (
+		<InspectorControls>
+			<PanelBody title={ __( 'Plugins' ) } initialOpen={ true }>
+				{ Object.keys( groupedAutoInsertedBlocks ).map( ( vendor ) => {
+					return (
+						<Fragment key={ vendor }>
+							<h3>{ vendor }</h3>
+							{ groupedAutoInsertedBlocks[ vendor ].map(
+								( block ) => {
+									// TODO: Display block icon.
+									// <BlockIcon icon={ block.icon } />
+
+									const checked =
+										block.name in
+										autoInsertedBlockClientIds;
+
+									return (
+										<ToggleControl
+											checked={ checked }
+											key={ block.title }
+											label={ block.title }
+											onChange={ () => {
+												if ( ! checked ) {
+													// Create and insert block.
+													const relativePosition =
+														block.autoInsert[
+															props.blockName
+														];
+													insertBlockIntoDesignatedLocation(
+														createBlock(
+															block.name
+														),
+														relativePosition
+													);
+													return;
+												}
+
+												// Remove block.
+												const clientId =
+													autoInsertedBlockClientIds[
+														block.name
+													];
+												removeBlock( clientId, false );
+											} }
+										/>
+									);
+								}
+							) }
+						</Fragment>
+					);
+				} ) }
+			</PanelBody>
+		</InspectorControls>
+	);
+}
+
+export const withAutoInsertingBlocks = createHigherOrderComponent(
+	( BlockEdit ) => {
+		return ( props ) => {
+			const blockEdit = <BlockEdit key="edit" { ...props } />;
+			return (
+				<>
+					{ blockEdit }
+					<AutoInsertingBlocksControl
+						blockName={ props.name }
+						clientId={ props.clientId }
+					/>
+				</>
+			);
+		};
+	},
+	'withAutoInsertingBlocks'
+);
+
+if ( window?.__experimentalAutoInsertingBlocks ) {
+	addFilter(
+		'editor.BlockEdit',
+		'core/auto-inserting-blocks/with-inspector-control',
+		withAutoInsertingBlocks
+	);
+}

package/src/hooks/index.js

@@ -22,6 +22,7 @@ import './metadata';
 import './metadata-name';
 import './behaviors';
 import './custom-fields';
+import './auto-inserting-blocks';
 
 export { useCustomSides } from './dimensions';
 export { useLayoutClasses, useLayoutStyles } from './layout';

package/src/hooks/style.js

@@ -34,6 +34,7 @@ import {
 } from './dimensions';
 import useDisplayBlockControls from '../components/use-display-block-controls';
 import { shouldSkipSerialization } from './utils';
+import { scopeSelector } from '../components/global-styles/utils';
 import { useBlockEditingMode } from '../components/block-editing-mode';
 
 const styleSupportKeys = [
@@ -371,6 +372,18 @@ export const withBlockControls = createHigherOrderComponent(
 	'withToolbarControls'
 );
 
+// Defines which element types are supported, including their hover styles or
+// any other elements that have been included under a single element type
+// e.g. heading and h1-h6.
+const elementTypes = [
+	{ elementType: 'button' },
+	{ elementType: 'link', pseudo: [ ':hover' ] },
+	{
+		elementType: 'heading',
+		elements: [ 'h1', 'h2', 'h3', 'h4', 'h5', 'h6' ],
+	},
+];
+
 /**
  * Override the default block element to include elements styles.
  *
@@ -383,47 +396,84 @@ const withElementsStyles = createHigherOrderComponent(
 			BlockListBlock
 		) }`;
 
-		const skipLinkColorSerialization = shouldSkipSerialization(
-			props.name,
-			COLOR_SUPPORT_KEY,
-			'link'
-		);
+		// The .editor-styles-wrapper selector is required on elements styles. As it is
+		// added to all other editor styles, not providing it causes reset and global
+		// styles to override element styles because of higher specificity.
+		const baseElementSelector = `.editor-styles-wrapper .${ blockElementsContainerIdentifier }`;
+		const blockElementStyles = props.attributes.style?.elements;
 
 		const styles = useMemo( () => {
-			// The .editor-styles-wrapper selector is required on elements styles. As it is
-			// added to all other editor styles, not providing it causes reset and global
-			// styles to override element styles because of higher specificity.
-			const elements = [
-				{
-					styles: ! skipLinkColorSerialization
-						? props.attributes.style?.elements?.link
-						: undefined,
-					selector: `.editor-styles-wrapper .${ blockElementsContainerIdentifier } ${ ELEMENTS.link }`,
-				},
-				{
-					styles: ! skipLinkColorSerialization
-						? props.attributes.style?.elements?.link?.[ ':hover' ]
-						: undefined,
-					selector: `.editor-styles-wrapper .${ blockElementsContainerIdentifier } ${ ELEMENTS.link }:hover`,
-				},
-			];
-			const elementCssRules = [];
-			for ( const { styles: elementStyles, selector } of elements ) {
+			if ( ! blockElementStyles ) {
+				return;
+			}
+
+			const elementCSSRules = [];
+
+			elementTypes.forEach( ( { elementType, pseudo, elements } ) => {
+				const skipSerialization = shouldSkipSerialization(
+					props.name,
+					COLOR_SUPPORT_KEY,
+					elementType
+				);
+
+				if ( skipSerialization ) {
+					return;
+				}
+
+				const elementStyles = blockElementStyles?.[ elementType ];
+
+				// Process primary element type styles.
 				if ( elementStyles ) {
-					const cssRule = compileCSS( elementStyles, {
-						selector,
+					const selector = scopeSelector(
+						baseElementSelector,
+						ELEMENTS[ elementType ]
+					);
+
+					elementCSSRules.push(
+						compileCSS( elementStyles, { selector } )
+					);
+
+					// Process any interactive states for the element type.
+					if ( pseudo ) {
+						pseudo.forEach( ( pseudoSelector ) => {
+							if ( elementStyles[ pseudoSelector ] ) {
+								elementCSSRules.push(
+									compileCSS(
+										elementStyles[ pseudoSelector ],
+										{
+											selector: scopeSelector(
+												baseElementSelector,
+												`${ ELEMENTS[ elementType ] }${ pseudoSelector }`
+											),
+										}
+									)
+								);
+							}
+						} );
+					}
+				}
+
+				// Process related elements e.g. h1-h6 for headings
+				if ( elements ) {
+					elements.forEach( ( element ) => {
+						if ( blockElementStyles[ element ] ) {
+							elementCSSRules.push(
+								compileCSS( blockElementStyles[ element ], {
+									selector: scopeSelector(
+										baseElementSelector,
+										ELEMENTS[ element ]
+									),
+								} )
+							);
+						}
 					} );
-					elementCssRules.push( cssRule );
 				}
-			}
-			return elementCssRules.length > 0
-				? elementCssRules.join( '' )
+			} );
+
+			return elementCSSRules.length > 0
+				? elementCSSRules.join( '' )
 				: undefined;
-		}, [
-			props.attributes.style?.elements,
-			blockElementsContainerIdentifier,
-			skipLinkColorSerialization,
-		] );
+		}, [ baseElementSelector, blockElementStyles, props.name ] );
 
 		const element = useContext( BlockList.__unstableElementContext );
 

package/src/hooks/utils.js

@@ -166,6 +166,8 @@ export function useBlockSettings( name, parentLayout ) {
 	const isBackgroundEnabled = useSetting( 'color.background' );
 	const isLinkEnabled = useSetting( 'color.link' );
 	const isTextEnabled = useSetting( 'color.text' );
+	const isHeadingEnabled = useSetting( 'color.heading' );
+	const isButtonEnabled = useSetting( 'color.button' );
 
 	const rawSettings = useMemo( () => {
 		return {
@@ -193,6 +195,8 @@ export function useBlockSettings( name, parentLayout ) {
 				customDuotone,
 				background: isBackgroundEnabled,
 				link: isLinkEnabled,
+				heading: isHeadingEnabled,
+				button: isButtonEnabled,
 				text: isTextEnabled,
 			},
 			typography: {

package/build/utils/pre-parse-patterns.js

@@ -1,68 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.usePreParsePatterns = usePreParsePatterns;
-var _data = require("@wordpress/data");
-var _element = require("@wordpress/element");
-var _store = require("../store");
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-
-const requestIdleCallback = (() => {
-  if (typeof window === 'undefined') {
-    return callback => {
-      setTimeout(() => callback(Date.now()), 0);
-    };
-  }
-  return window.requestIdleCallback || window.requestAnimationFrame;
-})();
-const cancelIdleCallback = (() => {
-  if (typeof window === 'undefined') {
-    return clearTimeout;
-  }
-  return window.cancelIdleCallback || window.cancelAnimationFrame;
-})();
-function usePreParsePatterns() {
-  const {
-    patterns,
-    isPreviewMode
-  } = (0, _data.useSelect)(_select => {
-    const {
-      __experimentalBlockPatterns,
-      __unstableIsPreviewMode
-    } = _select(_store.store).getSettings();
-    return {
-      patterns: __experimentalBlockPatterns,
-      isPreviewMode: __unstableIsPreviewMode
-    };
-  }, []);
-  (0, _element.useEffect)(() => {
-    if (isPreviewMode) {
-      return;
-    }
-    if (!patterns?.length) {
-      return;
-    }
-    let handle;
-    let index = -1;
-    const callback = () => {
-      index++;
-      if (index >= patterns.length) {
-        return;
-      }
-      (0, _data.select)(_store.store).__experimentalGetParsedPattern(patterns[index].name);
-      handle = requestIdleCallback(callback);
-    };
-    handle = requestIdleCallback(callback);
-    return () => cancelIdleCallback(handle);
-  }, [patterns, isPreviewMode]);
-  return null;
-}
-//# sourceMappingURL=pre-parse-patterns.js.map

package/build/utils/pre-parse-patterns.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_data","require","_element","_store","requestIdleCallback","window","callback","setTimeout","Date","now","requestAnimationFrame","cancelIdleCallback","clearTimeout","cancelAnimationFrame","usePreParsePatterns","patterns","isPreviewMode","useSelect","_select","__experimentalBlockPatterns","__unstableIsPreviewMode","blockEditorStore","getSettings","useEffect","length","handle","index","select","__experimentalGetParsedPattern","name"],"sources":["@wordpress/block-editor/src/utils/pre-parse-patterns.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, select } from '@wordpress/data';\nimport { useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../store';\n\nconst requestIdleCallback = ( () => {\n\tif ( typeof window === 'undefined' ) {\n\t\treturn ( callback ) => {\n\t\t\tsetTimeout( () => callback( Date.now() ), 0 );\n\t\t};\n\t}\n\n\treturn window.requestIdleCallback || window.requestAnimationFrame;\n} )();\n\nconst cancelIdleCallback = ( () => {\n\tif ( typeof window === 'undefined' ) {\n\t\treturn clearTimeout;\n\t}\n\n\treturn window.cancelIdleCallback || window.cancelAnimationFrame;\n} )();\n\nexport function usePreParsePatterns() {\n\tconst { patterns, isPreviewMode } = useSelect( ( _select ) => {\n\t\tconst { __experimentalBlockPatterns, __unstableIsPreviewMode } =\n\t\t\t_select( blockEditorStore ).getSettings();\n\t\treturn {\n\t\t\tpatterns: __experimentalBlockPatterns,\n\t\t\tisPreviewMode: __unstableIsPreviewMode,\n\t\t};\n\t}, [] );\n\n\tuseEffect( () => {\n\t\tif ( isPreviewMode ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( ! patterns?.length ) {\n\t\t\treturn;\n\t\t}\n\n\t\tlet handle;\n\t\tlet index = -1;\n\n\t\tconst callback = () => {\n\t\t\tindex++;\n\t\t\tif ( index >= patterns.length ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tselect( blockEditorStore ).__experimentalGetParsedPattern(\n\t\t\t\tpatterns[ index ].name\n\t\t\t);\n\n\t\t\thandle = requestIdleCallback( callback );\n\t\t};\n\n\t\thandle = requestIdleCallback( callback );\n\t\treturn () => cancelIdleCallback( handle );\n\t}, [ patterns, isPreviewMode ] );\n\n\treturn null;\n}\n"],"mappings":";;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,MAAA,GAAAF,OAAA;AATA;AACA;AACA;;AAIA;AACA;AACA;;AAGA,MAAMG,mBAAmB,GAAG,CAAE,MAAM;EACnC,IAAK,OAAOC,MAAM,KAAK,WAAW,EAAG;IACpC,OAASC,QAAQ,IAAM;MACtBC,UAAU,CAAE,MAAMD,QAAQ,CAAEE,IAAI,CAACC,GAAG,CAAC,CAAE,CAAC,EAAE,CAAE,CAAC;IAC9C,CAAC;EACF;EAEA,OAAOJ,MAAM,CAACD,mBAAmB,IAAIC,MAAM,CAACK,qBAAqB;AAClE,CAAC,EAAG,CAAC;AAEL,MAAMC,kBAAkB,GAAG,CAAE,MAAM;EAClC,IAAK,OAAON,MAAM,KAAK,WAAW,EAAG;IACpC,OAAOO,YAAY;EACpB;EAEA,OAAOP,MAAM,CAACM,kBAAkB,IAAIN,MAAM,CAACQ,oBAAoB;AAChE,CAAC,EAAG,CAAC;AAEE,SAASC,mBAAmBA,CAAA,EAAG;EACrC,MAAM;IAAEC,QAAQ;IAAEC;EAAc,CAAC,GAAG,IAAAC,eAAS,EAAIC,OAAO,IAAM;IAC7D,MAAM;MAAEC,2BAA2B;MAAEC;IAAwB,CAAC,GAC7DF,OAAO,CAAEG,YAAiB,CAAC,CAACC,WAAW,CAAC,CAAC;IAC1C,OAAO;MACNP,QAAQ,EAAEI,2BAA2B;MACrCH,aAAa,EAAEI;IAChB,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEP,IAAAG,kBAAS,EAAE,MAAM;IAChB,IAAKP,aAAa,EAAG;MACpB;IACD;IACA,IAAK,CAAED,QAAQ,EAAES,MAAM,EAAG;MACzB;IACD;IAEA,IAAIC,MAAM;IACV,IAAIC,KAAK,GAAG,CAAC,CAAC;IAEd,MAAMpB,QAAQ,GAAGA,CAAA,KAAM;MACtBoB,KAAK,EAAE;MACP,IAAKA,KAAK,IAAIX,QAAQ,CAACS,MAAM,EAAG;QAC/B;MACD;MAEA,IAAAG,YAAM,EAAEN,YAAiB,CAAC,CAACO,8BAA8B,CACxDb,QAAQ,CAAEW,KAAK,CAAE,CAACG,IACnB,CAAC;MAEDJ,MAAM,GAAGrB,mBAAmB,CAAEE,QAAS,CAAC;IACzC,CAAC;IAEDmB,MAAM,GAAGrB,mBAAmB,CAAEE,QAAS,CAAC;IACxC,OAAO,MAAMK,kBAAkB,CAAEc,MAAO,CAAC;EAC1C,CAAC,EAAE,CAAEV,QAAQ,EAAEC,aAAa,CAAG,CAAC;EAEhC,OAAO,IAAI;AACZ"}

package/build-module/utils/pre-parse-patterns.js

@@ -1,61 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { useSelect, select } from '@wordpress/data';
-import { useEffect } from '@wordpress/element';
-
-/**
- * Internal dependencies
- */
-import { store as blockEditorStore } from '../store';
-const requestIdleCallback = (() => {
-  if (typeof window === 'undefined') {
-    return callback => {
-      setTimeout(() => callback(Date.now()), 0);
-    };
-  }
-  return window.requestIdleCallback || window.requestAnimationFrame;
-})();
-const cancelIdleCallback = (() => {
-  if (typeof window === 'undefined') {
-    return clearTimeout;
-  }
-  return window.cancelIdleCallback || window.cancelAnimationFrame;
-})();
-export function usePreParsePatterns() {
-  const {
-    patterns,
-    isPreviewMode
-  } = useSelect(_select => {
-    const {
-      __experimentalBlockPatterns,
-      __unstableIsPreviewMode
-    } = _select(blockEditorStore).getSettings();
-    return {
-      patterns: __experimentalBlockPatterns,
-      isPreviewMode: __unstableIsPreviewMode
-    };
-  }, []);
-  useEffect(() => {
-    if (isPreviewMode) {
-      return;
-    }
-    if (!patterns?.length) {
-      return;
-    }
-    let handle;
-    let index = -1;
-    const callback = () => {
-      index++;
-      if (index >= patterns.length) {
-        return;
-      }
-      select(blockEditorStore).__experimentalGetParsedPattern(patterns[index].name);
-      handle = requestIdleCallback(callback);
-    };
-    handle = requestIdleCallback(callback);
-    return () => cancelIdleCallback(handle);
-  }, [patterns, isPreviewMode]);
-  return null;
-}
-//# sourceMappingURL=pre-parse-patterns.js.map

package/build-module/utils/pre-parse-patterns.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["useSelect","select","useEffect","store","blockEditorStore","requestIdleCallback","window","callback","setTimeout","Date","now","requestAnimationFrame","cancelIdleCallback","clearTimeout","cancelAnimationFrame","usePreParsePatterns","patterns","isPreviewMode","_select","__experimentalBlockPatterns","__unstableIsPreviewMode","getSettings","length","handle","index","__experimentalGetParsedPattern","name"],"sources":["@wordpress/block-editor/src/utils/pre-parse-patterns.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, select } from '@wordpress/data';\nimport { useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../store';\n\nconst requestIdleCallback = ( () => {\n\tif ( typeof window === 'undefined' ) {\n\t\treturn ( callback ) => {\n\t\t\tsetTimeout( () => callback( Date.now() ), 0 );\n\t\t};\n\t}\n\n\treturn window.requestIdleCallback || window.requestAnimationFrame;\n} )();\n\nconst cancelIdleCallback = ( () => {\n\tif ( typeof window === 'undefined' ) {\n\t\treturn clearTimeout;\n\t}\n\n\treturn window.cancelIdleCallback || window.cancelAnimationFrame;\n} )();\n\nexport function usePreParsePatterns() {\n\tconst { patterns, isPreviewMode } = useSelect( ( _select ) => {\n\t\tconst { __experimentalBlockPatterns, __unstableIsPreviewMode } =\n\t\t\t_select( blockEditorStore ).getSettings();\n\t\treturn {\n\t\t\tpatterns: __experimentalBlockPatterns,\n\t\t\tisPreviewMode: __unstableIsPreviewMode,\n\t\t};\n\t}, [] );\n\n\tuseEffect( () => {\n\t\tif ( isPreviewMode ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( ! patterns?.length ) {\n\t\t\treturn;\n\t\t}\n\n\t\tlet handle;\n\t\tlet index = -1;\n\n\t\tconst callback = () => {\n\t\t\tindex++;\n\t\t\tif ( index >= patterns.length ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tselect( blockEditorStore ).__experimentalGetParsedPattern(\n\t\t\t\tpatterns[ index ].name\n\t\t\t);\n\n\t\t\thandle = requestIdleCallback( callback );\n\t\t};\n\n\t\thandle = requestIdleCallback( callback );\n\t\treturn () => cancelIdleCallback( handle );\n\t}, [ patterns, isPreviewMode ] );\n\n\treturn null;\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAS,EAAEC,MAAM,QAAQ,iBAAiB;AACnD,SAASC,SAAS,QAAQ,oBAAoB;;AAE9C;AACA;AACA;AACA,SAASC,KAAK,IAAIC,gBAAgB,QAAQ,UAAU;AAEpD,MAAMC,mBAAmB,GAAG,CAAE,MAAM;EACnC,IAAK,OAAOC,MAAM,KAAK,WAAW,EAAG;IACpC,OAASC,QAAQ,IAAM;MACtBC,UAAU,CAAE,MAAMD,QAAQ,CAAEE,IAAI,CAACC,GAAG,CAAC,CAAE,CAAC,EAAE,CAAE,CAAC;IAC9C,CAAC;EACF;EAEA,OAAOJ,MAAM,CAACD,mBAAmB,IAAIC,MAAM,CAACK,qBAAqB;AAClE,CAAC,EAAG,CAAC;AAEL,MAAMC,kBAAkB,GAAG,CAAE,MAAM;EAClC,IAAK,OAAON,MAAM,KAAK,WAAW,EAAG;IACpC,OAAOO,YAAY;EACpB;EAEA,OAAOP,MAAM,CAACM,kBAAkB,IAAIN,MAAM,CAACQ,oBAAoB;AAChE,CAAC,EAAG,CAAC;AAEL,OAAO,SAASC,mBAAmBA,CAAA,EAAG;EACrC,MAAM;IAAEC,QAAQ;IAAEC;EAAc,CAAC,GAAGjB,SAAS,CAAIkB,OAAO,IAAM;IAC7D,MAAM;MAAEC,2BAA2B;MAAEC;IAAwB,CAAC,GAC7DF,OAAO,CAAEd,gBAAiB,CAAC,CAACiB,WAAW,CAAC,CAAC;IAC1C,OAAO;MACNL,QAAQ,EAAEG,2BAA2B;MACrCF,aAAa,EAAEG;IAChB,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEPlB,SAAS,CAAE,MAAM;IAChB,IAAKe,aAAa,EAAG;MACpB;IACD;IACA,IAAK,CAAED,QAAQ,EAAEM,MAAM,EAAG;MACzB;IACD;IAEA,IAAIC,MAAM;IACV,IAAIC,KAAK,GAAG,CAAC,CAAC;IAEd,MAAMjB,QAAQ,GAAGA,CAAA,KAAM;MACtBiB,KAAK,EAAE;MACP,IAAKA,KAAK,IAAIR,QAAQ,CAACM,MAAM,EAAG;QAC/B;MACD;MAEArB,MAAM,CAAEG,gBAAiB,CAAC,CAACqB,8BAA8B,CACxDT,QAAQ,CAAEQ,KAAK,CAAE,CAACE,IACnB,CAAC;MAEDH,MAAM,GAAGlB,mBAAmB,CAAEE,QAAS,CAAC;IACzC,CAAC;IAEDgB,MAAM,GAAGlB,mBAAmB,CAAEE,QAAS,CAAC;IACxC,OAAO,MAAMK,kBAAkB,CAAEW,MAAO,CAAC;EAC1C,CAAC,EAAE,CAAEP,QAAQ,EAAEC,aAAa,CAAG,CAAC;EAEhC,OAAO,IAAI;AACZ"}

package/src/components/url-popover/test/__snapshots__/index.js.snap

@@ -1,133 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`URLPopover matches the snapshot in its default state 1`] = `
-<div>
-  <span>
-    <div
-      class="components-popover block-editor-url-popover is-positioned"
-      style="position: absolute; top: 0px; left: 0px; transform: none;"
-      tabindex="-1"
-    >
-      <div
-        class="components-popover__content"
-        style="max-height: 0px; overflow: auto;"
-      >
-        <div
-          class="block-editor-url-popover__input-container"
-        >
-          <div
-            class="block-editor-url-popover__row"
-          >
-            <div>
-              Editor
-            </div>
-            <button
-              aria-expanded="false"
-              aria-label="Link settings"
-              class="components-button block-editor-url-popover__settings-toggle has-icon"
-              type="button"
-            >
-              <svg
-                aria-hidden="true"
-                focusable="false"
-                height="24"
-                viewBox="0 0 24 24"
-                width="24"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  d="M17.5 11.6L12 16l-5.5-4.4.9-1.2L12 14l4.5-3.6 1 1.2z"
-                />
-              </svg>
-            </button>
-          </div>
-        </div>
-      </div>
-    </div>
-  </span>
-</div>
-`;
-
-exports[`URLPopover matches the snapshot when the settings are toggled open 1`] = `
-<div>
-  <span>
-    <div
-      class="components-popover block-editor-url-popover is-positioned"
-      style="position: absolute; top: 0px; left: 0px; transform: none;"
-      tabindex="-1"
-    >
-      <div
-        class="components-popover__content"
-        style="max-height: 0px; overflow: auto;"
-      >
-        <div
-          class="block-editor-url-popover__input-container"
-        >
-          <div
-            class="block-editor-url-popover__row"
-          >
-            <div>
-              Editor
-            </div>
-            <button
-              aria-expanded="true"
-              aria-label="Link settings"
-              class="components-button block-editor-url-popover__settings-toggle has-icon"
-              type="button"
-            >
-              <svg
-                aria-hidden="true"
-                focusable="false"
-                height="24"
-                viewBox="0 0 24 24"
-                width="24"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  d="M17.5 11.6L12 16l-5.5-4.4.9-1.2L12 14l4.5-3.6 1 1.2z"
-                />
-              </svg>
-            </button>
-          </div>
-          <div
-            class="block-editor-url-popover__row block-editor-url-popover__settings"
-          >
-            <div>
-              Settings
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </span>
-</div>
-`;
-
-exports[`URLPopover matches the snapshot when there are no settings 1`] = `
-<div>
-  <span>
-    <div
-      class="components-popover block-editor-url-popover is-positioned"
-      style="position: absolute; top: 0px; left: 0px; transform: none;"
-      tabindex="-1"
-    >
-      <div
-        class="components-popover__content"
-        style="max-height: 0px; overflow: auto;"
-      >
-        <div
-          class="block-editor-url-popover__input-container"
-        >
-          <div
-            class="block-editor-url-popover__row"
-          >
-            <div>
-              Editor
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </span>
-</div>
-`;