From b17502005682c4eca0f55cdbff79ef7dbab451f0 Mon Sep 17 00:00:00 2001
From: JulesFILIOT <dev@julesfiliot.com>
Date: Tue, 2 Jun 2026 13:04:44 +0900
Subject: [PATCH] refactor(ui): extract shared download icon

---
 packages/ui/src/icons/download-icon.tsx       | 36 +++++++++++++++++++
 .../technology-stack/technology-stack.tsx     | 20 ++---------
 2 files changed, 38 insertions(+), 18 deletions(-)
 create mode 100644 packages/ui/src/icons/download-icon.tsx

diff --git a/packages/ui/src/icons/download-icon.tsx b/packages/ui/src/icons/download-icon.tsx
new file mode 100644
index 0000000000..8ea6735c5f
--- /dev/null
+++ b/packages/ui/src/icons/download-icon.tsx
@@ -0,0 +1,36 @@
+import type { CSSProperties, HTMLAttributes } from 'react'
+
+type DownloadIconProps = Omit<HTMLAttributes<SVGSVGElement>, 'style'> & {
+  /** Uniform pixel size (width = height). Default 15. */
+  size?: number
+  style?: CSSProperties
+}
+
+export function DownloadIcon({
+  size = 15,
+  className,
+  style,
+  ...rest
+}: DownloadIconProps) {
+  const svgStyle = {
+    ...style,
+    width: size,
+    height: size,
+  } satisfies CSSProperties
+
+  return (
+    <svg
+      aria-hidden="true"
+      className={`inline-block shrink-0 fill-current ${className ?? ''}`}
+      fill="none"
+      style={svgStyle}
+      viewBox="0 0 15 15"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <path
+        d="M1.5 11.2632V8.94737H2.68462V11.2632C2.68462 11.4167 2.74706 11.5639 2.85814 11.6725C2.96922 11.7811 3.11983 11.8421 3.27692 11.8421H11.5692C11.7263 11.8421 11.8769 11.7811 11.988 11.6725C12.0991 11.5639 12.1615 11.4167 12.1615 11.2632V8.94737H13.3462V11.2632C13.3462 11.7238 13.1588 12.1654 12.8256 12.4912C12.4923 12.8169 12.0405 13 11.5692 13H3.27692C2.80565 13 2.35382 12.8169 2.02058 12.4912C1.68735 12.1654 1.5 11.7238 1.5 11.2632ZM8.01538 2V7.54975L9.96584 5.6433L10.8034 6.46197L7.42308 9.76604L4.04276 6.46197L4.88032 5.6433L6.83077 7.54975V2H8.01538Z"
+      />
+    </svg>
+  )
+}
diff --git a/packages/ui/src/primitives/technology-stack/technology-stack.tsx b/packages/ui/src/primitives/technology-stack/technology-stack.tsx
index bfd017b09a..dd4d1edfd1 100644
--- a/packages/ui/src/primitives/technology-stack/technology-stack.tsx
+++ b/packages/ui/src/primitives/technology-stack/technology-stack.tsx
@@ -3,6 +3,8 @@ import { twMerge } from 'tailwind-merge'
 
 import { LogosMark } from '../../icons/logos-mark'
 
+export { DownloadIcon } from '../../icons/download-icon'
+
 type Tone = 'dark' | 'light'
 
 export type SectionMarkerProps = {
@@ -19,24 +21,6 @@ export function SectionMarker({ label, className }: SectionMarkerProps) {
   )
 }
 
-export function DownloadIcon() {
-  return (
-    <svg
-      aria-hidden="true"
-      className="size-3.75 shrink-0 stroke-current"
-      fill="none"
-      viewBox="0 0 15 15"
-      xmlns="http://www.w3.org/2000/svg"
-    >
-      <path
-        d="M7.5 2.75V10.5M7.5 10.5L4.25 7.25M7.5 10.5L10.75 7.25M3 12.25H12"
-        strokeLinecap="square"
-        strokeLinejoin="miter"
-      />
-    </svg>
-  )
-}
-
 export type TechDetailHeroItem = {
   title: string
   description?: string