KQ-161 · CHIP/CLOUD

Chip Cloud

A multi-select field split in two: a tray of what you have picked and a cloud of what is left. Picking a chip flies the very same pill out of the cloud and into the tray while the survivors close the gap; picking it again flies it home.

KQ-161 · CHIP/CLOUD
Calibration tags
1 picked: Damping

Picked 1 of 8

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/chip-cloud

Props

PropTypeDefaultDescription
chipsChip[]The full roster; picked chips gather in the tray.
value / defaultValuestring[]Controlled or initial picks, in pick order.
onValueChange(ids) => voidFires the picked ids whenever the set changes.
label / placeholderReactNode / stringGroup label, and the copy shown while the tray is empty.