Repository navigation
Animate UI 2.4.0
Carousel, in React and Vue: a drop-in for embla-carousel-react and embla-carousel-vue, so shadcn/ui's and shadcn-vue's carousels animate like the other components (npx @animate-ui/cli@latest animate carousel).
- Set from
opts: slides that shrink away from the center, the far ones waiting behind (scale), and slides sized to show a set number (visible), in both orientations. CarouselDots(a pill stretching from one dot to the next) andCarouselCounter(a sliding number) come with it.
Code Block is now shadcn/ui's and shadcn-vue's own code block, rewritten in place by npx @animate-ui/cli@latest animate code-block: the code types itself out (evenly, or like someone typing with cadence: 'natural'), behind a cursor that pulses when it pauses, the block following the last line, with a copy button whose icon swaps and lines gliding when wrapping changes. useCodeWriting types any code out.
Bottom Navigation minimizes like a tab bar: with scrollBehavior="minimize", every item stays and shrinks to its icon, labels fold away and the accessory shrinks with the bar, the highlight staying on the selected item. Labels show on every item; show="active" keeps them beside the selected item's icon only, as before. A press on a minimized item grows the bar and selects it in one move.
Docs: Carousel · Code Block · Bottom Navigation
Fixes
- The docs' Previous and Next follow the sidebar, in React and Vue: no entry skipped, no jump to another section (#188).
Full changelog: https://animate-ui.com/docs/changelog