diff --git a/src/components/PopiaiEmbedBridge.tsx b/src/components/PopiaiEmbedBridge.tsx index 51be11d1..e163fa0a 100644 --- a/src/components/PopiaiEmbedBridge.tsx +++ b/src/components/PopiaiEmbedBridge.tsx @@ -15,7 +15,8 @@ type BridgeRequest = | "popitv:apply-edit-operations" | "popitv:run-workflow" | "popitv:run-selected" - | "popitv:stop-workflow"; + | "popitv:stop-workflow" + | "popitv:measure-nodes"; interface BridgeMessage { source?: string; @@ -25,6 +26,41 @@ interface BridgeMessage { operations?: EditOperation[]; } +interface NodeDimensions { + id: string; + width: number; + height: number; +} + +function measureNodes(nodeIds: string[]): NodeDimensions[] { + const state = useWorkflowStore.getState(); + const measurements: NodeDimensions[] = []; + + for (const nodeId of nodeIds) { + const node = state.nodes.find(n => n.id === nodeId); + if (node?.measured) { + measurements.push({ + id: nodeId, + width: node.measured.width ?? 0, + height: node.measured.height ?? 0, + }); + } else { + // 如果 measured 不存在,尝试从 DOM 获取 + const nodeElement = document.querySelector(`[data-id="${nodeId}"]`); + if (nodeElement) { + const rect = nodeElement.getBoundingClientRect(); + measurements.push({ + id: nodeId, + width: rect.width, + height: rect.height, + }); + } + } + } + + return measurements; +} + function isSafeParentOrigin(origin: string | null): origin is string { if (!origin) return false; return origin === "file://" || /^https?:\/\/(localhost|127\.0\.0\.1|\[::1\])(:\d+)?$/.test(origin); @@ -258,6 +294,14 @@ export function PopiaiEmbedBridge() { ); }); postSnapshot(requestId); + return; + } + + if (event.data.type === "popitv:measure-nodes") { + const nodeIds = event.data.nodeIds ?? []; + const measurements = measureNodes(nodeIds); + postToParent("popitv:node-dimensions", { measurements }, requestId); + return; } }; diff --git a/src/lib/chat/editOperations.ts b/src/lib/chat/editOperations.ts index 601b7dd1..27b4635b 100644 --- a/src/lib/chat/editOperations.ts +++ b/src/lib/chat/editOperations.ts @@ -101,7 +101,7 @@ export function applyEditOperations( type: operation.nodeType, position, data: nodeData, - measured: dimensions, + style: { width: dimensions.width, height: dimensions.height }, }; nodes.push(newNode);