Sources
Numbered cards for what an answer drew on.
SourcePackage @kerf-js/veneer
Preview
tsx
import { Sources } from '@kerf-js/veneer'import type { AgentSource } from '@kerf-js/veneer'export function Deploy() { return ( <Sources items={DEPLOY_SOURCES} base="deploy" /> )}const DEPLOY_SOURCES: AgentSource[] = [ { title: 'd-4819 build log', path: 'mobile-bff · 15:27', snippet: 'health check failed: upstream ' + 'timed out after 3000 ms in ' + 'ap-south', }, { title: 'Health checks', path: 'kerf docs · Deploys', snippet: 'A deploy that fails three ' + 'checks in a row is held back ' + 'from traffic.', }, { title: 'c44e190', path: 'mobile-bff · retry.ts · L18', snippet: 'const attempts = 5 // was 2', },]Installation
npm install @kerf-js/veneerUsage
tsx
import { Sources } from '@kerf-js/veneer'<Sources items={DEPLOY_SOURCES} base="deploy"/>Accessibility
- This has no shortcuts of its own: controls inside it use Tab, Enter and Space as usual, and veneer's parts keep their roles and labels.
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
items | AgentSource[] | — | The sources, in the same order as their numbers. |
base | string | — | Joins the cards to their Cite links: a card's id is {base}-s1. |