diff --git a/packages/block-library/src/pattern/edit.js b/packages/block-library/src/pattern/edit.js index d9f0c2c53cebcd..e8068faf5013d9 100644 --- a/packages/block-library/src/pattern/edit.js +++ b/packages/block-library/src/pattern/edit.js @@ -29,6 +29,7 @@ const PatternEdit = ( { attributes, clientId } ) => { const { getBlockRootClientId, getBlockEditingMode } = useSelect( blockEditorStore ); + // Duplicated in packages/edit-site/src/components/start-template-options/index.js. function injectThemeAttributeInBlockTemplateContent( block ) { if ( block.innerBlocks.find( diff --git a/packages/edit-site/src/components/start-template-options/index.js b/packages/edit-site/src/components/start-template-options/index.js index 6cce84deebfa97..a7393b6188ddd1 100644 --- a/packages/edit-site/src/components/start-template-options/index.js +++ b/packages/edit-site/src/components/start-template-options/index.js @@ -50,6 +50,37 @@ function useStartPatterns( fallbackContent ) { }; }, [] ); + const currentThemeStylesheet = useSelect( + ( select ) => select( coreStore ).getCurrentTheme().stylesheet + ); + + // Duplicated from packages/block-library/src/pattern/edit.js. + function injectThemeAttributeInBlockTemplateContent( block ) { + if ( + block.innerBlocks.find( + ( innerBlock ) => innerBlock.name === 'core/template-part' + ) + ) { + block.innerBlocks = block.innerBlocks.map( ( innerBlock ) => { + if ( + innerBlock.name === 'core/template-part' && + innerBlock.attributes.theme === undefined + ) { + innerBlock.attributes.theme = currentThemeStylesheet; + } + return innerBlock; + } ); + } + + if ( + block.name === 'core/template-part' && + block.attributes.theme === undefined + ) { + block.attributes.theme = currentThemeStylesheet; + } + return block; + } + return useMemo( () => { // filter patterns that are supposed to be used in the current template being edited. return [ @@ -68,7 +99,12 @@ function useStartPatterns( fallbackContent ) { ); } ) .map( ( pattern ) => { - return { ...pattern, blocks: parse( pattern.content ) }; + return { + ...pattern, + blocks: parse( pattern.content ).map( ( block ) => + injectThemeAttributeInBlockTemplateContent( block ) + ), + }; } ), ]; }, [ fallbackContent, slug, patterns ] );