nuxt-og-image 1.0.0-beta.1 → 1.0.0-beta.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (46) hide show
  1. package/README.md +1 -0
  2. package/dist/client/200.html +2 -2
  3. package/dist/client/404.html +2 -2
  4. package/dist/client/_nuxt/{Icon.4a9650c6.js → Icon.a3c98859.js} +1 -1
  5. package/dist/client/_nuxt/entry.2a315a2c.js +4 -0
  6. package/dist/client/_nuxt/{entry.0827acf4.css → entry.dc5450bf.css} +1 -1
  7. package/dist/client/_nuxt/{error-404.556d8899.js → error-404.0c49154a.js} +1 -1
  8. package/dist/client/_nuxt/{error-500.70731718.js → error-500.f3eec0bb.js} +1 -1
  9. package/dist/client/_nuxt/{error-component.418ebd67.js → error-component.7c753c74.js} +2 -2
  10. package/dist/client/index.html +2 -2
  11. package/dist/module.d.ts +8 -8
  12. package/dist/module.json +1 -1
  13. package/dist/module.mjs +45 -29
  14. package/dist/runtime/components/{OgImageTemplate.island.vue → OgImageBasic.island.vue} +2 -2
  15. package/dist/runtime/components/OgImageDynamic.d.ts +2 -2
  16. package/dist/runtime/components/OgImageScreenshot.d.ts +2 -2
  17. package/dist/runtime/components/OgImageStatic.d.ts +2 -2
  18. package/dist/runtime/composables/defineOgImage.d.ts +5 -5
  19. package/dist/runtime/composables/defineOgImage.mjs +11 -6
  20. package/dist/runtime/nitro/providers/browser.mjs +7 -8
  21. package/dist/runtime/nitro/providers/{satori.d.ts → satori/index.d.ts} +1 -1
  22. package/dist/runtime/nitro/providers/satori/index.mjs +48 -0
  23. package/dist/runtime/nitro/providers/satori/plugins/emojis.d.ts +2 -0
  24. package/dist/runtime/nitro/providers/satori/plugins/emojis.mjs +13 -0
  25. package/dist/runtime/nitro/providers/satori/plugins/flex.d.ts +2 -0
  26. package/dist/runtime/nitro/providers/satori/plugins/flex.mjs +11 -0
  27. package/dist/runtime/nitro/providers/satori/plugins/imageSrc.d.ts +2 -0
  28. package/dist/runtime/nitro/providers/satori/plugins/imageSrc.mjs +24 -0
  29. package/dist/runtime/nitro/providers/satori/plugins/twClasses.d.ts +2 -0
  30. package/dist/runtime/nitro/providers/satori/plugins/twClasses.mjs +9 -0
  31. package/dist/runtime/nitro/providers/satori/utils.d.ts +10 -0
  32. package/dist/runtime/nitro/providers/satori/utils.mjs +33 -0
  33. package/dist/runtime/nitro/routes/__og_image__/html.mjs +42 -12
  34. package/dist/runtime/nitro/routes/__og_image__/index.mjs +4 -4
  35. package/dist/runtime/nitro/routes/__og_image__/og.png.mjs +8 -12
  36. package/dist/runtime/nitro/routes/__og_image__/options.d.ts +5 -0
  37. package/dist/runtime/nitro/routes/__og_image__/{payload.mjs → options.mjs} +21 -28
  38. package/dist/runtime/nitro/routes/__og_image__/svg.mjs +5 -5
  39. package/dist/runtime/nitro/routes/__og_image__/vnode.d.ts +2 -0
  40. package/dist/runtime/nitro/routes/__og_image__/vnode.mjs +16 -0
  41. package/dist/runtime/nitro/utils.d.ts +3 -3
  42. package/dist/runtime/nitro/utils.mjs +4 -4
  43. package/package.json +3 -2
  44. package/dist/client/_nuxt/entry.ce848650.js +0 -4
  45. package/dist/runtime/nitro/providers/satori.mjs +0 -48
  46. package/dist/runtime/nitro/routes/__og_image__/payload.d.ts +0 -5
@@ -1 +1 @@
1
- :root{--nui-c-context:125,125,125}html{background-color:#fff}html.dark{background-color:#222;color:#fff;color-scheme:dark}*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}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;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{color:inherit;font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#9ca3af;opacity:1}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}*,:after,:before{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 transparent;--un-ring-shadow:0 0 transparent;--un-shadow-inset: ;--un-shadow:0 0 transparent;--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgba(147,197,253,.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 transparent;--un-ring-shadow:0 0 transparent;--un-shadow-inset: ;--un-shadow:0 0 transparent;--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgba(147,197,253,.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }.carbon-sun{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' display='inline-block' vertical-align='middle' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6ZM5.394 6.813L6.81 5.399l3.505 3.506L8.9 10.319zM2 15.005h5v2H2zm3.394 10.193L8.9 21.692l1.414 1.414l-3.505 3.506zM15 25.005h2v5h-2zm6.687-1.9l1.414-1.414l3.506 3.506l-1.414 1.414zm3.313-8.1h5v2h-5zm-3.313-6.101l3.506-3.506l1.414 1.414l-3.506 3.506zM15 2.005h2v5h-2z'/%3E%3C/svg%3E");background-color:currentColor;color:inherit;display:inline-block;height:1.2em;-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;vertical-align:middle;width:1.2em}.dark .dark\:carbon-moon{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' display='inline-block' vertical-align='middle' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3Z'/%3E%3C/svg%3E");background-color:currentColor;color:inherit;display:inline-block;height:1.2em;-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;vertical-align:middle;width:1.2em}.logos-chrome{background:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 257' display='inline-block' vertical-align='middle' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cdefs%3E%3ClinearGradient id='logosChrome0' x1='49.998%25' x2='49.998%25' y1='.706%25' y2='96.99%25'%3E%3Cstop offset='0%25' stop-color='%2386BBE5'/%3E%3Cstop offset='100%25' stop-color='%231072BA'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='%23EF3F36' d='M127.789.035s75.32-3.38 115.253 72.328H121.38s-22.96-.74-42.573 27.114c-5.634 11.691-11.69 23.734-4.894 47.468c-9.79-16.586-51.975-90.04-51.975-90.04S51.693 3.028 127.788.035Z'/%3E%3Cpath fill='%23FCD900' d='M239.133 192.229s-34.756 66.94-120.253 63.63c10.564-18.276 60.848-105.358 60.848-105.358s12.149-19.508-2.183-50.425c-7.29-10.74-14.72-21.973-38.664-27.96c19.262-.175 103.95 0 103.95 0s31.726 52.715-3.698 120.113Z'/%3E%3Cpath fill='%2361BC5B' d='M16.973 192.757s-40.601-63.56 5.035-135.958c10.529 18.276 60.813 105.358 60.813 105.358s10.846 20.283 44.756 23.31c12.924-.95 26.375-1.76 43.56-19.472C161.663 182.757 119.16 256 119.16 256s-61.552 1.127-102.188-63.243Z'/%3E%3Cpath fill='%235AB055' d='m118.845 256.493l17.113-71.412s18.804-1.48 34.58-18.769c-9.79 17.22-51.693 90.181-51.693 90.181Z'/%3E%3Cpath fill='%23FFF' d='M70.462 129.056c0-31.48 25.53-57.01 57.01-57.01c31.48 0 57.01 25.53 57.01 57.01c0 31.481-25.53 57.01-57.01 57.01c-31.48-.035-57.01-25.529-57.01-57.01Z'/%3E%3Cpath fill='url(%23logosChrome0)' d='M80.004 129.056c0-26.198 21.234-47.467 47.468-47.467c26.198 0 47.467 21.234 47.467 47.467c0 26.199-21.233 47.468-47.467 47.468c-26.199 0-47.468-21.269-47.468-47.468Z'/%3E%3Cpath fill='%23EACA05' d='m242.795 72.152l-70.462 20.67s-10.634-15.6-33.487-20.67c19.825-.106 103.949 0 103.949 0Z'/%3E%3Cpath fill='%23DF3A32' d='M72.54 144.339c-9.896-17.149-50.602-87.434-50.602-87.434l52.186 51.622s-5.353 11.022-3.345 26.797l1.76 9.015Z'/%3E%3C/svg%3E") no-repeat;background-color:transparent;background-size:100% 100%;display:inline-block;height:1.2em;vertical-align:middle;width:1.2em}.logos-vercel-icon{background:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 222' display='inline-block' vertical-align='middle' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath d='m128 0l128 221.705H0z'/%3E%3C/svg%3E") no-repeat;background-color:transparent;background-size:100% 100%;display:inline-block;height:1.2em;vertical-align:middle;width:1.2em}.logos-vue{background:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 221' display='inline-block' vertical-align='middle' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='%2341B883' d='M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z'/%3E%3Cpath fill='%2341B883' d='m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z'/%3E%3Cpath fill='%2335495E' d='M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z'/%3E%3C/svg%3E") no-repeat;background-color:transparent;background-size:100% 100%;display:inline-block;height:1.2em;vertical-align:middle;width:1.2em}.n-button-icon{font-size:1.1em;margin-left:-.2em;margin-right:.2em}.n-button-base{grid-gap:.25rem;--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color,rgba(0,0,0,.05));align-items:center;border-color:#9ca3af80;border-radius:.25rem;border-width:1px;box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow);display:inline-flex;gap:.25rem;opacity:.8;outline:2px solid transparent!important;outline-offset:2px!important;padding:.25em 1em}.hover\:n-button-hover:hover{border-color:rgba(var(--nui-c-context),1)!important;color:rgba(var(--nui-c-context),1);opacity:1}[n~=borderless]{--un-shadow:0 0 var(--un-shadow-color,transparent)!important;border-style:none!important;box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)!important}.active\:n-button-active:active{--un-ring-width:3px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);--un-ring-color:rgba(var(--nui-c-context),.1);background-color:rgba(var(--nui-c-context),.05);box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.focus-visible\:n-focus-base:focus-visible{--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);--un-ring-color:rgba(var(--nui-c-context),.5);box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.n-transition{transition-duration:.15s;transition-duration:.2s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.fixed{position:fixed}.-bottom-1\/2{bottom:-50%}.left-0{left:0}.right-0{right:0}.z-10{z-index:10}.z-20{z-index:20}.grid{display:grid}.m-0{margin:0}.mx-3{margin-left:.75rem;margin-right:.75rem}.mx-auto{margin-left:auto;margin-right:auto}.mb-1{margin-bottom:.25rem}.mb-16{margin-bottom:4rem}.mb-2,[mb-2=""]{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mr-2,[mr-2=""]{margin-right:.5rem}.mt-2{margin-top:.5rem}.block,[block=""]{display:block}.inline-block{display:inline-block}.hidden{display:none}.h-1\/2{height:50%}.h-7,[h-7=""]{height:1.75rem}.h-auto{height:auto}.h-screen{height:100vh}.h1,[h1=""]{height:.25rem}.max-h-full{max-height:100%}.max-w-520px{max-width:520px}.min-h-screen{min-height:100vh}.w-7,[w-7=""]{width:1.75rem}.w-full{width:100%}.flex,[flex=""]{display:flex}.flex-1{flex:1 1 0%}.flex-col,[flex-col=""]{flex-direction:column}.cursor-pointer{cursor:pointer}.place-content-center{place-content:center}.items-start{align-items:flex-start}.items-center,[items-center=""]{align-items:center}.justify-center,[justify-center=""]{justify-content:center}.justify-between{justify-content:space-between}.space-x-1>:not([hidden])~:not([hidden]){--un-space-x-reverse:0;margin-left:calc(.25rem*(1 - var(--un-space-x-reverse)));margin-right:calc(.25rem*var(--un-space-x-reverse))}.space-x-5>:not([hidden])~:not([hidden]),[space-x-5=""]>:not([hidden])~:not([hidden]){--un-space-x-reverse:0;margin-left:calc(1.25rem*(1 - var(--un-space-x-reverse)));margin-right:calc(1.25rem*var(--un-space-x-reverse))}.space-x-6>:not([hidden])~:not([hidden]){--un-space-x-reverse:0;margin-left:calc(1.5rem*(1 - var(--un-space-x-reverse)));margin-right:calc(1.5rem*var(--un-space-x-reverse))}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.border-2{border-width:2px}.border-dark-900\/30{border-color:#0f0f0f4d}.border-light-700{--un-border-opacity:1;border-color:rgba(233,236,239,var(--un-border-opacity))}.dark .dark\:border-dark-800{--un-border-opacity:1;border-color:rgba(24,24,24,var(--un-border-opacity))}.rounded{border-radius:.25rem}.rounded-full,[rounded-full=""]{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-t-md{border-top-left-radius:.375rem;border-top-right-radius:.375rem}.dark .dark\:border-none{border-style:none}.bg-black\/5{background-color:#0000000d}.bg-light-200{--un-bg-opacity:1;background-color:rgba(250,250,250,var(--un-bg-opacity))}.bg-light-500{--un-bg-opacity:1;background-color:rgba(242,242,242,var(--un-bg-opacity))}.bg-light-900{--un-bg-opacity:1;background-color:rgba(221,225,227,var(--un-bg-opacity))}.bg-white{--un-bg-opacity:1;background-color:rgba(255,255,255,var(--un-bg-opacity))}.dark .dark\:bg-black{--un-bg-opacity:1;background-color:rgba(0,0,0,var(--un-bg-opacity))}.dark .dark\:bg-dark-200{--un-bg-opacity:1;background-color:rgba(50,50,50,var(--un-bg-opacity))}.dark .dark\:bg-dark-300{--un-bg-opacity:1;background-color:rgba(45,45,45,var(--un-bg-opacity))}.dark .dark\:bg-dark-800{--un-bg-opacity:1;background-color:rgba(24,24,24,var(--un-bg-opacity))}.dark .dark\:bg-dark-900{--un-bg-opacity:1;background-color:rgba(15,15,15,var(--un-bg-opacity))}.dark .dark\:bg-dark-900\/20{background-color:#0f0f0f33}.dark .dark\:bg-white\/10{background-color:#ffffff1a}.hover\:bg-blue-200:hover{--un-bg-opacity:1;background-color:rgba(191,219,254,var(--un-bg-opacity))}.p-0,[p-0=""]{padding:0}.p-1{padding:.25rem}.p-8{padding:2rem}.px,.px-4{padding-left:1rem;padding-right:1rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-8{padding-left:2rem;padding-right:2rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.py-2\.5{padding-bottom:.625rem;padding-top:.625rem}.py-5{padding-bottom:1.25rem;padding-top:1.25rem}.py-7{padding-bottom:1.75rem;padding-top:1.75rem}.pb-1{padding-bottom:.25rem}.pb-7,[pb-7=""]{padding-bottom:1.75rem}.pt-14{padding-top:3.5rem}.pt-2{padding-top:.5rem}.text-center{text-align:center}.font-sans{font-family:Avenir,Helvetica,Arial,sans-serif}.text-6xl{font-size:3.75rem;line-height:1}.text-8xl{font-size:6rem;line-height:1}.text-decoration\:inherit{line-height:inherit}.text-sm,[text-sm=""]{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs,[text-xs=""]{font-size:.75rem;line-height:1rem}.font-light{font-weight:300}.font-medium{font-weight:500}.leading-5{line-height:1.25rem}.leading-tight{line-height:1.25}.dark .dark\:text-light{--un-text-opacity:1;color:rgba(246,246,246,var(--un-text-opacity))}.dark .dark\:text-light-100{--un-text-opacity:1;color:rgba(252,252,252,var(--un-text-opacity))}.dark .dark\:text-light-900{--un-text-opacity:1;color:rgba(221,225,227,var(--un-text-opacity))}.dark .dark\:text-white{--un-text-opacity:1;color:rgba(255,255,255,var(--un-text-opacity))}.text-black{--un-text-opacity:1;color:rgba(0,0,0,var(--un-text-opacity))}.text-blue-900\/70{color:#1e3a8ab3}.text-dark-200{--un-text-opacity:1;color:rgba(50,50,50,var(--un-text-opacity))}.text-dark-700{--un-text-opacity:1;color:rgba(27,27,27,var(--un-text-opacity))}.text-dark-800{--un-text-opacity:1;color:rgba(24,24,24,var(--un-text-opacity))}.underline{text-decoration-line:underline}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smoothing:grayscale}.op50,.op50\:,.opacity-50,[op50=""]{opacity:.5}.opacity-60,[opacity-60=""]{opacity:.6}.opacity-80,[opacity-80=""]{opacity:.8}.shadow{--un-shadow:var(--un-shadow-inset) 0 1px 3px 0 var(--un-shadow-color,rgba(0,0,0,.1)),var(--un-shadow-inset) 0 1px 2px -1px var(--un-shadow-color,rgba(0,0,0,.1));box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-2:focus{--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.ring-offset-2{--un-ring-offset-width:2px}.ring-white{--un-ring-opacity:1;--un-ring-color:rgba(255,255,255,var(--un-ring-opacity))}.ring-opacity-60{--un-ring-opacity:.6}.ring-offset-blue-400{--un-ring-offset-opacity:1;--un-ring-offset-color:rgba(96,165,250,var(--un-ring-offset-opacity))}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}[n~=lg]{font-size:1.125rem;line-height:1.75rem}.n-disabled\:n-disabled[disabled],[disabled] .n-disabled\:n-disabled{filter:saturate(0);opacity:.4;pointer-events:none}@media (min-width:640px){.sm\:px-0{padding-left:0;padding-right:0}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:py-3{padding-bottom:.75rem;padding-top:.75rem}.sm\:text-2xl{font-size:1.5rem;line-height:2rem}.sm\:text-4xl{font-size:2.25rem;line-height:2.5rem}.sm\:text-8xl{font-size:6rem;line-height:1}.sm\:text-xl{font-size:1.25rem;line-height:1.75rem}}@media (min-width:1280px){[xl\:hidden=""]{display:none}}@media (min-width:1536px){.\32xl\:mx-auto{margin-left:auto;margin-right:auto}.\32xl\:mb-8{margin-bottom:2rem}.\32xl\:block{display:block}.\32xl\:hidden{display:none}.\32xl\:h-full{height:100%}.\32xl\:w-1205px{width:1205px}.\32xl\:flex{display:flex}.\32xl\:flex-row{flex-direction:row}.\32xl\:space-x-0>:not([hidden])~:not([hidden]){--un-space-x-reverse:0;margin-left:calc(0rem*(1 - var(--un-space-x-reverse)));margin-right:calc(0rem*var(--un-space-x-reverse))}.\32xl\:space-y-4>:not([hidden])~:not([hidden]){--un-space-y-reverse:0;margin-bottom:calc(1rem*var(--un-space-y-reverse));margin-top:calc(1rem*(1 - var(--un-space-y-reverse)))}.\32xl\:px-10{padding-left:2.5rem;padding-right:2.5rem}.\32xl\:py-7{padding-bottom:1.75rem;padding-top:1.75rem}}iframe[data-v-aa5b40b2]{aspect-ratio:40/21;max-width:1200px;transition:.4s;width:100%}img[data-v-e284dbf4]{aspect-ratio:40/21;max-width:1200px;transition:.4s ease-in-out}.tab-panels{width:100%}div[role=tabpanel]{display:flex;width:100%}
1
+ :root{--nui-c-context:125,125,125}html{background-color:#fff}html.dark{background-color:#222;color:#fff;color-scheme:dark}*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}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;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{color:inherit;font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#9ca3af;opacity:1}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}*,:after,:before{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 transparent;--un-ring-shadow:0 0 transparent;--un-shadow-inset: ;--un-shadow:0 0 transparent;--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgba(147,197,253,.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 transparent;--un-ring-shadow:0 0 transparent;--un-shadow-inset: ;--un-shadow:0 0 transparent;--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgba(147,197,253,.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }.carbon-sun{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' display='inline-block' vertical-align='middle' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6ZM5.394 6.813L6.81 5.399l3.505 3.506L8.9 10.319zM2 15.005h5v2H2zm3.394 10.193L8.9 21.692l1.414 1.414l-3.505 3.506zM15 25.005h2v5h-2zm6.687-1.9l1.414-1.414l3.506 3.506l-1.414 1.414zm3.313-8.1h5v2h-5zm-3.313-6.101l3.506-3.506l1.414 1.414l-3.506 3.506zM15 2.005h2v5h-2z'/%3E%3C/svg%3E");background-color:currentColor;color:inherit;display:inline-block;height:1.2em;-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;vertical-align:middle;width:1.2em}.dark .dark\:carbon-moon{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' display='inline-block' vertical-align='middle' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3Z'/%3E%3C/svg%3E");background-color:currentColor;color:inherit;display:inline-block;height:1.2em;-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;vertical-align:middle;width:1.2em}.logos-chrome{background:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 257' display='inline-block' vertical-align='middle' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cdefs%3E%3ClinearGradient id='logosChrome0' x1='49.998%25' x2='49.998%25' y1='.706%25' y2='96.99%25'%3E%3Cstop offset='0%25' stop-color='%2386BBE5'/%3E%3Cstop offset='100%25' stop-color='%231072BA'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='%23EF3F36' d='M127.789.035s75.32-3.38 115.253 72.328H121.38s-22.96-.74-42.573 27.114c-5.634 11.691-11.69 23.734-4.894 47.468c-9.79-16.586-51.975-90.04-51.975-90.04S51.693 3.028 127.788.035Z'/%3E%3Cpath fill='%23FCD900' d='M239.133 192.229s-34.756 66.94-120.253 63.63c10.564-18.276 60.848-105.358 60.848-105.358s12.149-19.508-2.183-50.425c-7.29-10.74-14.72-21.973-38.664-27.96c19.262-.175 103.95 0 103.95 0s31.726 52.715-3.698 120.113Z'/%3E%3Cpath fill='%2361BC5B' d='M16.973 192.757s-40.601-63.56 5.035-135.958c10.529 18.276 60.813 105.358 60.813 105.358s10.846 20.283 44.756 23.31c12.924-.95 26.375-1.76 43.56-19.472C161.663 182.757 119.16 256 119.16 256s-61.552 1.127-102.188-63.243Z'/%3E%3Cpath fill='%235AB055' d='m118.845 256.493l17.113-71.412s18.804-1.48 34.58-18.769c-9.79 17.22-51.693 90.181-51.693 90.181Z'/%3E%3Cpath fill='%23FFF' d='M70.462 129.056c0-31.48 25.53-57.01 57.01-57.01c31.48 0 57.01 25.53 57.01 57.01c0 31.481-25.53 57.01-57.01 57.01c-31.48-.035-57.01-25.529-57.01-57.01Z'/%3E%3Cpath fill='url(%23logosChrome0)' d='M80.004 129.056c0-26.198 21.234-47.467 47.468-47.467c26.198 0 47.467 21.234 47.467 47.467c0 26.199-21.233 47.468-47.467 47.468c-26.199 0-47.468-21.269-47.468-47.468Z'/%3E%3Cpath fill='%23EACA05' d='m242.795 72.152l-70.462 20.67s-10.634-15.6-33.487-20.67c19.825-.106 103.949 0 103.949 0Z'/%3E%3Cpath fill='%23DF3A32' d='M72.54 144.339c-9.896-17.149-50.602-87.434-50.602-87.434l52.186 51.622s-5.353 11.022-3.345 26.797l1.76 9.015Z'/%3E%3C/svg%3E") no-repeat;background-color:transparent;background-size:100% 100%;display:inline-block;height:1.2em;vertical-align:middle;width:1.2em}.logos-vercel-icon{background:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 222' display='inline-block' vertical-align='middle' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath d='m128 0l128 221.705H0z'/%3E%3C/svg%3E") no-repeat;background-color:transparent;background-size:100% 100%;display:inline-block;height:1.2em;vertical-align:middle;width:1.2em}.logos-vue{background:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 221' display='inline-block' vertical-align='middle' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='%2341B883' d='M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z'/%3E%3Cpath fill='%2341B883' d='m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z'/%3E%3Cpath fill='%2335495E' d='M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z'/%3E%3C/svg%3E") no-repeat;background-color:transparent;background-size:100% 100%;display:inline-block;height:1.2em;vertical-align:middle;width:1.2em}.n-button-icon{font-size:1.1em;margin-left:-.2em;margin-right:.2em}.n-button-base{grid-gap:.25rem;--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color,rgba(0,0,0,.05));align-items:center;border-color:#9ca3af80;border-radius:.25rem;border-width:1px;box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow);display:inline-flex;gap:.25rem;opacity:.8;outline:2px solid transparent!important;outline-offset:2px!important;padding:.25em 1em}.hover\:n-button-hover:hover{border-color:rgba(var(--nui-c-context),1)!important;color:rgba(var(--nui-c-context),1);opacity:1}[n~=borderless]{--un-shadow:0 0 var(--un-shadow-color,transparent)!important;border-style:none!important;box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)!important}.active\:n-button-active:active{--un-ring-width:3px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);--un-ring-color:rgba(var(--nui-c-context),.1);background-color:rgba(var(--nui-c-context),.05);box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.focus-visible\:n-focus-base:focus-visible{--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);--un-ring-color:rgba(var(--nui-c-context),.5);box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.n-transition{transition-duration:.15s;transition-duration:.2s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.fixed{position:fixed}.-bottom-1\/2{bottom:-50%}.left-0{left:0}.right-0{right:0}.z-10{z-index:10}.z-20{z-index:20}.grid{display:grid}.m-0{margin:0}.mx-3{margin-left:.75rem;margin-right:.75rem}.mx-auto{margin-left:auto;margin-right:auto}.mb-1{margin-bottom:.25rem}.mb-16{margin-bottom:4rem}.mb-2,[mb-2=""]{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mr-2,[mr-2=""]{margin-right:.5rem}.mt-2{margin-top:.5rem}.mt-5{margin-top:1.25rem}.block,[block=""]{display:block}.inline-block{display:inline-block}.hidden{display:none}.h-1\/2{height:50%}.h-7,[h-7=""]{height:1.75rem}.h-auto{height:auto}.h-screen{height:100vh}.h1,[h1=""]{height:.25rem}.max-h-full{max-height:100%}.max-w-520px{max-width:520px}.min-h-screen{min-height:100vh}.w-7,[w-7=""]{width:1.75rem}.w-full{width:100%}.flex,[flex=""]{display:flex}.flex-1{flex:1 1 0%}.flex-col,[flex-col=""]{flex-direction:column}.cursor-pointer{cursor:pointer}.place-content-center{place-content:center}.items-start{align-items:flex-start}.items-center,[items-center=""]{align-items:center}.justify-center,[justify-center=""]{justify-content:center}.justify-between{justify-content:space-between}.space-x-1>:not([hidden])~:not([hidden]){--un-space-x-reverse:0;margin-left:calc(.25rem*(1 - var(--un-space-x-reverse)));margin-right:calc(.25rem*var(--un-space-x-reverse))}.space-x-5>:not([hidden])~:not([hidden]),[space-x-5=""]>:not([hidden])~:not([hidden]){--un-space-x-reverse:0;margin-left:calc(1.25rem*(1 - var(--un-space-x-reverse)));margin-right:calc(1.25rem*var(--un-space-x-reverse))}.space-x-6>:not([hidden])~:not([hidden]){--un-space-x-reverse:0;margin-left:calc(1.5rem*(1 - var(--un-space-x-reverse)));margin-right:calc(1.5rem*var(--un-space-x-reverse))}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.border-2{border-width:2px}.border-dark-900\/30{border-color:#0f0f0f4d}.border-light-700{--un-border-opacity:1;border-color:rgba(233,236,239,var(--un-border-opacity))}.dark .dark\:border-dark-800{--un-border-opacity:1;border-color:rgba(24,24,24,var(--un-border-opacity))}.rounded{border-radius:.25rem}.rounded-full,[rounded-full=""]{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-t-md{border-top-left-radius:.375rem;border-top-right-radius:.375rem}.dark .dark\:border-none{border-style:none}.bg-black\/5{background-color:#0000000d}.bg-light-200{--un-bg-opacity:1;background-color:rgba(250,250,250,var(--un-bg-opacity))}.bg-light-500{--un-bg-opacity:1;background-color:rgba(242,242,242,var(--un-bg-opacity))}.bg-light-900{--un-bg-opacity:1;background-color:rgba(221,225,227,var(--un-bg-opacity))}.bg-white{--un-bg-opacity:1;background-color:rgba(255,255,255,var(--un-bg-opacity))}.dark .dark\:bg-black{--un-bg-opacity:1;background-color:rgba(0,0,0,var(--un-bg-opacity))}.dark .dark\:bg-dark-200{--un-bg-opacity:1;background-color:rgba(50,50,50,var(--un-bg-opacity))}.dark .dark\:bg-dark-300{--un-bg-opacity:1;background-color:rgba(45,45,45,var(--un-bg-opacity))}.dark .dark\:bg-dark-800{--un-bg-opacity:1;background-color:rgba(24,24,24,var(--un-bg-opacity))}.dark .dark\:bg-dark-900{--un-bg-opacity:1;background-color:rgba(15,15,15,var(--un-bg-opacity))}.dark .dark\:bg-dark-900\/20{background-color:#0f0f0f33}.dark .dark\:bg-white\/10{background-color:#ffffff1a}.hover\:bg-blue-200:hover{--un-bg-opacity:1;background-color:rgba(191,219,254,var(--un-bg-opacity))}.p-0,[p-0=""]{padding:0}.p-1{padding:.25rem}.p-8{padding:2rem}.px,.px-4{padding-left:1rem;padding-right:1rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-8{padding-left:2rem;padding-right:2rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.py-2\.5{padding-bottom:.625rem;padding-top:.625rem}.py-5{padding-bottom:1.25rem;padding-top:1.25rem}.py-7{padding-bottom:1.75rem;padding-top:1.75rem}.pb-1{padding-bottom:.25rem}.pb-7,[pb-7=""]{padding-bottom:1.75rem}.pt-14{padding-top:3.5rem}.pt-2{padding-top:.5rem}.text-center{text-align:center}.font-sans{font-family:Avenir,Helvetica,Arial,sans-serif}.text-6xl{font-size:3.75rem;line-height:1}.text-8xl{font-size:6rem;line-height:1}.text-decoration\:inherit{line-height:inherit}.text-sm,[text-sm=""]{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs,[text-xs=""]{font-size:.75rem;line-height:1rem}.font-light{font-weight:300}.font-medium{font-weight:500}.leading-5{line-height:1.25rem}.leading-tight{line-height:1.25}.dark .dark\:text-light{--un-text-opacity:1;color:rgba(246,246,246,var(--un-text-opacity))}.dark .dark\:text-light-100{--un-text-opacity:1;color:rgba(252,252,252,var(--un-text-opacity))}.dark .dark\:text-light-900{--un-text-opacity:1;color:rgba(221,225,227,var(--un-text-opacity))}.dark .dark\:text-white{--un-text-opacity:1;color:rgba(255,255,255,var(--un-text-opacity))}.text-black{--un-text-opacity:1;color:rgba(0,0,0,var(--un-text-opacity))}.text-blue-900\/70{color:#1e3a8ab3}.text-dark-200{--un-text-opacity:1;color:rgba(50,50,50,var(--un-text-opacity))}.text-dark-700{--un-text-opacity:1;color:rgba(27,27,27,var(--un-text-opacity))}.text-dark-800{--un-text-opacity:1;color:rgba(24,24,24,var(--un-text-opacity))}.underline{text-decoration-line:underline}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smoothing:grayscale}.op50,.op50\:,.opacity-50,[op50=""]{opacity:.5}.opacity-60,[opacity-60=""]{opacity:.6}.opacity-80,[opacity-80=""]{opacity:.8}.shadow{--un-shadow:var(--un-shadow-inset) 0 1px 3px 0 var(--un-shadow-color,rgba(0,0,0,.1)),var(--un-shadow-inset) 0 1px 2px -1px var(--un-shadow-color,rgba(0,0,0,.1));box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-2:focus{--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.ring-offset-2{--un-ring-offset-width:2px}.ring-white{--un-ring-opacity:1;--un-ring-color:rgba(255,255,255,var(--un-ring-opacity))}.ring-opacity-60{--un-ring-opacity:.6}.ring-offset-blue-400{--un-ring-offset-opacity:1;--un-ring-offset-color:rgba(96,165,250,var(--un-ring-offset-opacity))}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}[n~=lg]{font-size:1.125rem;line-height:1.75rem}.n-disabled\:n-disabled[disabled],[disabled] .n-disabled\:n-disabled{filter:saturate(0);opacity:.4;pointer-events:none}@media (min-width:640px){.sm\:px-0{padding-left:0;padding-right:0}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:py-3{padding-bottom:.75rem;padding-top:.75rem}.sm\:text-2xl{font-size:1.5rem;line-height:2rem}.sm\:text-4xl{font-size:2.25rem;line-height:2.5rem}.sm\:text-8xl{font-size:6rem;line-height:1}.sm\:text-xl{font-size:1.25rem;line-height:1.75rem}}@media (min-width:1280px){[xl\:hidden=""]{display:none}}@media (min-width:1536px){.\32xl\:mx-auto{margin-left:auto;margin-right:auto}.\32xl\:mb-8{margin-bottom:2rem}.\32xl\:block{display:block}.\32xl\:hidden{display:none}.\32xl\:h-full{height:100%}.\32xl\:w-1205px{width:1205px}.\32xl\:flex{display:flex}.\32xl\:flex-row{flex-direction:row}.\32xl\:space-x-0>:not([hidden])~:not([hidden]){--un-space-x-reverse:0;margin-left:calc(0rem*(1 - var(--un-space-x-reverse)));margin-right:calc(0rem*var(--un-space-x-reverse))}.\32xl\:space-y-4>:not([hidden])~:not([hidden]){--un-space-y-reverse:0;margin-bottom:calc(1rem*var(--un-space-y-reverse));margin-top:calc(1rem*(1 - var(--un-space-y-reverse)))}.\32xl\:px-10{padding-left:2.5rem;padding-right:2.5rem}.\32xl\:py-7{padding-bottom:1.75rem;padding-top:1.75rem}}iframe[data-v-aa5b40b2]{aspect-ratio:40/21;max-width:1200px;transition:.4s;width:100%}img[data-v-e284dbf4]{aspect-ratio:40/21;max-width:1200px;transition:.4s ease-in-out}.tab-panels{width:100%}div[role=tabpanel]{display:flex;width:100%}
@@ -1 +1 @@
1
- import{s as n,v as a,o as r,l,x as e,t as s,y as d,z as c,A as p,B as f,C as x,D as h}from"./entry.ce848650.js";const m=t=>(x("data-v-18337f8d"),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)),_={class:"max-w-520px text-center z-20"},b=["textContent"],y=["textContent"],w={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 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}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=p;return r(),l("div",u,[g,e("div",_,[e("h1",{class:"text-8xl sm:text-10xl font-medium mb-8",textContent:s(t.statusCode)},null,8,b),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,y),e("div",w,[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(()=>[f(s(t.backHome),1)]),_:1})])])])}}},z=n(S,[["__scopeId","data-v-18337f8d"]]);export{z as default};
1
+ import{s as n,v as a,o as r,l,x as e,t as s,y as d,z as c,A as p,B as f,C as x,D as h}from"./entry.2a315a2c.js";const m=t=>(x("data-v-18337f8d"),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)),_={class:"max-w-520px text-center z-20"},b=["textContent"],y=["textContent"],w={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 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}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=p;return r(),l("div",u,[g,e("div",_,[e("h1",{class:"text-8xl sm:text-10xl font-medium mb-8",textContent:s(t.statusCode)},null,8,b),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,y),e("div",w,[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(()=>[f(s(t.backHome),1)]),_:1})])])])}}},z=n(S,[["__scopeId","data-v-18337f8d"]]);export{z as default};
@@ -1 +1 @@
1
- import{s as i,v as a,o as r,l as n,x as e,t as s,C as l,D as d}from"./entry.ce848650.js";const c=t=>(l("data-v-428e244b"),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)])]))}},w=i(x,[["__scopeId","data-v-428e244b"]]);export{w as default};
1
+ import{s as i,v as a,o as r,l as n,x as e,t as s,C as l,D as d}from"./entry.2a315a2c.js";const c=t=>(l("data-v-428e244b"),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)])]))}},w=i(x,[["__scopeId","data-v-428e244b"]]);export{w as default};
@@ -1,3 +1,3 @@
1
- import{d as n,_ as o,o as _,c as f,n as g,g as E,u as r}from"./entry.ce848650.js";const k={__name:"nuxt-error-page",props:{error:Object},setup(t){(t.error.stack||"").split(`
1
+ import{d as n,_ as o,o as _,c as f,n as g,g as E,u as r}from"./entry.2a315a2c.js";const k={__name:"nuxt-error-page",props:{error:Object},setup(t){(t.error.stack||"").split(`
2
2
  `).splice(1).map(e=>({text:e.replace("webpack:/","").replace(".vue",".js").trim(),internal:e.includes("node_modules")&&!e.includes(".cache")||e.includes("internal")||e.includes("new Promise")})).map(e=>`<span class="stack${e.internal?" internal":""}">${e.text}</span>`).join(`
3
- `);const s=Number(t.error.statusCode||500),a=s===404,c=t.error.statusMessage??(a?"Page Not Found":"Internal Server Error"),u=t.error.message||t.error.toString(),i=void 0,d=n(()=>o(()=>import("./error-404.556d8899.js"),["./error-404.556d8899.js","./entry.ce848650.js","./entry.0827acf4.css","./error-404.68aa58b4.css"],import.meta.url).then(e=>e.default||e)),l=n(()=>o(()=>import("./error-500.70731718.js"),["./error-500.70731718.js","./entry.ce848650.js","./entry.0827acf4.css","./error-500.dc5710d1.css"],import.meta.url).then(e=>e.default||e)),m=a?d:l;return(e,p)=>(_(),f(r(m),g(E({statusCode:r(s),statusMessage:r(c),description:r(u),stack:r(i)})),null,16))}},v=k;export{v as default};
3
+ `);const s=Number(t.error.statusCode||500),a=s===404,c=t.error.statusMessage??(a?"Page Not Found":"Internal Server Error"),u=t.error.message||t.error.toString(),i=void 0,d=n(()=>o(()=>import("./error-404.0c49154a.js"),["./error-404.0c49154a.js","./entry.2a315a2c.js","./entry.dc5450bf.css","./error-404.68aa58b4.css"],import.meta.url).then(e=>e.default||e)),l=n(()=>o(()=>import("./error-500.f3eec0bb.js"),["./error-500.f3eec0bb.js","./entry.2a315a2c.js","./entry.dc5450bf.css","./error-500.dc5710d1.css"],import.meta.url).then(e=>e.default||e)),m=a?d:l;return(e,p)=>(_(),f(r(m),g(E({statusCode:r(s),statusMessage:r(c),description:r(u),stack:r(i)})),null,16))}},v=k;export{v as default};
@@ -1,7 +1,7 @@
1
1
  <!DOCTYPE html>
2
2
  <html >
3
3
  <head><meta charset="utf-8">
4
- <meta name="viewport" content="width=device-width, initial-scale=1"><link rel="modulepreload" as="script" crossorigin href="/__nuxt_og_image__/client/_nuxt/entry.ce848650.js"><link rel="preload" as="style" href="/__nuxt_og_image__/client/_nuxt/entry.0827acf4.css"><link rel="prefetch" as="script" crossorigin href="/__nuxt_og_image__/client/_nuxt/error-component.418ebd67.js"><link rel="stylesheet" href="/__nuxt_og_image__/client/_nuxt/entry.0827acf4.css"><script>"use strict";const w=window,de=document.documentElement,knownColorSchemes=["dark","light"],preference=window.localStorage.getItem("nuxt-color-mode")||"system";let value=preference==="system"?getColorScheme():preference;const forcedColorMode=de.getAttribute("data-color-mode-forced");forcedColorMode&&(value=forcedColorMode),addColorScheme(value),w["__NUXT_COLOR_MODE__"]={preference,value,getColorScheme,addColorScheme,removeColorScheme};function addColorScheme(e){const o=""+e+"",t="";de.classList?de.classList.add(o):de.className+=" "+o,t&&de.setAttribute("data-"+t,e)}function removeColorScheme(e){const o=""+e+"",t="";de.classList?de.classList.remove(o):de.className=de.className.replace(new RegExp(o,"g"),""),t&&de.removeAttribute("data-"+t)}function prefersColorScheme(e){return w.matchMedia("(prefers-color-scheme"+e+")")}function getColorScheme(){if(w.matchMedia&&prefersColorScheme("").media!=="not all"){for(const e of knownColorSchemes)if(prefersColorScheme(":"+e).matches)return e}return"light"}
4
+ <meta name="viewport" content="width=device-width, initial-scale=1"><link rel="modulepreload" as="script" crossorigin href="/__nuxt_og_image__/client/_nuxt/entry.2a315a2c.js"><link rel="preload" as="style" href="/__nuxt_og_image__/client/_nuxt/entry.dc5450bf.css"><link rel="prefetch" as="script" crossorigin href="/__nuxt_og_image__/client/_nuxt/error-component.7c753c74.js"><link rel="stylesheet" href="/__nuxt_og_image__/client/_nuxt/entry.dc5450bf.css"><script>"use strict";const w=window,de=document.documentElement,knownColorSchemes=["dark","light"],preference=window.localStorage.getItem("nuxt-color-mode")||"system";let value=preference==="system"?getColorScheme():preference;const forcedColorMode=de.getAttribute("data-color-mode-forced");forcedColorMode&&(value=forcedColorMode),addColorScheme(value),w["__NUXT_COLOR_MODE__"]={preference,value,getColorScheme,addColorScheme,removeColorScheme};function addColorScheme(e){const o=""+e+"",t="";de.classList?de.classList.add(o):de.className+=" "+o,t&&de.setAttribute("data-"+t,e)}function removeColorScheme(e){const o=""+e+"",t="";de.classList?de.classList.remove(o):de.className=de.className.replace(new RegExp(o,"g"),""),t&&de.removeAttribute("data-"+t)}function prefersColorScheme(e){return w.matchMedia("(prefers-color-scheme"+e+")")}function getColorScheme(){if(w.matchMedia&&prefersColorScheme("").media!=="not all"){for(const e of knownColorSchemes)if(prefersColorScheme(":"+e).matches)return e}return"light"}
5
5
  </script></head>
6
- <body ><div id="__nuxt"></div><script>window.__NUXT__={serverRendered:false,config:{public:{},app:{baseURL:"\u002F__nuxt_og_image__\u002Fclient",buildAssetsDir:"\u002F_nuxt\u002F",cdnURL:""}},data:{},state:{}}</script><script type="module" src="/__nuxt_og_image__/client/_nuxt/entry.ce848650.js" crossorigin></script></body>
6
+ <body ><div id="__nuxt"></div><script>window.__NUXT__={serverRendered:false,config:{public:{},app:{baseURL:"\u002F__nuxt_og_image__\u002Fclient",buildAssetsDir:"\u002F_nuxt\u002F",cdnURL:""}},data:{},state:{}}</script><script type="module" src="/__nuxt_og_image__/client/_nuxt/entry.2a315a2c.js" crossorigin></script></body>
7
7
  </html>
package/dist/module.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import * as _nuxt_schema from '@nuxt/schema';
2
+ import { SatoriOptions } from 'satori';
2
3
 
3
4
  interface ScreenshotOptions {
4
5
  colorScheme?: 'dark' | 'light';
@@ -21,7 +22,7 @@ interface ScreenshotOptions {
21
22
  */
22
23
  delay?: number;
23
24
  }
24
- interface OgImagePayload extends Partial<ScreenshotOptions> {
25
+ interface OgImageOptions extends Partial<ScreenshotOptions> {
25
26
  provider?: 'browser' | 'satori';
26
27
  prerender?: boolean;
27
28
  title?: string;
@@ -30,19 +31,18 @@ interface OgImagePayload extends Partial<ScreenshotOptions> {
30
31
  alt?: string;
31
32
  [key: string]: any;
32
33
  }
33
- type OgImageScreenshotPayload = Omit<OgImagePayload, 'component'>;
34
- declare module 'nitropack' {
35
- interface NitroRouteRules {
36
- ogImage?: false | OgImageScreenshotPayload | OgImagePayload;
37
- }
38
- }
39
34
 
40
- interface ModuleOptions extends ScreenshotOptions {
35
+ interface ModuleOptions {
41
36
  /**
42
37
  * The hostname of your website.
43
38
  */
44
39
  host: string;
40
+ defaults: OgImageOptions;
45
41
  experimentalNitroBrowser: boolean;
42
+ satoriFonts: Array<Partial<SatoriOptions['fonts'][number]> & {
43
+ publicPath: string;
44
+ }>;
45
+ satoriOptions: Partial<SatoriOptions>;
46
46
  forcePrerender: boolean;
47
47
  }
48
48
  declare const _default: _nuxt_schema.NuxtModule<ModuleOptions>;
package/dist/module.json CHANGED
@@ -5,5 +5,5 @@
5
5
  "bridge": false
6
6
  },
7
7
  "configKey": "ogImage",
8
- "version": "1.0.0-beta.1"
8
+ "version": "1.0.0-beta.10"
9
9
  }
package/dist/module.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import { mkdir, writeFile } from 'node:fs/promises';
2
2
  import { existsSync } from 'fs';
3
- import { useNuxt, addTemplate, defineNuxtModule, createResolver, addServerHandler, addImports, addComponent } from '@nuxt/kit';
3
+ import { useNuxt, addTemplate, defineNuxtModule, createResolver, getNuxtVersion, useLogger, addServerHandler, addImports, addComponent } from '@nuxt/kit';
4
4
  import { execa } from 'execa';
5
5
  import chalk from 'chalk';
6
6
  import defu from 'defu';
@@ -57,13 +57,8 @@ async function screenshot(browser, url, options) {
57
57
  return await page.screenshot();
58
58
  }
59
59
 
60
- const PayloadScriptId = "nuxt-og-image-payload";
61
- const Constants = {
62
- PayloadScriptId
63
- };
64
-
65
60
  function exposeConfig(alias, filename, config) {
66
- const exports = Object.entries(config).map(([k, v]) => `export const ${k} = '${v}'`).join("\n");
61
+ const exports = Object.entries(config).map(([k, v]) => `export const ${k} = ${JSON.stringify(v)}`).join("\n");
67
62
  useNuxt().options.alias[alias] = addTemplate({
68
63
  filename,
69
64
  getContents: () => exports
@@ -72,6 +67,13 @@ function exposeConfig(alias, filename, config) {
72
67
  nitroConfig.virtual[alias] = exports;
73
68
  });
74
69
  }
70
+ function extractOgImageOptions(html) {
71
+ const options = html.match(/<script id="nuxt-og-image-options" type="application\/json">(.+?)<\/script>/)?.[1];
72
+ return options ? JSON.parse(options) : false;
73
+ }
74
+ function stripOgImageOptions(html) {
75
+ return html.replace(/<script id="nuxt-og-image-options" type="application\/json">(.*?)<\/script>/, "");
76
+ }
75
77
 
76
78
  function setupPlaygroundRPC(nuxt, config) {
77
79
  const serverFunctions = {
@@ -155,13 +157,6 @@ function getBodyJson(req) {
155
157
  });
156
158
  }
157
159
 
158
- function extractOgPayload(html) {
159
- const payload = html.match(new RegExp(`<script id="${PayloadScriptId}" type="application/json">(.+?)<\/script>`))?.[1];
160
- if (payload) {
161
- return JSON.parse(payload);
162
- }
163
- return false;
164
- }
165
160
  const PATH = "/__nuxt_og_image__";
166
161
  const PATH_ENTRY = `${PATH}/entry`;
167
162
  const PATH_PLAYGROUND = `${PATH}/client`;
@@ -179,8 +174,26 @@ const module = defineNuxtModule({
179
174
  experimentalNitroBrowser: false,
180
175
  forcePrerender: !nuxt.options.dev && nuxt.options._generate,
181
176
  host: nuxt.options.runtimeConfig.public?.siteUrl,
182
- width: 1200,
183
- height: 630
177
+ defaults: {
178
+ component: "OgImageBasic",
179
+ width: 1200,
180
+ height: 630
181
+ },
182
+ satoriFonts: [
183
+ {
184
+ name: "Inter",
185
+ weight: 400,
186
+ style: "normal",
187
+ publicPath: "/inter-latin-ext-400-normal.woff"
188
+ },
189
+ {
190
+ name: "Inter",
191
+ weight: 700,
192
+ style: "normal",
193
+ publicPath: "/inter-latin-ext-700-normal.woff"
194
+ }
195
+ ],
196
+ satoriOptions: {}
184
197
  };
185
198
  },
186
199
  async setup(config, nuxt) {
@@ -193,6 +206,10 @@ const module = defineNuxtModule({
193
206
  };
194
207
  nuxt.options.experimental.componentIslands = true;
195
208
  const isEdge = (process.env.NITRO_PRESET || "").includes("edge");
209
+ const hasIslandSupport = getNuxtVersion(nuxt) !== "3.0.0";
210
+ const logger = useLogger("nuxt-og-image");
211
+ if (!hasIslandSupport)
212
+ logger.warn("You are using Nuxt 3.0.0 with `nuxt-og-image`, which only supports screenshots.\nPlease upgrade to Nuxt 3.0.1 or the edge channel: https://nuxt.com/docs/guide/going-further/edge-channel.");
196
213
  addTemplate({
197
214
  filename: "nuxt-og-image.d.ts",
198
215
  getContents: () => {
@@ -211,7 +228,7 @@ export {}
211
228
  nuxt.hooks.hook("prepare:types", ({ references }) => {
212
229
  references.push({ path: resolve(nuxt.options.buildDir, "nuxt-og-image.d.ts") });
213
230
  });
214
- ["html", "payload", "svg", "og.png"].forEach((type) => {
231
+ ["html", "options", "svg", "vnode", "og.png"].forEach((type) => {
215
232
  addServerHandler({
216
233
  handler: resolve(`./runtime/nitro/routes/__og_image__/${type}`)
217
234
  });
@@ -238,8 +255,8 @@ export {}
238
255
  });
239
256
  });
240
257
  await addComponent({
241
- name: "OgImageTemplate",
242
- filePath: resolve("./runtime/components/OgImageTemplate.island.vue"),
258
+ name: "OgImageBasic",
259
+ filePath: resolve("./runtime/components/OgImageBasic.island.vue"),
243
260
  global: true,
244
261
  island: true
245
262
  });
@@ -252,7 +269,6 @@ export {}
252
269
  });
253
270
  const runtimeDir = resolve("./runtime");
254
271
  nuxt.options.build.transpile.push(runtimeDir);
255
- exposeConfig("#nuxt-og-image/constants", "nuxt-og-image-constants.mjs", Constants);
256
272
  exposeConfig("#nuxt-og-image/config", "nuxt-og-image-config.mjs", config);
257
273
  nuxt.hooks.hook("nitro:config", (nitroConfig) => {
258
274
  nitroConfig.externals = defu(nitroConfig.externals || {}, {
@@ -292,19 +308,19 @@ export {}
292
308
  const html = ctx.contents;
293
309
  if (!html)
294
310
  return;
295
- const extractedPayload = extractOgPayload(html);
296
- ctx.contents = html.replace(new RegExp(`<script id="${PayloadScriptId}" type="application/json">(.*?)<\/script>`), "");
311
+ const extractedOptions = extractOgImageOptions(html);
312
+ ctx.contents = stripOgImageOptions(html);
297
313
  const routeRules = defu({}, ..._routeRulesMatcher.matchAll(ctx.route).reverse());
298
- if (!extractedPayload || routeRules.ogImage === false)
314
+ if (!extractedOptions || routeRules.ogImage === false)
299
315
  return;
300
- const payload = {
316
+ const options = {
301
317
  path: ctx.route,
302
- ...extractedPayload,
318
+ ...extractedOptions,
303
319
  ...routeRules.ogImage || {},
304
320
  ctx
305
321
  };
306
- if ((nuxt.options._generate || payload.prerender) && payload.provider === "browser")
307
- screenshotQueue.push(payload);
322
+ if ((nuxt.options._generate || options.prerender) && options.provider === "browser")
323
+ screenshotQueue.push(options);
308
324
  });
309
325
  if (nuxt.options.dev)
310
326
  return;
@@ -333,8 +349,8 @@ export {}
333
349
  const filename = joinURL(dirname, "/og.png");
334
350
  try {
335
351
  const imgBuffer = await screenshot(browser, `${host}${entry.path}`, {
336
- ...config,
337
- ...entry
352
+ ...config.defaults || {},
353
+ ...entry || {}
338
354
  });
339
355
  try {
340
356
  await mkdir(dirname, { recursive: true });
@@ -10,10 +10,10 @@ const props = defineProps({
10
10
  <div :style="{ padding: '0 60px', width: '100%', height: '100%', backgroundColor: '#0c0c0c', backgroundImage: 'linear-gradient(to bottom, #dbf4ff, #fff1f1)', display: 'flex', alignItems: 'center' }">
11
11
  <div :style="{ padding: '0 30px', display: 'flex', flexDirection: 'column' }">
12
12
  <p :style="{ fontSize: '60px', fontWeight: 'bold', marginBottom: '20px' }">
13
- {{ title }}
13
+ {{ title || 'Og Image Template' }}
14
14
  </p>
15
15
  <p :style="{ fontSize: '26px' }">
16
- {{ description }}
16
+ {{ description || 'Set a description to change me.' }}
17
17
  </p>
18
18
  </div>
19
19
  </div>
@@ -1,5 +1,5 @@
1
- import type { OgImagePayload } from '../../types';
2
- declare const _default: import("vue").DefineComponent<OgImagePayload, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<OgImagePayload>>, {
1
+ import type { OgImageOptions } from '../../types';
2
+ declare const _default: import("vue").DefineComponent<OgImageOptions, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<OgImageOptions>>, {
3
3
  [x: string]: any;
4
4
  }>;
5
5
  export default _default;
@@ -1,5 +1,5 @@
1
- import type { OgImageScreenshotPayload } from '../../types';
2
- declare const _default: import("vue").DefineComponent<OgImageScreenshotPayload, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<OgImageScreenshotPayload>>, {
1
+ import type { OgImageScreenshotOptions } from '../../types';
2
+ declare const _default: import("vue").DefineComponent<OgImageScreenshotOptions, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<OgImageScreenshotOptions>>, {
3
3
  [x: string]: any;
4
4
  [x: number]: any;
5
5
  }>;
@@ -1,5 +1,5 @@
1
- import type { OgImagePayload } from '../../types';
2
- declare const _default: import("vue").DefineComponent<OgImagePayload, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<OgImagePayload>>, {
1
+ import type { OgImageOptions } from '../../types';
2
+ declare const _default: import("vue").DefineComponent<OgImageOptions, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<OgImageOptions>>, {
3
3
  [x: string]: any;
4
4
  }>;
5
5
  export default _default;
@@ -1,5 +1,5 @@
1
- import type { OgImagePayload, OgImageScreenshotPayload } from '../../types';
2
- export declare function defineOgImageScreenshot(options?: OgImageScreenshotPayload): void;
3
- export declare function defineOgImageDynamic(options?: OgImageScreenshotPayload): void;
4
- export declare function defineOgImageStatic(options?: OgImageScreenshotPayload): void;
5
- export declare function defineOgImage(options?: OgImagePayload): void;
1
+ import type { OgImageOptions, OgImageScreenshotOptions } from '../../types';
2
+ export declare function defineOgImageScreenshot(options?: OgImageScreenshotOptions): void;
3
+ export declare function defineOgImageDynamic(options?: OgImageOptions): void;
4
+ export declare function defineOgImageStatic(options?: OgImageOptions): void;
5
+ export declare function defineOgImage(options?: OgImageOptions): void;
@@ -2,8 +2,7 @@ import { useServerHead } from "@vueuse/head";
2
2
  import { withBase } from "ufo";
3
3
  import { useRequestEvent } from "#app";
4
4
  import { useRouter } from "#imports";
5
- import { PayloadScriptId } from "#nuxt-og-image/constants";
6
- import { forcePrerender, height, host, width } from "#nuxt-og-image/config";
5
+ import { defaults, forcePrerender, host } from "#nuxt-og-image/config";
7
6
  export function defineOgImageScreenshot(options = {}) {
8
7
  const router = useRouter();
9
8
  const route = router?.currentRoute?.value?.path || "";
@@ -45,11 +44,11 @@ export function defineOgImage(options = {}) {
45
44
  },
46
45
  {
47
46
  property: "og:image:width",
48
- content: width
47
+ content: options.width || defaults.width
49
48
  },
50
49
  {
51
50
  property: "og:image:height",
52
- content: height
51
+ content: options.height || defaults.height
53
52
  }
54
53
  ];
55
54
  if (options.alt) {
@@ -62,9 +61,15 @@ export function defineOgImage(options = {}) {
62
61
  meta,
63
62
  script: [
64
63
  {
65
- id: PayloadScriptId,
64
+ id: "nuxt-og-image-options",
66
65
  type: "application/json",
67
- children: () => JSON.stringify(options)
66
+ children: () => {
67
+ const payload = {};
68
+ Object.entries(options).forEach(([key, val]) => {
69
+ payload[key.replace(/-([a-z])/g, (g) => g[1].toUpperCase())] = val;
70
+ });
71
+ return payload;
72
+ }
68
73
  }
69
74
  ]
70
75
  });
@@ -1,16 +1,15 @@
1
1
  import { screenshot } from "../../browserUtil.mjs";
2
- import { height, width } from "#nuxt-og-image/config";
3
2
  import { createBrowser } from "#nuxt-og-image/browser";
4
3
  export default {
5
4
  name: "browser",
6
- createSvg: function createSvg() {
7
- throw new Error("Browser provider isn't able to create SVGs.");
5
+ createSvg: async function createSvg() {
6
+ throw new Error("Browser provider can't create SVGs.");
8
7
  },
9
- createPng: async function createPng(basePath) {
8
+ createVNode: async function createVNode() {
9
+ throw new Error("Browser provider can't create VNodes.");
10
+ },
11
+ createPng: async function createPng(basePath, options) {
10
12
  const browser = await createBrowser();
11
- return screenshot(browser, basePath, {
12
- width: Number(width),
13
- height: Number(height)
14
- });
13
+ return screenshot(browser, basePath, options);
15
14
  }
16
15
  };
@@ -1,3 +1,3 @@
1
- import type { Provider } from '../../../types';
1
+ import type { Provider } from '../../../../types';
2
2
  declare const _default: Provider;
3
3
  export default _default;
@@ -0,0 +1,48 @@
1
+ import { html as convertHtmlToSatori } from "satori-html";
2
+ import satori from "satori";
3
+ import { parseURL } from "ufo";
4
+ import { Resvg } from "@resvg/resvg-js";
5
+ import twemoji from "twemoji";
6
+ import { parseFont, walkSatoriTree } from "./utils.mjs";
7
+ import imageSrc from "./plugins/imageSrc.mjs";
8
+ import twClasses from "./plugins/twClasses.mjs";
9
+ import flex from "./plugins/flex.mjs";
10
+ import emojis from "./plugins/emojis.mjs";
11
+ import { satoriFonts, satoriOptions } from "#nuxt-og-image/config";
12
+ export default {
13
+ name: "satori",
14
+ createPng: async function createPng(baseUrl, options) {
15
+ const svg = await this.createSvg(baseUrl, options);
16
+ const resvg = new Resvg(svg, {});
17
+ const pngData = resvg.render();
18
+ return pngData.asPng();
19
+ },
20
+ createVNode: async function createVNode(baseUrl, options) {
21
+ const url = parseURL(baseUrl);
22
+ const html = await $fetch(url.pathname);
23
+ const body = html.match(/<body[^>]*>([\s\S]*)<\/body>/)?.[1];
24
+ const emojiedFont = twemoji.parse(body, {
25
+ folder: "svg",
26
+ ext: ".svg"
27
+ });
28
+ satoriOptions.fonts = satoriOptions.fonts || [];
29
+ for (const font of satoriFonts)
30
+ satoriOptions.fonts.push(await parseFont(url, font));
31
+ const satoriTree = convertHtmlToSatori(emojiedFont);
32
+ await walkSatoriTree(url, satoriTree, [
33
+ emojis(url),
34
+ twClasses(url),
35
+ imageSrc(url),
36
+ flex(url)
37
+ ]);
38
+ return satoriTree;
39
+ },
40
+ createSvg: async function createSvg(baseUrl, options) {
41
+ const vnodes = await this.createVNode(baseUrl, options);
42
+ return await satori(vnodes, {
43
+ ...satoriOptions,
44
+ width: options.width,
45
+ height: options.height
46
+ });
47
+ }
48
+ };
@@ -0,0 +1,2 @@
1
+ declare const _default: (url: import("ufo").ParsedURL) => import("../../../../../types").SatoriTransformer;
2
+ export default _default;
@@ -0,0 +1,13 @@
1
+ import { defineSatoriTransformer } from "../utils.mjs";
2
+ export default defineSatoriTransformer(() => {
3
+ return {
4
+ filter: (node) => node.type === "img" && node.props?.class.includes("emoji"),
5
+ transform: async (node) => {
6
+ node.props.style = node.props.style || {};
7
+ node.props.style.height = "1em";
8
+ node.props.style.width = "1em";
9
+ node.props.style.margin = "0 .05em 0 .1em";
10
+ node.props.style.verticalAlign = "0.1em";
11
+ }
12
+ };
13
+ });
@@ -0,0 +1,2 @@
1
+ declare const _default: (url: import("ufo").ParsedURL) => import("../../../../../types").SatoriTransformer;
2
+ export default _default;
@@ -0,0 +1,11 @@
1
+ import { defineSatoriTransformer } from "../utils.mjs";
2
+ export default defineSatoriTransformer(() => {
3
+ return {
4
+ filter: (node) => node.type === "div" && (Array.isArray(node.props?.children) && node.props?.children.length >= 1) && (!node.props.style?.display && !node.props?.class?.includes("flex")),
5
+ transform: async (node) => {
6
+ node.props.style = node.props.style || {};
7
+ node.props.style.display = "flex";
8
+ node.props.style.flexDirection = "column";
9
+ }
10
+ };
11
+ });
@@ -0,0 +1,2 @@
1
+ declare const _default: (url: import("ufo").ParsedURL) => import("../../../../../types").SatoriTransformer;
2
+ export default _default;
@@ -0,0 +1,24 @@
1
+ import { fileURLToPath } from "node:url";
2
+ import { promises as fsp } from "node:fs";
3
+ import { withBase } from "ufo";
4
+ import { dirname, resolve } from "pathe";
5
+ import { defineSatoriTransformer } from "../utils.mjs";
6
+ import { getAsset } from "#internal/nitro/virtual/public-assets";
7
+ export default defineSatoriTransformer((url) => {
8
+ return {
9
+ filter: (node) => node.type === "img",
10
+ transform: async (node) => {
11
+ const src = node.props?.src;
12
+ if (src && src.startsWith("/")) {
13
+ const file = getAsset(src);
14
+ if (file) {
15
+ const serverDir = dirname(fileURLToPath(import.meta.url));
16
+ const path = resolve(serverDir, file.path);
17
+ node.props.src = `data:${file.type};base64,${await fsp.readFile(path, { encoding: "base64" })}`;
18
+ } else {
19
+ node.props.src = withBase(src, `${url.protocol}//${url.host}`);
20
+ }
21
+ }
22
+ }
23
+ };
24
+ });
@@ -0,0 +1,2 @@
1
+ declare const _default: (url: import("ufo").ParsedURL) => import("../../../../../types").SatoriTransformer;
2
+ export default _default;
@@ -0,0 +1,9 @@
1
+ import { defineSatoriTransformer } from "../utils.mjs";
2
+ export default defineSatoriTransformer(() => {
3
+ return {
4
+ filter: (node) => !!node.props?.class && !node.props?.tw,
5
+ transform: async (node) => {
6
+ node.props.tw = node.props.class;
7
+ }
8
+ };
9
+ });
@@ -0,0 +1,10 @@
1
+ import type { SatoriOptions } from 'satori';
2
+ import type { ParsedURL } from 'ufo';
3
+ import type { SatoriTransformer, VNode } from '../../../../types';
4
+ export declare function parseFont(url: ParsedURL, font: SatoriOptions['fonts'][number] & {
5
+ publicPath?: string;
6
+ }): Promise<import("satori").Font & {
7
+ publicPath?: string | undefined;
8
+ }>;
9
+ export declare function walkSatoriTree(url: ParsedURL, node: VNode, plugins: SatoriTransformer[]): Promise<void>;
10
+ export declare function defineSatoriTransformer(transformer: (url: ParsedURL) => SatoriTransformer): (url: ParsedURL) => SatoriTransformer;