From 5ccc194bbd2cc555f70bdd954eb71246907978b0 Mon Sep 17 00:00:00 2001 From: Carolina Nymark Date: Wed, 5 Feb 2025 10:52:40 +0100 Subject: [PATCH 1/6] Make it possible to opt-out of the classic theme Stylebook -Registers and enables a new theme support called stylebook. - Introduces a check for the theme support in the Site Editor sidebar and Stylebook preview. - The sidebar menu hides the Styles menu item if it is unsupported. - The stylebook preview displays a notice at the top of the page if it is unsupported. - Classic themes can opt.out by using remove_theme_support( 'stylebook' ); --- lib/compat/wordpress-6.8/site-editor.php | 33 ++++++++++++++++++- .../sidebar-navigation-screen-main/index.js | 8 ++++- .../src/components/style-book/index.js | 24 ++++++++++++-- .../src/components/style-book/style.scss | 4 +++ 4 files changed, 64 insertions(+), 5 deletions(-) diff --git a/lib/compat/wordpress-6.8/site-editor.php b/lib/compat/wordpress-6.8/site-editor.php index 82ac118b013c16..ab11e1a7ea7491 100644 --- a/lib/compat/wordpress-6.8/site-editor.php +++ b/lib/compat/wordpress-6.8/site-editor.php @@ -136,6 +136,37 @@ function gutenberg_styles_wp_die_handler( $default_handler ) { } add_filter( 'wp_die_handler', 'gutenberg_styles_wp_die_handler' ); +/** + * Registers the stylebook theme support. + * Ensures that the stylebook theme support is available in the editors by setting show_in_rest to true. + * Backports into wp-includes\theme.php create_initial_theme_features(). + */ +add_action( + 'setup_theme', + function () { + register_theme_feature( + 'stylebook', + array( + 'description' => __( 'test' ), + 'show_in_rest' => true, + ) + ); + }, + 0 +); + +/** + * Enables the stylebook theme support. + * Backports into wp-includes\theme.php _add_default_theme_supports(). + */ +add_action( + 'after_setup_theme', + function () { + add_theme_support( 'stylebook' ); + }, + 1 +); + /** * Add a Styles submenu under the Appearance menu * for Classic themes. @@ -143,7 +174,7 @@ function gutenberg_styles_wp_die_handler( $default_handler ) { * @global array $submenu */ function gutenberg_add_styles_submenu_item() { - if ( ! wp_is_block_theme() && ( current_theme_supports( 'editor-styles' ) || wp_theme_has_theme_json() ) ) { + if ( ! wp_is_block_theme() && current_theme_supports( 'stylebook' ) ) { global $submenu; $styles_menu_item = array( diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-main/index.js b/packages/edit-site/src/components/sidebar-navigation-screen-main/index.js index abcc7183f6604e..af36becbf8d477 100644 --- a/packages/edit-site/src/components/sidebar-navigation-screen-main/index.js +++ b/packages/edit-site/src/components/sidebar-navigation-screen-main/index.js @@ -18,6 +18,12 @@ import { unlock } from '../../lock-unlock'; import { store as editSiteStore } from '../../store'; export function MainSidebarNavigationContent( { isBlockBasedTheme = true } ) { + const showStylebookMenu = useSelect( + ( select ) => + select( coreStore ).getThemeSupports()?.stylebook || false, + [] + ); + return ( { isBlockBasedTheme && ( @@ -55,7 +61,7 @@ export function MainSidebarNavigationContent( { isBlockBasedTheme = true } ) { ) } - { ! isBlockBasedTheme && ( + { ! isBlockBasedTheme && showStylebookMenu && ( { - const siteEditorSettings = useSelect( - ( select ) => select( siteEditorStore ).getSettings(), + const { isBlockTheme, hasStyleBook, siteEditorSettings } = useSelect( + ( select ) => { + const { getCurrentTheme, getThemeSupports } = select( coreStore ); + return { + isBlockTheme: getCurrentTheme()?.is_block_theme, + hasStyleBook: !! getThemeSupports()?.stylebook, + siteEditorSettings: select( siteEditorStore ).getSettings(), + }; + }, [] ); @@ -457,7 +464,6 @@ export const StyleBookPreview = ( { userConfig = {}, isStatic = false } ) => { : { examples: examplesForSinglePageUse }; const { base: baseConfig } = useContext( GlobalStylesContext ); - const goTo = getStyleBookNavigationFromPath( section ); const mergedConfig = useMemo( () => { if ( ! isObjectEmpty( userConfig ) && ! isObjectEmpty( baseConfig ) ) { @@ -480,6 +486,18 @@ export const StyleBookPreview = ( { userConfig = {}, isStatic = false } ) => { [ globalStyles, siteEditorSettings, userConfig ] ); + if ( ! isBlockTheme && ! hasStyleBook ) { + return ( +

+ { __( + 'The theme you are currently using does not support the Stylebook.' + ) } +

+ ); + } + + const goTo = getStyleBookNavigationFromPath( section ); + return (
diff --git a/packages/edit-site/src/components/style-book/style.scss b/packages/edit-site/src/components/style-book/style.scss index 42ffca2af1ed1d..652e9aefeecc0f 100644 --- a/packages/edit-site/src/components/style-book/style.scss +++ b/packages/edit-site/src/components/style-book/style.scss @@ -39,3 +39,7 @@ overflow: auto; } + +.edit-site-style-book__unsupported { + color: $gray-400; +} From 14aff920661a53a725a55ac1f978bf1c4b33218a Mon Sep 17 00:00:00 2001 From: Carolina Nymark Date: Thu, 6 Feb 2025 14:27:13 +0100 Subject: [PATCH 2/6] Add some spacing --- packages/edit-site/src/components/style-book/style.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/edit-site/src/components/style-book/style.scss b/packages/edit-site/src/components/style-book/style.scss index 652e9aefeecc0f..c412934530a800 100644 --- a/packages/edit-site/src/components/style-book/style.scss +++ b/packages/edit-site/src/components/style-book/style.scss @@ -42,4 +42,5 @@ .edit-site-style-book__unsupported { color: $gray-400; + margin: $canvas-padding; } From 2e77b0bc44eec583890248ad70a0cfaf61f70cf3 Mon Sep 17 00:00:00 2001 From: Carolina Nymark Date: Thu, 13 Feb 2025 11:02:46 +0100 Subject: [PATCH 3/6] Update the theme feature description --- lib/compat/wordpress-6.8/site-editor.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/compat/wordpress-6.8/site-editor.php b/lib/compat/wordpress-6.8/site-editor.php index ab11e1a7ea7491..84a0fb5ed20bc9 100644 --- a/lib/compat/wordpress-6.8/site-editor.php +++ b/lib/compat/wordpress-6.8/site-editor.php @@ -147,7 +147,7 @@ function () { register_theme_feature( 'stylebook', array( - 'description' => __( 'test' ), + 'description' => __( 'Whether a classic theme uses the Stylebook.' ), 'show_in_rest' => true, ) ); From 9a8bd5f8709d2d24a9187ab14236a762f70222fe Mon Sep 17 00:00:00 2001 From: Carolina Nymark Date: Fri, 14 Feb 2025 08:52:52 +0100 Subject: [PATCH 4/6] Add changelog --- backport-changelog/6.8/8320.md | 3 +++ 1 file changed, 3 insertions(+) create mode 100644 backport-changelog/6.8/8320.md diff --git a/backport-changelog/6.8/8320.md b/backport-changelog/6.8/8320.md new file mode 100644 index 00000000000000..47fef38c64a158 --- /dev/null +++ b/backport-changelog/6.8/8320.md @@ -0,0 +1,3 @@ +https://github.com/WordPress/wordpress-develop/pull/8320 + +* https://github.com/WordPress/gutenberg/pull/69043 From dbaf5bc0b83d1095d4c566e272a5ccaf4e6576fd Mon Sep 17 00:00:00 2001 From: Carolina Nymark Date: Mon, 24 Feb 2025 06:42:30 +0100 Subject: [PATCH 5/6] Add context to the Design menu item --- lib/compat/wordpress-6.8/site-editor.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/compat/wordpress-6.8/site-editor.php b/lib/compat/wordpress-6.8/site-editor.php index 84a0fb5ed20bc9..db25d6382fed7d 100644 --- a/lib/compat/wordpress-6.8/site-editor.php +++ b/lib/compat/wordpress-6.8/site-editor.php @@ -178,7 +178,7 @@ function gutenberg_add_styles_submenu_item() { global $submenu; $styles_menu_item = array( - __( 'Design', 'gutenberg' ), + _x( 'Design', 'Design menu item', 'gutenberg' ), 'edit_theme_options', 'site-editor.php', ); From ef37acd577e237d5a023c8294bc90aaba501ce33 Mon Sep 17 00:00:00 2001 From: Carolina Nymark Date: Wed, 26 Feb 2025 07:08:54 +0100 Subject: [PATCH 6/6] Use a Notice to show the notice --- packages/edit-site/src/components/style-book/index.js | 5 +++-- packages/edit-site/src/components/style-book/style.scss | 5 ----- 2 files changed, 3 insertions(+), 7 deletions(-) diff --git a/packages/edit-site/src/components/style-book/index.js b/packages/edit-site/src/components/style-book/index.js index ed6537967b1320..06ce9bd18d8bfc 100644 --- a/packages/edit-site/src/components/style-book/index.js +++ b/packages/edit-site/src/components/style-book/index.js @@ -10,6 +10,7 @@ import { Disabled, Composite, privateApis as componentsPrivateApis, + Notice, } from '@wordpress/components'; import { __, _x, sprintf } from '@wordpress/i18n'; import { @@ -488,11 +489,11 @@ export const StyleBookPreview = ( { userConfig = {}, isStatic = false } ) => { if ( ! isBlockTheme && ! hasStyleBook ) { return ( -

+ { __( 'The theme you are currently using does not support the Stylebook.' ) } -

+ ); } diff --git a/packages/edit-site/src/components/style-book/style.scss b/packages/edit-site/src/components/style-book/style.scss index c412934530a800..42ffca2af1ed1d 100644 --- a/packages/edit-site/src/components/style-book/style.scss +++ b/packages/edit-site/src/components/style-book/style.scss @@ -39,8 +39,3 @@ overflow: auto; } - -.edit-site-style-book__unsupported { - color: $gray-400; - margin: $canvas-padding; -}