ββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ β π shadcn/directory/imskyleen/animate-ui/changelog β ββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ
ββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ
β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β
import { Changelog, ChangelogItem, ChangelogItemTitle, ChangelogItemDescription, ChangelogItemVersion, ChangelogItemList, } from '@/components/docs/changelog';
<Changelog> <ChangelogItem date="2025-11-05"> <ChangelogItemVersion><ChangelogItemTitle>Components</ChangelogItemTitle>
<ChangelogItemDescription>GravityStars background component.<ChangelogItemTitle>Primitives</ChangelogItemTitle>
<ChangelogItemDescription>ImageZoom effect primitive.Accordion primitive to improve the animation.Collapsible primitive to improve the animation.Disclosure primitive to improve the animation.Accordion primitive to improve the animation.Collapsible primitive to improve the animation.<ChangelogItemTitle>Icons</ChangelogItemTitle>
<ChangelogItemDescription>gallery-horizontalgallery-horizontal-endgallery-verticalgallery-vertical-end<ChangelogItemTitle>Icons</ChangelogItemTitle>
<ChangelogItemDescription>phone-calllink-2sparklesparklespanel-bottom-closepanel-bottom-openpanel-left-closepanel-left-openpanel-right-closepanel-right-openpanel-top-closepanel-top-open<ChangelogItemTitle>Icons</ChangelogItemTitle>
<ChangelogItemDescription>between-horizontal-endbetween-horizontal-startbetween-vertical-endbetween-vertical-start<ChangelogItemTitle>Primitives</ChangelogItemTitle>
<ChangelogItemDescription>Menu primitive.DropdownMenu primitive to fix the keyboard navigation.<ChangelogItemTitle>Components</ChangelogItemTitle>
<ChangelogItemDescription>Menu component.<ChangelogItemTitle>Icons</ChangelogItemTitle>
<ChangelogItemDescription>arrow-up-down<ChangelogItemTitle>Icons</ChangelogItemTitle>
<ChangelogItemDescription>circuit-boardclipboardclipboard-checkclipboard-listlist<ChangelogItemTitle>Components</ChangelogItemTitle>
<ChangelogItemDescription>RadialNav community component by @arhamkhnz.<ChangelogItemTitle>Primitives</ChangelogItemTitle>
<ChangelogItemDescription>Tilt effect primitive.<ChangelogItemTitle>Icons</ChangelogItemTitle>
<ChangelogItemDescription>fanaxis-3dblendsignalsignal-highsignal-mediumsignal-lowsignal-zerowifi-zeroscissorsscissors-line-dashedroute<ChangelogItemTitle>Primitives</ChangelogItemTitle>
<ChangelogItemDescription>Radio primitive.<ChangelogItemTitle>Components</ChangelogItemTitle>
<ChangelogItemDescription>Radio component.<ChangelogItemTitle>Docs</ChangelogItemTitle>
<ChangelogItemDescription>The entire documentation design has been revised to give it a more modern look and make it more user-friendly.
</ChangelogItemDescription> </ChangelogItem> <ChangelogItem date="2025-09-24"> <ChangelogItemVersion><ChangelogItemTitle>Primitives</ChangelogItemTitle>
<ChangelogItemDescription>Shine effect primitive.<ChangelogItemTitle>Icons</ChangelogItemTitle>
<ChangelogItemDescription>AnimateIcon component.onAnimateChange, onAnimateStart, and onAnimateEnd events, which added complexity and caused many bugs for very limited utility.completeOnStop property.blocksframeplug-zapradioradio-towernfcpaperclipunplugev-chargerlinksliders-horizontalsliders-verticalequal-notcircle-check-bigrouter<ChangelogItemTitle>Primitives</ChangelogItemTitle>
<ChangelogItemDescription>Click effect primitive.SlidingNumber and CountingNumber primitives to add the initiallyStable prop.Counter primitive and component.<ChangelogItemTitle>Primitives and Components</ChangelogItemTitle>
<ChangelogItemDescription>Radix UI:
AlertDialog primitive and component.Base UI:
AlertDialog primitive and component.Dialog primitive and component.<ChangelogItemTitle>Primitives</ChangelogItemTitle>
<ChangelogItemDescription>mode. This allows you to adjust the animation for resizing tab content according to your needs.MorphingText primitive.<ChangelogItemTitle>Accessibility</ChangelogItemTitle>
<ChangelogItemDescription>We have added documentation for accessibility with Animate UI.
</ChangelogItemDescription> </ChangelogItem> <ChangelogItem date="2025-09-13"> <ChangelogItemVersion><ChangelogItemTitle>Icons</ChangelogItemTitle>
<ChangelogItemDescription>checkcheck-checkcheck-linecircle-checkclapperboardcroplocklock-keyholelock-openlock-keyhole-open<ChangelogItemTitle>Primitives</ChangelogItemTitle>
<ChangelogItemDescription>AutoHeight effect primitive.Tabs primitive.Tabs primitive.Tabs primitive.Tabs primitive.This update has made the auto-height of tables more fluid and added the AutoHeight effect.
<ChangelogItemTitle>Icons</ChangelogItemTitle>
<ChangelogItemDescription>AnimateIcon component, notably for the loop and loopDelay props, but also to fix some bugs and add an initialOnAnimateEnd prop.cloud-drizzlecloud-hailcloud-lightningcloud-mooncloud-moon-raincloud-raincloud-rain-windcloud-snowcloud-suncloud-sun-rainmoonmoon-starorbitsunsun-dimsun-mediumsun-moon<ChangelogItemTitle>Primitives</ChangelogItemTitle>
<ChangelogItemDescription>Tabs primitive.<ChangelogItemTitle>Components</ChangelogItemTitle>
<ChangelogItemDescription>Tabs component based on the Tabs primitive.<ChangelogItemTitle>Primitives</ChangelogItemTitle>
<ChangelogItemDescription>ThemeToggler effect primitive.<ChangelogItemTitle>Components</ChangelogItemTitle>
<ChangelogItemDescription>ThemeTogglerButton button component based on the ThemeToggler effect primitive.Animate UI is no longer in beta.
In order to make Animate UI more accessible and simpler, we are introducing a new organization. Animate UI is now divided into three parts:
All components have been reworked to be improved and optimized.
<Callout type="info"> **Note:** This update contains significant changes compared to the last beta version. As Animate UI is no longer in beta, this structure should remain stable over time. We recommend that you use only the components in this new version. </Callout> </ChangelogItemDescription><ChangelogItemTitle>Primitives</ChangelogItemTitle>
<ChangelogItemDescription>Animate UI:
AvatarGroup primitive.CodeBlock primitive.Counter primitive.Cursor primitive.GithubStars primitive.MotionGrid primitive.PinnedList primitive.ScrollProgress primitive.Slot primitive.Spring primitive.Tabs primitive.Tooltip primitive.Radix UI:
Accordion primitive.Checkbox primitive.Collapsible primitive.Dialog primitive.DropdownMenu primitive.Files primitive.HoverCard primitive.Popover primitive.Progress primitive.RadioGroup primitive.Sheet primitive.Sidebar primitive.Switch primitive.Tabs primitive.Toggle primitive.ToggleGroup primitive.Tooltip primitive.Base UI:
Accordion primitive.Checkbox primitive.Collapsible primitive.Files primitive.Popover primitive.PreviewCard primitive.Progress primitive.Switch primitive.Toggle primitive.ToggleGroup primitive.Tooltip primitive.Headless UI:
Checkbox primitive.Dialog primitive.Disclosure primitive.Popover primitive.Switch primitive.Tabs primitive.Buttons:
Button primitive.FlipButton primitive.LiquidButton primitive.RippleButton primitive.Texts:
ScrollingNumber primitive.All other texts have been updated to be optimized and fix some bugs.
Effects:
Blur primitive.Fade primitive.Particles primitive.Slide primitive.Zoom primitive.All other effects have been updated to be optimized and fix some bugs.
</ChangelogItemDescription><ChangelogItemTitle>Components</ChangelogItemTitle>
<ChangelogItemDescription>Animate UI:
All components have been reworked to use the new animated primitives.
Radix UI:
Toggle component.All other components have been reworked to use the new animated primitives.
Base UI:
Files component.Toggle component.All other components have been reworked to use the new animated primitives.
Headless UI:
All components have been reworked to use the new animated primitives.
Buttons:
Button component.All other components have been reworked to use the new animated primitives.
Backgrounds:
No changes to backgrounds.
Community:
The new community category contains animated components contributed by the community. Unlike other Animate UI components, they arenβt required to use our primitives, so their APIs may vary and some may offer limited configuration (few or no props).
The goal is to make it easy for anyone to publish and share animated components with the community.
<ChangelogItemTitle>Icons</ChangelogItemTitle>
The AnimateIcon wrapper has been updated to fix some bugs and add 4 new props:
animateOnViewanimateOnViewMarginanimateOnViewOncedelayThere are 24 new icons:
accessibilityairplaybinaryterminalbadge-checkcastcctvchart-barchart-bar-increasingchart-bar-decreasingchart-columnchart-column-increasingchart-column-decreasingchart-linechart-no-axes-columnchart-no-axes-column-increasingchart-no-axes-column-decreasingchart-scatterchart-splinecontrastcrossellipsisellipsis-verticalparty-popper<ChangelogItemTitle>Changelog</ChangelogItemTitle>
<ChangelogItemDescription>Now, all changes will be detailed month by month and version by version on this page for greater transparency.
</ChangelogItemDescription><ChangelogItemTitle>Roadmap</ChangelogItemTitle>
<ChangelogItemDescription>We have added a roadmap page to give you more visibility into the future of Animate UI. This may evolve over time.
See the roadmap page here.
</ChangelogItemDescription><ChangelogItemTitle>Shadcn CLI V3</ChangelogItemTitle>
<ChangelogItemDescription>We have updated our installation method to use the new feature of CLI shadcn/ui version 3. Now, to install a component, you can use @animate-ui/[type]-[category]-[name]. For example, to install the Base UI accordion primitive, you can use @animate-ui/primitives-base-accordion.
See the getting started guide here.
</ChangelogItemDescription><ChangelogItemTitle>MCP</ChangelogItemTitle>
<ChangelogItemDescription>We have updated the MCP page to show you how to use the MCP shadcn/ui with Animate UI.
See the MCP page here.
</ChangelogItemDescription><ChangelogItemTitle>Other animated distributions</ChangelogItemTitle>
<ChangelogItemDescription>We have added a page to show you other animated distributions that you can use with Animate UI.
</ChangelogItemDescription> </ChangelogItem> </Changelog>β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β β
ββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ