@analogjs/astro-angular 2.0.0-beta.2 → 2.0.0-beta.20
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/README.md +16 -19
- package/package.json +12 -14
- package/src/client.d.ts +0 -1
- package/src/client.d.ts.map +1 -1
- package/src/client.js +38 -39
- package/src/client.js.map +1 -1
- package/src/index.d.ts.map +1 -1
- package/src/index.js +2 -10
- package/src/index.js.map +1 -1
- package/src/server.d.ts +0 -1
- package/src/server.d.ts.map +1 -1
- package/src/server.js +2 -2
- package/src/server.js.map +1 -1
package/README.md
CHANGED
|
@@ -93,7 +93,7 @@ yarn add @analogjs/astro-angular
|
|
|
93
93
|
### Install the necessary Angular dependencies
|
|
94
94
|
|
|
95
95
|
```sh
|
|
96
|
-
|
|
96
|
+
npm install @angular/build @angular/{animations,common,compiler-cli,compiler,core,language-service,forms,platform-browser,platform-server} rxjs tslib --save
|
|
97
97
|
```
|
|
98
98
|
|
|
99
99
|
### Adding the integration
|
|
@@ -178,28 +178,27 @@ export default defineConfig({
|
|
|
178
178
|
The Astro Angular integration **only** supports rendering standalone components:
|
|
179
179
|
|
|
180
180
|
```ts
|
|
181
|
-
import { NgIf } from '@angular/common';
|
|
182
181
|
import { Component, Input } from '@angular/core';
|
|
183
182
|
|
|
184
183
|
@Component({
|
|
185
184
|
selector: 'app-hello',
|
|
186
|
-
standalone: true,
|
|
187
|
-
imports: [NgIf],
|
|
188
185
|
template: `
|
|
189
186
|
<p>Hello from Angular!!</p>
|
|
190
187
|
|
|
191
|
-
|
|
188
|
+
@if (show()) {
|
|
189
|
+
<p>{{ helpText() }}</p>
|
|
190
|
+
}
|
|
192
191
|
|
|
193
192
|
<button (click)="toggle()">Toggle</button>
|
|
194
193
|
`,
|
|
195
194
|
})
|
|
196
195
|
export class HelloComponent {
|
|
197
|
-
|
|
196
|
+
helpText = input('help');
|
|
198
197
|
|
|
199
|
-
show = false;
|
|
198
|
+
show = signal(false);
|
|
200
199
|
|
|
201
200
|
toggle() {
|
|
202
|
-
this.show
|
|
201
|
+
this.show.update((show) => !show);
|
|
203
202
|
}
|
|
204
203
|
}
|
|
205
204
|
```
|
|
@@ -269,7 +268,6 @@ These are `renderProviders` and `clientProviders` respectively. These providers
|
|
|
269
268
|
|
|
270
269
|
```ts
|
|
271
270
|
import { Component, OnInit, inject } from '@angular/core';
|
|
272
|
-
import { NgFor } from '@angular/common';
|
|
273
271
|
import { provideHttpClient, HttpClient } from '@angular/common/http';
|
|
274
272
|
|
|
275
273
|
interface Todo {
|
|
@@ -280,15 +278,15 @@ interface Todo {
|
|
|
280
278
|
|
|
281
279
|
@Component({
|
|
282
280
|
selector: 'app-todos',
|
|
283
|
-
standalone: true,
|
|
284
|
-
imports: [NgFor],
|
|
285
281
|
template: `
|
|
286
282
|
<h2>Todos</h2>
|
|
287
283
|
|
|
288
284
|
<ul>
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
285
|
+
@for (todo of todos(); track todo.id) {
|
|
286
|
+
<li>
|
|
287
|
+
{{ todo.title }}
|
|
288
|
+
</li>
|
|
289
|
+
}
|
|
292
290
|
</ul>
|
|
293
291
|
`,
|
|
294
292
|
})
|
|
@@ -297,12 +295,12 @@ export class TodosComponent implements OnInit {
|
|
|
297
295
|
static renderProviders = [TodosComponent.clientProviders];
|
|
298
296
|
|
|
299
297
|
http = inject(HttpClient);
|
|
300
|
-
todos
|
|
298
|
+
todos = signal<Todo[]>([]);
|
|
301
299
|
|
|
302
300
|
ngOnInit() {
|
|
303
301
|
this.http
|
|
304
302
|
.get<Todo[]>('https://jsonplaceholder.typicode.com/todos')
|
|
305
|
-
.subscribe((todos) =>
|
|
303
|
+
.subscribe((todos) => this.todos.set(todos));
|
|
306
304
|
}
|
|
307
305
|
}
|
|
308
306
|
```
|
|
@@ -311,15 +309,13 @@ export class TodosComponent implements OnInit {
|
|
|
311
309
|
|
|
312
310
|
To use components with MDX pages, you must install and configure MDX support by following the Astro integration of [@astrojs/mdx](https://docs.astro.build/en/guides/integrations-guide/mdx/). Your `astro.config.mjs` should now include the `@astrojs/mdx` integration.
|
|
313
311
|
|
|
314
|
-
> Note: Shiki is the default syntax highlighter for the MDX plugin and is currently unsupported. `astro-angular` will override this with `prism` but you should specify it in the config to prevent warnings or issues.
|
|
315
|
-
|
|
316
312
|
```js
|
|
317
313
|
import { defineConfig } from 'astro/config';
|
|
318
314
|
import mdx from '@astrojs/mdx';
|
|
319
315
|
import angular from '@analogjs/astro-angular';
|
|
320
316
|
|
|
321
317
|
export default defineConfig({
|
|
322
|
-
integrations: [mdx(
|
|
318
|
+
integrations: [mdx(), angular()],
|
|
323
319
|
});
|
|
324
320
|
```
|
|
325
321
|
|
|
@@ -360,3 +356,4 @@ import { HelloComponent } from "../../components/hello.component.ts";
|
|
|
360
356
|
## Current Limitations
|
|
361
357
|
|
|
362
358
|
- Only standalone Angular components in version v14.2+ are supported
|
|
359
|
+
- Content projection to island components is not supported
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@analogjs/astro-angular",
|
|
3
|
-
"version": "2.0.0-beta.
|
|
3
|
+
"version": "2.0.0-beta.20",
|
|
4
4
|
"description": "Use Angular components within Astro",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"author": "Brandon Roberts <robertsbt@gmail.com>",
|
|
@@ -32,21 +32,19 @@
|
|
|
32
32
|
"url": "https://github.com/sponsors/brandonroberts"
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
|
-
"@analogjs/vite-plugin-angular": "^2.0.0-beta.
|
|
35
|
+
"@analogjs/vite-plugin-angular": "^2.0.0-beta.20"
|
|
36
36
|
},
|
|
37
37
|
"peerDependencies": {
|
|
38
|
-
"@angular
|
|
39
|
-
"@angular/animations": ">=
|
|
40
|
-
"@angular/common": ">=
|
|
41
|
-
"@angular/compiler-cli": ">=
|
|
42
|
-
"@angular/compiler": ">=
|
|
43
|
-
"@angular/core": ">=
|
|
44
|
-
"@angular/language-service": ">=
|
|
45
|
-
"@angular/platform-browser": ">=
|
|
46
|
-
"@angular/platform-
|
|
47
|
-
"
|
|
48
|
-
"rxjs": "^7.5.6",
|
|
49
|
-
"zone.js": ">=0.13.3",
|
|
38
|
+
"@angular/build": ">=20.0.0",
|
|
39
|
+
"@angular/animations": ">=20.0.0",
|
|
40
|
+
"@angular/common": ">=20.0.0",
|
|
41
|
+
"@angular/compiler-cli": ">=20.0.0",
|
|
42
|
+
"@angular/compiler": ">=20.0.0",
|
|
43
|
+
"@angular/core": ">=20.0.0",
|
|
44
|
+
"@angular/language-service": ">=20.0.0",
|
|
45
|
+
"@angular/platform-browser": ">=20.0.0",
|
|
46
|
+
"@angular/platform-server": ">=20.0.0",
|
|
47
|
+
"rxjs": "^7.8.0",
|
|
50
48
|
"tslib": "^2.4.0"
|
|
51
49
|
},
|
|
52
50
|
"ng-update": {
|
package/src/client.d.ts
CHANGED
package/src/client.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../../../../packages/astro-angular/src/client.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../../../../packages/astro-angular/src/client.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,oBAAoB,EACpB,QAAQ,EAER,cAAc,IAAI,aAAa,EAEhC,MAAM,eAAe,CAAC;yBAKP,SAAS,WAAW,MAEhC,WAAW,aAAa,CAAC,OAAO,CAAC,GAAG;IAClC,eAAe,CAAC,EAAE,CAAC,QAAQ,GAAG,oBAAoB,CAAC,EAAE,CAAC;CACvD,EACD,QAAQ,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC/B,aAAa,OAAO;AANxB,wBAoEE"}
|
package/src/client.js
CHANGED
|
@@ -1,52 +1,51 @@
|
|
|
1
|
-
import '
|
|
2
|
-
import {
|
|
3
|
-
import { NgZone, createComponent } from '@angular/core';
|
|
1
|
+
import { reflectComponentType, provideZonelessChangeDetection, } from '@angular/core';
|
|
2
|
+
import { createComponent } from '@angular/core';
|
|
4
3
|
import { createApplication } from '@angular/platform-browser';
|
|
5
4
|
import { Subject, takeUntil } from 'rxjs';
|
|
6
5
|
export default (element) => {
|
|
7
6
|
return (Component, props, _childHTML) => {
|
|
8
7
|
createApplication({
|
|
9
|
-
providers: [
|
|
8
|
+
providers: [
|
|
9
|
+
provideZonelessChangeDetection(),
|
|
10
|
+
...(Component.clientProviders || []),
|
|
11
|
+
],
|
|
10
12
|
}).then((appRef) => {
|
|
11
|
-
const
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
const
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
if (mirror.inputs.some(({ templateName, propName }) => templateName === key || propName === key)) {
|
|
21
|
-
componentRef.setInput(key, value);
|
|
22
|
-
}
|
|
13
|
+
const componentRef = createComponent(Component, {
|
|
14
|
+
environmentInjector: appRef.injector,
|
|
15
|
+
hostElement: element,
|
|
16
|
+
});
|
|
17
|
+
const mirror = reflectComponentType(Component);
|
|
18
|
+
if (props && mirror) {
|
|
19
|
+
for (const [key, value] of Object.entries(props)) {
|
|
20
|
+
if (mirror.inputs.some(({ templateName, propName }) => templateName === key || propName === key)) {
|
|
21
|
+
componentRef.setInput(key, value);
|
|
23
22
|
}
|
|
24
23
|
}
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
element.dispatchEvent(event);
|
|
24
|
+
}
|
|
25
|
+
if (mirror?.outputs.length && props?.['data-analog-id']) {
|
|
26
|
+
const destroySubject = new Subject();
|
|
27
|
+
element.setAttribute('data-analog-id', props['data-analog-id']);
|
|
28
|
+
mirror.outputs.forEach(({ templateName, propName }) => {
|
|
29
|
+
const outputName = templateName || propName;
|
|
30
|
+
const component = componentRef.instance;
|
|
31
|
+
component[outputName]
|
|
32
|
+
.pipe(takeUntil(destroySubject))
|
|
33
|
+
.subscribe((detail) => {
|
|
34
|
+
const event = new CustomEvent(outputName, {
|
|
35
|
+
bubbles: true,
|
|
36
|
+
cancelable: true,
|
|
37
|
+
composed: true,
|
|
38
|
+
detail,
|
|
41
39
|
});
|
|
40
|
+
element.dispatchEvent(event);
|
|
42
41
|
});
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
|
|
42
|
+
});
|
|
43
|
+
appRef.onDestroy(() => {
|
|
44
|
+
destroySubject.next();
|
|
45
|
+
destroySubject.complete();
|
|
46
|
+
});
|
|
47
|
+
}
|
|
48
|
+
appRef.attachView(componentRef.hostView);
|
|
50
49
|
});
|
|
51
50
|
};
|
|
52
51
|
};
|
package/src/client.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"client.js","sourceRoot":"","sources":["../../../../packages/astro-angular/src/client.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"client.js","sourceRoot":"","sources":["../../../../packages/astro-angular/src/client.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,oBAAoB,EAEpB,8BAA8B,GAC/B,MAAM,eAAe,CAAC;AACvB,OAAO,EAAkB,eAAe,EAAE,MAAM,eAAe,CAAC;AAChE,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAc,OAAO,EAAE,SAAS,EAAE,MAAM,MAAM,CAAC;AAEtD,eAAe,CAAC,OAAoB,EAAE,EAAE;IACtC,OAAO,CACL,SAEC,EACD,KAA+B,EAC/B,UAAoB,EACpB,EAAE;QACF,iBAAiB,CAAC;YAChB,SAAS,EAAE;gBACT,8BAA8B,EAAE;gBAChC,GAAG,CAAC,SAAS,CAAC,eAAe,IAAI,EAAE,CAAC;aACrC;SACF,CAAC,CAAC,IAAI,CAAC,CAAC,MAAsB,EAAE,EAAE;YACjC,MAAM,YAAY,GAAG,eAAe,CAAC,SAAS,EAAE;gBAC9C,mBAAmB,EAAE,MAAM,CAAC,QAAQ;gBACpC,WAAW,EAAE,OAAO;aACrB,CAAC,CAAC;YAEH,MAAM,MAAM,GAAG,oBAAoB,CAAC,SAAS,CAAC,CAAC;YAC/C,IAAI,KAAK,IAAI,MAAM,EAAE,CAAC;gBACpB,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;oBACjD,IACE,MAAM,CAAC,MAAM,CAAC,IAAI,CAChB,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,EAAE,CAC7B,YAAY,KAAK,GAAG,IAAI,QAAQ,KAAK,GAAG,CAC3C,EACD,CAAC;wBACD,YAAY,CAAC,QAAQ,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;oBACpC,CAAC;gBACH,CAAC;YACH,CAAC;YAED,IAAI,MAAM,EAAE,OAAO,CAAC,MAAM,IAAI,KAAK,EAAE,CAAC,gBAAgB,CAAC,EAAE,CAAC;gBACxD,MAAM,cAAc,GAAG,IAAI,OAAO,EAAQ,CAAC;gBAC3C,OAAO,CAAC,YAAY,CAClB,gBAAgB,EAChB,KAAK,CAAC,gBAAgB,CAAW,CAClC,CAAC;gBAEF,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,EAAE;oBACpD,MAAM,UAAU,GAAG,YAAY,IAAI,QAAQ,CAAC;oBAC5C,MAAM,SAAS,GAAG,YAAY,CAAC,QAG9B,CAAC;oBACF,SAAS,CAAC,UAAU,CAAC;yBAClB,IAAI,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;yBAC/B,SAAS,CAAC,CAAC,MAAM,EAAE,EAAE;wBACpB,MAAM,KAAK,GAAG,IAAI,WAAW,CAAC,UAAU,EAAE;4BACxC,OAAO,EAAE,IAAI;4BACb,UAAU,EAAE,IAAI;4BAChB,QAAQ,EAAE,IAAI;4BACd,MAAM;yBACP,CAAC,CAAC;wBACH,OAAO,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;oBAC/B,CAAC,CAAC,CAAC;gBACP,CAAC,CAAC,CAAC;gBAEH,MAAM,CAAC,SAAS,CAAC,GAAG,EAAE;oBACpB,cAAc,CAAC,IAAI,EAAE,CAAC;oBACtB,cAAc,CAAC,QAAQ,EAAE,CAAC;gBAC5B,CAAC,CAAC,CAAC;YACL,CAAC;YAED,MAAM,CAAC,UAAU,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;QAC3C,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {\n EnvironmentProviders,\n Provider,\n reflectComponentType,\n ɵComponentType as ComponentType,\n provideZonelessChangeDetection,\n} from '@angular/core';\nimport { ApplicationRef, createComponent } from '@angular/core';\nimport { createApplication } from '@angular/platform-browser';\nimport { Observable, Subject, takeUntil } from 'rxjs';\n\nexport default (element: HTMLElement) => {\n return (\n Component: ComponentType<unknown> & {\n clientProviders?: (Provider | EnvironmentProviders)[];\n },\n props?: Record<string, unknown>,\n _childHTML?: unknown,\n ) => {\n createApplication({\n providers: [\n provideZonelessChangeDetection(),\n ...(Component.clientProviders || []),\n ],\n }).then((appRef: ApplicationRef) => {\n const componentRef = createComponent(Component, {\n environmentInjector: appRef.injector,\n hostElement: element,\n });\n\n const mirror = reflectComponentType(Component);\n if (props && mirror) {\n for (const [key, value] of Object.entries(props)) {\n if (\n mirror.inputs.some(\n ({ templateName, propName }) =>\n templateName === key || propName === key,\n )\n ) {\n componentRef.setInput(key, value);\n }\n }\n }\n\n if (mirror?.outputs.length && props?.['data-analog-id']) {\n const destroySubject = new Subject<void>();\n element.setAttribute(\n 'data-analog-id',\n props['data-analog-id'] as string,\n );\n\n mirror.outputs.forEach(({ templateName, propName }) => {\n const outputName = templateName || propName;\n const component = componentRef.instance as Record<\n string,\n Observable<unknown>\n >;\n component[outputName]\n .pipe(takeUntil(destroySubject))\n .subscribe((detail) => {\n const event = new CustomEvent(outputName, {\n bubbles: true,\n cancelable: true,\n composed: true,\n detail,\n });\n element.dispatchEvent(event);\n });\n });\n\n appRef.onDestroy(() => {\n destroySubject.next();\n destroySubject.complete();\n });\n }\n\n appRef.attachView(componentRef.hostView);\n });\n };\n};\n"]}
|
package/src/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../packages/astro-angular/src/index.ts"],"names":[],"mappings":"AAAA,OAAoB,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE3E,OAAO,KAAK,EAAE,gBAAgB,EAAiC,MAAM,OAAO,CAAC;AAG7E,UAAU,cAAc;IACtB,IAAI,CAAC,EAAE,aAAa,CAAC;CACtB;AAqDD,MAAM,CAAC,OAAO,WAAW,OAAO,CAAC,EAAE,cAAc,GAAG,gBAAgB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../packages/astro-angular/src/index.ts"],"names":[],"mappings":"AAAA,OAAoB,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE3E,OAAO,KAAK,EAAE,gBAAgB,EAAiC,MAAM,OAAO,CAAC;AAG7E,UAAU,cAAc;IACtB,IAAI,CAAC,EAAE,aAAa,CAAC;CACtB;AAqDD,MAAM,CAAC,OAAO,WAAW,OAAO,CAAC,EAAE,cAAc,GAAG,gBAAgB,CAqBnE"}
|
package/src/index.js
CHANGED
|
@@ -48,21 +48,13 @@ export default function (options) {
|
|
|
48
48
|
return {
|
|
49
49
|
name: '@analogjs/astro-angular',
|
|
50
50
|
hooks: {
|
|
51
|
-
'astro:config:setup': ({ addRenderer,
|
|
52
|
-
if (!isRestart && config.markdown?.syntaxHighlight === 'shiki') {
|
|
53
|
-
config.markdown.syntaxHighlight = 'prism';
|
|
54
|
-
}
|
|
51
|
+
'astro:config:setup': ({ addRenderer, updateConfig }) => {
|
|
55
52
|
addRenderer(getRenderer());
|
|
56
53
|
updateConfig({
|
|
57
54
|
vite: getViteConfiguration(options?.vite),
|
|
58
55
|
});
|
|
59
56
|
},
|
|
60
|
-
'astro:config:done': (
|
|
61
|
-
if ('markdown' in config &&
|
|
62
|
-
config.markdown.syntaxHighlight === 'shiki') {
|
|
63
|
-
console.warn(`[warning] The Angular integration doesn't support Shiki syntax highlighting in MDX files. Overriding with Prism.\n
|
|
64
|
-
To disable this warning, set the syntaxHighlight option in your astro.config.mjs mdx() integration to 'prism' or false.`);
|
|
65
|
-
}
|
|
57
|
+
'astro:config:done': () => {
|
|
66
58
|
if (process.env['NODE_ENV'] === 'production') {
|
|
67
59
|
enableProdMode();
|
|
68
60
|
}
|
package/src/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../packages/astro-angular/src/index.ts"],"names":[],"mappings":"AAAA,OAAO,WAA8B,MAAM,+BAA+B,CAAC;AAC3E,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAQ/C,SAAS,WAAW;IAClB,OAAO;QACL,IAAI,EAAE,yBAAyB;QAC/B,gBAAgB,EAAE,mCAAmC;QACrD,gBAAgB,EAAE,mCAAmC;KACtD,CAAC;AACJ,CAAC;AAED,SAAS,oBAAoB,CAAC,IAAoB;IAChD,OAAO;QACL,OAAO,EAAE;YACP,MAAM,EAAE,IAAI;SACb;QACD,YAAY,EAAE;YACZ,OAAO,EAAE;gBACP,2BAA2B;gBAC3B,eAAe;gBACf,mCAAmC;aACpC;YACD,OAAO,EAAE;gBACP,0BAA0B;gBAC1B,mCAAmC;aACpC;SACF;QAED,OAAO,EAAE;YACP,WAAW,CAAC,IAAI,CAAC;YACjB;gBACE,IAAI,EAAE,yCAAyC;gBAC/C,SAAS,CAAC,IAAY,EAAE,EAAU;oBAChC,IAAI,EAAE,CAAC,QAAQ,CAAC,iBAAiB,CAAC,EAAE,CAAC;wBACnC,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC;wBAEhD,OAAO;4BACL,IAAI,EAAE,IAAI,CAAC,OAAO,CAChB,yBAAyB,EACzB,mDAAmD,CACpD;yBACF,CAAC;oBACJ,CAAC;oBAED,OAAO;gBACT,CAAC;aACF;SACF;QACD,GAAG,EAAE;YACH,UAAU,EAAE,CAAC,aAAa,EAAE,cAAc,CAAC;SAC5C;KACF,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,OAAO,WAAW,OAAwB;IAC/C,OAAO,CAAC,GAAG,CAAC,cAAc,CAAC,GAAG,MAAM,CAAC;IAErC,OAAO;QACL,IAAI,EAAE,yBAAyB;QAC/B,KAAK,EAAE;YACL,oBAAoB,EAAE,CAAC,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../packages/astro-angular/src/index.ts"],"names":[],"mappings":"AAAA,OAAO,WAA8B,MAAM,+BAA+B,CAAC;AAC3E,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAQ/C,SAAS,WAAW;IAClB,OAAO;QACL,IAAI,EAAE,yBAAyB;QAC/B,gBAAgB,EAAE,mCAAmC;QACrD,gBAAgB,EAAE,mCAAmC;KACtD,CAAC;AACJ,CAAC;AAED,SAAS,oBAAoB,CAAC,IAAoB;IAChD,OAAO;QACL,OAAO,EAAE;YACP,MAAM,EAAE,IAAI;SACb;QACD,YAAY,EAAE;YACZ,OAAO,EAAE;gBACP,2BAA2B;gBAC3B,eAAe;gBACf,mCAAmC;aACpC;YACD,OAAO,EAAE;gBACP,0BAA0B;gBAC1B,mCAAmC;aACpC;SACF;QAED,OAAO,EAAE;YACP,WAAW,CAAC,IAAI,CAAC;YACjB;gBACE,IAAI,EAAE,yCAAyC;gBAC/C,SAAS,CAAC,IAAY,EAAE,EAAU;oBAChC,IAAI,EAAE,CAAC,QAAQ,CAAC,iBAAiB,CAAC,EAAE,CAAC;wBACnC,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC;wBAEhD,OAAO;4BACL,IAAI,EAAE,IAAI,CAAC,OAAO,CAChB,yBAAyB,EACzB,mDAAmD,CACpD;yBACF,CAAC;oBACJ,CAAC;oBAED,OAAO;gBACT,CAAC;aACF;SACF;QACD,GAAG,EAAE;YACH,UAAU,EAAE,CAAC,aAAa,EAAE,cAAc,CAAC;SAC5C;KACF,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,OAAO,WAAW,OAAwB;IAC/C,OAAO,CAAC,GAAG,CAAC,cAAc,CAAC,GAAG,MAAM,CAAC;IAErC,OAAO;QACL,IAAI,EAAE,yBAAyB;QAC/B,KAAK,EAAE;YACL,oBAAoB,EAAE,CAAC,EAAE,WAAW,EAAE,YAAY,EAAE,EAAE,EAAE;gBACtD,WAAW,CAAC,WAAW,EAAE,CAAC,CAAC;gBAC3B,YAAY,CAAC;oBACX,IAAI,EAAE,oBAAoB,CACxB,OAAO,EAAE,IAAI,CACiB;iBACjC,CAAC,CAAC;YACL,CAAC;YACD,mBAAmB,EAAE,GAAG,EAAE;gBACxB,IAAI,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,KAAK,YAAY,EAAE,CAAC;oBAC7C,cAAc,EAAE,CAAC;gBACnB,CAAC;YACH,CAAC;SACF;KACF,CAAC;AACJ,CAAC","sourcesContent":["import viteAngular, { PluginOptions } from '@analogjs/vite-plugin-angular';\nimport { enableProdMode } from '@angular/core';\nimport type { AstroIntegration, AstroRenderer, ViteUserConfig } from 'astro';\nimport type { DeepPartial } from 'astro/dist/type-utils';\n\ninterface AngularOptions {\n vite?: PluginOptions;\n}\n\nfunction getRenderer(): AstroRenderer {\n return {\n name: '@analogjs/astro-angular',\n clientEntrypoint: '@analogjs/astro-angular/client.js',\n serverEntrypoint: '@analogjs/astro-angular/server.js',\n };\n}\n\nfunction getViteConfiguration(vite?: PluginOptions) {\n return {\n esbuild: {\n jsxDev: true,\n },\n optimizeDeps: {\n include: [\n '@angular/platform-browser',\n '@angular/core',\n '@analogjs/astro-angular/client.js',\n ],\n exclude: [\n '@angular/platform-server',\n '@analogjs/astro-angular/server.js',\n ],\n },\n\n plugins: [\n viteAngular(vite),\n {\n name: '@analogjs/astro-angular-platform-server',\n transform(code: string, id: string) {\n if (id.includes('platform-server')) {\n code = code.replace(/global\\./g, 'globalThis.');\n\n return {\n code: code.replace(\n 'new xhr2.XMLHttpRequest',\n 'new (xhr2.default.XMLHttpRequest || xhr2.default)',\n ),\n };\n }\n\n return;\n },\n },\n ],\n ssr: {\n noExternal: ['@angular/**', '@analogjs/**'],\n },\n };\n}\n\nexport default function (options?: AngularOptions): AstroIntegration {\n process.env['ANALOG_ASTRO'] = 'true';\n\n return {\n name: '@analogjs/astro-angular',\n hooks: {\n 'astro:config:setup': ({ addRenderer, updateConfig }) => {\n addRenderer(getRenderer());\n updateConfig({\n vite: getViteConfiguration(\n options?.vite,\n ) as DeepPartial<ViteUserConfig>,\n });\n },\n 'astro:config:done': () => {\n if (process.env['NODE_ENV'] === 'production') {\n enableProdMode();\n }\n },\n },\n };\n}\n"]}
|
package/src/server.d.ts
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import 'zone.js/node';
|
|
2
1
|
import type { EnvironmentProviders, Provider, ɵComponentType as ComponentType } from '@angular/core';
|
|
3
2
|
declare function check(Component: ComponentType<unknown>, _props: Record<string, unknown>, _children: unknown): boolean;
|
|
4
3
|
declare function renderToStaticMarkup(Component: ComponentType<unknown> & {
|
package/src/server.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"server.d.ts","sourceRoot":"","sources":["../../../../packages/astro-angular/src/server.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"server.d.ts","sourceRoot":"","sources":["../../../../packages/astro-angular/src/server.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAEV,oBAAoB,EACpB,QAAQ,EACR,cAAc,IAAI,aAAa,EAChC,MAAM,eAAe,CAAC;AA2BvB,iBAAS,KAAK,CACZ,SAAS,EAAE,aAAa,CAAC,OAAO,CAAC,EACjC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC/B,SAAS,EAAE,OAAO,WAGnB;AAwCD,iBAAe,oBAAoB,CACjC,SAAS,EAAE,aAAa,CAAC,OAAO,CAAC,GAAG;IAClC,eAAe,EAAE,CAAC,QAAQ,GAAG,oBAAoB,CAAC,EAAE,CAAC;CACtD,EACD,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC9B,SAAS,EAAE,OAAO;;GA8BnB;;;;;AAED,wBAGE"}
|
package/src/server.js
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
import '
|
|
2
|
-
import { ApplicationRef, InjectionToken, reflectComponentType, } from '@angular/core';
|
|
1
|
+
import { ApplicationRef, InjectionToken, reflectComponentType, provideZonelessChangeDetection, } from '@angular/core';
|
|
3
2
|
import { BEFORE_APP_SERIALIZED, provideServerRendering, renderApplication, ɵSERVER_CONTEXT, } from '@angular/platform-server';
|
|
4
3
|
import { bootstrapApplication, } from '@angular/platform-browser';
|
|
5
4
|
const ANALOG_ASTRO_STATIC_PROPS = new InjectionToken('@analogjs/astro-angular: Static Props w/ Mirror Provider', {
|
|
@@ -47,6 +46,7 @@ async function renderToStaticMarkup(Component, props, _children) {
|
|
|
47
46
|
STATIC_PROPS_HOOK_PROVIDER,
|
|
48
47
|
provideServerRendering(),
|
|
49
48
|
{ provide: ɵSERVER_CONTEXT, useValue: 'analog' },
|
|
49
|
+
provideZonelessChangeDetection(),
|
|
50
50
|
...(Component.renderProviders || []),
|
|
51
51
|
],
|
|
52
52
|
}, context);
|
package/src/server.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"server.js","sourceRoot":"","sources":["../../../../packages/astro-angular/src/server.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"server.js","sourceRoot":"","sources":["../../../../packages/astro-angular/src/server.ts"],"names":[],"mappings":"AAMA,OAAO,EACL,cAAc,EACd,cAAc,EACd,oBAAoB,EACpB,8BAA8B,GAC/B,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,qBAAqB,EACrB,sBAAsB,EACtB,iBAAiB,EACjB,eAAe,GAChB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EACL,oBAAoB,GAErB,MAAM,2BAA2B,CAAC;AAEnC,MAAM,yBAAyB,GAAG,IAAI,cAAc,CAGjD,0DAA0D,EAAE;IAC7D,OAAO;QACL,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAA8B,EAAE,CAAC;IAC/D,CAAC;CACF,CAAC,CAAC;AAEH,SAAS,KAAK,CACZ,SAAiC,EACjC,MAA+B,EAC/B,SAAkB;IAElB,OAAO,CAAC,CAAC,oBAAoB,CAAC,SAAS,CAAC,CAAC;AAC3C,CAAC;AAED,iEAAiE;AACjE,wCAAwC;AACxC,MAAM,0BAA0B,GAAa;IAC3C,OAAO,EAAE,qBAAqB;IAC9B,UAAU,EAAE,CACV,MAAsB,EACtB,EACE,KAAK,EACL,MAAM,GAIP,EACD,EAAE;QACF,OAAO,GAAG,EAAE;YACV,MAAM,OAAO,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;YACrC,IAAI,OAAO,IAAI,KAAK,IAAI,MAAM,EAAE,CAAC;gBAC/B,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;oBACjD;oBACE,4CAA4C;oBAC5C,2CAA2C;oBAC3C,sDAAsD;oBACtD,MAAM,CAAC,MAAM,CAAC,IAAI,CAChB,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,EAAE,CAC7B,YAAY,KAAK,GAAG,IAAI,QAAQ,KAAK,GAAG,CAC3C,EACD,CAAC;wBACD,OAAO,CAAC,QAAQ,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;oBAC/B,CAAC;gBACH,CAAC;gBACD,OAAO,CAAC,iBAAiB,CAAC,aAAa,EAAE,CAAC;YAC5C,CAAC;QACH,CAAC,CAAC;IACJ,CAAC;IACD,IAAI,EAAE,CAAC,cAAc,EAAE,yBAAyB,CAAC;IACjD,KAAK,EAAE,IAAI;CACZ,CAAC;AAEF,KAAK,UAAU,oBAAoB,CACjC,SAEC,EACD,KAA8B,EAC9B,SAAkB;IAElB,MAAM,MAAM,GAAG,oBAAoB,CAAC,SAAS,CAAC,CAAC;IAC/C,MAAM,KAAK,GACT,MAAM,EAAE,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,SAAS,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC,WAAW,EAAE,CAAC;IAC5E,MAAM,QAAQ,GAAG,IAAI,KAAK,MAAM,KAAK,GAAG,CAAC;IACzC,MAAM,SAAS,GAAG,CAAC,OAA0B,EAAE,EAAE,CAC/C,oBAAoB,CAClB,SAAS,EACT;QACE,SAAS,EAAE;YACT;gBACE,OAAO,EAAE,yBAAyB;gBAClC,QAAQ,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE;aAC5B;YACD,0BAA0B;YAC1B,sBAAsB,EAAE;YACxB,EAAE,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,QAAQ,EAAE;YAChD,8BAA8B,EAAE;YAChC,GAAG,CAAC,SAAS,CAAC,eAAe,IAAI,EAAE,CAAC;SACrC;KACF,EACD,OAAO,CACR,CAAC;IAEJ,MAAM,IAAI,GAAG,MAAM,iBAAiB,CAAC,SAAS,EAAE;QAC9C,QAAQ;KACT,CAAC,CAAC;IAEH,OAAO,EAAE,IAAI,EAAE,CAAC;AAClB,CAAC;AAED,eAAe;IACb,KAAK;IACL,oBAAoB;CACrB,CAAC","sourcesContent":["import type {\n ComponentMirror,\n EnvironmentProviders,\n Provider,\n ɵComponentType as ComponentType,\n} from '@angular/core';\nimport {\n ApplicationRef,\n InjectionToken,\n reflectComponentType,\n provideZonelessChangeDetection,\n} from '@angular/core';\nimport {\n BEFORE_APP_SERIALIZED,\n provideServerRendering,\n renderApplication,\n ɵSERVER_CONTEXT,\n} from '@angular/platform-server';\nimport {\n bootstrapApplication,\n type BootstrapContext,\n} from '@angular/platform-browser';\n\nconst ANALOG_ASTRO_STATIC_PROPS = new InjectionToken<{\n props: Record<string, unknown>;\n mirror: ComponentMirror<unknown>;\n}>('@analogjs/astro-angular: Static Props w/ Mirror Provider', {\n factory() {\n return { props: {}, mirror: {} as ComponentMirror<unknown> };\n },\n});\n\nfunction check(\n Component: ComponentType<unknown>,\n _props: Record<string, unknown>,\n _children: unknown,\n) {\n return !!reflectComponentType(Component);\n}\n\n// Run beforeAppInitialized hook to set Input on the ComponentRef\n// before the platform renders to string\nconst STATIC_PROPS_HOOK_PROVIDER: Provider = {\n provide: BEFORE_APP_SERIALIZED,\n useFactory: (\n appRef: ApplicationRef,\n {\n props,\n mirror,\n }: {\n props: Record<string, unknown>;\n mirror: ComponentMirror<unknown>;\n },\n ) => {\n return () => {\n const compRef = appRef.components[0];\n if (compRef && props && mirror) {\n for (const [key, value] of Object.entries(props)) {\n if (\n // we double-check inputs on ComponentMirror\n // because Astro might add additional props\n // that aren't actually Input defined on the Component\n mirror.inputs.some(\n ({ templateName, propName }) =>\n templateName === key || propName === key,\n )\n ) {\n compRef.setInput(key, value);\n }\n }\n compRef.changeDetectorRef.detectChanges();\n }\n };\n },\n deps: [ApplicationRef, ANALOG_ASTRO_STATIC_PROPS],\n multi: true,\n};\n\nasync function renderToStaticMarkup(\n Component: ComponentType<unknown> & {\n renderProviders: (Provider | EnvironmentProviders)[];\n },\n props: Record<string, unknown>,\n _children: unknown,\n) {\n const mirror = reflectComponentType(Component);\n const appId =\n mirror?.selector.split(',')[0] || Component.name.toString().toLowerCase();\n const document = `<${appId}></${appId}>`;\n const bootstrap = (context?: BootstrapContext) =>\n bootstrapApplication(\n Component,\n {\n providers: [\n {\n provide: ANALOG_ASTRO_STATIC_PROPS,\n useValue: { props, mirror },\n },\n STATIC_PROPS_HOOK_PROVIDER,\n provideServerRendering(),\n { provide: ɵSERVER_CONTEXT, useValue: 'analog' },\n provideZonelessChangeDetection(),\n ...(Component.renderProviders || []),\n ],\n },\n context,\n );\n\n const html = await renderApplication(bootstrap, {\n document,\n });\n\n return { html };\n}\n\nexport default {\n check,\n renderToStaticMarkup,\n};\n"]}
|