{
  "name": "onb-persona-picker",
  "kind": "block",
  "primary": "div",
  "page": "/apps/user-flow/app/onboarding/mode/mode.contents.html",
  "slots": [],
  "nested": [],
  "attrs": {
    "data-onb-form": ""
  },
  "html": "<div data-onb-form>\n          <div data-onb-mode-grid role=\"radiogroup\" aria-label=\"Primary role\">\n            <option-card-ui\n              name=\"mode\"\n              value=\"developer\"\n              required\n              heading=\"Developer\"\n              description=\"Wire APIs, ship features, monitor releases.\"\n            ></option-card-ui>\n            <option-card-ui name=\"mode\" value=\"designer\" heading=\"Designer\" description=\"Compose patterns, review, hand off.\"></option-card-ui>\n            <option-card-ui name=\"mode\" value=\"analyst\" heading=\"Analyst\" description=\"Query, chart, share insight, set up alerts.\"></option-card-ui>\n            <option-card-ui name=\"mode\" value=\"admin\" heading=\"Admin\" description=\"Configure, govern, manage access + billing.\"></option-card-ui>\n          </div>\n        </div>",
  "source": "apps/user-flow/app/onboarding/mode/mode.contents.html",
  "metadata": {
    "domain": "onboarding",
    "description": "Role/persona picker — select job role or use-case during onboarding flow.",
    "keywords": [
      "onboarding",
      "persona",
      "role",
      "use-case",
      "select",
      "audience",
      "developer",
      "designer"
    ]
  },
  "captured_at": "2026-06-07T19:28:13.657Z",
  "template": [
    {
      "id": "mode",
      "component": "OptionCard",
      "description": "Wire APIs, ship features, monitor releases.",
      "required": true,
      "heading": "Developer",
      "name": "mode",
      "value": "developer"
    },
    {
      "id": "option-card",
      "component": "OptionCard",
      "description": "Compose patterns, review, hand off.",
      "heading": "Designer",
      "name": "mode",
      "value": "designer"
    },
    {
      "id": "option-card-2",
      "component": "OptionCard",
      "description": "Query, chart, share insight, set up alerts.",
      "heading": "Analyst",
      "name": "mode",
      "value": "analyst"
    },
    {
      "id": "option-card-3",
      "component": "OptionCard",
      "description": "Configure, govern, manage access + billing.",
      "heading": "Admin",
      "name": "mode",
      "value": "admin"
    },
    {
      "id": "primary-role",
      "component": "Column",
      "data-onb-mode-grid": "",
      "children": [
        "mode",
        "option-card",
        "option-card-2",
        "option-card-3"
      ]
    },
    {
      "id": "root",
      "component": "Column",
      "data-onb-form": "",
      "children": [
        "primary-role"
      ]
    }
  ]
}