Skip to content
Folio

Website

Evidence

Expandable traces, source stages, scores and timing summaries.

Usage

When to reach for it

Explain supplied evidence and progress without exposing private prompts or service details.

Ships from@misoto22/folio/website

TSX
import { EvidenceStatus } from '@misoto22/folio/website'

Best practices

Do

  • Supply localized labels, descriptive links and meaningful image alternatives.

Don’t

  • Do not put service credentials, routing logic or backend models inside presentation components.

Examples

a recorded trace

A recorded sample trace separates stage status, source facts and optional detail. Labels and measurements are supplied by the host rather than inferred from decorative progress.

Parts

Composed at the call site rather than configured through props, so a layout this component did not anticipate is still expressible.

ActivityTrace

Tool and job traces share one presentation; the caller supplies truthful, localized labels.

ActivityTrace props
PropTypeDefaultDescription
itemsrequiredActivityTraceItem[]
labelrequiredstring
waitingboolean
waitingLabelstring

Also accepts everything in HTMLAttributes<HTMLDivElement>. Those are forwarded to the underlying element and are not listed row by row.

EvidencePanel

EvidencePanel props
PropTypeDefaultDescription
eyebrowrequiredReactNode
staterequiredEvidenceState
stateLabelrequiredstring
titlerequiredstring

Also accepts everything in Omit<HTMLAttributes<HTMLElement>, 'title'>. Those are forwarded to the underlying element and are not listed row by row.

EvidenceSelection

EvidenceSelection props
PropTypeDefaultDescription
labelrequiredstring
onSelectrequired(id: string) => void
optionsrequired{ id: string; label: string }[]
selectedIdrequiredstring | null

Also accepts everything in Omit<HTMLAttributes<HTMLDivElement>, 'onSelect'>. Those are forwarded to the underlying element and are not listed row by row.

EvidenceFacts

EvidenceFacts props
PropTypeDefaultDescription
itemsrequiredDescriptionListItem[]
descriptionReactNode
titleReactNode

Also accepts everything in Omit<HTMLAttributes<HTMLDivElement>, 'title'>. Those are forwarded to the underlying element and are not listed row by row.

EvidenceDisclosure

EvidenceDisclosure props
PropTypeDefaultDescription
labelrequiredstring

Also accepts everything in HTMLAttributes<HTMLDivElement>. Those are forwarded to the underlying element and are not listed row by row.

EvidenceQuery

EvidenceQuery props
PropTypeDefaultDescription
fingerprintrequiredstring
labelrequiredstring
queryrequiredstring

Also accepts everything in HTMLAttributes<HTMLDivElement>. Those are forwarded to the underlying element and are not listed row by row.

EvidenceStages

Takes no props of its own.

EvidenceStage

EvidenceStage props
PropTypeDefaultDescription
descriptionrequiredReactNode
numberrequiredstring
staterequired'idle' | 'active' | 'done'
stateLabelrequiredstring
timerequiredReactNode
titlerequiredReactNode

Also accepts everything in Omit<HTMLAttributes<HTMLLIElement>, 'title'>. Those are forwarded to the underlying element and are not listed row by row.

EvidenceScores

EvidenceScores props
PropTypeDefaultDescription
itemsrequiredEvidenceScore[]

Also accepts everything in HTMLAttributes<HTMLDivElement>. Those are forwarded to the underlying element and are not listed row by row.

SignalFigure

A decorative signature supplied by the host, kept out of the evidence's accessibility tree.

SignalFigure props
PropTypeDefaultDescription
barsrequired{ height: number; opacity: number }[]
captionrequiredReactNode
detailrequiredReactNode
runningboolean
settledboolean

Also accepts everything in HTMLAttributes<HTMLDivElement>. Those are forwarded to the underlying element and are not listed row by row.

EvidenceMeter

EvidenceMeter props
PropTypeDefaultDescription
detailrequiredReactNode
labelrequiredstring
valueTextrequiredReactNode
valuenumber | nullLeave unset while the total is unknown.

Also accepts everything in HTMLAttributes<HTMLDivElement>. Those are forwarded to the underlying element and are not listed row by row.

EvidenceDurations

EvidenceDurations props
PropTypeDefaultDescription
itemsrequiredEvidenceDuration[]
labelrequiredstring
totalrequirednumber | null
totalTextrequiredstring

Also accepts everything in HTMLAttributes<HTMLDivElement>. Those are forwarded to the underlying element and are not listed row by row.

EvidenceSummary

EvidenceSummary props
PropTypeDefaultDescription
itemsrequiredDescriptionListItem[]

Also accepts everything in HTMLAttributes<HTMLDListElement>. Those are forwarded to the underlying element and are not listed row by row.

Types

TSX
export type EvidenceState = 'idle' | 'running' | 'done' | 'failed' | 'restored'