From 09f964451d7d92e9891430ec4595c1276d486aab Mon Sep 17 00:00:00 2001
From: zwlucas <lucas.fariamo08@gmail.com>
Date: Fri, 5 Jun 2026 17:52:54 -0300
Subject: feat: upload

Signed-off-by: zwlucas <lucas.fariamo08@gmail.com>
---
 src/components/UI/Toggle.tsx | 25 +++++++++++++++++++++++++
 1 file changed, 25 insertions(+)
 create mode 100644 src/components/UI/Toggle.tsx

(limited to 'src/components/UI/Toggle.tsx')

diff --git a/src/components/UI/Toggle.tsx b/src/components/UI/Toggle.tsx
new file mode 100644
index 0000000..17b98e2
--- /dev/null
+++ b/src/components/UI/Toggle.tsx
@@ -0,0 +1,25 @@
+interface ToggleProps {
+  checked: boolean
+  onChange: (checked: boolean) => void
+  disabled?: boolean
+}
+
+export default function Toggle({ checked, onChange, disabled }: ToggleProps) {
+  return (
+    <button
+      role="switch"
+      aria-checked={checked}
+      disabled={disabled}
+      className="relative inline-flex h-5 w-9 shrink-0 rounded-full transition-colors duration-200 disabled:opacity-30 disabled:cursor-not-allowed focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-1 focus-visible:ring-offset-transparent"
+      style={{
+        backgroundColor: checked ? 'var(--color-accent)' : 'var(--color-panel-border)',
+      }}
+      onClick={() => { if (!disabled) onChange(!checked) }}
+    >
+      <span
+        className="inline-block h-[16px] w-[16px] rounded-full bg-white shadow-sm transition-transform duration-200"
+        style={{ transform: checked ? 'translateX(18px)' : 'translateX(3px)', marginTop: '2px' }}
+      />
+    </button>
+  )
+}
-- 
cgit v1.2.3

