nuxt-og-image 2.0.25 → 2.0.28

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (35) hide show
  1. package/dist/client/200.html +5 -5
  2. package/dist/client/404.html +5 -5
  3. package/dist/client/_nuxt/IconCSS.28ef6808.css +1 -0
  4. package/dist/client/_nuxt/IconCSS.d3e12840.js +1 -0
  5. package/dist/client/_nuxt/{ImageLoader.9a2c5592.js → ImageLoader.ad92439f.js} +1 -1
  6. package/dist/client/_nuxt/{entry.5e420308.js → entry.00dd4948.js} +49 -49
  7. package/dist/client/_nuxt/{entry.9cb59451.css → entry.0b89ffd3.css} +1 -1
  8. package/dist/client/_nuxt/{error-404.5039d699.js → error-404.95b4b668.js} +1 -1
  9. package/dist/client/_nuxt/{error-500.b422d33f.js → error-500.d22f8b54.js} +1 -1
  10. package/dist/client/_nuxt/{index.0f460624.js → index.f2702f88.js} +1 -1
  11. package/dist/client/_nuxt/{options.b061e670.js → options.ddf310be.js} +1 -1
  12. package/dist/client/_nuxt/{png.a29fa077.js → png.51e9bf00.js} +1 -1
  13. package/dist/client/_nuxt/{shiki.1fe83df5.js → shiki.721a43ba.js} +1 -1
  14. package/dist/client/_nuxt/{svg.b56c3a39.js → svg.f31a00cf.js} +1 -1
  15. package/dist/client/_nuxt/{vnodes.d38ef018.js → vnodes.89b4b57e.js} +1 -1
  16. package/dist/client/index.html +5 -5
  17. package/dist/client/options/index.html +5 -5
  18. package/dist/client/png/index.html +5 -5
  19. package/dist/client/svg/index.html +5 -5
  20. package/dist/client/vnodes/index.html +5 -5
  21. package/dist/module.d.mts +1 -1
  22. package/dist/module.d.ts +1 -1
  23. package/dist/module.json +1 -1
  24. package/dist/module.mjs +4 -4
  25. package/dist/runtime/composables/defineOgImage.d.ts +2 -0
  26. package/dist/runtime/composables/defineOgImage.mjs +1 -0
  27. package/dist/runtime/nitro/providers/{inline-css → css-inline}/node.d.ts +1 -1
  28. package/dist/runtime/nitro/providers/css-inline/node.mjs +10 -0
  29. package/dist/runtime/nitro/routes/html.mjs +4 -4
  30. package/package.json +17 -17
  31. package/dist/client/_nuxt/IconCSS.29c035fc.css +0 -1
  32. package/dist/client/_nuxt/IconCSS.d5d4ba18.js +0 -1
  33. package/dist/runtime/nitro/providers/inline-css/node.mjs +0 -11
  34. /package/dist/runtime/nitro/providers/{inline-css → css-inline}/mock.d.ts +0 -0
  35. /package/dist/runtime/nitro/providers/{inline-css → css-inline}/mock.mjs +0 -0
@@ -2,13 +2,13 @@
2
2
  <html >
3
3
  <head><meta charset="utf-8">
4
4
  <meta name="viewport" content="width=device-width, initial-scale=1">
5
- <link rel="stylesheet" href="/__nuxt_og_image__/client/_nuxt/entry.9cb59451.css">
6
- <link rel="modulepreload" as="script" crossorigin href="/__nuxt_og_image__/client/_nuxt/entry.5e420308.js">
5
+ <link rel="stylesheet" href="/__nuxt_og_image__/client/_nuxt/entry.0b89ffd3.css">
6
+ <link rel="modulepreload" as="script" crossorigin href="/__nuxt_og_image__/client/_nuxt/entry.00dd4948.js">
7
7
  <link rel="prefetch" as="style" href="/__nuxt_og_image__/client/_nuxt/error-404.b751fa02.css">
8
- <link rel="prefetch" as="script" crossorigin href="/__nuxt_og_image__/client/_nuxt/error-404.5039d699.js">
8
+ <link rel="prefetch" as="script" crossorigin href="/__nuxt_og_image__/client/_nuxt/error-404.95b4b668.js">
9
9
  <link rel="prefetch" as="style" href="/__nuxt_og_image__/client/_nuxt/error-500.69009e70.css">
10
- <link rel="prefetch" as="script" crossorigin href="/__nuxt_og_image__/client/_nuxt/error-500.b422d33f.js">
11
- <script type="module" src="/__nuxt_og_image__/client/_nuxt/entry.5e420308.js" crossorigin></script><script>"use strict";(()=>{const a=window,e=document.documentElement,m=["dark","light"],c=window.localStorage.getItem("nuxt-color-mode")||"system";let n=c==="system"?f():c;const l=e.getAttribute("data-color-mode-forced");l&&(n=l),i(n),a["__NUXT_COLOR_MODE__"]={preference:c,value:n,getColorScheme:f,addColorScheme:i,removeColorScheme:d};function i(o){const t=""+o+"",s="";e.classList?e.classList.add(t):e.className+=" "+t,s&&e.setAttribute("data-"+s,o)}function d(o){const t=""+o+"",s="";e.classList?e.classList.remove(t):e.className=e.className.replace(new RegExp(t,"g"),""),s&&e.removeAttribute("data-"+s)}function r(o){return a.matchMedia("(prefers-color-scheme"+o+")")}function f(){if(a.matchMedia&&r("").media!=="not all"){for(const o of m)if(r(":"+o).matches)return o}return"light"}})();
10
+ <link rel="prefetch" as="script" crossorigin href="/__nuxt_og_image__/client/_nuxt/error-500.d22f8b54.js">
11
+ <script type="module" src="/__nuxt_og_image__/client/_nuxt/entry.00dd4948.js" crossorigin></script><script>"use strict";(()=>{const a=window,e=document.documentElement,m=["dark","light"],c=window.localStorage.getItem("nuxt-color-mode")||"system";let n=c==="system"?f():c;const l=e.getAttribute("data-color-mode-forced");l&&(n=l),i(n),a["__NUXT_COLOR_MODE__"]={preference:c,value:n,getColorScheme:f,addColorScheme:i,removeColorScheme:d};function i(o){const t=""+o+"",s="";e.classList?e.classList.add(t):e.className+=" "+t,s&&e.setAttribute("data-"+s,o)}function d(o){const t=""+o+"",s="";e.classList?e.classList.remove(t):e.className=e.className.replace(new RegExp(t,"g"),""),s&&e.removeAttribute("data-"+s)}function r(o){return a.matchMedia("(prefers-color-scheme"+o+")")}function f(){if(a.matchMedia&&r("").media!=="not all"){for(const o of m)if(r(":"+o).matches)return o}return"light"}})();
12
12
  </script></head>
13
13
  <body ><div id="__nuxt"></div><script type="application/json" id="__NUXT_DATA__" data-ssr="false">[{"_errors":1,"serverRendered":2,"data":3,"state":4},{},false,{},{}]</script>
14
14
  <script>window.__NUXT__={};window.__NUXT__.config={public:{},app:{baseURL:"/__nuxt_og_image__/client",buildAssetsDir:"/_nuxt/",cdnURL:""}}</script></body>
@@ -2,13 +2,13 @@
2
2
  <html >
3
3
  <head><meta charset="utf-8">
4
4
  <meta name="viewport" content="width=device-width, initial-scale=1">
5
- <link rel="stylesheet" href="/__nuxt_og_image__/client/_nuxt/entry.9cb59451.css">
6
- <link rel="modulepreload" as="script" crossorigin href="/__nuxt_og_image__/client/_nuxt/entry.5e420308.js">
5
+ <link rel="stylesheet" href="/__nuxt_og_image__/client/_nuxt/entry.0b89ffd3.css">
6
+ <link rel="modulepreload" as="script" crossorigin href="/__nuxt_og_image__/client/_nuxt/entry.00dd4948.js">
7
7
  <link rel="prefetch" as="style" href="/__nuxt_og_image__/client/_nuxt/error-404.b751fa02.css">
8
- <link rel="prefetch" as="script" crossorigin href="/__nuxt_og_image__/client/_nuxt/error-404.5039d699.js">
8
+ <link rel="prefetch" as="script" crossorigin href="/__nuxt_og_image__/client/_nuxt/error-404.95b4b668.js">
9
9
  <link rel="prefetch" as="style" href="/__nuxt_og_image__/client/_nuxt/error-500.69009e70.css">
10
- <link rel="prefetch" as="script" crossorigin href="/__nuxt_og_image__/client/_nuxt/error-500.b422d33f.js">
11
- <script type="module" src="/__nuxt_og_image__/client/_nuxt/entry.5e420308.js" crossorigin></script><script>"use strict";(()=>{const a=window,e=document.documentElement,m=["dark","light"],c=window.localStorage.getItem("nuxt-color-mode")||"system";let n=c==="system"?f():c;const l=e.getAttribute("data-color-mode-forced");l&&(n=l),i(n),a["__NUXT_COLOR_MODE__"]={preference:c,value:n,getColorScheme:f,addColorScheme:i,removeColorScheme:d};function i(o){const t=""+o+"",s="";e.classList?e.classList.add(t):e.className+=" "+t,s&&e.setAttribute("data-"+s,o)}function d(o){const t=""+o+"",s="";e.classList?e.classList.remove(t):e.className=e.className.replace(new RegExp(t,"g"),""),s&&e.removeAttribute("data-"+s)}function r(o){return a.matchMedia("(prefers-color-scheme"+o+")")}function f(){if(a.matchMedia&&r("").media!=="not all"){for(const o of m)if(r(":"+o).matches)return o}return"light"}})();
10
+ <link rel="prefetch" as="script" crossorigin href="/__nuxt_og_image__/client/_nuxt/error-500.d22f8b54.js">
11
+ <script type="module" src="/__nuxt_og_image__/client/_nuxt/entry.00dd4948.js" crossorigin></script><script>"use strict";(()=>{const a=window,e=document.documentElement,m=["dark","light"],c=window.localStorage.getItem("nuxt-color-mode")||"system";let n=c==="system"?f():c;const l=e.getAttribute("data-color-mode-forced");l&&(n=l),i(n),a["__NUXT_COLOR_MODE__"]={preference:c,value:n,getColorScheme:f,addColorScheme:i,removeColorScheme:d};function i(o){const t=""+o+"",s="";e.classList?e.classList.add(t):e.className+=" "+t,s&&e.setAttribute("data-"+s,o)}function d(o){const t=""+o+"",s="";e.classList?e.classList.remove(t):e.className=e.className.replace(new RegExp(t,"g"),""),s&&e.removeAttribute("data-"+s)}function r(o){return a.matchMedia("(prefers-color-scheme"+o+")")}function f(){if(a.matchMedia&&r("").media!=="not all"){for(const o of m)if(r(":"+o).matches)return o}return"light"}})();
12
12
  </script></head>
13
13
  <body ><div id="__nuxt"></div><script type="application/json" id="__NUXT_DATA__" data-ssr="false">[{"_errors":1,"serverRendered":2,"data":3,"state":4},{},false,{},{}]</script>
14
14
  <script>window.__NUXT__={};window.__NUXT__.config={public:{},app:{baseURL:"/__nuxt_og_image__/client",buildAssetsDir:"/_nuxt/",cdnURL:""}}</script></body>
package/dist/module.d.mts CHANGED
@@ -49,7 +49,7 @@ interface RuntimeCompatibilitySchema {
49
49
  satori: false | 'default' | 'yoga-wasm';
50
50
  wasm: 'inline' | 'import' | 'fetch';
51
51
  png: 'resvg-wasm' | 'svg2png' | 'resvg-node';
52
- inlineCss?: 'node' | 'mock';
52
+ cssInline?: 'node' | 'mock';
53
53
  node?: boolean;
54
54
  wasmImportQuery?: string;
55
55
  }
package/dist/module.d.ts CHANGED
@@ -49,7 +49,7 @@ interface RuntimeCompatibilitySchema {
49
49
  satori: false | 'default' | 'yoga-wasm';
50
50
  wasm: 'inline' | 'import' | 'fetch';
51
51
  png: 'resvg-wasm' | 'svg2png' | 'resvg-node';
52
- inlineCss?: 'node' | 'mock';
52
+ cssInline?: 'node' | 'mock';
53
53
  node?: boolean;
54
54
  wasmImportQuery?: string;
55
55
  }
package/dist/module.json CHANGED
@@ -5,5 +5,5 @@
5
5
  "bridge": false
6
6
  },
7
7
  "configKey": "ogImage",
8
- "version": "2.0.25"
8
+ "version": "2.0.28"
9
9
  }
package/dist/module.mjs CHANGED
@@ -21,7 +21,7 @@ import { createBirpcGroup } from 'birpc';
21
21
  import { stringify, parse } from 'flatted';
22
22
  import { addDependency } from 'nypm';
23
23
 
24
- const version = "2.0.25";
24
+ const version = "2.0.28";
25
25
 
26
26
  async function createBrowser() {
27
27
  if (process.dev || process.env.prerender) {
@@ -334,7 +334,7 @@ function getNitroProviderCompatibility(defaults, nuxt = useNuxt()) {
334
334
  compatibility = lookup || {};
335
335
  }
336
336
  compatibility = defu$1(compatibility, defaults);
337
- compatibility.inlineCss = compatibility.inlineCss || (compatibility.node ? "node" : "mock");
337
+ compatibility.cssInline = compatibility.cssInline || (compatibility.node ? "node" : "mock");
338
338
  return compatibility;
339
339
  }
340
340
  function ensureDependencies(nuxt, dep) {
@@ -648,9 +648,9 @@ export default function() {
648
648
  return png
649
649
  }
650
650
  `;
651
- nitroConfig.virtual["#nuxt-og-image/inline-css"] = `import inlineCss from '${providerPath}/inline-css/${nitroCompatibility.inlineCss || "mock"}'
651
+ nitroConfig.virtual["#nuxt-og-image/css-inline"] = `import cssInline from '${providerPath}/css-inline/${nitroCompatibility.cssInline || "mock"}'
652
652
  export default function() {
653
- return inlineCss
653
+ return cssInline
654
654
  }
655
655
  `;
656
656
  }
@@ -1,12 +1,14 @@
1
1
  import type { OgImageOptions, OgImageScreenshotOptions } from '../types';
2
2
  export declare function defineOgImageScreenshot(options?: OgImageScreenshotOptions): Promise<void>;
3
3
  /**
4
+ * @param options
4
5
  * @deprecated Use `defineOgImage` or `defineOgImageCached` instead
5
6
  */
6
7
  export declare function defineOgImageStatic(options?: OgImageOptions): Promise<void>;
7
8
  export declare function defineOgImageCached(options?: OgImageOptions): Promise<void>;
8
9
  export declare function defineOgImageWithoutCache(options?: OgImageOptions): Promise<void>;
9
10
  /**
11
+ * @param options
10
12
  * @deprecated Use `defineOgImageWithoutCache` instead
11
13
  */
12
14
  export declare function defineOgImageDynamic(options?: OgImageOptions): Promise<void>;
@@ -64,6 +64,7 @@ export async function defineOgImage(_options = {}) {
64
64
  {
65
65
  id: "nuxt-og-image-options",
66
66
  type: "application/json",
67
+ processTemplateParams: true,
67
68
  innerHTML: () => {
68
69
  const payload = {
69
70
  title: "%s"
@@ -1,4 +1,4 @@
1
- declare function nodeFn(html: string, options: any): any;
1
+ declare function nodeFn(html: string, options: any): string;
2
2
  declare namespace nodeFn {
3
3
  var __mock: boolean;
4
4
  }
@@ -0,0 +1,10 @@
1
+ import { inline } from "css-inline";
2
+ function nodeFn(html, options) {
3
+ return inline(html, {
4
+ ...options,
5
+ load_remote_stylesheets: false,
6
+ keep_style_tags: false
7
+ });
8
+ }
9
+ nodeFn.__mock = false;
10
+ export default nodeFn;
@@ -7,7 +7,7 @@ import twemoji from "twemoji";
7
7
  import { defu } from "defu";
8
8
  import { fetchOptionsCached } from "../utils.mjs";
9
9
  import { useNitroOrigin, useRuntimeConfig } from "#imports";
10
- import loadInlineCSS from "#nuxt-og-image/inline-css";
10
+ import loadCSSInline from "#nuxt-og-image/css-inline";
11
11
  export default defineEventHandler(async (e) => {
12
12
  const { fonts, satoriOptions } = useRuntimeConfig()["nuxt-og-image"];
13
13
  const query = getQuery(e);
@@ -130,8 +130,8 @@ img.emoji {
130
130
  <head>${headChunk.headTags}</head>
131
131
  <body ${headChunk.bodyAttrs}>${headChunk.bodyTagsOpen}<div style="position: relative; display: flex; margin: 0 auto; width: ${options.width}px; height: ${options.height}px; overflow: hidden;">${html}</div>${headChunk.bodyTags}</body>
132
132
  </html>`;
133
- const inlineCss = loadInlineCSS();
134
- if (!inlineCss.__mock) {
133
+ const cssInline = loadCSSInline();
134
+ if (!cssInline.__mock) {
135
135
  let hasInlineStyles = false;
136
136
  const stylesheets = htmlTemplate.match(/<link rel="stylesheet" href=".*?">/g);
137
137
  if (stylesheets) {
@@ -157,7 +157,7 @@ img.emoji {
157
157
  }
158
158
  if (hasInlineStyles) {
159
159
  try {
160
- htmlTemplate = await inlineCss(htmlTemplate, {
160
+ htmlTemplate = await cssInline(htmlTemplate, {
161
161
  url: nitroOrigin
162
162
  });
163
163
  } catch {
package/package.json CHANGED
@@ -1,8 +1,8 @@
1
1
  {
2
2
  "name": "nuxt-og-image",
3
3
  "type": "module",
4
- "version": "2.0.25",
5
- "packageManager": "pnpm@8.7.4",
4
+ "version": "2.0.28",
5
+ "packageManager": "pnpm@8.7.5",
6
6
  "description": "Enlightened OG Image generation for Nuxt.",
7
7
  "license": "MIT",
8
8
  "funding": "https://github.com/sponsors/harlan-zw",
@@ -27,13 +27,14 @@
27
27
  "dist"
28
28
  ],
29
29
  "dependencies": {
30
- "@nuxt/kit": "^3.7.1",
30
+ "@nuxt/kit": "^3.7.3",
31
31
  "@resvg/resvg-js": "^2.4.1",
32
32
  "@resvg/resvg-wasm": "^2.4.1",
33
33
  "@types/fs-extra": "^11.0.1",
34
34
  "birpc": "0.2.14",
35
35
  "chalk": "^5.3.0",
36
36
  "chrome-launcher": "^1.0.0",
37
+ "css-inline": "^0.10.5",
37
38
  "defu": "^6.1.2",
38
39
  "execa": "^8.0.1",
39
40
  "fast-glob": "^3.3.1",
@@ -41,15 +42,14 @@
41
42
  "fs-extra": "^11.1.1",
42
43
  "globby": "^13.2.2",
43
44
  "image-size": "^1.0.2",
44
- "inline-css": "^4.0.2",
45
45
  "launch-editor": "^2.6.0",
46
- "nuxt-site-config": "^1.0.11",
47
- "nuxt-site-config-kit": "^1.0.11",
48
- "nypm": "^0.3.2",
46
+ "nuxt-site-config": "^1.2.1",
47
+ "nuxt-site-config-kit": "^1.2.1",
48
+ "nypm": "^0.3.3",
49
49
  "ofetch": "^1.3.3",
50
50
  "ohash": "^1.1.3",
51
51
  "pathe": "^1.1.1",
52
- "playwright-core": "^1.37.1",
52
+ "playwright-core": "^1.38.0",
53
53
  "radix3": "^1.1.0",
54
54
  "satori": "0.10.4",
55
55
  "satori-html": "^0.3.2",
@@ -60,24 +60,24 @@
60
60
  "tinyws": "^0.1.0",
61
61
  "twemoji": "^14.0.2",
62
62
  "ufo": "^1.3.0",
63
- "ws": "^8.13.0",
63
+ "ws": "^8.14.1",
64
64
  "yoga-wasm-web": "^0.3.3"
65
65
  },
66
66
  "devDependencies": {
67
- "@antfu/eslint-config": "^0.41.0",
68
- "@nuxt/devtools": "0.8.2",
67
+ "@antfu/eslint-config": "^0.42.0",
68
+ "@nuxt/devtools": "0.8.3",
69
69
  "@nuxt/module-builder": "^0.5.1",
70
- "@nuxt/test-utils": "3.7.1",
70
+ "@nuxt/test-utils": "3.7.3",
71
71
  "@nuxtjs/eslint-config-typescript": "^12.1.0",
72
72
  "@types/ws": "^8.5.5",
73
73
  "bumpp": "^9.2.0",
74
- "eslint": "8.48.0",
74
+ "eslint": "8.49.0",
75
75
  "jest-image-snapshot": "^6.2.0",
76
- "nuxt": "^3.7.1",
76
+ "nuxt": "^3.7.3",
77
77
  "nuxt-icon": "^0.5.0",
78
- "playwright": "^1.37.1",
79
- "sass": "^1.66.1",
80
- "vitest": "^0.34.3"
78
+ "playwright": "^1.38.0",
79
+ "sass": "^1.67.0",
80
+ "vitest": "^0.34.4"
81
81
  },
82
82
  "scripts": {
83
83
  "build": "pnpm dev:prepare && pnpm build:module && pnpm build:client",
@@ -1 +0,0 @@
1
- span[data-v-651cc619]{background-color:currentColor;display:inline-block;-webkit-mask-image:var(--11106f94);mask-image:var(--11106f94);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;vertical-align:middle}
@@ -1 +0,0 @@
1
- import{g as l,H as _,I as m,n as o,o as f,c as d,s as S,_ as g}from"./entry.5e420308.js";const x=l({__name:"IconCSS",props:{name:{type:String,required:!0},size:{type:String,default:""}},setup(r){const n=r;_(e=>({"11106f94":u.value}));const s=m(),p=o(()=>{var e;return((((e=s.nuxtIcon)==null?void 0:e.aliases)||{})[n.name]||n.name).replace(/^i-/,"")}),u=o(()=>`url('https://api.iconify.design/${p.value.replace(":","/")}.svg')`),c=o(()=>{var t,a,i;if(!n.size&&typeof((t=s.nuxtIcon)==null?void 0:t.size)=="boolean"&&!((a=s.nuxtIcon)!=null&&a.size))return;const e=n.size||((i=s.nuxtIcon)==null?void 0:i.size)||"1em";return String(Number(e))===e?`${e}px`:e});return(e,t)=>(f(),d("span",{style:S({width:c.value,height:c.value})},null,4))}});const z=g(x,[["__scopeId","data-v-651cc619"]]);export{z as default};
@@ -1,11 +0,0 @@
1
- import inlineCss from "inline-css";
2
- function nodeFn(html, options) {
3
- return inlineCss(html, {
4
- ...options,
5
- applyLinkTags: false,
6
- removeLinkTags: false,
7
- removeStyleTags: false
8
- });
9
- }
10
- nodeFn.__mock = false;
11
- export default nodeFn;