loopwind 0.18.1 → 0.19.0

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.
@@ -0,0 +1,94 @@
1
+ /**
2
+ * Compile JSX template source to plain JavaScript
3
+ *
4
+ * This function transforms JSX syntax to React.createElement calls using Babel.
5
+ * Use this in your admin panel, build pipeline, or anywhere you need to compile
6
+ * user-generated JSX templates before storing or deploying them.
7
+ *
8
+ * **When to use this:**
9
+ * - In admin panels where users edit templates in a code editor
10
+ * - In build pipelines that process templates before deployment
11
+ * - Before storing templates in a database
12
+ *
13
+ * **Benefits:**
14
+ * - Compile JSX at save time instead of runtime
15
+ * - Catch syntax errors early (before production)
16
+ * - Reduce production bundle size (no Babel in production)
17
+ * - Faster rendering (no compilation overhead)
18
+ *
19
+ * @example
20
+ * ```typescript
21
+ * // In your admin panel API
22
+ * import { compileTemplate } from 'loopwind/sdk/compiler';
23
+ *
24
+ * export async function POST(req: Request) {
25
+ * const { templateId, jsxCode } = await req.json();
26
+ *
27
+ * try {
28
+ * // Compile JSX to JavaScript
29
+ * const compiled = compileTemplate(jsxCode);
30
+ *
31
+ * // Save compiled version to database
32
+ * await db.templates.update(templateId, {
33
+ * sourceCode: compiled,
34
+ * updatedAt: new Date()
35
+ * });
36
+ *
37
+ * return Response.json({ success: true });
38
+ * } catch (error) {
39
+ * return Response.json({
40
+ * error: 'Compilation failed',
41
+ * message: error.message
42
+ * }, { status: 400 });
43
+ * }
44
+ * }
45
+ * ```
46
+ *
47
+ * @example
48
+ * ```typescript
49
+ * // Input JSX
50
+ * const jsxSource = `
51
+ * export const meta = {
52
+ * name: 'card',
53
+ * size: { width: 1200, height: 630 }
54
+ * };
55
+ *
56
+ * export default ({ tw, title }) => (
57
+ * <div style={tw('flex items-center justify-center w-full h-full bg-blue-500')}>
58
+ * <h1 style={tw('text-6xl font-bold text-white')}>{title}</h1>
59
+ * </div>
60
+ * );
61
+ * `;
62
+ *
63
+ * // Compile to plain JavaScript
64
+ * const compiled = compileTemplate(jsxSource);
65
+ *
66
+ * // compiled now contains React.createElement calls
67
+ * // You can safely use this with defineTemplateFromSource in production
68
+ * ```
69
+ *
70
+ * @param jsxSource - Template source code containing JSX syntax
71
+ * @returns Compiled JavaScript with React.createElement calls
72
+ * @throws Error if the JSX syntax is invalid or compilation fails
73
+ */
74
+ export declare function compileTemplate(jsxSource: string): string;
75
+ /**
76
+ * Check if source code contains JSX syntax
77
+ *
78
+ * This is a simple heuristic check that looks for common JSX patterns.
79
+ * Use this to determine if source code needs compilation.
80
+ *
81
+ * @example
82
+ * ```typescript
83
+ * const code1 = '<div>Hello</div>';
84
+ * const code2 = 'React.createElement("div", null, "Hello")';
85
+ *
86
+ * containsJSX(code1); // true
87
+ * containsJSX(code2); // false
88
+ * ```
89
+ *
90
+ * @param sourceCode - Source code to check
91
+ * @returns true if the code appears to contain JSX
92
+ */
93
+ export declare function containsJSX(sourceCode: string): boolean;
94
+ //# sourceMappingURL=compiler.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"compiler.d.ts","sourceRoot":"","sources":["../../src/sdk/compiler.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwEG;AACH,wBAAgB,eAAe,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,CAiBzD;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,WAAW,CAAC,UAAU,EAAE,MAAM,GAAG,OAAO,CAcvD"}
@@ -0,0 +1,122 @@
1
+ import * as Babel from '@babel/standalone';
2
+ /**
3
+ * Compile JSX template source to plain JavaScript
4
+ *
5
+ * This function transforms JSX syntax to React.createElement calls using Babel.
6
+ * Use this in your admin panel, build pipeline, or anywhere you need to compile
7
+ * user-generated JSX templates before storing or deploying them.
8
+ *
9
+ * **When to use this:**
10
+ * - In admin panels where users edit templates in a code editor
11
+ * - In build pipelines that process templates before deployment
12
+ * - Before storing templates in a database
13
+ *
14
+ * **Benefits:**
15
+ * - Compile JSX at save time instead of runtime
16
+ * - Catch syntax errors early (before production)
17
+ * - Reduce production bundle size (no Babel in production)
18
+ * - Faster rendering (no compilation overhead)
19
+ *
20
+ * @example
21
+ * ```typescript
22
+ * // In your admin panel API
23
+ * import { compileTemplate } from 'loopwind/sdk/compiler';
24
+ *
25
+ * export async function POST(req: Request) {
26
+ * const { templateId, jsxCode } = await req.json();
27
+ *
28
+ * try {
29
+ * // Compile JSX to JavaScript
30
+ * const compiled = compileTemplate(jsxCode);
31
+ *
32
+ * // Save compiled version to database
33
+ * await db.templates.update(templateId, {
34
+ * sourceCode: compiled,
35
+ * updatedAt: new Date()
36
+ * });
37
+ *
38
+ * return Response.json({ success: true });
39
+ * } catch (error) {
40
+ * return Response.json({
41
+ * error: 'Compilation failed',
42
+ * message: error.message
43
+ * }, { status: 400 });
44
+ * }
45
+ * }
46
+ * ```
47
+ *
48
+ * @example
49
+ * ```typescript
50
+ * // Input JSX
51
+ * const jsxSource = `
52
+ * export const meta = {
53
+ * name: 'card',
54
+ * size: { width: 1200, height: 630 }
55
+ * };
56
+ *
57
+ * export default ({ tw, title }) => (
58
+ * <div style={tw('flex items-center justify-center w-full h-full bg-blue-500')}>
59
+ * <h1 style={tw('text-6xl font-bold text-white')}>{title}</h1>
60
+ * </div>
61
+ * );
62
+ * `;
63
+ *
64
+ * // Compile to plain JavaScript
65
+ * const compiled = compileTemplate(jsxSource);
66
+ *
67
+ * // compiled now contains React.createElement calls
68
+ * // You can safely use this with defineTemplateFromSource in production
69
+ * ```
70
+ *
71
+ * @param jsxSource - Template source code containing JSX syntax
72
+ * @returns Compiled JavaScript with React.createElement calls
73
+ * @throws Error if the JSX syntax is invalid or compilation fails
74
+ */
75
+ export function compileTemplate(jsxSource) {
76
+ try {
77
+ const result = Babel.transform(jsxSource, {
78
+ presets: ['react'],
79
+ filename: 'template.tsx',
80
+ });
81
+ if (!result.code) {
82
+ throw new Error('Babel compilation returned empty code');
83
+ }
84
+ return result.code;
85
+ }
86
+ catch (error) {
87
+ throw new Error(`Failed to compile JSX template: ${error instanceof Error ? error.message : String(error)}`);
88
+ }
89
+ }
90
+ /**
91
+ * Check if source code contains JSX syntax
92
+ *
93
+ * This is a simple heuristic check that looks for common JSX patterns.
94
+ * Use this to determine if source code needs compilation.
95
+ *
96
+ * @example
97
+ * ```typescript
98
+ * const code1 = '<div>Hello</div>';
99
+ * const code2 = 'React.createElement("div", null, "Hello")';
100
+ *
101
+ * containsJSX(code1); // true
102
+ * containsJSX(code2); // false
103
+ * ```
104
+ *
105
+ * @param sourceCode - Source code to check
106
+ * @returns true if the code appears to contain JSX
107
+ */
108
+ export function containsJSX(sourceCode) {
109
+ // Look for JSX-like patterns:
110
+ // - Opening tags: <div, <Component
111
+ // - Self-closing tags: <div />, <Component />
112
+ // - JSX fragments: <>, </>
113
+ const jsxPatterns = [
114
+ /<[A-Za-z][A-Za-z0-9]*\s/, // <div , <Component
115
+ /<[A-Za-z][A-Za-z0-9]*>/, // <div>, <Component>
116
+ /<[A-Za-z][A-Za-z0-9]*\s*\/>/, // <div/>, <Component />
117
+ /<>\s*/, // Fragment opening
118
+ /<\/>\s*/, // Fragment closing
119
+ ];
120
+ return jsxPatterns.some((pattern) => pattern.test(sourceCode));
121
+ }
122
+ //# sourceMappingURL=compiler.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"compiler.js","sourceRoot":"","sources":["../../src/sdk/compiler.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,mBAAmB,CAAC;AAE3C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwEG;AACH,MAAM,UAAU,eAAe,CAAC,SAAiB;IAC/C,IAAI,CAAC;QACH,MAAM,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC,SAAS,EAAE;YACxC,OAAO,EAAE,CAAC,OAAO,CAAC;YAClB,QAAQ,EAAE,cAAc;SACzB,CAAC,CAAC;QAEH,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;YACjB,MAAM,IAAI,KAAK,CAAC,uCAAuC,CAAC,CAAC;QAC3D,CAAC;QAED,OAAO,MAAM,CAAC,IAAI,CAAC;IACrB,CAAC;IAAC,OAAO,KAAK,EAAE,CAAC;QACf,MAAM,IAAI,KAAK,CACb,mCAAmC,KAAK,YAAY,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,CAC5F,CAAC;IACJ,CAAC;AACH,CAAC;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,UAAU,WAAW,CAAC,UAAkB;IAC5C,8BAA8B;IAC9B,mCAAmC;IACnC,8CAA8C;IAC9C,2BAA2B;IAC3B,MAAM,WAAW,GAAG;QAClB,yBAAyB,EAAE,oBAAoB;QAC/C,wBAAwB,EAAE,qBAAqB;QAC/C,6BAA6B,EAAE,wBAAwB;QACvD,OAAO,EAAE,mBAAmB;QAC5B,SAAS,EAAE,mBAAmB;KAC/B,CAAC;IAEF,OAAO,WAAW,CAAC,IAAI,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC;AACjE,CAAC"}
@@ -1,5 +1,5 @@
1
1
  import type { TemplateDefinition, StyleConfig } from './template.js';
2
- export { defineTemplate, defineTemplateFromFile, defineTemplateFromSource, defineTemplateFromSchema } from './template.js';
2
+ export { defineTemplate, defineTemplateFromSource, defineTemplateFromSchema } from './template.js';
3
3
  export type { TemplateDefinition, StyleConfig, TemplateSchema, SchemaElement } from './template.js';
4
4
  /**
5
5
  * Render options for image generation
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/sdk/index.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAQrE,OAAO,EAAE,cAAc,EAAE,sBAAsB,EAAE,wBAAwB,EAAE,wBAAwB,EAAE,MAAM,eAAe,CAAC;AAC3H,YAAY,EAAE,kBAAkB,EAAE,WAAW,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAEpG;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,MAAM,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,KAAK,GAAG,MAAM,GAAG,KAAK,CAAC;IACjD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB;AAED;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,KAAK,GAAG,QAAQ,KAAK,IAAI,CAAC;IAC9E,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAsB,WAAW,CAAC,MAAM,GAAG,GAAG,EAC5C,QAAQ,EAAE,kBAAkB,CAAC,MAAM,CAAC,EACpC,KAAK,EAAE,MAAM,EACb,OAAO,GAAE,kBAAuB,GAC/B,OAAO,CAAC,MAAM,CAAC,CAoDjB;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAsB,WAAW,CAAC,MAAM,GAAG,GAAG,EAC5C,QAAQ,EAAE,kBAAkB,CAAC,MAAM,CAAC,EACpC,KAAK,EAAE,MAAM,EACb,OAAO,GAAE,kBAAuB,GAC/B,OAAO,CAAC,MAAM,CAAC,CA+CjB"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/sdk/index.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAQrE,OAAO,EAAE,cAAc,EAAE,wBAAwB,EAAE,wBAAwB,EAAE,MAAM,eAAe,CAAC;AACnG,YAAY,EAAE,kBAAkB,EAAE,WAAW,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAEpG;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,MAAM,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,KAAK,GAAG,MAAM,GAAG,KAAK,CAAC;IACjD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB;AAED;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,KAAK,GAAG,QAAQ,KAAK,IAAI,CAAC;IAC9E,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAsB,WAAW,CAAC,MAAM,GAAG,GAAG,EAC5C,QAAQ,EAAE,kBAAkB,CAAC,MAAM,CAAC,EACpC,KAAK,EAAE,MAAM,EACb,OAAO,GAAE,kBAAuB,GAC/B,OAAO,CAAC,MAAM,CAAC,CAoDjB;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAsB,WAAW,CAAC,MAAM,GAAG,GAAG,EAC5C,QAAQ,EAAE,kBAAkB,CAAC,MAAM,CAAC,EACpC,KAAK,EAAE,MAAM,EACb,OAAO,GAAE,kBAAuB,GAC/B,OAAO,CAAC,MAAM,CAAC,CA+CjB"}
package/dist/sdk/index.js CHANGED
@@ -4,7 +4,7 @@ import { renderVideo as renderVideoInternal } from '../lib/video-renderer.js';
4
4
  import fs from 'fs/promises';
5
5
  import path from 'path';
6
6
  import os from 'os';
7
- export { defineTemplate, defineTemplateFromFile, defineTemplateFromSource, defineTemplateFromSchema } from './template.js';
7
+ export { defineTemplate, defineTemplateFromSource, defineTemplateFromSchema } from './template.js';
8
8
  /**
9
9
  * Render an image from a template definition
10
10
  *
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/sdk/index.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/sdk/index.ts"],"names":[],"mappings":"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"}
@@ -15,25 +15,6 @@ export interface TemplateDefinition<TProps = any> {
15
15
  config?: StyleConfig;
16
16
  render: (props: TProps & TemplateProps) => JSX.Element;
17
17
  }
18
- /**
19
- * Define a template programmatically for use in serverless environments
20
- *
21
- * @example
22
- * ```typescript
23
- * const ogImage = defineTemplate({
24
- * name: 'og-image',
25
- * type: 'image',
26
- * size: { width: 1200, height: 630 },
27
- * render: ({ tw, title, description }) => (
28
- * <div style={tw('flex flex-col w-full h-full bg-white p-12')}>
29
- * <h1 style={tw('text-6xl font-bold')}>{title}</h1>
30
- * <p style={tw('text-2xl text-gray-600')}>{description}</p>
31
- * </div>
32
- * )
33
- * });
34
- * ```
35
- */
36
- export declare function defineTemplate<TProps = any>(definition: TemplateDefinition<TProps>): TemplateDefinition<TProps>;
37
18
  /**
38
19
  * Convert a template definition to template metadata
39
20
  * @internal
@@ -42,27 +23,69 @@ export declare function templateToMeta(template: TemplateDefinition): TemplateMe
42
23
  /**
43
24
  * Define a template from an imported template file
44
25
  *
45
- * Allows reusing file-based templates from _loopwind/templates/ in the SDK
26
+ * The standard way to create templates in loopwind. Import a template file
27
+ * and pass it to defineTemplate() with optional config overrides.
46
28
  *
47
29
  * @example
48
30
  * ```typescript
49
- * import * as videoIntro from './_loopwind/templates/video-intro/template';
31
+ * import * as ogImage from './_loopwind/templates/og-image/template';
50
32
  *
51
- * const template = defineTemplateFromFile(videoIntro, {
33
+ * const template = defineTemplate(ogImage, {
52
34
  * config: {
53
35
  * colors: { primary: '#ff0000' }
54
36
  * }
55
37
  * });
56
38
  *
57
- * const mp4 = await renderVideo(template, { version: '2.0.0' });
39
+ * const png = await renderImage(template, { title: 'Hello' });
58
40
  * ```
59
41
  */
60
- export declare function defineTemplateFromFile<TProps = any>(templateModule: {
42
+ export declare function defineTemplate<TProps = any>(templateModule: {
61
43
  meta: TemplateMeta;
62
44
  default: (props: TProps & TemplateProps) => JSX.Element;
63
45
  }, options?: {
64
46
  config?: StyleConfig;
65
47
  }): TemplateDefinition<TProps>;
48
+ /**
49
+ * Define a template from a source code string
50
+ *
51
+ * **IMPORTANT:** This function expects **pre-compiled JavaScript** with React.createElement
52
+ * calls. If you have JSX source code, compile it first using `compileTemplate()` from
53
+ * 'loopwind/sdk/compiler'.
54
+ *
55
+ * **WARNING:** This function evaluates code strings using `new Function()`.
56
+ * Only use with **trusted** template sources. Never use with user input from
57
+ * untrusted sources as it can execute arbitrary code.
58
+ *
59
+ * **Recommended workflow:**
60
+ * 1. In your admin panel: Use `compileTemplate()` to transform JSX → JavaScript
61
+ * 2. Store the compiled JavaScript in your database
62
+ * 3. In production: Load compiled code and pass to `defineTemplateFromSource()`
63
+ *
64
+ * This approach keeps @babel/standalone out of your production bundle!
65
+ *
66
+ * @example
67
+ * ```typescript
68
+ * // Admin panel: Compile and save
69
+ * import { compileTemplate } from 'loopwind/sdk/compiler';
70
+ *
71
+ * const jsxCode = getUserCodeFromEditor(); // Contains JSX
72
+ * const compiled = compileTemplate(jsxCode);
73
+ * await db.templates.save({ code: compiled });
74
+ * ```
75
+ *
76
+ * @example
77
+ * ```typescript
78
+ * // Production API: Load and render
79
+ * import { defineTemplateFromSource, renderImage } from 'loopwind/sdk';
80
+ *
81
+ * const template = await db.templates.findById(id);
82
+ * const templateDef = defineTemplateFromSource(template.code, {
83
+ * config: { colors: { primary: '#3b82f6' } }
84
+ * });
85
+ *
86
+ * const png = await renderImage(templateDef, { title: 'Hello' });
87
+ * ```
88
+ */
66
89
  export declare function defineTemplateFromSource<TProps = any>(sourceCode: string, options?: {
67
90
  config?: StyleConfig;
68
91
  }): TemplateDefinition<TProps>;
@@ -1 +1 @@
1
- {"version":3,"file":"template.d.ts","sourceRoot":"","sources":["../../src/sdk/template.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACxE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAKvD,MAAM,MAAM,WAAW,GAAG,YAAY,CAAC;AAEvC,MAAM,WAAW,kBAAkB,CAAC,MAAM,GAAG,GAAG;IAC9C,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;IACzB,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACxC,KAAK,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAA;KAAE,CAAC;IAC1C,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,aAAa,KAAK,GAAG,CAAC,OAAO,CAAC;CACxD;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,cAAc,CAAC,MAAM,GAAG,GAAG,EACzC,UAAU,EAAE,kBAAkB,CAAC,MAAM,CAAC,GACrC,kBAAkB,CAAC,MAAM,CAAC,CAyB5B;AAED;;;GAGG;AACH,wBAAgB,cAAc,CAAC,QAAQ,EAAE,kBAAkB,GAAG,YAAY,CASzE;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,sBAAsB,CAAC,MAAM,GAAG,GAAG,EACjD,cAAc,EAAE;IAAE,IAAI,EAAE,YAAY,CAAC;IAAC,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,aAAa,KAAK,GAAG,CAAC,OAAO,CAAA;CAAE,EAC/F,OAAO,GAAE;IAAE,MAAM,CAAC,EAAE,WAAW,CAAA;CAAO,GACrC,kBAAkB,CAAC,MAAM,CAAC,CAW5B;AAuDD,wBAAgB,wBAAwB,CAAC,MAAM,GAAG,GAAG,EACnD,UAAU,EAAE,MAAM,EAClB,OAAO,GAAE;IAAE,MAAM,CAAC,EAAE,WAAW,CAAA;CAAO,GACrC,kBAAkB,CAAC,MAAM,CAAC,CAmC5B;AAED;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,KAAK,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,GAAG,GAAG,KAAK,CAAC;IAC7E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC5B,QAAQ,CAAC,EAAE,aAAa,EAAE,CAAC;CAC5B;AAED;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;IACzB,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACxC,KAAK,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAA;KAAE,CAAC;IAC1C,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,QAAQ,EAAE,aAAa,EAAE,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,wBAAgB,wBAAwB,CAAC,MAAM,GAAG,GAAG,EACnD,MAAM,EAAE,cAAc,GACrB,kBAAkB,CAAC,MAAM,CAAC,CA+D5B"}
1
+ {"version":3,"file":"template.d.ts","sourceRoot":"","sources":["../../src/sdk/template.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACxE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAIvD,MAAM,MAAM,WAAW,GAAG,YAAY,CAAC;AAEvC,MAAM,WAAW,kBAAkB,CAAC,MAAM,GAAG,GAAG;IAC9C,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;IACzB,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACxC,KAAK,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAA;KAAE,CAAC;IAC1C,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,aAAa,KAAK,GAAG,CAAC,OAAO,CAAC;CACxD;AAED;;;GAGG;AACH,wBAAgB,cAAc,CAAC,QAAQ,EAAE,kBAAkB,GAAG,YAAY,CASzE;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,cAAc,CAAC,MAAM,GAAG,GAAG,EACzC,cAAc,EAAE;IAAE,IAAI,EAAE,YAAY,CAAC;IAAC,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,aAAa,KAAK,GAAG,CAAC,OAAO,CAAA;CAAE,EAC/F,OAAO,GAAE;IAAE,MAAM,CAAC,EAAE,WAAW,CAAA;CAAO,GACrC,kBAAkB,CAAC,MAAM,CAAC,CA0B5B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,wBAAgB,wBAAwB,CAAC,MAAM,GAAG,GAAG,EACnD,UAAU,EAAE,MAAM,EAClB,OAAO,GAAE;IAAE,MAAM,CAAC,EAAE,WAAW,CAAA;CAAO,GACrC,kBAAkB,CAAC,MAAM,CAAC,CAgC5B;AAED;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,KAAK,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,GAAG,GAAG,KAAK,CAAC;IAC7E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC5B,QAAQ,CAAC,EAAE,aAAa,EAAE,CAAC;CAC5B;AAED;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;IACzB,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACxC,KAAK,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAA;KAAE,CAAC;IAC1C,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,QAAQ,EAAE,aAAa,EAAE,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,wBAAgB,wBAAwB,CAAC,MAAM,GAAG,GAAG,EACnD,MAAM,EAAE,cAAc,GACrB,kBAAkB,CAAC,MAAM,CAAC,CAkE5B"}
@@ -1,44 +1,4 @@
1
1
  import React from 'react';
2
- import * as Babel from '@babel/standalone';
3
- /**
4
- * Define a template programmatically for use in serverless environments
5
- *
6
- * @example
7
- * ```typescript
8
- * const ogImage = defineTemplate({
9
- * name: 'og-image',
10
- * type: 'image',
11
- * size: { width: 1200, height: 630 },
12
- * render: ({ tw, title, description }) => (
13
- * <div style={tw('flex flex-col w-full h-full bg-white p-12')}>
14
- * <h1 style={tw('text-6xl font-bold')}>{title}</h1>
15
- * <p style={tw('text-2xl text-gray-600')}>{description}</p>
16
- * </div>
17
- * )
18
- * });
19
- * ```
20
- */
21
- export function defineTemplate(definition) {
22
- // Validate definition
23
- if (!definition.name) {
24
- throw new Error('Template definition must have a name');
25
- }
26
- if (!definition.size || !definition.size.width || !definition.size.height) {
27
- throw new Error('Template definition must have a size with width and height');
28
- }
29
- if (!definition.render || typeof definition.render !== 'function') {
30
- throw new Error('Template definition must have a render function');
31
- }
32
- // Set defaults
33
- const type = definition.type || 'image';
34
- if (type === 'video' && !definition.video) {
35
- throw new Error('Video templates must have video metadata (fps, duration)');
36
- }
37
- return {
38
- ...definition,
39
- type,
40
- };
41
- }
42
2
  /**
43
3
  * Convert a template definition to template metadata
44
4
  * @internal
@@ -56,93 +16,91 @@ export function templateToMeta(template) {
56
16
  /**
57
17
  * Define a template from an imported template file
58
18
  *
59
- * Allows reusing file-based templates from _loopwind/templates/ in the SDK
19
+ * The standard way to create templates in loopwind. Import a template file
20
+ * and pass it to defineTemplate() with optional config overrides.
60
21
  *
61
22
  * @example
62
23
  * ```typescript
63
- * import * as videoIntro from './_loopwind/templates/video-intro/template';
24
+ * import * as ogImage from './_loopwind/templates/og-image/template';
64
25
  *
65
- * const template = defineTemplateFromFile(videoIntro, {
26
+ * const template = defineTemplate(ogImage, {
66
27
  * config: {
67
28
  * colors: { primary: '#ff0000' }
68
29
  * }
69
30
  * });
70
31
  *
71
- * const mp4 = await renderVideo(template, { version: '2.0.0' });
32
+ * const png = await renderImage(template, { title: 'Hello' });
72
33
  * ```
73
34
  */
74
- export function defineTemplateFromFile(templateModule, options = {}) {
35
+ export function defineTemplate(templateModule, options = {}) {
75
36
  const { meta, default: render } = templateModule;
76
- return defineTemplate({
37
+ // Validate meta
38
+ if (!meta.name) {
39
+ throw new Error('Template meta must have a name');
40
+ }
41
+ if (!meta.size || !meta.size.width || !meta.size.height) {
42
+ throw new Error('Template meta must have a size with width and height');
43
+ }
44
+ const type = meta.type || 'image';
45
+ if (type === 'video' && !meta.video) {
46
+ throw new Error('Video templates must have video metadata (fps, duration)');
47
+ }
48
+ return {
77
49
  name: meta.name,
78
- type: meta.type,
50
+ type: type,
79
51
  size: meta.size,
80
52
  video: meta.video,
81
53
  config: options.config,
82
54
  render,
83
- });
55
+ };
84
56
  }
85
57
  /**
86
58
  * Define a template from a source code string
87
59
  *
60
+ * **IMPORTANT:** This function expects **pre-compiled JavaScript** with React.createElement
61
+ * calls. If you have JSX source code, compile it first using `compileTemplate()` from
62
+ * 'loopwind/sdk/compiler'.
63
+ *
88
64
  * **WARNING:** This function evaluates code strings using `new Function()`.
89
65
  * Only use with **trusted** template sources. Never use with user input from
90
66
  * untrusted sources as it can execute arbitrary code.
91
67
  *
92
- * Perfect for:
93
- * - Templates stored in a database (admin-created only)
94
- * - Templates from a trusted CMS
95
- * - Code editor features where templates are validated
68
+ * **Recommended workflow:**
69
+ * 1. In your admin panel: Use `compileTemplate()` to transform JSX → JavaScript
70
+ * 2. Store the compiled JavaScript in your database
71
+ * 3. In production: Load compiled code and pass to `defineTemplateFromSource()`
72
+ *
73
+ * This approach keeps @babel/standalone out of your production bundle!
96
74
  *
97
75
  * @example
98
76
  * ```typescript
99
- * const templateSource = `
100
- * export const meta = {
101
- * name: 'user-template',
102
- * type: 'image',
103
- * size: { width: 1200, height: 630 }
104
- * };
77
+ * // Admin panel: Compile and save
78
+ * import { compileTemplate } from 'loopwind/sdk/compiler';
105
79
  *
106
- * export default ({ tw, title }) => {
107
- * const h = React.createElement;
108
- * return h('div', { style: tw('flex w-full h-full bg-blue-500 p-12') },
109
- * h('h1', { style: tw('text-6xl font-bold text-white') }, title)
110
- * );
111
- * };
112
- * `;
80
+ * const jsxCode = getUserCodeFromEditor(); // Contains JSX
81
+ * const compiled = compileTemplate(jsxCode);
82
+ * await db.templates.save({ code: compiled });
83
+ * ```
113
84
  *
114
- * const template = defineTemplateFromSource(templateSource, {
85
+ * @example
86
+ * ```typescript
87
+ * // Production API: Load and render
88
+ * import { defineTemplateFromSource, renderImage } from 'loopwind/sdk';
89
+ *
90
+ * const template = await db.templates.findById(id);
91
+ * const templateDef = defineTemplateFromSource(template.code, {
115
92
  * config: { colors: { primary: '#3b82f6' } }
116
93
  * });
117
94
  *
118
- * const png = await renderImage(template, { title: 'Hello' });
95
+ * const png = await renderImage(templateDef, { title: 'Hello' });
119
96
  * ```
120
97
  */
121
- /**
122
- * Transform JSX to JavaScript using Babel
123
- * @internal
124
- */
125
- function transformJSX(code) {
126
- try {
127
- const result = Babel.transform(code, {
128
- presets: ['react'],
129
- filename: 'template.tsx',
130
- });
131
- return result.code || code;
132
- }
133
- catch (error) {
134
- // If Babel fails, return original code (might be plain JS without JSX)
135
- return code;
136
- }
137
- }
138
98
  export function defineTemplateFromSource(sourceCode, options = {}) {
139
99
  try {
140
- // Transform JSX to React.createElement calls
141
- let processedSource = transformJSX(sourceCode);
142
100
  // Strip export keywords to make it work in function context
143
101
  // Convert "export const meta = ..." to "const meta = ..."
144
102
  // Convert "export default ..." to "const defaultExport = ..."
145
- processedSource = processedSource
103
+ let processedSource = sourceCode
146
104
  .replace(/export\s+const\s+meta\s*=/g, 'const meta =')
147
105
  .replace(/export\s+default\s+/g, 'const defaultExport = ');
148
106
  // Create a module evaluation function
@@ -160,7 +118,7 @@ export function defineTemplateFromSource(sourceCode, options = {}) {
160
118
  if (!templateModule.default || typeof templateModule.default !== 'function') {
161
119
  throw new Error('Template source must have a default export function');
162
120
  }
163
- return defineTemplateFromFile(templateModule, options);
121
+ return defineTemplate(templateModule, options);
164
122
  }
165
123
  catch (error) {
166
124
  throw new Error(`Failed to parse template source: ${error instanceof Error ? error.message : String(error)}`);
@@ -259,13 +217,15 @@ export function defineTemplateFromSchema(schema) {
259
217
  return h(React.Fragment, null, elements.map((el, i) => buildElement(el, i)));
260
218
  }
261
219
  `)(React);
262
- return defineTemplate({
220
+ // Create a template module from the schema
221
+ const meta = {
263
222
  name: schema.name,
264
- type: schema.type,
223
+ description: schema.name,
224
+ type: schema.type || 'image',
265
225
  size: schema.size,
266
226
  video: schema.video,
267
- config: schema.config,
268
- render,
269
- });
227
+ props: {},
228
+ };
229
+ return defineTemplate({ meta, default: render }, { config: schema.config });
270
230
  }
271
231
  //# sourceMappingURL=template.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"template.js","sourceRoot":"","sources":["../../src/sdk/template.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"template.js","sourceRoot":"","sources":["../../src/sdk/template.ts"],"names":[],"mappings":"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"}