-
Notifications
You must be signed in to change notification settings - Fork 4.2k
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.
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
BorderControl: Promote to stable #65475
Conversation
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 If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.
To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
@youknowriad thanks for chiming in! I would love your thoughts on the props mentioned in the "For discussion" section of the description, if you have the time :) cc @WordPress/gutenberg-components too |
What does it actually do? It might be too app specific to stabilize.
I'm guessing this is mostly used to control the position of the dropdown menu. It feels like a use-case that is needed but I'm not sure what's the best API here. Having said that, we do have stable components with unstable props already. Ideally, these could be "private props" maybe until we figure out what to do with them but I also don't mind shipping as they already exist. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for putting this together @DaniGuardiola 👍
__experimentalIsRenderedInSidebar
: ... I guess this needs to be stabilized in the ColorPalette component itself, which is already stable. This prop seems to be used in many places with different values, so my hunch is that we'll want to make it stable.
+1 for stabilizing this in the ColorPalette via a separate follow-up.
__unstablePopoverProps
: ... It forwards props to Popover through Dropdown. I'm not sure what we'll want to do here. Popover is stable but some of its props are unstable.
I'm not sure about stabilizing the __unstablePopoverProps
on the BorderBoxControl
either.
It was only intended to be an internal means of passing popover props from the parent BorderBoxControl
to the inner BorderControl
components.
There some history in #40740 (comment). One option there was to try using the component context system for the components to "talk" to each other. I'm not sure what ended up happening with that approach. It might allow us to avoid stabilizing __unstablePopoverProps
and instead remove it entirely.
__experimentalIsRenderedInSidebar
...
What does it actually do? It might be too app specific to stabilize.
My understanding is that the prop adjusts positioning of the popovers to account for the sidebar which does seem to app specific too stabilize.
Ideally, these could be "private props" maybe until we figure out what to do with them
Agreed.
I've also given this a bit of a test. From a functional perspective it's looking good ✨
✅ Smoke testing in editors didn't reveal any issues
✅ Component unit tests are all passing
✅ Storybook examples for BorderControl function as expected
✅ Experimental BorderControl URL in Storybook is redirected to stable version
✅ Didn't find any further references to __experimentalBorderControl
than the export kept for BC (pending discussion)
Conceptually, I'd love to tackle the props before stabilizing the component. But:
So, practically speaking, we may want to stabilize this component and then, separately, work on the individual props. I like the idea of making them private props for the time being.
Ideally, we should get rid of this prop. The concept of the "sidebar" only makes sense in the Gutenberg app, and should be foreign to the components in the IMO, we should:
Here we should also look at what this prop is used for. If, like Aaron says, it's only used to communicate between different components in the |
I think this will be the case for many components, but if we wait until each component is perfect, some might never get stabilized. What you described on the practical side seems like the best option for me in the long term, as long as we document everything we intend to do in the future. |
I created #65581 to track those. Can I get an approval here to merge? |
+1
Thanks for creating the issue. I've given this another smoke test and it is still working well for me. In terms of overall approach, I'm happy to defer to @ciampo and @tyxla here and it appears they're happy. So I'm happy to approve this one ✅ |
Btw, anyone have any idea why those tests are failing? It's happening for E2E and React Native tests across many of my PRs, and I'm clueless as to why. I also posted in the Slack: https://wordpress.slack.com/archives/C02QB2JS7/p1727167122935539 |
I believe everything has been addressed, should be ready for merge if nothing else comes up :) |
Size Change: -29 B (0%) Total Size: 1.77 MB
ℹ️ View Unchanged
|
Unless I'm missing something, the only thing that remains is keeping the removed prop type as a deprecated / ignored one, to prevent TS errors, as @ciampo recommended. |
I added the prop type back with |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looking good from my perspective 👍
Thanks @DaniGuardiola 🚀
packages/components/src/border-control/border-control/component.tsx
Outdated
Show resolved
Hide resolved
packages/components/src/border-control/border-control/component.tsx
Outdated
Show resolved
Hide resolved
…tabilize/border-control
…tabilize/border-control
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Just flagging that this PR seems to have removed unintentionally some CHANGELOG entries.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
oof, bad automatic merge, let me put up a quick PR
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
* Export without experimental prefix * Update README * Move Storybook stories and add redirect * Add changelog entries * Fix changelog. * Fix changelog (for real?) * Fix changelog * Apply feedback. * Fix changelog * Remove alpha story. * README fix. * Fix default in README * Fix changelog * Remove `showDropdownHeader` prop and the header itself. * Added `showDropdownHeader` as deprecated. * Remove deprecation warning * Add ignores to jsdocs. Co-authored-by: DaniGuardiola <[email protected]> Co-authored-by: youknowriad <[email protected]> Co-authored-by: mirka <[email protected]> Co-authored-by: aaronrobertshaw <[email protected]> Co-authored-by: tyxla <[email protected]> Co-authored-by: jameskoster <[email protected]> Co-authored-by: ciampo <[email protected]>
This reverts commit 17b0b92.
* Export without experimental prefix * Update README * Move Storybook stories and add redirect * Add changelog entries * Fix changelog. * Fix changelog (for real?) * Fix changelog * Apply feedback. * Fix changelog * Remove alpha story. * README fix. * Fix default in README * Fix changelog * Remove `showDropdownHeader` prop and the header itself. * Added `showDropdownHeader` as deprecated. * Remove deprecation warning * Add ignores to jsdocs. Co-authored-by: DaniGuardiola <[email protected]> Co-authored-by: youknowriad <[email protected]> Co-authored-by: mirka <[email protected]> Co-authored-by: aaronrobertshaw <[email protected]> Co-authored-by: tyxla <[email protected]> Co-authored-by: jameskoster <[email protected]> Co-authored-by: ciampo <[email protected]>
What?
Part of #59418
Promote
BorderControl
to a non-experimental component.How?
__experimental
prefix.__experimental
export for backwards compatibility.__experimental
in GB and components to the one without the prefix (including in Storybook stories).id
(get it from the storybook URL) to thePREVIOUSLY_EXPERIMENTAL_COMPONENTS
const array inmanager-head.html
so that old experimental story paths are redirected to the new one.For discussion
There are two unstable/experimental props that need to be discussed @WordPress/gutenberg-components @WordPress/gutenberg-core
__experimentalIsRenderedInSidebar
: comes from theColorPalette
component that's used internally. Description: "Whether this is rendered in the sidebar". I guess this needs to be stabilized in theColorPalette
component itself, which is already stable. This prop seems to be used in many places with different values, so my hunch is that we'll want to make it stable.__unstablePopoverProps
: exclusively used inBorderBoxControl
, described as "An internal prop used to control the visibility of the dropdown". It forwards props toPopover
throughDropdown
. I'm not sure what we'll want to do here.Popover
is stable but some of its props are unstable.Are any of these safe to stabilize? Separately, should the stabilization of these props block stabilization of the component? Let me know what you think.
Edit: tracked in #65581