From 79cf899e8cad7126390d91394ff108d85d174942 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=8B=AC=EC=9C=A0=EC=A7=84?= <syj11243@naver.com>
Date: Mon, 5 Jan 2026 21:48:49 +0900
Subject: [PATCH 1/2] =?UTF-8?q?refactor:=20radix=20=EC=9D=98=EC=A1=B4?=
 =?UTF-8?q?=EC=84=B1=20=EC=A0=9C=EA=B1=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                    |  1 -
 src/shared/ui/Switch/Switch.tsx | 52 ++++++++++++++++++++++++++++-----
 vite.config.ts                  |  1 -
 3 files changed, 44 insertions(+), 10 deletions(-)

diff --git a/package.json b/package.json
index 9da8b423..f1cd3ce0 100644
--- a/package.json
+++ b/package.json
@@ -41,7 +41,6 @@
     "tailwind-merge": "^2.6.0"
   },
   "peerDependencies": {
-    "@radix-ui/react-switch": "^1.0.0",
     "framer-motion": "^11.0.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
diff --git a/src/shared/ui/Switch/Switch.tsx b/src/shared/ui/Switch/Switch.tsx
index f4ab79cc..8f6327bd 100644
--- a/src/shared/ui/Switch/Switch.tsx
+++ b/src/shared/ui/Switch/Switch.tsx
@@ -1,23 +1,59 @@
-import * as SwitchPrimitives from '@radix-ui/react-switch';
+import { useState } from 'react';
 
 import { COLORS, SwitchColor } from '@/shared/lib/colors';
 
-type Props = React.ComponentProps<typeof SwitchPrimitives.Root> & {
+type Props = Omit<React.ComponentProps<'button'>, 'onClick'> & {
   /**
    * color of the switch.
    * @default 'primary'
    */
   color?: SwitchColor;
+  checked?: boolean;
+  defaultChecked?: boolean;
+  onCheckedChange?: (checked: boolean) => void;
 };
 
-export function Switch({ color = 'primary', ...props }: Props) {
+export function Switch({
+  color = 'primary',
+  checked,
+  defaultChecked = false,
+  onCheckedChange,
+  className,
+  disabled,
+  ...props
+}: Props) {
+  const [uncontrolledChecked, setUncontrolledChecked] = useState(defaultChecked);
+  const isChecked = checked ?? uncontrolledChecked;
+
+  const handleClick = () => {
+    if (disabled) return;
+
+    const next = !isChecked;
+    if (checked === undefined) {
+      setUncontrolledChecked(next);
+    }
+    onCheckedChange?.(next);
+  };
+
   return (
-    <SwitchPrimitives.Root
+    <button
       {...props}
-      className="group flex h-3.5 w-7 items-center rounded-full shadow-lg data-[state=checked]:bg-[var(--switch-color)] data-[state=unchecked]:bg-gray-500"
-      style={color && ({ '--switch-color': COLORS[color] } as React.CSSProperties)}
+      type="button"
+      role="switch"
+      disabled={disabled}
+      onClick={handleClick}
+      data-state={isChecked ? 'checked' : 'unchecked'}
+      className={[
+        'group flex h-3.5 w-7 items-center rounded-full shadow-lg',
+        'data-[state=checked]:bg-[var(--switch-color)]',
+        'data-[state=unchecked]:bg-gray-500',
+        className,
+      ]
+        .filter(Boolean)
+        .join(' ')}
+      style={{ '--switch-color': COLORS[color] } as React.CSSProperties}
     >
-      <SwitchPrimitives.Thumb className="h-5 w-5 -translate-x-1.5 rounded-full bg-white shadow-inner drop-shadow-md duration-100 group-data-[state=checked]:translate-x-3.5" />
-    </SwitchPrimitives.Root>
+      <span className="h-5 w-5 -translate-x-1.5 rounded-full bg-white shadow-inner drop-shadow-md duration-100 group-data-[state=checked]:translate-x-3.5" />
+    </button>
   );
 }
diff --git a/vite.config.ts b/vite.config.ts
index 387abd7c..46962363 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -35,7 +35,6 @@ export default defineConfig({
         'react-dom',
         'react/jsx-runtime',
         'framer-motion',
-        '@radix-ui/react-switch',
         'tailwindcss',
       ],
       output: {

From 9c7b548ad762325e8e906bb3a239d1b2051603b1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=8B=AC=EC=9C=A0=EC=A7=84?= <syj11243@naver.com>
Date: Tue, 6 Jan 2026 17:06:17 +0900
Subject: [PATCH 2/2] =?UTF-8?q?fix:=20aria-checked=20=EC=86=8D=EC=84=B1=20?=
 =?UTF-8?q?=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/shared/ui/Switch/Switch.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/shared/ui/Switch/Switch.tsx b/src/shared/ui/Switch/Switch.tsx
index 8f6327bd..b0051a59 100644
--- a/src/shared/ui/Switch/Switch.tsx
+++ b/src/shared/ui/Switch/Switch.tsx
@@ -42,6 +42,7 @@ export function Switch({
       role="switch"
       disabled={disabled}
       onClick={handleClick}
+      aria-checked={isChecked}
       data-state={isChecked ? 'checked' : 'unchecked'}
       className={[
         'group flex h-3.5 w-7 items-center rounded-full shadow-lg',