Notification

Notification は、お知らせ（通知）一覧を表示するコンポーネントです。
未読・既読を分けて表示でき、未読と既読の両方が存在する場合は区切りとして「新規」を表示します。
各通知のレイアウトは itemContent を渡して自由に構成できます。

プロパティ

Notificationは、以下のプロパティをサポートしています。

名前	型	デフォルト値	説明
`notifications`	`NotificationItem[]`		表示する通知一覧です。
`itemContent`	`Snippet<[NotificationItem]>`		表示内容を描画する Snippet です（引数に notification を受け取ります）。

NotificationItemは、以下のプロパティをサポートしています。

名前	型	説明
`unread`	`boolean`	未読かどうかを表します。
`message`	`string`	通知本文です。
`createdAt`	`string`	作成日です。
`icon`	`any`	アイコンコンポーネントです。
`iconImage`	`string`	アイコン画像 URL です。
`onClick`	`() => void`	クリック時に呼ばれるコールバック関数です。

以下のコンポーネントのコードを、使いたいプロジェクトにコピー＆ペーストします。
パスは実際のプロジェクトの構成にあわせて更新します。

Notification の基本的な表示サンプルです。
各通知の表示内容は itemContent の Snippet で構成し、アイコン・アバター、本文、日時などを自由にレイアウトできます。

Notification の未読/既読表示のサンプルです。
未読の通知は上側にまとめて表示し、既読の通知は下側に表示します。
未読と既読の両方が存在する場合は、間に「新規」の区切りを表示します。