import { jsx, jsxs } from 'react/jsx-runtime';
import React__default, { useId, useState, useMemo } from 'react';
import { cn } from '../../../utils/cn.js';
import { checkboxTheme } from './Checkbox.theme.js';
import { formLabelTheme } from '../FormLabel/FormLabel.theme.js';
import { CheckboxGroupContext } from './CheckboxContext.js';

const CheckboxGroup = React__default.forwardRef(({ value: controlledValue, defaultValue, onChange, name, size = "md", state = "default", orientation = "vertical", label, description, error, required, className, children, ...props }, ref) => {
    const autoId = useId();
    const groupName = name !== null && name !== void 0 ? name : `checkbox-group-${autoId}`;
    const labelId = `${autoId}-label`;
    const descriptionId = `${autoId}-desc`;
    const errorId = `${autoId}-error`;
    // Controlled vs uncontrolled
    const isControlled = controlledValue !== undefined;
    const [internalValue, setInternalValue] = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : []);
    const currentValue = isControlled ? controlledValue : internalValue;
    const handleChange = (itemValue, checked) => {
        const next = checked
            ? [...currentValue, itemValue]
            : currentValue.filter((v) => v !== itemValue);
        if (!isControlled) {
            setInternalValue(next);
        }
        onChange === null || onChange === void 0 ? void 0 : onChange(next);
    };
    const contextValue = useMemo(() => ({
        name: groupName,
        value: currentValue,
        onChange: handleChange,
        size,
        state,
    }), [groupName, currentValue, size, state]);
    const labelState = error ? "invalid" : state === "disabled" ? "disabled" : "default";
    return (jsx(CheckboxGroupContext.Provider, { value: contextValue, children: jsxs("fieldset", { ref: ref, role: "group", "aria-labelledby": label ? labelId : undefined, "aria-describedby": description ? descriptionId : undefined, "aria-required": required || undefined, "aria-invalid": error ? true : undefined, "aria-errormessage": error ? errorId : undefined, className: cn("border-0 p-0 m-0", checkboxTheme.groupStyle, className), ...props, children: [label && (typeof label === 'string' ? (jsxs("legend", { id: labelId, className: cn(formLabelTheme.baseStyle, formLabelTheme.stateStyles[labelState]), children: [label, required && (jsx("span", { className: formLabelTheme.requiredIndicatorStyle, children: "*" }))] })) : (label)), description && (typeof description === 'string' ? (jsx("p", { id: descriptionId, className: checkboxTheme.groupDescriptionStyle, children: description })) : (description)), jsx("div", { className: cn(checkboxTheme.groupItemsStyle, orientation === "horizontal" &&
                        checkboxTheme.groupHorizontalStyle), children: children }), error && (typeof error === 'string' ? (jsx("p", { id: errorId, role: "alert", className: checkboxTheme.groupErrorStyle, children: error })) : (error))] }) }));
});
CheckboxGroup.displayName = "Checkbox.Group";

export { CheckboxGroup };
