packages/react-components/react-combobox/library/etc/react-combobox.api.md
Do not edit this file. It is a report generated by API Extractor.
import { ActiveDescendantChangeEvent } from '@fluentui/react-aria';
import type { ActiveDescendantContextValue } from '@fluentui/react-aria';
import { ActiveDescendantImperativeRef } from '@fluentui/react-aria';
import type { ComponentProps } from '@fluentui/react-utilities';
import type { ComponentState } from '@fluentui/react-utilities';
import { ContextSelector } from '@fluentui/react-context-selector';
import { EventData } from '@fluentui/react-utilities';
import { EventHandler } from '@fluentui/react-utilities';
import type { ExtractSlotProps } from '@fluentui/react-utilities';
import { FC } from 'react';
import type { ForwardRefComponent } from '@fluentui/react-utilities';
import type { JSXElement } from '@fluentui/react-utilities';
import { PortalProps } from '@fluentui/react-portal';
import type { PositioningShorthand } from '@fluentui/react-positioning';
import { Provider } from 'react';
import { ProviderProps } from 'react';
import * as React_2 from 'react';
import type { Slot } from '@fluentui/react-utilities';
import { SlotClassNames } from '@fluentui/react-utilities';
import type { SlotComponentType } from '@fluentui/react-utilities';
// @public
export const Combobox: ForwardRefComponent<ComboboxProps>;
// @public
export type ComboboxBaseProps = SelectionProps & HighlightedOptionProps & Pick<PortalProps, 'mountNode'> & {
appearance?: 'filled-darker' | 'filled-lighter' | 'outline' | 'underline';
clearable?: boolean;
defaultOpen?: boolean;
defaultValue?: string;
disableAutoFocus?: boolean;
inlinePopup?: boolean;
onOpenChange?: (e: ComboboxBaseOpenEvents, data: ComboboxBaseOpenChangeData) => void;
open?: boolean;
placeholder?: string;
positioning?: PositioningShorthand;
size?: 'small' | 'medium' | 'large';
value?: string;
};
// @public
export type ComboboxBaseState = Required<Pick<ComboboxBaseProps, 'appearance' | 'open' | 'clearable' | 'inlinePopup' | 'size'>> & Pick<ComboboxBaseProps, 'mountNode' | 'placeholder' | 'value' | 'multiselect'> & OptionCollectionState & SelectionState & {
activeOption?: OptionValue;
focusVisible: boolean;
ignoreNextBlur: React_2.MutableRefObject<boolean | null>;
setActiveOption: React_2.Dispatch<React_2.SetStateAction<OptionValue | undefined>>;
setFocusVisible(focusVisible: boolean): void;
hasFocus: boolean;
setHasFocus(hasFocus: boolean): void;
setOpen(event: ComboboxBaseOpenEvents, newState: boolean): void;
setValue(newValue: string | undefined): void;
onOptionClick: (e: React_2.MouseEvent<HTMLElement>) => void;
disabled: boolean;
freeform: boolean;
onActiveDescendantChange: (event: ActiveDescendantChangeEvent) => void;
};
// @public (undocumented)
export const comboboxClassNames: SlotClassNames<ComboboxSlots>;
// @public
export type ComboboxContextValue = Pick<ComboboxState, 'activeOption' | 'appearance' | 'focusVisible' | 'open' | 'registerOption' | 'setActiveOption' | 'setOpen' | 'size'> & {
selectedOptions: ComboboxState['selectedOptions'];
selectOption: ComboboxState['selectOption'];
};
// @public (undocumented)
export type ComboboxContextValues = ComboboxBaseContextValues;
// @public (undocumented)
export type ComboboxOpenChangeData = ComboboxBaseOpenChangeData;
// @public (undocumented)
export type ComboboxOpenEvents = ComboboxBaseOpenEvents;
// @public
export type ComboboxProps = Omit<ComponentProps<Partial<ComboboxSlots>, 'input'>, 'children' | 'size'> & ComboboxBaseProps & {
freeform?: boolean;
children?: React_2.ReactNode;
};
// @public @deprecated (undocumented)
export const ComboboxProvider: Provider<ComboboxContextValue> & FC<ProviderProps<ComboboxContextValue>>;
// @public (undocumented)
export type ComboboxSlots = {
root: NonNullable<Slot<'div'>>;
expandIcon?: Slot<'span'>;
clearIcon?: Slot<'span'>;
input: NonNullable<Slot<'input'>>;
listbox?: Slot<typeof Listbox>;
};
// @public
export type ComboboxState = ComponentState<ComboboxSlots> & ComboboxBaseState & {
showClearIcon?: boolean;
activeDescendantController: ActiveDescendantImperativeRef;
};
// @public
export const Dropdown: ForwardRefComponent<DropdownProps>;
// @public (undocumented)
export const dropdownClassNames: SlotClassNames<DropdownSlots>;
// @public (undocumented)
export type DropdownContextValues = ComboboxBaseContextValues;
// @public (undocumented)
export type DropdownOpenChangeData = ComboboxBaseOpenChangeData;
// @public (undocumented)
export type DropdownOpenEvents = ComboboxBaseOpenEvents;
// @public
export type DropdownProps = ComponentProps<Partial<DropdownSlots>, 'button'> & ComboboxBaseProps;
// @public (undocumented)
export type DropdownSlots = {
root: NonNullable<Slot<'div'>>;
expandIcon?: Slot<'span'>;
clearButton?: Slot<'button'>;
button: NonNullable<Slot<'button'>>;
listbox?: Slot<typeof Listbox>;
};
// @public
export type DropdownState = ComponentState<DropdownSlots> & Omit<ComboboxBaseState, 'freeform'> & {
placeholderVisible: boolean;
showClearButton?: boolean;
activeDescendantController: ActiveDescendantImperativeRef;
};
// @public
export const Listbox: ForwardRefComponent<ListboxProps>;
// @public (undocumented)
export const listboxClassNames: SlotClassNames<ListboxSlots>;
// @public
export type ListboxContextValue = Pick<ListboxState, 'activeOption' | 'focusVisible' | 'getOptionById' | 'getOptionsMatchingValue' | 'multiselect' | 'registerOption' | 'selectedOptions' | 'selectOption' | 'setActiveOption'> & {
onOptionClick: (e: React_2.MouseEvent<HTMLElement>) => void;
onActiveDescendantChange?: (e: ActiveDescendantChangeEvent) => void;
};
// @public (undocumented)
export type ListboxContextValues = {
listbox: ListboxContextValue;
activeDescendant: ActiveDescendantContextValue;
};
// @public
export type ListboxProps = ComponentProps<ListboxSlots> & SelectionProps & {
disableAutoFocus?: boolean;
};
// @public (undocumented)
export const ListboxProvider: React_2.Provider<ListboxContextValue | undefined> & React_2.FC<React_2.ProviderProps<ListboxContextValue | undefined>>;
// @public (undocumented)
export type ListboxSlots = {
root: Slot<'div'>;
};
// @public
export type ListboxState = ComponentState<ListboxSlots> & OptionCollectionState & Pick<SelectionProps, 'multiselect'> & SelectionState & {
activeOption?: OptionValue;
focusVisible: boolean;
setActiveOption(option?: OptionValue): void;
standalone: boolean;
selectOption(event: SelectionEvents, option: OptionValue): void;
activeDescendantController: ActiveDescendantImperativeRef;
onActiveDescendantChange?: (event: ActiveDescendantChangeEvent) => void;
};
// @public
const Option_2: ForwardRefComponent<OptionProps>;
export { Option_2 as Option }
// @public (undocumented)
export const optionClassNames: SlotClassNames<OptionSlots>;
// @public
export const OptionGroup: ForwardRefComponent<OptionGroupProps>;
// @public (undocumented)
export const optionGroupClassNames: SlotClassNames<OptionGroupSlots>;
// @public
export type OptionGroupProps = ComponentProps<Partial<OptionGroupSlots>>;
// @public (undocumented)
export type OptionGroupSlots = {
root: NonNullable<Slot<'div'>>;
label?: Slot<'span'>;
};
// @public
export type OptionGroupState = ComponentState<OptionGroupSlots>;
// @public
export type OptionOnSelectData = {
optionValue: string | undefined;
optionText: string | undefined;
selectedOptions: string[];
};
// @public
export type OptionProps = ComponentProps<Partial<OptionSlots>> & {
disabled?: boolean;
value?: string;
} & ({
text?: string;
children: string;
} | {
text: string;
children?: React_2.ReactNode;
});
// @public (undocumented)
export type OptionSlots = {
root: NonNullable<Slot<'div'>>;
checkIcon: Slot<'span'>;
};
// @public
export type OptionState = ComponentState<OptionSlots> & Pick<OptionProps, 'disabled'> & {
active: boolean;
focusVisible: boolean;
multiselect?: boolean;
selected: boolean;
};
// @public
export const renderCombobox_unstable: (state: ComboboxState, contextValues: ComboboxContextValues) => JSXElement;
// @public
export const renderDropdown_unstable: (state: DropdownState, contextValues: DropdownContextValues) => JSXElement;
// @public
export const renderListbox_unstable: (state: ListboxState, contextValues: ListboxContextValues) => JSXElement;
// @public
export const renderOption_unstable: (state: OptionState) => JSXElement;
// @public
export const renderOptionGroup_unstable: (state: OptionGroupState) => JSXElement;
// @public
export type SelectionEvents = React_2.ChangeEvent<HTMLElement> | React_2.KeyboardEvent<HTMLElement> | React_2.MouseEvent<HTMLElement>;
// @internal
export function useButtonTriggerSlot(triggerFromProps: NonNullable<Slot<'button'>>, ref: React_2.Ref<HTMLButtonElement>, options: UseButtonTriggerSlotOptions): SlotComponentType<ExtractSlotProps<Slot<'button'>>>;
// @public
export const useCombobox_unstable: (props: ComboboxProps, ref: React_2.Ref<HTMLInputElement>) => ComboboxState;
// @internal
export const useComboboxBaseState: (props: ComboboxBaseProps & {
children?: React_2.ReactNode;
editable?: boolean;
disabled?: boolean;
freeform?: boolean;
activeDescendantController: ActiveDescendantImperativeRef;
}) => ComboboxBaseState;
// @public (undocumented)
export function useComboboxContextValues(state: Omit<ComboboxBaseState, 'freeform'> & Pick<ComboboxState, 'activeDescendantController'>): ComboboxBaseContextValues;
// @internal (undocumented)
export function useComboboxFilter<T extends {
children: React_2.ReactNode;
value: string;
} | string>(query: string, options: T[], config: UseComboboxFilterConfig<T>): JSXElement[];
// @public
export const useComboboxStyles_unstable: (state: ComboboxState) => ComboboxState;
// @public
export const useDropdown_unstable: (props: DropdownProps, ref: React_2.Ref<HTMLButtonElement>) => DropdownState;
// @public
export const useDropdownStyles_unstable: (state: DropdownState) => DropdownState;
// @internal
export function useInputTriggerSlot(triggerFromProps: NonNullable<Slot<'input'>>, ref: React_2.Ref<HTMLInputElement>, options: UseInputTriggerSlotOptions): SlotComponentType<ExtractSlotProps<Slot<'input'>>>;
// @public
export const useListbox_unstable: (props: ListboxProps, ref: React_2.Ref<HTMLElement>) => ListboxState;
// @public (undocumented)
export const useListboxContext_unstable: <T>(selector: ContextSelector<ListboxContextValue, T>) => T;
// @public (undocumented)
export function useListboxContextValues(state: ListboxState): ListboxContextValues;
// @internal (undocumented)
export function useListboxSlot(listboxSlotFromProp: Slot<typeof Listbox> | undefined, ref: React_2.Ref<HTMLDivElement>, options: UseListboxSlotOptions): SlotComponentType<ExtractSlotProps<Slot<typeof Listbox>>> | undefined;
// @public
export const useListboxStyles_unstable: (state: ListboxState) => ListboxState;
// @public
export const useOption_unstable: (props: OptionProps, ref: React_2.Ref<HTMLElement>) => OptionState;
// @public
export const useOptionGroup_unstable: (props: OptionGroupProps, ref: React_2.Ref<HTMLElement>) => OptionGroupState;
// @public
export const useOptionGroupStyles_unstable: (state: OptionGroupState) => OptionGroupState;
// @public
export const useOptionStyles_unstable: (state: OptionState) => OptionState;
// (No @packageDocumentation comment for this package)