Concept Rung

One depth level of a concept_ladder — a kind chip (DEPTH N or WORKED EXAMPLE), title, body copy, an optional terminal-styled code block with caption, and an optional terminal-styled takeaway line. Reads its colour tokens from the CSS custom properties an enclosing concept_ladder sets; renders with sane fallback colours standalone. Rarely authored outside concept_ladder.rungs, but is its own atom type so it can be independently addressed by ComponentId in the A2UI v1.0 ChildList wire format.

Surfaces

webgoogle-apps-script-webmcp-apps ⚠

Degraded on

Surface	Note
mcp-apps	Inherits concept_ladder's blocked IBM Plex faces under the MCP Apps CSP — falls back to the system mono/serif stack. Structure unaffected.

Live preview

DEPTH

Fields

Field	Type
badge	string. Rail-node label, e.g. the depth number or "EX". Defaults to 1-based position when rendered inside concept_ladder.	optional
kind	string. 'depth' (default) or 'example' — example rungs get the mono/terminal chip and node styling.	optional
label	string. Chip text override; defaults to "DEPTH " or "WORKED EXAMPLE" by kind.	optional
title	string. Rung heading. Backtick spans render as inline code.	optional
body	string. Rung body copy — blank-line-separated paragraphs render as separate s. Backtick spans render as inline code.	optional
code	string. Verbatim code block, terminal-styled (escaped, never interpreted).	optional
code_caption	string. Italic caption line under the code block.	optional
takeaway	string. Terminal-styled takeaway / pull-quote line.	optional

Example payload

{
  "type": "concept_rung"
}

ARD catalog entry

{
  "identifier": "urn:air:a2uicatalog.ai:atom:concept_rung",
  "displayName": "Concept Rung",
  "type": "application/vnd.a2ui.atom+json",
  "url": "https://a2uicatalog.ai/atoms/concept_rung",
  "capabilities": [
    "web",
    "google-apps-script-web",
    "mcp-apps"
  ],
  "description": "One depth level of a concept_ladder \u2014 a kind chip (DEPTH N or WORKED EXAMPLE), title, body copy, an optional terminal-styled code block with caption, and an optional terminal-styled takeaway line. Reads its colour tokens from the CSS custom properties an enclosing concept_ladder sets; renders with sane fallback colours standalone. Rarely authored outside concept_ladder.rungs, but is its own atom type so it can be independently addressed by ComponentId in the A2UI v1.0 ChildList wire format.",
  "representativeQueries": [
    "show a one depth level (kind chip, title, body, code, takeaway) \u2014 normally used inside concept_ladder",
    "one depth level of a concept_ladder \u2014 a kind chip (depth n or worked example), title, body copy, an",
    "render a concept rung"
  ]
}

← Full ARD catalog

Deploy your own Google Apps Script renderer

The renderer is an open-source Google Apps Script web app. Deploy your own instance in 4 commands — you own the URL, no dependency on the demo endpoint.

git clone https://github.com/a2uicatalog/a2ui
cd a2ui/apps-script-surface/gas-wired-renderer
clasp push && clasp deploy

Full deploy guide →