From 7a2b0b1c97b2ef1f34b892c919de385479fbcdd6 Mon Sep 17 00:00:00 2001
From: Jeong Daseul <98886223+goodaseul@users.noreply.github.com>
Date: Mon, 23 Feb 2026 13:04:39 +0900
Subject: [PATCH] =?UTF-8?q?feature:=20=EB=AA=A8=EB=8B=AC=20=EC=98=A4?=
 =?UTF-8?q?=ED=94=88=EC=8B=9C=20=EC=B2=AB=EB=B2=88=EC=A7=B8=20input?=
 =?UTF-8?q?=EC=97=90=20focus?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/(protected)/_components/modal/word/ModalBody.tsx | 3 ++-
 src/components/input/Input.tsx                           | 7 +++++--
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/app/(protected)/_components/modal/word/ModalBody.tsx b/src/app/(protected)/_components/modal/word/ModalBody.tsx
index 2df461f..baa11a1 100644
--- a/src/app/(protected)/_components/modal/word/ModalBody.tsx
+++ b/src/app/(protected)/_components/modal/word/ModalBody.tsx
@@ -12,7 +12,7 @@ type ModalBodyProps = {
       | "usage"
       | "memo"
       | "bookmarked",
-    value: string
+    value: string,
   ) => void;
 
   form: WordCreateInput | WordUpdateInput;
@@ -36,6 +36,7 @@ export default function ModalBody({
     <>
       <ModalField label="단어*">
         <Input
+          autoFocus
           name={form.expression || ""}
           value={form.expression || ""}
           onChange={(e) => updateField("expression", e.target.value)}
diff --git a/src/components/input/Input.tsx b/src/components/input/Input.tsx
index 6ad2c28..f2858ea 100644
--- a/src/components/input/Input.tsx
+++ b/src/components/input/Input.tsx
@@ -12,6 +12,7 @@ type InputProps = {
   placeholder?: string;
   className?: string;
   errors?: string;
+  autoFocus?: boolean;
 };
 
 export default function Input({
@@ -25,11 +26,13 @@ export default function Input({
   onClick,
   errors,
   className,
+  autoFocus,
 }: InputProps) {
   return (
     <div className="w-full">
       <div className="relative">
         <input
+          autoFocus={autoFocus}
           id={id}
           name={name}
           type={type}
@@ -41,7 +44,7 @@ export default function Input({
             errors
               ? "border border-red-500 focus:ring-2 focus:ring-red-500"
               : "border border-gray-100 focus:ring-2 shadow-md focus:ring-gray-900",
-            className
+            className,
           )}
         />
         <button
@@ -49,7 +52,7 @@ export default function Input({
           type="button"
           className={clsx(
             "absolute right-5 top-1/2 -translate-y-1/2",
-            errors ? "text-red-500" : "text-black"
+            errors ? "text-red-500" : "text-black",
           )}
         >
           {children}