{
  "name": "team-members-list",
  "kind": "block",
  "primary": "card-ui",
  "page": "/apps/saas/app/admin-dashboard/admin-dashboard.contents.html",
  "slots": [],
  "nested": [],
  "attrs": {},
  "html": "<card-ui>\n  <header>\n    <h3>Team members</h3>\n    <p slot=\"description\">4 members · 1 pending invite</p>\n    <span slot=\"action\">\n      <button-ui text=\"Invite\" variant=\"primary\" size=\"sm\" icon=\"user-plus\"></button-ui>\n    </span>\n  </header>\n  <section>\n    <list-ui divider>\n      <list-item-ui>\n        <avatar-ui slot=\"icon\" text=\"Alex Chen\"></avatar-ui>\n        <row-ui slot=\"text\" gap=\"2\" align=\"center\">\n          <text-ui strong>Alex Chen</text-ui>\n          <badge-ui text=\"Admin\" variant=\"accent\" size=\"sm\"></badge-ui>\n        </row-ui>\n        <text-ui slot=\"description\" color=\"subtle\" size=\"sm\">alex@acme.com</text-ui>\n        <row-ui slot=\"action\" gap=\"2\" align=\"center\">\n          <badge-ui text=\"Online\" variant=\"success\" size=\"sm\"></badge-ui>\n          <button-ui icon=\"dots-three\" variant=\"ghost\" size=\"sm\"></button-ui>\n        </row-ui>\n      </list-item-ui>\n      <list-item-ui>\n        <avatar-ui slot=\"icon\" text=\"Sarah Miller\"></avatar-ui>\n        <row-ui slot=\"text\" gap=\"2\" align=\"center\">\n          <text-ui strong>Sarah Miller</text-ui>\n          <badge-ui text=\"Editor\" variant=\"subtle\" size=\"sm\"></badge-ui>\n        </row-ui>\n        <text-ui slot=\"description\" color=\"subtle\" size=\"sm\">sarah@acme.com</text-ui>\n        <row-ui slot=\"action\" gap=\"2\" align=\"center\">\n          <badge-ui text=\"Online\" variant=\"success\" size=\"sm\"></badge-ui>\n          <button-ui icon=\"dots-three\" variant=\"ghost\" size=\"sm\"></button-ui>\n        </row-ui>\n      </list-item-ui>\n      <list-item-ui>\n        <avatar-ui slot=\"icon\" text=\"James Park\"></avatar-ui>\n        <row-ui slot=\"text\" gap=\"2\" align=\"center\">\n          <text-ui strong>James Park</text-ui>\n          <badge-ui text=\"Viewer\" variant=\"muted\" size=\"sm\"></badge-ui>\n        </row-ui>\n        <text-ui slot=\"description\" color=\"subtle\" size=\"sm\">james@acme.com</text-ui>\n        <row-ui slot=\"action\" gap=\"2\" align=\"center\">\n          <badge-ui text=\"Away\" variant=\"warning\" size=\"sm\"></badge-ui>\n          <button-ui icon=\"dots-three\" variant=\"ghost\" size=\"sm\"></button-ui>\n        </row-ui>\n      </list-item-ui>\n    </list-ui>\n  </section>\n  <footer>\n    <button-ui text=\"View all members\" variant=\"ghost\" stretch></button-ui>\n  </footer>\n</card-ui>",
  "source": "apps/saas/app/admin-dashboard/admin-dashboard.contents.html",
  "metadata": {
    "domain": "settings",
    "description": "Team member list with avatar, name, email, role badge, status, and action menu per row.",
    "keywords": [
      "team",
      "members",
      "list",
      "avatar",
      "name",
      "email",
      "role",
      "badge",
      "status",
      "action",
      "menu",
      "team-member",
      "workspace",
      "users",
      "people",
      "management"
    ]
  },
  "captured_at": "2026-06-07T19:28:13.657Z",
  "template": [
    {
      "id": "text",
      "component": "Text",
      "variant": "heading",
      "textContent": "Team members"
    },
    {
      "id": "text-2",
      "component": "Text",
      "variant": "body",
      "slot": "description",
      "textContent": "4 members · 1 pending invite"
    },
    {
      "id": "button",
      "component": "Button",
      "icon": "user-plus",
      "size": "sm",
      "text": "Invite",
      "variant": "primary"
    },
    {
      "id": "text-3",
      "component": "Text",
      "variant": "body",
      "slot": "action",
      "children": [
        "button"
      ]
    },
    {
      "id": "header",
      "component": "Header",
      "children": [
        "text",
        "text-2",
        "text-3"
      ]
    },
    {
      "id": "avatar",
      "component": "Avatar",
      "slot": "icon",
      "text": "Alex Chen"
    },
    {
      "id": "text-4",
      "component": "Text",
      "strong": true,
      "textContent": "Alex Chen"
    },
    {
      "id": "badge",
      "component": "Badge",
      "size": "sm",
      "text": "Admin",
      "variant": "accent"
    },
    {
      "id": "row",
      "component": "Row",
      "slot": "text",
      "align": "center",
      "gap": "2",
      "children": [
        "text-4",
        "badge"
      ]
    },
    {
      "id": "text-5",
      "component": "Text",
      "slot": "description",
      "color": "subtle",
      "size": "sm",
      "textContent": "alex@acme.com"
    },
    {
      "id": "badge-2",
      "component": "Badge",
      "size": "sm",
      "text": "Online",
      "variant": "success"
    },
    {
      "id": "button-2",
      "component": "Button",
      "icon": "dots-three",
      "size": "sm",
      "variant": "ghost"
    },
    {
      "id": "row-2",
      "component": "Row",
      "slot": "action",
      "align": "center",
      "gap": "2",
      "children": [
        "badge-2",
        "button-2"
      ]
    },
    {
      "id": "list-item",
      "component": "ListItem",
      "children": [
        "avatar",
        "row",
        "text-5",
        "row-2"
      ]
    },
    {
      "id": "avatar-2",
      "component": "Avatar",
      "slot": "icon",
      "text": "Sarah Miller"
    },
    {
      "id": "text-6",
      "component": "Text",
      "strong": true,
      "textContent": "Sarah Miller"
    },
    {
      "id": "badge-3",
      "component": "Badge",
      "size": "sm",
      "text": "Editor",
      "variant": "subtle"
    },
    {
      "id": "row-3",
      "component": "Row",
      "slot": "text",
      "align": "center",
      "gap": "2",
      "children": [
        "text-6",
        "badge-3"
      ]
    },
    {
      "id": "text-7",
      "component": "Text",
      "slot": "description",
      "color": "subtle",
      "size": "sm",
      "textContent": "sarah@acme.com"
    },
    {
      "id": "badge-4",
      "component": "Badge",
      "size": "sm",
      "text": "Online",
      "variant": "success"
    },
    {
      "id": "button-3",
      "component": "Button",
      "icon": "dots-three",
      "size": "sm",
      "variant": "ghost"
    },
    {
      "id": "row-4",
      "component": "Row",
      "slot": "action",
      "align": "center",
      "gap": "2",
      "children": [
        "badge-4",
        "button-3"
      ]
    },
    {
      "id": "list-item-2",
      "component": "ListItem",
      "children": [
        "avatar-2",
        "row-3",
        "text-7",
        "row-4"
      ]
    },
    {
      "id": "avatar-3",
      "component": "Avatar",
      "slot": "icon",
      "text": "James Park"
    },
    {
      "id": "text-8",
      "component": "Text",
      "strong": true,
      "textContent": "James Park"
    },
    {
      "id": "badge-5",
      "component": "Badge",
      "size": "sm",
      "text": "Viewer",
      "variant": "muted"
    },
    {
      "id": "row-5",
      "component": "Row",
      "slot": "text",
      "align": "center",
      "gap": "2",
      "children": [
        "text-8",
        "badge-5"
      ]
    },
    {
      "id": "text-9",
      "component": "Text",
      "slot": "description",
      "color": "subtle",
      "size": "sm",
      "textContent": "james@acme.com"
    },
    {
      "id": "badge-6",
      "component": "Badge",
      "size": "sm",
      "text": "Away",
      "variant": "warning"
    },
    {
      "id": "button-4",
      "component": "Button",
      "icon": "dots-three",
      "size": "sm",
      "variant": "ghost"
    },
    {
      "id": "row-6",
      "component": "Row",
      "slot": "action",
      "align": "center",
      "gap": "2",
      "children": [
        "badge-6",
        "button-4"
      ]
    },
    {
      "id": "list-item-3",
      "component": "ListItem",
      "children": [
        "avatar-3",
        "row-5",
        "text-9",
        "row-6"
      ]
    },
    {
      "id": "list",
      "component": "List",
      "divider": true,
      "children": [
        "list-item",
        "list-item-2",
        "list-item-3"
      ]
    },
    {
      "id": "section",
      "component": "Section",
      "children": [
        "column"
      ]
    },
    {
      "id": "button-5",
      "component": "Button",
      "stretch": true,
      "text": "View all members",
      "variant": "ghost"
    },
    {
      "id": "footer",
      "component": "Footer",
      "children": [
        "button-5"
      ]
    },
    {
      "id": "column",
      "component": "Column",
      "children": [
        "list"
      ]
    },
    {
      "id": "root",
      "component": "Card",
      "children": [
        "header",
        "section",
        "footer"
      ]
    }
  ]
}