import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useCommandState } from 'cmdk';
import { useEffect } from 'react';
import { cn } from '../../../lib/utils.js';
import { CommandEmpty, CommandGroup, CommandItem, CommandList } from '../command/index.js';
import { IdAutocompleteListOption } from './id-autocomplete-list-option.js';
const IdAutocompleteList = ({ variant, commandListRef, selectedValue, options = [], toggleOption, renderOption, previewPlaceholder, }) => {
    const cmdkSearch = useCommandState((state) => state.search);
    const defaultOption = previewPlaceholder ?? {
        value: 'value not available',
        title: 'Title not available',
        path: 'Path not available',
        description: 'Description not available',
    };
    useEffect(() => {
        commandListRef?.current?.scrollTo({ top: 0, behavior: 'instant' });
    }, [commandListRef, cmdkSearch]);
    return (_jsxs(CommandList, { ref: commandListRef, children: [_jsx(CommandEmpty, { className: cn('h-full p-1'), children: renderOption ? (renderOption(defaultOption, {
                    asPlaceholder: true,
                    showValue: true,
                    className: cn('pb-0'),
                })) : (_jsx(IdAutocompleteListOption, { variant: variant, icon: defaultOption.icon, title: defaultOption.title, path: defaultOption.path, value: defaultOption.value, description: defaultOption.description, asPlaceholder: true, className: cn('pb-0') })) }), _jsx(CommandGroup, { className: cn('px-1'), children: options.map((opt) => {
                    const isSelected = selectedValue === opt.value;
                    return (_jsx(CommandItem, { value: opt.value, onSelect: () => toggleOption?.(opt.value), className: cn('h-full cursor-pointer border-y-0 p-0', 'data-[selected=true]:bg-gray-100 dark:data-[selected=true]:bg-gray-900'), role: "option", "aria-selected": isSelected, children: renderOption ? (renderOption(opt, {
                            asPlaceholder: false,
                            showValue: true,
                        })) : (_jsx(IdAutocompleteListOption, { variant: variant, ...opt })) }, opt.value));
                }) })] }));
};
export { IdAutocompleteList };
//# sourceMappingURL=id-autocomplete-list.js.map