ngx-reactify 0.1.5 → 0.1.7

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 CHANGED
@@ -5,7 +5,7 @@ I will try to minimize breaking changes between minor version revisions but some
5
5
 
6
6
  This project aims to make using Angular components in React not suck, and vice-versa. This is a dependency of my other library, ngx-xyflow.
7
7
 
8
- ### Getting started:
8
+ ## Getting started (React in Angular):
9
9
 
10
10
  ##### Install React
11
11
 
@@ -23,9 +23,9 @@ This project aims to make using Angular components in React not suck, and vice-v
23
23
  npm i ngx-reactify
24
24
  ```
25
25
 
26
- ### Embed React component in Angular
26
+ ### Embed a React component in Angular
27
27
 
28
- ##### Create component Interface
28
+ ##### Create the wrapper component
29
29
  Next, you.
30
30
  > This step is necessary as it creates Angular bindings that can be used.
31
31
  > Important: You can't use the normal stylesheet imports from React. Put your styles in the component.scss file.
@@ -83,37 +83,183 @@ export class DemoComponent {
83
83
  }
84
84
  ```
85
85
 
86
- ### Embed Angular component in React
86
+ ## Getting started (Angular in React):
87
+
88
+ ### Install ngx-reactify
89
+
90
+ ```bash
91
+ npm i ngx-reactify
92
+ ```
93
+
94
+ ### Install Angular in your project
95
+ You need at minimum the following dependencies:
96
+
97
+ It has been tested on v19, other versions **should** work if they support standalone components.
98
+
99
+ ```bash
100
+ npm i @analogjs/vite-plugin-angular @angular/common@19 @angular/core@19 @angular/platform-browser@19 @angular/compiler@19
101
+ ```
102
+
103
+ ### Setup
104
+
105
+ ##### Zone.js
106
+
107
+ The init method currently requires zone.js, so you need to import that in the browser.
108
+ I recommend placing the side-effect import in your entrypoint ts/tsx file like so:
87
109
 
88
- > :warn: Under construction.
89
- <!--
90
110
  ```ts
91
- import React from 'react';
92
- import { ReactifyReactComponent } from 'ngx-reactify';
93
- import { Component, EventEmitter, Input, Output, ViewEncapsulation } from '@angular/core';
94
- import { ReactDemoComponent } from './react-demo.component';
111
+ import "zone.js";
112
+ ```
113
+
114
+ ##### tsconfig
115
+
116
+ You **must** add a tsconfig.app.json file. The sample below has been tested and works.
117
+ `tsconfig.app.json`
118
+ ```json
119
+ {
120
+ "extends": "./tsconfig.json",
121
+ "compileOnSave": false,
122
+ "compilerOptions": {
123
+ "baseUrl": "./",
124
+ "outDir": "./dist/out-tsc",
125
+ "forceConsistentCasingInFileNames": true,
126
+ "strict": true,
127
+ "noImplicitOverride": true,
128
+ "noPropertyAccessFromIndexSignature": true,
129
+ "noImplicitReturns": true,
130
+ "noFallthroughCasesInSwitch": true,
131
+ "sourceMap": true,
132
+ "declaration": false,
133
+ "downlevelIteration": true,
134
+ "experimentalDecorators": true,
135
+ "moduleResolution": "node",
136
+ "importHelpers": true,
137
+ "noEmit": false,
138
+ "target": "es2020",
139
+ "module": "es2020",
140
+ "lib": [
141
+ "es2020",
142
+ "dom"
143
+ ],
144
+ "skipLibCheck": true
145
+ },
146
+ "angularCompilerOptions": {
147
+ "enableI18nLegacyMessageIdFormat": false,
148
+ "strictInjectionParameters": true,
149
+ "strictInputAccessModifiers": true,
150
+ "strictTemplates": true
151
+ },
152
+ "files": [],
153
+ "include": [
154
+ "src/**/*.ts"
155
+ ]
156
+ }
157
+
158
+ ```
159
+
160
+ ##### vite.config.js
161
+
162
+ You need to import the angular plugin from @analogjs/vite-plugin-angular.
163
+
164
+ ```js
165
+ import { defineConfig } from 'vite';
166
+ import react from '@vitejs/plugin-react';
167
+ import angular from '@analogjs/vite-plugin-angular';
168
+
169
+ export default defineConfig({
170
+ plugins: [
171
+ // Angular plugin **MUST** be imported before the react plugin.
172
+ angular(),
173
+ react()
174
+ ]
175
+ });
176
+ ```
177
+
178
+ ### Using an Angular component in your React app
179
+
180
+ There are two ways in which you can transform an Angular component into a React entity.
181
+
182
+ Option one is to perform a one-time wrapping of the Angular component. This allows you to
183
+ use it like a normal react component, and you can even import the transformed component
184
+ throughout your project like normal react components.
185
+ Option two is to perform an ad-hoc transformation. This is more useful where you need to
186
+ pass providers into the Angular ecosystem.
187
+
188
+
189
+ #### One time auto-wrap of an Angular component to a React component
190
+
191
+ Angular Component:
192
+
193
+ ```ts
194
+ import { Component, EventEmitter, Input, Output } from '@angular/core';
95
195
 
96
196
  @Component({
97
- selector: 'app-demo',
98
- template: `<div (click)="onNodeClick($event)"></div>`,
99
- standalone: true
197
+ selector: 'ngx-child',
198
+ standalone: true,
199
+ template: `
200
+ <div class="angular">
201
+ <h1>Hello from Angular, {{name}}!</h1>
202
+ <p>Clicks: {{ clicks }}</p>
203
+ <button (click)="increment()">Click me!</button>
204
+ </div>
205
+ `,
206
+ styles: [``]
100
207
  })
101
- export class DemoComponent {
102
- onNodeClick(evt) {
103
- console.log(evt)
208
+ export class AngularComponent {
209
+
210
+ @Input() clicks = 0;
211
+ @Output() clickChange = new EventEmitter<number>();
212
+
213
+ @Input() name;
214
+
215
+ increment() {
216
+ this.clicks++;
217
+ this.clickChange.emit(this.clicks);
104
218
  }
105
219
  }
220
+ ```
221
+
222
+ React component
223
+ ```tsx
224
+ import React, { useState } from 'react';
225
+ import { createRoot } from 'react-dom/client';
226
+
227
+ import './main.css';
228
+ import { ReactifyStandaloneAngularComponent } from 'ngx-reactify';
229
+ import { AngularComponent } from './angular.component';
106
230
 
107
- const AngularReactComponent = ReactifyReactComponent(DemoComponent)
231
+ import "zone.js";
108
232
 
109
- export default function App() {
233
+ const AngularReactComponent = ReactifyStandaloneAngularComponent(AngularComponent, [], 'ngx-react-wrapped', true)
110
234
 
111
- return (
112
- <img src="https://picsum.photos/200" className={'picture'}></img>
235
+ // Main App component
236
+ const App = () => {
237
+ const [angularClicks, setAngularClicks] = useState(10);
113
238
 
114
- <div>
115
-
116
- </div>
117
- )
239
+ return <div>
240
+ <AngularReactComponent
241
+ // This causes React to re-render the Angular
242
+ // component every time angularClicks changes
243
+ // it also enables pre-seeding 2-way bindings
244
+ // This is sub-optimal for Angular flows but
245
+ // follows the intended React practice
246
+ clicks={angularClicks}
247
+ clickChange={setAngularClicks}
248
+
249
+ name="Alex"
250
+ />
251
+ </div>;
118
252
  }
119
- ``` -->
253
+
254
+ const container = document.getElementById('root');
255
+ const root = createRoot(container);
256
+ root.render(
257
+ <React.StrictMode>
258
+ <App />
259
+ </React.StrictMode>
260
+ );
261
+ ```
262
+
263
+
264
+
265
+ #### ad-hoc transformation (WIP)
@@ -137,14 +137,6 @@ function WrapAngularComponentInReact({ component, ngZone, appRef, injector, prop
137
137
  // Is there a better way to do this?
138
138
  let subscriptions;
139
139
  let componentInstance;
140
- React.useEffect(() => {
141
- return () => {
142
- // Cleanup and dispose leftover Angular objects
143
- appRef?.detachView(componentInstance.hostView);
144
- subscriptions?.forEach(s => s?.unsubscribe());
145
- componentInstance?.destroy();
146
- };
147
- }, []);
148
140
  const tripChangeDetection = () => componentInstance?.changeDetectorRef?.detectChanges();
149
141
  // These attributes will trigger change detection when they fire from
150
142
  // the underlying React element.
@@ -155,11 +147,16 @@ function WrapAngularComponentInReact({ component, ngZone, appRef, injector, prop
155
147
  return reactTemplate(React.createElement(containerTag, {
156
148
  ...attrObj,
157
149
  ref: async (node) => {
150
+ // When the node is empty, we can safely clean up the angular instance
151
+ // and detach views.
152
+ if (!node) {
153
+ // Cleanup and dispose leftover Angular objects
154
+ appRef?.detachView(componentInstance.hostView);
155
+ subscriptions?.forEach(s => s?.unsubscribe());
156
+ componentInstance?.destroy();
157
+ }
158
158
  if (componentInstance)
159
159
  return;
160
- // Not sure if this ever actually happens, added as a preventative measure
161
- // to memory leaks.
162
- subscriptions?.forEach(s => s?.unsubscribe());
163
160
  const bootstrap = () => {
164
161
  // Init the Angular component with the context of the root Angular app.
165
162
  componentInstance = createComponent(component, {
@@ -170,6 +167,7 @@ function WrapAngularComponentInReact({ component, ngZone, appRef, injector, prop
170
167
  });
171
168
  appRef.attachView(componentInstance.hostView);
172
169
  };
170
+ // Bootstrap in the Angular zone if it's provided
173
171
  ngZone?.runTask
174
172
  ? ngZone?.runTask(bootstrap)
175
173
  : bootstrap();
@@ -214,47 +212,82 @@ const AutoWrapAngularObject = ({ component, appRef, ngZone, instance, injector,
214
212
  reactTemplate
215
213
  });
216
214
  };
217
- /**
218
- * Bootstrap an Angular component with `createApplication` and export it under a
219
- * react Element.
220
- * Usage: React top-level application embedding an Angular component.
221
- */
222
- function ReactifyStandaloneAngularComponent(component, props = {}, providers = [], containerTag = 'div') {
215
+ function ReactifyStandaloneAngularComponent(component, providers = [], containerTag = 'div', debug = false) {
216
+ return React.memo((props) => {
217
+ return ReactifyStandaloneAngularElement(component, props, providers, containerTag, debug);
218
+ });
219
+ }
220
+ function ReactifyStandaloneAngularElement(component, props = {}, providers = [], containerTag = 'div', debug = false) {
221
+ if (debug) {
222
+ console.info(`[ngx-reactify/${containerTag}]: Begin render`, { args: { component, props, providers, containerTag } });
223
+ }
224
+ // Preserve React execution context
223
225
  const ctx = this;
224
- // Is there a better way to do this?
225
226
  let subscriptions;
226
227
  let app;
228
+ // The Angular component instance
229
+ let instance;
230
+ let containerNode = document.createElement("ngx-container");
231
+ const attachProperties = () => {
232
+ subscriptions?.forEach(s => s.unsubscribe());
233
+ subscriptions = [];
234
+ Object.keys(props).filter((k) => {
235
+ // If the property is being passed in as a bound dispatchState, we'll
236
+ // handle it as a eventEmitter on Angular's side.
237
+ if (props[k].name == 'bound dispatchSetState') {
238
+ subscriptions.push(instance[k]?.subscribe(evt => props[k].call(ctx, evt)));
239
+ }
240
+ // else if (v instanceof EventEmitter) {
241
+ // subscriptions.push(
242
+ // instance[k]?.subscribe(evt => props[k].call(ctx, evt))
243
+ // );
244
+ // }
245
+ else {
246
+ instance[k] = props[k];
247
+ }
248
+ });
249
+ };
227
250
  React.useEffect(() => {
228
- return () => {
229
- // Code to run when the component unmounts
230
- subscriptions?.forEach(s => s?.unsubscribe());
231
- app?.destroy();
232
- };
233
- }, []);
251
+ if (!instance)
252
+ return;
253
+ attachProperties();
254
+ });
234
255
  return React.createElement(containerTag, {
235
256
  ref: async (node) => {
236
- // Not sure if this ever actually happens, added as a preventative measure
237
- // to memory leaks.
238
- subscriptions?.forEach(s => s?.unsubscribe());
239
- app?.destroy();
257
+ // If the node is removed, we need to cleanup
258
+ if (!node) {
259
+ if (debug) {
260
+ console.info(`[ngx-reactify/${containerTag}]: Dispose`, { args: { component, props, providers, containerTag } });
261
+ }
262
+ subscriptions?.forEach(s => s?.unsubscribe());
263
+ app?.destroy();
264
+ return;
265
+ }
266
+ if (debug) {
267
+ console.info(`[ngx-reactify/${containerTag}]: NG Bootstrap`, { args: { component, props, providers, containerTag } });
268
+ }
269
+ node.append(containerNode);
240
270
  // Init an Angular application root & bootstrap it to a DOM element.
241
271
  app = await createApplication({ providers });
242
- const base = app.bootstrap(component, node);
243
- const { instance } = base;
272
+ if (debug) {
273
+ console.info(`[ngx-reactify/${containerTag}]: NG App Created`, { args: { component, props, providers, containerTag } });
274
+ }
275
+ const base = app.bootstrap(component, containerNode);
276
+ instance = base.instance;
277
+ if (debug) {
278
+ console.info(`[ngx-reactify/${containerTag}]: NG Bootstrapped`, { args: { component, props, providers, containerTag } });
279
+ }
244
280
  // Wait for the JS to finish rendering and initing.
245
281
  await firstValueFrom(app.isStable);
282
+ if (debug) {
283
+ console.info(`[ngx-reactify/${containerTag}]: NG Stable`, { args: { component, props, providers, containerTag } });
284
+ }
246
285
  // Now that everything has settled, bind inputs and outputs.
247
- subscriptions = [];
248
- Object.entries(props).filter(([k, v]) => {
249
- // @Outputs are always Event Emitters (I think)
250
- if (v instanceof EventEmitter) {
251
- subscriptions.push(instance[k]?.subscribe(evt => props[k].call(ctx, evt)));
252
- }
253
- else {
254
- instance[k] = props[k];
255
- }
256
- });
286
+ attachProperties();
257
287
  base.changeDetectorRef.detectChanges();
288
+ if (debug) {
289
+ console.info(`[ngx-reactify/${containerTag}]: Render Complete`, { args: { component, props, providers, containerTag } });
290
+ }
258
291
  }
259
292
  });
260
293
  }
@@ -344,7 +377,7 @@ class ReactifyNgComponent {
344
377
  // there's only ever one item in the arguments list.
345
378
  this._props[k] = (arg) => {
346
379
  this[k].emit(arg);
347
- this.ngChangeDetector.markForCheck();
380
+ this.ngChangeDetector?.markForCheck();
348
381
  };
349
382
  }
350
383
  else {
@@ -352,7 +385,7 @@ class ReactifyNgComponent {
352
385
  // everything back to the parent component in an array.
353
386
  this._props[k] = (...args) => {
354
387
  this[k].emit(args);
355
- this.ngChangeDetector.markForCheck();
388
+ this.ngChangeDetector?.markForCheck();
356
389
  };
357
390
  }
358
391
  });
@@ -379,5 +412,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
379
412
  * Generated bundle index. Do not edit.
380
413
  */
381
414
 
382
- export { AutoWrapAngularObject, ReactifyAngularComponent, ReactifyAngularComponent3, ReactifyNgComponent, ReactifyReactComponent, ReactifyStandaloneAngularComponent, WrapAngularComponentInReact, ng2ReactProps };
415
+ export { AutoWrapAngularObject, ReactifyAngularComponent, ReactifyAngularComponent3, ReactifyNgComponent, ReactifyReactComponent, ReactifyStandaloneAngularComponent, ReactifyStandaloneAngularElement, WrapAngularComponentInReact, ng2ReactProps };
383
416
  //# sourceMappingURL=ngx-reactify.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"ngx-reactify.mjs","sources":["../../../src/util/angular-to-react.ts","../../../src/util/react-to-angular.ts","../../../src/ngx-reactify.ts"],"sourcesContent":["import { Type, ApplicationRef, Injector, NgZone, createComponent, EventEmitter, Provider, EnvironmentProviders, ComponentRef } from '@angular/core';\nimport { createApplication } from '@angular/platform-browser';\nimport * as React from 'react';\nimport { firstValueFrom, Subscription } from 'rxjs';\n\n\n/**\n * Wrap an Angular component inside of a React memo object.\n * Will attempt to bind @Input and @Output properties if provided,\n * and will bind the react arguments directly as @Input properties.\n *\n * Usage: An Angular top-level application with a ReactifyNgComponent react implementation\n * that needs to embed Angular components as children of the react-wrapped component.\n *\n * This is replaced by `WrapAngularComponentInReact`.\n * @deprecated\n */\nexport const ReactifyAngularComponent = ({\n component,\n appRef,\n injector,\n ngZone,\n staticInputs = {},\n staticOutputs = {},\n preSiblings = [],\n postSiblings = [],\n additionalChildren = [],\n rootElementName = '',\n containerElementName = ''\n}: {\n component: Type<any>,\n appRef: Omit<ApplicationRef, '_runningTick'>,\n injector: Injector,\n ngZone: NgZone,\n staticInputs?: { [key: string]: any; },\n staticOutputs?: { [key: string]: Function; },\n preSiblings?: React.ReactNode[],\n postSiblings?: React.ReactNode[],\n additionalChildren?: React.ReactNode[],\n rootElementName?: Parameters<typeof React.createElement>[0],\n containerElementName?: string;\n}) => React.memo((args) => {\n\n return ngZone.runOutsideAngular(() => {\n let outputSubscriptions: { [key: string]: Subscription; };\n let componentInstance: ComponentRef<any>;\n\n const tripChangeDetection = () =>\n componentInstance?.changeDetectorRef?.detectChanges();\n\n // These attributes will trigger change detection when they fire from\n // the underlying React element.\n // ... This will break things. FUCK.\n const attributes: Array<keyof React.DOMAttributes<any>> = ['onCopy', 'onCut', 'onPaste', 'onAbort', 'onBlur', 'onFocus', 'onCanPlay', 'onCanPlayThrough', 'onChange', 'onClick', 'onContextMenu', 'onDoubleClick', 'onDrag', 'onDragEnd', 'onDragEnter', 'onDragLeave', 'onDragOver', 'onDragStart', 'onDrop', 'onDurationChange', 'onEmptied', 'onEnded', 'onInput', 'onInvalid', 'onKeyDown', 'onKeyPress', 'onKeyUp', 'onLoad', 'onLoadedData', 'onLoadedMetadata', 'onLoadStart', 'onMouseDown', 'onMouseEnter', 'onMouseLeave', 'onMouseMove', 'onMouseOut', 'onMouseOver', 'onMouseUp', 'onPause', 'onPlay', 'onPlaying', 'onProgress', 'onRateChange', 'onReset', 'onScroll', 'onSeeked', 'onSeeking', 'onSelect', 'onStalled', 'onSubmit', 'onSuspend', 'onTimeUpdate', 'onVolumeChange', 'onWaiting', 'onError'];\n\n const attrObj = {};\n attributes.forEach(a => attrObj[a] = tripChangeDetection);\n\n React.useEffect(() => {\n return () => {\n // Code to run when the component unmounts\n appRef?.detachView(componentInstance.hostView);\n Object.values(outputSubscriptions).forEach(s => s.unsubscribe());\n componentInstance?.destroy();\n };\n }, []);\n\n\n const elements = [\n ...(preSiblings || []),\n React.createElement(containerElementName || \"div\", {\n ...attrObj,\n ref: node => {\n const { inputs, outputs } = component['ɵcmp'];\n\n if (componentInstance) return;\n\n ngZone.run(() => {\n componentInstance = createComponent(component, {\n environmentInjector: appRef.injector,\n elementInjector: injector,\n hostElement: node\n });\n\n Object.assign(staticInputs, args);\n appRef.attachView(componentInstance.hostView);\n });\n\n // Returns a list of entries that need to be set\n // This makes it so that unnecessary setters are not invoked.\n const updated = Object.entries(inputs).filter(([parentKey, childKey]: [string, string]) => {\n return componentInstance.instance[childKey] != staticInputs[parentKey];\n });\n\n updated.forEach(([parentKey, childKey]: [string, string]) => {\n if (staticInputs.hasOwnProperty(parentKey))\n componentInstance.instance[childKey] = staticInputs[parentKey];\n });\n\n outputSubscriptions = {};\n // Get a list of unregistered outputs\n const newOutputs = Object.entries(outputs).filter(([parentKey, childKey]: [string, string]) => {\n return !outputSubscriptions[parentKey];\n });\n\n // Reverse bind via subscription\n newOutputs.forEach(([parentKey, childKey]: [string, string]) => {\n if (!staticOutputs.hasOwnProperty(parentKey)) return;\n\n const target: EventEmitter<unknown> = componentInstance.instance[childKey];\n const outputs = staticOutputs;\n\n const sub = target.subscribe((...args) => {\n // Run the callback in the provided zone\n ngZone.run(() => {\n outputs[parentKey](...args);\n });\n }); // Subscription\n\n outputSubscriptions[parentKey] = sub;\n });\n\n // Wrap the destroy method to safely release the subscriptions\n const originalDestroy = componentInstance.onDestroy?.bind(componentInstance);\n componentInstance.onDestroy = (cb) => {\n Object.values(outputSubscriptions).forEach(s => s.unsubscribe());\n originalDestroy?.(cb);\n };\n\n componentInstance.changeDetectorRef.detectChanges();\n }\n }),\n ...(postSiblings || []),\n ...(additionalChildren || [])\n ].filter(e => e);\n\n return React.createElement(rootElementName || \"div\", {}, ...elements);\n });\n});\n\n\n/**\n * Do not use this.\n * @hidden\n * @experimental\n */\nexport const ng2ReactProps = (obj = {}) => {\n const props = {};\n Object.entries(obj).forEach(([k, v]) => {\n // Omit things prefixed with an underscore\n if (k.startsWith('_')) return;\n\n // Omit output event emitters\n if (v instanceof EventEmitter) {\n props[k] = (...args) => v.emit([args]);\n }\n else {\n props[k] = v;\n }\n });\n return props;\n};\n\n/**\n * This method will create a React component that\n * wraps an Angular component.\n * @returns React.NamedExoticComponent\n *\n * @hidden\n * @experimental\n */\nexport function WrapAngularComponentInReact({\n component,\n ngZone,\n appRef,\n injector,\n props,\n containerTag,\n reactTemplate,\n projectableNodes\n}: {\n /**\n * Angular Component to be rendered within React\n */\n component: Type<any>,\n /**\n * Angular Application Reference. Used for bootstrapping\n * and change detection hierarchy.\n */\n appRef: Omit<ApplicationRef, '_runningTick'>,\n /**\n * Instance of NgZone class.\n * Very important to prevent Zone.js event performance issues.\n * Do not set if running Zoneless CD.\n */\n ngZone?: NgZone,\n /**\n * Static properties to be passed into the Angular instance.\n * Automatically generates event proxies for Angular EventEmitters.\n */\n props?: Record<string, any>,\n /**\n * Local Element Injector provided to the Angular object\n */\n injector?: Injector,\n /**\n * HTML Tag for the created DOM wrapper. Defaults to `div`.\n */\n containerTag?: string,\n /**\n * React Function template\n */\n reactTemplate?: (el: React.ReactElement) => React.ReactElement;\n /**\n * Nodes to be passed to the `ng-content` of the child Angular component.\n */\n projectableNodes?: Node[][];\n}) {\n props ??= {};\n containerTag ??= 'div';\n const ctx = this;\n\n const createWrappedElement = () => {\n reactTemplate ??= (el) => el;\n return React.memo((args) => {\n const _props = {};\n Object.assign(_props, props);\n Object.assign(_props, args);\n\n // Is there a better way to do this?\n let subscriptions: Subscription[];\n let componentInstance: ComponentRef<any>;\n\n React.useEffect(() => {\n return () => {\n // Cleanup and dispose leftover Angular objects\n appRef?.detachView(componentInstance.hostView);\n subscriptions?.forEach(s => s?.unsubscribe());\n componentInstance?.destroy();\n };\n }, []);\n\n const tripChangeDetection = () =>\n componentInstance?.changeDetectorRef?.detectChanges();\n\n // These attributes will trigger change detection when they fire from\n // the underlying React element.\n // ... This will break things. FUCK.\n const attributes: Array<keyof React.DOMAttributes<any>> = ['onCopy', 'onCut', 'onPaste', 'onAbort', 'onBlur', 'onFocus', 'onCanPlay', 'onCanPlayThrough', 'onChange', 'onClick', 'onContextMenu', 'onDoubleClick', 'onDrag', 'onDragEnd', 'onDragEnter', 'onDragLeave', 'onDragOver', 'onDragStart', 'onDrop', 'onDurationChange', 'onEmptied', 'onEnded', 'onInput', 'onInvalid', 'onKeyDown', 'onKeyPress', 'onKeyUp', 'onLoad', 'onLoadedData', 'onLoadedMetadata', 'onLoadStart', 'onMouseDown', 'onMouseEnter', 'onMouseLeave', 'onMouseMove', 'onMouseOut', 'onMouseOver', 'onMouseUp', 'onPause', 'onPlay', 'onPlaying', 'onProgress', 'onRateChange', 'onReset', 'onScroll', 'onSeeked', 'onSeeking', 'onSelect', 'onStalled', 'onSubmit', 'onSuspend', 'onTimeUpdate', 'onVolumeChange', 'onWaiting', 'onError'];\n\n const attrObj = {};\n attributes.forEach(a => attrObj[a] = tripChangeDetection);\n\n return reactTemplate(React.createElement(containerTag, {\n ...attrObj,\n ref: async (node) => {\n if (componentInstance) return;\n\n // Not sure if this ever actually happens, added as a preventative measure\n // to memory leaks.\n subscriptions?.forEach(s => s?.unsubscribe());\n\n const bootstrap = () => {\n // Init the Angular component with the context of the root Angular app.\n componentInstance = createComponent(component, {\n environmentInjector: appRef.injector,\n elementInjector: injector,\n hostElement: node,\n projectableNodes: projectableNodes\n });\n appRef.attachView(componentInstance.hostView);\n };\n\n ngZone?.runTask\n ? ngZone?.runTask(bootstrap)\n : bootstrap();\n\n // Now that everything has settled, bind inputs and outputs.\n subscriptions = [];\n Object.entries(_props).filter(([k, v]) => {\n // @Outputs are always Event Emitters (I think)\n if (v instanceof EventEmitter) {\n subscriptions.push(\n componentInstance.instance[k]?.subscribe(evt => _props[k].call(ctx, evt))\n );\n }\n else {\n componentInstance.instance[k] = _props[k];\n }\n });\n\n componentInstance.changeDetectorRef.detectChanges();\n }\n }));\n });\n }\n\n return ngZone?.runOutsideAngular\n ? ngZone?.runOutsideAngular(createWrappedElement)\n : createWrappedElement();\n}\n\n/**\n * This method will automatically wrap an Angular\n * Component or Directive into a React object.\n * @Outputs (EventEmitters) will be automatically\n * linked into the input properties along with\n * all of the @Inputs.\n * @returns React.NamedExoticComponent\n * @experimental\n */\nexport const AutoWrapAngularObject = ({\n component,\n appRef,\n ngZone,\n instance,\n injector,\n containerTag,\n reactTemplate,\n}: (Parameters<typeof WrapAngularComponentInReact>[0] & {\n /**\n * Angular Component/Directive instance that will have properties bound to the created\n */\n instance?: InstanceType<Type<any>> | Record<string, any>,\n\n})) => {\n const props = ng2ReactProps(instance);\n\n return WrapAngularComponentInReact({\n component,\n ngZone,\n appRef,\n injector,\n containerTag,\n props,\n reactTemplate\n });\n};\n\n/**\n * Bootstrap an Angular component with `createApplication` and export it under a\n * react Element.\n * Usage: React top-level application embedding an Angular component.\n */\nexport function ReactifyStandaloneAngularComponent(\n component: Type<any>,\n props: any = {},\n providers: (Provider | EnvironmentProviders)[] = [],\n containerTag: string = 'div'\n) {\n const ctx = this;\n\n // Is there a better way to do this?\n let subscriptions: Subscription[];\n let app: ApplicationRef;\n\n React.useEffect(() => {\n return () => {\n // Code to run when the component unmounts\n subscriptions?.forEach(s => s?.unsubscribe());\n app?.destroy();\n };\n }, []);\n\n return React.createElement(containerTag, {\n ref: async (node) => {\n // Not sure if this ever actually happens, added as a preventative measure\n // to memory leaks.\n subscriptions?.forEach(s => s?.unsubscribe());\n app?.destroy();\n\n // Init an Angular application root & bootstrap it to a DOM element.\n app = await createApplication({ providers });\n const base = app.bootstrap(component, node);\n const { instance } = base;\n\n\n // Wait for the JS to finish rendering and initing.\n await firstValueFrom(app.isStable);\n\n // Now that everything has settled, bind inputs and outputs.\n subscriptions = [];\n Object.entries(props).filter(([k, v]) => {\n // @Outputs are always Event Emitters (I think)\n if (v instanceof EventEmitter) {\n subscriptions.push(\n instance[k]?.subscribe(evt => props[k].call(ctx, evt))\n );\n }\n else {\n instance[k] = props[k];\n }\n });\n\n base.changeDetectorRef.detectChanges();\n }\n });\n}\n\n\n\n// These exports exist to attempt to make the API have minimal breaking changes.\nexport const ReactifyReactComponent = ReactifyAngularComponent;\nexport const ReactifyAngularComponent3 = WrapAngularComponentInReact;;\n","import { AfterViewInit, ChangeDetectorRef, Directive, EventEmitter, NgZone, OnChanges, OnDestroy, SimpleChanges, ViewContainerRef } from '@angular/core';\nimport * as React from 'react';\nimport { createRoot, Root } from 'react-dom/client';\n\n/**\n * This component can be used to automatically wrap a React\n * component into Angular bindings with functional change detection.\n * All you need to provide is the @Input and @Output interface\n * for the component in order to tell Angular which keys correspond to what.\n *\n * ### You _must_ override the property `ngReactComponent`.\n *\n * Failure to do so will result in errors\n *\n * `override readonly ngReactComponent = SomeReactFunction;`\n *\n * Example:\n *\n * ```ts\n * @Component({\n * selector: \"app-react-wrapped\",\n * standalone: true\n * })\n * export class MyReactWrappedComponent extends ReactifyNgComponent {\n *\n * @Input() data: any;\n * @Input() options: any;\n * @Input() version: any;\n *\n * // Notice how we wrap the result in an array, this is important because\n * // React can pass multiple properties to a callback and Angular can't.\n * @Output() onClick = new EventEmitter<[any]>();\n *\n * }\n * ```\n */\n@Directive({\n standalone: true\n})\nexport class ReactifyNgComponent implements OnChanges, OnDestroy, AfterViewInit {\n\n /**\n * The react component to be wrapped.\n * ! Must be overridden for this wrapper to work\n */\n ngReactComponent: React.FunctionComponent<any> | React.ComponentClass<any>;\n\n private _root: Root;\n\n private _reactElement: React.ReactElement;\n\n private _props: Object = {};\n\n constructor(\n protected readonly ngContainer: ViewContainerRef,\n protected readonly ngZone: NgZone,\n protected readonly ngChangeDetector: ChangeDetectorRef\n ) {\n }\n\n ngOnInit() {\n if (!this.ngReactComponent) {\n throw new Error(\"ReactifyNgComponent cannot be inherited without a provided ngReactComponent!\");\n }\n }\n\n ngOnChanges(changes?: SimpleChanges): void {\n this._render();\n }\n\n ngAfterViewInit() {\n this._render();\n }\n\n ngOnDestroy() {\n this._root?.unmount();\n }\n\n private _render() {\n if (!this.ngReactComponent) {\n console.log(\"Render no component. May be context issue\")\n return\n };\n\n this.ngZone.runOutsideAngular(() => {\n try {\n this._root ??= createRoot(this.ngContainer.element.nativeElement);\n\n // List all keys that do not start with `_` nor `ng`\n const keys = Object.keys(this).filter(k => !/^(?:_|ng)/.test(k));\n\n // Get all property keys from the class\n const propKeys = keys.filter(k => !(this[k] instanceof EventEmitter));\n // Get all event handler keys from the class\n const evtKeys = keys.filter(k => this[k] instanceof EventEmitter);\n\n // Project all key properties onto `props`\n propKeys.forEach(k => this._props[k] = this[k]);\n\n // Attempt to ensure no zone is lost during the event emitter fires\n this.ngZone.runGuarded(() => {\n // Bind all event handlers.\n // ! important Angular uses EventEmitter, React uses\n // a different method of event binding\n evtKeys.forEach(k => {\n if (k.endsWith(\"Change\") && Object.hasOwn(this, k.replace(/Change$/, ''))) {\n // Detect if this should be treated as a 2-way binding. If so we'll assume\n // there's only ever one item in the arguments list.\n this._props[k] = (arg) => {\n (this[k] as EventEmitter<any>).emit(arg);\n this.ngChangeDetector.markForCheck();\n }\n }\n else {\n // We're assuming this is NOT a 2-way binding, just an event so we'll pass\n // everything back to the parent component in an array.\n this._props[k] = (...args) => {\n (this[k] as EventEmitter<any>).emit(args);\n this.ngChangeDetector.markForCheck();\n }\n }\n });\n })\n\n this._reactElement = React.createElement(this.ngReactComponent, { props: this._props as any });\n this._root.render(this._reactElement);\n }\n catch(err) {\n console.error(err)\n }\n })\n }\n}\n\n// We replace all React functions with Angular EventEmitters\n// thus, anything typed as a function will automatically be transformed.\nexport type ReactifyPropsTypeToAngular<T> = {\n [K in keyof T]: T[K] extends (...args) => any ? EventEmitter<\n Parameters<T[K]> extends [any] ? Parameters<T[K]>[0] : Parameters<T[K]>\n > : T[K];\n};\n\n// export function ReactifyNgComponent2<T = any>(): new() => ReactifyNgComponent & ReactifyPropsTypeToAngular<T> {\n// return ReactifyNgComponent as never;\n// };\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ngx-reactify.mjs","sources":["../../../src/util/angular-to-react.ts","../../../src/util/react-to-angular.ts","../../../src/ngx-reactify.ts"],"sourcesContent":["import { Type, ApplicationRef, Injector, NgZone, createComponent, EventEmitter, Provider, EnvironmentProviders, ComponentRef } from '@angular/core';\nimport { createApplication } from '@angular/platform-browser';\nimport * as React from 'react';\nimport { firstValueFrom, Subscription } from 'rxjs';\n\n\n/**\n * Wrap an Angular component inside of a React memo object.\n * Will attempt to bind @Input and @Output properties if provided,\n * and will bind the react arguments directly as @Input properties.\n *\n * Usage: An Angular top-level application with a ReactifyNgComponent react implementation\n * that needs to embed Angular components as children of the react-wrapped component.\n *\n * This is replaced by `WrapAngularComponentInReact`.\n * @deprecated\n */\nexport const ReactifyAngularComponent = ({\n component,\n appRef,\n injector,\n ngZone,\n staticInputs = {},\n staticOutputs = {},\n preSiblings = [],\n postSiblings = [],\n additionalChildren = [],\n rootElementName = '',\n containerElementName = ''\n}: {\n component: Type<any>,\n appRef: Omit<ApplicationRef, '_runningTick'>,\n injector: Injector,\n ngZone: NgZone,\n staticInputs?: { [key: string]: any; },\n staticOutputs?: { [key: string]: Function; },\n preSiblings?: React.ReactNode[],\n postSiblings?: React.ReactNode[],\n additionalChildren?: React.ReactNode[],\n rootElementName?: Parameters<typeof React.createElement>[0],\n containerElementName?: string;\n}) => React.memo((args) => {\n\n return ngZone.runOutsideAngular(() => {\n let outputSubscriptions: { [key: string]: Subscription; };\n let componentInstance: ComponentRef<any>;\n\n const tripChangeDetection = () =>\n componentInstance?.changeDetectorRef?.detectChanges();\n\n // These attributes will trigger change detection when they fire from\n // the underlying React element.\n // ... This will break things. FUCK.\n const attributes: Array<keyof React.DOMAttributes<any>> = ['onCopy', 'onCut', 'onPaste', 'onAbort', 'onBlur', 'onFocus', 'onCanPlay', 'onCanPlayThrough', 'onChange', 'onClick', 'onContextMenu', 'onDoubleClick', 'onDrag', 'onDragEnd', 'onDragEnter', 'onDragLeave', 'onDragOver', 'onDragStart', 'onDrop', 'onDurationChange', 'onEmptied', 'onEnded', 'onInput', 'onInvalid', 'onKeyDown', 'onKeyPress', 'onKeyUp', 'onLoad', 'onLoadedData', 'onLoadedMetadata', 'onLoadStart', 'onMouseDown', 'onMouseEnter', 'onMouseLeave', 'onMouseMove', 'onMouseOut', 'onMouseOver', 'onMouseUp', 'onPause', 'onPlay', 'onPlaying', 'onProgress', 'onRateChange', 'onReset', 'onScroll', 'onSeeked', 'onSeeking', 'onSelect', 'onStalled', 'onSubmit', 'onSuspend', 'onTimeUpdate', 'onVolumeChange', 'onWaiting', 'onError'];\n\n const attrObj = {};\n attributes.forEach(a => attrObj[a] = tripChangeDetection);\n\n React.useEffect(() => {\n return () => {\n // Code to run when the component unmounts\n appRef?.detachView(componentInstance.hostView);\n Object.values(outputSubscriptions).forEach(s => s.unsubscribe());\n componentInstance?.destroy();\n };\n }, []);\n\n\n const elements = [\n ...(preSiblings || []),\n React.createElement(containerElementName || \"div\", {\n ...attrObj,\n ref: node => {\n const { inputs, outputs } = component['ɵcmp'];\n\n if (componentInstance) return;\n\n ngZone.run(() => {\n componentInstance = createComponent(component, {\n environmentInjector: appRef.injector,\n elementInjector: injector,\n hostElement: node\n });\n\n Object.assign(staticInputs, args);\n appRef.attachView(componentInstance.hostView);\n });\n\n // Returns a list of entries that need to be set\n // This makes it so that unnecessary setters are not invoked.\n const updated = Object.entries(inputs).filter(([parentKey, childKey]: [string, string]) => {\n return componentInstance.instance[childKey] != staticInputs[parentKey];\n });\n\n updated.forEach(([parentKey, childKey]: [string, string]) => {\n if (staticInputs.hasOwnProperty(parentKey))\n componentInstance.instance[childKey] = staticInputs[parentKey];\n });\n\n outputSubscriptions = {};\n // Get a list of unregistered outputs\n const newOutputs = Object.entries(outputs).filter(([parentKey, childKey]: [string, string]) => {\n return !outputSubscriptions[parentKey];\n });\n\n // Reverse bind via subscription\n newOutputs.forEach(([parentKey, childKey]: [string, string]) => {\n if (!staticOutputs.hasOwnProperty(parentKey)) return;\n\n const target: EventEmitter<unknown> = componentInstance.instance[childKey];\n const outputs = staticOutputs;\n\n const sub = target.subscribe((...args) => {\n // Run the callback in the provided zone\n ngZone.run(() => {\n outputs[parentKey](...args);\n });\n }); // Subscription\n\n outputSubscriptions[parentKey] = sub;\n });\n\n // Wrap the destroy method to safely release the subscriptions\n const originalDestroy = componentInstance.onDestroy?.bind(componentInstance);\n componentInstance.onDestroy = (cb) => {\n Object.values(outputSubscriptions).forEach(s => s.unsubscribe());\n originalDestroy?.(cb);\n };\n\n componentInstance.changeDetectorRef.detectChanges();\n }\n }),\n ...(postSiblings || []),\n ...(additionalChildren || [])\n ].filter(e => e);\n\n return React.createElement(rootElementName || \"div\", {}, ...elements);\n });\n});\n\n\n/**\n * Do not use this.\n * @hidden\n * @experimental\n */\nexport const ng2ReactProps = (obj = {}) => {\n const props = {};\n Object.entries(obj).forEach(([k, v]) => {\n // Omit things prefixed with an underscore\n if (k.startsWith('_')) return;\n\n // Omit output event emitters\n if (v instanceof EventEmitter) {\n props[k] = (...args) => v.emit([args]);\n }\n else {\n props[k] = v;\n }\n });\n return props;\n};\n\n/**\n * This method will create a React component that\n * wraps an Angular component.\n * @returns React.NamedExoticComponent\n *\n * @hidden\n * @experimental\n */\nexport function WrapAngularComponentInReact({\n component,\n ngZone,\n appRef,\n injector,\n props,\n containerTag,\n reactTemplate,\n projectableNodes\n}: {\n /**\n * Angular Component to be rendered within React\n */\n component: Type<any>,\n /**\n * Angular Application Reference. Used for bootstrapping\n * and change detection hierarchy.\n */\n appRef: Omit<ApplicationRef, '_runningTick'>,\n /**\n * Instance of NgZone class.\n * Very important to prevent Zone.js event performance issues.\n * Do not set if running Zoneless CD.\n */\n ngZone?: NgZone,\n /**\n * Static properties to be passed into the Angular instance.\n * Automatically generates event proxies for Angular EventEmitters.\n */\n props?: Record<string, any>,\n /**\n * Local Element Injector provided to the Angular object\n */\n injector?: Injector,\n /**\n * HTML Tag for the created DOM wrapper. Defaults to `div`.\n */\n containerTag?: string,\n /**\n * React Function template\n */\n reactTemplate?: (el: React.ReactElement) => React.ReactElement;\n /**\n * Nodes to be passed to the `ng-content` of the child Angular component.\n */\n projectableNodes?: Node[][];\n}) {\n props ??= {};\n containerTag ??= 'div';\n const ctx = this;\n\n const createWrappedElement = () => {\n reactTemplate ??= (el) => el;\n return React.memo((args) => {\n const _props = {};\n Object.assign(_props, props);\n Object.assign(_props, args);\n\n // Is there a better way to do this?\n let subscriptions: Subscription[];\n let componentInstance: ComponentRef<any>;\n\n const tripChangeDetection = () =>\n componentInstance?.changeDetectorRef?.detectChanges();\n\n // These attributes will trigger change detection when they fire from\n // the underlying React element.\n // ... This will break things. FUCK.\n const attributes: Array<keyof React.DOMAttributes<any>> = ['onCopy', 'onCut', 'onPaste', 'onAbort', 'onBlur', 'onFocus', 'onCanPlay', 'onCanPlayThrough', 'onChange', 'onClick', 'onContextMenu', 'onDoubleClick', 'onDrag', 'onDragEnd', 'onDragEnter', 'onDragLeave', 'onDragOver', 'onDragStart', 'onDrop', 'onDurationChange', 'onEmptied', 'onEnded', 'onInput', 'onInvalid', 'onKeyDown', 'onKeyPress', 'onKeyUp', 'onLoad', 'onLoadedData', 'onLoadedMetadata', 'onLoadStart', 'onMouseDown', 'onMouseEnter', 'onMouseLeave', 'onMouseMove', 'onMouseOut', 'onMouseOver', 'onMouseUp', 'onPause', 'onPlay', 'onPlaying', 'onProgress', 'onRateChange', 'onReset', 'onScroll', 'onSeeked', 'onSeeking', 'onSelect', 'onStalled', 'onSubmit', 'onSuspend', 'onTimeUpdate', 'onVolumeChange', 'onWaiting', 'onError'];\n\n const attrObj = {};\n attributes.forEach(a => attrObj[a] = tripChangeDetection);\n\n return reactTemplate(React.createElement(containerTag, {\n ...attrObj,\n ref: async (node) => {\n // When the node is empty, we can safely clean up the angular instance\n // and detach views.\n if (!node) {\n // Cleanup and dispose leftover Angular objects\n appRef?.detachView(componentInstance.hostView);\n subscriptions?.forEach(s => s?.unsubscribe());\n componentInstance?.destroy();\n }\n\n if (componentInstance) return;\n\n const bootstrap = () => {\n // Init the Angular component with the context of the root Angular app.\n componentInstance = createComponent(component, {\n environmentInjector: appRef.injector,\n elementInjector: injector,\n hostElement: node,\n projectableNodes: projectableNodes\n });\n appRef.attachView(componentInstance.hostView);\n };\n\n // Bootstrap in the Angular zone if it's provided\n ngZone?.runTask\n ? ngZone?.runTask(bootstrap)\n : bootstrap();\n\n // Now that everything has settled, bind inputs and outputs.\n subscriptions = [];\n Object.entries(_props).filter(([k, v]) => {\n // @Outputs are always Event Emitters (I think)\n if (v instanceof EventEmitter) {\n subscriptions.push(\n componentInstance.instance[k]?.subscribe(evt => _props[k].call(ctx, evt))\n );\n }\n else {\n componentInstance.instance[k] = _props[k];\n }\n });\n\n componentInstance.changeDetectorRef.detectChanges();\n }\n }));\n });\n }\n\n return ngZone?.runOutsideAngular\n ? ngZone?.runOutsideAngular(createWrappedElement)\n : createWrappedElement();\n}\n\n/**\n * This method will automatically wrap an Angular\n * Component or Directive into a React object.\n * @Outputs (EventEmitters) will be automatically\n * linked into the input properties along with\n * all of the @Inputs.\n * @returns React.NamedExoticComponent\n * @experimental\n */\nexport const AutoWrapAngularObject = ({\n component,\n appRef,\n ngZone,\n instance,\n injector,\n containerTag,\n reactTemplate,\n}: (Parameters<typeof WrapAngularComponentInReact>[0] & {\n /**\n * Angular Component/Directive instance that will have properties bound to the created\n */\n instance?: InstanceType<Type<any>> | Record<string, any>,\n\n})) => {\n const props = ng2ReactProps(instance);\n\n return WrapAngularComponentInReact({\n component,\n ngZone,\n appRef,\n injector,\n containerTag,\n props,\n reactTemplate\n });\n};\n\ntype TransformProperties<T> = {\n [K in keyof T]: T[K] extends EventEmitter<infer U> ? React.Dispatch<React.SetStateAction<U>> : T[K];\n};\n\nexport function ReactifyStandaloneAngularComponent<T extends Type<any>>(\n component: T,\n providers: (Provider | EnvironmentProviders)[] = [],\n containerTag: string = 'div',\n debug = false\n) {\n return React.memo((props: Partial<TransformProperties<InstanceType<T>>>) => {\n return ReactifyStandaloneAngularElement(\n component as any,\n props,\n providers,\n containerTag,\n debug\n );\n });\n}\n\nexport function ReactifyStandaloneAngularElement(\n component: Type<any>,\n props: any = {},\n providers: (Provider | EnvironmentProviders)[] = [],\n containerTag: string = 'div',\n debug = false\n) {\n if (debug) {\n console.info(`[ngx-reactify/${containerTag}]: Begin render`, { args: { component, props, providers, containerTag } });\n }\n\n // Preserve React execution context\n const ctx = this;\n\n let subscriptions: Subscription[];\n let app: ApplicationRef;\n\n // The Angular component instance\n let instance;\n\n let containerNode = document.createElement(\"ngx-container\");\n\n const attachProperties = () => {\n subscriptions?.forEach(s => s.unsubscribe());\n subscriptions = [];\n\n Object.keys(props).filter((k) => {\n // If the property is being passed in as a bound dispatchState, we'll\n // handle it as a eventEmitter on Angular's side.\n if (props[k].name == 'bound dispatchSetState') {\n subscriptions.push(\n instance[k]?.subscribe(evt => props[k].call(ctx, evt))\n );\n }\n // else if (v instanceof EventEmitter) {\n // subscriptions.push(\n // instance[k]?.subscribe(evt => props[k].call(ctx, evt))\n // );\n // }\n else {\n instance[k] = props[k];\n }\n });\n };\n\n React.useEffect(() => {\n if (!instance) return;\n\n attachProperties();\n });\n\n return React.createElement(containerTag, {\n ref: async (node: HTMLElement) => {\n\n // If the node is removed, we need to cleanup\n if (!node) {\n if (debug) {\n console.info(`[ngx-reactify/${containerTag}]: Dispose`, { args: { component, props, providers, containerTag } });\n }\n\n subscriptions?.forEach(s => s?.unsubscribe());\n app?.destroy();\n\n return;\n }\n\n if (debug) {\n console.info(`[ngx-reactify/${containerTag}]: NG Bootstrap`, { args: { component, props, providers, containerTag } });\n }\n node.append(containerNode);\n\n // Init an Angular application root & bootstrap it to a DOM element.\n app = await createApplication({ providers });\n\n if (debug) {\n console.info(`[ngx-reactify/${containerTag}]: NG App Created`, { args: { component, props, providers, containerTag } });\n }\n\n const base = app.bootstrap(component, containerNode);\n instance = base.instance;\n\n if (debug) {\n console.info(`[ngx-reactify/${containerTag}]: NG Bootstrapped`, { args: { component, props, providers, containerTag } });\n }\n\n // Wait for the JS to finish rendering and initing.\n await firstValueFrom(app.isStable);\n\n if (debug) {\n console.info(`[ngx-reactify/${containerTag}]: NG Stable`, { args: { component, props, providers, containerTag } });\n }\n\n // Now that everything has settled, bind inputs and outputs.\n attachProperties();\n\n base.changeDetectorRef.detectChanges();\n\n if (debug) {\n console.info(`[ngx-reactify/${containerTag}]: Render Complete`, { args: { component, props, providers, containerTag } });\n }\n }\n });\n}\n\n\n// These exports exist to attempt to make the API have minimal breaking changes.\nexport const ReactifyReactComponent = ReactifyAngularComponent;\nexport const ReactifyAngularComponent3 = WrapAngularComponentInReact;;\n","import { AfterViewInit, ChangeDetectorRef, Directive, EventEmitter, NgZone, OnChanges, OnDestroy, SimpleChanges, ViewContainerRef } from '@angular/core';\nimport * as React from 'react';\nimport { createRoot, Root } from 'react-dom/client';\n\n/**\n * This component can be used to automatically wrap a React\n * component into Angular bindings with functional change detection.\n * All you need to provide is the @Input and @Output interface\n * for the component in order to tell Angular which keys correspond to what.\n *\n * ### You _must_ override the property `ngReactComponent`.\n *\n * Failure to do so will result in errors\n *\n * `override readonly ngReactComponent = SomeReactFunction;`\n *\n * Example:\n *\n * ```ts\n * @Component({\n * selector: \"app-react-wrapped\",\n * standalone: true\n * })\n * export class MyReactWrappedComponent extends ReactifyNgComponent {\n *\n * @Input() data: any;\n * @Input() options: any;\n * @Input() version: any;\n *\n * // Notice how we wrap the result in an array, this is important because\n * // React can pass multiple properties to a callback and Angular can't.\n * @Output() onClick = new EventEmitter<[any]>();\n *\n * }\n * ```\n */\n@Directive({\n standalone: true\n})\nexport class ReactifyNgComponent implements OnChanges, OnDestroy, AfterViewInit {\n\n /**\n * The react component to be wrapped.\n * ! Must be overridden for this wrapper to work\n */\n ngReactComponent: React.FunctionComponent<any> | React.ComponentClass<any>;\n\n private _root: Root;\n\n private _reactElement: React.ReactElement;\n\n private _props: Object = {};\n\n constructor(\n protected readonly ngContainer: ViewContainerRef,\n protected readonly ngZone: NgZone,\n protected readonly ngChangeDetector: ChangeDetectorRef\n ) {\n }\n\n ngOnInit() {\n if (!this.ngReactComponent) {\n throw new Error(\"ReactifyNgComponent cannot be inherited without a provided ngReactComponent!\");\n }\n }\n\n ngOnChanges(changes?: SimpleChanges): void {\n this._render();\n }\n\n ngAfterViewInit() {\n this._render();\n }\n\n ngOnDestroy() {\n this._root?.unmount();\n }\n\n private _render() {\n if (!this.ngReactComponent) {\n console.log(\"Render no component. May be context issue\");\n return;\n };\n\n this.ngZone.runOutsideAngular(() => {\n try {\n this._root ??= createRoot(this.ngContainer.element.nativeElement);\n\n // List all keys that do not start with `_` nor `ng`\n const keys = Object.keys(this).filter(k => !/^(?:_|ng)/.test(k));\n\n // Get all property keys from the class\n const propKeys = keys.filter(k => !(this[k] instanceof EventEmitter));\n // Get all event handler keys from the class\n const evtKeys = keys.filter(k => this[k] instanceof EventEmitter);\n\n // Project all key properties onto `props`\n propKeys.forEach(k => this._props[k] = this[k]);\n\n // Attempt to ensure no zone is lost during the event emitter fires\n this.ngZone.runGuarded(() => {\n // Bind all event handlers.\n // ! important Angular uses EventEmitter, React uses\n // a different method of event binding\n evtKeys.forEach(k => {\n if (k.endsWith(\"Change\") && Object.hasOwn(this, k.replace(/Change$/, ''))) {\n // Detect if this should be treated as a 2-way binding. If so we'll assume\n // there's only ever one item in the arguments list.\n this._props[k] = (arg) => {\n (this[k] as EventEmitter<any>).emit(arg);\n this.ngChangeDetector?.markForCheck();\n };\n }\n else {\n // We're assuming this is NOT a 2-way binding, just an event so we'll pass\n // everything back to the parent component in an array.\n this._props[k] = (...args) => {\n (this[k] as EventEmitter<any>).emit(args);\n this.ngChangeDetector?.markForCheck();\n };\n }\n });\n });\n\n this._reactElement = React.createElement(this.ngReactComponent, { props: this._props as any });\n this._root.render(this._reactElement);\n }\n catch (err) {\n console.error(err);\n }\n });\n }\n}\n\n// We replace all React functions with Angular EventEmitters\n// thus, anything typed as a function will automatically be transformed.\nexport type ReactifyPropsTypeToAngular<T> = {\n [K in keyof T]: T[K] extends (...args) => any ? EventEmitter<\n Parameters<T[K]> extends [any] ? Parameters<T[K]>[0] : Parameters<T[K]>\n > : T[K];\n};\n\n// export function ReactifyNgComponent2<T = any>(): new() => ReactifyNgComponent & ReactifyPropsTypeToAngular<T> {\n// return ReactifyNgComponent as never;\n// };\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ngx-reactify",
3
- "version": "0.1.5",
3
+ "version": "0.1.7",
4
4
  "repository": {
5
5
  "url": "https://github.com/knackstedt/ngx-reactify"
6
6
  },
@@ -1,4 +1,4 @@
1
- import { Type, ApplicationRef, Injector, NgZone, Provider, EnvironmentProviders } from '@angular/core';
1
+ import { Type, ApplicationRef, Injector, NgZone, EventEmitter, Provider, EnvironmentProviders } from '@angular/core';
2
2
  import * as React from 'react';
3
3
  /**
4
4
  * Wrap an Angular component inside of a React memo object.
@@ -95,12 +95,11 @@ export declare const AutoWrapAngularObject: ({ component, appRef, ngZone, instan
95
95
  */
96
96
  instance?: InstanceType<Type<any>> | Record<string, any>;
97
97
  })) => React.NamedExoticComponent<object>;
98
- /**
99
- * Bootstrap an Angular component with `createApplication` and export it under a
100
- * react Element.
101
- * Usage: React top-level application embedding an Angular component.
102
- */
103
- export declare function ReactifyStandaloneAngularComponent(component: Type<any>, props?: any, providers?: (Provider | EnvironmentProviders)[], containerTag?: string): React.DOMElement<React.DOMAttributes<Element>, Element>;
98
+ type TransformProperties<T> = {
99
+ [K in keyof T]: T[K] extends EventEmitter<infer U> ? React.Dispatch<React.SetStateAction<U>> : T[K];
100
+ };
101
+ export declare function ReactifyStandaloneAngularComponent<T extends Type<any>>(component: T, providers?: (Provider | EnvironmentProviders)[], containerTag?: string, debug?: boolean): React.MemoExoticComponent<(props: Partial<TransformProperties<InstanceType<T>>>) => React.DOMElement<React.DOMAttributes<HTMLElement>, HTMLElement>>;
102
+ export declare function ReactifyStandaloneAngularElement(component: Type<any>, props?: any, providers?: (Provider | EnvironmentProviders)[], containerTag?: string, debug?: boolean): React.DOMElement<React.DOMAttributes<HTMLElement>, HTMLElement>;
104
103
  export declare const ReactifyReactComponent: ({ component, appRef, injector, ngZone, staticInputs, staticOutputs, preSiblings, postSiblings, additionalChildren, rootElementName, containerElementName }: {
105
104
  component: Type<any>;
106
105
  appRef: Omit<ApplicationRef, "_runningTick">;
@@ -119,4 +118,5 @@ export declare const ReactifyReactComponent: ({ component, appRef, injector, ngZ
119
118
  containerElementName?: string;
120
119
  }) => React.NamedExoticComponent<object>;
121
120
  export declare const ReactifyAngularComponent3: typeof WrapAngularComponentInReact;
121
+ export {};
122
122
  //# sourceMappingURL=angular-to-react.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"angular-to-react.d.ts","sourceRoot":"","sources":["../../../src/util/angular-to-react.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"angular-to-react.d.ts","sourceRoot":"","sources":["../../../src/util/angular-to-react.ts"],"names":[],"mappings":"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"}