@ethercorps/sveltekit-og 3.0.0 → 4.0.0-next.1

package/README.md

@@ -43,7 +43,7 @@ const fontFile = await fetch('https://og-playground.vercel.app/inter-latin-ext-4
 const fontData: ArrayBuffer = await fontFile.arrayBuffer();
 
 export const GET: RequestHandler = async () => {
-  return await ImageResponse(template, {
+  return await new ImageResponse(template, {
     height: 630,
     width: 1200,
     fonts: [

package/dist/api.d.ts

@@ -1,7 +1,6 @@
-/// <reference types="node" />
-import type { ImageResponseOptions } from './types.js';
-import type { SvelteComponent } from "svelte";
-export declare const og: (element: string | SvelteComponent, options: ImageResponseOptions, props?: {}) => Promise<string | Buffer>;
+import type { ComponentOptions, ImageResponseOptions } from './types.js';
+import { SvelteComponent } from "svelte";
+export declare const og: (element: string | typeof SvelteComponent, options: ImageResponseOptions, componentOptions: ComponentOptions) => Promise<any>;
 export declare class ImageResponse extends Response {
-    constructor(element: string | SvelteComponent, options?: ImageResponseOptions, props?: {});
+    constructor(element: string | typeof SvelteComponent, options: ImageResponseOptions | undefined, { props, style }: ComponentOptions);
 }

package/dist/api.js

@@ -2,8 +2,9 @@ import satori from 'satori';
 import { Resvg } from '@resvg/resvg-js';
 import { loadGoogleFont } from './font.js';
 import { toReactElement, svelteComponentToJsx } from "@ethercorps/svelte-h2j";
-export const og = async (element, options, props = {}) => {
-    const reactElement = typeof element === 'string' ? toReactElement(element) : svelteComponentToJsx(element, props);
+import { SvelteComponent } from "svelte";
+export const og = async (element, options, componentOptions) => {
+    const reactElement = typeof element === 'string' ? toReactElement(element) : svelteComponentToJsx(element, componentOptions);
     // render the React element-like object into an SVG
     const svg = await satori(reactElement, {
         width: options.width || 1200,
@@ -40,11 +41,11 @@ export const og = async (element, options, props = {}) => {
     return pngBuffer;
 };
 export class ImageResponse extends Response {
-    constructor(element, options = {}, props = {}) {
+    constructor(element, options = {}, { props = {}, style = '' }) {
         super();
         const body = new ReadableStream({
             async start(controller) {
-                const buffer = await og(element, options, props);
+                const buffer = await og(element, options, { props, style });
                 controller.enqueue(buffer);
                 controller.close();
             }

package/dist/index.d.ts

@@ -1,2 +1,2 @@
 export { ImageResponse } from "./api.js";
-export type { ImageResponseOptions } from "./types.js";
+export type { ImageResponseOptions, ComponentOptions } from "./types.js";

package/dist/types.d.ts

@@ -9,3 +9,7 @@ export interface ImageResponseOptions {
     headers?: Record<string, string>;
     format?: 'svg' | 'png';
 }
+export type ComponentOptions = {
+    props?: Record<string, any>;
+    style?: string;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@ethercorps/sveltekit-og",
-	"version": "3.0.0",
+	"version": "4.0.0-next.1",
 	"scripts": {
 		"dev": "vite dev",
 		"build": "vite build && npm run package",
@@ -26,12 +26,13 @@
 		"!dist/**/*.spec.*"
 	],
 	"peerDependencies": {
-		"svelte": "^4.0.0"
+		"svelte": "^5.0.0"
 	},
 	"devDependencies": {
-		"@sveltejs/adapter-auto": "^2.1.1",
-		"@sveltejs/kit": "^1.30.3",
+		"@sveltejs/adapter-auto": "^3.0.0",
+		"@sveltejs/kit": "^2.0.0",
 		"@sveltejs/package": "^2.2.5",
+		"@sveltejs/vite-plugin-svelte": "^3.0.0",
 		"@typescript-eslint/eslint-plugin": "^5.62.0",
 		"@typescript-eslint/parser": "^5.62.0",
 		"css-tree": "^2.3.1",
@@ -41,19 +42,19 @@
 		"prettier": "^2.8.8",
 		"prettier-plugin-svelte": "^2.10.1",
 		"publint": "^0.1.16",
-		"svelte": "^4.2.8",
+		"svelte": "^5.0.0-next.153",
 		"svelte-check": "^3.6.3",
 		"tslib": "^2.6.2",
 		"typescript": "^5.3.3",
-		"vite": "^4.5.1",
-		"vitest": "^0.34.6"
+		"vite": "^5.0.0",
+		"vitest": "^1.0.0"
 	},
 	"svelte": "./dist/index.js",
 	"types": "./dist/index.d.ts",
 	"type": "module",
 	"dependencies": {
-		"@ethercorps/svelte-h2j": "^0.1.0",
+		"@ethercorps/svelte-h2j": "5.0.0-next.2",
 		"@resvg/resvg-js": "^2.6.0",
 		"satori": "^0.10.11"
 	}
-}
+}