Feedback

Alert

Themed in-flow notification with severity variants, optional dismiss button, and action slots.

Import

Add the symbol to your component's imports array. The walkthrough below shows the most common usages — copy & tweak.

import { KjAlertComponent } from '@kouji-ui/components';

Loading editor

Playground

#playground

Heads up

New theme tokens just landed — try the dark variant in your settings.

variant

size

title

description

banner mode

dismissible

with action

<kj-alert
  kjVariant="info"
  kjSize="md"
>
  <kj-alert-icon>i</kj-alert-icon>
  <kj-alert-title>Heads up</kj-alert-title>
  <kj-alert-description>New theme tokens just landed — try the dark variant in your settings.</kj-alert-description>
</kj-alert>