nuxt-og-image 3.0.0-rc.2 → 3.0.0-rc.21

package/dist/client/_nuxt/error-404.DkXpI38i.css

@@ -0,0 +1 @@
+.spotlight[data-v-05a2b8a3]{background:linear-gradient(45deg,#00dc82,#36e4da 50%,#0047e1);bottom:-30vh;filter:blur(20vh);height:40vh}.gradient-border[data-v-05a2b8a3]{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:.5rem;position:relative}@media (prefers-color-scheme:light){.gradient-border[data-v-05a2b8a3]{background-color:#ffffff4d}.gradient-border[data-v-05a2b8a3]:before{background:linear-gradient(90deg,#e2e2e2,#e2e2e2 25%,#00dc82,#36e4da 75%,#0047e1)}}@media (prefers-color-scheme:dark){.gradient-border[data-v-05a2b8a3]{background-color:#1414144d}.gradient-border[data-v-05a2b8a3]:before{background:linear-gradient(90deg,#303030,#303030 25%,#00dc82,#36e4da 75%,#0047e1)}}.gradient-border[data-v-05a2b8a3]:before{background-size:400% auto;border-radius:.5rem;bottom:0;content:"";left:0;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.5;padding:2px;position:absolute;right:0;top:0;transition:background-position .3s ease-in-out,opacity .2s ease-in-out;width:100%}.gradient-border[data-v-05a2b8a3]:hover:before{background-position:-50% 0;opacity:1}.bg-white[data-v-05a2b8a3]{--tw-bg-opacity:1;background-color:rgba(255,255,255,var(--tw-bg-opacity))}.cursor-pointer[data-v-05a2b8a3]{cursor:pointer}.flex[data-v-05a2b8a3]{display:flex}.grid[data-v-05a2b8a3]{display:grid}.place-content-center[data-v-05a2b8a3]{place-content:center}.items-center[data-v-05a2b8a3]{align-items:center}.justify-center[data-v-05a2b8a3]{justify-content:center}.font-sans[data-v-05a2b8a3]{font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji}.font-medium[data-v-05a2b8a3]{font-weight:500}.font-light[data-v-05a2b8a3]{font-weight:300}.text-8xl[data-v-05a2b8a3]{font-size:6rem;line-height:1}.text-xl[data-v-05a2b8a3]{font-size:1.25rem;line-height:1.75rem}.leading-tight[data-v-05a2b8a3]{line-height:1.25}.mb-8[data-v-05a2b8a3]{margin-bottom:2rem}.mb-16[data-v-05a2b8a3]{margin-bottom:4rem}.max-w-520px[data-v-05a2b8a3]{max-width:520px}.min-h-screen[data-v-05a2b8a3]{min-height:100vh}.overflow-hidden[data-v-05a2b8a3]{overflow:hidden}.px-8[data-v-05a2b8a3]{padding-left:2rem;padding-right:2rem}.py-2[data-v-05a2b8a3]{padding-bottom:.5rem;padding-top:.5rem}.px-4[data-v-05a2b8a3]{padding-left:1rem;padding-right:1rem}.fixed[data-v-05a2b8a3]{position:fixed}.left-0[data-v-05a2b8a3]{left:0}.right-0[data-v-05a2b8a3]{right:0}.text-center[data-v-05a2b8a3]{text-align:center}.text-black[data-v-05a2b8a3]{--tw-text-opacity:1;color:rgba(0,0,0,var(--tw-text-opacity))}.antialiased[data-v-05a2b8a3]{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.w-full[data-v-05a2b8a3]{width:100%}.z-10[data-v-05a2b8a3]{z-index:10}.z-20[data-v-05a2b8a3]{z-index:20}@media (min-width:640px){.sm\:text-4xl[data-v-05a2b8a3]{font-size:2.25rem;line-height:2.5rem}.sm\:text-xl[data-v-05a2b8a3]{font-size:1.25rem;line-height:1.75rem}.sm\:text-10xl[data-v-05a2b8a3]{font-size:10rem;line-height:1}.sm\:px-0[data-v-05a2b8a3]{padding-left:0;padding-right:0}.sm\:py-3[data-v-05a2b8a3]{padding-bottom:.75rem;padding-top:.75rem}.sm\:px-6[data-v-05a2b8a3]{padding-left:1.5rem;padding-right:1.5rem}}@media (prefers-color-scheme:dark){.dark\:bg-black[data-v-05a2b8a3]{--tw-bg-opacity:1;background-color:rgba(0,0,0,var(--tw-bg-opacity))}.dark\:text-white[data-v-05a2b8a3]{--tw-text-opacity:1;color:rgba(255,255,255,var(--tw-text-opacity))}}

package/dist/client/_nuxt/{error-404.4c6f5cb5.js → error-404.otiE3NMh.js}

@@ -1 +1 @@
-import{_ as a,u as n,o as r,c as l,a as e,t as s,b as d,w as c,d as p,e as f,p as x,f as h}from"./entry.e9f3db7f.js";const m=t=>(x("data-v-05a2b8a3"),t=t(),h(),t),u={class:"font-sans antialiased bg-white dark:bg-black text-black dark:text-white grid min-h-screen place-content-center overflow-hidden"},g=m(()=>e("div",{class:"fixed left-0 right-0 spotlight z-10"},null,-1)),b={class:"max-w-520px text-center z-20"},_=["textContent"],w=["textContent"],y={class:"w-full flex items-center justify-center"},S={__name:"error-404",props:{appName:{type:String,default:"Nuxt"},version:{type:String,default:""},statusCode:{type:Number,default:404},statusMessage:{type:String,default:"Not Found"},description:{type:String,default:"Sorry, the page you are looking for could not be found."},backHome:{type:String,default:"Go back home"}},setup(t){const o=t;return n({title:`${o.statusCode} - ${o.statusMessage} | ${o.appName}`,script:[],style:[{children:'*,:before,:after{-webkit-box-sizing:border-box;box-sizing:border-box;border-width:0;border-style:solid;border-color:#e0e0e0}*{--tw-ring-inset:var(--tw-empty, );--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(14, 165, 233, .5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000}:root{-moz-tab-size:4;-o-tab-size:4;tab-size:4}a{color:inherit;text-decoration:inherit}body{margin:0;font-family:inherit;line-height:inherit}html{-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";line-height:1.5}h1,p{margin:0}h1{font-size:inherit;font-weight:inherit}'}]}),(k,v)=>{const i=f;return r(),l("div",u,[g,e("div",b,[e("h1",{class:"text-8xl sm:text-10xl font-medium mb-8",textContent:s(t.statusCode)},null,8,_),e("p",{class:"text-xl px-8 sm:px-0 sm:text-4xl font-light mb-16 leading-tight",textContent:s(t.description)},null,8,w),e("div",y,[d(i,{to:"/",class:"gradient-border text-md sm:text-xl py-2 px-4 sm:py-3 sm:px-6 cursor-pointer"},{default:c(()=>[p(s(t.backHome),1)]),_:1})])])])}}},z=a(S,[["__scopeId","data-v-05a2b8a3"]]);export{z as default};
+import{_ as a,u as n,o as r,c as l,a as e,t as s,b as d,w as c,d as p,e as f,p as h,f as m}from"./entry.PzX7bU7i.js";const x=t=>(h("data-v-05a2b8a3"),t=t(),m(),t),u={class:"font-sans antialiased bg-white dark:bg-black text-black dark:text-white grid min-h-screen place-content-center overflow-hidden"},g=x(()=>e("div",{class:"fixed left-0 right-0 spotlight z-10"},null,-1)),b={class:"max-w-520px text-center z-20"},_=["textContent"],w=["textContent"],y={class:"w-full flex items-center justify-center"},S={__name:"error-404",props:{appName:{type:String,default:"Nuxt"},version:{type:String,default:""},statusCode:{type:Number,default:404},statusMessage:{type:String,default:"Not Found"},description:{type:String,default:"Sorry, the page you are looking for could not be found."},backHome:{type:String,default:"Go back home"}},setup(t){const o=t;return n({title:`${o.statusCode} - ${o.statusMessage} | ${o.appName}`,script:[],style:[{children:'*,:before,:after{-webkit-box-sizing:border-box;box-sizing:border-box;border-width:0;border-style:solid;border-color:#e0e0e0}*{--tw-ring-inset:var(--tw-empty, );--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(14, 165, 233, .5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000}:root{-moz-tab-size:4;-o-tab-size:4;tab-size:4}a{color:inherit;text-decoration:inherit}body{margin:0;font-family:inherit;line-height:inherit}html{-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";line-height:1.5}h1,p{margin:0}h1{font-size:inherit;font-weight:inherit}'}]}),(k,N)=>{const i=f;return r(),l("div",u,[g,e("div",b,[e("h1",{class:"text-8xl sm:text-10xl font-medium mb-8",textContent:s(t.statusCode)},null,8,_),e("p",{class:"text-xl px-8 sm:px-0 sm:text-4xl font-light mb-16 leading-tight",textContent:s(t.description)},null,8,w),e("div",y,[d(i,{to:"/",class:"gradient-border text-md sm:text-xl py-2 px-4 sm:py-3 sm:px-6 cursor-pointer"},{default:c(()=>[p(s(t.backHome),1)]),_:1})])])])}}},z=a(S,[["__scopeId","data-v-05a2b8a3"]]);export{z as default};

package/dist/client/_nuxt/{error-500.64875434.js → error-500.T9RozdMh.js}

@@ -1 +1 @@
-import{_ as i,u as a,o as r,c as n,a as e,t as s,p as l,f as d}from"./entry.e9f3db7f.js";const c=t=>(l("data-v-c967d9a9"),t=t(),d(),t),p={class:"font-sans antialiased bg-white dark:bg-black text-black dark:text-white grid min-h-screen place-content-center overflow-hidden"},h=c(()=>e("div",{class:"fixed -bottom-1/2 left-0 right-0 h-1/2 spotlight"},null,-1)),f={class:"max-w-520px text-center"},g=["textContent"],m=["textContent"],x={__name:"error-500",props:{appName:{type:String,default:"Nuxt"},version:{type:String,default:""},statusCode:{type:Number,default:500},statusMessage:{type:String,default:"Server error"},description:{type:String,default:"This page is temporarily unavailable."}},setup(t){const o=t;return a({title:`${o.statusCode} - ${o.statusMessage} | ${o.appName}`,script:[],style:[{children:'*,:before,:after{-webkit-box-sizing:border-box;box-sizing:border-box;border-width:0;border-style:solid;border-color:#e0e0e0}*{--tw-ring-inset:var(--tw-empty, );--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(14, 165, 233, .5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000}:root{-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{margin:0;font-family:inherit;line-height:inherit}html{-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";line-height:1.5}h1,p{margin:0}h1{font-size:inherit;font-weight:inherit}'}]}),(u,b)=>(r(),n("div",p,[h,e("div",f,[e("h1",{class:"text-8xl sm:text-10xl font-medium mb-8",textContent:s(t.statusCode)},null,8,g),e("p",{class:"text-xl px-8 sm:px-0 sm:text-4xl font-light mb-16 leading-tight",textContent:s(t.description)},null,8,m)])]))}},w=i(x,[["__scopeId","data-v-c967d9a9"]]);export{w as default};
+import{_ as i,u as a,o as r,c as n,a as e,t as s,p as l,f as d}from"./entry.PzX7bU7i.js";const c=t=>(l("data-v-c967d9a9"),t=t(),d(),t),p={class:"font-sans antialiased bg-white dark:bg-black text-black dark:text-white grid min-h-screen place-content-center overflow-hidden"},h=c(()=>e("div",{class:"fixed -bottom-1/2 left-0 right-0 h-1/2 spotlight"},null,-1)),f={class:"max-w-520px text-center"},g=["textContent"],m=["textContent"],x={__name:"error-500",props:{appName:{type:String,default:"Nuxt"},version:{type:String,default:""},statusCode:{type:Number,default:500},statusMessage:{type:String,default:"Server error"},description:{type:String,default:"This page is temporarily unavailable."}},setup(t){const o=t;return a({title:`${o.statusCode} - ${o.statusMessage} | ${o.appName}`,script:[],style:[{children:'*,:before,:after{-webkit-box-sizing:border-box;box-sizing:border-box;border-width:0;border-style:solid;border-color:#e0e0e0}*{--tw-ring-inset:var(--tw-empty, );--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(14, 165, 233, .5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000}:root{-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{margin:0;font-family:inherit;line-height:inherit}html{-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";line-height:1.5}h1,p{margin:0}h1{font-size:inherit;font-weight:inherit}'}]}),(b,u)=>(r(),n("div",p,[h,e("div",f,[e("h1",{class:"text-8xl sm:text-10xl font-medium mb-8",textContent:s(t.statusCode)},null,8,g),e("p",{class:"text-xl px-8 sm:px-0 sm:text-4xl font-light mb-16 leading-tight",textContent:s(t.description)},null,8,m)])]))}},_=i(x,[["__scopeId","data-v-c967d9a9"]]);export{_ as default};

package/dist/client/index.html

@@ -2,15 +2,15 @@
 <html >
 <head><meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
-<link rel="stylesheet" href="/__nuxt-og-image/_nuxt/entry.a30f63d0.css">
-<link rel="modulepreload" as="script" crossorigin href="/__nuxt-og-image/_nuxt/entry.e9f3db7f.js">
-<link rel="prefetch" as="script" crossorigin href="/__nuxt-og-image/_nuxt/vanilla-picker-NKbIFE8h.23409a58.js">
-<link rel="prefetch" as="style" href="/__nuxt-og-image/_nuxt/error-404.b751fa02.css">
-<link rel="prefetch" as="script" crossorigin href="/__nuxt-og-image/_nuxt/error-404.4c6f5cb5.js">
-<link rel="prefetch" as="style" href="/__nuxt-og-image/_nuxt/error-500.69009e70.css">
-<link rel="prefetch" as="script" crossorigin href="/__nuxt-og-image/_nuxt/error-500.64875434.js">
-<script type="module" src="/__nuxt-og-image/_nuxt/entry.e9f3db7f.js" crossorigin></script><script>"use strict";(()=>{const a=window,e=document.documentElement,m=["dark","light"],c=window&&window.localStorage&&window.localStorage.getItem&&window.localStorage.getItem("nuxt-color-mode")||"system";let n=c==="system"?d():c;const l=e.getAttribute("data-color-mode-forced");l&&(n=l),i(n),a["__NUXT_COLOR_MODE__"]={preference:c,value:n,getColorScheme:d,addColorScheme:i,removeColorScheme:f};function i(o){const t=""+o+"",s="";e.classList?e.classList.add(t):e.className+=" "+t,s&&e.setAttribute("data-"+s,o)}function f(o){const t=""+o+"",s="";e.classList?e.classList.remove(t):e.className=e.className.replace(new RegExp(t,"g"),""),s&&e.removeAttribute("data-"+s)}function r(o){return a.matchMedia("(prefers-color-scheme"+o+")")}function d(){if(a.matchMedia&&r("").media!=="not all"){for(const o of m)if(r(":"+o).matches)return o}return"light"}})();
+<link rel="stylesheet" href="/__nuxt-og-image/_nuxt/entry.1-ZveGsq.css">
+<link rel="modulepreload" as="script" crossorigin href="/__nuxt-og-image/_nuxt/entry.PzX7bU7i.js">
+<link rel="prefetch" as="script" crossorigin href="/__nuxt-og-image/_nuxt/vanilla-picker-NKbIFE8h.vtyeXros.js">
+<link rel="prefetch" as="style" href="/__nuxt-og-image/_nuxt/error-404.DkXpI38i.css">
+<link rel="prefetch" as="script" crossorigin href="/__nuxt-og-image/_nuxt/error-404.otiE3NMh.js">
+<link rel="prefetch" as="style" href="/__nuxt-og-image/_nuxt/error-500.SLhS9LVu.css">
+<link rel="prefetch" as="script" crossorigin href="/__nuxt-og-image/_nuxt/error-500.T9RozdMh.js">
+<script type="module" src="/__nuxt-og-image/_nuxt/entry.PzX7bU7i.js" crossorigin></script><script>"use strict";(()=>{const a=window,e=document.documentElement,m=["dark","light"],c=window&&window.localStorage&&window.localStorage.getItem&&window.localStorage.getItem("nuxt-color-mode")||"system";let n=c==="system"?d():c;const l=e.getAttribute("data-color-mode-forced");l&&(n=l),i(n),a["__NUXT_COLOR_MODE__"]={preference:c,value:n,getColorScheme:d,addColorScheme:i,removeColorScheme:f};function i(o){const t=""+o+"",s="";e.classList?e.classList.add(t):e.className+=" "+t,s&&e.setAttribute("data-"+s,o)}function f(o){const t=""+o+"",s="";e.classList?e.classList.remove(t):e.className=e.className.replace(new RegExp(t,"g"),""),s&&e.removeAttribute("data-"+s)}function r(o){return a.matchMedia("(prefers-color-scheme"+o+")")}function d(){if(a.matchMedia&&r("").media!=="not all"){for(const o of m)if(r(":"+o).matches)return o}return"light"}})();
 </script></head>
-<body ><div id="__nuxt"></div><script type="application/json" id="__NUXT_DATA__" data-ssr="false">[{"_errors":1,"serverRendered":2,"data":3,"state":4},{},false,{},{}]</script>
+<body ><div id="__nuxt"></div><script type="application/json" id="__NUXT_DATA__" data-ssr="false">[{"_errors":1,"serverRendered":2,"data":3,"state":4,"once":5},{},false,{},{},["Set"]]</script>
 <script>window.__NUXT__={};window.__NUXT__.config={public:{},app:{baseURL:"/__nuxt-og-image",buildAssetsDir:"/_nuxt/",cdnURL:""}}</script></body>
 </html>

package/dist/module.d.mts

@@ -80,9 +80,14 @@ interface OgImageOptions<T extends keyof OgImageComponents = 'NuxtSeo'> {
     sharp?: SharpOptions;
     fonts?: InputFontConfig[];
     cacheMaxAgeSeconds?: number;
+    /**
+     * @internal
+     */
+    _query?: Record<string, any>;
 }
 interface FontConfig {
     name: string;
+    style?: string;
     weight?: string | number;
     path?: string;
     key?: string;
@@ -90,7 +95,7 @@ interface FontConfig {
 type InputFontConfig = (`${string}:${number}` | string | FontConfig);
 interface RuntimeCompatibilitySchema {
     chromium: 'node' | false;
-    ['css-inline']: 'node' | false;
+    ['css-inline']: 'node' | 'wasm' | 'wasm-fs' | false;
     resvg: 'node' | 'wasm' | 'wasm-fs' | false;
     satori: 'node' | 'wasm' | 'wasm-fs' | false;
     sharp: 'node' | false;

package/dist/module.d.ts

@@ -80,9 +80,14 @@ interface OgImageOptions<T extends keyof OgImageComponents = 'NuxtSeo'> {
     sharp?: SharpOptions;
     fonts?: InputFontConfig[];
     cacheMaxAgeSeconds?: number;
+    /**
+     * @internal
+     */
+    _query?: Record<string, any>;
 }
 interface FontConfig {
     name: string;
+    style?: string;
     weight?: string | number;
     path?: string;
     key?: string;
@@ -90,7 +95,7 @@ interface FontConfig {
 type InputFontConfig = (`${string}:${number}` | string | FontConfig);
 interface RuntimeCompatibilitySchema {
     chromium: 'node' | false;
-    ['css-inline']: 'node' | false;
+    ['css-inline']: 'node' | 'wasm' | 'wasm-fs' | false;
     resvg: 'node' | 'wasm' | 'wasm-fs' | false;
     satori: 'node' | 'wasm' | 'wasm-fs' | false;
     sharp: 'node' | false;

package/dist/module.json

@@ -1,9 +1,9 @@
 {
   "name": "nuxt-og-image",
   "compatibility": {
-    "nuxt": "^3.8.2",
+    "nuxt": "^3.9.0",
     "bridge": false
   },
   "configKey": "ogImage",
-  "version": "3.0.0-rc.2"
+  "version": "3.0.0-rc.20"
 }

package/dist/module.mjs

@@ -14,7 +14,7 @@ import { createHash } from 'node:crypto';
 import { execa } from 'execa';
 import terminate from 'terminate';
 
-const version = "3.0.0-rc.2";
+const version = "3.0.0-rc.20";
 
 const autodetectableProviders = {
   azure_static: "azure",
@@ -62,7 +62,7 @@ const RuntimeCompatibility = {
   "node-server": NodeRuntime,
   "stackblitz": {
     "chromium": false,
-    "css-inline": false,
+    "css-inline": "wasm-fs",
     "resvg": "wasm-fs",
     "satori": "wasm-fs",
     "sharp": false
@@ -71,7 +71,7 @@ const RuntimeCompatibility = {
   "netlify": awsLambda,
   "netlify-edge": {
     "chromium": false,
-    "css-inline": false,
+    "css-inline": "wasm",
     "resvg": "wasm",
     "satori": "node",
     "sharp": false,
@@ -86,7 +86,7 @@ const RuntimeCompatibility = {
   "vercel": awsLambda,
   "vercel-edge": {
     "chromium": false,
-    "css-inline": false,
+    "css-inline": "wasm",
     "resvg": "wasm",
     "satori": "node",
     "sharp": false,
@@ -205,6 +205,9 @@ export {}
     references.push({ path: resolve(nuxt.options.buildDir, `module/${module}.d.ts`) });
   });
 }
+function isNuxtGenerate(nuxt = useNuxt()) {
+  return nuxt.options._generate || nuxt.options.nitro.static || nuxt.options.nitro.preset === "static";
+}
 
 const DEVTOOLS_UI_ROUTE = "/__nuxt-og-image";
 const DEVTOOLS_UI_LOCAL_PORT = 3030;
@@ -295,7 +298,9 @@ function setupGenerateHandler(options, resolve, nuxt = useNuxt()) {
 function setupPrerenderHandler(options, resolve, nuxt = useNuxt()) {
   nuxt.hooks.hook("nitro:init", async (nitro) => {
     nitro.hooks.hook("prerender:config", async (nitroConfig) => {
-      applyNitroPresetCompatibility(nitroConfig, { compatibility: options.compatibility.prerender, resolve });
+      nitroConfig.serverAssets = nitroConfig.serverAssets || [];
+      nitroConfig.serverAssets.push({ baseName: "nuxt-og-image:fonts", dir: resolve("./runtime/server/assets") });
+      applyNitroPresetCompatibility(nitroConfig, { compatibility: options.compatibility?.prerender, resolve });
       nitroConfig.wasm = nitroConfig.wasm || {};
       nitroConfig.wasm.esmImport = false;
       const prerenderingPages = (nuxt.options.nitro.prerender?.routes || []).some((r) => r && (!r.includes(".") || r.includes("*")));
@@ -327,14 +332,16 @@ async function setupBuildHandler(config, resolve, nuxt = useNuxt()) {
         return;
       const configuredEntry = nitro.options.rollupConfig?.output.entryFileNames;
       let serverEntry = resolve(_nitro.options.output.serverDir, typeof configuredEntry === "string" ? configuredEntry : "index.mjs");
-      if (target === "cloudflare-pages")
+      const isCloudflarePages = target === "cloudflare-pages";
+      if (isCloudflarePages)
         serverEntry = resolve(dirname(serverEntry), "./chunks/wasm.mjs");
       const contents = await readFile(serverEntry, "utf-8");
       const resvgHash = sha1(await readFile(await resolvePath("@resvg/resvg-wasm/index_bg.wasm")));
       const yogaHash = sha1(await readFile(await resolvePath("yoga-wasm-web/dist/yoga.wasm")));
+      const cssInlineHash = sha1(await readFile(await resolvePath("@css-inline/css-inline-wasm/index_bg.wasm")));
       const postfix = target === "vercel-edge" ? "?module" : "";
-      const path = target === "cloudflare-pages" ? `../wasm/` : `./wasm/`;
-      await writeFile(serverEntry, contents.replaceAll('"@resvg/resvg-wasm/index_bg.wasm"', `"${path}index_bg-${resvgHash}.wasm${postfix}"`).replaceAll('"yoga-wasm-web/dist/yoga.wasm"', `"${path}yoga-${yogaHash}.wasm${postfix}"`), { encoding: "utf-8" });
+      const path = isCloudflarePages ? `../wasm/` : `./wasm/`;
+      await writeFile(serverEntry, contents.replaceAll('"@resvg/resvg-wasm/index_bg.wasm"', `"${path}index_bg-${resvgHash}.wasm${postfix}"`).replaceAll('"@css-inline/css-inline-wasm/index_bg.wasm"', `"${path}index_bg-${cssInlineHash}.wasm${postfix}"`).replaceAll('"yoga-wasm-web/dist/yoga.wasm"', `"${path}yoga-${yogaHash}.wasm${postfix}"`), { encoding: "utf-8" });
     });
   });
 }
@@ -365,7 +372,7 @@ function normaliseFontInput(fonts) {
       return {
         cacheKey: f,
         name,
-        weight: weight || "400",
+        weight: weight || 400,
         style: "normal",
         path: void 0
       };
@@ -383,7 +390,7 @@ const module = defineNuxtModule({
   meta: {
     name: "nuxt-og-image",
     compatibility: {
-      nuxt: "^3.8.2",
+      nuxt: "^3.9.0",
       bridge: false
     },
     configKey: "ogImage"
@@ -395,6 +402,7 @@ const module = defineNuxtModule({
         emojis: "noto",
         renderer: "satori",
         component: "NuxtSeo",
+        extension: "png",
         width: 1200,
         height: 600,
         // default is to cache the image for 3 day (72 hours)
@@ -418,12 +426,12 @@ const module = defineNuxtModule({
       return;
     }
     const { resolve } = createResolver(import.meta.url);
+    nuxt.options.build.transpile.push(resolve("./runtime"));
     const preset = resolveNitroPreset(nuxt.options.nitro);
     const targetCompatibility = getPresetNitroPresetCompatibility(preset);
     const hasSharpDependency = !!await tryResolveModule("sharp");
     const userConfiguredExtension = config.defaults.extension;
     const hasConfiguredJpegs = userConfiguredExtension && ["jpeg", "jpg"].includes(userConfiguredExtension);
-    config.defaults.extension = userConfiguredExtension || (hasSharpDependency && targetCompatibility.sharp ? "jpg" : "png");
     if (hasConfiguredJpegs && config.defaults.renderer !== "chromium") {
       if (hasSharpDependency && !targetCompatibility.sharp) {
         logger.warn(`Rendering JPEGs requires sharp which does not work with ${preset}. Images will be rendered as PNG at runtime.`);
@@ -603,9 +611,9 @@ const module = defineNuxtModule({
     nuxt.options.nitro.virtual["#nuxt-og-image/component-names.mjs"] = () => {
       return `export const componentNames = ${JSON.stringify(ogImageComponentCtx.components)}`;
     };
-    let unoCssConfig = { theme: {} };
+    let unoCssConfig = {};
     nuxt.hook("tailwindcss:config", (tailwindConfig) => {
-      unoCssConfig = defu(tailwindConfig.theme.extend, { ...tailwindConfig.theme || {}, extend: void 0 });
+      unoCssConfig = defu(tailwindConfig.theme?.extend, { ...tailwindConfig.theme, extend: void 0 });
     });
     nuxt.hook("unocss:config", (_unoCssConfig) => {
       unoCssConfig = { ..._unoCssConfig.theme };
@@ -628,7 +636,7 @@ declare module 'nitropack' {
   }
   interface NitroRuntimeHooks {
     'nuxt-og-image:context': (ctx: import('${typesPath}').OgImageRenderEventContext) => void | Promise<void>
-    'nuxt-og-image:satori:vnodes': (vnodes: import('${typesPath}').VNode, ctx: ctx: import('${typesPath}').OgImageRenderEventContext) => void | Promise<void>
+    'nuxt-og-image:satori:vnodes': (vnodes: import('${typesPath}').VNode, ctx: import('${typesPath}').OgImageRenderEventContext) => void | Promise<void>
   }
 }
 
@@ -641,16 +649,28 @@ ${componentImports}
     });
     const cacheEnabled = typeof config.runtimeCacheStorage !== "undefined" && config.runtimeCacheStorage !== false;
     const runtimeCacheStorage = typeof config.runtimeCacheStorage === "boolean" ? "default" : config.runtimeCacheStorage.driver;
-    let baseCacheKey = runtimeCacheStorage === "default" ? `/cache/nuxt-og-image@${version}` : `/nuxt-og-image@${version}`;
+    let baseCacheKey = runtimeCacheStorage === "default" ? `/cache/nuxt-og-image@${version}` : `/nuxt-og-image/${version}`;
     if (!cacheEnabled)
       baseCacheKey = false;
+    if (!nuxt.options.dev && config.runtimeCacheStorage && typeof config.runtimeCacheStorage === "object") {
+      nuxt.options.nitro.storage = nuxt.options.nitro.storage || {};
+      nuxt.options.nitro.storage["nuxt-og-image"] = config.runtimeCacheStorage;
+    }
     nuxt.hooks.hook("modules:done", async () => {
       const normalisedFonts = normaliseFontInput(config.fonts);
-      if (!nuxt.options._generate && nuxt.options.build) {
+      if (!isNuxtGenerate() && nuxt.options.build) {
+        nuxt.options.nitro = nuxt.options.nitro || {};
         nuxt.options.nitro.prerender = nuxt.options.nitro.prerender || {};
         nuxt.options.nitro.prerender.routes = nuxt.options.nitro.prerender.routes || [];
-        normalisedFonts.filter((f) => !f.path && !f.key).forEach(({ name, weight }) => {
-          nuxt.options.nitro.prerender.routes.push(`/__og-image__/font/${name}/${weight}.ttf`);
+        normalisedFonts.filter((f) => !f.path && !f.key).forEach((entry, key) => {
+          const { name, weight } = entry;
+          if (preset !== "cloudflare") {
+            entry.path = `/__og-image__/font/${name}/${weight}.ttf`;
+            nuxt.options.nitro.prerender.routes.unshift(entry.path);
+          }
+          if (name === "Inter" && [400, 700].includes(Number(weight)))
+            entry.key = `nuxt-og-image:fonts:inter-latin-ext-${weight}-normal.woff`;
+          normalisedFonts[key] = entry;
         });
       }
       const hasColorModeModule = hasNuxtModule("@nuxtjs/color-mode");
@@ -681,7 +701,7 @@ ${componentImports}
     if (nuxt.options.dev) {
       setupDevHandler(config, resolve);
       setupDevToolsUI(config, resolve);
-    } else if (nuxt.options._generate) {
+    } else if (isNuxtGenerate()) {
       setupGenerateHandler(config, resolve);
     } else if (nuxt.options.build) {
       await setupBuildHandler(config, resolve);

package/dist/runtime/cache.d.ts

@@ -1,8 +1,9 @@
+import { type H3Error } from 'h3';
 import type { OgImageRenderEventContext } from './types';
 export declare function useOgImageBufferCache(ctx: OgImageRenderEventContext, options: {
     baseCacheKey: string | false;
     cacheMaxAgeSeconds?: number;
-}): Promise<void | {
+}): Promise<void | H3Error | {
     cachedItem: false | BufferSource;
     enabled: boolean;
     update: (image: BufferSource) => Promise<void>;

package/dist/runtime/cache.mjs

@@ -1,31 +1,46 @@
 import { prefixStorage } from "unstorage";
-import { getQuery, handleCacheHeaders, setHeader, setHeaders } from "h3";
+import { createError, getQuery, handleCacheHeaders, setHeader, setHeaders } from "h3";
 import { withTrailingSlash } from "ufo";
 import { hash } from "ohash";
 import { useStorage } from "#imports";
 export async function useOgImageBufferCache(ctx, options) {
   const maxAge = Number(options.cacheMaxAgeSeconds);
-  const enabled = !import.meta.dev && import.meta.env.MODE !== "test" && maxAge > 0;
+  let enabled = !import.meta.dev && import.meta.env.MODE !== "test" && maxAge > 0;
   const cache = prefixStorage(useStorage(), withTrailingSlash(options.baseCacheKey || "/"));
   const key = ctx.key;
   let cachedItem = false;
-  if (enabled && await cache.hasItem(key).catch(() => false)) {
-    const { value, expiresAt, headers } = await cache.getItem(key).catch(() => ({ value: null, expiresAt: Date.now() }));
-    if (typeof getQuery(ctx.e).purge !== "undefined") {
-      await cache.removeItem(key).catch(() => {
-      });
-    } else if (expiresAt > Date.now()) {
-      cachedItem = Buffer.from(value, "base64");
-      if (handleCacheHeaders(ctx.e, {
-        modifiedTime: new Date(headers["last-modified"]),
-        etag: headers.etag,
-        maxAge
-      }))
-        return;
-      setHeaders(ctx.e, headers);
-    } else {
-      await cache.removeItem(key).catch(() => {
+  if (enabled) {
+    const hasItem = await cache.hasItem(key).catch((e) => {
+      enabled = false;
+      return createError({
+        cause: e,
+        statusCode: 500,
+        statusMessage: `[Nuxt OG Image] Failed to connect to cache ${options.baseCacheKey}. Response from cache: ${e.message}`
       });
+    });
+    if (hasItem instanceof Error)
+      return hasItem;
+    if (hasItem) {
+      const { value, expiresAt, headers } = await cache.getItem(key).catch(() => ({
+        value: null,
+        expiresAt: Date.now()
+      }));
+      if (typeof getQuery(ctx.e).purge !== "undefined") {
+        await cache.removeItem(key).catch(() => {
+        });
+      } else if (expiresAt > Date.now()) {
+        cachedItem = Buffer.from(value, "base64");
+        if (handleCacheHeaders(ctx.e, {
+          modifiedTime: new Date(headers["last-modified"]),
+          etag: headers.etag,
+          maxAge
+        }))
+          return;
+        setHeaders(ctx.e, headers);
+      } else {
+        await cache.removeItem(key).catch(() => {
+        });
+      }
     }
   }
   if (!enabled) {

package/dist/runtime/components/OgImage/OgImage.d.ts

@@ -1,5 +1,5 @@
 import type { OgImageOptions } from '../../types';
-declare const _default: import("vue").DefineComponent<OgImageOptions<"NuxtSeo">, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<OgImageOptions<"NuxtSeo">>, {
+declare const _default: import("vue").DefineComponent<OgImageOptions<"NuxtSeo">, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<OgImageOptions<"NuxtSeo">>, {
     props?: any;
 }, {}>;
 export default _default;

package/dist/runtime/components/OgImage/OgImageScreenshot.d.ts

@@ -1,5 +1,5 @@
 import type { OgImagePageScreenshotOptions } from '../../types';
-declare const _default: import("vue").DefineComponent<OgImagePageScreenshotOptions, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<OgImagePageScreenshotOptions>, {
+declare const _default: import("vue").DefineComponent<OgImagePageScreenshotOptions, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<OgImagePageScreenshotOptions>, {
     props?: any;
 }, {}>;
 export default _default;

package/dist/runtime/components/Templates/Community/NuxtSeo.vue

@@ -117,7 +117,7 @@ if (typeof props.icon === 'string' && !runtimeConfig.hasNuxtIcon && process.dev)
             {{ description }}
           </p>
         </div>
-        <div v-if="icon" style="width: 30%;" class="flex justify-end">
+        <div v-if="Boolean(icon)" style="width: 30%;" class="flex justify-end">
           <IconComponent :name="icon" size="250px" style="margin: 0 auto; opacity: 0.7;" />
         </div>
       </div>

package/dist/runtime/components/Templates/Community/UnJs.vue

@@ -25,10 +25,10 @@ const org = computed(() => props.title.split('/')[0])
 const repo = computed(() => props.title.split('/')[1])
 
 const stars = computed(() => {
-  return new Intl.NumberFormat('en-US', { notation: 'compact', compactDisplay: 'short' }).format(props.stars || 0)
+  return new Intl.NumberFormat('en-US', { notation: 'compact', compactDisplay: 'short' }).format(Number(props.stars || 0))
 })
 const downloads = computed(() => new Intl.NumberFormat('en-US', { notation: 'compact', compactDisplay: 'short' })
-  .format(props.downloads || 0),
+  .format(Number(props.downloads || 0)),
 )
 
 const description = computed(() => (props.description || '').slice(0, 200))

package/dist/runtime/composables/defineOgImage.mjs

@@ -1,22 +1,18 @@
 import { defu } from "defu";
 import { appendHeader } from "h3";
-import { createRouter as createRadixRouter, toRouteMatcher } from "radix3";
-import { withoutBase } from "ufo";
 import { getOgImagePath, separateProps, useOgImageRuntimeConfig } from "../utils.mjs";
 import { createOgImageMeta, normaliseOptions } from "../nuxt/utils.mjs";
-import { useNuxtApp, useRequestEvent, useRouter, useRuntimeConfig } from "#imports";
+import { createNitroRouteRuleMatcher } from "../nitro/kit.mjs";
+import { useNuxtApp, useRequestEvent, useRoute } from "#imports";
 export function defineOgImage(_options = {}) {
   if (!import.meta.server)
     return;
   const nuxtApp = useNuxtApp();
   const ogImageInstances = nuxtApp.ssrContext._ogImageInstances || [];
-  const basePath = useRouter().currentRoute.value?.path || "/";
-  const _routeRulesMatcher = toRouteMatcher(
-    createRadixRouter({ routes: useRuntimeConfig().nitro?.routeRules })
-  );
-  const routeRules = defu({}, ..._routeRulesMatcher.matchAll(
-    withoutBase(basePath.split("?")[0], useRuntimeConfig().app.baseURL)
-  ).reverse()).ogImage;
+  const route = useRoute();
+  const basePath = route.path || "/";
+  const routeRuleMatcher = createNitroRouteRuleMatcher();
+  const routeRules = routeRuleMatcher(basePath).ogImage;
   if (!_options || nuxtApp.ssrContext?.event.context._nitro?.routeRules?.ogImage === false || typeof routeRules !== "undefined" && routeRules === false) {
     ogImageInstances.forEach((e) => {
       e.dispose();
@@ -27,6 +23,8 @@ export function defineOgImage(_options = {}) {
   const options = normaliseOptions({
     ..._options
   });
+  if (route.query)
+    options._query = route.query;
   const { defaults } = useOgImageRuntimeConfig();
   const resolvedOptions = normaliseOptions(defu(separateProps(_options), separateProps(routeRules), defaults));
   if (_options.url) {

package/dist/runtime/core/bindings/css-inline/node.d.ts

@@ -1,2 +1,8 @@
-import cssInline from 'css-inline';
-export default cssInline;
+import { inline } from '@css-inline/css-inline';
+declare const _default: {
+    initWasmPromise: Promise<void>;
+    cssInline: {
+        inline: typeof inline;
+    };
+};
+export default _default;

package/dist/runtime/core/bindings/css-inline/node.mjs

@@ -1,2 +1,7 @@
-import cssInline from "css-inline";
-export default cssInline;
+import { inline } from "@css-inline/css-inline";
+export default {
+  initWasmPromise: Promise.resolve(),
+  cssInline: {
+    inline
+  }
+};

package/dist/runtime/core/bindings/css-inline/wasm-fs.d.ts

@@ -0,0 +1,8 @@
+import { inline } from '@css-inline/css-inline-wasm';
+declare const _default: {
+    initWasmPromise: Promise<void>;
+    cssInline: {
+        inline: typeof inline;
+    };
+};
+export default _default;

package/dist/runtime/core/bindings/css-inline/wasm-fs.mjs

@@ -0,0 +1,8 @@
+import { initWasm, inline } from "@css-inline/css-inline-wasm";
+import { readWasmFile } from "../../utils/wasm.mjs";
+export default {
+  initWasmPromise: initWasm(readWasmFile("@css-inline/css-inline-wasm/index_bg.wasm")),
+  cssInline: {
+    inline
+  }
+};

package/dist/runtime/core/bindings/css-inline/wasm.d.ts

@@ -0,0 +1,8 @@
+import { inline } from '@css-inline/css-inline-wasm';
+declare const _default: {
+    initWasmPromise: Promise<void>;
+    cssInline: {
+        inline: typeof inline;
+    };
+};
+export default _default;

package/dist/runtime/core/bindings/css-inline/wasm.mjs

@@ -0,0 +1,8 @@
+import { initWasm, inline } from "@css-inline/css-inline-wasm";
+import { importWasm } from "../../utils/wasm.mjs";
+export default {
+  initWasmPromise: initWasm(importWasm(import("@css-inline/css-inline-wasm/index_bg.wasm"))),
+  cssInline: {
+    inline
+  }
+};

package/dist/runtime/core/font/fetch.mjs

@@ -27,7 +27,10 @@ export async function loadFont({ e }, font) {
       }
     } else {
       data = await e.$fetch(`/__og-image__/font/${name}/${weight}.ttf`, {
-        responseType: "arrayBuffer"
+        responseType: "arrayBuffer",
+        query: {
+          font
+        }
       });
     }
   }

package/dist/runtime/core/html/applyInlineCss.mjs

@@ -3,30 +3,34 @@ import { useNitroOrigin } from "#imports";
 import cssInline from "#nuxt-og-image/bindings/css-inline";
 export async function applyInlineCss({ e }, island) {
   let html = island.html;
-  const componentInlineStyles = island.head.link.filter((l) => l.href.startsWith("/_nuxt/components"));
-  const usingInlineCss = !!componentInlineStyles.length;
-  if (!cssInline.__unenv__ && componentInlineStyles.length) {
-    const css = island.head.style.map((s) => s.innerHTML).join("\n");
-    const linksToCss = (await Promise.all(
-      componentInlineStyles.map((l) => {
-        return e.$fetch(`${l.href}&hmr=false`, {
-          responseType: "text",
-          baseURL: useNitroOrigin(e)
-        }).then((res) => {
-          return res.trim().split("\n").filter((l2) => !l2.startsWith("//")).join("\n").trim();
-        });
-      })
-    )).join("\n");
-    const cssToInline = `${linksToCss}${css}`;
+  if (!cssInline.__unenv__) {
+    let css = island.head.style.map((s) => s.innerHTML).join("\n");
+    const componentInlineStyles = island.head.link.filter((l) => l.href.startsWith("/_nuxt/components"));
+    if (process.dev) {
+      const linksToCss = componentInlineStyles.length ? (await Promise.all(
+        componentInlineStyles.map((l) => {
+          return e.$fetch(`${l.href}&hmr=false`, {
+            responseType: "text",
+            baseURL: useNitroOrigin(e)
+          }).then((res) => {
+            return res.trim().split("\n").filter((l2) => !l2.startsWith("//")).join("\n").trim();
+          });
+        })
+      )).join("\n") : "";
+      css = `${linksToCss}${css}`;
+    }
+    if (!css.trim().length)
+      return false;
     const cssInline2 = await useCssInline();
     html = cssInline2.inline(island.html, {
-      load_remote_stylesheets: false,
-      extra_css: cssToInline
+      loadRemoteStylesheets: false,
+      extraCss: css
     });
-    const classes = cssToInline.match(/\.([a-zA-Z0-9-_]+)/g)?.map((c) => c.replace(".", ""));
+    const classes = css.match(/\.([a-zA-Z0-9-_]+)/g)?.map((c) => c.replace(".", ""));
     if (classes)
       html = html.replace(new RegExp(`class="(${classes.join("|")})"`, "g"), "");
     island.html = html;
+    return true;
   }
-  return usingInlineCss;
+  return false;
 }

package/dist/runtime/core/html/devIframeTemplate.mjs

@@ -1,6 +1,6 @@
 import { createHeadCore } from "@unhead/vue";
 import { renderSSRHead } from "@unhead/ssr";
-import { useOgImageRuntimeConfig } from "../../utils.mjs";
+import { normaliseFontInput, useOgImageRuntimeConfig } from "../../utils.mjs";
 import { applyEmojis } from "./applyEmojis.mjs";
 import { fetchIsland } from "./fetchIsland.mjs";
 import { theme } from "#nuxt-og-image/unocss-config.mjs";
@@ -11,7 +11,8 @@ export async function devIframeTemplate(ctx) {
   const head = createHeadCore();
   head.push(island.head);
   let defaultFontFamily = "sans-serif";
-  const firstFont = fonts[0];
+  const normalisedFonts = normaliseFontInput([...options.fonts || [], ...fonts]);
+  const firstFont = normalisedFonts[0];
   if (firstFont)
     defaultFontFamily = firstFont.name;
   await applyEmojis(ctx, island);

package/dist/runtime/core/html/fetchIsland.mjs

@@ -4,7 +4,7 @@ export function fetchIsland({ options, e }) {
   if (!options.component) {
     throw createError({
       statusCode: 500,
-      statusMessage: `Nuxt OG Image trying to render an invalid component. Received options ${JSON.stringify(options)}`
+      statusMessage: `[Nuxt OG Image] Rendering an invalid component. Received options: ${JSON.stringify(options)}.`
     });
   }
   const hashId = hash([options.component, options]);