UNPKG

@base-ui-components/react

Version:

Base UI is a library of headless ('unstyled') React components and low-level hooks. You gain complete control over your app's CSS and accessibility features.

129 lines 5.91 kB
import { Store } from '@base-ui-components/utils/store'; import type { InteractionType } from '@base-ui-components/utils/useEnhancedClickHandler'; import type { TransitionStatus } from "../utils/useTransitionStatus.js"; import type { HTMLProps } from "../utils/types.js"; import type { useFieldControlValidation } from "../field/control/useFieldControlValidation.js"; import type { ComboboxRootInternal } from "./root/ComboboxRootInternal.js"; export type State = { id: string | undefined; query: string; filter: (item: any, query: string) => boolean; items: any[] | undefined; selectedValue: any; inputValue: React.ComponentProps<'input'>['value']; open: boolean; mounted: boolean; transitionStatus: TransitionStatus; forceMounted: boolean; inline: boolean; activeIndex: number | null; selectedIndex: number | null; popupProps: HTMLProps; inputProps: HTMLProps; triggerProps: HTMLProps; typeaheadTriggerProps: HTMLProps; positionerElement: HTMLElement | null; listElement: HTMLElement | null; triggerElement: HTMLElement | null; inputElement: HTMLInputElement | null; openMethod: InteractionType | null; inputInsidePopup: boolean; selectionMode: 'single' | 'multiple' | 'none'; listRef: React.RefObject<Array<HTMLElement | null>>; popupRef: React.RefObject<HTMLDivElement | null>; inputRef: React.RefObject<HTMLInputElement | null>; keyboardActiveRef: React.RefObject<boolean>; chipsContainerRef: React.RefObject<HTMLDivElement | null>; clearRef: React.RefObject<HTMLButtonElement | null>; valuesRef: React.RefObject<Array<any>>; allValuesRef: React.RefObject<Array<any>>; setOpen: (open: boolean, eventDetails: ComboboxRootInternal.ChangeEventDetails) => void; setInputValue: (value: string, eventDetails: ComboboxRootInternal.ChangeEventDetails) => void; setSelectedValue: (value: any, eventDetails: ComboboxRootInternal.ChangeEventDetails) => void; setIndices: (indices: { activeIndex?: number | null; selectedIndex?: number | null; type?: 'keyboard' | 'pointer' | 'none'; }) => void; onItemHighlighted: (item: any, info: { type: 'keyboard' | 'pointer' | 'none'; index: number; }) => void; forceMount: () => void; handleEnterSelection: (event: Event) => void; getItemProps: (props?: HTMLProps & { active?: boolean; selected?: boolean; }) => Record<string, unknown>; name: string | undefined; disabled: boolean; readOnly: boolean; required: boolean; fieldControlValidation: ReturnType<typeof useFieldControlValidation>; cols: number; isGrouped: boolean; virtualized: boolean; onOpenChangeComplete: (open: boolean) => void; openOnInputClick: boolean; itemToStringLabel?: (item: any) => string; modal: boolean; autoHighlight: boolean; }; export type ComboboxStore = Store<State>; export declare const selectors: { id: (state: State) => string | undefined; query: (state: State) => string; items: (state: State) => any[] | undefined; selectedValue: (state: State) => any; inputValue: (state: State) => string | number | readonly string[] | undefined; open: (state: State) => boolean; mounted: (state: State) => boolean; forceMounted: (state: State) => boolean; inline: (state: State) => boolean; activeIndex: (state: State) => number | null; selectedIndex: (state: State) => number | null; isActive: (state: State, index: number) => boolean; isSelected: (state: State, selectedValue: any) => boolean; transitionStatus: (state: State) => TransitionStatus; popupProps: (state: State) => HTMLProps; inputProps: (state: State) => HTMLProps; triggerProps: (state: State) => HTMLProps; typeaheadTriggerProps: (state: State) => HTMLProps; getItemProps: (state: State) => (props?: HTMLProps & { active?: boolean; selected?: boolean; }) => Record<string, unknown>; positionerElement: (state: State) => HTMLElement | null; listElement: (state: State) => HTMLElement | null; triggerElement: (state: State) => HTMLElement | null; inputElement: (state: State) => HTMLInputElement | null; openMethod: (state: State) => InteractionType | null; inputInsidePopup: (state: State) => boolean; selectionMode: (state: State) => "none" | "multiple" | "single"; listRef: (state: State) => import("react").RefObject<(HTMLElement | null)[]>; popupRef: (state: State) => import("react").RefObject<HTMLDivElement | null>; inputRef: (state: State) => import("react").RefObject<HTMLInputElement | null>; keyboardActiveRef: (state: State) => import("react").RefObject<boolean>; chipsContainerRef: (state: State) => import("react").RefObject<HTMLDivElement | null>; clearRef: (state: State) => import("react").RefObject<HTMLButtonElement | null>; valuesRef: (state: State) => import("react").RefObject<any[]>; allValuesRef: (state: State) => import("react").RefObject<any[]>; name: (state: State) => string | undefined; disabled: (state: State) => boolean; readOnly: (state: State) => boolean; required: (state: State) => boolean; fieldControlValidation: (state: State) => { getValidationProps: (externalProps?: {}) => import("../utils/types.js").WithBaseUIEvent<any>; getInputValidationProps: (externalProps?: {}) => import("../utils/types.js").WithBaseUIEvent<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>>; inputRef: import("react").RefObject<HTMLInputElement | null>; commitValidation: (value: unknown, revalidate?: any) => Promise<void>; }; cols: (state: State) => number; isGrouped: (state: State) => boolean; virtualized: (state: State) => boolean; onOpenChangeComplete: (state: State) => (open: boolean) => void; openOnInputClick: (state: State) => boolean; itemToStringLabel: (state: State) => ((item: any) => string) | undefined; modal: (state: State) => boolean; autoHighlight: (state: State) => boolean; };