# XWUIInbox

Monday.com / Lark-style unified activity inbox: a list of notification items, each with a sender avatar (via `XWUIDisplayPersonChip`), an action verb, a linked target (board/doc/task), an optional snippet, and a relative timestamp. Supports unread dots, date grouping (`Today` / `Yesterday` / `This week` / `Earlier`), filter chips (`All` / `Unread` / `Mentions` / `Assigned` / `Updates`), and per-item hover actions (mark read, snooze, dismiss). Switch `mode` to `mail` for a Gmail-style list with star, subject, attachment indicator, checkbox selection and search highlighting. Key props: `data.items`, `data.activeFilter`, `conf_comp.mode`, `groupByDate`, `showFilters`, `density`, `selectable`, `hasMore`.

## Basic Usage

Three activity notifications with mixed unread state: a doc mention from Alex Rivera, a task assignment from Priya Patel, and a shared doc from Jordan Lee - each tagged into a filter bucket (`mentions` / `assigned` / `updates`).

```example
file: examples/BasicUsage.ts
html: examples/BasicUsage.html
title: Basic Usage
description: Three activity notifications with mixed unread state, grouped by date with filter chips.
```

## Filtered By Mentions

The inbox opened with `activeFilter: "mentions"` so only items whose `buckets` include `mentions` render - the assigned-only item is hidden while a reply tagged both `mentions` and `updates` stays visible.

```example
file: examples/FilteredByMentions.ts
html: examples/FilteredByMentions.html
title: Filtered By Mentions
description: Inbox launched with the Mentions filter chip active, showing only mention-bucketed items.
```

## Mail Mode - Unread Inbox

A Gmail-style `mode: "mail"` list opened on the Unread filter, with subject/snippet rows, star toggles, and attachment glyphs at compact density.

```example
file: examples/MailUnreadView.ts
html: examples/MailUnreadView.html
title: Mail Mode - Unread Inbox
description: Mail-mode inbox on the Unread filter showing starred and attachment-bearing message rows at compact density.
```

## Mail Mode - Search Results

Mail-mode results with `searchHighlight` marking the matched term across subjects and snippets, plus `selectable` row checkboxes for bulk actions.

```example
file: examples/SearchResults.ts
html: examples/SearchResults.html
title: Mail Mode - Search Results
description: Search results for "invoice" with highlighted matches and selectable rows (one pre-selected) for bulk actions.
```

```api
```
