feat(theme): add motion easing tokens and reduced-motion support

[benjamincanac]

🔗 Linked issue

❓ Type of change

• 📖 Documentation (updates to the documentation or readme)
• 🐞 Bug fix (a non-breaking change that fixes an issue)
• 👌 Enhancement (improving an existing functionality)
• ✨ New feature (a non-breaking change that adds functionality)
• 🧹 Chore (updates to the build process or auxiliary tools and libraries)
• ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

📚 Description

Refines the motion across overlay components and introduces shared, overridable easing tokens.

Motion tokens. Adds two CSS variables in index.css:

• --ui-ease-out (cubic-bezier(0.23, 1, 0.32, 1)) drives the enter and exit transitions of overlays, accordion and collapsible.
• --ui-ease-fluid (cubic-bezier(0.32, 0.72, 0, 1)) is the iOS style curve used by the Slideover slide.

Easing fixes. Every overlay was exiting with ease-in, which starts slow and delays the feedback when the user dismisses. All exits now use the ease-out token so closing feels immediate, and entrances adopt the same token for consistency. The Slideover moves on the fluid curve instead of ease-in-out (no lazy start on open), and the NavigationMenu content panels use ease-out so they no longer linger on exit.

Reduced motion. Adds a prefers-reduced-motion block in keyframes.css that turns the scale and slide presence animations into simple fades, while keeping the accordion and collapsible height reveal that aids comprehension. Decorative loops (marquee, shimmer, progress, table) were already gated.

Docs. Documents the new tokens on the CSS Variables page under a new Easing section.

All changes are non breaking: no props, slots or override APIs change, only animation values and additive tokens. Note the 4.11+ version badge on the docs section is a placeholder, adjust it to whichever release ships this.

📝 Checklist

• I have linked an issue or discussion.
• I have updated the documentation accordingly.

[coderabbitai]

📝 Walkthrough

Walkthrough

Adds configurable --ui-ease-out and --ui-ease-fluid CSS variables with documentation and override guidance. Updates component theme animation classes to use the shared easing values, including slideovers and overlays. Adds reduced-motion keyframe overrides that remove scale and translation while preserving opacity animations.

Estimated code review effort: 3 (Moderate) | ~20 minutes

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Title check	✅ Passed	The title matches the main change: new motion easing tokens and reduced-motion support in theme animations.
Description check	✅ Passed	The description clearly covers the same easing tokens, motion updates, reduced-motion behavior, and docs changes in the PR.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feat/motion-easing-tokens

---

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

• X
• Mastodon
• Reddit
• LinkedIn

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