feat: add logical position aliases (top-start, top-end, bottom-start, bottom-end)

[mohamedyasser27]

Summary

Adds logical position aliases that are RTL-aware, following the CSS Logical Properties convention (similar to margin-inline-start, padding-inline-end, etc.).

New positions

Alias	LTR resolves to	RTL resolves to
top-start	top-left	top-right
top-end	top-right	top-left
bottom-start	bottom-left	bottom-right
bottom-end	bottom-right	bottom-left

How it works

A resolvePosition() helper maps the logical alias to its physical equivalent
based on the existing dir prop before the position is applied. No CSS changes
were needed — the existing data-x-position / data-y-position attributes
already handle layout correctly.

Backward compatible

Existing top-left, top-right, bottom-left, bottom-right are completely
unchanged. These are additive aliases only.

Usage

// Automatically appears on the correct side based on document direction
<Toaster position="top-end" />

// Or explicitly
<Toaster position="top-start" dir="rtl" />

Changes

• src/types.ts — added 4 new values to the Position type
• src/index.tsx — added resolvePosition() helper and applied it in Toaster

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
sonner	Error		Mar 24, 2026 7:00am