import type { BaseComboboxProps } from '@fluentui/react-combobox';
import type { BaseComboboxState } from '@fluentui/react-combobox';
import { ComboboxContextValues } from '@fluentui/react-combobox';
import { ComboboxSlots } from '@fluentui/react-combobox';
import type { ForwardRefComponent } from '@fluentui/react-utilities';
import type { JSXElement } from '@fluentui/react-utilities';
import { ListboxContextValues } from '@fluentui/react-combobox';
import { ListboxProps } from '@fluentui/react-combobox';
import { ListboxSlots } from '@fluentui/react-combobox';
import { ListboxState } from '@fluentui/react-combobox';
import { OptionGroupProps } from '@fluentui/react-combobox';
import { OptionGroupSlots } from '@fluentui/react-combobox';
import { OptionGroupState } from '@fluentui/react-combobox';
import { OptionProps } from '@fluentui/react-combobox';
import { OptionSlots } from '@fluentui/react-combobox';
import type { OptionState as OptionState_2 } from '@fluentui/react-combobox';
import type { PositioningProps as PositioningProps_2 } from '@fluentui/react-positioning';
import type { PositioningShorthandValue } from '@fluentui/react-positioning';
import type * as React_2 from 'react';
import { renderListbox_unstable as renderListbox } from '@fluentui/react-combobox';
import { renderOption_unstable as renderOption } from '@fluentui/react-combobox';
import { renderOptionGroup_unstable as renderOptionGroup } from '@fluentui/react-combobox';
import { useListboxContextValues } from '@fluentui/react-combobox';

export declare const Combobox: ForwardRefComponent<ComboboxProps>;

export declare type ComboboxProps = Omit<BaseComboboxProps, 'inlinePopup' | 'mountNode' | 'positioning'> & {
    positioning?: PositioningShorthand;
};

export { ComboboxSlots }

export declare type ComboboxState = BaseComboboxState & {
    root: {
        /**
         * Whether the dropdown is currently open.
         */
        'data-open'?: string;
        /**
         * Whether the trigger element is currently disabled.
         */
        'data-disabled'?: string;
        /**
         * Whether the trigger element is currently displaying a placeholder.
         */
        'data-placeholder'?: string;
        /**
         * Whether the trigger element is currently invalid.
         */
        'data-invalid'?: string;
        /**
         * Wether the clear icon is visible.
         */
        'data-clearable'?: string;
    };
};

/**
 * Listbox component: a standalone selection control, or the popup in a Combobox.
 */
export declare const Listbox: ForwardRefComponent<ListboxProps>;

export { ListboxContextValues }

export { ListboxProps }

export { ListboxSlots }

export { ListboxState }

/**
 * Option component used inside Listbox.
 */
declare const Option_2: ForwardRefComponent<OptionProps>;
export { Option_2 as Option }

/**
 * OptionGroup component used inside Listbox.
 */
export declare const OptionGroup: ForwardRefComponent<OptionGroupProps>;

export { OptionGroupProps }

export { OptionGroupSlots }

export { OptionGroupState }

export { OptionProps }

export { OptionSlots }

/**
 * State used in rendering Option
 */
export declare type OptionState = OptionState_2 & {
    root: {
        /**
         * Whether the option is currently disabled.
         */
        'data-disabled'?: string;
        /**
         * Whether the option is currently selected.
         */
        'data-selected'?: string;
        /**
         * Whether the option belongs to a multiselect listbox.
         */
        'data-multiselect'?: string;
    };
};

declare type PositioningProps = Pick<PositioningProps_2, 'align' | 'coverTarget' | 'fallbackPositions' | 'matchTargetSize' | 'offset' | 'pinned' | 'position' | 'positioningRef' | 'strategy' | 'target'>;

declare type PositioningShorthand = PositioningProps | PositioningShorthandValue;

export declare const renderCombobox: (state: ComboboxState, contextValues: ComboboxContextValues) => JSXElement;

export { renderListbox }

export { renderOption }

export { renderOptionGroup }

export declare const useCombobox: (props: ComboboxProps, ref: React_2.Ref<HTMLInputElement>) => ComboboxState;

export declare const useComboboxContextValues: (state: ComboboxState) => ComboboxContextValues;

/**
 * A hook that filters a list of options based on a query string and returns the filtered options as JSX elements.
 *
 * @param config - The configuration object for the hook.
 * @returns An array of JSX elements representing the filtered options.
 */
export declare function useComboboxFilter({ filter: filterOverride, noOptionsElement, renderOption, query, options, }: UseComboboxFilterConfig): JSXElement[];

declare type UseComboboxFilterConfig = {
    /**
     * The current query string used to filter the options.
     */
    query: string;
    /**
     * The list of options to filter.
     */
    options: string[];
    /**
     * Optional filter function to override the default filtering behavior.
     */
    filter?: (option: string, index: number) => boolean;
    /**
     * Element to render when there are no options to display.
     */
    noOptionsElement: JSXElement;
    /**
     * A function that renders an option element for a given option.
     * Use it to customize how options are displayed in the listbox.
     */
    renderOption: (option: string) => JSXElement;
};

/**
 * Returns the state for a Listbox component, given its props and ref.
 * The returned state can be modified with hooks before being passed to `renderListbox`.
 */
export declare const useListbox: (props: ListboxProps, ref: React_2.Ref<HTMLElement>) => ListboxState;

export { useListboxContextValues }

/**
 * Returns the state for an Option component, given its props and ref.
 * The returned state can be modified with hooks before being passed to `renderOption`.
 */
export declare const useOption: (props: OptionProps, ref: React_2.Ref<HTMLElement>) => OptionState;

/**
 * Returns the state for an OptionGroup component, given its props and ref.
 * The returned state can be modified with hooks before being passed to `renderOptionGroup`.
 */
export declare const useOptionGroup: (props: OptionGroupProps, ref: React_2.Ref<HTMLElement>) => OptionGroupState;

export { }