nuxt-og-image 3.0.0-beta.9 → 3.0.0-rc.1

package/dist/runtime/composables/defineOgImage.mjs

@@ -1,124 +1,40 @@
 import { defu } from "defu";
 import { appendHeader } from "h3";
-import { getOgImagePath } from "../utilts.mjs";
-import { normaliseOptions } from "../core/options/normalise.mjs";
-import { useRouter, useRuntimeConfig, useServerHead, withSiteUrl } from "#imports";
-export function defineOgImageScreenshot(options = {}) {
-  const router = useRouter();
-  const route = router.currentRoute.value?.path || "";
-  return defineOgImage({
-    alt: `Web page screenshot${route ? ` of ${route}` : ""}.`,
-    renderer: "chromium",
-    extension: "jpeg",
-    component: "PageScreenshot",
-    // this is an alias
-    cache: true,
-    ...options
-  });
-}
-export function defineOgImageStatic(options = {}) {
-  return defineOgImageCached(options);
-}
-export function defineOgImageCached(options = {}) {
-  const { defaults } = useRuntimeConfig()["nuxt-og-image"];
-  if (!defaults.cacheTtl && !options.cacheTtl)
-    options.cacheTtl = 60 * 60 * 24 * 1e3 * 7;
-  return defineOgImage({
-    cache: true,
-    ...options
-  });
-}
-export function defineOgImageWithoutCache(options = {}) {
-  return defineOgImage({
-    ...options,
-    cache: false,
-    cacheTtl: 0
-  });
-}
-export function defineOgImageDynamic(options = {}) {
-  return defineOgImageWithoutCache(options);
-}
-export function defineOgImageComponent(component, props, options = {}) {
-  defineOgImage({
-    component,
-    ...props,
-    ...options
-  });
-}
+import { createRouter as createRadixRouter, toRouteMatcher } from "radix3";
+import { withoutBase } from "ufo";
+import { getOgImagePath, separateProps, useOgImageRuntimeConfig } from "../utils.mjs";
+import { createOgImageMeta, normaliseOptions } from "../nuxt/utils.mjs";
+import { useNuxtApp, useRequestEvent, useRouter, useRuntimeConfig } from "#imports";
 export function defineOgImage(_options = {}) {
-  if (import.meta.server) {
-    if (_options.url) {
-      const type = _options.url.endsWith(".png") ? "image/png" : "image/jpeg";
-      const meta2 = [
-        { property: "og:image", content: _options.url },
-        { property: "og:image:type", content: type },
-        { name: "twitter:card", content: "summary_large_image" },
-        { name: "twitter:image:src", content: _options.url }
-      ];
-      if (_options.width) {
-        meta2.push({ property: "og:image:width", content: _options.width });
-        meta2.push({ name: "twitter:image:width", content: _options.width });
-      }
-      if (_options.height) {
-        meta2.push({ property: "og:image:height", content: _options.height });
-        meta2.push({ name: "twitter:image:height", content: _options.height });
-      }
-      if (_options.alt) {
-        meta2.push({ property: "og:image:alt", content: _options.alt });
-        meta2.push({ name: "twitter:image:alt", content: _options.alt });
-      }
-      useServerHead({ meta: meta2 }, {
-        // after async scripts when capo.js is enabled
-        tagPriority: 35
-      });
-      return;
-    }
-    const { defaults } = useRuntimeConfig()["nuxt-og-image"];
-    const options = normaliseOptions(_options);
-    const optionsWithDefault = defu(options, defaults);
-    const path = getOgImagePath(useRouter().currentRoute.value?.path, optionsWithDefault.extension);
-    const src = withSiteUrl(path);
+  if (!import.meta.server)
+    return;
+  const nuxtApp = useNuxtApp();
+  const ogImageInstances = nuxtApp.ssrContext._ogImageInstances || [];
+  const basePath = useRouter().currentRoute.value?.path || "/";
+  const _routeRulesMatcher = toRouteMatcher(
+    createRadixRouter({ routes: useRuntimeConfig().nitro?.routeRules })
+  );
+  const routeRules = defu({}, ..._routeRulesMatcher.matchAll(
+    withoutBase(basePath.split("?")[0], useRuntimeConfig().app.baseURL)
+  ).reverse()).ogImage;
+  if (!_options || nuxtApp.ssrContext?.event.context._nitro?.routeRules?.ogImage === false || typeof routeRules !== "undefined" && routeRules === false) {
+    ogImageInstances.forEach((e) => {
+      e.dispose();
+    });
+    nuxtApp.ssrContext._ogImageInstances = void 0;
+    return;
+  }
+  const options = normaliseOptions({
+    ..._options
+  });
+  const { defaults } = useOgImageRuntimeConfig();
+  const resolvedOptions = normaliseOptions(defu(separateProps(_options), separateProps(routeRules), defaults));
+  if (_options.url) {
+    createOgImageMeta(null, options, resolvedOptions, nuxtApp.ssrContext);
+  } else {
+    const path = getOgImagePath(basePath, resolvedOptions);
     if (import.meta.prerender)
       appendHeader(useRequestEvent(), "x-nitro-prerender", path);
-    const meta = [
-      { property: "og:image", content: src },
-      { property: "og:image:width", content: optionsWithDefault.width },
-      { property: "og:image:height", content: optionsWithDefault.height },
-      { property: "og:image:type", content: `image/${optionsWithDefault.extension}` }
-    ];
-    if (optionsWithDefault.alt)
-      meta.push({ property: "og:image:alt", content: optionsWithDefault.alt });
-    meta.push(...[
-      { name: "twitter:card", content: "summary_large_image" },
-      { name: "twitter:image:src", content: src },
-      { name: "twitter:image:width", content: optionsWithDefault.width },
-      { name: "twitter:image:height", content: optionsWithDefault.height }
-    ]);
-    if (optionsWithDefault.alt)
-      meta.push({ name: "twitter:image:alt", content: optionsWithDefault.alt });
-    useServerHead({
-      meta,
-      script: [
-        {
-          id: "nuxt-og-image-options",
-          type: "application/json",
-          processTemplateParams: true,
-          innerHTML: () => {
-            const payload = {
-              title: "%s"
-            };
-            Object.entries(options).forEach(([key, val]) => {
-              payload[key.replace(/-([a-z])/g, (g) => g[1].toUpperCase())] = val;
-            });
-            return payload;
-          },
-          // we want this to be last in our head
-          tagPosition: "bodyClose"
-        }
-      ]
-    }, {
-      // after async scripts when capo.js is enabled
-      tagPriority: 35
-    });
+    createOgImageMeta(path, options, resolvedOptions, nuxtApp.ssrContext);
   }
 }

package/dist/runtime/composables/defineOgImageComponent.d.ts

@@ -0,0 +1,3 @@
+import type { ExtractComponentProps, OgImageOptions } from '../types';
+import type { OgImageComponents } from '#nuxt-og-image/components';
+export declare function defineOgImageComponent<T extends keyof OgImageComponents>(component: T, props?: Partial<ExtractComponentProps<OgImageComponents[T]>>, options?: OgImageOptions): void;

package/dist/runtime/composables/defineOgImageComponent.mjs

@@ -0,0 +1,8 @@
+import { defineOgImage } from "./defineOgImage.mjs";
+export function defineOgImageComponent(component, props = {}, options = {}) {
+  return defineOgImage({
+    ...options,
+    component,
+    props
+  });
+}

package/dist/runtime/composables/defineOgImageScreenshot.d.ts

@@ -0,0 +1,2 @@
+import type { OgImagePageScreenshotOptions } from '../types';
+export declare function defineOgImageScreenshot(options?: OgImagePageScreenshotOptions): any;

package/dist/runtime/composables/defineOgImageScreenshot.mjs

@@ -0,0 +1,13 @@
+import { defineOgImage, useRouter } from "#imports";
+export function defineOgImageScreenshot(options = {}) {
+  const router = useRouter();
+  const route = router.currentRoute.value?.path || "/";
+  return defineOgImage({
+    alt: `Web page screenshot${route ? ` of ${route}` : ""}.`,
+    renderer: "chromium",
+    extension: "jpeg",
+    component: "PageScreenshot",
+    // this is an alias
+    ...options
+  });
+}

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

@@ -1,5 +1,2 @@
-declare function nodeFn(html: string, options: any): string;
-declare namespace nodeFn {
-    var __mock: boolean;
-}
-export default nodeFn;
+import cssInline from 'css-inline';
+export default cssInline;

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

@@ -1,10 +1,2 @@
-import { inline } from "css-inline";
-function nodeFn(html, options) {
-  return inline(html, {
-    ...options,
-    load_remote_stylesheets: false,
-    keep_style_tags: false
-  });
-}
-nodeFn.__mock = false;
-export default nodeFn;
+import cssInline from "css-inline";
+export default cssInline;

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

@@ -0,0 +1,40 @@
+declare const _default: {
+    initWasmPromise: Promise<void>;
+    Resvg: new (svg: string | Uint8Array, options?: import("@resvg/resvg-wasm").ResvgRenderOptions | undefined) => {
+        free(): void;
+        render(): {
+            free(): void;
+            asPng(): Uint8Array;
+            readonly height: number;
+            readonly pixels: Uint8Array;
+            readonly width: number;
+        };
+        toString(): string;
+        innerBBox(): {
+            free(): void;
+            height: number;
+            width: number;
+            x: number;
+            y: number;
+        } | undefined;
+        getBBox(): {
+            free(): void;
+            height: number;
+            width: number;
+            x: number;
+            y: number;
+        } | undefined;
+        cropByBBox(bbox: {
+            free(): void;
+            height: number;
+            width: number;
+            x: number;
+            y: number;
+        }): void;
+        imagesToResolve(): any[];
+        resolveImage(href: string, buffer: Uint8Array): void;
+        readonly height: number;
+        readonly width: number;
+    };
+};
+export default _default;

package/dist/runtime/core/bindings/resvg/wasm-fs.mjs

@@ -0,0 +1,6 @@
+import { Resvg as _Resvg, initWasm } from "@resvg/resvg-wasm";
+import { readWasmFile } from "../../utils/wasm.mjs";
+export default {
+  initWasmPromise: initWasm(readWasmFile("@resvg/resvg-wasm/index_bg.wasm")),
+  Resvg: _Resvg
+};

package/dist/runtime/core/bindings/resvg/wasm.mjs

@@ -1,9 +1,6 @@
 import { Resvg as _Resvg, initWasm } from "@resvg/resvg-wasm";
+import { importWasm } from "../../utils/wasm.mjs";
 export default {
-  initWasmPromise: initWasm(import("@resvg/resvg-wasm/index_bg.wasm").then((m) => {
-    let mod = m.default;
-    mod = typeof mod === "function" ? mod() : mod;
-    return "instance" in mod ? mod.instance : mod;
-  })),
+  initWasmPromise: initWasm(importWasm(import("@resvg/resvg-wasm/index_bg.wasm"))),
   Resvg: _Resvg
 };

package/dist/runtime/core/bindings/satori/wasm-fs.mjs

@@ -0,0 +1,13 @@
+import _satori, { init } from "satori/wasm";
+import initYoga from "yoga-wasm-web";
+import { readWasmFile } from "../../utils/wasm.mjs";
+const wasm = readWasmFile("yoga-wasm-web/dist/yoga.wasm").then(async (yoga) => await initYoga(yoga));
+export default {
+  initWasmPromise: new Promise((resolve) => {
+    wasm.then((yoga) => {
+      init(yoga);
+      resolve();
+    });
+  }),
+  satori: _satori
+};

package/dist/runtime/core/bindings/satori/wasm.d.ts

@@ -0,0 +1,6 @@
+import _satori from 'satori/wasm';
+declare const _default: {
+    initWasmPromise: Promise<void>;
+    satori: typeof _satori;
+};
+export default _default;

package/dist/runtime/core/bindings/satori/wasm.mjs

@@ -0,0 +1,14 @@
+import _satori from "satori/wasm";
+import initYoga from "yoga-wasm-web";
+import { init } from "satori";
+import { importWasm } from "../../utils/wasm.mjs";
+const wasm = importWasm(import("yoga-wasm-web/dist/yoga.wasm")).then(async (yoga) => await initYoga(yoga));
+export default {
+  initWasmPromise: new Promise((resolve) => {
+    wasm.then((yoga) => {
+      init(yoga);
+      resolve();
+    });
+  }),
+  satori: _satori
+};

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

@@ -0,0 +1 @@
+export declare const emojiCache: import("unstorage/dist/shared/unstorage.745f9650").a<string>;

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

@@ -0,0 +1,5 @@
+import { createStorage } from "unstorage";
+import lruCacheDriver from "unstorage/drivers/lru-cache";
+export const emojiCache = createStorage({
+  driver: lruCacheDriver({ max: 1e3 })
+});

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/cache/htmlPayload.d.ts

@@ -0,0 +1,5 @@
+import type { OgImageOptions } from '../../types';
+export declare const htmlPayloadCache: import("unstorage/dist/shared/unstorage.745f9650").a<{
+    expiresAt: number;
+    value: OgImageOptions;
+}>;

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

@@ -0,0 +1,6 @@
+import { createStorage } from "unstorage";
+import lruCacheDriver from "unstorage/drivers/lru-cache";
+export const htmlPayloadCache = createStorage({
+  // short cache time so we don't need many entries at runtime
+  driver: lruCacheDriver({ max: import.meta.prerender ? 1e3 : 50 })
+});

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

@@ -1,6 +1,2 @@
-import type { Browser } from 'playwright-core';
 import type { OgImageOptions } from '../../types';
-export declare const prerenderCache: import("unstorage/dist/shared/unstorage.745f9650").a<OgImageOptions> | undefined;
-export declare const prerenderChromiumContext: {
-    browser?: Browser;
-};
+export declare const prerenderOptionsCache: import("unstorage/dist/shared/unstorage.745f9650").a<OgImageOptions<"NuxtSeo">> | undefined;

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

@@ -1,6 +1,5 @@
 import { createStorage } from "unstorage";
 import lruCacheDriver from "unstorage/drivers/lru-cache";
-export const prerenderCache = import.meta.prerender ? createStorage({
+export const prerenderOptionsCache = import.meta.prerender ? createStorage({
   driver: lruCacheDriver({ max: 1e3 })
 }) : void 0;
-export const prerenderChromiumContext = { browser: void 0 };

package/dist/runtime/core/env/assets.d.ts

@@ -1,2 +1 @@
-export declare function base64ToArrayBuffer(base64: string): ArrayBuffer;
 export declare function toBase64Image(fileName: string, data: string | ArrayBuffer): string;

package/dist/runtime/core/env/assets.mjs

@@ -1,8 +1,4 @@
 import { Buffer } from "node:buffer";
-export function base64ToArrayBuffer(base64) {
-  const buffer = Buffer.from(base64, "base64");
-  return new Uint8Array(buffer).buffer;
-}
 export function toBase64Image(fileName, data) {
   const base64 = typeof data === "string" ? data : Buffer.from(data).toString("base64");
   let type = "image/jpeg";

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

@@ -1,3 +1,2 @@
-import type { H3Event } from 'h3';
-import type { FontConfig } from '../../types';
-export declare function loadFont(e: H3Event, 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,29 +1,36 @@
-import { Buffer } from "node:buffer";
-import { base64ToArrayBuffer } from "../env/assets.mjs";
-import { fontCache } from "./cache.mjs";
-import { useNitroOrigin, useStorage } from "#imports";
-export async function loadFont(e, font) {
-  const fontKey = `${font.name}:${font.weight}`;
-  const storageKey = `assets:nuxt-og-image:font:${fontKey}`;
-  if (fontCache[fontKey])
-    return fontCache[fontKey];
-  const [name, weight] = fontKey.split(":");
+import { useStorage } from "#internal/nitro";
+import { useNitroOrigin } from "#imports";
+import { assets } from "#internal/nitro/virtual/server-assets";
+export async function loadFont({ e }, font) {
+  const { name, weight } = font;
   let data;
-  if (await useStorage().hasItem(storageKey))
-    data = base64ToArrayBuffer(await useStorage().getItem(storageKey));
+  if (import.meta.dev || import.meta.prerender) {
+    if (font.key && await assets.hasItem(font.key))
+      data = await assets.getItemRaw(font.key);
+  }
   if (!data) {
     if (font.path) {
-      data = await e.$fetch(font.path, {
-        baseURL: useNitroOrigin(e),
-        responseType: "arrayBuffer"
-      });
+      if (import.meta.dev || import.meta.prerender) {
+        const key = `root:public${font.path.replace("./", ":").replace("/", ":")}`;
+        if (await useStorage().hasItem(key))
+          data = await useStorage().getItemRaw(key);
+        if (!data) {
+          data = await e.$fetch(font.path, {
+            responseType: "arrayBuffer"
+          });
+        }
+      } else {
+        data = await e.$fetch(font.path, {
+          baseURL: useNitroOrigin(e),
+          responseType: "arrayBuffer"
+        });
+      }
     } else {
       data = await e.$fetch(`/__og-image__/font/${name}/${weight}.ttf`, {
         responseType: "arrayBuffer"
       });
     }
   }
-  fontCache[fontKey] = { name, weight: Number(weight), data, style: "normal" };
-  await useStorage().setItem(storageKey, Buffer.from(data).toString("base64"));
-  return fontCache[fontKey];
+  font.data = data;
+  return font;
 }

package/dist/runtime/core/html/applyEmojis.d.ts

@@ -0,0 +1,3 @@
+import type { NuxtIslandResponse } from 'nuxt/dist/core/runtime/nitro/renderer';
+import type { OgImageRenderEventContext } from '../../types';
+export declare function applyEmojis(ctx: OgImageRenderEventContext, island: NuxtIslandResponse): Promise<string | boolean>;

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

@@ -0,0 +1,37 @@
+import defaultCharMap from "@iconify-json/noto/chars.json";
+import { emojiCache } from "../cache/emojis.mjs";
+const RE_MATCH_EMOJIS = /[#*0-9]\uFE0F?\u20E3|[\xA9\xAE\u203C\u2049\u2122\u2139\u2194-\u2199\u21A9\u21AA\u231A\u231B\u2328\u23CF\u23ED-\u23EF\u23F1\u23F2\u23F8-\u23FA\u24C2\u25AA\u25AB\u25B6\u25C0\u25FB\u25FC\u25FE\u2600-\u2604\u260E\u2611\u2614\u2615\u2618\u2620\u2622\u2623\u2626\u262A\u262E\u262F\u2638-\u263A\u2640\u2642\u2648-\u2653\u265F\u2660\u2663\u2665\u2666\u2668\u267B\u267E\u267F\u2692\u2694-\u2697\u2699\u269B\u269C\u26A0\u26A7\u26AA\u26B0\u26B1\u26BD\u26BE\u26C4\u26C8\u26CF\u26D1\u26E9\u26F0-\u26F5\u26F7\u26F8\u26FA\u2702\u2708\u2709\u270F\u2712\u2714\u2716\u271D\u2721\u2733\u2734\u2744\u2747\u2757\u2763\u27A1\u2934\u2935\u2B05-\u2B07\u2B1B\u2B1C\u2B55\u3030\u303D\u3297\u3299]\uFE0F?|[\u261D\u270C\u270D](?:\uFE0F|\uD83C[\uDFFB-\uDFFF])?|[\u270A\u270B](?:\uD83C[\uDFFB-\uDFFF])?|[\u23E9-\u23EC\u23F0\u23F3\u25FD\u2693\u26A1\u26AB\u26C5\u26CE\u26D4\u26EA\u26FD\u2705\u2728\u274C\u274E\u2753-\u2755\u2795-\u2797\u27B0\u27BF\u2B50]|\u26D3\uFE0F?(?:\u200D\uD83D\uDCA5)?|\u26F9(?:\uFE0F|\uD83C[\uDFFB-\uDFFF])?(?:\u200D[\u2640\u2642]\uFE0F?)?|\u2764\uFE0F?(?:\u200D(?:\uD83D\uDD25|\uD83E\uDE79))?|\uD83C(?:[\uDC04\uDD70\uDD71\uDD7E\uDD7F\uDE02\uDE37\uDF21\uDF24-\uDF2C\uDF36\uDF7D\uDF96\uDF97\uDF99-\uDF9B\uDF9E\uDF9F\uDFCD\uDFCE\uDFD4-\uDFDF\uDFF5\uDFF7]\uFE0F?|[\uDF85\uDFC2\uDFC7](?:\uD83C[\uDFFB-\uDFFF])?|[\uDFC4\uDFCA](?:\uD83C[\uDFFB-\uDFFF])?(?:\u200D[\u2640\u2642]\uFE0F?)?|[\uDFCB\uDFCC](?:\uFE0F|\uD83C[\uDFFB-\uDFFF])?(?:\u200D[\u2640\u2642]\uFE0F?)?|[\uDCCF\uDD8E\uDD91-\uDD9A\uDE01\uDE1A\uDE2F\uDE32-\uDE36\uDE38-\uDE3A\uDE50\uDE51\uDF00-\uDF20\uDF2D-\uDF35\uDF37-\uDF43\uDF45-\uDF4A\uDF4C-\uDF7C\uDF7E-\uDF84\uDF86-\uDF93\uDFA0-\uDFC1\uDFC5\uDFC6\uDFC8\uDFC9\uDFCF-\uDFD3\uDFE0-\uDFF0\uDFF8-\uDFFF]|\uDDE6\uD83C[\uDDE8-\uDDEC\uDDEE\uDDF1\uDDF2\uDDF4\uDDF6-\uDDFA\uDDFC\uDDFD\uDDFF]|\uDDE7\uD83C[\uDDE6\uDDE7\uDDE9-\uDDEF\uDDF1-\uDDF4\uDDF6-\uDDF9\uDDFB\uDDFC\uDDFE\uDDFF]|\uDDE8\uD83C[\uDDE6\uDDE8\uDDE9\uDDEB-\uDDEE\uDDF0-\uDDF5\uDDF7\uDDFA-\uDDFF]|\uDDE9\uD83C[\uDDEA\uDDEC\uDDEF\uDDF0\uDDF2\uDDF4\uDDFF]|\uDDEA\uD83C[\uDDE6\uDDE8\uDDEA\uDDEC\uDDED\uDDF7-\uDDFA]|\uDDEB\uD83C[\uDDEE-\uDDF0\uDDF2\uDDF4\uDDF7]|\uDDEC\uD83C[\uDDE6\uDDE7\uDDE9-\uDDEE\uDDF1-\uDDF3\uDDF5-\uDDFA\uDDFC\uDDFE]|\uDDED\uD83C[\uDDF0\uDDF2\uDDF3\uDDF7\uDDF9\uDDFA]|\uDDEE\uD83C[\uDDE8-\uDDEA\uDDF1-\uDDF4\uDDF6-\uDDF9]|\uDDEF\uD83C[\uDDEA\uDDF2\uDDF4\uDDF5]|\uDDF0\uD83C[\uDDEA\uDDEC-\uDDEE\uDDF2\uDDF3\uDDF5\uDDF7\uDDFC\uDDFE\uDDFF]|\uDDF1\uD83C[\uDDE6-\uDDE8\uDDEE\uDDF0\uDDF7-\uDDFB\uDDFE]|\uDDF2\uD83C[\uDDE6\uDDE8-\uDDED\uDDF0-\uDDFF]|\uDDF3\uD83C[\uDDE6\uDDE8\uDDEA-\uDDEC\uDDEE\uDDF1\uDDF4\uDDF5\uDDF7\uDDFA\uDDFF]|\uDDF4\uD83C\uDDF2|\uDDF5\uD83C[\uDDE6\uDDEA-\uDDED\uDDF0-\uDDF3\uDDF7-\uDDF9\uDDFC\uDDFE]|\uDDF6\uD83C\uDDE6|\uDDF7\uD83C[\uDDEA\uDDF4\uDDF8\uDDFA\uDDFC]|\uDDF8\uD83C[\uDDE6-\uDDEA\uDDEC-\uDDF4\uDDF7-\uDDF9\uDDFB\uDDFD-\uDDFF]|\uDDF9\uD83C[\uDDE6\uDDE8\uDDE9\uDDEB-\uDDED\uDDEF-\uDDF4\uDDF7\uDDF9\uDDFB\uDDFC\uDDFF]|\uDDFA\uD83C[\uDDE6\uDDEC\uDDF2\uDDF3\uDDF8\uDDFE\uDDFF]|\uDDFB\uD83C[\uDDE6\uDDE8\uDDEA\uDDEC\uDDEE\uDDF3\uDDFA]|\uDDFC\uD83C[\uDDEB\uDDF8]|\uDDFD\uD83C\uDDF0|\uDDFE\uD83C[\uDDEA\uDDF9]|\uDDFF\uD83C[\uDDE6\uDDF2\uDDFC]|\uDF44(?:\u200D\uD83D\uDFEB)?|\uDF4B(?:\u200D\uD83D\uDFE9)?|\uDFC3(?:\uD83C[\uDFFB-\uDFFF])?(?:\u200D(?:[\u2640\u2642]\uFE0F?(?:\u200D\u27A1\uFE0F?)?|\u27A1\uFE0F?))?|\uDFF3\uFE0F?(?:\u200D(?:\u26A7\uFE0F?|\uD83C\uDF08))?|\uDFF4(?:\u200D\u2620\uFE0F?|\uDB40\uDC67\uDB40\uDC62\uDB40(?:\uDC65\uDB40\uDC6E\uDB40\uDC67|\uDC73\uDB40\uDC63\uDB40\uDC74|\uDC77\uDB40\uDC6C\uDB40\uDC73)\uDB40\uDC7F)?)|\uD83D(?:[\uDC3F\uDCFD\uDD49\uDD4A\uDD6F\uDD70\uDD73\uDD76-\uDD79\uDD87\uDD8A-\uDD8D\uDDA5\uDDA8\uDDB1\uDDB2\uDDBC\uDDC2-\uDDC4\uDDD1-\uDDD3\uDDDC-\uDDDE\uDDE1\uDDE3\uDDE8\uDDEF\uDDF3\uDDFA\uDECB\uDECD-\uDECF\uDEE0-\uDEE5\uDEE9\uDEF0\uDEF3]\uFE0F?|[\uDC42\uDC43\uDC46-\uDC50\uDC66\uDC67\uDC6B-\uDC6D\uDC72\uDC74-\uDC76\uDC78\uDC7C\uDC83\uDC85\uDC8F\uDC91\uDCAA\uDD7A\uDD95\uDD96\uDE4C\uDE4F\uDEC0\uDECC](?:\uD83C[\uDFFB-\uDFFF])?|[\uDC6E\uDC70\uDC71\uDC73\uDC77\uDC81\uDC82\uDC86\uDC87\uDE45-\uDE47\uDE4B\uDE4D\uDE4E\uDEA3\uDEB4\uDEB5](?:\uD83C[\uDFFB-\uDFFF])?(?:\u200D[\u2640\u2642]\uFE0F?)?|[\uDD74\uDD90](?:\uFE0F|\uD83C[\uDFFB-\uDFFF])?|[\uDC00-\uDC07\uDC09-\uDC14\uDC16-\uDC25\uDC27-\uDC3A\uDC3C-\uDC3E\uDC40\uDC44\uDC45\uDC51-\uDC65\uDC6A\uDC79-\uDC7B\uDC7D-\uDC80\uDC84\uDC88-\uDC8E\uDC90\uDC92-\uDCA9\uDCAB-\uDCFC\uDCFF-\uDD3D\uDD4B-\uDD4E\uDD50-\uDD67\uDDA4\uDDFB-\uDE2D\uDE2F-\uDE34\uDE37-\uDE41\uDE43\uDE44\uDE48-\uDE4A\uDE80-\uDEA2\uDEA4-\uDEB3\uDEB7-\uDEBF\uDEC1-\uDEC5\uDED0-\uDED2\uDED5-\uDED7\uDEDC-\uDEDF\uDEEB\uDEEC\uDEF4-\uDEFC\uDFE0-\uDFEB\uDFF0]|\uDC08(?:\u200D\u2B1B)?|\uDC15(?:\u200D\uD83E\uDDBA)?|\uDC26(?:\u200D(?:\u2B1B|\uD83D\uDD25))?|\uDC3B(?:\u200D\u2744\uFE0F?)?|\uDC41\uFE0F?(?:\u200D\uD83D\uDDE8\uFE0F?)?|\uDC68(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D\uD83D(?:\uDC8B\u200D\uD83D)?\uDC68|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D(?:[\uDC68\uDC69]\u200D\uD83D(?:\uDC66(?:\u200D\uD83D\uDC66)?|\uDC67(?:\u200D\uD83D[\uDC66\uDC67])?)|[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uDC66(?:\u200D\uD83D\uDC66)?|\uDC67(?:\u200D\uD83D[\uDC66\uDC67])?)|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]))|\uD83C(?:\uDFFB(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D\uD83D(?:\uDC8B\u200D\uD83D)?\uDC68\uD83C[\uDFFB-\uDFFF]|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]|\uDD1D\u200D\uD83D\uDC68\uD83C[\uDFFC-\uDFFF])))?|\uDFFC(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D\uD83D(?:\uDC8B\u200D\uD83D)?\uDC68\uD83C[\uDFFB-\uDFFF]|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]|\uDD1D\u200D\uD83D\uDC68\uD83C[\uDFFB\uDFFD-\uDFFF])))?|\uDFFD(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D\uD83D(?:\uDC8B\u200D\uD83D)?\uDC68\uD83C[\uDFFB-\uDFFF]|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]|\uDD1D\u200D\uD83D\uDC68\uD83C[\uDFFB\uDFFC\uDFFE\uDFFF])))?|\uDFFE(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D\uD83D(?:\uDC8B\u200D\uD83D)?\uDC68\uD83C[\uDFFB-\uDFFF]|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]|\uDD1D\u200D\uD83D\uDC68\uD83C[\uDFFB-\uDFFD\uDFFF])))?|\uDFFF(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D\uD83D(?:\uDC8B\u200D\uD83D)?\uDC68\uD83C[\uDFFB-\uDFFF]|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]|\uDD1D\u200D\uD83D\uDC68\uD83C[\uDFFB-\uDFFE])))?))?|\uDC69(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D\uD83D(?:\uDC8B\u200D\uD83D)?[\uDC68\uDC69]|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D(?:[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uDC66(?:\u200D\uD83D\uDC66)?|\uDC67(?:\u200D\uD83D[\uDC66\uDC67])?|\uDC69\u200D\uD83D(?:\uDC66(?:\u200D\uD83D\uDC66)?|\uDC67(?:\u200D\uD83D[\uDC66\uDC67])?))|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]))|\uD83C(?:\uDFFB(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D\uD83D(?:[\uDC68\uDC69]|\uDC8B\u200D\uD83D[\uDC68\uDC69])\uD83C[\uDFFB-\uDFFF]|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]|\uDD1D\u200D\uD83D[\uDC68\uDC69]\uD83C[\uDFFC-\uDFFF])))?|\uDFFC(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D\uD83D(?:[\uDC68\uDC69]|\uDC8B\u200D\uD83D[\uDC68\uDC69])\uD83C[\uDFFB-\uDFFF]|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]|\uDD1D\u200D\uD83D[\uDC68\uDC69]\uD83C[\uDFFB\uDFFD-\uDFFF])))?|\uDFFD(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D\uD83D(?:[\uDC68\uDC69]|\uDC8B\u200D\uD83D[\uDC68\uDC69])\uD83C[\uDFFB-\uDFFF]|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]|\uDD1D\u200D\uD83D[\uDC68\uDC69]\uD83C[\uDFFB\uDFFC\uDFFE\uDFFF])))?|\uDFFE(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D\uD83D(?:[\uDC68\uDC69]|\uDC8B\u200D\uD83D[\uDC68\uDC69])\uD83C[\uDFFB-\uDFFF]|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]|\uDD1D\u200D\uD83D[\uDC68\uDC69]\uD83C[\uDFFB-\uDFFD\uDFFF])))?|\uDFFF(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D\uD83D(?:[\uDC68\uDC69]|\uDC8B\u200D\uD83D[\uDC68\uDC69])\uD83C[\uDFFB-\uDFFF]|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]|\uDD1D\u200D\uD83D[\uDC68\uDC69]\uD83C[\uDFFB-\uDFFE])))?))?|\uDC6F(?:\u200D[\u2640\u2642]\uFE0F?)?|\uDD75(?:\uFE0F|\uD83C[\uDFFB-\uDFFF])?(?:\u200D[\u2640\u2642]\uFE0F?)?|\uDE2E(?:\u200D\uD83D\uDCA8)?|\uDE35(?:\u200D\uD83D\uDCAB)?|\uDE36(?:\u200D\uD83C\uDF2B\uFE0F?)?|\uDE42(?:\u200D[\u2194\u2195]\uFE0F?)?|\uDEB6(?:\uD83C[\uDFFB-\uDFFF])?(?:\u200D(?:[\u2640\u2642]\uFE0F?(?:\u200D\u27A1\uFE0F?)?|\u27A1\uFE0F?))?)|\uD83E(?:[\uDD0C\uDD0F\uDD18-\uDD1F\uDD30-\uDD34\uDD36\uDD77\uDDB5\uDDB6\uDDBB\uDDD2\uDDD3\uDDD5\uDEC3-\uDEC5\uDEF0\uDEF2-\uDEF8](?:\uD83C[\uDFFB-\uDFFF])?|[\uDD26\uDD35\uDD37-\uDD39\uDD3D\uDD3E\uDDB8\uDDB9\uDDCD\uDDCF\uDDD4\uDDD6-\uDDDD](?:\uD83C[\uDFFB-\uDFFF])?(?:\u200D[\u2640\u2642]\uFE0F?)?|[\uDDDE\uDDDF](?:\u200D[\u2640\u2642]\uFE0F?)?|[\uDD0D\uDD0E\uDD10-\uDD17\uDD20-\uDD25\uDD27-\uDD2F\uDD3A\uDD3F-\uDD45\uDD47-\uDD76\uDD78-\uDDB4\uDDB7\uDDBA\uDDBC-\uDDCC\uDDD0\uDDE0-\uDDFF\uDE70-\uDE7C\uDE80-\uDE88\uDE90-\uDEBD\uDEBF-\uDEC2\uDECE-\uDEDB\uDEE0-\uDEE8]|\uDD3C(?:\u200D[\u2640\u2642]\uFE0F?|\uD83C[\uDFFB-\uDFFF])?|\uDDCE(?:\uD83C[\uDFFB-\uDFFF])?(?:\u200D(?:[\u2640\u2642]\uFE0F?(?:\u200D\u27A1\uFE0F?)?|\u27A1\uFE0F?))?|\uDDD1(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\uD83C[\uDF3E\uDF73\uDF7C\uDF84\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]|\uDD1D\u200D\uD83E\uDDD1|\uDDD1\u200D\uD83E\uDDD2(?:\u200D\uD83E\uDDD2)?|\uDDD2(?:\u200D\uD83E\uDDD2)?))|\uD83C(?:\uDFFB(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D(?:\uD83D\uDC8B\u200D)?\uD83E\uDDD1\uD83C[\uDFFC-\uDFFF]|\uD83C[\uDF3E\uDF73\uDF7C\uDF84\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]|\uDD1D\u200D\uD83E\uDDD1\uD83C[\uDFFB-\uDFFF])))?|\uDFFC(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D(?:\uD83D\uDC8B\u200D)?\uD83E\uDDD1\uD83C[\uDFFB\uDFFD-\uDFFF]|\uD83C[\uDF3E\uDF73\uDF7C\uDF84\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]|\uDD1D\u200D\uD83E\uDDD1\uD83C[\uDFFB-\uDFFF])))?|\uDFFD(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D(?:\uD83D\uDC8B\u200D)?\uD83E\uDDD1\uD83C[\uDFFB\uDFFC\uDFFE\uDFFF]|\uD83C[\uDF3E\uDF73\uDF7C\uDF84\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]|\uDD1D\u200D\uD83E\uDDD1\uD83C[\uDFFB-\uDFFF])))?|\uDFFE(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D(?:\uD83D\uDC8B\u200D)?\uD83E\uDDD1\uD83C[\uDFFB-\uDFFD\uDFFF]|\uD83C[\uDF3E\uDF73\uDF7C\uDF84\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]|\uDD1D\u200D\uD83E\uDDD1\uD83C[\uDFFB-\uDFFF])))?|\uDFFF(?:\u200D(?:[\u2695\u2696\u2708]\uFE0F?|\u2764\uFE0F?\u200D(?:\uD83D\uDC8B\u200D)?\uD83E\uDDD1\uD83C[\uDFFB-\uDFFE]|\uD83C[\uDF3E\uDF73\uDF7C\uDF84\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E(?:[\uDDAF\uDDBC\uDDBD](?:\u200D\u27A1\uFE0F?)?|[\uDDB0-\uDDB3]|\uDD1D\u200D\uD83E\uDDD1\uD83C[\uDFFB-\uDFFF])))?))?|\uDEF1(?:\uD83C(?:\uDFFB(?:\u200D\uD83E\uDEF2\uD83C[\uDFFC-\uDFFF])?|\uDFFC(?:\u200D\uD83E\uDEF2\uD83C[\uDFFB\uDFFD-\uDFFF])?|\uDFFD(?:\u200D\uD83E\uDEF2\uD83C[\uDFFB\uDFFC\uDFFE\uDFFF])?|\uDFFE(?:\u200D\uD83E\uDEF2\uD83C[\uDFFB-\uDFFD\uDFFF])?|\uDFFF(?:\u200D\uD83E\uDEF2\uD83C[\uDFFB-\uDFFE])?))?)/g;
+export async function applyEmojis(ctx, island) {
+  const html = island.html;
+  const matches = html.match(RE_MATCH_EMOJIS);
+  if (!matches)
+    return html;
+  const replacements = await Promise.all(matches.map(async (match) => {
+    const unicode = match.codePointAt(0).toString(16);
+    const emoji = defaultCharMap[unicode];
+    if (emoji) {
+      const key = ["1", ctx.options.emojis, emoji].join(":");
+      let svg;
+      if (await emojiCache.hasItem(key))
+        svg = await emojiCache.getItem(key);
+      if (!svg) {
+        svg = await ctx.e.$fetch(`https://api.iconify.design/${ctx.options.emojis}/${emoji}.svg`, {
+          responseType: "text"
+        });
+        if (svg === "404")
+          svg = void 0;
+        if (svg)
+          await emojiCache.setItem(key, svg);
+      }
+      if (svg)
+        return `
+${svg.replace("<svg ", '<svg data-emoji style="margin: 0 .05em 0 .15em; vertical-align: -0.1em;" ')}
+`;
+      return match;
+    }
+  }));
+  const finalHtml = html.replace(RE_MATCH_EMOJIS, () => replacements.shift());
+  const modified = finalHtml !== island.html;
+  island.html = finalHtml;
+  return modified;
+}

package/dist/runtime/core/html/applyInlineCss.d.ts

@@ -0,0 +1,3 @@
+import type { NuxtIslandResponse } from 'nuxt/dist/core/runtime/nitro/renderer';
+import type { OgImageRenderEventContext } from '../../types';
+export declare function applyInlineCss({ e }: OgImageRenderEventContext, island: NuxtIslandResponse): Promise<boolean>;

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

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

package/dist/runtime/core/html/devIframeTemplate.d.ts

@@ -0,0 +1,2 @@
+import type { OgImageRenderEventContext } from '../../types';
+export declare function devIframeTemplate(ctx: OgImageRenderEventContext): Promise<string>;