Transfer

Dual left/right panels with shuttle buttons in the middle, supporting search filtering and keyboard operation.

Basic Usage

Basic

Example

Preset Values & Titles

Preset value + titles

Example

Searchable

searchable

Example

Case-sensitive Search

searchable + case-sensitive

Example

One-way Mode

Move left to right only; the right panel is read-only. The left panel shows all data, already transferred items are disabled and shown as selected.

one-way

Example

Virtual Scroll

Windowed rendering for tens of thousands of items with smooth scrolling; selection, select-all and keyboard navigation keep working.

virtual (10000 items, item-height 32)

Example

Events

Change events

Example

API

Attributes

Attribute	Description	Type	Default
case-sensitive	Search filtering is case-sensitive (case-insensitive by default)	boolean	—
data	Data (JSON attribute channel; property assignment reflects to attribute, [{ key, label, disabled }])	TransferItem[] | string	[]
item-height	Fixed row height for virtual scrolling (px), default 36	string	36
one-way	One-way mode: move left to right only, right panel is read-only; left panel shows all data, already transferred items are disabled and shown as selected	boolean	—
searchable	Search filtering within panels (filtered independently per panel)	boolean	—
source-title	—	—	—
target-title	—	—	—
titles	Panel titles (JSON array) or source-title/target-title	string	—
value	Selected key array (JSON attribute)	string	[]
virtual	Windowed rendering for large data (virtual scroll, default row height 36px)	boolean	—

Events

Event	Description
oas-change	Value change after shuttling, detail: { value }

Keyboard: after focusing a panel list, ↑/↓ moves the selection, Enter shuttles.