@wordpress/block-editor 12.8.1 → 12.9.0

package/src/components/list-view/use-list-view-images.js

@@ -12,13 +12,17 @@ import { store as blockEditorStore } from '../../store';
 // Maximum number of images to display in a list view row.
 const MAX_IMAGES = 3;
 
-function getImageUrl( block ) {
+function getImage( block ) {
 	if ( block.name !== 'core/image' ) {
 		return;
 	}
 
 	if ( block.attributes?.url ) {
-		return { url: block.attributes.url, alt: block.attributes.alt };
+		return {
+			url: block.attributes.url,
+			alt: block.attributes.alt,
+			clientId: block.clientId,
+		};
 	}
 }
 
@@ -30,7 +34,7 @@ function getImagesFromGallery( block ) {
 	const images = [];
 
 	for ( const innerBlock of block.innerBlocks ) {
-		const img = getImageUrl( innerBlock );
+		const img = getImage( innerBlock );
 		if ( img ) {
 			images.push( img );
 		}
@@ -43,7 +47,7 @@ function getImagesFromGallery( block ) {
 }
 
 function getImagesFromBlock( block, isExpanded ) {
-	const img = getImageUrl( block );
+	const img = getImage( block );
 	if ( img ) {
 		return [ img ];
 	}

package/src/components/observe-typing/README.md

@@ -1,6 +1,6 @@
 # Observe Typing
 
-`<ObserveTyping />` is a component used in managing the editor's internal typing flag. When used to wrap content — typically the top-level block list — it observes keyboard and mouse events to set and unset the typing flag. The typing flag is used in considering whether the block border and controls should be visible. While typing, these elements are hidden for a distraction-free experience.
+`<ObserveTyping />` is a component used in managing the editor's internal typing flag. When used to wrap content, it observes keyboard and mouse events to set and unset the typing flag. The typing flag is used in considering whether the block border and controls should be visible. While typing, these elements are hidden for a distraction-free experience.
 
 ## Usage
 
@@ -10,7 +10,7 @@ Wrap the component where blocks are to be rendered with `<ObserveTyping />`:
 function VisualEditor() {
 	return (
 		<ObserveTyping>
-			<BlockList />
+			<MyInput />
 		</ObserveTyping>
 	);
 }

package/src/components/preview-options/index.js

@@ -33,6 +33,7 @@ export default function PreviewOptions( {
 	const toggleProps = {
 		className: 'block-editor-post-preview__button-toggle',
 		disabled: ! isEnabled,
+		__experimentalIsFocusable: ! isEnabled,
 		children: viewLabel,
 	};
 	const menuProps = {
@@ -53,6 +54,7 @@ export default function PreviewOptions( {
 			menuProps={ menuProps }
 			icon={ deviceIcons[ deviceType.toLowerCase() ] }
 			label={ label || __( 'Preview' ) }
+			disableOpenOnArrowDown={ ! isEnabled }
 		>
 			{ ( renderProps ) => (
 				<>

package/src/components/provider/index.js

@@ -3,6 +3,7 @@
  */
 import { useDispatch } from '@wordpress/data';
 import { useEffect } from '@wordpress/element';
+import { SlotFillProvider } from '@wordpress/components';
 
 /**
  * Internal dependencies
@@ -12,6 +13,7 @@ import useBlockSync from './use-block-sync';
 import { store as blockEditorStore } from '../../store';
 import { BlockRefsProvider } from './block-refs-provider';
 import { unlock } from '../../lock-unlock';
+import KeyboardShortcuts from '../keyboard-shortcuts';
 
 /** @typedef {import('@wordpress/data').WPDataRegistry} WPDataRegistry */
 
@@ -42,7 +44,12 @@ export const ExperimentalBlockEditorProvider = withRegistryProvider(
 		// Syncs the entity provider with changes in the block-editor store.
 		useBlockSync( props );
 
-		return <BlockRefsProvider>{ children }</BlockRefsProvider>;
+		return (
+			<SlotFillProvider>
+				<KeyboardShortcuts.Register />
+				<BlockRefsProvider>{ children }</BlockRefsProvider>
+			</SlotFillProvider>
+		);
 	}
 );
 

package/src/components/use-block-commands/index.js

@@ -126,28 +126,12 @@ const useActionsCommands = () => {
 		getBlocksByClientId,
 		canMoveBlocks,
 		canRemoveBlocks,
+		getBlockCount,
 	} = useSelect( blockEditorStore );
 	const { getDefaultBlockName, getGroupingBlockName } =
 		useSelect( blocksStore );
 
 	const blocks = getBlocksByClientId( clientIds );
-	const rootClientId = getBlockRootClientId( clientIds[ 0 ] );
-
-	const canDuplicate = blocks.every( ( block ) => {
-		return (
-			!! block &&
-			hasBlockSupport( block.name, 'multiple', true ) &&
-			canInsertBlockType( block.name, rootClientId )
-		);
-	} );
-
-	const canInsertDefaultBlock = canInsertBlockType(
-		getDefaultBlockName(),
-		rootClientId
-	);
-
-	const canMove = canMoveBlocks( clientIds, rootClientId );
-	const canRemove = canRemoveBlocks( clientIds, rootClientId );
 
 	const {
 		removeBlocks,
@@ -160,42 +144,6 @@ const useActionsCommands = () => {
 		selectBlock,
 	} = useDispatch( blockEditorStore );
 
-	const onDuplicate = () => {
-		if ( ! canDuplicate ) {
-			return;
-		}
-		return duplicateBlocks( clientIds, true );
-	};
-	const onRemove = () => {
-		if ( ! canRemove ) {
-			return;
-		}
-		return removeBlocks( clientIds, true );
-	};
-	const onAddBefore = () => {
-		if ( ! canInsertDefaultBlock ) {
-			return;
-		}
-		const clientId = Array.isArray( clientIds ) ? clientIds[ 0 ] : clientId;
-		insertBeforeBlock( clientId );
-	};
-	const onAddAfter = () => {
-		if ( ! canInsertDefaultBlock ) {
-			return;
-		}
-		const clientId = Array.isArray( clientIds )
-			? clientIds[ clientIds.length - 1 ]
-			: clientId;
-		insertAfterBlock( clientId );
-	};
-	const onMoveTo = () => {
-		if ( ! canMove ) {
-			return;
-		}
-		setNavigationMode( true );
-		selectBlock( clientIds[ 0 ] );
-		setBlockMovingClientId( clientIds[ 0 ] );
-	};
 	const onGroup = () => {
 		if ( ! blocks.length ) {
 			return;
@@ -229,47 +177,103 @@ const useActionsCommands = () => {
 		return { isLoading: false, commands: [] };
 	}
 
-	const icons = {
-		ungroup,
-		group,
-		move,
-		add,
-		remove,
-		duplicate: copy,
-	};
+	const rootClientId = getBlockRootClientId( clientIds[ 0 ] );
+	const canInsertDefaultBlock = canInsertBlockType(
+		getDefaultBlockName(),
+		rootClientId
+	);
+	const canDuplicate = blocks.every( ( block ) => {
+		return (
+			!! block &&
+			hasBlockSupport( block.name, 'multiple', true ) &&
+			canInsertBlockType( block.name, rootClientId )
+		);
+	} );
+	const canRemove = canRemoveBlocks( clientIds, rootClientId );
+	const canMove =
+		canMoveBlocks( clientIds, rootClientId ) &&
+		getBlockCount( rootClientId ) !== 1;
 
 	const commands = [
-		onUngroup,
-		onGroup,
-		onMoveTo,
-		onAddAfter,
-		onAddBefore,
-		onRemove,
-		onDuplicate,
-	].map( ( callback ) => {
-		const action = callback.name
-			.replace( 'on', '' )
-			.replace( /([a-z])([A-Z])/g, '$1 $2' );
+		{
+			name: 'ungroup',
+			label: __( 'Ungroup' ),
+			callback: onUngroup,
+			icon: ungroup,
+		},
+		{
+			name: 'Group',
+			label: __( 'Group' ),
+			callback: onGroup,
+			icon: group,
+		},
+	];
+	if ( canInsertDefaultBlock ) {
+		commands.push(
+			{
+				name: 'add-after',
+				label: __( 'Add after' ),
+				callback: () => {
+					const clientId = Array.isArray( clientIds )
+						? clientIds[ clientIds.length - 1 ]
+						: clientId;
+					insertAfterBlock( clientId );
+				},
+				icon: add,
+			},
+			{
+				name: 'add-before',
+				label: __( 'Add before' ),
+				callback: () => {
+					const clientId = Array.isArray( clientIds )
+						? clientIds[ 0 ]
+						: clientId;
+					insertBeforeBlock( clientId );
+				},
+				icon: add,
+			}
+		);
+	}
+	if ( canRemove ) {
+		commands.push( {
+			name: 'remove',
+			label: __( 'Remove' ),
+			callback: () => removeBlocks( clientIds, true ),
+			icon: remove,
+		} );
+	}
+	if ( canDuplicate ) {
+		commands.push( {
+			name: 'duplicate',
+			label: __( 'Duplicate' ),
+			callback: () => duplicateBlocks( clientIds, true ),
+			icon: copy,
+		} );
+	}
+	if ( canMove ) {
+		commands.push( {
+			name: 'move-to',
+			label: __( 'Move to' ),
+			callback: () => {
+				setNavigationMode( true );
+				selectBlock( clientIds[ 0 ] );
+				setBlockMovingClientId( clientIds[ 0 ] );
+			},
+			icon: move,
+		} );
+	}
 
-		return {
-			name: 'core/block-editor/action-' + callback.name,
-			// translators: %s: type of the command.
-			label: action,
-			icon: icons[
-				callback.name
-					.replace( 'on', '' )
-					.match( /[A-Z]{1}[a-z]*/ )
-					.toString()
-					.toLowerCase()
-			],
+	return {
+		isLoading: false,
+		commands: commands.map( ( command ) => ( {
+			...command,
+			name: 'core/block-editor/action-' + command.name,
 			callback: ( { close } ) => {
-				callback();
+				command.callback();
 				close();
 			},
-		};
-	} );
-
-	return { isLoading: false, commands };
+		} ) ),
+	};
 };
 
 export const useBlockCommands = () => {

package/src/components/warning/index.js

@@ -9,7 +9,7 @@ import classnames from 'classnames';
 import { Children } from '@wordpress/element';
 import { DropdownMenu, MenuGroup, MenuItem } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
-import { moreHorizontal } from '@wordpress/icons';
+import { moreVertical } from '@wordpress/icons';
 
 function Warning( { className, actions, children, secondaryActions } ) {
 	return (
@@ -34,7 +34,7 @@ function Warning( { className, actions, children, secondaryActions } ) {
 							{ secondaryActions && (
 								<DropdownMenu
 									className="block-editor-warning__secondary"
-									icon={ moreHorizontal }
+									icon={ moreVertical }
 									label={ __( 'More options' ) }
 									popoverProps={ {
 										position: 'bottom left',

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/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"}