npm - @wordpress/block-editor - Versions diffs - 16.2.0 → 17.0.0 - Mend

@wordpress/block-editor 16.2.0 → 17.0.0

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 (328) hide show

package/build/components/inner-blocks/index.cjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/inner-blocks/index.js"],
-  "sourcesContent": ["import clsx from 'clsx';\nimport { useMergeRefs } from '@wordpress/compose';\nimport { forwardRef, useMemo, memo } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport {\n\tgetBlockSupport,\n\tstore as blocksStore,\n\t__unstableGetInnerBlocksProps as getInnerBlocksProps,\n} from '@wordpress/blocks';\nimport ButtonBlockAppender from './button-block-appender';\nimport DefaultBlockAppender from './default-block-appender';\nimport useNestedSettingsUpdate from './use-nested-settings-update';\nimport useInnerBlockTemplateSync from './use-inner-block-template-sync';\nimport useBlockContext from './use-block-context';\nimport { BlockListItems } from '../block-list';\nimport { BlockContextProvider } from '../block-context';\nimport { useBlockEditContext } from '../block-edit/context';\nimport useBlockSync from '../provider/use-block-sync';\nimport { store as blockEditorStore } from '../../store';\nimport useBlockDropZone from '../use-block-drop-zone';\nimport { unlock } from '../../lock-unlock';\n\nconst EMPTY_OBJECT = {};\n\nfunction BlockContext( { children, clientId } ) {\n\tconst context = useBlockContext( clientId );\n\treturn (\n\t\t<BlockContextProvider value={ context }>\n\t\t\t{ children }\n\t\t</BlockContextProvider>\n\t);\n}\n\nconst BlockListItemsMemo = memo( BlockListItems );\n\n/**\n * InnerBlocks is a component which allows a single block to have multiple blocks\n * as children. The UncontrolledInnerBlocks component is used whenever the inner\n * blocks are not controlled by another entity. In other words, it is normally\n * used for inner blocks in the post editor\n *\n * @param {Object} props The component props.\n */\nfunction UncontrolledInnerBlocks( props ) {\n\tconst {\n\t\tclientId,\n\t\tallowedBlocks,\n\t\tprioritizedInserterBlocks,\n\t\tdefaultBlock,\n\t\tdirectInsert,\n\t\t__experimentalDefaultBlock,\n\t\t__experimentalDirectInsert,\n\t\ttemplate,\n\t\ttemplateLock,\n\t\twrapperRef,\n\t\ttemplateInsertUpdatesSelection,\n\t\t__experimentalCaptureToolbars: captureToolbars,\n\t\t__experimentalAppenderTagName,\n\t\trenderAppender,\n\t\torientation,\n\t\tplaceholder,\n\t\tlayout,\n\t\tname,\n\t\tblockType,\n\t\tparentLock,\n\t\tdefaultLayout,\n\t} = props;\n\n\tuseNestedSettingsUpdate(\n\t\tclientId,\n\t\tparentLock,\n\t\tallowedBlocks,\n\t\tprioritizedInserterBlocks,\n\t\tdefaultBlock,\n\t\tdirectInsert,\n\t\t__experimentalDefaultBlock,\n\t\t__experimentalDirectInsert,\n\t\ttemplateLock,\n\t\tcaptureToolbars,\n\t\torientation,\n\t\tlayout\n\t);\n\n\tuseInnerBlockTemplateSync(\n\t\tclientId,\n\t\ttemplate,\n\t\ttemplateLock,\n\t\ttemplateInsertUpdatesSelection\n\t);\n\n\tconst defaultLayoutBlockSupport =\n\t\tgetBlockSupport( name, 'layout' ) ||\n\t\tgetBlockSupport( name, '__experimentalLayout' ) ||\n\t\tEMPTY_OBJECT;\n\n\tconst { allowSizingOnChildren = false } = defaultLayoutBlockSupport;\n\tconst usedLayout = layout || defaultLayoutBlockSupport;\n\n\tconst memoedLayout = useMemo(\n\t\t() => ( {\n\t\t\t// Default layout will know about any content/wide size defined by the theme.\n\t\t\t...defaultLayout,\n\t\t\t...usedLayout,\n\t\t\t...( allowSizingOnChildren && {\n\t\t\t\tallowSizingOnChildren: true,\n\t\t\t} ),\n\t\t} ),\n\t\t[ defaultLayout, usedLayout, allowSizingOnChildren ]\n\t);\n\n\t// For controlled inner blocks, we don't want a change in blocks to\n\t// re-render the blocks list.\n\tconst items = (\n\t\t<BlockListItemsMemo\n\t\t\trootClientId={ clientId }\n\t\t\trenderAppender={ renderAppender }\n\t\t\t__experimentalAppenderTagName={ __experimentalAppenderTagName }\n\t\t\tlayout={ memoedLayout }\n\t\t\twrapperRef={ wrapperRef }\n\t\t\tplaceholder={ placeholder }\n\t\t/>\n\t);\n\n\tif (\n\t\t! blockType?.providesContext ||\n\t\tObject.keys( blockType.providesContext ).length === 0\n\t) {\n\t\treturn items;\n\t}\n\n\treturn <BlockContext clientId={ clientId }>{ items }</BlockContext>;\n}\n\n/**\n * The controlled inner blocks component wraps the uncontrolled inner blocks\n * component with the blockSync hook. This keeps the innerBlocks of the block in\n * the block-editor store in sync with the blocks of the controlling entity. An\n * example of an inner block controller is a template part block, which provides\n * its own blocks from the template part entity data source.\n *\n * @param {Object} props The component props.\n */\nfunction ControlledInnerBlocks( props ) {\n\tuseBlockSync( props );\n\treturn <UncontrolledInnerBlocks { ...props } />;\n}\n\nconst ForwardedInnerBlocks = forwardRef( ( props, ref ) => {\n\tconst innerBlocksProps = useInnerBlocksProps( { ref }, props );\n\treturn (\n\t\t<div className=\"block-editor-inner-blocks\">\n\t\t\t<div { ...innerBlocksProps } />\n\t\t</div>\n\t);\n} );\n\n/**\n * This hook is used to lightly mark an element as an inner blocks wrapper\n * element. Call this hook and pass the returned props to the element to mark as\n * an inner blocks wrapper, automatically rendering inner blocks as children. If\n * you define a ref for the element, it is important to pass the ref to this\n * hook, which the hook in turn will pass to the component through the props it\n * returns. Optionally, you can also pass any other props through this hook, and\n * they will be merged and returned.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/inner-blocks/README.md\n *\n * @param {Object} props   Optional. Props to pass to the element. Must contain\n *                         the ref if one is defined.\n * @param {Object} options Optional. Inner blocks options.\n */\nexport function useInnerBlocksProps( props = {}, options = {} ) {\n\tconst {\n\t\t__unstableDisableLayoutClassNames,\n\t\t__unstableDisableDropZone,\n\t\tdropZoneElement,\n\t} = options;\n\tconst {\n\t\tclientId,\n\t\tlayout = null,\n\t\t__unstableLayoutClassNames: layoutClassNames = '',\n\t} = useBlockEditContext();\n\tconst selected = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockName,\n\t\t\t\tisZoomOut,\n\t\t\t\tgetTemplateLock,\n\t\t\t\tgetBlockRootClientId,\n\t\t\t\tgetBlockEditingMode,\n\t\t\t\tgetBlockSettings,\n\t\t\t\tgetSectionRootClientId,\n\t\t\t} = unlock( select( blockEditorStore ) );\n\n\t\t\tif ( ! clientId ) {\n\t\t\t\tconst sectionRootClientId = getSectionRootClientId();\n\t\t\t\t// Disable the root drop zone when zoomed out and the section root client id\n\t\t\t\t// is not the root block list (represented by an empty string).\n\t\t\t\t// This avoids drag handling bugs caused by having two block lists acting as\n\t\t\t\t// drop zones - the actual 'root' block list and the section root.\n\t\t\t\treturn {\n\t\t\t\t\tisDropZoneDisabled:\n\t\t\t\t\t\tisZoomOut() && sectionRootClientId !== '',\n\t\t\t\t};\n\t\t\t}\n\n\t\t\tconst { hasBlockSupport, getBlockType } = select( blocksStore );\n\t\t\tconst blockName = getBlockName( clientId );\n\t\t\tconst blockEditingMode = getBlockEditingMode( clientId );\n\t\t\tconst parentClientId = getBlockRootClientId( clientId );\n\t\t\tconst [ defaultLayout ] = getBlockSettings( clientId, 'layout' );\n\n\t\t\tlet _isDropZoneDisabled = blockEditingMode === 'disabled';\n\n\t\t\tif ( isZoomOut() ) {\n\t\t\t\t// In zoom out mode, we want to disable the drop zone for the sections.\n\t\t\t\t// The inner blocks belonging to the section drop zone is\n\t\t\t\t// already disabled by the blocks themselves being disabled.\n\t\t\t\tconst sectionRootClientId = getSectionRootClientId();\n\t\t\t\t_isDropZoneDisabled = clientId !== sectionRootClientId;\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\t__experimentalCaptureToolbars: hasBlockSupport(\n\t\t\t\t\tblockName,\n\t\t\t\t\t'__experimentalExposeControlsToChildren',\n\t\t\t\t\tfalse\n\t\t\t\t),\n\t\t\t\tname: blockName,\n\t\t\t\tblockType: getBlockType( blockName ),\n\t\t\t\tparentLock: getTemplateLock( parentClientId ),\n\t\t\t\tparentClientId,\n\t\t\t\tisDropZoneDisabled: _isDropZoneDisabled,\n\t\t\t\tdefaultLayout,\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\tconst {\n\t\t__experimentalCaptureToolbars,\n\t\tname,\n\t\tblockType,\n\t\tparentLock,\n\t\tparentClientId,\n\t\tisDropZoneDisabled,\n\t\tdefaultLayout,\n\t} = selected;\n\n\tconst blockDropZoneRef = useBlockDropZone( {\n\t\tdropZoneElement,\n\t\trootClientId: clientId,\n\t\tparentClientId,\n\t} );\n\n\tconst ref = useMergeRefs( [\n\t\tprops.ref,\n\t\t__unstableDisableDropZone ||\n\t\tisDropZoneDisabled ||\n\t\t( layout?.isManualPlacement &&\n\t\t\twindow.__experimentalEnableGridInteractivity )\n\t\t\t? null\n\t\t\t: blockDropZoneRef,\n\t] );\n\n\tconst innerBlocksProps = {\n\t\t__experimentalCaptureToolbars,\n\t\tlayout,\n\t\tname,\n\t\tblockType,\n\t\tparentLock,\n\t\tdefaultLayout,\n\t\t...options,\n\t};\n\tconst InnerBlocks =\n\t\tinnerBlocksProps.value && innerBlocksProps.onChange\n\t\t\t? ControlledInnerBlocks\n\t\t\t: UncontrolledInnerBlocks;\n\n\treturn {\n\t\t...props,\n\t\tref,\n\t\tclassName: clsx(\n\t\t\tprops.className,\n\t\t\t'block-editor-block-list__layout',\n\t\t\t__unstableDisableLayoutClassNames ? '' : layoutClassNames\n\t\t),\n\t\tchildren: clientId ? (\n\t\t\t<InnerBlocks { ...innerBlocksProps } clientId={ clientId } />\n\t\t) : (\n\t\t\t<BlockListItems { ...options } />\n\t\t),\n\t};\n}\n\nuseInnerBlocksProps.save = getInnerBlocksProps;\n\n// Expose default appender placeholders as components.\nForwardedInnerBlocks.DefaultBlockAppender = DefaultBlockAppender;\nForwardedInnerBlocks.ButtonBlockAppender = ButtonBlockAppender;\n\nForwardedInnerBlocks.Content = () => useInnerBlocksProps.save().children;\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/inner-blocks/README.md\n */\nexport default ForwardedInnerBlocks;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAiB;AACjB,qBAA6B;AAC7B,qBAA0C;AAC1C,kBAA0B;AAC1B,oBAIO;AACP,mCAAgC;AAChC,oCAAiC;AACjC,wCAAoC;AACpC,2CAAsC;AACtC,+BAA4B;AAC5B,wBAA+B;AAC/B,2BAAqC;AACrC,qBAAoC;AACpC,4BAAyB;AACzB,mBAA0C;AAC1C,iCAA6B;AAC7B,yBAAuB;AAOrB;AALF,IAAM,eAAe,CAAC;AAEtB,SAAS,aAAc,EAAE,UAAU,SAAS,GAAI;AAC/C,QAAM,cAAU,yBAAAA,SAAiB,QAAS;AAC1C,SACC,4CAAC,6CAAqB,OAAQ,SAC3B,UACH;AAEF;AAEA,IAAM,yBAAqB,qBAAM,gCAAe;AAUhD,SAAS,wBAAyB,OAAQ;AACzC,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,+BAA+B;AAAA,IAC/B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,IAAI;AAEJ,wCAAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD;AAEA,2CAAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD;AAEA,QAAM,gCACL,+BAAiB,MAAM,QAAS,SAChC,+BAAiB,MAAM,sBAAuB,KAC9C;AAED,QAAM,EAAE,wBAAwB,MAAM,IAAI;AAC1C,QAAM,aAAa,UAAU;AAE7B,QAAM,mBAAe;AAAA,IACpB,OAAQ;AAAA;AAAA,MAEP,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAK,yBAAyB;AAAA,QAC7B,uBAAuB;AAAA,MACxB;AAAA,IACD;AAAA,IACA,CAAE,eAAe,YAAY,qBAAsB;AAAA,EACpD;AAIA,QAAM,QACL;AAAA,IAAC;AAAA;AAAA,MACA,cAAe;AAAA,MACf;AAAA,MACA;AAAA,MACA,QAAS;AAAA,MACT;AAAA,MACA;AAAA;AAAA,EACD;AAGD,MACC,CAAE,WAAW,mBACb,OAAO,KAAM,UAAU,eAAgB,EAAE,WAAW,GACnD;AACD,WAAO;AAAA,EACR;AAEA,SAAO,4CAAC,gBAAa,UAAwB,iBAAO;AACrD;AAWA,SAAS,sBAAuB,OAAQ;AACvC,4BAAAC,SAAc,KAAM;AACpB,SAAO,4CAAC,2BAA0B,GAAG,OAAQ;AAC9C;AAEA,IAAM,2BAAuB,2BAAY,CAAE,OAAO,QAAS;AAC1D,QAAM,mBAAmB,oBAAqB,EAAE,IAAI,GAAG,KAAM;AAC7D,SACC,4CAAC,SAAI,WAAU,6BACd,sDAAC,SAAM,GAAG,kBAAmB,GAC9B;AAEF,CAAE;AAiBK,SAAS,oBAAqB,QAAQ,CAAC,GAAG,UAAU,CAAC,GAAI;AAC/D,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACD,IAAI;AACJ,QAAM;AAAA,IACL;AAAA,IACA,SAAS;AAAA,IACT,4BAA4B,mBAAmB;AAAA,EAChD,QAAI,oCAAoB;AACxB,QAAM,eAAW;AAAA,IAChB,CAAE,WAAY;AACb,YAAM;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACD,QAAI,2BAAQ,OAAQ,aAAAC,KAAiB,CAAE;AAEvC,UAAK,CAAE,UAAW;AACjB,cAAM,sBAAsB,uBAAuB;AAKnD,eAAO;AAAA,UACN,oBACC,UAAU,KAAK,wBAAwB;AAAA,QACzC;AAAA,MACD;AAEA,YAAM,EAAE,iBAAiB,aAAa,IAAI,OAAQ,cAAAC,KAAY;AAC9D,YAAM,YAAY,aAAc,QAAS;AACzC,YAAM,mBAAmB,oBAAqB,QAAS;AACvD,YAAMC,kBAAiB,qBAAsB,QAAS;AACtD,YAAM,CAAEC,cAAc,IAAI,iBAAkB,UAAU,QAAS;AAE/D,UAAI,sBAAsB,qBAAqB;AAE/C,UAAK,UAAU,GAAI;AAIlB,cAAM,sBAAsB,uBAAuB;AACnD,8BAAsB,aAAa;AAAA,MACpC;AAEA,aAAO;AAAA,QACN,+BAA+B;AAAA,UAC9B;AAAA,UACA;AAAA,UACA;AAAA,QACD;AAAA,QACA,MAAM;AAAA,QACN,WAAW,aAAc,SAAU;AAAA,QACnC,YAAY,gBAAiBD,eAAe;AAAA,QAC5C,gBAAAA;AAAA,QACA,oBAAoB;AAAA,QACpB,eAAAC;AAAA,MACD;AAAA,IACD;AAAA,IACA,CAAE,QAAS;AAAA,EACZ;AACA,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,IAAI;AAEJ,QAAM,uBAAmB,2BAAAC,SAAkB;AAAA,IAC1C;AAAA,IACA,cAAc;AAAA,IACd;AAAA,EACD,CAAE;AAEF,QAAM,UAAM,6BAAc;AAAA,IACzB,MAAM;AAAA,IACN,6BACA,sBACE,QAAQ,qBACT,OAAO,wCACL,OACA;AAAA,EACJ,CAAE;AAEF,QAAM,mBAAmB;AAAA,IACxB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACJ;AACA,QAAM,cACL,iBAAiB,SAAS,iBAAiB,WACxC,wBACA;AAEJ,SAAO;AAAA,IACN,GAAG;AAAA,IACH;AAAA,IACA,eAAW,YAAAC;AAAA,MACV,MAAM;AAAA,MACN;AAAA,MACA,oCAAoC,KAAK;AAAA,IAC1C;AAAA,IACA,UAAU,WACT,4CAAC,eAAc,GAAG,kBAAmB,UAAsB,IAE3D,4CAAC,oCAAiB,GAAG,SAAU;AAAA,EAEjC;AACD;AAEA,oBAAoB,OAAO,cAAAC;AAG3B,qBAAqB,uBAAuB,8BAAAC;AAC5C,qBAAqB,sBAAsB,6BAAAC;AAE3C,qBAAqB,UAAU,MAAM,oBAAoB,KAAK,EAAE;AAKhE,IAAO,uBAAQ;",
+  "sourcesContent": ["import clsx from 'clsx';\nimport { useMergeRefs } from '@wordpress/compose';\nimport { forwardRef, useMemo, memo } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport {\n\tgetBlockSupport,\n\tstore as blocksStore,\n\t__unstableGetInnerBlocksProps as getInnerBlocksProps,\n} from '@wordpress/blocks';\nimport ButtonBlockAppender from './button-block-appender';\nimport DefaultBlockAppender from './default-block-appender';\nimport useNestedSettingsUpdate from './use-nested-settings-update';\nimport useInnerBlockTemplateSync from './use-inner-block-template-sync';\nimport useBlockContext from './use-block-context';\nimport { BlockListItems } from '../block-list';\nimport { BlockContextProvider } from '../block-context';\nimport { useBlockEditContext } from '../block-edit/context';\nimport useBlockSync from '../provider/use-block-sync';\nimport { store as blockEditorStore } from '../../store';\nimport useBlockDropZone from '../use-block-drop-zone';\nimport { unlock } from '../../lock-unlock';\n\nconst EMPTY_OBJECT = {};\n\nfunction BlockContext( { children, clientId } ) {\n\tconst context = useBlockContext( clientId );\n\treturn (\n\t\t<BlockContextProvider value={ context }>\n\t\t\t{ children }\n\t\t</BlockContextProvider>\n\t);\n}\n\nconst BlockListItemsMemo = memo( BlockListItems );\n\n/**\n * InnerBlocks is a component which allows a single block to have multiple blocks\n * as children. The UncontrolledInnerBlocks component is used whenever the inner\n * blocks are not controlled by another entity. In other words, it is normally\n * used for inner blocks in the post editor\n *\n * @param {Object} props The component props.\n */\nfunction UncontrolledInnerBlocks( props ) {\n\tconst {\n\t\tclientId,\n\t\tallowedBlocks,\n\t\tprioritizedInserterBlocks,\n\t\tdefaultBlock,\n\t\tdirectInsert,\n\t\t__experimentalDefaultBlock,\n\t\t__experimentalDirectInsert,\n\t\ttemplate,\n\t\ttemplateLock,\n\t\twrapperRef,\n\t\ttemplateInsertUpdatesSelection,\n\t\t__experimentalCaptureToolbars: captureToolbars,\n\t\t__experimentalAppenderTagName,\n\t\trenderAppender,\n\t\torientation,\n\t\tplaceholder,\n\t\tlayout,\n\t\tname,\n\t\tblockType,\n\t\tparentLock,\n\t\tdefaultLayout,\n\t} = props;\n\n\tuseNestedSettingsUpdate(\n\t\tclientId,\n\t\tparentLock,\n\t\tallowedBlocks,\n\t\tprioritizedInserterBlocks,\n\t\tdefaultBlock,\n\t\tdirectInsert,\n\t\t__experimentalDefaultBlock,\n\t\t__experimentalDirectInsert,\n\t\ttemplateLock,\n\t\tcaptureToolbars,\n\t\torientation,\n\t\tlayout\n\t);\n\n\tuseInnerBlockTemplateSync(\n\t\tclientId,\n\t\ttemplate,\n\t\ttemplateLock,\n\t\ttemplateInsertUpdatesSelection\n\t);\n\n\tconst defaultLayoutBlockSupport =\n\t\tgetBlockSupport( name, 'layout' ) ||\n\t\tgetBlockSupport( name, '__experimentalLayout' ) ||\n\t\tEMPTY_OBJECT;\n\n\tconst { allowSizingOnChildren = false } = defaultLayoutBlockSupport;\n\t// The support is a config object, e.g. `{ allowSwitching: false, default: { type: 'flex' } }`,\n\t// so the layout itself lives under `default`. Passing the config through would leave the\n\t// context without a `type`, and consumers would resolve it to the flow layout.\n\tconst usedLayout =\n\t\tlayout || defaultLayoutBlockSupport.default || EMPTY_OBJECT;\n\n\tconst memoedLayout = useMemo(\n\t\t() => ( {\n\t\t\t// Default layout will know about any content/wide size defined by the theme.\n\t\t\t...defaultLayout,\n\t\t\t...usedLayout,\n\t\t\t...( allowSizingOnChildren && {\n\t\t\t\tallowSizingOnChildren: true,\n\t\t\t} ),\n\t\t} ),\n\t\t[ defaultLayout, usedLayout, allowSizingOnChildren ]\n\t);\n\n\t// For controlled inner blocks, we don't want a change in blocks to\n\t// re-render the blocks list.\n\tconst items = (\n\t\t<BlockListItemsMemo\n\t\t\trootClientId={ clientId }\n\t\t\trenderAppender={ renderAppender }\n\t\t\t__experimentalAppenderTagName={ __experimentalAppenderTagName }\n\t\t\tlayout={ memoedLayout }\n\t\t\twrapperRef={ wrapperRef }\n\t\t\tplaceholder={ placeholder }\n\t\t/>\n\t);\n\n\tif (\n\t\t! blockType?.providesContext ||\n\t\tObject.keys( blockType.providesContext ).length === 0\n\t) {\n\t\treturn items;\n\t}\n\n\treturn <BlockContext clientId={ clientId }>{ items }</BlockContext>;\n}\n\n/**\n * The controlled inner blocks component wraps the uncontrolled inner blocks\n * component with the blockSync hook. This keeps the innerBlocks of the block in\n * the block-editor store in sync with the blocks of the controlling entity. An\n * example of an inner block controller is a template part block, which provides\n * its own blocks from the template part entity data source.\n *\n * @param {Object} props The component props.\n */\nfunction ControlledInnerBlocks( props ) {\n\tuseBlockSync( props );\n\treturn <UncontrolledInnerBlocks { ...props } />;\n}\n\nconst ForwardedInnerBlocks = forwardRef( ( props, ref ) => {\n\tconst innerBlocksProps = useInnerBlocksProps( { ref }, props );\n\treturn (\n\t\t<div className=\"block-editor-inner-blocks\">\n\t\t\t<div { ...innerBlocksProps } />\n\t\t</div>\n\t);\n} );\n\n/**\n * This hook is used to lightly mark an element as an inner blocks wrapper\n * element. Call this hook and pass the returned props to the element to mark as\n * an inner blocks wrapper, automatically rendering inner blocks as children. If\n * you define a ref for the element, it is important to pass the ref to this\n * hook, which the hook in turn will pass to the component through the props it\n * returns. Optionally, you can also pass any other props through this hook, and\n * they will be merged and returned.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/inner-blocks/README.md\n *\n * @param {Object} props   Optional. Props to pass to the element. Must contain\n *                         the ref if one is defined.\n * @param {Object} options Optional. Inner blocks options.\n */\nexport function useInnerBlocksProps( props = {}, options = {} ) {\n\tconst {\n\t\t__unstableDisableLayoutClassNames,\n\t\t__unstableDisableDropZone,\n\t\tdropZoneElement,\n\t\tlayout: layoutOverride,\n\t} = options;\n\tconst {\n\t\tclientId,\n\t\tlayout: contextLayout = null,\n\t\t__unstableLayoutClassNames: layoutClassNames = '',\n\t} = useBlockEditContext();\n\t// An options layout takes precedence over the context layout, as it does\n\t// for the inner blocks settings, so containers whose layout attribute\n\t// doesn't apply to their inner blocks (e.g. Post Template) can opt out.\n\tconst layout = layoutOverride ?? contextLayout;\n\tconst selected = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockName,\n\t\t\t\tisZoomOut,\n\t\t\t\tgetTemplateLock,\n\t\t\t\tgetBlockRootClientId,\n\t\t\t\tgetBlockEditingMode,\n\t\t\t\tgetBlockSettings,\n\t\t\t\tgetSectionRootClientId,\n\t\t\t} = unlock( select( blockEditorStore ) );\n\n\t\t\tif ( ! clientId ) {\n\t\t\t\tconst sectionRootClientId = getSectionRootClientId();\n\t\t\t\t// Disable the root drop zone when zoomed out and the section root client id\n\t\t\t\t// is not the root block list (represented by an empty string).\n\t\t\t\t// This avoids drag handling bugs caused by having two block lists acting as\n\t\t\t\t// drop zones - the actual 'root' block list and the section root.\n\t\t\t\treturn {\n\t\t\t\t\tisDropZoneDisabled:\n\t\t\t\t\t\tisZoomOut() && sectionRootClientId !== '',\n\t\t\t\t};\n\t\t\t}\n\n\t\t\tconst { hasBlockSupport, getBlockType } = select( blocksStore );\n\t\t\tconst blockName = getBlockName( clientId );\n\t\t\tconst blockEditingMode = getBlockEditingMode( clientId );\n\t\t\tconst parentClientId = getBlockRootClientId( clientId );\n\t\t\tconst [ defaultLayout ] = getBlockSettings( clientId, 'layout' );\n\n\t\t\tlet _isDropZoneDisabled = blockEditingMode === 'disabled';\n\n\t\t\tif ( isZoomOut() ) {\n\t\t\t\t// In zoom out mode, we want to disable the drop zone for the sections.\n\t\t\t\t// The inner blocks belonging to the section drop zone is\n\t\t\t\t// already disabled by the blocks themselves being disabled.\n\t\t\t\tconst sectionRootClientId = getSectionRootClientId();\n\t\t\t\t_isDropZoneDisabled = clientId !== sectionRootClientId;\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\t__experimentalCaptureToolbars: hasBlockSupport(\n\t\t\t\t\tblockName,\n\t\t\t\t\t'__experimentalExposeControlsToChildren',\n\t\t\t\t\tfalse\n\t\t\t\t),\n\t\t\t\tname: blockName,\n\t\t\t\tblockType: getBlockType( blockName ),\n\t\t\t\tparentLock: getTemplateLock( parentClientId ),\n\t\t\t\tparentClientId,\n\t\t\t\tisDropZoneDisabled: _isDropZoneDisabled,\n\t\t\t\tdefaultLayout,\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\tconst {\n\t\t__experimentalCaptureToolbars,\n\t\tname,\n\t\tblockType,\n\t\tparentLock,\n\t\tparentClientId,\n\t\tisDropZoneDisabled,\n\t\tdefaultLayout,\n\t} = selected;\n\n\tconst blockDropZoneRef = useBlockDropZone( {\n\t\tdropZoneElement,\n\t\trootClientId: clientId,\n\t\tparentClientId,\n\t} );\n\n\tconst ref = useMergeRefs( [\n\t\tprops.ref,\n\t\t__unstableDisableDropZone ||\n\t\tisDropZoneDisabled ||\n\t\t( layout?.isManualPlacement &&\n\t\t\twindow.__experimentalEnableGridInteractivity )\n\t\t\t? null\n\t\t\t: blockDropZoneRef,\n\t] );\n\n\tconst innerBlocksProps = {\n\t\t__experimentalCaptureToolbars,\n\t\tlayout,\n\t\tname,\n\t\tblockType,\n\t\tparentLock,\n\t\tdefaultLayout,\n\t\t...options,\n\t};\n\tconst InnerBlocks =\n\t\tinnerBlocksProps.value && innerBlocksProps.onChange\n\t\t\t? ControlledInnerBlocks\n\t\t\t: UncontrolledInnerBlocks;\n\n\treturn {\n\t\t...props,\n\t\tref,\n\t\tclassName: clsx(\n\t\t\tprops.className,\n\t\t\t'block-editor-block-list__layout',\n\t\t\t__unstableDisableLayoutClassNames ? '' : layoutClassNames\n\t\t),\n\t\tchildren: clientId ? (\n\t\t\t<InnerBlocks { ...innerBlocksProps } clientId={ clientId } />\n\t\t) : (\n\t\t\t<BlockListItems { ...options } />\n\t\t),\n\t};\n}\n\nuseInnerBlocksProps.save = getInnerBlocksProps;\n\n// Expose default appender placeholders as components.\nForwardedInnerBlocks.DefaultBlockAppender = DefaultBlockAppender;\nForwardedInnerBlocks.ButtonBlockAppender = ButtonBlockAppender;\n\nForwardedInnerBlocks.Content = () => useInnerBlocksProps.save().children;\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/inner-blocks/README.md\n */\nexport default ForwardedInnerBlocks;\n"],
+  "mappings": "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",
   "names": ["useBlockContext", "useNestedSettingsUpdate", "useInnerBlockTemplateSync", "useBlockSync", "blockEditorStore", "blocksStore", "parentClientId", "defaultLayout", "useBlockDropZone", "clsx", "getInnerBlocksProps", "DefaultBlockAppender", "ButtonBlockAppender"]
 }

package/build/components/inserter/block-patterns-explorer/index.cjs CHANGED Viewed

@@ -34,6 +34,7 @@ __export(block_patterns_explorer_exports, {
 });
 module.exports = __toCommonJS(block_patterns_explorer_exports);
 var import_components = require("@wordpress/components");
+var import_ui = require("@wordpress/ui");
 var import_element = require("@wordpress/element");
 var import_i18n = require("@wordpress/i18n");
 var import_pattern_explorer_sidebar = __toESM(require("./pattern-explorer-sidebar.cjs"));
@@ -46,28 +47,44 @@ function PatternsExplorer({ initialCategory, rootClientId, onModalClose }) {
     initialCategory?.name
   );
   const patternCategories = (0, import_use_pattern_categories.usePatternCategories)(rootClientId);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "block-editor-block-patterns-explorer", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_pattern_explorer_sidebar.default,
-      {
-        selectedCategory,
-        patternCategories,
-        onClickCategory: setSelectedCategory,
-        searchValue,
-        setSearchValue
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_pattern_list.default,
-      {
-        searchValue,
-        selectedCategory,
-        patternCategories,
-        rootClientId,
-        onModalClose
-      }
-    )
-  ] });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    import_ui.Tabs.Root,
+    {
+      className: "block-editor-block-patterns-explorer",
+      orientation: "vertical",
+      value: selectedCategory,
+      onValueChange: setSelectedCategory,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_pattern_explorer_sidebar.default,
+          {
+            patternCategories,
+            searchValue,
+            setSearchValue
+          }
+        ),
+        patternCategories.map(({ name }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_ui.Tabs.Panel,
+          {
+            value: name,
+            tabIndex: -1,
+            className: "block-editor-block-patterns-explorer__panel",
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              import_pattern_list.default,
+              {
+                searchValue,
+                selectedCategory: name,
+                patternCategories,
+                rootClientId,
+                onModalClose
+              }
+            )
+          },
+          name
+        ))
+      ]
+    }
+  );
 }
 function PatternsExplorerModal({ onModalClose, ...restProps }) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(

package/build/components/inserter/block-patterns-explorer/index.cjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/inserter/block-patterns-explorer/index.js"],
-  "sourcesContent": ["import { Modal } from '@wordpress/components';\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport PatternExplorerSidebar from './pattern-explorer-sidebar';\nimport PatternList from './pattern-list';\nimport { usePatternCategories } from '../block-patterns-tab/use-pattern-categories';\n\nfunction PatternsExplorer( { initialCategory, rootClientId, onModalClose } ) {\n\tconst [ searchValue, setSearchValue ] = useState( '' );\n\tconst [ selectedCategory, setSelectedCategory ] = useState(\n\t\tinitialCategory?.name\n\t);\n\n\tconst patternCategories = usePatternCategories( rootClientId );\n\n\treturn (\n\t\t<div className=\"block-editor-block-patterns-explorer\">\n\t\t\t<PatternExplorerSidebar\n\t\t\t\tselectedCategory={ selectedCategory }\n\t\t\t\tpatternCategories={ patternCategories }\n\t\t\t\tonClickCategory={ setSelectedCategory }\n\t\t\t\tsearchValue={ searchValue }\n\t\t\t\tsetSearchValue={ setSearchValue }\n\t\t\t/>\n\t\t\t<PatternList\n\t\t\t\tsearchValue={ searchValue }\n\t\t\t\tselectedCategory={ selectedCategory }\n\t\t\t\tpatternCategories={ patternCategories }\n\t\t\t\trootClientId={ rootClientId }\n\t\t\t\tonModalClose={ onModalClose }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nfunction PatternsExplorerModal( { onModalClose, ...restProps } ) {\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ __( 'Patterns' ) }\n\t\t\tonRequestClose={ onModalClose }\n\t\t\tisFullScreen\n\t\t>\n\t\t\t<PatternsExplorer onModalClose={ onModalClose } { ...restProps } />\n\t\t</Modal>\n\t);\n}\n\nexport default PatternsExplorerModal;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAsB;AACtB,qBAAyB;AACzB,kBAAmB;AACnB,sCAAmC;AACnC,0BAAwB;AACxB,oCAAqC;AAWnC;AATF,SAAS,iBAAkB,EAAE,iBAAiB,cAAc,aAAa,GAAI;AAC5E,QAAM,CAAE,aAAa,cAAe,QAAI,yBAAU,EAAG;AACrD,QAAM,CAAE,kBAAkB,mBAAoB,QAAI;AAAA,IACjD,iBAAiB;AAAA,EAClB;AAEA,QAAM,wBAAoB,oDAAsB,YAAa;AAE7D,SACC,6CAAC,SAAI,WAAU,wCACd;AAAA;AAAA,MAAC,gCAAAA;AAAA,MAAA;AAAA,QACA;AAAA,QACA;AAAA,QACA,iBAAkB;AAAA,QAClB;AAAA,QACA;AAAA;AAAA,IACD;AAAA,IACA;AAAA,MAAC,oBAAAC;AAAA,MAAA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACD;AAAA,KACD;AAEF;AAEA,SAAS,sBAAuB,EAAE,cAAc,GAAG,UAAU,GAAI;AAChE,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAQ,gBAAI,UAAW;AAAA,MACvB,gBAAiB;AAAA,MACjB,cAAY;AAAA,MAEZ,sDAAC,oBAAiB,cAAgC,GAAG,WAAY;AAAA;AAAA,EAClE;AAEF;AAEA,IAAO,kCAAQ;",
+  "sourcesContent": ["import { Modal } from '@wordpress/components';\nimport { Tabs } from '@wordpress/ui';\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport PatternExplorerSidebar from './pattern-explorer-sidebar';\nimport PatternList from './pattern-list';\nimport { usePatternCategories } from '../block-patterns-tab/use-pattern-categories';\n\nfunction PatternsExplorer( { initialCategory, rootClientId, onModalClose } ) {\n\tconst [ searchValue, setSearchValue ] = useState( '' );\n\tconst [ selectedCategory, setSelectedCategory ] = useState(\n\t\tinitialCategory?.name\n\t);\n\n\tconst patternCategories = usePatternCategories( rootClientId );\n\n\treturn (\n\t\t<Tabs.Root\n\t\t\tclassName=\"block-editor-block-patterns-explorer\"\n\t\t\torientation=\"vertical\"\n\t\t\tvalue={ selectedCategory }\n\t\t\tonValueChange={ setSelectedCategory }\n\t\t>\n\t\t\t<PatternExplorerSidebar\n\t\t\t\tpatternCategories={ patternCategories }\n\t\t\t\tsearchValue={ searchValue }\n\t\t\t\tsetSearchValue={ setSearchValue }\n\t\t\t/>\n\t\t\t{ patternCategories.map( ( { name } ) => (\n\t\t\t\t<Tabs.Panel\n\t\t\t\t\tkey={ name }\n\t\t\t\t\tvalue={ name }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\tclassName=\"block-editor-block-patterns-explorer__panel\"\n\t\t\t\t>\n\t\t\t\t\t<PatternList\n\t\t\t\t\t\tsearchValue={ searchValue }\n\t\t\t\t\t\tselectedCategory={ name }\n\t\t\t\t\t\tpatternCategories={ patternCategories }\n\t\t\t\t\t\trootClientId={ rootClientId }\n\t\t\t\t\t\tonModalClose={ onModalClose }\n\t\t\t\t\t/>\n\t\t\t\t</Tabs.Panel>\n\t\t\t) ) }\n\t\t</Tabs.Root>\n\t);\n}\n\nfunction PatternsExplorerModal( { onModalClose, ...restProps } ) {\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ __( 'Patterns' ) }\n\t\t\tonRequestClose={ onModalClose }\n\t\t\tisFullScreen\n\t\t>\n\t\t\t<PatternsExplorer onModalClose={ onModalClose } { ...restProps } />\n\t\t</Modal>\n\t);\n}\n\nexport default PatternsExplorerModal;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAsB;AACtB,gBAAqB;AACrB,qBAAyB;AACzB,kBAAmB;AACnB,sCAAmC;AACnC,0BAAwB;AACxB,oCAAqC;AAWnC;AATF,SAAS,iBAAkB,EAAE,iBAAiB,cAAc,aAAa,GAAI;AAC5E,QAAM,CAAE,aAAa,cAAe,QAAI,yBAAU,EAAG;AACrD,QAAM,CAAE,kBAAkB,mBAAoB,QAAI;AAAA,IACjD,iBAAiB;AAAA,EAClB;AAEA,QAAM,wBAAoB,oDAAsB,YAAa;AAE7D,SACC;AAAA,IAAC,eAAK;AAAA,IAAL;AAAA,MACA,WAAU;AAAA,MACV,aAAY;AAAA,MACZ,OAAQ;AAAA,MACR,eAAgB;AAAA,MAEhB;AAAA;AAAA,UAAC,gCAAAA;AAAA,UAAA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACD;AAAA,QACE,kBAAkB,IAAK,CAAE,EAAE,KAAK,MACjC;AAAA,UAAC,eAAK;AAAA,UAAL;AAAA,YAEA,OAAQ;AAAA,YACR,UAAW;AAAA,YACX,WAAU;AAAA,YAEV;AAAA,cAAC,oBAAAC;AAAA,cAAA;AAAA,gBACA;AAAA,gBACA,kBAAmB;AAAA,gBACnB;AAAA,gBACA;AAAA,gBACA;AAAA;AAAA,YACD;AAAA;AAAA,UAXM;AAAA,QAYP,CACC;AAAA;AAAA;AAAA,EACH;AAEF;AAEA,SAAS,sBAAuB,EAAE,cAAc,GAAG,UAAU,GAAI;AAChE,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAQ,gBAAI,UAAW;AAAA,MACvB,gBAAiB;AAAA,MACjB,cAAY;AAAA,MAEZ,sDAAC,oBAAiB,cAAgC,GAAG,WAAY;AAAA;AAAA,EAClE;AAEF;AAEA,IAAO,kCAAQ;",
   "names": ["PatternExplorerSidebar", "PatternList"]
 }

package/build/components/inserter/block-patterns-explorer/pattern-explorer-sidebar.cjs CHANGED Viewed

@@ -24,68 +24,34 @@ __export(pattern_explorer_sidebar_exports, {
 });
 module.exports = __toCommonJS(pattern_explorer_sidebar_exports);
 var import_components = require("@wordpress/components");
+var import_ui = require("@wordpress/ui");
 var import_i18n = require("@wordpress/i18n");
 var import_jsx_runtime = require("react/jsx-runtime");
-function PatternCategoriesList({
-  selectedCategory,
-  patternCategories,
-  onClickCategory
-}) {
-  const baseClassName = "block-editor-block-patterns-explorer__sidebar";
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: `${baseClassName}__categories-list`, children: patternCategories.map(({ name, label }) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_components.Button,
-      {
-        __next40pxDefaultSize: true,
-        label,
-        className: `${baseClassName}__categories-list__item`,
-        isPressed: selectedCategory === name,
-        onClick: () => {
-          onClickCategory(name);
-        },
-        children: label
-      },
-      name
-    );
-  }) });
-}
-function PatternsExplorerSearch({ searchValue, setSearchValue }) {
-  const baseClassName = "block-editor-block-patterns-explorer__search";
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: baseClassName, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_components.SearchControl,
-    {
-      onChange: setSearchValue,
-      value: searchValue,
-      label: (0, import_i18n.__)("Search"),
-      placeholder: (0, import_i18n.__)("Search")
-    }
-  ) });
-}
 function PatternExplorerSidebar({
-  selectedCategory,
   patternCategories,
-  onClickCategory,
   searchValue,
   setSearchValue
 }) {
-  const baseClassName = "block-editor-block-patterns-explorer__sidebar";
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: baseClassName, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      PatternsExplorerSearch,
-      {
-        searchValue,
-        setSearchValue
-      }
-    ),
-    !searchValue && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      PatternCategoriesList,
-      {
-        selectedCategory,
-        patternCategories,
-        onClickCategory
-      }
-    )
-  ] });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    import_ui.Stack,
+    {
+      direction: "column",
+      gap: "lg",
+      className: "block-editor-block-patterns-explorer__sidebar",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_components.SearchControl,
+          {
+            onChange: setSearchValue,
+            value: searchValue,
+            label: (0, import_i18n.__)("Search"),
+            placeholder: (0, import_i18n.__)("Search")
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Tabs.List, { children: patternCategories.map(({ name, label }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Tabs.Tab, { value: name, children: label }, name)) })
+      ]
+    }
+  );
 }
 var pattern_explorer_sidebar_default = PatternExplorerSidebar;
 //# sourceMappingURL=pattern-explorer-sidebar.cjs.map

package/build/components/inserter/block-patterns-explorer/pattern-explorer-sidebar.cjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/inserter/block-patterns-explorer/pattern-explorer-sidebar.js"],
-  "sourcesContent": ["import { Button, SearchControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\nfunction PatternCategoriesList( {\n\tselectedCategory,\n\tpatternCategories,\n\tonClickCategory,\n} ) {\n\tconst baseClassName = 'block-editor-block-patterns-explorer__sidebar';\n\treturn (\n\t\t<div className={ `${ baseClassName }__categories-list` }>\n\t\t\t{ patternCategories.map( ( { name, label } ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<Button\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tkey={ name }\n\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\tclassName={ `${ baseClassName }__categories-list__item` }\n\t\t\t\t\t\tisPressed={ selectedCategory === name }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonClickCategory( name );\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</div>\n\t);\n}\n\nfunction PatternsExplorerSearch( { searchValue, setSearchValue } ) {\n\tconst baseClassName = 'block-editor-block-patterns-explorer__search';\n\treturn (\n\t\t<div className={ baseClassName }>\n\t\t\t<SearchControl\n\t\t\t\tonChange={ setSearchValue }\n\t\t\t\tvalue={ searchValue }\n\t\t\t\tlabel={ __( 'Search' ) }\n\t\t\t\tplaceholder={ __( 'Search' ) }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nfunction PatternExplorerSidebar( {\n\tselectedCategory,\n\tpatternCategories,\n\tonClickCategory,\n\tsearchValue,\n\tsetSearchValue,\n} ) {\n\tconst baseClassName = 'block-editor-block-patterns-explorer__sidebar';\n\treturn (\n\t\t<div className={ baseClassName }>\n\t\t\t<PatternsExplorerSearch\n\t\t\t\tsearchValue={ searchValue }\n\t\t\t\tsetSearchValue={ setSearchValue }\n\t\t\t/>\n\t\t\t{ ! searchValue && (\n\t\t\t\t<PatternCategoriesList\n\t\t\t\t\tselectedCategory={ selectedCategory }\n\t\t\t\t\tpatternCategories={ patternCategories }\n\t\t\t\t\tonClickCategory={ onClickCategory }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nexport default PatternExplorerSidebar;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAsC;AACtC,kBAAmB;AAYd;AAVL,SAAS,sBAAuB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,gBAAgB;AACtB,SACC,4CAAC,SAAI,WAAY,GAAI,aAAc,qBAChC,4BAAkB,IAAK,CAAE,EAAE,MAAM,MAAM,MAAO;AAC/C,WACC;AAAA,MAAC;AAAA;AAAA,QACA,uBAAqB;AAAA,QAErB;AAAA,QACA,WAAY,GAAI,aAAc;AAAA,QAC9B,WAAY,qBAAqB;AAAA,QACjC,SAAU,MAAM;AACf,0BAAiB,IAAK;AAAA,QACvB;AAAA,QAEE;AAAA;AAAA,MARI;AAAA,IASP;AAAA,EAEF,CAAE,GACH;AAEF;AAEA,SAAS,uBAAwB,EAAE,aAAa,eAAe,GAAI;AAClE,QAAM,gBAAgB;AACtB,SACC,4CAAC,SAAI,WAAY,eAChB;AAAA,IAAC;AAAA;AAAA,MACA,UAAW;AAAA,MACX,OAAQ;AAAA,MACR,WAAQ,gBAAI,QAAS;AAAA,MACrB,iBAAc,gBAAI,QAAS;AAAA;AAAA,EAC5B,GACD;AAEF;AAEA,SAAS,uBAAwB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,gBAAgB;AACtB,SACC,6CAAC,SAAI,WAAY,eAChB;AAAA;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACD;AAAA,IACE,CAAE,eACH;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACD;AAAA,KAEF;AAEF;AAEA,IAAO,mCAAQ;",
+  "sourcesContent": ["import { SearchControl } from '@wordpress/components';\nimport { Stack, Tabs } from '@wordpress/ui';\nimport { __ } from '@wordpress/i18n';\n\nfunction PatternExplorerSidebar( {\n\tpatternCategories,\n\tsearchValue,\n\tsetSearchValue,\n} ) {\n\treturn (\n\t\t<Stack\n\t\t\tdirection=\"column\"\n\t\t\tgap=\"lg\"\n\t\t\tclassName=\"block-editor-block-patterns-explorer__sidebar\"\n\t\t>\n\t\t\t<SearchControl\n\t\t\t\tonChange={ setSearchValue }\n\t\t\t\tvalue={ searchValue }\n\t\t\t\tlabel={ __( 'Search' ) }\n\t\t\t\tplaceholder={ __( 'Search' ) }\n\t\t\t/>\n\t\t\t<Tabs.List>\n\t\t\t\t{ patternCategories.map( ( { name, label } ) => (\n\t\t\t\t\t<Tabs.Tab key={ name } value={ name }>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t) ) }\n\t\t\t</Tabs.List>\n\t\t</Stack>\n\t);\n}\n\nexport default PatternExplorerSidebar;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAA8B;AAC9B,gBAA4B;AAC5B,kBAAmB;AAQjB;AANF,SAAS,uBAAwB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,KAAI;AAAA,MACJ,WAAU;AAAA,MAEV;AAAA;AAAA,UAAC;AAAA;AAAA,YACA,UAAW;AAAA,YACX,OAAQ;AAAA,YACR,WAAQ,gBAAI,QAAS;AAAA,YACrB,iBAAc,gBAAI,QAAS;AAAA;AAAA,QAC5B;AAAA,QACA,4CAAC,eAAK,MAAL,EACE,4BAAkB,IAAK,CAAE,EAAE,MAAM,MAAM,MACxC,4CAAC,eAAK,KAAL,EAAsB,OAAQ,MAC5B,mBADa,IAEhB,CACC,GACH;AAAA;AAAA;AAAA,EACD;AAEF;AAEA,IAAO,mCAAQ;",
   "names": []
 }

package/build/components/inserter/block-patterns-explorer/pattern-list.cjs CHANGED Viewed

@@ -36,39 +36,16 @@ module.exports = __toCommonJS(pattern_list_exports);
 var import_element = require("@wordpress/element");
 var import_i18n = require("@wordpress/i18n");
 var import_compose = require("@wordpress/compose");
-var import_components = require("@wordpress/components");
+var import_ui = require("@wordpress/ui");
 var import_a11y = require("@wordpress/a11y");
 var import_block_patterns_list = __toESM(require("../../block-patterns-list/index.cjs"));
 var import_use_insertion_point = __toESM(require("../hooks/use-insertion-point.cjs"));
 var import_use_patterns_state = __toESM(require("../hooks/use-patterns-state.cjs"));
-var import_inserter_listbox = __toESM(require("../../inserter-listbox/index.cjs"));
 var import_search_items = require("../search-items.cjs");
 var import_block_patterns_paging = __toESM(require("../../block-patterns-paging/index.cjs"));
 var import_use_patterns_paging = __toESM(require("../hooks/use-patterns-paging.cjs"));
 var import_utils = require("../block-patterns-tab/utils.cjs");
 var import_jsx_runtime = require("react/jsx-runtime");
-function PatternsListHeader({ filterValue, filteredBlockPatternsLength }) {
-  if (!filterValue) {
-    return null;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_components.__experimentalHeading,
-    {
-      level: 2,
-      lineHeight: "48px",
-      className: "block-editor-block-patterns-explorer__search-results-count",
-      children: (0, import_i18n.sprintf)(
-        /* translators: %d: number of patterns. */
-        (0, import_i18n._n)(
-          "%d pattern found",
-          "%d patterns found",
-          filteredBlockPatternsLength
-        ),
-        filteredBlockPatternsLength
-      )
-    }
-  );
-}
 function PatternList({
   searchValue,
   selectedCategory,
@@ -145,34 +122,32 @@ function PatternList({
     pagingProps.changePage(1);
   }
   const hasItems = !!filteredBlockPatterns?.length;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "div",
     {
       className: "block-editor-block-patterns-explorer__list",
       ref: container,
-      children: [
+      children: hasItems ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-          PatternsListHeader,
+          import_block_patterns_list.default,
           {
-            filterValue: searchValue,
-            filteredBlockPatternsLength: filteredBlockPatterns.length
+            blockPatterns: pagingProps.categoryPatterns,
+            onClickPattern: (pattern, blocks) => {
+              onClickPattern(pattern, blocks);
+              onModalClose();
+            },
+            isDraggable: false
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_inserter_listbox.default, { children: hasItems && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-            import_block_patterns_list.default,
-            {
-              blockPatterns: pagingProps.categoryPatterns,
-              onClickPattern: (pattern, blocks) => {
-                onClickPattern(pattern, blocks);
-                onModalClose();
-              },
-              isDraggable: false
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_block_patterns_paging.default, { ...pagingProps })
-        ] }) })
-      ]
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_block_patterns_paging.default, { ...pagingProps })
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_ui.Text,
+        {
+          render: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {}),
+          className: "block-editor-block-patterns-explorer__no-results",
+          children: (0, import_i18n.__)("No results found.")
+        }
+      )
     }
   );
 }

package/build/components/inserter/block-patterns-explorer/pattern-list.cjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/inserter/block-patterns-explorer/pattern-list.js"],
-  "sourcesContent": ["import { useMemo, useEffect, useRef, useState } from '@wordpress/element';\nimport { _n, sprintf } from '@wordpress/i18n';\nimport { useDebounce } from '@wordpress/compose';\nimport { __experimentalHeading as Heading } from '@wordpress/components';\nimport { speak } from '@wordpress/a11y';\nimport BlockPatternsList from '../../block-patterns-list';\nimport useInsertionPoint from '../hooks/use-insertion-point';\nimport usePatternsState from '../hooks/use-patterns-state';\nimport InserterListbox from '../../inserter-listbox';\nimport { searchItems } from '../search-items';\nimport BlockPatternsPaging from '../../block-patterns-paging';\nimport usePatternsPaging from '../hooks/use-patterns-paging';\nimport {\n\tINSERTER_PATTERN_TYPES,\n\tallPatternsCategory,\n\tmyPatternsCategory,\n\tstarterPatternsCategory,\n} from '../block-patterns-tab/utils';\n\nfunction PatternsListHeader( { filterValue, filteredBlockPatternsLength } ) {\n\tif ( ! filterValue ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Heading\n\t\t\tlevel={ 2 }\n\t\t\tlineHeight=\"48px\"\n\t\t\tclassName=\"block-editor-block-patterns-explorer__search-results-count\"\n\t\t>\n\t\t\t{ sprintf(\n\t\t\t\t/* translators: %d: number of patterns. */\n\t\t\t\t_n(\n\t\t\t\t\t'%d pattern found',\n\t\t\t\t\t'%d patterns found',\n\t\t\t\t\tfilteredBlockPatternsLength\n\t\t\t\t),\n\t\t\t\tfilteredBlockPatternsLength\n\t\t\t) }\n\t\t</Heading>\n\t);\n}\n\nfunction PatternList( {\n\tsearchValue,\n\tselectedCategory,\n\tpatternCategories,\n\trootClientId,\n\tonModalClose,\n} ) {\n\tconst container = useRef();\n\tconst debouncedSpeak = useDebounce( speak, 500 );\n\tconst [ destinationRootClientId, onInsertBlocks ] = useInsertionPoint( {\n\t\trootClientId,\n\t\tshouldFocusBlock: true,\n\t} );\n\tconst [ patterns, , onClickPattern ] = usePatternsState(\n\t\tonInsertBlocks,\n\t\tdestinationRootClientId,\n\t\tselectedCategory\n\t);\n\n\tconst registeredPatternCategories = useMemo(\n\t\t() =>\n\t\t\tpatternCategories.map(\n\t\t\t\t( patternCategory ) => patternCategory.name\n\t\t\t),\n\t\t[ patternCategories ]\n\t);\n\n\tconst filteredBlockPatterns = useMemo( () => {\n\t\tconst filteredPatterns = patterns.filter( ( pattern ) => {\n\t\t\tif ( selectedCategory === allPatternsCategory.name ) {\n\t\t\t\treturn true;\n\t\t\t}\n\t\t\tif (\n\t\t\t\tselectedCategory === myPatternsCategory.name &&\n\t\t\t\tpattern.type === INSERTER_PATTERN_TYPES.user\n\t\t\t) {\n\t\t\t\treturn true;\n\t\t\t}\n\t\t\tif (\n\t\t\t\tselectedCategory === starterPatternsCategory.name &&\n\t\t\t\tpattern.blockTypes?.includes( 'core/post-content' )\n\t\t\t) {\n\t\t\t\treturn true;\n\t\t\t}\n\t\t\tif ( selectedCategory === 'uncategorized' ) {\n\t\t\t\tconst hasKnownCategory =\n\t\t\t\t\tpattern.categories?.some( ( category ) =>\n\t\t\t\t\t\tregisteredPatternCategories.includes( category )\n\t\t\t\t\t) ?? false;\n\n\t\t\t\treturn ! pattern.categories?.length || ! hasKnownCategory;\n\t\t\t}\n\n\t\t\treturn pattern.categories?.includes( selectedCategory );\n\t\t} );\n\n\t\tif ( ! searchValue ) {\n\t\t\treturn filteredPatterns;\n\t\t}\n\n\t\treturn searchItems( filteredPatterns, searchValue );\n\t}, [\n\t\tsearchValue,\n\t\tpatterns,\n\t\tselectedCategory,\n\t\tregisteredPatternCategories,\n\t] );\n\n\t// Announce search results on change.\n\tuseEffect( () => {\n\t\tif ( ! searchValue ) {\n\t\t\treturn;\n\t\t}\n\t\tconst count = filteredBlockPatterns.length;\n\t\tconst resultsFoundMessage = sprintf(\n\t\t\t/* translators: %d: number of results. */\n\t\t\t_n( '%d result found.', '%d results found.', count ),\n\t\t\tcount\n\t\t);\n\t\tdebouncedSpeak( resultsFoundMessage );\n\t}, [ searchValue, debouncedSpeak, filteredBlockPatterns.length ] );\n\n\tconst pagingProps = usePatternsPaging(\n\t\tfilteredBlockPatterns,\n\t\tselectedCategory,\n\t\tcontainer\n\t);\n\n\t// Reset page when search value changes.\n\tconst [ previousSearchValue, setPreviousSearchValue ] =\n\t\tuseState( searchValue );\n\tif ( searchValue !== previousSearchValue ) {\n\t\tsetPreviousSearchValue( searchValue );\n\t\tpagingProps.changePage( 1 );\n\t}\n\n\tconst hasItems = !! filteredBlockPatterns?.length;\n\treturn (\n\t\t<div\n\t\t\tclassName=\"block-editor-block-patterns-explorer__list\"\n\t\t\tref={ container }\n\t\t>\n\t\t\t<PatternsListHeader\n\t\t\t\tfilterValue={ searchValue }\n\t\t\t\tfilteredBlockPatternsLength={ filteredBlockPatterns.length }\n\t\t\t/>\n\n\t\t\t<InserterListbox>\n\t\t\t\t{ hasItems && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<BlockPatternsList\n\t\t\t\t\t\t\tblockPatterns={ pagingProps.categoryPatterns }\n\t\t\t\t\t\t\tonClickPattern={ ( pattern, blocks ) => {\n\t\t\t\t\t\t\t\tonClickPattern( pattern, blocks );\n\t\t\t\t\t\t\t\tonModalClose();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tisDraggable={ false }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<BlockPatternsPaging { ...pagingProps } />\n\t\t\t\t\t</>\n\t\t\t\t) }\n\t\t\t</InserterListbox>\n\t\t</div>\n\t);\n}\n\nexport default PatternList;\n"],
-  "mappings": "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",
-  "names": ["Heading", "useInsertionPoint", "usePatternsState", "usePatternsPaging", "InserterListbox", "BlockPatternsList", "BlockPatternsPaging"]
+  "sourcesContent": ["import { useMemo, useEffect, useRef, useState } from '@wordpress/element';\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport { useDebounce } from '@wordpress/compose';\nimport { Text } from '@wordpress/ui';\nimport { speak } from '@wordpress/a11y';\nimport BlockPatternsList from '../../block-patterns-list';\nimport useInsertionPoint from '../hooks/use-insertion-point';\nimport usePatternsState from '../hooks/use-patterns-state';\nimport { searchItems } from '../search-items';\nimport BlockPatternsPaging from '../../block-patterns-paging';\nimport usePatternsPaging from '../hooks/use-patterns-paging';\nimport {\n\tINSERTER_PATTERN_TYPES,\n\tallPatternsCategory,\n\tmyPatternsCategory,\n\tstarterPatternsCategory,\n} from '../block-patterns-tab/utils';\n\nfunction PatternList( {\n\tsearchValue,\n\tselectedCategory,\n\tpatternCategories,\n\trootClientId,\n\tonModalClose,\n} ) {\n\tconst container = useRef();\n\tconst debouncedSpeak = useDebounce( speak, 500 );\n\tconst [ destinationRootClientId, onInsertBlocks ] = useInsertionPoint( {\n\t\trootClientId,\n\t\tshouldFocusBlock: true,\n\t} );\n\tconst [ patterns, , onClickPattern ] = usePatternsState(\n\t\tonInsertBlocks,\n\t\tdestinationRootClientId,\n\t\tselectedCategory\n\t);\n\n\tconst registeredPatternCategories = useMemo(\n\t\t() =>\n\t\t\tpatternCategories.map(\n\t\t\t\t( patternCategory ) => patternCategory.name\n\t\t\t),\n\t\t[ patternCategories ]\n\t);\n\n\tconst filteredBlockPatterns = useMemo( () => {\n\t\tconst filteredPatterns = patterns.filter( ( pattern ) => {\n\t\t\tif ( selectedCategory === allPatternsCategory.name ) {\n\t\t\t\treturn true;\n\t\t\t}\n\t\t\tif (\n\t\t\t\tselectedCategory === myPatternsCategory.name &&\n\t\t\t\tpattern.type === INSERTER_PATTERN_TYPES.user\n\t\t\t) {\n\t\t\t\treturn true;\n\t\t\t}\n\t\t\tif (\n\t\t\t\tselectedCategory === starterPatternsCategory.name &&\n\t\t\t\tpattern.blockTypes?.includes( 'core/post-content' )\n\t\t\t) {\n\t\t\t\treturn true;\n\t\t\t}\n\t\t\tif ( selectedCategory === 'uncategorized' ) {\n\t\t\t\tconst hasKnownCategory =\n\t\t\t\t\tpattern.categories?.some( ( category ) =>\n\t\t\t\t\t\tregisteredPatternCategories.includes( category )\n\t\t\t\t\t) ?? false;\n\n\t\t\t\treturn ! pattern.categories?.length || ! hasKnownCategory;\n\t\t\t}\n\n\t\t\treturn pattern.categories?.includes( selectedCategory );\n\t\t} );\n\n\t\tif ( ! searchValue ) {\n\t\t\treturn filteredPatterns;\n\t\t}\n\n\t\treturn searchItems( filteredPatterns, searchValue );\n\t}, [\n\t\tsearchValue,\n\t\tpatterns,\n\t\tselectedCategory,\n\t\tregisteredPatternCategories,\n\t] );\n\n\t// Announce search results on change.\n\tuseEffect( () => {\n\t\tif ( ! searchValue ) {\n\t\t\treturn;\n\t\t}\n\t\tconst count = filteredBlockPatterns.length;\n\t\tconst resultsFoundMessage = sprintf(\n\t\t\t/* translators: %d: number of results. */\n\t\t\t_n( '%d result found.', '%d results found.', count ),\n\t\t\tcount\n\t\t);\n\t\tdebouncedSpeak( resultsFoundMessage );\n\t}, [ searchValue, debouncedSpeak, filteredBlockPatterns.length ] );\n\n\tconst pagingProps = usePatternsPaging(\n\t\tfilteredBlockPatterns,\n\t\tselectedCategory,\n\t\tcontainer\n\t);\n\n\t// Reset page when search value changes.\n\tconst [ previousSearchValue, setPreviousSearchValue ] =\n\t\tuseState( searchValue );\n\tif ( searchValue !== previousSearchValue ) {\n\t\tsetPreviousSearchValue( searchValue );\n\t\tpagingProps.changePage( 1 );\n\t}\n\n\tconst hasItems = !! filteredBlockPatterns?.length;\n\treturn (\n\t\t<div\n\t\t\tclassName=\"block-editor-block-patterns-explorer__list\"\n\t\t\tref={ container }\n\t\t>\n\t\t\t{ hasItems ? (\n\t\t\t\t<>\n\t\t\t\t\t<BlockPatternsList\n\t\t\t\t\t\tblockPatterns={ pagingProps.categoryPatterns }\n\t\t\t\t\t\tonClickPattern={ ( pattern, blocks ) => {\n\t\t\t\t\t\t\tonClickPattern( pattern, blocks );\n\t\t\t\t\t\t\tonModalClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tisDraggable={ false }\n\t\t\t\t\t/>\n\t\t\t\t\t<BlockPatternsPaging { ...pagingProps } />\n\t\t\t\t</>\n\t\t\t) : (\n\t\t\t\t<Text\n\t\t\t\t\trender={ <p /> }\n\t\t\t\t\tclassName=\"block-editor-block-patterns-explorer__no-results\"\n\t\t\t\t>\n\t\t\t\t\t{ __( 'No results found.' ) }\n\t\t\t\t</Text>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nexport default PatternList;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAAqD;AACrD,kBAAgC;AAChC,qBAA4B;AAC5B,gBAAqB;AACrB,kBAAsB;AACtB,iCAA8B;AAC9B,iCAA8B;AAC9B,gCAA6B;AAC7B,0BAA4B;AAC5B,mCAAgC;AAChC,iCAA8B;AAC9B,mBAKO;AAyGH;AAvGJ,SAAS,YAAa;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,gBAAY,uBAAO;AACzB,QAAM,qBAAiB,4BAAa,mBAAO,GAAI;AAC/C,QAAM,CAAE,yBAAyB,cAAe,QAAI,2BAAAA,SAAmB;AAAA,IACtE;AAAA,IACA,kBAAkB;AAAA,EACnB,CAAE;AACF,QAAM,CAAE,UAAU,EAAE,cAAe,QAAI,0BAAAC;AAAA,IACtC;AAAA,IACA;AAAA,IACA;AAAA,EACD;AAEA,QAAM,kCAA8B;AAAA,IACnC,MACC,kBAAkB;AAAA,MACjB,CAAE,oBAAqB,gBAAgB;AAAA,IACxC;AAAA,IACD,CAAE,iBAAkB;AAAA,EACrB;AAEA,QAAM,4BAAwB,wBAAS,MAAM;AAC5C,UAAM,mBAAmB,SAAS,OAAQ,CAAE,YAAa;AACxD,UAAK,qBAAqB,iCAAoB,MAAO;AACpD,eAAO;AAAA,MACR;AACA,UACC,qBAAqB,gCAAmB,QACxC,QAAQ,SAAS,oCAAuB,MACvC;AACD,eAAO;AAAA,MACR;AACA,UACC,qBAAqB,qCAAwB,QAC7C,QAAQ,YAAY,SAAU,mBAAoB,GACjD;AACD,eAAO;AAAA,MACR;AACA,UAAK,qBAAqB,iBAAkB;AAC3C,cAAM,mBACL,QAAQ,YAAY;AAAA,UAAM,CAAE,aAC3B,4BAA4B,SAAU,QAAS;AAAA,QAChD,KAAK;AAEN,eAAO,CAAE,QAAQ,YAAY,UAAU,CAAE;AAAA,MAC1C;AAEA,aAAO,QAAQ,YAAY,SAAU,gBAAiB;AAAA,IACvD,CAAE;AAEF,QAAK,CAAE,aAAc;AACpB,aAAO;AAAA,IACR;AAEA,eAAO,iCAAa,kBAAkB,WAAY;AAAA,EACnD,GAAG;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAE;AAGF,gCAAW,MAAM;AAChB,QAAK,CAAE,aAAc;AACpB;AAAA,IACD;AACA,UAAM,QAAQ,sBAAsB;AACpC,UAAM,0BAAsB;AAAA;AAAA,UAE3B,gBAAI,oBAAoB,qBAAqB,KAAM;AAAA,MACnD;AAAA,IACD;AACA,mBAAgB,mBAAoB;AAAA,EACrC,GAAG,CAAE,aAAa,gBAAgB,sBAAsB,MAAO,CAAE;AAEjE,QAAM,kBAAc,2BAAAC;AAAA,IACnB;AAAA,IACA;AAAA,IACA;AAAA,EACD;AAGA,QAAM,CAAE,qBAAqB,sBAAuB,QACnD,yBAAU,WAAY;AACvB,MAAK,gBAAgB,qBAAsB;AAC1C,2BAAwB,WAAY;AACpC,gBAAY,WAAY,CAAE;AAAA,EAC3B;AAEA,QAAM,WAAW,CAAC,CAAE,uBAAuB;AAC3C,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,KAAM;AAAA,MAEJ,qBACD,4EACC;AAAA;AAAA,UAAC,2BAAAC;AAAA,UAAA;AAAA,YACA,eAAgB,YAAY;AAAA,YAC5B,gBAAiB,CAAE,SAAS,WAAY;AACvC,6BAAgB,SAAS,MAAO;AAChC,2BAAa;AAAA,YACd;AAAA,YACA,aAAc;AAAA;AAAA,QACf;AAAA,QACA,4CAAC,6BAAAC,SAAA,EAAsB,GAAG,aAAc;AAAA,SACzC,IAEA;AAAA,QAAC;AAAA;AAAA,UACA,QAAS,4CAAC,OAAE;AAAA,UACZ,WAAU;AAAA,UAER,8BAAI,mBAAoB;AAAA;AAAA,MAC3B;AAAA;AAAA,EAEF;AAEF;AAEA,IAAO,uBAAQ;",
+  "names": ["useInsertionPoint", "usePatternsState", "usePatternsPaging", "BlockPatternsList", "BlockPatternsPaging"]
 }

package/build/components/inserter/hooks/use-insertion-point.cjs CHANGED Viewed

@@ -63,7 +63,7 @@ function useInsertionPoint({
   const {
     getSelectedBlock,
     getClosestAllowedInsertionPoint,
-    isBlockInsertionPointVisible
+    getBlockInsertionPoint
   } = (0, import_lock_unlock.unlock)((0, import_data.useSelect)(import_store.store));
   const { destinationRootClientId, destinationIndex } = (0, import_data.useSelect)(
     (select) => {
@@ -165,7 +165,7 @@ function useInsertionPoint({
   );
   const onToggleInsertionPoint = (0, import_element.useCallback)(
     (item) => {
-      if (item && !isBlockInsertionPointVisible()) {
+      if (item) {
         const allowedDestinationRootClientId = getClosestAllowedInsertionPoint(
           item.name,
           destinationRootClientId
@@ -181,13 +181,13 @@ function useInsertionPoint({
             })
           );
         }
-      } else {
+      } else if (!getBlockInsertionPoint()?.__unstableWithInserter) {
         hideInsertionPoint();
       }
     },
     [
       getClosestAllowedInsertionPoint,
-      isBlockInsertionPointVisible,
+      getBlockInsertionPoint,
       showInsertionPoint,
       hideInsertionPoint,
       destinationRootClientId,

package/build/components/inserter/hooks/use-insertion-point.cjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/inserter/hooks/use-insertion-point.js"],
-  "sourcesContent": ["import { useDispatch, useRegistry, useSelect } from '@wordpress/data';\nimport { isUnmodifiedDefaultBlock } from '@wordpress/blocks';\nimport { _n, sprintf } from '@wordpress/i18n';\nimport { speak } from '@wordpress/a11y';\nimport { useCallback } from '@wordpress/element';\nimport { store as blockEditorStore } from '../../../store';\nimport { unlock } from '../../../lock-unlock';\n\nfunction getIndex( {\n\tdestinationRootClientId,\n\tdestinationIndex,\n\trootClientId,\n\tregistry,\n} ) {\n\tif ( rootClientId === destinationRootClientId ) {\n\t\treturn destinationIndex;\n\t}\n\tconst parents = [\n\t\t'',\n\t\t...registry\n\t\t\t.select( blockEditorStore )\n\t\t\t.getBlockParents( destinationRootClientId ),\n\t\tdestinationRootClientId,\n\t];\n\tconst parentIndex = parents.indexOf( rootClientId );\n\tif ( parentIndex !== -1 ) {\n\t\treturn (\n\t\t\tregistry\n\t\t\t\t.select( blockEditorStore )\n\t\t\t\t.getBlockIndex( parents[ parentIndex + 1 ] ) + 1\n\t\t);\n\t}\n\treturn registry.select( blockEditorStore ).getBlockOrder( rootClientId )\n\t\t.length;\n}\n\n/**\n * @typedef WPInserterConfig\n *\n * @property {string=}   rootClientId   If set, insertion will be into the\n *                                      block with this ID.\n * @property {number=}   insertionIndex If set, insertion will be into this\n *                                      explicit position.\n * @property {string=}   clientId       If set, insertion will be after the\n *                                      block with this ID.\n * @property {boolean=}  isAppender     Whether the inserter is an appender\n *                                      or not.\n * @property {Function=} onSelect       Called after insertion.\n */\n\n/**\n * Returns the insertion point state given the inserter config.\n *\n * @param {WPInserterConfig} config Inserter Config.\n * @return {Array} Insertion Point State (rootClientID, onInsertBlocks and onToggle).\n */\nfunction useInsertionPoint( {\n\trootClientId = '',\n\tinsertionIndex,\n\tclientId,\n\tisAppender,\n\tonSelect,\n\tshouldFocusBlock = true,\n\tselectBlockOnInsert = true,\n} ) {\n\tconst registry = useRegistry();\n\tconst {\n\t\tgetSelectedBlock,\n\t\tgetClosestAllowedInsertionPoint,\n\t\tisBlockInsertionPointVisible,\n\t} = unlock( useSelect( blockEditorStore ) );\n\tconst { destinationRootClientId, destinationIndex } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetSelectedBlockClientId,\n\t\t\t\tgetBlockRootClientId,\n\t\t\t\tgetBlockIndex,\n\t\t\t\tgetBlockOrder,\n\t\t\t\tgetInsertionPoint,\n\t\t\t} = unlock( select( blockEditorStore ) );\n\t\t\tconst selectedBlockClientId = getSelectedBlockClientId();\n\t\t\tlet _destinationRootClientId = rootClientId;\n\t\t\tlet _destinationIndex;\n\t\t\tconst insertionPoint = getInsertionPoint();\n\n\t\t\tif ( insertionIndex !== undefined ) {\n\t\t\t\t// Insert into a specific index.\n\t\t\t\t_destinationIndex = insertionIndex;\n\t\t\t} else if (\n\t\t\t\tinsertionPoint &&\n\t\t\t\tinsertionPoint.hasOwnProperty( 'index' )\n\t\t\t) {\n\t\t\t\t_destinationRootClientId = insertionPoint?.rootClientId\n\t\t\t\t\t? insertionPoint.rootClientId\n\t\t\t\t\t: rootClientId;\n\t\t\t\t_destinationIndex = insertionPoint.index;\n\t\t\t} else if ( clientId ) {\n\t\t\t\t// Insert after a specific client ID.\n\t\t\t\t_destinationIndex = getBlockIndex( clientId );\n\t\t\t} else if ( ! isAppender && selectedBlockClientId ) {\n\t\t\t\t_destinationRootClientId = getBlockRootClientId(\n\t\t\t\t\tselectedBlockClientId\n\t\t\t\t);\n\t\t\t\t_destinationIndex = getBlockIndex( selectedBlockClientId ) + 1;\n\t\t\t} else {\n\t\t\t\t// Insert at the end of the list.\n\t\t\t\t_destinationIndex = getBlockOrder(\n\t\t\t\t\t_destinationRootClientId\n\t\t\t\t).length;\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\tdestinationRootClientId: _destinationRootClientId,\n\t\t\t\tdestinationIndex: _destinationIndex,\n\t\t\t};\n\t\t},\n\t\t[ rootClientId, insertionIndex, clientId, isAppender ]\n\t);\n\n\tconst {\n\t\treplaceBlocks,\n\t\tinsertBlocks,\n\t\tshowInsertionPoint,\n\t\thideInsertionPoint,\n\t\tsetLastFocus,\n\t} = unlock( useDispatch( blockEditorStore ) );\n\n\tconst onInsertBlocks = useCallback(\n\t\t( blocks, meta, shouldForceFocusBlock = false, _rootClientId ) => {\n\t\t\t// When we are trying to move focus or select a new block on insert, we also\n\t\t\t// need to clear the last focus to avoid the focus being set to the wrong block\n\t\t\t// when tabbing back into the canvas if the block was added from outside the\n\t\t\t// editor canvas.\n\t\t\tif (\n\t\t\t\tshouldForceFocusBlock ||\n\t\t\t\tshouldFocusBlock ||\n\t\t\t\tselectBlockOnInsert\n\t\t\t) {\n\t\t\t\tsetLastFocus( null );\n\t\t\t}\n\n\t\t\tconst selectedBlock = getSelectedBlock();\n\n\t\t\tif (\n\t\t\t\t! isAppender &&\n\t\t\t\tselectedBlock &&\n\t\t\t\tisUnmodifiedDefaultBlock( selectedBlock, 'content' )\n\t\t\t) {\n\t\t\t\treplaceBlocks(\n\t\t\t\t\tselectedBlock.clientId,\n\t\t\t\t\tblocks,\n\t\t\t\t\tnull,\n\t\t\t\t\tshouldFocusBlock || shouldForceFocusBlock ? 0 : null,\n\t\t\t\t\tmeta\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tinsertBlocks(\n\t\t\t\t\tblocks,\n\t\t\t\t\tisAppender || _rootClientId === undefined\n\t\t\t\t\t\t? destinationIndex\n\t\t\t\t\t\t: getIndex( {\n\t\t\t\t\t\t\t\tdestinationRootClientId,\n\t\t\t\t\t\t\t\tdestinationIndex,\n\t\t\t\t\t\t\t\trootClientId: _rootClientId,\n\t\t\t\t\t\t\t\tregistry,\n\t\t\t\t\t\t  } ),\n\t\t\t\t\tisAppender || _rootClientId === undefined\n\t\t\t\t\t\t? destinationRootClientId\n\t\t\t\t\t\t: _rootClientId,\n\t\t\t\t\tselectBlockOnInsert,\n\t\t\t\t\tshouldFocusBlock || shouldForceFocusBlock ? 0 : null,\n\t\t\t\t\tmeta\n\t\t\t\t);\n\t\t\t}\n\t\t\tconst blockLength = Array.isArray( blocks ) ? blocks.length : 1;\n\t\t\tconst message = sprintf(\n\t\t\t\t// translators: %d: the name of the block that has been added\n\t\t\t\t_n( '%d block added.', '%d blocks added.', blockLength ),\n\t\t\t\tblockLength\n\t\t\t);\n\t\t\tspeak( message );\n\n\t\t\tif ( onSelect ) {\n\t\t\t\tonSelect( blocks );\n\t\t\t}\n\t\t},\n\t\t[\n\t\t\tisAppender,\n\t\t\tgetSelectedBlock,\n\t\t\treplaceBlocks,\n\t\t\tinsertBlocks,\n\t\t\tdestinationRootClientId,\n\t\t\tdestinationIndex,\n\t\t\tonSelect,\n\t\t\tshouldFocusBlock,\n\t\t\tselectBlockOnInsert,\n\t\t\tsetLastFocus,\n\t\t\tregistry,\n\t\t]\n\t);\n\n\tconst onToggleInsertionPoint = useCallback(\n\t\t( item ) => {\n\t\t\tif ( item && ! isBlockInsertionPointVisible() ) {\n\t\t\t\tconst allowedDestinationRootClientId =\n\t\t\t\t\tgetClosestAllowedInsertionPoint(\n\t\t\t\t\t\titem.name,\n\t\t\t\t\t\tdestinationRootClientId\n\t\t\t\t\t);\n\t\t\t\tif ( allowedDestinationRootClientId !== null ) {\n\t\t\t\t\tshowInsertionPoint(\n\t\t\t\t\t\tallowedDestinationRootClientId,\n\t\t\t\t\t\tgetIndex( {\n\t\t\t\t\t\t\tdestinationRootClientId,\n\t\t\t\t\t\t\tdestinationIndex,\n\t\t\t\t\t\t\trootClientId: allowedDestinationRootClientId,\n\t\t\t\t\t\t\tregistry,\n\t\t\t\t\t\t} )\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\thideInsertionPoint();\n\t\t\t}\n\t\t},\n\t\t[\n\t\t\tgetClosestAllowedInsertionPoint,\n\t\t\tisBlockInsertionPointVisible,\n\t\t\tshowInsertionPoint,\n\t\t\thideInsertionPoint,\n\t\t\tdestinationRootClientId,\n\t\t\tdestinationIndex,\n\t\t\tregistry,\n\t\t]\n\t);\n\n\treturn [ destinationRootClientId, onInsertBlocks, onToggleInsertionPoint ];\n}\n\nexport default useInsertionPoint;\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { useDispatch, useRegistry, useSelect } from '@wordpress/data';\nimport { isUnmodifiedDefaultBlock } from '@wordpress/blocks';\nimport { _n, sprintf } from '@wordpress/i18n';\nimport { speak } from '@wordpress/a11y';\nimport { useCallback } from '@wordpress/element';\nimport { store as blockEditorStore } from '../../../store';\nimport { unlock } from '../../../lock-unlock';\n\nfunction getIndex( {\n\tdestinationRootClientId,\n\tdestinationIndex,\n\trootClientId,\n\tregistry,\n} ) {\n\tif ( rootClientId === destinationRootClientId ) {\n\t\treturn destinationIndex;\n\t}\n\tconst parents = [\n\t\t'',\n\t\t...registry\n\t\t\t.select( blockEditorStore )\n\t\t\t.getBlockParents( destinationRootClientId ),\n\t\tdestinationRootClientId,\n\t];\n\tconst parentIndex = parents.indexOf( rootClientId );\n\tif ( parentIndex !== -1 ) {\n\t\treturn (\n\t\t\tregistry\n\t\t\t\t.select( blockEditorStore )\n\t\t\t\t.getBlockIndex( parents[ parentIndex + 1 ] ) + 1\n\t\t);\n\t}\n\treturn registry.select( blockEditorStore ).getBlockOrder( rootClientId )\n\t\t.length;\n}\n\n/**\n * @typedef WPInserterConfig\n *\n * @property {string=}   rootClientId   If set, insertion will be into the\n *                                      block with this ID.\n * @property {number=}   insertionIndex If set, insertion will be into this\n *                                      explicit position.\n * @property {string=}   clientId       If set, insertion will be after the\n *                                      block with this ID.\n * @property {boolean=}  isAppender     Whether the inserter is an appender\n *                                      or not.\n * @property {Function=} onSelect       Called after insertion.\n */\n\n/**\n * Returns the insertion point state given the inserter config.\n *\n * @param {WPInserterConfig} config Inserter Config.\n * @return {Array} Insertion Point State (rootClientID, onInsertBlocks and onToggle).\n */\nfunction useInsertionPoint( {\n\trootClientId = '',\n\tinsertionIndex,\n\tclientId,\n\tisAppender,\n\tonSelect,\n\tshouldFocusBlock = true,\n\tselectBlockOnInsert = true,\n} ) {\n\tconst registry = useRegistry();\n\tconst {\n\t\tgetSelectedBlock,\n\t\tgetClosestAllowedInsertionPoint,\n\t\tgetBlockInsertionPoint,\n\t} = unlock( useSelect( blockEditorStore ) );\n\tconst { destinationRootClientId, destinationIndex } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetSelectedBlockClientId,\n\t\t\t\tgetBlockRootClientId,\n\t\t\t\tgetBlockIndex,\n\t\t\t\tgetBlockOrder,\n\t\t\t\tgetInsertionPoint,\n\t\t\t} = unlock( select( blockEditorStore ) );\n\t\t\tconst selectedBlockClientId = getSelectedBlockClientId();\n\t\t\tlet _destinationRootClientId = rootClientId;\n\t\t\tlet _destinationIndex;\n\t\t\tconst insertionPoint = getInsertionPoint();\n\n\t\t\tif ( insertionIndex !== undefined ) {\n\t\t\t\t// Insert into a specific index.\n\t\t\t\t_destinationIndex = insertionIndex;\n\t\t\t} else if (\n\t\t\t\tinsertionPoint &&\n\t\t\t\tinsertionPoint.hasOwnProperty( 'index' )\n\t\t\t) {\n\t\t\t\t_destinationRootClientId = insertionPoint?.rootClientId\n\t\t\t\t\t? insertionPoint.rootClientId\n\t\t\t\t\t: rootClientId;\n\t\t\t\t_destinationIndex = insertionPoint.index;\n\t\t\t} else if ( clientId ) {\n\t\t\t\t// Insert after a specific client ID.\n\t\t\t\t_destinationIndex = getBlockIndex( clientId );\n\t\t\t} else if ( ! isAppender && selectedBlockClientId ) {\n\t\t\t\t_destinationRootClientId = getBlockRootClientId(\n\t\t\t\t\tselectedBlockClientId\n\t\t\t\t);\n\t\t\t\t_destinationIndex = getBlockIndex( selectedBlockClientId ) + 1;\n\t\t\t} else {\n\t\t\t\t// Insert at the end of the list.\n\t\t\t\t_destinationIndex = getBlockOrder(\n\t\t\t\t\t_destinationRootClientId\n\t\t\t\t).length;\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\tdestinationRootClientId: _destinationRootClientId,\n\t\t\t\tdestinationIndex: _destinationIndex,\n\t\t\t};\n\t\t},\n\t\t[ rootClientId, insertionIndex, clientId, isAppender ]\n\t);\n\n\tconst {\n\t\treplaceBlocks,\n\t\tinsertBlocks,\n\t\tshowInsertionPoint,\n\t\thideInsertionPoint,\n\t\tsetLastFocus,\n\t} = unlock( useDispatch( blockEditorStore ) );\n\n\tconst onInsertBlocks = useCallback(\n\t\t( blocks, meta, shouldForceFocusBlock = false, _rootClientId ) => {\n\t\t\t// When we are trying to move focus or select a new block on insert, we also\n\t\t\t// need to clear the last focus to avoid the focus being set to the wrong block\n\t\t\t// when tabbing back into the canvas if the block was added from outside the\n\t\t\t// editor canvas.\n\t\t\tif (\n\t\t\t\tshouldForceFocusBlock ||\n\t\t\t\tshouldFocusBlock ||\n\t\t\t\tselectBlockOnInsert\n\t\t\t) {\n\t\t\t\tsetLastFocus( null );\n\t\t\t}\n\n\t\t\tconst selectedBlock = getSelectedBlock();\n\n\t\t\tif (\n\t\t\t\t! isAppender &&\n\t\t\t\tselectedBlock &&\n\t\t\t\tisUnmodifiedDefaultBlock( selectedBlock, 'content' )\n\t\t\t) {\n\t\t\t\treplaceBlocks(\n\t\t\t\t\tselectedBlock.clientId,\n\t\t\t\t\tblocks,\n\t\t\t\t\tnull,\n\t\t\t\t\tshouldFocusBlock || shouldForceFocusBlock ? 0 : null,\n\t\t\t\t\tmeta\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tinsertBlocks(\n\t\t\t\t\tblocks,\n\t\t\t\t\tisAppender || _rootClientId === undefined\n\t\t\t\t\t\t? destinationIndex\n\t\t\t\t\t\t: getIndex( {\n\t\t\t\t\t\t\t\tdestinationRootClientId,\n\t\t\t\t\t\t\t\tdestinationIndex,\n\t\t\t\t\t\t\t\trootClientId: _rootClientId,\n\t\t\t\t\t\t\t\tregistry,\n\t\t\t\t\t\t  } ),\n\t\t\t\t\tisAppender || _rootClientId === undefined\n\t\t\t\t\t\t? destinationRootClientId\n\t\t\t\t\t\t: _rootClientId,\n\t\t\t\t\tselectBlockOnInsert,\n\t\t\t\t\tshouldFocusBlock || shouldForceFocusBlock ? 0 : null,\n\t\t\t\t\tmeta\n\t\t\t\t);\n\t\t\t}\n\t\t\tconst blockLength = Array.isArray( blocks ) ? blocks.length : 1;\n\t\t\tconst message = sprintf(\n\t\t\t\t// translators: %d: the name of the block that has been added\n\t\t\t\t_n( '%d block added.', '%d blocks added.', blockLength ),\n\t\t\t\tblockLength\n\t\t\t);\n\t\t\tspeak( message );\n\n\t\t\tif ( onSelect ) {\n\t\t\t\tonSelect( blocks );\n\t\t\t}\n\t\t},\n\t\t[\n\t\t\tisAppender,\n\t\t\tgetSelectedBlock,\n\t\t\treplaceBlocks,\n\t\t\tinsertBlocks,\n\t\t\tdestinationRootClientId,\n\t\t\tdestinationIndex,\n\t\t\tonSelect,\n\t\t\tshouldFocusBlock,\n\t\t\tselectBlockOnInsert,\n\t\t\tsetLastFocus,\n\t\t\tregistry,\n\t\t]\n\t);\n\n\tconst onToggleInsertionPoint = useCallback(\n\t\t( item ) => {\n\t\t\tif ( item ) {\n\t\t\t\tconst allowedDestinationRootClientId =\n\t\t\t\t\tgetClosestAllowedInsertionPoint(\n\t\t\t\t\t\titem.name,\n\t\t\t\t\t\tdestinationRootClientId\n\t\t\t\t\t);\n\t\t\t\tif ( allowedDestinationRootClientId !== null ) {\n\t\t\t\t\tshowInsertionPoint(\n\t\t\t\t\t\tallowedDestinationRootClientId,\n\t\t\t\t\t\tgetIndex( {\n\t\t\t\t\t\t\tdestinationRootClientId,\n\t\t\t\t\t\t\tdestinationIndex,\n\t\t\t\t\t\t\trootClientId: allowedDestinationRootClientId,\n\t\t\t\t\t\t\tregistry,\n\t\t\t\t\t\t} )\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t} else if ( ! getBlockInsertionPoint()?.__unstableWithInserter ) {\n\t\t\t\t// The insertion cue is shared state. The in-between inserter\n\t\t\t\t// marks its own cue with `__unstableWithInserter` and mounts an\n\t\t\t\t// inserter inside that cue's popover, so hiding that cue here\n\t\t\t\t// would unmount a UI this inserter does not own.\n\t\t\t\t// See https://github.com/WordPress/gutenberg/issues/72297.\n\t\t\t\thideInsertionPoint();\n\t\t\t}\n\t\t},\n\t\t[\n\t\t\tgetClosestAllowedInsertionPoint,\n\t\t\tgetBlockInsertionPoint,\n\t\t\tshowInsertionPoint,\n\t\t\thideInsertionPoint,\n\t\t\tdestinationRootClientId,\n\t\t\tdestinationIndex,\n\t\t\tregistry,\n\t\t]\n\t);\n\n\treturn [ destinationRootClientId, onInsertBlocks, onToggleInsertionPoint ];\n}\n\nexport default useInsertionPoint;\n"],
+  "mappings": "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",
   "names": ["blockEditorStore"]
 }

package/build/components/inserter/menu.cjs CHANGED Viewed

@@ -109,9 +109,11 @@ function InserterMenu({
     insertionIndex: __experimentalInsertionIndex,
     shouldFocusBlock
   });
+  const { hideInsertionPoint } = (0, import_data.useDispatch)(import_store.store);
   const blockTypesTabRef = (0, import_element.useRef)();
   const onInsert = (0, import_element.useCallback)(
     (blocks, meta, shouldForceFocusBlock, _rootClientId) => {
+      hideInsertionPoint();
       onInsertBlocks(
         blocks,
         meta,
@@ -128,16 +130,23 @@ function InserterMenu({
         }
       });
     },
-    [onInsertBlocks, maybeCloseInserter, onSelect, ref, shouldFocusBlock]
+    [
+      hideInsertionPoint,
+      onInsertBlocks,
+      maybeCloseInserter,
+      onSelect,
+      ref,
+      shouldFocusBlock
+    ]
   );
   const onInsertPattern = (0, import_element.useCallback)(
     (blocks, patternName, ...args) => {
-      onToggleInsertionPoint(false);
+      hideInsertionPoint();
       onInsertBlocks(blocks, { patternName }, ...args);
       onSelect();
       maybeCloseInserter();
     },
-    [onInsertBlocks, maybeCloseInserter, onSelect, onToggleInsertionPoint]
+    [hideInsertionPoint, onInsertBlocks, maybeCloseInserter, onSelect]
   );
   const onHover = (0, import_element.useCallback)(
     (item) => {
@@ -317,11 +326,13 @@ function InserterMenu({
   };
   const tabsRef = (0, import_element.useRef)();
   (0, import_element.useLayoutEffect)(() => {
-    if (tabsRef.current) {
-      window.requestAnimationFrame(() => {
-        tabsRef.current.querySelector('[role="tab"][aria-selected="true"]')?.focus();
-      });
+    if (!tabsRef.current) {
+      return;
     }
+    const frame = window.requestAnimationFrame(() => {
+      tabsRef.current?.querySelector('[role="tab"][aria-selected="true"]')?.focus();
+    });
+    return () => window.cancelAnimationFrame(frame);
   }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     "div",