import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { cn } from '../../../../scalars/lib/utils.js';
import React, { useId } from 'react';
import { FormLabel } from '../../../../scalars/components/fragments/form-label/index.js';
import { FormMessageList } from '../../../../scalars/components/fragments/form-message/index.js';
import { CheckboxBase } from './checkbox-base.js';
const Checkbox = React.forwardRef(({ id: idProp, name, label, value, defaultValue, disabled, required, description, errors, warnings, onChange, className, ...props }, ref) => {
    const generatedId = useId();
    const id = idProp ?? generatedId;
    const hasError = !!errors?.length;
    const castValue = (value) => {
        if (value === 'true')
            return true;
        if (value === 'false')
            return false;
        return value;
    };
    return (_jsxs("div", { className: cn('flex flex-col gap-2'), children: [_jsxs("div", { className: cn('group flex items-center space-x-2', className), children: [_jsx(CheckboxBase, { id: id, name: name, checked: castValue(value ?? defaultValue), disabled: disabled, onCheckedChange: onChange, required: required, invalid: hasError, "aria-invalid": hasError, ref: ref, ...props }), _jsx(FormLabel, { htmlFor: id, required: required, disabled: disabled, hasError: hasError, description: description, className: cn(!disabled && 'group-hover:cursor-pointer'), inline: true, children: label })] }), warnings && _jsx(FormMessageList, { type: "warning", messages: warnings }), errors && _jsx(FormMessageList, { type: "error", messages: errors })] }));
});
Checkbox.displayName = 'Checkbox';
export { Checkbox };
//# sourceMappingURL=checkbox.js.map