{
  "name": "form-fields-two-column",
  "kind": "block",
  "primary": "fields-ui",
  "page": "/site/patterns/forms.html",
  "slots": [],
  "nested": [],
  "attrs": {},
  "html": "<fields-ui>\n        <field-ui label=\"First name\">\n          <input-ui placeholder=\"Maya\"></input-ui>\n        </field-ui>\n        <field-ui label=\"Last name\">\n          <input-ui placeholder=\"Chen\"></input-ui>\n        </field-ui>\n      </fields-ui>",
  "source": "site/pages/patterns/forms.html",
  "metadata": {
    "domain": "forms",
    "description": "Two side-by-side form fields — fields-ui wrapping a pair of field-ui controls, collapsing to a single column on narrow viewports automatically. For first/last name or city/state rows.",
    "keywords": [
      "form",
      "fields",
      "two-column",
      "side-by-side",
      "fields-ui",
      "field-ui",
      "input-ui",
      "responsive",
      "collapse",
      "row",
      "first-name",
      "last-name",
      "layout",
      "forms",
      "multi-column"
    ]
  },
  "captured_at": "2026-06-09T18:16:34.245Z",
  "template": [
    {
      "id": "input",
      "component": "Input",
      "placeholder": "Maya"
    },
    {
      "id": "field",
      "component": "Field",
      "label": "First name",
      "children": [
        "input"
      ]
    },
    {
      "id": "input-2",
      "component": "Input",
      "placeholder": "Chen"
    },
    {
      "id": "field-2",
      "component": "Field",
      "label": "Last name",
      "children": [
        "input-2"
      ]
    },
    {
      "id": "root",
      "component": "Column",
      "children": [
        "field",
        "field-2"
      ]
    }
  ]
}