# `Chime.Components`
[🔗](https://github.com/hattoriai/chime/blob/v0.1.0-dev/lib/chime/components.ex#L1)

The bell, the feed and the preferences in the app's LiveViews, from
`@chime` (`Chime.Live`):

    <Chime.Components.bell chime={@chime} />
    <Chime.Components.feed chime={@chime} />

The bell has a dot while the person has notifications they have not
seen, never a count unless asked (`count`); a click opens the feed,
which marks them seen. The feed lists the notifications as their
notifiers render them, the unread ones marked; a click on one reads it
and goes to its `:url`.

The markup has classes of `chime-` and no style of its own: style it
with the app's CSS, or start from Chime's, `deps/chime/priv/static/chime.css`
(imported into the app's: `@import "../../deps/chime/priv/static/chime.css";`).
The words are Chime's, in the app's languages by its Gettext (see
`Chime.Messages`); each is an attribute too, for words of the app's
own.

# `bell`

The bell, with a dot for what the person has not seen.
## Attributes

* `chime` (`Chime.Live.State`) (required)
* `count` (`:boolean`) - show the number of unread, not only a dot. Defaults to `false`.
* `label` (`:string`) - "Notifications". Defaults to `nil`.
* `class` (`:string`) - Defaults to `nil`.

# `feed`

The panel of the feed, while it is open.
## Attributes

* `chime` (`Chime.Live.State`) (required)
* `title` (`:string`) - "Notifications". Defaults to `nil`.
* `empty` (`:string`) - "Nothing yet.". Defaults to `nil`.
* `read_all` (`:string`) - "Mark all as read". Defaults to `nil`.
* `more` (`:string`) - "Show more". Defaults to `nil`.
* `all` (`:string`) - "All". Defaults to `nil`.
* `unread` (`:string`) - "Unread". Defaults to `nil`.
* `archive` (`:string`) - "Archive". Defaults to `nil`.
* `class` (`:string`) - Defaults to `nil`.

# `preferences`

The person's preferences: a row for each category of the config, a
choice for each channel. A live component of its own, which keeps the
changes as they are made.

    <Chime.Components.preferences id="notifications" chime={@chime} />

## Attributes

* `id` (`:string`) (required)
* `chime` (`Chime.Live.State`) (required)
* `labels` (`:map`) - the channels' and settings' words: %{"email" => "Email", "daily" => "Daily"}. Defaults to `%{}`.

---

*Consult [api-reference.md](api-reference.md) for complete listing*