pacnpal/thrilltrack-explorer
1
0
Fork 0
mirror of https://github.com/pacnpal/thrilltrack-explorer.git synced 2025-12-23 14:11:13 -05:00
Code Issues Packages Projects Releases Wiki Activity

Refactor: Update shadcn calendar component

Browse Source
This commit is contained in:
gpt-engineer-app[bot]
2025-10-11 23:43:11 +00:00
parent 52e50ebb5e
commit d89a259098
2 changed files with 18 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/ui/calendar.tsx
View File

@@ -11,12 +11,17 @@ function Calendar({ className, classNames, showOutsideDays = true, ...props }: C
return ( return (
<DayPicker <DayPicker
showOutsideDays={showOutsideDays} showOutsideDays={showOutsideDays}
className={cn("p-3", className)} className={cn("p-3 pointer-events-auto", className)}
classNames={{ classNames={{
months: "flex flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0", months: "flex flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0",
month: "space-y-4", month: "space-y-4",
caption: "flex justify-center pt-1 relative items-center", caption: "flex justify-center pt-1 relative items-center",
caption_label: "text-sm font-medium", caption_label: "text-sm font-medium",
caption_dropdowns: "flex justify-center gap-1",
dropdown: "px-2 py-1 rounded-md text-sm bg-background border border-input hover:bg-accent hover:text-accent-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
dropdown_month: "mr-1",
dropdown_year: "ml-1",
vhidden: "sr-only",
nav: "space-x-1 flex items-center", nav: "space-x-1 flex items-center",
nav_button: cn( nav_button: cn(
buttonVariants({ variant: "outline" }), buttonVariants({ variant: "outline" }),
@@ -28,8 +33,16 @@ function Calendar({ className, classNames, showOutsideDays = true, ...props }: C
head_row: "flex", head_row: "flex",
head_cell: "text-muted-foreground rounded-md w-9 font-normal text-[0.8rem]", head_cell: "text-muted-foreground rounded-md w-9 font-normal text-[0.8rem]",
row: "flex w-full mt-2", row: "flex w-full mt-2",
cell: "h-9 w-9 text-center text-sm p-0 relative [&:has([aria-selected].day-range-end)]:rounded-r-md [&:has([aria-selected].day-outside)]:bg-accent/50 [&:has([aria-selected])]:bg-accent first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md focus-within:relative focus-within:z-20", cell: cn(
day: cn(buttonVariants({ variant: "ghost" }), "h-9 w-9 p-0 font-normal aria-selected:opacity-100"), "relative p-0 text-center text-sm focus-within:relative focus-within:z-20",
"[&:has([aria-selected])]:bg-accent",
"[&:has([aria-selected].day-outside)]:bg-accent/50",
"[&:has([aria-selected].day-range-end)]:rounded-r-md"
),
day: cn(
buttonVariants({ variant: "ghost" }),
"h-9 w-9 p-0 font-normal aria-selected:opacity-100"
),
day_range_end: "day-range-end", day_range_end: "day-range-end",
day_selected: day_selected:
"bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground", "bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground",

6
src/components/ui/date-picker.tsx
View File

@@ -61,9 +61,7 @@ export function DatePicker({
disabled={disabled} disabled={disabled}
> >
<CalendarIcon className="mr-2 h-4 w-4" /> <CalendarIcon className="mr-2 h-4 w-4" />
<span className="truncate"> {date ? format(date, "PPP") : <span>{placeholder}</span>}
{date ? format(date, "PPP") : placeholder}
</span>
</Button> </Button>
</PopoverTrigger> </PopoverTrigger>
<PopoverContent className="w-auto p-0" align="start"> <PopoverContent className="w-auto p-0" align="start">
@@ -73,7 +71,7 @@ export function DatePicker({
onSelect={handleSelect} onSelect={handleSelect}
disabled={getDisabledDates} disabled={getDisabledDates}
initialFocus initialFocus
className="p-3 pointer-events-auto" captionLayout="dropdown-buttons"
fromYear={fromYear} fromYear={fromYear}
toYear={toYear} toYear={toYear}
/> />