Files
claudemesh/.context/turbostarter-framework-context/wireframes/medium-fidelity/settings-billing.excalidraw
Alejandro Gutiérrez d3163a5bff feat(db): mesh data model — meshes, members, invites, audit log
- pgSchema "mesh" with 4 tables isolating the peer mesh domain
- Enums: visibility, transport, tier, role
- audit_log is metadata-only (E2E encryption enforced at broker/client)
- Cascade on mesh delete, soft-delete via archivedAt/revokedAt

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-04 21:19:32 +01:00

2352 lines
56 KiB
Plaintext

{
"type": "excalidraw",
"version": 2,
"source": "turbostarter-wireframes",
"elements": [
{
"id": "outer-frame",
"type": "rectangle",
"x": 0,
"y": 0,
"width": 1440,
"height": 900,
"strokeColor": "$border",
"backgroundColor": "$background",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": [],
"roundness": { "type": 3, "value": 0 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "sidebar",
"type": "rectangle",
"x": 0,
"y": 0,
"width": 280,
"height": 900,
"strokeColor": "$border",
"backgroundColor": "$sidebar",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["sidebar-group"],
"roundness": { "type": 3, "value": 0 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "sidebar-logo-area",
"type": "rectangle",
"x": 0,
"y": 0,
"width": 280,
"height": 64,
"strokeColor": "$border",
"backgroundColor": "$sidebar",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["sidebar-group"],
"roundness": { "type": 3, "value": 0 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "sidebar-logo-placeholder",
"type": "rectangle",
"x": 20,
"y": 16,
"width": 120,
"height": 32,
"strokeColor": "$border",
"backgroundColor": "$primary",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["sidebar-group"],
"roundness": { "type": 3, "value": 4 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "sidebar-logo-text",
"type": "text",
"x": 40,
"y": 24,
"width": 80,
"height": 16,
"text": "MCPGet",
"fontSize": 16,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["sidebar-group"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "sidebar-nav-item-1",
"type": "rectangle",
"x": 20,
"y": 100,
"width": 240,
"height": 40,
"strokeColor": "$border",
"backgroundColor": "$sidebar",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["sidebar-group"],
"roundness": { "type": 3, "value": 8 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "sidebar-nav-item-1-text",
"type": "text",
"x": 40,
"y": 112,
"width": 80,
"height": 16,
"text": "Dashboard",
"fontSize": 14,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$sidebar-foreground",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["sidebar-group"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "sidebar-nav-item-2",
"type": "rectangle",
"x": 20,
"y": 160,
"width": 240,
"height": 40,
"strokeColor": "$border",
"backgroundColor": "$sidebar",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["sidebar-group"],
"roundness": { "type": 3, "value": 8 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "sidebar-nav-item-2-text",
"type": "text",
"x": 40,
"y": 172,
"width": 80,
"height": 16,
"text": "Browse MCPs",
"fontSize": 14,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$sidebar-foreground",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["sidebar-group"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "sidebar-nav-item-3",
"type": "rectangle",
"x": 20,
"y": 220,
"width": 240,
"height": 40,
"strokeColor": "$border",
"backgroundColor": "$sidebar",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["sidebar-group"],
"roundness": { "type": 3, "value": 8 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "sidebar-nav-item-3-text",
"type": "text",
"x": 40,
"y": 232,
"width": 80,
"height": 16,
"text": "Bundles",
"fontSize": 14,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$sidebar-foreground",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["sidebar-group"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "sidebar-nav-settings-active",
"type": "rectangle",
"x": 20,
"y": 280,
"width": 240,
"height": 40,
"strokeColor": "$border",
"backgroundColor": "$card",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["sidebar-group"],
"roundness": { "type": 3, "value": 8 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "sidebar-nav-settings-text",
"type": "text",
"x": 40,
"y": 292,
"width": 80,
"height": 16,
"text": "Settings",
"fontSize": 14,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$foreground",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["sidebar-group"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "sidebar-footer",
"type": "rectangle",
"x": 0,
"y": 836,
"width": 280,
"height": 64,
"strokeColor": "$border",
"backgroundColor": "$sidebar",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["sidebar-group"],
"roundness": { "type": 3, "value": 0 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "sidebar-footer-user",
"type": "rectangle",
"x": 20,
"y": 852,
"width": 240,
"height": 32,
"strokeColor": "$border",
"backgroundColor": "$card",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["sidebar-group"],
"roundness": { "type": 3, "value": 8 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "sidebar-footer-user-text",
"type": "text",
"x": 40,
"y": 860,
"width": 100,
"height": 16,
"text": "John Doe",
"fontSize": 14,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$foreground",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["sidebar-group"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "header",
"type": "rectangle",
"x": 280,
"y": 0,
"width": 1160,
"height": 64,
"strokeColor": "$border",
"backgroundColor": "$card",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["header-group"],
"roundness": { "type": 3, "value": 0 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "header-title",
"type": "rectangle",
"x": 304,
"y": 20,
"width": 120,
"height": 24,
"strokeColor": "$border",
"backgroundColor": "$muted",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["header-group"],
"roundness": { "type": 3, "value": 4 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "header-title-text",
"type": "text",
"x": 314,
"y": 24,
"width": 100,
"height": 18,
"text": "Settings",
"fontSize": 18,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$foreground",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["header-group"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "content-area",
"type": "rectangle",
"x": 280,
"y": 64,
"width": 1160,
"height": 836,
"strokeColor": "$border",
"backgroundColor": "$background",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["content-group"],
"roundness": { "type": 3, "value": 0 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "tab-general",
"type": "rectangle",
"x": 304,
"y": 88,
"width": 80,
"height": 32,
"strokeColor": "$border",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["tabs-group"],
"roundness": { "type": 3, "value": 6 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "tab-general-text",
"type": "text",
"x": 320,
"y": 96,
"width": 48,
"height": 16,
"text": "General",
"fontSize": 14,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "$foreground",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["tabs-group"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "tab-security",
"type": "rectangle",
"x": 404,
"y": 88,
"width": 80,
"height": 32,
"strokeColor": "$border",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["tabs-group"],
"roundness": { "type": 3, "value": 6 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "tab-security-text",
"type": "text",
"x": 416,
"y": 96,
"width": 56,
"height": 16,
"text": "Security",
"fontSize": 14,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "$foreground",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["tabs-group"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "tab-billing-active",
"type": "rectangle",
"x": 504,
"y": 88,
"width": 80,
"height": 32,
"strokeColor": "$primary",
"backgroundColor": "$primary",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["tabs-group"],
"roundness": { "type": 3, "value": 6 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "tab-billing-text",
"type": "text",
"x": 524,
"y": 96,
"width": 40,
"height": 16,
"text": "Billing",
"fontSize": 14,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["tabs-group"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "plan-card",
"type": "rectangle",
"x": 304,
"y": 140,
"width": 540,
"height": 200,
"strokeColor": "$border",
"backgroundColor": "$card",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["plan-section"],
"roundness": { "type": 3, "value": 8 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "plan-title",
"type": "rectangle",
"x": 324,
"y": 160,
"width": 120,
"height": 20,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 100,
"groupIds": ["plan-section"],
"roundness": { "type": 3, "value": 4 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "plan-title-text",
"type": "text",
"x": 324,
"y": 160,
"width": 120,
"height": 20,
"text": "Current Plan",
"fontSize": 16,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["plan-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "plan-name-badge",
"type": "rectangle",
"x": 324,
"y": 200,
"width": 60,
"height": 28,
"strokeColor": "$primary",
"backgroundColor": "$primary",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 100,
"groupIds": ["plan-section"],
"roundness": { "type": 3, "value": 14 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "plan-name-badge-text",
"type": "text",
"x": 340,
"y": 206,
"width": 28,
"height": 16,
"text": "Pro",
"fontSize": 14,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["plan-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "plan-price",
"type": "rectangle",
"x": 400,
"y": 200,
"width": 100,
"height": 28,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 100,
"groupIds": ["plan-section"],
"roundness": { "type": 3, "value": 4 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "plan-price-text",
"type": "text",
"x": 400,
"y": 206,
"width": 100,
"height": 16,
"text": "$29/month",
"fontSize": 16,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["plan-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "plan-feature-1",
"type": "rectangle",
"x": 324,
"y": 244,
"width": 200,
"height": 14,
"strokeColor": "$muted",
"backgroundColor": "$muted",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 60,
"groupIds": ["plan-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "plan-feature-1-text",
"type": "text",
"x": 324,
"y": 244,
"width": 200,
"height": 14,
"text": "Unlimited chats",
"fontSize": 12,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$foreground",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 60,
"groupIds": ["plan-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "plan-feature-2",
"type": "rectangle",
"x": 324,
"y": 264,
"width": 180,
"height": 14,
"strokeColor": "$muted",
"backgroundColor": "$muted",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 60,
"groupIds": ["plan-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "plan-feature-2-text",
"type": "text",
"x": 324,
"y": 264,
"width": 180,
"height": 14,
"text": "Priority support",
"fontSize": 12,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$foreground",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 60,
"groupIds": ["plan-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "plan-feature-3",
"type": "rectangle",
"x": 324,
"y": 284,
"width": 160,
"height": 14,
"strokeColor": "$muted",
"backgroundColor": "$muted",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 60,
"groupIds": ["plan-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "plan-feature-3-text",
"type": "text",
"x": 324,
"y": 284,
"width": 160,
"height": 14,
"text": "API access",
"fontSize": 12,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$foreground",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 60,
"groupIds": ["plan-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "manage-subscription-button",
"type": "rectangle",
"x": 680,
"y": 180,
"width": 140,
"height": 40,
"strokeColor": "$border",
"backgroundColor": "$secondary",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["plan-section"],
"roundness": { "type": 3, "value": 6 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "manage-subscription-button-text",
"type": "text",
"x": 684,
"y": 192,
"width": 132,
"height": 16,
"text": "Manage subscription",
"fontSize": 12,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "$foreground",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["plan-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "credits-card",
"type": "rectangle",
"x": 864,
"y": 140,
"width": 280,
"height": 200,
"strokeColor": "$border",
"backgroundColor": "$card",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["credits-section"],
"roundness": { "type": 3, "value": 8 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "credits-title",
"type": "rectangle",
"x": 884,
"y": 160,
"width": 80,
"height": 20,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 100,
"groupIds": ["credits-section"],
"roundness": { "type": 3, "value": 4 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "credits-title-text",
"type": "text",
"x": 884,
"y": 160,
"width": 80,
"height": 20,
"text": "Credits",
"fontSize": 16,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["credits-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "credits-balance",
"type": "rectangle",
"x": 884,
"y": 200,
"width": 140,
"height": 32,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 100,
"groupIds": ["credits-section"],
"roundness": { "type": 3, "value": 4 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "credits-balance-text",
"type": "text",
"x": 884,
"y": 204,
"width": 140,
"height": 24,
"text": "2,450 remaining",
"fontSize": 18,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["credits-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "credits-usage-bar-bg",
"type": "rectangle",
"x": 884,
"y": 252,
"width": 240,
"height": 12,
"strokeColor": "$border",
"backgroundColor": "$muted",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 40,
"groupIds": ["credits-section"],
"roundness": { "type": 3, "value": 6 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "credits-usage-bar-fill",
"type": "rectangle",
"x": 884,
"y": 252,
"width": 144,
"height": 12,
"strokeColor": "$primary",
"backgroundColor": "$primary",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 100,
"groupIds": ["credits-section"],
"roundness": { "type": 3, "value": 6 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "buy-credits-button",
"type": "rectangle",
"x": 884,
"y": 284,
"width": 120,
"height": 40,
"strokeColor": "$primary",
"backgroundColor": "$primary",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 100,
"groupIds": ["credits-section"],
"roundness": { "type": 3, "value": 6 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "buy-credits-button-text",
"type": "text",
"x": 904,
"y": 296,
"width": 80,
"height": 16,
"text": "Buy credits",
"fontSize": 14,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["credits-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "payment-method-card",
"type": "rectangle",
"x": 304,
"y": 360,
"width": 540,
"height": 100,
"strokeColor": "$border",
"backgroundColor": "$card",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["payment-section"],
"roundness": { "type": 3, "value": 8 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "payment-title",
"type": "rectangle",
"x": 324,
"y": 380,
"width": 140,
"height": 20,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 100,
"groupIds": ["payment-section"],
"roundness": { "type": 3, "value": 4 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "payment-title-text",
"type": "text",
"x": 324,
"y": 380,
"width": 140,
"height": 20,
"text": "Payment Method",
"fontSize": 16,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["payment-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "card-icon",
"type": "rectangle",
"x": 324,
"y": 416,
"width": 40,
"height": 24,
"strokeColor": "$border",
"backgroundColor": "$muted",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["payment-section"],
"roundness": { "type": 3, "value": 4 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "card-last-digits",
"type": "rectangle",
"x": 380,
"y": 420,
"width": 100,
"height": 16,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["payment-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "card-last-digits-text",
"type": "text",
"x": 380,
"y": 420,
"width": 100,
"height": 16,
"text": "•••• 4242",
"fontSize": 14,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["payment-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "update-payment-button",
"type": "rectangle",
"x": 720,
"y": 400,
"width": 100,
"height": 40,
"strokeColor": "$border",
"backgroundColor": "$secondary",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["payment-section"],
"roundness": { "type": 3, "value": 6 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "update-payment-button-text",
"type": "text",
"x": 744,
"y": 412,
"width": 52,
"height": 16,
"text": "Update",
"fontSize": 14,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "$foreground",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["payment-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "billing-history-card",
"type": "rectangle",
"x": 304,
"y": 480,
"width": 840,
"height": 340,
"strokeColor": "$border",
"backgroundColor": "$card",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 8 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "history-title",
"type": "rectangle",
"x": 324,
"y": 500,
"width": 140,
"height": 20,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 4 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "history-title-text",
"type": "text",
"x": 324,
"y": 500,
"width": 140,
"height": 20,
"text": "Billing History",
"fontSize": 16,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "table-header",
"type": "rectangle",
"x": 324,
"y": 540,
"width": 800,
"height": 40,
"strokeColor": "$border",
"backgroundColor": "$muted",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 40,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 4 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "header-date",
"type": "rectangle",
"x": 344,
"y": 552,
"width": 60,
"height": 16,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "header-date-text",
"type": "text",
"x": 344,
"y": 552,
"width": 60,
"height": 16,
"text": "Date",
"fontSize": 12,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "header-amount",
"type": "rectangle",
"x": 544,
"y": 552,
"width": 80,
"height": 16,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "header-amount-text",
"type": "text",
"x": 544,
"y": 552,
"width": 80,
"height": 16,
"text": "Amount",
"fontSize": 12,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "header-status",
"type": "rectangle",
"x": 744,
"y": 552,
"width": 60,
"height": 16,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "header-status-text",
"type": "text",
"x": 744,
"y": 552,
"width": 60,
"height": 16,
"text": "Status",
"fontSize": 12,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "header-invoice",
"type": "rectangle",
"x": 944,
"y": 552,
"width": 80,
"height": 16,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "header-invoice-text",
"type": "text",
"x": 944,
"y": 552,
"width": 80,
"height": 16,
"text": "Invoice",
"fontSize": 12,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-1",
"type": "rectangle",
"x": 324,
"y": 580,
"width": 800,
"height": 48,
"strokeColor": "$border",
"backgroundColor": "$background",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 0 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-1-date",
"type": "rectangle",
"x": 344,
"y": 596,
"width": 100,
"height": 16,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-1-date-text",
"type": "text",
"x": 344,
"y": 596,
"width": 100,
"height": 16,
"text": "Jan 1, 2024",
"fontSize": 13,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-1-amount",
"type": "rectangle",
"x": 544,
"y": 596,
"width": 60,
"height": 16,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-1-amount-text",
"type": "text",
"x": 544,
"y": 596,
"width": 60,
"height": 16,
"text": "$29.00",
"fontSize": 13,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-1-status",
"type": "rectangle",
"x": 744,
"y": 592,
"width": 60,
"height": 24,
"strokeColor": "$success",
"backgroundColor": "$success",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 12 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-1-status-text",
"type": "text",
"x": 758,
"y": 596,
"width": 32,
"height": 16,
"text": "Paid",
"fontSize": 11,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-1-invoice",
"type": "rectangle",
"x": 944,
"y": 596,
"width": 80,
"height": 16,
"strokeColor": "$primary",
"backgroundColor": "$primary",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-1-invoice-text",
"type": "text",
"x": 948,
"y": 596,
"width": 72,
"height": 16,
"text": "Download",
"fontSize": 12,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-2",
"type": "rectangle",
"x": 324,
"y": 628,
"width": 800,
"height": 48,
"strokeColor": "$border",
"backgroundColor": "$background",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 0 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-2-date",
"type": "rectangle",
"x": 344,
"y": 644,
"width": 100,
"height": 16,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-2-date-text",
"type": "text",
"x": 344,
"y": 644,
"width": 100,
"height": 16,
"text": "Dec 1, 2023",
"fontSize": 13,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-2-amount",
"type": "rectangle",
"x": 544,
"y": 644,
"width": 60,
"height": 16,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-2-amount-text",
"type": "text",
"x": 544,
"y": 644,
"width": 60,
"height": 16,
"text": "$29.00",
"fontSize": 13,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-2-status",
"type": "rectangle",
"x": 744,
"y": 640,
"width": 60,
"height": 24,
"strokeColor": "$success",
"backgroundColor": "$success",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 12 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-2-status-text",
"type": "text",
"x": 758,
"y": 644,
"width": 32,
"height": 16,
"text": "Paid",
"fontSize": 11,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-2-invoice",
"type": "rectangle",
"x": 944,
"y": 644,
"width": 80,
"height": 16,
"strokeColor": "$primary",
"backgroundColor": "$primary",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-2-invoice-text",
"type": "text",
"x": 948,
"y": 644,
"width": 72,
"height": 16,
"text": "Download",
"fontSize": 12,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-3",
"type": "rectangle",
"x": 324,
"y": 676,
"width": 800,
"height": 48,
"strokeColor": "$border",
"backgroundColor": "$background",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 0 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-3-date",
"type": "rectangle",
"x": 344,
"y": 692,
"width": 100,
"height": 16,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-3-date-text",
"type": "text",
"x": 344,
"y": 692,
"width": 100,
"height": 16,
"text": "Nov 1, 2023",
"fontSize": 13,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-3-amount",
"type": "rectangle",
"x": 544,
"y": 692,
"width": 60,
"height": 16,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-3-amount-text",
"type": "text",
"x": 544,
"y": 692,
"width": 60,
"height": 16,
"text": "$29.00",
"fontSize": 13,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-3-status",
"type": "rectangle",
"x": 744,
"y": 688,
"width": 60,
"height": 24,
"strokeColor": "$success",
"backgroundColor": "$success",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 12 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-3-status-text",
"type": "text",
"x": 758,
"y": 692,
"width": 32,
"height": 16,
"text": "Paid",
"fontSize": 11,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-3-invoice",
"type": "rectangle",
"x": 944,
"y": 692,
"width": 80,
"height": 16,
"strokeColor": "$primary",
"backgroundColor": "$primary",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-3-invoice-text",
"type": "text",
"x": 948,
"y": 692,
"width": 72,
"height": 16,
"text": "Download",
"fontSize": 12,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-4",
"type": "rectangle",
"x": 324,
"y": 724,
"width": 800,
"height": 48,
"strokeColor": "$border",
"backgroundColor": "$background",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 0 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-4-date",
"type": "rectangle",
"x": 344,
"y": 740,
"width": 100,
"height": 16,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-4-date-text",
"type": "text",
"x": 344,
"y": 740,
"width": 100,
"height": 16,
"text": "Oct 1, 2023",
"fontSize": 13,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-4-amount",
"type": "rectangle",
"x": 544,
"y": 740,
"width": 60,
"height": 16,
"strokeColor": "$foreground",
"backgroundColor": "$foreground",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-4-amount-text",
"type": "text",
"x": 544,
"y": 740,
"width": 60,
"height": 16,
"text": "$29.00",
"fontSize": 13,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-4-status",
"type": "rectangle",
"x": 744,
"y": 736,
"width": 60,
"height": 24,
"strokeColor": "$success",
"backgroundColor": "$success",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 12 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-4-status-text",
"type": "text",
"x": 758,
"y": 740,
"width": 32,
"height": 16,
"text": "Paid",
"fontSize": 11,
"fontFamily": 1,
"textAlign": "center",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-4-invoice",
"type": "rectangle",
"x": 944,
"y": 740,
"width": 80,
"height": 16,
"strokeColor": "$primary",
"backgroundColor": "$primary",
"fillStyle": "solid",
"strokeWidth": 0,
"roughness": 0,
"opacity": 80,
"groupIds": ["history-section"],
"roundness": { "type": 3, "value": 2 },
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
},
{
"id": "row-4-invoice-text",
"type": "text",
"x": 948,
"y": 740,
"width": 72,
"height": 16,
"text": "Download",
"fontSize": 12,
"fontFamily": 1,
"textAlign": "left",
"verticalAlign": "middle",
"strokeColor": "$background",
"backgroundColor": "transparent",
"fillStyle": "solid",
"strokeWidth": 1,
"roughness": 0,
"opacity": 100,
"groupIds": ["history-section"],
"roundness": null,
"isDeleted": false,
"boundElements": null,
"link": null,
"locked": false
}
],
"appState": {
"gridSize": 20,
"viewBackgroundColor": "$background"
}
}