Skip to content

feat: [toast, popover] add anchored toasts and popover arrow - #950

Open
ravisuhag wants to merge 1 commit into
mainfrom
feat/anchored-toast-popover-arrow
Open

ravisuhag wants to merge 1 commit into
mainfrom
feat/anchored-toast-popover-arrow

Conversation

@ravisuhag

Copy link
Copy Markdown
Member

Summary

  • Add anchored toasts. toastManager.add({ title: 'Copied', positionerProps: { anchor: el } }) shows the toast next to el with an arrow. Toasts without an anchor stay in the corner stack as before.

  • Add showArrow to Popover.Content (off by default). The arrow uses Tooltip's arrow styles, which move to shared/arrow so Tooltip, Popover, and Toast share one copy.

  • Add data-slots toast-anchored-viewport, toast-positioner, toast-arrow, and popover-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.Provider renders a second provider for it. add routes by positionerProps.anchor, and close and update go to both. This keeps one toastManager and one useToastManager(), and uses Base UI's own positionerProps option. The hook's toasts list holds stacked toasts only. Popover's Base UI port only ported the panel it had, which never had an arrow.

  • Breaking: no. toastManager, useToastManager(), and createToastManager() keep their signatures and behavior for toasts without an anchor.

  • I have followed the pull request section of the contributing guide.

@vercel

vercel Bot commented Oct 8, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
apsara Ready Ready Preview Oct 8, 2026 12:13am UTC

@coderabbitai

coderabbitai Bot commented Oct 8, 2026

Copy link
Copy Markdown
Contributor

Warning

Review limit reached

You'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 27 minutes.

Check out review usage here.

View limit details

Limit details: You’ve used the included review currently available.

Learn how review limits work.

Review configuration:

⚙️ Run configuration
  • Configuration used: Organization UI
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: fc8a55c2-a0d5-4bac-8039-ad7aabd88925
📥 Commits

Reviewing files that changed from the base of the PR and between 86eb92b and fe3b858.

📒 Files selected for processing (20)
  • apps/www/src/content/docs/components/popover/demo.ts
  • apps/www/src/content/docs/components/popover/index.mdx
  • apps/www/src/content/docs/components/popover/props.ts
  • apps/www/src/content/docs/components/toast/demo.ts
  • apps/www/src/content/docs/components/toast/index.mdx
  • apps/www/src/content/docs/components/toast/props.ts
  • packages/react/components/popover/__tests__/data-slots.test.tsx
  • packages/react/components/popover/popover.module.css
  • packages/react/components/popover/popover.tsx
  • packages/react/components/toast/__tests__/data-slots.test.tsx
  • packages/react/components/toast/__tests__/toast.test.tsx
  • packages/react/components/toast/toast-manager.ts
  • packages/react/components/toast/toast-provider.tsx
  • packages/react/components/toast/toast-root.tsx
  • packages/react/components/toast/toast.module.css
  • packages/react/components/tooltip/tooltip-content.tsx
  • packages/react/components/tooltip/tooltip.module.css
  • packages/react/shared/arrow/arrow.module.css
  • packages/react/shared/arrow/arrow.tsx
  • packages/react/shared/arrow/index.ts
  • Autopilot · 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.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@pkg-pr-new

pkg-pr-new Bot commented Oct 8, 2026

Copy link
Copy Markdown

Open in StackBlitz

pnpm add https://pkg.pr.new/@raystack/apsara@950

commit: fe3b858

This branch was successfully deployed

1 active deployment
Preview — fe3b8589 Deployed Oct 8, 2026 by vercel[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant