Repository navigation
[docs][popover] Add close button to demos - #6095
aarongarciah wants to merge 1 commit into
Conversation
The demos looked like tooltips or toasts and never rendered Popover.Close, so screen reader users could only dismiss them with Escape. Every demo now has an X close button, the hero-based demos use shipping copy with a link, and the animating demo's panels are renamed to Shipping, Returns and Profile. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
commit: |
Bundle size
PerformanceTotal duration: 375.22 ms -11.58 ms(-3.0%) | Renders: 75 (+0) | Paint: 685.91 ms -32.14 ms(-4.5%) No significant changes — details Check out the code infra dashboard for more information about this PR. |
aarongarciah
added
docs
✅ Deploy Preview for base-ui ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
|
@jjenzz how does this feel? I tried to keep it simple and avoid a form inside the popover by having a link. |
aarongarciah
changed the title
|
@aarongarciah much better !! thank you :) this has made me wonder if we should make the button an "info" icon button which is a really common use-case for these? also, have you tried opening it with a keyboard? it autofocuses the link atm which felt a bit jarring at first (focus outline). I understand why, but dno, should we make it focus the popover on open instead? |
Preview: https://deploy-preview-6095--base-ui.netlify.app/react/components/popover
The Popover demos looked like tooltips or toasts and never rendered
Popover.Close, so screen reader users could only dismiss them with Escape. Every demo now has an X close button, last in the DOM.