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

package/dist/runtime/components/OgImage/Cached.d.ts

@@ -1,5 +0,0 @@
-import type { OgImageOptions } from '../../types';
-declare const _default: import("vue").DefineComponent<OgImageOptions, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<OgImageOptions>>, {
-    [x: string]: any;
-}, {}>;
-export default _default;

package/dist/runtime/components/OgImage/Cached.mjs

@@ -1,10 +0,0 @@
-import { defineComponent } from "vue";
-import { defineOgImageCached } from "#imports";
-export default defineComponent({
-  name: "OgImageCached",
-  async setup(_, { attrs }) {
-    if (import.meta.server)
-      await defineOgImageCached(attrs);
-    return () => null;
-  }
-});

package/dist/runtime/components/OgImage/Dynamic.d.ts

@@ -1,8 +0,0 @@
-import type { OgImageOptions } from '../../types';
-/**
- * @deprecated Use OgImageWithoutCache
- */
-declare const _default: import("vue").DefineComponent<OgImageOptions, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<OgImageOptions>>, {
-    [x: string]: any;
-}, {}>;
-export default _default;

package/dist/runtime/components/OgImage/Dynamic.mjs

@@ -1,10 +0,0 @@
-import { defineComponent } from "vue";
-import { defineOgImageWithoutCache } from "#imports";
-export default defineComponent({
-  name: "OgImageDynamic",
-  async setup(_, { attrs }) {
-    if (import.meta.server)
-      await defineOgImageWithoutCache(attrs);
-    return () => null;
-  }
-});

package/dist/runtime/components/OgImage/Screenshot.d.ts

@@ -1,6 +0,0 @@
-import type { OgImageScreenshotOptions } from '../../types';
-declare const _default: import("vue").DefineComponent<OgImageScreenshotOptions, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<OgImageScreenshotOptions>>, {
-    [x: string]: any;
-    [x: number]: any;
-}, {}>;
-export default _default;

package/dist/runtime/components/OgImage/Static.d.ts

@@ -1,8 +0,0 @@
-import type { OgImageOptions } from '../../types';
-/**
- * @deprecated Use OgImageCached instead
- */
-declare const _default: import("vue").DefineComponent<OgImageOptions, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<OgImageOptions>>, {
-    [x: string]: any;
-}, {}>;
-export default _default;

package/dist/runtime/components/OgImage/Static.mjs

@@ -1,10 +0,0 @@
-import { defineComponent } from "vue";
-import { defineOgImageCached } from "#imports";
-export default defineComponent({
-  name: "OgImageStatic",
-  async setup(_, { attrs }) {
-    if (import.meta.server)
-      await defineOgImageCached(attrs);
-    return () => null;
-  }
-});

package/dist/runtime/components/OgImage/WithoutCache.d.ts

@@ -1,5 +0,0 @@
-import type { OgImageOptions } from '../../types';
-declare const _default: import("vue").DefineComponent<OgImageOptions, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<OgImageOptions>>, {
-    [x: string]: any;
-}, {}>;
-export default _default;

package/dist/runtime/components/OgImage/WithoutCache.mjs

@@ -1,10 +0,0 @@
-import { defineComponent } from "vue";
-import { defineOgImageWithoutCache } from "#imports";
-export default defineComponent({
-  name: "OgImageWithoutCache",
-  async setup(_, { attrs }) {
-    if (import.meta.server)
-      defineOgImageWithoutCache(attrs);
-    return () => null;
-  }
-});

package/dist/runtime/components/OgImage/index.d.ts

@@ -1,5 +0,0 @@
-import type { OgImageOptions } from '../../types';
-declare const _default: import("vue").DefineComponent<OgImageOptions, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<OgImageOptions>>, {
-    [x: string]: any;
-}, {}>;
-export default _default;

package/dist/runtime/components/Templates/Official/Fallback.vue

@@ -1,147 +0,0 @@
-<script setup lang="ts">
-import { computed, defineComponent, h, resolveComponent } from 'vue'
-import { useRuntimeConfig, useSiteConfig } from '#imports'
-
-// inherited attrs can mess up the satori parser
-defineOptions({
-  inheritAttrs: false,
-})
-
-// convert to typescript props
-const props = withDefaults(defineProps<{
-  colorMode?: 'dark' | 'light'
-  title?: string
-  description?: string
-  icon?: string | boolean
-  siteName?: string
-  siteLogo?: string
-  theme?: string
-}>(), {
-  theme: '#00dc82',
-  colorMode: 'dark',
-  title: 'title',
-})
-
-const backgroundAttrs = computed(() => {
-  // we want to make a
-  // const isBackgroundTw = props.background?.startsWith('bg-')
-  return {
-    style: {
-      display: 'flex',
-      position: 'absolute',
-      width: '100%',
-      height: '100%',
-      background: props.colorMode === 'dark' ? 'rgba(5, 5, 5,1)' : 'rgb(255, 255, 255)',
-    },
-  }
-})
-
-const backgroundFlareAttrs = computed(() => {
-  // we want to make a
-  // const isBackgroundTw = props.background?.startsWith('bg-')
-  // need to convert hex to RGB, i.e #123123 -> 18, 49, 35
-  const rgbColor = props.theme
-    .replace('#', '')
-    .match(/.{1,2}/g)
-    ?.map(v => Number.parseInt(v, 16))
-    .join(', ')
-  return {
-    style: {
-      display: 'flex',
-      position: 'absolute',
-      right: '-100%',
-      top: '0%',
-      width: '200%',
-      height: '200%',
-      backgroundImage: `radial-gradient(circle, rgba(${rgbColor}, 0.5) 0%,  ${props.colorMode === 'dark' ? 'rgba(5, 5, 5,0.3)' : 'rgba(255, 255, 255, 0.7)'} 50%, ${props.colorMode === 'dark' ? 'rgba(5, 5, 5,0)' : 'rgba(255, 255, 255, 0)'} 70%)`,
-    },
-  }
-})
-
-const containerAttrs = computed(() => {
-  const classes = [
-    'w-full',
-    'h-full',
-    'flex',
-    'justify-between',
-    props.colorMode === 'dark' ? 'text-gray-100' : 'text-gray-900',
-    'relative',
-  ]
-  const styles: Record<string, any> = {
-    padding: '5rem',
-  }
-  return { class: classes, style: styles }
-})
-
-const titleAttrs = computed(() => {
-  return { style: {
-    fontWeight: 'bold',
-    marginBottom: '50px',
-    fontSize: '75px',
-    maxWidth: !props.icon ? '70%' : undefined,
-  } }
-})
-
-const descriptionAttrs = computed(() => {
-  return { style: {
-    fontSize: '35px',
-    lineHeight: `1.5rem`,
-    opacity: '0.8',
-  } }
-})
-
-const siteConfig = useSiteConfig()
-const siteName = computed(() => {
-  return props.siteName || siteConfig.name
-})
-const siteLogo = computed(() => {
-  return props.siteLogo || siteConfig.logo
-})
-
-const runtimeConfig = useRuntimeConfig()['nuxt-og-image']
-
-const IconComponent = runtimeConfig.hasNuxtIcon
-  ? resolveComponent('Icon')
-  : defineComponent({
-    render() {
-      return h('div', 'missing nuxt-icon')
-    },
-  })
-if (typeof props.icon === 'string' && !runtimeConfig.hasNuxtIcon && process.dev) {
-  console.warn('Please install `nuxt-icon` to use icons with the fallback OG Image component.')
-  // eslint-disable-next-line no-console
-  console.log('\nnpm add -D nuxt-icon\n')
-  // create simple div renderer component
-}
-</script>
-
-<template>
-  <div v-bind="backgroundAttrs" />
-  <div v-bind="backgroundFlareAttrs" />
-  <div v-bind="containerAttrs">
-    <div class="flex flex-row justify-between items-center">
-      <div class="flex flex-col w-full" :style="icon ? { width: '65%' } : {}">
-        <div v-bind="titleAttrs">
-          {{ title || 'Null Title' }}
-        </div>
-        <div v-if="description" v-bind="descriptionAttrs">
-          {{ description }}
-        </div>
-      </div>
-      <div v-if="icon" style="width: 30%;" class="flex justify-end">
-        <IconComponent :name="icon" size="250px" style="margin: 0 auto 0 100px;opacity: 0.9;" />
-      </div>
-    </div>
-    <div class="flex flex-row justify-center items-center text-left w-full">
-      <img v-if="siteLogo" :src="siteLogo" height="30">
-      <template v-else>
-        <svg height="50" width="50" class="mr-3" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
-          <path :fill="theme.includes('#') ? theme : `#${theme}`" d="M62.3,-53.9C74.4,-34.5,73.5,-9,67.1,13.8C60.6,36.5,48.7,56.5,30.7,66.1C12.7,75.7,-11.4,74.8,-31.6,65.2C-51.8,55.7,-67.9,37.4,-73.8,15.7C-79.6,-6,-75.1,-31.2,-61.1,-51C-47.1,-70.9,-23.6,-85.4,0.8,-86C25.1,-86.7,50.2,-73.4,62.3,-53.9Z" transform="translate(100 100)" />
-        </svg>
-        <div v-if="siteName" style="font-size: 25px;" class="font-bold">
-          {{ siteName }}
-        </div>
-      </template>
-    </div>
-  </div>
-</template>

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

@@ -1,5 +0,0 @@
-declare const mockFn: {
-    (s: string): string;
-    __mock: boolean;
-};
-export default mockFn;

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

@@ -1,3 +0,0 @@
-const mockFn = (s) => s;
-mockFn.__mock = true;
-export default mockFn;

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

@@ -1,7 +0,0 @@
-import _satori, { init } from "satori/wasm";
-import initYoga from "yoga-wasm-web";
-import YogaWasm from "yoga-wasm-web/dist/yoga.wasm";
-export default {
-  initWasmPromise: initYoga(YogaWasm).then((yoga) => init(yoga)),
-  satori: _satori
-};

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

@@ -1,2 +0,0 @@
-import sharp from '@img/sharp-wasm32/package.json';
-export default sharp;

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

@@ -1,2 +0,0 @@
-import sharp from "@img/sharp-wasm32/package.json";
-export default sharp;

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

@@ -1 +0,0 @@
-export declare const fontCache: Record<string, any>;

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

@@ -1 +0,0 @@
-export const fontCache = {};

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

@@ -1,3 +0,0 @@
-import { type H3Event } from 'h3';
-import type { RendererOptions, RuntimeOgImageOptions } from '../../types';
-export declare function fetchHTML(e: H3Event, options: RuntimeOgImageOptions | RendererOptions): Promise<string>;

package/dist/runtime/core/options/normalise.d.ts

@@ -1,2 +0,0 @@
-import type { OgImageOptions } from '../../types';
-export declare function normaliseOptions(_options: OgImageOptions): any;

package/dist/runtime/core/options/normalise.mjs

@@ -1,26 +0,0 @@
-import { unref, useRuntimeConfig } from "#imports";
-import { componentNames } from "#build/og-image-component-names.mjs";
-export function normaliseOptions(_options) {
-  const { runtimeSatori } = useRuntimeConfig()["nuxt-og-image"];
-  const options = { ...unref(_options) };
-  if (options.static)
-    options.cache = options.cache || options.static;
-  if (options.provider === "satori")
-    options.renderer = options.renderer || "satori";
-  else if (options.provider === "browser")
-    options.renderer = options.renderer || "chromium";
-  options.renderer = options.renderer || "satori";
-  if (options.renderer === "satori" && !runtimeSatori)
-    options.renderer = "chromium";
-  if (options.component && componentNames) {
-    const originalName = options.component;
-    for (const component of componentNames) {
-      if (component.pascalName.endsWith(originalName) || component.kebabName.endsWith(originalName)) {
-        options.component = component.pascalName;
-        options.componentHash = component.hash;
-        break;
-      }
-    }
-  }
-  return options;
-}

package/dist/runtime/core/renderers/satori/fonts.d.ts

@@ -1,3 +0,0 @@
-import type { FontConfig } from '../../../types';
-export declare const satoriFonts: any[];
-export declare function loadFonts(baseURL: string, fonts: FontConfig[]): Promise<any>;

package/dist/runtime/core/renderers/satori/fonts.mjs

@@ -1,8 +0,0 @@
-import { loadFont } from "../../font/fetch.mjs";
-export const satoriFonts = [];
-let fontLoadPromise = null;
-export function loadFonts(baseURL, fonts) {
-  if (fontLoadPromise)
-    return fontLoadPromise;
-  return fontLoadPromise = Promise.all(fonts.map((font) => loadFont(baseURL, font)));
-}

package/dist/runtime/nuxt/plugins/nuxt-content-canonical-urls.mjs

@@ -1,29 +0,0 @@
-import { parseURL } from "ufo";
-import { toValue } from "vue";
-import { isInternalRoute } from "../../utilts.mjs";
-import { useRequestEvent, withSiteUrl } from "#imports";
-export default defineNuxtPlugin((nuxtApp) => {
-  nuxtApp.hooks.hook("app:rendered", async (ctx) => {
-    const { ssrContext } = ctx;
-    const e = useRequestEvent();
-    const path = parseURL(e.path).pathname;
-    if (isInternalRoute(path))
-      return;
-    ssrContext?.head.use({
-      key: "nuxt-og-image:canonical-urls",
-      hooks: {
-        "tags:resolve": async ({ tags }) => {
-          for (const tag of tags) {
-            if (tag.tag === "meta" && (tag.props.property === "og:image" || tag.props.name === "twitter:image:src")) {
-              if (!tag.props.content.startsWith("https")) {
-                await nuxtApp.runWithContext(() => {
-                  tag.props.content = toValue(withSiteUrl(tag.props.content));
-                });
-              }
-            }
-          }
-        }
-      }
-    });
-  });
-});

package/dist/runtime/server/routes/__og-image__/image-[path]-og.[extension].mjs

@@ -1,45 +0,0 @@
-import { H3Error, createError, defineEventHandler, setHeader } from "h3";
-import { resolveRendererContext } from "../../../core/utils/resolveRendererContext.mjs";
-import { fetchHTML } from "../../../core/html/fetch.mjs";
-import { useSiteConfig } from "#imports";
-export default defineEventHandler(async (e) => {
-  const ctx = await resolveRendererContext(e);
-  if (ctx instanceof H3Error)
-    return ctx;
-  const { extension, options, renderer } = ctx;
-  if (!options.cacheTtl || import.meta.dev) {
-    setHeader(e, "Cache-Control", "no-cache, no-store, must-revalidate");
-    setHeader(e, "Pragma", "no-cache");
-    setHeader(e, "Expires", "0");
-  }
-  switch (extension) {
-    case "html":
-      setHeader(e, "Content-Type", `text/html`);
-      return fetchHTML(e, options);
-    case "json":
-      setHeader(e, "Content-Type", "application/json");
-      return {
-        ...ctx,
-        siteConfig: useSiteConfig(e),
-        vnodes: options.renderer === "satori" ? await renderer.createImage(e, { ...options, extension: "json" }) : void 0
-      };
-    case "svg":
-    case "png":
-    case "jpeg":
-    case "jpg":
-      if (!renderer.supportedFormats.includes(options.extension)) {
-        return createError({
-          statusCode: 400,
-          statusMessage: `Generating ${options.extension}'s with ${renderer.name} is not supported.`
-        });
-      }
-      setHeader(e, "Content-Type", `image/${options.extension === "svg" ? "svg+xml" : options.extension}`);
-      break;
-    default:
-      return createError({
-        statusCode: 400,
-        statusMessage: `Invalid request for og.${options.extension}.`
-      });
-  }
-  return renderer.createImage(e, options);
-});

package/dist/runtime/utilts.d.ts

@@ -1,2 +0,0 @@
-export declare function getOgImagePath(pagePath: string, extension?: string): string;
-export declare function isInternalRoute(path: string): boolean;

package/dist/runtime/utilts.mjs

@@ -1,8 +0,0 @@
-import { joinURL } from "ufo";
-export function getOgImagePath(pagePath, extension = "png") {
-  return joinURL("/__og-image__/image", pagePath, `og.${extension}`);
-}
-export function isInternalRoute(path) {
-  const lastSegment = path.split("/").pop() || path;
-  return lastSegment.includes(".") || path.startsWith("/__") || path.startsWith("@");
-}