@kit-ng-ui/transfer
v0.1.0
Published
Kit UI Transfer — dual-list selector with arrow controls.
Readme
@kit-ng-ui/transfer
Dual-list selector. Items move between source and target panes via arrow buttons.
Install
pnpm add @kit-ng-ui/transfer@use '@kit-ng-ui/transfer/styles' as transfer;Usage
items: KitTransferItem[] = [
{ key: 'a', title: 'Apple' },
{ key: 'b', title: 'Banana' },
{ key: 'c', title: 'Cherry' },
];<kit-transfer
[items]="items"
[(targetKeys)]="picked"
[titles]="['Available', 'Selected']"
></kit-transfer>API
| Input | Type | Default |
| ------------ | ------------------------------------- | ------------------------ |
| items | ReadonlyArray<KitTransferItem> | [] |
| targetKeys | ReadonlyArray<string> (two-way) | [] |
| titles | ReadonlyArray<string> | ['Source', 'Target'] |
| disabled | boolean | false |
| Output | Payload | Description |
| ------- | ------------------------ | ---------------------------------------- |
| change | ReadonlyArray<string> | Fires after a move; carries new target keys. |
v0.1 omits search filter and custom item render — pass items pre-shaped for display.
