sketchmark 2.1.0 → 2.1.2

package/examples/settings-panel.visual.json

@@ -1,501 +0,0 @@
-{
-  "version": 1,
-  "canvas": {
-    "width": 960,
-    "height": 1200,
-    "background": "#f8fafc"
-  },
-  "elements": [
-    {
-      "id": "panel-title",
-      "type": "text",
-      "x": 64,
-      "y": 48,
-      "text": "Settings",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 32,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 700,
-      "fill": "#0f172a"
-    },
-    {
-      "id": "panel-desc",
-      "type": "text",
-      "x": 64,
-      "y": 96,
-      "text": "Manage your account preferences and application configuration.",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 14,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 400,
-      "fill": "#64748b"
-    },
-    {
-      "id": "display-name-label",
-      "type": "text",
-      "x": 88,
-      "y": 204,
-      "text": "Display Name",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 14,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 500,
-      "fill": "#334155"
-    },
-    {
-      "id": "display-name-helper",
-      "type": "text",
-      "x": 88,
-      "y": 226,
-      "text": "Your public-facing name shown across the application.",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 12,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 400,
-      "fill": "#64748b"
-    },
-    {
-      "id": "display-name-input-bg",
-      "type": "path",
-      "d": "M 94 250 L 866 250 Q 872 250 872 256 L 872 282 Q 872 288 866 288 L 94 288 Q 88 288 88 282 L 88 256 Q 88 250 94 250 Z",
-      "fill": "#ffffff",
-      "stroke": "#cbd5e1",
-      "strokeWidth": 1
-    },
-    {
-      "id": "display-name-placeholder",
-      "type": "text",
-      "x": 100,
-      "y": 269,
-      "text": "Jane Doe",
-      "align": "left",
-      "valign": "middle",
-      "fontSize": 13,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 400,
-      "fill": "#94a3b8"
-    },
-    {
-      "id": "email-label",
-      "type": "text",
-      "x": 88,
-      "y": 312,
-      "text": "Email Address",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 14,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 500,
-      "fill": "#334155"
-    },
-    {
-      "id": "email-helper",
-      "type": "text",
-      "x": 88,
-      "y": 334,
-      "text": "Used for notifications and account recovery.",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 12,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 400,
-      "fill": "#64748b"
-    },
-    {
-      "id": "email-input-bg",
-      "type": "path",
-      "d": "M 94 358 L 866 358 Q 872 358 872 364 L 872 390 Q 872 396 866 396 L 94 396 Q 88 396 88 390 L 88 364 Q 88 358 94 358 Z",
-      "fill": "#ffffff",
-      "stroke": "#cbd5e1",
-      "strokeWidth": 1
-    },
-    {
-      "id": "email-placeholder",
-      "type": "text",
-      "x": 100,
-      "y": 377,
-      "text": "jane@example.com",
-      "align": "left",
-      "valign": "middle",
-      "fontSize": 13,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 400,
-      "fill": "#94a3b8"
-    },
-    {
-      "id": "profile-card",
-      "type": "path",
-      "d": "M 74 136 L 886 136 Q 896 136 896 146 L 896 410 Q 896 420 886 420 L 74 420 Q 64 420 64 410 L 64 146 Q 64 136 74 136 Z",
-      "fill": "#ffffff",
-      "stroke": "#e2e8f0",
-      "strokeWidth": 1
-    },
-    {
-      "id": "profile-title",
-      "type": "text",
-      "x": 88,
-      "y": 154,
-      "text": "Profile",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 18,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 600,
-      "fill": "#1e293b"
-    },
-    {
-      "id": "profile-div",
-      "type": "path",
-      "d": "M 64 180 L 896 180",
-      "stroke": "#e2e8f0",
-      "strokeWidth": 1,
-      "fill": "none"
-    },
-    {
-      "id": "email-notif-label",
-      "type": "text",
-      "x": 88,
-      "y": 520,
-      "text": "Email Notifications",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 14,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 500,
-      "fill": "#334155"
-    },
-    {
-      "id": "email-notif-track",
-      "type": "path",
-      "d": "M 843 518 L 861 518 Q 872 518 872 529 L 872 529 Q 872 540 861 540 L 843 540 Q 832 540 832 529 L 832 529 Q 832 518 843 518 Z",
-      "fill": "#2563eb",
-      "stroke": "none"
-    },
-    {
-      "id": "email-notif-knob",
-      "type": "path",
-      "d": "M 861 521 A 8 8 0 1 1 861 537 A 8 8 0 1 1 861 521 Z",
-      "fill": "#ffffff",
-      "stroke": "none"
-    },
-    {
-      "id": "email-notif-helper",
-      "type": "text",
-      "x": 88,
-      "y": 542,
-      "text": "Receive updates about activity in your projects.",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 12,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 400,
-      "fill": "#64748b"
-    },
-    {
-      "id": "marketing-label",
-      "type": "text",
-      "x": 88,
-      "y": 586,
-      "text": "Marketing Emails",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 14,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 500,
-      "fill": "#334155"
-    },
-    {
-      "id": "marketing-track",
-      "type": "path",
-      "d": "M 843 584 L 861 584 Q 872 584 872 595 L 872 595 Q 872 606 861 606 L 843 606 Q 832 606 832 595 L 832 595 Q 832 584 843 584 Z",
-      "fill": "#d1d5db",
-      "stroke": "none"
-    },
-    {
-      "id": "marketing-knob",
-      "type": "path",
-      "d": "M 843 587 A 8 8 0 1 1 843 603 A 8 8 0 1 1 843 587 Z",
-      "fill": "#ffffff",
-      "stroke": "none"
-    },
-    {
-      "id": "marketing-helper",
-      "type": "text",
-      "x": 88,
-      "y": 608,
-      "text": "Occasional product announcements and feature previews.",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 12,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 400,
-      "fill": "#64748b"
-    },
-    {
-      "id": "slack-label",
-      "type": "text",
-      "x": 88,
-      "y": 652,
-      "text": "Slack Integration",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 14,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 500,
-      "fill": "#334155"
-    },
-    {
-      "id": "slack-track",
-      "type": "path",
-      "d": "M 843 650 L 861 650 Q 872 650 872 661 L 872 661 Q 872 672 861 672 L 843 672 Q 832 672 832 661 L 832 661 Q 832 650 843 650 Z",
-      "fill": "#2563eb",
-      "stroke": "none"
-    },
-    {
-      "id": "slack-knob",
-      "type": "path",
-      "d": "M 861 653 A 8 8 0 1 1 861 669 A 8 8 0 1 1 861 653 Z",
-      "fill": "#ffffff",
-      "stroke": "none"
-    },
-    {
-      "id": "slack-helper",
-      "type": "text",
-      "x": 88,
-      "y": 674,
-      "text": "Push real-time alerts to your connected Slack workspace.",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 12,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 400,
-      "fill": "#64748b"
-    },
-    {
-      "id": "notif-card",
-      "type": "path",
-      "d": "M 74 452 L 886 452 Q 896 452 896 462 L 896 708 Q 896 718 886 718 L 74 718 Q 64 718 64 708 L 64 462 Q 64 452 74 452 Z",
-      "fill": "#ffffff",
-      "stroke": "#e2e8f0",
-      "strokeWidth": 1
-    },
-    {
-      "id": "notif-title",
-      "type": "text",
-      "x": 88,
-      "y": 470,
-      "text": "Notifications",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 18,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 600,
-      "fill": "#1e293b"
-    },
-    {
-      "id": "notif-div",
-      "type": "path",
-      "d": "M 64 496 L 896 496",
-      "stroke": "#e2e8f0",
-      "strokeWidth": 1,
-      "fill": "none"
-    },
-    {
-      "id": "twofa-label",
-      "type": "text",
-      "x": 88,
-      "y": 818,
-      "text": "Two-Factor Authentication",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 14,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 500,
-      "fill": "#334155"
-    },
-    {
-      "id": "twofa-track",
-      "type": "path",
-      "d": "M 843 816 L 861 816 Q 872 816 872 827 L 872 827 Q 872 838 861 838 L 843 838 Q 832 838 832 827 L 832 827 Q 832 816 843 816 Z",
-      "fill": "#2563eb",
-      "stroke": "none"
-    },
-    {
-      "id": "twofa-knob",
-      "type": "path",
-      "d": "M 861 819 A 8 8 0 1 1 861 835 A 8 8 0 1 1 861 819 Z",
-      "fill": "#ffffff",
-      "stroke": "none"
-    },
-    {
-      "id": "twofa-helper",
-      "type": "text",
-      "x": 88,
-      "y": 840,
-      "text": "Adds an extra layer of protection to your account.",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 12,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 400,
-      "fill": "#64748b"
-    },
-    {
-      "id": "session-label",
-      "type": "text",
-      "x": 88,
-      "y": 884,
-      "text": "Session Timeout",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 14,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 500,
-      "fill": "#334155"
-    },
-    {
-      "id": "session-helper",
-      "type": "text",
-      "x": 88,
-      "y": 906,
-      "text": "Automatically log out after this period of inactivity.",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 12,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 400,
-      "fill": "#64748b"
-    },
-    {
-      "id": "session-input-bg",
-      "type": "path",
-      "d": "M 94 930 L 866 930 Q 872 930 872 936 L 872 962 Q 872 968 866 968 L 94 968 Q 88 968 88 962 L 88 936 Q 88 930 94 930 Z",
-      "fill": "#ffffff",
-      "stroke": "#cbd5e1",
-      "strokeWidth": 1
-    },
-    {
-      "id": "session-placeholder",
-      "type": "text",
-      "x": 100,
-      "y": 949,
-      "text": "30 minutes",
-      "align": "left",
-      "valign": "middle",
-      "fontSize": 13,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 400,
-      "fill": "#94a3b8"
-    },
-    {
-      "id": "security-warn-bg",
-      "type": "path",
-      "d": "M 94 992 L 866 992 Q 872 992 872 998 L 872 1050 Q 872 1056 866 1056 L 94 1056 Q 88 1056 88 1050 L 88 998 Q 88 992 94 992 Z",
-      "fill": "#fef3c7",
-      "stroke": "#f59e0b",
-      "strokeWidth": 1
-    },
-    {
-      "id": "security-warn-icon",
-      "type": "text",
-      "x": 102,
-      "y": 1004,
-      "text": "⚠",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 14,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 400,
-      "fill": "#92400e"
-    },
-    {
-      "id": "security-warn-text",
-      "type": "text",
-      "x": 124,
-      "y": 1005,
-      "text": "Disabling 2FA will immediately remove the second factor from\nyour account. You will not be prompted again until re-enabled.",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 12,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 400,
-      "lineHeight": 1.65,
-      "fill": "#92400e",
-      "maxWidth": 734
-    },
-    {
-      "id": "security-card",
-      "type": "path",
-      "d": "M 74 750 L 886 750 Q 896 750 896 760 L 896 1070 Q 896 1080 886 1080 L 74 1080 Q 64 1080 64 1070 L 64 760 Q 64 750 74 750 Z",
-      "fill": "#ffffff",
-      "stroke": "#e2e8f0",
-      "strokeWidth": 1
-    },
-    {
-      "id": "security-title",
-      "type": "text",
-      "x": 88,
-      "y": 768,
-      "text": "Security",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 18,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 600,
-      "fill": "#1e293b"
-    },
-    {
-      "id": "security-div",
-      "type": "path",
-      "d": "M 64 794 L 896 794",
-      "stroke": "#e2e8f0",
-      "strokeWidth": 1,
-      "fill": "none"
-    },
-    {
-      "id": "btn-reset-bg",
-      "type": "path",
-      "d": "M 72 1120 L 156 1120 Q 164 1120 164 1128 L 164 1154 Q 164 1162 156 1162 L 72 1162 Q 64 1162 64 1154 L 64 1128 Q 64 1120 72 1120 Z",
-      "fill": "#ffffff",
-      "stroke": "#cbd5e1",
-      "strokeWidth": 1
-    },
-    {
-      "id": "btn-reset-label",
-      "type": "text",
-      "x": 114,
-      "y": 1141,
-      "text": "Reset",
-      "align": "center",
-      "valign": "middle",
-      "fontSize": 14,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 500,
-      "fill": "#475569"
-    },
-    {
-      "id": "btn-save-bg",
-      "type": "path",
-      "d": "M 188 1120 L 292 1120 Q 300 1120 300 1128 L 300 1154 Q 300 1162 292 1162 L 188 1162 Q 180 1162 180 1154 L 180 1128 Q 180 1120 188 1120 Z",
-      "fill": "#2563eb",
-      "stroke": "none"
-    },
-    {
-      "id": "btn-save-label",
-      "type": "text",
-      "x": 240,
-      "y": 1141,
-      "text": "Save Changes",
-      "align": "center",
-      "valign": "middle",
-      "fontSize": 14,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 600,
-      "fill": "#ffffff"
-    }
-  ]
-}

package/examples/split-preview.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="600" viewBox="0 0 1200 600" role="img"><rect x="0" y="0" width="1200" height="600" fill="#f8fafc"/><path id="code-bg" d="M 60 48 L 568 48 Q 580 48 580 60 L 580 540 Q 580 552 568 552 L 60 552 Q 48 552 48 540 L 48 60 Q 48 48 60 48 Z" fill="#1e293b" stroke="none" stroke-width="0"/><text id="code-label" text-anchor="start" dominant-baseline="middle" font-family="JetBrains Mono, Fira Code, monospace" font-size="11" font-weight="500" fill="#64748b"><tspan x="72" y="73.5">document.visual.json</tspan></text><text id="code-text" text-anchor="start" dominant-baseline="middle" font-family="JetBrains Mono, Fira Code, monospace" font-size="12" font-weight="400" fill="#e2e8f0"><tspan x="72" y="102">{</tspan><tspan x="72" y="120">  "version": 1,</tspan><tspan x="72" y="138">  "canvas": {</tspan><tspan x="72" y="156">    "width": 400,</tspan><tspan x="72" y="174">    "height": 300,</tspan><tspan x="72" y="192">    "background": "#ffffff"</tspan><tspan x="72" y="210">  },</tspan><tspan x="72" y="228">  "elements": [</tspan><tspan x="72" y="246">    {</tspan><tspan x="72" y="264">      "id": "card",</tspan><tspan x="72" y="282">      "type": "path",</tspan><tspan x="72" y="300">      "d": "M 20 20 L 380 20 ...",</tspan><tspan x="72" y="318">      "fill": "#f1f5f9",</tspan><tspan x="72" y="336">      "stroke": "#e2e8f0"</tspan><tspan x="72" y="354">    },</tspan><tspan x="72" y="372">    {</tspan><tspan x="72" y="390">      "id": "title",</tspan><tspan x="72" y="408">      "type": "text",</tspan><tspan x="72" y="426">      "x": 40,</tspan><tspan x="72" y="444">      "y": 60,</tspan><tspan x="72" y="462">      "text": "Welcome",</tspan><tspan x="72" y="480">      "fontSize": 24,</tspan><tspan x="72" y="498">      "weight": 700</tspan><tspan x="72" y="516">    }</tspan><tspan x="72" y="534">  ]</tspan><tspan x="72" y="552">}</tspan></text><path id="badge-bg" d="M 834 48 L 938 48 Q 951 48 951 61 L 951 61 Q 951 74 938 74 L 834 74 Q 821 74 821 61 L 821 61 Q 821 48 834 48 Z" fill="#8b5cf6" stroke="none" stroke-width="0"/><text id="badge-text" text-anchor="middle" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="11" font-weight="600" fill="#ffffff"><tspan x="886" y="61">Rendered output</tspan></text><path id="preview-bg" d="M 632 94 L 1140 94 Q 1152 94 1152 106 L 1152 540 Q 1152 552 1140 552 L 632 552 Q 620 552 620 540 L 620 106 Q 620 94 632 94 Z" fill="#ffffff" stroke="#e2e8f0" stroke-width="1"/><path id="inner-card-bg" d="M 660 126 L 1112 126 Q 1120 126 1120 134 L 1120 318 Q 1120 326 1112 326 L 660 326 Q 652 326 652 318 L 652 134 Q 652 126 660 126 Z" fill="#f1f5f9" stroke="#e2e8f0" stroke-width="1"/><text id="inner-card-title" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="24" font-weight="700" fill="#0f172a"><tspan x="676" y="170">Welcome</tspan></text><text id="inner-card-body" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="13" font-weight="400" fill="#64748b"><tspan x="676" y="204.5">This card was rendered from the JSON</tspan><tspan x="676" y="224.65">definition on the left. The kernel resolves</tspan><tspan x="676" y="244.8">all elements into positioned primitives.</tspan></text><text id="preview-caption" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="13" font-weight="400" fill="#64748b"><tspan x="652" y="360.5">Live preview updates as the document changes.</tspan><tspan x="652" y="380.65">No build step required — just edit and see.</tspan></text></svg>

package/examples/split-preview.visual.json

@@ -1,124 +0,0 @@
-{
-  "version": 1,
-  "canvas": {
-    "width": 1200,
-    "height": 600,
-    "background": "#f8fafc"
-  },
-  "elements": [
-    {
-      "id": "code-bg",
-      "type": "path",
-      "d": "M 60 48 L 568 48 Q 580 48 580 60 L 580 540 Q 580 552 568 552 L 60 552 Q 48 552 48 540 L 48 60 Q 48 48 60 48 Z",
-      "fill": "#1e293b",
-      "stroke": "none"
-    },
-    {
-      "id": "code-label",
-      "type": "text",
-      "x": 72,
-      "y": 68,
-      "text": "document.visual.json",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 11,
-      "fontFamily": "JetBrains Mono, Fira Code, monospace",
-      "weight": 500,
-      "fill": "#64748b"
-    },
-    {
-      "id": "code-text",
-      "type": "text",
-      "x": 72,
-      "y": 96,
-      "text": "{\n  \"version\": 1,\n  \"canvas\": {\n    \"width\": 400,\n    \"height\": 300,\n    \"background\": \"#ffffff\"\n  },\n  \"elements\": [\n    {\n      \"id\": \"card\",\n      \"type\": \"path\",\n      \"d\": \"M 20 20 L 380 20 ...\",\n      \"fill\": \"#f1f5f9\",\n      \"stroke\": \"#e2e8f0\"\n    },\n    {\n      \"id\": \"title\",\n      \"type\": \"text\",\n      \"x\": 40,\n      \"y\": 60,\n      \"text\": \"Welcome\",\n      \"fontSize\": 24,\n      \"weight\": 700\n    }\n  ]\n}",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 12,
-      "fontFamily": "JetBrains Mono, Fira Code, monospace",
-      "weight": 400,
-      "lineHeight": 1.5,
-      "fill": "#e2e8f0",
-      "maxWidth": 484
-    },
-    {
-      "id": "badge-bg",
-      "type": "path",
-      "d": "M 834 48 L 938 48 Q 951 48 951 61 L 951 61 Q 951 74 938 74 L 834 74 Q 821 74 821 61 L 821 61 Q 821 48 834 48 Z",
-      "fill": "#8b5cf6",
-      "stroke": "none"
-    },
-    {
-      "id": "badge-text",
-      "type": "text",
-      "x": 886,
-      "y": 61,
-      "text": "Rendered output",
-      "align": "center",
-      "valign": "middle",
-      "fontSize": 11,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 600,
-      "fill": "#ffffff"
-    },
-    {
-      "id": "preview-bg",
-      "type": "path",
-      "d": "M 632 94 L 1140 94 Q 1152 94 1152 106 L 1152 540 Q 1152 552 1140 552 L 632 552 Q 620 552 620 540 L 620 106 Q 620 94 632 94 Z",
-      "fill": "#ffffff",
-      "stroke": "#e2e8f0",
-      "strokeWidth": 1
-    },
-    {
-      "id": "inner-card-bg",
-      "type": "path",
-      "d": "M 660 126 L 1112 126 Q 1120 126 1120 134 L 1120 318 Q 1120 326 1112 326 L 660 326 Q 652 326 652 318 L 652 134 Q 652 126 660 126 Z",
-      "fill": "#f1f5f9",
-      "stroke": "#e2e8f0",
-      "strokeWidth": 1
-    },
-    {
-      "id": "inner-card-title",
-      "type": "text",
-      "x": 676,
-      "y": 158,
-      "text": "Welcome",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 24,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 700,
-      "fill": "#0f172a"
-    },
-    {
-      "id": "inner-card-body",
-      "type": "text",
-      "x": 676,
-      "y": 198,
-      "text": "This card was rendered from the JSON\ndefinition on the left. The kernel resolves\nall elements into positioned primitives.",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 13,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 400,
-      "lineHeight": 1.55,
-      "fill": "#64748b",
-      "maxWidth": 420
-    },
-    {
-      "id": "preview-caption",
-      "type": "text",
-      "x": 652,
-      "y": 354,
-      "text": "Live preview updates as the document changes.\nNo build step required — just edit and see.",
-      "align": "left",
-      "valign": "top",
-      "fontSize": 13,
-      "fontFamily": "Inter, system-ui, sans-serif",
-      "weight": 400,
-      "lineHeight": 1.55,
-      "fill": "#64748b",
-      "maxWidth": 468
-    }
-  ]
-}

package/examples/storyboard.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="1100" height="720" viewBox="0 0 1100 720" role="img"><rect x="0" y="0" width="1100" height="720" fill="#f1f5f9"/><text id="page-title" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="28" font-weight="700" fill="#0f172a"><tspan x="48" y="54">Product Launch Storyboard</tspan></text><text id="page-subtitle" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="14" font-weight="400" fill="#64748b"><tspan x="48" y="85">Four key moments in the announcement video sequence.</tspan></text><path id="panel-1-bg" d="M 58 122 L 528 122 Q 538 122 538 132 L 538 372 Q 538 382 528 382 L 58 382 Q 48 382 48 372 L 48 132 Q 48 122 58 122 Z" fill="#ffffff" stroke="#e2e8f0" stroke-width="1"/><text id="panel-1-number" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="32" font-weight="700" fill="#cbd5e1"><tspan x="68" y="158">01</tspan></text><path id="panel-1-tag-bg" d="M 462 142 L 505 142 Q 518 142 518 155 L 518 155 Q 518 168 505 168 L 462 168 Q 449 168 449 155 L 449 155 Q 449 142 462 142 Z" fill="#0f172a" stroke="none" stroke-width="0"/><text id="panel-1-tag-text" text-anchor="middle" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="11" font-weight="600" fill="#ffffff"><tspan x="483.5" y="155">Intro</tspan></text><text id="panel-1-title" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="18" font-weight="600" fill="#1e293b"><tspan x="68" y="203">Brand Logo Reveal</tspan></text><text id="panel-1-caption" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="13" font-weight="400" fill="#475569"><tspan x="68" y="232.5">Open on a dark screen. The logo fades in from</tspan><tspan x="68" y="253.3">the center with a subtle glow effect. Hold for</tspan><tspan x="68" y="274.1">two seconds to establish brand presence.</tspan></text><path id="panel-2-bg" d="M 572 122 L 1042 122 Q 1052 122 1052 132 L 1052 372 Q 1052 382 1042 382 L 572 382 Q 562 382 562 372 L 562 132 Q 562 122 572 122 Z" fill="#ffffff" stroke="#e2e8f0" stroke-width="1"/><text id="panel-2-number" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="32" font-weight="700" fill="#cbd5e1"><tspan x="582" y="158">02</tspan></text><path id="panel-2-tag-bg" d="M 967 142 L 1019 142 Q 1032 142 1032 155 L 1032 155 Q 1032 168 1019 168 L 967 168 Q 954 168 954 155 L 954 155 Q 954 142 967 142 Z" fill="#0f172a" stroke="none" stroke-width="0"/><text id="panel-2-tag-text" text-anchor="middle" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="11" font-weight="600" fill="#ffffff"><tspan x="993" y="155">Action</tspan></text><text id="panel-2-title" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="18" font-weight="600" fill="#1e293b"><tspan x="582" y="203">Feature Demonstration</tspan></text><text id="panel-2-caption" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="13" font-weight="400" fill="#475569"><tspan x="582" y="232.5">Quick cuts showing the product in use. Focus</tspan><tspan x="582" y="253.3">on three key interactions: search, create, and</tspan><tspan x="582" y="274.1">share. Each clip lasts 1.5 seconds.</tspan></text><path id="panel-3-bg" d="M 58 406 L 528 406 Q 538 406 538 416 L 538 656 Q 538 666 528 666 L 58 666 Q 48 666 48 656 L 48 416 Q 48 406 58 406 Z" fill="#ffffff" stroke="#e2e8f0" stroke-width="1"/><text id="panel-3-number" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="32" font-weight="700" fill="#cbd5e1"><tspan x="68" y="442">03</tspan></text><path id="panel-3-tag-bg" d="M 462 426 L 505 426 Q 518 426 518 439 L 518 439 Q 518 452 505 452 L 462 452 Q 449 452 449 439 L 449 439 Q 449 426 462 426 Z" fill="#0f172a" stroke="none" stroke-width="0"/><text id="panel-3-tag-text" text-anchor="middle" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="11" font-weight="600" fill="#ffffff"><tspan x="483.5" y="439">Pause</tspan></text><text id="panel-3-title" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="18" font-weight="600" fill="#1e293b"><tspan x="68" y="487">Customer Testimonial</tspan></text><text id="panel-3-caption" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="13" font-weight="400" fill="#475569"><tspan x="68" y="516.5">A single customer speaks directly to camera.</tspan><tspan x="68" y="537.3">Keep framing tight on their face. Let the quote</tspan><tspan x="68" y="558.1">breathe with natural pauses for emphasis.</tspan></text><path id="panel-4-bg" d="M 572 406 L 1042 406 Q 1052 406 1052 416 L 1052 656 Q 1052 666 1042 666 L 572 666 Q 562 666 562 656 L 562 416 Q 562 406 572 406 Z" fill="#ffffff" stroke="#e2e8f0" stroke-width="1"/><text id="panel-4-number" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="32" font-weight="700" fill="#cbd5e1"><tspan x="582" y="442">04</tspan></text><path id="panel-4-tag-bg" d="M 994 426 L 1019 426 Q 1032 426 1032 439 L 1032 439 Q 1032 452 1019 452 L 994 452 Q 981 452 981 439 L 981 439 Q 981 426 994 426 Z" fill="#0f172a" stroke="none" stroke-width="0"/><text id="panel-4-tag-text" text-anchor="middle" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="11" font-weight="600" fill="#ffffff"><tspan x="1006.5" y="439">End</tspan></text><text id="panel-4-title" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="18" font-weight="600" fill="#1e293b"><tspan x="582" y="487">Call to Action</tspan></text><text id="panel-4-caption" text-anchor="start" dominant-baseline="middle" font-family="Roboto, Arial, sans-serif" font-size="13" font-weight="400" fill="#475569"><tspan x="582" y="516.5">Product name and tagline animate in from</tspan><tspan x="582" y="537.3">the left. URL and QR code appear below.</tspan><tspan x="582" y="558.1">End with logo lockup in the corner.</tspan></text></svg>