@primate/angular 0.1.0

package/LICENSE

@@ -0,0 +1,19 @@
+Copyright (c) Terrablue <terrablue@proton.me> and contributors.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
+THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

package/package.json

@@ -0,0 +1,53 @@
+{
+  "name": "@primate/angular",
+  "version": "0.1.0",
+  "description": "Primate Angular frontend",
+  "homepage": "https://primatejs.com/modules/angular",
+  "bugs": "https://github.com/primatejs/primate/issues",
+  "license": "MIT",
+  "files": [
+    "src/**/*.js",
+    "!src/**/*.spec.js"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/primatejs/primate",
+    "directory": "packages/angular"
+  },
+  "dependencies": {
+    "@angular/compiler": "18",
+    "@angular/core": "18",
+    "@angular/platform-browser": "18",
+    "@angular/platform-server": "18",
+    "@angular/ssr": "18",
+    "@rcompat/build": "^0.4.0",
+    "@rcompat/object": "^0.5.0",
+    "zone.js": "0.14",
+    "@primate/frontend": "^0.16.0"
+  },
+  "peerDependencies": {
+    "vue": "3",
+    "primate": "^0.32.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"
+    }
+  },
+  "exports": {
+    ".": {
+      "runtime": "./src/public/runtime.js",
+      "default": "./src/public/default.js"
+    }
+  }
+}

package/src/private/build/index.js

@@ -0,0 +1,15 @@
+import server from "./server.js";
+
+export default extension => async (app, next) => {
+  const extensions = {
+    from: extension,
+    to: ".js",
+  };
+
+  app.register(extension, {
+    server: component => server(app, component, extensions),
+    client: _ => _,
+  });
+
+  return next(app);
+};

package/src/private/build/server.js

@@ -0,0 +1,20 @@
+import transform from "@rcompat/build/transform";
+
+const options = {
+  loader: "ts",
+  tsconfig: {
+    compilerOptions: {
+      experimentalDecorators: true,
+    },
+  },
+};
+
+export default async (app, component, extensions) => {
+  const location = app.get("location");
+  const source = app.runpath(location.components);
+  const { code } = await transform(await component.text(), options);
+  const target_base = app.runpath(location.server, location.components);
+  const path = target_base.join(`${component.path}.js`.replace(source, ""));
+  await path.directory.create();
+  await path.write(code.replaceAll(extensions.from, extensions.to));
+};

package/src/private/extension.js

@@ -0,0 +1 @@
+export default ".component.ts";

package/src/private/pkgname.js

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

package/src/private/serve/index.js

@@ -0,0 +1,10 @@
+import serve from "@primate/frontend/core/serve";
+import render from "./render.js";
+import set_mode from "./set-mode.js";
+
+export default extension => {
+  // todo: base on app mode
+  set_mode("production");
+
+  return serve({ render })(extension);
+};

package/src/private/serve/make-root.js

@@ -0,0 +1,17 @@
+import { reflectComponentType } from "@angular/core";
+import stringify from "@rcompat/object/stringify";
+import root_component from "./root-component.js";
+
+const double_to_single = string => string.replaceAll("\"", "'");
+
+export default (real_root, props) => {
+  const { selector } = reflectComponentType(real_root);
+  const attributes = Object.entries(props)
+    .map(([key, value]) => `[${key}]="${double_to_single(stringify(value))}"`)
+    .join(" ");
+
+  return root_component({
+    imports: [real_root],
+    template: `<${selector} ${attributes}></${selector}>`,
+  });
+};

package/src/private/serve/render.js

@@ -0,0 +1,33 @@
+import "@angular/compiler";
+import {
+  bootstrapApplication,
+  provideClientHydration,
+} from "@angular/platform-browser";
+import {
+  provideServerRendering,
+  renderApplication,
+  ɵSERVER_CONTEXT,
+} from "@angular/platform-server";
+import "zone.js";
+import make_root from "./make-root.js";
+import selector from "./selector.js";
+
+// const common_engine = new CommonEngine();
+
+export default async (given_component, props) => {
+  const component = make_root(given_component, props);
+  const document = `<${selector}></${selector}>`;
+  const bootstrap = () => bootstrapApplication(component, {
+    providers: [
+      provideServerRendering(),
+     { provide: ɵSERVER_CONTEXT, useValue: "analog" },
+     ...component.renderProviders || [],
+     provideClientHydration(),
+    ],
+  });
+  const html = await renderApplication(bootstrap, { document });
+  const b_s = "<body>";
+  const b_e = "</body>";
+  // await common_engine.render({ bootstrap, document });
+  return html.slice(html.indexOf(b_s) + b_s.length, html.indexOf(b_e));
+};

package/src/private/serve/root-component.js

@@ -0,0 +1,9 @@
+import { Component as component } from "@angular/core";
+import selector from "./selector.js";
+
+export default ({ template, imports }) => component({
+  selector,
+  imports,
+  template,
+  standalone: true,
+})(class {});

package/src/private/serve/selector.js

@@ -0,0 +1 @@
+export default "app-root";

package/src/private/serve/set-mode.js

@@ -0,0 +1,7 @@
+import { enableProdMode } from "@angular/core";
+
+export default mode => {
+  if (mode === "production") {
+    enableProdMode();
+  }
+};

package/src/public/default.js

@@ -0,0 +1,10 @@
+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/runtime.js

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