import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { VSelectBox } from "@vertesia/ui/core";
import { useUserSession } from "@vertesia/ui/session";
import { useEffect, useState } from "react";
const optionLabel = (t) => {
    if (t === null)
        return 'None';
    return (_jsxs("div", { children: [_jsx("div", { className: "text-sm", children: t.name }), _jsx("div", { className: "text-xs text-gray-500", children: t.description })] }));
};
export function SelectContentType({ className, defaultValue, onChange, isClearable, multiple }) {
    const session = useUserSession();
    const [isMounted, setIsMounted] = useState(false);
    const [selectedType, setSelectedType] = useState();
    const [selectedTypes, setSelectedTypes] = useState([]);
    useEffect(() => {
        if (!isMounted) {
            setIsMounted(true);
            if (session.typeRegistry && defaultValue) {
                if (multiple && Array.isArray(defaultValue)) {
                    const types = session.typeRegistry.types.filter(t => defaultValue.includes(t.id));
                    setSelectedTypes(types);
                }
                const type = session.typeRegistry.types.find(t => t.id === defaultValue);
                if (type) {
                    setSelectedType(type);
                }
            }
        }
    }, [session.typeRegistry, defaultValue, multiple]);
    const _onChange = (option) => {
        setSelectedType(option || undefined);
        onChange(option);
    };
    const _onChangeMultiple = (options) => {
        setSelectedTypes(options);
        onChange(options);
    };
    if (multiple) {
        return (_jsx("div", { className: 'flex flex-col gap-4 content-between', children: _jsx(VSelectBox, { options: session.typeRegistry?.types || [], value: selectedTypes, onChange: _onChangeMultiple, placeholder: "Choose Content Types...", optionLabel: optionLabel, className: className || "text-sm bg-background", filterBy: "name", isClearable: isClearable || false, multiple: true }) }));
    }
    return (_jsx("div", { className: 'flex flex-col gap-4 content-between', children: _jsx(VSelectBox, { options: session.typeRegistry?.types || [], value: selectedType, onChange: _onChange, placeholder: "Choose a Content Type...", optionLabel: optionLabel, className: className || "text-sm bg-background", filterBy: "name", isClearable: isClearable || false }) }));
}
//# sourceMappingURL=SelectContentType.js.map