@primate/htmx 0.4.0 → 0.5.0

package/LICENSE

@@ -1,5 +1,3 @@
-Primate HTMX module
-
 Copyright (c) Terrablue <terrablue@proton.me> and contributors.
 
 Permission is hereby granted, free of charge, to any person obtaining a copy

package/eslint.config.js

@@ -0,0 +1 @@
+export {default} from "maximin";

package/exports.js

@@ -1 +1 @@
-export {default, partial} from "./src/handler.js";
+export {default} from "./src/module.js";

package/package.json

@@ -1,23 +1,17 @@
 {
   "name": "@primate/htmx",
-  "version": "0.4.0",
-  "author": "Terrablue <terrablue@proton.me>",
-  "homepage": "https://primatejs.com/modules/htmx",
-  "bugs": "https://github.com/primatejs/primate-htmx/issues",
-  "repository": "https://github.com/primatejs/primate-htmx",
+  "version": "0.5.0",
   "description": "Primate HTMX module",
+  "homepage": "https://primatejs.com/modules/htmx",
+  "bugs": "https://github.com/primatejs/htmx/issues",
   "license": "MIT",
+  "repository": "https://github.com/primatejs/htmx",
   "dependencies": {
-    "htmt": "^0.1.0",
     "htmx.org": "^1.8.6",
-    "runtime-compat": "^0.12.3"
+    "runtime-compat": "^0.14.1"
   },
   "devDependencies": {
-    "@babel/core": "^7.21.0",
-    "@babel/eslint-parser": "^7.19.1",
-    "@babel/plugin-syntax-import-assertions": "^7.20.0",
-    "eslint": "^8.36.0",
-    "eslint-plugin-json": "^3.1.0"
+    "maximin": "^0.1.2"
   },
   "type": "module",
   "exports": "./exports.js",

package/src/module.js

@@ -0,0 +1,61 @@
+import {Path} from "runtime-compat/filesystem";
+import crypto from "runtime-compat/crypto";
+
+const fileName = "htmx.min.js";
+const scriptPath = ["node_modules", "htmx.org", "dist", fileName];
+
+const hash = async (string, algorithm = "sha-384") => {
+  const buffer = new ArrayBuffer(string.length);
+  const view = new Uint8Array(buffer);
+  for (let i = 0; i < string.length; i++) {
+    view[i] = string.charCodeAt(i);
+  }
+  const bytes = await crypto.subtle.digest(algorithm, buffer);
+  return btoa(String.fromCharCode(...new Uint8Array(bytes)));
+};
+
+const getContent = async (env, name) => {
+  try {
+    return await env.paths.components.join(`${name}.html`).file.read();
+  } catch (error) {
+    throw new Error(`cannot load component at ${name}.html`);
+  }
+};
+
+const handler = (content, {status = 200, partial = false, adhoc = false} = {}) =>
+  async (env, headers) => {
+    const src = `/${fileName}`;
+    const htmx = env.paths.public.join(fileName);
+    const integrity = `sha384-${await hash(await htmx.file.read())}`;
+    const head = `<script src="${src}" integrity="${integrity}"></script>`;
+    const body = adhoc ? content : await getContent(env, content);
+    const scriptSrc = `script-src 'self' '${integrity}';`;
+    const styleSrc = "style-src 'unsafe-inline';";
+    const csp = `${headers["Content-Security-Policy"]}${scriptSrc}${styleSrc}`;
+    const options = {
+      status,
+      headers: {
+        ...headers,
+        "Content-Type": "text/html",
+        "Content-Security-Policy": csp,
+      },
+    };
+
+    return [partial ? body : await env.render({head, body}), options];
+  };
+
+export default () => () => {
+  return {
+    register: async (env, next) => {
+      env.register("htmx", handler);
+      return next(env);
+    },
+    bundle: async (env, next) => {
+      const htmx = env.paths.public.join(fileName);
+      if (!await htmx.exists) {
+        await Path.resolve().join(...scriptPath).file.copy(`${htmx}`);
+      }
+      return next(env);
+    },
+  };
+};

package/src/handler.js

@@ -1,82 +0,0 @@
-import {Path, File} from "runtime-compat/filesystem";
-import crypto from "runtime-compat/crypto";
-import {fulfill, flatten} from "htmt";
-
-const last = -1;
-
-const index_html = "index.html";
-const preset = await new Path(import.meta.url).directory.join(index_html).file
-  .read();
-
-const getIndex = async env => {
-  try {
-    return await File.read(`${env.paths.static.join(index_html)}`);
-  } catch (error) {
-    return preset;
-  }
-};
-
-const fileName = "htmx.min.js";
-const scriptPath = ["node_modules", "htmx.org", "dist", fileName];
-
-const hash = async (string, algorithm = "sha-384") => {
-  const buffer = new ArrayBuffer(string.length);
-  const view = new Uint8Array(buffer);
-  for (let i = 0; i < string.length; i++) {
-    view[i] = string.charCodeAt(i);
-  }
-  const bytes = await crypto.subtle.digest(algorithm, buffer);
-  return btoa(String.fromCharCode(...new Uint8Array(bytes)));
-};
-
-const render = async (strings, keys, path) => {
-  const loadFile = async file => [file.base, (await file.read())
-    .replaceAll("\n", "")];
-  const components = await path.exists
-    ? Object.fromEntries(await Promise.all((
-      await File.collect(`${path}`, ".html")).map(loadFile)))
-    : {};
-  const re = strings
-    .slice(0, last)
-    .map((string, i) => `${string}\${${i}}`)
-    .join("") + strings[strings.length + last];
-  return flatten(await fulfill(re, components, await Promise.all(keys)));
-};
-
-export const partial = (strings, ...keys) => async (env, headers) =>
-  // -> spread into new Response()
-  [await render(strings, keys, env.paths.components), {status: 200, headers}];
-
-export default (strings, ...keys) => async (env, headers) => {
-  // if doesn't exist, copy htmx file to public
-  // if public doesn't exist, create it
-  const _public = env.paths.public;
-  if (!await _public.exists) {
-    await _public.file.create();
-  }
-  const htmx = _public.join(fileName);
-  if (!await htmx.exists) {
-    await Path.resolve().join(...scriptPath).file.copy(`${htmx}`);
-  }
-  const src = `/${fileName}`;
-  const integrity = `sha384-${await hash(await htmx.file.read())}`;
-  const script = `<script src="${src}" integrity="${integrity}"></script>`;
-  const index = (await getIndex(env)).replace("</head>", `${script}</head>`);
-  const html = await render(strings, keys, env.paths.components);
-  const body = index.replace("<body>", () => `<body>${html}`);
-
-  const script_src = `script-src 'self' '${integrity}';`;
-  const style_src = "style-src 'unsafe-inline';";
-  const csp = `${headers["Content-Security-Policy"]}${script_src}${style_src}`;
-  const options = {
-    status: 200,
-    headers: {
-      ...headers,
-      "Content-Type": "text/html",
-      "Content-Security-Policy": csp,
-    },
-  };
-
-  // -> spread into new Response()
-  return [body, options];
-};

package/src/index.html

@@ -1,8 +0,0 @@
-<!doctype html>
-<html>
-  <head>
-    <title>Primate app</title>
-    <meta charset="utf-8" />
-  </head>
-  <body></body>
-</html>