@layoutdesign/context 0.1.9 → 0.1.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/src/mcp/tools/get-screenshots.d.ts +1 -1
- package/dist/src/mcp/tools/push-to-figma.d.ts +3 -1
- package/dist/src/mcp/tools/push-to-figma.d.ts.map +1 -1
- package/dist/src/mcp/tools/push-to-figma.js +80 -28
- package/dist/src/mcp/tools/push-to-figma.js.map +1 -1
- package/dist/src/mcp/tools/url-to-figma.d.ts +1 -1
- package/dist/src/preview/server.d.ts.map +1 -1
- package/dist/src/preview/server.js +5 -16
- package/dist/src/preview/server.js.map +1 -1
- package/package.json +1 -1
|
@@ -3,8 +3,8 @@ export declare const name = "get-screenshots";
|
|
|
3
3
|
export declare const description: string;
|
|
4
4
|
export declare const inputSchema: {
|
|
5
5
|
type: z.ZodDefault<z.ZodOptional<z.ZodEnum<{
|
|
6
|
-
viewport: "viewport";
|
|
7
6
|
"full-page": "full-page";
|
|
7
|
+
viewport: "viewport";
|
|
8
8
|
all: "all";
|
|
9
9
|
}>>>;
|
|
10
10
|
};
|
|
@@ -10,11 +10,13 @@ export declare const inputSchema: {
|
|
|
10
10
|
tablet: "tablet";
|
|
11
11
|
mobile: "mobile";
|
|
12
12
|
}>>>;
|
|
13
|
+
figmaUrl: z.ZodOptional<z.ZodString>;
|
|
13
14
|
};
|
|
14
|
-
export declare function handler(kit: Kit | null): ({ code, name: frameName, viewports }: {
|
|
15
|
+
export declare function handler(kit: Kit | null): ({ code, name: frameName, viewports, figmaUrl, }: {
|
|
15
16
|
code: string;
|
|
16
17
|
name?: string;
|
|
17
18
|
viewports?: string[];
|
|
19
|
+
figmaUrl?: string;
|
|
18
20
|
}) => Promise<{
|
|
19
21
|
content: {
|
|
20
22
|
type: "text";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"push-to-figma.d.ts","sourceRoot":"","sources":["../../../../src/mcp/tools/push-to-figma.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AACxB,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AAG9C,eAAO,MAAM,IAAI,kBAAkB,CAAC;AAEpC,eAAO,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"push-to-figma.d.ts","sourceRoot":"","sources":["../../../../src/mcp/tools/push-to-figma.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AACxB,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AAG9C,eAAO,MAAM,IAAI,kBAAkB,CAAC;AAEpC,eAAO,MAAM,WAAW,QAI+C,CAAC;AAExE,eAAO,MAAM,WAAW;;;;;;;;;CAiBvB,CAAC;AAUF,wBAAgB,OAAO,CAAC,GAAG,EAAE,GAAG,GAAG,IAAI,IACvB,iDAKX;IACD,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,EAAE,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;;;;;GA6IF"}
|
|
@@ -2,9 +2,9 @@ import { z } from "zod";
|
|
|
2
2
|
import { PREVIEW_PORT } from "../../kit/types.js";
|
|
3
3
|
export const name = "push-to-figma";
|
|
4
4
|
export const description = "Push a component to Figma as editable frames. Sends the code to the preview server, " +
|
|
5
|
-
"then returns step-by-step instructions for capturing it via Figma MCP
|
|
6
|
-
"
|
|
7
|
-
"Requires
|
|
5
|
+
"then returns step-by-step instructions for capturing it via Figma MCP and Playwright MCP. " +
|
|
6
|
+
"Supports multi-viewport capture (desktop, tablet, mobile) with correct responsive rendering. " +
|
|
7
|
+
"Requires both Figma MCP and Playwright MCP servers to be connected.";
|
|
8
8
|
export const inputSchema = {
|
|
9
9
|
code: z.string().describe("The component TSX/JSX code to push to Figma as an editable frame"),
|
|
10
10
|
name: z
|
|
@@ -15,12 +15,31 @@ export const inputSchema = {
|
|
|
15
15
|
.array(z.enum(["desktop", "tablet", "mobile"]))
|
|
16
16
|
.optional()
|
|
17
17
|
.describe("Viewports to capture (default: ['desktop']). Each gets a separate Figma frame."),
|
|
18
|
+
figmaUrl: z
|
|
19
|
+
.string()
|
|
20
|
+
.optional()
|
|
21
|
+
.describe("Figma file URL to push into (e.g. https://www.figma.com/design/ABC123/...). " +
|
|
22
|
+
"If provided, pushes into this existing file. If omitted, creates a new file."),
|
|
23
|
+
};
|
|
24
|
+
const VIEWPORT_DIMS = {
|
|
25
|
+
desktop: { width: 1280, height: 900 },
|
|
26
|
+
tablet: { width: 768, height: 1024 },
|
|
27
|
+
mobile: { width: 375, height: 812 },
|
|
18
28
|
};
|
|
29
|
+
const DEFAULT_DIMS = VIEWPORT_DIMS.desktop;
|
|
19
30
|
export function handler(kit) {
|
|
20
|
-
return async ({ code, name: frameName, viewports }) => {
|
|
31
|
+
return async ({ code, name: frameName, viewports, figmaUrl, }) => {
|
|
21
32
|
const resolvedName = frameName ?? "Layout Component";
|
|
22
33
|
const resolvedViewports = viewports ?? ["desktop"];
|
|
23
34
|
const captureUrl = `http://localhost:${PREVIEW_PORT}/capture`;
|
|
35
|
+
// Parse fileKey from Figma URL if provided
|
|
36
|
+
let resolvedFileKey;
|
|
37
|
+
if (figmaUrl) {
|
|
38
|
+
const match = figmaUrl.match(/\/design\/([^/]+)/);
|
|
39
|
+
if (match)
|
|
40
|
+
resolvedFileKey = match[1];
|
|
41
|
+
}
|
|
42
|
+
const outputMode = resolvedFileKey ? "existingFile" : "newFile";
|
|
24
43
|
// Step 1: Push code to the preview server so /capture has something to render
|
|
25
44
|
let pushStatus;
|
|
26
45
|
try {
|
|
@@ -74,39 +93,72 @@ export function handler(kit) {
|
|
|
74
93
|
],
|
|
75
94
|
};
|
|
76
95
|
}
|
|
77
|
-
// Step 2: Build capture instructions for Figma MCP
|
|
78
|
-
const
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
96
|
+
// Step 2: Build directive capture instructions for Figma MCP + Playwright MCP
|
|
97
|
+
const captureSteps = resolvedViewports
|
|
98
|
+
.map((vp, i) => {
|
|
99
|
+
const dims = VIEWPORT_DIMS[vp] ?? DEFAULT_DIMS;
|
|
100
|
+
const vpLabel = vp.charAt(0).toUpperCase() + vp.slice(1);
|
|
101
|
+
const frameSuffix = resolvedViewports.length > 1 ? ` — ${vpLabel}` : "";
|
|
102
|
+
const stepBase = i * 6;
|
|
103
|
+
return [
|
|
104
|
+
`### Viewport: ${vpLabel} (${dims.width}×${dims.height})`,
|
|
105
|
+
"",
|
|
106
|
+
`**Step ${stepBase + 1}.** Call \`generate_figma_design\` with:`,
|
|
107
|
+
resolvedFileKey
|
|
108
|
+
? ` - \`outputMode: "existingFile"\`, \`fileKey: "${resolvedFileKey}"\``
|
|
109
|
+
: ` - \`outputMode: "${outputMode}"\``,
|
|
110
|
+
` → Save the returned \`captureId\``,
|
|
111
|
+
"",
|
|
112
|
+
`**Step ${stepBase + 2}.** Call \`browser_resize\` with:`,
|
|
113
|
+
` - \`width: ${dims.width}\`, \`height: ${dims.height}\``,
|
|
114
|
+
"",
|
|
115
|
+
`**Step ${stepBase + 3}.** Call \`browser_navigate\` with:`,
|
|
116
|
+
` - \`url: "${captureUrl}"\``,
|
|
117
|
+
"",
|
|
118
|
+
`**Step ${stepBase + 4}.** Call \`browser_evaluate\` with this code:`,
|
|
119
|
+
"```javascript",
|
|
120
|
+
"(async () => {",
|
|
121
|
+
" const script = document.createElement('script');",
|
|
122
|
+
" script.src = 'https://mcp.figma.com/mcp/html-to-design/capture.js';",
|
|
123
|
+
" document.head.appendChild(script);",
|
|
124
|
+
" await new Promise(r => setTimeout(r, 1500));",
|
|
125
|
+
" location.hash = 'figmacapture=<CAPTURE_ID>&figmaendpoint=https%3A%2F%2Fmcp.figma.com%2Fmcp%2Fcapture%2F<CAPTURE_ID>%2Fsubmit&figmadelay=3000';",
|
|
126
|
+
"})()",
|
|
127
|
+
"```",
|
|
128
|
+
` Replace \`<CAPTURE_ID>\` with the captureId from step ${stepBase + 1}.`,
|
|
129
|
+
"",
|
|
130
|
+
`**Step ${stepBase + 5}.** Wait 10 seconds.`,
|
|
131
|
+
"",
|
|
132
|
+
`**Step ${stepBase + 6}.** Poll \`generate_figma_design\` with \`captureId\` every 5 seconds until status is \`completed\`.`,
|
|
133
|
+
"",
|
|
134
|
+
].join("\n");
|
|
135
|
+
})
|
|
136
|
+
.join("\n");
|
|
82
137
|
const response = [
|
|
83
|
-
"# Push to Figma",
|
|
84
|
-
"",
|
|
85
|
-
`${pushStatus}. The component is now rendering at \`${captureUrl}\`.`,
|
|
86
|
-
"",
|
|
87
|
-
"## Capture URLs",
|
|
138
|
+
"# Push to Figma — Execute Immediately",
|
|
88
139
|
"",
|
|
89
|
-
|
|
140
|
+
`${pushStatus}. The component is rendering at \`${captureUrl}\`.`,
|
|
90
141
|
"",
|
|
91
|
-
"
|
|
142
|
+
"**INSTRUCTION: Execute ALL steps below now. Do NOT ask the user for confirmation. Do NOT create temp HTML files or start HTTP servers.**",
|
|
92
143
|
"",
|
|
93
|
-
"
|
|
144
|
+
"## Prerequisites",
|
|
94
145
|
"",
|
|
95
|
-
"
|
|
96
|
-
"
|
|
97
|
-
|
|
98
|
-
"4. Poll `generate_figma_design` with `captureId` until completed",
|
|
146
|
+
"Both MCP servers must be connected:",
|
|
147
|
+
"- **Figma MCP**: `claude mcp add --transport http figma https://mcp.figma.com/mcp`",
|
|
148
|
+
"- **Playwright MCP**: Required for `browser_navigate`, `browser_resize`, `browser_evaluate`",
|
|
99
149
|
"",
|
|
100
|
-
"
|
|
101
|
-
`The component is already rendered and ready to capture at \`${captureUrl}\`.`,
|
|
150
|
+
"## Capture Instructions",
|
|
102
151
|
"",
|
|
103
|
-
|
|
152
|
+
`Capturing ${resolvedViewports.length} viewport(s): ${resolvedViewports.join(", ")}`,
|
|
153
|
+
`Frame name: **${resolvedName}**`,
|
|
104
154
|
"",
|
|
105
|
-
|
|
155
|
+
captureSteps,
|
|
156
|
+
"## Notes",
|
|
106
157
|
"",
|
|
107
|
-
"
|
|
108
|
-
"
|
|
109
|
-
"
|
|
158
|
+
"- Each viewport gets its own captureId — do not reuse captureIds",
|
|
159
|
+
"- The component is already rendered at the capture URL — use it directly",
|
|
160
|
+
"- Viewport sizing is handled by `browser_resize` so Tailwind responsive breakpoints work correctly",
|
|
161
|
+
"- Do NOT use `?viewport=` query params — they are deprecated",
|
|
110
162
|
].join("\n");
|
|
111
163
|
return {
|
|
112
164
|
content: [{ type: "text", text: response }],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"push-to-figma.js","sourceRoot":"","sources":["../../../../src/mcp/tools/push-to-figma.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAElD,MAAM,CAAC,MAAM,IAAI,GAAG,eAAe,CAAC;AAEpC,MAAM,CAAC,MAAM,WAAW,GACtB,sFAAsF;IACtF,
|
|
1
|
+
{"version":3,"file":"push-to-figma.js","sourceRoot":"","sources":["../../../../src/mcp/tools/push-to-figma.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAElD,MAAM,CAAC,MAAM,IAAI,GAAG,eAAe,CAAC;AAEpC,MAAM,CAAC,MAAM,WAAW,GACtB,sFAAsF;IACtF,4FAA4F;IAC5F,+FAA+F;IAC/F,qEAAqE,CAAC;AAExE,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,IAAI,EAAE,CAAC,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,kEAAkE,CAAC;IAC7F,IAAI,EAAE,CAAC;SACJ,MAAM,EAAE;SACR,QAAQ,EAAE;SACV,QAAQ,CAAC,+DAA+D,CAAC;IAC5E,SAAS,EAAE,CAAC;SACT,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,SAAS,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;SAC9C,QAAQ,EAAE;SACV,QAAQ,CAAC,gFAAgF,CAAC;IAC7F,QAAQ,EAAE,CAAC;SACR,MAAM,EAAE;SACR,QAAQ,EAAE;SACV,QAAQ,CACP,8EAA8E;QAC9E,8EAA8E,CAC/E;CACJ,CAAC;AAEF,MAAM,aAAa,GAAG;IACpB,OAAO,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE;IACrC,MAAM,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE;IACpC,MAAM,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE;CAC3B,CAAC;AAEX,MAAM,YAAY,GAAG,aAAa,CAAC,OAAO,CAAC;AAE3C,MAAM,UAAU,OAAO,CAAC,GAAe;IACrC,OAAO,KAAK,EAAE,EACZ,IAAI,EACJ,IAAI,EAAE,SAAS,EACf,SAAS,EACT,QAAQ,GAMT,EAAE,EAAE;QACH,MAAM,YAAY,GAAG,SAAS,IAAI,kBAAkB,CAAC;QACrD,MAAM,iBAAiB,GAAG,SAAS,IAAI,CAAC,SAAS,CAAC,CAAC;QACnD,MAAM,UAAU,GAAG,oBAAoB,YAAY,UAAU,CAAC;QAE9D,2CAA2C;QAC3C,IAAI,eAAmC,CAAC;QACxC,IAAI,QAAQ,EAAE,CAAC;YACb,MAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC;YAClD,IAAI,KAAK;gBAAE,eAAe,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;QACxC,CAAC;QACD,MAAM,UAAU,GAAG,eAAe,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,CAAC;QAEhE,8EAA8E;QAC9E,IAAI,UAAkB,CAAC;QACvB,IAAI,CAAC;YACH,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,MAAM,CAAC,IAAI,CAAC,CAAC;YACzC,MAAM,EAAE,GAAG,IAAI,SAAS,CAAC,kBAAkB,YAAY,KAAK,CAAC,CAAC;YAE9D,UAAU,GAAG,MAAM,IAAI,OAAO,CAAS,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;gBACzD,MAAM,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;oBAC9B,EAAE,CAAC,KAAK,EAAE,CAAC;oBACX,MAAM,CAAC,IAAI,KAAK,CAAC,qCAAqC,CAAC,CAAC,CAAC;gBAC3D,CAAC,EAAE,IAAI,CAAC,CAAC;gBAET,EAAE,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,EAAE;oBACjB,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC;gBACtE,CAAC,CAAC,CAAC;gBAEH,EAAE,CAAC,EAAE,CAAC,SAAS,EAAE,CAAC,IAAqB,EAAE,EAAE;oBACzC,IAAI,CAAC;wBACH,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;wBACrC,IAAI,GAAG,CAAC,IAAI,KAAK,KAAK,EAAE,CAAC;4BACvB,YAAY,CAAC,OAAO,CAAC,CAAC;4BACtB,EAAE,CAAC,KAAK,EAAE,CAAC;4BACX,OAAO,CAAC,oCAAoC,CAAC,CAAC;wBAChD,CAAC;6BAAM,IAAI,GAAG,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;4BAChC,YAAY,CAAC,OAAO,CAAC,CAAC;4BACtB,EAAE,CAAC,KAAK,EAAE,CAAC;4BACX,MAAM,CAAC,IAAI,KAAK,CAAC,GAAG,CAAC,OAAO,IAAI,sBAAsB,CAAC,CAAC,CAAC;wBAC3D,CAAC;oBACH,CAAC;oBAAC,MAAM,CAAC;wBACP,4BAA4B;oBAC9B,CAAC;gBACH,CAAC,CAAC,CAAC;gBAEH,EAAE,CAAC,EAAE,CAAC,OAAO,EAAE,CAAC,GAAU,EAAE,EAAE;oBAC5B,YAAY,CAAC,OAAO,CAAC,CAAC;oBACtB,MAAM,CAAC,GAAG,CAAC,CAAC;gBACd,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;QACL,CAAC;QAAC,OAAO,GAAG,EAAE,CAAC;YACb,MAAM,GAAG,GAAG,GAAG,YAAY,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC;YACjE,OAAO;gBACL,OAAO,EAAE;oBACP;wBACE,IAAI,EAAE,MAAe;wBACrB,IAAI,EAAE;4BACJ,qCAAqC,GAAG,EAAE;4BAC1C,EAAE;4BACF,sFAAsF;4BACtF,oFAAoF;yBACrF,CAAC,IAAI,CAAC,IAAI,CAAC;qBACb;iBACF;aACF,CAAC;QACJ,CAAC;QAED,8EAA8E;QAC9E,MAAM,YAAY,GAAG,iBAAiB;aACnC,GAAG,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE;YACb,MAAM,IAAI,GAAG,aAAa,CAAC,EAAgC,CAAC,IAAI,YAAY,CAAC;YAC7E,MAAM,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;YACzD,MAAM,WAAW,GAAG,iBAAiB,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,OAAO,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;YACxE,MAAM,QAAQ,GAAG,CAAC,GAAG,CAAC,CAAC;YACvB,OAAO;gBACL,iBAAiB,OAAO,KAAK,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,MAAM,GAAG;gBACzD,EAAE;gBACF,UAAU,QAAQ,GAAG,CAAC,0CAA0C;gBAChE,eAAe;oBACb,CAAC,CAAC,mDAAmD,eAAe,KAAK;oBACzE,CAAC,CAAC,sBAAsB,UAAU,KAAK;gBACzC,qCAAqC;gBACrC,EAAE;gBACF,UAAU,QAAQ,GAAG,CAAC,mCAAmC;gBACzD,gBAAgB,IAAI,CAAC,KAAK,iBAAiB,IAAI,CAAC,MAAM,IAAI;gBAC1D,EAAE;gBACF,UAAU,QAAQ,GAAG,CAAC,qCAAqC;gBAC3D,eAAe,UAAU,KAAK;gBAC9B,EAAE;gBACF,UAAU,QAAQ,GAAG,CAAC,+CAA+C;gBACrE,eAAe;gBACf,gBAAgB;gBAChB,oDAAoD;gBACpD,uEAAuE;gBACvE,sCAAsC;gBACtC,gDAAgD;gBAChD,kJAAkJ;gBAClJ,MAAM;gBACN,KAAK;gBACL,2DAA2D,QAAQ,GAAG,CAAC,GAAG;gBAC1E,EAAE;gBACF,UAAU,QAAQ,GAAG,CAAC,sBAAsB;gBAC5C,EAAE;gBACF,UAAU,QAAQ,GAAG,CAAC,sGAAsG;gBAC5H,EAAE;aACH,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACf,CAAC,CAAC;aACD,IAAI,CAAC,IAAI,CAAC,CAAC;QAEd,MAAM,QAAQ,GAAG;YACf,uCAAuC;YACvC,EAAE;YACF,GAAG,UAAU,qCAAqC,UAAU,KAAK;YACjE,EAAE;YACF,0IAA0I;YAC1I,EAAE;YACF,kBAAkB;YAClB,EAAE;YACF,qCAAqC;YACrC,oFAAoF;YACpF,6FAA6F;YAC7F,EAAE;YACF,yBAAyB;YACzB,EAAE;YACF,aAAa,iBAAiB,CAAC,MAAM,iBAAiB,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;YACpF,iBAAiB,YAAY,IAAI;YACjC,EAAE;YACF,YAAY;YACZ,UAAU;YACV,EAAE;YACF,kEAAkE;YAClE,0EAA0E;YAC1E,oGAAoG;YACpG,8DAA8D;SAC/D,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAEb,OAAO;YACL,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,MAAe,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;SACrD,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"server.d.ts","sourceRoot":"","sources":["../../../src/preview/server.ts"],"names":[],"mappings":"AA8BA,MAAM,WAAW,aAAa;IAC5B,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACtD,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;
|
|
1
|
+
{"version":3,"file":"server.d.ts","sourceRoot":"","sources":["../../../src/preview/server.ts"],"names":[],"mappings":"AA8BA,MAAM,WAAW,aAAa;IAC5B,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACtD,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAgDD;;;;;GAKG;AACH,wBAAgB,kBAAkB,CAChC,IAAI,GAAE,MAAqB,EAC3B,OAAO,GAAE;IAAE,WAAW,CAAC,EAAE,OAAO,CAAA;CAAO,GACtC,OAAO,CAAC,aAAa,CAAC,CAyExB"}
|
|
@@ -21,22 +21,15 @@ function resolveHtmlPath() {
|
|
|
21
21
|
}
|
|
22
22
|
throw new Error(`Could not find preview index.html. Searched:\n${candidates.join("\n")}`);
|
|
23
23
|
}
|
|
24
|
-
const VIEWPORT_WIDTHS = {
|
|
25
|
-
desktop: 1280,
|
|
26
|
-
tablet: 768,
|
|
27
|
-
mobile: 375,
|
|
28
|
-
};
|
|
29
24
|
/**
|
|
30
25
|
* Build a standalone HTML page for Figma capture (no chrome/iframe).
|
|
31
|
-
*
|
|
26
|
+
* Viewport sizing is handled by Playwright's browser_resize — this page
|
|
27
|
+
* always renders full-width so Tailwind media queries respond correctly.
|
|
32
28
|
*/
|
|
33
|
-
function buildCaptureHtml(compiledJs
|
|
29
|
+
function buildCaptureHtml(compiledJs) {
|
|
34
30
|
const escapedJs = JSON.stringify(compiledJs)
|
|
35
31
|
.replace(/</g, "\\u003c")
|
|
36
32
|
.replace(/>/g, "\\u003e");
|
|
37
|
-
const containerStyle = viewportWidth
|
|
38
|
-
? `max-width: ${viewportWidth}px; margin: 0 auto; overflow: hidden;`
|
|
39
|
-
: "";
|
|
40
33
|
return [
|
|
41
34
|
"<!DOCTYPE html>",
|
|
42
35
|
"<html><head>",
|
|
@@ -48,9 +41,7 @@ function buildCaptureHtml(compiledJs, viewportWidth) {
|
|
|
48
41
|
'<script src="https://cdn.tailwindcss.com"></script>',
|
|
49
42
|
"<style>body { margin: 0; }</style>",
|
|
50
43
|
"</head><body>",
|
|
51
|
-
|
|
52
|
-
? '<div id="root" style="' + containerStyle + '"></div>'
|
|
53
|
-
: '<div id="root"></div>',
|
|
44
|
+
'<div id="root"></div>',
|
|
54
45
|
"<script>",
|
|
55
46
|
"try {",
|
|
56
47
|
" var exports = {};",
|
|
@@ -109,9 +100,7 @@ export function startPreviewServer(port = PREVIEW_PORT, options = {}) {
|
|
|
109
100
|
"Content-Type": "text/html; charset=utf-8",
|
|
110
101
|
"Cache-Control": "no-cache",
|
|
111
102
|
});
|
|
112
|
-
|
|
113
|
-
const viewportWidth = VIEWPORT_WIDTHS[viewport];
|
|
114
|
-
res.end(buildCaptureHtml(last.compiledJs, viewportWidth));
|
|
103
|
+
res.end(buildCaptureHtml(last.compiledJs));
|
|
115
104
|
return;
|
|
116
105
|
}
|
|
117
106
|
res.writeHead(404, { "Content-Type": "text/plain" });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"server.js","sourceRoot":"","sources":["../../../src/preview/server.ts"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,EAAE,MAAM,SAAS,CAAC;AACzB,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AACzC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;AAE/D,sFAAsF;AACtF,SAAS,eAAe;IACtB,yEAAyE;IACzE,gEAAgE;IAChE,MAAM,UAAU,GAAG;QACjB,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,QAAQ,EAAE,YAAY,CAAC;QAC5C,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,YAAY,CAAC;KACrE,CAAC;IAEF,KAAK,MAAM,SAAS,IAAI,UAAU,EAAE,CAAC;QACnC,IAAI,EAAE,CAAC,UAAU,CAAC,SAAS,CAAC,EAAE,CAAC;YAC7B,OAAO,SAAS,CAAC;QACnB,CAAC;IACH,CAAC;IAED,MAAM,IAAI,KAAK,CACb,iDAAiD,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CACzE,CAAC;AACJ,CAAC;AAQD
|
|
1
|
+
{"version":3,"file":"server.js","sourceRoot":"","sources":["../../../src/preview/server.ts"],"names":[],"mappings":"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"}
|