Activity
A chronological feed of activity events. Supports a divider between items and RTL.
<Activity items={items} divider />Installation
npx sdaia-ui@latest add activity
Usage
import { Activity } from "@/components/ui/activity"<Activity />Examples
Default
An activity feed showing a list of recent events.
<Activity items={[ { type: 'text', title: 'User Name', subtext: '2 min ago', helperText: 'Activity description', unread: true }, { type: 'text', title: 'User Name', subtext: '5 min ago', helperText: 'Activity description', unread: true }, { type: 'text', title: 'User Name', subtext: '10 min ago', helperText: 'Activity description', unread: false },With Divider
Activity feed with dividers separating each event.
<Activity divider items={[ { type: 'text', title: 'User Name', subtext: '2 min ago', helperText: 'Activity description', unread: true }, { type: 'text', title: 'User Name', subtext: '5 min ago', helperText: 'Activity description', unread: true },API Reference
ActivityProps
Props for the Activity component.
Prop | Type | Default | Required |
|---|---|---|---|
items | ActivityItemProps[] | - | required |
divider | boolean | false | optional |
rtl | boolean | false | optional |