close
Skip to content

Fix Color Picker Angle Reset on Gradient Type Change#76595

Merged
ciampo merged 11 commits intoWordPress:trunkfrom
Vedant-Gandhi:fix/color-picker-gradient-angle-reset
Mar 19, 2026
Merged

Fix Color Picker Angle Reset on Gradient Type Change#76595
ciampo merged 11 commits intoWordPress:trunkfrom
Vedant-Gandhi:fix/color-picker-gradient-angle-reset

Conversation

@Vedant-Gandhi
Copy link
Copy Markdown
Contributor

@Vedant-Gandhi Vedant-Gandhi commented Mar 17, 2026

What?

Closes #72433

Why?

When we switch the gradient type in color picket from linear to radial and then back to linear the selected angle in linear resets.

How?

Add logic to memoize the last angle selected.

Demo

20260317223909525.mp4

@github-actions github-actions bot added the [Package] Components /packages/components label Mar 17, 2026
@Vedant-Gandhi Vedant-Gandhi marked this pull request as ready for review March 17, 2026 17:10
@Vedant-Gandhi Vedant-Gandhi requested review from a team and ajitbohra as code owners March 17, 2026 17:10
@github-actions
Copy link
Copy Markdown

github-actions bot commented Mar 17, 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: Vedant-Gandhi <vedantgandhi28@git.wordpress.org>
Co-authored-by: mirka <0mirka00@git.wordpress.org>
Co-authored-by: ciampo <mciampini@git.wordpress.org>
Co-authored-by: patrickwc <patrickwclanden@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
Copy link
Copy Markdown

👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @Vedant-Gandhi! 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.

@github-actions github-actions bot added the First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository label Mar 17, 2026
@ciampo ciampo requested a review from Copilot March 17, 2026 17:12
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull request overview

This PR updates the CustomGradientPicker’s gradient type switching logic so that when a user switches from linear → radial → linear, the previously selected linear angle is preserved instead of resetting.

Changes:

  • Add a useRef-backed “last linear orientation” cache in GradientTypePicker.
  • When switching back to linear-gradient, restore the cached orientation (or fall back to the default angle).
  • Clean up constants imports related to the previous orientation defaulting behavior.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

@mirka mirka added the [Type] Enhancement A suggestion for improvement. label Mar 17, 2026
Copy link
Copy Markdown
Member

@mirka mirka left a comment

Choose a reason for hiding this comment

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

Approach looks good overall 👍 Can we also add tests to cover this new behavior?

The native counterpart (index.native.js) has the same pattern of stripping orientation when switching to radial, so it likely has the same issue. Out of scope for this PR, but worth noting here. Maybe it's fine to leave it that way, since we're migrating away from the React Native implementation.

@Vedant-Gandhi Vedant-Gandhi requested review from ciampo and mirka March 19, 2026 03:45
Copy link
Copy Markdown
Contributor

@ciampo ciampo left a comment

Choose a reason for hiding this comment

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

LGTM 🚀 Thank you for working on this!

We can merge after last CHANGELOG feedback is addressed

@ciampo ciampo enabled auto-merge (squash) March 19, 2026 10:11
@ciampo ciampo disabled auto-merge March 19, 2026 10:47
@ciampo
Copy link
Copy Markdown
Contributor

ciampo commented Mar 19, 2026

E2E failures don't seem related, merging anyway when all remaining tests have passed.

@ciampo ciampo merged commit 74f5433 into WordPress:trunk Mar 19, 2026
39 of 40 checks passed
@github-actions github-actions bot added this to the Gutenberg 22.9 milestone Mar 19, 2026
adamsilverstein pushed a commit that referenced this pull request Mar 31, 2026
* fix: import sequence

* fix: remove typefixture for AngleControl

* feat: add test cases

* doc: add public facing component to changelog instead of gradient picker

* fix: restore default linear gradient orientation as horizontal

* feat: update test case to set horizontal gradient as default

* feat: update test case default result to be more generic

* feat: improve restore test case to use a non-default value

* refactor: move changelog to unrelease section

* doc: add bug fixes section in changelog

---

Co-authored-by: Vedant-Gandhi <vedantgandhi28@git.wordpress.org>
Co-authored-by: mirka <0mirka00@git.wordpress.org>
Co-authored-by: ciampo <mciampini@git.wordpress.org>
Co-authored-by: patrickwc <patrickwclanden@git.wordpress.org>
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 [Package] Components /packages/components [Type] Enhancement A suggestion for improvement.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add a default linear gradient degree setting in the GradientPicker

4 participants