From 1a44d9b56a3b0f9bc01712858b2c020472079c46 Mon Sep 17 00:00:00 2001
From: belltalion <xogus4026@gmail.com>
Date: Thu, 7 Aug 2025 17:18:15 +0900
Subject: [PATCH] Fix input className

---
 .changeset/cuddly-maps-attend.md                   | 5 +++++
 packages/components/src/components/Input/index.tsx | 6 +++---
 2 files changed, 8 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/cuddly-maps-attend.md

diff --git a/.changeset/cuddly-maps-attend.md b/.changeset/cuddly-maps-attend.md
new file mode 100644
index 00000000..ccf642cc
--- /dev/null
+++ b/.changeset/cuddly-maps-attend.md
@@ -0,0 +1,5 @@
+---
+"@devup-ui/components": patch
+---
+
+Fix Input component className
diff --git a/packages/components/src/components/Input/index.tsx b/packages/components/src/components/Input/index.tsx
index 83a59c53..661a448d 100644
--- a/packages/components/src/components/Input/index.tsx
+++ b/packages/components/src/components/Input/index.tsx
@@ -10,8 +10,7 @@ import {
 } from '@devup-ui/react'
 import { ComponentProps, useState } from 'react'
 
-interface InputProps
-  extends Omit<ComponentProps<'input'>, 'className' | 'type'> {
+interface InputProps extends Omit<ComponentProps<'input'>, 'type'> {
   type?: Exclude<ComponentProps<'input'>['type'], 'file'>
   typography?: keyof DevupThemeTypography
   error?: boolean
@@ -47,6 +46,7 @@ export function Input({
   icon,
   colors,
   disabled,
+  className,
   classNames,
   ref,
   ...props
@@ -117,7 +117,7 @@ export function Input({
         borderRadius="8px"
         borderStyle="solid"
         borderWidth="1px"
-        className={classNames?.input}
+        className={`${className || ''} ${classNames?.input || ''}`.trim()}
         disabled={disabled}
         onChange={handleChange}
         pl={icon ? '36px' : '12px'}