Usage
automatic uses Popover on desktop and Drawer on mobile. Pass trigger when type is not raw.
TSXcalendar
1import { Button, Calendar } from "@quan-erp/shared-ui";
2import { Calendar as CalendarIcon } from "lucide-react";
3
4// Raw (standard Shadcn)
5<Calendar mode="single" selected={date} onSelect={setDate} />
6
7// Automatic responsive overlay
8<Calendar
9 type="automatic"
10 mode="single"
11 selected={date}
12 onSelect={setDate}
13 trigger={
14 <Button variant="outline">
15 <CalendarIcon className="mr-2 h-4 w-4" />
16 {date ? date.toLocaleDateString() : "Pick a date"}
17 </Button>
18 }
19/>