{
  "name": "billing-progress-label",
  "kind": "block",
  "primary": "div",
  "page": "/apps/saas/app/billing/billing.contents.html",
  "slots": [],
  "nested": [],
  "attrs": {
    "data-col": ""
  },
  "html": "<div data-col>\n      <col-ui gap=\"4\">\n        <progress-row-ui label=\"API calls\" value=\"68\" meta=\"680k / 1M\"></progress-row-ui>\n        <progress-row-ui label=\"Storage\" value=\"42\" meta=\"42 GB / 100 GB\"></progress-row-ui>\n        <progress-row-ui label=\"Team seats\" value=\"75\" meta=\"6 / 8\"></progress-row-ui>\n        <progress-row-ui label=\"Workflow runs\" value=\"91\" meta=\"18,200 / 20,000\"></progress-row-ui>\n      </col-ui>\n      <alert-ui variant=\"warning\" icon=\"warning\" text=\"Workflow runs are approaching your plan limit. Upgrade to avoid throttling.\"></alert-ui>\n    </div>",
  "source": "apps/saas/app/billing/billing.contents.html",
  "metadata": {
    "domain": "settings",
    "description": "Usage quota section — labeled progress bars with percentage and value/total meta for each metered resource (API calls, storage, team seats, workflow runs). Progress bar with label pattern using progress-row-ui.",
    "keywords": [
      "progress",
      "bar",
      "label",
      "usage",
      "quota",
      "progress-row-ui",
      "labeled",
      "progress",
      "metered",
      "resource",
      "limit",
      "storage",
      "seats",
      "API",
      "calls",
      "workflow",
      "runs",
      "percentage",
      "value",
      "total",
      "billing",
      "quota",
      "usage",
      "gauge"
    ]
  },
  "captured_at": "2026-06-07T19:28:13.657Z",
  "template": [
    {
      "id": "progress-row",
      "component": "ProgressRow",
      "label": "API calls",
      "meta": "680k / 1M",
      "value": 68
    },
    {
      "id": "progress-row-2",
      "component": "ProgressRow",
      "label": "Storage",
      "meta": "42 GB / 100 GB",
      "value": 42
    },
    {
      "id": "progress-row-3",
      "component": "ProgressRow",
      "label": "Team seats",
      "meta": "6 / 8",
      "value": 75
    },
    {
      "id": "progress-row-4",
      "component": "ProgressRow",
      "label": "Workflow runs",
      "meta": "18,200 / 20,000",
      "value": 91
    },
    {
      "id": "column",
      "component": "Column",
      "gap": "4",
      "children": [
        "progress-row",
        "progress-row-2",
        "progress-row-3",
        "progress-row-4"
      ]
    },
    {
      "id": "alert",
      "component": "Alert",
      "icon": "warning",
      "text": "Workflow runs are approaching your plan limit. Upgrade to avoid throttling.",
      "variant": "warning"
    },
    {
      "id": "root",
      "component": "Column",
      "data-col": "",
      "children": [
        "column",
        "alert"
      ]
    }
  ]
}