import type { InputHTMLAttributes, ReactNode } from "react";

import { checkboxClass } from "@/lib/ui/variants";

interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type"> {
  label?: ReactNode;
}

// 勾选框：无 label 时只渲染受控原生 input（供已有 <label>/布局包裹的调用点直接替换）；
// 有 label 时自带 <label> 包裹，保留原生键盘/读屏语义。
export function Checkbox({ label, className, ...props }: CheckboxProps) {
  const input = <input type="checkbox" className={checkboxClass(className)} {...props} />;
  if (!label) return input;
  return (
    <label className="inline-flex items-center gap-2 text-sm text-ink">
      {input}
      <span>{label}</span>
    </label>
  );
}