Omni.UI.ChatUI (Omni UI v0.1.0)

Copy Markdown View Source

Function components for the chat rendering pipeline.

Imported automatically by use Omni.UI. Components are designed to compose within a chat_interface/1 root, which provides the scroll container, editor area, and markdown typography styles. All components use the semantic OKLCH color tokens defined in priv/static/omni_ui.css.

Summary

Functions

Renders assistant content blocks with streaming support.

Copy, redo, version navigation, and usage display for an assistant message.

Thumbnail tile for file attachments.

Bouncing dots animation used inline within tool and thinking blocks.

Standalone busy indicator shown after the last text block in a streaming turn.

Root layout for the chat interface.

Pattern-matched renderer for content types.

Editor component with optional controls.

Converts markdown text to styled HTML.

Default rendering for a ToolUse content block.

Renders a conversation turn with data-driven defaults.

Stream container for committed turns.

Renders user text and attachment content blocks in a styled bubble.

Copy, edit, and version navigation actions for a user message.

Functions

assistant_message(assigns)

Renders assistant content blocks with streaming support.

Attributes

  • content (:list) (required)
  • tool_results (:map) (required)
  • streaming (:boolean) (required)
  • tool_components (:map) - Defaults to %{}.

assistant_message_actions(assigns)

Copy, redo, version navigation, and usage display for an assistant message.

Attributes

  • turn_id (:integer) (required)
  • node_id (:integer) (required)
  • versions (:list) (required)
  • usage (Omni.Usage) (required)
  • target (:any) - Defaults to nil.

attachment(assigns)

Thumbnail tile for file attachments.

Renders an image preview via the :image slot, or a file icon fallback for non-image types. The :action slot is used for overlay controls (e.g. a cancel button in the editor).

Attributes

  • name (:string) (required)
  • media_type (:string) (required)

Slots

  • image
  • action

busy_anim(assigns)

Bouncing dots animation used inline within tool and thinking blocks.

busy_block(assigns)

Standalone busy indicator shown after the last text block in a streaming turn.

chat_interface(assigns)

Root layout for the chat interface.

Provides the scroll container, markdown typography styles, and an optional editor. All other components are designed to be rendered within this root.

When the :editor slot is not provided, renders a plain EditorComponent (textarea and attach button, no controls). When :editor is provided, renders the slot content instead — typically via editor/1.

Slots

  • inner_block (required)
  • editor
  • footer

content_block(assigns)

Pattern-matched renderer for content types.

Dispatches on the struct type of the :content assign to render Text, Thinking, ToolUse, or Attachment blocks.

For ToolUse blocks, consults the :tool_components map (keyed by tool name) for a custom component. If no entry exists, falls back to the default tool-use rendering.

Custom tool-use components receive a normalised assigns map with three keys:

  • @tool_use — the %Omni.Content.ToolUse{} struct
  • @tool_result — the matching %Omni.Content.ToolResult{} or nil if not yet available (pre-resolved from the :tool_results map)
  • @streaming — boolean, true if this is the last block of a streaming message

Attributes

  • content (:map) (required)
  • tool_results (:map) - Defaults to %{}.
  • tool_components (:map) - Defaults to %{}.
  • streaming (:boolean) - Defaults to false.

editor(assigns)

Editor component with optional controls.

Wraps EditorComponent and provides default controls (model selector, thinking toggle, usage summary) when the relevant attrs are provided. All attrs are optional — when omitted, the editor renders with just the textarea and attach button.

Three usage tiers:

<%!-- Default editor + default controls: --%>
<.editor model={@model} model_options={@model_options}
         thinking={@thinking} usage={@usage} />

<%!-- Default editor + custom controls: --%>
<.editor>
  <:controls><.my_controls /></:controls>
</.editor>

<%!-- No controls (just textarea): --%>
<.editor />

For a fully custom editor, skip editor/1 entirely and render your own component inside chat_interface's :editor slot.

Attributes

  • model_options (:list) - Defaults to nil.
  • model (Omni.Model) - Defaults to nil.
  • thinking (:atom) - Defaults to nil.

Slots

  • controls

markdown(assigns)

Converts markdown text to styled HTML.

Rendering is handled by Omni.UI.Helpers.to_md/2. Typography styles are applied via descendant selectors on chat_interface/1 targeting the .md class — see @markdown_styles.

Attributes

  • text (:string) (required)
  • streaming (:boolean) - Defaults to false.
  • Global attributes are accepted.

tool_use(assigns)

Default rendering for a ToolUse content block.

Used by content_block/1 when no custom component is registered for a tool in :tool_components. Custom tool-use components can also delegate to this function — for example, to add a per-tool control via the :aside slot — by calling ChatUI.tool_use/1 with the normalised assigns map.

Attributes

Slots

  • aside - content rendered alongside the header, outside the expandable's click target.

turn(assigns)

Renders a conversation turn with data-driven defaults.

When :user or :assistant slots are provided, they override the default rendering for that zone. Both slots expose the turn via :let.

When slots are omitted, defaults are rendered based on @turn.status:

Attributes

  • turn (Omni.UI.Turn) (required)
  • tool_components (:map) - Defaults to %{}.
  • target (:any) - Defaults to nil.

Slots

  • user
  • assistant

turn_list(assigns)

Stream container for committed turns.

Iterates over a LiveView stream of Omni.UI.Turn structs, rendering each as a TurnComponent. When :user or :assistant slots are provided, they are threaded through to each TurnComponent (and from there to turn/1), allowing per-turn customisation while retaining the default rendering pipeline.

Both slots expose the turn via :let.

Attributes

  • stream (:any) (required)
  • tool_components (:map) - Defaults to %{}.
  • id (:string) - Defaults to "turns".

Slots

  • user
  • assistant

user_message(assigns)

Renders user text and attachment content blocks in a styled bubble.

Attributes

  • text (:list) (required)
  • attachments (:list) (required)

user_message_actions(assigns)

Copy, edit, and version navigation actions for a user message.

Attributes

  • turn_id (:integer) (required)
  • versions (:list) (required)
  • timestamp (DateTime) (required)
  • target (:any) - Defaults to nil.