htmv 0.0.18 → 0.0.26

package/.github/workflows/ci.yml

@@ -0,0 +1,27 @@
+name: CI
+
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Setup Bun
+        uses: oven-sh/setup-bun@v1
+        with:
+          bun-version: latest
+
+      - name: Install dependencies
+        run: bun install
+
+      - name: Lint
+        run: npm run lint
+      
+      - name: Run TypeScript build
+        run: npm run build

package/.github/workflows/publish.yml

@@ -0,0 +1,42 @@
+name: Publish to npm
+
+on:
+  push:
+    tags:
+      - "v*"
+
+permissions:
+  id-token: write  # Required for OIDC
+  contents: read
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+          registry-url: 'https://registry.npmjs.org'
+      
+      - name: Update npm
+        run: npm install -g npm@latest
+
+      - name: Setup Bun
+        uses: oven-sh/setup-bun@v1
+        with:
+          bun-version: latest
+
+      - name: Install dependencies
+        run: bun install
+
+      - name: Lint
+        run: npm run lint
+
+      - name: Build (tsc)
+        run: npm run build
+
+      - name: Publish to npm
+        run: npm publish --provenance

package/README.md

@@ -77,5 +77,36 @@ Supported methods currently are:
 - DELETE
 - ALL (add `default` keyword)
 
+# Renaming folders
+If you wish to rename either the `views`, `routes` or `public` folders you can do so in `index.ts` as follows:
+```ts
+setup({
+	routes: path.join(dirPath, "my_custom_routes_folder"), 
+	views: path.join(dirPath, "stuff", "views"),
+	public: path.join(dirPath, "static"),
+	port: 3000,
+});
+```
+Just change the string for the new name you wish for. Note that when doing so `htmv gen` will now need `--path` flag passed to know where to find them.
+
+# Code generation
+Do you often forget how to write boilerplate code? Why not just let HTMV do it for you?
+As you know, HTMV comes with the CLI tool you used when creating the project. But it also has the command `htmv gen` which allows you to generate a basic template for a view or route.
+
+The syntax is as follows:
+```bash
+bunx htmv@latest gen {TYPE} {NAME} {OPTIONS}
+```
+For example, to create a view called MyCoolView:
+```bash
+bunx htmv@latest gen view MyCoolView
+```
+Running this will generate a view in the `views` directory of your project. The other remaining type is `route` which works the same way but creates the route in your `routes` directory.
+
+However, note that if you have changed the name of your folders HTMV will be unable to find them and you'll have to manually specify the folder you wish for the generated file to be placed in as follows:
+```bash
+bunx htmv@latest gen view MyCoolView --path cool_stuff/my_custom_views_folder
+```
+
 # Hot reloading
 Having to restart the server every time you make a change can be quite tedious. HTMV takes care of this thanks to Bun. Just develop with `bun dev` and it should work out of the box! Note that this does not include hot reloading in the browser. As of now, you have to refresh the page to see new changes. It doesn't update in real time.

package/biome.json

@@ -0,0 +1,34 @@
+{
+	"$schema": "https://biomejs.dev/schemas/2.3.3/schema.json",
+	"vcs": {
+		"enabled": true,
+		"clientKind": "git",
+		"useIgnoreFile": true
+	},
+	"files": {
+		"includes": ["**", "!!**/dist"]
+	},
+	"formatter": {
+		"enabled": true,
+		"indentStyle": "tab"
+	},
+	"linter": {
+		"enabled": true,
+		"rules": {
+			"recommended": true
+		}
+	},
+	"javascript": {
+		"formatter": {
+			"quoteStyle": "double"
+		}
+	},
+	"assist": {
+		"enabled": true,
+		"actions": {
+			"source": {
+				"organizeImports": "on"
+			}
+		}
+	}
+}

package/bun.lock

@@ -1,5 +1,6 @@
 {
   "lockfileVersion": 1,
+  "configVersion": 0,
   "workspaces": {
     "": {
       "name": "htmv",

package/dist/app.d.ts

@@ -0,0 +1,35 @@
+import { Elysia } from "elysia";
+export declare function createApp(publicPath: string): Elysia<"", {
+    decorator: {};
+    store: {};
+    derive: {};
+    resolve: {};
+}, {
+    typebox: {};
+    error: {};
+}, {
+    schema: {};
+    standaloneSchema: {};
+    macro: {};
+    macroFn: {};
+    parser: {};
+    response: {};
+}, {}, {
+    derive: {};
+    resolve: {};
+    schema: {};
+    standaloneSchema: {};
+    response: {};
+}, {
+    derive: {};
+    resolve: {};
+    schema: {};
+    standaloneSchema: {};
+    response: {};
+} & {
+    derive: {};
+    resolve: {};
+    schema: {};
+    standaloneSchema: {};
+    response: {};
+}>;

package/dist/app.js

@@ -0,0 +1,7 @@
+import staticPlugin from "@elysiajs/static";
+import { Elysia } from "elysia";
+export function createApp(publicPath) {
+    return new Elysia().use(staticPlugin({
+        assets: publicPath,
+    }));
+}

package/dist/index.d.ts

@@ -1,14 +1,3 @@
-export declare function view(view: string, props: Record<string, unknown>): Promise<Response>;
-export type RouteParams = {
-    query: Record<string, string>;
-    request: Request;
-    params: Record<string, string>;
-};
-type Paths = {
-    routes: string;
-    views: string;
-    public: string;
-    port: number;
-};
+import type { Paths } from "./types";
+export { view } from "./views";
 export declare function setup(paths: Paths): Promise<void>;
-export {};

package/dist/index.js

@@ -1,63 +1,13 @@
-import fs from "node:fs/promises";
-import path from "node:path";
-import staticPlugin from "@elysiajs/static";
-import { Elysia } from "elysia";
-let viewsPath = "";
-export async function view(view, props) {
-    if (viewsPath === "")
-        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(/{(.+)}/g, (_, propName) => {
-        return props[propName];
-    });
-    return new Response(replacedCode, {
-        headers: { "Content-Type": "text/html; charset=utf-8" },
-    });
-}
+import { createApp } from "./app";
+import { registerRoutes } from "./routing";
+import { setViewsPath } from "./views";
+export { view } from "./views";
 export async function setup(paths) {
-    viewsPath = paths.views;
-    const app = new Elysia().use(staticPlugin({
-        assets: paths.public,
-    }));
+    setViewsPath(paths.views);
+    const app = createApp(paths.public);
     await registerRoutes(app, paths.routes);
     app.listen(paths.port);
     console.log("");
     console.log(`HTMV running on port ${paths.port}! 🎉`);
     console.log(`http://localhost:${paths.port}`);
 }
-async function registerRoutes(app, baseDir, prefix = "/") {
-    const entries = await fs.readdir(baseDir, { withFileTypes: true });
-    for (const entry of entries) {
-        const fullPath = path.join(baseDir, entry.name);
-        if (entry.isDirectory()) {
-            await registerRoutes(app, fullPath, path.join(prefix, entry.name));
-            continue;
-        }
-        if (entry.name !== "index.ts")
-            continue;
-        const module = (await import(fullPath));
-        const defaultFn = module.default;
-        if (defaultFn && typeof defaultFn === "function") {
-            app.all(prefix, async ({ request, query, params }) => {
-                const result = await defaultFn({ request, query, params });
-                return result;
-            });
-            console.log(`Registered ${fullPath} on ${prefix} route with method all`);
-        }
-        for (const propName in module) {
-            const prop = module[propName];
-            if (typeof prop !== "function")
-                continue;
-            const fn = prop;
-            const name = fn.name.toLowerCase();
-            if (!["get", "post", "put", "patch", "delete"].includes(name))
-                continue;
-            app[name](prefix, async ({ request, query, params }) => {
-                const result = await fn({ request, query, params });
-                return result;
-            });
-            console.log(`Registered ${fullPath} on ${prefix} route with method ${name}`);
-        }
-    }
-}

package/dist/routing.d.ts

@@ -0,0 +1,2 @@
+import type Elysia from "elysia";
+export declare function registerRoutes(app: Elysia, baseDir: string, prefix?: string): Promise<void>;

package/dist/routing.js

@@ -0,0 +1,37 @@
+import fs from "node:fs/promises";
+import path from "node:path";
+export async function registerRoutes(app, baseDir, prefix = "/") {
+    const entries = await fs.readdir(baseDir, { withFileTypes: true });
+    for (const entry of entries) {
+        const fullPath = path.join(baseDir, entry.name);
+        if (entry.isDirectory()) {
+            await registerRoutes(app, fullPath, path.join(prefix, entry.name));
+            continue;
+        }
+        if (entry.name !== "index.ts")
+            continue;
+        const module = (await import(fullPath));
+        const defaultFn = module.default;
+        if (defaultFn && typeof defaultFn === "function") {
+            app.all(prefix, async ({ request, query, params }) => {
+                const result = await defaultFn({ request, query, params });
+                return result;
+            });
+            console.log(`Registered ${fullPath} on ${prefix} route with method all`);
+        }
+        for (const propName in module) {
+            const prop = module[propName];
+            if (typeof prop !== "function")
+                continue;
+            const fn = prop;
+            const name = fn.name.toLowerCase();
+            if (!["get", "post", "put", "patch", "delete"].includes(name))
+                continue;
+            app[name](prefix, async ({ request, query, params }) => {
+                const result = await fn({ request, query, params });
+                return result;
+            });
+            console.log(`Registered ${fullPath} on ${prefix} route with method ${name}`);
+        }
+    }
+}

package/dist/views.d.ts

@@ -0,0 +1,2 @@
+export declare function setViewsPath(path: string): void;
+export declare function view(view: string, props: Record<string, unknown>): Promise<Response>;

package/dist/views.js

@@ -0,0 +1,24 @@
+import fs from "node:fs/promises";
+import path from "node:path";
+let viewsPath = "";
+export function setViewsPath(path) {
+    viewsPath = path;
+}
+export async function view(view, props) {
+    if (viewsPath === "")
+        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(/{(.+)}/g, (_, propName) => {
+        return props[propName];
+    })
+        .replace(/<Isset\s+(\w+)>([\s\S]*?)<\/Isset>/g, (_, propName, innerContent) => {
+        if (props[propName] !== undefined && props[propName] !== null)
+            return innerContent;
+        return "";
+    });
+    return new Response(replacedCode, {
+        headers: { "Content-Type": "text/html; charset=utf-8" },
+    });
+}

package/package.json

@@ -1,21 +1,30 @@
 {
-  "name": "htmv",
-  "main": "dist/index.js",
-  "type": "module",
-  "version": "0.0.18",
-  "devDependencies": {
-    "@biomejs/biome": "2.3.3",
-    "@types/bun": "latest"
-  },
-  "peerDependencies": {
-    "typescript": "^5"
-  },
-  "dependencies": {
-    "@elysiajs/node": "^1.4.2",
-    "@elysiajs/static": "^1.4.6",
-    "elysia": "^1.4.18"
-  },
-  "bin": {
-    "htmv": "dist/cli/cli.js"
-  }
+	"name": "htmv",
+	"main": "dist/index.js",
+	"type": "module",
+	"version": "0.0.26",
+	"devDependencies": {
+		"@biomejs/biome": "2.3.3",
+		"@types/bun": "latest"
+	},
+	"peerDependencies": {
+		"typescript": "^5"
+	},
+	"dependencies": {
+		"@elysiajs/node": "^1.4.2",
+		"@elysiajs/static": "^1.4.6",
+		"elysia": "^1.4.18"
+	},
+	"bin": {
+		"htmv": "dist/cli/cli.js"
+	},
+	"scripts": {
+		"build": "tsc",
+		"lint": "biome check",
+		"prepublishOnly": "npm run build"
+	},
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/Fabrisdev/htmv"
+	}
 }

package/src/app.ts

@@ -0,0 +1,10 @@
+import staticPlugin from "@elysiajs/static";
+import { Elysia } from "elysia";
+
+export function createApp(publicPath: string) {
+	return new Elysia().use(
+		staticPlugin({
+			assets: publicPath,
+		}),
+	);
+}

package/src/index.ts

@@ -1,87 +1,16 @@
-import fs from "node:fs/promises";
-import path from "node:path";
-import staticPlugin from "@elysiajs/static";
-import { Elysia } from "elysia";
+import { createApp } from "./app";
+import { registerRoutes } from "./routing";
+import type { Paths } from "./types";
+import { setViewsPath } from "./views";
 
-let viewsPath = "";
+export { view } from "./views";
 
-export async function view(view: string, props: Record<string, unknown>) {
-	if (viewsPath === "")
-		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(/{(.+)}/g, (_, propName) => {
-		return props[propName] as string;
-	});
-	return new Response(replacedCode, {
-		headers: { "Content-Type": "text/html; charset=utf-8" },
-	});
-}
-
-export type RouteParams = {
-	query: Record<string, string>;
-	request: Request;
-	params: Record<string, string>;
-};
-
-type Paths = {
-	routes: string;
-	views: string;
-	public: string;
-	port: number;
-};
 export async function setup(paths: Paths) {
-	viewsPath = paths.views;
-	const app = new Elysia().use(
-		staticPlugin({
-			assets: paths.public,
-		}),
-	);
-
+	setViewsPath(paths.views);
+	const app = createApp(paths.public);
 	await registerRoutes(app, paths.routes);
 	app.listen(paths.port);
 	console.log("");
 	console.log(`HTMV running on port ${paths.port}! 🎉`);
 	console.log(`http://localhost:${paths.port}`);
 }
-
-async function registerRoutes(app: Elysia, baseDir: string, prefix = "/") {
-	const entries = await fs.readdir(baseDir, { withFileTypes: true });
-	for (const entry of entries) {
-		const fullPath = path.join(baseDir, entry.name);
-		if (entry.isDirectory()) {
-			await registerRoutes(app, fullPath, path.join(prefix, entry.name));
-			continue;
-		}
-		if (entry.name !== "index.ts") continue;
-		const module = (await import(fullPath)) as Record<string, unknown>;
-		const defaultFn = module.default;
-		if (defaultFn && typeof defaultFn === "function") {
-			app.all(prefix, async ({ request, query, params }) => {
-				const result = await defaultFn({ request, query, params });
-				return result;
-			});
-			console.log(`Registered ${fullPath} on ${prefix} route with method all`);
-		}
-		for (const propName in module) {
-			const prop = module[propName];
-			if (typeof prop !== "function") continue;
-			const fn = prop as RouteFn;
-			const name = fn.name.toLowerCase();
-			if (!["get", "post", "put", "patch", "delete"].includes(name)) continue;
-			app[name as "get"](prefix, async ({ request, query, params }) => {
-				const result = await fn({ request, query, params });
-				return result;
-			});
-			console.log(
-				`Registered ${fullPath} on ${prefix} route with method ${name}`,
-			);
-		}
-	}
-}
-
-type RouteFn = (
-	_: RouteParams,
-) => Promise<Response> | Response | Promise<string> | string;

package/src/routing.ts

@@ -0,0 +1,43 @@
+import fs from "node:fs/promises";
+import path from "node:path";
+import type Elysia from "elysia";
+import type { RouteFn } from "./types";
+
+export async function registerRoutes(
+	app: Elysia,
+	baseDir: string,
+	prefix = "/",
+) {
+	const entries = await fs.readdir(baseDir, { withFileTypes: true });
+	for (const entry of entries) {
+		const fullPath = path.join(baseDir, entry.name);
+		if (entry.isDirectory()) {
+			await registerRoutes(app, fullPath, path.join(prefix, entry.name));
+			continue;
+		}
+		if (entry.name !== "index.ts") continue;
+		const module = (await import(fullPath)) as Record<string, unknown>;
+		const defaultFn = module.default;
+		if (defaultFn && typeof defaultFn === "function") {
+			app.all(prefix, async ({ request, query, params }) => {
+				const result = await defaultFn({ request, query, params });
+				return result;
+			});
+			console.log(`Registered ${fullPath} on ${prefix} route with method all`);
+		}
+		for (const propName in module) {
+			const prop = module[propName];
+			if (typeof prop !== "function") continue;
+			const fn = prop as RouteFn;
+			const name = fn.name.toLowerCase();
+			if (!["get", "post", "put", "patch", "delete"].includes(name)) continue;
+			app[name as "get"](prefix, async ({ request, query, params }) => {
+				const result = await fn({ request, query, params });
+				return result;
+			});
+			console.log(
+				`Registered ${fullPath} on ${prefix} route with method ${name}`,
+			);
+		}
+	}
+}

package/src/types.d.ts

@@ -0,0 +1,16 @@
+export type RouteParams = {
+	query: Record<string, string>;
+	request: Request;
+	params: Record<string, string>;
+};
+
+export type Paths = {
+	routes: string;
+	views: string;
+	public: string;
+	port: number;
+};
+
+export type RouteFn = (
+	_: RouteParams,
+) => Promise<Response> | Response | Promise<string> | string;

package/src/views.ts

@@ -0,0 +1,32 @@
+import fs from "node:fs/promises";
+import path from "node:path";
+
+let viewsPath = "";
+
+export function setViewsPath(path: string) {
+	viewsPath = path;
+}
+
+export async function view(view: string, props: Record<string, unknown>) {
+	if (viewsPath === "")
+		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(/{(.+)}/g, (_, propName) => {
+			return props[propName] as string;
+		})
+		.replace(
+			/<Isset\s+(\w+)>([\s\S]*?)<\/Isset>/g,
+			(_, propName, innerContent) => {
+				if (props[propName] !== undefined && props[propName] !== null)
+					return innerContent;
+				return "";
+			},
+		);
+	return new Response(replacedCode, {
+		headers: { "Content-Type": "text/html; charset=utf-8" },
+	});
+}

package/tsconfig.json

@@ -1,33 +1,32 @@
 {
-  "compilerOptions": {
-    // Environment setup & latest features
-    "lib": ["ESNext"],
-    "target": "ESNext",
-    "module": "Preserve",
-    "moduleDetection": "force",
-    "allowJs": true,
+	"compilerOptions": {
+		// Environment setup & latest features
+		"lib": ["ESNext"],
+		"target": "ESNext",
+		"module": "Preserve",
+		"moduleDetection": "force",
+		"allowJs": true,
 
-    // Bundler mode
-    "moduleResolution": "bundler",
-    "verbatimModuleSyntax": true,
+		// Bundler mode
+		"moduleResolution": "bundler",
+		"verbatimModuleSyntax": true,
 
-    // Best practices
-    "strict": true,
-    "skipLibCheck": true,
-    "noFallthroughCasesInSwitch": true,
-    "noUncheckedIndexedAccess": true,
-    "noImplicitOverride": true,
+		// Best practices
+		"strict": true,
+		"skipLibCheck": true,
+		"noFallthroughCasesInSwitch": true,
+		"noUncheckedIndexedAccess": true,
+		"noImplicitOverride": true,
 
-    // Some stricter flags (disabled by default)
-    "noUnusedLocals": false,
-    "noUnusedParameters": false,
-    "noPropertyAccessFromIndexSignature": false,
-    
-    // Config for npm
-    "noEmit": false, // Changed to false to allow it to compile
-    "outDir": "./dist",
-    "declaration": true, //generates .d.ts
-    
-  },
-  "include": ["src"]
+		// Some stricter flags (disabled by default)
+		"noUnusedLocals": false,
+		"noUnusedParameters": false,
+		"noPropertyAccessFromIndexSignature": false,
+
+		// Config for npm
+		"noEmit": false, // Changed to false to allow it to compile
+		"outDir": "./dist",
+		"declaration": true //generates .d.ts
+	},
+	"include": ["src"]
 }