From 52a5650ca593c82790d8d34d5f38293797f41739 Mon Sep 17 00:00:00 2001
From: swcho <swcho@mind-one.co.kr>
Date: Tue, 8 Jul 2025 19:20:04 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20DatePicker=20=EC=BB=B4=ED=8F=AC?=
 =?UTF-8?q?=EB=84=8C=ED=8A=B8=20zIndex=20props=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/src/ui/date-picker/index.tsx      | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/packages/common/components/src/ui/date-picker/index.tsx b/packages/common/components/src/ui/date-picker/index.tsx
index ee5d37872..67265df0e 100644
--- a/packages/common/components/src/ui/date-picker/index.tsx
+++ b/packages/common/components/src/ui/date-picker/index.tsx
@@ -2,7 +2,7 @@ import "./date-picker.css";
 
 import { format } from "date-fns";
 import { CalendarIcon } from "lucide-react";
-import type { DayPickerSingleProps } from "react-day-picker";
+import type { DayPicker } from "react-day-picker";
 
 import { cn } from "../../lib/utils";
 import { Button } from "../button";
@@ -12,12 +12,15 @@ import { Popover, PopoverContent, PopoverTrigger } from "../popover";
 type DatePickerProps = {
   placeholder?: string;
   disabled?: boolean;
-} & DayPickerSingleProps;
+  selected?: Date;
+  zIndex?: number; // z-index prop 추가
+} & React.ComponentProps<typeof DayPicker>;
 
 export function DatePicker({
   className,
   placeholder = "날짜 선택",
   disabled,
+  zIndex, // zIndex prop 받기
   ...props
 }: DatePickerProps) {
   return (
@@ -36,8 +39,13 @@ export function DatePicker({
           )}
         </Button>
       </PopoverTrigger>
-      <PopoverContent className="w-auto p-0">
-        <Calendar initialFocus classNames={{ cell: "rounded-md" }} {...props} />
+      <PopoverContent
+        className={cn(
+          "w-auto p-0",
+          zIndex ? `z-[${zIndex}]` : "" // zIndex가 있으면 적용, 없으면 기본값
+        )}
+      >
+        <Calendar classNames={{ cell: "rounded-md" }} {...props} />
       </PopoverContent>
     </Popover>
   );