import { useMemo, useRef } from 'react';
import { cnGptDialogPresetList } from "../PresetList/PresetList.js";
import { useOverflowingHorizontalItems } from "./useOverflowingHorizontalItems.js";
export const usePresetList = ({ promptPresets, onPresetClick, }) => {
    const presetsContainerRef = useRef(null);
    const { visibleItems, hiddenItems, measured } = useOverflowingHorizontalItems({
        containerRef: presetsContainerRef,
        items: promptPresets,
        itemSelector: `.${cnGptDialogPresetList('preset')}`,
        moreButtonSelector: `.${cnGptDialogPresetList('more-button-wrapper')}`,
        marginBetweenItems: 8,
    });
    const hiddenPresets = useMemo(() => {
        const items = [];
        for (const item of hiddenItems) {
            items.push({
                text: item.display,
                action: () => onPresetClick(item.data),
                items: [],
            });
        }
        return items;
    }, [onPresetClick, hiddenItems]);
    const showMoreButton = !measured || hiddenPresets.length > 0;
    return {
        measured,
        showMoreButton,
        presetsContainerRef,
        visiblePresets: visibleItems,
        hiddenPresets,
    };
};
//# sourceMappingURL=usePresetList.js.map
