@unhead/dom 1.11.14 → 2.0.0-alpha.0

package/dist/index.cjs

@@ -1,201 +1,16 @@
 'use strict';
 
-const shared = require('@unhead/shared');
+const client = require('unhead/client');
 
-async function renderDOMHead(head, options = {}) {
-  const dom = options.document || head.resolvedOptions.document;
-  if (!dom || !head.dirty)
-    return;
-  const beforeRenderCtx = { shouldRender: true, tags: [] };
-  await head.hooks.callHook("dom:beforeRender", beforeRenderCtx);
-  if (!beforeRenderCtx.shouldRender)
-    return;
-  if (head._domUpdatePromise) {
-    return head._domUpdatePromise;
-  }
-  head._domUpdatePromise = new Promise(async (resolve) => {
-    const tags = (await head.resolveTags()).map((tag) => ({
-      tag,
-      id: shared.HasElementTags.has(tag.tag) ? shared.hashTag(tag) : tag.tag,
-      shouldRender: true
-    }));
-    let state = head._dom;
-    if (!state) {
-      state = {
-        elMap: { htmlAttrs: dom.documentElement, bodyAttrs: dom.body }
-      };
-      const takenDedupeKeys = /* @__PURE__ */ new Set();
-      for (const key of ["body", "head"]) {
-        const children = dom[key]?.children;
-        for (const c of children) {
-          const tag = c.tagName.toLowerCase();
-          if (!shared.HasElementTags.has(tag)) {
-            continue;
-          }
-          const t = {
-            tag,
-            props: await shared.normaliseProps(
-              c.getAttributeNames().reduce((props, name) => ({ ...props, [name]: c.getAttribute(name) }), {})
-            ),
-            innerHTML: c.innerHTML
-          };
-          const dedupeKey = shared.tagDedupeKey(t);
-          let d = dedupeKey;
-          let i = 1;
-          while (d && takenDedupeKeys.has(d))
-            d = `${dedupeKey}:${i++}`;
-          if (d) {
-            t._d = d;
-            takenDedupeKeys.add(d);
-          }
-          state.elMap[c.getAttribute("data-hid") || shared.hashTag(t)] = c;
-        }
-      }
-    }
-    state.pendingSideEffects = { ...state.sideEffects };
-    state.sideEffects = {};
-    function track(id, scope, fn) {
-      const k = `${id}:${scope}`;
-      state.sideEffects[k] = fn;
-      delete state.pendingSideEffects[k];
-    }
-    function trackCtx({ id, $el, tag }) {
-      const isAttrTag = tag.tag.endsWith("Attrs");
-      state.elMap[id] = $el;
-      if (!isAttrTag) {
-        if (tag.textContent && tag.textContent !== $el.textContent) {
-          $el.textContent = tag.textContent;
-        }
-        if (tag.innerHTML && tag.innerHTML !== $el.innerHTML) {
-          $el.innerHTML = tag.innerHTML;
-        }
-        track(id, "el", () => {
-          state.elMap[id]?.remove();
-          delete state.elMap[id];
-        });
-      }
-      if (tag._eventHandlers) {
-        for (const k in tag._eventHandlers) {
-          if (!Object.prototype.hasOwnProperty.call(tag._eventHandlers, k)) {
-            continue;
-          }
-          if ($el.getAttribute(`data-${k}`) !== "") {
-            (tag.tag === "bodyAttrs" ? dom.defaultView : $el).addEventListener(
-              // onload -> load
-              k.substring(2),
-              tag._eventHandlers[k].bind($el)
-            );
-            $el.setAttribute(`data-${k}`, "");
-          }
-        }
-      }
-      for (const k in tag.props) {
-        if (!Object.prototype.hasOwnProperty.call(tag.props, k)) {
-          continue;
-        }
-        const value = tag.props[k];
-        const ck = `attr:${k}`;
-        if (k === "class") {
-          if (!value) {
-            continue;
-          }
-          for (const c of value.split(" ")) {
-            isAttrTag && track(id, `${ck}:${c}`, () => $el.classList.remove(c));
-            !$el.classList.contains(c) && $el.classList.add(c);
-          }
-        } else if (k === "style") {
-          if (!value) {
-            continue;
-          }
-          for (const c of value.split(";")) {
-            const propIndex = c.indexOf(":");
-            const k2 = c.substring(0, propIndex).trim();
-            const v = c.substring(propIndex + 1).trim();
-            track(id, `${ck}:${k2}`, () => {
-              $el.style.removeProperty(k2);
-            });
-            $el.style.setProperty(k2, v);
-          }
-        } else {
-          $el.getAttribute(k) !== value && $el.setAttribute(k, value === true ? "" : String(value));
-          isAttrTag && track(id, ck, () => $el.removeAttribute(k));
-        }
-      }
-    }
-    const pending = [];
-    const frag = {
-      bodyClose: void 0,
-      bodyOpen: void 0,
-      head: void 0
-    };
-    for (const ctx of tags) {
-      const { tag, shouldRender, id } = ctx;
-      if (!shouldRender)
-        continue;
-      if (tag.tag === "title") {
-        dom.title = tag.textContent;
-        continue;
-      }
-      ctx.$el = ctx.$el || state.elMap[id];
-      if (ctx.$el) {
-        trackCtx(ctx);
-      } else if (shared.HasElementTags.has(tag.tag)) {
-        pending.push(ctx);
-      }
-    }
-    for (const ctx of pending) {
-      const pos = ctx.tag.tagPosition || "head";
-      ctx.$el = dom.createElement(ctx.tag.tag);
-      trackCtx(ctx);
-      frag[pos] = frag[pos] || dom.createDocumentFragment();
-      frag[pos].appendChild(ctx.$el);
-    }
-    for (const ctx of tags)
-      await head.hooks.callHook("dom:renderTag", ctx, dom, track);
-    frag.head && dom.head.appendChild(frag.head);
-    frag.bodyOpen && dom.body.insertBefore(frag.bodyOpen, dom.body.firstChild);
-    frag.bodyClose && dom.body.appendChild(frag.bodyClose);
-    for (const k in state.pendingSideEffects) {
-      state.pendingSideEffects[k]();
-    }
-    head._dom = state;
-    await head.hooks.callHook("dom:rendered", { renders: tags });
-    resolve();
-  }).finally(() => {
-    head._domUpdatePromise = void 0;
-    head.dirty = false;
-  });
-  return head._domUpdatePromise;
-}
 
-function debouncedRenderDOMHead(head, options = {}) {
-  const fn = options.delayFn || ((fn2) => setTimeout(fn2, 10));
-  return head._domDebouncedUpdatePromise = head._domDebouncedUpdatePromise || new Promise((resolve) => fn(() => {
-    return renderDOMHead(head, options).then(() => {
-      delete head._domDebouncedUpdatePromise;
-      resolve();
-    });
-  }));
-}
 
-// @__NO_SIDE_EFFECTS__
-function DomPlugin(options) {
-  return shared.defineHeadPlugin((head) => {
-    const initialPayload = head.resolvedOptions.document?.head.querySelector('script[id="unhead:payload"]')?.innerHTML || false;
-    if (initialPayload) {
-      head.push(JSON.parse(initialPayload));
-    }
-    return {
-      mode: "client",
-      hooks: {
-        "entries:updated": (head2) => {
-          debouncedRenderDOMHead(head2, options);
-        }
-      }
-    };
-  });
-}
+Object.prototype.hasOwnProperty.call(client, '__proto__') &&
+	!Object.prototype.hasOwnProperty.call(exports, '__proto__') &&
+	Object.defineProperty(exports, '__proto__', {
+		enumerable: true,
+		value: client['__proto__']
+	});
 
-exports.DomPlugin = DomPlugin;
-exports.debouncedRenderDOMHead = debouncedRenderDOMHead;
-exports.renderDOMHead = renderDOMHead;
+Object.keys(client).forEach(function (k) {
+	if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) exports[k] = client[k];
+});

package/dist/index.d.cts

@@ -1,31 +1 @@
-import * as _unhead_schema from '@unhead/schema';
-import { Unhead } from '@unhead/schema';
-
-interface RenderDomHeadOptions {
-    /**
-     * Document to use for rendering. Allows stubbing for testing.
-     */
-    document?: Document;
-}
-/**
- * Render the head tags to the DOM.
- */
-declare function renderDOMHead<T extends Unhead<any>>(head: T, options?: RenderDomHeadOptions): Promise<void>;
-
-interface DebouncedRenderDomHeadOptions extends RenderDomHeadOptions {
-    /**
-     * Specify a custom delay function for delaying the render.
-     */
-    delayFn?: (fn: () => void) => void;
-}
-/**
- * Queue a debounced update of the DOM head.
- */
-declare function debouncedRenderDOMHead<T extends Unhead<any>>(head: T, options?: DebouncedRenderDomHeadOptions): Promise<void>;
-
-interface DomPluginOptions extends RenderDomHeadOptions {
-    delayFn?: (fn: () => void) => void;
-}
-declare function DomPlugin(options?: DomPluginOptions): _unhead_schema.HeadPluginInput;
-
-export { type DebouncedRenderDomHeadOptions, DomPlugin, type DomPluginOptions, type RenderDomHeadOptions, debouncedRenderDOMHead, renderDOMHead };
+export * from 'unhead/client';

package/dist/index.d.mts

@@ -1,31 +1 @@
-import * as _unhead_schema from '@unhead/schema';
-import { Unhead } from '@unhead/schema';
-
-interface RenderDomHeadOptions {
-    /**
-     * Document to use for rendering. Allows stubbing for testing.
-     */
-    document?: Document;
-}
-/**
- * Render the head tags to the DOM.
- */
-declare function renderDOMHead<T extends Unhead<any>>(head: T, options?: RenderDomHeadOptions): Promise<void>;
-
-interface DebouncedRenderDomHeadOptions extends RenderDomHeadOptions {
-    /**
-     * Specify a custom delay function for delaying the render.
-     */
-    delayFn?: (fn: () => void) => void;
-}
-/**
- * Queue a debounced update of the DOM head.
- */
-declare function debouncedRenderDOMHead<T extends Unhead<any>>(head: T, options?: DebouncedRenderDomHeadOptions): Promise<void>;
-
-interface DomPluginOptions extends RenderDomHeadOptions {
-    delayFn?: (fn: () => void) => void;
-}
-declare function DomPlugin(options?: DomPluginOptions): _unhead_schema.HeadPluginInput;
-
-export { type DebouncedRenderDomHeadOptions, DomPlugin, type DomPluginOptions, type RenderDomHeadOptions, debouncedRenderDOMHead, renderDOMHead };
+export * from 'unhead/client';

package/dist/index.d.ts

@@ -1,31 +1 @@
-import * as _unhead_schema from '@unhead/schema';
-import { Unhead } from '@unhead/schema';
-
-interface RenderDomHeadOptions {
-    /**
-     * Document to use for rendering. Allows stubbing for testing.
-     */
-    document?: Document;
-}
-/**
- * Render the head tags to the DOM.
- */
-declare function renderDOMHead<T extends Unhead<any>>(head: T, options?: RenderDomHeadOptions): Promise<void>;
-
-interface DebouncedRenderDomHeadOptions extends RenderDomHeadOptions {
-    /**
-     * Specify a custom delay function for delaying the render.
-     */
-    delayFn?: (fn: () => void) => void;
-}
-/**
- * Queue a debounced update of the DOM head.
- */
-declare function debouncedRenderDOMHead<T extends Unhead<any>>(head: T, options?: DebouncedRenderDomHeadOptions): Promise<void>;
-
-interface DomPluginOptions extends RenderDomHeadOptions {
-    delayFn?: (fn: () => void) => void;
-}
-declare function DomPlugin(options?: DomPluginOptions): _unhead_schema.HeadPluginInput;
-
-export { type DebouncedRenderDomHeadOptions, DomPlugin, type DomPluginOptions, type RenderDomHeadOptions, debouncedRenderDOMHead, renderDOMHead };
+export * from 'unhead/client';

package/dist/index.mjs

@@ -1,197 +1 @@
-import { HasElementTags, hashTag, normaliseProps, tagDedupeKey, defineHeadPlugin } from '@unhead/shared';
-
-async function renderDOMHead(head, options = {}) {
-  const dom = options.document || head.resolvedOptions.document;
-  if (!dom || !head.dirty)
-    return;
-  const beforeRenderCtx = { shouldRender: true, tags: [] };
-  await head.hooks.callHook("dom:beforeRender", beforeRenderCtx);
-  if (!beforeRenderCtx.shouldRender)
-    return;
-  if (head._domUpdatePromise) {
-    return head._domUpdatePromise;
-  }
-  head._domUpdatePromise = new Promise(async (resolve) => {
-    const tags = (await head.resolveTags()).map((tag) => ({
-      tag,
-      id: HasElementTags.has(tag.tag) ? hashTag(tag) : tag.tag,
-      shouldRender: true
-    }));
-    let state = head._dom;
-    if (!state) {
-      state = {
-        elMap: { htmlAttrs: dom.documentElement, bodyAttrs: dom.body }
-      };
-      const takenDedupeKeys = /* @__PURE__ */ new Set();
-      for (const key of ["body", "head"]) {
-        const children = dom[key]?.children;
-        for (const c of children) {
-          const tag = c.tagName.toLowerCase();
-          if (!HasElementTags.has(tag)) {
-            continue;
-          }
-          const t = {
-            tag,
-            props: await normaliseProps(
-              c.getAttributeNames().reduce((props, name) => ({ ...props, [name]: c.getAttribute(name) }), {})
-            ),
-            innerHTML: c.innerHTML
-          };
-          const dedupeKey = tagDedupeKey(t);
-          let d = dedupeKey;
-          let i = 1;
-          while (d && takenDedupeKeys.has(d))
-            d = `${dedupeKey}:${i++}`;
-          if (d) {
-            t._d = d;
-            takenDedupeKeys.add(d);
-          }
-          state.elMap[c.getAttribute("data-hid") || hashTag(t)] = c;
-        }
-      }
-    }
-    state.pendingSideEffects = { ...state.sideEffects };
-    state.sideEffects = {};
-    function track(id, scope, fn) {
-      const k = `${id}:${scope}`;
-      state.sideEffects[k] = fn;
-      delete state.pendingSideEffects[k];
-    }
-    function trackCtx({ id, $el, tag }) {
-      const isAttrTag = tag.tag.endsWith("Attrs");
-      state.elMap[id] = $el;
-      if (!isAttrTag) {
-        if (tag.textContent && tag.textContent !== $el.textContent) {
-          $el.textContent = tag.textContent;
-        }
-        if (tag.innerHTML && tag.innerHTML !== $el.innerHTML) {
-          $el.innerHTML = tag.innerHTML;
-        }
-        track(id, "el", () => {
-          state.elMap[id]?.remove();
-          delete state.elMap[id];
-        });
-      }
-      if (tag._eventHandlers) {
-        for (const k in tag._eventHandlers) {
-          if (!Object.prototype.hasOwnProperty.call(tag._eventHandlers, k)) {
-            continue;
-          }
-          if ($el.getAttribute(`data-${k}`) !== "") {
-            (tag.tag === "bodyAttrs" ? dom.defaultView : $el).addEventListener(
-              // onload -> load
-              k.substring(2),
-              tag._eventHandlers[k].bind($el)
-            );
-            $el.setAttribute(`data-${k}`, "");
-          }
-        }
-      }
-      for (const k in tag.props) {
-        if (!Object.prototype.hasOwnProperty.call(tag.props, k)) {
-          continue;
-        }
-        const value = tag.props[k];
-        const ck = `attr:${k}`;
-        if (k === "class") {
-          if (!value) {
-            continue;
-          }
-          for (const c of value.split(" ")) {
-            isAttrTag && track(id, `${ck}:${c}`, () => $el.classList.remove(c));
-            !$el.classList.contains(c) && $el.classList.add(c);
-          }
-        } else if (k === "style") {
-          if (!value) {
-            continue;
-          }
-          for (const c of value.split(";")) {
-            const propIndex = c.indexOf(":");
-            const k2 = c.substring(0, propIndex).trim();
-            const v = c.substring(propIndex + 1).trim();
-            track(id, `${ck}:${k2}`, () => {
-              $el.style.removeProperty(k2);
-            });
-            $el.style.setProperty(k2, v);
-          }
-        } else {
-          $el.getAttribute(k) !== value && $el.setAttribute(k, value === true ? "" : String(value));
-          isAttrTag && track(id, ck, () => $el.removeAttribute(k));
-        }
-      }
-    }
-    const pending = [];
-    const frag = {
-      bodyClose: void 0,
-      bodyOpen: void 0,
-      head: void 0
-    };
-    for (const ctx of tags) {
-      const { tag, shouldRender, id } = ctx;
-      if (!shouldRender)
-        continue;
-      if (tag.tag === "title") {
-        dom.title = tag.textContent;
-        continue;
-      }
-      ctx.$el = ctx.$el || state.elMap[id];
-      if (ctx.$el) {
-        trackCtx(ctx);
-      } else if (HasElementTags.has(tag.tag)) {
-        pending.push(ctx);
-      }
-    }
-    for (const ctx of pending) {
-      const pos = ctx.tag.tagPosition || "head";
-      ctx.$el = dom.createElement(ctx.tag.tag);
-      trackCtx(ctx);
-      frag[pos] = frag[pos] || dom.createDocumentFragment();
-      frag[pos].appendChild(ctx.$el);
-    }
-    for (const ctx of tags)
-      await head.hooks.callHook("dom:renderTag", ctx, dom, track);
-    frag.head && dom.head.appendChild(frag.head);
-    frag.bodyOpen && dom.body.insertBefore(frag.bodyOpen, dom.body.firstChild);
-    frag.bodyClose && dom.body.appendChild(frag.bodyClose);
-    for (const k in state.pendingSideEffects) {
-      state.pendingSideEffects[k]();
-    }
-    head._dom = state;
-    await head.hooks.callHook("dom:rendered", { renders: tags });
-    resolve();
-  }).finally(() => {
-    head._domUpdatePromise = void 0;
-    head.dirty = false;
-  });
-  return head._domUpdatePromise;
-}
-
-function debouncedRenderDOMHead(head, options = {}) {
-  const fn = options.delayFn || ((fn2) => setTimeout(fn2, 10));
-  return head._domDebouncedUpdatePromise = head._domDebouncedUpdatePromise || new Promise((resolve) => fn(() => {
-    return renderDOMHead(head, options).then(() => {
-      delete head._domDebouncedUpdatePromise;
-      resolve();
-    });
-  }));
-}
-
-// @__NO_SIDE_EFFECTS__
-function DomPlugin(options) {
-  return defineHeadPlugin((head) => {
-    const initialPayload = head.resolvedOptions.document?.head.querySelector('script[id="unhead:payload"]')?.innerHTML || false;
-    if (initialPayload) {
-      head.push(JSON.parse(initialPayload));
-    }
-    return {
-      mode: "client",
-      hooks: {
-        "entries:updated": (head2) => {
-          debouncedRenderDOMHead(head2, options);
-        }
-      }
-    };
-  });
-}
-
-export { DomPlugin, debouncedRenderDOMHead, renderDOMHead };
+export * from 'unhead/client';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@unhead/dom",
   "type": "module",
-  "version": "1.11.14",
+  "version": "2.0.0-alpha.0",
   "author": "Harlan Wilton <harlan@harlanzw.com>",
   "license": "MIT",
   "funding": "https://github.com/sponsors/harlan-zw",
@@ -28,13 +28,11 @@
   "files": [
     "dist"
   ],
-  "dependencies": {
-    "@unhead/shared": "1.11.14",
-    "@unhead/schema": "1.11.14"
+  "peerDependencies": {
+    "unhead": "2.0.0-alpha.0"
   },
   "scripts": {
-    "build": "unbuild .",
-    "stub": "unbuild . --stub",
-    "export:sizes": "npx export-size . -r"
+    "build": "unbuild ",
+    "stub": "unbuild  --stub"
   }
 }

package/README.md

@@ -1,12 +0,0 @@
-# @unhead/dom
-
-## Install
-
-```bash
-# yarn add @unhead/dom
-npm install @unhead/dom
-```
-
-## Documentation
-
-See the [@unhead/dom](https://unhead.unjs.io/guide/getting-started/how-it-works#unheaddom) for how this works.