SutraUI.Response (Sutra UI v0.4.0)
View SourceRenders model responses as plain text or streamed Markdown.
Response is intentionally small: it handles the response surface and, when
format="markdown", uses MDEx to render sanitized Markdown. It does not own
chat state, provider callbacks, or streaming transport. The parent LiveView
passes the current text as it changes.
Examples
<.response value={@answer} />
<.response id="answer" value={@answer} streaming reveal="word" />
<.response value={@streamed_markdown} format="markdown" streaming />
<.response>
<p>Custom rendered content.</p>
</.response>Attributes
value- Response text or Markdown. Defaults tonil.format- One oftextormarkdown. Defaults totext.streaming- Marks the response as incomplete. The parent LiveView owns this state.reveal- One ofchunk,word,character, orline. Defaults tochunk.sanitize- Sanitizes Markdown HTML output. Defaults totrue.mdex_options- Extra MDEx options passed to the renderer.class- Additional CSS classes.
Animated reveal modes (word, character, line) require an id because
Phoenix LiveView hooks need a stable DOM id. They smooth already-received
text in the browser; the parent LiveView still owns provider streaming.
Markdown always renders by chunk so partial Markdown can stay valid and
sanitized.
Accessibility
- When
streamingis true, the root setsaria-live="polite"unless you pass your ownaria-livevalue, andaria-busy="true"unless you pass your own value. - Markdown output is sanitized by default before being marked as safe HTML.
Summary
Functions
Attributes
id(:string) - Stable DOM id. Required for animated reveal modes. Defaults tonil.value(:string) - Response text or Markdown. Defaults tonil.format(:string) - Response format. Defaults to"text". Must be one of"text", or"markdown".streaming(:boolean) - Marks the response as incomplete; enables MDEx streaming mode for Markdown. Defaults tofalse.reveal(:string) - How newly received text appears. Defaults to"chunk". Must be one of"chunk","word","character", or"line".sanitize(:boolean) - Sanitize Markdown HTML output. Defaults totrue.mdex_options(:any) - Additional MDEx options. Defaults to[].class(:any) - Additional CSS classes. Defaults tonil.- Global attributes are accepted. Additional HTML attributes. Supports all globals plus:
["role", "aria-label", "aria-labelledby", "aria-live", "aria-busy"].
Slots
inner_block- Optional custom response content.