Transfer

Pass dataSource, targetKeys and onChange to move items between two panels, and store the keys onChange hands you.

Set oneWay so items only move to the right, where each one gets its own remove button instead of a back arrow.

Set showSearch to filter each panel, and filterOption to match fields the row does not show, like typing "write" to find read-write scopes.

Set pagination to page a long list, like a directory of 200 contacts shown 10 at a time with search.

Return a node from render to draw each row your way, like an avatar with a name and an email address.

Pass actions your own Button elements, like an Assign button that shows loading while it saves, and Transfer still disables each one until something is selected.

Pass actions two strings to label the move buttons with words instead of arrows, like Subscribe and Remove.

Pass footer a function to add content under each panel, using info.direction to tell the left one from the right.

Pass children a render function to draw the panel body yourself, like a Table whose row selection drives Transfer's.

Return a checkable Tree from children for the left panel and undefined for the right, which keeps the default list.

Set status to error or warning to color both panels' borders when the selection needs attention.

An editors card that adds people through a searchable one-way Transfer, with a count in the footer and a Save button.

An orders card that shows or hides table columns with a Transfer, and the table below updates as columns move.

A stock transfer between two warehouses, with searchable SKUs, a low-stock tag and a running unit count above the submit button.

A lab section that moves students off a waitlist, turns red when it goes over its seat limit and blocks confirming until it fits.

A hotel's room types split per sales channel, switched with a Segmented, with one room type disabled while it is under renovation.