Interfaces
ContextWindowMeterProps
Properties
ContextWindowPanelProps
Properties
| Property | Type |
|---|---|
className? | string |
formatTokens? | (tokens: number) => string |
onCompactNow? | () => void |
slots? | ClassSlots |
snapshot | ContextWindowSnapshot |
ContextWindowRingProps
Properties
| Property | Type |
|---|---|
className? | string |
innerClassName? | string |
size? | number |
snapshot | ContextWindowSnapshot |
style? | CSSProperties |
EmptyStateProps
Properties
FoldProps
@pyric/ui/agents — headless structural components for agentic UIs
(chat surfaces, tool-call drill-ins, streaming state indicators).
Matches the rest of @pyric/ui: zero shipped CSS. Components emit
data-pyric-* attributes and accept className slots. Consumers
bring their own design system (Tailwind, CSS modules, plain CSS)
and attach styling via attribute selectors or class names.
Properties
| Property | Type | Description |
|---|---|---|
bodyClassName? | string | Forwarded to the body wrapper revealed when open. |
children | ReactNode | Revealed when the user expands. |
className? | string | Forwarded to the root <details> element. |
defaultOpen? | boolean | - |
header | ReactNode | Visible summary line, always rendered. |
headerAction? | ReactNode | Optional right-aligned action (e.g. a copy button). Children should stopPropagation so clicks don’t toggle the fold. |
summaryClassName? | string | Forwarded to the <summary> element. |
tone? | FoldTone | Surfaced via [data-pyric-fold-tone] so consumers can tint the summary or border based on semantic context (error / thought). Defaults to normal. |
ModalProps
Properties
PulsingDotProps
Properties
| Property | Type | Description |
|---|---|---|
className? | string | Forwarded to the outer wrapper. Consumers attach all visual styling (size, animation, color) via this hook or by selecting on [data-pyric-ui="pulsing-dot"]. |
RequestUsageTimelineProps
Properties
| Property | Type |
|---|---|
className? | string |
empty? | ReactNode |
formatTokens? | (tokens: number) => string |
onOpenTool? | (messageId: string, callId: string) => void |
requests | readonly SessionRequestUsage[] |
slots? | ClassSlots |
SessionSpendSummaryProps
Properties
| Property | Type |
|---|---|
className? | string |
currentContextTokens? | number |
formatTokens? | (tokens: number) => string |
slots? | ClassSlots |
usage? | SessionTokenUsage |
TokenUsageInlineProps
Properties
| Property | Type |
|---|---|
className? | string |
formatTokens? | (tokens: number) => string |
labelClassName? | string |
usage? | SessionTokenUsage |
valueClassName? | string |
Type Aliases
FoldTone
type FoldTone = "normal" | "error" | "thought";@pyric/ui/agents — headless structural components for agentic UIs
(chat surfaces, tool-call drill-ins, streaming state indicators).
Matches the rest of @pyric/ui: zero shipped CSS. Components emit
data-pyric-* attributes and accept className slots. Consumers
bring their own design system (Tailwind, CSS modules, plain CSS)
and attach styling via attribute selectors or class names.
Functions
ContextWindowMeter()
function ContextWindowMeter(__namedParameters: ContextWindowMeterProps): Element;Parameters
| Parameter | Type |
|---|---|
__namedParameters | ContextWindowMeterProps |
Returns
Element
ContextWindowPanel()
function ContextWindowPanel(__namedParameters: ContextWindowPanelProps): Element;Parameters
| Parameter | Type |
|---|---|
__namedParameters | ContextWindowPanelProps |
Returns
Element
ContextWindowRing()
function ContextWindowRing(__namedParameters: ContextWindowRingProps): Element;Parameters
| Parameter | Type |
|---|---|
__namedParameters | ContextWindowRingProps |
Returns
Element
EmptyState()
function EmptyState(__namedParameters: EmptyStateProps): Element;Headless zero-state. Structural only: icon slot, title, optional
body, all wrapped in a flex container marked
[data-pyric-ui="empty-state"]. Consumers attach all visual
styling.
Parameters
| Parameter | Type |
|---|---|
__namedParameters | EmptyStateProps |
Returns
Element
Fold()
function Fold(__namedParameters: FoldProps): Element;Headless disclosure container — native <details> for keyboard /
a11y. Ships zero visual styling. Consumers style via the three
className slots or by selecting on:
[data-pyric-ui=“fold”] — root <details>
[data-pyric-ui=“fold”][open] — expanded state
[data-pyric-fold-tone=“error”] — error tint
[data-pyric-fold-tone=“thought”] — thought-stream tint
[data-pyric-fold-summary] — clickable summary row
[data-pyric-fold-chevron] — disclosure indicator slot
[data-pyric-fold-body] — revealed body wrapper
Parameters
| Parameter | Type |
|---|---|
__namedParameters | FoldProps |
Returns
Element
Modal()
function Modal(__namedParameters: ModalProps): Element;Headless modal — provides behavior only (Escape-to-close, backdrop
click, aria-modal). Consumers attach all visual styling via the
three className slots or by selecting on the emitted data
attributes:
[data-pyric-ui=“modal”] — root viewport wrapper [data-pyric-modal-backdrop] — clickable backdrop [data-pyric-modal-panel] — inner panel containing children
Parameters
| Parameter | Type |
|---|---|
__namedParameters | ModalProps |
Returns
Element
PulsingDot()
function PulsingDot(__namedParameters: PulsingDotProps): Element;Headless “live / streaming” indicator. Ships zero visual styling.
Renders three nested spans so consumers can style ring + core independently:
Animation, color, and size are entirely consumer-defined.
Parameters
| Parameter | Type |
|---|---|
__namedParameters | PulsingDotProps |
Returns
Element
RequestUsageTimeline()
function RequestUsageTimeline(__namedParameters: RequestUsageTimelineProps): Element;Parameters
| Parameter | Type |
|---|---|
__namedParameters | RequestUsageTimelineProps |
Returns
Element
SessionSpendSummary()
function SessionSpendSummary(__namedParameters: SessionSpendSummaryProps): Element;Parameters
| Parameter | Type |
|---|---|
__namedParameters | SessionSpendSummaryProps |
Returns
Element
TokenUsageInline()
function TokenUsageInline(__namedParameters: TokenUsageInlineProps): Element;Parameters
| Parameter | Type |
|---|---|
__namedParameters | TokenUsageInlineProps |
Returns
Element