diff --git a/apps/wr/components/ui/publicReuseInsertForm.tsx b/apps/wr/components/ui/publicReuseInsertForm.tsx
index 47cecaaf8..1150bdc0d 100644
--- a/apps/wr/components/ui/publicReuseInsertForm.tsx
+++ b/apps/wr/components/ui/publicReuseInsertForm.tsx
@@ -1,9 +1,9 @@
"use client";
import { SelectBox } from "@common/business_components";
-import { FileUpload, FormUi, UiTable } from "@common/business_components/ui";
+import { DatePicker, FileUpload, FormUi, UiTable } from "@common/business_components/ui";
import { Form, FormField } from "@common/business_components/ui/form";
-import { Button, DatePicker, Input } from "@common/components";
+import { Button, Input } from "@common/components";
import { zodResolver } from "@hookform/resolvers/zod";
import { useState } from "react";
import { useForm } from "react-hook-form";
@@ -62,8 +62,7 @@ export function PublicReuseFaciltyFormInsert() {
{ text: "자쳬+연계", val: "3" },
];
-
-
+ const [datePick, setDatePick] = useState(new Date())
const [files, setFiles] = useState(null);
return (
@@ -256,7 +255,12 @@ export function PublicReuseFaciltyFormInsert() {
name="name_2450741594"
render={({ field }) => (
-
+ {
+ if (date) setDatePick(date)
+ }
+ }} mode="single" {...field}/>
)}
/>
@@ -267,7 +271,12 @@ export function PublicReuseFaciltyFormInsert() {
name="name_2450741594"
render={({ field }) => (
-
+
)}
/>
diff --git a/packages/common/business_components/src/ui/date_picker/date-picker.css b/packages/common/business_components/src/ui/date_picker/date-picker.css
new file mode 100644
index 000000000..bf9415652
--- /dev/null
+++ b/packages/common/business_components/src/ui/date_picker/date-picker.css
@@ -0,0 +1,7 @@
+@tailwind components;
+
+@layer components {
+ .date-picker-trigger {
+ @apply h-[3rem] w-[12rem] justify-between border-input !bg-background px-4 py-2 text-left text-[1.3rem] font-normal leading-none text-muted-foreground hover:!bg-accent;
+ }
+}
diff --git a/packages/common/business_components/src/ui/date_picker/index.tsx b/packages/common/business_components/src/ui/date_picker/index.tsx
new file mode 100644
index 000000000..37dbcb096
--- /dev/null
+++ b/packages/common/business_components/src/ui/date_picker/index.tsx
@@ -0,0 +1,46 @@
+"use client";
+
+import "./date-picker.css";
+
+import { format } from "date-fns";
+import { CalendarIcon } from "lucide-react";
+import type { DayPickerSingleProps } from "react-day-picker";
+
+import { Button, Calendar, Popover, PopoverContent, PopoverTrigger } from "@common/components/ui";
+import { cn } from "../../lib/utils";
+import { FormControl } from "../form";
+
+type DatePickerProps = DayPickerSingleProps & { field: { value: Date; onChange: (date: Date | undefined) => void } };
+
+export function DatePicker({ field }: DatePickerProps) {
+ return (
+
+
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/packages/common/business_components/src/ui/index.ts b/packages/common/business_components/src/ui/index.ts
index 2791b2035..795fffa2a 100644
--- a/packages/common/business_components/src/ui/index.ts
+++ b/packages/common/business_components/src/ui/index.ts
@@ -1,4 +1,5 @@
export * from "./chart";
+export * from "./date_picker";
export * from "./file-upload";
export * from "./form";
export * from "./form_ui";
diff --git a/packages/common/business_components/src/ui/search_input/index.tsx b/packages/common/business_components/src/ui/search_input/index.tsx
index f933428fc..f2d1caeb4 100644
--- a/packages/common/business_components/src/ui/search_input/index.tsx
+++ b/packages/common/business_components/src/ui/search_input/index.tsx
@@ -8,7 +8,7 @@ const SearchInput = React.forwardRef<
console.log(ref);
return (
- {label && }
+ {label && }
)
diff --git a/packages/common/business_components/src/ui/search_input_select/index.tsx b/packages/common/business_components/src/ui/search_input_select/index.tsx
index b00615e4b..1496d9ddd 100644
--- a/packages/common/business_components/src/ui/search_input_select/index.tsx
+++ b/packages/common/business_components/src/ui/search_input_select/index.tsx
@@ -17,7 +17,7 @@ export type SelectDataType = {
const SearchInputSelect = React.forwardRefvoid}>(({className, label, selectData, onSelectValue}, refs) => {
return (
- {label &&
}
+ {label &&
}