unjs · Mar 8, 2025 · Mar 10, 2025 · Mar 11, 2025 · Mar 11, 2025 · Mar 11, 2025
diff --git a/bench/bundle/last.json b/bench/bundle/last.json
@@ -1,10 +1,10 @@
 {
   "client": {
-    "size": 11030,
-    "gz": 4593
+    "size": 10978,
+    "gz": 4574
   },
   "server": {
-    "size": 8242,
-    "gz": 3467
+    "size": 8181,
+    "gz": 3448
   }
 }
diff --git a/docs/plugins/6.template-params.md b/docs/plugins/6.template-params.md
@@ -13,7 +13,7 @@ First, add the plugin to your Unhead configuration:
 
 ::code-block
 ```ts [Input]
-import { TemplateParamsPlugin } from '@unhead/plugins'
+import { TemplateParamsPlugin } from 'unhead/plugins'
 import { createHead } from 'unhead'
 
 const head = createHead({

diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "unhead-monorepo",
   "type": "module",
-  "version": "2.0.0-rc.9",
+  "version": "2.0.0-rc.10",
   "private": "true",
   "packageManager": "pnpm@10.5.2",
   "author": "Harlan Wilton <harlan@harlanzw.com>",
@@ -28,8 +28,8 @@
     "twoslash:verify": "nuxt-content-twoslash verify --content-dir docs"
   },
   "devDependencies": {
-    "@arethetypeswrong/cli": "0.17.4",
     "@antfu/eslint-config": "^4.5.1",
+    "@arethetypeswrong/cli": "0.17.4",
     "@types/fs-extra": "^11.0.4",
     "@types/jsdom": "^21.1.7",
     "acorn-loose": "^8.4.0",

diff --git a/packages/addons/build.config.ts b/packages/addons/build.config.ts
@@ -12,6 +12,9 @@ export default defineBuildConfig({
     'vite',
     'webpack',
     'rollup',
+    'unhead',
     'unplugin',
+    'unhead/plugins',
+    'unhead/utils'
   ],
 })
diff --git a/packages/addons/package.json b/packages/addons/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@unhead/addons",
   "type": "module",
-  "version": "2.0.0-rc.9",
+  "version": "2.0.0-rc.10",
   "author": "Harlan Wilton <harlan@harlanzw.com>",
   "license": "MIT",
   "funding": "https://github.com/sponsors/harlan-zw",
@@ -47,17 +47,14 @@
     }
   },
   "files": [
-    "dist",
-    "*.d.ts"
+    "*.d.ts",
+    "dist"
   ],
   "scripts": {
     "build": "unbuild",
     "stub": "unbuild --stub",
     "test:attw": "attw --pack"
   },
-  "peerDependencies": {
-    "unhead": "workspace:*"
-  },
   "dependencies": {
     "@rollup/pluginutils": "^5.1.4",
     "estree-walker": "^3.0.3",

diff --git a/packages/addons/vite.d.ts b/packages/addons/vite.d.ts
@@ -1,2 +1 @@
-
 export * from './dist/client'
diff --git a/packages/angular/package.json b/packages/angular/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@unhead/angular",
   "type": "module",
-  "version": "2.0.0-rc.9",
+  "version": "2.0.0-rc.10",
   "description": "Full-stack <head> manager built for Angular.",
   "author": "Harlan Wilton <harlan@harlanzw.com>",
   "license": "MIT",

diff --git a/packages/react/package.json b/packages/react/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@unhead/react",
   "type": "module",
-  "version": "2.0.0-rc.9",
+  "version": "2.0.0-rc.10",
   "author": "Harlan Wilton <harlan@harlanzw.com>",
   "license": "MIT",
   "funding": "https://github.com/sponsors/harlan-zw",

diff --git a/packages/schema-org/build.config.ts b/packages/schema-org/build.config.ts
@@ -25,5 +25,12 @@ export default defineBuildConfig({
     'unplugin-vue-components',
     'vue',
     '@vue/runtime-core',
+    '@unhead/react',
+    '@unhead/solid-js',
+    '@unhead/svelte',
+    '@unhead/vue',
+    'unhead',
+    'unhead/utils',
+    'unhead/plugins',
   ],
 })
diff --git a/packages/schema-org/package.json b/packages/schema-org/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@unhead/schema-org",
   "type": "module",
-  "version": "2.0.0-rc.9",
+  "version": "2.0.0-rc.10",
   "description": "Unhead Schema.org for Simple and Automated Google Rich Results",
   "author": "Harlan Wilton <harlan@harlanzw.com>",
   "license": "MIT",
@@ -76,27 +76,6 @@
     "lint": "eslint \"{src,test}/**/*.{ts,vue,json,yml}\" --fix",
     "test:attw": "attw --pack"
   },
-  "peerDependencies": {
-    "@unhead/react": "^2",
-    "@unhead/solid-js": "^2",
-    "@unhead/svelte": "^2",
-    "@unhead/vue": "^2",
-    "unhead": "^2"
-  },
-  "peerDependenciesMeta": {
-    "@unhead/react": {
-      "optional": true
-    },
-    "@unhead/solid-js": {
-      "optional": true
-    },
-    "@unhead/svelte": {
-      "optional": true
-    },
-    "@unhead/vue": {
-      "optional": true
-    }
-  },
   "dependencies": {
     "defu": "^6.1.4",
     "ohash": "^2.0.10",

diff --git a/packages/schema-org/test/vue/vue.test.ts b/packages/schema-org/test/vue/vue.test.ts
@@ -1,9 +1,11 @@
-import { defineArticle, defineWebPage, useSchemaOrg } from '@unhead/schema-org/vue'
+import { defineArticle, defineWebPage, defineWebSite, useSchemaOrg } from '@unhead/schema-org/vue'
 import { useHead } from '@unhead/vue'
 import { createHead as createClientHead, renderDOMHead } from '@unhead/vue/client'
 import { renderSSRHead } from '@unhead/vue/server'
 import { describe, expect, it } from 'vitest'
+import { computed, ref } from 'vue'
 import { useDom } from '../../../unhead/test/fixtures'
+import { createHead as createServerHead } from '../../../vue/src/server'
 import { ssrVueAppWithUnhead } from '../../../vue/test/util'
 
 describe('schema.org e2e', () => {
@@ -150,4 +152,72 @@ describe('schema.org e2e', () => {
       }
     `)
   })
+  it('ref simple', async () => {
+    const head = createServerHead({
+      disableDefaults: true,
+    })
+    useSchemaOrg([
+      defineWebSite(ref({
+        name: 'Test',
+      })),
+    ], { head })
+
+    const data = await renderSSRHead(head)
+    expect(data.bodyTags).toMatchInlineSnapshot(`
+      "<script type="application/ld+json" data-hid="schema-org-graph">{
+        "@context": "https://schema.org",
+        "@graph": [
+          {
+            "@id": "#/schema//d006e97",
+            "name": "Test"
+          }
+        ]
+      }</script>"
+    `)
+  })
+
+  it('refs', async () => {
+    const head = createServerHead({
+      disableDefaults: true,
+      init: [
+        {
+          templateParams: {
+            // @ts-expect-error untyped
+            schemaOrg: computed(() => {
+              return {
+                inLanguage: ref('foo'),
+              }
+            }),
+          },
+        },
+      ],
+    })
+    useSchemaOrg([
+      defineWebPage(computed(() => ({
+        name: ref('test'),
+        foo: computed(() => 'bar'),
+      }))),
+      defineWebSite(ref({
+        name: 'Test',
+      })),
+    ], { head })
+
+    const data = await renderSSRHead(head)
+    expect(data.bodyTags).toMatchInlineSnapshot(`
+      "<script type="application/ld+json" data-hid="schema-org-graph">{
+        "@context": "https://schema.org",
+        "@graph": [
+          {
+            "@id": "#/schema//6b94a87",
+            "foo": "bar",
+            "name": "test"
+          },
+          {
+            "@id": "#/schema//d006e97",
+            "name": "Test"
+          }
+        ]
+      }</script>"
+    `)
+  })
 })
diff --git a/packages/solid-js/package.json b/packages/solid-js/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@unhead/solid-js",
   "type": "module",
-  "version": "2.0.0-rc.9",
+  "version": "2.0.0-rc.10",
   "author": "Harlan Wilton <harlan@harlanzw.com>",
   "license": "MIT",
   "funding": "https://github.com/sponsors/harlan-zw",

diff --git a/packages/svelte/package.json b/packages/svelte/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@unhead/svelte",
   "type": "module",
-  "version": "2.0.0-rc.9",
+  "version": "2.0.0-rc.10",
   "author": "Harlan Wilton <harlan@harlanzw.com>",
   "license": "MIT",
   "funding": "https://github.com/sponsors/harlan-zw",

diff --git a/packages/unhead/package.json b/packages/unhead/package.json
@@ -1,7 +1,7 @@
 {
   "name": "unhead",
   "type": "module",
-  "version": "2.0.0-rc.9",
+  "version": "2.0.0-rc.10",
   "description": "Full-stack <head> manager built for any framework.",
   "author": {
     "name": "Harlan Wilton",

diff --git a/packages/unhead/src/scripts/useScript.ts b/packages/unhead/src/scripts/useScript.ts
@@ -145,7 +145,7 @@ export function useScript<T extends Record<symbol | string, any> = Record<symbol
         href,
         rel,
         crossorigin: typeof input.crossorigin !== 'undefined' ? input.crossorigin : (isCrossOrigin ? 'anonymous' : undefined),
-        referrerpolicy:  typeof input.referrerpolicy !== 'undefined' ? input.referrerpolicy : (isCrossOrigin ? 'no-referrer' : undefined),
+        referrerpolicy: typeof input.referrerpolicy !== 'undefined' ? input.referrerpolicy : (isCrossOrigin ? 'no-referrer' : undefined),
         fetchpriority: typeof input.fetchpriority !== 'undefined' ? input.fetchpriority : 'low',
         integrity: input.integrity,
         as: rel === 'preload' ? 'script' : undefined,

diff --git a/packages/unhead/src/server/createHead.ts b/packages/unhead/src/server/createHead.ts
@@ -12,6 +12,7 @@ export function createHead<T = ResolvableHead>(options: CreateServerHeadOptions
         if (k && k.startsWith('on') && typeof v === 'function') {
           return `this.dataset.${k}fired = true`
         }
+        return v
       },
     ],
     init: [

diff --git a/packages/unhead/src/types/head.ts b/packages/unhead/src/types/head.ts
@@ -93,7 +93,7 @@ export interface ActiveHeadEntry<Input> {
   _poll: (rm?: boolean) => void
 }
 
-export type PropResolver = (key: string, value: any, tag?: HeadTag) => any
+export type PropResolver = (key?: string, value?: any, tag?: HeadTag) => any
 
 export interface CreateHeadOptions {
   document?: Document

diff --git a/packages/unhead/src/utils/normalize.ts b/packages/unhead/src/utils/normalize.ts
@@ -112,7 +112,6 @@ function normalizeTag(tagName: HeadTag['tag'], _input: HeadTag['props'] | string
     : { [(tagName === 'script' || tagName === 'noscript' || tagName === 'style') ? 'innerHTML' : 'textContent']: _input }
 
   const tag = normalizeProps({ tag: tagName, props: {} }, input)
-
   if (tag.key && DupeableTags.has(tag.tag)) {
     tag.props['data-hid'] = tag._h = tag.key
   }
@@ -131,22 +130,21 @@ export function normalizeEntryToTags(input: any, propResolvers: PropResolver[]):
   if (!input) {
     return []
   }
-
-  const tags: (HeadTag | HeadTag[])[] = []
-
   if (typeof input === 'function') {
-    return normalizeEntryToTags(input(), propResolvers)
+    input = input()
   }
-  input = walkResolver(input, (key, val) => {
-    let res = val
+  const resolvers = (key?: string, val?: any) => {
     for (let i = 0; i < propResolvers.length; i++) {
-      const v = propResolvers[i](key, res)
-      if (v !== undefined)
-        res = v
+      val = propResolvers[i](key, val)
     }
-    return res
-  })
-  Object.entries(input).forEach(([key, value]) => {
+    return val
+  }
+  input = resolvers(undefined, input)
+
+  const tags: (HeadTag | HeadTag[])[] = []
+
+  input = walkResolver(input, resolvers)
+  Object.entries(input || {}).forEach(([key, value]) => {
     if (value === undefined)
       return
     for (const v of (Array.isArray(value) ? value : [value]))

diff --git a/packages/unhead/src/utils/walkResolver.ts b/packages/unhead/src/utils/walkResolver.ts
@@ -4,16 +4,15 @@ export function walkResolver(val: any, resolve?: PropResolver, key?: string): an
   // Combined primitive type check
   const type = typeof val
 
-  let v: any
-  if (!resolve || !key) {
-    v = type === 'function' ? val() : val
+  if (type === 'function') {
+    if (!key || (key !== 'titleTemplate' && !(key[0] === 'o' && key[1] === 'n'))) {
+      val = val()
+    }
   }
-  else if (resolve && (key === 'titleTemplate' || (key[0] === 'o' && key[1] === 'n'))) {
+  let v: any
+  if (resolve) {
     v = resolve(key, val)
   }
-  else if (resolve) {
-    v = type === 'function' ? resolve(key, val()) : resolve(key, val)
-  }
 
   if (Array.isArray(v)) {
     return v.map(r => walkResolver(r, resolve))

diff --git a/packages/unhead/test/fixtures.ts b/packages/unhead/test/fixtures.ts
@@ -5,7 +5,7 @@ import { JSDOM } from 'jsdom'
 export function useDom(payload?: Partial<SSRHeadPayload>, extra?: Partial<SSRHeadPayload>) {
   if (typeof window !== 'undefined') {
     // reset all window.document.documentElement attributes
-    window.document.documentElement.getAttributeNames().forEach(name => {
+    window.document.documentElement.getAttributeNames().forEach((name) => {
       window.document.documentElement.removeAttribute(name)
     })
     // just apply the below to the current document

diff --git a/packages/unhead/test/unit/server/util.test.ts b/packages/unhead/test/unit/server/util.test.ts
@@ -8,7 +8,12 @@ describe('propsToString', () => {
     })).toStrictEqual(' a="b"')
     expect(propsToString({})).toStrictEqual('')
   })
-
+  it ('class / style strings', () => {
+    expect(propsToString({
+      class: 'a b',
+      style: 'color: red; font-size: 12px',
+    })).toStrictEqual(' class="a b" style="color: red; font-size: 12px"')
+  })
   it('stringifies all properties correctly', async () => {
     expect(propsToString({
       'array': ['a', 1],

diff --git a/packages/vue/package.json b/packages/vue/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@unhead/vue",
   "type": "module",
-  "version": "2.0.0-rc.9",
+  "version": "2.0.0-rc.10",
   "description": "Full-stack <head> manager built for Vue.",
   "author": "Harlan Wilton <harlan@harlanzw.com>",
   "license": "MIT",

diff --git a/packages/vue/test/unit/ssr/examples.test.ts b/packages/vue/test/unit/ssr/examples.test.ts
@@ -147,4 +147,26 @@ describe('vue ssr examples', () => {
       }
     `)
   })
+  it('https://github.com/vite-pwa/vite-plugin-pwa/discussions/832', async () => {
+    const head = await ssrVueAppWithUnhead(() => {
+      useHead(ref({
+        link: [
+          {
+            rel: 'manifest',
+            href: '/manifest.webmanifest',
+          },
+        ],
+      }))
+    })
+    const ctx = await renderSSRHead(head)
+    expect(ctx).toMatchInlineSnapshot(`
+      {
+        "bodyAttrs": "",
+        "bodyTags": "",
+        "bodyTagsOpen": "",
+        "headTags": "<link rel="manifest" href="/manifest.webmanifest">",
+        "htmlAttrs": "",
+      }
+    `)
+  })
 })
diff --git a/packages/vue/test/unit/useScript.test.ts b/packages/vue/test/unit/useScript.test.ts
@@ -4,8 +4,8 @@ import { renderSSRHead } from '@unhead/vue/server'
 import { describe, it } from 'vitest'
 import { ref, watch } from 'vue'
 import { useDom } from '../../../unhead/test/util'
-import { useScript } from '../../src/scripts/useScript'
 import { createHeadCore } from '../../src'
+import { useScript } from '../../src/scripts/useScript'
 
 describe('vue e2e scripts', () => {
   it('multiple active promise handles', async () => {

diff --git a/packages/vue/test/util.ts b/packages/vue/test/util.ts
@@ -30,14 +30,14 @@ export function csrVueAppWithUnhead(dom: JSDOM, fn: () => void | Promise<void>,
   return head
 }
 
-export async function ssrVueAppWithUnhead(fn: () => void | Promise<void>, options?: CreateHeadOptions) {
+export async function ssrVueAppWithUnhead(fn: (head: ReturnType<typeof createServerHead>) => void | Promise<void>, options?: CreateHeadOptions) {
   const head = createServerHead({
     disableDefaults: true,
     ...options,
   })
   const app = createSSRApp({
     async setup() {
-      fn()
+      fn(head)
       return () => '<div>hi</div>'
     },
   })

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml