@dotglitch/ngx-common 1.1.42 → 1.1.44

package/fesm2022/dotglitch-ngx-common.mjs

@@ -1690,11 +1690,11 @@ class LazyLoaderService {
                 return t[$id] == _id;
             // Matcher is regex
             if (t.matcher instanceof RegExp)
-                return t.matcher.test(_id) || t.matcher.test(value);
+                return t.matcher.test(value) || t.matcher.test(_id);
             // Matcher is string => regex
             if (typeof t.matcher == 'string') {
                 const rx = new RegExp(t.matcher, 'ui');
-                return rx.test(_id) || rx.test(value);
+                return rx.test(value) || rx.test(_id);
             }
             // Matcher is array
             if (Array.isArray(t.matcher)) {
@@ -1713,7 +1713,7 @@ class LazyLoaderService {
         }
         const out = items[0];
         if (out.matcher instanceof RegExp) {
-            const result = _id.match(out.matcher) || value.match(out.matcher);
+            const result = value.match(out.matcher) || _id.match(out.matcher);
             return {
                 entry: out,
                 matchGroups: result?.groups
@@ -1798,6 +1798,7 @@ class LazyLoaderComponent {
      * The id of the component that will be lazy loaded
      */
     set id(data) {
+        this.originalId = data;
         const id = stringToSlug(data);
         // Check if there is a change to the loaded component's id
         // if it's updated, we destroy and rehydrate the entire container
@@ -1811,6 +1812,7 @@ class LazyLoaderComponent {
     }
     ;
     set group(data) {
+        this.originalGroup = data;
         const group = stringToSlug(data);
         if (typeof group != "string" || !group)
             return;
@@ -1947,7 +1949,7 @@ class LazyLoaderComponent {
             return this.loadDefault();
         }
         try {
-            const _entry = this.service.resolveRegistrationEntry(this._id, this._group);
+            const _entry = this.service.resolveRegistrationEntry(this.originalId, this.originalGroup);
             if (!_entry || !_entry.entry) {
                 this.err(`Failed to find Component '${this._id}' in group '${this._group}' in registry!`);
                 return this.loadDefault();
@@ -1984,6 +1986,14 @@ class LazyLoaderComponent {
                 this.err(`Component '${this._id}' is invalid or corrupted!`);
                 return this.loadError();
             }
+            // const componentRef = this.targetComponentContainerRef = createComponent(component as any, {
+            //     environmentInjector: this.appRef.injector,
+            //     elementInjector: this.injector,
+            //     hostElement: this.viewContainerRef.element.nativeElement,
+            //     // projectableNodes:
+            // });
+            // // this.targetRef = this.targetContainer.insert(this.targetComponentContainerRef.hostView);
+            // this.appRef.attachView(componentRef.hostView);
             // Bootstrap the component into the container
             const componentRef = this.targetComponentContainerRef = this.targetContainer.createComponent(component);
             this.targetRef = this.targetContainer.insert(this.targetComponentContainerRef.hostView);
@@ -9334,8 +9344,9 @@ class TabulatorComponent {
                 });
             })();
         }
-        else
+        else {
             this.table?.setData(this.dataSource);
+        }
     }
     ;
     get dataSource() { return this._dataSource; }
@@ -9370,7 +9381,7 @@ class TabulatorComponent {
         table.on("rowClick", (e, row) => this.rowClick.next({ event: e, row, data: row.getData() }));
         table.on("rowContext", (e, row) => this.rowContext.next({ event: e, row, data: row.getData() }));
         table.on("rowDblClick", (e, row) => this.rowDblClick.next({ event: e, row, data: row.getData() }));
-        table.on("renderComplete", () => {
+        table.on("tableBuilt", () => {
             table.redraw();
         });
     }
@@ -11654,11 +11665,16 @@ class ReactMagicWrapperComponent {
             };
             component.changeDetectorRef.detectChanges();
         }, []);
+        // Create a container for the wrapped element and
+        // all of the siblings we will inject into it's container.
+        // The double wrapper is necessary for React's mechanisms to properly
+        // associate things together.
         return React.createElement('div', {}, React.createElement("div", { id }), ...additionalChildren);
     }); }
-    constructor(ngContainer, ngTheme) {
+    constructor(ngContainer, ngTheme, ngZone) {
         this.ngContainer = ngContainer;
         this.ngTheme = ngTheme;
+        this.ngZone = ngZone;
         this.ngSubscriptions = [
             this.ngTheme.subscribe(t => {
                 this.theme = t;
@@ -11683,25 +11699,27 @@ class ReactMagicWrapperComponent {
     _render() {
         if (!this.ngReactComponent)
             return;
-        if (!this._root) {
-            this._root = createRoot(this.ngContainer.element.nativeElement);
-        }
-        // List all keys that do not start with `_` nor `ng`
-        const keys = Object.keys(this).filter(k => !/^(?:_|ng)/.test(k));
-        // Get all property keys from the class
-        const propKeys = keys.filter(k => !k.startsWith("on"));
-        // Get all event handler keys from the class
-        const evtKeys = keys.filter(k => k.startsWith("on"));
-        const props = {};
-        // Project all key properties onto `props`
-        propKeys.forEach(k => props[k] = this[k]);
-        // Bind all event handlers.
-        // ! important Angular uses EventEmitter, React uses
-        // a different method of event binding
-        evtKeys.forEach(k => props[k] = (...args) => this[k].next(args));
-        this._root.render(React.createElement(this.ngReactComponent, { props: props }));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ReactMagicWrapperComponent, deps: [{ token: i0.ViewContainerRef }, { token: ThemeService }], target: i0.ɵɵFactoryTarget.Component }); }
+        this.ngZone.runOutsideAngular(() => {
+            if (!this._root) {
+                this._root = createRoot(this.ngContainer.element.nativeElement);
+            }
+            // List all keys that do not start with `_` nor `ng`
+            const keys = Object.keys(this).filter(k => !/^(?:_|ng)/.test(k));
+            // Get all property keys from the class
+            const propKeys = keys.filter(k => !k.startsWith("on"));
+            // Get all event handler keys from the class
+            const evtKeys = keys.filter(k => k.startsWith("on"));
+            const props = {};
+            // Project all key properties onto `props`
+            propKeys.forEach(k => props[k] = this[k]);
+            // Bind all event handlers.
+            // ! important Angular uses EventEmitter, React uses
+            // a different method of event binding
+            evtKeys.forEach(k => props[k] = (...args) => this[k].next(args));
+            this._root.render(React.createElement(this.ngReactComponent, { props: props }));
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ReactMagicWrapperComponent, deps: [{ token: i0.ViewContainerRef }, { token: ThemeService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: ReactMagicWrapperComponent, isStandalone: true, selector: "app-react-magic-wrapper", usesOnChanges: true, ngImport: i0, template: ``, isInline: true }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ReactMagicWrapperComponent, decorators: [{
@@ -11711,7 +11729,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImpor
                     template: ``,
                     standalone: true
                 }]
-        }], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: ThemeService }] });
+        }], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: ThemeService }, { type: i0.NgZone }] });
 
 /*
  * Public API Surface of package