@unhead/vue 0.6.6 → 0.6.8

package/dist/index.cjs

@@ -3,6 +3,222 @@
 const hookable = require('hookable');
 const vue = require('vue');
 
+const TagsWithInnerContent = ["script", "style", "noscript"];
+const HasElementTags$1 = [
+  "base",
+  "meta",
+  "link",
+  "style",
+  "script",
+  "noscript"
+];
+
+const UniqueTags$1 = ["base", "title", "titleTemplate", "bodyAttrs", "htmlAttrs"];
+const ArrayMetaProperties$1 = [
+  "og:image",
+  "og:video",
+  "og:audio",
+  "og:locale:alternate",
+  "video:actor",
+  "video:director",
+  "video:writer",
+  "video:tag",
+  "article:author",
+  "article:tag",
+  "book:tag",
+  "book:author",
+  "music:album",
+  "music:musician"
+];
+function tagDedupeKey$1(tag) {
+  const { props, tag: tagName } = tag;
+  if (UniqueTags$1.includes(tagName))
+    return tagName;
+  if (tagName === "link" && props.rel === "canonical")
+    return "canonical";
+  if (props.charset)
+    return "charset";
+  const name = ["id"];
+  if (tagName === "meta")
+    name.push(...["name", "property", "http-equiv"]);
+  for (const n of name) {
+    if (typeof props[n] !== "undefined") {
+      const val = String(props[n]);
+      if (ArrayMetaProperties$1.findIndex((p) => val.startsWith(p)) !== -1)
+        return false;
+      return `${tagName}:${n}:${val}`;
+    }
+  }
+  return false;
+}
+
+const setAttrs = (ctx, markSideEffect) => {
+  const { tag, $el } = ctx;
+  if (!$el)
+    return;
+  Object.entries(tag.props).forEach(([k, value]) => {
+    value = String(value);
+    const attrSdeKey = `attr:${k}`;
+    if (k === "class") {
+      for (const c of value.split(" ")) {
+        const classSdeKey = `${attrSdeKey}:${c}`;
+        if (markSideEffect)
+          markSideEffect(ctx, classSdeKey, () => $el.classList.remove(c));
+        if (!$el.classList.contains(c))
+          $el.classList.add(c);
+      }
+      return;
+    }
+    if (markSideEffect && !k.startsWith("data-h-"))
+      markSideEffect(ctx, attrSdeKey, () => $el.removeAttribute(k));
+    if ($el.getAttribute(k) !== value)
+      $el.setAttribute(k, value);
+  });
+  if (TagsWithInnerContent.includes(tag.tag) && $el.innerHTML !== (tag.children || ""))
+    $el.innerHTML = tag.children || "";
+};
+
+function hashCode(s) {
+  let h = 9;
+  for (let i = 0; i < s.length; )
+    h = Math.imul(h ^ s.charCodeAt(i++), 9 ** 9);
+  return ((h ^ h >>> 9) + 65536).toString(16).substring(1, 8).toLowerCase();
+}
+
+async function renderDOMHead(head, options = {}) {
+  const ctx = { shouldRender: true };
+  await head.hooks.callHook("dom:beforeRender", ctx);
+  if (!ctx.shouldRender)
+    return;
+  const dom = options.document || window.document;
+  const staleSideEffects = head._popSideEffectQueue();
+  head.headEntries().map((entry) => entry._sde).forEach((sde) => {
+    Object.entries(sde).forEach(([key, fn]) => {
+      staleSideEffects[key] = fn;
+    });
+  });
+  const preRenderTag = async (tag) => {
+    const entry = head.headEntries().find((e) => e._i === tag._e);
+    const renderCtx = {
+      renderId: tag._d || hashCode(JSON.stringify({ ...tag, _e: void 0, _p: void 0 })),
+      $el: null,
+      shouldRender: true,
+      tag,
+      entry,
+      staleSideEffects
+    };
+    await head.hooks.callHook("dom:beforeRenderTag", renderCtx);
+    return renderCtx;
+  };
+  const renders = [];
+  const pendingRenders = {
+    body: [],
+    head: []
+  };
+  const markSideEffect = (ctx2, key, fn) => {
+    key = `${ctx2.renderId}:${key}`;
+    if (ctx2.entry)
+      ctx2.entry._sde[key] = fn;
+    delete staleSideEffects[key];
+  };
+  const markEl = (ctx2) => {
+    head._elMap[ctx2.renderId] = ctx2.$el;
+    renders.push(ctx2);
+    markSideEffect(ctx2, "el", () => {
+      ctx2.$el?.remove();
+      delete head._elMap[ctx2.renderId];
+    });
+  };
+  for (const t of await head.resolveTags()) {
+    const ctx2 = await preRenderTag(t);
+    if (!ctx2.shouldRender)
+      continue;
+    const { tag } = ctx2;
+    if (tag.tag === "title") {
+      dom.title = tag.children || "";
+      renders.push(ctx2);
+      continue;
+    }
+    if (tag.tag === "htmlAttrs" || tag.tag === "bodyAttrs") {
+      ctx2.$el = dom[tag.tag === "htmlAttrs" ? "documentElement" : "body"];
+      setAttrs(ctx2, markSideEffect);
+      renders.push(ctx2);
+      continue;
+    }
+    ctx2.$el = head._elMap[ctx2.renderId];
+    if (!ctx2.$el && tag._hash) {
+      ctx2.$el = dom.querySelector(`${tag.tagPosition?.startsWith("body") ? "body" : "head"} > ${tag.tag}[data-h-${tag._hash}]`);
+    }
+    if (ctx2.$el) {
+      if (ctx2.tag._d)
+        setAttrs(ctx2);
+      markEl(ctx2);
+      continue;
+    }
+    ctx2.$el = dom.createElement(tag.tag);
+    setAttrs(ctx2);
+    pendingRenders[tag.tagPosition?.startsWith("body") ? "body" : "head"].push(ctx2);
+  }
+  Object.entries(pendingRenders).forEach(([pos, queue]) => {
+    if (!queue.length)
+      return;
+    for (const $el of [...dom[pos].children].reverse()) {
+      const elTag = $el.tagName.toLowerCase();
+      if (!HasElementTags$1.includes(elTag))
+        continue;
+      const dedupeKey = tagDedupeKey$1({
+        tag: elTag,
+        props: $el.getAttributeNames().reduce((props, name) => ({ ...props, [name]: $el.getAttribute(name) }), {})
+      });
+      const matchIdx = queue.findIndex((ctx2) => ctx2 && (ctx2.tag._d === dedupeKey || $el.isEqualNode(ctx2.$el)));
+      if (matchIdx !== -1) {
+        const ctx2 = queue[matchIdx];
+        ctx2.$el = $el;
+        setAttrs(ctx2);
+        markEl(ctx2);
+        delete queue[matchIdx];
+      }
+    }
+    queue.forEach((ctx2) => {
+      if (!ctx2.$el)
+        return;
+      switch (ctx2.tag.tagPosition) {
+        case "bodyClose":
+          dom.body.appendChild(ctx2.$el);
+          break;
+        case "bodyOpen":
+          dom.body.insertBefore(ctx2.$el, dom.body.firstChild);
+          break;
+        case "head":
+        default:
+          dom.head.appendChild(ctx2.$el);
+          break;
+      }
+      markEl(ctx2);
+    });
+  });
+  for (const ctx2 of renders)
+    await head.hooks.callHook("dom:renderTag", ctx2);
+  Object.values(staleSideEffects).forEach((fn) => fn());
+}
+let domUpdatePromise = null;
+async function debouncedRenderDOMHead(head, options = {}) {
+  function doDomUpdate() {
+    domUpdatePromise = null;
+    return renderDOMHead(head, options);
+  }
+  const delayFn = options.delayFn || ((fn) => setTimeout(fn, 10));
+  return domUpdatePromise = domUpdatePromise || new Promise((resolve) => delayFn(() => resolve(doDomUpdate())));
+}
+
+const index = {
+  __proto__: null,
+  debouncedRenderDOMHead: debouncedRenderDOMHead,
+  get domUpdatePromise () { return domUpdatePromise; },
+  hashCode: hashCode,
+  renderDOMHead: renderDOMHead
+};
+
 const ValidHeadTags = [
   "title",
   "titleTemplate",
@@ -295,7 +511,7 @@ const PatchDomOnEntryUpdatesPlugin = (options) => {
         let delayFn = options?.delayFn;
         if (!delayFn && typeof requestAnimationFrame !== "undefined")
           delayFn = requestAnimationFrame;
-        import('./chunks/index.cjs').then(({ debouncedRenderDOMHead }) => {
+        Promise.resolve().then(function () { return index; }).then(({ debouncedRenderDOMHead }) => {
           debouncedRenderDOMHead(head, { document: options?.document || window.document, delayFn });
         });
       }
@@ -345,7 +561,7 @@ const EventHandlersPlugin = () => {
           const sdeKey = `${ctx.tag._d || ctx.tag._p}:${k}`;
           const eventName = k.slice(2).toLowerCase();
           const eventDedupeKey = `data-h-${eventName}`;
-          delete ctx.queuedSideEffects[sdeKey];
+          delete ctx.staleSideEffects[sdeKey];
           if ($el.hasAttribute(eventDedupeKey))
             return;
           const handler = value;
@@ -369,12 +585,6 @@ const EventHandlersPlugin = () => {
 function asArray$1(value) {
   return Array.isArray(value) ? value : [value];
 }
-function hashCode(s) {
-  let h = 9;
-  for (let i = 0; i < s.length; )
-    h = Math.imul(h ^ s.charCodeAt(i++), 9 ** 9);
-  return ((h ^ h >>> 9) + 65536).toString(16).substring(1, 8).toLowerCase();
-}
 const HasElementTags = [
   "base",
   "meta",
@@ -431,7 +641,7 @@ function createHeadCore(options = {}) {
     ...options?.plugins || []
   ];
   options.plugins.forEach((p) => p.hooks && hooks.addHooks(p.hooks));
-  const triggerUpdateHook = () => hooks.callHook("entries:updated", head);
+  const updated = () => hooks.callHook("entries:updated", head);
   const head = {
     resolvedOptions: options,
     headEntries() {
@@ -449,27 +659,23 @@ function createHeadCore(options = {}) {
       if (options2?.mode)
         activeEntry._m = options2?.mode;
       entries.push(activeEntry);
-      triggerUpdateHook();
-      const queueSideEffects = (e) => {
-        _sde = { ..._sde, ...e._sde || {} };
-        e._sde = {};
-        triggerUpdateHook();
-      };
+      updated();
       return {
         dispose() {
           entries = entries.filter((e) => {
             if (e._i !== activeEntry._i)
               return true;
-            queueSideEffects(e);
+            _sde = { ..._sde, ...e._sde || {} };
+            e._sde = {};
+            updated();
             return false;
           });
         },
         patch(input2) {
           entries = entries.map((e) => {
             if (e._i === activeEntry._i) {
-              queueSideEffects(e);
               activeEntry.input = e.input = input2;
-              activeEntry._i = e._i = _eid++;
+              updated();
             }
             return e;
           });

package/dist/index.mjs

@@ -1,6 +1,222 @@
 import { createHooks } from 'hookable';
 import { unref, isRef, version, getCurrentInstance, inject, nextTick, ref, watchEffect, watch, onBeforeUnmount } from 'vue';
 
+const TagsWithInnerContent = ["script", "style", "noscript"];
+const HasElementTags$1 = [
+  "base",
+  "meta",
+  "link",
+  "style",
+  "script",
+  "noscript"
+];
+
+const UniqueTags$1 = ["base", "title", "titleTemplate", "bodyAttrs", "htmlAttrs"];
+const ArrayMetaProperties$1 = [
+  "og:image",
+  "og:video",
+  "og:audio",
+  "og:locale:alternate",
+  "video:actor",
+  "video:director",
+  "video:writer",
+  "video:tag",
+  "article:author",
+  "article:tag",
+  "book:tag",
+  "book:author",
+  "music:album",
+  "music:musician"
+];
+function tagDedupeKey$1(tag) {
+  const { props, tag: tagName } = tag;
+  if (UniqueTags$1.includes(tagName))
+    return tagName;
+  if (tagName === "link" && props.rel === "canonical")
+    return "canonical";
+  if (props.charset)
+    return "charset";
+  const name = ["id"];
+  if (tagName === "meta")
+    name.push(...["name", "property", "http-equiv"]);
+  for (const n of name) {
+    if (typeof props[n] !== "undefined") {
+      const val = String(props[n]);
+      if (ArrayMetaProperties$1.findIndex((p) => val.startsWith(p)) !== -1)
+        return false;
+      return `${tagName}:${n}:${val}`;
+    }
+  }
+  return false;
+}
+
+const setAttrs = (ctx, markSideEffect) => {
+  const { tag, $el } = ctx;
+  if (!$el)
+    return;
+  Object.entries(tag.props).forEach(([k, value]) => {
+    value = String(value);
+    const attrSdeKey = `attr:${k}`;
+    if (k === "class") {
+      for (const c of value.split(" ")) {
+        const classSdeKey = `${attrSdeKey}:${c}`;
+        if (markSideEffect)
+          markSideEffect(ctx, classSdeKey, () => $el.classList.remove(c));
+        if (!$el.classList.contains(c))
+          $el.classList.add(c);
+      }
+      return;
+    }
+    if (markSideEffect && !k.startsWith("data-h-"))
+      markSideEffect(ctx, attrSdeKey, () => $el.removeAttribute(k));
+    if ($el.getAttribute(k) !== value)
+      $el.setAttribute(k, value);
+  });
+  if (TagsWithInnerContent.includes(tag.tag) && $el.innerHTML !== (tag.children || ""))
+    $el.innerHTML = tag.children || "";
+};
+
+function hashCode(s) {
+  let h = 9;
+  for (let i = 0; i < s.length; )
+    h = Math.imul(h ^ s.charCodeAt(i++), 9 ** 9);
+  return ((h ^ h >>> 9) + 65536).toString(16).substring(1, 8).toLowerCase();
+}
+
+async function renderDOMHead(head, options = {}) {
+  const ctx = { shouldRender: true };
+  await head.hooks.callHook("dom:beforeRender", ctx);
+  if (!ctx.shouldRender)
+    return;
+  const dom = options.document || window.document;
+  const staleSideEffects = head._popSideEffectQueue();
+  head.headEntries().map((entry) => entry._sde).forEach((sde) => {
+    Object.entries(sde).forEach(([key, fn]) => {
+      staleSideEffects[key] = fn;
+    });
+  });
+  const preRenderTag = async (tag) => {
+    const entry = head.headEntries().find((e) => e._i === tag._e);
+    const renderCtx = {
+      renderId: tag._d || hashCode(JSON.stringify({ ...tag, _e: void 0, _p: void 0 })),
+      $el: null,
+      shouldRender: true,
+      tag,
+      entry,
+      staleSideEffects
+    };
+    await head.hooks.callHook("dom:beforeRenderTag", renderCtx);
+    return renderCtx;
+  };
+  const renders = [];
+  const pendingRenders = {
+    body: [],
+    head: []
+  };
+  const markSideEffect = (ctx2, key, fn) => {
+    key = `${ctx2.renderId}:${key}`;
+    if (ctx2.entry)
+      ctx2.entry._sde[key] = fn;
+    delete staleSideEffects[key];
+  };
+  const markEl = (ctx2) => {
+    head._elMap[ctx2.renderId] = ctx2.$el;
+    renders.push(ctx2);
+    markSideEffect(ctx2, "el", () => {
+      ctx2.$el?.remove();
+      delete head._elMap[ctx2.renderId];
+    });
+  };
+  for (const t of await head.resolveTags()) {
+    const ctx2 = await preRenderTag(t);
+    if (!ctx2.shouldRender)
+      continue;
+    const { tag } = ctx2;
+    if (tag.tag === "title") {
+      dom.title = tag.children || "";
+      renders.push(ctx2);
+      continue;
+    }
+    if (tag.tag === "htmlAttrs" || tag.tag === "bodyAttrs") {
+      ctx2.$el = dom[tag.tag === "htmlAttrs" ? "documentElement" : "body"];
+      setAttrs(ctx2, markSideEffect);
+      renders.push(ctx2);
+      continue;
+    }
+    ctx2.$el = head._elMap[ctx2.renderId];
+    if (!ctx2.$el && tag._hash) {
+      ctx2.$el = dom.querySelector(`${tag.tagPosition?.startsWith("body") ? "body" : "head"} > ${tag.tag}[data-h-${tag._hash}]`);
+    }
+    if (ctx2.$el) {
+      if (ctx2.tag._d)
+        setAttrs(ctx2);
+      markEl(ctx2);
+      continue;
+    }
+    ctx2.$el = dom.createElement(tag.tag);
+    setAttrs(ctx2);
+    pendingRenders[tag.tagPosition?.startsWith("body") ? "body" : "head"].push(ctx2);
+  }
+  Object.entries(pendingRenders).forEach(([pos, queue]) => {
+    if (!queue.length)
+      return;
+    for (const $el of [...dom[pos].children].reverse()) {
+      const elTag = $el.tagName.toLowerCase();
+      if (!HasElementTags$1.includes(elTag))
+        continue;
+      const dedupeKey = tagDedupeKey$1({
+        tag: elTag,
+        props: $el.getAttributeNames().reduce((props, name) => ({ ...props, [name]: $el.getAttribute(name) }), {})
+      });
+      const matchIdx = queue.findIndex((ctx2) => ctx2 && (ctx2.tag._d === dedupeKey || $el.isEqualNode(ctx2.$el)));
+      if (matchIdx !== -1) {
+        const ctx2 = queue[matchIdx];
+        ctx2.$el = $el;
+        setAttrs(ctx2);
+        markEl(ctx2);
+        delete queue[matchIdx];
+      }
+    }
+    queue.forEach((ctx2) => {
+      if (!ctx2.$el)
+        return;
+      switch (ctx2.tag.tagPosition) {
+        case "bodyClose":
+          dom.body.appendChild(ctx2.$el);
+          break;
+        case "bodyOpen":
+          dom.body.insertBefore(ctx2.$el, dom.body.firstChild);
+          break;
+        case "head":
+        default:
+          dom.head.appendChild(ctx2.$el);
+          break;
+      }
+      markEl(ctx2);
+    });
+  });
+  for (const ctx2 of renders)
+    await head.hooks.callHook("dom:renderTag", ctx2);
+  Object.values(staleSideEffects).forEach((fn) => fn());
+}
+let domUpdatePromise = null;
+async function debouncedRenderDOMHead(head, options = {}) {
+  function doDomUpdate() {
+    domUpdatePromise = null;
+    return renderDOMHead(head, options);
+  }
+  const delayFn = options.delayFn || ((fn) => setTimeout(fn, 10));
+  return domUpdatePromise = domUpdatePromise || new Promise((resolve) => delayFn(() => resolve(doDomUpdate())));
+}
+
+const index = {
+  __proto__: null,
+  debouncedRenderDOMHead: debouncedRenderDOMHead,
+  get domUpdatePromise () { return domUpdatePromise; },
+  hashCode: hashCode,
+  renderDOMHead: renderDOMHead
+};
+
 const ValidHeadTags = [
   "title",
   "titleTemplate",
@@ -293,7 +509,7 @@ const PatchDomOnEntryUpdatesPlugin = (options) => {
         let delayFn = options?.delayFn;
         if (!delayFn && typeof requestAnimationFrame !== "undefined")
           delayFn = requestAnimationFrame;
-        import('./chunks/index.mjs').then(({ debouncedRenderDOMHead }) => {
+        Promise.resolve().then(function () { return index; }).then(({ debouncedRenderDOMHead }) => {
           debouncedRenderDOMHead(head, { document: options?.document || window.document, delayFn });
         });
       }
@@ -343,7 +559,7 @@ const EventHandlersPlugin = () => {
           const sdeKey = `${ctx.tag._d || ctx.tag._p}:${k}`;
           const eventName = k.slice(2).toLowerCase();
           const eventDedupeKey = `data-h-${eventName}`;
-          delete ctx.queuedSideEffects[sdeKey];
+          delete ctx.staleSideEffects[sdeKey];
           if ($el.hasAttribute(eventDedupeKey))
             return;
           const handler = value;
@@ -367,12 +583,6 @@ const EventHandlersPlugin = () => {
 function asArray$1(value) {
   return Array.isArray(value) ? value : [value];
 }
-function hashCode(s) {
-  let h = 9;
-  for (let i = 0; i < s.length; )
-    h = Math.imul(h ^ s.charCodeAt(i++), 9 ** 9);
-  return ((h ^ h >>> 9) + 65536).toString(16).substring(1, 8).toLowerCase();
-}
 const HasElementTags = [
   "base",
   "meta",
@@ -429,7 +639,7 @@ function createHeadCore(options = {}) {
     ...options?.plugins || []
   ];
   options.plugins.forEach((p) => p.hooks && hooks.addHooks(p.hooks));
-  const triggerUpdateHook = () => hooks.callHook("entries:updated", head);
+  const updated = () => hooks.callHook("entries:updated", head);
   const head = {
     resolvedOptions: options,
     headEntries() {
@@ -447,27 +657,23 @@ function createHeadCore(options = {}) {
       if (options2?.mode)
         activeEntry._m = options2?.mode;
       entries.push(activeEntry);
-      triggerUpdateHook();
-      const queueSideEffects = (e) => {
-        _sde = { ..._sde, ...e._sde || {} };
-        e._sde = {};
-        triggerUpdateHook();
-      };
+      updated();
       return {
         dispose() {
           entries = entries.filter((e) => {
             if (e._i !== activeEntry._i)
               return true;
-            queueSideEffects(e);
+            _sde = { ..._sde, ...e._sde || {} };
+            e._sde = {};
+            updated();
             return false;
           });
         },
         patch(input2) {
           entries = entries.map((e) => {
             if (e._i === activeEntry._i) {
-              queueSideEffects(e);
               activeEntry.input = e.input = input2;
-              activeEntry._i = e._i = _eid++;
+              updated();
             }
             return e;
           });

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@unhead/vue",
   "type": "module",
-  "version": "0.6.6",
+  "version": "0.6.8",
   "packageManager": "pnpm@7.14.0",
   "author": "Harlan Wilton <harlan@harlanzw.com>",
   "license": "MIT",
@@ -33,11 +33,11 @@
     "vue": ">=2.7 || >=3"
   },
   "dependencies": {
-    "@unhead/schema": "0.6.6",
+    "@unhead/schema": "0.6.8",
     "hookable": "^5.4.1"
   },
   "devDependencies": {
-    "unhead": "0.6.6",
+    "unhead": "0.6.8",
     "vue": "^3.2.45"
   },
   "scripts": {

package/dist/chunks/index.cjs

@@ -1,165 +0,0 @@
-'use strict';
-
-const TagsWithInnerContent = ["script", "style", "noscript"];
-
-const UniqueTags = ["base", "title", "titleTemplate", "bodyAttrs", "htmlAttrs"];
-const ArrayMetaProperties = [
-  "og:image",
-  "og:video",
-  "og:audio",
-  "og:locale:alternate",
-  "video:actor",
-  "video:director",
-  "video:writer",
-  "video:tag",
-  "article:author",
-  "article:tag",
-  "book:tag",
-  "book:author",
-  "music:album",
-  "music:musician"
-];
-function tagDedupeKey(tag) {
-  const { props, tag: tagName } = tag;
-  if (UniqueTags.includes(tagName))
-    return tagName;
-  if (tagName === "link" && props.rel === "canonical")
-    return "canonical";
-  if (props.charset)
-    return "charset";
-  const name = ["id"];
-  if (tagName === "meta")
-    name.push(...["name", "property", "http-equiv"]);
-  for (const n of name) {
-    if (typeof props[n] !== "undefined") {
-      const val = String(props[n]);
-      if (ArrayMetaProperties.findIndex((p) => val.startsWith(p)) !== -1)
-        return false;
-      return `${tagName}:${n}:${val}`;
-    }
-  }
-  return false;
-}
-
-async function renderDOMHead(head, options = {}) {
-  const ctx = { shouldRender: true };
-  await head.hooks.callHook("dom:beforeRender", ctx);
-  if (!ctx.shouldRender)
-    return;
-  const dom = options.document || window.document;
-  const staleSideEffects = head._popSideEffectQueue();
-  head.headEntries().map((entry) => entry._sde).forEach((sde) => {
-    Object.entries(sde).forEach(([key, fn]) => {
-      staleSideEffects[key] = fn;
-    });
-  });
-  const renderTag = (tag, entry) => {
-    if (tag.tag === "title" && tag.children) {
-      dom.title = tag.children;
-      return dom.head.querySelector("title");
-    }
-    const tagRenderId = tag._d || tag._p;
-    const markSideEffect = (key, fn) => {
-      key = `${tagRenderId}:${key}`;
-      if (entry)
-        entry._sde[key] = fn;
-      delete staleSideEffects[key];
-    };
-    const setAttrs = ($el, sideEffects = true) => {
-      Object.entries(tag.props).forEach(([k, value]) => {
-        value = String(value);
-        const attrSdeKey = `attr:${k}`;
-        if (k === "class") {
-          for (const c of value.split(" ")) {
-            const classSdeKey = `${attrSdeKey}:${c}`;
-            sideEffects && markSideEffect(classSdeKey, () => $el.classList.remove(c));
-            if (!$el.classList.contains(c))
-              $el.classList.add(c);
-          }
-          return;
-        }
-        if (sideEffects && !k.startsWith("data-h-"))
-          markSideEffect(attrSdeKey, () => $el.removeAttribute(k));
-        if ($el.getAttribute(k) !== value)
-          $el.setAttribute(k, value);
-      });
-      if (TagsWithInnerContent.includes(tag.tag) && $el.innerHTML !== (tag.children || ""))
-        $el.innerHTML = tag.children || "";
-    };
-    if (tag.tag === "htmlAttrs" || tag.tag === "bodyAttrs") {
-      const $el = dom[tag.tag === "htmlAttrs" ? "documentElement" : "body"];
-      setAttrs($el);
-      return $el;
-    }
-    let $newEl = dom.createElement(tag.tag);
-    setAttrs($newEl, false);
-    let $previousEl = head._elMap[tagRenderId];
-    const $target = dom[tag.tagPosition?.startsWith("body") ? "body" : "head"];
-    if (!$previousEl && tag._hash) {
-      $previousEl = $target.querySelector(`${tag.tag}[data-h-${tag._hash}]`);
-    }
-    if (!$previousEl) {
-      for (const $el of tag.tagPosition === "bodyClose" ? [...$target.children].reverse() : $target.children) {
-        const elTag = $el.tagName.toLowerCase();
-        if (elTag !== tag.tag)
-          continue;
-        const key = tagDedupeKey({
-          tag: elTag,
-          props: $el.getAttributeNames().reduce((props, name) => ({ ...props, [name]: $el.getAttribute(name) }), {})
-        });
-        if (key === tag._d || $el.isEqualNode($newEl)) {
-          $previousEl = $el;
-          break;
-        }
-      }
-    }
-    const markEl = ($el) => {
-      head._elMap[tagRenderId] = $el;
-      markSideEffect("el", () => {
-        $el?.remove();
-        delete head._elMap[tagRenderId];
-      });
-    };
-    if ($previousEl) {
-      markEl($previousEl);
-      setAttrs($previousEl, false);
-      return $previousEl;
-    }
-    switch (tag.tagPosition) {
-      case "bodyClose":
-        $newEl = dom.body.appendChild($newEl);
-        break;
-      case "bodyOpen":
-        $newEl = dom.body.insertBefore($newEl, dom.body.firstChild);
-        break;
-      case "head":
-      default:
-        $newEl = dom.head.appendChild($newEl);
-        break;
-    }
-    markEl($newEl);
-    return $newEl;
-  };
-  for (const tag of await head.resolveTags()) {
-    const entry = head.headEntries().find((e) => e._i === tag._e);
-    const renderCtx = { $el: null, shouldRender: true, tag, entry, queuedSideEffects: staleSideEffects };
-    await head.hooks.callHook("dom:beforeRenderTag", renderCtx);
-    if (!renderCtx.shouldRender)
-      continue;
-    renderCtx.$el = renderTag(renderCtx.tag, renderCtx.entry);
-    await head.hooks.callHook("dom:renderTag", renderCtx);
-  }
-  Object.values(staleSideEffects).forEach((fn) => fn());
-}
-exports.domUpdatePromise = null;
-async function debouncedRenderDOMHead(head, options = {}) {
-  function doDomUpdate() {
-    exports.domUpdatePromise = null;
-    return renderDOMHead(head, options);
-  }
-  const delayFn = options.delayFn || ((fn) => setTimeout(fn, 10));
-  return exports.domUpdatePromise = exports.domUpdatePromise || new Promise((resolve) => delayFn(() => resolve(doDomUpdate())));
-}
-
-exports.debouncedRenderDOMHead = debouncedRenderDOMHead;
-exports.renderDOMHead = renderDOMHead;

package/dist/chunks/index.mjs

@@ -1,162 +0,0 @@
-const TagsWithInnerContent = ["script", "style", "noscript"];
-
-const UniqueTags = ["base", "title", "titleTemplate", "bodyAttrs", "htmlAttrs"];
-const ArrayMetaProperties = [
-  "og:image",
-  "og:video",
-  "og:audio",
-  "og:locale:alternate",
-  "video:actor",
-  "video:director",
-  "video:writer",
-  "video:tag",
-  "article:author",
-  "article:tag",
-  "book:tag",
-  "book:author",
-  "music:album",
-  "music:musician"
-];
-function tagDedupeKey(tag) {
-  const { props, tag: tagName } = tag;
-  if (UniqueTags.includes(tagName))
-    return tagName;
-  if (tagName === "link" && props.rel === "canonical")
-    return "canonical";
-  if (props.charset)
-    return "charset";
-  const name = ["id"];
-  if (tagName === "meta")
-    name.push(...["name", "property", "http-equiv"]);
-  for (const n of name) {
-    if (typeof props[n] !== "undefined") {
-      const val = String(props[n]);
-      if (ArrayMetaProperties.findIndex((p) => val.startsWith(p)) !== -1)
-        return false;
-      return `${tagName}:${n}:${val}`;
-    }
-  }
-  return false;
-}
-
-async function renderDOMHead(head, options = {}) {
-  const ctx = { shouldRender: true };
-  await head.hooks.callHook("dom:beforeRender", ctx);
-  if (!ctx.shouldRender)
-    return;
-  const dom = options.document || window.document;
-  const staleSideEffects = head._popSideEffectQueue();
-  head.headEntries().map((entry) => entry._sde).forEach((sde) => {
-    Object.entries(sde).forEach(([key, fn]) => {
-      staleSideEffects[key] = fn;
-    });
-  });
-  const renderTag = (tag, entry) => {
-    if (tag.tag === "title" && tag.children) {
-      dom.title = tag.children;
-      return dom.head.querySelector("title");
-    }
-    const tagRenderId = tag._d || tag._p;
-    const markSideEffect = (key, fn) => {
-      key = `${tagRenderId}:${key}`;
-      if (entry)
-        entry._sde[key] = fn;
-      delete staleSideEffects[key];
-    };
-    const setAttrs = ($el, sideEffects = true) => {
-      Object.entries(tag.props).forEach(([k, value]) => {
-        value = String(value);
-        const attrSdeKey = `attr:${k}`;
-        if (k === "class") {
-          for (const c of value.split(" ")) {
-            const classSdeKey = `${attrSdeKey}:${c}`;
-            sideEffects && markSideEffect(classSdeKey, () => $el.classList.remove(c));
-            if (!$el.classList.contains(c))
-              $el.classList.add(c);
-          }
-          return;
-        }
-        if (sideEffects && !k.startsWith("data-h-"))
-          markSideEffect(attrSdeKey, () => $el.removeAttribute(k));
-        if ($el.getAttribute(k) !== value)
-          $el.setAttribute(k, value);
-      });
-      if (TagsWithInnerContent.includes(tag.tag) && $el.innerHTML !== (tag.children || ""))
-        $el.innerHTML = tag.children || "";
-    };
-    if (tag.tag === "htmlAttrs" || tag.tag === "bodyAttrs") {
-      const $el = dom[tag.tag === "htmlAttrs" ? "documentElement" : "body"];
-      setAttrs($el);
-      return $el;
-    }
-    let $newEl = dom.createElement(tag.tag);
-    setAttrs($newEl, false);
-    let $previousEl = head._elMap[tagRenderId];
-    const $target = dom[tag.tagPosition?.startsWith("body") ? "body" : "head"];
-    if (!$previousEl && tag._hash) {
-      $previousEl = $target.querySelector(`${tag.tag}[data-h-${tag._hash}]`);
-    }
-    if (!$previousEl) {
-      for (const $el of tag.tagPosition === "bodyClose" ? [...$target.children].reverse() : $target.children) {
-        const elTag = $el.tagName.toLowerCase();
-        if (elTag !== tag.tag)
-          continue;
-        const key = tagDedupeKey({
-          tag: elTag,
-          props: $el.getAttributeNames().reduce((props, name) => ({ ...props, [name]: $el.getAttribute(name) }), {})
-        });
-        if (key === tag._d || $el.isEqualNode($newEl)) {
-          $previousEl = $el;
-          break;
-        }
-      }
-    }
-    const markEl = ($el) => {
-      head._elMap[tagRenderId] = $el;
-      markSideEffect("el", () => {
-        $el?.remove();
-        delete head._elMap[tagRenderId];
-      });
-    };
-    if ($previousEl) {
-      markEl($previousEl);
-      setAttrs($previousEl, false);
-      return $previousEl;
-    }
-    switch (tag.tagPosition) {
-      case "bodyClose":
-        $newEl = dom.body.appendChild($newEl);
-        break;
-      case "bodyOpen":
-        $newEl = dom.body.insertBefore($newEl, dom.body.firstChild);
-        break;
-      case "head":
-      default:
-        $newEl = dom.head.appendChild($newEl);
-        break;
-    }
-    markEl($newEl);
-    return $newEl;
-  };
-  for (const tag of await head.resolveTags()) {
-    const entry = head.headEntries().find((e) => e._i === tag._e);
-    const renderCtx = { $el: null, shouldRender: true, tag, entry, queuedSideEffects: staleSideEffects };
-    await head.hooks.callHook("dom:beforeRenderTag", renderCtx);
-    if (!renderCtx.shouldRender)
-      continue;
-    renderCtx.$el = renderTag(renderCtx.tag, renderCtx.entry);
-    await head.hooks.callHook("dom:renderTag", renderCtx);
-  }
-  Object.values(staleSideEffects).forEach((fn) => fn());
-}
-let domUpdatePromise = null;
-async function debouncedRenderDOMHead(head, options = {}) {
-  function doDomUpdate() {
-    domUpdatePromise = null;
-    return renderDOMHead(head, options);
-  }
-  const delayFn = options.delayFn || ((fn) => setTimeout(fn, 10));
-  return domUpdatePromise = domUpdatePromise || new Promise((resolve) => delayFn(() => resolve(doDomUpdate())));
-}
-
-export { debouncedRenderDOMHead, domUpdatePromise, renderDOMHead };