@primate/html 0.10.2 → 0.11.0

package/lib/private/Default.d.ts

@@ -0,0 +1,7 @@
+import Runtime from "#Runtime";
+export default class Default extends Runtime {
+    compile: {
+        server: (text: string) => string;
+    };
+}
+//# sourceMappingURL=Default.d.ts.map

package/lib/private/Default.js

@@ -0,0 +1,11 @@
+import Runtime from "#Runtime";
+import dedent from "@rcompat/string/dedent";
+export default class Default extends Runtime {
+    compile = {
+        server: (text) => dedent `
+      import render from "@primate/html/render";
+
+      export default props => render(${JSON.stringify(text)}, props);`,
+    };
+}
+//# sourceMappingURL=Default.js.map

package/lib/private/Runtime.d.ts

@@ -0,0 +1,10 @@
+import FrontendModule from "@primate/core/frontend/Module";
+import type ViewResponse from "@primate/core/frontend/ViewResponse";
+export default class Runtime extends FrontendModule {
+    name: string;
+    defaultExtensions: string[];
+    layouts: boolean;
+    client: boolean;
+    respond: ViewResponse;
+}
+//# sourceMappingURL=Runtime.d.ts.map

package/lib/private/Runtime.js

@@ -0,0 +1,10 @@
+import response from "#response";
+import FrontendModule from "@primate/core/frontend/Module";
+export default class Runtime extends FrontendModule {
+    name = "html";
+    defaultExtensions = [".html"];
+    layouts = false;
+    client = false;
+    respond = response(this);
+}
+//# sourceMappingURL=Runtime.js.map

package/lib/private/render.d.ts

@@ -0,0 +1,9 @@
+import type Dict from "@rcompat/type/Dict";
+/**
+ * Render an HTML template with ${...} interpolation outside shielded tags.
+ * - Shield <script>/<style>/<template>/<textarea> so their contents are kept
+ * - Deep-escape all string values in props before interpolation
+ * - Authors can write \${...} (outside shields) to emit a literal ${...}
+ */
+export default function render(template: string, props: Dict): string;
+//# sourceMappingURL=render.d.ts.map

package/lib/private/render.js

@@ -0,0 +1,81 @@
+import escape from "@rcompat/html/escape";
+const TAGS = ["script", "style", "template", "textarea"];
+const token = (i) => `__SLOT_${i}__`;
+function shield(html) {
+    const slots = [];
+    const re = new RegExp(`<(?:${TAGS.join("|")})\\b[^>]*>[\\s\\S]*?<\\/(?:${TAGS.join("|")})>`, "gi");
+    const code = html.replace(re, m => (slots.push(m), token(slots.length - 1)));
+    return {
+        code,
+        restore: (s) => s.replace(/__SLOT_(\d+)__/g, (_, n) => slots[+n]),
+    };
+}
+function interpolate(template, props) {
+    let out = "", i = 0;
+    while (i < template.length) {
+        const j = template.indexOf("${", i);
+        if (j === -1) {
+            out += template.slice(i);
+            break;
+        }
+        out += template.slice(i, j);
+        // brace/quote-aware scan
+        let k = j + 2, depth = 1, quote = null, esc = false;
+        while (k < template.length && depth > 0) {
+            const ch = template[k++];
+            if (quote) {
+                if (esc)
+                    esc = false;
+                else if (ch === "\\")
+                    esc = true;
+                else if (ch === quote)
+                    quote = null;
+            }
+            else {
+                if (ch === "'" || ch === "\"" || ch === "`")
+                    quote = ch;
+                else if (ch === "{")
+                    depth++;
+                else if (ch === "}")
+                    depth--;
+            }
+        }
+        if (depth)
+            throw new Error("Unbalanced ${...} expression in template");
+        const expr = template.slice(j + 2, k - 1);
+        // evaluate with props in scope (non-strict by default)
+        const value = Function("p", `with (p) { return (${expr}); }`)(props);
+        out += String(value);
+        i = k;
+    }
+    return out;
+}
+/**
+ * Render an HTML template with ${...} interpolation outside shielded tags.
+ * - Shield <script>/<style>/<template>/<textarea> so their contents are kept
+ * - Deep-escape all string values in props before interpolation
+ * - Authors can write \${...} (outside shields) to emit a literal ${...}
+ */
+export default function render(template, props) {
+    const XXX = `__LBRACE_${Math.random().toString(36).slice(2)}__`;
+    // shield first so we don't touch \${ inside scripts/styles/etc.
+    const { code, restore } = shield(template);
+    // replace \${ with a placeholder in non-shielded content
+    const outside = code.replace(/\\\$\{/g, XXX);
+    // deep-escape all strings in props (JSON-serializable only)
+    let safe;
+    try {
+        safe = JSON.parse(escape(JSON.stringify(props)));
+    }
+    catch {
+        throw new Error("render(): props must be JSON-serializable for escaping");
+    }
+    // null-prototype view to avoid prototype lookups in `with`
+    const p = Object.assign(Object.create(null), safe);
+    // interpolate & restore
+    const interpolated = interpolate(outside, p);
+    const restored = restore(interpolated);
+    // put back literal \${ sequences
+    return restored.split(XXX).join("${");
+}
+//# sourceMappingURL=render.js.map

package/lib/private/response.d.ts

@@ -0,0 +1,4 @@
+import type Module from "@primate/core/frontend/Module";
+import type ViewResponse from "@primate/core/frontend/ViewResponse";
+export default function response(m: Module): ViewResponse;
+//# sourceMappingURL=response.d.ts.map

package/lib/private/response.js

@@ -0,0 +1,33 @@
+import inline from "@primate/core/inline";
+const SCRIPT = /(?<=<script)>(?<code>.*?)(?=<\/script>)/gus;
+const STYLE = /(?<=<style)>(?<code>.*?)(?=<\/style>)/gus;
+const REMOVE = /<(?<tag>script|style)>.*?<\/\k<tag>>/gus;
+export default function response(m) {
+    return (name, props = {}, options = {}) => async (app) => {
+        const component = app.component(name);
+        const rendered = await m.render(component, props);
+        const { csp = {}, headers, ...rest } = options;
+        const { script_src: xScriptSrc = [], style_src: xStyleSrc = [] } = csp;
+        const scripts = await Promise.all([...rendered.body.matchAll(SCRIPT)]
+            .flatMap(({ groups }) => groups?.code !== undefined
+            ? inline(groups.code, "module")
+            : []));
+        const styles = await Promise.all([...rendered.body.matchAll(STYLE)]
+            .flatMap(({ groups }) => groups?.code !== undefined
+            ? inline(groups.code, "style")
+            : []));
+        const styleSrc = styles.map(asset => asset.integrity).concat(xStyleSrc);
+        const scriptSrc = scripts.map(asset => asset.integrity).concat(xScriptSrc);
+        const head = [...scripts, ...styles].map(asset => asset.head).join("\n");
+        return app.view({
+            body: rendered.body.replaceAll(REMOVE, () => ""),
+            head: head,
+            headers: {
+                ...app.headers({ "script-src": scriptSrc, "style-src": styleSrc }),
+                ...headers,
+            },
+            ...rest,
+        });
+    };
+}
+//# sourceMappingURL=response.js.map

package/lib/public/default.d.ts

@@ -0,0 +1,4 @@
+import Default from "#Default";
+declare const _default: (options?: typeof Default.input) => Default;
+export default _default;
+//# sourceMappingURL=default.d.ts.map

package/lib/public/default.js

@@ -0,0 +1,3 @@
+import Default from "#Default";
+export default (options) => new Default(options);
+//# sourceMappingURL=default.js.map

package/lib/public/render.d.ts

@@ -0,0 +1,2 @@
+export { default } from "#render";
+//# sourceMappingURL=render.d.ts.map

package/lib/public/render.js

@@ -0,0 +1,2 @@
+export { default } from "#render";
+//# sourceMappingURL=render.js.map

package/lib/public/response.d.ts

@@ -0,0 +1,2 @@
+export { default } from "#response";
+//# sourceMappingURL=response.d.ts.map

package/lib/public/response.js

@@ -0,0 +1,2 @@
+export { default } from "#response";
+//# sourceMappingURL=response.js.map

package/lib/public/runtime.d.ts

@@ -0,0 +1,4 @@
+import Runtime from "#Runtime";
+declare const _default: (options?: typeof Runtime.input) => Runtime;
+export default _default;
+//# sourceMappingURL=runtime.d.ts.map

package/lib/public/runtime.js

@@ -0,0 +1,3 @@
+import Runtime from "#Runtime";
+export default (options) => new Runtime(options);
+//# sourceMappingURL=runtime.js.map

package/package.json

@@ -1,46 +1,49 @@
 {
   "name": "@primate/html",
-  "version": "0.10.2",
+  "version": "0.11.0",
   "description": "Primate HTML frontend",
-  "homepage": "https://primatejs.com/modules/html",
-  "bugs": "https://github.com/primatejs/primate/issues",
+  "homepage": "https://primate.run/docs/frontend/html",
+  "bugs": "https://github.com/primate-run/primate/issues",
   "license": "MIT",
   "files": [
-    "src/**/*.js",
-    "!src/**/*.spec.js"
+    "/lib/**/*.js",
+    "/lib/**/*.d.ts",
+    "!/**/*.spec.*"
   ],
   "repository": {
     "type": "git",
-    "url": "https://github.com/primatejs/primate",
+    "url": "https://github.com/primate-run/primate",
     "directory": "packages/html"
   },
   "dependencies": {
-    "@rcompat/string": "^0.4.0",
-    "@primate/frontend": "^0.16.1"
+    "@rcompat/assert": "^0.3.1",
+    "@rcompat/html": "^0.6.0",
+    "@rcompat/string": "^0.10.0",
+    "@primate/core": "^0.2.0"
   },
   "peerDependencies": {
-    "primate": "^0.32.2"
+    "primate": "^0.33.0"
   },
   "type": "module",
   "imports": {
     "#*": {
-      "@primate/lt": "./src/private/*.js",
-      "default": "./src/private/*.js"
-    },
-    "#build": {
-      "@primate/lt": "./src/private/build/index.js",
-      "default": "./src/private/build/index.js"
-    },
-    "#serve": {
-      "@primate/lt": "./src/private/serve/index.js",
-      "default": "./src/private/serve/index.js"
+      "apekit": "./src/private/*.ts",
+      "default": "./lib/private/*.js"
     }
   },
   "exports": {
     ".": {
-      "runtime": "./src/public/runtime.js",
-      "default": "./src/public/default.js"
+      "runtime": "./lib/public/runtime.js",
+      "default": "./lib/public/default.js"
     },
-    "./*": "./src/public/*.js"
+    "./*": {
+      "apekit": "./src/public/*.ts",
+      "default": "./lib/public/*.js"
+    }
+  },
+  "scripts": {
+    "build": "npm run clean && tsc",
+    "clean": "rm -rf ./lib",
+    "lint": "eslint ."
   }
 }

package/src/private/build/index.js

@@ -1,18 +0,0 @@
-import name from "#name";
-import compile from "@primate/frontend/core/compile";
-import server from "./server.js";
-
-export default extension => async (app, next) => {
-  app.register(extension, {
-    ...await compile({
-      app,
-      extension,
-      name,
-      compile: { server },
-    }),
-    // no support for hydration
-    client: _ => _,
-  });
-
-  return next(app);
-};

package/src/private/build/server.js

@@ -1,8 +0,0 @@
-export default text => `import HTML from "@primate/html/escape";
-  export default (props = {}, options) => {
-  const encoded = JSON.parse(escape(JSON.stringify(props)));
-  const keys = Object.keys(encoded);
-  const values = Object.values(encoded);
-  const text = ${JSON.stringify(text)};
-  return new Function(...keys, \`return \\\`\${text}\\\`;\`)(...values);
-}`;

package/src/private/extension.js

@@ -1 +0,0 @@
-export default ".html";

package/src/private/handler.js

@@ -1,29 +0,0 @@
-import render from "@primate/frontend/core/render";
-
-const script_re = /(?<=<script)>(?<code>.*?)(?=<\/script>)/gus;
-const style_re = /(?<=<style)>(?<code>.*?)(?=<\/style>)/gus;
-const remove = /<(?<tag>script|style)>.*?<\/\k<tag>>/gus;
-
-export default (name, props = {}, options = {}) => async app => {
-  const component = await app.get_component(name);
-  const rendered = render(component, props);
-  const { head: xhead = [], csp = {}, headers, ...rest } = options;
-  const { script_src: xscript_src = [], style_src: xstyle_src = [] } = csp;
-  const scripts = await Promise.all([...rendered.matchAll(script_re)]
-    .map(({ groups: { code } }) => app.inline(code, "module")));
-  const styles = await Promise.all([...rendered.matchAll(style_re)]
-    .map(({ groups: { code } }) => app.inline(code, "style")));
-  const style_src = styles.map(asset => asset.integrity).concat(xstyle_src);
-  const script_src = scripts.map(asset => asset.integrity).concat(xscript_src);
-  const head = [...scripts, ...styles].map(asset => asset.head);
-
-  return app.view({
-    body: rendered.replaceAll(remove, _ => ""),
-    head: [...head, ...xhead].join("\n"),
-    headers: {
-      ...app.headers({ "style-src": style_src, "script-src": script_src }),
-      ...headers,
-    },
-    ...rest,
-  });
-};

package/src/private/name.js

@@ -1 +0,0 @@
-export default "html";

package/src/private/pkgname.js

@@ -1 +0,0 @@
-export default "@primate/html";

package/src/private/serve/index.js

@@ -1,7 +0,0 @@
-import handler from "#handler";
-
-export default extension => (app, next) => {
-  app.register(extension, handler);
-
-  return next(app);
-};

package/src/public/default.js

@@ -1,10 +0,0 @@
-import build from "#build";
-import default_extension from "#extension";
-import pkgname from "#pkgname";
-import serve from "#serve";
-
-export default ({ extension = default_extension } = {}) => ({
-  name: pkgname,
-  build: build(extension),
-  serve: serve(extension),
-});

package/src/public/escape.js

@@ -1 +0,0 @@
-export { default } from "@rcompat/string/HTML";

package/src/public/handler.js

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

package/src/public/runtime.js

@@ -1,8 +0,0 @@
-import default_extension from "#extension";
-import pkgname from "#pkgname";
-import serve from "#serve";
-
-export default ({ extension = default_extension } = {}) => ({
-  name: pkgname,
-  serve: serve(extension),
-});