nuxt-seo-utils 7.0.19 → 8.0.1

package/dist/module.mjs

@@ -1,15 +1,16 @@
-import { useNuxt, addTypeTemplate, defineNuxtModule, useLogger, createResolver, addServerHandler, hasNuxtModule, addPlugin, addImports, addVitePlugin } from '@nuxt/kit';
+import fs, { existsSync } from 'node:fs';
+import { useNuxt, addTypeTemplate, useLogger, defineNuxtModule, createResolver, addServerHandler, hasNuxtModule, addPlugin, addImports, addVitePlugin } from '@nuxt/kit';
 import UnheadVite from '@unhead/addons/vite';
 import { defu } from 'defu';
 import { installNuxtSiteConfig } from 'nuxt-site-config/kit';
-import { resolve, relative, extname, dirname, basename } from 'pathe';
+import { resolve, extname, relative, dirname, basename } from 'pathe';
 import { unpackMeta } from '@unhead/vue/utils';
-import fg from 'fast-glob';
-import fs from 'node:fs';
+import { glob } from 'tinyglobby';
 import { encodePath, joinURL } from 'ufo';
 import escapeRE from 'escape-string-regexp';
 import { readFile } from 'node:fs/promises';
 import imageSize from 'image-size';
+import { setupDevToolsUI as setupDevToolsUI$1 } from 'nuxtseo-shared/devtools';
 
 function extendNuxtConfigAppHeadSeoMeta(nuxt = useNuxt()) {
   const seoMeta = nuxt.options.app?.seoMeta || nuxt.options.app?.head?.seoMeta || {};
@@ -34,7 +35,7 @@ function extendNuxtConfigAppHeadTypes(nuxt = useNuxt()) {
   addTypeTemplate({
     filename: "module/nuxt-seo-utils.assets.d.ts",
     getContents: async () => {
-      const paths = (await fg(["**/*"], { cwd: resolve(nuxt.options.srcDir, "public") })).map((p) => `/${p}`);
+      const paths = (await glob(["**/*"], { cwd: resolve(nuxt.options.srcDir, "public") })).map((p) => `/${p}`);
       const jsPaths = paths.filter((p) => p.endsWith(".js") || p.endsWith(".mjs"));
       return `// Generated by nuxt-seo-utils
 declare module '#app' {
@@ -81,8 +82,10 @@ const MetaTagFileGlobs = [
   "**/*icon-*.{ico,jpg,jpeg,png,svg}"
 ];
 
+const INDEX_SUFFIX_RE = /-index$/;
 function generateNuxtPageFromFile(file, pagesDir) {
-  const segments = relative(pagesDir, file).replace(new RegExp(`${escapeRE(extname(file))}$`), "").split("/");
+  const extPattern = new RegExp(`${escapeRE(extname(file))}$`);
+  const segments = relative(pagesDir, file).replace(extPattern, "").split("/");
   const route = {
     name: "",
     path: "",
@@ -106,7 +109,7 @@ function generateNuxtPageFromFile(file, pagesDir) {
     }
   }
   if (route.name)
-    route.name = route.name.replace(/-index$/, "");
+    route.name = route.name.replace(INDEX_SUFFIX_RE, "");
   return route;
 }
 function getRoutePath(tokens) {
@@ -160,7 +163,7 @@ function parseSegment(segment) {
         }
         if (c === "[" && state === 2 /* dynamic */)
           state = 3 /* optional */;
-        if (c === "]" && (state !== 3 /* optional */ || buffer[buffer.length - 1] === "]")) {
+        if (c === "]" && (state !== 3 /* optional */ || buffer.at(-1) === "]")) {
           if (!buffer)
             throw new Error("Empty param");
           else
@@ -185,6 +188,7 @@ function hasLinkRel(input, rel) {
 function hasMetaProperty(input, property) {
   return input.meta?.some((meta) => meta.property === property);
 }
+const ALT_NEWLINE_RE = /\n/g;
 async function getImageMeta(base, path, isIcon = false) {
   const absolutePath = resolve(base, path);
   const file = absolutePath.split("/").pop();
@@ -202,7 +206,7 @@ async function getImageMeta(base, path, isIcon = false) {
     const altTextPath = resolve(dirname(absolutePath), `${keyword}.alt.txt`);
     if (fs.existsSync(altTextPath)) {
       payload.alt = fs.readFileSync(altTextPath, "utf8");
-      payload.alt = String(payload.alt).replace(/\n/g, " ").trim();
+      payload.alt = String(payload.alt).replace(ALT_NEWLINE_RE, " ").trim();
     }
   } else {
     if (path.includes(".dark") || path.includes("-dark"))
@@ -222,9 +226,10 @@ async function getImageDimensions(absolutePath) {
   return imageSize(buffer);
 }
 
+const DIR_SUFFIX_RE = /\/_dir$/;
 async function generateTagsFromPageDirImages(nuxt = useNuxt()) {
   const pagesDir = resolve(nuxt.options.rootDir, nuxt.options.dir.pages);
-  const files = await fg(MetaTagFileGlobs, { cwd: pagesDir, onlyFiles: true });
+  const files = await glob(MetaTagFileGlobs, { cwd: pagesDir, onlyFiles: true });
   const appendRouteRules = {};
   const devMiddlewareMap = {};
   const nitroOutputMap = [];
@@ -234,7 +239,7 @@ async function generateTagsFromPageDirImages(nuxt = useNuxt()) {
     let { path } = generateNuxtPageFromFile(resolve(pagesDir, dirname(file)), pagesDir);
     const meta = await getImageMeta(pagesDir, file);
     if (path.endsWith("/_dir"))
-      path = path.replace(/\/_dir$/, "");
+      path = path.replace(DIR_SUFFIX_RE, "");
     const src = joinURL(path, fileName);
     if (["icon", "apple-touch-icon", "apple-icon"].includes(keyword) || keyword.startsWith("icon-")) {
       appendRouteRules[`${path}/**`] = {
@@ -280,7 +285,7 @@ async function generateTagsFromPageDirImages(nuxt = useNuxt()) {
 
 async function generateTagsFromPublicFiles(nuxt = useNuxt()) {
   const publicDirPath = resolve(nuxt.options.rootDir, nuxt.options.dir.public);
-  const rootPublicFiles = (await fg(MetaTagFileGlobs, { cwd: publicDirPath, onlyFiles: true, deep: 1 })).map((file) => basename(file));
+  const rootPublicFiles = (await glob(MetaTagFileGlobs, { cwd: publicDirPath, onlyFiles: true, deep: 1 })).map((file) => basename(file));
   const headConfig = defu(nuxt.options.app.head, {
     link: [],
     meta: []
@@ -360,6 +365,163 @@ async function generateTagsFromPublicFiles(nuxt = useNuxt()) {
     }
   }
   nuxt.options.app.head = headConfig;
+  const hasIcons = rootPublicFiles.some((f) => f.includes("icon") || f === "favicon.ico");
+  return { hasIcons };
+}
+
+const INLINE_SCRIPT_RE = /<script(?![^>]+\bsrc\b)([^>]*)>([\s\S]*?)<\/script\s*>/gi;
+const INLINE_STYLE_RE = /<style([^>]*)>([\s\S]*?)<\/style\s*>/gi;
+const TYPE_ATTR_RE = /\btype\s*=\s*["']([^"']*)["']/i;
+const JSON_TYPES = /* @__PURE__ */ new Set(["application/json", "application/ld+json"]);
+const SKIP_JS_TYPES = /* @__PURE__ */ new Set(["application/json", "application/ld+json", "speculationrules", "importmap"]);
+const logger = useLogger("nuxt-seo-utils");
+async function minifyJSBuildTime(code) {
+  try {
+    const rolldownPath = "rolldown/experimental";
+    const { minify } = await import(
+      /* @vite-ignore */
+      rolldownPath
+    );
+    const result = await minify("inline.js", code);
+    return result.code.trim();
+  } catch {
+  }
+  try {
+    const esbuild = await import('esbuild');
+    const result = await esbuild.transform(code, {
+      minify: true,
+      loader: "js"
+    });
+    return result.code.trim();
+  } catch {
+  }
+  logger.debug("Build-time JS minification skipped: neither rolldown nor esbuild is available. Install one as a dependency to enable it.");
+  return null;
+}
+async function minifyCSSWithLightningCSS(code) {
+  try {
+    const lightningcss = await import('lightningcss');
+    const result = lightningcss.transform({
+      filename: "inline.css",
+      code: new TextEncoder().encode(code),
+      minify: true
+    });
+    return new TextDecoder().decode(result.code).trim();
+  } catch {
+    logger.debug("Build-time CSS minification skipped: lightningcss is not available. Install it as a dependency to enable it.");
+    return null;
+  }
+}
+function minifyPrerender() {
+  const nuxt = useNuxt();
+  nuxt.hooks.hook("app:resolve", async () => {
+    const head = nuxt.options.app.head;
+    const promises = [];
+    if (head.script?.length) {
+      for (const script of head.script) {
+        if (typeof script === "string")
+          continue;
+        const content = String(script.innerHTML || script.textContent || "");
+        if (!content)
+          continue;
+        const setContent = (val) => {
+          if (script.innerHTML)
+            script.innerHTML = val;
+          else if (script.textContent)
+            script.textContent = val;
+        };
+        if (script.type && JSON_TYPES.has(script.type)) {
+          try {
+            const minified = JSON.stringify(JSON.parse(content));
+            if (minified.length < content.length)
+              setContent(minified);
+          } catch {
+          }
+          continue;
+        }
+        if (script.type && SKIP_JS_TYPES.has(script.type))
+          continue;
+        promises.push(minifyJSBuildTime(content).then((minified) => {
+          if (minified && minified.length < content.length)
+            setContent(minified);
+        }));
+      }
+    }
+    if (head.style?.length) {
+      for (const style of head.style) {
+        if (typeof style === "string")
+          continue;
+        const content = String(style.innerHTML || style.textContent || "");
+        if (!content)
+          continue;
+        promises.push(minifyCSSWithLightningCSS(content).then((minified) => {
+          if (minified && minified.length < content.length) {
+            if (style.innerHTML)
+              style.innerHTML = minified;
+            else if (style.textContent)
+              style.textContent = minified;
+          }
+        }));
+      }
+    }
+    await Promise.all(promises);
+  });
+  nuxt.hooks.hook("nitro:init", (nitro) => {
+    nitro.hooks.hook("prerender:generate", async (route) => {
+      if (!route.contents || !route.contentType?.includes("html"))
+        return;
+      route.contents = await replaceAsync(
+        route.contents,
+        new RegExp(INLINE_SCRIPT_RE.source, INLINE_SCRIPT_RE.flags),
+        async (fullMatch, attrs, content) => {
+          if (!content)
+            return fullMatch;
+          const typeMatch = TYPE_ATTR_RE.exec(attrs);
+          const type = typeMatch?.[1];
+          if (type && JSON_TYPES.has(type)) {
+            try {
+              const minified2 = JSON.stringify(JSON.parse(content));
+              if (minified2.length < content.length)
+                return `<script${attrs}>${minified2}<\/script>`;
+            } catch {
+            }
+            return fullMatch;
+          }
+          if (type && SKIP_JS_TYPES.has(type))
+            return fullMatch;
+          const minified = await minifyJSBuildTime(content);
+          if (minified && minified.length < content.length)
+            return `<script${attrs}>${minified}<\/script>`;
+          return fullMatch;
+        }
+      );
+      route.contents = await replaceAsync(
+        route.contents,
+        new RegExp(INLINE_STYLE_RE.source, INLINE_STYLE_RE.flags),
+        async (fullMatch, attrs, content) => {
+          if (!content)
+            return fullMatch;
+          const minified = await minifyCSSWithLightningCSS(content);
+          if (minified && minified.length < content.length)
+            return `<style${attrs}>${minified}</style>`;
+          return fullMatch;
+        }
+      );
+    });
+  });
+}
+async function replaceAsync(str, regex, asyncFn) {
+  const matches = [];
+  const re = new RegExp(regex.source, regex.flags);
+  for (let m = re.exec(str); m !== null; m = re.exec(str))
+    matches.push({ match: m, replacement: asyncFn(...m) });
+  const replacements = await Promise.all(matches.map((m) => m.replacement));
+  let result = str;
+  for (let i = matches.length - 1; i >= 0; i--) {
+    const { match } = matches[i];
+    result = result.slice(0, match.index) + replacements[i] + result.slice(match.index + match[0].length);
+  }
+  return result;
 }
 
 function setupNuxtConfigAppHeadWithMoreDefaults(nuxt = useNuxt()) {
@@ -377,7 +539,16 @@ function setupNuxtConfigAppHeadWithMoreDefaults(nuxt = useNuxt()) {
   nuxt.options.app.head = headConfig;
 }
 
-const module = defineNuxtModule({
+function setupDevToolsUI(resolve, nuxt = useNuxt()) {
+  setupDevToolsUI$1({
+    route: "/__nuxt-seo-utils",
+    name: "nuxt-seo-utils",
+    title: "SEO Utils",
+    icon: "carbon:search-locate"
+  }, resolve, nuxt);
+}
+
+const module$1 = defineNuxtModule({
   meta: {
     name: "nuxt-seo-utils",
     configKey: "seo",
@@ -395,7 +566,7 @@ const module = defineNuxtModule({
       optional: true
     },
     "nuxt-site-config": {
-      version: ">=3"
+      version: ">=3.2"
     }
   },
   defaults: {
@@ -413,7 +584,9 @@ const module = defineNuxtModule({
     extendNuxtConfigAppHeadTypes: true,
     setupNuxtConfigAppHeadWithMoreDefaults: true,
     automaticOgAndTwitterTags: true,
-    canonicalLowercase: true
+    canonicalLowercase: true,
+    tagPriority: 30,
+    minify: true
   },
   async setup(config, nuxt) {
     const logger = useLogger("nuxt-seo-utils");
@@ -426,9 +599,17 @@ const module = defineNuxtModule({
     await installNuxtSiteConfig();
     const runtimeDir = resolve("./runtime");
     if (config.metaDataFiles) {
-      await generateTagsFromPublicFiles();
+      const { hasIcons } = await generateTagsFromPublicFiles();
       await generateTagsFromPageDirImages();
       if (nuxt.options.dev) {
+        if (!hasIcons) {
+          const publicDir = resolve(nuxt.options.rootDir, nuxt.options.dir.public);
+          const logoPatterns = ["logo.svg", "logo.png", "icon.svg", "icon.png", "logo.jpg", "logo.webp"];
+          const foundSource = logoPatterns.find((p) => existsSync(resolve(publicDir, p))) || logoPatterns.find((p) => existsSync(resolve(nuxt.options.rootDir, p)));
+          const sourceArg = foundSource || "<your-logo.svg>";
+          logger.info(`No favicon detected. Generate icons with:
+  npx nuxt-seo-utils icons --source ${sourceArg}`);
+        }
         addServerHandler({
           middleware: true,
           handler: resolve(runtimeDir, "server/middleware/resolveImagesInPagesDir")
@@ -462,6 +643,14 @@ const module = defineNuxtModule({
       from: resolve(runtimeDir, `./app/composables/useBreadcrumbItems`),
       name: "useBreadcrumbItems"
     });
+    addImports({
+      from: resolve(runtimeDir, `./app/composables/useFallbackTitle`),
+      name: "useFallbackTitle"
+    });
+    addImports({
+      from: resolve(runtimeDir, `./app/composables/useShareLinks`),
+      name: "useShareLinks"
+    });
     const polyfills = [
       // @ts-expect-error runtime type
       ...!hasNuxtModule("nuxt-schema-org") || nuxt.options.schemaOrg?.enable === false ? [
@@ -495,7 +684,8 @@ const module = defineNuxtModule({
         "category",
         "tag"
       ],
-      canonicalLowercase: config.canonicalLowercase
+      canonicalLowercase: config.canonicalLowercase,
+      tagPriority: config.tagPriority
     });
     if (config.extendNuxtConfigAppHeadSeoMeta)
       extendNuxtConfigAppHeadSeoMeta();
@@ -557,7 +747,28 @@ export {}
       addPlugin({ src: resolve(appRuntimeDir, "plugins", "0.routeRules") });
     if (config.fixRequiredAbsoluteMetaTagsLinks)
       addPlugin({ src: resolve(appRuntimeDir, "plugins", "1.absoluteImageUrls.server"), mode: "server" });
+    if (!nuxt.options.dev && config.minify) {
+      const minifyOpts = config.minify === true ? { build: true, runtime: true } : config.minify;
+      if (minifyOpts.runtime !== false) {
+        addPlugin({
+          src: resolve(appRuntimeDir, "plugins", "minifyScripts.server"),
+          mode: "server"
+        });
+      }
+      if (minifyOpts.build !== false) {
+        minifyPrerender();
+      }
+    }
+    if (config.debug || nuxt.options.dev) {
+      addServerHandler({
+        route: "/__nuxt-seo-utils/debug.json",
+        handler: resolve("./runtime/server/routes/__nuxt-seo-utils/debug")
+      });
+    }
+    if (nuxt.options.dev) {
+      setupDevToolsUI(resolve, nuxt);
+    }
   }
 });
 
-export { module as default };
+export { module$1 as default };

package/dist/runtime/app/composables/polyfills.d.ts

@@ -1,11 +1,12 @@
+import type { ComputedRef } from 'vue';
 export declare function useSchemaOrg(): void;
 export declare function defineWebSite(): void;
 export declare function defineWebPage(): void;
 export declare function defineBreadcrumb(): void;
 export declare function useI18n(): {
-    t: (_: string, fallback: string, options: any) => string;
+    t: (_: string, fallback: string, _options: any) => string;
     te: (_: string) => boolean;
     strategy: string;
-    defaultLocale: import("vue").ComputedRef<any>;
-    locale: import("vue").ComputedRef<any>;
+    defaultLocale: ComputedRef<string>;
+    locale: ComputedRef<string>;
 };

package/dist/runtime/app/composables/polyfills.js

@@ -13,8 +13,7 @@ export function useI18n() {
     resolveRefs: false
   });
   return {
-    // eslint-disable-next-line unused-imports/no-unused-vars
-    t: (_, fallback, options) => fallback,
+    t: (_, fallback, _options) => fallback,
     te: (_) => false,
     strategy: "no_prefix",
     defaultLocale: computed(() => {

package/dist/runtime/app/composables/useBreadcrumbItems.d.ts

@@ -1,5 +1,5 @@
 import type { NuxtLinkProps } from 'nuxt/app';
-import type { MaybeRefOrGetter } from 'vue';
+import type { MaybeRefOrGetter, Ref } from 'vue';
 interface NuxtUIBreadcrumbItem extends NuxtLinkProps {
     label: string;
     labelClass?: string;
@@ -108,5 +108,5 @@ export interface BreadcrumbItemProps extends NuxtUIBreadcrumbItem {
  * @see https://github.com/harlan-zw/nuxt-seo/blob/main/src/runtime/nuxt/composables/useBreadcrumbItems.ts
  * @docs https://nuxtseo.com/nuxt-seo/api/breadcrumbs
  */
-export declare function useBreadcrumbItems(_options?: BreadcrumbProps): import("vue").ComputedRef<BreadcrumbItemProps[]>;
+export declare function useBreadcrumbItems(_options?: BreadcrumbProps): Ref<BreadcrumbItemProps[]>;
 export {};

package/dist/runtime/app/composables/useBreadcrumbItems.js

@@ -19,10 +19,11 @@ import {
 } from "vue";
 import { pathBreadcrumbSegments } from "../../shared/breadcrumbs.js";
 function withoutQuery(path) {
-  return path.split("?")[0];
+  return path.split("?")[0] || "";
 }
+const TITLE_CASE_RE = /\w\S*/g;
 function titleCase(s) {
-  return s.replaceAll("-", " ").replace(/\w\S*/g, (w) => w.charAt(0).toUpperCase() + w.substr(1).toLowerCase());
+  return s.replaceAll("-", " ").replace(TITLE_CASE_RE, (w) => w.charAt(0).toUpperCase() + w.substr(1).toLowerCase());
 }
 const BreadcrumbCtx = Symbol("BreadcrumbCtx");
 export function useBreadcrumbItems(_options = {}) {
@@ -171,18 +172,17 @@ export function useBreadcrumbItems(_options = {}) {
       return m;
     }).filter(Boolean);
   });
-  watch(items, (newItems) => {
+  watch(() => items.value, (newItems) => {
     if (!pauseUpdates.value) {
       lastBreadcrumbs.value = newItems;
     }
   }, { immediate: true, flush: "sync" });
   const schemaOrgEnabled = typeof _options.schemaOrg === "undefined" ? true : _options.schemaOrg;
-  if ((import.meta.dev || import.meta.server || import.meta.env?.NODE_ENV === "test") && schemaOrgEnabled) {
+  if ((import.meta.server || import.meta.env?.NODE_ENV === "test") && schemaOrgEnabled) {
     useSchemaOrg([
-      // @ts-expect-error untyped
       defineBreadcrumb({
-        id: `#${id}`,
-        itemListElement: computed(() => items.value.map((item) => ({
+        "@id": `#${id}`,
+        "itemListElement": computed(() => items.value.map((item) => ({
           name: item.label || item.ariaLabel,
           item: item.to ? siteResolver(item.to) : void 0
         })))

package/dist/runtime/app/composables/useFallbackTitle.d.ts

@@ -0,0 +1 @@
+export declare function useFallbackTitle(): import("vue").ComputedRef<string | null>;

package/dist/runtime/app/composables/useFallbackTitle.js

@@ -0,0 +1,31 @@
+import { useI18n } from "#imports";
+import { useError, useRoute } from "nuxt/app";
+import { titleCase } from "scule";
+import { withoutTrailingSlash } from "ufo";
+import { computed } from "vue";
+export function useFallbackTitle() {
+  const route = useRoute();
+  const err = useError();
+  let i18n;
+  try {
+    i18n = useI18n();
+  } catch {
+  }
+  return computed(() => {
+    if (err.value?.statusCode && [404, 500].includes(err.value.statusCode)) {
+      return `${err.value.statusCode} - ${err.value.message}`;
+    }
+    if (typeof route.meta?.title === "string")
+      return route.meta?.title;
+    const path = withoutTrailingSlash(route.path || "/");
+    const lastSegment = path.split("/").pop();
+    let fallback = lastSegment ? titleCase(lastSegment) : null;
+    const matched = route.matched?.at(-1);
+    if (matched) {
+      const routeName = String(matched.name).split("___")?.[0];
+      if (routeName && i18n)
+        fallback = i18n.t(`pages.${routeName}.title`, fallback || "", { missingWarn: false }) || fallback;
+    }
+    return fallback;
+  });
+}

package/dist/runtime/app/composables/useShareLinks.d.ts

@@ -0,0 +1,78 @@
+import type { ComputedRef, MaybeRefOrGetter } from 'vue';
+export type SharePlatform = 'twitter' | 'facebook' | 'linkedin' | 'whatsapp' | 'telegram' | 'reddit' | 'pinterest' | 'email';
+export interface ShareLinkUtmParams {
+    /**
+     * Set to 'auto' to use the platform name as utm_source per link.
+     * When a string (other than 'auto'), use that value for all platforms.
+     * @default undefined
+     */
+    source?: 'auto' | (string & {});
+    medium?: string;
+    campaign?: string;
+    term?: string;
+    content?: string;
+}
+export interface ShareLinksOptions {
+    /**
+     * Override the URL to share. Defaults to the canonical URL of the current page.
+     */
+    url?: MaybeRefOrGetter<string | undefined>;
+    /**
+     * The title/text to share. Defaults to the site name from site config.
+     */
+    title?: MaybeRefOrGetter<string | undefined>;
+    /**
+     * UTM tracking parameters. Defaults to `true` for automatic per-platform tracking
+     * (utm_source = platform name, utm_medium = 'social'/'email'). Pass `false` to disable,
+     * or an object for manual control.
+     *
+     * @example
+     * // Auto: utm_source=twitter&utm_medium=social, utm_source=facebook&utm_medium=email, etc.
+     * utm: true
+     *
+     * // Manual: same utm params on all platforms
+     * utm: { source: 'newsletter', medium: 'email', campaign: 'launch' }
+     *
+     * // Hybrid: auto source + medium per platform, with custom campaign
+     * utm: { source: 'auto', campaign: 'launch' }
+     */
+    utm?: MaybeRefOrGetter<boolean | ShareLinkUtmParams | undefined>;
+    /**
+     * Twitter/X specific options.
+     */
+    twitter?: {
+        /** Twitter username to attribute (without @). */
+        via?: string;
+        /** Hashtags to include (without #). */
+        hashtags?: string[];
+    };
+    /**
+     * Facebook specific options.
+     */
+    facebook?: {
+        /** Pre-filled text to accompany the share. */
+        quote?: string;
+        /** A single hashtag (without #, e.g. "nuxt"). */
+        hashtag?: string;
+    };
+    /**
+     * Pinterest specific options.
+     */
+    pinterest?: {
+        /** Direct image URL to pin. */
+        media?: MaybeRefOrGetter<string | undefined>;
+    };
+}
+export type ShareLinks = Record<SharePlatform, string> & {
+    /** The resolved canonical URL (without UTM params), useful for "copy link" buttons. */
+    canonicalUrl: string;
+};
+/**
+ * Generate social share URLs for the current page across multiple platforms.
+ *
+ * Uses the site config base URL and canonical URL logic to build share links
+ * with optional UTM parameter tracking.
+ *
+ * @docs https://nuxtseo.com/nuxt-seo/api/share-links
+ */
+export declare function useShareLinks(options?: ShareLinksOptions): ComputedRef<ShareLinks>;

package/dist/runtime/app/composables/useShareLinks.js

@@ -0,0 +1,94 @@
+import { useSiteConfig } from "#site-config/app/composables/useSiteConfig";
+import { createSitePathResolver } from "#site-config/app/composables/utils";
+import { useRoute, useRuntimeConfig } from "nuxt/app";
+import { stringifyQuery, withQuery } from "ufo";
+import { computed, toValue } from "vue";
+function buildShareUrl(platform, url, title, options) {
+  const encodedUrl = encodeURIComponent(url);
+  const encodedTitle = encodeURIComponent(title);
+  switch (platform) {
+    case "twitter": {
+      let twitterUrl = `https://x.com/intent/tweet?url=${encodedUrl}&text=${encodedTitle}`;
+      if (options.twitter?.via)
+        twitterUrl += `&via=${encodeURIComponent(options.twitter.via)}`;
+      if (options.twitter?.hashtags?.length)
+        twitterUrl += `&hashtags=${encodeURIComponent(options.twitter.hashtags.join(","))}`;
+      return twitterUrl;
+    }
+    case "facebook": {
+      let fbUrl = `https://www.facebook.com/sharer/sharer.php?u=${encodedUrl}`;
+      if (options.facebook?.quote)
+        fbUrl += `&quote=${encodeURIComponent(options.facebook.quote)}`;
+      if (options.facebook?.hashtag)
+        fbUrl += `&hashtag=${encodeURIComponent(`#${options.facebook.hashtag}`)}`;
+      return fbUrl;
+    }
+    case "linkedin":
+      return `https://www.linkedin.com/sharing/share-offsite/?url=${encodedUrl}`;
+    case "whatsapp":
+      return `https://wa.me/?text=${encodedTitle}%20${encodedUrl}`;
+    case "telegram":
+      return `https://t.me/share/url?url=${encodedUrl}&text=${encodedTitle}`;
+    case "reddit":
+      return `https://www.reddit.com/submit?url=${encodedUrl}&title=${encodedTitle}`;
+    case "pinterest": {
+      let pinUrl = `https://pinterest.com/pin/create/button/?url=${encodedUrl}&description=${encodedTitle}`;
+      const media = toValue(options.pinterest?.media);
+      if (media)
+        pinUrl += `&media=${encodeURIComponent(media)}`;
+      return pinUrl;
+    }
+    case "email":
+      return `mailto:?subject=${encodedTitle}&body=${encodedUrl}`;
+  }
+}
+export function useShareLinks(options = {}) {
+  const route = useRoute();
+  const siteConfig = useSiteConfig();
+  const { canonicalQueryWhitelist, canonicalLowercase } = useRuntimeConfig().public["seo-utils"];
+  const resolveUrl = createSitePathResolver({ withBase: true, absolute: true });
+  return computed(() => {
+    const customUrl = toValue(options.url);
+    let canonicalUrl;
+    if (customUrl) {
+      canonicalUrl = customUrl;
+    } else {
+      let url = resolveUrl(route.path || "/").value || route.path;
+      if (canonicalLowercase) {
+        url = url.toLowerCase();
+      }
+      const filteredQuery = Object.fromEntries(
+        Object.entries(route.query).filter(([key]) => canonicalQueryWhitelist.includes(key)).sort(([a], [b]) => a.localeCompare(b))
+      );
+      canonicalUrl = Object.keys(filteredQuery).length ? `${url}?${stringifyQuery(filteredQuery)}` : url;
+    }
+    const utm = toValue(options.utm) ?? true;
+    const title = toValue(options.title) || siteConfig.name || "";
+    const platforms = ["twitter", "facebook", "linkedin", "whatsapp", "telegram", "reddit", "pinterest", "email"];
+    const result = { canonicalUrl };
+    for (const platform of platforms) {
+      const query = {};
+      if (utm === false) {
+      } else if (utm === true || typeof utm === "object" && utm.source === "auto") {
+        query.utm_source = platform;
+        query.utm_medium = utm !== true && utm?.medium || (platform === "email" ? "email" : "social");
+      } else if (utm) {
+        if (utm.source)
+          query.utm_source = utm.source;
+        if (utm.medium)
+          query.utm_medium = utm.medium;
+      }
+      if (typeof utm === "object") {
+        if (utm.campaign)
+          query.utm_campaign = utm.campaign;
+        if (utm.term)
+          query.utm_term = utm.term;
+        if (utm.content)
+          query.utm_content = utm.content;
+      }
+      const url = Object.keys(query).length > 0 ? withQuery(canonicalUrl, query) : canonicalUrl;
+      result[platform] = buildShareUrl(platform, url, title, options);
+    }
+    return result;
+  });
+}