Component Catalog

Divider

Visual separator between sections.

A2UI → Nuxt UI Mapping

A2UI PropertyNuxt UI Result
(none required)USeparator

Example JSONL

{"version":"v0.10","createSurface":{"surfaceId":"div_demo","catalogId":"standard"}}
{"version":"v0.10","updateComponents":{"surfaceId":"div_demo","components":[
  {"id":"root","component":"Column","children":["header","divider","body"]},
  {"id":"header","component":"Text","text":"Section One","variant":"h2"},
  {"id":"divider","component":"Divider"},
  {"id":"body","component":"Text","text":"This content is below the divider."}
]}}

Properties

PropertyTypeRequiredDefaultDescription
No required properties

Rendering Details

  • Maps directly to Nuxt UI's USeparator component
  • Renders a horizontal line by default
  • Used by the AI to visually separate sections in generated layouts

Try It

Copy the JSONL above and paste it in the Playground Paste tab.