ホーム/コンポーネント/フィードバック/アラート Alert

Alert

重要な情報やフィードバックを表示するアラートコンポーネント。

import { Alert } from "@blueai/ui"

Examples

Variants

エラーが発生しました。

注意が必要です。

正常に完了しました。

お知らせがあります。

<Alert variant="error">エラーが発生しました。</Alert>
<Alert variant="warning">注意が必要です。</Alert>
<Alert variant="success">正常に完了しました。</Alert>
<Alert variant="info">お知らせがあります。</Alert>

With title

保存に失敗しました

入力内容を確認してください。

<Alert variant="error" title="保存に失敗しました">
  入力内容を確認してください。
</Alert>

Dismissible

このアラートは閉じることができます。

<Alert variant="info" onDismiss={() => setShow(false)}>
  このアラートは閉じることができます。
</Alert>

Props

Prop	Type	Default	Description
variant*	"error" \| "warning" \| "success" \| "info"	—	アラートのスタイル
children*	ReactNode	—	アラートの内容
title	string	—	タイトル（太字表示）
onDismiss	() => void	—	×ボタン押下時のコールバック