Skip to content

add logic for custom color boolean for borders#72402

Open
n8finch wants to merge 2 commits intoWordPress:trunkfrom
n8finch:bugfix/respect-custom-color-boolean-from-theme-json
Open

add logic for custom color boolean for borders#72402
n8finch wants to merge 2 commits intoWordPress:trunkfrom
n8finch:bugfix/respect-custom-color-boolean-from-theme-json

Conversation

@n8finch
Copy link

@n8finch n8finch commented Oct 16, 2025

First PR for Gutenberg, woohoo!

What?

Closes #59567

This PR fixes the disableCustomColors prop that was not being set in the BorderBoxControl element.

Why?

If the custom color setting is disabled in the theme.json the BorderBoxControl element was not picking up on that setting.

The setting was respected when picking text and background colors though, as these use the ColorPanelDropdown element.

How?

This PR adds a local method to the BorderBoxControl element and checks for the theme setting in a similar manner that other settings are being checked and set.

I've tried to make it as close as possible to the implementation in the ColorPanelDropdown element, see related code:

Testing Instructions

  1. Make sure you're working with a custom theme.json file, and that you have the settings.color.custom property set to false (see screenshots)
  2. Open the Outline for the block editor
  3. Insert or select a Group Block
  4. Open the right sidebar Inspector
  5. Scroll to the "Border & Shadow" panel section
  6. Click on the Border button trigger (see screenshots)
  7. You should not see the custom color picker
  8. Change the value in the theme.json to be true or remove it completely, reload the page, and repeat steps 3 to 6, at this point you should see the custom color picker.

Testing Instructions for Keyboard

  1. Make sure you're working with a custom theme.json file, and that you have the settings.color.custom property set to false (see screenshots)
  2. Tab to select the group block in the block editor or Outline
  3. Open the Inspector with CMD + Shift + , on a Mac or Ctrl + Shift + , on a PC.
  4. Tab until you get to the Border button trigger labeled Border color and style picker
  5. Hit Enter or Spacebar on your keyboard
  6. You should not be able to see or select the custom color picker
  7. Change the value in the theme.json to be true or remove it completely, reload the page, and repeat steps 3 to 6, at this point you should see the custom color picker.

Screenshots or screencast

Before After
customcolors-before customcolors-after

Also note that it respects setting to true and if it's removed

True Removed
customcolors-after-true customcolors-after-null

@n8finch n8finch requested a review from ellatrix as a code owner October 16, 2025 18:06
@github-actions
Copy link

github-actions bot commented Oct 16, 2025

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.

  • Type-related labels to choose from: [Type] Automated Testing, [Type] Breaking Change, [Type] Bug, [Type] Build Tooling, [Type] Code Quality, [Type] Copy, [Type] Developer Documentation, [Type] Enhancement, [Type] Experimental, [Type] Feature, [Type] New API, [Type] Task, [Type] Technical Prototype, [Type] Performance, [Type] Project Management, [Type] Regression, [Type] Security, [Type] WP Core Ticket, Backport from WordPress Core, Gutenberg Plugin, New Block.
  • Labels found: First-time Contributor.

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

github-actions bot commented Oct 16, 2025

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.

Unlinked Accounts

The following contributors have not linked their GitHub and WordPress.org accounts: @n8finch@git.wordpress.org, @snibe.

Contributors, please read how to link your accounts to ensure your work is properly credited in WordPress releases.

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

Unlinked contributors: n8finch@git.wordpress.org, snibe.

Co-authored-by: annezazu <annezazu@git.wordpress.org>
Co-authored-by: cbravobernal <cbravobernal@git.wordpress.org>
Co-authored-by: vraja-pro <vrajadas@git.wordpress.org>
Co-authored-by: n8finch <n8finch@git.wordpress.org>
Co-authored-by: andreawetzel <awetz583@git.wordpress.org>

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

@github-actions github-actions bot added the First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository label Oct 16, 2025
@github-actions
Copy link

👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @n8finch! In case you missed it, we'd love to have you join us in our Slack community.

If you want to learn more about WordPress development in general, check out the Core Handbook full of helpful information.

@n8finch n8finch force-pushed the bugfix/respect-custom-color-boolean-from-theme-json branch from a0dc8ae to 4766831 Compare October 16, 2025 21:12
@n8finch n8finch requested a review from ajitbohra as a code owner October 16, 2025 21:48
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Border allows custom color picker even when custom color is set to false in theme.json

1 participant