From d9df980136d365a090903cd42405944419c6b89b Mon Sep 17 00:00:00 2001 From: Ari Stathopoulos Date: Thu, 22 Apr 2021 16:11:11 +0300 Subject: [PATCH 1/7] template should include preferred style --- packages/block-library/src/buttons/edit.js | 19 +++++++++++++++++-- 1 file changed, 17 insertions(+), 2 deletions(-) diff --git a/packages/block-library/src/buttons/edit.js b/packages/block-library/src/buttons/edit.js index 913daf0f92e0c..812cbf8cc1615 100644 --- a/packages/block-library/src/buttons/edit.js +++ b/packages/block-library/src/buttons/edit.js @@ -11,7 +11,9 @@ import { useBlockProps, __experimentalUseInnerBlocksProps as useInnerBlocksProps, JustifyContentControl, + store as blockEditorStore, } from '@wordpress/block-editor'; +import { useSelect } from '@wordpress/data'; /** * Internal dependencies @@ -19,7 +21,6 @@ import { import { name as buttonBlockName } from '../button'; const ALLOWED_BLOCKS = [ buttonBlockName ]; -const BUTTONS_TEMPLATE = [ [ 'core/button' ] ]; const LAYOUT = { type: 'default', alignments: [], @@ -42,9 +43,23 @@ function ButtonsEdit( { 'is-vertical': orientation === 'vertical', } ), } ); + const preferredStyle = useSelect( ( select ) => { + const preferredStyleVariations = select( + blockEditorStore + ).getSettings().__experimentalPreferredStyleVariations; + return preferredStyleVariations?.value?.[ 'core/button' ]; + }, [] ); + const innerBlocksProps = useInnerBlocksProps( blockProps, { allowedBlocks: ALLOWED_BLOCKS, - template: BUTTONS_TEMPLATE, + template: [ + [ + 'core/button', + preferredStyle + ? { className: `is-style-${ preferredStyle }` } + : {}, + ], + ], orientation, __experimentalLayout: LAYOUT, templateInsertUpdatesSelection: true, From 50a5beff5c0b06a81f3b3d071e579936845bb6a7 Mon Sep 17 00:00:00 2001 From: Ari Stathopoulos Date: Fri, 18 Jun 2021 12:13:57 +0300 Subject: [PATCH 2/7] improve conditional template definition --- packages/block-library/src/buttons/edit.js | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/packages/block-library/src/buttons/edit.js b/packages/block-library/src/buttons/edit.js index 812cbf8cc1615..fb3a237584dbf 100644 --- a/packages/block-library/src/buttons/edit.js +++ b/packages/block-library/src/buttons/edit.js @@ -52,14 +52,14 @@ function ButtonsEdit( { const innerBlocksProps = useInnerBlocksProps( blockProps, { allowedBlocks: ALLOWED_BLOCKS, - template: [ - [ - 'core/button', - preferredStyle - ? { className: `is-style-${ preferredStyle }` } - : {}, - ], - ], + template: preferredStyle + ? [ + [ + 'core/button', + { className: `is-style-${ preferredStyle }` }, + ], + ] + : [ [ 'core/button' ] ], orientation, __experimentalLayout: LAYOUT, templateInsertUpdatesSelection: true, From fd213120a02586f3a3fbe5b1c693f5bdd4ce87cd Mon Sep 17 00:00:00 2001 From: Ari Stathopoulos Date: Fri, 18 Jun 2021 12:20:39 +0300 Subject: [PATCH 3/7] fix for native file --- .../block-library/src/buttons/edit.native.js | 22 +++++++++++++++++-- 1 file changed, 20 insertions(+), 2 deletions(-) diff --git a/packages/block-library/src/buttons/edit.native.js b/packages/block-library/src/buttons/edit.native.js index beea2796c988b..a79e3ba6ef3f4 100644 --- a/packages/block-library/src/buttons/edit.native.js +++ b/packages/block-library/src/buttons/edit.native.js @@ -26,7 +26,6 @@ import { name as buttonBlockName } from '../button/'; import styles from './editor.scss'; const ALLOWED_BLOCKS = [ buttonBlockName ]; -const BUTTONS_TEMPLATE = [ [ 'core/button' ] ]; const layoutProp = { type: 'default', alignments: [] }; @@ -65,6 +64,14 @@ export default function ButtonsEdit( { }, [ clientId ] ); + + const preferredStyle = useSelect( ( select ) => { + const preferredStyleVariations = select( + blockEditorStore + ).getSettings().__experimentalPreferredStyleVariations; + return preferredStyleVariations?.value?.[ 'core/button' ]; + }, [] ); + const { getBlockOrder } = useSelect( blockEditorStore ); const { insertBlock, removeBlock, selectBlock } = useDispatch( blockEditorStore @@ -133,7 +140,18 @@ export default function ButtonsEdit( { { resizeObserver } Date: Tue, 22 Jun 2021 09:08:56 +0300 Subject: [PATCH 4/7] Update packages/block-library/src/buttons/edit.js Co-authored-by: Nik Tsekouras --- packages/block-library/src/buttons/edit.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/block-library/src/buttons/edit.js b/packages/block-library/src/buttons/edit.js index fb3a237584dbf..256c4fbf04816 100644 --- a/packages/block-library/src/buttons/edit.js +++ b/packages/block-library/src/buttons/edit.js @@ -47,7 +47,7 @@ function ButtonsEdit( { const preferredStyleVariations = select( blockEditorStore ).getSettings().__experimentalPreferredStyleVariations; - return preferredStyleVariations?.value?.[ 'core/button' ]; + return preferredStyleVariations?.value?.[ buttonBlockName ]; }, [] ); const innerBlocksProps = useInnerBlocksProps( blockProps, { From d72561de84d2c36c87c4b308790918b3e9558d55 Mon Sep 17 00:00:00 2001 From: Ari Stathopoulos Date: Tue, 22 Jun 2021 09:18:13 +0300 Subject: [PATCH 5/7] Address review feedback - props @ntsekouras --- packages/block-library/src/buttons/edit.js | 14 ++++++-------- 1 file changed, 6 insertions(+), 8 deletions(-) diff --git a/packages/block-library/src/buttons/edit.js b/packages/block-library/src/buttons/edit.js index 256c4fbf04816..424e305bd585e 100644 --- a/packages/block-library/src/buttons/edit.js +++ b/packages/block-library/src/buttons/edit.js @@ -52,14 +52,12 @@ function ButtonsEdit( { const innerBlocksProps = useInnerBlocksProps( blockProps, { allowedBlocks: ALLOWED_BLOCKS, - template: preferredStyle - ? [ - [ - 'core/button', - { className: `is-style-${ preferredStyle }` }, - ], - ] - : [ [ 'core/button' ] ], + template: [ + [ + buttonBlockName, + { className: preferredStyle && `is-style-${ preferredStyle }` }, + ], + ], orientation, __experimentalLayout: LAYOUT, templateInsertUpdatesSelection: true, From 98190588c19e663a214352a5d75d11c4152629ff Mon Sep 17 00:00:00 2001 From: Ari Stathopoulos Date: Tue, 22 Jun 2021 09:48:07 +0300 Subject: [PATCH 6/7] mirror changes to native file --- .../block-library/src/buttons/edit.native.js | 22 +++++++++---------- 1 file changed, 10 insertions(+), 12 deletions(-) diff --git a/packages/block-library/src/buttons/edit.native.js b/packages/block-library/src/buttons/edit.native.js index a79e3ba6ef3f4..eadfc843edc6a 100644 --- a/packages/block-library/src/buttons/edit.native.js +++ b/packages/block-library/src/buttons/edit.native.js @@ -140,18 +140,16 @@ export default function ButtonsEdit( { { resizeObserver } Date: Tue, 22 Jun 2021 10:05:04 +0300 Subject: [PATCH 7/7] use name from var --- packages/block-library/src/buttons/edit.native.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/block-library/src/buttons/edit.native.js b/packages/block-library/src/buttons/edit.native.js index eadfc843edc6a..9bee300cba01d 100644 --- a/packages/block-library/src/buttons/edit.native.js +++ b/packages/block-library/src/buttons/edit.native.js @@ -69,7 +69,7 @@ export default function ButtonsEdit( { const preferredStyleVariations = select( blockEditorStore ).getSettings().__experimentalPreferredStyleVariations; - return preferredStyleVariations?.value?.[ 'core/button' ]; + return preferredStyleVariations?.value?.[ buttonBlockName ]; }, [] ); const { getBlockOrder } = useSelect( blockEditorStore );