@unhead/vue 1.0.16 → 1.0.18

package/dist/index.cjs

@@ -160,7 +160,7 @@ async function renderDOMHead(head, options = {}) {
         // convert attributes to object
         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)));
+      const matchIdx = queue.findIndex((ctx2) => ctx2 && (ctx2.tag._d === dedupeKey || $el.isEqualNode?.(ctx2.$el)));
       if (matchIdx !== -1) {
         const ctx2 = queue[matchIdx];
         ctx2.$el = $el;
@@ -1029,6 +1029,20 @@ const useServerTagBase = (base) => useServerHead({ base });
 const useServerHtmlAttrs = (attrs) => useServerHead({ htmlAttrs: attrs });
 const useServerBodyAttrs = (attrs) => useHead({ bodyAttrs: attrs });
 
+const useSeoMeta = (input) => {
+  const headInput = vue.ref({});
+  vue.watchEffect(() => {
+    const resolvedMeta = resolveUnrefHeadInput(input);
+    const { title, titleTemplate, ...meta } = resolvedMeta;
+    headInput.value = {
+      title,
+      titleTemplate,
+      meta: unpackMeta(meta)
+    };
+  });
+  return useHead(headInput);
+};
+
 function useHead(input, options = {}) {
   const head = injectHead();
   if (head) {
@@ -1048,7 +1062,6 @@ const useTagMetaFlat = (meta) => {
   });
   return useHead({ meta: input });
 };
-const useSeoMeta = useTagMetaFlat;
 const useTagLink = (link) => useHead({ link: asArray(link) });
 const useTagScript = (script) => useHead({ script: asArray(script) });
 const useTagStyle = (style) => useHead({ style: asArray(style) });

package/dist/index.d.ts

@@ -142,12 +142,17 @@ declare const useServerTagBase: (base: ReactiveHead['base']) => void | _unhead_s
 declare const useServerHtmlAttrs: (attrs: ReactiveHead['htmlAttrs']) => void | _unhead_schema.ActiveHeadEntry<UseHeadInput<MergeHead>>;
 declare const useServerBodyAttrs: (attrs: ReactiveHead['bodyAttrs']) => void | _unhead_schema.ActiveHeadEntry<UseHeadInput<MergeHead>>;
 
+type UseSeoMetaInput = MaybeComputedRefEntries<MetaFlatInput> & {
+    title?: ReactiveHead['title'];
+    titleTemplate?: ReactiveHead['titleTemplate'];
+};
+declare const useSeoMeta: (input: UseSeoMetaInput) => ActiveHeadEntry<any> | void;
+
 declare function useHead<T extends MergeHead>(input: UseHeadInput<T>, options?: HeadEntryOptions): ActiveHeadEntry<UseHeadInput<T>> | void;
 declare const useTagTitle: (title: ReactiveHead['title']) => void | ActiveHeadEntry<UseHeadInput<MergeHead>>;
 declare const useTitleTemplate: (titleTemplate: ReactiveHead['titleTemplate']) => void | ActiveHeadEntry<UseHeadInput<MergeHead>>;
 declare const useTagMeta: (meta: Arrayable<Meta>) => void | ActiveHeadEntry<UseHeadInput<MergeHead>>;
 declare const useTagMetaFlat: (meta: MaybeComputedRefEntries<MetaFlatInput>) => void | ActiveHeadEntry<UseHeadInput<MergeHead>>;
-declare const useSeoMeta: (meta: MaybeComputedRefEntries<MetaFlatInput>) => void | ActiveHeadEntry<UseHeadInput<MergeHead>>;
 declare const useTagLink: (link: Arrayable<Link>) => void | ActiveHeadEntry<UseHeadInput<MergeHead>>;
 declare const useTagScript: (script: Arrayable<Script>) => void | ActiveHeadEntry<UseHeadInput<MergeHead>>;
 declare const useTagStyle: (style: Arrayable<Style>) => void | ActiveHeadEntry<UseHeadInput<MergeHead>>;
@@ -160,4 +165,4 @@ declare const unheadVueComposablesImports: {
     '@unhead/vue': string[];
 };
 
-export { Arrayable, Base, BodyAttributes, HtmlAttributes, Link, MaybeComputedRef, MaybeComputedRefEntries, MaybeComputedRefOrPromise, MaybeReadonlyRef, Meta, Noscript, ReactiveHead, Script, Style, Title, TitleTemplate, UseHeadInput, Vue2ProvideUnheadPlugin, VueHeadClient, VueHeadMixin, VueReactiveUseHeadPlugin, asArray, createHead, createHeadCore, headSymbol, injectHead, resolveUnrefHeadInput, unheadVueComposablesImports, 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 };
+export { Arrayable, Base, BodyAttributes, HtmlAttributes, Link, MaybeComputedRef, MaybeComputedRefEntries, MaybeComputedRefOrPromise, MaybeReadonlyRef, Meta, Noscript, ReactiveHead, Script, Style, Title, TitleTemplate, UseHeadInput, UseSeoMetaInput, Vue2ProvideUnheadPlugin, VueHeadClient, VueHeadMixin, VueReactiveUseHeadPlugin, asArray, createHead, createHeadCore, headSymbol, injectHead, resolveUnrefHeadInput, unheadVueComposablesImports, 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

@@ -158,7 +158,7 @@ async function renderDOMHead(head, options = {}) {
         // convert attributes to object
         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)));
+      const matchIdx = queue.findIndex((ctx2) => ctx2 && (ctx2.tag._d === dedupeKey || $el.isEqualNode?.(ctx2.$el)));
       if (matchIdx !== -1) {
         const ctx2 = queue[matchIdx];
         ctx2.$el = $el;
@@ -1027,6 +1027,20 @@ const useServerTagBase = (base) => useServerHead({ base });
 const useServerHtmlAttrs = (attrs) => useServerHead({ htmlAttrs: attrs });
 const useServerBodyAttrs = (attrs) => useHead({ bodyAttrs: attrs });
 
+const useSeoMeta = (input) => {
+  const headInput = ref({});
+  watchEffect(() => {
+    const resolvedMeta = resolveUnrefHeadInput(input);
+    const { title, titleTemplate, ...meta } = resolvedMeta;
+    headInput.value = {
+      title,
+      titleTemplate,
+      meta: unpackMeta(meta)
+    };
+  });
+  return useHead(headInput);
+};
+
 function useHead(input, options = {}) {
   const head = injectHead();
   if (head) {
@@ -1046,7 +1060,6 @@ const useTagMetaFlat = (meta) => {
   });
   return useHead({ meta: input });
 };
-const useSeoMeta = useTagMetaFlat;
 const useTagLink = (link) => useHead({ link: asArray(link) });
 const useTagScript = (script) => useHead({ script: asArray(script) });
 const useTagStyle = (style) => useHead({ style: asArray(style) });

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@unhead/vue",
   "type": "module",
-  "version": "1.0.16",
-  "packageManager": "pnpm@7.25.0",
+  "version": "1.0.18",
+  "packageManager": "pnpm@7.25.1",
   "author": "Harlan Wilton <harlan@harlanzw.com>",
   "license": "MIT",
   "funding": "https://github.com/sponsors/harlan-zw",
@@ -34,11 +34,11 @@
   },
   "dependencies": {
     "hookable": "^5.4.2",
-    "@unhead/schema": "1.0.16"
+    "@unhead/schema": "1.0.18"
   },
   "devDependencies": {
     "vue": "^3.2.45",
-    "unhead": "1.0.16"
+    "unhead": "1.0.18"
   },
   "scripts": {
     "build": "unbuild .",