# `PhiaUi.Components.Collab.Composer`
[🔗](https://github.com/charlenopires/PhiaUI/blob/v0.1.17/lib/phia_ui/components/collab/composer.ex#L1)

Composer Suite — 3 components for comment input with @mention support.

## Components

- `collab_composer/1`          — Rich text comment input with @mention trigger (PhiaCollabComposer hook)
- `collab_mention_suggest/1`   — Dropdown list of @mention suggestions
- `collab_floating_composer/1` — Absolutely-positioned composer at document anchor point

# `collab_composer`

Renders a comment composer with @mention support.

Uses the `PhiaCollabComposer` JS hook for real-time @mention detection,
Enter-to-submit (Shift+Enter for newline), and basic Markdown shortcuts
(Ctrl+B for bold, Ctrl+I for italic).

## Attributes

- `:id` — unique identifier (required)
- `:thread_id` — associated thread ID (nil for new threads)
- `:placeholder` — input placeholder text
- `:on_submit` — event name when submitting a comment
- `:mention_suggestions` — list of user maps for the mention dropdown
- `:show_mention_dropdown` — whether the mention dropdown is visible

The mention dropdown is positioned below the textarea and shows matching
users as the user types after "@".

## Attributes

* `id` (`:string`) (required)
* `thread_id` (`:string`) - Defaults to `nil`.
* `placeholder` (`:string`) - Defaults to `"Write a comment..."`.
* `on_submit` (`:string`) - Defaults to `"collab:comment:create"`.
* `mention_suggestions` (`:list`) - Defaults to `[]`.
* `show_mention_dropdown` (`:boolean`) - Defaults to `false`.
* `class` (`:string`) - Defaults to `nil`.

# `collab_floating_composer`

Renders a composer positioned at a specific document anchor point.

Used to create new threads at a specific location in the document.
The composer is absolutely positioned at `(x, y)` coordinates.

## Attributes

* `id` (`:string`) (required)
* `x` (`:any`) - Defaults to `0`.
* `y` (`:any`) - Defaults to `0`.
* `thread_id` (`:string`) - Defaults to `nil`.
* `on_submit` (`:string`) - Defaults to `"collab:comment:create"`.
* `mention_suggestions` (`:list`) - Defaults to `[]`.
* `show_mention_dropdown` (`:boolean`) - Defaults to `false`.
* `class` (`:string`) - Defaults to `nil`.

# `collab_mention_suggest`

Renders a dropdown of @mention suggestions.

Each suggestion shows a small avatar (or initials circle) and the user name.
Clicking a suggestion inserts the mention into the composer.

## Attributes

* `id` (`:string`) (required)
* `suggestions` (`:list`) - Defaults to `[]`.
* `visible` (`:boolean`) - Defaults to `false`.
* `on_select` (`:string`) - Defaults to `"collab:mention:select"`.
* `class` (`:string`) - Defaults to `nil`.

---

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