トースト

ユーザーフィードバックのためのスタック可能な通知トーストとフラッシュメッセージバナー。 成功、エラー、警告、情報のバリアントに対応し、設定可能な 表示位置、自動消去時間、複数の視覚スタイルを備えています。

デフォルト

左ボーダーアクセント付きの個別スタック可能なトースト通知

オプション

名前 デフォルト 説明
title String Optional bold title text
message * String 必須 The notification message
variant Symbol :info Style: :success, :error, :warning, :info
dismissible Boolean true Show close button
duration Integer 5000 Auto-dismiss time in milliseconds (0 to disable)

スタンダードフラッシュ

Railsフラッシュメッセージ用のページ上部全幅バナー

オプション

名前 デフォルト 説明
messages * Hash 必須 Flash hash (keys: :notice/:alert/:error/:warning, values: message strings)
auto_dismiss Boolean true Automatically dismiss after duration
duration Integer 5000 Auto-dismiss time in milliseconds
dismissible Boolean true Show close button on each message

トーストフラッシュ

Railsフラッシュメッセージ用の角配置スタック可能トースト通知

オプション

名前 デフォルト 説明
messages * Hash 必須 Flash hash (keys: :notice/:alert/:error/:warning, values: message strings)
position Symbol :top_right Position: :top_right, :top_left, :bottom_right, :bottom_left
auto_dismiss Boolean true Automatically dismiss after duration
duration Integer 5000 Auto-dismiss time in milliseconds
dismissible Boolean true Show close button on each toast

変更履歴 v1.1.0

- v1.1.0: Added standard-flash and toast-flash styles for Rails flash messages
- v1.0.0: Initial release with success, error, warning, info variants
- Auto-dismiss with configurable duration
- Pause auto-dismiss on hover
- Smooth enter/exit animations
- Accessible with role="alert" and aria-live

フルアクセスを取得

このコンポーネントと他のすべてのソースコードをアンロックしましょう。一回のお支払いで永久アクセス。

今すぐアクセスを取得