nuxt-og-image 3.0.0-beta.55 → 3.0.0-beta.57

package/dist/client/_nuxt/{error-404.9469f9ea.js → error-404.bda968de.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.8549fe22.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 x,f as h}from"./entry.79f3f186.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};

package/dist/client/_nuxt/{error-500.4d611664.js → error-500.174afb83.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.8549fe22.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.79f3f186.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};

package/dist/client/_nuxt/vanilla-picker-NKbIFE8h.23409a58.js

@@ -0,0 +1,8 @@
+/*!
+ * vanilla-picker v2.12.2
+ * https://vanilla-picker.js.org
+ *
+ * Copyright 2017-2023 Andreas Borgen (https://github.com/Sphinxxxx), Adam Brooks (https://github.com/dissimulate)
+ * Released under the ISC license.
+ */var H=function(a,t){if(!(a instanceof t))throw new TypeError("Cannot call a class as a function")},O=function(){function a(t,e){for(var r=0;r<e.length;r++){var n=e[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(t,e,r){return e&&a(t.prototype,e),r&&a(t,r),t}}(),w=function(){function a(t,e){var r=[],n=!0,o=!1,l=void 0;try{for(var p=t[Symbol.iterator](),i;!(n=(i=p.next()).done)&&(r.push(i.value),!(e&&r.length===e));n=!0);}catch(s){o=!0,l=s}finally{try{!n&&p.return&&p.return()}finally{if(o)throw l}}return r}return function(t,e){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return a(t,e);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}();String.prototype.startsWith=String.prototype.startsWith||function(a){return this.indexOf(a)===0};String.prototype.padStart=String.prototype.padStart||function(a,t){for(var e=this;e.length<a;)e=t+e;return e};var P={cb:"0f8ff",tqw:"aebd7",q:"-ffff",qmrn:"7fffd4",zr:"0ffff",bg:"5f5dc",bsq:"e4c4",bck:"---",nch:"ebcd",b:"--ff",bvt:"8a2be2",brwn:"a52a2a",brw:"deb887",ctb:"5f9ea0",hrt:"7fff-",chcT:"d2691e",cr:"7f50",rnw:"6495ed",crns:"8dc",crms:"dc143c",cn:"-ffff",Db:"--8b",Dcn:"-8b8b",Dgnr:"b8860b",Dgr:"a9a9a9",Dgrn:"-64-",Dkhk:"bdb76b",Dmgn:"8b-8b",Dvgr:"556b2f",Drng:"8c-",Drch:"9932cc",Dr:"8b--",Dsmn:"e9967a",Dsgr:"8fbc8f",DsTb:"483d8b",DsTg:"2f4f4f",Dtrq:"-ced1",Dvt:"94-d3",ppnk:"1493",pskb:"-bfff",mgr:"696969",grb:"1e90ff",rbrc:"b22222",rwht:"af0",stg:"228b22",chs:"-ff",gnsb:"dcdcdc",st:"8f8ff",g:"d7-",gnr:"daa520",gr:"808080",grn:"-8-0",grnw:"adff2f",hnw:"0fff0",htpn:"69b4",nnr:"cd5c5c",ng:"4b-82",vr:"0",khk:"0e68c",vnr:"e6e6fa",nrb:"0f5",wngr:"7cfc-",mnch:"acd",Lb:"add8e6",Lcr:"08080",Lcn:"e0ffff",Lgnr:"afad2",Lgr:"d3d3d3",Lgrn:"90ee90",Lpnk:"b6c1",Lsmn:"a07a",Lsgr:"20b2aa",Lskb:"87cefa",LsTg:"778899",Lstb:"b0c4de",Lw:"e0",m:"-ff-",mgrn:"32cd32",nn:"af0e6",mgnt:"-ff",mrn:"8--0",mqm:"66cdaa",mmb:"--cd",mmrc:"ba55d3",mmpr:"9370db",msg:"3cb371",mmsT:"7b68ee","":"-fa9a",mtr:"48d1cc",mmvt:"c71585",mnLb:"191970",ntc:"5fffa",mstr:"e4e1",mccs:"e4b5",vjw:"dead",nv:"--80",c:"df5e6",v:"808-0",vrb:"6b8e23",rng:"a5-",rngr:"45-",rch:"da70d6",pgnr:"eee8aa",pgrn:"98fb98",ptrq:"afeeee",pvtr:"db7093",ppwh:"efd5",pchp:"dab9",pr:"cd853f",pnk:"c0cb",pm:"dda0dd",pwrb:"b0e0e6",prp:"8-080",cc:"663399",r:"--",sbr:"bc8f8f",rb:"4169e1",sbrw:"8b4513",smn:"a8072",nbr:"4a460",sgrn:"2e8b57",ssh:"5ee",snn:"a0522d",svr:"c0c0c0",skb:"87ceeb",sTb:"6a5acd",sTgr:"708090",snw:"afa",n:"-ff7f",stb:"4682b4",tn:"d2b48c",t:"-8080",thst:"d8bfd8",tmT:"6347",trqs:"40e0d0",vt:"ee82ee",whT:"5deb3",wht:"",hts:"5f5f5",w:"-",wgrn:"9acd32"};function R(a){var t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:1,e=t>0?a.toFixed(t).replace(/0+$/,"").replace(/\.$/,""):a.toString();return e||"0"}var z=function(){function a(t,e,r,n){H(this,a);var o=this;function l(i){if(i.startsWith("hsl")){var s=i.match(/([\-\d\.e]+)/g).map(Number),c=w(s,4),u=c[0],h=c[1],g=c[2],f=c[3];f===void 0&&(f=1),u/=360,h/=100,g/=100,o.hsla=[u,h,g,f]}else if(i.startsWith("rgb")){var b=i.match(/([\-\d\.e]+)/g).map(Number),d=w(b,4),v=d[0],x=d[1],k=d[2],m=d[3];m===void 0&&(m=1),o.rgba=[v,x,k,m]}else i.startsWith("#")?o.rgba=a.hexToRgb(i):o.rgba=a.nameToRgb(i)||a.hexToRgb(i)}if(t!==void 0)if(Array.isArray(t))this.rgba=t;else if(r===void 0){var p=t&&""+t;p&&l(p.toLowerCase())}else this.rgba=[t,e,r,n===void 0?1:n]}return O(a,[{key:"printRGB",value:function(t){var e=t?this.rgba:this.rgba.slice(0,3),r=e.map(function(n,o){return R(n,o===3?3:0)});return t?"rgba("+r+")":"rgb("+r+")"}},{key:"printHSL",value:function(t){var e=[360,100,100,1],r=["","%","%",""],n=t?this.hsla:this.hsla.slice(0,3),o=n.map(function(l,p){return R(l*e[p],p===3?3:1)+r[p]});return t?"hsla("+o+")":"hsl("+o+")"}},{key:"printHex",value:function(t){var e=this.hex;return t?e:e.substring(0,7)}},{key:"rgba",get:function(){if(this._rgba)return this._rgba;if(!this._hsla)throw new Error("No color is set");return this._rgba=a.hslToRgb(this._hsla)},set:function(t){t.length===3&&(t[3]=1),this._rgba=t,this._hsla=null}},{key:"rgbString",get:function(){return this.printRGB()}},{key:"rgbaString",get:function(){return this.printRGB(!0)}},{key:"hsla",get:function(){if(this._hsla)return this._hsla;if(!this._rgba)throw new Error("No color is set");return this._hsla=a.rgbToHsl(this._rgba)},set:function(t){t.length===3&&(t[3]=1),this._hsla=t,this._rgba=null}},{key:"hslString",get:function(){return this.printHSL()}},{key:"hslaString",get:function(){return this.printHSL(!0)}},{key:"hex",get:function(){var t=this.rgba,e=t.map(function(r,n){return n<3?r.toString(16):Math.round(r*255).toString(16)});return"#"+e.map(function(r){return r.padStart(2,"0")}).join("")},set:function(t){this.rgba=a.hexToRgb(t)}}],[{key:"hexToRgb",value:function(t){var e=(t.startsWith("#")?t.slice(1):t).replace(/^(\w{3})$/,"$1F").replace(/^(\w)(\w)(\w)(\w)$/,"$1$1$2$2$3$3$4$4").replace(/^(\w{6})$/,"$1FF");if(!e.match(/^([0-9a-fA-F]{8})$/))throw new Error("Unknown hex color; "+t);var r=e.match(/^(\w\w)(\w\w)(\w\w)(\w\w)$/).slice(1).map(function(n){return parseInt(n,16)});return r[3]=r[3]/255,r}},{key:"nameToRgb",value:function(t){var e=t.toLowerCase().replace("at","T").replace(/[aeiouyldf]/g,"").replace("ght","L").replace("rk","D").slice(-5,4),r=P[e];return r===void 0?r:a.hexToRgb(r.replace(/\-/g,"00").padStart(6,"f"))}},{key:"rgbToHsl",value:function(t){var e=w(t,4),r=e[0],n=e[1],o=e[2],l=e[3];r/=255,n/=255,o/=255;var p=Math.max(r,n,o),i=Math.min(r,n,o),s=void 0,c=void 0,u=(p+i)/2;if(p===i)s=c=0;else{var h=p-i;switch(c=u>.5?h/(2-p-i):h/(p+i),p){case r:s=(n-o)/h+(n<o?6:0);break;case n:s=(o-r)/h+2;break;case o:s=(r-n)/h+4;break}s/=6}return[s,c,u,l]}},{key:"hslToRgb",value:function(t){var e=w(t,4),r=e[0],n=e[1],o=e[2],l=e[3],p=void 0,i=void 0,s=void 0;if(n===0)p=i=s=o;else{var c=function(f,b,d){return d<0&&(d+=1),d>1&&(d-=1),d<.16666666666666666?f+(b-f)*6*d:d<.5?b:d<.6666666666666666?f+(b-f)*(.6666666666666666-d)*6:f},u=o<.5?o*(1+n):o+n-o*n,h=2*o-u;p=c(h,u,r+1/3),i=c(h,u,r),s=c(h,u,r-1/3)}var g=[p*255,i*255,s*255].map(Math.round);return g[3]=l,g}}]),a}(),I=function(){function a(){H(this,a),this._events=[]}return O(a,[{key:"add",value:function(t,e,r){t.addEventListener(e,r,!1),this._events.push({target:t,type:e,handler:r})}},{key:"remove",value:function(t,e,r){this._events=this._events.filter(function(n){var o=!0;return t&&t!==n.target&&(o=!1),e&&e!==n.type&&(o=!1),r&&r!==n.handler&&(o=!1),o&&a._doRemove(n.target,n.type,n.handler),!o})}},{key:"destroy",value:function(){this._events.forEach(function(t){return a._doRemove(t.target,t.type,t.handler)}),this._events=[]}}],[{key:"_doRemove",value:function(t,e,r){t.removeEventListener(e,r,!1)}}]),a}();function q(a){var t=document.createElement("div");return t.innerHTML=a,t.firstElementChild}function S(a,t,e){var r=!1;function n(i,s,c){return Math.max(s,Math.min(i,c))}function o(i,s,c){if(c&&(r=!0),!!r){i.preventDefault();var u=t.getBoundingClientRect(),h=u.width,g=u.height,f=s.clientX,b=s.clientY,d=n(f-u.left,0,h),v=n(b-u.top,0,g);e(d/h,v/g)}}function l(i,s){var c=i.buttons===void 0?i.which:i.buttons;c===1?o(i,i,s):r=!1}function p(i,s){i.touches.length===1?o(i,i.touches[0],s):r=!1}a.add(t,"mousedown",function(i){l(i,!0)}),a.add(t,"touchstart",function(i){p(i,!0)}),a.add(window,"mousemove",l),a.add(t,"touchmove",p),a.add(window,"mouseup",function(i){r=!1}),a.add(t,"touchend",function(i){r=!1}),a.add(t,"touchcancel",function(i){r=!1})}var B=`linear-gradient(45deg, lightgrey 25%, transparent 25%, transparent 75%, lightgrey 75%) 0 0 / 2em 2em,
+                   linear-gradient(45deg, lightgrey 25%,       white 25%,       white 75%, lightgrey 75%) 1em 1em / 2em 2em`,F=360,$="keydown",y="mousedown",C="focusin";function _(a,t){return(t||document).querySelector(a)}function A(a){a.preventDefault(),a.stopPropagation()}function D(a,t,e,r,n){a.add(t,$,function(o){e.indexOf(o.key)>=0&&(n&&A(o),r(o))})}var W=function(){function a(t){H(this,a),this.settings={popup:"right",layout:"default",alpha:!0,editor:!0,editorFormat:"hex",cancelButton:!1,defaultColor:"#0cf"},this._events=new I,this.onChange=null,this.onDone=null,this.onOpen=null,this.onClose=null,this.setOptions(t)}return O(a,[{key:"setOptions",value:function(t){var e=this;if(!t)return;var r=this.settings;function n(i,s,c){for(var u in i)c&&c.indexOf(u)>=0||(s[u]=i[u])}if(t instanceof HTMLElement)r.parent=t;else{r.parent&&t.parent&&r.parent!==t.parent&&(this._events.remove(r.parent),this._popupInited=!1),n(t,r),t.onChange&&(this.onChange=t.onChange),t.onDone&&(this.onDone=t.onDone),t.onOpen&&(this.onOpen=t.onOpen),t.onClose&&(this.onClose=t.onClose);var o=t.color||t.colour;o&&this._setColor(o)}var l=r.parent;if(l&&r.popup&&!this._popupInited){var p=function(i){return e.openHandler(i)};this._events.add(l,"click",p),D(this._events,l,[" ","Spacebar","Enter"],p),this._popupInited=!0}else t.parent&&!r.popup&&this.show()}},{key:"openHandler",value:function(t){if(this.show()){t&&t.preventDefault(),this.settings.parent.style.pointerEvents="none";var e=t&&t.type===$?this._domEdit:this.domElement;setTimeout(function(){return e.focus()},100),this.onOpen&&this.onOpen(this.colour)}}},{key:"closeHandler",value:function(t){var e=t&&t.type,r=!1;if(!t)r=!0;else if(e===y||e===C){var n=(this.__containedEvent||0)+100;t.timeStamp>n&&(r=!0)}else A(t),r=!0;r&&this.hide()&&(this.settings.parent.style.pointerEvents="",e!==y&&this.settings.parent.focus(),this.onClose&&this.onClose(this.colour))}},{key:"movePopup",value:function(t,e){this.closeHandler(),this.setOptions(t),e&&this.openHandler()}},{key:"setColor",value:function(t,e){this._setColor(t,{silent:e})}},{key:"_setColor",value:function(t,e){if(typeof t=="string"&&(t=t.trim()),!!t){e=e||{};var r=void 0;try{r=new z(t)}catch(o){if(e.failSilently)return;throw o}if(!this.settings.alpha){var n=r.hsla;n[3]=1,r.hsla=n}this.colour=this.color=r,this._setHSLA(null,null,null,null,e)}}},{key:"setColour",value:function(t,e){this.setColor(t,e)}},{key:"show",value:function(){var t=this.settings.parent;if(!t)return!1;if(this.domElement){var e=this._toggleDOM(!0);return this._setPosition(),e}var r=this.settings.template||'<div class="picker_wrapper" tabindex="-1"><div class="picker_arrow"></div><div class="picker_hue picker_slider"><div class="picker_selector"></div></div><div class="picker_sl"><div class="picker_selector"></div></div><div class="picker_alpha picker_slider"><div class="picker_selector"></div></div><div class="picker_editor"><input aria-label="Type a color name or hex value"/></div><div class="picker_sample"></div><div class="picker_done"><button>Ok</button></div><div class="picker_cancel"><button>Cancel</button></div></div>',n=q(r);return this.domElement=n,this._domH=_(".picker_hue",n),this._domSL=_(".picker_sl",n),this._domA=_(".picker_alpha",n),this._domEdit=_(".picker_editor input",n),this._domSample=_(".picker_sample",n),this._domOkay=_(".picker_done button",n),this._domCancel=_(".picker_cancel button",n),n.classList.add("layout_"+this.settings.layout),this.settings.alpha||n.classList.add("no_alpha"),this.settings.editor||n.classList.add("no_editor"),this.settings.cancelButton||n.classList.add("no_cancel"),this._ifPopup(function(){return n.classList.add("popup")}),this._setPosition(),this.colour?this._updateUI():this._setColor(this.settings.defaultColor),this._bindEvents(),!0}},{key:"hide",value:function(){return this._toggleDOM(!1)}},{key:"destroy",value:function(){this._events.destroy(),this.domElement&&this.settings.parent.removeChild(this.domElement)}},{key:"_bindEvents",value:function(){var t=this,e=this,r=this.domElement,n=this._events;function o(i,s,c){n.add(i,s,c)}o(r,"click",function(i){return i.preventDefault()}),S(n,this._domH,function(i,s){return e._setHSLA(i)}),S(n,this._domSL,function(i,s){return e._setHSLA(null,i,1-s)}),this.settings.alpha&&S(n,this._domA,function(i,s){return e._setHSLA(null,null,null,1-s)});var l=this._domEdit;o(l,"input",function(i){e._setColor(this.value,{fromEditor:!0,failSilently:!0})}),o(l,"focus",function(i){var s=this;s.selectionStart===s.selectionEnd&&s.select()}),this._ifPopup(function(){var i=function(c){return t.closeHandler(c)};o(window,y,i),o(window,C,i),D(n,r,["Esc","Escape"],i);var s=function(c){t.__containedEvent=c.timeStamp};o(r,y,s),o(r,C,s),o(t._domCancel,"click",i)});var p=function(i){t._ifPopup(function(){return t.closeHandler(i)}),t.onDone&&t.onDone(t.colour)};o(this._domOkay,"click",p),D(n,r,["Enter"],p)}},{key:"_setPosition",value:function(){var t=this.settings.parent,e=this.domElement;t!==e.parentNode&&t.appendChild(e),this._ifPopup(function(r){getComputedStyle(t).position==="static"&&(t.style.position="relative");var n=r===!0?"popup_right":"popup_"+r;["popup_top","popup_bottom","popup_left","popup_right"].forEach(function(o){o===n?e.classList.add(o):e.classList.remove(o)}),e.classList.add(n)})}},{key:"_setHSLA",value:function(t,e,r,n,o){o=o||{};var l=this.colour,p=l.hsla;[t,e,r,n].forEach(function(i,s){(i||i===0)&&(p[s]=i)}),l.hsla=p,this._updateUI(o),this.onChange&&!o.silent&&this.onChange(l)}},{key:"_updateUI",value:function(t){if(!this.domElement)return;t=t||{};var e=this.colour,r=e.hsla,n="hsl("+r[0]*F+", 100%, 50%)",o=e.hslString,l=e.hslaString,p=this._domH,i=this._domSL,s=this._domA,c=_(".picker_selector",p),u=_(".picker_selector",i),h=_(".picker_selector",s);function g(M,E,L){E.style.left=L*100+"%"}function f(M,E,L){E.style.top=L*100+"%"}g(p,c,r[0]),this._domSL.style.backgroundColor=this._domH.style.color=n,g(i,u,r[1]),f(i,u,1-r[2]),i.style.color=o,f(s,h,1-r[3]);var b=o,d=b.replace("hsl","hsla").replace(")",", 0)"),v="linear-gradient("+[b,d]+")";if(this._domA.style.background=v+", "+B,!t.fromEditor){var x=this.settings.editorFormat,k=this.settings.alpha,m=void 0;switch(x){case"rgb":m=e.printRGB(k);break;case"hsl":m=e.printHSL(k);break;default:m=e.printHex(k)}this._domEdit.value=m}this._domSample.style.color=l}},{key:"_ifPopup",value:function(t,e){this.settings.parent&&this.settings.popup?t&&t(this.settings.popup):e&&e()}},{key:"_toggleDOM",value:function(t){var e=this.domElement;if(!e)return!1;var r=t?"":"none",n=e.style.display!==r;return n&&(e.style.display=r),n}}]),a}();{var T=document.createElement("style");T.textContent='.picker_wrapper.no_alpha .picker_alpha{display:none}.picker_wrapper.no_editor .picker_editor{position:absolute;z-index:-1;opacity:0}.picker_wrapper.no_cancel .picker_cancel{display:none}.layout_default.picker_wrapper{display:flex;flex-flow:row wrap;justify-content:space-between;align-items:stretch;font-size:10px;width:25em;padding:.5em}.layout_default.picker_wrapper input,.layout_default.picker_wrapper button{font-size:1rem}.layout_default.picker_wrapper>*{margin:.5em}.layout_default.picker_wrapper::before{content:"";display:block;width:100%;height:0;order:1}.layout_default .picker_slider,.layout_default .picker_selector{padding:1em}.layout_default .picker_hue{width:100%}.layout_default .picker_sl{flex:1 1 auto}.layout_default .picker_sl::before{content:"";display:block;padding-bottom:100%}.layout_default .picker_editor{order:1;width:6.5rem}.layout_default .picker_editor input{width:100%;height:100%}.layout_default .picker_sample{order:1;flex:1 1 auto}.layout_default .picker_done,.layout_default .picker_cancel{order:1}.picker_wrapper{box-sizing:border-box;background:#f2f2f2;box-shadow:0 0 0 1px silver;cursor:default;font-family:sans-serif;color:#444;pointer-events:auto}.picker_wrapper:focus{outline:none}.picker_wrapper button,.picker_wrapper input{box-sizing:border-box;border:none;box-shadow:0 0 0 1px silver;outline:none}.picker_wrapper button:focus,.picker_wrapper button:active,.picker_wrapper input:focus,.picker_wrapper input:active{box-shadow:0 0 2px 1px #1e90ff}.picker_wrapper button{padding:.4em .6em;cursor:pointer;background-color:#f5f5f5;background-image:linear-gradient(0deg, gainsboro, transparent)}.picker_wrapper button:active{background-image:linear-gradient(0deg, transparent, gainsboro)}.picker_wrapper button:hover{background-color:#fff}.picker_selector{position:absolute;z-index:1;display:block;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);border:2px solid #fff;border-radius:100%;box-shadow:0 0 3px 1px #67b9ff;background:currentColor;cursor:pointer}.picker_slider .picker_selector{border-radius:2px}.picker_hue{position:relative;background-image:linear-gradient(90deg, red, yellow, lime, cyan, blue, magenta, red);box-shadow:0 0 0 1px silver}.picker_sl{position:relative;box-shadow:0 0 0 1px silver;background-image:linear-gradient(180deg, white, rgba(255, 255, 255, 0) 50%),linear-gradient(0deg, black, rgba(0, 0, 0, 0) 50%),linear-gradient(90deg, #808080, rgba(128, 128, 128, 0))}.picker_alpha,.picker_sample{position:relative;background:linear-gradient(45deg, lightgrey 25%, transparent 25%, transparent 75%, lightgrey 75%) 0 0/2em 2em,linear-gradient(45deg, lightgrey 25%, white 25%, white 75%, lightgrey 75%) 1em 1em/2em 2em;box-shadow:0 0 0 1px silver}.picker_alpha .picker_selector,.picker_sample .picker_selector{background:none}.picker_editor input{font-family:monospace;padding:.2em .4em}.picker_sample::before{content:"";position:absolute;display:block;width:100%;height:100%;background:currentColor}.picker_arrow{position:absolute;z-index:-1}.picker_wrapper.popup{position:absolute;z-index:2;margin:1.5em}.picker_wrapper.popup,.picker_wrapper.popup .picker_arrow::before,.picker_wrapper.popup .picker_arrow::after{background:#f2f2f2;box-shadow:0 0 10px 1px rgba(0,0,0,.4)}.picker_wrapper.popup .picker_arrow{width:3em;height:3em;margin:0}.picker_wrapper.popup .picker_arrow::before,.picker_wrapper.popup .picker_arrow::after{content:"";display:block;position:absolute;top:0;left:0;z-index:-99}.picker_wrapper.popup .picker_arrow::before{width:100%;height:100%;-webkit-transform:skew(45deg);transform:skew(45deg);-webkit-transform-origin:0 100%;transform-origin:0 100%}.picker_wrapper.popup .picker_arrow::after{width:150%;height:150%;box-shadow:none}.popup.popup_top{bottom:100%;left:0}.popup.popup_top .picker_arrow{bottom:0;left:0;-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}.popup.popup_bottom{top:100%;left:0}.popup.popup_bottom .picker_arrow{top:0;left:0;-webkit-transform:rotate(90deg) scale(1, -1);transform:rotate(90deg) scale(1, -1)}.popup.popup_left{top:0;right:100%}.popup.popup_left .picker_arrow{top:0;right:0;-webkit-transform:scale(-1, 1);transform:scale(-1, 1)}.popup.popup_right{top:0;left:100%}.popup.popup_right .picker_arrow{top:0;left:0}',document.documentElement.firstElementChild.appendChild(T),W.StyleElement=T}export{W as default};

package/dist/client/index.html

@@ -2,13 +2,14 @@
 <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.33a59bbf.css">
-<link rel="modulepreload" as="script" crossorigin href="/__nuxt-og-image/_nuxt/entry.8549fe22.js">
+<link rel="stylesheet" href="/__nuxt-og-image/_nuxt/entry.0c999acd.css">
+<link rel="modulepreload" as="script" crossorigin href="/__nuxt-og-image/_nuxt/entry.79f3f186.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.9469f9ea.js">
+<link rel="prefetch" as="script" crossorigin href="/__nuxt-og-image/_nuxt/error-404.bda968de.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.4d611664.js">
-<script type="module" src="/__nuxt-og-image/_nuxt/entry.8549fe22.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="prefetch" as="script" crossorigin href="/__nuxt-og-image/_nuxt/error-500.174afb83.js">
+<script type="module" src="/__nuxt-og-image/_nuxt/entry.79f3f186.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>
 <script>window.__NUXT__={};window.__NUXT__.config={public:{},app:{baseURL:"/__nuxt-og-image",buildAssetsDir:"/_nuxt/",cdnURL:""}}</script></body>

package/dist/module.d.mts

@@ -1,4 +1,5 @@
 import * as _nuxt_schema from '@nuxt/schema';
+import { AddComponentOptions } from '@nuxt/kit';
 import { SatoriOptions } from 'satori';
 import { ResvgRenderOptions } from '@resvg/resvg-js';
 import { SharpOptions } from 'sharp';
@@ -77,15 +78,16 @@ interface OgImageOptions<T extends keyof OgImageComponents = 'NuxtSeo'> {
     satori?: SatoriOptions;
     screenshot?: Partial<ScreenshotOptions>;
     sharp?: SharpOptions;
+    fonts?: InputFontConfig[];
     cacheMaxAgeSeconds?: number;
 }
 interface FontConfig {
     name: string;
-    weight: string | number;
+    weight?: string | number;
     path?: string;
     key?: string;
 }
-type InputFontConfig = (`${string}:${number}` | FontConfig);
+type InputFontConfig = (`${string}:${number}` | string | FontConfig);
 interface RuntimeCompatibilitySchema {
     chromium: 'node' | false;
     ['css-inline']: 'node' | false;
@@ -146,6 +148,10 @@ interface ModuleOptions {
      * @false false
      */
     debug: boolean;
+    /**
+     * Options to pass to the <OgImage> and <OgImageScreenshot> component.
+     */
+    componentOptions?: Pick<AddComponentOptions, 'global'>;
     /**
      * Modify the cache behavior.
      *

package/dist/module.d.ts

@@ -1,4 +1,5 @@
 import * as _nuxt_schema from '@nuxt/schema';
+import { AddComponentOptions } from '@nuxt/kit';
 import { SatoriOptions } from 'satori';
 import { ResvgRenderOptions } from '@resvg/resvg-js';
 import { SharpOptions } from 'sharp';
@@ -77,15 +78,16 @@ interface OgImageOptions<T extends keyof OgImageComponents = 'NuxtSeo'> {
     satori?: SatoriOptions;
     screenshot?: Partial<ScreenshotOptions>;
     sharp?: SharpOptions;
+    fonts?: InputFontConfig[];
     cacheMaxAgeSeconds?: number;
 }
 interface FontConfig {
     name: string;
-    weight: string | number;
+    weight?: string | number;
     path?: string;
     key?: string;
 }
-type InputFontConfig = (`${string}:${number}` | FontConfig);
+type InputFontConfig = (`${string}:${number}` | string | FontConfig);
 interface RuntimeCompatibilitySchema {
     chromium: 'node' | false;
     ['css-inline']: 'node' | false;
@@ -146,6 +148,10 @@ interface ModuleOptions {
      * @false false
      */
     debug: boolean;
+    /**
+     * Options to pass to the <OgImage> and <OgImageScreenshot> component.
+     */
+    componentOptions?: Pick<AddComponentOptions, 'global'>;
     /**
      * Modify the cache behavior.
      *

package/dist/module.json

@@ -5,5 +5,5 @@
     "bridge": false
   },
   "configKey": "ogImage",
-  "version": "3.0.0-beta.55"
+  "version": "3.0.0-beta.57"
 }

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-beta.55";
+const version = "3.0.0-beta.57";
 
 const autodetectableProviders = {
   azure_static: "azure",
@@ -358,6 +358,27 @@ async function ensureChromium(logger) {
   installChromeProcess.pid && terminate(installChromeProcess.pid);
 }
 
+function normaliseFontInput(fonts) {
+  return fonts.map((f) => {
+    if (typeof f === "string") {
+      const [name, weight] = f.split(":");
+      return {
+        cacheKey: f,
+        name,
+        weight: weight || "400",
+        style: "normal",
+        path: void 0
+      };
+    }
+    return {
+      cacheKey: f.key || `${f.name}:${f.weight}`,
+      style: "normal",
+      weight: 400,
+      ...f
+    };
+  });
+}
+
 const module = defineNuxtModule({
   meta: {
     name: "nuxt-og-image",
@@ -421,13 +442,13 @@ const module = defineNuxtModule({
         prerender: { sharp: false }
       });
     }
+    let hasChromeLocally = false;
+    try {
+      hasChromeLocally = !!Launcher.getFirstInstallation();
+    } catch {
+    }
     const isUndefinedOrTruthy = (v) => typeof v === "undefined" || v !== false;
     if (isUndefinedOrTruthy(config.compatibility?.prerender?.chromium) && isUndefinedOrTruthy(config.compatibility?.runtime?.chromium)) {
-      let hasChromeLocally = false;
-      try {
-        hasChromeLocally = !!Launcher.getFirstInstallation();
-      } catch {
-      }
       if (isCI)
         await ensureChromium(logger);
       const hasPlaywrightDependency = !!await tryResolveModule("playwright");
@@ -444,12 +465,23 @@ const module = defineNuxtModule({
           prerender: { chromium: "node" }
         });
       }
+    } else if (!hasChromeLocally && nuxt.options.dev && config.compatibility?.dev?.chromium === "node") {
+      await ensureChromium(logger);
     }
     await installNuxtSiteConfig();
     if (hasNuxtModule("@nuxt/content"))
       addServerPlugin(resolve("./runtime/nitro/plugins/nuxt-content"));
     if (!config.fonts.length)
       config.fonts = ["Inter:400", "Inter:700"];
+    if (preset === "cloudflare") {
+      config.fonts = config.fonts.filter((f) => {
+        if (typeof f !== "string" && f.path) {
+          logger.warn(`The ${f.name}:${f.weight} font was skipped because remote fonts are not available in Cloudflare Workers, please use a Google font.`);
+          return false;
+        }
+        return true;
+      });
+    }
     if (preset === "stackblitz") {
       config.fonts = config.fonts.map((f) => {
         if (typeof f === "string" && f.startsWith("Inter:")) {
@@ -510,8 +542,8 @@ const module = defineNuxtModule({
     ].forEach((name) => {
       addComponent({
         name,
-        global: true,
-        filePath: resolve(`./runtime/components/OgImage/${name}`)
+        filePath: resolve(`./runtime/components/OgImage/${name}`),
+        ...config.componentOptions
       });
     });
     addPlugin({ mode: "server", src: resolve("./runtime/nuxt/plugins/route-rule-og-image.server") });
@@ -584,7 +616,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) => void | Promise<void>
+    'nuxt-og-image:satori:vnodes': (vnodes: import('${typesPath}').VNode, ctx: ctx: import('${typesPath}').OgImageRenderEventContext) => void | Promise<void>
   }
 }
 
@@ -601,17 +633,7 @@ ${componentImports}
     if (!cacheEnabled)
       baseCacheKey = false;
     nuxt.hooks.hook("modules:done", async () => {
-      const normalisedFonts = config.fonts.map((f) => {
-        if (typeof f === "string") {
-          const [name, weight] = f.split(":");
-          return {
-            name,
-            weight,
-            path: void 0
-          };
-        }
-        return f;
-      });
+      const normalisedFonts = normaliseFontInput(config.fonts);
       if (!nuxt.options._generate && nuxt.options.build) {
         nuxt.options.nitro.prerender = nuxt.options.nitro.prerender || {};
         nuxt.options.nitro.prerender.routes = nuxt.options.nitro.prerender.routes || [];
@@ -619,8 +641,12 @@ ${componentImports}
           nuxt.options.nitro.prerender.routes.push(`/__og-image__/font/${name}/${weight}.ttf`);
         });
       }
-      let colorPreference = hasNuxtModule("@nuxtjs/color-mode") ? (await getNuxtModuleOptions("@nuxtjs/color-mode")).preference : "light";
-      if (!colorPreference || !["dark", "light"].includes(colorPreference))
+      const hasColorModeModule = hasNuxtModule("@nuxtjs/color-mode");
+      const colorModeOptions = hasColorModeModule ? await getNuxtModuleOptions("@nuxtjs/color-mode") : {};
+      let colorPreference = colorModeOptions.preference;
+      if (!colorPreference || colorPreference === "system")
+        colorPreference = colorModeOptions.fallback;
+      if (!colorPreference || colorPreference === "system")
         colorPreference = "light";
       const runtimeConfig = {
         version,

package/dist/runtime/core/cache/fonts.d.ts

@@ -0,0 +1,3 @@
+import type { ResolvedFontConfig } from '../../types';
+export declare const fontPromises: Record<string, Promise<ResolvedFontConfig>>;
+export declare const fontCache: import("unstorage/dist/shared/unstorage.745f9650").a<BufferSource>;

package/dist/runtime/core/cache/fonts.mjs

@@ -0,0 +1,6 @@
+import { createStorage } from "unstorage";
+import lruCacheDriver from "unstorage/drivers/lru-cache";
+export const fontPromises = {};
+export const fontCache = createStorage({
+  driver: lruCacheDriver({ max: 10 })
+});

package/dist/runtime/core/font/fetch.d.ts

@@ -1,2 +1,2 @@
-import type { FontConfig, OgImageRenderEventContext } from '../../types';
-export declare function loadFont({ e }: OgImageRenderEventContext, font: FontConfig): Promise<any>;
+import type { OgImageRenderEventContext, ResolvedFontConfig } from '../../types';
+export declare function loadFont({ e }: OgImageRenderEventContext, font: ResolvedFontConfig): Promise<ResolvedFontConfig>;

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

@@ -1,11 +1,7 @@
-import { createError } from "h3";
-import { fontCache } from "./cache.mjs";
-import { useNitroOrigin, useStorage } from "#imports";
+import { useStorage } from "#internal/nitro";
+import { useNitroOrigin } from "#imports";
 import { assets } from "#internal/nitro/virtual/server-assets";
 export async function loadFont({ e }, font) {
-  const fontKey = font.key || `${font.name}:${font.weight}`;
-  if (fontCache[fontKey])
-    return fontCache[fontKey];
   const { name, weight } = font;
   let data;
   if (import.meta.dev || import.meta.prerender) {
@@ -35,12 +31,6 @@ export async function loadFont({ e }, font) {
       });
     }
   }
-  if (data) {
-    fontCache[fontKey] = { name, weight: Number(weight), data, style: "normal" };
-    return fontCache[fontKey];
-  }
-  return createError({
-    statusCode: 500,
-    statusMessage: `Failed to fetch font: ${fontKey}`
-  });
+  font.data = data;
+  return font;
 }

package/dist/runtime/core/renderers/satori/index.mjs

@@ -1,18 +1,40 @@
 import { defu } from "defu";
-import { useOgImageRuntimeConfig } from "../../../utils.mjs";
+import { normaliseFontInput, useOgImageRuntimeConfig } from "../../../utils.mjs";
+import { loadFont } from "../../font/fetch.mjs";
+import { fontCache, fontPromises } from "../../cache/fonts.mjs";
 import { createVNodes } from "./vnodes.mjs";
-import { loadFonts, satoriFonts } from "./fonts.mjs";
 import { useResvg, useSatori, useSharp } from "./instances.mjs";
+import { theme } from "#nuxt-og-image/unocss-config.mjs";
 export async function createSvg(event) {
   const { options } = event;
   const { fonts, satoriOptions } = useOgImageRuntimeConfig();
   const vnodes = await createVNodes(event);
-  await event._nitro.hooks.callHook("nuxt-og-image:satori:vnodes", vnodes);
-  if (!satoriFonts.length)
-    satoriFonts.push(...await loadFonts(event, fonts));
+  await event._nitro.hooks.callHook("nuxt-og-image:satori:vnodes", vnodes, event);
+  const normalisedFonts = normaliseFontInput([...fonts, ...event.options.fonts || []]);
+  const localFontPromises = [];
+  const preloadedFonts = [];
+  for (const font of normalisedFonts) {
+    if (await fontCache.hasItem(font.cacheKey)) {
+      font.data = await fontCache.getItemRaw(font.cacheKey);
+      preloadedFonts.push(font);
+    } else {
+      if (!fontPromises[font.cacheKey]) {
+        fontPromises[font.cacheKey] = loadFont(event, font).then(async (_font) => {
+          if (_font?.data)
+            await fontCache.setItemRaw(_font.cacheKey, _font.data);
+          return _font;
+        });
+      }
+      localFontPromises.push(fontPromises[font.cacheKey]);
+    }
+  }
+  const awaitedFonts = await Promise.all(localFontPromises);
   const satori = await useSatori();
   return satori(vnodes, defu(options.satori, satoriOptions, {
-    fonts: satoriFonts,
+    fonts: [...preloadedFonts, ...awaitedFonts].map((_f) => {
+      return { ..._f, weight: Number(_f.weight) };
+    }),
+    tailwindConfig: { theme },
     embedFont: true,
     width: options.width,
     height: options.height

package/dist/runtime/core/renderers/satori/plugins/imageSrc.mjs

@@ -3,56 +3,73 @@ import { withBase } from "ufo";
 import sizeOf from "image-size";
 import { defineSatoriTransformer } from "../utils.mjs";
 import { toBase64Image } from "../../../env/assets.mjs";
-import { useNitroOrigin, useStorage } from "#imports";
-export default defineSatoriTransformer({
-  filter: (node) => node.type === "img",
-  transform: async (node, { e }) => {
-    const src = node.props?.src;
-    const isRelative = src?.startsWith("/");
-    if (src) {
-      let updated = false;
-      let dimensions;
-      let imageBuffer;
-      let valid = true;
-      if (import.meta.prerender || import.meta.dev) {
-        const key = `root:public${src.replace("./", ":").replace("/", ":")}`;
-        if (await useStorage().hasItem(key)) {
-          imageBuffer = await useStorage().getItemRaw(key);
-          updated = !!imageBuffer;
+import { useStorage } from "#internal/nitro";
+import { useNitroOrigin } from "#imports";
+export default defineSatoriTransformer([
+  // fix <img src="">
+  {
+    filter: (node) => node.type === "img",
+    transform: async (node, { e }) => {
+      const src = node.props?.src;
+      const isRelative = src?.startsWith("/");
+      if (src) {
+        let updated = false;
+        let dimensions;
+        let imageBuffer;
+        let valid = true;
+        if (import.meta.prerender || import.meta.dev) {
+          const key = `root:public${src.replace("./", ":").replace("/", ":")}`;
+          if (await useStorage().hasItem(key)) {
+            imageBuffer = await useStorage().getItemRaw(key);
+            updated = !!imageBuffer;
+          }
         }
-      }
-      if (!import.meta.prerender && !updated) {
-        imageBuffer = await e.$fetch(src, {
-          baseURL: useNitroOrigin(e),
-          responseType: "arrayBuffer"
-        }).catch(() => {
-          valid = false;
-        });
-        valid = !!imageBuffer;
-      }
-      if (valid) {
-        node.props.src = toBase64Image(src, imageBuffer);
-        try {
-          const imageSize = sizeOf(Buffer.from(imageBuffer));
-          dimensions = { width: imageSize.width, height: imageSize.height };
-        } catch (e2) {
+        if (!import.meta.prerender && !updated) {
+          imageBuffer = await e.$fetch(src, {
+            baseURL: useNitroOrigin(e),
+            responseType: "arrayBuffer"
+          }).catch(() => {
+            valid = false;
+          });
+          valid = !!imageBuffer;
         }
-        updated = true;
-      }
-      if (dimensions?.width && dimensions?.height) {
-        const naturalAspectRatio = dimensions.width / dimensions.height;
-        if (node.props.width && !node.props.height) {
-          node.props.height = Math.round(node.props.width / naturalAspectRatio);
-        } else if (node.props.height && !node.props.width) {
-          node.props.width = Math.round(node.props.height * naturalAspectRatio);
-        } else if (!node.props.width && !node.props.height) {
-          node.props.width = dimensions.width;
-          node.props.height = dimensions.height;
+        if (valid) {
+          node.props.src = toBase64Image(src, imageBuffer);
+          try {
+            const imageSize = sizeOf(Buffer.from(imageBuffer));
+            dimensions = { width: imageSize.width, height: imageSize.height };
+          } catch (e2) {
+          }
+          updated = true;
+        }
+        if (dimensions?.width && dimensions?.height) {
+          const naturalAspectRatio = dimensions.width / dimensions.height;
+          if (node.props.width && !node.props.height) {
+            node.props.height = Math.round(node.props.width / naturalAspectRatio);
+          } else if (node.props.height && !node.props.width) {
+            node.props.width = Math.round(node.props.height * naturalAspectRatio);
+          } else if (!node.props.width && !node.props.height) {
+            node.props.width = dimensions.width;
+            node.props.height = dimensions.height;
+          }
+        }
+        if (!updated && isRelative) {
+          node.props.src = `${withBase(src, `${useNitroOrigin(e)}`)}?${Date.now()}`;
         }
       }
-      if (!updated && isRelative) {
-        node.props.src = `${withBase(src, `${useNitroOrigin(e)}`)}?${Date.now()}`;
+    }
+  },
+  // fix style="background-image: url('')"
+  {
+    filter: (node) => node.props.style?.backgroundImage?.includes("url("),
+    transform: async (node, { e }) => {
+      const backgroundImage = node.props.style.backgroundImage;
+      if (backgroundImage) {
+        const src = backgroundImage.replace(/^url\(['"]?/, "").replace(/['"]?\)$/, "");
+        const isRelative = src?.startsWith("/");
+        if (isRelative)
+          node.props.style.backgroundImage = `url(${withBase(src, `${useNitroOrigin(e)}`)}?${Date.now()})`;
       }
     }
   }
-});
+]);

package/dist/runtime/core/utils/resolveRendererContext.mjs

@@ -7,7 +7,7 @@ import { prerenderOptionsCache } from "../cache/prerender.mjs";
 import { useChromiumRenderer, useSatoriRenderer } from "../renderers/satori/instances.mjs";
 import { separateProps, useOgImageRuntimeConfig } from "../../utils.mjs";
 import { resolvePathCacheKey } from "../../nitro/utils.mjs";
-import { useNitroApp, useRuntimeConfig } from "#imports";
+import { useNitroApp, useRuntimeConfig } from "#internal/nitro";
 export async function resolveRendererContext(e) {
   const runtimeConfig = useOgImageRuntimeConfig();
   const path = parseURL(e.path).pathname;

package/dist/runtime/nitro/plugins/prerender.mjs

@@ -6,7 +6,7 @@ import { extractAndNormaliseOgImageOptions } from "../../core/options/extract.mj
 import { prerenderOptionsCache } from "../../core/cache/prerender.mjs";
 import { isInternalRoute } from "../../utils.pure.mjs";
 import { resolvePathCacheKey } from "../utils.mjs";
-import { useRuntimeConfig } from "#imports";
+import { useRuntimeConfig } from "#internal/nitro";
 export default defineNitroPlugin(async (nitro) => {
   if (!import.meta.prerender)
     return;

package/dist/runtime/types.d.ts

@@ -104,15 +104,20 @@ export interface OgImageOptions<T extends keyof OgImageComponents = 'NuxtSeo'> {
     satori?: SatoriOptions;
     screenshot?: Partial<ScreenshotOptions>;
     sharp?: SharpOptions;
+    fonts?: InputFontConfig[];
     cacheMaxAgeSeconds?: number;
 }
 export interface FontConfig {
     name: string;
-    weight: string | number;
+    weight?: string | number;
     path?: string;
     key?: string;
 }
-export type InputFontConfig = (`${string}:${number}` | FontConfig);
+export interface ResolvedFontConfig extends FontConfig {
+    cacheKey: string;
+    data?: BufferSource;
+}
+export type InputFontConfig = (`${string}:${number}` | string | FontConfig);
 export interface RuntimeCompatibilitySchema {
     chromium: 'node' | false;
     ['css-inline']: 'node' | false;

package/dist/runtime/utils.pure.d.ts

@@ -1,5 +1,6 @@
-import type { OgImageOptions } from './types';
+import type { InputFontConfig, OgImageOptions, ResolvedFontConfig } from './types';
 export declare function isInternalRoute(path: string): boolean;
 export declare function separateProps(options: OgImageOptions | undefined, ignoreKeys?: string[]): {
     props: Record<string, any>;
 };
+export declare function normaliseFontInput(fonts: InputFontConfig[]): ResolvedFontConfig[];

package/dist/runtime/utils.pure.mjs

@@ -9,6 +9,7 @@ function filterIsOgImageOption(key) {
     "extension",
     "width",
     "height",
+    "fonts",
     "alt",
     "props",
     "renderer",
@@ -20,8 +21,7 @@ function filterIsOgImageOption(key) {
     "resvg",
     "sharp",
     "screenshot",
-    "cacheMaxAgeSeconds",
-    "componentHash"
+    "cacheMaxAgeSeconds"
   ];
   return keys.includes(key);
 }
@@ -41,3 +41,23 @@ export function separateProps(options, ignoreKeys = []) {
     props
   };
 }
+export function normaliseFontInput(fonts) {
+  return fonts.map((f) => {
+    if (typeof f === "string") {
+      const [name, weight] = f.split(":");
+      return {
+        cacheKey: f,
+        name,
+        weight: weight || "400",
+        style: "normal",
+        path: void 0
+      };
+    }
+    return {
+      cacheKey: f.key || `${f.name}:${f.weight}`,
+      style: "normal",
+      weight: 400,
+      ...f
+    };
+  });
+}