KQ-643 · ADDRESS/CHIP
Address Chip
An address shown head-and-tail with the middle collapsed to a real zero-width box; hover or focus glides it open to the width a ResizeObserver measured on the inner run, and the three dots close as the characters arrive. Pressing copies the whole address, draws the tick on flick and stamps a pill over the chip on recoil. Enter or Space copies, Escape shuts the middle without giving up focus.
KQ-643 · ADDRESS/CHIP
Deposit BSNBasin network
Only send BSN on the Basin network. Anything else arrives nowhere.
Address collapsed · not copied
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/address-chip
Props
- address
- string
- default —
- The full address. Copied verbatim — the clipboard never gets the abbreviation.
- head
- number
- default 6
- Characters kept before the collapsed middle.
- tail
- number
- default 4
- Characters kept after it.
- label
- string
- default "Address"
- Names the chip for assistive technology and titles the copy action.
- expanded
- boolean
- default —
- Forces the middle open (or shut) regardless of hover and focus.
- onExpandedChange
- (expanded: boolean) => void
- default —
- Fires from the hover, focus, or Escape that changed the middle's state.
- onCopy
- (address: string, ok: boolean) => void
- default —
- Fires from the copy press once the clipboard has answered.
| Prop | Type | Default | Description |
|---|---|---|---|
| address | string | — | The full address. Copied verbatim — the clipboard never gets the abbreviation. |
| head | number | 6 | Characters kept before the collapsed middle. |
| tail | number | 4 | Characters kept after it. |
| label | string | "Address" | Names the chip for assistive technology and titles the copy action. |
| expanded | boolean | — | Forces the middle open (or shut) regardless of hover and focus. |
| onExpandedChange | (expanded: boolean) => void | — | Fires from the hover, focus, or Escape that changed the middle's state. |
| onCopy | (address: string, ok: boolean) => void | — | Fires from the copy press once the clipboard has answered. |