Animated List
An animated list component with smooth transitions.
Installation
Usage
import { AnimatedList } from "viora-ui";import { AnimatedList } from "viora-ui";
export default function AnimatedListDemo() {
return (
<div className="flex min-h-[350px] w-full items-center justify-center p-6">
<AnimatedList />
</div>
);
}API Reference
PlaceItem
| Prop | Type | Default | Description |
|---|---|---|---|
| id | number | - | Configuration for id. |
| name | string | - | Configuration for name. |
| type | string | - | Configuration for type. |
| status | string | - | Configuration for status. |
| icon | React.ComponentType<{ size?: number; className?: string }> | - | Configuration for icon. |
| pinned? | boolean | false | Configuration for pinned. |
PinItemComponent
| Prop | Type | Default | Description |
|---|---|---|---|
| items? | PlaceItem[] | [] | List of items to render. |
| autoPlay? | boolean | false | Whether to automatically cycle through items. |
Built by Otis
Last updated: 10/12/2026