51 lines
1.4 KiB
TypeScript
51 lines
1.4 KiB
TypeScript
import { Checkbox } from "@/components/ui/checkbox";
|
|
import { usePage } from "@inertiajs/react";
|
|
import { ReactNode } from "react";
|
|
import InputError from "$/base/InputError";
|
|
import { Label } from "@/components/ui/label";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
type SimpleCheckboxProps = {
|
|
className?: string;
|
|
name: string;
|
|
label: ReactNode | string;
|
|
value?: boolean;
|
|
id?: string;
|
|
disabled?: boolean;
|
|
parentErrors?: Record<string, string> | null;
|
|
// eslint-disable-next-line no-unused-vars
|
|
setData: (name: string, value: boolean) => void;
|
|
};
|
|
|
|
export default function SimpleCheckbox({
|
|
className,
|
|
value = false,
|
|
name,
|
|
label,
|
|
id = name,
|
|
disabled = false,
|
|
parentErrors = null,
|
|
setData,
|
|
}: SimpleCheckboxProps) {
|
|
const { errors } = usePage().props;
|
|
const localErrors = parentErrors ?? errors;
|
|
return (
|
|
<div className={cn(className)}>
|
|
<div className="flex items-start gap-4">
|
|
<Checkbox
|
|
id={id}
|
|
disabled={disabled}
|
|
className="rounded-full border-primary-foreground data-[state=checked]:bg-primary-foreground data-[state=checked]:text-primary"
|
|
checked={value}
|
|
onCheckedChange={(v) => {
|
|
setData(name, Boolean(v));
|
|
}}
|
|
/>
|
|
<Label htmlFor={id} className="text-start font-normal">
|
|
{label}
|
|
</Label>
|
|
</div>
|
|
<InputError message={localErrors[name]} />
|
|
</div>
|
|
);
|
|
}
|