@primate/angular 0.6.0 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/lib/app.d.ts ADDED
@@ -0,0 +1,5 @@
1
+ declare module "app:angular" {
2
+ import type { RequestPublic } from "@primate/core";
3
+ import type { Signal } from "@angular/core";
4
+ export const request: Signal<RequestPublic>;
5
+ }
package/lib/index.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ import "./app.d.ts";
2
+
3
+ export { default } from "./public/default";
@@ -0,0 +1,2 @@
1
+ import "@angular/compiler";
2
+ //# sourceMappingURL=AAA.d.ts.map
@@ -0,0 +1,2 @@
1
+ import "@angular/compiler";
2
+ //# sourceMappingURL=AAA.js.map
@@ -0,0 +1,5 @@
1
+ import type Payload from "#client/Payload";
2
+ import type { Data as CoreData } from "@primate/core/client";
3
+ type Data = CoreData<Payload>;
4
+ export default Data;
5
+ //# sourceMappingURL=Data.d.ts.map
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=Data.js.map
@@ -0,0 +1,9 @@
1
+ import type { Mode } from "@primate/core";
2
+ import type { Dict } from "@rcompat/type";
3
+ type Payload = {
4
+ views: string[];
5
+ props: Dict[];
6
+ mode: Mode;
7
+ };
8
+ export default Payload;
9
+ //# sourceMappingURL=Payload.d.ts.map
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=Payload.js.map
@@ -1,15 +1,7 @@
1
- import "@angular/compiler";
2
- import type ClientData from "@primate/core/client/Data";
3
- import type Mode from "@primate/core/Mode";
4
- import type { Dict } from "@rcompat/type";
5
- type Data = ClientData<{
6
- views: string[];
7
- props: Dict[];
8
- mode: Mode;
9
- }>;
1
+ import "#client/AAA";
2
+ import type Data from "#client/Data";
10
3
  export default class AngularApp {
11
4
  #private;
12
- static mount(_view: string, data: ClientData<Data>): Promise<void>;
5
+ static mount(_view: string, data: Data): Promise<void>;
13
6
  }
14
- export {};
15
7
  //# sourceMappingURL=app.d.ts.map
@@ -1,19 +1,10 @@
1
+ import "#client/AAA";
2
+ import root from "#client/root";
1
3
  import INITIAL_PROPS from "#INITIAL_PROPS";
2
- import "@angular/compiler";
3
- import { enableProdMode, } from "@angular/core";
4
+ import { enableProdMode } from "@angular/core";
4
5
  import { bootstrapApplication, provideClientHydration, } from "@angular/platform-browser";
5
- import spa from "@primate/core/client/spa";
6
- import root from "angular:root";
7
- import * as views from "angular:views";
8
- const make_props = (data) => ({
9
- views: data.views.map(name => views[name]),
10
- props: data.props,
11
- request: {
12
- ...data.request,
13
- url: new URL(location.href),
14
- },
15
- update: () => undefined,
16
- });
6
+ import client from "@primate/core/client";
7
+ import RootView from "angular:root";
17
8
  export default class AngularApp {
18
9
  static #app;
19
10
  static #root;
@@ -21,17 +12,13 @@ export default class AngularApp {
21
12
  if (data.mode === "production")
22
13
  enableProdMode();
23
14
  const providers = [];
24
- // add hydration provider for SSR
25
15
  if (data.ssr)
26
16
  providers.push(provideClientHydration());
27
- // in non-SSR mode, the HTML won't contain app-root, inject it
28
17
  else
29
18
  document.body.appendChild(document.createElement("app-root"));
30
- // create the root view props
31
- const props = make_props(data);
32
- // bootstrap the application
19
+ const props = root.toProps(data);
33
20
  try {
34
- this.#app = await bootstrapApplication(root, {
21
+ this.#app = await bootstrapApplication(RootView, {
35
22
  providers: [
36
23
  ...providers,
37
24
  {
@@ -41,29 +28,25 @@ export default class AngularApp {
41
28
  ],
42
29
  });
43
30
  this.#root = this.#app.components[0];
44
- // initial props
45
- if (this.#root.instance) {
46
- this.#root.instance.p = props;
47
- // change detection
48
- this.#app.tick();
49
- }
31
+ this.#root.instance.p = props;
32
+ this.#app.tick();
50
33
  if (data.spa) {
51
- this.#spa();
34
+ const start = () => client.boot((next, update) => {
35
+ this.#root.instance.p = root.toProps(next, update);
36
+ this.#app.tick();
37
+ update?.();
38
+ });
39
+ if (document.readyState === "loading") {
40
+ window.addEventListener("DOMContentLoaded", start, { once: true });
41
+ }
42
+ else {
43
+ start();
44
+ }
52
45
  }
53
46
  }
54
47
  catch (error) {
55
48
  console.error("Failed to bootstrap Angular application:", error);
56
49
  }
57
50
  }
58
- static #spa() {
59
- window.addEventListener("DOMContentLoaded", () => {
60
- spa((next, update) => {
61
- const props = { ...make_props(next), update };
62
- this.#root.instance.p = props;
63
- this.#app.tick();
64
- update?.();
65
- });
66
- });
67
- }
68
51
  }
69
52
  //# sourceMappingURL=app.js.map
@@ -1,5 +1,5 @@
1
- import { type Signal } from "@angular/core";
2
- import { type FormInit } from "@primate/core/client";
1
+ import type { Signal } from "@angular/core";
2
+ import type { FormInit } from "@primate/core/client";
3
3
  import type { Dict } from "@rcompat/type";
4
4
  type Field<T> = {
5
5
  name: string;
@@ -10,6 +10,7 @@ type Field<T> = {
10
10
  type FormView<Values extends Dict> = {
11
11
  id: string;
12
12
  submitting: Signal<boolean>;
13
+ submitted: Signal<boolean>;
13
14
  submit: (event?: Event) => Promise<void>;
14
15
  errors: Signal<readonly string[]>;
15
16
  field: <K extends keyof Values & string>(name: K) => Field<Values[K]>;
@@ -1,4 +1,4 @@
1
- import { DestroyRef, computed, inject, signal, } from "@angular/core";
1
+ import { DestroyRef, computed, inject, signal } from "@angular/core";
2
2
  import core from "@primate/core/client";
3
3
  function try_destroy_ref() {
4
4
  try {
@@ -9,16 +9,15 @@ function try_destroy_ref() {
9
9
  }
10
10
  }
11
11
  function form(init) {
12
- const { initial, ...form_init } = init ?? {};
12
+ const { initial, ...form_init } = (init ?? {});
13
13
  const controller = core.createForm(form_init);
14
- const values = initial ?? {};
14
+ const values = (initial ?? {});
15
15
  const snap = signal(controller.read());
16
16
  const unsub = controller.subscribe((next) => snap.set(next));
17
17
  try_destroy_ref()?.onDestroy(unsub);
18
18
  const submitting = computed(() => snap().submitting);
19
+ const submitted = computed(() => snap().submitted);
19
20
  const errors = computed(() => snap().errors.form);
20
- // cache per-field views so templates calling field("x") repeatedly
21
- // don't recreate computed signals every change detection cycle
22
21
  const cache = new Map();
23
22
  function field(name) {
24
23
  const key = name;
@@ -38,6 +37,7 @@ function form(init) {
38
37
  return {
39
38
  id: controller.id,
40
39
  submitting,
40
+ submitted,
41
41
  submit: (event) => controller.submit(event),
42
42
  errors,
43
43
  field,
@@ -0,0 +1,30 @@
1
+ import type Validated from "#client/Validated";
2
+ import form from "#client/form";
3
+ declare const client: {
4
+ form: typeof form;
5
+ field: <T>(initial: T) => {
6
+ delete: (url: string, options?: {
7
+ headers?: import("@rcompat/type").Dict<string>;
8
+ map?: ((v: T) => import("@rcompat/type").JSONValue) | undefined;
9
+ path?: import("@rcompat/type").JSONPointer;
10
+ } | undefined) => Validated<T>;
11
+ patch: (url: string, options?: {
12
+ headers?: import("@rcompat/type").Dict<string>;
13
+ map?: ((v: T) => import("@rcompat/type").JSONValue) | undefined;
14
+ path?: import("@rcompat/type").JSONPointer;
15
+ } | undefined) => Validated<T>;
16
+ post: (url: string, options?: {
17
+ headers?: import("@rcompat/type").Dict<string>;
18
+ map?: ((v: T) => import("@rcompat/type").JSONValue) | undefined;
19
+ path?: import("@rcompat/type").JSONPointer;
20
+ } | undefined) => Validated<T>;
21
+ put: (url: string, options?: {
22
+ headers?: import("@rcompat/type").Dict<string>;
23
+ map?: ((v: T) => import("@rcompat/type").JSONValue) | undefined;
24
+ path?: import("@rcompat/type").JSONPointer;
25
+ } | undefined) => Validated<T>;
26
+ };
27
+ };
28
+ export default client;
29
+ export type { Validated };
30
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1,5 @@
1
+ import field from "#client/field";
2
+ import form from "#client/form";
3
+ const client = { form, field };
4
+ export default client;
5
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,18 @@
1
+ import type Data from "#client/Data";
2
+ import type { Type } from "@angular/core";
3
+ import type { Dict } from "@rcompat/type";
4
+ type ViewComponent = Type<unknown>;
5
+ export type RootProps = {
6
+ views: ViewComponent[];
7
+ props: Dict[];
8
+ request: Data["request"] & {
9
+ url: URL;
10
+ };
11
+ update?: () => void;
12
+ };
13
+ declare function toProps(data: Data, update?: () => void): RootProps;
14
+ declare const root: {
15
+ toProps: typeof toProps;
16
+ };
17
+ export default root;
18
+ //# sourceMappingURL=root.d.ts.map
@@ -0,0 +1,17 @@
1
+ import * as Views from "angular:views";
2
+ function toProps(data, update) {
3
+ return {
4
+ views: data.views.map(name => Views[name]),
5
+ props: data.props,
6
+ request: {
7
+ ...data.request,
8
+ url: new URL(data.request.url),
9
+ },
10
+ update,
11
+ };
12
+ }
13
+ const root = {
14
+ toProps,
15
+ };
16
+ export default root;
17
+ //# sourceMappingURL=root.js.map
@@ -40,6 +40,7 @@ import {
40
40
  } from "@angular/core";
41
41
  import { CommonModule, NgComponentOutlet } from "@angular/common";
42
42
  import INITIAL_PROPS from "@primate/angular/INITIAL_PROPS";
43
+ import { request } from "@primate/angular/app";
43
44
  ${i18n_imports}
44
45
 
45
46
  type Dict = Record<string, any>;
@@ -64,7 +65,10 @@ export default class RootComponent implements OnDestroy {
64
65
  constructor() {
65
66
  try {
66
67
  const initial = inject<any>(INITIAL_PROPS);
67
- if (initial) this.#p = initial;
68
+ if (initial) {
69
+ this.#p = initial;
70
+ request.set(initial.request);
71
+ }
68
72
  } catch {}
69
73
  ${i18n_setup}
70
74
  }
@@ -72,6 +76,7 @@ export default class RootComponent implements OnDestroy {
72
76
  @Input({ required: true })
73
77
  set p(value: RootProps) {
74
78
  this.#p = value;
79
+ request.set(value.request);
75
80
  this.#cdr.markForCheck(); // root on default CD
76
81
  }
77
82
  get p(): RootProps { return this.#p; }
@@ -0,0 +1,7 @@
1
+ declare const _default: (input?: {
2
+ extensions?: string[] | undefined;
3
+ spa?: boolean | undefined;
4
+ ssr?: boolean | undefined;
5
+ } | undefined) => import("@primate/core/frontend").Module;
6
+ export default _default;
7
+ //# sourceMappingURL=default.d.ts.map
@@ -1,14 +1,16 @@
1
1
  import create_root from "#create-root";
2
- import Runtime from "#Runtime";
2
+ import init from "#init";
3
+ import frontend from "@primate/core/frontend";
3
4
  import * as ts from "typescript";
4
- export default class Default extends Runtime {
5
- root = {
5
+ export default frontend({
6
+ ...init,
7
+ root: {
6
8
  create: create_root,
7
- };
8
- css = {
9
+ },
10
+ css: {
9
11
  filter: /\.component\.(css)$/,
10
- };
11
- compile = {
12
+ },
13
+ compile: {
12
14
  client: (text) => {
13
15
  const result = ts.transpileModule(text, {
14
16
  compilerOptions: {
@@ -20,18 +22,14 @@ export default class Default extends Runtime {
20
22
  moduleResolution: ts.ModuleResolutionKind.NodeJs,
21
23
  },
22
24
  });
23
- const styleMatch = text.match(/styles:\s*\[([\s\S]*?)\]/);
24
- let css = "";
25
- if (styleMatch) {
26
- // Extract and process inline styles
27
- css = styleMatch[1]
28
- .replace(/['"`]/g, "")
29
- .replace(/\\n/g, "\n")
30
- .trim();
31
- }
25
+ // extract inline styles
26
+ const style_match = text.match(/styles:\s*\[([\s\S]*?)\]/);
32
27
  return {
33
28
  js: result.outputText,
34
- css,
29
+ css: style_match === null ? "" : style_match[1]
30
+ .replace(/['"`]/g, "")
31
+ .replace(/\\n/g, "\n")
32
+ .trim(),
35
33
  };
36
34
  },
37
35
  server: (text) => {
@@ -49,6 +47,6 @@ export default class Default extends Runtime {
49
47
  // hinder treeshaking
50
48
  return `import "@angular/compiler";\n${result.outputText}`;
51
49
  },
52
- };
53
- }
54
- //# sourceMappingURL=Default.js.map
50
+ },
51
+ });
52
+ //# sourceMappingURL=default.js.map
@@ -0,0 +1,6 @@
1
+ import "@angular/compiler";
2
+ import type { Type } from "@angular/core";
3
+ import type { Init } from "@primate/core/frontend";
4
+ declare const module: Init<Type<any>>;
5
+ export default module;
6
+ //# sourceMappingURL=init.d.ts.map
@@ -1,16 +1,15 @@
1
1
  import INITIAL_PROPS from "#INITIAL_PROPS";
2
2
  import root from "#root-selector";
3
3
  import "@angular/compiler";
4
- import { enableProdMode, importProvidersFrom, } from "@angular/core";
4
+ import { enableProdMode, importProvidersFrom } from "@angular/core";
5
5
  import { bootstrapApplication, BrowserModule, provideClientHydration, } from "@angular/platform-browser";
6
6
  import { provideServerRendering, renderApplication, } from "@angular/platform-server";
7
- import FrontendModule from "@primate/core/frontend/Module";
8
- export default class Runtime extends FrontendModule {
9
- name = "angular";
10
- defaultExtensions = [".component.ts"];
11
- layouts = true;
12
- client = true;
13
- render = async (view, props) => {
7
+ const module = {
8
+ name: "angular",
9
+ extensions: [".component.ts"],
10
+ layouts: true,
11
+ client: true,
12
+ async render(view, props) {
14
13
  const providers = [
15
14
  importProvidersFrom(BrowserModule),
16
15
  provideServerRendering(),
@@ -31,10 +30,10 @@ export default class Runtime extends FrontendModule {
31
30
  body: bodyMatch?.[1] || html,
32
31
  head: headMatch?.[1] || "",
33
32
  };
34
- };
35
- async serve(app, next) {
33
+ },
34
+ onServe(app) {
36
35
  app.mode === "production" && enableProdMode();
37
- return super.serve(app, next);
38
- }
39
- }
40
- //# sourceMappingURL=Runtime.js.map
36
+ },
37
+ };
38
+ export default module;
39
+ //# sourceMappingURL=init.js.map
@@ -0,0 +1,4 @@
1
+ import type { RequestPublic } from "@primate/core";
2
+ declare const request: import("@angular/core").WritableSignal<RequestPublic>;
3
+ export default request;
4
+ //# sourceMappingURL=store.d.ts.map
@@ -0,0 +1,4 @@
1
+ import { signal } from "@angular/core";
2
+ const request = signal(undefined);
3
+ export default request;
4
+ //# sourceMappingURL=store.js.map
@@ -0,0 +1,7 @@
1
+ declare const _default: (input?: {
2
+ extensions?: string[] | undefined;
3
+ spa?: boolean | undefined;
4
+ ssr?: boolean | undefined;
5
+ } | undefined) => import("@primate/core/frontend").Module;
6
+ export default _default;
7
+ //# sourceMappingURL=runtime.d.ts.map
@@ -0,0 +1,4 @@
1
+ import init from "#init";
2
+ import frontend from "@primate/core/frontend";
3
+ export default frontend(init);
4
+ //# sourceMappingURL=runtime.js.map
@@ -0,0 +1,2 @@
1
+ export { default as request } from "#request/store";
2
+ //# sourceMappingURL=app.d.ts.map
@@ -0,0 +1,2 @@
1
+ export { default as request } from "#request/store";
2
+ //# sourceMappingURL=app.js.map
@@ -1,30 +1,3 @@
1
- import type Validated from "#client/Validated";
2
- import form from "#client/form";
3
- declare const client: {
4
- form: typeof form;
5
- field: <T>(initial: T) => {
6
- delete: (url: string, options?: {
7
- headers?: import("@rcompat/type").Dict<string>;
8
- map?: ((v: T) => import("@rcompat/type").JSONValue) | undefined;
9
- path?: import("@rcompat/type").JSONPointer;
10
- } | undefined) => Validated<T>;
11
- patch: (url: string, options?: {
12
- headers?: import("@rcompat/type").Dict<string>;
13
- map?: ((v: T) => import("@rcompat/type").JSONValue) | undefined;
14
- path?: import("@rcompat/type").JSONPointer;
15
- } | undefined) => Validated<T>;
16
- post: (url: string, options?: {
17
- headers?: import("@rcompat/type").Dict<string>;
18
- map?: ((v: T) => import("@rcompat/type").JSONValue) | undefined;
19
- path?: import("@rcompat/type").JSONPointer;
20
- } | undefined) => Validated<T>;
21
- put: (url: string, options?: {
22
- headers?: import("@rcompat/type").Dict<string>;
23
- map?: ((v: T) => import("@rcompat/type").JSONValue) | undefined;
24
- path?: import("@rcompat/type").JSONPointer;
25
- } | undefined) => Validated<T>;
26
- };
27
- };
28
- export default client;
29
- export type { Validated };
1
+ export type * from "#client/index";
2
+ export { default } from "#client/index";
30
3
  //# sourceMappingURL=client.d.ts.map
@@ -1,5 +1,2 @@
1
- import field from "#client/field";
2
- import form from "#client/form";
3
- const client = { form, field };
4
- export default client;
1
+ export { default } from "#client/index";
5
2
  //# sourceMappingURL=client.js.map
@@ -1,4 +1,2 @@
1
- import Default from "#Default";
2
- declare const _default: (options?: typeof Default.input) => Default;
3
- export default _default;
1
+ export { default } from "#default";
4
2
  //# sourceMappingURL=default.d.ts.map
@@ -1,3 +1,2 @@
1
- import Default from "#Default";
2
- export default (options) => new Default(options);
1
+ export { default } from "#default";
3
2
  //# sourceMappingURL=default.js.map
@@ -1,4 +1,2 @@
1
- import Runtime from "#Runtime";
2
- declare const _default: (options?: typeof Runtime.input) => Runtime;
3
- export default _default;
1
+ export { default } from "#runtime";
4
2
  //# sourceMappingURL=runtime.d.ts.map
@@ -1,3 +1,2 @@
1
- import Runtime from "#Runtime";
2
- export default (options) => new Runtime(options);
1
+ export { default } from "#runtime";
3
2
  //# sourceMappingURL=runtime.js.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@primate/angular",
3
- "version": "0.6.0",
3
+ "version": "0.7.0",
4
4
  "description": "Angular for Primate",
5
5
  "homepage": "https://primate.run/docs/frontend/angular",
6
6
  "bugs": "https://github.com/primate-run/primate/issues",
@@ -16,42 +16,47 @@
16
16
  "/lib/**/*.d.ts",
17
17
  "!/**/*.spec.*"
18
18
  ],
19
+ "types": "lib/index.d.ts",
19
20
  "dependencies": {
20
- "@angular/common": "^21.1.4",
21
- "@angular/compiler": "^21.1.4",
22
- "@angular/core": "^21.1.4",
23
- "@angular/platform-browser": "^21.1.4",
24
- "@angular/platform-server": "^21.1.4",
25
- "@angular/ssr": "^21.1.4",
21
+ "@angular/common": "^21.2.7",
22
+ "@angular/compiler": "^21.2.7",
23
+ "@angular/core": "^21.2.7",
24
+ "@angular/platform-browser": "^21.2.7",
25
+ "@angular/platform-server": "^21.2.7",
26
+ "@angular/ssr": "^21.2.6",
26
27
  "typescript": "^5.9.3",
27
- "@primate/core": "^0.5.0"
28
+ "@primate/core": "^0.6.0"
28
29
  },
29
30
  "devDependencies": {
30
- "@rcompat/type": "^0.9.0"
31
+ "@rcompat/type": "^0.11.1",
32
+ "@primate/test": "^0.0.0"
31
33
  },
32
34
  "peerDependencies": {
33
- "primate": "^0.36.0"
35
+ "primate": "^0.37.0"
34
36
  },
35
37
  "imports": {
36
38
  "#*": {
37
- "apekit": "./src/private/*.ts",
39
+ "@primate/source": "./src/private/*.ts",
38
40
  "default": "./lib/private/*.js"
39
41
  }
40
42
  },
41
43
  "exports": {
42
44
  ".": {
45
+ "types": "./lib/index.d.ts",
46
+ "@primate/source": "./src/public/default.ts",
43
47
  "browser": "./lib/public/browser.js",
44
48
  "runtime": "./lib/public/runtime.js",
45
49
  "default": "./lib/public/default.js"
46
50
  },
47
51
  "./*": {
48
- "apekit": "./src/public/*.ts",
52
+ "@primate/source": "./src/public/*.ts",
49
53
  "default": "./lib/public/*.js"
50
54
  }
51
55
  },
52
56
  "scripts": {
53
- "build": "npm run clean && tsc",
57
+ "build": "npm run clean && tsc && cp src/types/{app,index}.d.ts lib",
54
58
  "clean": "rm -rf ./lib",
55
- "lint": "eslint ."
59
+ "lint": "eslint .",
60
+ "test": "npx proby"
56
61
  }
57
62
  }
@@ -1,17 +0,0 @@
1
- import Runtime from "#Runtime";
2
- export default class Default extends Runtime {
3
- root: {
4
- create: (depth: number, i18n_active: boolean) => string;
5
- };
6
- css: {
7
- filter: RegExp;
8
- };
9
- compile: {
10
- client: (text: string) => {
11
- js: string;
12
- css: string;
13
- };
14
- server: (text: string) => string;
15
- };
16
- }
17
- //# sourceMappingURL=Default.d.ts.map
@@ -1,15 +0,0 @@
1
- import "@angular/compiler";
2
- import { type Type } from "@angular/core";
3
- import FrontendModule from "@primate/core/frontend/Module";
4
- import type Render from "@primate/core/frontend/Render";
5
- import type NextServe from "@primate/core/NextServe";
6
- import type ServeApp from "@primate/core/ServeApp";
7
- export default class Runtime extends FrontendModule<Type<any>> {
8
- name: string;
9
- defaultExtensions: string[];
10
- layouts: boolean;
11
- client: boolean;
12
- render: Render<Type<any>>;
13
- serve(app: ServeApp, next: NextServe): Promise<ServeApp>;
14
- }
15
- //# sourceMappingURL=Runtime.d.ts.map