import { UIEvent } from 'react'; import { UseMultipleSelectionProps as UseDownshiftMultipleSelectionProps } from 'downshift'; import { ComboboxProps } from './Combobox'; /** * Props for the useInfiniteCombobox hook */ export type UseInfiniteComboboxProps = { /** Function to fetch items for the current page */ query: (params: { page: number; inputValue: string; selectedItem: Item | null; selectedItems: Item[]; }) => Promise; /** Initial page number to start from */ initialPage?: number; /** Initial loading state */ initialLoading?: boolean; /** Initial input value */ initialInputValue?: ComboboxProps["initialInputValue"]; /** Default input value */ defaultInputValue?: ComboboxProps["defaultInputValue"]; /** Initial selected item */ initialSelectedItem?: ComboboxProps["initialSelectedItem"]; /** Default selected item */ defaultSelectedItem?: ComboboxProps["defaultSelectedItem"]; /** Initial selected items for multiple selection */ initialSelectedItems?: UseDownshiftMultipleSelectionProps["initialSelectedItems"]; /** Default selected items for multiple selection */ defaultSelectedItems?: UseDownshiftMultipleSelectionProps["defaultSelectedItems"]; /** Whether to trigger query on input value change */ updateOnInputValueChange?: boolean; /** Whether to trigger query on selected item change */ updateOnSelectedItemChange?: boolean; /** Whether to trigger query on selected items change */ updateOnSelectedItemsChange?: boolean; /** Whether to trigger query on first render */ queryOnFirstRender?: boolean; /** Custom function to determine when to trigger query */ shouldTriggerQuery?: (element: EventTarget & HTMLElement) => boolean; } & ({ queryInitialItems?: never; /** Initial items array (mutually exclusive with queryInitialItems) */ initialItems?: Item[]; } | { /** Function to get initial items (mutually exclusive with initialItems) */ queryInitialItems?: () => Item[]; initialItems?: never; }); /** * Hook for implementing infinite scroll functionality in combobox components. * * Features: * - Automatic pagination with scroll-based loading * - Configurable query triggers (input change, selection change, scroll) * - Debounced query execution to prevent excessive API calls * - Automatic retry logic with exponential backoff * - Support for both single and multiple selection modes * - Customizable scroll threshold for triggering new queries * - Loading state management with deferred updates * - Automatic detection of pagination end * - Support for initial items or query-based initialization * * @param options Configuration options for the infinite combobox * @returns Object containing comboboxProps and contentProps for use with Combobox component * * @example * const { comboboxProps, contentProps } = useInfiniteCombobox({ * initialItems: [], * initialPage: 0, * initialLoading: true, * query: async ({ page, inputValue, selectedItems }) => { * return await fetchItems({ * page, * pageSize: 25, * searchTerm: inputValue, * excludeIds: selectedItems.map(item => item.id), * }); * }, * }); * * return ( * * * * {({ items }) => ( * * {items.map((item, i) => ( * * {item.name} * * ))} * * )} * * * ); */ export declare function useInfiniteCombobox({ query, queryInitialItems, initialItems, initialPage, initialLoading, initialInputValue, defaultInputValue, initialSelectedItem, defaultSelectedItem, initialSelectedItems, defaultSelectedItems, updateOnInputValueChange, updateOnSelectedItemChange, updateOnSelectedItemsChange, queryOnFirstRender, shouldTriggerQuery: shouldTriggerQueryProp, }: UseInfiniteComboboxProps): { comboboxProps: { items: Item[]; loading: boolean; initialInputValue: string | undefined; defaultInputValue: string | undefined; initialSelectedItem: Item | null | undefined; defaultSelectedItem: Item | null | undefined; initialSelectedItems: Item[] | undefined; defaultSelectedItems: Item[] | undefined; disableFilter: boolean; onStateChange: (changes: Parameters>[0]) => void; }; contentProps: { onScroll: (e: UIEvent) => void; scrollerRef: import('react').RefObject; }; };