@analogjs/astro-angular 0.2.0-beta.11 → 0.2.0-beta.13

package/README.md

@@ -21,7 +21,7 @@ This command:
 
 - Installs the `@analogjs/astro-angular` package.
 - Adds the `@analogjs/astro-angular` integration to the `astro.config.mjs` file.
-- Installs the necessary dependencies to render Angular components on the server and client, and common Angular dependencies, such as `@angular/common` and `@angular/forms`.
+- Installs the necessary dependencies to render Angular components on the server and client, and common Angular dependencies, such as `@angular/common`.
 
 ### Setting up the TypeScript config
 
@@ -113,8 +113,6 @@ export default defineConfig({
   integrations: [
     angular({
       vite: {
-        tsconfig: 'path/to/tsconfig.app.json',
-        workspaceRoot: 'rootDir',
         inlineStylesExtension: 'scss|sass|less',
       },
     }),

package/migrations/migration.json

@@ -0,0 +1,4 @@
+{
+  "$schema": "../../../node_modules/@angular-devkit/schematics/collection-schema.json",
+  "schematics": {}
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@analogjs/astro-angular",
-  "version": "0.2.0-beta.11",
+  "version": "0.2.0-beta.13",
   "description": "Use Angular components within Astro",
   "type": "module",
   "author": "Brandon Roberts <robertsbt@gmail.com>",
@@ -27,7 +27,7 @@
     "url": "https://github.com/analogjs/analog.git"
   },
   "dependencies": {
-    "@analogjs/vite-plugin-angular": "^0.2.0-beta.11"
+    "@analogjs/vite-plugin-angular": "^0.2.0-beta.13"
   },
   "peerDependencies": {
     "@angular-devkit/build-angular": "^16.0.0",

package/src/client.js

@@ -0,0 +1,29 @@
+import 'zone.js/dist/zone.js';
+import { reflectComponentType, } from '@angular/core';
+import { NgZone, createComponent } from '@angular/core';
+import { createApplication } from '@angular/platform-browser';
+export default (element) => {
+    return (Component, props, _childHTML) => {
+        createApplication({
+            providers: [...(Component.clientProviders || [])],
+        }).then((appRef) => {
+            const zone = appRef.injector.get(NgZone);
+            zone.run(() => {
+                const componentRef = createComponent(Component, {
+                    environmentInjector: appRef.injector,
+                    hostElement: element,
+                });
+                const mirror = reflectComponentType(Component);
+                if (props && mirror) {
+                    for (const [key, value] of Object.entries(props)) {
+                        if (mirror.inputs.some(({ templateName, propName }) => templateName === key || propName === key)) {
+                            componentRef.setInput(key, value);
+                        }
+                    }
+                }
+                appRef.attachView(componentRef.hostView);
+            });
+        });
+    };
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2xpZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcGFja2FnZXMvYXN0cm8tYW5ndWxhci9zcmMvY2xpZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sc0JBQXNCLENBQUM7QUFDOUIsT0FBTyxFQUdMLG9CQUFvQixHQUVyQixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQWtCLE1BQU0sRUFBRSxlQUFlLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDeEUsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFFOUQsZUFBZSxDQUFDLE9BQW9CLEVBQUUsRUFBRTtJQUN0QyxPQUFPLENBQ0wsU0FFQyxFQUNELEtBQStCLEVBQy9CLFVBQW9CLEVBQ3BCLEVBQUU7UUFDRixpQkFBaUIsQ0FBQztZQUNoQixTQUFTLEVBQUUsQ0FBQyxHQUFHLENBQUMsU0FBUyxDQUFDLGVBQWUsSUFBSSxFQUFFLENBQUMsQ0FBQztTQUNsRCxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUMsTUFBc0IsRUFBRSxFQUFFO1lBQ2pDLE1BQU0sSUFBSSxHQUFHLE1BQU0sQ0FBQyxRQUFRLENBQUMsR0FBRyxDQUFDLE1BQU0sQ0FBQyxDQUFDO1lBQ3pDLElBQUksQ0FBQyxHQUFHLENBQUMsR0FBRyxFQUFFO2dCQUNaLE1BQU0sWUFBWSxHQUFHLGVBQWUsQ0FBQyxTQUFTLEVBQUU7b0JBQzlDLG1CQUFtQixFQUFFLE1BQU0sQ0FBQyxRQUFRO29CQUNwQyxXQUFXLEVBQUUsT0FBTztpQkFDckIsQ0FBQyxDQUFDO2dCQUVILE1BQU0sTUFBTSxHQUFHLG9CQUFvQixDQUFDLFNBQVMsQ0FBQyxDQUFDO2dCQUMvQyxJQUFJLEtBQUssSUFBSSxNQUFNLEVBQUU7b0JBQ25CLEtBQUssTUFBTSxDQUFDLEdBQUcsRUFBRSxLQUFLLENBQUMsSUFBSSxNQUFNLENBQUMsT0FBTyxDQUFDLEtBQUssQ0FBQyxFQUFFO3dCQUNoRCxJQUNFLE1BQU0sQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUNoQixDQUFDLEVBQUUsWUFBWSxFQUFFLFFBQVEsRUFBRSxFQUFFLEVBQUUsQ0FDN0IsWUFBWSxLQUFLLEdBQUcsSUFBSSxRQUFRLEtBQUssR0FBRyxDQUMzQyxFQUNEOzRCQUNBLFlBQVksQ0FBQyxRQUFRLENBQUMsR0FBRyxFQUFFLEtBQUssQ0FBQyxDQUFDO3lCQUNuQztxQkFDRjtpQkFDRjtnQkFFRCxNQUFNLENBQUMsVUFBVSxDQUFDLFlBQVksQ0FBQyxRQUFRLENBQUMsQ0FBQztZQUMzQyxDQUFDLENBQUMsQ0FBQztRQUNMLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQyxDQUFDO0FBQ0osQ0FBQyxDQUFDIn0=

package/src/index.js

@@ -0,0 +1,68 @@
+import viteAngular from '@analogjs/vite-plugin-angular';
+import { enableProdMode } from '@angular/core';
+function getRenderer() {
+    return {
+        name: '@analogjs/astro-angular',
+        clientEntrypoint: '@analogjs/astro-angular/client.js',
+        serverEntrypoint: '@analogjs/astro-angular/server.js',
+    };
+}
+function getViteConfiguration(vite) {
+    return {
+        optimizeDeps: {
+            include: [
+                '@angular/platform-browser',
+                '@angular/core',
+                '@analogjs/astro-angular/client.js',
+            ],
+            exclude: [
+                '@angular/platform-server',
+                '@analogjs/astro-angular/server.js',
+            ],
+        },
+        /**
+         *
+         * Why I am casting viteAngular as any
+         *
+         * The vite angular plugins is shipped as commonjs, while this astro
+         * integration is shipped using ESM and if you call the default
+         * function, you get the following error: viteAngular is not a function.
+         * Attempt to use ESM for the angular vite plugin broke something, hence
+         * this workaround for now.
+         *
+         */
+        plugins: [
+            viteAngular.default(vite),
+            {
+                name: '@analogjs/astro-angular-platform-server',
+                transform(code, id) {
+                    if (id.includes('platform-server')) {
+                        code = code.replace(/global\./g, 'globalThis.');
+                        return {
+                            code: code.replace('new xhr2.XMLHttpRequest', 'new (xhr2.default.XMLHttpRequest || xhr2.default)'),
+                        };
+                    }
+                    return;
+                },
+            },
+        ],
+        ssr: {
+            noExternal: ['@angular/**', '@analogjs/**'],
+        },
+    };
+}
+export default function (options) {
+    return {
+        name: '@analogjs/astro-angular',
+        hooks: {
+            'astro:config:setup': ({ addRenderer, updateConfig }) => {
+                addRenderer(getRenderer());
+                updateConfig({ vite: getViteConfiguration(options === null || options === void 0 ? void 0 : options.vite) });
+            },
+            'astro:build:setup': () => {
+                enableProdMode();
+            },
+        },
+    };
+}
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wYWNrYWdlcy9hc3Ryby1hbmd1bGFyL3NyYy9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLFdBQThCLE1BQU0sK0JBQStCLENBQUM7QUFDM0UsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQU8vQyxTQUFTLFdBQVc7SUFDbEIsT0FBTztRQUNMLElBQUksRUFBRSx5QkFBeUI7UUFDL0IsZ0JBQWdCLEVBQUUsbUNBQW1DO1FBQ3JELGdCQUFnQixFQUFFLG1DQUFtQztLQUN0RCxDQUFDO0FBQ0osQ0FBQztBQUVELFNBQVMsb0JBQW9CLENBQUMsSUFBb0I7SUFDaEQsT0FBTztRQUNMLFlBQVksRUFBRTtZQUNaLE9BQU8sRUFBRTtnQkFDUCwyQkFBMkI7Z0JBQzNCLGVBQWU7Z0JBQ2YsbUNBQW1DO2FBQ3BDO1lBQ0QsT0FBTyxFQUFFO2dCQUNQLDBCQUEwQjtnQkFDMUIsbUNBQW1DO2FBQ3BDO1NBQ0Y7UUFDRDs7Ozs7Ozs7OztXQVVHO1FBQ0gsT0FBTyxFQUFFO1lBQ04sV0FBbUIsQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDO1lBQ2xDO2dCQUNFLElBQUksRUFBRSx5Q0FBeUM7Z0JBQy9DLFNBQVMsQ0FBQyxJQUFZLEVBQUUsRUFBVTtvQkFDaEMsSUFBSSxFQUFFLENBQUMsUUFBUSxDQUFDLGlCQUFpQixDQUFDLEVBQUU7d0JBQ2xDLElBQUksR0FBRyxJQUFJLENBQUMsT0FBTyxDQUFDLFdBQVcsRUFBRSxhQUFhLENBQUMsQ0FBQzt3QkFFaEQsT0FBTzs0QkFDTCxJQUFJLEVBQUUsSUFBSSxDQUFDLE9BQU8sQ0FDaEIseUJBQXlCLEVBQ3pCLG1EQUFtRCxDQUNwRDt5QkFDRixDQUFDO3FCQUNIO29CQUVELE9BQU87Z0JBQ1QsQ0FBQzthQUNGO1NBQ0Y7UUFDRCxHQUFHLEVBQUU7WUFDSCxVQUFVLEVBQUUsQ0FBQyxhQUFhLEVBQUUsY0FBYyxDQUFDO1NBQzVDO0tBQ0YsQ0FBQztBQUNKLENBQUM7QUFFRCxNQUFNLENBQUMsT0FBTyxXQUFXLE9BQXdCO0lBQy9DLE9BQU87UUFDTCxJQUFJLEVBQUUseUJBQXlCO1FBQy9CLEtBQUssRUFBRTtZQUNMLG9CQUFvQixFQUFFLENBQUMsRUFBRSxXQUFXLEVBQUUsWUFBWSxFQUFFLEVBQUUsRUFBRTtnQkFDdEQsV0FBVyxDQUFDLFdBQVcsRUFBRSxDQUFDLENBQUM7Z0JBQzNCLFlBQVksQ0FBQyxFQUFFLElBQUksRUFBRSxvQkFBb0IsQ0FBQyxPQUFPLGFBQVAsT0FBTyx1QkFBUCxPQUFPLENBQUUsSUFBSSxDQUFDLEVBQUUsQ0FBQyxDQUFDO1lBQzlELENBQUM7WUFDRCxtQkFBbUIsRUFBRSxHQUFHLEVBQUU7Z0JBQ3hCLGNBQWMsRUFBRSxDQUFDO1lBQ25CLENBQUM7U0FDRjtLQUNGLENBQUM7QUFDSixDQUFDIn0=

package/src/server.js

@@ -0,0 +1,65 @@
+import { __awaiter } from "tslib";
+import 'zone.js/bundles/zone-node.umd.js';
+import { ApplicationRef, InjectionToken, reflectComponentType, } from '@angular/core';
+import { BEFORE_APP_SERIALIZED, provideServerRendering, renderApplication, ɵSERVER_CONTEXT, } from '@angular/platform-server';
+import { bootstrapApplication } from '@angular/platform-browser';
+const ANALOG_ASTRO_STATIC_PROPS = new InjectionToken('@analogjs/astro-angular: Static Props w/ Mirror Provider', {
+    factory() {
+        return { props: {}, mirror: {} };
+    },
+});
+function check(Component, _props, _children) {
+    return !!reflectComponentType(Component);
+}
+// Run beforeAppInitialized hook to set Input on the ComponentRef
+// before the platform renders to string
+const STATIC_PROPS_HOOK_PROVIDER = {
+    provide: BEFORE_APP_SERIALIZED,
+    useFactory: (appRef, { props, mirror, }) => {
+        return () => {
+            const compRef = appRef.components[0];
+            if (compRef && props && mirror) {
+                for (const [key, value] of Object.entries(props)) {
+                    if (
+                    // we double-check inputs on ComponentMirror
+                    // because Astro might add additional props
+                    // that aren't actually Input defined on the Component
+                    mirror.inputs.some(({ templateName, propName }) => templateName === key || propName === key)) {
+                        compRef.setInput(key, value);
+                    }
+                }
+                compRef.changeDetectorRef.detectChanges();
+            }
+        };
+    },
+    deps: [ApplicationRef, ANALOG_ASTRO_STATIC_PROPS],
+    multi: true,
+};
+function renderToStaticMarkup(Component, props, _children) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const mirror = reflectComponentType(Component);
+        const appId = (mirror === null || mirror === void 0 ? void 0 : mirror.selector) || Component.name.toString().toLowerCase();
+        const document = `<${appId}></${appId}>`;
+        const bootstrap = () => bootstrapApplication(Component, {
+            providers: [
+                {
+                    provide: ANALOG_ASTRO_STATIC_PROPS,
+                    useValue: { props, mirror },
+                },
+                STATIC_PROPS_HOOK_PROVIDER,
+                provideServerRendering(),
+                { provide: ɵSERVER_CONTEXT, useValue: 'analog' },
+                ...(Component.renderProviders || []),
+            ],
+        });
+        const html = yield renderApplication(bootstrap, {
+            document,
+        });
+        return { html };
+    });
+}
+export default {
+    check,
+    renderToStaticMarkup,
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VydmVyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcGFja2FnZXMvYXN0cm8tYW5ndWxhci9zcmMvc2VydmVyLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLGtDQUFrQyxDQUFDO0FBTzFDLE9BQU8sRUFDTCxjQUFjLEVBQ2QsY0FBYyxFQUNkLG9CQUFvQixHQUNyQixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQ0wscUJBQXFCLEVBQ3JCLHNCQUFzQixFQUN0QixpQkFBaUIsRUFDakIsZUFBZSxHQUNoQixNQUFNLDBCQUEwQixDQUFDO0FBQ2xDLE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLDJCQUEyQixDQUFDO0FBRWpFLE1BQU0seUJBQXlCLEdBQUcsSUFBSSxjQUFjLENBR2pELDBEQUEwRCxFQUFFO0lBQzdELE9BQU87UUFDTCxPQUFPLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxNQUFNLEVBQUUsRUFBOEIsRUFBRSxDQUFDO0lBQy9ELENBQUM7Q0FDRixDQUFDLENBQUM7QUFFSCxTQUFTLEtBQUssQ0FDWixTQUFpQyxFQUNqQyxNQUErQixFQUMvQixTQUFrQjtJQUVsQixPQUFPLENBQUMsQ0FBQyxvQkFBb0IsQ0FBQyxTQUFTLENBQUMsQ0FBQztBQUMzQyxDQUFDO0FBRUQsaUVBQWlFO0FBQ2pFLHdDQUF3QztBQUN4QyxNQUFNLDBCQUEwQixHQUFhO0lBQzNDLE9BQU8sRUFBRSxxQkFBcUI7SUFDOUIsVUFBVSxFQUFFLENBQ1YsTUFBc0IsRUFDdEIsRUFDRSxLQUFLLEVBQ0wsTUFBTSxHQUlQLEVBQ0QsRUFBRTtRQUNGLE9BQU8sR0FBRyxFQUFFO1lBQ1YsTUFBTSxPQUFPLEdBQUcsTUFBTSxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsQ0FBQztZQUNyQyxJQUFJLE9BQU8sSUFBSSxLQUFLLElBQUksTUFBTSxFQUFFO2dCQUM5QixLQUFLLE1BQU0sQ0FBQyxHQUFHLEVBQUUsS0FBSyxDQUFDLElBQUksTUFBTSxDQUFDLE9BQU8sQ0FBQyxLQUFLLENBQUMsRUFBRTtvQkFDaEQ7b0JBQ0UsNENBQTRDO29CQUM1QywyQ0FBMkM7b0JBQzNDLHNEQUFzRDtvQkFDdEQsTUFBTSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQ2hCLENBQUMsRUFBRSxZQUFZLEVBQUUsUUFBUSxFQUFFLEVBQUUsRUFBRSxDQUM3QixZQUFZLEtBQUssR0FBRyxJQUFJLFFBQVEsS0FBSyxHQUFHLENBQzNDLEVBQ0Q7d0JBQ0EsT0FBTyxDQUFDLFFBQVEsQ0FBQyxHQUFHLEVBQUUsS0FBSyxDQUFDLENBQUM7cUJBQzlCO2lCQUNGO2dCQUNELE9BQU8sQ0FBQyxpQkFBaUIsQ0FBQyxhQUFhLEVBQUUsQ0FBQzthQUMzQztRQUNILENBQUMsQ0FBQztJQUNKLENBQUM7SUFDRCxJQUFJLEVBQUUsQ0FBQyxjQUFjLEVBQUUseUJBQXlCLENBQUM7SUFDakQsS0FBSyxFQUFFLElBQUk7Q0FDWixDQUFDO0FBRUYsU0FBZSxvQkFBb0IsQ0FDakMsU0FFQyxFQUNELEtBQThCLEVBQzlCLFNBQWtCOztRQUVsQixNQUFNLE1BQU0sR0FBRyxvQkFBb0IsQ0FBQyxTQUFTLENBQUMsQ0FBQztRQUMvQyxNQUFNLEtBQUssR0FBRyxDQUFBLE1BQU0sYUFBTixNQUFNLHVCQUFOLE1BQU0sQ0FBRSxRQUFRLEtBQUksU0FBUyxDQUFDLElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQyxXQUFXLEVBQUUsQ0FBQztRQUMxRSxNQUFNLFFBQVEsR0FBRyxJQUFJLEtBQUssTUFBTSxLQUFLLEdBQUcsQ0FBQztRQUN6QyxNQUFNLFNBQVMsR0FBRyxHQUFHLEVBQUUsQ0FDckIsb0JBQW9CLENBQUMsU0FBUyxFQUFFO1lBQzlCLFNBQVMsRUFBRTtnQkFDVDtvQkFDRSxPQUFPLEVBQUUseUJBQXlCO29CQUNsQyxRQUFRLEVBQUUsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFO2lCQUM1QjtnQkFDRCwwQkFBMEI7Z0JBQzFCLHNCQUFzQixFQUFFO2dCQUN4QixFQUFFLE9BQU8sRUFBRSxlQUFlLEVBQUUsUUFBUSxFQUFFLFFBQVEsRUFBRTtnQkFDaEQsR0FBRyxDQUFDLFNBQVMsQ0FBQyxlQUFlLElBQUksRUFBRSxDQUFDO2FBQ3JDO1NBQ0YsQ0FBQyxDQUFDO1FBRUwsTUFBTSxJQUFJLEdBQUcsTUFBTSxpQkFBaUIsQ0FBQyxTQUFTLEVBQUU7WUFDOUMsUUFBUTtTQUNULENBQUMsQ0FBQztRQUVILE9BQU8sRUFBRSxJQUFJLEVBQUUsQ0FBQztJQUNsQixDQUFDO0NBQUE7QUFFRCxlQUFlO0lBQ2IsS0FBSztJQUNMLG9CQUFvQjtDQUNyQixDQUFDIn0=

package/src/test-setup.js

@@ -0,0 +1,2 @@
+import '@analogjs/vite-plugin-angular/setup-vitest';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGVzdC1zZXR1cC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3BhY2thZ2VzL2FzdHJvLWFuZ3VsYXIvc3JjL3Rlc3Qtc2V0dXAudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyw0Q0FBNEMsQ0FBQyJ9