nuxt-og-image 7.0.1 → 7.0.3

package/dist/chunks/tw4.mjs

@@ -2,7 +2,7 @@ import { readFile } from 'node:fs/promises';
 import { pathToFileURL } from 'node:url';
 import { resolveModulePath } from 'exsolve';
 import { dirname, join } from 'pathe';
-import { e as extractVariantBaseClasses, r as resolveVariantPrefixes, h as resolveExtractedVars, l as resolveVarsDeep, s as simplifyCss, p as postProcessStyles, m as loadLightningCss, a as extractCssVars, c as extractUniversalVars, d as extractPerClassVars, g as extractVarsFromCss, f as extractClassStyles } from '../shared/nuxt-og-image.DR_SxdDv.mjs';
+import { e as extractVariantBaseClasses, r as resolveVariantPrefixes, h as resolveExtractedVars, l as resolveVarsDeep, s as simplifyCss, p as postProcessStyles, m as loadLightningCss, a as extractCssVars, c as extractUniversalVars, d as extractPerClassVars, g as extractVarsFromCss, f as extractClassStyles } from '../shared/nuxt-og-image.B5ZhjIiR.mjs';
 import 'node:fs';
 import 'node:module';
 import '@nuxt/kit';
@@ -225,7 +225,7 @@ async function parseCssOutput(rawCss, vars, extractedAccum) {
       if (!extractedAccum.rootVars.has(n))
         extractedAccum.rootVars.set(n, v);
     }
-    extractedAccum.qualifiedRules.push(...fresh.qualifiedRules);
+    extractedAccum.qualifiedRules = fresh.qualifiedRules;
     for (const [n, v] of fresh.universalVars) {
       if (!extractedAccum.universalVars.has(n))
         extractedAccum.universalVars.set(n, v);
@@ -254,7 +254,16 @@ const LINEAR_GRADIENT_DIRECTIONS = {
   "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"
+  "bg-gradient-to-tl": "to top left",
+  // Tailwind v4 names
+  "bg-linear-to-t": "to top",
+  "bg-linear-to-tr": "to top right",
+  "bg-linear-to-r": "to right",
+  "bg-linear-to-br": "to bottom right",
+  "bg-linear-to-b": "to bottom",
+  "bg-linear-to-bl": "to bottom left",
+  "bg-linear-to-l": "to left",
+  "bg-linear-to-tl": "to top left"
 };
 const RADIAL_GRADIENT_SHAPES = {
   "bg-radial": "circle at center",
@@ -268,32 +277,31 @@ const RADIAL_GRADIENT_SHAPES = {
   "bg-radial-at-tl": "circle at top left",
   "bg-radial-at-c": "circle at center"
 };
-async function resolveGradientColor(cls, vars) {
+async function toGradientColor(value, vars) {
+  const resolved = await resolveVarsDeep(value, vars);
+  if (resolved.includes("var("))
+    return null;
+  const simplified = await simplifyCss(`.x{color:${resolved}}`);
+  return simplified.match(RE_CSS_COLOR_VALUE)?.[1]?.trim() ?? resolved;
+}
+async function resolveGradientColor(cls, vars, classVars) {
   const colorName = cls.replace(RE_GRADIENT_STOP_PREFIX, "");
   const shadeMatch = colorName.match(RE_COLOR_SHADE);
   if (shadeMatch?.[1] && shadeMatch?.[2]) {
-    const varName2 = `--color-${shadeMatch[1]}-${shadeMatch[2]}`;
-    const value2 = vars.get(varName2);
-    if (value2) {
-      const resolved = await resolveVarsDeep(value2, vars);
-      if (!resolved.includes("var(")) {
-        const simplified = await simplifyCss(`.x{color:${resolved}}`);
-        return simplified.match(RE_CSS_COLOR_VALUE)?.[1]?.trim() ?? resolved;
-      }
-    }
+    const value2 = vars.get(`--color-${shadeMatch[1]}-${shadeMatch[2]}`);
+    const color2 = value2 ? await toGradientColor(value2, vars) : null;
+    if (color2)
+      return color2;
   }
-  const varName = `--color-${colorName}`;
-  const value = vars.get(varName);
-  if (value) {
-    const resolved = await resolveVarsDeep(value, vars);
-    if (!resolved.includes("var(")) {
-      const simplified = await simplifyCss(`.x{color:${resolved}}`);
-      return simplified.match(RE_CSS_COLOR_VALUE)?.[1]?.trim() ?? resolved;
-    }
-  }
-  return null;
+  const value = vars.get(`--color-${colorName}`);
+  const color = value ? await toGradientColor(value, vars) : null;
+  if (color)
+    return color;
+  const stop = cls.match(RE_GRADIENT_STOP_PREFIX)?.[1];
+  const own = stop ? classVars?.get(`--tw-gradient-${stop}`) : void 0;
+  return own ? toGradientColor(own, vars) : null;
 }
-async function buildGradient(classes, vars) {
+async function buildGradient(classes, vars, perClassVars) {
   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-"));
@@ -303,9 +311,9 @@ async function buildGradient(classes, vars) {
     return null;
   if (!fromClass && !toClass)
     return null;
-  const fromColor = fromClass ? await resolveGradientColor(fromClass, vars) : null;
-  const viaColor = viaClass ? await resolveGradientColor(viaClass, vars) : null;
-  const toColor = toClass ? await resolveGradientColor(toClass, vars) : null;
+  const fromColor = fromClass ? await resolveGradientColor(fromClass, vars, perClassVars?.get(fromClass)) : null;
+  const viaColor = viaClass ? await resolveGradientColor(viaClass, vars, perClassVars?.get(viaClass)) : null;
+  const toColor = toClass ? await resolveGradientColor(toClass, vars, perClassVars?.get(toClass)) : null;
   if (!fromColor && !toColor)
     return null;
   const stops = [fromColor, viaColor, toColor].filter(Boolean).join(", ");
@@ -348,21 +356,20 @@ async function resolveClassesToStyles(classes, options, context, theme) {
     const outputCss = compiler.build(uncached);
     const { classes: parsedClasses, perClassVars } = await parseCssOutput(outputCss, vars, cachedExtractedVars || void 0);
     const resolveVarsForClass = theme ? buildThemeVars(vars, cachedExtractedVars, theme, options.nuxtUiColors) : vars;
-    for (const [className, rawStyles] of parsedClasses) {
-      const classVars = perClassVars.get(className);
-      const mergedVars = classVars ? new Map([...resolveVarsForClass, ...classVars]) : resolveVarsForClass;
-      const styles = await postProcessStyles(rawStyles, mergedVars, void 0, context);
+    for (const className of uncached) {
       const cacheKey = cacheKeyFor(className);
-      if (!styles && className.startsWith("bg-gradient-")) {
-        resolvedStyleCache.set(cacheKey, rawStyles);
-      } else {
-        resolvedStyleCache.set(cacheKey, styles);
+      const rawStyles = parsedClasses.get(className);
+      if (!rawStyles) {
+        resolvedStyleCache.set(cacheKey, null);
+        continue;
       }
-    }
-    for (const c of uncached) {
-      const key = cacheKeyFor(c);
-      if (!resolvedStyleCache.has(key))
-        resolvedStyleCache.set(key, null);
+      if (LINEAR_GRADIENT_DIRECTIONS[className] || RADIAL_GRADIENT_SHAPES[className]) {
+        resolvedStyleCache.set(cacheKey, {});
+        continue;
+      }
+      const classVars = perClassVars.get(className);
+      const mergedVars = classVars ? new Map([...resolveVarsForClass, ...classVars]) : resolveVarsForClass;
+      resolvedStyleCache.set(cacheKey, await postProcessStyles(rawStyles, mergedVars, void 0, context));
     }
   }
   const result = {};
@@ -372,7 +379,7 @@ async function resolveClassesToStyles(classes, options, context, theme) {
       result[cls] = resolved;
   }
   const gradientVars = theme ? buildThemeVars(vars, cachedExtractedVars, theme, options.nuxtUiColors) : vars;
-  const gradient = await buildGradient(classes, gradientVars);
+  const gradient = await buildGradient(classes, gradientVars, cachedExtractedVars?.perClassVars);
   if (gradient) {
     result[gradient.gradientClass] = { "background-image": gradient.value };
     for (const colorClass of gradient.colorClasses) {

package/dist/chunks/uno.mjs

@@ -1,8 +1,8 @@
 import { readFile } from 'node:fs/promises';
 import { defu } from 'defu';
 import { logger } from '../../dist/runtime/logger.js';
-import { e as extractVariantBaseClasses, s as simplifyCss, a as extractCssVars, b as extractPropertyInitialValues, c as extractUniversalVars, d as extractPerClassVars, f as extractClassStyles, p as postProcessStyles, r as resolveVariantPrefixes, i as importOptionalPeer, g as extractVarsFromCss, h as resolveExtractedVars } from '../shared/nuxt-og-image.DR_SxdDv.mjs';
-export { j as importResolvedModule, k as resolveOptionalModulePath } from '../shared/nuxt-og-image.DR_SxdDv.mjs';
+import { e as extractVariantBaseClasses, s as simplifyCss, a as extractCssVars, b as extractPropertyInitialValues, c as extractUniversalVars, d as extractPerClassVars, f as extractClassStyles, p as postProcessStyles, r as resolveVariantPrefixes, i as importOptionalPeer, g as extractVarsFromCss, h as resolveExtractedVars } from '../shared/nuxt-og-image.B5ZhjIiR.mjs';
+export { j as importResolvedModule, k as resolveOptionalModulePath } from '../shared/nuxt-og-image.B5ZhjIiR.mjs';
 import 'node:fs';
 import 'node:module';
 import 'node:url';

package/dist/module.json

@@ -4,7 +4,7 @@
     "nuxt": "^4.6.1 || ^5.0.0-0"
   },
   "configKey": "ogImage",
-  "version": "7.0.1",
+  "version": "7.0.3",
   "builder": {
     "@nuxt/module-builder": "1.0.3",
     "unbuild": "3.6.1"

package/dist/module.mjs

@@ -7,7 +7,7 @@ import 'defu';
 import 'fnv1a-64';
 import 'nuxtseo-shared/kit';
 import 'pathe';
-export { n as default } from './shared/nuxt-og-image.DR_SxdDv.mjs';
+export { n as default } from './shared/nuxt-og-image.B5ZhjIiR.mjs';
 import '../dist/runtime/logger.js';
 import '../dist/runtime/shared/publish.js';
 import 'node:crypto';

package/dist/runtime/app/client-utils.js

@@ -83,13 +83,13 @@ export function clientProcessOgImageOptions(input, route, basePath) {
     if (validOptions.url) {
       const url = validOptions.url;
       const absoluteUrl = /^https?:\/\//.test(url) ? url : toValue(resolveImageUrl(url));
-      registerClientOgHead(ogKey, { meta: generateMeta(absoluteUrl, validOptions, metaOptions) }, { tagPriority: "high" });
+      registerClientOgHead(ogKey, { meta: generateMeta(absoluteUrl, validOptions, metaOptions) });
       paths.push(url);
       continue;
     }
     if (hasServerRuntime) {
       const finalUrl2 = buildResolverUrl(baseURL, basePath, ogKey, route.query);
-      registerClientOgHead(ogKey, { meta: generateMeta(toValue(resolveImageUrl(finalUrl2)), validOptions, metaOptions) }, { tagPriority: "high" });
+      registerClientOgHead(ogKey, { meta: generateMeta(toValue(resolveImageUrl(finalUrl2)), validOptions, metaOptions) });
       paths.push(finalUrl2);
       continue;
     }
@@ -105,7 +105,7 @@ export function clientProcessOgImageOptions(input, route, basePath) {
     const query = opts._query && Object.keys(opts._query).length ? { _query: opts._query } : {};
     const finalUrl = withQuery(resolvedUrl, query);
     const imageUrl = rc.app.cdnURL ? withQuery(joinURL(rc.app.cdnURL, result.url), query) : toValue(resolveImageUrl(finalUrl));
-    registerClientOgHead(ogKey, { meta: generateMeta(imageUrl, opts, metaOptions) }, { processTemplateParams: true, tagPriority: "high" });
+    registerClientOgHead(ogKey, { meta: generateMeta(imageUrl, opts, metaOptions) }, { processTemplateParams: true });
     paths.push(finalUrl);
   }
   return paths;

package/dist/runtime/app/utils.js

@@ -58,7 +58,7 @@ export function setHeadOgImagePrebuilt(input) {
   const urlValue = toValue(url);
   const absoluteUrl = /^https?:\/\//.test(urlValue) ? urlValue : toValue(withSiteUrl(urlValue, { withBase: true, canonical: !import.meta.dev }));
   const meta = generateMeta(absoluteUrl, input, { includeTwitter });
-  useHead({ meta }, { tagPriority: "high" });
+  useHead({ meta });
 }
 export function createOgImageMeta(src, input, ssrContext, pagePath, head) {
   if (import.meta.client) {
@@ -126,8 +126,7 @@ export function createOgImageMeta(src, input, ssrContext, pagePath, head) {
       });
     }
   }, {
-    processTemplateParams: true,
-    tagPriority: "high"
+    processTemplateParams: true
   });
   if (import.meta.dev || import.meta.prerender) {
     ssrContext._ogImageDevtoolsInstance?.dispose();

package/dist/runtime/shared.js

@@ -9,7 +9,7 @@ export function generateMeta(url, resolvedOptions, metaOptions = {}) {
   const includeTwitter = (key === "og" || key === "twitter") && metaOptions.includeTwitter !== false;
   const meta = [];
   if (includeTwitter) {
-    meta.push({ name: "twitter:card", content: "summary_large_image" });
+    meta.push({ name: "twitter:card", content: "summary_large_image", tagPriority: "low" });
     meta.push({ name: "twitter:image", content: url });
   }
   if (!isTwitterOnly) {
@@ -30,6 +30,8 @@ export function generateMeta(url, resolvedOptions, metaOptions = {}) {
     if (includeTwitter)
       meta.push({ name: "twitter:image:alt", content: resolvedOptions.alt });
   }
+  for (const tag of meta)
+    tag.tagPriority ??= "high";
   return meta;
 }
 export function isInternalRoute(path) {

package/dist/shared/{nuxt-og-image.DR_SxdDv.mjs → nuxt-og-image.B5ZhjIiR.mjs}

@@ -671,7 +671,7 @@ const RE_CSS_DECL = /([\w-]+)\s*:\s*([^\s;][^;]*)(?:;|$)/g;
 const RE_CSS_TOGGLE = /(--[\w-]+)\s*:\s+;/g;
 const RE_CSS_CLASS_RULE = /\.((?:\\[0-9a-f]{1,6}\s?|\\[^0-9a-f]|[^\\\s{])+)\s*\{([^}]+)\}/gi;
 const RE_ROOT_HOST_BLOCK = /:(?:root|host)[^\s{]*\s*\{([^}]+)\}/g;
-const RE_UNIVERSAL_BLOCK = /\*[^{]*\{([^}]+)\}/g;
+const RE_UNIVERSAL_BLOCK = /(?:^|[{};])\s*\*[^{};]*\{([^{}]+)\}/g;
 const RE_PROPERTY_AT_RULE = /@property\s+(--[\w-]+)\s*\{([^}]+)\}/g;
 const RE_INITIAL_VALUE = /initial-value\s*:\s*([^\s;][^;]*);?/;
 const RE_CSS_ESCAPE_HEX = /\\([0-9a-f]{1,6})\s?/gi;
@@ -1112,15 +1112,24 @@ async function extractVarsFromCss(css) {
   }
   return { rootVars, qualifiedRules, universalVars, propertyInitials, perClassVars };
 }
+const MAX_VAR_SUBSTITUTIONS = 100;
 function resolveCssVars(css, vars) {
   let result = css;
-  let iterations = 0;
-  while (result.includes("var(") && iterations < 20) {
-    const next = resolveInnermostVar(result, vars);
-    if (next === result)
+  let cursor = result.length;
+  for (let substitutions = 0; substitutions < MAX_VAR_SUBSTITUTIONS; ) {
+    const idx = result.lastIndexOf("var(", cursor);
+    if (idx === -1)
       break;
-    result = next;
-    iterations++;
+    const resolved = substituteVar(result, idx, vars);
+    if (resolved === void 0) {
+      if (idx === 0)
+        break;
+      cursor = idx - 1;
+      continue;
+    }
+    result = result.substring(0, idx) + resolved.value + result.substring(resolved.end);
+    cursor = idx + resolved.value.length;
+    substitutions++;
   }
   return result;
 }
@@ -1136,23 +1145,19 @@ function findClosingParen(str, startIdx) {
   }
   return -1;
 }
-function resolveInnermostVar(css, vars) {
-  const idx = css.lastIndexOf("var(");
-  if (idx === -1)
-    return css;
+function substituteVar(css, idx, vars) {
   const closeIdx = findClosingParen(css, idx + 4);
   if (closeIdx === -1)
-    return css;
+    return void 0;
   const content = css.substring(idx + 4, closeIdx);
-  if (content.includes("var("))
-    return css;
   const comma = content.indexOf(",");
   const name = (comma >= 0 ? content.substring(0, comma) : content).trim();
   const fallback = comma >= 0 ? content.substring(comma + 1).trim() : void 0;
-  const resolved = vars.get(name) ?? fallback;
+  const value = vars.get(name);
+  const resolved = value !== void 0 && value.trim() !== "initial" ? value : fallback;
   if (resolved === void 0)
-    return css;
-  return css.substring(0, idx) + resolved + css.substring(closeIdx + 1);
+    return void 0;
+  return { value: resolved, end: closeIdx + 1 };
 }
 function decodeCssClassName(selector) {
   let className = selector.startsWith(".") ? selector.slice(1) : selector;
@@ -2907,6 +2912,7 @@ function getMissingSiteUrlWarning(input) {
 function setupPrerenderHandler(options, resolve, getDetectedRenderers, nuxt = useNuxt()) {
   nuxt.hooks.hook("nitro:init", async (nitro) => {
     nitro.hooks.hook("prerender:config", async (nitroConfig) => {
+      nitroConfig.plugins = [...nitroConfig.plugins || [], resolve.resolve("./runtime/server/plugins/prerender")];
       await applyNitroPresetCompatibility(nitroConfig, { compatibility: options.compatibility?.prerender, resolve, detectedRenderers: getDetectedRenderers() });
       nitroConfig.wasm = nitroConfig.wasm || {};
       nitroConfig.wasm.esmImport = false;
@@ -6399,8 +6405,6 @@ export const staticFontCacheDir = ${JSON.stringify(getStaticFontCacheDir(nuxt.op
       nuxt.options.nitro.virtual["#og-image-virtual/signing.mjs"] = () => `export const rendersImages = ${getDetectedRenderers().size > 0}`;
       addServerHandler({ middleware: true, handler: resolve("./runtime/server/middleware/signing") });
     }
-    if (nuxt.options.build)
-      addServerPlugin(resolve("./runtime/server/plugins/prerender"));
     if (nuxt.options.build && config.publish && !config.zeroRuntime)
       addServerPlugin(resolve("./runtime/server/plugins/publish"));
     if (nuxt.options.dev)

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "nuxt-og-image",
   "type": "module",
-  "version": "7.0.1",
+  "version": "7.0.3",
   "description": "Enlightened OG Image generation for Nuxt.",
   "author": {
     "website": "https://harlanzw.com",