diff --git a/packages/block-library/src/pattern/edit.js b/packages/block-library/src/pattern/edit.js
index c22536a59eb03f..c4e5c8efc2d4cb 100644
--- a/packages/block-library/src/pattern/edit.js
+++ b/packages/block-library/src/pattern/edit.js
@@ -9,8 +9,9 @@ import {
useBlockProps,
useInnerBlocksProps,
} from '@wordpress/block-editor';
+import { Placeholder, Spinner } from '@wordpress/components';
-const PatternEdit = ( { attributes, clientId } ) => {
+function PatternFullEdit( { attributes, clientId } ) {
const { slug, syncStatus } = attributes;
const { selectedPattern, innerBlocks } = useSelect(
( select ) => {
@@ -69,15 +70,68 @@ const PatternEdit = ( { attributes, clientId } ) => {
className: slug?.replace( '/', '-' ),
} );
+ return
;
+}
+
+function PatternPartialEdit( { attributes: { slug }, clientId } ) {
+ const { designPattern } = useSelect(
+ ( select ) => {
+ return {
+ designPattern:
+ select( blockEditorStore ).__experimentalGetParsedPattern(
+ slug
+ ),
+ /*innerBlocks:
+ select( blockEditorStore ).getBlock( clientId )
+ ?.innerBlocks,*/
+ };
+ },
+ [ slug ]
+ );
+
+ const blockProps = useBlockProps( {
+ className: slug?.replace( '/', '-' ),
+ } );
+ if ( ! designPattern?.blocks?.length ) {
+ return (
+
+ );
+ }
+
+ return (
+
+ );
+}
+
+function PatternInnerBlocks( { clientId, blockProps, template } ) {
const innerBlocksProps = useInnerBlocksProps( blockProps, {
- templateLock: syncStatus === 'partial' ? 'contentOnly' : false,
+ templateLock: 'contentOnly',
} );
- if ( syncStatus !== 'partial' ) {
- return ;
- }
+ const { replaceInnerBlocks } = useDispatch( blockEditorStore );
+
+ useEffect( () => {
+ const blocks = template.map( ( block ) => cloneBlock( block ) );
+ replaceInnerBlocks( clientId, blocks );
+ }, [ clientId, replaceInnerBlocks, template ] );
return ;
-};
+}
-export default PatternEdit;
+export default function PatternEdit( props ) {
+ const { syncStatus } = props.attributes;
+
+ return syncStatus === 'partial' ? (
+
+ ) : (
+
+ );
+}
diff --git a/packages/block-library/src/pattern/index.js b/packages/block-library/src/pattern/index.js
index 27e74510eb5972..a7445c8b6e857d 100644
--- a/packages/block-library/src/pattern/index.js
+++ b/packages/block-library/src/pattern/index.js
@@ -5,12 +5,13 @@ import initBlock from '../utils/init-block';
import metadata from './block.json';
import PatternEditV1 from './v1/edit';
import PatternEditV2 from './edit';
+import save from './save';
const { name } = metadata;
export { metadata, name };
export const settings = window?.__experimentalEnablePatternEnhancements
- ? { edit: PatternEditV2 }
+ ? { edit: PatternEditV2, save }
: { edit: PatternEditV1 };
export const init = () => initBlock( { name, metadata, settings } );
diff --git a/packages/block-library/src/pattern/save.js b/packages/block-library/src/pattern/save.js
new file mode 100644
index 00000000000000..5e49e3651d076c
--- /dev/null
+++ b/packages/block-library/src/pattern/save.js
@@ -0,0 +1,12 @@
+/**
+ * WordPress dependencies
+ */
+import { InnerBlocks } from '@wordpress/block-editor';
+
+export default function save( { attributes: { syncStatus } } ) {
+ if ( syncStatus !== 'partial' ) {
+ return null;
+ }
+
+ return ;
+}