Toast

fandhe-frontend-pre-styled-ui の toast mod が提供するスタイル済み Toast 部品です。一時的な通知を有界なキューとして管理する状態機械 Toaster を持ち、aria-live は通知の状態（ToastStatus）から決定的に導出します（Error のみ assertive、他は polite）。aria-atomic="true" を併用し通知全体を単位として読み上げさせます。

Important

Demo はトリガー起点のオーバーレイ部品と同じく、画面端固定の通知を「表示中の状態」で固定掲示しています。本来の配置（画面端固定・複数通知の積み上げ）ではページ内の他セクションと重なるため、掲示専用 CSS（assets/pre-styled-ui.css の .pre-styled-showcase スコープ）でページの流れの中へ収めています。実アプリケーションでの overlay 配置は pre-styled-ui の recipe CSS がそのまま担います。

Demo

headless-ui の Toast（`role="status"` + `aria-live`（`error` のみ `assertive`）+ `aria-atomic="true"`）に pre-styled-ui の placement（`group` slot）/status（`root` slot）variant CSS を適用した静的掲示です。複数通知の有界キュー管理・自動 dismiss のタイマー配線は wasm 層の後続イシューのスコープ外です。

Info

新しいバージョンが利用可能です。

Success

ビルドが完了しました。

Warning

依存クレート数が上限に近づいています。

Error

リンク切れを検出したため書き出しを中止しました。

Features

一時的な通知の queue 表示。group（live region）/ root（通知 1 件）/ title / description / action-trigger / close-trigger の 6 anatomy パーツを持つ。
複数通知を有界なキューとして管理する状態機械 Toaster を提供する（Disclosure/SingleSelect のいずれにも写像できないため Component/Hydrate を直接実装する）。
aria-live は ToastStatus から決定的に導出する（Error のみ assertive、他は polite）。aria-atomic="true" を併用し通知全体を単位として読み上げさせる。
placement（6 語彙、既定 BottomEnd）/ status（Info/Success/Warning/Error、既定 Info）の 2 軸 variant。

Anatomy

group
  root
    title
    description
    close-trigger

API Reference

Arguments

Name	Type	Default	Description
placement	ToastPlacement	ToastPlacement::BottomEnd	group（live region）の表示位置（6 語彙）。
label	&str		group の role="region" に付与する aria-label（読み上げ用ラベル）。
status	ToastStatus	ToastStatus::Info	通知 1 件（root）の状態（Info/Success/Warning/Error）。aria-live の緊急度導出にも使われる。

Data Attributes

Part	Attribute	Observed Values
group	data-placement	bottom-end
root	data-type	error, info, success, warning

Accessibility

WAI-ARIA

Attribute	Description
role="region" / aria-label	group に付与。label 引数がそのまま aria-label になる。
role="status" / aria-atomic="true" / aria-live	root に付与。aria-live は status から決定的に導出される（Error のみ assertive、他は polite）。