@hyperframes/parsers 0.8.156 → 0.8.158

package/dist/hfIds.d.ts

@@ -23,5 +23,8 @@ declare function isCompositionTemplate(el: Element): boolean;
 declare function walkCompositionDescendants(root: Document | Element, visit: (el: Element) => void): void;
 
 declare function ensureHfIds(html: string): string;
+/** ensureHfIds for a file someone edits: the same ids, inserted into the source text so nothing else in it changes.
+ * Markup whose tags the parser did not keep one-to-one falls back to ensureHfIds. */
+declare function stampHfIdsInPlace(html: string): string;
 
-export { EXCLUDED_TAGS, ensureHfIds, isCompositionTemplate, mintHfId, walkCompositionDescendants };
+export { EXCLUDED_TAGS, ensureHfIds, isCompositionTemplate, mintHfId, stampHfIdsInPlace, walkCompositionDescendants };

package/dist/hfIds.js

@@ -96,18 +96,150 @@ function assignHfIds(body) {
 
 // src/hfIds.ts
 function ensureHfIds(html) {
+  const { document, wrapped } = parseFragmentOrDocument(html);
+  if (!document.body) return html;
+  assignHfIds(document.body);
+  return wrapped ? document.body.innerHTML || "" : document.toString();
+}
+function parseFragmentOrDocument(html) {
   const wrapped = !/^(?:<!doctype|<html[\s>/])/i.test(
     html.replace(/^(?:\s|<!--(?:>|->|[\s\S]*?-->))*/, "")
   );
   const { document } = wrapped ? parseHTML(`<!DOCTYPE html><html><head></head><body>${html}</body></html>`) : parseHTML(html);
+  return { document, wrapped };
+}
+function stampHfIdsInPlace(html) {
+  const { document, wrapped } = parseFragmentOrDocument(html);
   if (!document.body) return html;
+  const elements = wrapped ? getChildElements(document.body).flatMap(inDocumentOrder) : inDocumentOrder(document.documentElement);
+  const existing = elements.map((el) => el.getAttribute("data-hf-id"));
+  const pinned = existing.map((id) => id !== null && id.length > 0);
   assignHfIds(document.body);
-  return wrapped ? document.body.innerHTML || "" : document.toString();
+  const minted = elements.map((el, n) => pinned[n] ? null : el.getAttribute("data-hf-id"));
+  const tags = startTags(html);
+  const inserts = tags && alignInserts(html, tags, elements, minted, existing);
+  return inserts ? spliceIds(html, inserts) : ensureHfIds(html);
+}
+function inDocumentOrder(el) {
+  return [el, ...getChildElements(el).flatMap(inDocumentOrder)];
+}
+var RAW_TEXT = /* @__PURE__ */ new Set(["script", "style", "textarea", "title", "xmp", "noembed", "noframes"]);
+var IMPLIED = /* @__PURE__ */ new Set(["html", "head", "body", "tbody"]);
+function startTags(html) {
+  const lower = html.toLowerCase();
+  const tags = [];
+  let i = html.indexOf("<");
+  while (i >= 0) {
+    const name = html.startsWith("<!--", i) ? null : /^<([a-zA-Z][^\s/>]*)/.exec(html.slice(i, i + 128));
+    if (!name) {
+      i = nextTagAfter(html, i);
+      continue;
+    }
+    const end = closingBracket(html, i + name[0].length);
+    if (end < 0) return null;
+    const tag = name[1].toLowerCase();
+    tags.push({ name: tag, nameEnd: i + name[0].length, bracket: end });
+    const after = RAW_TEXT.has(tag) ? rawTextEnd(lower, tag, end) : end;
+    i = after < 0 ? -1 : html.indexOf("<", after + 1);
+  }
+  return tags;
+}
+function rawTextEnd(lower, tag, from) {
+  const marker = `</${tag}`;
+  for (let at = lower.indexOf(marker, from); at >= 0; at = lower.indexOf(marker, at + marker.length)) {
+    const next = lower[at + marker.length];
+    if (next !== void 0 && /[\s/>]/.test(next)) return at;
+  }
+  return -1;
+}
+function nextTagAfter(html, lt) {
+  const comment = html.startsWith("<!--", lt);
+  const end = comment ? html.indexOf("-->", lt + 4) : html.indexOf(">", lt);
+  return end < 0 ? -1 : html.indexOf("<", end + 1);
+}
+function closingBracket(html, from) {
+  let quote = "";
+  for (let i = from; i < html.length; i++) {
+    const c = html[i];
+    if (quote) quote = c === quote ? "" : quote;
+    else if (c === '"' || c === "'") quote = c;
+    else if (c === ">") return i;
+  }
+  return -1;
+}
+function alignInserts(html, tags, elements, minted, existing) {
+  const walked = walkAlign(html, tags, elements, minted, existing);
+  if (!walked) return null;
+  return walked.next === tags.length ? walked.inserts : null;
+}
+function walkAlign(html, tags, elements, minted, existing) {
+  const state = { inserts: [], next: 0 };
+  for (const [n, el] of elements.entries()) {
+    if (!take(state, html, tags, el, minted[n] ?? null, existing[n] === "")) return null;
+  }
+  return state;
+}
+function take(state, html, tags, el, id, fillEmpty) {
+  const step = alignOne(html, tags[state.next], el, id, fillEmpty);
+  if (!step) return false;
+  if (step.insert) state.inserts.push(step.insert);
+  if (step.next) state.next += 1;
+  return true;
+}
+function alignOne(html, tag, el, id, fillEmpty) {
+  if (tag?.name === el.tagName.toLowerCase()) return matched(html, tag, id, fillEmpty);
+  if (IMPLIED.has(el.tagName.toLowerCase()) && !id) return { insert: null, next: false };
+  return null;
+}
+function matched(html, tag, id, fillEmpty) {
+  if (!id) return { insert: null, next: true };
+  const placed = placeId(html, tag, id, fillEmpty);
+  if (!placed) return null;
+  return { insert: placed, next: true };
+}
+function placeId(html, tag, id, fillEmpty) {
+  if (!fillEmpty) return { at: tag.nameEnd, text: ` data-hf-id="${id}"` };
+  const emptyAt = emptyHfIdValue(html, tag);
+  if (emptyAt === null) return null;
+  return { at: emptyAt, text: id };
+}
+function emptyHfIdValue(html, tag) {
+  const open = outsideQuotes(html.slice(tag.nameEnd, tag.bracket));
+  const match = /\sdata-hf-id\s*=\s*(["'])\1/i.exec(open);
+  if (!match) return null;
+  return tag.nameEnd + match.index + match[0].length - 1;
+}
+function outsideQuotes(open) {
+  let quote = "";
+  let out = "";
+  for (const c of open) {
+    out += quotedChar(quote, c);
+    quote = quoteOf(quote, c);
+  }
+  return out;
+}
+function quoteOf(quote, c) {
+  if (quote) return c === quote ? "" : quote;
+  return c === '"' || c === "'" ? c : "";
+}
+function quotedChar(quote, c) {
+  if (!quote || c === quote) return c;
+  return " ".repeat(c.length);
+}
+function spliceIds(html, inserts) {
+  let out = "";
+  let from = 0;
+  for (const { at, text } of inserts) {
+    out += html.slice(from, at) + text;
+    from = at;
+  }
+  return out + html.slice(from);
 }
 export {
   EXCLUDED_TAGS,
   ensureHfIds,
   isCompositionTemplate,
   mintHfId,
+  stampHfIdsInPlace,
   walkCompositionDescendants
 };

package/dist/index.d.ts

@@ -5,7 +5,7 @@ export { isStudioHoldSet } from './gsapParser.js';
 export { getObjectArrayKeyframeTiming } from './gsapParserExports.js';
 export { SPRING_PRESETS, SpringPreset, generateSpringEaseData } from './springEase.js';
 export { parseGsapScriptAcorn as parseGsapScript } from './gsapParserAcorn.js';
-export { EXCLUDED_TAGS, ensureHfIds, isCompositionTemplate, mintHfId, walkCompositionDescendants } from './hfIds.js';
+export { EXCLUDED_TAGS, ensureHfIds, isCompositionTemplate, mintHfId, stampHfIdsInPlace, walkCompositionDescendants } from './hfIds.js';
 export { ParsableDocumentLike, SubCompositionValidity, SubCompositionValidityReason, checkSubCompositionUsability, resolveSubCompositionContent } from './subCompositionValidity.js';
 export { CANONICAL_AUTHORED_TIMING_ATTRIBUTES, COMPOSITION_ATTRIBUTES, COMPOSITION_CONTRACT_VERSION, ClipAttributeReader, ClipAttributeWriter, ClipTiming, ClipTimingDiagnostic, ClipTimingDiagnosticCode, ClipTimingUpdate, ClipTimingWriteError, DERIVED_TIMING_ATTRIBUTES, LEGACY_TIMING_ATTRIBUTES, ReadClipTimingOptions, ReferenceExpression, parseNumeric, parseStartExpression, readClipTiming, writeClipTiming } from './compositionContract.js';
 export { CANONICAL_FONT_DISPLAY_NAMES, FONT_ALIAS_KEYS, FONT_ALIAS_MAP, HTML_BODY_CSS_HEIGHT_FIRST_RE, HTML_BODY_CSS_WIDTH_FIRST_RE, MediaSrcMutation, VIEWPORT_META_SIZE_RE, VariableUsageScan, extractMediaSrcMutations, parseCompositionVariables, resolveAliasDisplayName, scanVariableUsage } from './composition.js';

package/dist/index.js

@@ -2471,13 +2471,144 @@ function assignHfIds(body) {
 
 // src/hfIds.ts
 function ensureHfIds(html) {
+  const { document, wrapped } = parseFragmentOrDocument(html);
+  if (!document.body) return html;
+  assignHfIds(document.body);
+  return wrapped ? document.body.innerHTML || "" : document.toString();
+}
+function parseFragmentOrDocument(html) {
   const wrapped = !/^(?:<!doctype|<html[\s>/])/i.test(
     html.replace(/^(?:\s|<!--(?:>|->|[\s\S]*?-->))*/, "")
   );
   const { document } = wrapped ? parseHTML(`<!DOCTYPE html><html><head></head><body>${html}</body></html>`) : parseHTML(html);
+  return { document, wrapped };
+}
+function stampHfIdsInPlace(html) {
+  const { document, wrapped } = parseFragmentOrDocument(html);
   if (!document.body) return html;
+  const elements = wrapped ? getChildElements(document.body).flatMap(inDocumentOrder) : inDocumentOrder(document.documentElement);
+  const existing = elements.map((el) => el.getAttribute("data-hf-id"));
+  const pinned = existing.map((id) => id !== null && id.length > 0);
   assignHfIds(document.body);
-  return wrapped ? document.body.innerHTML || "" : document.toString();
+  const minted = elements.map((el, n) => pinned[n] ? null : el.getAttribute("data-hf-id"));
+  const tags = startTags(html);
+  const inserts = tags && alignInserts(html, tags, elements, minted, existing);
+  return inserts ? spliceIds(html, inserts) : ensureHfIds(html);
+}
+function inDocumentOrder(el) {
+  return [el, ...getChildElements(el).flatMap(inDocumentOrder)];
+}
+var RAW_TEXT = /* @__PURE__ */ new Set(["script", "style", "textarea", "title", "xmp", "noembed", "noframes"]);
+var IMPLIED = /* @__PURE__ */ new Set(["html", "head", "body", "tbody"]);
+function startTags(html) {
+  const lower = html.toLowerCase();
+  const tags = [];
+  let i = html.indexOf("<");
+  while (i >= 0) {
+    const name = html.startsWith("<!--", i) ? null : /^<([a-zA-Z][^\s/>]*)/.exec(html.slice(i, i + 128));
+    if (!name) {
+      i = nextTagAfter(html, i);
+      continue;
+    }
+    const end = closingBracket(html, i + name[0].length);
+    if (end < 0) return null;
+    const tag = name[1].toLowerCase();
+    tags.push({ name: tag, nameEnd: i + name[0].length, bracket: end });
+    const after = RAW_TEXT.has(tag) ? rawTextEnd(lower, tag, end) : end;
+    i = after < 0 ? -1 : html.indexOf("<", after + 1);
+  }
+  return tags;
+}
+function rawTextEnd(lower, tag, from) {
+  const marker = `</${tag}`;
+  for (let at = lower.indexOf(marker, from); at >= 0; at = lower.indexOf(marker, at + marker.length)) {
+    const next = lower[at + marker.length];
+    if (next !== void 0 && /[\s/>]/.test(next)) return at;
+  }
+  return -1;
+}
+function nextTagAfter(html, lt) {
+  const comment = html.startsWith("<!--", lt);
+  const end = comment ? html.indexOf("-->", lt + 4) : html.indexOf(">", lt);
+  return end < 0 ? -1 : html.indexOf("<", end + 1);
+}
+function closingBracket(html, from) {
+  let quote = "";
+  for (let i = from; i < html.length; i++) {
+    const c = html[i];
+    if (quote) quote = c === quote ? "" : quote;
+    else if (c === '"' || c === "'") quote = c;
+    else if (c === ">") return i;
+  }
+  return -1;
+}
+function alignInserts(html, tags, elements, minted, existing) {
+  const walked = walkAlign(html, tags, elements, minted, existing);
+  if (!walked) return null;
+  return walked.next === tags.length ? walked.inserts : null;
+}
+function walkAlign(html, tags, elements, minted, existing) {
+  const state = { inserts: [], next: 0 };
+  for (const [n, el] of elements.entries()) {
+    if (!take(state, html, tags, el, minted[n] ?? null, existing[n] === "")) return null;
+  }
+  return state;
+}
+function take(state, html, tags, el, id, fillEmpty) {
+  const step = alignOne(html, tags[state.next], el, id, fillEmpty);
+  if (!step) return false;
+  if (step.insert) state.inserts.push(step.insert);
+  if (step.next) state.next += 1;
+  return true;
+}
+function alignOne(html, tag, el, id, fillEmpty) {
+  if (tag?.name === el.tagName.toLowerCase()) return matched(html, tag, id, fillEmpty);
+  if (IMPLIED.has(el.tagName.toLowerCase()) && !id) return { insert: null, next: false };
+  return null;
+}
+function matched(html, tag, id, fillEmpty) {
+  if (!id) return { insert: null, next: true };
+  const placed = placeId(html, tag, id, fillEmpty);
+  if (!placed) return null;
+  return { insert: placed, next: true };
+}
+function placeId(html, tag, id, fillEmpty) {
+  if (!fillEmpty) return { at: tag.nameEnd, text: ` data-hf-id="${id}"` };
+  const emptyAt = emptyHfIdValue(html, tag);
+  if (emptyAt === null) return null;
+  return { at: emptyAt, text: id };
+}
+function emptyHfIdValue(html, tag) {
+  const open = outsideQuotes(html.slice(tag.nameEnd, tag.bracket));
+  const match = /\sdata-hf-id\s*=\s*(["'])\1/i.exec(open);
+  if (!match) return null;
+  return tag.nameEnd + match.index + match[0].length - 1;
+}
+function outsideQuotes(open) {
+  let quote = "";
+  let out = "";
+  for (const c of open) {
+    out += quotedChar(quote, c);
+    quote = quoteOf(quote, c);
+  }
+  return out;
+}
+function quoteOf(quote, c) {
+  if (quote) return c === quote ? "" : quote;
+  return c === '"' || c === "'" ? c : "";
+}
+function quotedChar(quote, c) {
+  if (!quote || c === quote) return c;
+  return " ".repeat(c.length);
+}
+function spliceIds(html, inserts) {
+  let out = "";
+  let from = 0;
+  for (const { at, text } of inserts) {
+    out += html.slice(from, at) + text;
+    from = at;
+  }
+  return out + html.slice(from);
 }
 
 // src/utils/cssSelector.ts
@@ -4501,6 +4632,7 @@ export {
   scanHtmlOpeningTags,
   scanVariableUsage,
   serializeGsapAnimations,
+  stampHfIdsInPlace,
   suggestMatchingPreset,
   timingMismatches,
   topLevelElements,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hyperframes/parsers",
-  "version": "0.8.156",
+  "version": "0.8.158",
   "repository": {
     "type": "git",
     "url": "https://github.com/heygen-com/hyperframes",
@@ -119,7 +119,7 @@
     "tsx": "^4.21.0",
     "typescript": "^5.0.0",
     "vitest": "^4.1.11",
-    "@hyperframes/core": "0.8.156"
+    "@hyperframes/core": "0.8.158"
   },
   "scripts": {
     "build": "tsup",