{
  "name": "admin-topbar-status-indicator",
  "kind": "block",
  "primary": "admin-topbar",
  "page": "/site/patterns/admin-content-topbar.html",
  "slots": [],
  "nested": [],
  "attrs": {},
  "html": "<admin-topbar>\n        <button-ui data-sidebar-toggle=\"leading\" icon=\"sidebar\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <breadcrumb-ui>\n          <a href=\"#\">Pipeline</a>\n          <span>Run #4421</span>\n        </breadcrumb-ui>\n        <span data-spacer></span>\n        <tag-ui size=\"sm\" variant=\"success\">Healthy</tag-ui>\n        <div data-actions>\n          <button-ui icon=\"arrow-clockwise\" variant=\"ghost\" size=\"sm\" title=\"Refresh\"></button-ui>\n          <button-ui text=\"Logs\" icon=\"terminal\" variant=\"outline\" size=\"sm\"></button-ui>\n        </div>\n      </admin-topbar>",
  "source": "site/pages/patterns/admin-content-topbar.html",
  "metadata": {
    "domain": "navigation",
    "description": "App-chrome topbar with an inline status indicator — a success tag-ui (Healthy) beside the action cluster gives an always-visible health/sync signal. For pipeline / connection state.",
    "keywords": [
      "admin",
      "topbar",
      "status",
      "indicator",
      "health",
      "sync",
      "connection",
      "tag-ui",
      "success",
      "badge",
      "breadcrumb",
      "sidebar",
      "navigation",
      "admin-topbar",
      "pipeline",
      "healthy",
      "refresh",
      "logs"
    ]
  },
  "captured_at": "2026-06-09T18:16:34.245Z",
  "template": [
    {
      "id": "button",
      "component": "Button",
      "icon": "sidebar",
      "size": "sm",
      "variant": "ghost",
      "data-sidebar-toggle": "leading"
    },
    {
      "id": "text",
      "component": "Text",
      "textContent": "Pipeline",
      "variant": "body"
    },
    {
      "id": "link",
      "component": "Link",
      "href": "#",
      "text": "Pipeline",
      "children": [
        "text"
      ]
    },
    {
      "id": "text-2",
      "component": "Text",
      "variant": "body",
      "textContent": "Run #4421"
    },
    {
      "id": "breadcrumb",
      "component": "Breadcrumb",
      "children": [
        "link",
        "text-2"
      ]
    },
    {
      "id": "text-3",
      "component": "Text",
      "variant": "body",
      "data-spacer": ""
    },
    {
      "id": "text-4",
      "component": "Text",
      "textContent": "Healthy",
      "variant": "body"
    },
    {
      "id": "tag",
      "component": "Tag",
      "size": "sm",
      "variant": "success",
      "children": [
        "text-4"
      ]
    },
    {
      "id": "button-2",
      "component": "Button",
      "icon": "arrow-clockwise",
      "size": "sm",
      "variant": "ghost"
    },
    {
      "id": "button-3",
      "component": "Button",
      "icon": "terminal",
      "size": "sm",
      "text": "Logs",
      "variant": "outline"
    },
    {
      "id": "column",
      "component": "Column",
      "data-actions": "",
      "children": [
        "button-2",
        "button-3"
      ]
    },
    {
      "id": "root",
      "component": "AdminTopbar",
      "children": [
        "button",
        "breadcrumb",
        "text-3",
        "tag",
        "column"
      ]
    }
  ]
}