Skip to content

[Button Block]: add support for pseudo elements for the block and its variations on theme.json #71418

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 18 commits into from
Nov 20, 2025
Merged

[Button Block]: add support for pseudo elements for the block and its variations on theme.json #71418

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
18 commits
Select commit Hold shift + click to select a range
79c25b9
initial try to get pseudo elements to work on blocks
MaggieCabrera Aug 29, 2025
3ce94d4
run php format
MaggieCabrera Sep 1, 2025
3716d13
refactor theme.json schema
MaggieCabrera Sep 1, 2025
e279758
remove unused definition
MaggieCabrera Sep 1, 2025
4a6e64e
add support for pseudo selectors inside variations
MaggieCabrera Sep 2, 2025
82ed4a3
remove redundant comments
MaggieCabrera Sep 2, 2025
a863948
fix php errors
MaggieCabrera Sep 2, 2025
37cb2fc
fix duotone test
scruffian Nov 17, 2025
a1cc83f
fix PHP linter
scruffian Nov 17, 2025
a76d7d8
add backport
scruffian Nov 17, 2025
f26e38b
Update lib/class-wp-theme-json-gutenberg.php
scruffian Nov 20, 2025
a7d75af
Update lib/class-wp-theme-json-gutenberg.php
scruffian Nov 20, 2025
6eb2dba
Update lib/class-wp-theme-json-gutenberg.php
scruffian Nov 20, 2025
5c834d4
Update lib/class-wp-theme-json-gutenberg.php
scruffian Nov 20, 2025
bd87a59
Update lib/class-wp-theme-json-gutenberg.php
scruffian Nov 20, 2025
005f04e
create a helper function to extract the block name
scruffian Nov 20, 2025
4604ff9
fix PHP linter
scruffian Nov 20, 2025
bd14372
fix test
scruffian Nov 20, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
run php format
  • Loading branch information
@MaggieCabrera @scruffian
MaggieCabrera authored and scruffian committed Nov 17, 2025
commit 3ce94d4c799cba696d13e3d4f0223efc421bb2a7
21 changes: 10 additions & 11 deletions lib/class-wp-theme-json-gutenberg.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1011,7 +1011,7 @@ protected static function sanitize( $input, $valid_block_names, $valid_element_n
$schema_settings_blocks[ $block ] = static::VALID_SETTINGS;
$schema_styles_blocks[ $block ] = $styles_non_top_level;
$schema_styles_blocks[ $block ]['elements'] = $schema_styles_elements;

// Add pseudo-selectors for blocks that support them
if ( isset( static::VALID_BLOCK_PSEUDO_SELECTORS[ $block ] ) ) {
foreach ( static::VALID_BLOCK_PSEUDO_SELECTORS[ $block ] as $pseudo_selector ) {
Expand Down Expand Up @@ -1365,7 +1365,6 @@ public function get_stylesheet( $types = array( 'variables', 'styles', 'presets'
$origins = static::VALID_ORIGINS;
}


if ( is_string( $types ) ) {
// Dispatch error and map old arguments to new ones.
_deprecated_argument( __FUNCTION__, '5.9.0' );
Expand Down Expand Up @@ -2976,15 +2975,15 @@ static function ( $split_selector ) use ( $clean_style_variation_selector ) {
* $block_metadata['path'] = array( 'styles', 'blocks', 'core/button', ':hover' );
*/
$is_processing_block_pseudo = false;
$block_pseudo_selector = null;
$block_pseudo_selector = null;
if ( in_array( 'blocks', $block_metadata['path'], true ) && count( $block_metadata['path'] ) >= 4 ) {
$block_name = $block_metadata['path'][2]; // 'core/button'
$block_name = $block_metadata['path'][2]; // 'core/button'
$last_path_element = $block_metadata['path'][ count( $block_metadata['path'] ) - 1 ]; // ':hover'
if ( isset( static::VALID_BLOCK_PSEUDO_SELECTORS[ $block_name ] ) &&
in_array( $last_path_element, static::VALID_BLOCK_PSEUDO_SELECTORS[ $block_name ], true ) ) {

if ( isset( static::VALID_BLOCK_PSEUDO_SELECTORS[ $block_name ] ) &&
in_array( $last_path_element, static::VALID_BLOCK_PSEUDO_SELECTORS[ $block_name ], true ) ) {
$is_processing_block_pseudo = true;
$block_pseudo_selector = $last_path_element;
$block_pseudo_selector = $last_path_element;
}
}

Expand Down Expand Up @@ -3020,10 +3019,10 @@ static function ( $pseudo_selector ) use ( $selector ) {
} elseif ( $is_processing_block_pseudo ) {
// Process block pseudo-selector styles
// For block pseudo-selectors, we need to get the block data first, then access the pseudo-selector
$block_name = $block_metadata['path'][2]; // 'core/button'
$block_data = _wp_array_get( $this->theme_json, array( 'styles', 'blocks', $block_name ), array() );
$block_name = $block_metadata['path'][2]; // 'core/button'
$block_data = _wp_array_get( $this->theme_json, array( 'styles', 'blocks', $block_name ), array() );
$pseudo_data = isset( $block_data[ $block_pseudo_selector ] ) ? $block_data[ $block_pseudo_selector ] : array();

$declarations = static::compute_style_properties( $pseudo_data, $settings, null, $this->theme_json, $selector, $use_root_padding );
} else {
$declarations = static::compute_style_properties( $node, $settings, null, $this->theme_json, $selector, $use_root_padding );
Expand Down
14 changes: 7 additions & 7 deletions phpunit/class-wp-theme-json-test.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6136,7 +6136,7 @@ public function test_block_pseudo_selectors_are_processed() {
'styles' => array(
'blocks' => array(
'core/button' => array(
'color' => array(
'color' => array(
'text' => 'white',
'background' => 'blue',
),
Expand Down Expand Up @@ -6221,11 +6221,11 @@ public function test_block_pseudo_selectors_ignores_non_whitelisted() {
'styles' => array(
'blocks' => array(
'core/button' => array(
'color' => array(
'color' => array(
'text' => 'white',
'background' => 'blue',
),
':hover' => array(
':hover' => array(
'color' => array(
'text' => 'blue',
'background' => 'white',
Expand Down Expand Up @@ -6258,7 +6258,7 @@ public function test_blocks_without_pseudo_support_ignore_pseudo_selectors() {
'styles' => array(
'blocks' => array(
'core/paragraph' => array(
'color' => array(
'color' => array(
'text' => 'black',
),
':hover' => array(
Expand Down Expand Up @@ -6287,19 +6287,19 @@ public function test_block_pseudo_selectors_with_elements() {
'styles' => array(
'blocks' => array(
'core/button' => array(
'color' => array(
'color' => array(
'text' => 'white',
'background' => 'blue',
),
':hover' => array(
':hover' => array(
'color' => array(
'text' => 'blue',
'background' => 'white',
),
),
'elements' => array(
'button' => array(
'color' => array(
'color' => array(
'text' => 'green',
),
':hover' => array(
Expand Down