Loading...
Installation
Props
| Prop | Type | Default | Description |
|---|---|---|---|
events | CalendarEvent[] | [] | Array of calendar events |
onAddEvent | (event: CalendarEvent) => void | - | Callback when adding new event |
onRemoveEvent | (id: string) => void | - | Callback when removing event |
panelWidth | number | 160 | Width of each calendar panel |
panelHeight | number | 120 | Height of each calendar panel |
columns | number | 7 | Number of columns in the grid |
Usage
import {
ThreeDWallCalendar,
CalendarEvent,
} from "@/components/ui/three-dwall-calendar";
const events: CalendarEvent[] = [
{
id: "1",
title: "Meeting",
date: new Date().toISOString(),
},
];
function MyCalendar() {
const handleAddEvent = (event: CalendarEvent) => {
console.log("New event:", event);
};
const handleRemoveEvent = (id: string) => {
console.log("Remove event:", id);
};
return (
<ThreeDWallCalendar
events={events}
onAddEvent={handleAddEvent}
onRemoveEvent={handleRemoveEvent}
panelWidth={180}
panelHeight={140}
/>
);
}