diff --git a/package.json b/package.json index 89baeec..19de6b1 100644 --- a/package.json +++ b/package.json @@ -137,7 +137,7 @@ "postgres": "3.4.9", "posthog-js": "^1.431.6", "react": "19.2.4", - "react-day-picker": "9.13.2", + "react-day-picker": "10.0.1", "react-dom": "19.2.4", "react-hook-form": "7.88.0", "react-hotkeys-hook": "5.3.3", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 40fdf78..bfa600b 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -266,8 +266,8 @@ importers: specifier: 19.2.4 version: 19.2.4 react-day-picker: - specifier: 9.13.2 - version: 9.13.2(react@19.2.4) + specifier: 10.0.1 + version: 10.0.1(@types/react@19.2.18)(react@19.2.4) react-dom: specifier: 19.2.4 version: 19.2.4(react@19.2.4) @@ -4931,9 +4931,6 @@ packages: resolution: {integrity: sha512-BS8PfmtDGnrgYdOonGZQdLZslWIeCGFP9tpan0hi1Co2Zr2NKADsvGYA8XxuG/4UWgJ6Cjtv+YJnB6MM69QGlQ==} engines: {node: '>= 0.4'} - date-fns-jalali@4.1.0-0: - resolution: {integrity: sha512-hTIP/z+t+qKwBDcmmsnmjWTduxCg+5KfdqWQvb2X/8C9+knYY6epN/pfxdDuyVlSVeFz0sM5eEfwIUQ70U4ckg==} - date-fns@4.4.0: resolution: {integrity: sha512-+1UMbeh68lH1SegH83CGWwpb6OHHbpSgr3+s5Eww5M4CAgswBpoWS0AjTOfEJ33HiYKz1hdj/KTFprzXHmq/6w==} @@ -7358,11 +7355,15 @@ packages: resolution: {integrity: sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw==} hasBin: true - react-day-picker@9.13.2: - resolution: {integrity: sha512-IMPiXfXVIAuR5Yk58DDPBC8QKClrhdXV+Tr/alBrwrHUw0qDDYB1m5zPNuTnnPIr/gmJ4ChMxmtqPdxm8+R4Eg==} + react-day-picker@10.0.1: + resolution: {integrity: sha512-eNh6BlwcYInWaJtRv18mXQ06Ys/H6rdTZAnTaSdOYJuTpwP1JMCHNd1FDRadA+gbeinq+psdULN5Xnowy9mV8w==} engines: {node: '>=18'} peerDependencies: + '@types/react': '>=16.8.0' react: 19.2.4 + peerDependenciesMeta: + '@types/react': + optional: true react-dom@19.2.4: resolution: {integrity: sha512-AXJdLo8kgMbimY95O2aKQqsz2iWi9jMgKJhRBAxECE4IFxfcazB2LmzloIoibJI3C12IlY20+KFaLv+71bUJeQ==} @@ -13395,8 +13396,6 @@ snapshots: es-errors: 1.3.0 is-data-view: 1.0.2 - date-fns-jalali@4.1.0-0: {} - date-fns@4.4.0: {} debounce@1.2.1: {} @@ -16147,12 +16146,13 @@ snapshots: minimist: 1.2.8 strip-json-comments: 2.0.1 - react-day-picker@9.13.2(react@19.2.4): + react-day-picker@10.0.1(@types/react@19.2.18)(react@19.2.4): dependencies: '@date-fns/tz': 1.4.1 date-fns: 4.4.0 - date-fns-jalali: 4.1.0-0 react: 19.2.4 + optionalDependencies: + '@types/react': 19.2.18 react-dom@19.2.4(react@19.2.4): dependencies: diff --git a/src/components/ui/calendar.tsx b/src/components/ui/calendar.tsx index a77b2df..7ea61c4 100644 --- a/src/components/ui/calendar.tsx +++ b/src/components/ui/calendar.tsx @@ -9,6 +9,9 @@ import { ChevronLeftIcon, ChevronRightIcon } from "@radix-ui/react-icons" export type CalendarProps = React.ComponentProps +// Written against the react-day-picker v9/v10 API (classNames keys and the Chevron +// component). The pre-v9 keys (caption, nav_button, head_row, cell, day_selected, ...) and +// IconLeft/IconRight are gone in v10 and were already ignored at runtime by v9. function Calendar({ className, classNames, @@ -22,50 +25,50 @@ function Calendar({ classNames={{ months: "flex flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0", month: "space-y-4", - caption: "flex justify-center pt-1 relative items-center", + month_caption: "flex justify-center pt-1 relative items-center", caption_label: "text-sm font-medium", nav: "space-x-1 flex items-center", - nav_button: cn( + button_previous: cn( buttonVariants({ variant: "outline" }), - "h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100" + "h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100 absolute left-1" ), - nav_button_previous: "absolute left-1", - nav_button_next: "absolute right-1", - table: "w-full border-collapse space-y-1", - head_row: "flex", - head_cell: + button_next: cn( + buttonVariants({ variant: "outline" }), + "h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100 absolute right-1" + ), + month_grid: "w-full border-collapse space-y-1", + weekdays: "flex", + weekday: "text-muted-foreground rounded-md w-8 font-normal text-[0.8rem]", - row: "flex w-full mt-2", - cell: cn( + week: "flex w-full mt-2", + day: cn( "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", props.mode === "range" ? "[&:has(>.day-range-end)]:rounded-r-md [&:has(>.day-range-start)]:rounded-l-md first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md" : "[&:has([aria-selected])]:rounded-md" ), - day: cn( + day_button: cn( buttonVariants({ variant: "ghost" }), "h-8 w-8 p-0 font-normal aria-selected:opacity-100" ), - day_range_start: "day-range-start", - day_range_end: "day-range-end", - day_selected: + range_start: "day-range-start", + range_end: "day-range-end", + selected: "bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground", - day_today: "bg-accent text-accent-foreground", - day_outside: + today: "bg-accent text-accent-foreground", + outside: "day-outside text-muted-foreground aria-selected:bg-accent/50 aria-selected:text-muted-foreground", - day_disabled: "text-muted-foreground opacity-50", - day_range_middle: + disabled: "text-muted-foreground opacity-50", + range_middle: "aria-selected:bg-accent aria-selected:text-accent-foreground", - day_hidden: "invisible", + hidden: "invisible", ...classNames, }} components={{ - IconLeft: ({ className, ...props }) => ( - - ), - IconRight: ({ className, ...props }) => ( - - ), + Chevron: ({ className, orientation, size: _size, disabled: _disabled, ...props }) => { + const Icon = orientation === "left" ? ChevronLeftIcon : ChevronRightIcon + return + }, }} {...props} /> diff --git a/src/components/ui/date-range-picker.tsx b/src/components/ui/date-range-picker.tsx index 29fe08d..26b64a0 100644 --- a/src/components/ui/date-range-picker.tsx +++ b/src/components/ui/date-range-picker.tsx @@ -76,7 +76,7 @@ export function DatePickerWithRange({ className }: React.HTMLAttributes