From ea622edbe269cab96e0ae0a4bd7bb1779dc1f400 Mon Sep 17 00:00:00 2001
From: owjs3901 <owjs3901@naver.com>
Date: Mon, 27 Jan 2025 22:17:45 +0900
Subject: [PATCH] Add svg props

---
 .changeset/shiny-spoons-raise.md              |  5 ++++
 .../(detail)/docs/api/style-props/page.mdx    | 29 +++++++++++++++++++
 packages/react/src/types/props/index.ts       |  4 ++-
 packages/react/src/types/props/svg.ts         | 10 +++++++
 4 files changed, 47 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/shiny-spoons-raise.md
 create mode 100644 packages/react/src/types/props/svg.ts

diff --git a/.changeset/shiny-spoons-raise.md b/.changeset/shiny-spoons-raise.md
new file mode 100644
index 00000000..769017ec
--- /dev/null
+++ b/.changeset/shiny-spoons-raise.md
@@ -0,0 +1,5 @@
+---
+"@devup-ui/react": patch
+---
+
+Add svg props
diff --git a/apps/landing/src/app/(detail)/docs/api/style-props/page.mdx b/apps/landing/src/app/(detail)/docs/api/style-props/page.mdx
index 59fce747..50fcaa4b 100644
--- a/apps/landing/src/app/(detail)/docs/api/style-props/page.mdx
+++ b/apps/landing/src/app/(detail)/docs/api/style-props/page.mdx
@@ -1625,3 +1625,32 @@
     </tr>
     </tbody>
 </table>
+
+## Svg
+
+<table>
+    <thead>
+    <tr>
+        <th>Props</th>
+        <th>Style Property</th>
+    </tr>
+    </thead>
+    <tbody>
+    <tr>
+        <td><code>fill</code></td>
+        <td><code>fill</code></td>
+    </tr>
+    <tr>
+        <td><code>stroke</code></td>
+        <td><code>stroke</code></td>
+    </tr>
+    <tr>
+        <td><code>strokeWidth</code></td>
+        <td><code>stroke-width</code></td>
+    </tr>
+    <tr>
+        <td><code>strokeOpacity</code></td>
+        <td><code>stroke-opacity</code></td>
+    </tr>
+    </tbody>
+</table>
diff --git a/packages/react/src/types/props/index.ts b/packages/react/src/types/props/index.ts
index deabd45f..22e2dec6 100644
--- a/packages/react/src/types/props/index.ts
+++ b/packages/react/src/types/props/index.ts
@@ -22,6 +22,7 @@ import type { DevupUiPositionProps } from './position'
 import type { DevupUiScrollbarProps } from './scrollbar'
 import type { DevupSelectorProps, DevupThemeSelectorProps } from './selector'
 import type { DevupUiShapeProps } from './shape'
+import type { DevupUiSvgProps } from './svg'
 import type { DevupUiTableProps } from './table'
 import type { DevupUiTextProps } from './text'
 import type { DevupUiTransformProps } from './transform'
@@ -58,7 +59,8 @@ export interface DevupCommonProps
     DevupUiTransformProps,
     DevupUiTransitionProps,
     DevupUiUiProps,
-    DevupUiViewTransitionProps {}
+    DevupUiViewTransitionProps,
+    DevupUiSvgProps {}
 
 export interface DevupProps
   extends DevupCommonProps,
diff --git a/packages/react/src/types/props/svg.ts b/packages/react/src/types/props/svg.ts
new file mode 100644
index 00000000..f290f7f9
--- /dev/null
+++ b/packages/react/src/types/props/svg.ts
@@ -0,0 +1,10 @@
+import type { Property } from 'csstype'
+
+import type { ResponsiveValue } from '../responsive-value'
+
+export interface DevupUiSvgProps {
+  fill?: ResponsiveValue<Property.Fill>
+  stroke?: ResponsiveValue<Property.Stroke>
+  strokeWidth?: ResponsiveValue<Property.StrokeWidth>
+  strokeOpacity?: ResponsiveValue<Property.StrokeOpacity>
+}