nuxt-og-image 5.1.13 → 6.0.0-beta.1

package/dist/shared/nuxt-og-image.HMyihp-D.mjs

@@ -0,0 +1,2825 @@
+import * as fs from 'node:fs';
+import { existsSync, mkdirSync, readdirSync, readFileSync, statSync, rmSync } from 'node:fs';
+import { readFile, writeFile, mkdir } from 'node:fs/promises';
+import { resolvePath, useNuxt, addTemplate, updateTemplates, loadNuxtModuleInstance, addTypeTemplate, defineNuxtModule, createResolver, addImports, addVitePlugin, addBuildPlugin, addServerHandler, addComponentsDir, addComponent, addPlugin, hasNuxtModule, addServerPlugin } from '@nuxt/kit';
+import { defu } from 'defu';
+import { createJiti } from 'jiti';
+import { installNuxtSiteConfig } from 'nuxt-site-config/kit';
+import { hash } from 'ohash';
+import { join, dirname, isAbsolute, resolve, relative as relative$1 } from 'pathe';
+import { readPackageJSON } from 'pkg-types';
+import { isCI, provider, env, isDevelopment } from 'std-env';
+import { createHash } from 'node:crypto';
+import { ensureDependencyInstalled, detectPackageManager, addDependency } from 'nypm';
+import { logger } from '../../dist/runtime/logger.js';
+import { Launcher } from 'chrome-launcher';
+import { relative } from 'node:path';
+import { onDevToolsInitialized, extendServerRpc, addCustomTab } from '@nuxt/devtools-kit';
+import { pathToFileURL } from 'node:url';
+import MagicString from 'magic-string';
+import { stripLiteral } from 'strip-literal';
+import { parseURL, parseQuery } from 'ufo';
+import { createUnplugin } from 'unplugin';
+import postcss from 'postcss';
+import postcssCalc from 'postcss-calc';
+import { compile } from 'tailwindcss';
+import { toGamut, parse, formatHex } from 'culori';
+import { resolveModulePath } from 'exsolve';
+import twColors from 'tailwindcss/colors';
+import { RE_MATCH_EMOJIS, getEmojiCodePoint, getEmojiIconNames } from '../../dist/runtime/server/og-image/satori/transforms/emojis/emoji-utils.js';
+import { parse as parse$1 } from '@vue/compiler-sfc';
+import { loadFile, writeFile as writeFile$1 } from 'magicast';
+import { addNuxtModule } from 'magicast/helpers';
+
+const isUndefinedOrTruthy = (v) => typeof v === "undefined" || v !== false;
+function checkLocalChrome() {
+  if (isCI)
+    return false;
+  let hasChromeLocally = false;
+  try {
+    hasChromeLocally = !!Launcher.getFirstInstallation();
+  } catch {
+  }
+  return hasChromeLocally;
+}
+async function hasResolvableDependency(dep) {
+  return await resolvePath(dep, { fallbackToOriginal: true }).catch(() => null).then((r) => r && r !== dep);
+}
+const VALID_RENDERER_SUFFIXES = ["satori", "chromium", "takumi"];
+function getRendererFromFilename(filepath) {
+  const filename = filepath.split("/").pop()?.replace(".vue", "") || "";
+  for (const suffix of VALID_RENDERER_SUFFIXES) {
+    if (filename.endsWith(`.${suffix}`))
+      return suffix;
+  }
+  return null;
+}
+function stripRendererSuffix(name) {
+  for (const suffix of VALID_RENDERER_SUFFIXES) {
+    if (name.endsWith(`.${suffix}`) || name.endsWith(suffix.charAt(0).toUpperCase() + suffix.slice(1)))
+      return name.replace(new RegExp(`[.]?${suffix}$`, "i"), "");
+  }
+  return name;
+}
+
+const autodetectableProviders = {
+  azure_static: "azure",
+  cloudflare_pages: "cloudflare-pages",
+  netlify: "netlify",
+  stormkit: "stormkit",
+  vercel: "vercel",
+  cleavr: "cleavr",
+  stackblitz: "stackblitz"
+};
+const autodetectableStaticProviders = {
+  netlify: "netlify-static",
+  vercel: "vercel-static"
+};
+const NodeRuntime = {
+  // node-server runtime
+  "chromium": "on-demand",
+  // this gets changed build start
+  "css-inline": "node",
+  "resvg": "node",
+  "satori": "node",
+  "takumi": "node",
+  "sharp": "node",
+  // will be disabled if they're missing the dependency
+  "emoji": "local"
+  // can bundle icons, no size constraints
+};
+const NodeDevRuntime = {
+  ...NodeRuntime,
+  resvg: "node-dev"
+  // use worker to prevent crashes from killing process
+};
+const cloudflare = {
+  "chromium": false,
+  "css-inline": false,
+  "resvg": "wasm",
+  "satori": "node",
+  "takumi": "wasm",
+  "sharp": false,
+  "emoji": "fetch",
+  // edge size limits - use API instead of bundling 24MB icons
+  "wasm": {
+    esmImport: true,
+    lazy: true
+  }
+};
+const awsLambda = {
+  "chromium": false,
+  "css-inline": "wasm",
+  "resvg": "node",
+  "satori": "node",
+  "takumi": "node",
+  "sharp": false,
+  // 0.33.x has issues
+  "emoji": "local"
+  // serverless has larger size limits
+};
+const WebContainer = {
+  "chromium": false,
+  "css-inline": "wasm-fs",
+  "resvg": "wasm-fs",
+  "satori": "wasm-fs",
+  "takumi": "wasm",
+  "sharp": false,
+  "emoji": "fetch"
+  // webcontainer has size constraints
+};
+const RuntimeCompatibility = {
+  "nitro-dev": NodeDevRuntime,
+  "nitro-prerender": NodeRuntime,
+  "node-server": NodeRuntime,
+  "stackblitz": WebContainer,
+  "codesandbox": WebContainer,
+  "aws-lambda": awsLambda,
+  "netlify": awsLambda,
+  "netlify-edge": {
+    "chromium": false,
+    "css-inline": "wasm",
+    "resvg": "wasm",
+    "satori": "node",
+    "takumi": "wasm",
+    "sharp": false,
+    "emoji": "fetch",
+    // edge size limits
+    "wasm": {
+      rollup: {
+        targetEnv: "auto-inline",
+        sync: ["@resvg/resvg-wasm/index_bg.wasm"]
+      }
+    }
+  },
+  "firebase": awsLambda,
+  "vercel": awsLambda,
+  "vercel-edge": {
+    "chromium": false,
+    "css-inline": false,
+    // size constraint (2mb is max)
+    "resvg": "wasm",
+    "satori": "node",
+    "takumi": "wasm",
+    "sharp": false,
+    "emoji": "fetch",
+    // edge size limits - bundling 24MB icons not viable
+    "wasm": {
+      // lowers workers kb size
+      esmImport: true,
+      lazy: true
+    }
+  },
+  "cloudflare-pages": cloudflare,
+  "cloudflare": cloudflare,
+  "cloudflare-module": cloudflare
+};
+function detectTarget(options = {}) {
+  return options?.static ? autodetectableStaticProviders[provider] : autodetectableProviders[provider];
+}
+function resolveNitroPreset(nitroConfig) {
+  if (provider === "stackblitz" || provider === "codesandbox")
+    return provider;
+  const nuxt = useNuxt();
+  if (nuxt.options.dev)
+    return "nitro-dev";
+  if (nuxt.options.nitro.static)
+    return "nitro-prerender";
+  let preset;
+  if (nitroConfig && nitroConfig?.preset)
+    preset = nitroConfig.preset;
+  if (!preset)
+    preset = env.NITRO_PRESET || env.SERVER_PRESET || detectTarget() || "node-server";
+  return preset.replace("_", "-");
+}
+function getPresetNitroPresetCompatibility(target) {
+  const normalizedTarget = target.replace(/-legacy$/, "");
+  let compatibility = RuntimeCompatibility[normalizedTarget];
+  if (!compatibility)
+    compatibility = RuntimeCompatibility["nitro-dev"];
+  return compatibility;
+}
+async function applyNitroPresetCompatibility(nitroConfig, options) {
+  const target = resolveNitroPreset(nitroConfig);
+  const compatibility = getPresetNitroPresetCompatibility(target);
+  const hasCssInlineNode = await hasResolvableDependency("@css-inline/css-inline");
+  const hasCssInlineWasm = await hasResolvableDependency("@css-inline/css-inline-wasm");
+  const { resolve, detectedRenderers } = options;
+  const satoriEnabled = detectedRenderers.has("satori");
+  const chromiumEnabled = detectedRenderers.has("chromium");
+  const takumiEnabled = detectedRenderers.has("takumi");
+  for (const renderer of detectedRenderers) {
+    if (!compatibility[renderer]) {
+      logger.warn(`Renderer "${renderer}" detected but not supported on "${target}" preset. OG images using .${renderer}.vue components may fail.`);
+    }
+  }
+  const emptyMock = await resolve.resolvePath("./runtime/mock/empty");
+  nitroConfig.alias["#og-image/renderers/satori"] = satoriEnabled ? await resolve.resolvePath("./runtime/server/og-image/satori/renderer") : emptyMock;
+  nitroConfig.alias["#og-image/renderers/chromium"] = chromiumEnabled ? await resolve.resolvePath("./runtime/server/og-image/chromium/renderer") : emptyMock;
+  nitroConfig.alias["#og-image/renderers/takumi"] = takumiEnabled ? await resolve.resolvePath("./runtime/server/og-image/takumi/renderer") : emptyMock;
+  const resolvedCompatibility = {};
+  async function applyBinding(key) {
+    let binding = options.compatibility?.[key];
+    if (typeof binding === "undefined")
+      binding = compatibility[key];
+    if (key === "css-inline" && typeof binding === "string") {
+      if (binding === "node" && !hasCssInlineNode || ["wasm", "wasm-fs"].includes(binding) && !hasCssInlineWasm) {
+        binding = false;
+      }
+    }
+    resolvedCompatibility[key] = binding;
+    return {
+      [`#og-image/bindings/${key}`]: binding === false ? emptyMock : await resolve.resolvePath(`./runtime/server/og-image/bindings/${key}/${binding}`)
+    };
+  }
+  nitroConfig.alias = defu(
+    await applyBinding("chromium"),
+    await applyBinding("satori"),
+    await applyBinding("takumi"),
+    await applyBinding("resvg"),
+    await applyBinding("sharp"),
+    await applyBinding("css-inline"),
+    nitroConfig.alias || {}
+  );
+  if (Object.values(compatibility).includes("wasm")) {
+    nitroConfig.experimental = nitroConfig.experimental || {};
+    nitroConfig.experimental.wasm = true;
+  }
+  nitroConfig.rollupConfig = nitroConfig.rollupConfig || {};
+  nitroConfig.wasm = defu(compatibility.wasm, nitroConfig.wasm);
+  const normalizedTarget = target.replace(/-legacy$/, "");
+  const isEdgePreset = ["cloudflare", "cloudflare-pages", "cloudflare-module", "vercel-edge", "netlify-edge"].includes(normalizedTarget);
+  if (isEdgePreset) {
+    const mockCode = `import proxy from 'mocked-exports/proxy';export default proxy;export * from 'mocked-exports/proxy';`;
+    nitroConfig.virtual = nitroConfig.virtual || {};
+    nitroConfig.virtual.canvas = mockCode;
+  }
+  nitroConfig.virtual["#og-image/compatibility"] = () => `export default ${JSON.stringify(resolvedCompatibility)}`;
+  addTemplate({
+    filename: "nuxt-og-image/compatibility.mjs",
+    getContents() {
+      return `export default ${JSON.stringify(resolvedCompatibility)}`;
+    },
+    options: { mode: "server" }
+  });
+  return resolvedCompatibility;
+}
+function ensureDependencies(dep, nuxt = useNuxt()) {
+  return Promise.all(dep.map((d) => {
+    return ensureDependencyInstalled(d, {
+      cwd: nuxt.options.rootDir,
+      dev: true
+    });
+  }));
+}
+
+async function setupBuildHandler(config, resolve, getDetectedRenderers, nuxt = useNuxt()) {
+  nuxt.options.nitro.storage = nuxt.options.nitro.storage || {};
+  if (typeof config.runtimeCacheStorage === "object")
+    nuxt.options.nitro.storage["nuxt-og-image"] = config.runtimeCacheStorage;
+  nuxt.hooks.hook("nitro:config", async (nitroConfig) => {
+    const mockCode = `import proxy from 'mocked-exports/proxy';export default proxy;export * from 'mocked-exports/proxy';`;
+    nitroConfig.virtual = nitroConfig.virtual || {};
+    nitroConfig.virtual["playwright-core"] = mockCode;
+    nitroConfig.virtual.electron = mockCode;
+    nitroConfig.virtual["electron/index"] = mockCode;
+    nitroConfig.virtual["electron/index.js"] = mockCode;
+    nitroConfig.virtual.bufferutil = mockCode;
+    nitroConfig.virtual["utf-8-validate"] = mockCode;
+    nitroConfig.virtual["chromium-bidi"] = mockCode;
+    nitroConfig.virtual["chromium-bidi/lib/cjs/bidiMapper/BidiMapper"] = mockCode;
+    nitroConfig.virtual["chromium-bidi/lib/cjs/bidiMapper/BidiMapper.js"] = mockCode;
+    nitroConfig.virtual.queue = mockCode;
+  });
+  nuxt.hooks.hook("nitro:init", async (nitro) => {
+    const renderers = getDetectedRenderers();
+    await applyNitroPresetCompatibility(nitro.options, { compatibility: config.compatibility?.runtime, resolve, detectedRenderers: renderers });
+    const target = resolveNitroPreset(nitro.options);
+    const normalizedTarget = target.replace(/-legacy$/, "");
+    const isCloudflarePagesOrModule = normalizedTarget === "cloudflare-pages" || normalizedTarget === "cloudflare-module";
+    if (isCloudflarePagesOrModule) {
+      nitro.options.cloudflare = nitro.options.cloudflare || {};
+      nitro.options.cloudflare.pages = nitro.options.cloudflare.pages || {};
+      nitro.options.cloudflare.pages.routes = nitro.options.cloudflare.pages.routes || { exclude: [] };
+      nitro.options.cloudflare.pages.routes.exclude = nitro.options.cloudflare.pages.routes.exclude || [];
+      nitro.options.cloudflare.pages.routes.exclude.push("/_og/s/*");
+    }
+    nitro.hooks.hook("compiled", async (_nitro) => {
+      const compatibility = getPresetNitroPresetCompatibility(target);
+      if (compatibility.wasm?.esmImport !== true)
+        return;
+      const configuredEntry = nitro.options.rollupConfig?.output.entryFileNames;
+      const serverEntry = join(_nitro.options.output.serverDir, typeof configuredEntry === "string" ? configuredEntry : "index.mjs");
+      const wasmEntries = [serverEntry];
+      if (isCloudflarePagesOrModule) {
+        wasmEntries.push(join(dirname(serverEntry), "chunks/wasm.mjs"));
+        wasmEntries.push(join(dirname(serverEntry), "chunks/_/wasm.mjs"));
+        wasmEntries.push(join(dirname(serverEntry), "chunks/index_bg.mjs"));
+      }
+      const resvgHash = await resolveFilePathSha1("@resvg/resvg-wasm/index_bg.wasm");
+      const yogaHash = await resolveFilePathSha1("yoga-wasm-web/dist/yoga.wasm");
+      const cssInlineHash = await resolveFilePathSha1("@css-inline/css-inline-wasm/index_bg.wasm");
+      for (const entry of wasmEntries) {
+        if (!existsSync(entry))
+          continue;
+        const contents = await readFile(entry, "utf-8");
+        const postfix = target === "vercel-edge" ? "?module" : "";
+        const wasmPath = isCloudflarePagesOrModule ? `../wasm/` : `./wasm/`;
+        await writeFile(entry, contents.replaceAll('"@resvg/resvg-wasm/index_bg.wasm?module"', `"${wasmPath}index_bg-${resvgHash}.wasm${postfix}"`).replaceAll('"@css-inline/css-inline-wasm/index_bg.wasm?module"', `"${wasmPath}index_bg-${cssInlineHash}.wasm${postfix}"`).replaceAll('"yoga-wasm-web/dist/yoga.wasm?module"', `"${wasmPath}yoga-${yogaHash}.wasm${postfix}"`), { encoding: "utf-8" });
+      }
+    });
+  });
+}
+async function resolveFilePathSha1(path) {
+  const _path = await resolvePath(path);
+  return sha1(existsSync(_path) ? await readFile(_path) : Buffer.from(path));
+}
+function sha1(source) {
+  return createHash("sha1").update(source).digest("hex").slice(0, 16);
+}
+
+function setupDevHandler(options, resolve, getDetectedRenderers, nuxt = useNuxt()) {
+  nuxt.hooks.hook("nitro:init", async (nitro) => {
+    await applyNitroPresetCompatibility(nitro.options, { compatibility: options.compatibility?.dev, resolve, detectedRenderers: getDetectedRenderers() });
+  });
+}
+
+const DEVTOOLS_UI_ROUTE = "/__nuxt-og-image";
+const DEVTOOLS_UI_LOCAL_PORT = 3030;
+function setupDevToolsUI(options, resolve, nuxt = useNuxt()) {
+  const clientPath = resolve("./client");
+  const isProductionBuild = existsSync(clientPath);
+  if (isProductionBuild) {
+    nuxt.hook("vite:serverCreated", async (server) => {
+      const sirv = await import('sirv').then((r) => r.default || r);
+      server.middlewares.use(
+        DEVTOOLS_UI_ROUTE,
+        sirv(clientPath, { dev: true, single: true })
+      );
+    });
+  } else {
+    nuxt.hook("vite:extendConfig", (config) => {
+      if (!config.server) {
+        config.server = {};
+      }
+      config.server.proxy ||= {};
+      config.server.proxy[DEVTOOLS_UI_ROUTE] = {
+        target: `http://localhost:${DEVTOOLS_UI_LOCAL_PORT}${DEVTOOLS_UI_ROUTE}`,
+        changeOrigin: true,
+        followRedirects: true,
+        rewrite: (path) => path.replace(DEVTOOLS_UI_ROUTE, "")
+      };
+    });
+  }
+  const useNitro = new Promise((resolve2) => {
+    nuxt.hooks.hook("nitro:init", resolve2);
+  });
+  onDevToolsInitialized(async () => {
+    const rpc = extendServerRpc("nuxt-og-image", {
+      async ejectCommunityTemplate(path) {
+        const [dirName, componentName] = path.split("/");
+        const dir = resolve(nuxt.options.srcDir, "components", dirName || "");
+        if (!existsSync(dir)) {
+          mkdirSync(dir);
+        }
+        const newPath = resolve(dir, componentName || "");
+        const templatePath = resolve(`./runtime/app/components/Templates/Community/${componentName}`);
+        const template = (await readFile(templatePath, "utf-8")).replace("{{ title }}", `{{ title }} - Ejected!`);
+        await writeFile(newPath, template, { encoding: "utf-8" });
+        await updateTemplates({ filter: (t) => t.filename.includes("nuxt-og-image/components.mjs") });
+        const nitro = await useNitro;
+        await nitro.hooks.callHook("rollup:reload");
+        return newPath;
+      }
+    });
+    nuxt.hook("builder:watch", (e, path) => {
+      path = relative(nuxt.options.srcDir, resolve(nuxt.options.srcDir, path));
+      if ((e === "change" || e.includes("link")) && (path.startsWith("pages") || path.startsWith("content"))) {
+        rpc.broadcast.refreshRouteData(path).catch(() => {
+        });
+      }
+      if (options.componentDirs.some((dir) => path.includes(dir))) {
+        if (e === "change") {
+          rpc.broadcast.refresh().catch(() => {
+          });
+        } else {
+          rpc.broadcast.refreshGlobalData().catch(() => {
+          });
+        }
+      }
+    });
+  });
+  addCustomTab({
+    name: "nuxt-og-image",
+    title: "OG Image",
+    icon: "carbon:image-search",
+    view: {
+      type: "iframe",
+      src: DEVTOOLS_UI_ROUTE
+    }
+  });
+}
+
+function setupGenerateHandler(_options, resolve, _getDetectedRenderers, nuxt = useNuxt()) {
+  nuxt.hooks.hook("nitro:config", async (nitroConfig) => {
+    await applyNitroPresetCompatibility(nitroConfig, {
+      compatibility: {
+        "chromium": false,
+        "satori": false,
+        "css-inline": false,
+        "resvg": false,
+        "sharp": false
+      },
+      resolve,
+      detectedRenderers: /* @__PURE__ */ new Set()
+    });
+  });
+}
+
+const ONE_WEEK_MS = 7 * 24 * 60 * 60 * 1e3;
+function setupPrerenderHandler(options, resolve, getDetectedRenderers, nuxt = useNuxt()) {
+  nuxt.hooks.hook("nitro:init", async (nitro) => {
+    nitro.hooks.hook("prerender:config", async (nitroConfig) => {
+      await applyNitroPresetCompatibility(nitroConfig, { compatibility: options.compatibility?.prerender, resolve, detectedRenderers: getDetectedRenderers() });
+      nitroConfig.wasm = nitroConfig.wasm || {};
+      nitroConfig.wasm.esmImport = false;
+    });
+    nitro.hooks.hook("prerender:done", async () => {
+      const buildCachePath = typeof options.buildCache === "object" && options.buildCache.base ? options.buildCache.base : "node_modules/.cache/nuxt-seo/og-image";
+      const buildCacheDir = options.buildCache ? join(nuxt.options.rootDir, buildCachePath) : null;
+      if (!buildCacheDir || !existsSync(buildCacheDir))
+        return;
+      const files = readdirSync(buildCacheDir);
+      const now = Date.now();
+      let cleanedCount = 0;
+      for (const file of files) {
+        if (file.startsWith("."))
+          continue;
+        const filePath = join(buildCacheDir, file);
+        const content = JSON.parse(readFileSync(filePath, "utf-8"));
+        const createdAt = content.createdAt || statSync(filePath).mtimeMs;
+        const expiresAt = content.expiresAt || 0;
+        const isExpired = expiresAt < now;
+        const isOld = now - createdAt > ONE_WEEK_MS;
+        if (isExpired && isOld) {
+          rmSync(filePath);
+          cleanedCount++;
+        }
+      }
+      if (cleanedCount > 0)
+        logger.info(`Cleaned ${cleanedCount} orphaned OG image cache file${cleanedCount > 1 ? "s" : ""}.`);
+    });
+  });
+}
+
+function isVue(id, opts = {}) {
+  const { search } = parseURL(decodeURIComponent(pathToFileURL(id).href));
+  if (id.endsWith(".vue") && !search) {
+    return true;
+  }
+  if (!search) {
+    return false;
+  }
+  const query = parseQuery(search);
+  if (query.nuxt_component) {
+    return false;
+  }
+  if (query.macro && (search === "?macro=true" || !opts.type || opts.type.includes("script"))) {
+    return true;
+  }
+  const type = "setup" in query ? "script" : query.type;
+  if (!("vue" in query) || opts.type && !opts.type.includes(type)) {
+    return false;
+  }
+  return true;
+}
+const JS_RE = /\.(?:[cm]?j|t)sx?$/;
+function isJS(id) {
+  const { pathname } = parseURL(decodeURIComponent(pathToFileURL(id).href));
+  return JS_RE.test(pathname);
+}
+const TreeShakeComposablesPlugin = createUnplugin(() => {
+  const composableNames = [
+    "defineOgImage",
+    "defineOgImageComponent",
+    "defineOgImageScreenshot"
+  ];
+  const regexp = `(^\\s*)(${composableNames.join("|")})(?=\\((?!\\) \\{))`;
+  const COMPOSABLE_RE = new RegExp(regexp, "m");
+  const COMPOSABLE_RE_GLOBAL = new RegExp(regexp, "gm");
+  return {
+    name: "nuxt-og-image:zero-runtime:transform",
+    enforce: "pre",
+    transformInclude(id) {
+      return isVue(id, { type: ["script"] }) || isJS(id);
+    },
+    transform(code, id) {
+      const s = new MagicString(code);
+      if (id.endsWith("components.islands.mjs")) ; else {
+        const strippedCode = stripLiteral(code);
+        if (!COMPOSABLE_RE.test(code)) {
+          return;
+        }
+        for (const match of strippedCode.matchAll(COMPOSABLE_RE_GLOBAL)) {
+          s.overwrite(match.index, match.index + match[0].length, `${match[1]} import.meta.prerender && ${match[2]}`);
+        }
+      }
+      if (s.hasChanged()) {
+        return {
+          code: s.toString(),
+          map: s.generateMap({ hires: true })
+        };
+      }
+    }
+  };
+});
+
+const toSrgbGamut = toGamut("rgb", "oklch");
+function decodeCssClassName(selector) {
+  let className = selector.startsWith(".") ? selector.slice(1) : selector;
+  className = className.replace(/\\([0-9a-f]+)\s?/gi, (_, hex) => String.fromCodePoint(Number.parseInt(hex, 16)));
+  className = className.replace(/\\(.)/g, "$1");
+  return className;
+}
+function createStylesheetLoader(baseDir) {
+  return async (id, base) => {
+    if (id === "tailwindcss") {
+      const twPath = resolveModulePath("tailwindcss/index.css", { from: baseDir });
+      if (twPath) {
+        const content = await readFile(twPath, "utf-8").catch(() => "");
+        if (content)
+          return { path: twPath, base: dirname(twPath), content };
+      }
+      return {
+        path: "virtual:tailwindcss",
+        base,
+        content: "@layer theme, base, components, utilities;\n@layer utilities { @tailwind utilities; }"
+      };
+    }
+    if (id.startsWith("./") || id.startsWith("../")) {
+      const resolved2 = join(base || baseDir, id);
+      const content = await readFile(resolved2, "utf-8").catch(() => "");
+      return { path: resolved2, base: dirname(resolved2), content };
+    }
+    const resolved = resolveModulePath(id, { from: base || baseDir, conditions: ["style"] });
+    if (resolved) {
+      const content = await readFile(resolved, "utf-8").catch(() => "");
+      return { path: resolved, base: dirname(resolved), content };
+    }
+    return { path: id, base, content: "" };
+  };
+}
+function convertColorToHex(value) {
+  if (!value || value.includes("var("))
+    return value;
+  const color = parse(value);
+  if (!color)
+    return value;
+  const mapped = toSrgbGamut(color);
+  return formatHex(mapped) || value;
+}
+function convertOklchToHex(css) {
+  return css.replace(/oklch\([^)]+\)/g, (match) => convertColorToHex(match));
+}
+const COLOR_PROPERTIES = /* @__PURE__ */ new Set([
+  "color",
+  "background-color",
+  "background-image",
+  "border-color",
+  "border-top-color",
+  "border-right-color",
+  "border-bottom-color",
+  "border-left-color",
+  "outline-color",
+  "fill",
+  "stroke",
+  "text-decoration-color",
+  "caret-color",
+  "accent-color"
+]);
+function buildNuxtUiVars(vars, nuxtUiColors) {
+  const colors = twColors;
+  const shades = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950];
+  for (const [semantic, colorName] of Object.entries(nuxtUiColors)) {
+    for (const shade of shades) {
+      const varName = `--ui-color-${semantic}-${shade}`;
+      const value = colors[colorName]?.[shade];
+      if (value && !vars.has(varName))
+        vars.set(varName, value);
+    }
+    if (!vars.has(`--ui-${semantic}`))
+      vars.set(`--ui-${semantic}`, colors[colorName]?.[500] || "");
+  }
+  const neutral = nuxtUiColors.neutral || "slate";
+  const neutralColors = colors[neutral];
+  const semanticVars = {
+    "--ui-text-dimmed": neutralColors?.[400] || "",
+    "--ui-text-muted": neutralColors?.[500] || "",
+    "--ui-text-toned": neutralColors?.[600] || "",
+    "--ui-text": neutralColors?.[700] || "",
+    "--ui-text-highlighted": neutralColors?.[900] || "",
+    "--ui-text-inverted": "#ffffff",
+    "--ui-bg": "#ffffff",
+    "--ui-bg-muted": neutralColors?.[50] || "",
+    "--ui-bg-elevated": neutralColors?.[100] || "",
+    "--ui-bg-accented": neutralColors?.[200] || "",
+    "--ui-bg-inverted": neutralColors?.[900] || "",
+    "--ui-border": neutralColors?.[200] || "",
+    "--ui-border-muted": neutralColors?.[200] || "",
+    "--ui-border-accented": neutralColors?.[300] || "",
+    "--ui-border-inverted": neutralColors?.[900] || ""
+  };
+  for (const [name, value] of Object.entries(semanticVars)) {
+    if (value && !vars.has(name))
+      vars.set(name, value);
+  }
+}
+function walkTemplateAst(nodes, visitor) {
+  for (const node of nodes) {
+    visitor(node);
+    if ("children" in node && Array.isArray(node.children))
+      walkTemplateAst(node.children, visitor);
+  }
+}
+
+let cachedCompiler = null;
+let cachedCssPath = null;
+let cachedVars = null;
+const resolvedStyleCache = /* @__PURE__ */ new Map();
+async function getCompiler(cssPath, nuxtUiColors) {
+  if (cachedCompiler && cachedCssPath === cssPath)
+    return { compiler: cachedCompiler, vars: cachedVars };
+  const userCss = await readFile(cssPath, "utf-8");
+  const baseDir = dirname(cssPath);
+  const compiler = await compile(userCss, {
+    loadStylesheet: createStylesheetLoader(baseDir)
+  });
+  const vars = /* @__PURE__ */ new Map();
+  if (nuxtUiColors)
+    buildNuxtUiVars(vars, nuxtUiColors);
+  cachedCompiler = compiler;
+  cachedCssPath = cssPath;
+  cachedVars = vars;
+  resolvedStyleCache.clear();
+  return { compiler, vars };
+}
+function parseCssOutput(css, vars) {
+  const classes = /* @__PURE__ */ new Map();
+  const root = postcss.parse(css);
+  root.walkRules((rule) => {
+    if (rule.selector.includes(":root") || rule.selector.includes(":host")) {
+      rule.walkDecls((decl) => {
+        if (decl.prop.startsWith("--") && !vars.has(decl.prop))
+          vars.set(decl.prop, decl.value);
+      });
+    }
+  });
+  root.walkRules((rule) => {
+    const sel = rule.selector;
+    if (!sel.startsWith(".") || sel.includes(":") || sel.includes(" ") || sel.includes(">"))
+      return;
+    const className = decodeCssClassName(sel);
+    const styles = {};
+    rule.walkDecls((decl) => {
+      if (decl.prop.startsWith("--tw-"))
+        return;
+      styles[decl.prop] = decl.value;
+    });
+    if (Object.keys(styles).length)
+      classes.set(className, styles);
+  });
+  return classes;
+}
+function evaluateCalc(value) {
+  if (!value.includes("calc("))
+    return value;
+  const fakeCss = `.x{v:${value}}`;
+  const result = postcss([postcssCalc({})]).process(fakeCss, { from: void 0 });
+  const match = result.css.match(/\.x\{v:(.+)\}/);
+  return match?.[1] ?? value;
+}
+function parseVarExpression(value, startIndex) {
+  if (!value.startsWith("var(", startIndex))
+    return null;
+  let depth = 1;
+  let i = startIndex + 4;
+  let varName = "";
+  let fallback = null;
+  let inFallback = false;
+  while (i < value.length && depth > 0) {
+    const char = value[i];
+    if (char === "(") {
+      depth++;
+      if (inFallback)
+        fallback += char;
+    } else if (char === ")") {
+      depth--;
+      if (depth > 0 && inFallback)
+        fallback += char;
+    } else if (char === "," && depth === 1 && !inFallback) {
+      inFallback = true;
+      fallback = "";
+      i++;
+      while (i < value.length && value[i] === " ")
+        i++;
+      continue;
+    } else if (inFallback && char) {
+      fallback += char;
+    } else {
+      varName += char;
+    }
+    i++;
+  }
+  if (depth !== 0 || !varName.startsWith("--"))
+    return null;
+  return {
+    varName: varName.trim(),
+    fallback: fallback?.trim() || null,
+    endIndex: i
+  };
+}
+function resolveVars(value, vars, depth = 0) {
+  if (depth > 10 || !value.includes("var("))
+    return evaluateCalc(value);
+  const calcMatch = value.match(/calc\(var\((--[\w-]+)\)\s*\*\s*([\d.]+)\)/);
+  if (calcMatch?.[1] && calcMatch?.[2]) {
+    const varValue = vars.get(calcMatch[1]);
+    if (varValue) {
+      const numMatch = varValue.match(/([\d.]+)(rem|px|em|%)/);
+      if (numMatch?.[1] && numMatch?.[2]) {
+        const computed = Number.parseFloat(numMatch[1]) * Number.parseFloat(calcMatch[2]);
+        return `${computed}${numMatch[2]}`;
+      }
+    }
+  }
+  let result = value;
+  let iterations = 0;
+  const maxIterations = 50;
+  while (result.includes("var(") && iterations < maxIterations) {
+    const varIndex = result.indexOf("var(");
+    if (varIndex === -1)
+      break;
+    const parsed = parseVarExpression(result, varIndex);
+    if (!parsed) {
+      result = result.slice(0, varIndex) + result.slice(varIndex + 4);
+      iterations++;
+      continue;
+    }
+    const resolved = vars.get(parsed.varName) ?? parsed.fallback;
+    if (resolved) {
+      result = result.slice(0, varIndex) + resolved + result.slice(parsed.endIndex);
+    } else {
+      result = result.slice(0, varIndex) + result.slice(parsed.endIndex);
+    }
+    iterations++;
+  }
+  if (result.includes("var(") && depth < 10)
+    return resolveVars(result, vars, depth + 1);
+  return evaluateCalc(result);
+}
+function convertGradientColors(value) {
+  return value.replace(/oklch\([^)]+\)/g, (match) => {
+    const hex = convertColorToHex(match);
+    return hex.startsWith("#") ? hex : match;
+  });
+}
+const LINEAR_GRADIENT_DIRECTIONS = {
+  "bg-gradient-to-t": "to top",
+  "bg-gradient-to-tr": "to top right",
+  "bg-gradient-to-r": "to right",
+  "bg-gradient-to-br": "to bottom right",
+  "bg-gradient-to-b": "to bottom",
+  "bg-gradient-to-bl": "to bottom left",
+  "bg-gradient-to-l": "to left",
+  "bg-gradient-to-tl": "to top left"
+};
+const RADIAL_GRADIENT_SHAPES = {
+  "bg-radial": "circle at center",
+  "bg-radial-at-t": "circle at top",
+  "bg-radial-at-tr": "circle at top right",
+  "bg-radial-at-r": "circle at right",
+  "bg-radial-at-br": "circle at bottom right",
+  "bg-radial-at-b": "circle at bottom",
+  "bg-radial-at-bl": "circle at bottom left",
+  "bg-radial-at-l": "circle at left",
+  "bg-radial-at-tl": "circle at top left",
+  "bg-radial-at-c": "circle at center"
+};
+function resolveGradientColor(cls, vars) {
+  const colorName = cls.replace(/^(from|via|to)-/, "");
+  const shadeMatch = colorName.match(/^(.+)-(\d+)$/);
+  if (shadeMatch?.[1] && shadeMatch?.[2]) {
+    const varName2 = `--color-${shadeMatch[1]}-${shadeMatch[2]}`;
+    const value2 = vars.get(varName2);
+    if (value2) {
+      const resolved = resolveVars(value2, vars);
+      if (!resolved.includes("var("))
+        return convertColorToHex(resolved);
+    }
+  }
+  const varName = `--color-${colorName}`;
+  const value = vars.get(varName);
+  if (value) {
+    const resolved = resolveVars(value, vars);
+    if (!resolved.includes("var("))
+      return convertColorToHex(resolved);
+  }
+  return null;
+}
+function buildGradient(classes, vars) {
+  const linearDir = classes.find((c) => LINEAR_GRADIENT_DIRECTIONS[c]);
+  const radialShape = classes.find((c) => RADIAL_GRADIENT_SHAPES[c]);
+  const fromClass = classes.find((c) => c.startsWith("from-"));
+  const viaClass = classes.find((c) => c.startsWith("via-"));
+  const toClass = classes.find((c) => c.startsWith("to-") && !/^to-(?:[tblr]|tl|tr|bl|br)$/.test(c));
+  if (!linearDir && !radialShape)
+    return null;
+  if (!fromClass && !toClass)
+    return null;
+  const fromColor = fromClass ? resolveGradientColor(fromClass, vars) : null;
+  const viaColor = viaClass ? resolveGradientColor(viaClass, vars) : null;
+  const toColor = toClass ? resolveGradientColor(toClass, vars) : null;
+  if (!fromColor && !toColor)
+    return null;
+  const stops = [fromColor, viaColor, toColor].filter(Boolean).join(", ");
+  const colorClasses = [fromClass, viaClass, toClass].filter((c) => !!c);
+  if (linearDir) {
+    const direction = LINEAR_GRADIENT_DIRECTIONS[linearDir];
+    return {
+      gradientClass: linearDir,
+      value: `linear-gradient(${direction}, ${stops})`,
+      colorClasses
+    };
+  }
+  if (radialShape) {
+    const shape = RADIAL_GRADIENT_SHAPES[radialShape];
+    return {
+      gradientClass: radialShape,
+      value: `radial-gradient(${shape}, ${stops})`,
+      colorClasses
+    };
+  }
+  return null;
+}
+async function resolveClassesToStyles(classes, options) {
+  const { compiler, vars } = await getCompiler(options.cssPath, options.nuxtUiColors);
+  const uncached = classes.filter((c) => !resolvedStyleCache.has(c));
+  if (uncached.length > 0) {
+    const outputCss = compiler.build(uncached);
+    const parsedClasses = parseCssOutput(outputCss, vars);
+    for (const [className, rawStyles] of parsedClasses) {
+      const styles = {};
+      for (const [prop, rawValue] of Object.entries(rawStyles)) {
+        let value = resolveVars(rawValue, vars);
+        if (value.includes("var("))
+          continue;
+        if (COLOR_PROPERTIES.has(prop)) {
+          if (prop === "background-image" && value.includes("gradient")) {
+            value = convertGradientColors(value);
+          } else {
+            value = convertColorToHex(value);
+          }
+        }
+        styles[prop] = value;
+      }
+      resolvedStyleCache.set(className, Object.keys(styles).length ? styles : null);
+    }
+    for (const c of uncached) {
+      if (!resolvedStyleCache.has(c))
+        resolvedStyleCache.set(c, null);
+    }
+  }
+  const result = {};
+  for (const cls of classes) {
+    const resolved = resolvedStyleCache.get(cls);
+    if (resolved)
+      result[cls] = resolved;
+  }
+  const gradient = buildGradient(classes, vars);
+  if (gradient) {
+    result[gradient.gradientClass] = { "background-image": gradient.value };
+    for (const colorClass of gradient.colorClasses) {
+      result[colorClass] = {};
+    }
+  }
+  return result;
+}
+async function extractTw4Metadata(options) {
+  const { compiler, vars } = await getCompiler(options.cssPath, options.nuxtUiColors);
+  const themeCss = compiler.build([]);
+  parseCssOutput(themeCss, vars);
+  const fontVars = {};
+  const breakpoints = {};
+  const colors = {};
+  for (const [name, value] of vars) {
+    const resolvedValue = resolveVars(value, vars);
+    if (name.startsWith("--font-")) {
+      fontVars[name.slice(2)] = resolvedValue;
+    } else if (name.startsWith("--breakpoint-")) {
+      const px = Number.parseInt(resolvedValue.replace("px", ""), 10);
+      if (!Number.isNaN(px))
+        breakpoints[name.slice(13)] = px;
+    } else if (name.startsWith("--color-") && !resolvedValue.includes("var(")) {
+      const colorPath = name.slice(8);
+      const shadeMatch = colorPath.match(/^(.+)-(\d+)$/);
+      const hexValue = convertColorToHex(resolvedValue);
+      if (shadeMatch) {
+        const [, colorName, shade] = shadeMatch;
+        if (colorName) {
+          if (!colors[colorName])
+            colors[colorName] = {};
+          if (typeof colors[colorName] === "object")
+            colors[colorName][shade] = hexValue;
+        }
+      } else {
+        colors[colorPath] = hexValue;
+      }
+    }
+  }
+  return { fontVars, breakpoints, colors };
+}
+function clearTw4Cache() {
+  cachedCompiler = null;
+  cachedCssPath = null;
+  cachedVars = null;
+  resolvedStyleCache.clear();
+}
+
+const ELEMENT_NODE = 1;
+const ATTRIBUTE_NODE = 6;
+function escapeAttrValue(value) {
+  return value.replace(/"/g, "&quot;");
+}
+async function transformVueTemplate(code, options) {
+  const { descriptor } = parse$1(code);
+  if (!descriptor.template?.ast)
+    return void 0;
+  const s = new MagicString(code);
+  const collectors = [];
+  walkTemplateAst(descriptor.template.ast.children, (node) => {
+    if (node.type !== ELEMENT_NODE)
+      return;
+    const el = node;
+    const collector = {
+      classes: [],
+      elementLoc: { start: el.loc.start.offset, end: el.loc.end.offset }
+    };
+    for (const prop of el.props) {
+      if (prop.type === ATTRIBUTE_NODE && prop.name === "class" && prop.value) {
+        collector.classes = prop.value.content.split(/\s+/).filter(Boolean);
+        collector.classLoc = {
+          start: prop.loc.start.offset,
+          end: prop.loc.end.offset
+        };
+      }
+      if (prop.type === ATTRIBUTE_NODE && prop.name === "style" && prop.value) {
+        collector.existingStyle = prop.value.content;
+        collector.styleLoc = {
+          start: prop.loc.start.offset,
+          end: prop.loc.end.offset
+        };
+      }
+    }
+    if (collector.classes.length > 0) {
+      collectors.push(collector);
+    }
+  });
+  if (collectors.length === 0)
+    return void 0;
+  let hasChanges = false;
+  for (const collector of collectors.reverse()) {
+    const styleMap = await options.resolveStyles(collector.classes);
+    const styleProps = {};
+    const unresolvedClasses = [];
+    for (const cls of collector.classes) {
+      const resolved = styleMap[cls];
+      if (resolved && Object.keys(resolved).length > 0) {
+        Object.assign(styleProps, resolved);
+      } else if (!resolved) {
+        unresolvedClasses.push(cls);
+      }
+    }
+    if (collector.existingStyle) {
+      for (const decl of collector.existingStyle.split(";")) {
+        const [prop, ...valParts] = decl.split(":");
+        const value = valParts.join(":").trim();
+        if (prop?.trim() && value) {
+          styleProps[prop.trim()] = value;
+        }
+      }
+    }
+    const styleStr = Object.entries(styleProps).map(([prop, value]) => `${prop}: ${escapeAttrValue(value)}`).join("; ");
+    const hasResolvedStyles = Object.keys(styleProps).length > 0;
+    const hasUnresolved = unresolvedClasses.length > 0;
+    const resolvedSome = unresolvedClasses.length < collector.classes.length;
+    if (!resolvedSome)
+      continue;
+    hasChanges = true;
+    if (!collector.classLoc)
+      continue;
+    if (hasUnresolved) {
+      s.overwrite(collector.classLoc.start, collector.classLoc.end, `class="${unresolvedClasses.join(" ")}"`);
+    } else {
+      s.remove(collector.classLoc.start, collector.classLoc.end);
+    }
+    if (hasResolvedStyles) {
+      if (collector.styleLoc) {
+        s.overwrite(collector.styleLoc.start, collector.styleLoc.end, `style="${styleStr}"`);
+      } else {
+        s.appendLeft(collector.classLoc.start, `style="${styleStr}" `);
+      }
+    }
+  }
+  if (!hasChanges)
+    return void 0;
+  return {
+    code: s.toString(),
+    map: s.generateMap({ hires: true })
+  };
+}
+
+let svgCounter = 0;
+function makeIdsUnique(svg) {
+  const prefix = `og${svgCounter++}_`;
+  const ids = /* @__PURE__ */ new Set();
+  svg.replace(/\bid="([^"]+)"/g, (_, id) => {
+    ids.add(id);
+    return "";
+  });
+  let result = svg;
+  for (const id of ids) {
+    result = result.replace(new RegExp(`id="${id}"`, "g"), `id="${prefix}${id}"`).replace(new RegExp(`url\\(#${id}\\)`, "g"), `url(#${prefix}${id})`).replace(new RegExp(`href="#${id}"`, "g"), `href="#${prefix}${id}"`);
+  }
+  return result;
+}
+function wrapDefsElements(body) {
+  const defsElements = ["linearGradient", "radialGradient", "filter", "clipPath", "mask", "pattern"];
+  const defsRegex = new RegExp(`<(${defsElements.join("|")})[\\s\\S]*?<\\/\\1>`, "g");
+  if (body.includes("<defs>") || body.includes("<defs "))
+    return body;
+  const foundDefs = [];
+  const result = body.replace(defsRegex, (match) => {
+    foundDefs.push(match);
+    return "";
+  });
+  if (foundDefs.length > 0)
+    return `<defs>${foundDefs.join("")}</defs>${result}`;
+  return body;
+}
+function buildIconSvg(iconData, defaultWidth, defaultHeight, attrs) {
+  const body = wrapDefsElements(iconData.body || "");
+  const width = iconData.width || defaultWidth;
+  const height = iconData.height || defaultHeight;
+  const attrPairs = attrs.matchAll(/(\w+(?:-\w+)*)="([^"]*)"/g);
+  const filteredAttrs = [];
+  for (const [, key, value] of attrPairs) {
+    if (key !== "name")
+      filteredAttrs.push(`${key}="${value}"`);
+  }
+  const attrsStr = filteredAttrs.length > 0 ? ` ${filteredAttrs.join(" ")}` : "";
+  let svg = `<span${attrsStr} style="display:flex"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${width} ${height}" width="100%" height="100%" fill="currentColor">${body}</svg></span>`;
+  svg = makeIdsUnique(svg);
+  return svg;
+}
+const iconCache = /* @__PURE__ */ new Map();
+async function loadIconSet(prefix) {
+  if (iconCache.has(prefix))
+    return iconCache.get(prefix);
+  const icons = await import(`@iconify-json/${prefix}/icons.json`, { with: { type: 'json' } }).then((m) => m.default).catch(() => null);
+  iconCache.set(prefix, icons);
+  return icons;
+}
+function buildEmojiSvg(emoji, icons, emojiSet) {
+  const codePoint = getEmojiCodePoint(emoji);
+  const possibleNames = getEmojiIconNames(codePoint, emojiSet);
+  for (const iconName of possibleNames) {
+    const iconData = icons.icons?.[iconName];
+    if (iconData) {
+      const body = wrapDefsElements(iconData.body || "");
+      const width = iconData.width || icons.width || 128;
+      const height = iconData.height || icons.height || 128;
+      let svg = `<span style="display:flex"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${width} ${height}" width="1em" height="1em">${body}</svg></span>`;
+      svg = makeIdsUnique(svg);
+      return svg;
+    }
+  }
+  return null;
+}
+function getMimeType(ext) {
+  const mimeTypes = {
+    png: "image/png",
+    jpg: "image/jpeg",
+    jpeg: "image/jpeg",
+    gif: "image/gif",
+    webp: "image/webp",
+    svg: "image/svg+xml"
+  };
+  return mimeTypes[ext] || "application/octet-stream";
+}
+const SATORI_UNSUPPORTED_PATTERNS = [
+  /^ring(-|$)/,
+  // Ring utilities - not supported
+  /^divide(-|$)/,
+  // Divide utilities - not supported
+  /^space-(x|y)(-|$)/,
+  // Space utilities - use gap instead
+  /^backdrop-/,
+  // Backdrop utilities - not supported
+  // Note: filter utilities (blur, brightness, etc.) ARE supported by Satori
+  // Note: skew transforms ARE supported by Satori
+  /^transition(-|$)/,
+  // Animation (static image)
+  /^animate(-|$)/,
+  /^duration(-|$)/,
+  /^ease(-|$)/,
+  /^delay(-|$)/,
+  /^scroll(-|$)/,
+  // Scroll utilities
+  /^snap(-|$)/,
+  /^touch(-|$)/,
+  // Touch/pointer
+  /^pointer-events(-|$)/,
+  /^cursor(-|$)/,
+  /^select(-|$)/,
+  // User select
+  /^will-change(-|$)/,
+  /^placeholder(-|$)/,
+  /^caret(-|$)/,
+  /^accent(-|$)/,
+  /^columns(-|$)/,
+  /^break-(before|after|inside)(-|$)/,
+  /^hyphens(-|$)/,
+  /^content-(?!center|start|end|between|around|evenly|stretch)/
+  // content-* except flex alignment
+];
+function isSatoriUnsupported(cls) {
+  return SATORI_UNSUPPORTED_PATTERNS.some((p) => p.test(cls));
+}
+const AssetTransformPlugin = createUnplugin((options) => {
+  let emojiIcons = null;
+  return {
+    name: "nuxt-og-image:asset-transform",
+    enforce: "pre",
+    transformInclude(id) {
+      if (!id.endsWith(".vue") || id.includes("node_modules"))
+        return false;
+      return options.ogComponentPaths.some((dir) => id.startsWith(`${dir}/`) || id.startsWith(`${dir}\\`));
+    },
+    async transform(code, id) {
+      const templateMatch = code.match(/<template>([\s\S]*?)<\/template>/);
+      if (!templateMatch)
+        return;
+      const s = new MagicString(code);
+      const templateStart = code.indexOf("<template>") + "<template>".length;
+      const templateEnd = code.indexOf("</template>");
+      let template = code.slice(templateStart, templateEnd);
+      let hasChanges = false;
+      if (options.emojiSet && RE_MATCH_EMOJIS.test(template)) {
+        if (!emojiIcons) {
+          emojiIcons = await import(`@iconify-json/${options.emojiSet}/icons.json`, { with: { type: 'json' } }).then((m) => m.default).catch(() => null);
+        }
+        if (emojiIcons) {
+          RE_MATCH_EMOJIS.lastIndex = 0;
+          template = template.replace(/>([^<]*)</g, (fullMatch, textContent) => {
+            if (!textContent)
+              return fullMatch;
+            RE_MATCH_EMOJIS.lastIndex = 0;
+            const emojiMatches = [...textContent.matchAll(RE_MATCH_EMOJIS)];
+            if (!emojiMatches.length)
+              return fullMatch;
+            let newTextContent = textContent;
+            for (const match of emojiMatches) {
+              const emoji = match[0];
+              const svg = buildEmojiSvg(emoji, emojiIcons, options.emojiSet);
+              if (svg) {
+                hasChanges = true;
+                const escaped = emoji.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+                newTextContent = newTextContent.replace(new RegExp(escaped, "g"), svg);
+              }
+            }
+            return `>${newTextContent}<`;
+          });
+        }
+      }
+      const iconRegex = /<(Icon|UIcon)\s+([^>]*name="([^"]+)"[^>]*)\/?>/g;
+      if (iconRegex.test(template)) {
+        iconRegex.lastIndex = 0;
+        const prefixes = /* @__PURE__ */ new Set();
+        let match;
+        while ((match = iconRegex.exec(template)) !== null) {
+          const iconName = match[3];
+          if (!iconName || iconName.includes("{"))
+            continue;
+          const [prefix] = iconName.split(":");
+          if (prefix)
+            prefixes.add(prefix);
+        }
+        const iconSets = /* @__PURE__ */ new Map();
+        for (const prefix of prefixes) {
+          const icons = await loadIconSet(prefix);
+          if (icons)
+            iconSets.set(prefix, icons);
+        }
+        if (iconSets.size > 0) {
+          iconRegex.lastIndex = 0;
+          template = template.replace(iconRegex, (fullMatch, _tag, attrs, iconName) => {
+            if (!iconName || iconName.includes("{"))
+              return fullMatch;
+            const [prefix, name] = iconName.split(":");
+            if (!prefix || !name)
+              return fullMatch;
+            const icons = iconSets.get(prefix);
+            if (!icons)
+              return fullMatch;
+            const iconData = icons.icons?.[name];
+            if (!iconData)
+              return fullMatch;
+            hasChanges = true;
+            return buildIconSvg(iconData, icons.width || 24, icons.height || 24, attrs);
+          });
+        }
+      }
+      if (options.initTw4)
+        await options.initTw4();
+      if (options.tw4StyleMap && Object.keys(options.tw4StyleMap).length > 0) {
+        try {
+          const styleMap = options.tw4StyleMap;
+          const fullCode = code.slice(0, templateStart) + template + code.slice(templateEnd);
+          const hasGradientClasses = options.tw4CssPath && (template.includes("bg-gradient") || template.includes("bg-radial") || template.includes("from-") || template.includes("to-") || template.includes("via-"));
+          const result = await transformVueTemplate(fullCode, {
+            resolveStyles: async (classes) => {
+              const supported = classes.filter((cls) => !isSatoriUnsupported(cls));
+              const unsupported = classes.filter((cls) => isSatoriUnsupported(cls));
+              if (unsupported.length > 0) {
+                const componentName = id.split("/").pop();
+                console.warn(`[nuxt-og-image] ${componentName}: Filtered unsupported Satori classes: ${unsupported.join(", ")}`);
+              }
+              if (hasGradientClasses && options.tw4CssPath) {
+                const hasElementGradient = supported.some(
+                  (c) => c.startsWith("bg-gradient") || c.startsWith("bg-radial") || c.startsWith("from-") || c.startsWith("to-") || c.startsWith("via-")
+                );
+                if (hasElementGradient) {
+                  const nuxtUiColors = await options.loadNuxtUiColors?.();
+                  return resolveClassesToStyles(supported, {
+                    cssPath: options.tw4CssPath,
+                    nuxtUiColors
+                  });
+                }
+              }
+              const resolved = {};
+              for (const cls of supported) {
+                const baseClass = cls.replace(/^(sm|md|lg|xl|2xl):/, "");
+                if (styleMap[baseClass]) {
+                  resolved[cls] = styleMap[baseClass];
+                } else if (styleMap[cls]) {
+                  resolved[cls] = styleMap[cls];
+                }
+              }
+              return resolved;
+            }
+          });
+          if (result) {
+            const newTemplateStart = result.code.indexOf("<template>") + "<template>".length;
+            const newTemplateEnd = result.code.indexOf("</template>");
+            template = result.code.slice(newTemplateStart, newTemplateEnd);
+            hasChanges = true;
+          }
+        } catch (err) {
+          const componentName = id.split("/").pop();
+          console.warn(`[nuxt-og-image] ${componentName}: TW4 template transform failed, using original template`, err.message);
+        }
+      }
+      if (!template.includes("data-no-inline")) {
+        const imgRegex = /(?<!:)src="((?:\/|~\/|@\/)[^"]+\.(png|jpg|jpeg|gif|webp|svg))"/g;
+        if (imgRegex.test(template)) {
+          imgRegex.lastIndex = 0;
+          const componentDir = dirname(id);
+          const replacements = [];
+          let match;
+          while ((match = imgRegex.exec(template)) !== null) {
+            const [fullMatch, srcPath, ext] = match;
+            if (!srcPath || !ext)
+              continue;
+            if (srcPath.startsWith("data:") || srcPath.startsWith("http"))
+              continue;
+            let resolvedPath;
+            if (srcPath.startsWith("/")) {
+              resolvedPath = join(options.publicDir, srcPath);
+            } else if (srcPath.startsWith("~/") || srcPath.startsWith("@/")) {
+              resolvedPath = join(options.srcDir, srcPath.slice(2));
+            } else if (!isAbsolute(srcPath)) {
+              resolvedPath = resolve(componentDir, srcPath);
+            } else {
+              continue;
+            }
+            const fileBuffer = await readFile(resolvedPath).catch(() => null);
+            if (!fileBuffer)
+              continue;
+            const mimeType = getMimeType(ext);
+            let dataUri;
+            if (ext === "svg") {
+              const svgContent = fileBuffer.toString("utf-8");
+              dataUri = `data:${mimeType},${encodeURIComponent(svgContent)}`;
+            } else {
+              const base64 = fileBuffer.toString("base64");
+              dataUri = `data:${mimeType};base64,${base64}`;
+            }
+            replacements.push({ from: fullMatch, to: `src="${dataUri}"` });
+            hasChanges = true;
+          }
+          for (const { from, to } of replacements) {
+            template = template.replace(from, to);
+          }
+        }
+      }
+      if (!hasChanges)
+        return;
+      s.overwrite(templateStart, templateEnd, template);
+      return {
+        code: s.toString(),
+        map: s.generateMap({ hires: true })
+      };
+    }
+  };
+});
+
+async function getNuxtModuleOptions(module, nuxt = useNuxt()) {
+  const moduleMeta = ({ name: module } ) || {};
+  const { nuxtModule } = await loadNuxtModuleInstance(module, nuxt);
+  let moduleEntry;
+  for (const m of nuxt.options.modules) {
+    if (Array.isArray(m) && m.length >= 2) {
+      const _module = m[0];
+      const _moduleEntryName = typeof _module === "string" ? _module : (await _module.getMeta?.())?.name || "";
+      if (_moduleEntryName === moduleMeta.name)
+        moduleEntry = m;
+    }
+  }
+  let inlineOptions = {};
+  if (moduleEntry)
+    inlineOptions = moduleEntry[1];
+  if (nuxtModule.getOptions)
+    return nuxtModule.getOptions(inlineOptions, nuxt);
+  return inlineOptions;
+}
+function isNuxtGenerate(nuxt = useNuxt()) {
+  return nuxt.options.nitro.static || nuxt.options.nitro.preset === "static";
+}
+
+function parseFontString(font) {
+  const parts = font.split(":");
+  if (parts.length === 3) {
+    return {
+      name: parts[0] || font,
+      style: parts[1] === "ital" ? "italic" : "normal",
+      weight: Number.parseInt(parts[2] || "") || 400
+    };
+  }
+  return {
+    name: parts[0] || font,
+    weight: Number.parseInt(parts[1] || "") || 400,
+    style: "normal"
+  };
+}
+function groupFontsByFamily(fonts) {
+  const families = /* @__PURE__ */ new Map();
+  for (const font of fonts) {
+    const parsed = parseFontString(font);
+    const existing = families.get(parsed.name);
+    if (existing) {
+      existing.weights.add(parsed.weight);
+      existing.styles.add(parsed.style);
+    } else {
+      families.set(parsed.name, {
+        weights: /* @__PURE__ */ new Set([parsed.weight]),
+        styles: /* @__PURE__ */ new Set([parsed.style])
+      });
+    }
+  }
+  return Array.from(families.entries()).map(([name, { weights, styles }]) => ({
+    name,
+    weights: Array.from(weights).sort((a, b) => a - b),
+    styles: Array.from(styles)
+  }));
+}
+async function migrateFontsConfig(rootDir) {
+  const configPaths = [
+    "nuxt.config.ts",
+    "nuxt.config.js",
+    "nuxt.config.mjs"
+  ];
+  let configPath;
+  for (const p of configPaths) {
+    const fullPath = join(rootDir, p);
+    if (existsSync(fullPath)) {
+      configPath = fullPath;
+      break;
+    }
+  }
+  if (!configPath) {
+    return { migrated: false, message: "No nuxt.config found" };
+  }
+  const mod = await loadFile(configPath);
+  const config = mod.exports.default;
+  if (!config?.ogImage?.fonts) {
+    return { migrated: false, message: "No ogImage.fonts config found" };
+  }
+  const oldFonts = config.ogImage.fonts;
+  if (!Array.isArray(oldFonts) || oldFonts.length === 0) {
+    return { migrated: false, message: "ogImage.fonts is empty or invalid" };
+  }
+  const groupedFonts = groupFontsByFamily(oldFonts);
+  if (!config.fonts) {
+    config.fonts = {};
+  }
+  if (!config.fonts.families) {
+    config.fonts.families = [];
+  }
+  const existingFamilies = config.fonts.families;
+  for (const font of groupedFonts) {
+    const existing = existingFamilies.find((f) => f.name === font.name);
+    if (existing) {
+      const existingWeights = new Set(existing.weights || []);
+      for (const w of font.weights) {
+        existingWeights.add(w);
+      }
+      existing.weights = Array.from(existingWeights).sort((a, b) => a - b);
+      if (font.styles.includes("italic")) {
+        const existingStyles = new Set(existing.styles || ["normal"]);
+        existingStyles.add("italic");
+        existing.styles = Array.from(existingStyles);
+      }
+      existing.global = true;
+    } else {
+      const family = {
+        name: font.name,
+        weights: font.weights,
+        global: true
+      };
+      if (font.styles.includes("italic")) {
+        family.styles = font.styles;
+      }
+      existingFamilies.push(family);
+    }
+  }
+  addNuxtModule(mod, "@nuxt/fonts");
+  delete config.ogImage.fonts;
+  if (Object.keys(config.ogImage).length === 0) {
+    delete config.ogImage;
+  }
+  await writeFile$1(mod, configPath);
+  const familyNames = groupedFonts.map((f) => f.name).join(", ");
+  return {
+    migrated: true,
+    message: `Migrated fonts (${familyNames}) from ogImage.fonts to @nuxt/fonts`
+  };
+}
+async function promptFontsMigration(rootDir) {
+  logger.info("");
+  logger.info("Detected deprecated ogImage.fonts configuration.");
+  logger.info("");
+  logger.info("This config has been replaced with @nuxt/fonts integration.");
+  logger.info("");
+  logger.info("Before:");
+  logger.info("  ogImage: {");
+  logger.info("    fonts: ['Inter:400', 'Inter:700']");
+  logger.info("  }");
+  logger.info("");
+  logger.info("After:");
+  logger.info("  modules: ['@nuxt/fonts', 'nuxt-og-image'],");
+  logger.info("  fonts: {");
+  logger.info("    families: [");
+  logger.info("      { name: 'Inter', weights: [400, 700], global: true }");
+  logger.info("    ]");
+  logger.info("  }");
+  logger.info("");
+  const migrate = await logger.prompt("Automatically migrate nuxt.config?", {
+    type: "confirm",
+    initial: true
+  });
+  if (migrate) {
+    const result = await migrateFontsConfig(rootDir).catch((err) => {
+      logger.error(`Migration failed: ${err.message}`);
+      return { migrated: false, message: err.message };
+    });
+    if (result.migrated) {
+      logger.success(result.message);
+      logger.info("");
+      logger.info("Please install @nuxt/fonts:");
+      logger.info("  npm add @nuxt/fonts");
+    } else {
+      logger.warn(`Could not migrate: ${result.message}`);
+      logger.info("Please migrate manually.");
+    }
+  } else {
+    logger.info("Skipping automatic migration. Please migrate manually.");
+  }
+}
+
+const PROVIDER_DEPENDENCIES = [
+  {
+    name: "satori",
+    description: "SVG-based renderer using Satori (default)",
+    bindings: {
+      "node": [
+        { name: "satori", description: "HTML to SVG renderer" },
+        { name: "@resvg/resvg-js", description: "SVG to PNG converter (native)" }
+      ],
+      "wasm": [
+        { name: "satori", description: "HTML to SVG renderer" },
+        { name: "@resvg/resvg-wasm", description: "SVG to PNG converter (WASM)" }
+      ],
+      "wasm-fs": [
+        { name: "satori", description: "HTML to SVG renderer" },
+        { name: "@resvg/resvg-wasm", description: "SVG to PNG converter (WASM)" }
+      ]
+    }
+  },
+  {
+    name: "takumi",
+    description: "Rust-based high-performance renderer",
+    bindings: {
+      "node": [
+        { name: "@takumi-rs/core", description: "Native Takumi renderer" }
+      ],
+      "wasm": [
+        { name: "@takumi-rs/wasm", description: "WASM Takumi renderer" }
+      ],
+      "wasm-fs": [
+        { name: "@takumi-rs/wasm", description: "WASM Takumi renderer" }
+      ]
+    }
+  },
+  {
+    name: "chromium",
+    description: "Browser-based screenshot renderer",
+    bindings: {
+      node: [
+        { name: "playwright-core", description: "Headless browser automation" }
+      ]
+    }
+  }
+];
+async function isPackageInstalled(packageName) {
+  try {
+    await import(packageName);
+    return true;
+  } catch {
+    return false;
+  }
+}
+async function getInstalledProviders() {
+  const installed = [];
+  for (const provider of PROVIDER_DEPENDENCIES) {
+    if (provider.bindings.node) {
+      const allNodeInstalled = await Promise.all(
+        provider.bindings.node.map((dep) => isPackageInstalled(dep.name))
+      );
+      if (allNodeInstalled.every(Boolean)) {
+        installed.push({ provider: provider.name, binding: "node" });
+        continue;
+      }
+    }
+    if (provider.bindings.wasm) {
+      const allWasmInstalled = await Promise.all(
+        provider.bindings.wasm.map((dep) => isPackageInstalled(dep.name))
+      );
+      if (allWasmInstalled.every(Boolean)) {
+        installed.push({ provider: provider.name, binding: "wasm" });
+      }
+    }
+  }
+  return installed;
+}
+async function getMissingDependencies(provider, binding = "node") {
+  const providerDef = PROVIDER_DEPENDENCIES.find((p) => p.name === provider);
+  if (!providerDef)
+    return [];
+  const deps = providerDef.bindings[binding] || providerDef.bindings.node || [];
+  const missing = [];
+  for (const dep of deps) {
+    if (!await isPackageInstalled(dep.name))
+      missing.push(dep.name);
+  }
+  return missing;
+}
+function getProviderDependencies(provider, binding = "node") {
+  const providerDef = PROVIDER_DEPENDENCIES.find((p) => p.name === provider);
+  if (!providerDef)
+    return [];
+  const deps = providerDef.bindings[binding] || providerDef.bindings.node || [];
+  return deps.map((d) => d.name);
+}
+function getRecommendedBindingFromPreset(provider) {
+  const preset = resolveNitroPreset();
+  const compatibility = getPresetNitroPresetCompatibility(preset);
+  return getRecommendedBinding(provider, compatibility);
+}
+function getRecommendedBinding(provider, compatibility) {
+  if (provider === "satori") {
+    const resvgBinding = compatibility.resvg;
+    if (resvgBinding === "wasm-fs")
+      return "wasm-fs";
+    if (resvgBinding === "wasm")
+      return "wasm";
+    return "node";
+  }
+  if (provider === "takumi") {
+    const takumiBinding = compatibility.takumi;
+    if (takumiBinding === "wasm")
+      return "wasm";
+    return "node";
+  }
+  if (provider === "chromium") {
+    return "node";
+  }
+  return "node";
+}
+async function ensureProviderDependencies(provider, binding, nuxt) {
+  const missing = await getMissingDependencies(provider, binding);
+  if (missing.length === 0)
+    return { success: true, installed: [] };
+  const pm = await detectPackageManager(nuxt.options.rootDir);
+  const pmName = pm?.name || "npm";
+  logger.info(`Installing ${provider} dependencies: ${missing.join(", ")}`);
+  const installed = [];
+  for (const pkg of missing) {
+    const success = await addDependency(pkg, {
+      cwd: nuxt.options.rootDir,
+      dev: false
+    }).then(() => {
+      installed.push(pkg);
+      return true;
+    }).catch(() => {
+      logger.error(`Failed to install ${pkg}. Run manually: ${pmName} add ${pkg}`);
+      return false;
+    });
+    if (!success)
+      return { success: false, installed };
+  }
+  return { success: true, installed };
+}
+async function validateProviderSetup(renderer, compatibility) {
+  const issues = [];
+  const binding = getRecommendedBinding(renderer, compatibility);
+  const missing = await getMissingDependencies(renderer, binding);
+  if (missing.length > 0) {
+    issues.push(`Missing ${renderer} dependencies: ${missing.join(", ")}`);
+  }
+  if (renderer === "satori") {
+    const hasResvgNode = await isPackageInstalled("@resvg/resvg-js");
+    const hasResvgWasm = await isPackageInstalled("@resvg/resvg-wasm");
+    if (!hasResvgNode && !hasResvgWasm) {
+      issues.push("Satori requires either @resvg/resvg-js (node) or @resvg/resvg-wasm to render PNGs");
+    }
+  }
+  if (renderer === "chromium") {
+    const hasPlaywright = await isPackageInstalled("playwright-core");
+    if (!hasPlaywright && binding === "node") {
+      issues.push("Chromium renderer requires playwright-core");
+    }
+  }
+  return { valid: issues.length === 0, issues };
+}
+
+const DEPRECATED_CONFIG = {
+  playground: "Removed - use Nuxt DevTools",
+  host: "Use site.url or NUXT_SITE_URL",
+  siteUrl: "Use site.url or NUXT_SITE_URL",
+  runtimeBrowser: "Use compatibility.runtime.chromium",
+  runtimeSatori: "Use compatibility.runtime.satori",
+  cacheTtl: "Use cacheMaxAgeSeconds",
+  cache: "Use cacheMaxAgeSeconds",
+  cacheKey: "Removed",
+  static: "Removed - use zeroRuntime",
+  fonts: "Use @nuxt/fonts module instead"
+};
+const DEPRECATED_COMPOSABLES = [
+  "defineOgImageStatic",
+  "defineOgImageDynamic",
+  "defineOgImageCached",
+  "defineOgImageWithoutCache",
+  "OgImageStatic",
+  "OgImageDynamic",
+  "OgImageCached",
+  "OgImageWithoutCache"
+];
+async function onInstall(nuxt) {
+  if (process.env.NUXT_OG_IMAGE_SKIP_ONBOARDING === "1") {
+    logger.info("Skipping onboarding (NUXT_OG_IMAGE_SKIP_ONBOARDING=1)");
+    return;
+  }
+  if (nuxt.options._prepare)
+    return;
+  if (isCI) {
+    const installedProviders2 = await getInstalledProviders();
+    if (installedProviders2.length === 0) {
+      throw new Error(
+        "[nuxt-og-image] No OG image provider dependencies found. Install a provider before running in CI:\n  npm add @resvg/resvg-js satori yoga-wasm-web  # for satori\n  npm add @playwright/core                      # for chromium\nSee: https://nuxtseo.com/og-image/getting-started"
+      );
+    }
+    return;
+  }
+  logger.info("");
+  logger.info("\u250C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510");
+  logger.info("\u2502  nuxt-og-image                          \u2502");
+  logger.info("\u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518");
+  logger.info("");
+  const state = {};
+  const installedProviders = await getInstalledProviders();
+  if (installedProviders.length > 0) {
+    logger.info("Detected installed providers:");
+    for (const { provider, binding } of installedProviders) {
+      logger.info(`  - ${provider} (${binding})`);
+    }
+    const useExisting = await logger.prompt("Use detected providers?", {
+      type: "confirm",
+      initial: true
+    });
+    if (useExisting && installedProviders[0]) {
+      state.selectedRenderer = installedProviders[0].provider;
+      state.selectedBinding = installedProviders[0].binding;
+    }
+  }
+  if (!state.selectedRenderer) {
+    const rendererChoice = await logger.prompt("Select a renderer:", {
+      type: "select",
+      options: PROVIDER_DEPENDENCIES.map((p) => ({
+        label: p.name,
+        value: p.name,
+        hint: p.description
+      }))
+    });
+    if (typeof rendererChoice === "symbol") {
+      logger.warn("Onboarding cancelled");
+      return;
+    }
+    state.selectedRenderer = rendererChoice;
+  }
+  if (!state.selectedBinding) {
+    const recommendedBinding = getRecommendedBindingFromPreset(state.selectedRenderer);
+    const providerDef = PROVIDER_DEPENDENCIES.find((p) => p.name === state.selectedRenderer);
+    const hasNodeBinding = !!providerDef?.bindings.node;
+    const hasWasmBinding = !!providerDef?.bindings.wasm || !!providerDef?.bindings["wasm-fs"];
+    if (hasNodeBinding && hasWasmBinding) {
+      const options = [];
+      if (recommendedBinding === "node" || recommendedBinding === "wasm-fs") {
+        options.push({ label: "node (Recommended)", value: "node", hint: "Native bindings (faster)" });
+        options.push({ label: "wasm", value: recommendedBinding === "wasm-fs" ? "wasm-fs" : "wasm", hint: "WASM bindings (portable)" });
+      } else {
+        options.push({ label: "wasm (Recommended)", value: "wasm", hint: "WASM bindings (required for your platform)" });
+        options.push({ label: "node", value: "node", hint: "Native bindings (may not work on edge)" });
+      }
+      const bindingChoice = await logger.prompt("Select binding type:", {
+        type: "select",
+        options
+      });
+      if (typeof bindingChoice === "symbol") {
+        logger.warn("Onboarding cancelled");
+        return;
+      }
+      state.selectedBinding = bindingChoice;
+    } else {
+      state.selectedBinding = hasNodeBinding ? "node" : "wasm";
+    }
+  }
+  const missing = await getMissingDependencies(state.selectedRenderer, state.selectedBinding);
+  if (missing.length > 0) {
+    logger.info(`Required dependencies for ${state.selectedRenderer} (${state.selectedBinding}):`);
+    for (const pkg of missing) {
+      logger.info(`  - ${pkg}`);
+    }
+    const installDeps = await logger.prompt("Install missing dependencies?", {
+      type: "confirm",
+      initial: true
+    });
+    if (installDeps) {
+      const result = await ensureProviderDependencies(
+        state.selectedRenderer,
+        state.selectedBinding,
+        nuxt
+      );
+      if (result.success) {
+        logger.success(`Installed: ${result.installed.join(", ")}`);
+      } else {
+        logger.error("Failed to install some dependencies. Install manually:");
+        const allDeps = getProviderDependencies(state.selectedRenderer, state.selectedBinding);
+        logger.info(`  npm add ${allDeps.join(" ")}`);
+      }
+    } else {
+      const allDeps = getProviderDependencies(state.selectedRenderer, state.selectedBinding);
+      logger.warn("Dependencies required. Install manually:");
+      logger.info(`  npm add ${allDeps.join(" ")}`);
+    }
+  } else {
+    logger.success(`All ${state.selectedRenderer} dependencies installed`);
+  }
+  const createComponent = await logger.prompt("Create starter OgImage component?", {
+    type: "confirm",
+    initial: true
+  });
+  if (createComponent) {
+    await createStarterComponent(nuxt);
+  }
+  const hasSharp = await isPackageInstalled("sharp");
+  if (!hasSharp && state.selectedRenderer === "satori") {
+    const wantJpeg = await logger.prompt("Install sharp for JPEG output support?", {
+      type: "confirm",
+      initial: false
+    });
+    if (wantJpeg) {
+      await ensureProviderDependencies("satori", "node", nuxt).catch(() => logger.warn("Failed to install sharp, JPEG output unavailable"));
+    }
+  }
+  logger.info("");
+  logger.info("\u250C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510");
+  logger.info("\u2502  Setup Complete                         \u2502");
+  logger.info("\u251C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2524");
+  logger.info(`${`\u2502  Renderer: ${state.selectedRenderer} (${state.selectedBinding})`.padEnd(42)}\u2502`);
+  logger.info("\u2502                                         \u2502");
+  logger.info("\u2502  Next steps:                            \u2502");
+  logger.info("\u2502  1. Add site.url or NUXT_SITE_URL       \u2502");
+  logger.info("\u2502  2. Open DevTools \u2192 OG Image            \u2502");
+  logger.info("\u2502                                         \u2502");
+  logger.info("\u2502  https://nuxtseo.com/og-image           \u2502");
+  logger.info("\u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518");
+}
+async function onUpgrade(nuxt, _options, previousVersion) {
+  logger.info("");
+  logger.info("\u250C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510");
+  logger.info("\u2502  nuxt-og-image upgraded                 \u2502");
+  logger.info(`${`\u2502  ${previousVersion} \u2192 current`.padEnd(42)}\u2502`);
+  logger.info("\u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518");
+  const issues = [];
+  const ogImageConfig = nuxt.options.ogImage;
+  if (ogImageConfig) {
+    for (const [key, replacement] of Object.entries(DEPRECATED_CONFIG)) {
+      if (key in ogImageConfig) {
+        issues.push(`Config \`${key}\` is deprecated: ${replacement}`);
+      }
+    }
+    if ("fonts" in ogImageConfig && !nuxt.options._prepare && !isCI) {
+      await promptFontsMigration(nuxt.options.rootDir);
+    }
+  }
+  if (issues.length > 0) {
+    logger.warn("Deprecated configuration detected:");
+    for (const issue of issues) {
+      logger.warn(`  - ${issue}`);
+    }
+  }
+  logger.info("Check your code for deprecated composables:");
+  for (const composable of DEPRECATED_COMPOSABLES) {
+    logger.info(`  - ${composable}`);
+  }
+  const renderer = ogImageConfig?.defaults?.renderer || "satori";
+  const preset = resolveNitroPreset();
+  const compatibility = getPresetNitroPresetCompatibility(preset);
+  const validation = await validateProviderSetup(renderer, compatibility);
+  if (!validation.valid) {
+    logger.warn("Provider setup issues:");
+    for (const issue of validation.issues) {
+      logger.warn(`  - ${issue}`);
+    }
+  }
+  logger.info("Migration guide: https://nuxtseo.com/og-image/migration-guide");
+}
+async function createStarterComponent(nuxt) {
+  const componentDir = join(nuxt.options.srcDir, "components", "OgImage");
+  const componentPath = join(componentDir, "Default.vue");
+  if (existsSync(componentPath)) {
+    logger.info("OgImage/Default.vue already exists, skipping");
+    return;
+  }
+  const template = `<script setup lang="ts">
+defineProps<{
+  title: string
+  description?: string
+}>()
+<\/script>
+
+<template>
+  <div class="w-full h-full flex flex-col justify-center items-center bg-gradient-to-br from-green-400 to-blue-500 text-white p-16">
+    <h1 class="text-6xl font-bold mb-4">{{ title }}</h1>
+    <p v-if="description" class="text-2xl opacity-80">{{ description }}</p>
+  </div>
+</template>
+`;
+  if (!existsSync(componentDir))
+    await mkdir(componentDir, { recursive: true }).catch(() => {
+    });
+  await writeFile(componentPath, template).then(() => logger.success("Created components/OgImage/Default.vue")).catch(() => logger.error("Failed to create starter component"));
+}
+
+function registerTypeTemplates(ctx) {
+  const { nuxt, config, componentCtx } = ctx;
+  addTypeTemplate({
+    filename: "module/nuxt-og-image-components.d.ts",
+    getContents: () => {
+      const componentImports = componentCtx.components.map((component) => {
+        const relativeComponentPath = relative$1(
+          resolve(nuxt.options.rootDir, nuxt.options.buildDir, "module"),
+          component.path
+        );
+        const name = config.componentDirs.sort((a, b) => b.length - a.length).reduce((n, dir) => n.replace(new RegExp(`^${dir}`), ""), component.pascalName);
+        return `    '${name}': typeof import('${relativeComponentPath}')['default']`;
+      }).join("\n");
+      return `declare module '#og-image/components' {
+  export interface OgImageComponents {
+${componentImports}
+  }
+}
+`;
+    }
+  }, { nuxt: true });
+  addTemplate({
+    filename: "types/og-image-virtual.d.ts",
+    getContents: (data) => {
+      const typesPath = relative$1(resolve(data.nuxt.options.rootDir, data.nuxt.options.buildDir, "types"), resolve("runtime/types"));
+      return `declare module '#og-image-virtual/public-assets.mjs' {
+  import type { H3Event } from 'h3'
+  import type { FontConfig } from '${typesPath}'
+  export function resolve(event: H3Event, font: FontConfig): Promise<BufferSource>
+}
+
+declare module '#og-image/fonts' {
+  import type { FontConfig } from '${typesPath}'
+  const fonts: FontConfig[]
+  export default fonts
+}
+
+declare module '#og-image-virtual/unocss-config.mjs' {
+  export const theme: Record<string, any>
+}
+
+declare module '#og-image-virtual/iconify-json-icons.mjs' {
+  export const icons: Record<string, { body: string, width?: number, height?: number }>
+  export const width: number
+  export const height: number
+}
+
+declare module '#og-image-virtual/component-names.mjs' {
+  import type { OgImageComponent } from '${typesPath}'
+  export const componentNames: OgImageComponent[]
+}
+
+declare module '#og-image-virtual/build-dir.mjs' {
+  export const buildDir: string
+}
+
+declare module '#og-image/compatibility' {
+  import type { RuntimeCompatibilitySchema } from '${typesPath}'
+  const compatibility: Partial<Omit<RuntimeCompatibilitySchema, 'wasm'>>
+  export default compatibility
+}
+declare module '#og-image-virtual/tw4-theme.mjs' {
+  export const tw4FontVars: Record<string, string>
+  export const tw4Breakpoints: Record<string, number>
+  export const tw4Colors: Record<string, string | Record<string, string>>
+}
+`;
+    }
+  });
+  addTemplate({
+    filename: "types/og-image-bindings.d.ts",
+    getContents: (data) => {
+      const typesPath = relative$1(resolve(data.nuxt.options.rootDir, data.nuxt.options.buildDir, "types"), resolve("runtime/types"));
+      return `declare module '#og-image/bindings/chromium' {
+  export function createBrowser(): Promise<any>
+}
+
+declare module '#og-image/bindings/satori' {
+  import satori from 'satori'
+  const _default: { initWasmPromise: Promise<void>, satori: typeof satori }
+  export default _default
+}
+
+declare module '#og-image/bindings/resvg' {
+  import { Resvg } from '@resvg/resvg-js'
+  const _default: { initWasmPromise: Promise<void>, Resvg: typeof Resvg }
+  export default _default
+}
+
+declare module '#og-image/bindings/sharp' {
+  import sharp from 'sharp'
+  const _default: typeof sharp
+  export default _default
+}
+
+declare module '#og-image/bindings/css-inline' {
+  import cssInline from '@css-inline/css-inline'
+  const _default: { initWasmPromise: Promise<void>, cssInline: typeof cssInline }
+  export default _default
+}
+
+declare module '#og-image/bindings/takumi' {
+  const _default: any
+  export default _default
+}
+
+declare module '#og-image/renderers/satori' {
+  import type { Renderer } from '${typesPath}'
+  const _default: Renderer
+  export default _default
+}
+
+declare module '#og-image/renderers/chromium' {
+  import type { Renderer } from '${typesPath}'
+  const _default: Renderer
+  export default _default
+}
+
+declare module '#og-image/renderers/takumi' {
+  import type { Renderer } from '${typesPath}'
+  const _default: Renderer
+  export default _default
+}
+
+declare module '#og-image/emoji-transform' {
+  import type { OgImageRenderEventContext } from '${typesPath}'
+  export function getEmojiSvg(ctx: OgImageRenderEventContext, emoji: string): Promise<string | null>
+}
+
+declare module '#og-image-cache' {
+  export { htmlPayloadCache, prerenderOptionsCache, emojiCache, fontCache } from '${typesPath.replace("/types", "")}/server/og-image/cache/lru'
+}
+`;
+    }
+  });
+  addTypeTemplate({
+    filename: "types/og-image-augments.d.ts",
+    getContents: (data) => {
+      const typesPath = relative$1(resolve(data.nuxt.options.rootDir, data.nuxt.options.buildDir, "types"), resolve("runtime/types"));
+      return `/// <reference path="./og-image-virtual.d.ts" />
+/// <reference path="./og-image-bindings.d.ts" />
+import type { OgImageOptions, OgImageRenderEventContext, VNode } from '${typesPath}'
+
+declare module 'nitropack' {
+  interface NitroRouteRules {
+    ogImage?: false | OgImageOptions & Record<string, any>
+  }
+  interface NitroRouteConfig {
+    ogImage?: false | OgImageOptions & Record<string, any>
+  }
+  interface NitroRuntimeHooks {
+    'nuxt-og-image:context': (ctx: OgImageRenderEventContext) => void | Promise<void>
+    'nuxt-og-image:satori:vnodes': (vnodes: VNode, ctx: OgImageRenderEventContext) => void | Promise<void>
+  }
+}
+
+declare module 'nitropack/types' {
+  interface NitroRouteRules {
+    ogImage?: false | OgImageOptions & Record<string, any>
+  }
+  interface NitroRouteConfig {
+    ogImage?: false | OgImageOptions & Record<string, any>
+  }
+  interface NitroRuntimeHooks {
+    'nuxt-og-image:context': (ctx: OgImageRenderEventContext) => void | Promise<void>
+    'nuxt-og-image:satori:vnodes': (vnodes: VNode, ctx: OgImageRenderEventContext) => void | Promise<void>
+  }
+}
+
+export {}
+`;
+    }
+  });
+}
+
+const IS_MODULE_DEVELOPMENT = import.meta.filename.endsWith(".ts");
+function isProviderEnabledForEnv(provider, nuxt, config) {
+  return nuxt.options.dev && config.compatibility?.dev?.[provider] !== false || !nuxt.options.dev && (config.compatibility?.runtime?.[provider] !== false || config.compatibility?.prerender?.[provider] !== false);
+}
+const defaultComponentDirs = ["OgImage", "OgImageCommunity", "og-image", "OgImageTemplate"];
+const module$1 = defineNuxtModule({
+  meta: {
+    name: "nuxt-og-image",
+    compatibility: {
+      nuxt: ">=3.16.0"
+    },
+    configKey: "ogImage"
+  },
+  moduleDependencies: {
+    "@nuxt/content": {
+      version: ">=3",
+      optional: true
+    },
+    "@nuxt/fonts": {
+      version: ">=0.13.0"
+    }
+  },
+  defaults() {
+    return {
+      enabled: true,
+      defaults: {
+        emojis: "noto",
+        component: "NuxtSeo",
+        extension: "png",
+        width: 1200,
+        height: 600,
+        // default is to cache the image for 3 day (72 hours)
+        cacheMaxAgeSeconds: 60 * 60 * 24 * 3
+      },
+      componentDirs: defaultComponentDirs,
+      runtimeCacheStorage: true,
+      debug: isDevelopment
+    };
+  },
+  async onInstall(nuxt) {
+    await onInstall(nuxt);
+  },
+  async onUpgrade(nuxt, options, previousVersion) {
+    await onUpgrade(nuxt, options, previousVersion);
+  },
+  async setup(config, nuxt) {
+    const _resolver = createResolver(import.meta.url);
+    const fixSharedPath = (p) => p.includes("/shared/runtime/") ? p.replace("/shared/runtime/", "/runtime/") : p;
+    const resolve = (path) => fixSharedPath(_resolver.resolve(path));
+    const resolver = {
+      ..._resolver,
+      resolve,
+      resolvePath: async (path, opts) => fixSharedPath(await _resolver.resolvePath(path, opts))
+    };
+    const { version } = await readPackageJSON(resolve("../package.json"));
+    const userAppPkgJson = await readPackageJSON(nuxt.options.rootDir).catch(() => ({ dependencies: {}, devDependencies: {} }));
+    logger.level = config.debug || nuxt.options.debug ? 4 : 3;
+    if (config.enabled === false) {
+      logger.info("The module is disabled, skipping setup.");
+      ["defineOgImage", "defineOgImageComponent", "defineOgImageScreenshot"].forEach((name) => {
+        addImports({ name, from: resolve(`./runtime/app/composables/mock`) });
+      });
+      return;
+    }
+    if (config.enabled && !nuxt.options.ssr) {
+      logger.warn("Nuxt OG Image is enabled but SSR is disabled.\n\nYou should enable SSR (`ssr: true`) or disable the module (`ogImage: { enabled: false }`).");
+      return;
+    }
+    const routeRules = nuxt.options.routeRules || {};
+    const wildcardPatterns = ["/**", "/*", "*"];
+    for (const pattern of wildcardPatterns) {
+      const rule = routeRules[pattern];
+      if (rule && (rule.swr || rule.isr || rule.cache)) {
+        logger.warn(`Wildcard route rule \`${pattern}\` with caching (swr/isr/cache) may break og-image routes.`);
+        logger.info("See: https://nuxtseo.com/og-image/guides/route-rules#wildcard-route-rules-warning");
+        break;
+      }
+    }
+    nuxt.options.alias["#og-image"] = resolve("./runtime");
+    nuxt.options.alias["#og-image-cache"] = resolve("./runtime/server/og-image/cache/lru");
+    const preset = resolveNitroPreset(nuxt.options.nitro);
+    const targetCompatibility = getPresetNitroPresetCompatibility(preset);
+    const emojiPkg = `@iconify-json/${config.defaults.emojis}`;
+    let hasLocalIconify = await hasResolvableDependency(emojiPkg);
+    let finalEmojiStrategy = config.emojiStrategy || "auto";
+    if (!hasLocalIconify && !nuxt.options._prepare && nuxt.options.dev) {
+      const shouldInstall = await logger.prompt(`Install ${emojiPkg} for local emoji support?`, {
+        type: "confirm",
+        initial: true
+      });
+      if (shouldInstall) {
+        await ensureDependencies([emojiPkg], nuxt).then(() => {
+          hasLocalIconify = true;
+          logger.success(`Installed ${emojiPkg}`);
+        }).catch(() => logger.warn(`Failed to install ${emojiPkg}, using API fallback`));
+      }
+    }
+    if (finalEmojiStrategy === "auto") {
+      finalEmojiStrategy = hasLocalIconify ? "local" : "fetch";
+    }
+    if (finalEmojiStrategy === "local" && !hasLocalIconify) {
+      logger.warn(`emojiStrategy is set to 'local' but ${emojiPkg} is not installed. Falling back to 'fetch'.`);
+      finalEmojiStrategy = "fetch";
+    }
+    const runtimeEmojiStrategy = targetCompatibility.emoji === "fetch" ? "fetch" : finalEmojiStrategy;
+    if (runtimeEmojiStrategy === "local") {
+      if (nuxt.options.dev)
+        logger.debug(`Using local dependency \`${emojiPkg}\` for emoji rendering.`);
+      else if (nuxt.options.build && !nuxt.options._prepare)
+        logger.info(`Using local dependency \`${emojiPkg}\` for emoji rendering.`);
+      nuxt.options.alias["#og-image/emoji-transform"] = resolve("./runtime/server/og-image/satori/transforms/emojis/local");
+      nuxt.options.nitro.virtual = nuxt.options.nitro.virtual || {};
+      nuxt.options.nitro.virtual["#og-image-virtual/iconify-json-icons.mjs"] = () => {
+        return `export { icons, width, height } from '${emojiPkg}/icons.json'`;
+      };
+    } else {
+      if (targetCompatibility.emoji === "fetch" && finalEmojiStrategy === "local") {
+        logger.info(`Using iconify API for runtime emojis on ${preset} (local icons used at build time).`);
+      } else {
+        logger.info(`Using iconify API for emojis${hasLocalIconify ? " (emojiStrategy: fetch)" : `, install ${emojiPkg} for local support`}.`);
+      }
+      nuxt.options.alias["#og-image/emoji-transform"] = resolve("./runtime/server/og-image/satori/transforms/emojis/fetch");
+    }
+    const tw4State = {
+      styleMap: {},
+      cssPath: void 0,
+      fontVars: {},
+      breakpoints: {},
+      colors: {},
+      nuxtUiColors: void 0,
+      initialized: false
+    };
+    let tw4InitPromise;
+    const nuxtUiDefaults = {
+      primary: "green",
+      secondary: "blue",
+      success: "green",
+      info: "blue",
+      warning: "yellow",
+      error: "red",
+      neutral: "slate"
+    };
+    async function loadNuxtUiColors() {
+      if (tw4State.nuxtUiColors)
+        return tw4State.nuxtUiColors;
+      if (!hasNuxtModule("@nuxt/ui"))
+        return void 0;
+      const appConfigPath = join(nuxt.options.buildDir, "app.config.mjs");
+      if (!existsSync(appConfigPath))
+        return { ...nuxtUiDefaults };
+      const rawContent = await readFile(appConfigPath, "utf-8");
+      const strippedContent = rawContent.replace(/\/\*\* client \*\*\/[\s\S]*?\/\*\* client-end \*\*\//g, "");
+      const jiti = createJiti(nuxt.options.buildDir, {
+        interopDefault: true,
+        moduleCache: false
+      });
+      const mergedAppConfig = await jiti.evalModule(strippedContent, { filename: appConfigPath });
+      tw4State.nuxtUiColors = { ...nuxtUiDefaults, ...mergedAppConfig?.ui?.colors };
+      logger.debug(`Nuxt UI colors: ${JSON.stringify(tw4State.nuxtUiColors)}`);
+      return tw4State.nuxtUiColors;
+    }
+    async function detectTailwindCssPath() {
+      for (const cssEntry of nuxt.options.css) {
+        const cssPath = typeof cssEntry === "string" ? cssEntry : cssEntry?.src;
+        if (!cssPath || !cssPath.endsWith(".css"))
+          continue;
+        const resolved = await resolver.resolvePath(cssPath).catch(() => null);
+        if (!resolved || !existsSync(resolved))
+          continue;
+        const content = await readFile(resolved, "utf-8");
+        if (content.includes('@import "tailwindcss"') || content.includes("@import 'tailwindcss'"))
+          return resolved;
+      }
+    }
+    async function initTw4() {
+      if (tw4State.initialized)
+        return;
+      if (tw4InitPromise)
+        return tw4InitPromise;
+      tw4InitPromise = (async () => {
+        const resolvedCssPath = config.tailwindCss ? await resolver.resolvePath(config.tailwindCss) : nuxt.options.alias["#tailwindcss"] ?? await detectTailwindCssPath();
+        tw4State.cssPath = resolvedCssPath;
+        if (!resolvedCssPath || !existsSync(resolvedCssPath)) {
+          tw4State.initialized = true;
+          return;
+        }
+        const tw4CssContent = await readFile(resolvedCssPath, "utf-8");
+        if (!tw4CssContent.includes("@theme") && !tw4CssContent.includes('@import "tailwindcss"')) {
+          tw4State.initialized = true;
+          return;
+        }
+        const nuxtUiColors = await loadNuxtUiColors();
+        const metadata = await extractTw4Metadata({
+          cssPath: resolvedCssPath,
+          nuxtUiColors
+        }).catch((e) => {
+          logger.warn(`TW4 metadata extraction failed: ${e.message}`);
+          return { fontVars: {}, breakpoints: {}, colors: {} };
+        });
+        tw4State.fontVars = metadata.fontVars;
+        tw4State.breakpoints = metadata.breakpoints;
+        tw4State.colors = metadata.colors;
+        try {
+          const { scanComponentClasses, filterProcessableClasses } = await import('../chunks/tw4-classes.mjs');
+          const { generateStyleMap } = await import('../chunks/tw4-generator.mjs');
+          const allClasses = await scanComponentClasses(config.componentDirs, nuxt.options.srcDir, logger);
+          const processableClasses = filterProcessableClasses(allClasses);
+          if (processableClasses.length > 0) {
+            logger.debug(`TW4: Found ${processableClasses.length} unique classes in OG components`);
+            const styleMap = await generateStyleMap({
+              cssPath: resolvedCssPath,
+              classes: processableClasses,
+              nuxtUiColors
+            });
+            for (const [cls, styles] of styleMap.classes) {
+              tw4State.styleMap[cls] = styles;
+            }
+            logger.debug(`TW4: Generated style map with ${Object.keys(tw4State.styleMap).length} resolved classes`);
+          }
+        } catch (e) {
+          logger.warn(`TW4 style map generation failed: ${e.message}`);
+        }
+        logger.debug(`TW4 enabled from ${relative$1(nuxt.options.rootDir, resolvedCssPath)}`);
+        tw4State.initialized = true;
+      })();
+      return tw4InitPromise;
+    }
+    const resolvedOgComponentPaths = [];
+    nuxt.hook("modules:done", () => {
+      addVitePlugin(AssetTransformPlugin.vite({
+        emojiSet: finalEmojiStrategy === "local" ? config.defaults.emojis || "noto" : void 0,
+        get ogComponentPaths() {
+          return resolvedOgComponentPaths;
+        },
+        // Resolved OG component directory paths
+        rootDir: nuxt.options.rootDir,
+        srcDir: nuxt.options.srcDir,
+        publicDir: join(nuxt.options.srcDir, nuxt.options.dir.public || "public"),
+        get tw4StyleMap() {
+          return tw4State.styleMap;
+        },
+        // Getter to access populated map
+        initTw4,
+        // Lazy initializer - called on first transform
+        get tw4CssPath() {
+          return tw4State.cssPath;
+        },
+        // Getter for gradient resolution
+        loadNuxtUiColors
+        // Lazy loader for Nuxt UI colors from .nuxt/app.config.mjs
+      }));
+    });
+    if (config.zeroRuntime) {
+      config.compatibility = defu(config.compatibility, {
+        runtime: {
+          chromium: false,
+          // should already be false
+          satori: false
+        }
+      });
+      if (!nuxt.options.dev) {
+        addBuildPlugin(TreeShakeComposablesPlugin, { server: true, client: true, build: true });
+        nuxt.options.alias["#og-image-cache"] = resolve("./runtime/server/og-image/cache/mock");
+      }
+    }
+    const basePath = config.zeroRuntime ? "./runtime/server/routes/__zero-runtime" : "./runtime/server/routes";
+    let publicDirAbs = nuxt.options.dir.public;
+    if (!isAbsolute(publicDirAbs)) {
+      publicDirAbs = (publicDirAbs in nuxt.options.alias ? nuxt.options.alias[publicDirAbs] : join(nuxt.options.rootDir, publicDirAbs)) || "";
+    }
+    if (isProviderEnabledForEnv("satori", nuxt, config)) {
+      let attemptSharpUsage = false;
+      if (isProviderEnabledForEnv("sharp", nuxt, config)) {
+        const userConfiguredExtension = config.defaults.extension;
+        const hasConfiguredJpegs = userConfiguredExtension && ["jpeg", "jpg"].includes(userConfiguredExtension);
+        const allDeps = {
+          ...userAppPkgJson.dependencies || {},
+          ...userAppPkgJson.devDependencies || {}
+        };
+        const hasExplicitSharpDependency = !!config.sharpOptions || "sharp" in allDeps || hasConfiguredJpegs;
+        if (hasExplicitSharpDependency) {
+          if (!targetCompatibility.sharp) {
+            logger.warn(`Rendering JPEGs requires sharp which does not work with ${preset}. Images will be rendered as PNG at runtime.`);
+            config.compatibility = defu(config.compatibility, {
+              runtime: { sharp: false }
+            });
+          } else {
+            await import('sharp').catch(() => {
+            }).then(() => {
+              attemptSharpUsage = true;
+            });
+          }
+        } else if (hasConfiguredJpegs) {
+          logger.warn("You have enabled `JPEG` images. These require the `sharp` dependency which is missing, installing it for you.");
+          await ensureDependencies(["sharp"]);
+          logger.warn("Support for `sharp` is limited so check the compatibility guide.");
+          attemptSharpUsage = true;
+        }
+      }
+      if (!attemptSharpUsage) {
+        config.compatibility = defu(config.compatibility, {
+          runtime: { sharp: false },
+          dev: { sharp: false },
+          prerender: { sharp: false }
+        });
+      }
+      if (isProviderEnabledForEnv("resvg", nuxt, config)) {
+        await import('@resvg/resvg-js').catch(() => {
+          logger.warn("ReSVG is missing dependencies for environment. Falling back to WASM version, this may slow down PNG rendering.");
+          config.compatibility = defu(config.compatibility, {
+            dev: { resvg: "wasm-fs" },
+            prerender: { resvg: "wasm-fs" }
+          });
+          if (targetCompatibility.resvg === "node") {
+            config.compatibility = defu(config.compatibility, {
+              runtime: { resvg: "wasm" }
+            });
+          }
+        });
+      }
+    }
+    if (isProviderEnabledForEnv("chromium", nuxt, config)) {
+      const hasChromeLocally = checkLocalChrome();
+      const hasPlaywrightDependency = await hasResolvableDependency("playwright");
+      const chromeCompatibilityFlags = {
+        prerender: config.compatibility?.prerender?.chromium,
+        dev: config.compatibility?.dev?.chromium,
+        runtime: config.compatibility?.runtime?.chromium
+      };
+      const chromiumBinding = {
+        dev: null,
+        prerender: null,
+        runtime: null
+      };
+      if (nuxt.options.dev) {
+        if (isUndefinedOrTruthy(chromeCompatibilityFlags.dev))
+          chromiumBinding.dev = hasChromeLocally ? "chrome-launcher" : hasPlaywrightDependency ? "playwright" : "on-demand";
+      } else {
+        if (isUndefinedOrTruthy(chromeCompatibilityFlags.prerender))
+          chromiumBinding.prerender = hasChromeLocally ? "chrome-launcher" : hasPlaywrightDependency ? "playwright" : "on-demand";
+        if (isUndefinedOrTruthy(chromeCompatibilityFlags.runtime))
+          chromiumBinding.runtime = hasPlaywrightDependency ? "playwright" : null;
+      }
+      config.compatibility = defu(config.compatibility, {
+        runtime: { chromium: chromiumBinding.runtime },
+        dev: { chromium: chromiumBinding.dev },
+        prerender: { chromium: chromiumBinding.prerender }
+      });
+    }
+    await installNuxtSiteConfig();
+    nuxt.options.experimental.componentIslands ||= true;
+    if (config.debug || nuxt.options.dev) {
+      addServerHandler({
+        lazy: true,
+        route: "/_og/debug.json",
+        handler: resolve("./runtime/server/routes/debug.json")
+      });
+    }
+    addServerHandler({
+      lazy: true,
+      route: "/_og/d/**",
+      handler: resolve(`${basePath}/image`)
+    });
+    addServerHandler({
+      lazy: true,
+      route: "/_og/s/**",
+      handler: resolve(`${basePath}/image`)
+    });
+    if (!nuxt.options.dev) {
+      nuxt.options.optimization.treeShake.composables.client["nuxt-og-image"] = [];
+    }
+    [
+      "defineOgImage",
+      "defineOgImageComponent",
+      { name: "defineOgImageScreenshot", enabled: isProviderEnabledForEnv("chromium", nuxt, config) }
+    ].forEach((name) => {
+      if (typeof name === "object") {
+        if (!name.enabled) {
+          addImports({ name: name.name, from: resolve(`./runtime/app/composables/mock`) });
+          return;
+        }
+        name = name.name;
+      }
+      addImports({
+        name,
+        from: resolve(`./runtime/app/composables/${name}`)
+      });
+      if (!nuxt.options.dev) {
+        nuxt.options.optimization.treeShake.composables.client = nuxt.options.optimization.treeShake.composables.client || {};
+        nuxt.options.optimization.treeShake.composables.client["nuxt-og-image"] = nuxt.options.optimization.treeShake.composables.client["nuxt-og-image"] || [];
+        nuxt.options.optimization.treeShake.composables.client["nuxt-og-image"].push(name);
+      }
+    });
+    if (nuxt.options.dev) {
+      addComponentsDir({
+        path: resolve("./runtime/app/components/Templates/Community"),
+        island: true,
+        watch: IS_MODULE_DEVELOPMENT
+      });
+    }
+    addComponent({
+      name: "OgImageScreenshot",
+      filePath: resolve(`./runtime/app/components/OgImage/OgImageScreenshot`),
+      ...config.componentOptions
+    });
+    const basePluginPath = `./runtime/app/plugins${config.zeroRuntime ? "/__zero-runtime" : ""}`;
+    addPlugin({ mode: "server", src: resolve(`${basePluginPath}/route-rule-og-image.server`) });
+    addPlugin({ mode: "server", src: resolve(`${basePluginPath}/og-image-canonical-urls.server`) });
+    const componentRoots = await Promise.all(
+      nuxt.options.components?.dirs?.map(async (dir) => {
+        const dirPath = typeof dir === "string" ? dir : dir.path;
+        return resolver.resolvePath(dirPath).catch(() => null);
+      }) || []
+    ).then((paths) => paths.filter(Boolean));
+    for (const componentDir of config.componentDirs) {
+      let found = false;
+      for (const root of componentRoots) {
+        const path = join(root, componentDir);
+        if (existsSync(path)) {
+          found = true;
+          resolvedOgComponentPaths.push(path);
+          addComponentsDir({
+            path,
+            island: true,
+            watch: IS_MODULE_DEVELOPMENT,
+            prefix: componentDir === "OgImageCommunity" ? "OgImage" : void 0
+          });
+        }
+      }
+      if (!found && !defaultComponentDirs.includes(componentDir)) {
+        logger.warn(`The configured component directory \`${componentDir}\` does not exist in any component root. Skipping.`);
+      }
+    }
+    const builtinTemplatesDir = resolve("./runtime/app/components/Templates");
+    if (fs.existsSync(builtinTemplatesDir)) {
+      resolvedOgComponentPaths.push(builtinTemplatesDir);
+    }
+    const ogImageComponentCtx = { components: [], detectedRenderers: /* @__PURE__ */ new Set() };
+    for (const componentDir of config.componentDirs) {
+      for (const root of componentRoots) {
+        const path = join(root, componentDir);
+        if (fs.existsSync(path)) {
+          const files = fs.readdirSync(path).filter((f) => f.endsWith(".vue"));
+          for (const file of files) {
+            const renderer = getRendererFromFilename(file);
+            if (renderer)
+              ogImageComponentCtx.detectedRenderers.add(renderer);
+          }
+        }
+      }
+    }
+    const communityDir = resolve("./runtime/app/components/Templates/Community");
+    if (fs.existsSync(communityDir)) {
+      const files = fs.readdirSync(communityDir).filter((f) => f.endsWith(".vue"));
+      for (const file of files) {
+        const renderer = getRendererFromFilename(file);
+        if (renderer)
+          ogImageComponentCtx.detectedRenderers.add(renderer);
+      }
+    }
+    nuxt.hook("components:extend", (components) => {
+      ogImageComponentCtx.components = [];
+      const invalidComponents = [];
+      const baseNameToRenderer = /* @__PURE__ */ new Map();
+      components.forEach((component) => {
+        let valid = false;
+        config.componentDirs.forEach((dir) => {
+          if (component.pascalName.startsWith(dir) || component.kebabName.startsWith(dir) || component.shortPath.includes(`components/${dir}/`)) {
+            valid = true;
+          }
+        });
+        if (component.filePath.includes(resolve("./runtime/app/components/Templates")))
+          valid = true;
+        if (valid && fs.existsSync(component.filePath)) {
+          const renderer = getRendererFromFilename(component.filePath);
+          if (!renderer) {
+            invalidComponents.push(component.filePath);
+            return;
+          }
+          const baseName = stripRendererSuffix(component.pascalName);
+          const existing = baseNameToRenderer.get(baseName);
+          if (existing && existing.renderer !== renderer) {
+            logger.warn(`Duplicate OG Image component "${baseName}" with different renderers:
+  ${existing.path} (${existing.renderer})
+  ${component.filePath} (${renderer})`);
+          }
+          baseNameToRenderer.set(baseName, { renderer, path: component.filePath });
+          ogImageComponentCtx.detectedRenderers.add(renderer);
+          component.island = true;
+          component.mode = "server";
+          let category = "app";
+          if (component.filePath.includes(resolve("./runtime/app/components/Templates/Community")))
+            category = "community";
+          const componentFile = fs.readFileSync(component.filePath, "utf-8");
+          const credits = componentFile.split("\n").find((line) => line.startsWith(" * @credits"))?.replace("* @credits", "").trim();
+          ogImageComponentCtx.components.push({
+            hash: hash(componentFile).replaceAll("_", "-"),
+            pascalName: component.pascalName,
+            kebabName: component.kebabName,
+            path: component.filePath,
+            category,
+            credits,
+            renderer
+          });
+        }
+      });
+      if (!nuxt.options.dev) {
+        const communityDir2 = resolve("./runtime/app/components/Templates/Community");
+        if (fs.existsSync(communityDir2)) {
+          fs.readdirSync(communityDir2).filter((f) => f.endsWith(".vue")).forEach((file) => {
+            const renderer = getRendererFromFilename(file);
+            if (!renderer)
+              return;
+            const name = file.replace(".vue", "");
+            const filePath = resolve(communityDir2);
+            if (ogImageComponentCtx.components.some((c) => c.pascalName === name))
+              return;
+            ogImageComponentCtx.components.push({
+              hash: "",
+              pascalName: name,
+              kebabName: name.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase(),
+              path: filePath,
+              category: "community",
+              renderer
+            });
+            ogImageComponentCtx.detectedRenderers.add(renderer);
+          });
+        }
+      }
+      if (invalidComponents.length > 0) {
+        const message = `OG Image components missing renderer suffix (.satori.vue, .chromium.vue, .takumi.vue):
+${invalidComponents.map((c) => `  ${c}`).join("\n")}
+
+Run: npx nuxt-og-image migrate v6`;
+        if (nuxt.options.dev) {
+          if (config.warnMissingSuffix !== false)
+            logger.warn(message);
+        } else {
+          throw new Error(message);
+        }
+      }
+      nuxt.hooks.hook("nuxt-og-image:components", ogImageComponentCtx);
+    });
+    addTemplate({
+      filename: "nuxt-og-image/components.mjs",
+      getContents() {
+        return `export const componentNames = ${JSON.stringify(ogImageComponentCtx.components)}`;
+      },
+      options: { mode: "server" }
+    });
+    nuxt.options.nitro.virtual = nuxt.options.nitro.virtual || {};
+    nuxt.options.nitro.virtual["#og-image-virtual/component-names.mjs"] = () => {
+      return `export const componentNames = ${JSON.stringify(ogImageComponentCtx.components)}`;
+    };
+    nuxt.options.nitro.virtual["#og-image-virtual/public-assets.mjs"] = async () => {
+      const isCloudflare = ["cloudflare", "cloudflare-pages", "cloudflare-module"].includes(preset);
+      if (isCloudflare) {
+        const devBinding = resolver.resolve("./runtime/server/og-image/bindings/font-assets/dev-prerender");
+        const cfBinding = resolver.resolve("./runtime/server/og-image/bindings/font-assets/cloudflare");
+        return `
+import { resolve as devResolve } from '${devBinding}'
+import { resolve as cfResolve } from '${cfBinding}'
+export const resolve = (import.meta.dev || import.meta.prerender) ? devResolve : cfResolve
+`;
+      }
+      return `export { resolve } from '${resolver.resolve("./runtime/server/og-image/bindings/font-assets/dev-prerender")}'`;
+    };
+    nuxt.options.nitro.virtual["#og-image/fonts"] = async () => {
+      const templates = nuxt.options.build.templates;
+      const nuxtFontsTemplate = templates.find((t) => t.filename?.endsWith("nuxt-fonts-global.css"));
+      if (!nuxtFontsTemplate?.getContents) {
+        return `export default []`;
+      }
+      const contents = await nuxtFontsTemplate.getContents({});
+      const fontFaceRegex = /@font-face\s*\{([^}]+)\}/g;
+      const fonts = [];
+      for (const match of contents.matchAll(fontFaceRegex)) {
+        const block = match[1];
+        if (!block)
+          continue;
+        const family = block.match(/font-family:\s*['"]?([^'";]+)['"]?/)?.[1]?.trim();
+        const src = block.match(/url\(["']?([^)"']+)["']?\)/)?.[1];
+        const weight = Number.parseInt(block.match(/font-weight:\s*(\d+)/)?.[1] || "400");
+        const style = block.match(/font-style:\s*(\w+)/)?.[1] || "normal";
+        if (family && src) {
+          fonts.push({ family, src, weight, style });
+        }
+      }
+      const familiesWithNonWoff2 = new Set(fonts.filter((f) => !f.src.endsWith(".woff2")).map((f) => f.family));
+      const warnedFamilies = /* @__PURE__ */ new Set();
+      for (const f of fonts) {
+        if (f.src.endsWith(".woff2") && !familiesWithNonWoff2.has(f.family) && !warnedFamilies.has(f.family)) {
+          warnedFamilies.add(f.family);
+          logger.warn(`WOFF2-only font detected (${f.family}). Satori renderer does not support WOFF2 - use Takumi renderer or provide WOFF/TTF alternatives.`);
+        }
+      }
+      logger.debug(`Extracted fonts from @nuxt/fonts: ${JSON.stringify(fonts)}`);
+      return `export default ${JSON.stringify(fonts)}`;
+    };
+    nuxt.options.nitro.virtual["#og-image-virtual/tw4-theme.mjs"] = () => {
+      return `export const tw4FontVars = ${JSON.stringify(tw4State.fontVars)}
+export const tw4Breakpoints = ${JSON.stringify(tw4State.breakpoints)}
+export const tw4Colors = ${JSON.stringify(tw4State.colors)}`;
+    };
+    nuxt.options.nitro.virtual["#og-image-virtual/build-dir.mjs"] = () => {
+      return `export const buildDir = ${JSON.stringify(nuxt.options.buildDir)}`;
+    };
+    let fontContext = null;
+    nuxt.hook("fonts:public-asset-context", (ctx) => {
+      fontContext = ctx;
+    });
+    nuxt.hook("vite:compiled", () => {
+      if (fontContext?.renderedFontURLs.size) {
+        const cacheDir = join(nuxt.options.buildDir, "cache", "og-image");
+        fs.mkdirSync(cacheDir, { recursive: true });
+        const mapping = Object.fromEntries(fontContext.renderedFontURLs);
+        fs.writeFileSync(join(cacheDir, "font-urls.json"), JSON.stringify(mapping));
+        logger.debug(`Persisted ${fontContext.renderedFontURLs.size} font URLs for prerender`);
+      }
+    });
+    registerTypeTemplates({
+      nuxt,
+      config,
+      componentCtx: ogImageComponentCtx
+    });
+    const cacheEnabled = typeof config.runtimeCacheStorage !== "undefined" && config.runtimeCacheStorage !== false;
+    const cacheVersion = config.cacheVersion === false ? "" : config.cacheVersion ?? version;
+    const versionSuffix = cacheVersion ? `/${cacheVersion}` : "";
+    let baseCacheKey;
+    if (config.runtimeCacheStorage === true) {
+      baseCacheKey = `/cache/nuxt-og-image${versionSuffix}`;
+    } else if (typeof config.runtimeCacheStorage === "string") {
+      baseCacheKey = `/${config.runtimeCacheStorage}/nuxt-og-image${versionSuffix}`;
+    } else if (typeof config.runtimeCacheStorage === "object") {
+      baseCacheKey = `/nuxt-og-image${versionSuffix}`;
+      if (!nuxt.options.dev) {
+        nuxt.options.nitro.storage = nuxt.options.nitro.storage || {};
+        nuxt.options.nitro.storage["nuxt-og-image"] = config.runtimeCacheStorage;
+      }
+    } else {
+      baseCacheKey = false;
+    }
+    if (!cacheEnabled)
+      baseCacheKey = false;
+    const buildCachePath = typeof config.buildCache === "object" && config.buildCache.base ? config.buildCache.base : "node_modules/.cache/nuxt-seo/og-image";
+    const buildCacheDir = config.buildCache ? join(nuxt.options.rootDir, buildCachePath) : void 0;
+    nuxt.hooks.hook("modules:done", async () => {
+      if (!isNuxtGenerate() && nuxt.options.build) {
+        nuxt.options.nitro = nuxt.options.nitro || {};
+        nuxt.options.nitro.prerender = nuxt.options.nitro.prerender || {};
+        nuxt.options.nitro.prerender.routes = nuxt.options.nitro.prerender.routes || [];
+      }
+      const hasColorModeModule = hasNuxtModule("@nuxtjs/color-mode");
+      const colorModeOptions = hasColorModeModule ? await getNuxtModuleOptions("@nuxtjs/color-mode") : {};
+      let colorPreference = colorModeOptions.preference;
+      if (!colorPreference || colorPreference === "system")
+        colorPreference = colorModeOptions.fallback;
+      if (!colorPreference || colorPreference === "system")
+        colorPreference = "light";
+      const runtimeConfig = {
+        version,
+        // binding options
+        satoriOptions: config.satoriOptions || {},
+        resvgOptions: config.resvgOptions || {},
+        sharpOptions: config.sharpOptions === true ? {} : config.sharpOptions || {},
+        publicStoragePath: `root${publicDirAbs.replace(nuxt.options.rootDir, "").replaceAll("/", ":")}`,
+        defaults: config.defaults,
+        debug: config.debug,
+        // avoid adding credentials
+        baseCacheKey,
+        buildCacheDir,
+        hasNuxtIcon: hasNuxtModule("nuxt-icon") || hasNuxtModule("@nuxt/icon"),
+        colorPreference,
+        // @ts-expect-error runtime type
+        isNuxtContentDocumentDriven: !!nuxt.options.content?.documentDriven,
+        cacheQueryParams: config.cacheQueryParams ?? false
+      };
+      if (nuxt.options.dev) {
+        runtimeConfig.componentDirs = config.componentDirs;
+        runtimeConfig.srcDir = nuxt.options.srcDir;
+        runtimeConfig.communityTemplatesDir = resolve("./runtime/app/components/Templates/Community");
+      }
+      nuxt.hooks.callHook("nuxt-og-image:runtime-config", runtimeConfig);
+      nuxt.options.runtimeConfig["nuxt-og-image"] = runtimeConfig;
+    });
+    const getDetectedRenderers = () => ogImageComponentCtx.detectedRenderers;
+    if (nuxt.options.dev) {
+      setupDevHandler(config, resolver, getDetectedRenderers);
+      setupDevToolsUI(config, resolve);
+      const useNitro = new Promise((resolveNitro) => {
+        nuxt.hooks.hook("nitro:init", resolveNitro);
+      });
+      nuxt.hook("builder:watch", async (_event, relativePath) => {
+        const absolutePath = join(nuxt.options.rootDir, relativePath);
+        const isTw4CssChange = tw4State.cssPath && absolutePath === tw4State.cssPath;
+        const isOgImageComponent = config.componentDirs.some((dir) => {
+          const componentDir = join(nuxt.options.srcDir, "components", dir);
+          return absolutePath.startsWith(componentDir) && absolutePath.endsWith(".vue");
+        });
+        if (isTw4CssChange || isOgImageComponent) {
+          clearTw4Cache();
+          if (tw4State.cssPath && existsSync(tw4State.cssPath)) {
+            const { scanComponentClasses, filterProcessableClasses } = await import('../chunks/tw4-classes.mjs');
+            const { generateStyleMap } = await import('../chunks/tw4-generator.mjs');
+            const allClasses = await scanComponentClasses(config.componentDirs, nuxt.options.srcDir, logger);
+            const processableClasses = filterProcessableClasses(allClasses);
+            if (processableClasses.length > 0) {
+              const nuxtUiColors = await loadNuxtUiColors();
+              const styleMap = await generateStyleMap({
+                cssPath: tw4State.cssPath,
+                classes: processableClasses,
+                nuxtUiColors
+              });
+              tw4State.styleMap = {};
+              for (const [cls, styles] of styleMap.classes) {
+                tw4State.styleMap[cls] = styles;
+              }
+              logger.info(`HMR: Regenerated TW4 style map (${Object.keys(tw4State.styleMap).length} classes)`);
+            }
+          }
+          await updateTemplates({ filter: (t) => t.filename.includes("nuxt-og-image") });
+          const nitro = await useNitro;
+          await nitro.hooks.callHook("rollup:reload");
+        }
+      });
+    } else if (isNuxtGenerate()) {
+      setupGenerateHandler(config, resolver);
+    } else if (nuxt.options.build) {
+      await setupBuildHandler(config, resolver, getDetectedRenderers);
+    }
+    if (nuxt.options.build)
+      addServerPlugin(resolve("./runtime/server/plugins/prerender"));
+    setupPrerenderHandler(config, resolver, getDetectedRenderers);
+  }
+});
+
+export { convertOklchToHex as a, buildNuxtUiVars as b, createStylesheetLoader as c, decodeCssClassName as d, module$1 as m, walkTemplateAst as w };