跳到主要内容

ui/build/combobox

ui/build/combobox

Interfaces

TClientConfig

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:162

Configuration for client-side filtering.

Properties

error?
optional error?: string | null;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:166

An optional error message to display.

isLoading?
optional isLoading?: boolean;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:164

An optional loading state, controlled by the parent.

TComboboxBaseProps

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:78

Base properties shared across all combobox types.

Type Parameters

Type Parameter Default type
T -
TAdditionalProps extends Record<string, unknown> -
TMultiple extends boolean false

Properties

align?
optional align?: "start" | "end" | "center";

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:133

allowClear?
optional allowClear?: boolean;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:98

allowClickToSetNull?
optional allowClickToSetNull?: boolean;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:100

When true, clicking an already-selected option clears the value (single-select only).

allowSelectAll?
optional allowSelectAll?: TMultiple extends true ? boolean : never;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:86

Adds a keyboard-accessible row for selecting or clearing every loaded option. Only available for client-side multi-select comboboxes without infinite loading.

ariaLabel?
optional ariaLabel?: string;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:119

Stable accessible name for the combobox trigger. Defaults to the current selection summary.

avoidCollisions?
optional avoidCollisions?: boolean;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:148

When true, the dropdown is clamped to whichever viewport edge it collides with instead of spilling past it: the preferred side is flipped and the alignment is shifted along the anchor until the dropdown fits.

Handled natively by the underlying floating primitive (flip + shift), so the position is re-evaluated on scroll and resize rather than only when the dropdown opens.

Set to false to pin the dropdown to align exactly and allow it to overflow.

Default
true

class?
optional class?: string;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:129

collisionPadding?
optional collisionPadding?: number;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:156

Virtual padding, in pixels, inset from the viewport edges when detecting collisions. Larger values keep the dropdown further away from the edge it clamps against. Has no effect when avoidCollisions is false.

Default
8

disabled?
optional disabled?: boolean;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:102

display?
optional display?: Snippet<[TMultiple extends true ? T[] : T]>;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:87

optional dropdownClass?: string;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:132

emptyPlaceholder?
optional emptyPlaceholder?: string | Snippet<[]>;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:88

optional footer?: Snippet<[]>;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:110

Optional custom footer content rendered at the bottom of the dropdown.

groupHeaderHeight?
optional groupHeaderHeight?: number;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:123

optional header?: Snippet<[]>;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:108

Optional content rendered directly under the search box (option filters, scope pickers).

hideChevron?
optional hideChevron?: boolean;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:101

infiniteLoadingConfig?
optional infiniteLoadingConfig?: TInfiniteLoadingConfig;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:126

InlineCreateForm?
optional InlineCreateForm?: Snippet<[{
  cancel: () => void;
  newValue: string;
  onSuccess: (newOption) => void;
  setSubmitting: (v) => void;
  submitting: boolean;
}]>;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:89

invalid?
optional invalid?: boolean;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:103

itemHeight?
optional itemHeight?: number;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:122

maxHeight?
optional maxHeight?: number;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:124

maxWidth?
optional maxWidth?: number;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:135

minWidth?
optional minWidth?: number;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:134

multiple?
optional multiple?: TMultiple;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:81

onValueChange?
optional onValueChange?: (value) => void;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:157

Parameters
Parameter Type
value TMultiple extends true ? T[] | null : T | null
Returns

void

open?
optional open?: boolean;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:116

options
options: TOption<T, TAdditionalProps>[];

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:79

overscan?
optional overscan?: number;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:125

preserveOptionOrder?
optional preserveOptionOrder?: boolean;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:115

When true, preserves the original options order exactly. When false (default), the current selection is floated to the top for readability.

readonly?
optional readonly?: boolean;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:104

readonlyContent?
optional readonlyContent?: Snippet<[]>;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:105

sameWidth?
optional sameWidth?: boolean;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:131

scrollToSelection?
optional scrollToSelection?: boolean;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:128

When true, scroll the list to the current selection upon opening.

searchable?
optional searchable?: boolean;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:120

searchPlaceholder?
optional searchPlaceholder?: string;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:121

style?
optional style?: string;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:117

triggerClass?
optional triggerClass?: string;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:130

truncate?
optional truncate?: boolean;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:106

value?
optional value?: TMultiple extends true ? T[] | null : T | null;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:80

TComboboxClientProps

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:188

Properties for the client-side filtering combobox.

Properties

clientConfig?
optional clientConfig?: TClientConfig;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:192

An optional object for client-side configurations like loading and error states.

serverConfig?
optional serverConfig?: undefined;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:194

Server config is not applicable for client-side filtering.

type?
optional type?: "client";

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:190

Specifies that filtering is handled client-side.

TInfiniteLoadingConfig

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:58

Configuration for the infinite loading feature. When provided, the component will monitor scroll position and request more data as needed.

Properties

handleInfiniteLoad
handleInfiniteLoad: (info) => void;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:70

A callback function triggered when the user scrolls near the end of the list. The parent component is responsible for fetching more data and updating the options prop.

Parameters
Parameter Type Description
info { lastVirtualIndex: number; loadedCount: number; } Details about the current state for fetching.
info.lastVirtualIndex number The index of the last rendered virtual item.
info.loadedCount number The number of items currently loaded in the component.
Returns

void

hasMore
hasMore: boolean;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:62

A boolean indicating if there are more items to fetch.

total
total: number;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:60

The total number of items available on the server.

TServerConfig

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:171

Configuration for server-side filtering.

Properties

error?
optional error?: string | null;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:183

An optional error message to display.

isLoading?
optional isLoading?: boolean;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:181

Set to true to display a loading indicator. This should be managed by the parent.

onSearch
onSearch: (query) => void;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:177

Required. A callback that communicates the search query to the parent. The parent is responsible for updating the options prop.

Parameters
Parameter Type Description
query string The current search string.
Returns

void

Type Aliases

TComboboxCommandItem

type TComboboxCommandItem<T, TAdditionalProps> =
  | {
  _groupName: string;
  _type: "group";
  disabled: boolean;
  label: string;
  value: string;
}
  | {
  _allSelected: boolean;
  _selectedCount: number;
  _totalCount: number;
  _type: "select-all";
  label: string;
  value: string;
}
  | {
  _option: TOption<T, TAdditionalProps>;
  _type: "option";
  label: string;
  value: string;
}
  | {
  _type: "create";
  label: string;
  value: string;
};

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:31

Type Parameters

Type Parameter
T
TAdditionalProps extends Record<string, unknown>

TComboboxProps

type TComboboxProps<T, TAdditionalProps, TMultiple> = TComboboxBaseProps<T, TAdditionalProps, TMultiple> &
  | TComboboxClientProps
  | TComboboxServerProps;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:215

A discriminated union of combobox properties, providing strong type-safety based on the filtering type.

Type Parameters

Type Parameter Default type Description
T - The underlying data type of an option's value.
TAdditionalProps extends Record<string, unknown> - A record of extra props for the option label snippet.
TMultiple extends boolean false A boolean indicating if multi-select is enabled.

TOption

type TOption<T, AP> = object;

Defined in: apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:8

Represents a single selectable option within the combobox.

Type Parameters

Type Parameter Description
T The underlying data type of the option's value.
AP extends Record<string, unknown> A record of additional properties for custom label rendering.

Properties

Property Type Description Defined in
additionalLabelProps? AP Extra props to be spread into the label snippet for custom rendering. apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:10
badge? string Optional compact trailing label shown in the dropdown. apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:27
description? string An optional longer description for the option. apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:23
icon? string Optional leading Iconify icon shown in the dropdown. apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:25
label Snippet<[T, AP, (e) => void]> | string The display label for the option. Can be a simple string or a Svelte Snippet for complex, custom rendering. apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:15
search_term? string Additional text to be included during client-side filtering. apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:29
type? string An optional category to group the option under. apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:21
value T The unique value of the option. apps/website/.api-docs-entry/ui/build/combobox/index.d.ts:19