mikel 0.19.1 → 0.20.1

package/README.md

@@ -142,11 +142,34 @@ const result = m("User: {{>user userName=name userEmail=email }}", data, {partia
 
 Please note that providing keyword arguments and a custom context to a partial is not supported. On this situation, the partial will be evaluated only with the custom context.
 
+#### Expand partial arguments using the spread operator
+
+> This feature was added in `v0.20.0`.
+
+You can use the spread operator `...` to expand the keyword arguments of a partial. This allows you to pass an object as individual keyword arguments to the partial.
+
+Example:
+
+```javascript
+const data = {
+    user: {
+        name: "John Doe",
+        email: "john@example.com",
+    },
+};
+const partials = {
+    user: "{{userName}} <{{userEmail}}>",
+};
+
+const result = m("User: {{>user ...user}}", data, {partials});
+console.log(result); // --> 'User: John Doe <john@example.com>'
+```
+
 #### Partial blocks
 
 > This feature was added in `v0.16.0`.
 
-You can pass a block to a partial using a greather than symbol `>>` followed by the partial name to start the partial block, and a slash followed by the partial name to end the partial block. The provided block content will be available in the `@content` variable.
+You can pass a block to a partial using a double greather than symbol `>>` followed by the partial name to start the partial block, and a slash followed by the partial name to end the partial block. The provided block content will be available in the `@content` variable.
 
 Example:
 
@@ -186,24 +209,11 @@ const options = {
     },
 };
 
-const result = m("{{> foo}}", {}, options);
+const result = m("{{>foo}}", {}, options);
 // Output: 'Hello Bob!'
 ```
 
-### Inline partials
-
-> This feature was added in `v0.16.0`.
-
-Inline partials allows you to define partials directly in your template. Use the plus symbol `+` followed by the partial name to start the partial definition, and end the partial definition with a slash `/` followed by the partial name. For example, `{{<foo}}` begins a partial definition called `foo`, and `{{/foo}}` ends it.
-
-Example:
-
-```javascript
-const result = m(`{{<foo}}Hello {{name}}!{{/foo}}{{>foo name="Bob"}}`, {});
-// Output: 'Hello Bob!'
-```
-
-### Built-in helpers
+### Helpers
 
 > Added in `v0.4.0`.
 
@@ -406,6 +416,33 @@ const result = m("{{#customEach items}}{{index}}: {{name}}, {{/customEach}}", da
 console.log(result); // --> "0: John, 1: Alice, 2: Bob,"
 ```
 
+#### Expand helper arguments using the spread operator
+
+> This feature was addedin `v0.20.0`.
+
+You can use the spread operator `...` to expand the arguments of a helper. This allows you to pass an array of values as individual arguments to the helper, or to pass an object as keyword arguments.
+
+Example:
+
+```javascript
+const data = {
+    items: ["John", "Alice", "Bob"],
+    options: {
+        separator: ", ",
+    },
+};
+const options = {
+    helpers: {
+        join: params => {
+            return params.args.join(params.opt.separator);
+        }
+    },
+};
+
+const result = m("{{#join ...items ...options}}{{/join}}", data, options);
+console.log(result); // --> "John, Alice, Bob"
+```
+
 ### Runtime Variables
 
 > Added in `v0.4.0`.
@@ -494,6 +531,57 @@ const result = m("My name is: {{=fullName user.firstName user.lastName}}", data,
 console.log(result); // --> "My name is: John Doe"
 ```
 
+#### Expand function arguments using the spread operator
+
+> This feature was addedin `v0.20.0`.
+
+You can use the spread operator `...` to expand the arguments of a function. This allows you to pass an array of values as individual arguments to the function, or to pass an object as keyword arguments.
+
+
+Example with an **array**:
+
+```javascript
+const data = {
+    items: ["John", "Alice", "Bob"],
+};
+
+const options = {
+    functions: {
+        join: params => {
+            return params.args.join(", ");
+        }
+    },
+};
+
+const result = m("{{=join ...items}}", data, options);
+console.log(result); // --> "John, Alice, Bob"
+```
+
+Example with an **object**:
+
+```javascript
+const data = {
+    user1: {
+        firstName: "John",
+        lastName: "Doe",
+    },
+    user2: {
+        firstName: "Alice",
+        lastName: "Smith",
+    },
+};
+const options = {
+    functions: {
+        fullName: params => {
+            return `${params.opt.firstName} ${params.opt.lastName}`;
+        }
+    },
+};
+
+const result = m("Users: {{=fullName ...user1}} and {{=fullName ...user2}}", data, options);
+console.log(result); // --> "Users: John Doe and Alice Smith"
+```
+
 
 ## API
 

package/index.d.ts

@@ -50,6 +50,8 @@ declare const mikel: {
     escape(str: string): string;
     get(context: any, path: string): any;
     parse(value: string, context?: any, vars?: any): any;
+    tokenize(value: string): string[];
+    untokenize(value: string[]): string;
 };
 
 export default mikel;

package/index.js

@@ -17,13 +17,23 @@ const untokenize = (ts = [], s = "{{", e = "}}") => {
 };
 
 // @description parse string arguments
-const parseArgs = (argString = "", data = {}, vars = {}) => {
-    const [t, ...args] = argString.trim().match(/(?:[^\s"]+|"[^"]*")+/g);
-    const argv = args.filter(a => !a.includes("=")).map(a => parse(a, data, vars));
-    const opt = Object.fromEntries(args.filter(a => a.includes("=")).map(a => {
-        const [k, v] = a.split("=");
-        return [k, parse(v, data, vars)];
-    }));
+const parseArgs = (str = "", data = {}, vars = {}, argv = [], opt = {}) => {
+    const [t, ...args] = str.trim().match(/(?:[^\s"]+|"[^"]*")+/g);
+    args.forEach(argStr => {
+        if (argStr.includes("=")) {
+            const [k, v] = argStr.split("=");
+            opt[k] = parse(v, data, vars);
+        }
+        else if (argStr.startsWith("...")) {
+            const value = parse(argStr.replace(/^\.{3}/, ""), data, vars);
+            if (!!value && typeof value === "object") {
+                Array.isArray(value) ? argv.push(...value) : Object.assign(opt, value);
+            }
+        }
+        else {
+            argv.push(parse(argStr, data, vars));
+        }
+    });
     return [t, argv, opt];
 };
 
@@ -101,16 +111,6 @@ const create = (template = "", options = {}) => {
                     i = compile(tokens, includeOutput ? output : [], data, vars, i + 1, t);
                 }
             }
-            else if (tokens[i].startsWith("<")) {
-                const t = tokens[i].slice(1).trim(), partialTokens = tokens.slice(i + 1);
-                const lastIndex = partialTokens.findIndex((token, j) => {
-                    return j % 2 !== 0 && token.trim().startsWith("/") && token.trim().endsWith(t);
-                });
-                if (typeof ctx.partials[t] === "undefined") {
-                    ctx.partials[t] = untokenize(partialTokens.slice(0, lastIndex));
-                }
-                i = i + lastIndex + 1;
-            }
             else if (tokens[i].startsWith(">")) {
                 const [t, args, opt] = parseArgs(tokens[i].replace(/^>{1,2}/, ""), data, vars);
                 const blockContent = []; // to store partial block content
@@ -191,5 +191,7 @@ mikel.create = create;
 mikel.escape = escape;
 mikel.get = get;
 mikel.parse = parse;
+mikel.tokenize = tokenize;
+mikel.untokenize = untokenize;
 
 export default mikel;

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "mikel",
     "description": "Micro templating library with zero dependencies",
-    "version": "0.19.1",
+    "version": "0.20.1",
     "type": "module",
     "author": {
         "name": "Josemi Juanes",