A motion-polish + docs fix patch. Every transition and animation in BoldKit now runs on a custom easing system based on the animations.dev easing blueprint. The browser's built-in ease-out / ease-in-out curves are too weak to read as "snappy" on hard neubrutalist surfaces — so they're replaced with stronger custom cubic-bezier curves, applied identically across React and Vue 3.
✨ Custom easing system
- New easing tokens in
@theme:--ease-out(out-quart),--ease-in-out(in-out-cubic),--ease-in, plus a named scale--ease-out-quad…expo/--ease-in-out-quad…quintsorted weakest→strongest. --default-transition-timing-functionis nowease-out— everytransition-*utility gets responsive motion for free, no per-element easing needed.- ~37 keyframe animations retrofitted per stylesheet (accordion, collapsible, bounce, pop, shake, wiggle, jello, …) to reference the tokens. Continuous
linearmotion (marquee, spin) and the caret blink are intentionally left as-is.
🩹 Overlays animate with intent
All 16 React + 18 Vue overlay components — Popover, Dialog, Dropdown, Tooltip, Sheet, Select, Menubar, Context Menu, Hover Card, Command, Tour, and more — now apply the custom ease-out curve on enter/exit instead of falling back to the browser default.
🐛 Docs fix
- "Theming" in the docs sidebar now opens the full-width standalone Theme Builder (
/themes) in a new tab, instead of rendering it embedded in the narrow docs column where it didn't lay out fully.
Install
The easing system ships with the theme stylesheet — re-add it to pick up the tokens:
# React
npx shadcn@latest add "https://boldkit.dev/r/styles.json"
# Vue
npx shadcn-vue@latest add "https://boldkit.dev/r/vue/styles.json"Bumps: React 3.4.0 → 3.4.1 · Vue 3.2.0 → 3.2.1
Full diff: v3.4.0...v3.4.1