Special code blocks

A reference for the rich blocks the AI emits in chat. Each block is a fenced code block whose language tag triggers a specialized renderer instead of plain syntax-highlighted code.

You almost never write these yourself; the AI produces them and Strata renders them. Understanding them helps you steer prompts ("show me a comparison", "give me a timeline") and read what the AI did.

How blocks behave

Three rules apply to every rich block:

1. Blocks render as a separate component, not inline text. The user never sees the raw JSON or fenced source — the renderer lifts the block out and replaces it with the rendered UI.
2. Blocks are the last thing in a response. The AI is instructed to write its prose first, then the block, then stop. Text after a block creates a visible gap.
3. suggestions is a special case — it does not render inline at the end of the response. When the most recent AI reply carries a suggestions block, the follow-up cards surface in a panel that expands above the prompt input when you focus it. Suggestions are optional, so a short factual answer often has none.

If you ever do see raw block source in a response (a literal `chart followed by JSON), that is a rendering bug — refresh the conversation and let the AI re-stream.

Visual blocks

chart

Interactive Chart.js chart inside the message bubble.

• When the AI uses it: the user asks for a chart, graph, plot, or visualization, or returned data is comparative or aggregated.
• Supported types: bar, line, pie, doughnut, scatter, radar, and similar Chart.js-native types. A bar, line or area chart can mix bars and a line, put a series on a second axis on the right, and draw marker lines (a target value, a category).
• Use an Analysis-generated image instead when: the user wants a heatmap, custom multi-panel layout, infographic, statistical plot (box, violin, regression), or explicitly asks for an image or PNG.

explore

A what-if chart: a chart drawn from a formula, with a slider for each input and, optionally, results computed from the inputs. Moving a slider redraws the chart, its marker lines and the results; Reset restores the AI's values. See /docs/chat/charts.

• When the AI uses it: the answer is a relationship or a model (loan payments, growth, break-even, pricing, probability, sensitivity), not a set of results. Data from a query or a file is a chart.
• What it can draw: lines, areas, bars, stacked bars or areas, or bars and a line together; a second axis; a running total; dashed lines and shaded bands; up to 4 marker lines. Results can be a formula of the sliders, a series' value at a point, its highest or lowest point, or where it first reaches a value (a break-even).
• Limits: up to 6 sliders, 6 series and 6 results. The formula is arithmetic, comparisons and a fixed list of functions (math, Excel's finance functions and statistics) over the block's own inputs; nothing else can run.
• Where it renders: the Strata web chat. The Outlook add-in shows an ordinary chart instead; Teams answers without it.

comparison

Paired or grouped data cards showing side-by-side metrics.

• When the AI uses it: prompts containing "compare", "vs", "side by side", or when comparing two or more entities by parallel metrics.

progress

Horizontal progress bars annotated with percentages or status labels.

• When the AI uses it: prompts about completion, payment status, milestones, or any numeric series that maps to "percent done".

timeline

Chronological event display with dates, labels, and short descriptions.

• When the AI uses it: sequences of events over time — incident histories, deal stages, project milestones, account activity.

correlation

Correlation matrix heatmap between numeric columns.

• When the AI uses it: explicit correlation requests, or whenever the AI is showing the relationship strength between three or more numeric variables. Heatmaps that are not correlation matrices use Analysis-generated images instead.

mermaid

A diagram written in Mermaid syntax, rendered to a clean SVG inside the message in a card headed Diagram.

• When the AI uses it: structure and relationships a chart cannot show — process and workflow flows, decision trees, architecture, sequence diagrams, state machines, entity relationships, org charts, mind maps, and Gantt timelines. It reaches for this whenever you ask it to "diagram", "map out", or "show the flow / steps / architecture".
• Not for numbers or lists: quantitative data uses chart; a plain list stays prose or bullets.
• Diagram types: flowchart (TD/LR), sequenceDiagram, stateDiagram-v2, erDiagram, classDiagram, mindmap, gantt, and journey.
• If it can't render: an invalid diagram falls back to showing the diagram source rather than a broken image.

email

Email draft card with To, Cc, Bcc, Subject, and a rich HTML Body.

• When the AI uses it: any time the AI drafts an email for you to review before sending. After you confirm with phrases like "send it", the AI calls the send_email tool — it never sends from the draft card on its own.
• Tone variants: when you do not specify a tone, the AI includes a tones array on the same email block (Friendly, Professional, Brief & direct). The card lets you flip between them; the top-level body is the Professional default.
• Actions: the card's actions sit at its top right: Undo and Redo for your edits, Copy, and Open in…, the icon of an arrow leaving a box. A sent draft keeps only Copy.
• Open in…: a menu of places to finish and send the draft outside Strata.
  • Your saved draft in Outlook comes first once Strata has saved the draft to your Outlook drafts folder, attachments included.
  • Outlook on the web: with Outlook connected, Strata saves the draft to your Outlook drafts first, so its attachments travel with it, and opens it there. Without that, it opens a new Outlook on the web message with the fields filled in, and a draft with attachments says Connect Outlook to include attachments.
  • Gmail and Yahoo Mail open that service's compose window with To, Cc, Bcc, Subject and the body's text.
  • Your mail app hands the draft to your default mail app (Outlook, Apple Mail or whichever you have set).
  • Download as .eml saves the draft as a file any mail app opens, with its formatting and its attachments. Outlook opens it as a message ready to send.
  • Gmail, Yahoo Mail and your mail app open from a link, which cannot carry a file, so when the draft has attachments they say Attachments are not included. Opening a draft elsewhere shows no notification: the new tab, your mail app or the download is the answer.
• Recipients: To, Cc and Bcc are real email fields, so your browser can offer the addresses it has saved and a phone shows its email keyboard.

map

Interactive Mapbox GL map (Mapbox vector styles with 3D buildings and theme-matched light/dark lighting) with markers. If Mapbox cannot draw the map in the browser (no map token, no WebGL, or its style does not load within 8 seconds), Strata falls back to a Leaflet map over Mapbox raster tiles that Strata's server fetches, so a map always renders. Once Mapbox's style has loaded the map stays on Mapbox, even while its tiles are still arriving.

• When the AI uses it: geographic prompts — "show on a map", "where are our X", "plot locations of", or whenever returned data has lat/lng columns or addresses.
• Marker style: all markers render as identical gold pins with a white rim, in both themes. The AI may specify a color field per point ("red", "green", "blue", "orange", "gray"), but the renderer ignores it and displays gold for every marker.
• Source data: the AI emits the block directly if lat/lng exist; otherwise it calls the geocode_addresses tool first (up to 50 addresses per call) and uses the returned coordinates.

places

Detail cards for real venues — name, category, address, phone, website, rating, an open/closed state derived from the venue's opening hours, and where available a photograph with its contributor credit. Up to 10 places per block. If a stored photograph will not load, Strata looks the place up again by its name and coordinate and shows the photograph it finds, with that photograph's own credit.

• When the AI uses it: destination and venue questions — where to go, what a named business is, contact details for a list of places. It pairs with a map block rather than replacing it: the map answers "where", the places block answers "what is it and how do I reach it". If only dots are needed, the AI emits the map alone.
• Source data: every field except the AI's one-line note is copied verbatim from a search_places tool result. The AI is instructed never to hand-write a places block from memory, and never to invent a rating — an address or phone number that was "tidied up" is one that no longer works.
• Ratings: search_places returns no rating unless the AI asks for venue detail, so ranking questions ("best coffee near the office") trigger the detailed call. Photographs come with the same call.
• Coordinate join: when the same venue appears in both a places and a map block, the coordinates must match exactly. That match is what turns a map pin into a full detail panel with imagery, hours and contact actions; a rounded copy silently degrades the pin to a bare label.
• Rating pins: a map accompanying rated places can set "markerStyle": "rating", which draws each pin as its score badge instead of a teardrop.

html

Sanitized custom inline HTML.

• When the AI uses it: rarely, only when a layout does not fit any other block and the AI needs a bespoke mini-UI (a tab nav, a styled badge group, a small status pill row).
• Sanitization: <script>, <iframe>, <object>, <embed>, <form>, form controls (<input>, <textarea>, <select>), <meta>, <link>, <base>, and event-handler attributes are stripped. Inline styles, classes, semantic tags, buttons, tables, and SVG are allowed.

Headline and layout components

These blocks make a response scannable — a single big number, a grid of metrics, an annotated table, or an interactive layout. The AI reaches for them when the shape of the data suits them.

stat

One big headline number with an optional change badge and context line.

• When the AI uses it: to feature THE single key metric of an answer ("Q3 revenue was $12.4M, up 18%").
• Fields: a value, a label, an optional change (rendered with an up/down arrow), and an optional context line.

kpi

A responsive grid of up to eight KPI cards, laid out in two, three, or four columns.

• When the AI uses it: three to eight metrics shown together. A value too long for its card gets an expand control so the full number stays readable.

table

A table like a Markdown table, but each row can carry an annotation and a highlight.

• When the AI uses it: whenever it wants to flag specific rows. A row can have a note that expands below it and a highlight of good, bad, or warn. The whole table has an expand control for wide data.

tabs

Tabbed panels that present several views inside one block — for example one tab per quarter.

• When the AI uses it: to fit multiple related views in one place without a long scroll. Each tab's content is plain HTML.

diff

A side-by-side before/after comparison with changed lines marked.

• When the AI uses it: "what changed" questions — contract revisions, edited text, code changes.

calendar

An interactive calendar with day, week, and month views, prev/next/today navigation, a 24-hour timeline, and a click-through detail popover for each event.

• When the AI uses it: "show my schedule", "what's on my calendar this week", or any visual schedule. For your real calendar it first calls list_calendar_events to fetch from Outlook, then renders the result here; for a schedule you describe verbally it builds the events directly. Teams meetings are flagged, and it handles time zones and daylight-saving correctly.
• Reading it: an event too long for its box shows its full title and time when you hover it, in the week grid and in month view. All-day events say All day, a multi-day event shows its range of dates, and a recurring meeting opens on the day you clicked.
• Expand: the expand control at the right of the block's header opens the calendar in the full window, with more room for each hour. On a phone it opens in Day view. When you close it (or press Escape), the block keeps the view and date you left it on. An event's details window has its own expand control that fills the window, and Restore puts it back; on a phone the details already fill the screen.
• Keyboard: Tab reaches each event and Enter opens it; Escape closes the event card.

decision

An interactive decision tree — you click a branch to drill into the next question or the outcome.

• When the AI uses it: "if X then Y" decision logic, where a branching path is clearer than prose.

Jira blocks

Seven blocks render Jira data, and they replace the markdown tables the AI used to write. A markdown table throws away the status category, the assignee's profile picture and the fact that every issue key is a link; these keep all three. One renderer serves both web chat and the Outlook task pane, so they look identical in each.

The AI emits one Jira block per answer — a board and a table and a workload chart for the same question is noise. Every value comes from a tool result: the AI is instructed never to invent an issue key, a status or a count, and never to construct an Atlassian URL. Blocks are capped at 30 issues (12 per board lane) with a total field carrying the real number so the UI can say "+N more" honestly.

• Profile pictures: the tools return an Atlassian accountId alongside each display name, and passing it through is what renders the person's real Jira avatar. Where it is absent, initials are used instead.
• Write controls: jira-issue only shows comment and transition buttons when the tool result confirms your organization allows writes. On a Jira Service Management request the card says so explicitly, because any comment Strata posts there is an internal note, never visible to the customer who raised the request.

Export blocks and tool-generated files

excel

Styled Excel workbook produced server-side by the generate_excel tool.

• What you see: a download chip at the bottom of the response. Clicking downloads the workbook.
• Reuse: the same fileId can be passed to save_to_onedrive and to email attachments, guaranteeing the same styled file is used everywhere.
• Older inline form: a fenced `excel JSON block that the client-side engine renders into a downloadable workbook. Both produce identical output.

pdf

PDF report produced server-side via pdfkit.

• What you see: a download chip at the bottom of the response.
• Layout: the spec controls page size, cover, sections, embedded charts, and tables.

word

Word document (.docx) produced by the generate_docx tool.

• When the AI uses it: prompts mentioning "Word document", "docx", "memo", or "proposal".

powerpoint

PowerPoint presentation (.pptx) produced by the generate_pptx tool.

markdown

Markdown file produced by the generate_md tool.

SQL blocks

sql

Syntax-highlighted SQL.

• When the AI uses it: the AI inlines a sql block any time it ran a query and is showing you the SQL it executed. In Simple mode, SQL is hidden — the AI never emits this block.
• Latest-edit display: when you ask the AI to fix or modify a query, the artifact panel opens on the right and the inline sql block shows the most recently edited version.

sql-result

Query results are not a separate block. The rows a query returned appear in its SQL step's detail: open the step to see them in a table you can sort, search (once there are 10 or more rows), export with Export CSV, or open full screen with Expand. A sql-result block the model writes anyway is not drawn.

Helper blocks

suggestions

Follow-up question cards tied to the most recent AI reply, surfaced in a panel that expands above the prompt input when you focus it (they are not rendered inline at the end of the message).

• Optional, not reflexive: the AI emits this block only when it can see genuine, specific next steps that flow from your prompt and its answer. Short factual replies, greetings, definitions, an MCQ disambiguation, and email confirmations get no suggestions.
• Count: when present, the block carries exactly 3 cards.
• Click behavior: clicking a suggestion sends it as your next message.

mcq

Disambiguation form for clarification questions.

• When the AI uses it: rarely — only when it genuinely cannot proceed without a clarification. The MCQ block supports up to 3 questions with up to 4 options each; types are single (radio), multi (checkbox), or rank (drag to reorder). A single question can carry an "Or add your own" affordance via allowOther, letting you type a free-text answer instead of picking an option.
• Style preferences are not MCQ. For email tone preferences the AI uses the tone variants inside the email block, not an MCQ.

Silent blocks

These blocks render to nothing — they are stripped before display and processed silently.

memory_update

The AI's mechanism for recording a fact to your personal or per-database memory.

• Personal memory: {"action": "add", "scope": "user", "entries": [...]}
• Per-database (connection-scoped) memory: {"action": "add", "scope": "connection", "entries": [...]}
• The block is stripped from the rendered output. To see and manage your memory, open Settings -> Capabilities.

callout (silent variant)

Some blocks tagged callout are emitted internally and stripped before rendering. The visible callout cards you see in chat use the inline blockquote syntax — see Callout reference.

navigate

A leftover block type that the main chat never acts on — Strata never navigates you between pages from a chat response. If a model ever emits one, it is stripped silently and nothing happens. (The separate support assistant can move you to a page, but it does so through its own mechanism, not this block.)

Why a block did not render

Most "raw block in response" reports trace to one of:

• The AI streamed an opening fence but the response was cut off (network drop, stop button, model timeout). Sending a follow-up like Re-render the chart from the last response usually fixes it.
• The model emitted text after the block. The frontend strips known block bodies but text after the closing fence may render alongside an empty block.
• The block content was invalid JSON. Strata logs the parse error to the browser console and shows the raw block; ask the AI to regenerate.

Related

• Callout reference
• Quickstart: your first conversation
• Troubleshooting and FAQ