chore: merge web repo history into monorepo at web/
git-subtree-dir: web git-subtree-mainline:75a0ba593dgit-subtree-split:8f624e7416
This commit is contained in:
@@ -0,0 +1,30 @@
|
||||
"use client";
|
||||
|
||||
export function Switch({
|
||||
checked,
|
||||
onChange,
|
||||
disabled,
|
||||
}: {
|
||||
checked: boolean;
|
||||
onChange: (checked: boolean) => void;
|
||||
disabled?: boolean;
|
||||
}) {
|
||||
return (
|
||||
<button
|
||||
type="button"
|
||||
role="switch"
|
||||
aria-checked={checked}
|
||||
disabled={disabled}
|
||||
onClick={() => onChange(!checked)}
|
||||
className={`relative w-11 h-6 rounded-(--radius-full) transition-colors duration-200 shrink-0 disabled:opacity-50 cursor-pointer ${
|
||||
checked ? "bg-(--color-brand-500)" : "bg-(--color-bg-tertiary)"
|
||||
}`}
|
||||
>
|
||||
{/* از insetInlineStart استفاده میکنیم (نه left/right) تا توی حالت RTL درست جابهجا بشه */}
|
||||
<span
|
||||
className="absolute top-0.5 w-5 h-5 rounded-full bg-white shadow-(--shadow-cute-sm) transition-all duration-200"
|
||||
style={{ insetInlineStart: checked ? "22px" : "2px" }}
|
||||
/>
|
||||
</button>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user