Repository navigation
feat: [toast, popover] add anchored toasts and popover arrow - #950
Merged
Merged
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Contributor
|
Warning Review limit reachedYou've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository. Next included review available in 16 minutes. View limit details
No actionable comments were generated in the recent review.
 |
| Check name | Status | Explanation |
|---|---|---|
| Description check |  |
The description directly covers the anchored toast and popover arrow changes, including implementation details, compatibility, tests, and documentation. |
| Title check | |
The title clearly and concisely identifies the two main changes: anchored toasts and a popover arrow. |
| Docstring Coverage | |
Docstring coverage is inconclusive: files from earlier reviews still need to be rechecked within the check's analysis limits. Not blocking. |
| Linked Issues check | |
Check skipped because no linked issues were found for this pull request. |
| Out of Scope Changes check | |
Check skipped because no linked issues were found for this pull request. |
- Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.
Comment @coderabbitai help to get the list of available commands.
commit: |
ravisuhag
force-pushed
the
feat/anchored-toast-popover-arrow
branch
from
October 13, 2026 07:35
fe3b858 to
7261fdc
Compare
1 task done
- Build the manager and hook methods with one wrap function. The hook finds the anchored manager through the stacked store, so ToastManagerContext is removed. - Render the anchored provider first, so hook adds in mount effects reach it. - Drop positionerProps from stacked toasts, so anchor: null keeps swipe. - Label the anchored viewport "Anchored notifications", so there is one "Notifications" region. - Hide anchored toasts over the limit or with a hidden anchor, and show newer ones on top. - Document the routing rules and fix the Popover sideOffset playground default.
- Keep the anchored Base UI manager on the toast manager under a symbol key, and put the manager in ToastManagerContext. - useToastManager reads the context instead of a WeakMap link that Toast.Provider wrote during render. - StackedToasts no longer has to render before children.
- Render an anchored toast with the tooltip surface and only its title. Add a showArrow option for the arrow, with sideOffset 4, or 10 with the arrow. - Merge positionerProps in update and in promise results, so a partial placement change keeps the anchor. Drop positionerProps from stacked toast updates. - Keep the methods from useToastManager the same when the toast list changes, so an effect that depends on add runs once.
- shared/arrow exports an Arrow component instead of a class name and an SVG. Each Base UI Arrow part renders it through the render prop. - Tooltip, Popover, anchored Toast, and PreviewCard use it. - PreviewCard drops its copy of the arrow CSS and SVG.
rohanchkrabrty
approved these changes
Oct 27, 2026
This branch was successfully deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Add anchored toasts.
toastManager.add({ title: 'Copied', positionerProps: { anchor: el } })shows the toast next toelwith an arrow. Toasts without an anchor stay in the corner stack as before.Add
showArrowtoPopover.Content(off by default). The arrow uses Tooltip's arrow styles, which move toshared/arrowso Tooltip, Popover, and Toast share one copy.Add data-slots
toast-anchored-viewport,toast-positioner,toast-arrow, andpopover-arrow, with tests and docs.Why it's like this: Toast moved to Base UI in Mar 2026 (feat: migrate Toast to Base UI #671) and only the corner toasts were ported. Base UI needs anchored toasts in a separate provider. Each Apsara manager now holds a second, internal Base UI manager, and
Toast.Providerrenders a second provider for it.addroutes bypositionerProps.anchor, andcloseandupdatego to both. This keeps onetoastManagerand oneuseToastManager(), and uses Base UI's ownpositionerPropsoption. The hook'stoastslist holds stacked toasts only. Popover's Base UI port only ported the panel it had, which never had an arrow.Breaking: no.
toastManager,useToastManager(), andcreateToastManager()keep their signatures and behavior for toasts without an anchor.I have followed the pull request section of the contributing guide.