@analogjs/astro-angular 2.4.0-beta.9 → 2.5.0-beta.1
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 +18 -0
- package/package.json +5 -3
- package/src/index.d.ts +7 -0
- package/src/index.d.ts.map +1 -1
- package/src/index.js +21 -1
- package/src/index.js.map +1 -1
- package/src/middleware.d.ts +3 -0
- package/src/middleware.d.ts.map +1 -0
- package/src/middleware.js +58 -0
- package/src/middleware.js.map +1 -0
- package/src/server.d.ts.map +1 -1
- package/src/server.js +15 -4
- package/src/server.js.map +1 -1
package/README.md
CHANGED
|
@@ -173,6 +173,24 @@ export default defineConfig({
|
|
|
173
173
|
});
|
|
174
174
|
```
|
|
175
175
|
|
|
176
|
+
### Strict Style Placement
|
|
177
|
+
|
|
178
|
+
Angular components can use style scoped to each component instance. By default, these style tags will be inserted adjacent to the component's HTML by `@analogjs/astro-angular`. While this will typically work for modern browsers, it is technically invalid HTML.
|
|
179
|
+
|
|
180
|
+
To force these component styles to the document head, enable the `strictStylePlacement` option in the integration config.
|
|
181
|
+
|
|
182
|
+
**Warning:** enabling this option will disable Astro's [streaming](https://docs.astro.build/en/recipes/streaming-improve-page-performance/) mode under SSR.
|
|
183
|
+
|
|
184
|
+
```js
|
|
185
|
+
import { defineConfig } from 'astro/config';
|
|
186
|
+
|
|
187
|
+
import angular from '@analogjs/astro-angular';
|
|
188
|
+
|
|
189
|
+
export default defineConfig({
|
|
190
|
+
integrations: [angular({ strictStylePlacement: true })],
|
|
191
|
+
});
|
|
192
|
+
```
|
|
193
|
+
|
|
176
194
|
## Defining A Component
|
|
177
195
|
|
|
178
196
|
The Astro Angular integration **only** supports rendering standalone components:
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@analogjs/astro-angular",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.5.0-beta.1",
|
|
4
4
|
"description": "Use Angular components within Astro",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"author": "Brandon Roberts <robertsbt@gmail.com>",
|
|
@@ -32,7 +32,8 @@
|
|
|
32
32
|
"url": "https://github.com/sponsors/brandonroberts"
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
|
-
"@analogjs/vite-plugin-angular": "^2.
|
|
35
|
+
"@analogjs/vite-plugin-angular": "^2.5.0-beta.1",
|
|
36
|
+
"rehype": "^13.0.2"
|
|
36
37
|
},
|
|
37
38
|
"peerDependencies": {
|
|
38
39
|
"@angular/build": ">=20.0.0",
|
|
@@ -55,7 +56,8 @@
|
|
|
55
56
|
"@analogjs/storybook-angular",
|
|
56
57
|
"@analogjs/vite-plugin-angular",
|
|
57
58
|
"@analogjs/vite-plugin-nitro",
|
|
58
|
-
"@analogjs/vitest-angular"
|
|
59
|
+
"@analogjs/vitest-angular",
|
|
60
|
+
"@analogjs/angular-compiler"
|
|
59
61
|
],
|
|
60
62
|
"migrations": "./migrations/migration.json"
|
|
61
63
|
},
|
package/src/index.d.ts
CHANGED
|
@@ -2,6 +2,13 @@ import { PluginOptions } from '@analogjs/vite-plugin-angular';
|
|
|
2
2
|
import type { AstroIntegration } from 'astro';
|
|
3
3
|
interface AngularOptions {
|
|
4
4
|
vite?: PluginOptions;
|
|
5
|
+
/**
|
|
6
|
+
* Enable stricter rendering, which ensures Angular style tags are added to the document head instead of next to the
|
|
7
|
+
* component in the body.
|
|
8
|
+
*
|
|
9
|
+
* Enabling this option disables astro's streaming under SSR.
|
|
10
|
+
*/
|
|
11
|
+
strictStylePlacement?: boolean;
|
|
5
12
|
}
|
|
6
13
|
export default function (options?: AngularOptions): AstroIntegration;
|
|
7
14
|
export {};
|
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":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../packages/astro-angular/src/index.ts"],"names":[],"mappings":"AACA,OAAoB,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE3E,OAAO,KAAK,EAAE,gBAAgB,EAAiC,MAAM,OAAO,CAAC;AAE7E,UAAU,cAAc;IACtB,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB;;;;;OAKG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC;AAmED,MAAM,CAAC,OAAO,WAAW,OAAO,CAAC,EAAE,cAAc,GAAG,gBAAgB,CA2BnE"}
|
package/src/index.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { fileURLToPath } from 'node:url';
|
|
1
2
|
import viteAngular from '@analogjs/vite-plugin-angular';
|
|
2
3
|
import { enableProdMode } from '@angular/core';
|
|
3
4
|
function getRenderer() {
|
|
@@ -37,6 +38,19 @@ function getViteConfiguration(vite) {
|
|
|
37
38
|
return;
|
|
38
39
|
},
|
|
39
40
|
},
|
|
41
|
+
{
|
|
42
|
+
name: 'analogjs-astro-client-ngservermode',
|
|
43
|
+
configEnvironment(name) {
|
|
44
|
+
if (name === 'client') {
|
|
45
|
+
return {
|
|
46
|
+
define: {
|
|
47
|
+
ngServerMode: 'false',
|
|
48
|
+
},
|
|
49
|
+
};
|
|
50
|
+
}
|
|
51
|
+
return undefined;
|
|
52
|
+
},
|
|
53
|
+
},
|
|
40
54
|
],
|
|
41
55
|
ssr: {
|
|
42
56
|
noExternal: ['@angular/**', '@analogjs/**'],
|
|
@@ -48,11 +62,17 @@ export default function (options) {
|
|
|
48
62
|
return {
|
|
49
63
|
name: '@analogjs/astro-angular',
|
|
50
64
|
hooks: {
|
|
51
|
-
'astro:config:setup': ({ addRenderer, updateConfig }) => {
|
|
65
|
+
'astro:config:setup': ({ addRenderer, updateConfig, addMiddleware }) => {
|
|
52
66
|
addRenderer(getRenderer());
|
|
53
67
|
updateConfig({
|
|
54
68
|
vite: getViteConfiguration(options?.vite),
|
|
55
69
|
});
|
|
70
|
+
if (options?.strictStylePlacement) {
|
|
71
|
+
addMiddleware({
|
|
72
|
+
order: 'pre',
|
|
73
|
+
entrypoint: fileURLToPath(import.meta.resolve('./middleware.js')),
|
|
74
|
+
});
|
|
75
|
+
}
|
|
56
76
|
},
|
|
57
77
|
'astro:config:done': () => {
|
|
58
78
|
if (process.env['NODE_ENV'] === 'production') {
|
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;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../packages/astro-angular/src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AACzC,OAAO,WAA8B,MAAM,+BAA+B,CAAC;AAC3E,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAc/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;YACD;gBACE,IAAI,EAAE,oCAAoC;gBAC1C,iBAAiB,CAAC,IAAY;oBAC5B,IAAI,IAAI,KAAK,QAAQ,EAAE,CAAC;wBACtB,OAAO;4BACL,MAAM,EAAE;gCACN,YAAY,EAAE,OAAO;6BACtB;yBACF,CAAC;oBACJ,CAAC;oBAED,OAAO,SAAS,CAAC;gBACnB,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,aAAa,EAAE,EAAE,EAAE;gBACrE,WAAW,CAAC,WAAW,EAAE,CAAC,CAAC;gBAC3B,YAAY,CAAC;oBACX,IAAI,EAAE,oBAAoB,CACxB,OAAO,EAAE,IAAI,CACe;iBAC/B,CAAC,CAAC;gBACH,IAAI,OAAO,EAAE,oBAAoB,EAAE,CAAC;oBAClC,aAAa,CAAC;wBACZ,KAAK,EAAE,KAAK;wBACZ,UAAU,EAAE,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;qBAClE,CAAC,CAAC;gBACL,CAAC;YACH,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 { fileURLToPath } from 'node:url';\nimport viteAngular, { PluginOptions } from '@analogjs/vite-plugin-angular';\nimport { enableProdMode } from '@angular/core';\nimport type { AstroIntegration, AstroRenderer, ViteUserConfig } from 'astro';\n\ninterface AngularOptions {\n vite?: PluginOptions;\n /**\n * Enable stricter rendering, which ensures Angular style tags are added to the document head instead of next to the\n * component in the body.\n *\n * Enabling this option disables astro's streaming under SSR.\n */\n strictStylePlacement?: boolean;\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): ViteUserConfig {\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 name: 'analogjs-astro-client-ngservermode',\n configEnvironment(name: string) {\n if (name === 'client') {\n return {\n define: {\n ngServerMode: 'false',\n },\n };\n }\n\n return undefined;\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, addMiddleware }) => {\n addRenderer(getRenderer());\n updateConfig({\n vite: getViteConfiguration(\n options?.vite,\n ) as unknown as ViteUserConfig,\n });\n if (options?.strictStylePlacement) {\n addMiddleware({\n order: 'pre',\n entrypoint: fileURLToPath(import.meta.resolve('./middleware.js')),\n });\n }\n },\n 'astro:config:done': () => {\n if (process.env['NODE_ENV'] === 'production') {\n enableProdMode();\n }\n },\n },\n };\n}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"middleware.d.ts","sourceRoot":"","sources":["../../../../packages/astro-angular/src/middleware.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAM/C,eAAO,MAAM,SAAS,EAAE,iBAwEvB,CAAC"}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import { rehype } from 'rehype';
|
|
2
|
+
const processor = rehype();
|
|
3
|
+
export const onRequest = async (_ctx, next) => {
|
|
4
|
+
const response = await next();
|
|
5
|
+
if (response.headers.get('content-type')?.includes('text/html') !== true) {
|
|
6
|
+
return response;
|
|
7
|
+
}
|
|
8
|
+
// Find all <style ng-app-id="..."> tags in the body and move them to the head
|
|
9
|
+
const responseBody = await response.text();
|
|
10
|
+
const tree = processor.parse(responseBody);
|
|
11
|
+
const stack = [tree];
|
|
12
|
+
const styleTags = [];
|
|
13
|
+
let head = null;
|
|
14
|
+
while (stack.length) {
|
|
15
|
+
const top = stack.pop();
|
|
16
|
+
if (top.type === 'element' && top.tagName === 'template') {
|
|
17
|
+
// Templates create a shadow-root, so styles should not be moved outside.
|
|
18
|
+
continue;
|
|
19
|
+
}
|
|
20
|
+
if (top.type === 'element' && top.tagName === 'style') {
|
|
21
|
+
if ('ng-app-id' in top.properties) {
|
|
22
|
+
styleTags.push(top);
|
|
23
|
+
}
|
|
24
|
+
continue;
|
|
25
|
+
}
|
|
26
|
+
if (top.type === 'element' && top.tagName === 'head' && !head) {
|
|
27
|
+
head = top;
|
|
28
|
+
continue;
|
|
29
|
+
}
|
|
30
|
+
if (top.type !== 'root' && top.type !== 'element') {
|
|
31
|
+
continue;
|
|
32
|
+
}
|
|
33
|
+
for (let index = top.children.length - 1; index >= 0; index--) {
|
|
34
|
+
const child = top.children[index];
|
|
35
|
+
stack.push(child);
|
|
36
|
+
if (child.type === 'element' &&
|
|
37
|
+
child.tagName === 'style' &&
|
|
38
|
+
'ng-app-id' in child.properties) {
|
|
39
|
+
top.children.splice(index, 1);
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
if (head) {
|
|
44
|
+
head.children.push(...styleTags);
|
|
45
|
+
}
|
|
46
|
+
else {
|
|
47
|
+
const head = {
|
|
48
|
+
type: 'element',
|
|
49
|
+
children: styleTags,
|
|
50
|
+
properties: {},
|
|
51
|
+
tagName: 'head',
|
|
52
|
+
};
|
|
53
|
+
tree.children.unshift(head);
|
|
54
|
+
}
|
|
55
|
+
const newBody = processor.stringify(tree);
|
|
56
|
+
return new Response(newBody, response);
|
|
57
|
+
};
|
|
58
|
+
//# sourceMappingURL=middleware.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"middleware.js","sourceRoot":"","sources":["../../../../packages/astro-angular/src/middleware.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAEhC,MAAM,SAAS,GAAG,MAAM,EAAE,CAAC;AAE3B,MAAM,CAAC,MAAM,SAAS,GAAsB,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE;IAC/D,MAAM,QAAQ,GAAG,MAAM,IAAI,EAAE,CAAC;IAC9B,IAAI,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,cAAc,CAAC,EAAE,QAAQ,CAAC,WAAW,CAAC,KAAK,IAAI,EAAE,CAAC;QACzE,OAAO,QAAQ,CAAC;IAClB,CAAC;IAED,8EAA8E;IAE9E,MAAM,YAAY,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAC;IAE3C,MAAM,IAAI,GAAG,SAAS,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;IAE3C,MAAM,KAAK,GAA2B,CAAC,IAAI,CAAC,CAAC;IAE7C,MAAM,SAAS,GAAc,EAAE,CAAC;IAChC,IAAI,IAAI,GAAmB,IAAI,CAAC;IAEhC,OAAO,KAAK,CAAC,MAAM,EAAE,CAAC;QACpB,MAAM,GAAG,GAAG,KAAK,CAAC,GAAG,EAAG,CAAC;QAEzB,IAAI,GAAG,CAAC,IAAI,KAAK,SAAS,IAAI,GAAG,CAAC,OAAO,KAAK,UAAU,EAAE,CAAC;YACzD,yEAAyE;YACzE,SAAS;QACX,CAAC;QAED,IAAI,GAAG,CAAC,IAAI,KAAK,SAAS,IAAI,GAAG,CAAC,OAAO,KAAK,OAAO,EAAE,CAAC;YACtD,IAAI,WAAW,IAAI,GAAG,CAAC,UAAU,EAAE,CAAC;gBAClC,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YACtB,CAAC;YACD,SAAS;QACX,CAAC;QAED,IAAI,GAAG,CAAC,IAAI,KAAK,SAAS,IAAI,GAAG,CAAC,OAAO,KAAK,MAAM,IAAI,CAAC,IAAI,EAAE,CAAC;YAC9D,IAAI,GAAG,GAAG,CAAC;YACX,SAAS;QACX,CAAC;QAED,IAAI,GAAG,CAAC,IAAI,KAAK,MAAM,IAAI,GAAG,CAAC,IAAI,KAAK,SAAS,EAAE,CAAC;YAClD,SAAS;QACX,CAAC;QAED,KAAK,IAAI,KAAK,GAAG,GAAG,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC;YAC9D,MAAM,KAAK,GAAG,GAAG,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;YAElC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YAElB,IACE,KAAK,CAAC,IAAI,KAAK,SAAS;gBACxB,KAAK,CAAC,OAAO,KAAK,OAAO;gBACzB,WAAW,IAAI,KAAK,CAAC,UAAU,EAC/B,CAAC;gBACD,GAAG,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;YAChC,CAAC;QACH,CAAC;IACH,CAAC;IAED,IAAI,IAAI,EAAE,CAAC;QACT,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,SAAS,CAAC,CAAC;IACnC,CAAC;SAAM,CAAC;QACN,MAAM,IAAI,GAAY;YACpB,IAAI,EAAE,SAAS;YACf,QAAQ,EAAE,SAAS;YACnB,UAAU,EAAE,EAAE;YACd,OAAO,EAAE,MAAM;SAChB,CAAC;QAEF,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9B,CAAC;IAED,MAAM,OAAO,GAAG,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;IAE1C,OAAO,IAAI,QAAQ,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;AACzC,CAAC,CAAC","sourcesContent":["import type { MiddlewareHandler } from 'astro';\nimport type { Root, RootContent, Element } from 'hast';\nimport { rehype } from 'rehype';\n\nconst processor = rehype();\n\nexport const onRequest: MiddlewareHandler = async (_ctx, next) => {\n const response = await next();\n if (response.headers.get('content-type')?.includes('text/html') !== true) {\n return response;\n }\n\n // Find all <style ng-app-id=\"...\"> tags in the body and move them to the head\n\n const responseBody = await response.text();\n\n const tree = processor.parse(responseBody);\n\n const stack: (Root | RootContent)[] = [tree];\n\n const styleTags: Element[] = [];\n let head: Element | null = null;\n\n while (stack.length) {\n const top = stack.pop()!;\n\n if (top.type === 'element' && top.tagName === 'template') {\n // Templates create a shadow-root, so styles should not be moved outside.\n continue;\n }\n\n if (top.type === 'element' && top.tagName === 'style') {\n if ('ng-app-id' in top.properties) {\n styleTags.push(top);\n }\n continue;\n }\n\n if (top.type === 'element' && top.tagName === 'head' && !head) {\n head = top;\n continue;\n }\n\n if (top.type !== 'root' && top.type !== 'element') {\n continue;\n }\n\n for (let index = top.children.length - 1; index >= 0; index--) {\n const child = top.children[index];\n\n stack.push(child);\n\n if (\n child.type === 'element' &&\n child.tagName === 'style' &&\n 'ng-app-id' in child.properties\n ) {\n top.children.splice(index, 1);\n }\n }\n }\n\n if (head) {\n head.children.push(...styleTags);\n } else {\n const head: Element = {\n type: 'element',\n children: styleTags,\n properties: {},\n tagName: 'head',\n };\n\n tree.children.unshift(head);\n }\n\n const newBody = processor.stringify(tree);\n\n return new Response(newBody, response);\n};\n"]}
|
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,KAAK,EAEV,oBAAoB,EACpB,QAAQ,EACR,cAAc,IAAI,aAAa,EAChC,MAAM,eAAe,CAAC;
|
|
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;AA6BvB,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;;GA+CnB;;;;;AAED,wBAGE"}
|
package/src/server.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { ApplicationRef, InjectionToken, reflectComponentType, provideZonelessChangeDetection, } from '@angular/core';
|
|
2
|
-
import { BEFORE_APP_SERIALIZED, provideServerRendering, renderApplication, ɵSERVER_CONTEXT, } from '@angular/platform-server';
|
|
1
|
+
import { ApplicationRef, InjectionToken, reflectComponentType, provideZonelessChangeDetection, DOCUMENT, } from '@angular/core';
|
|
2
|
+
import { BEFORE_APP_SERIALIZED, provideServerRendering, renderApplication, ɵSERVER_CONTEXT, platformServer, } from '@angular/platform-server';
|
|
3
3
|
import { bootstrapApplication, } from '@angular/platform-browser';
|
|
4
4
|
const ANALOG_ASTRO_STATIC_PROPS = new InjectionToken('@analogjs/astro-angular: Static Props w/ Mirror Provider', {
|
|
5
5
|
factory() {
|
|
@@ -36,7 +36,9 @@ const STATIC_PROPS_HOOK_PROVIDER = {
|
|
|
36
36
|
async function renderToStaticMarkup(Component, props, _children) {
|
|
37
37
|
const mirror = reflectComponentType(Component);
|
|
38
38
|
const appId = mirror?.selector.split(',')[0] || Component.name.toString().toLowerCase();
|
|
39
|
-
const
|
|
39
|
+
const platformRef = platformServer();
|
|
40
|
+
const document = platformRef.injector.get(DOCUMENT);
|
|
41
|
+
document.body.innerHTML = `<${appId}></${appId}>`;
|
|
40
42
|
const bootstrap = (context) => bootstrapApplication(Component, {
|
|
41
43
|
providers: [
|
|
42
44
|
{
|
|
@@ -53,7 +55,16 @@ async function renderToStaticMarkup(Component, props, _children) {
|
|
|
53
55
|
const html = await renderApplication(bootstrap, {
|
|
54
56
|
document,
|
|
55
57
|
});
|
|
56
|
-
|
|
58
|
+
document.documentElement.innerHTML = html;
|
|
59
|
+
let styleTags = '';
|
|
60
|
+
document.head.childNodes.forEach((node) => {
|
|
61
|
+
if (node.nodeName === 'STYLE') {
|
|
62
|
+
styleTags += node.outerHTML;
|
|
63
|
+
}
|
|
64
|
+
});
|
|
65
|
+
const correctedHtml = styleTags + document.body.innerHTML;
|
|
66
|
+
platformRef.destroy();
|
|
67
|
+
return { html: correctedHtml };
|
|
57
68
|
}
|
|
58
69
|
export default {
|
|
59
70
|
check,
|
package/src/server.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
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,
|
|
1
|
+
{"version":3,"file":"server.js","sourceRoot":"","sources":["../../../../packages/astro-angular/src/server.ts"],"names":[],"mappings":"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","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 DOCUMENT,\n} from '@angular/core';\nimport {\n BEFORE_APP_SERIALIZED,\n provideServerRendering,\n renderApplication,\n ɵSERVER_CONTEXT,\n platformServer,\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\n const platformRef = platformServer();\n const document = platformRef.injector.get(DOCUMENT);\n document.body.innerHTML = `<${appId}></${appId}>`;\n\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 document.documentElement.innerHTML = html;\n let styleTags = '';\n\n document.head.childNodes.forEach((node) => {\n if (node.nodeName === 'STYLE') {\n styleTags += (node as HTMLElement).outerHTML;\n }\n });\n\n const correctedHtml = styleTags + document.body.innerHTML;\n\n platformRef.destroy();\n\n return { html: correctedHtml };\n}\n\nexport default {\n check,\n renderToStaticMarkup,\n};\n"]}
|