mirror of
https://github.com/heygen-com/hyperframes.git
synced 2026-09-01 19:42:03 +00:00
fix(studio): format inserted block HTML with proper indentation
insertTimelineAssetIntoSource now detects the parent indent level and adds the new element with matching child indentation. Block attributes are written one-per-line for readability.
This commit is contained in:
@@ -150,15 +150,18 @@ export async function addBlockToProject(
|
||||
const left = visualPosition ? Math.round(visualPosition.left) : 0;
|
||||
const top = visualPosition ? Math.round(visualPosition.top) : 0;
|
||||
|
||||
const subCompHtml =
|
||||
`<div data-composition-id="${compId}" ` +
|
||||
`data-composition-src="${compositionFile}" ` +
|
||||
`data-start="${formatTimelineAttributeNumber(start)}" ` +
|
||||
`data-duration="${formatTimelineAttributeNumber(duration)}" ` +
|
||||
`data-track-index="${track}" ` +
|
||||
`data-width="${width}" data-height="${height}" ` +
|
||||
`style="position: absolute; left: ${left}px; top: ${top}px; width: ${width}px; height: ${height}px; z-index: ${zIndex}">` +
|
||||
`</div>`;
|
||||
const subCompHtml = [
|
||||
`<div`,
|
||||
` data-composition-id="${compId}"`,
|
||||
` data-composition-src="${compositionFile}"`,
|
||||
` data-start="${formatTimelineAttributeNumber(start)}"`,
|
||||
` data-duration="${formatTimelineAttributeNumber(duration)}"`,
|
||||
` data-track-index="${track}"`,
|
||||
` data-width="${width}"`,
|
||||
` data-height="${height}"`,
|
||||
` style="position: absolute; left: ${left}px; top: ${top}px; width: ${width}px; height: ${height}px; z-index: ${zIndex}"`,
|
||||
`></div>`,
|
||||
].join("\n");
|
||||
|
||||
const patchedContent = insertTimelineAssetIntoSource(originalContent, subCompHtml);
|
||||
|
||||
|
||||
@@ -126,5 +126,12 @@ export function insertTimelineAssetIntoSource(source: string, assetHtml: string)
|
||||
throw new Error("No composition root found in target source");
|
||||
}
|
||||
const insertAt = match.index + match[0].length;
|
||||
return `${source.slice(0, insertAt)}${assetHtml}${source.slice(insertAt)}`;
|
||||
const lineStart = source.lastIndexOf("\n", match.index);
|
||||
const leadingWhitespace = source.slice(lineStart + 1, match.index).match(/^(\s*)/)?.[1] ?? "";
|
||||
const childIndent = leadingWhitespace + " ";
|
||||
const indented = assetHtml
|
||||
.split("\n")
|
||||
.map((line, i) => (i === 0 ? line : childIndent + line))
|
||||
.join("\n");
|
||||
return `${source.slice(0, insertAt)}\n${childIndent}${indented}${source.slice(insertAt)}`;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user