Components

Record Activity Panel

Record Activity Panel component.

Client Only

Installation

pnpm dlx @docyrus/cli add @docyrus/ui-record-activity-panel
UI Primitives(2 components)
npx shadcn@latest add skeleton timeline

Usage

import { RecordActivityPanel } from "@docyrus/ui/components/record-activity-panel";
import type { RecordActivity } from "@docyrus/ui/components/record-activity-panel";

const activities: RecordActivity[] = [
  {
    id: "act-1",
    description: "Status changed from In Progress to In Review",
    shortDescription: "Status changed",
    icon: null,
    color: "#f59e0b",
    table_name: "tasks",
    operation: "STATUS_UPDATE",
    tenant_data_source_id: { id: "ds-1", name: "Tasks" },
    created_on: "2025-12-17T09:30:00Z",
    created_by: "u-alice",
    created_by_user: { firstname: "Alice", lastname: "Johnson", name: "Alice Johnson", email: "alice@docyrus.com", mobile: null },
    data_source_name: "Tasks",
    title: "Task #341"
  }
];

function Demo() {
  return <RecordActivityPanel activities={activities} />;
}

API Reference

PropTypeDefault
activitiesRecordActivity[]—
isLoadingbooleanfalse
classNamestring—

Components

ComponentDescription
RecordActivityPanelPublic export

On this page