diff --git a/packages/block-editor/src/components/block-switcher/pattern-transformations-menu.js b/packages/block-editor/src/components/block-switcher/pattern-transformations-menu.js index f9a4b7190a6dd..84f2d4b6a7a95 100644 --- a/packages/block-editor/src/components/block-switcher/pattern-transformations-menu.js +++ b/packages/block-editor/src/components/block-switcher/pattern-transformations-menu.js @@ -11,9 +11,7 @@ import { MenuItem, Popover, VisuallyHidden, - __unstableComposite as Composite, - __unstableUseCompositeState as useCompositeState, - __unstableCompositeItem as CompositeItem, + privateApis as componentsPrivateApis, } from '@wordpress/components'; /** @@ -21,6 +19,13 @@ import { */ import BlockPreview from '../block-preview'; import useTransformedPatterns from './use-transformed-patterns'; +import { unlock } from '../../lock-unlock'; + +const { + CompositeV2: Composite, + CompositeItemV2: CompositeItem, + useCompositeStoreV2: useCompositeStore, +} = unlock( componentsPrivateApis ); function PatternTransformationsMenu( { blocks, @@ -73,10 +78,10 @@ function PreviewPatternsPopover( { patterns, onSelect } ) { } function BlockPatternsList( { patterns, onSelect } ) { - const composite = useCompositeState(); + const composite = useCompositeStore(); return ( ) ) } ); } -function BlockPattern( { pattern, onSelect, composite } ) { +function BlockPattern( { pattern, onSelect } ) { // TODO check pattern/preview width... const baseClassName = 'block-editor-block-switcher__preview-patterns-container'; @@ -104,14 +108,16 @@ function BlockPattern( { pattern, onSelect, composite } ) { return (
} - className={ `${ baseClassName }-list__item` } onClick={ () => onSelect( pattern.transformedBlocks ) } >