zzz-template 0.9.1 → 1.0.1

package/README.md

@@ -39,9 +39,9 @@ npm install zzz-template
 ### Compile example (see [examples/00-compile](examples/00-compile))
 ``` javascript
 // file examples/00-compile/example.js
-import {ZzzBrowser} from "zzz-template"
+import {ZzzTemplate} from "zzz-template"
 
-const zzz = new ZzzBrowser()
+const zzz = new ZzzTemplate()
 const fn = zzz.compile('Hello ${data.name}') // returns function that renders your template using data: `fn(data)`
 console.log(fn({name: 'Jerry'})); // > "Hello Jerry"
 console.log(fn({name: 'Tom'})); // > "Hello Tom"
@@ -57,9 +57,9 @@ console.log(fn({name: 'Tom'})); // > "Hello Tom"
 </script>
 
 <script type="module">
-  import { ZzzBrowser } from '/zzz-template/index.js'
+  import { ZzzTemplate } from '/zzz-template/index.js'
 
-  const zzz = new ZzzBrowser()
+  const zzz = new ZzzTemplate()
 
   const result = zzz.render('template', { name: 'world' })
 
@@ -78,9 +78,9 @@ console.log(fn({name: 'Tom'})); // > "Hello Tom"
 ```
 ``` javascript
 // file examples/02-basic/example.js
-import { ZzzFs } from 'zzz-template/fs.js'
+import { ZzzTemplateNode } from 'zzz-template/node.js'
 
-const zzz = new ZzzFs({ dir: import.meta.dirname })
+const zzz = new ZzzTemplateNode({ dir: import.meta.dirname })
 const result = zzz.render('template.html', { name: 'Jerry' })
 console.log(result)
 // OUTPUT:
@@ -97,9 +97,9 @@ console.log(result)
 ``` html
 <!-- file examples/03-include/page.html --> 
 <script type="module">
-  import { ZzzBrowser, useInclude } from '/zzz-template/index.js'
+  import { ZzzTemplate, useInclude } from '/zzz-template/index.js'
 
-  const zzz = new ZzzBrowser()
+  const zzz = new ZzzTemplate()
   useInclude(zzz) // 👈 enables include feature
 
   const result = zzz.render('template', { name: 'world' })
@@ -131,9 +131,9 @@ console.log(result)
 ``` html
 <!-- file examples/06-layout/layouts.html --> 
 <script type="module">
-  import { ZzzBrowser, useLayout } from '/zzz-template/index.js'
+  import { ZzzTemplate, useLayout } from '/zzz-template/index.js'
 
-  const zzz = new ZzzBrowser()
+  const zzz = new ZzzTemplate()
   useLayout(zzz) // 👈 enables layout feature
 
   const result = zzz.render('template', { name: 'world' })
@@ -195,9 +195,9 @@ See example how layout can include each other: `examples/06-layout/layouts2.html
 </script>
 
 <script type="module">
-  import { ZzzBrowser, useLayout, useLocal } from '/zzz-template/index.js'
+  import { ZzzTemplate, useLayout, useLocal } from '/zzz-template/index.js'
 
-  const zzz = new ZzzBrowser()
+  const zzz = new ZzzTemplate()
   useLayout(zzz) // 👈 enables layout feature
   useLocal(zzz) // 👈 enables local vars feature
 
@@ -218,9 +218,9 @@ See example how layout can include each other: `examples/06-layout/layouts2.html
 ``` html
 <!-- file examples/04-if/if.html --> 
 <script type="module">
-  import { ZzzBrowser, useIfMap } from '/zzz-template/index.js'
+  import { ZzzTemplate, useIfMap } from '/zzz-template/index.js'
 
-  const zzz = new ZzzBrowser()
+  const zzz = new ZzzTemplate()
   useIfMap(zzz) // 👈 enables "if/map" feature
 
   const result = zzz.render('template', { name: 'world', n: 42 })
@@ -255,9 +255,9 @@ See example how layout can include each other: `examples/06-layout/layouts2.html
 ``` html
 <!-- file examples/04-if/ifi.html --> 
 <script type="module">
-  import { ZzzBrowser, useIfMap } from '/zzz-template/index.js'
+  import { ZzzTemplate, useIfMap } from '/zzz-template/index.js'
 
-  const zzz = new ZzzBrowser()
+  const zzz = new ZzzTemplate()
   useIfMap(zzz) // 👈 enables "if/map" feature
 
   const result = zzz.render('template', { name: 'world', n: 42 })
@@ -288,9 +288,9 @@ See example how layout can include each other: `examples/06-layout/layouts2.html
 ``` html
 <!-- file examples/05-map/map.html --> 
 <script type="module">
-  import { ZzzBrowser, useIfMap } from '/zzz-template/index.js'
+  import { ZzzTemplate, useIfMap } from '/zzz-template/index.js'
 
-  const zzz = new ZzzBrowser()
+  const zzz = new ZzzTemplate()
   useIfMap(zzz) // 👈 enables "if/map" feature
 
   const pets = [{ name: 'cat', say: 'meow' }, { name: 'dog', say: 'woof' }]
@@ -328,9 +328,9 @@ ZzzTemplate already has a few built-in plugins. A plugin is just a function that
 For instance, you can inject your code into the compile function. Here is a 'trim' example:
 
 ``` javascript
-import {ZzzBrowser, useContentTrim} from "zzz-template"
+import {ZzzTemplate, useContentTrim} from "zzz-template"
 
-const zzz = new ZzzBrowser()
+const zzz = new ZzzTemplate()
 useContentTrim(zzz)
 const fn = zzz.compile('   Hello ${data.name}   ')
 // note that result is trimmed
@@ -349,9 +349,9 @@ This function pushes a code snippet to the end array that will be invoked after
 Or you may want to introduce a new var in your templates.
 
 ``` javascript
-import {ZzzBrowser, useContentTrim} from "zzz-template"
+import {ZzzTemplate, useContentTrim} from "zzz-template"
 
-const zzz = new ZzzBrowser()
+const zzz = new ZzzTemplate()
 
 // zzz.s -- s means start (before template content compiled)
 zzz.s.push('let $$ = data;') // introduce `$$` for `data`
@@ -366,9 +366,9 @@ console.log(result); // > "Hello Tom"
 ``` html
 <!-- file examples/10-extend/escape.html --> 
 <script type="module">
-  import { ZzzBrowser, useFn } from '/zzz-template/index.js'
+  import { ZzzTemplate, useFn } from '/zzz-template/index.js'
 
-  const zzz = new ZzzBrowser()
+  const zzz = new ZzzTemplate()
 
   function escapeHtml (unsafe) {
     return unsafe
@@ -441,4 +441,4 @@ Looking for JavaScript template engines? Here are some alternatives:
 - [doT](https://www.npmjs.com/package/dot) - Fast template engine
 
 ---
-Docs revision: 2025-11-24T08:05:23.013Z
+Docs revision: 2025-12-01T07:31:03.778Z

package/fs.d.ts

@@ -1,13 +1,13 @@
-import { ZzzBase } from "./index.js";
+import { ZzzTemplateBase } from "./index.js";
 
 export * from './index.js';
 
-export interface ZzzFsOptions extends Record<string, any> {
+export interface ZzzTemplateNodeOptions extends Record<string, any> {
   dir?: string;
 }
 
-export class ZzzFs extends ZzzBase {
+export class ZzzTemplateNode extends ZzzTemplateBase {
   _dir: string;
-  constructor($this?: ZzzFsOptions);
+  constructor($this?: ZzzTemplateNodeOptions);
   read(f: string): string;
 }

package/index.d.ts

@@ -1,4 +1,4 @@
-export class ZzzBase {
+export class ZzzTemplateBase {
   s: string[];
   e: string[];
   $: Record<string, any>;
@@ -8,13 +8,13 @@ export class ZzzBase {
   read(f: string): string;
 }
 
-export class ZzzBrowser extends ZzzBase {
+export class ZzzTemplate extends ZzzTemplateBase {
   read(f: string): string;
 }
 
-export function useFn(zzz: ZzzBase, fn: Function, alias?: string | false): void;
-export function useContentTrim(zzz: ZzzBase): void;
-export function useInclude(zzz: ZzzBase, alias?: string): void;
-export function useLayout(zzz: ZzzBase, alias?: string): void;
-export function useLocal(zzz: ZzzBase, aliasSet?: string, aliasSeta?: string): void;
-export function useIfMap(zzz: ZzzBase, aliases?: boolean): void;
+export function useFn(zzz: ZzzTemplateBase, fn: Function, alias?: string | false): void;
+export function useContentTrim(zzz: ZzzTemplateBase): void;
+export function useInclude(zzz: ZzzTemplateBase, alias?: string): void;
+export function useLayout(zzz: ZzzTemplateBase, alias?: string): void;
+export function useLocal(zzz: ZzzTemplateBase, aliasSet?: string, aliasSeta?: string): void;
+export function useIfMap(zzz: ZzzTemplateBase, aliases?: boolean): void;

package/index.js

@@ -1,11 +1,11 @@
-export class ZzzBase {
+export class ZzzTemplateBase {
   s = [] // s - start, before content
   e = [] // e - end, after content
   constructor($this = {}) {
     this.$ = $this
   }
   compile(str, local, sign = 'data, parent') {
-    const fn = new Function(sign, `${this.s.join(';')}let content=\`${str}\`;${this.e.join(';')}return content;`)
+    const fn = new Function(sign, `${this.s.join(';')}var content=\`${str}\`;${this.e.join(';')}return content;`)
     return fn.bind({...this.$, local}) // shallow copy of $
   }
   render(template, data, local = {}) {
@@ -13,7 +13,7 @@ export class ZzzBase {
   }
   read(f) {} // must be implemented
 }
-export class ZzzBrowser extends ZzzBase {
+export class ZzzTemplate extends ZzzTemplateBase {
   read (f) {
     return window.document.getElementById(f).innerText
   }
@@ -47,3 +47,6 @@ export function useIfMap(zzz, aliases = true) {
   useFn(zzz, function map_template(arr, str) {return arr.map(x => {return zzz.compile(str, this.local)(x)}).join('')}, aliases && 'MAP')
   useFn(zzz, function map_include(arr, file) {return arr.map(x => {return this.include(file, x)}).join('')}, aliases && 'MAPI')
 }
+
+// @deprecated ZzzBrowser, use ZzzTemplate class instead
+export const ZzzBrowser = ZzzTemplate

package/{fs.js → node.js}

@@ -1,10 +1,10 @@
 import {readFileSync} from 'node:fs'
 import {join} from "node:path"
-import {ZzzBase} from "./index.js"
+import {ZzzTemplateBase} from "./index.js"
 
 export * from './index.js'
 
-export class ZzzFs extends ZzzBase {
+export class ZzzTemplateNode extends ZzzTemplateBase {
   constructor($this = {}) {
     super($this)
     this._dir = $this.dir || ''
@@ -13,3 +13,6 @@ export class ZzzFs extends ZzzBase {
     return readFileSync(join(this._dir, f), "utf8")
   }
 }
+
+// @deprecated
+export const ZzzFs = ZzzTemplateNode

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zzz-template",
-  "version": "0.9.1",
+  "version": "1.0.1",
   "type": "module",
   "description": "Fastest JavaScript template engine using native template literals. Zero dependencies, ~500 bytes, works in Node.js and browser. EJS/Handlebars alternative.",
   "author": {
@@ -43,7 +43,7 @@
   "files": [
     "index.js",
     "index.d.ts",
-    "fs.js",
+    "node.js",
     "fs.d.ts",
     "readme.md",
     "LICENSE"
@@ -57,10 +57,10 @@
       "import": "./index.js",
       "require": "./index.js"
     },
-    "./fs.js": {
+    "./node.js": {
       "types": "./fs.d.ts",
-      "import": "./fs.js",
-      "require": "./fs.js"
+      "import": "./node.js",
+      "require": "./node.js"
     }
   }
 }