ventojs 0.6.0 → 0.7.1

package/README.md

@@ -91,13 +91,26 @@ First, let's take a look at this syntax example:
 
 ## Getting started
 
-This is a library for Deno. I'm planning to release an NPM version in the
-future.
+This is a library for Deno. ~~I'm planning to release an NPM version in the
+future.~~
+[There's already an NPM version](https://www.npmjs.com/package/ventojs) that you
+can install with `npm install ventojs`.
 
-First, you need to import the library and create an instance:
+Import the library and create an instance:
 
 ```ts
-import vento from "https://deno.land/x/vento@v0.2.0/mod.ts";
+import vento from "https://deno.land/x/vento/mod.ts";
+
+const vto = vento({
+  // Resolve the non-relative includes paths
+  includes: "./path/to/includes",
+});
+```
+
+Or in Node:
+
+```ts
+import vento from "ventojs";
 
 const vto = vento({
   // Resolve the non-relative includes paths
@@ -113,19 +126,22 @@ can use `load` to load and compile a template file and return it.
 const template = vto.load("my-template.vto");
 
 // Now you can use it passing the data
-template({ title: "Hello world" });
+const result = template({ title: "Hello world" });
+console.log(result.content);
 ```
 
 Alternatively, you can load and run the template file in a single call:
 
 ```ts
-vto.run("my-template.vto", { title: "Hello world" });
+const result = vto.run("my-template.vto", { title: "Hello world" });
+console.log(result.content);
 ```
 
 If the template code is not a file, you can run it directly:
 
 ```ts
-vto.runString("<h1>{{ title }}</h1>", { title: "Hello world" });
+const result = vto.runString("<h1>{{ title }}</h1>", { title: "Hello world" });
+console.log(result.content);
 ```
 
 ## Visual Studio Code Support

package/esm/mod.js

@@ -7,6 +7,9 @@ import includeTag from "./plugins/include.js";
 import setTag from "./plugins/set.js";
 import jsTag from "./plugins/js.js";
 import layoutTag from "./plugins/layout.js";
+import functionTag from "./plugins/function.js";
+import importTag from "./plugins/import.js";
+import exportTag from "./plugins/export.js";
 import escape from "./plugins/escape.js";
 export default function (options = {}) {
     const loader = typeof options.includes === "object"
@@ -23,6 +26,9 @@ export default function (options = {}) {
     env.use(includeTag());
     env.use(setTag());
     env.use(layoutTag());
+    env.use(functionTag());
+    env.use(importTag());
+    env.use(exportTag());
     env.use(escape());
     return env;
 }

package/esm/plugins/export.d.ts

@@ -0,0 +1,2 @@
+import type { Environment } from "../src/environment.js";
+export default function (): (env: Environment) => void;

package/esm/plugins/export.js

@@ -0,0 +1,46 @@
+export default function () {
+    return (env) => {
+        env.tags.push(exportTag);
+    };
+}
+function exportTag(env, code, _output, tokens) {
+    if (!code.startsWith("export ")) {
+        return;
+    }
+    const expression = code.replace(/^export\s+/, "");
+    // Value is set (e.g. {{ export foo = "bar" }})
+    if (expression.includes("=")) {
+        const match = code.match(/^export\s+([\w]+)\s*=\s*([\s\S]+)$/);
+        if (!match) {
+            throw new Error(`Invalid export tag: ${code}`);
+        }
+        const [, variable, value] = match;
+        const val = env.compileFilters(tokens, value);
+        return `if (__data.hasOwnProperty("${variable}")) {
+      ${variable} = ${val};
+    } else {
+      var ${variable} = ${val};
+    }
+    __data["${variable}"] = ${variable};
+    __exports["${variable}"] = ${variable};
+    `;
+    }
+    // Value is captured (eg: {{ export foo }}bar{{ /export }})
+    const compiled = [];
+    const compiledFilters = env.compileFilters(tokens, expression);
+    compiled.push(`if (__data.hasOwnProperty("${expression}")) {
+    ${expression} = "";
+  } else {
+    var ${expression} = "";
+  }
+  `);
+    compiled.push(...env.compileTokens(tokens, expression, ["/export"]));
+    if (tokens.length && (tokens[0][0] !== "tag" || tokens[0][1] !== "/export")) {
+        throw new Error(`Missing closing tag for export tag: ${code}`);
+    }
+    tokens.shift();
+    compiled.push(`${expression} = ${compiledFilters};`);
+    compiled.push(`__data["${expression.trim()}"] = ${expression};`);
+    compiled.push(`__exports["${expression.trim()}"] = ${expression};`);
+    return compiled.join("\n");
+}

package/esm/plugins/function.d.ts

@@ -0,0 +1,2 @@
+import type { Environment } from "../src/environment.js";
+export default function (): (env: Environment) => void;

package/esm/plugins/function.js

@@ -0,0 +1,37 @@
+export default function () {
+    return (env) => {
+        env.tags.push(functionTag);
+    };
+}
+function functionTag(env, code, _output, tokens) {
+    if (!code.match(/(export\s+)?(async\s+)?function\s/)) {
+        return;
+    }
+    const match = code.match(/^(export\s+)?(async\s+)?function\s+(\w+)\s*(\([^)]+\))?$/);
+    if (!match) {
+        throw new Error(`Invalid function: ${code}`);
+    }
+    const [_, exp, as, name, args] = match;
+    const compiled = [];
+    compiled.push(`${as || ""} function ${name} ${args || "()"} {`);
+    compiled.push(`let __output = "";`);
+    if (exp) {
+        compiled.push(...env.compileTokens(tokens, "__output", ["/export"]));
+        if (tokens.length && (tokens[0][0] !== "tag" || tokens[0][1] !== "/export")) {
+            throw new Error(`Missing closing tag for export function tag: ${code}`);
+        }
+    }
+    else {
+        compiled.push(...env.compileTokens(tokens, "__output", ["/function"]));
+        if (tokens.length && (tokens[0][0] !== "tag" || tokens[0][1] !== "/function")) {
+            throw new Error(`Missing closing tag for function tag: ${code}`);
+        }
+    }
+    tokens.shift();
+    compiled.push(`return __output;`);
+    compiled.push(`}`);
+    if (exp) {
+        compiled.push(`__exports["${name}"] = ${name}`);
+    }
+    return compiled.join("\n");
+}

package/esm/plugins/import.d.ts

@@ -0,0 +1,2 @@
+import type { Environment } from "../src/environment.js";
+export default function (): (env: Environment) => void;

package/esm/plugins/import.js

@@ -0,0 +1,24 @@
+export default function () {
+    return (env) => {
+        env.tags.push(importTag);
+    };
+}
+function importTag(_env, code) {
+    if (!code.startsWith("import ")) {
+        return;
+    }
+    const match = code?.match(/^import\s+(\{[\s|\S]*\}|\w+)\s+from\s+(.+)$/);
+    if (!match) {
+        throw new Error(`Invalid import: ${code}`);
+    }
+    const [_, vars, file] = match;
+    const compiled = [];
+    compiled.push(`__tmp = await __env.run(${file}, {...__data}, __file);`);
+    if (vars.startsWith("{")) {
+        compiled.push(`let ${vars} = __tmp;`);
+    }
+    else {
+        compiled.push(`let ${vars} = __tmp;`);
+    }
+    return compiled.join("\n");
+}

package/esm/plugins/include.js

@@ -12,5 +12,11 @@ function includeTag(_env, code, output) {
         throw new Error(`Invalid include: ${code}`);
     }
     const [_, file, data] = match;
-    return `${output} += await __env.run(${file}, {...__data${data ? `, ${data}` : ""}}, __file);`;
+    return `{
+    __tmp = await __env.run(${file},
+      {...__data${data ? `, ${data}` : ""}},
+      __file
+    );
+    ${output} += __tmp.content;
+  }`;
 }

package/esm/plugins/layout.js

@@ -23,7 +23,11 @@ function layoutTag(env, code, output, tokens) {
     }
     tokens.shift();
     compiled.push(`${varname} = ${compiledFilters};`);
-    compiled.push(`${output} += await __env.run(${file}, {...__data${data ? `, ${data}` : ""}, content: ${varname}}, __file);`);
+    compiled.push(`__tmp = await __env.run(${file},
+      {...__data${data ? `, ${data}` : ""}, content: ${varname}},
+      __file
+    );
+    ${output} += __tmp.content;`);
     compiled.push("}");
     return compiled.join("\n");
 }

package/esm/src/environment.d.ts

@@ -1,7 +1,16 @@
 import { Token } from "./tokenizer.js";
 import type { Loader } from "./loader.js";
+export interface TemplateResult {
+    content: string;
+    [key: string]: unknown;
+}
 export interface Template {
-    (data?: Record<string, unknown>): Promise<string>;
+    (data?: Record<string, unknown>): Promise<TemplateResult>;
+    code: string;
+    file?: string;
+}
+export interface TemplateSync {
+    (data?: Record<string, unknown>): TemplateResult;
     code: string;
     file?: string;
 }
@@ -20,9 +29,11 @@ export declare class Environment {
     utils: Record<string, unknown>;
     constructor(options: Options);
     use(plugin: Plugin): void;
-    run(file: string, data: Record<string, unknown>, from?: string): Promise<string>;
-    runString(source: string, data?: Record<string, unknown>, file?: string): Promise<string>;
-    compile(source: string, path?: string, defaults?: Record<string, unknown>): Template;
+    run(file: string, data: Record<string, unknown>, from?: string): Promise<TemplateResult>;
+    runString(source: string, data?: Record<string, unknown>, file?: string): Promise<TemplateResult>;
+    runStringSync(source: string, data?: Record<string, unknown>): TemplateResult;
+    compile(source: string, path?: string, defaults?: Record<string, unknown>, sync?: false): Template;
+    compile(source: string, path?: string, defaults?: Record<string, unknown>, sync?: true): TemplateSync;
     load(file: string, from?: string): Promise<Template>;
     compileTokens(tokens: Token[], outputVar?: string, stopAt?: string[]): string[];
     compileFilters(tokens: Token[], output: string): string;

package/esm/src/environment.js

@@ -29,19 +29,24 @@ export class Environment {
         const template = this.compile(source, file);
         return await template(data);
     }
-    compile(source, path, defaults) {
+    runStringSync(source, data) {
+        const template = this.compile(source, "", {}, true);
+        return template(data);
+    }
+    compile(source, path, defaults, sync = false) {
         try {
             const tokens = tokenize(source);
             const code = this.compileTokens(tokens).join("\n");
-            const constructor = new Function("__file", "__env", "__defaults", `return async function (__data) {
+            const constructor = new Function("__file", "__env", "__defaults", `return${sync ? "" : " async"} function (__data) {
           try {
             __data = Object.assign({}, __defaults, __data);
             const ${this.options.dataVarname} = __data;
-            let __output = "";
+            let __tmp;
+            const __exports = { content: "" };
             with (__data) {
               ${code}
             }
-            return __output;
+            return __exports;
           } catch (cause) {
             throw new Error(\`Error rendering template: \${__file}\`, { cause });
           }
@@ -66,7 +71,7 @@ export class Environment {
         }
         return this.cache.get(file);
     }
-    compileTokens(tokens, outputVar = "__output", stopAt) {
+    compileTokens(tokens, outputVar = "__exports.content", stopAt) {
         const compiled = [];
         tokens: while (tokens.length > 0) {
             if (stopAt && tokens[0][0] === "tag" && stopAt.includes(tokens[0][1])) {

package/esm/test/function.test.d.ts

@@ -0,0 +1 @@
+import "../_dnt.test_polyfills.js";

package/esm/test/import.test.d.ts

@@ -0,0 +1 @@
+import "../_dnt.test_polyfills.js";

package/esm/test/utils.d.ts

@@ -9,6 +9,7 @@ export interface TestOptions {
     includes?: Record<string, string>;
 }
 export declare function test(options: TestOptions): Promise<void>;
+export declare function testSync(options: TestOptions): void;
 export declare class FileLoader implements Loader {
     files: Record<string, string>;
     constructor(files: Record<string, string>);

package/package.json

@@ -1,11 +1,11 @@
 {
   "module": "./esm/mod.js",
   "name": "ventojs",
-  "version": "0.6.0",
+  "version": "0.7.1",
   "description": "🌬 A minimal but powerful template engine",
   "license": "MIT",
   "repository": "github:oscarotero/vento",
-  "homepage": "https://oscarotero.github.io/vento/",
+  "homepage": "https://vento.js.org/",
   "bugs": "https://github.com/oscarotero/vento/issues",
   "exports": {
     ".": {