{
  "name": "stat-cards-kpi-dashboard",
  "kind": "block",
  "primary": "grid-ui",
  "page": "/apps/saas/app/admin-dashboard/admin-dashboard.contents.html",
  "slots": [],
  "nested": [],
  "attrs": {
    "columns": "2 4@lg",
    "gap": "4"
  },
  "html": "<grid-ui columns=\"2 4@lg\" gap=\"4\">\n            <card-ui\n              ><section><stat-ui label=\"Total Revenue\" value=\"$45,231.89\" change=\"+20.1%\" trend=\"up\" icon=\"currency-dollar\"></stat-ui></section\n            ></card-ui>\n            <card-ui\n              ><section><stat-ui label=\"Subscriptions\" value=\"+2,350\" change=\"+180.1%\" trend=\"up\" icon=\"users\"></stat-ui></section\n            ></card-ui>\n            <card-ui\n              ><section><stat-ui label=\"Sales\" value=\"+12,234\" change=\"+19%\" trend=\"up\" icon=\"credit-card\"></stat-ui></section\n            ></card-ui>\n            <card-ui\n              ><section><stat-ui label=\"Active Now\" value=\"+573\" change=\"+201\" trend=\"up\" icon=\"chart-bar\"></stat-ui></section\n            ></card-ui>\n          </grid-ui>",
  "source": "apps/saas/app/admin-dashboard/admin-dashboard.contents.html",
  "metadata": {
    "domain": "data",
    "description": "KPI stat cards dashboard — grid of stat-ui cards each showing a label, large numeric value, trend delta (up/down), and icon. Revenue, subscriptions, sales, and active-user metrics.",
    "keywords": [
      "stat",
      "cards",
      "kpi",
      "dashboard",
      "stat-ui",
      "revenue",
      "users",
      "growth",
      "metrics",
      "grid",
      "trend",
      "delta",
      "change",
      "value",
      "label",
      "icon",
      "currency",
      "sales",
      "active",
      "subscriptions",
      "kpi-grid",
      "numbers",
      "business-metrics"
    ]
  },
  "captured_at": "2026-06-07T19:28:13.657Z",
  "template": [
    {
      "id": "stat",
      "component": "Stat",
      "change": "+20.1%",
      "icon": "currency-dollar",
      "label": "Total Revenue",
      "trend": "up",
      "value": "$45,231.89"
    },
    {
      "id": "section",
      "component": "Section",
      "children": [
        "column"
      ]
    },
    {
      "id": "column",
      "component": "Column",
      "children": [
        "stat"
      ]
    },
    {
      "id": "card",
      "component": "Card",
      "children": [
        "section"
      ]
    },
    {
      "id": "stat-2",
      "component": "Stat",
      "change": "+180.1%",
      "icon": "users",
      "label": "Subscriptions",
      "trend": "up",
      "value": "+2,350"
    },
    {
      "id": "section-2",
      "component": "Section",
      "children": [
        "column-2"
      ]
    },
    {
      "id": "column-2",
      "component": "Column",
      "children": [
        "stat-2"
      ]
    },
    {
      "id": "card-2",
      "component": "Card",
      "children": [
        "section-2"
      ]
    },
    {
      "id": "stat-3",
      "component": "Stat",
      "change": "+19%",
      "icon": "credit-card",
      "label": "Sales",
      "trend": "up",
      "value": "+12,234"
    },
    {
      "id": "section-3",
      "component": "Section",
      "children": [
        "column-3"
      ]
    },
    {
      "id": "column-3",
      "component": "Column",
      "children": [
        "stat-3"
      ]
    },
    {
      "id": "card-3",
      "component": "Card",
      "children": [
        "section-3"
      ]
    },
    {
      "id": "stat-4",
      "component": "Stat",
      "change": "+201",
      "icon": "chart-bar",
      "label": "Active Now",
      "trend": "up",
      "value": "+573"
    },
    {
      "id": "section-4",
      "component": "Section",
      "children": [
        "column-4"
      ]
    },
    {
      "id": "column-4",
      "component": "Column",
      "children": [
        "stat-4"
      ]
    },
    {
      "id": "card-4",
      "component": "Card",
      "children": [
        "section-4"
      ]
    },
    {
      "id": "root",
      "component": "Grid",
      "columns": "2 4@lg",
      "gap": "4",
      "children": [
        "card",
        "card-2",
        "card-3",
        "card-4"
      ]
    }
  ]
}