Migration

Upgrade guidance for major changes

0.6.x → 0.7.0

Button moved from ten flat variants to two orthogonal axes — variant (visual weight) × tone (meaning). Nothing breaks: every v0.6 name still works as a deprecated alias with the same rendered look. Migrate at your own pace:

Snippet

// before                          // after
<Button variant="bold">     →     <Button>                      (solid primary is the default)
<Button variant="success">  →     <Button tone="success">
<Button variant="danger">   →     <Button tone="danger">
<Button variant="subtle">   →     <Button variant="soft">
<Button variant="text">     →     <Button variant="link">
<Button variant="nav">      →     <Button variant="ghost">
<Button variant="icon">     →     <Button variant="ghost" iconOnly>

Only custom CSS keyed on the old DOM attributes needs attention: data-variant now carries the resolved weight (solid, soft, outline, ghost, link, glass) and data-tone the color — e.g. [data-variant='bold'] becomes [data-variant='solid'], and the old success/danger variants are [data-variant='solid'][data-tone='success'].

0.1.x → 0.2.0+

0.2.0 rebuilt the library around zero dependencies, a shipped stylesheet, and React Server Components. Most component APIs are unchanged (legacy prop names such as isOpen/onClose still work), but four changes need action:

1. Import the stylesheet (required)

Snippet

// app/layout.tsx — once, at the app root
import '@creo-team/buzz-ui/styles.css'

Components no longer rely on your Tailwind configuration or hand-written CSS variables — the stylesheet ships every token for all six themes.

2. Toasts are built in

Snippet

- import toast, { Toaster } from 'react-hot-toast'
+ import { toast, Toaster } from '@creo-team/buzz-ui/client'

The call signatures you likely use (toast.success, toast.error, toast.promise, toast.dismiss) are compatible. HotToastProvider keeps working as an alias of Toaster.

3. ESM only

The package no longer ships CommonJS. Every modern bundler (Next.js, Vite, Remix) handles this automatically; CJS require() consumers must switch to import.

4. Framer Motion animation props are gone

AnimationPresets and Modal/Dropdown animationVariants were removed — animations are CSS now. Restyle them by overriding the bz-* classes and keyframes.

The full itemized list lives in the package's CHANGELOG.