Skip to content

Nav submenu: add support to style current submenu in theme.json#76367

Open
MaggieCabrera wants to merge 3 commits intotrunkfrom
add-nav-submenu-state
Open

Nav submenu: add support to style current submenu in theme.json#76367
MaggieCabrera wants to merge 3 commits intotrunkfrom
add-nav-submenu-state

Conversation

@MaggieCabrera
Copy link
Copy Markdown
Contributor

@MaggieCabrera MaggieCabrera commented Mar 10, 2026

What?

Follow up to #75736

Following the discussion on the other PR, we are adding support for current state to the submenu block too

Why?

For consistency and to allow users more nunaced control over how they style their navigation blocks.

How?

We are adding support the same we did for the nav link, by adding it to the allowed blocks constant, adding a selector on block.json and modifying the schema andadding tests.

Testing Instructions

Add this to your theme.json, before this PR only the nav-link applied, now we can target submenus specifically.

"core/navigation-link": {
    "@current": { "color": { "text": "pink" } }
},
"core/navigation-submenu": {
    "@current": { "color": { "text": "green" } }
},

Screenshots or screencast

Before After
Screenshot 2026-03-10 at 17 20 40 Screenshot 2026-03-10 at 17 16 33

@github-actions github-actions bot added the [Package] Block library /packages/block-library label Mar 10, 2026
@MaggieCabrera MaggieCabrera changed the title added support for the current submenu item Nav submenu: add support to style current submenu in theme.json Mar 10, 2026
Base automatically changed from add-nav-link-current-state to trunk March 10, 2026 16:27
@github-actions
Copy link
Copy Markdown

github-actions bot commented Mar 10, 2026

Flaky tests detected in 8fd42d5.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/22949982588
📝 Reported issues:

@MaggieCabrera MaggieCabrera force-pushed the add-nav-submenu-state branch from c11d8b5 to 40b2cd6 Compare March 10, 2026 16:47
@MaggieCabrera MaggieCabrera marked this pull request as ready for review March 10, 2026 16:55
@MaggieCabrera MaggieCabrera self-assigned this Mar 10, 2026
@github-actions
Copy link
Copy Markdown

Warning: Type of PR label mismatch

To merge this PR, it requires exactly 1 label indicating the type of PR. Other labels are optional and not being checked here.

  • Required label: Any label starting with [Type].
  • Labels found: [Package] Block library.

Read more about Type labels in Gutenberg. Don't worry if you don't have the required permissions to add labels; the PR reviewer should be able to help with the task.

1 similar comment
@github-actions
Copy link
Copy Markdown

Warning: Type of PR label mismatch

To merge this PR, it requires exactly 1 label indicating the type of PR. Other labels are optional and not being checked here.

  • Required label: Any label starting with [Type].
  • Labels found: [Package] Block library.

Read more about Type labels in Gutenberg. Don't worry if you don't have the required permissions to add labels; the PR reviewer should be able to help with the task.

@github-actions
Copy link
Copy Markdown

github-actions bot commented Mar 10, 2026

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: MaggieCabrera <onemaggie@git.wordpress.org>
Co-authored-by: getdave <get_dave@git.wordpress.org>
Co-authored-by: scruffian <scruffian@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

https://github.com/WordPress/wordpress-develop/pull/11174

* https://github.com/WordPress/gutenberg/pull/75736
* https://github.com/WordPress/gutenberg/pull/76367
Copy link
Copy Markdown
Contributor Author

@MaggieCabrera MaggieCabrera Mar 11, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm updating the same core backport instead of making a new one, since it's built on top of it directly and it hasn't been merged yet

@scruffian
Copy link
Copy Markdown
Contributor

I'm a bit hesitant about this one. I think we should be moving in the direction of making navigation link and navigation submenu blocks simply variations of the same block. This will make that harder to do and moves us away from that direction. If this is a feature that we think themes will use then i might be a good compromise, however I'm struggling to think of a use case for it...

Copy link
Copy Markdown
Contributor

@getdave getdave left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

My main question is can you target the top level menu item represented by a submenu if it is current? I'm conscious it's a different block that core/navigation-link but you'd still want to be able to style the parent.

Styling menus within the submenu dropdown seems like a real edge case. Not sure if this is required but I'd defer to your theme expertise on that.

@MaggieCabrera
Copy link
Copy Markdown
Contributor Author

My main question is can you target the top level menu item represented by a submenu if it is current? I'm conscious it's a different block that core/navigation-link but you'd still want to be able to style the parent.

Styling menus within the submenu dropdown seems like a real edge case. Not sure if this is required but I'd defer to your theme expertise on that.

I've never personally needed to. That said, I don't think this PR is a must, but it certainly offers more flexibility at very little cost. I would love to hear what @WordPress/block-themers have to say about this.

@scruffian
Copy link
Copy Markdown
Contributor

My main question is can you target the top level menu item represented by a submenu if it is current? I'm conscious it's a different block that core/navigation-link but you'd still want to be able to style the parent.

Yes, the navigation-link selector also covers navigation-submenu links so it works in trunk already.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

[Block] Submenu Affects the Submenu Block - for submenus in navigation [Package] Block library /packages/block-library [Type] Enhancement A suggestion for improvement.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants