Output Types

Complete reference for all output types a plugin's render() function can return.

render() must return a JSON object with a type field. The workspace renders it using native UI components that match the sidebar design system and respect light/dark theming.

Text

`markdown`

Rendered as formatted markdown with links, bold, italic, code, lists, headings, and blockquotes.

return {
  type: 'markdown',
  content: '**Bold** and *italic* and `code`\n\n- List item 1\n- List item 2'
}

`text`

Rendered as monospace preformatted text.

return { type: 'text', content: 'Plain text output\nWith line breaks' }

Data display

`list`

A compact list of items with optional colored indicators and subtitles.

return {
  type: 'list',
  ordered: false,  // optional: numbered list
  items: [
    { label: 'Server 1', subtitle: 'Healthy', iconColor: 'green' },
    { label: 'Server 2', subtitle: 'Degraded', iconColor: 'orange' },
    { label: 'Server 3', subtitle: 'Down', iconColor: 'red' },
  ]
}

`kv`

Key-value pairs displayed as a compact label: value layout.

return {
  type: 'kv',
  entries: [
    { key: 'Version', value: '2.4.1' },
    { key: 'Uptime', value: '14 days' },
    { key: 'Requests', value: '1.2M' },
  ]
}

`table`

A read-only table with column headers and rows.

return {
  type: 'table',
  columns: ['Name', 'Age', 'City'],
  rows: [
    ['Alice', '30', 'NYC'],
    ['Bob', '25', 'SF'],
  ]
}

`editableTable`

A table whose cells the user can edit, with optional add/delete row controls. See Editable Tables for the full API.

`json`

A collapsible JSON tree viewer. Click to expand/collapse objects and arrays.

return {
  type: 'json',
  collapsed: false,  // optional: start collapsed
  data: {
    server: 'prod-1',
    metrics: { cpu: 45, memory: 72 },
    tags: ['production', 'us-east']
  }
}

`tree`

A hierarchical tree with expandable/collapsible nodes.

return {
  type: 'tree',
  nodes: [
    {
      label: 'src',
      children: [
        { label: 'index.ts' },
        {
          label: 'components',
          children: [
            { label: 'App.tsx' },
            { label: 'Header.tsx' },
          ]
        }
      ]
    },
    { label: 'package.json' },
  ]
}

Layout

`stack`

Compose multiple outputs vertically or horizontally.

return {
  type: 'stack',
  direction: 'vertical',  // or 'horizontal'
  children: [
    { type: 'markdown', content: '## Summary' },
    { type: 'kv', entries: [{ key: 'Status', value: 'OK' }] },
    { type: 'list', items: [{ label: 'Task 1' }, { label: 'Task 2' }] },
  ]
}

`tabs`

Tabbed content switcher. Each tab renders its own output.

return {
  type: 'tabs',
  tabs: [
    { label: 'Overview', content: { type: 'markdown', content: '# Overview\n...' } },
    { label: 'Details', content: { type: 'table', columns: ['A', 'B'], rows: [['1', '2']] } },
    { label: 'Raw', content: { type: 'json', data: { foo: 'bar' } } },
  ]
}

HTML

`html`

Rendered in a sandboxed iframe. Use for custom visualizations that can't be expressed with the standard output types.

return {
  type: 'html',
  content: '<div style="padding: 16px; font-family: sans-serif;">Custom <b>HTML</b> content</div>'
}

`editableHtml`

Like html, but participates in the renderer write-back loop. See Editable HTML for the full contract.

Status

`error`

Red error message with optional details.

return { type: 'error', message: 'Failed to load data', details: 'Connection timeout after 5s' }

`loading`

Spinner with optional message.

return { type: 'loading', message: 'Fetching data...' }

`empty`

Empty state with an icon and message.

return { type: 'empty', message: 'No items found' }

Summary table

Type	Description
`markdown`	Formatted markdown
`text`	Monospace preformatted text
`list`	Items with icons and subtitles
`kv`	Key-value pairs
`table`	Read-only table
`editableTable`	Editable table with cell/row operations
`json`	Collapsible JSON tree
`tree`	Hierarchical expandable tree
`stack`	Vertical or horizontal composition
`tabs`	Tabbed content switcher
`html`	Sandboxed iframe
`editableHtml`	Iframe with write-back
`error`	Error message
`loading`	Spinner
`empty`	Empty state