import { useId, type ComponentProps } from "react";
export interface CheckboxProps extends Omit<
  ComponentProps<"input">,
  "type" | "onChange"
> {
  label: string;
  onChange?: (checked: boolean) => void;
}
export function Checkbox({
  label,
  id,
  onChange,
  className = "",
  ...props
}: CheckboxProps) {
  const generatedId = useId();
  return (
    <label className="ynr-checkbox-label" htmlFor={id ?? generatedId}>
      <input
        {...props}
        id={id ?? generatedId}
        type="checkbox"
        className={`ynr-checkbox ${className}`}
        onChange={(event) => onChange?.(event.target.checked)}
      />
      {label}
    </label>
  );
}