31 lines
793 B
TypeScript
31 lines
793 B
TypeScript
import React, { forwardRef } from "react";
|
|
|
|
interface FormCheckboxProps
|
|
extends React.InputHTMLAttributes<HTMLInputElement> {
|
|
label: string;
|
|
}
|
|
|
|
export const FormCheckbox = forwardRef<HTMLInputElement, FormCheckboxProps>(
|
|
({ label, ...props }, ref) => (
|
|
<label className="flex items-center space-x-3 cursor-pointer group">
|
|
<input
|
|
type="checkbox"
|
|
ref={ref}
|
|
className="
|
|
w-5 h-5 rounded
|
|
border-gray-300 text-blue-600
|
|
focus:ring-2 focus:ring-blue-500
|
|
transition duration-150 ease-in-out
|
|
cursor-pointer
|
|
"
|
|
{...props}
|
|
/>
|
|
<span className="text-sm text-gray-700 group-hover:text-gray-900">
|
|
{label}
|
|
</span>
|
|
</label>
|
|
),
|
|
);
|
|
|
|
FormCheckbox.displayName = "FormCheckbox";
|