@json-render/image 0.1.0

package/dist/catalog.d.ts

@@ -0,0 +1,265 @@
+import { z } from 'zod';
+
+/**
+ * Standard component definitions for image catalogs.
+ *
+ * These define the available image components with their Zod prop schemas.
+ * All components render to Satori-compatible JSX (HTML-like elements with
+ * inline CSS flexbox styles).
+ */
+declare const standardComponentDefinitions: {
+    Frame: {
+        props: z.ZodObject<{
+            width: z.ZodNumber;
+            height: z.ZodNumber;
+            backgroundColor: z.ZodNullable<z.ZodString>;
+            padding: z.ZodNullable<z.ZodNumber>;
+            display: z.ZodNullable<z.ZodEnum<{
+                flex: "flex";
+                none: "none";
+            }>>;
+            flexDirection: z.ZodNullable<z.ZodEnum<{
+                row: "row";
+                column: "column";
+            }>>;
+            alignItems: z.ZodNullable<z.ZodEnum<{
+                "flex-start": "flex-start";
+                center: "center";
+                "flex-end": "flex-end";
+                stretch: "stretch";
+            }>>;
+            justifyContent: z.ZodNullable<z.ZodEnum<{
+                "flex-start": "flex-start";
+                center: "center";
+                "flex-end": "flex-end";
+                "space-between": "space-between";
+                "space-around": "space-around";
+            }>>;
+        }, z.core.$strip>;
+        slots: string[];
+        description: string;
+        example: {
+            width: number;
+            height: number;
+            backgroundColor: string;
+        };
+    };
+    Box: {
+        props: z.ZodObject<{
+            padding: z.ZodNullable<z.ZodNumber>;
+            paddingTop: z.ZodNullable<z.ZodNumber>;
+            paddingBottom: z.ZodNullable<z.ZodNumber>;
+            paddingLeft: z.ZodNullable<z.ZodNumber>;
+            paddingRight: z.ZodNullable<z.ZodNumber>;
+            margin: z.ZodNullable<z.ZodNumber>;
+            backgroundColor: z.ZodNullable<z.ZodString>;
+            borderWidth: z.ZodNullable<z.ZodNumber>;
+            borderColor: z.ZodNullable<z.ZodString>;
+            borderRadius: z.ZodNullable<z.ZodNumber>;
+            flex: z.ZodNullable<z.ZodNumber>;
+            width: z.ZodNullable<z.ZodUnion<readonly [z.ZodNumber, z.ZodString]>>;
+            height: z.ZodNullable<z.ZodUnion<readonly [z.ZodNumber, z.ZodString]>>;
+            alignItems: z.ZodNullable<z.ZodEnum<{
+                "flex-start": "flex-start";
+                center: "center";
+                "flex-end": "flex-end";
+                stretch: "stretch";
+            }>>;
+            justifyContent: z.ZodNullable<z.ZodEnum<{
+                "flex-start": "flex-start";
+                center: "center";
+                "flex-end": "flex-end";
+                "space-between": "space-between";
+                "space-around": "space-around";
+            }>>;
+            flexDirection: z.ZodNullable<z.ZodEnum<{
+                row: "row";
+                column: "column";
+            }>>;
+            position: z.ZodNullable<z.ZodEnum<{
+                relative: "relative";
+                absolute: "absolute";
+            }>>;
+            top: z.ZodNullable<z.ZodNumber>;
+            left: z.ZodNullable<z.ZodNumber>;
+            right: z.ZodNullable<z.ZodNumber>;
+            bottom: z.ZodNullable<z.ZodNumber>;
+            overflow: z.ZodNullable<z.ZodEnum<{
+                visible: "visible";
+                hidden: "hidden";
+            }>>;
+        }, z.core.$strip>;
+        slots: string[];
+        description: string;
+        example: {
+            padding: number;
+            backgroundColor: string;
+            borderRadius: number;
+            alignItems: string;
+        };
+    };
+    Row: {
+        props: z.ZodObject<{
+            gap: z.ZodNullable<z.ZodNumber>;
+            alignItems: z.ZodNullable<z.ZodEnum<{
+                "flex-start": "flex-start";
+                center: "center";
+                "flex-end": "flex-end";
+                stretch: "stretch";
+            }>>;
+            justifyContent: z.ZodNullable<z.ZodEnum<{
+                "flex-start": "flex-start";
+                center: "center";
+                "flex-end": "flex-end";
+                "space-between": "space-between";
+                "space-around": "space-around";
+            }>>;
+            padding: z.ZodNullable<z.ZodNumber>;
+            flex: z.ZodNullable<z.ZodNumber>;
+            wrap: z.ZodNullable<z.ZodBoolean>;
+        }, z.core.$strip>;
+        slots: string[];
+        description: string;
+        example: {
+            gap: number;
+            alignItems: string;
+        };
+    };
+    Column: {
+        props: z.ZodObject<{
+            gap: z.ZodNullable<z.ZodNumber>;
+            alignItems: z.ZodNullable<z.ZodEnum<{
+                "flex-start": "flex-start";
+                center: "center";
+                "flex-end": "flex-end";
+                stretch: "stretch";
+            }>>;
+            justifyContent: z.ZodNullable<z.ZodEnum<{
+                "flex-start": "flex-start";
+                center: "center";
+                "flex-end": "flex-end";
+                "space-between": "space-between";
+                "space-around": "space-around";
+            }>>;
+            padding: z.ZodNullable<z.ZodNumber>;
+            flex: z.ZodNullable<z.ZodNumber>;
+        }, z.core.$strip>;
+        slots: string[];
+        description: string;
+        example: {
+            gap: number;
+            padding: number;
+        };
+    };
+    Heading: {
+        props: z.ZodObject<{
+            text: z.ZodString;
+            level: z.ZodNullable<z.ZodEnum<{
+                h1: "h1";
+                h2: "h2";
+                h3: "h3";
+                h4: "h4";
+            }>>;
+            color: z.ZodNullable<z.ZodString>;
+            align: z.ZodNullable<z.ZodEnum<{
+                center: "center";
+                left: "left";
+                right: "right";
+            }>>;
+            letterSpacing: z.ZodNullable<z.ZodUnion<readonly [z.ZodNumber, z.ZodString]>>;
+            lineHeight: z.ZodNullable<z.ZodNumber>;
+        }, z.core.$strip>;
+        slots: never[];
+        description: string;
+        example: {
+            text: string;
+            level: string;
+            color: string;
+        };
+    };
+    Text: {
+        props: z.ZodObject<{
+            text: z.ZodString;
+            fontSize: z.ZodNullable<z.ZodNumber>;
+            color: z.ZodNullable<z.ZodString>;
+            align: z.ZodNullable<z.ZodEnum<{
+                center: "center";
+                left: "left";
+                right: "right";
+            }>>;
+            fontWeight: z.ZodNullable<z.ZodEnum<{
+                normal: "normal";
+                bold: "bold";
+            }>>;
+            fontStyle: z.ZodNullable<z.ZodEnum<{
+                normal: "normal";
+                italic: "italic";
+            }>>;
+            lineHeight: z.ZodNullable<z.ZodNumber>;
+            letterSpacing: z.ZodNullable<z.ZodUnion<readonly [z.ZodNumber, z.ZodString]>>;
+            textDecoration: z.ZodNullable<z.ZodEnum<{
+                none: "none";
+                underline: "underline";
+                "line-through": "line-through";
+            }>>;
+        }, z.core.$strip>;
+        slots: never[];
+        description: string;
+        example: {
+            text: string;
+            fontSize: number;
+            color: string;
+        };
+    };
+    Image: {
+        props: z.ZodObject<{
+            src: z.ZodString;
+            width: z.ZodNullable<z.ZodNumber>;
+            height: z.ZodNullable<z.ZodNumber>;
+            borderRadius: z.ZodNullable<z.ZodNumber>;
+            objectFit: z.ZodNullable<z.ZodEnum<{
+                none: "none";
+                contain: "contain";
+                cover: "cover";
+                fill: "fill";
+            }>>;
+        }, z.core.$strip>;
+        slots: never[];
+        description: string;
+        example: {
+            src: string;
+            width: number;
+            height: number;
+        };
+    };
+    Divider: {
+        props: z.ZodObject<{
+            color: z.ZodNullable<z.ZodString>;
+            thickness: z.ZodNullable<z.ZodNumber>;
+            marginTop: z.ZodNullable<z.ZodNumber>;
+            marginBottom: z.ZodNullable<z.ZodNumber>;
+        }, z.core.$strip>;
+        slots: never[];
+        description: string;
+        example: {
+            color: string;
+            thickness: number;
+        };
+    };
+    Spacer: {
+        props: z.ZodObject<{
+            height: z.ZodNullable<z.ZodNumber>;
+        }, z.core.$strip>;
+        slots: never[];
+        description: string;
+        example: {
+            height: number;
+        };
+    };
+};
+type StandardComponentDefinitions = typeof standardComponentDefinitions;
+type StandardComponentProps<K extends keyof StandardComponentDefinitions> = StandardComponentDefinitions[K]["props"] extends {
+    _output: infer O;
+} ? O : z.output<StandardComponentDefinitions[K]["props"]>;
+
+export { type StandardComponentDefinitions, type StandardComponentProps, standardComponentDefinitions };

package/dist/catalog.js

@@ -0,0 +1,207 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/catalog.ts
+var catalog_exports = {};
+__export(catalog_exports, {
+  standardComponentDefinitions: () => standardComponentDefinitions
+});
+module.exports = __toCommonJS(catalog_exports);
+var import_zod = require("zod");
+var standardComponentDefinitions = {
+  // ==========================================================================
+  // Root
+  // ==========================================================================
+  Frame: {
+    props: import_zod.z.object({
+      width: import_zod.z.number(),
+      height: import_zod.z.number(),
+      backgroundColor: import_zod.z.string().nullable(),
+      padding: import_zod.z.number().nullable(),
+      display: import_zod.z.enum(["flex", "none"]).nullable(),
+      flexDirection: import_zod.z.enum(["row", "column"]).nullable(),
+      alignItems: import_zod.z.enum(["flex-start", "center", "flex-end", "stretch"]).nullable(),
+      justifyContent: import_zod.z.enum([
+        "flex-start",
+        "center",
+        "flex-end",
+        "space-between",
+        "space-around"
+      ]).nullable()
+    }),
+    slots: ["default"],
+    description: "Root image container. Defines the output image dimensions and background. Must be the root element.",
+    example: { width: 1200, height: 630, backgroundColor: "#ffffff" }
+  },
+  // ==========================================================================
+  // Layout Components
+  // ==========================================================================
+  Box: {
+    props: import_zod.z.object({
+      padding: import_zod.z.number().nullable(),
+      paddingTop: import_zod.z.number().nullable(),
+      paddingBottom: import_zod.z.number().nullable(),
+      paddingLeft: import_zod.z.number().nullable(),
+      paddingRight: import_zod.z.number().nullable(),
+      margin: import_zod.z.number().nullable(),
+      backgroundColor: import_zod.z.string().nullable(),
+      borderWidth: import_zod.z.number().nullable(),
+      borderColor: import_zod.z.string().nullable(),
+      borderRadius: import_zod.z.number().nullable(),
+      flex: import_zod.z.number().nullable(),
+      width: import_zod.z.union([import_zod.z.number(), import_zod.z.string()]).nullable(),
+      height: import_zod.z.union([import_zod.z.number(), import_zod.z.string()]).nullable(),
+      alignItems: import_zod.z.enum(["flex-start", "center", "flex-end", "stretch"]).nullable(),
+      justifyContent: import_zod.z.enum([
+        "flex-start",
+        "center",
+        "flex-end",
+        "space-between",
+        "space-around"
+      ]).nullable(),
+      flexDirection: import_zod.z.enum(["row", "column"]).nullable(),
+      position: import_zod.z.enum(["relative", "absolute"]).nullable(),
+      top: import_zod.z.number().nullable(),
+      left: import_zod.z.number().nullable(),
+      right: import_zod.z.number().nullable(),
+      bottom: import_zod.z.number().nullable(),
+      overflow: import_zod.z.enum(["visible", "hidden"]).nullable()
+    }),
+    slots: ["default"],
+    description: "Generic container with padding, margin, background, border, and flex alignment. Supports absolute positioning.",
+    example: {
+      padding: 20,
+      backgroundColor: "#f9f9f9",
+      borderRadius: 8,
+      alignItems: "center"
+    }
+  },
+  Row: {
+    props: import_zod.z.object({
+      gap: import_zod.z.number().nullable(),
+      alignItems: import_zod.z.enum(["flex-start", "center", "flex-end", "stretch"]).nullable(),
+      justifyContent: import_zod.z.enum([
+        "flex-start",
+        "center",
+        "flex-end",
+        "space-between",
+        "space-around"
+      ]).nullable(),
+      padding: import_zod.z.number().nullable(),
+      flex: import_zod.z.number().nullable(),
+      wrap: import_zod.z.boolean().nullable()
+    }),
+    slots: ["default"],
+    description: "Horizontal flex layout. Use for placing elements side by side.",
+    example: { gap: 10, alignItems: "center" }
+  },
+  Column: {
+    props: import_zod.z.object({
+      gap: import_zod.z.number().nullable(),
+      alignItems: import_zod.z.enum(["flex-start", "center", "flex-end", "stretch"]).nullable(),
+      justifyContent: import_zod.z.enum([
+        "flex-start",
+        "center",
+        "flex-end",
+        "space-between",
+        "space-around"
+      ]).nullable(),
+      padding: import_zod.z.number().nullable(),
+      flex: import_zod.z.number().nullable()
+    }),
+    slots: ["default"],
+    description: "Vertical flex layout. Use for stacking elements top to bottom.",
+    example: { gap: 8, padding: 10 }
+  },
+  // ==========================================================================
+  // Content Components
+  // ==========================================================================
+  Heading: {
+    props: import_zod.z.object({
+      text: import_zod.z.string(),
+      level: import_zod.z.enum(["h1", "h2", "h3", "h4"]).nullable(),
+      color: import_zod.z.string().nullable(),
+      align: import_zod.z.enum(["left", "center", "right"]).nullable(),
+      letterSpacing: import_zod.z.union([import_zod.z.number(), import_zod.z.string()]).nullable(),
+      lineHeight: import_zod.z.number().nullable()
+    }),
+    slots: [],
+    description: "Heading text at various levels. h1 is largest, h4 is smallest.",
+    example: { text: "Hello World", level: "h1", color: "#000000" }
+  },
+  Text: {
+    props: import_zod.z.object({
+      text: import_zod.z.string(),
+      fontSize: import_zod.z.number().nullable(),
+      color: import_zod.z.string().nullable(),
+      align: import_zod.z.enum(["left", "center", "right"]).nullable(),
+      fontWeight: import_zod.z.enum(["normal", "bold"]).nullable(),
+      fontStyle: import_zod.z.enum(["normal", "italic"]).nullable(),
+      lineHeight: import_zod.z.number().nullable(),
+      letterSpacing: import_zod.z.union([import_zod.z.number(), import_zod.z.string()]).nullable(),
+      textDecoration: import_zod.z.enum(["none", "underline", "line-through"]).nullable()
+    }),
+    slots: [],
+    description: "Body text with configurable size, color, weight, and alignment.",
+    example: { text: "Some content here.", fontSize: 16, color: "#333333" }
+  },
+  Image: {
+    props: import_zod.z.object({
+      src: import_zod.z.string(),
+      width: import_zod.z.number().nullable(),
+      height: import_zod.z.number().nullable(),
+      borderRadius: import_zod.z.number().nullable(),
+      objectFit: import_zod.z.enum(["contain", "cover", "fill", "none"]).nullable()
+    }),
+    slots: [],
+    description: "Image from a URL. Specify width and/or height to control size. For placeholder images use https://picsum.photos/{width}/{height}?random={n}.",
+    example: {
+      src: "https://picsum.photos/400/300?random=1",
+      width: 400,
+      height: 300
+    }
+  },
+  // ==========================================================================
+  // Decorative Components
+  // ==========================================================================
+  Divider: {
+    props: import_zod.z.object({
+      color: import_zod.z.string().nullable(),
+      thickness: import_zod.z.number().nullable(),
+      marginTop: import_zod.z.number().nullable(),
+      marginBottom: import_zod.z.number().nullable()
+    }),
+    slots: [],
+    description: "Horizontal line separator between content sections.",
+    example: { color: "#e5e7eb", thickness: 1 }
+  },
+  Spacer: {
+    props: import_zod.z.object({
+      height: import_zod.z.number().nullable()
+    }),
+    slots: [],
+    description: "Empty vertical space between elements.",
+    example: { height: 20 }
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  standardComponentDefinitions
+});
+//# sourceMappingURL=catalog.js.map

package/dist/catalog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/catalog.ts"],"sourcesContent":["import { z } from \"zod\";\n\n/**\n * Standard component definitions for image catalogs.\n *\n * These define the available image components with their Zod prop schemas.\n * All components render to Satori-compatible JSX (HTML-like elements with\n * inline CSS flexbox styles).\n */\nexport const standardComponentDefinitions = {\n  // ==========================================================================\n  // Root\n  // ==========================================================================\n\n  Frame: {\n    props: z.object({\n      width: z.number(),\n      height: z.number(),\n      backgroundColor: z.string().nullable(),\n      padding: z.number().nullable(),\n      display: z.enum([\"flex\", \"none\"]).nullable(),\n      flexDirection: z.enum([\"row\", \"column\"]).nullable(),\n      alignItems: z\n        .enum([\"flex-start\", \"center\", \"flex-end\", \"stretch\"])\n        .nullable(),\n      justifyContent: z\n        .enum([\n          \"flex-start\",\n          \"center\",\n          \"flex-end\",\n          \"space-between\",\n          \"space-around\",\n        ])\n        .nullable(),\n    }),\n    slots: [\"default\"],\n    description:\n      \"Root image container. Defines the output image dimensions and background. Must be the root element.\",\n    example: { width: 1200, height: 630, backgroundColor: \"#ffffff\" },\n  },\n\n  // ==========================================================================\n  // Layout Components\n  // ==========================================================================\n\n  Box: {\n    props: z.object({\n      padding: z.number().nullable(),\n      paddingTop: z.number().nullable(),\n      paddingBottom: z.number().nullable(),\n      paddingLeft: z.number().nullable(),\n      paddingRight: z.number().nullable(),\n      margin: z.number().nullable(),\n      backgroundColor: z.string().nullable(),\n      borderWidth: z.number().nullable(),\n      borderColor: z.string().nullable(),\n      borderRadius: z.number().nullable(),\n      flex: z.number().nullable(),\n      width: z.union([z.number(), z.string()]).nullable(),\n      height: z.union([z.number(), z.string()]).nullable(),\n      alignItems: z\n        .enum([\"flex-start\", \"center\", \"flex-end\", \"stretch\"])\n        .nullable(),\n      justifyContent: z\n        .enum([\n          \"flex-start\",\n          \"center\",\n          \"flex-end\",\n          \"space-between\",\n          \"space-around\",\n        ])\n        .nullable(),\n      flexDirection: z.enum([\"row\", \"column\"]).nullable(),\n      position: z.enum([\"relative\", \"absolute\"]).nullable(),\n      top: z.number().nullable(),\n      left: z.number().nullable(),\n      right: z.number().nullable(),\n      bottom: z.number().nullable(),\n      overflow: z.enum([\"visible\", \"hidden\"]).nullable(),\n    }),\n    slots: [\"default\"],\n    description:\n      \"Generic container with padding, margin, background, border, and flex alignment. Supports absolute positioning.\",\n    example: {\n      padding: 20,\n      backgroundColor: \"#f9f9f9\",\n      borderRadius: 8,\n      alignItems: \"center\",\n    },\n  },\n\n  Row: {\n    props: z.object({\n      gap: z.number().nullable(),\n      alignItems: z\n        .enum([\"flex-start\", \"center\", \"flex-end\", \"stretch\"])\n        .nullable(),\n      justifyContent: z\n        .enum([\n          \"flex-start\",\n          \"center\",\n          \"flex-end\",\n          \"space-between\",\n          \"space-around\",\n        ])\n        .nullable(),\n      padding: z.number().nullable(),\n      flex: z.number().nullable(),\n      wrap: z.boolean().nullable(),\n    }),\n    slots: [\"default\"],\n    description:\n      \"Horizontal flex layout. Use for placing elements side by side.\",\n    example: { gap: 10, alignItems: \"center\" },\n  },\n\n  Column: {\n    props: z.object({\n      gap: z.number().nullable(),\n      alignItems: z\n        .enum([\"flex-start\", \"center\", \"flex-end\", \"stretch\"])\n        .nullable(),\n      justifyContent: z\n        .enum([\n          \"flex-start\",\n          \"center\",\n          \"flex-end\",\n          \"space-between\",\n          \"space-around\",\n        ])\n        .nullable(),\n      padding: z.number().nullable(),\n      flex: z.number().nullable(),\n    }),\n    slots: [\"default\"],\n    description:\n      \"Vertical flex layout. Use for stacking elements top to bottom.\",\n    example: { gap: 8, padding: 10 },\n  },\n\n  // ==========================================================================\n  // Content Components\n  // ==========================================================================\n\n  Heading: {\n    props: z.object({\n      text: z.string(),\n      level: z.enum([\"h1\", \"h2\", \"h3\", \"h4\"]).nullable(),\n      color: z.string().nullable(),\n      align: z.enum([\"left\", \"center\", \"right\"]).nullable(),\n      letterSpacing: z.union([z.number(), z.string()]).nullable(),\n      lineHeight: z.number().nullable(),\n    }),\n    slots: [],\n    description:\n      \"Heading text at various levels. h1 is largest, h4 is smallest.\",\n    example: { text: \"Hello World\", level: \"h1\", color: \"#000000\" },\n  },\n\n  Text: {\n    props: z.object({\n      text: z.string(),\n      fontSize: z.number().nullable(),\n      color: z.string().nullable(),\n      align: z.enum([\"left\", \"center\", \"right\"]).nullable(),\n      fontWeight: z.enum([\"normal\", \"bold\"]).nullable(),\n      fontStyle: z.enum([\"normal\", \"italic\"]).nullable(),\n      lineHeight: z.number().nullable(),\n      letterSpacing: z.union([z.number(), z.string()]).nullable(),\n      textDecoration: z.enum([\"none\", \"underline\", \"line-through\"]).nullable(),\n    }),\n    slots: [],\n    description:\n      \"Body text with configurable size, color, weight, and alignment.\",\n    example: { text: \"Some content here.\", fontSize: 16, color: \"#333333\" },\n  },\n\n  Image: {\n    props: z.object({\n      src: z.string(),\n      width: z.number().nullable(),\n      height: z.number().nullable(),\n      borderRadius: z.number().nullable(),\n      objectFit: z.enum([\"contain\", \"cover\", \"fill\", \"none\"]).nullable(),\n    }),\n    slots: [],\n    description:\n      \"Image from a URL. Specify width and/or height to control size. For placeholder images use https://picsum.photos/{width}/{height}?random={n}.\",\n    example: {\n      src: \"https://picsum.photos/400/300?random=1\",\n      width: 400,\n      height: 300,\n    },\n  },\n\n  // ==========================================================================\n  // Decorative Components\n  // ==========================================================================\n\n  Divider: {\n    props: z.object({\n      color: z.string().nullable(),\n      thickness: z.number().nullable(),\n      marginTop: z.number().nullable(),\n      marginBottom: z.number().nullable(),\n    }),\n    slots: [],\n    description: \"Horizontal line separator between content sections.\",\n    example: { color: \"#e5e7eb\", thickness: 1 },\n  },\n\n  Spacer: {\n    props: z.object({\n      height: z.number().nullable(),\n    }),\n    slots: [],\n    description: \"Empty vertical space between elements.\",\n    example: { height: 20 },\n  },\n};\n\nexport type StandardComponentDefinitions = typeof standardComponentDefinitions;\n\nexport type StandardComponentProps<\n  K extends keyof StandardComponentDefinitions,\n> = StandardComponentDefinitions[K][\"props\"] extends { _output: infer O }\n  ? O\n  : z.output<StandardComponentDefinitions[K][\"props\"]>;\n"],"mappings":"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","names":[]}

package/dist/catalog.mjs

@@ -0,0 +1,7 @@
+import {
+  standardComponentDefinitions
+} from "./chunk-PMEELRVP.mjs";
+export {
+  standardComponentDefinitions
+};
+//# sourceMappingURL=catalog.mjs.map

package/dist/catalog.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-A67OT34V.mjs

@@ -0,0 +1,41 @@
+// src/schema.ts
+import { defineSchema } from "@json-render/core";
+var schema = defineSchema(
+  (s) => ({
+    spec: s.object({
+      root: s.string(),
+      elements: s.record(
+        s.object({
+          type: s.ref("catalog.components"),
+          props: s.propsOf("catalog.components"),
+          children: s.array(s.string()),
+          visible: s.any()
+        })
+      )
+    }),
+    catalog: s.object({
+      components: s.map({
+        props: s.zod(),
+        slots: s.array(s.string()),
+        description: s.string(),
+        example: s.any()
+      })
+    })
+  }),
+  {
+    defaultRules: [
+      "The root element MUST be a Frame component. It defines the image dimensions (width, height) and background.",
+      "Frame width and height determine the output image size. Common sizes: 1200x630 (OG image), 1080x1080 (social square), 1920x1080 (banner).",
+      "Use Row for horizontal layouts and Column for vertical layouts. Both support gap, align, and justify props.",
+      "All text content must use Heading or Text components. Raw strings are not supported.",
+      "Image src must be a fully qualified URL. For placeholder images, use https://picsum.photos/{width}/{height}?random={n}.",
+      "Satori renders a subset of CSS: flexbox layout, borders, backgrounds, text styling. Absolute positioning is supported via position/top/left/right/bottom.",
+      "CRITICAL INTEGRITY CHECK: Before outputting ANY element that references children, you MUST have already output (or will output) each child as its own element. If an element has children: ['a', 'b'], then elements 'a' and 'b' MUST exist."
+    ]
+  }
+);
+
+export {
+  schema
+};
+//# sourceMappingURL=chunk-A67OT34V.mjs.map

package/dist/chunk-A67OT34V.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/schema.ts"],"sourcesContent":["import { defineSchema } from \"@json-render/core\";\n\n/**\n * The schema for @json-render/image\n *\n * Defines:\n * - Spec: A flat tree of elements with keys, types, props, and children references\n * - Catalog: Components with props schemas\n *\n * Reuses the same { root, elements } spec format as the React and React PDF renderers.\n */\nexport const schema = defineSchema(\n  (s) => ({\n    spec: s.object({\n      root: s.string(),\n      elements: s.record(\n        s.object({\n          type: s.ref(\"catalog.components\"),\n          props: s.propsOf(\"catalog.components\"),\n          children: s.array(s.string()),\n          visible: s.any(),\n        }),\n      ),\n    }),\n\n    catalog: s.object({\n      components: s.map({\n        props: s.zod(),\n        slots: s.array(s.string()),\n        description: s.string(),\n        example: s.any(),\n      }),\n    }),\n  }),\n  {\n    defaultRules: [\n      \"The root element MUST be a Frame component. It defines the image dimensions (width, height) and background.\",\n      \"Frame width and height determine the output image size. Common sizes: 1200x630 (OG image), 1080x1080 (social square), 1920x1080 (banner).\",\n      \"Use Row for horizontal layouts and Column for vertical layouts. Both support gap, align, and justify props.\",\n      \"All text content must use Heading or Text components. Raw strings are not supported.\",\n      \"Image src must be a fully qualified URL. For placeholder images, use https://picsum.photos/{width}/{height}?random={n}.\",\n      \"Satori renders a subset of CSS: flexbox layout, borders, backgrounds, text styling. Absolute positioning is supported via position/top/left/right/bottom.\",\n      \"CRITICAL INTEGRITY CHECK: Before outputting ANY element that references children, you MUST have already output (or will output) each child as its own element. If an element has children: ['a', 'b'], then elements 'a' and 'b' MUST exist.\",\n    ],\n  },\n);\n\nexport type ImageSchema = typeof schema;\n\nexport type ImageSpec<TCatalog> = typeof schema extends {\n  createCatalog: (catalog: TCatalog) => { _specType: infer S };\n}\n  ? S\n  : never;\n"],"mappings":";AAAA,SAAS,oBAAoB;AAWtB,IAAM,SAAS;AAAA,EACpB,CAAC,OAAO;AAAA,IACN,MAAM,EAAE,OAAO;AAAA,MACb,MAAM,EAAE,OAAO;AAAA,MACf,UAAU,EAAE;AAAA,QACV,EAAE,OAAO;AAAA,UACP,MAAM,EAAE,IAAI,oBAAoB;AAAA,UAChC,OAAO,EAAE,QAAQ,oBAAoB;AAAA,UACrC,UAAU,EAAE,MAAM,EAAE,OAAO,CAAC;AAAA,UAC5B,SAAS,EAAE,IAAI;AAAA,QACjB,CAAC;AAAA,MACH;AAAA,IACF,CAAC;AAAA,IAED,SAAS,EAAE,OAAO;AAAA,MAChB,YAAY,EAAE,IAAI;AAAA,QAChB,OAAO,EAAE,IAAI;AAAA,QACb,OAAO,EAAE,MAAM,EAAE,OAAO,CAAC;AAAA,QACzB,aAAa,EAAE,OAAO;AAAA,QACtB,SAAS,EAAE,IAAI;AAAA,MACjB,CAAC;AAAA,IACH,CAAC;AAAA,EACH;AAAA,EACA;AAAA,IACE,cAAc;AAAA,MACZ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;","names":[]}