nihonbuzz-academy/resources/js/Components/Checkbox.tsx

import { Checkbox as ShadcnCheckbox } from '@/Components/ui/checkbox';

export default function Checkbox({
    className = '',
    checked,
    onChange,
    onCheckedChange,
    ...props
}: any) {
    const handleChange = (val: boolean) => {
        if (onCheckedChange) onCheckedChange(val);
        if (onChange) {
            onChange({
                target: {
                    name: props.name,
                    checked: val,
                    type: 'checkbox'
                }
            });
        }
    };

    return (
        <ShadcnCheckbox
            {...props}
            checked={checked}
            onCheckedChange={handleChange}
            className={
                'rounded border-gray-300 ' +
                className
            }
        />
    );
}