unhead 0.6.5 → 0.6.7

package/dist/index.cjs

@@ -1,6 +1,7 @@
 'use strict';
 
 const hookable = require('hookable');
+const dom = require('@unhead/dom');
 
 const ValidHeadTags = [
   "title",
@@ -408,7 +409,7 @@ const ProvideTagHashPlugin = () => {
         const isDynamic = typeof tag.props._dynamic !== "undefined";
         if (!HasElementTags.includes(tag.tag) || !tag.key)
           return;
-        tag._hash = hashCode(JSON.stringify({ tag: tag.tag, key: tag.key }));
+        tag._hash = dom.hashCode(JSON.stringify({ tag: tag.tag, key: tag.key }));
         if (IsBrowser || getActiveHead()?.resolvedOptions?.document)
           return;
         if (entry._m === "server" || isDynamic) {
@@ -484,16 +485,18 @@ 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;
           $el.setAttribute(eventDedupeKey, "");
           $eventListenerTarget.addEventListener(eventName, handler);
-          ctx.entry._sde[sdeKey] = () => {
-            $eventListenerTarget.removeEventListener(eventName, handler);
-            $el.removeAttribute(eventDedupeKey);
-          };
+          if (ctx.entry) {
+            ctx.entry._sde[sdeKey] = () => {
+              $eventListenerTarget.removeEventListener(eventName, handler);
+              $el.removeAttribute(eventDedupeKey);
+            };
+          }
         });
         if (ctx.tag._delayedSrc) {
           $el.setAttribute("src", ctx.tag._delayedSrc);
@@ -506,12 +509,6 @@ const EventHandlersPlugin = () => {
 function asArray(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",
@@ -527,15 +524,18 @@ const getActiveHead = () => exports.activeHead;
 
 function useHead(input, options = {}) {
   const head = getActiveHead();
-  const isBrowser = IsBrowser || head.resolvedOptions?.document;
-  if (options.mode === "server" && isBrowser || options.mode === "client" && !isBrowser)
-    return;
-  return head.push(input, options);
+  if (head) {
+    const isBrowser = IsBrowser || head.resolvedOptions?.document;
+    if (options.mode === "server" && isBrowser || options.mode === "client" && !isBrowser)
+      return;
+    return head.push(input, options);
+  }
 }
 const useTagTitle = (title) => useHead({ title });
 const useTagBase = (base) => useHead({ base });
 const useTagMeta = (meta) => useHead({ meta: asArray(meta) });
 const useTagMetaFlat = (meta) => useTagMeta(unpackMeta(meta));
+const useSeoMeta = useTagMetaFlat;
 const useTagLink = (link) => useHead({ link: asArray(link) });
 const useTagScript = (script) => useHead({ script: asArray(script) });
 const useTagStyle = (style) => useHead({ style: asArray(style) });
@@ -571,7 +571,26 @@ function normaliseEntryTags(e) {
   });
 }
 
+const CorePlugins = () => [
+  DedupesTagsPlugin(),
+  SortTagsPlugin(),
+  TitleTemplatePlugin(),
+  ProvideTagHashPlugin(),
+  EventHandlersPlugin(),
+  DeprecatedTagAttrPlugin()
+];
+const DOMPlugins = (options = {}) => [
+  PatchDomOnEntryUpdatesPlugin({ document: options?.document, delayFn: options?.domDelayFn })
+];
 function createHead(options = {}) {
+  const head = createHeadCore({
+    ...options,
+    plugins: [...DOMPlugins(options), ...options?.plugins || []]
+  });
+  setActiveHead(head);
+  return head;
+}
+function createHeadCore(options = {}) {
   let entries = [];
   let _sde = {};
   let _eid = 0;
@@ -579,17 +598,11 @@ function createHead(options = {}) {
   if (options?.hooks)
     hooks.addHooks(options.hooks);
   options.plugins = [
-    DeprecatedTagAttrPlugin(),
-    DedupesTagsPlugin(),
-    SortTagsPlugin(),
-    TitleTemplatePlugin(),
-    EventHandlersPlugin(),
-    ProvideTagHashPlugin(),
-    PatchDomOnEntryUpdatesPlugin({ document: options?.document, delayFn: options?.domDelayFn }),
+    ...CorePlugins(),
     ...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() {
@@ -607,27 +620,23 @@ function createHead(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;
           });
@@ -655,7 +664,6 @@ function createHead(options = {}) {
     }
   };
   head.hooks.callHook("init", head);
-  setActiveHead(head);
   return head;
 }
 
@@ -672,6 +680,7 @@ const composableNames = [
   "useTagBase",
   "useTagMeta",
   "useTagMetaFlat",
+  "useSeoMeta",
   "useTagLink",
   "useTagScript",
   "useTagStyle",
@@ -699,6 +708,8 @@ const unheadComposablesImports = [
   }
 ];
 
+exports.CorePlugins = CorePlugins;
+exports.DOMPlugins = DOMPlugins;
 exports.DedupesTagsPlugin = DedupesTagsPlugin;
 exports.DeprecatedTagAttrPlugin = DeprecatedTagAttrPlugin;
 exports.EventHandlersPlugin = EventHandlersPlugin;
@@ -710,15 +721,16 @@ exports.TitleTemplatePlugin = TitleTemplatePlugin;
 exports.asArray = asArray;
 exports.composableNames = composableNames;
 exports.createHead = createHead;
+exports.createHeadCore = createHeadCore;
 exports.defineHeadPlugin = defineHeadPlugin;
 exports.getActiveHead = getActiveHead;
-exports.hashCode = hashCode;
 exports.normaliseEntryTags = normaliseEntryTags;
 exports.setActiveHead = setActiveHead;
 exports.unheadComposablesImports = unheadComposablesImports;
 exports.useBodyAttrs = useBodyAttrs;
 exports.useHead = useHead;
 exports.useHtmlAttrs = useHtmlAttrs;
+exports.useSeoMeta = useSeoMeta;
 exports.useServerBodyAttrs = useServerBodyAttrs;
 exports.useServerHead = useServerHead;
 exports.useServerHtmlAttrs = useServerHtmlAttrs;

package/dist/index.d.ts

@@ -29,7 +29,6 @@ declare const EventHandlersPlugin: () => _unhead_schema.HeadPlugin;
 
 declare type Arrayable<T> = T | Array<T>;
 declare function asArray<T>(value: Arrayable<T>): T[];
-declare function hashCode(s: string): string;
 declare const HasElementTags: string[];
 
 declare function useHead<T extends Head>(input: T, options?: HeadEntryOptions): ActiveHeadEntry<T> | void;
@@ -37,6 +36,7 @@ declare const useTagTitle: (title: Title) => ActiveHeadEntry<any> | void;
 declare const useTagBase: (base: Base) => ActiveHeadEntry<any> | void;
 declare const useTagMeta: (meta: Arrayable<Meta>) => ActiveHeadEntry<any> | void;
 declare const useTagMetaFlat: (meta: MetaFlatInput) => ActiveHeadEntry<any> | void;
+declare const useSeoMeta: (meta: MetaFlatInput) => ActiveHeadEntry<any> | void;
 declare const useTagLink: (link: Arrayable<Link>) => ActiveHeadEntry<any> | void;
 declare const useTagScript: (script: Arrayable<Script>) => ActiveHeadEntry<any> | void;
 declare const useTagStyle: (style: Arrayable<Style>) => ActiveHeadEntry<any> | void;
@@ -59,10 +59,19 @@ declare const useServerBodyAttrs: (attrs: BodyAttributes) => ActiveHeadEntry<any
 declare const useServerTitleTemplate: (titleTemplate: TitleTemplate) => ActiveHeadEntry<any> | void;
 
 declare let activeHead: Unhead<any> | undefined;
-declare const setActiveHead: <T extends Unhead<_unhead_schema.Head<_unhead_schema.SchemaAugmentations>>>(head: T | undefined) => T | undefined;
-declare const getActiveHead: <T extends Unhead<_unhead_schema.Head<_unhead_schema.SchemaAugmentations>>>() => T;
+declare const setActiveHead: (head: Unhead<any> | undefined) => Unhead<any> | undefined;
+declare const getActiveHead: () => Unhead<any> | undefined;
 
+declare const CorePlugins: () => _unhead_schema.HeadPlugin[];
+declare const DOMPlugins: (options?: CreateHeadOptions) => _unhead_schema.HeadPlugin[];
 declare function createHead<T extends {} = Head>(options?: CreateHeadOptions): Unhead<T>;
+/**
+ * Creates a core instance of unhead. Does not provide a global ctx for composables to work
+ * and does not register DOM plugins.
+ *
+ * @param options
+ */
+declare function createHeadCore<T extends {} = Head>(options?: CreateHeadOptions): Unhead<T>;
 
 declare function defineHeadPlugin(plugin: HeadPlugin): HeadPlugin;
 
@@ -74,4 +83,4 @@ declare const unheadComposablesImports: {
     imports: string[];
 }[];
 
-export { Arrayable, DedupesTagsPlugin, DedupesTagsPluginOptions, DeprecatedTagAttrPlugin, EventHandlersPlugin, HasElementTags, PatchDomOnEntryUpdatesPlugin, ProvideTagHashPlugin, SortTagsPlugin, TitleTemplatePlugin, activeHead, asArray, composableNames, createHead, defineHeadPlugin, getActiveHead, hashCode, normaliseEntryTags, setActiveHead, unheadComposablesImports, useBodyAttrs, useHead, useHtmlAttrs, useServerBodyAttrs, useServerHead, useServerHtmlAttrs, useServerTagBase, useServerTagLink, useServerTagMeta, useServerTagMetaFlat, useServerTagNoscript, useServerTagScript, useServerTagStyle, useServerTagTitle, useServerTitleTemplate, useTagBase, useTagLink, useTagMeta, useTagMetaFlat, useTagNoscript, useTagScript, useTagStyle, useTagTitle, useTitleTemplate };
+export { Arrayable, CorePlugins, DOMPlugins, DedupesTagsPlugin, DedupesTagsPluginOptions, DeprecatedTagAttrPlugin, EventHandlersPlugin, HasElementTags, PatchDomOnEntryUpdatesPlugin, ProvideTagHashPlugin, SortTagsPlugin, TitleTemplatePlugin, activeHead, asArray, composableNames, createHead, createHeadCore, defineHeadPlugin, getActiveHead, normaliseEntryTags, setActiveHead, unheadComposablesImports, useBodyAttrs, useHead, useHtmlAttrs, useSeoMeta, useServerBodyAttrs, useServerHead, useServerHtmlAttrs, useServerTagBase, useServerTagLink, useServerTagMeta, useServerTagMetaFlat, useServerTagNoscript, useServerTagScript, useServerTagStyle, useServerTagTitle, useServerTitleTemplate, useTagBase, useTagLink, useTagMeta, useTagMetaFlat, useTagNoscript, useTagScript, useTagStyle, useTagTitle, useTitleTemplate };

package/dist/index.mjs

@@ -1,4 +1,5 @@
 import { createHooks } from 'hookable';
+import { hashCode } from '@unhead/dom';
 
 const ValidHeadTags = [
   "title",
@@ -482,16 +483,18 @@ 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;
           $el.setAttribute(eventDedupeKey, "");
           $eventListenerTarget.addEventListener(eventName, handler);
-          ctx.entry._sde[sdeKey] = () => {
-            $eventListenerTarget.removeEventListener(eventName, handler);
-            $el.removeAttribute(eventDedupeKey);
-          };
+          if (ctx.entry) {
+            ctx.entry._sde[sdeKey] = () => {
+              $eventListenerTarget.removeEventListener(eventName, handler);
+              $el.removeAttribute(eventDedupeKey);
+            };
+          }
         });
         if (ctx.tag._delayedSrc) {
           $el.setAttribute("src", ctx.tag._delayedSrc);
@@ -504,12 +507,6 @@ const EventHandlersPlugin = () => {
 function asArray(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",
@@ -525,15 +522,18 @@ const getActiveHead = () => activeHead;
 
 function useHead(input, options = {}) {
   const head = getActiveHead();
-  const isBrowser = IsBrowser || head.resolvedOptions?.document;
-  if (options.mode === "server" && isBrowser || options.mode === "client" && !isBrowser)
-    return;
-  return head.push(input, options);
+  if (head) {
+    const isBrowser = IsBrowser || head.resolvedOptions?.document;
+    if (options.mode === "server" && isBrowser || options.mode === "client" && !isBrowser)
+      return;
+    return head.push(input, options);
+  }
 }
 const useTagTitle = (title) => useHead({ title });
 const useTagBase = (base) => useHead({ base });
 const useTagMeta = (meta) => useHead({ meta: asArray(meta) });
 const useTagMetaFlat = (meta) => useTagMeta(unpackMeta(meta));
+const useSeoMeta = useTagMetaFlat;
 const useTagLink = (link) => useHead({ link: asArray(link) });
 const useTagScript = (script) => useHead({ script: asArray(script) });
 const useTagStyle = (style) => useHead({ style: asArray(style) });
@@ -569,7 +569,26 @@ function normaliseEntryTags(e) {
   });
 }
 
+const CorePlugins = () => [
+  DedupesTagsPlugin(),
+  SortTagsPlugin(),
+  TitleTemplatePlugin(),
+  ProvideTagHashPlugin(),
+  EventHandlersPlugin(),
+  DeprecatedTagAttrPlugin()
+];
+const DOMPlugins = (options = {}) => [
+  PatchDomOnEntryUpdatesPlugin({ document: options?.document, delayFn: options?.domDelayFn })
+];
 function createHead(options = {}) {
+  const head = createHeadCore({
+    ...options,
+    plugins: [...DOMPlugins(options), ...options?.plugins || []]
+  });
+  setActiveHead(head);
+  return head;
+}
+function createHeadCore(options = {}) {
   let entries = [];
   let _sde = {};
   let _eid = 0;
@@ -577,17 +596,11 @@ function createHead(options = {}) {
   if (options?.hooks)
     hooks.addHooks(options.hooks);
   options.plugins = [
-    DeprecatedTagAttrPlugin(),
-    DedupesTagsPlugin(),
-    SortTagsPlugin(),
-    TitleTemplatePlugin(),
-    EventHandlersPlugin(),
-    ProvideTagHashPlugin(),
-    PatchDomOnEntryUpdatesPlugin({ document: options?.document, delayFn: options?.domDelayFn }),
+    ...CorePlugins(),
     ...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() {
@@ -605,27 +618,23 @@ function createHead(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;
           });
@@ -653,7 +662,6 @@ function createHead(options = {}) {
     }
   };
   head.hooks.callHook("init", head);
-  setActiveHead(head);
   return head;
 }
 
@@ -670,6 +678,7 @@ const composableNames = [
   "useTagBase",
   "useTagMeta",
   "useTagMetaFlat",
+  "useSeoMeta",
   "useTagLink",
   "useTagScript",
   "useTagStyle",
@@ -697,4 +706,4 @@ const unheadComposablesImports = [
   }
 ];
 
-export { DedupesTagsPlugin, DeprecatedTagAttrPlugin, EventHandlersPlugin, HasElementTags, PatchDomOnEntryUpdatesPlugin, ProvideTagHashPlugin, SortTagsPlugin, TitleTemplatePlugin, activeHead, asArray, composableNames, createHead, defineHeadPlugin, getActiveHead, hashCode, normaliseEntryTags, setActiveHead, unheadComposablesImports, useBodyAttrs, useHead, useHtmlAttrs, useServerBodyAttrs, useServerHead, useServerHtmlAttrs, useServerTagBase, useServerTagLink, useServerTagMeta, useServerTagMetaFlat, useServerTagNoscript, useServerTagScript, useServerTagStyle, useServerTagTitle, useServerTitleTemplate, useTagBase, useTagLink, useTagMeta, useTagMetaFlat, useTagNoscript, useTagScript, useTagStyle, useTagTitle, useTitleTemplate };
+export { CorePlugins, DOMPlugins, DedupesTagsPlugin, DeprecatedTagAttrPlugin, EventHandlersPlugin, HasElementTags, PatchDomOnEntryUpdatesPlugin, ProvideTagHashPlugin, SortTagsPlugin, TitleTemplatePlugin, activeHead, asArray, composableNames, createHead, createHeadCore, defineHeadPlugin, getActiveHead, normaliseEntryTags, setActiveHead, unheadComposablesImports, useBodyAttrs, useHead, useHtmlAttrs, useSeoMeta, useServerBodyAttrs, useServerHead, useServerHtmlAttrs, useServerTagBase, useServerTagLink, useServerTagMeta, useServerTagMetaFlat, useServerTagNoscript, useServerTagScript, useServerTagStyle, useServerTagTitle, useServerTitleTemplate, useTagBase, useTagLink, useTagMeta, useTagMetaFlat, useTagNoscript, useTagScript, useTagStyle, useTagTitle, useTitleTemplate };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "unhead",
   "type": "module",
-  "version": "0.6.5",
+  "version": "0.6.7",
   "packageManager": "pnpm@7.14.0",
   "author": "Harlan Wilton <harlan@harlanzw.com>",
   "license": "MIT",
@@ -30,8 +30,8 @@
     "dist"
   ],
   "dependencies": {
-    "@unhead/dom": "0.6.5",
-    "@unhead/schema": "0.6.5",
+    "@unhead/dom": "0.6.7",
+    "@unhead/schema": "0.6.7",
     "hookable": "^5.4.1"
   },
   "devDependencies": {