Alert

Inline banner for status and system messages. Five tones, an optional title, an optional action, and an optional dismiss. A full 1px tone-tinted border over a soft tone tint keeps it quiet inside content.

Included in the single kansho full pack. Components are not offered as separate installs.

Tones

neutral · accent · success · warning · danger

Background indexing is paused while the workspace is idle.

A new model, claude-opus-4-8, is available for this workspace.

Secrets rotated. All agents picked up the new keys.

This run is approaching its token budget — 82% used.

The sandbox lost connection. The last two steps were not saved. Reconnect to resume the run.

With title

Approval required. An agent wants to write to .env.local. Review the change before it continues.

With action

Memory updated. The orchestrator added a constraint to working memory.

Dismissible

You can dismiss this notice once you've read it.

Component documentation

Alert

components/ui/alert.tsx

Purpose

Presents an inline message with optional title, action, and dismissal.

Appropriate use

Use for contextual success, information, warning, or error feedback that should remain in the page flow.

Example

components/ui/alert.tsx has a representative live example in the "Tones" section on /components/alert.

States

Supports neutral, accent, success, warning, and danger tones plus actionable and dismissible states.

API and props

Alert accepts tone, title, message, cta, onDismiss, and className.

Dependencies

React, Lucide icons, Button, and the Kansho cn utility.

Accessibility

Uses status semantics for neutral, accent, and success feedback; warning and danger use alert semantics, and the dismiss control has an accessible name.

Limitations

Dismissal state is owned by the caller, and this is not a modal or blocking confirmation.

Source

Source: components/ui/alert.tsx.

Full pack

components/ui/alert.tsx is documented at /components/alert and installs only through the single Kansho full pack; no individual component install is offered.