{
  "name": "file-upload-field",
  "kind": "block",
  "primary": "div",
  "page": "/apps/genui/app/a2ui-editor/a2ui-editor.contents.html",
  "slots": [],
  "nested": [],
  "attrs": {
    "data-import-panel": "file",
    "hidden": ""
  },
  "html": "<div\n            data-import-panel=\"file\"\n            hidden>\n            <label style=\"display: flex; flex-direction: column; gap: var(--a-space-2)\">\n              <text-ui variant=\"label\">Select a .json or .html file</text-ui>\n              <input id=\"import-file\" type=\"file\" accept=\".json,.html,application/json,text/html\" />\n            </label>\n            <div data-import-footer>\n              <button-ui data-import-cancel text=\"Cancel\" variant=\"ghost\"></button-ui>\n            </div>\n          </div>",
  "source": "apps/genui/app/a2ui-editor/a2ui-editor.contents.html",
  "metadata": {
    "domain": "forms",
    "description": "File-upload field — a labelled native file input restricted to specific file types, stacked label-over-control, with a Cancel action below. The minimal 'choose / browse for a file to upload or import' form control.",
    "keywords": [
      "file",
      "upload",
      "field",
      "input",
      "choose",
      "file",
      "browse",
      "attach",
      "import",
      "select",
      "document",
      "picker",
      "accept",
      "types",
      "json",
      "html",
      "upload",
      "control",
      "label",
      "native",
      "file",
      "input",
      "drag",
      "drop",
      "file",
      "chooser",
      "pick",
      "file",
      "from",
      "disk"
    ]
  },
  "captured_at": "2026-06-10T16:56:21.616Z",
  "template": [
    {
      "id": "text-2",
      "component": "Text",
      "variant": "label",
      "textContent": "Select a .json or .html file"
    },
    {
      "id": "import-file",
      "component": "Upload",
      "accept": ".json,.html,application/json,text/html"
    },
    {
      "id": "text",
      "component": "Text",
      "variant": "body",
      "children": [
        "text-2",
        "import-file"
      ]
    },
    {
      "id": "button",
      "component": "Button",
      "text": "Cancel",
      "variant": "ghost",
      "data-import-cancel": ""
    },
    {
      "id": "column",
      "component": "Column",
      "data-import-footer": "",
      "children": [
        "button"
      ]
    },
    {
      "id": "root",
      "component": "Column",
      "data-import-panel": "file",
      "children": [
        "text",
        "column"
      ]
    }
  ]
}