20 lines
600 B
JavaScript
20 lines
600 B
JavaScript
import React from "react";
|
|
|
|
export const Switch = ({ checked = false, onChange, className = "" }) => (
|
|
<label className={`inline-flex items-center cursor-pointer ${className}`}>
|
|
<input
|
|
type="checkbox"
|
|
className="sr-only"
|
|
checked={checked}
|
|
onChange={(e) => onChange?.(e.target.checked)}
|
|
/>
|
|
<span className="relative w-10 h-5 bg-gray-400 rounded-full transition">
|
|
<span
|
|
className={`absolute top-0.5 left-0.5 w-4 h-4 bg-white rounded-full transition-transform ${
|
|
checked ? "translate-x-5" : ""
|
|
}`}
|
|
/>
|
|
</span>
|
|
</label>
|
|
);
|