fix: fix build error on calendar ui

This commit is contained in:
Sosokker 2024-11-04 09:50:48 +07:00
parent b316f5470c
commit 3beb6e2c72
3 changed files with 61 additions and 45 deletions

53
package-lock.json generated
View File

@ -45,6 +45,7 @@
"next-themes": "^0.3.0", "next-themes": "^0.3.0",
"react": "^18", "react": "^18",
"react-countup": "^6.5.3", "react-countup": "^6.5.3",
"react-day-picker": "^9",
"react-dom": "^18", "react-dom": "^18",
"react-file-icon": "^1.5.0", "react-file-icon": "^1.5.0",
"react-hook-form": "^7.53.0", "react-hook-form": "^7.53.0",
@ -453,6 +454,11 @@
"node": ">=6.9.0" "node": ">=6.9.0"
} }
}, },
"node_modules/@date-fns/tz": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/@date-fns/tz/-/tz-1.2.0.tgz",
"integrity": "sha512-LBrd7MiJZ9McsOgxqWX7AaxrDjcFVjWH/tIKJd7pnR7McaslGYOP1QmmiBXdJH/H/yLCT+rcQ7FaPBUxRGUtrg=="
},
"node_modules/@eslint-community/eslint-utils": { "node_modules/@eslint-community/eslint-utils": {
"version": "4.4.1", "version": "4.4.1",
"resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.1.tgz", "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.1.tgz",
@ -2020,9 +2026,9 @@
} }
}, },
"node_modules/@supabase-cache-helpers/postgrest-react-query": { "node_modules/@supabase-cache-helpers/postgrest-react-query": {
"version": "1.10.1", "version": "1.11.0",
"resolved": "https://registry.npmjs.org/@supabase-cache-helpers/postgrest-react-query/-/postgrest-react-query-1.10.1.tgz", "resolved": "https://registry.npmjs.org/@supabase-cache-helpers/postgrest-react-query/-/postgrest-react-query-1.11.0.tgz",
"integrity": "sha512-BGGrEKue6mSH0el1iO1+iOSuyGqQxsHQ2B8dXWlDvYGmU7rmw5AGqXqDWngMBX68LcoHVJEogdbXP0pH4+1Tuw==", "integrity": "sha512-qJoFfdqfuYTXvmuzPO7ggAoxTmsuufmuZWkI8kMWhceItp+AOdvTzU7AmbVUxMAUBm3e8qSSj3Li7Saj77fFyA==",
"dependencies": { "dependencies": {
"@supabase-cache-helpers/postgrest-core": "0.8.1", "@supabase-cache-helpers/postgrest-core": "0.8.1",
"flat": "6.0.1" "flat": "6.0.1"
@ -2162,18 +2168,18 @@
} }
}, },
"node_modules/@tanstack/query-devtools": { "node_modules/@tanstack/query-devtools": {
"version": "5.58.0", "version": "5.59.19",
"resolved": "https://registry.npmjs.org/@tanstack/query-devtools/-/query-devtools-5.58.0.tgz", "resolved": "https://registry.npmjs.org/@tanstack/query-devtools/-/query-devtools-5.59.19.tgz",
"integrity": "sha512-iFdQEFXaYYxqgrv63ots+65FGI+tNp5ZS5PdMU1DWisxk3fez5HG3FyVlbUva+RdYS5hSLbxZ9aw3yEs97GNTw==", "integrity": "sha512-Gw+3zsADpqiYgx/6MMr9bP1+x2LR8vOuGjo5Un/89qwwP3z7WAHPWFagLFDYkLq68NX7ekUpW/EOYlUMugMXGA==",
"funding": { "funding": {
"type": "github", "type": "github",
"url": "https://github.com/sponsors/tannerlinsley" "url": "https://github.com/sponsors/tannerlinsley"
} }
}, },
"node_modules/@tanstack/react-query": { "node_modules/@tanstack/react-query": {
"version": "5.59.17", "version": "5.59.19",
"resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.59.17.tgz", "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.59.19.tgz",
"integrity": "sha512-2taBKHT3LrRmS9ttUOmtaekVOXlZ5JXzNhL9Kmi6BSBdfIAZwEinMXZ8hffVuDpFoRCWlBaGcNkhP/zXgzq5ow==", "integrity": "sha512-xLRfyFyQOFcLltKCds0LijfC6/HQJrrTTnZB8ciyn74LIkVAm++vZJ6eUVG20RmJtdP8REdy7vSOYW4M3//XLA==",
"dependencies": { "dependencies": {
"@tanstack/query-core": "5.59.17" "@tanstack/query-core": "5.59.17"
}, },
@ -2186,18 +2192,18 @@
} }
}, },
"node_modules/@tanstack/react-query-devtools": { "node_modules/@tanstack/react-query-devtools": {
"version": "5.59.17", "version": "5.59.19",
"resolved": "https://registry.npmjs.org/@tanstack/react-query-devtools/-/react-query-devtools-5.59.17.tgz", "resolved": "https://registry.npmjs.org/@tanstack/react-query-devtools/-/react-query-devtools-5.59.19.tgz",
"integrity": "sha512-P5lRlPmSKXQZ+pzVFPMCrwKPyRtUk/yggtuceB435JPLiaP7UGoO6JQfSsaXHnVC9+LzRMYJjIEq6zm+1HteeQ==", "integrity": "sha512-mYFWTHLtJr2HdyYPZPzzvQ2ksCsSL6L04fCtusPFD3waskXrtmvWvyuDIGeEGdVAYS0Urwxw/0sYvcTVQZH+zQ==",
"dependencies": { "dependencies": {
"@tanstack/query-devtools": "5.58.0" "@tanstack/query-devtools": "5.59.19"
}, },
"funding": { "funding": {
"type": "github", "type": "github",
"url": "https://github.com/sponsors/tannerlinsley" "url": "https://github.com/sponsors/tannerlinsley"
}, },
"peerDependencies": { "peerDependencies": {
"@tanstack/react-query": "^5.59.17", "@tanstack/react-query": "^5.59.19",
"react": "^18 || ^19" "react": "^18 || ^19"
} }
}, },
@ -8425,6 +8431,25 @@
"react": ">= 16.3.0" "react": ">= 16.3.0"
} }
}, },
"node_modules/react-day-picker": {
"version": "9.2.1",
"resolved": "https://registry.npmjs.org/react-day-picker/-/react-day-picker-9.2.1.tgz",
"integrity": "sha512-rCoK4oJi9NBXt1nNdQFSa7gBG+hWsqVCtoLFLxvMzkVxDp+rSqsuUQ0LccJyLigwp/hX8XnAokTsT03+5lbjyA==",
"dependencies": {
"@date-fns/tz": "^1.1.2",
"date-fns": "^4.1.0"
},
"engines": {
"node": ">=18"
},
"funding": {
"type": "individual",
"url": "https://github.com/sponsors/gpbl"
},
"peerDependencies": {
"react": ">=16.8.0"
}
},
"node_modules/react-dom": { "node_modules/react-dom": {
"version": "18.3.1", "version": "18.3.1",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",

View File

@ -47,7 +47,7 @@
"next-themes": "^0.3.0", "next-themes": "^0.3.0",
"react": "^18", "react": "^18",
"react-countup": "^6.5.3", "react-countup": "^6.5.3",
"react-day-picker": "8.10.1", "react-day-picker": "^9",
"react-dom": "^18", "react-dom": "^18",
"react-file-icon": "^1.5.0", "react-file-icon": "^1.5.0",
"react-hook-form": "^7.53.0", "react-hook-form": "^7.53.0",

View File

@ -1,20 +1,15 @@
"use client" "use client";
import * as React from "react" import * as React from "react";
import { ChevronLeft, ChevronRight } from "lucide-react" import { ChevronLeft, ChevronRight } from "lucide-react";
import { DayPicker } from "react-day-picker" import { DayPicker } from "react-day-picker";
import { cn } from "@/lib/utils" import { cn } from "@/lib/utils";
import { buttonVariants } from "@/components/ui/button" import { buttonVariants } from "@/components/ui/button";
export type CalendarProps = React.ComponentProps<typeof DayPicker> export type CalendarProps = React.ComponentProps<typeof DayPicker>;
function Calendar({ function Calendar({ className, classNames, showOutsideDays = true, ...props }: CalendarProps) {
className,
classNames,
showOutsideDays = true,
...props
}: CalendarProps) {
return ( return (
<DayPicker <DayPicker
showOutsideDays={showOutsideDays} showOutsideDays={showOutsideDays}
@ -33,34 +28,30 @@ function Calendar({
nav_button_next: "absolute right-1", nav_button_next: "absolute right-1",
table: "w-full border-collapse space-y-1", table: "w-full border-collapse space-y-1",
head_row: "flex", head_row: "flex",
head_cell: head_cell: "text-muted-foreground rounded-md w-9 font-normal text-[0.8rem]",
"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: "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",
day: cn( day: cn(buttonVariants({ variant: "ghost" }), "h-9 w-9 p-0 font-normal aria-selected:opacity-100"),
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",
day_today: "bg-accent text-accent-foreground", day_today: "bg-accent text-accent-foreground",
day_outside: day_outside: "day-outside text-muted-foreground aria-selected:bg-accent/50 aria-selected:text-muted-foreground",
"day-outside text-muted-foreground aria-selected:bg-accent/50 aria-selected:text-muted-foreground",
day_disabled: "text-muted-foreground opacity-50", day_disabled: "text-muted-foreground opacity-50",
day_range_middle: day_range_middle: "aria-selected:bg-accent aria-selected:text-accent-foreground",
"aria-selected:bg-accent aria-selected:text-accent-foreground",
day_hidden: "invisible", day_hidden: "invisible",
...classNames, ...classNames,
}} }}
components={{ components={
IconLeft: ({ ...props }) => <ChevronLeft className="h-4 w-4" />, {
IconRight: ({ ...props }) => <ChevronRight className="h-4 w-4" />, IconLeft: () => <ChevronLeft className="h-4 w-4" />,
}} IconRight: () => <ChevronRight className="h-4 w-4" />,
} as any
}
{...props} {...props}
/> />
) );
} }
Calendar.displayName = "Calendar" Calendar.displayName = "Calendar";
export { Calendar } export { Calendar };