@wavemaker/angular-codegen 11.13.0-rc.6255 → 11.14.0-rc.232

package/angular-app/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@wavemaker/angular-app",
-    "version": "11.13.0-rc.6255",
+    "version": "11.14.0-rc.232",
     "scripts": {
         "ng": "ng",
         "start": "./node_modules/.bin/ng serve",
@@ -30,109 +30,94 @@
         "@angular/platform-browser-dynamic": "18.2.13",
         "@angular/router": "18.2.13",
         "@angular/service-worker": "18.2.13",
-        "@babel/runtime": "7.14.8",
-        "@fullcalendar/core": "6.1.15",
-        "@fullcalendar/daygrid": "6.1.15",
-        "@fullcalendar/interaction": "6.1.15",
-        "@fullcalendar/list": "6.1.15",
-        "@fullcalendar/timegrid": "6.1.15",
+        "@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/custom-widgets-m3": "11.13.0-rc.6255",
+        "@wavemaker/custom-widgets-m3": "11.14.0-rc.232",
         "@wavemaker/focus-trap": "1.0.1",
-        "@wavemaker/foundation-css": "11.13.0-rc.6255",
+        "@wavemaker/foundation-css": "11.14.0-rc.232",
         "@wavemaker/nvd3": "1.8.13",
-        "@wavemaker/variables": "11.13.0-rc.6255",
+        "@wavemaker/variables": "11.14.0-rc.232",
         "@ztree/ztree_v3": "3.5.48",
-        "angular-imask": "^7.6.1",
-        "angular2-websocket": "0.9.7",
-        "core-js": "3.35.1",
+        "angular-imask": "7.6.1",
+        "angular2-websocket": "0.9.8",
         "d3": "7.8.5",
-        "esbuild-wasm": "^0.24.2",
         "iscroll": "5.2.0",
         "jquery": "3.7.1",
-        "jquery-ui": "1.13.3",
-        "js-cookie": "2.2.0",
-        "jssha": "3.1.2",
-        "lodash": "4.17.21",
+        "jquery-ui": "1.14.1",
+        "jssha": "3.3.1",
         "lodash-es": "4.17.21",
+        "moment": "2.30.1",
+        "moment-timezone": "^0.6.0",
         "ng-circle-progress": "1.7.1",
         "ngx-bootstrap": "9.0.0",
-        "ngx-color-picker": "16.0.0",
-        "ngx-toastr": "17.0.2",
-        "rxjs": "6.6.0",
-        "rxjs-compat": "6.4.0",
+        "ngx-color-picker": "20.1.1",
+        "ngx-toastr": "19.0.0",
+        "rxjs": "7.8.2",
         "summernote": "0.9.1",
-        "ts-jest": "29.1.1",
-        "tslib": "2.4.1",
+        "tslib": "2.8.1",
         "x2js": "3.4.4",
-        "zone.js": "0.14.10",
-        "@wavemaker/app-ng-runtime": "11.13.0-rc.6255"
+        "zone.js": "0.15.1",
+        "@wavemaker/app-ng-runtime": "11.14.0-rc.232"
     },
     "devDependencies": {
         "@ampproject/rollup-plugin-closure-compiler": "^0.27.0",
         "@angular-builders/custom-webpack": "18.0.0",
-        "@angular-devkit/build-angular": "18.2.12",
-        "@angular-eslint/builder": "16.2.0",
-        "@angular-eslint/eslint-plugin": "16.2.0",
-        "@angular-eslint/eslint-plugin-template": "16.2.0",
-        "@angular-eslint/schematics": "16.2.0",
-        "@angular-eslint/template-parser": "16.2.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": "18.2.12",
         "@angular/compiler-cli": "18.2.13",
         "@angular/language-service": "18.2.13",
-        "@babel/plugin-transform-runtime": "^7.14.5",
-        "@compodoc/compodoc": "^1.1.25",
-        "@rollup/plugin-alias": "4.0.2",
-        "@rollup/plugin-commonjs": "24.0.0",
-        "@rollup/plugin-multi-entry": "6.0.0",
-        "@rollup/plugin-node-resolve": "15.0.1",
-        "@rollup/plugin-typescript": "^8.3.3",
-        "@types/jest": "^29.5.12",
-        "@types/jquery": "3.3.22",
+        "@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.1.4",
+        "@types/jest": "^30.0.0",
+        "@types/jquery": "^3.5.32",
         "@types/lodash-es": "4.17.12",
-        "@types/node": "12.11.1",
-        "@types/sizzle": "^2.3.3",
-        "@typescript-eslint/eslint-plugin": "6.15.0",
-        "@typescript-eslint/parser": "6.15.0",
-        "acorn": "8.14.0",
-        "babel-loader": "^9.1.2",
-        "cheerio": "1.0.0-rc.12",
-        "codelyzer": "5.1.2",
-        "compression-webpack-plugin": "10.0.0",
-        "dependency-cruiser": "16.8.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": "11.1.0",
+        "core-js": "3.45.0",
         "eslint": "^8.45.0",
         "fs": "0.0.1-security",
-        "fs-extra": "7.0.1",
-        "jest": "^29.7.0",
+        "fs-extra": "11.3.1",
+        "jest": "^30.0.5",
         "jest-canvas-mock": "^2.5.2",
-        "jest-preset-angular": "^14.1.0",
+        "jest-environment-jsdom": "^30.0.5",
+        "jest-preset-angular": "^15.0.0",
         "license-checker": "25.0.1",
-        "moment": "2.29.4",
         "moment-locales-webpack-plugin": "^1.2.0",
-        "moment-timezone": "^0.5.34",
         "ng-packagr": "17.3.0",
-        "npm-run-all": "4.1.5",
-        "owasp-dependency-check": "0.7.0",
-        "rimraf": "2.6.3",
-        "rollup": "4.28.1",
-        "rollup-plugin-includepaths": "0.2.3",
+        "owasp-dependency-check": "0.8.1",
+        "rimraf": "6.0.1",
+        "rollup": "4.46.2",
         "sonarqube-scanner": "3.5.0",
-        "terser": "^5.15.1",
-        "ts-node": "7.0.1",
-        "tslint": "~6.1.0",
-        "typescript": "5.4.5",
-        "util": "0.11.1",
-        "yargs": "^17.3.1"
+        "terser": "^5.43.1",
+        "typescript": "5.5.4",
+        "util": "0.12.5",
+        "yargs": "^18.0.0"
     },
     "optionalDependencies": {
-        "@rollup/rollup-darwin-arm64": "4.9.5",
-        "@rollup/rollup-linux-x64-gnu": "4.9.5",
-        "@rollup/rollup-win32-x64": "4.9.5",
-        "@lmdb/lmdb-linux-x64": "3.0.13"
+        "@lmdb/lmdb-linux-x64": "3.4.2",
+        "@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.11.0",
-        "npm": "~10.9.0"
+        "node": "22.18.0",
+        "npm": "10.9.3"
     },
     "engineStrict": true
 }

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

@@ -1,16 +1,8 @@
-import {
-    Injectable,
-    NgModuleRef,
-    Type,
-    Injector,
-    Compiler,
-    NgModuleFactory,
-} 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';
 
-type ModuleWithRoot = Type<any> & { rootComponent: Type<any> };
 type Options = {
     prefab: string
 };
@@ -19,15 +11,15 @@ type Options = {
     providedIn: 'root'
 })
 export class LazyComponentRefProviderService extends PartialRefProvider {
-    private moduleRef: NgModuleRef<any>;
-    
-    constructor(private injector: Injector, private compiler: Compiler) {
+    constructor(
+        private componentFactoryResolver: ComponentFactoryResolver
+    ) {
         super();
     }
 
     private getLazyModule(componentName: string, componentType: ComponentType, options?: Options) {
         if (componentType === ComponentType.PARTIAL && options && options.prefab) {
-           return prefabPartialLazyModules[`${options.prefab}_${componentName}`];
+            return prefabPartialLazyModules[`${options.prefab}_${componentName}`];
         }
         if (componentType === ComponentType.PARTIAL) {
             return partialLazyModules[componentName];
@@ -37,27 +29,27 @@ export class LazyComponentRefProviderService extends PartialRefProvider {
         }
     }
 
-    private async getModuleFactory(moduleOrFactory: NgModuleFactory<any> | Type<any>): Promise<NgModuleFactory<any>> {
-        if (moduleOrFactory instanceof NgModuleFactory) {
-            return moduleOrFactory;
-        } else {
-            return this.compiler.compileModuleAsync(moduleOrFactory);
-        }
-    }
-
     public async getComponentFactoryRef(componentName: string, componentType: ComponentType, options?: Options) {
         try {
-            const moduleOrFactory = await this.getLazyModule(componentName, componentType, options).loadChildren();
-            const moduleFactory = await this.getModuleFactory(moduleOrFactory);
+            const lazyModule = this.getLazyModule(componentName, componentType, options);
+
+            if (!lazyModule) {
+                console.error(`No lazy module found for ${componentName}`);
+                return null;
+            }
+
+            // Load the component
+            const loadedComponent = await lazyModule.loadComponent();
+
+            if (!loadedComponent) {
+                console.error(`Failed to load component ${componentName}`);
+                return null;
+            }
 
-            this.moduleRef = moduleFactory.create(this.injector);
-            const rootComponent = (moduleFactory.moduleType as ModuleWithRoot)
-                .rootComponent;
-            return this.moduleRef.componentFactoryResolver.resolveComponentFactory(
-                rootComponent
-            );
+            // For standalone components, create a component factory
+            return this.componentFactoryResolver.resolveComponentFactory(loadedComponent);
         } catch (e) {
-            console.error(e);
+            console.error('Error in getComponentFactoryRef:', e);
             return null;
         }
     }

package/angular-app/src/setup-jest.js

@@ -1,3 +1,4 @@
+
 // This file is automatically loaded when running `jest` commands
 import { setupZoneTestEnv } from 'jest-preset-angular/setup-env/zone';
 import { ToastrModule } from 'ngx-toastr';
@@ -70,7 +71,6 @@ import "jquery-ui/ui/widgets/draggable.js";
 import "jquery-ui/ui/widgets/droppable.js";
 import "libraries/scripts/jquery.ui.touch-punch/jquery.ui.touch-punch.min.js";
 import "moment-timezone/builds/moment-timezone.min.js";
-import "hammerjs/hammer.min.js";
 import "iscroll/build/iscroll.js";
 import "tabbable/dist/index.umd.min.js";
 import "@wavemaker/focus-trap/dist/focus-trap.umd.min.js";
@@ -84,16 +84,11 @@ beforeEach(() => {
       ToastrModule.forRoot(),
     ],
   })
-  Object.defineProperties(window, {
-    location: {
-      writable: true,
-      value: {
-        reload: jest.fn(),
-      },
-    },
-  });
 });
 
+// Mock window.location for tests
+// We'll use a simpler approach that doesn't try to redefine read-only properties
+// The tests will handle their own window.location mocking as needed
 // jest.setup.js
 Object.defineProperty(global.HTMLMediaElement.prototype, 'load', {
     configurable: true,
@@ -122,3 +117,5 @@ Object.defineProperty(global.HTMLMediaElement.prototype, 'addTextTrack', {
     writable: true,
     value: jest.fn(),
 });
+
+

package/angular-app/tsconfig.json

@@ -7,7 +7,7 @@
         "sourceMap": true,
         "declaration": false,
         "target": "es2022",
-        "module": "es2020",
+        "module": "es2022",
         "moduleResolution": "node",
         "esModuleInterop": true,
         "emitDecoratorMetadata": true,
@@ -16,7 +16,7 @@
             "node_modules/@types"
         ],
         "lib": [
-            "es2018",
+            "es2022",
             "dom"
         ],
         "paths": {
@@ -44,11 +44,11 @@
             "@wm/components/base": [
                 "node_modules/@wavemaker/app-ng-runtime/components/base"
             ],
-            "@wm/components/basic": [
-                "node_modules/@wavemaker/app-ng-runtime/components/basic/default"
+            "@wm/components/basic/*": [
+                "node_modules/@wavemaker/app-ng-runtime/components/basic/*"
             ],
-            "@wm/components/input": [
-                "node_modules/@wavemaker/app-ng-runtime/components/input/default"
+            "@wm/components/input/*": [
+                "node_modules/@wavemaker/app-ng-runtime/components/input/*"
             ],
             "@wm/components/page": [
                 "node_modules/@wavemaker/app-ng-runtime/components/page/default"

package/angular-app/tsconfig.web-app.json

@@ -34,8 +34,8 @@
             "@wm/core": [
                 "node_modules/@wavemaker/app-ng-runtime/core"
             ],
-            "@wm/components/basic": [
-                "node_modules/@wavemaker/app-ng-runtime/components/basic/default"
+            "@wm/components/basic/*": [
+                "node_modules/@wavemaker/app-ng-runtime/components/basic/*"
             ],
             "@wm/components/input": [
                 "node_modules/@wavemaker/app-ng-runtime/components/input/default"

package/angular-app/wm-custom-webpack.config.js

@@ -1,7 +1,5 @@
 const CompressionPlugin = require(`compression-webpack-plugin`);
 const path = require(`path`);
-const {ConcatSource} = require("webpack-sources");
-
 const MomentLocalesPlugin = require('moment-locales-webpack-plugin');
 
 const wmPropertiesPath = path.join(__dirname, '/src/app/wmProperties.js');
@@ -12,65 +10,7 @@ const localesToKeep = Object.values(WMAppProperties.supportedLanguages)
   .map(lang => lang.moment)
   .filter(locale => locale !== null);
 
-  const includeMomentPlugin = WMAppProperties.languageBundleSources === "STATIC";
-
-class ModifyCssAssetUrlsPlugin {
-    apply(compiler) {
-        compiler.hooks.compilation.tap('ModifyCssAssetUrlsPlugin', compilation => {
-            compilation.hooks.optimizeAssets.tapAsync('ModifyCssAssetUrlsPlugin', (assets, callback) => {
-                let publicPath = compilation.options.output.publicPath;
-                let isResourceWithDeployUrl = false;
-                for (const assetName in assets) {
-                    if (!assets.hasOwnProperty(assetName)) continue;
-
-                    const asset = assets[assetName];
-                    if (asset.sourceAndMap) {
-                        const sourceAndMap = asset.sourceAndMap();
-                        let updatedSource = sourceAndMap.source;
-                        // Handle potential non-string source (e.g., convert to string)
-                        if (typeof updatedSource !== 'string') {
-                            updatedSource = updatedSource.toString('utf-8');
-                        }
-                        let modifiedSource = updatedSource.replace(/url\((.*?)\)/g, (match, url) => {
-                            isResourceWithDeployUrl = true;
-
-                            let qUrl = url.slice(1, -1);
-
-                            if (!qUrl.startsWith(publicPath)) {
-                                return match;
-                            } else {
-                                const newUrl = this.modifyUrl(publicPath, qUrl);
-                                let urlString = `url('${newUrl}')`;
-                                return urlString;
-                            }
-
-                        });
-                        if (isResourceWithDeployUrl) {
-                            isResourceWithDeployUrl = false;
-                            assets[assetName] = new ConcatSource(modifiedSource);
-                        }
-                    }
-                }
-                callback(null, assets);
-            });
-        });
-    }
-
-    modifyUrl(publicPath, url) {
-        let qUrl = url;
-        let resourceName = qUrl;
-        try {
-            const parsedUrl = new URL(qUrl);
-            resourceName = parsedUrl.pathname.split('/').pop();
-        } catch (e) {
-            //this is relative url
-            let parts = qUrl.split('/');
-            resourceName = parts[parts.length - 1];
-        }
-        let newUrl = `ng-bundle/${resourceName}`;
-        return newUrl;
-    }
-};
+const includeMomentPlugin = WMAppProperties.languageBundleSources === "STATIC";
 
 module.exports = {
     resolve:{
@@ -79,7 +19,6 @@ module.exports = {
         }
     },
     plugins:[
-        new ModifyCssAssetUrlsPlugin(),
         new CompressionPlugin({
             test: /\.(js|css|html|svg|txt|eot|otf|ttf|gif)$/,
             filename: "[name].gzip[ext]",
@@ -91,7 +30,7 @@ module.exports = {
             algorithm: "brotliCompress"
         }),
         // On STATIC WMAppProperties.languageBundleSources, required moment locales are included in the bundle
-        
+
         /**
          * MomentLocalesPlugin is used to include only the required moment locales in the bundle.
          */

package/build-angular-app.js

@@ -363,6 +363,8 @@ const generateAngularApp = async (sourceDir, ngBuildParams, codegenPath, appTarg
                 deployUrl = buildArgs["deploy-url"];
             }
         }
+        const { generateOverrideCSS } = require(codegenPath + 'src/gen-app-override-css.js');
+        await generateOverrideCSS(global.buildConfigObj, sourceDir, baseDir);
         const { generateCodegenAngularApp } = require(CODEGEN_PATH);
         console.log(MSG_CODEGEN_LOG + 'Generating the angular App...');
         let apiUrl = global.buildConfigObj.apiUrl && global.buildConfigObj.apiUrl.trim() !== "" ? global.buildConfigObj.apiUrl.trim() : "./";
@@ -468,7 +470,7 @@ const initBuild = async (buildConfigObj) => {
     if (buildConfigObj.generate_page) {
         // To generate the angular app specific page
         await generateAngularAppPage(sourceDir, appTarget, buildConfigObj.generate_page, CODEGEN_INSTALLATION);
-    } else if (buildConfigObj.generateAngularApp) {
+    } else if (buildConfigObj.generateApp) {
         // TO generate the angular app
         console.log('Angular app generation mode');
         await generateAngularApp(sourceDir, getNgBuildParams(), CODEGEN_INSTALLATION, appTarget, baseDir);