@wavemaker-ai/angular-app 1.0.0-rc.309 → 1.0.0-rc.647469

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@wavemaker-ai/angular-app",
-    "version": "1.0.0-rc.309",
+    "version": "1.0.0-rc.647469",
     "scripts": {
         "ng": "ng",
         "start": "./node_modules/.bin/ng serve",
@@ -21,28 +21,28 @@
         ".npmrc"
     ],
     "dependencies": {
-        "@angular/animations": "20.3.19",
-        "@angular/common": "20.3.19",
-        "@angular/compiler": "20.3.19",
-        "@angular/core": "20.3.19",
-        "@angular/forms": "20.3.19",
-        "@angular/platform-browser": "20.3.19",
-        "@angular/platform-browser-dynamic": "20.3.19",
-        "@angular/router": "20.3.19",
-        "@angular/service-worker": "20.3.19",
+        "@angular/animations": "18.2.13",
+        "@angular/common": "18.2.13",
+        "@angular/compiler": "18.2.13",
+        "@angular/core": "18.2.13",
+        "@angular/forms": "18.2.13",
+        "@angular/platform-browser": "18.2.13",
+        "@angular/platform-browser-dynamic": "18.2.13",
+        "@angular/router": "18.2.13",
+        "@angular/service-worker": "18.2.13",
         "@fullcalendar/core": "6.1.18",
         "@fullcalendar/daygrid": "6.1.18",
         "@fullcalendar/interaction": "6.1.18",
         "@fullcalendar/list": "6.1.18",
         "@fullcalendar/timegrid": "6.1.18",
         "@metrichor/jmespath": "0.3.1",
-        "@wavemaker-ai/custom-widgets-m3": "1.0.0-rc.309",
+        "@wavemaker-ai/custom-widgets-m3": "1.0.0-rc.647469",
         "@wavemaker/focus-trap": "1.0.1",
-        "@wavemaker-ai/foundation-css": "1.0.0-rc.309",
+        "@wavemaker-ai/foundation-css": "1.0.0-rc.647469",
         "@wavemaker/nvd3": "1.8.16",
-        "@wavemaker-ai/variables": "1.0.0-rc.309",
+        "@wavemaker-ai/variables": "1.0.0-rc.647469",
         "@ztree/ztree_v3": "3.5.48",
-        "acorn": "8.15.0",
+        "acorn": "^8.15.0",
         "angular-imask": "7.6.1",
         "angular2-websocket": "0.9.8",
         "d3": "7.8.5",
@@ -50,82 +50,80 @@
         "jquery": "3.7.1",
         "jquery-ui": "1.14.1",
         "jssha": "3.3.1",
-        "lodash-es": "4.18.1",
+        "lodash-es": "4.17.21",
         "moment": "2.30.1",
-        "moment-timezone": "0.6.0",
+        "moment-timezone": "^0.6.0",
         "ng-circle-progress": "1.7.1",
-        "ngx-bootstrap": "20.0.2",
+        "ngx-bootstrap": "9.0.0",
         "ngx-color-picker": "20.1.1",
-        "ngx-toastr": "19.1.0",
+        "ngx-toastr": "19.0.0",
         "rxjs": "7.8.2",
         "summernote": "0.9.1",
         "tslib": "2.8.1",
         "x2js": "3.4.4",
         "zone.js": "0.15.1",
-        "@wavemaker-ai/app-ng-runtime": "1.0.0-rc.309"
+        "@wavemaker-ai/app-ng-runtime": "1.0.0-rc.647469"
     },
     "devDependencies": {
-        "@ampproject/rollup-plugin-closure-compiler": "0.27.0",
-        "@angular-builders/custom-webpack": "20.0.0",
-        "@angular-devkit/build-angular": "20.3.19",
+        "@ampproject/rollup-plugin-closure-compiler": "^0.27.0",
+        "@angular-builders/custom-webpack": "18.0.0",
+        "@angular-devkit/build-angular": "18.2.20",
         "@angular-eslint/builder": "20.1.1",
         "@angular-eslint/eslint-plugin": "20.1.1",
         "@angular-eslint/eslint-plugin-template": "20.1.1",
         "@angular-eslint/schematics": "20.1.1",
         "@angular-eslint/template-parser": "20.1.1",
-        "@angular/cli": "20.3.19",
-        "@angular/compiler-cli": "20.3.19",
-        "@angular/language-service": "20.3.19",
-        "@compodoc/compodoc": "1.2.1",
+        "@angular/cli": "18.2.12",
+        "@angular/compiler-cli": "18.2.13",
+        "@angular/language-service": "18.2.13",
+        "@compodoc/compodoc": "^1.1.26",
         "@rollup/plugin-alias": "5.1.1",
         "@rollup/plugin-commonjs": "28.0.6",
         "@rollup/plugin-multi-entry": "6.0.1",
         "@rollup/plugin-node-resolve": "16.0.1",
-        "@rollup/plugin-typescript": "12.3.0",
-        "@types/jest": "30.0.0",
-        "@types/jquery": "3.5.32",
+        "@rollup/plugin-typescript": "^12.1.4",
+        "@types/jest": "^30.0.0",
+        "@types/jquery": "^3.5.32",
         "@types/lodash-es": "4.17.12",
-        "@types/node": "24.2.0",
+        "@types/node": "^24.2.0",
         "@typescript-eslint/eslint-plugin": "8.39.0",
         "@typescript-eslint/parser": "8.39.0",
         "cheerio": "1.1.2",
-        "compression-webpack-plugin": "12.0.0",
+        "compression-webpack-plugin": "11.1.0",
         "core-js": "3.45.0",
-        "eslint": "8.45.0",
+        "eslint": "^8.45.0",
         "fs": "0.0.1-security",
         "fs-extra": "11.3.1",
-        "jest": "30.0.5",
-        "jest-canvas-mock": "2.5.2",
-        "jest-environment-jsdom": "30.0.5",
-        "jest-preset-angular": "15.0.0",
+        "jest": "^30.0.5",
+        "jest-canvas-mock": "^2.5.2",
+        "jest-environment-jsdom": "^30.0.5",
+        "jest-preset-angular": "^15.0.0",
         "license-checker": "25.0.1",
-        "moment-locales-webpack-plugin": "1.2.0",
-        "ng-packagr": "20.3.2",
-        "owasp-dependency-check": "1.0.1",
+        "moment-locales-webpack-plugin": "^1.2.0",
+        "ng-packagr": "17.3.0",
+        "owasp-dependency-check": "0.8.1",
         "rimraf": "6.0.1",
-        "rollup": "4.60.1",
+        "rollup": "4.46.2",
         "sonarqube-scanner": "3.5.0",
-        "terser": "5.43.1",
-        "typescript": "5.9.3",
+        "terser": "^5.43.1",
+        "typescript": "5.5.4",
         "util": "0.12.5",
-        "yargs": "18.0.0"
+        "yargs": "^18.0.0"
     },
     "optionalDependencies": {
         "@lmdb/lmdb-linux-x64": "3.4.2",
-        "@rollup/rollup-darwin-arm64": "4.60.1",
-        "@rollup/rollup-linux-x64-gnu": "4.60.1",
-        "@rollup/rollup-win32-x64": "4.60.1"
+        "@rollup/rollup-darwin-arm64": "4.46.2",
+        "@rollup/rollup-linux-x64-gnu": "4.46.2",
+        "@rollup/rollup-win32-x64": "4.9.5"
     },
     "engines": {
         "node": "22.18.0",
         "npm": "10.9.3"
     },
     "overrides": {
-        "ajv": "8.18.0",
-        "picomatch": "4.0.4",
-        "postcss": "8.5.13",
-        "uuid": "14.0.0",
-        "vite": "7.3.2"
+        "ng-packagr": {
+            "@rollup/wasm-node": "4.40.2"
+        }
     },
     "engineStrict": true
 }

package/src/framework/services/component-ref-provider.service.ts

@@ -1,70 +1,44 @@
-import { Injectable, Inject, Type } from '@angular/core';
+import { ComponentFactoryResolver, Injectable, Inject } from '@angular/core';
 
 import { ComponentRefProvider, ComponentType } from '@wm/runtime/base';
 import { LazyComponentRefProviderService } from './lazy-component-ref-provider.service';
 
-interface ComponentCacheEntry {
-    ref: Type<unknown>;
-    componentFactory?: any; // Legacy support for non-standalone components
-}
-
-const componentCache = new Map<ComponentType, Map<string, ComponentCacheEntry>>();
+const componentRefCache = new Map<ComponentType, Map<string, any>>();
 
-componentCache.set(ComponentType.PAGE, new Map<string, ComponentCacheEntry>());
-componentCache.set(ComponentType.PARTIAL, new Map<string, ComponentCacheEntry>());
-componentCache.set(ComponentType.PREFAB, new Map<string, ComponentCacheEntry>());
+componentRefCache.set(ComponentType.PAGE, new Map<string, any>());
+componentRefCache.set(ComponentType.PARTIAL, new Map<string, any>());
+componentRefCache.set(ComponentType.PREFAB, new Map<string, any>());
 
 @Injectable()
 export class ComponentRefProviderService extends ComponentRefProvider {
 
-    /**
-     * Register a component class for dynamic instantiation
-     * @param name - Component name identifier
-     * @param type - Component type (PAGE, PARTIAL, PREFAB)
-     * @param ref - Component class reference
-     * @param componentFactory - Optional legacy component factory (for backward compatibility)
-     */
-    static registerComponentRef(name: string, type: ComponentType, ref: Type<unknown>, componentFactory?: any): void {
-        componentCache.get(type).set(name, { ref, componentFactory });
+    static registerComponentRef(name: string, type: ComponentType, ref: any, componentFactory?: any) {
+        componentRefCache.get(type).set(name, {ref: ref, componentFactory: componentFactory});
     }
 
-    constructor(@Inject(LazyComponentRefProviderService) private lazyComponentLoader: LazyComponentRefProviderService) {
+    constructor(private componentFactoryResolver: ComponentFactoryResolver, @Inject(LazyComponentRefProviderService) private lazyComponentRef) {
         super();
     }
 
-    /**
-     * Get component class for dynamic instantiation
-     * Returns the component Type which can be used with ViewContainerRef.createComponent()
-     * 
-     * @param componentName - Name of the component to load
-     * @param componentType - Type of component (PAGE, PARTIAL, PREFAB)
-     * @param options - Additional options (e.g., prefab name for partial resolution)
-     * @returns Promise resolving to component Type or null if not found
-     */
-    public async getComponentFactoryRef(componentName: string, componentType: ComponentType, options?: Record<string, unknown>): Promise<Type<unknown> | null> {
-        const cachedEntry = componentCache.get(componentType)?.get(componentName);
-        
-        // Try lazy loading for PARTIAL and PREFAB types if not in cache
-        if (!cachedEntry && (componentType === ComponentType.PARTIAL || componentType === ComponentType.PREFAB)) {
-            const lazyComponent = await this.lazyComponentLoader.getComponentFactoryRef(
+    public async getComponentFactoryRef(componentName: string, componentType: ComponentType, options?: {}): Promise<any> {
+        const value = componentRefCache.get(componentType).get(componentName);
+        if (!value && (componentType === ComponentType.PARTIAL || componentType === ComponentType.PREFAB)) {
+            const partialRef = await this.lazyComponentRef.getComponentFactoryRef(
                 componentName,
                 componentType,
                 options
             );
-            if (lazyComponent) {
-                return lazyComponent;
+            if (partialRef) {
+                return Promise.resolve(partialRef);
             }
         }
-        
-        // Return null if component not found
-        if (!cachedEntry) {
-            console.warn(`Component not found: ${componentName} (type: ${componentType})`);
-            return null;
+        // Guard against undefined value
+        if (!value) {
+            return Promise.resolve(null);
+        }
+        if (!value.componentFactory) {
+            value.componentFactory = this.componentFactoryResolver.resolveComponentFactory(value.ref);
         }
-        
-        // Return component class (modern Angular 13+ approach for standalone components)
-        // For legacy components, the componentFactory would be used, but we return the ref
-        // as createComponent() handles both standalone and non-standalone components
-        return cachedEntry.ref;
+        return Promise.resolve(value.componentFactory);
     }
 }

package/src/framework/services/lazy-component-ref-provider.service.ts

@@ -1,57 +1,35 @@
-import { Injectable, Type } from '@angular/core';
+import { Injectable, ComponentFactoryResolver } from '@angular/core';
 import { PartialRefProvider } from '@wm/core';
 import { ComponentType } from '@wm/runtime/base';
 import { partialLazyModules, prefabLazyModules, prefabPartialLazyModules } from '../util/lazy-module-routes';
 
-interface LazyLoadOptions {
-    prefab?: string;
-}
-
-interface LazyModule {
-    loadComponent: () => Promise<Type<unknown>>;
-}
+type Options = {
+    prefab: string
+};
 
 @Injectable({
     providedIn: 'root'
 })
 export class LazyComponentRefProviderService extends PartialRefProvider {
-    constructor() {
+    constructor(
+        private componentFactoryResolver: ComponentFactoryResolver
+    ) {
         super();
     }
 
-    /**
-     * Resolve the appropriate lazy module based on component type and options
-     * @private
-     */
-    private getLazyModule(componentName: string, componentType: ComponentType, options?: LazyLoadOptions): LazyModule | undefined {
-        // Prefab-scoped partial (e.g., partial inside a prefab)
-        if (componentType === ComponentType.PARTIAL && options?.prefab) {
+    private getLazyModule(componentName: string, componentType: ComponentType, options?: Options) {
+        if (componentType === ComponentType.PARTIAL && options && options.prefab) {
             return prefabPartialLazyModules[`${options.prefab}_${componentName}`];
         }
-        
-        // Standard partial
         if (componentType === ComponentType.PARTIAL) {
             return partialLazyModules[componentName];
         }
-        
-        // Prefab
         if (componentType === ComponentType.PREFAB) {
             return prefabLazyModules[componentName];
         }
-        
-        return undefined;
     }
 
-    /**
-     * Lazy load and return a component class
-     * Returns the component Type which can be used with ViewContainerRef.createComponent()
-     * 
-     * @param componentName - Name of the component to lazy load
-     * @param componentType - Type of component (PARTIAL, PREFAB)
-     * @param options - Additional options (e.g., prefab name for partial resolution)
-     * @returns Promise resolving to component Type or null if loading fails
-     */
-    public async getComponentFactoryRef(componentName: string, componentType: ComponentType, options?: LazyLoadOptions): Promise<Type<unknown> | null> {
+    public async getComponentFactoryRef(componentName: string, componentType: ComponentType, options?: Options) {
         try {
             const lazyModule = this.getLazyModule(componentName, componentType, options);
 
@@ -60,19 +38,18 @@ export class LazyComponentRefProviderService extends PartialRefProvider {
                 return null;
             }
 
-            // Dynamically load the component class
-            const componentClass = await lazyModule.loadComponent();
+            // Load the component
+            const loadedComponent = await lazyModule.loadComponent();
 
-            if (!componentClass) {
-                console.error(`Failed to load component class: ${componentName}`);
+            if (!loadedComponent) {
+                console.error(`Failed to load component ${componentName}`);
                 return null;
             }
 
-            // Return the component class directly (Angular 13+ standalone component approach)
-            // This can be used directly with ViewContainerRef.createComponent()
-            return componentClass;
-        } catch (error) {
-            console.error(`Error lazy loading component ${componentName}:`, error);
+            // For standalone components, create a component factory
+            return this.componentFactoryResolver.resolveComponentFactory(loadedComponent);
+        } catch (e) {
+            console.error('Error in getComponentFactoryRef:', e);
             return null;
         }
     }

package/src/setup-jest.js

@@ -69,7 +69,7 @@ import "jquery-ui/ui/widgets/resizable.js";
 import "jquery-ui/ui/widgets/sortable.js";
 import "jquery-ui/ui/widgets/draggable.js";
 import "jquery-ui/ui/widgets/droppable.js";
-import "projects/jquery.ui.touch-punch/jquery.ui.touch-punch.min.js";
+import "libraries/scripts/jquery.ui.touch-punch/jquery.ui.touch-punch.min.js";
 import "moment-timezone/builds/moment-timezone.min.js";
 import "iscroll/build/iscroll.js";
 import "tabbable/dist/index.umd.min.js";

package/tsconfig.json

@@ -89,6 +89,6 @@
     "angularCompilerOptions": {
         "compilationMode": "full",
         "strictMetadataEmit": false,
-        "strictTemplates": false
+        "fullTemplateTypeCheck": false
     }
 }