htmv 0.0.32 → 0.0.34

package/dist/next-parser/parser.d.ts

@@ -0,0 +1,3 @@
+import type { RootNode } from "./renderer";
+import type { Token } from "./tokenizer";
+export declare function parse(tokens: Token[]): RootNode;

package/dist/next-parser/parser.js

@@ -0,0 +1,103 @@
+export function parse(tokens) {
+    let i = 0;
+    const root = {
+        type: "root",
+        children: parseChildren(),
+    };
+    return root;
+    function parseChildren(untilTag) {
+        const nodes = [];
+        while (i < tokens.length) {
+            const token = tokens[i];
+            if (untilTag &&
+                token?.type === "close" &&
+                token.tag.toLocaleLowerCase() === untilTag) {
+                i++;
+                break;
+            }
+            if (token?.type === "text") {
+                nodes.push({
+                    type: "text",
+                    text: token.text,
+                });
+                i++;
+                continue;
+            }
+            if (token?.type === "interpolation") {
+                nodes.push({
+                    type: "interpolation",
+                    value: token.value,
+                });
+                i++;
+                continue;
+            }
+            if (token?.type === "open") {
+                const tag = token.tag.toLowerCase();
+                i++;
+                if (tag === "for") {
+                    const nextToken = tokens[i]; //should be arguments token
+                    i++;
+                    if (nextToken?.type !== "arguments")
+                        throw new Error("Missing arguments in for");
+                    const [itemName, _in, listName] = nextToken.value;
+                    if (itemName === undefined ||
+                        _in === undefined ||
+                        listName === undefined)
+                        throw new Error("Incorrect amount of arguments in for. Expected 3 arguments");
+                    if (_in !== "in")
+                        throw new Error("Expected reserved word in.");
+                    const children = parseChildren(tag);
+                    nodes.push({
+                        type: "for",
+                        children,
+                        itemName,
+                        listName,
+                    });
+                    continue;
+                }
+                if (tag === "isset") {
+                    const nextToken = tokens[i]; //should be arguments token
+                    i++;
+                    if (nextToken?.type !== "arguments")
+                        throw new Error("Missing arguments in isset");
+                    const [itemName] = nextToken.value;
+                    if (itemName === undefined)
+                        throw new Error("Expected item name");
+                    const children = parseChildren(tag);
+                    nodes.push({
+                        type: "isset",
+                        children,
+                        itemName,
+                    });
+                    continue;
+                }
+                const nextToken = tokens[i]; //may be arguments token
+                if (nextToken?.type === "arguments") {
+                    const args = nextToken.value.join(" ");
+                    nodes.push({
+                        type: "text",
+                        text: `<${tag} ${args}>`,
+                    });
+                    i++;
+                    continue;
+                }
+                nodes.push({
+                    type: "text",
+                    text: `<${tag}>`,
+                });
+                continue;
+            }
+            if (token?.type === "close") {
+                if (token.tag === "for" || token.tag === "isset")
+                    continue;
+                const tag = token.tag;
+                nodes.push({
+                    type: "text",
+                    text: `</${tag}>`,
+                });
+                i++;
+            }
+        }
+        return nodes;
+    }
+}

package/dist/next-parser/renderer.d.ts

@@ -0,0 +1,26 @@
+export type Node = RootNode | TextNode | InterpolationNode | IssetNode | ForNode;
+export interface RootNode {
+    type: "root";
+    children: Node[];
+}
+interface TextNode {
+    type: "text";
+    text: string;
+}
+interface InterpolationNode {
+    type: "interpolation";
+    value: string;
+}
+interface IssetNode {
+    type: "isset";
+    itemName: string;
+    children: Node[];
+}
+interface ForNode {
+    type: "for";
+    listName: string;
+    itemName: string;
+    children: Node[];
+}
+export declare function render(node: Node, context: Record<string, unknown>): string;
+export {};

package/dist/next-parser/renderer.js

@@ -0,0 +1,41 @@
+export function render(node, context) {
+    if (node.type === "text") {
+        return node.text;
+    }
+    if (node.type === "for") {
+        const list = context[node.listName];
+        if (Array.isArray(list)) {
+            const output = list.map((item) => {
+                return node.children
+                    .map((childrenNode) => render(childrenNode, { ...context, [node.itemName]: item }))
+                    .join("");
+            });
+            return output.join("");
+        }
+        throw new Error("La lista pasada no es un array");
+    }
+    if (node.type === "interpolation") {
+        return String(resolvePropertyPath(node.value));
+    }
+    if (node.type === "isset") {
+        if (context[node.itemName] !== undefined &&
+            context[node.itemName] !== null) {
+            return node.children.map((node) => render(node, context)).join("");
+        }
+        return "";
+    }
+    const output = node.children.map((node) => render(node, context));
+    return output.join("");
+    function resolvePropertyPath(path) {
+        const [variable, ...properties] = path.split(".");
+        if (variable === undefined)
+            throw new Error("Missing variable name on interpolation");
+        let result = context[variable];
+        for (const property of properties) {
+            if (typeof result !== "object" || result === null)
+                throw new Error("Property access attempt on non-object.");
+            result = result[property];
+        }
+        return result;
+    }
+}

package/dist/next-parser/tokenizer.d.ts

@@ -0,0 +1,23 @@
+export type Token = TextToken | InterpolationToken | OpenToken | CloseToken | ArgumentsToken;
+type TextToken = {
+    type: "text";
+    text: string;
+};
+type InterpolationToken = {
+    type: "interpolation";
+    value: string;
+};
+type OpenToken = {
+    type: "open";
+    tag: string;
+};
+type CloseToken = {
+    type: "close";
+    tag: string;
+};
+type ArgumentsToken = {
+    type: "arguments";
+    value: string[];
+};
+export declare function tokenize(input: string): Token[];
+export {};

package/dist/next-parser/tokenizer.js

@@ -0,0 +1,77 @@
+export function tokenize(input) {
+    const tokens = [];
+    let textBuffer = "";
+    for (let i = 0; i < input.length; i++) {
+        const char = input[i];
+        if (char === "{") {
+            pushTextBuffer();
+            const read = readTill("}", i, input);
+            if (!read.success)
+                throw new Error("Unable to find closing }");
+            const { value, finishingPosition } = read;
+            tokens.push({
+                type: "interpolation",
+                value,
+            });
+            i = finishingPosition;
+            continue;
+        }
+        if (char === "<") {
+            pushTextBuffer();
+            const read = readTill(">", i, input);
+            if (!read.success)
+                throw new Error("Unable to find closing '>'");
+            const { value, finishingPosition } = read;
+            const values = value.trim().split(/\s+/);
+            const tag = values[0];
+            if (tag === undefined)
+                throw new Error("Unable to find tag name");
+            if (tag[0] === "/") {
+                const tagName = tag.substring(1);
+                tokens.push({
+                    type: "close",
+                    tag: tagName,
+                });
+                i = finishingPosition;
+                continue;
+            }
+            const args = values.slice(1);
+            tokens.push({
+                type: "open",
+                tag,
+            });
+            if (args.length > 0) {
+                tokens.push({
+                    type: "arguments",
+                    value: args,
+                });
+            }
+            i = finishingPosition;
+            continue;
+        }
+        textBuffer += char;
+    }
+    pushTextBuffer();
+    return tokens;
+    function pushTextBuffer() {
+        if (textBuffer.length > 0) {
+            tokens.push({
+                type: "text",
+                text: textBuffer,
+            });
+            textBuffer = "";
+        }
+    }
+}
+function readTill(charToSearchFor, startingPosition, text) {
+    const finishingPosition = text.indexOf(charToSearchFor, startingPosition + 1);
+    if (finishingPosition === -1) {
+        return { success: false };
+    }
+    const substring = text.substring(startingPosition + 1, finishingPosition);
+    return {
+        success: true,
+        value: substring,
+        finishingPosition,
+    };
+}

package/dist/views.js

@@ -1,5 +1,8 @@
 import fs from "node:fs/promises";
 import path from "node:path";
+import { parse } from "./next-parser/parser";
+import { render } from "./next-parser/renderer";
+import { tokenize } from "./next-parser/tokenizer";
 let viewsPath = "";
 export function setViewsPath(path) {
     viewsPath = path;
@@ -9,35 +12,10 @@ export async function view(view, props) {
         throw new Error("Views folder path not yet configured. Use `Htmv.setup` before rendering a view.");
     const filePath = path.join(viewsPath, `${view}.html`);
     const code = await fs.readFile(filePath, "utf-8");
-    const replacedCode = code
-        .replace(/<For\s+(\w+)\s+in\s+(\w+)>([\s\S]*?)<\/For>/g, (_, itemName, listName, innerContent) => {
-        const list = props[listName];
-        if (!Array.isArray(list))
-            throw new Error(`${listName} on view ${view} is not an array. If you wish for the For to not do anything pass an empty array instead.`);
-        return list
-            .map((item) => innerContent.replace(new RegExp(`{${itemName}}`, "g"), String(item)))
-            .join("");
-    })
-        .replace(/{(\w+)}/g, (_, propName) => {
-        return props[propName];
-    })
-        .replace(/<Isset\s+(!?\w+)>([\s\S]*?)<\/Isset>/g, (_, propNameWithPrefix, innerContent) => {
-        const isNegated = propNameWithPrefix.startsWith("!");
-        const propName = isNegated
-            ? propNameWithPrefix.slice(1)
-            : propNameWithPrefix;
-        const exists = isset(props[propName]);
-        if (isNegated ? !exists : exists)
-            return innerContent;
-        return "";
-    });
-    return new Response(replacedCode, {
+    const tokens = tokenize(code);
+    const root = parse(tokens);
+    const rendered = render(root, props);
+    return new Response(rendered, {
         headers: { "Content-Type": "text/html; charset=utf-8" },
     });
 }
-function isset(prop) {
-    if (Array.isArray(prop)) {
-        return prop.length > 0;
-    }
-    return prop !== undefined && prop !== null;
-}

package/package.json

@@ -2,7 +2,7 @@
 	"name": "htmv",
 	"main": "dist/index.js",
 	"type": "module",
-	"version": "0.0.32",
+	"version": "0.0.34",
 	"devDependencies": {
 		"@biomejs/biome": "2.3.3",
 		"@types/bun": "latest"

package/src/next-parser/parser.ts

@@ -0,0 +1,113 @@
+import type { Node, RootNode } from "./renderer";
+import type { Token } from "./tokenizer";
+
+export function parse(tokens: Token[]) {
+	let i = 0;
+
+	const root: RootNode = {
+		type: "root",
+		children: parseChildren(),
+	};
+
+	return root;
+
+	function parseChildren(untilTag?: string): Node[] {
+		const nodes: Node[] = [];
+		while (i < tokens.length) {
+			const token = tokens[i];
+			if (
+				untilTag &&
+				token?.type === "close" &&
+				token.tag.toLocaleLowerCase() === untilTag
+			) {
+				i++;
+				break;
+			}
+			if (token?.type === "text") {
+				nodes.push({
+					type: "text",
+					text: token.text,
+				});
+				i++;
+				continue;
+			}
+			if (token?.type === "interpolation") {
+				nodes.push({
+					type: "interpolation",
+					value: token.value,
+				});
+				i++;
+				continue;
+			}
+			if (token?.type === "open") {
+				const tag = token.tag.toLowerCase();
+				i++;
+				if (tag === "for") {
+					const nextToken = tokens[i]; //should be arguments token
+					i++;
+					if (nextToken?.type !== "arguments")
+						throw new Error("Missing arguments in for");
+					const [itemName, _in, listName] = nextToken.value;
+					if (
+						itemName === undefined ||
+						_in === undefined ||
+						listName === undefined
+					)
+						throw new Error(
+							"Incorrect amount of arguments in for. Expected 3 arguments",
+						);
+					if (_in !== "in") throw new Error("Expected reserved word in.");
+
+					const children = parseChildren(tag);
+					nodes.push({
+						type: "for",
+						children,
+						itemName,
+						listName,
+					});
+					continue;
+				}
+				if (tag === "isset") {
+					const nextToken = tokens[i]; //should be arguments token
+					i++;
+					if (nextToken?.type !== "arguments")
+						throw new Error("Missing arguments in isset");
+					const [itemName] = nextToken.value;
+					if (itemName === undefined) throw new Error("Expected item name");
+					const children = parseChildren(tag);
+					nodes.push({
+						type: "isset",
+						children,
+						itemName,
+					});
+					continue;
+				}
+				const nextToken = tokens[i]; //may be arguments token
+				if (nextToken?.type === "arguments") {
+					const args = nextToken.value.join(" ");
+					nodes.push({
+						type: "text",
+						text: `<${tag} ${args}>`,
+					});
+					i++;
+					continue;
+				}
+				nodes.push({
+					type: "text",
+					text: `<${tag}>`,
+				});
+				continue;
+			}
+			if (token?.type === "close") {
+				if (token.tag === "for" || token.tag === "isset") continue;
+				const tag = token.tag;
+				nodes.push({
+					type: "text",
+					text: `</${tag}>`,
+				});
+				i++;
+			}
+		}
+		return nodes;
+	}
+}

package/src/next-parser/renderer.ts

@@ -0,0 +1,81 @@
+export type Node =
+	| RootNode
+	| TextNode
+	| InterpolationNode
+	| IssetNode
+	| ForNode;
+
+export interface RootNode {
+	type: "root";
+	children: Node[];
+}
+
+interface TextNode {
+	type: "text";
+	text: string;
+}
+
+interface InterpolationNode {
+	type: "interpolation";
+	value: string;
+}
+
+interface IssetNode {
+	type: "isset";
+	itemName: string;
+	children: Node[];
+}
+
+interface ForNode {
+	type: "for";
+	listName: string;
+	itemName: string;
+	children: Node[];
+}
+
+export function render(node: Node, context: Record<string, unknown>): string {
+	if (node.type === "text") {
+		return node.text;
+	}
+	if (node.type === "for") {
+		const list = context[node.listName];
+		if (Array.isArray(list)) {
+			const output = list.map((item) => {
+				return node.children
+					.map((childrenNode) =>
+						render(childrenNode, { ...context, [node.itemName]: item }),
+					)
+					.join("");
+			});
+			return output.join("");
+		}
+		throw new Error("La lista pasada no es un array");
+	}
+	if (node.type === "interpolation") {
+		return String(resolvePropertyPath(node.value));
+	}
+	if (node.type === "isset") {
+		if (
+			context[node.itemName] !== undefined &&
+			context[node.itemName] !== null
+		) {
+			return node.children.map((node) => render(node, context)).join("");
+		}
+		return "";
+	}
+	const output = node.children.map((node) => render(node, context));
+	return output.join("");
+
+	function resolvePropertyPath(path: string) {
+		const [variable, ...properties] = path.split(".");
+		if (variable === undefined)
+			throw new Error("Missing variable name on interpolation");
+		let result = context[variable];
+		for (const property of properties) {
+			if (typeof result !== "object" || result === null)
+				throw new Error("Property access attempt on non-object.");
+			result = (result as Record<string, unknown>)[property];
+		}
+		return result;
+	}
+}

package/src/next-parser/tokenizer.ts

@@ -0,0 +1,123 @@
+export type Token =
+	| TextToken
+	| InterpolationToken
+	| OpenToken
+	| CloseToken
+	| ArgumentsToken;
+
+type TextToken = {
+	type: "text";
+	text: string;
+};
+
+type InterpolationToken = {
+	type: "interpolation";
+	value: string;
+};
+
+type OpenToken = {
+	type: "open";
+	tag: string;
+};
+
+type CloseToken = {
+	type: "close";
+	tag: string;
+};
+
+type ArgumentsToken = {
+	type: "arguments";
+	value: string[];
+};
+
+export function tokenize(input: string): Token[] {
+	const tokens: Token[] = [];
+	let textBuffer = "";
+	for (let i = 0; i < input.length; i++) {
+		const char = input[i];
+		if (char === "{") {
+			pushTextBuffer();
+			const read = readTill("}", i, input);
+			if (!read.success) throw new Error("Unable to find closing }");
+			const { value, finishingPosition } = read;
+			tokens.push({
+				type: "interpolation",
+				value,
+			});
+			i = finishingPosition;
+			continue;
+		}
+
+		if (char === "<") {
+			pushTextBuffer();
+			const read = readTill(">", i, input);
+			if (!read.success) throw new Error("Unable to find closing '>'");
+			const { value, finishingPosition } = read;
+			const values = value.trim().split(/\s+/);
+			const tag = values[0];
+			if (tag === undefined) throw new Error("Unable to find tag name");
+			if (tag[0] === "/") {
+				const tagName = tag.substring(1);
+				tokens.push({
+					type: "close",
+					tag: tagName,
+				});
+				i = finishingPosition;
+				continue;
+			}
+			const args = values.slice(1);
+			tokens.push({
+				type: "open",
+				tag,
+			});
+			if (args.length > 0) {
+				tokens.push({
+					type: "arguments",
+					value: args,
+				});
+			}
+
+			i = finishingPosition;
+			continue;
+		}
+
+		textBuffer += char;
+	}
+	pushTextBuffer();
+	return tokens;
+
+	function pushTextBuffer() {
+		if (textBuffer.length > 0) {
+			tokens.push({
+				type: "text",
+				text: textBuffer,
+			});
+			textBuffer = "";
+		}
+	}
+}
+
+function readTill(
+	charToSearchFor: string,
+	startingPosition: number,
+	text: string,
+):
+	| {
+			success: true;
+			value: string;
+			finishingPosition: number;
+	  }
+	| {
+			success: false;
+	  } {
+	const finishingPosition = text.indexOf(charToSearchFor, startingPosition + 1);
+	if (finishingPosition === -1) {
+		return { success: false };
+	}
+	const substring = text.substring(startingPosition + 1, finishingPosition);
+	return {
+		success: true,
+		value: substring,
+		finishingPosition,
+	};
+}

package/src/views.ts

@@ -1,5 +1,8 @@
 import fs from "node:fs/promises";
 import path from "node:path";
+import { parse } from "./next-parser/parser";
+import { render } from "./next-parser/renderer";
+import { tokenize } from "./next-parser/tokenizer";
 
 let viewsPath = "";
 
@@ -14,50 +17,10 @@ export async function view(view: string, props: Record<string, unknown>) {
 		);
 	const filePath = path.join(viewsPath, `${view}.html`);
 	const code = await fs.readFile(filePath, "utf-8");
-	const replacedCode = code
-		.replace(
-			/<For\s+(\w+)\s+in\s+(\w+)>([\s\S]*?)<\/For>/g,
-			(_, itemName: string, listName: string, innerContent: string) => {
-				const list = props[listName];
-				if (!Array.isArray(list))
-					throw new Error(
-						`${listName} on view ${view} is not an array. If you wish for the For to not do anything pass an empty array instead.`,
-					);
-
-				return list
-					.map((item) =>
-						innerContent.replace(
-							new RegExp(`{${itemName}}`, "g"),
-							String(item),
-						),
-					)
-					.join("");
-			},
-		)
-		.replace(/{(\w+)}/g, (_, propName) => {
-			return props[propName] as string;
-		})
-		.replace(
-			/<Isset\s+(!?\w+)>([\s\S]*?)<\/Isset>/g,
-			(_, propNameWithPrefix: string, innerContent: string) => {
-				const isNegated = propNameWithPrefix.startsWith("!");
-				const propName = isNegated
-					? propNameWithPrefix.slice(1)
-					: propNameWithPrefix;
-				const exists = isset(props[propName]);
-
-				if (isNegated ? !exists : exists) return innerContent;
-				return "";
-			},
-		);
-	return new Response(replacedCode, {
+	const tokens = tokenize(code);
+	const root = parse(tokens);
+	const rendered = render(root, props);
+	return new Response(rendered, {
 		headers: { "Content-Type": "text/html; charset=utf-8" },
 	});
 }
-
-function isset(prop: unknown) {
-	if (Array.isArray(prop)) {
-		return prop.length > 0;
-	}
-	return prop !== undefined && prop !== null;
-}