@wavemaker/app-ng-runtime 11.14.1-rc.6310 → 11.14.2-rc.6311

package/runtime/base/fesm2022/index.mjs

@@ -5,7 +5,7 @@ import { ActivatedRoute, Router, RouterOutlet, NavigationStart, NavigationEnd, N
 import * as i5 from '@angular/common';
 import { DOCUMENT, ɵgetDOM as _getDOM, CommonModule, AsyncPipe, SlicePipe, PercentPipe, I18nPluralPipe, NgLocalization, I18nSelectPipe, KeyValuePipe, UpperCasePipe, LowerCasePipe, JsonPipe, DecimalPipe, TitleCasePipe, CurrencyPipe, DatePipe } from '@angular/common';
 import * as i1 from '@wm/core';
-import { $appDigest, isDefined, getWmProjectProperties, triggerFn, fetchContent, _WM_APP_PROJECT, stringStartsWith, loadStyleSheets, loadScripts, noop as noop$1, App, AbstractI18nService, ScriptLoaderService, Viewport, UtilsService, $invokeWatchers, registerFnByExpr, LRUCache, muteWatchers, AbstractNavigationService, isIos, isAndroid, unMuteWatchers, $watch, isIE, CustomPipeManager, getSessionStorageItem, setPipeProvider, DynamicComponentRefProvider, FieldWidgetService, FieldTypeService, ConstantService, AbstractToasterService, StatePersistence, AbstractSpinnerService, AbstractDialogService, EventNotifier, setCSS, setSessionStorageItem, replace, setNgZone, setAppRef, addClass, removeClass, extendProto, $parseExpr, AppDefaults, isObject as isObject$1, isIphone, isIpod, isIpad } from '@wm/core';
+import { $appDigest, isDefined, getWmProjectProperties, triggerFn, fetchContent, _WM_APP_PROJECT, stringStartsWith, loadStyleSheets, loadScripts, noop as noop$1, App, AbstractI18nService, ScriptLoaderService, Viewport, UtilsService, $invokeWatchers, registerFnByExpr, $unwatchAllByScope, LRUCache, muteWatchers, AbstractNavigationService, isIos, isAndroid, unMuteWatchers, $watch, isIE, CustomPipeManager, getSessionStorageItem, setPipeProvider, DynamicComponentRefProvider, FieldWidgetService, FieldTypeService, ConstantService, AbstractToasterService, StatePersistence, AbstractSpinnerService, AbstractDialogService, EventNotifier, setCSS, setSessionStorageItem, replace, setNgZone, setAppRef, addClass, removeClass, extendProto, $parseExpr, AppDefaults, isObject as isObject$1, isIphone, isIpod, isIpad } from '@wm/core';
 import * as i2 from '@wm/security';
 import { SecurityService } from '@wm/security';
 import * as i4 from '@wm/variables';
@@ -163,10 +163,13 @@ class AppManagerService {
         this.appVariablesLoaded = false;
         this.appVariablesFired = false;
         this._noRedirect = false;
+        this.appSubscriptions = []; // MEMORY LEAK FIX: Track subscriptions
         // register method to invoke on session timeout
-        this.$http.registerOnSessionTimeout(this.handle401.bind(this));
+        // MEMORY LEAK FIX: Store unsubscribe function for cleanup
+        this.sessionTimeoutUnsubscribe = this.$http.registerOnSessionTimeout(this.handle401.bind(this));
         this.$variables.registerDependency('appManager', this);
-        this.$app.subscribe('toggle-variable-state', (data) => {
+        // MEMORY LEAK FIX: Store subscription unsubscribe functions
+        this.appSubscriptions.push(this.$app.subscribe('toggle-variable-state', (data) => {
             const variable = data.variable, active = data.active;
             if (!isEmpty(trim(variable.spinnerContext))) {
                 if (active) {
@@ -191,8 +194,8 @@ class AppManagerService {
                     this.$spinner.hide(variable._spinnerId.shift());
                 }
             }
-        });
-        this.$app.subscribe('userLoggedIn', () => {
+        }));
+        this.appSubscriptions.push(this.$app.subscribe('userLoggedIn', () => {
             this.setLandingPage();
             if (this.lastLoggedUserId) {
                 this.$security.getConfig(config => {
@@ -201,11 +204,11 @@ class AppManagerService {
                     }
                 }, null);
             }
-        });
-        this.$app.subscribe('userLoggedOut', () => this.setLandingPage().then(() => {
-            this.$app.clearPageCache();
         }));
-        this.$app.subscribe('http401', (d = {}) => this.handle401(d.page, d.options));
+        this.appSubscriptions.push(this.$app.subscribe('userLoggedOut', () => this.setLandingPage().then(() => {
+            this.$app.clearPageCache();
+        })));
+        this.appSubscriptions.push(this.$app.subscribe('http401', (d = {}) => this.handle401(d.page, d.options)));
     }
     /**
      * On session timeout, if the session timeout config is set to a dialog, then open login dialog
@@ -445,8 +448,9 @@ class AppManagerService {
     reloadAppData() {
         return this.loadSecurityConfig(true).then(() => {
             return this.loadMetadata().then(() => {
-                return this.updateLoggedInUserVariable().then(() => {
-                    return this.beforeAppReady();
+                return this.updateLoggedInUserVariable().then((config) => {
+                    return Promise.resolve(this.beforeAppReady())
+                        .then(() => Promise.resolve(config));
                 });
             });
         });
@@ -604,12 +608,36 @@ class AppManagerService {
         // Apply restored modes
         this.$app.setMode(storedModes);
         // Listener for postMessage-based mode changes
-        window.addEventListener('message', (event) => {
+        // MEMORY LEAK FIX: Store bound function reference for cleanup
+        this.windowMessageListener = (event) => {
             const { key, modes, shouldPersist } = event.data || {};
             if (key === 'switch-mode' && modes) {
                 this.$app.setMode(modes, !shouldPersist);
             }
+        };
+        window.addEventListener('message', this.windowMessageListener);
+    }
+    ngOnDestroy() {
+        // MEMORY LEAK FIX: Unsubscribe from all app subscriptions
+        this.appSubscriptions.forEach(unsubscribe => {
+            if (unsubscribe) {
+                unsubscribe();
+            }
         });
+        this.appSubscriptions = [];
+        // MEMORY LEAK FIX: Unsubscribe from session timeout
+        if (this.sessionTimeoutUnsubscribe) {
+            this.sessionTimeoutUnsubscribe();
+            this.sessionTimeoutUnsubscribe = null;
+        }
+        // MEMORY LEAK FIX: Remove window message listener
+        if (this.windowMessageListener) {
+            window.removeEventListener('message', this.windowMessageListener);
+            this.windowMessageListener = null;
+        }
+        // MEMORY LEAK FIX: Clear references
+        this.templates = null;
+        this.lastLoggedUserId = null;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppManagerService, deps: [{ token: i1.AbstractHttpService }, { token: i2.SecurityService }, { token: i1.AbstractDialogService }, { token: i1$1.Router }, { token: i1.App }, { token: i4.VariablesService }, { token: i4.MetadataService }, { token: i1.AbstractSpinnerService }, { token: i1.AbstractI18nService }, { token: i5.DatePipe }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppManagerService }); }
@@ -735,11 +763,32 @@ class FragmentMonitor {
     }
     init() {
         // console.log(`inside fragmentMonitor: Page-${(this as any).pageName}, Partial-${(this as any).partialName}`);
-        this.viewInit$.subscribe(noop$1, noop$1, () => {
+        // MEMORY LEAK FIX: Store subscription reference for cleanup
+        this.viewInitSubscription = this.viewInit$.subscribe(noop$1, noop$1, () => {
             this.isViewInitialized = true;
             this.isReady();
         });
     }
+    /**
+     * MEMORY LEAK FIX: Clean up FragmentMonitor resources
+     * Should be called from implementing class's ngOnDestroy
+     */
+    cleanupFragmentMonitor() {
+        // MEMORY LEAK FIX: Unsubscribe from viewInit$ subscription
+        if (this.viewInitSubscription) {
+            this.viewInitSubscription.unsubscribe();
+            this.viewInitSubscription = null;
+        }
+        // MEMORY LEAK FIX: Complete Subjects to release subscriptions (if not already completed)
+        if (this.viewInit$ && !this.viewInit$.closed) {
+            this.viewInit$.complete();
+        }
+        this.viewInit$ = null;
+        if (this.fragmentsLoaded$ && !this.fragmentsLoaded$.closed) {
+            this.fragmentsLoaded$.complete();
+        }
+        this.fragmentsLoaded$ = null;
+    }
     registerFragment() {
         this.fragments++;
     }
@@ -923,7 +972,41 @@ class BasePartialComponent extends FragmentMonitor {
         });
     }
     ngOnDestroy() {
-        this.destroy$.complete();
+        // MEMORY LEAK FIX: Unwatch all Partial-scoped watchers for THIS specific partial when partial is destroyed
+        // Only unwatch watchers for this partial, not all partials (other partials may still be on the page)
+        if (this.partialName) {
+            $unwatchAllByScope('Partial', this.partialName);
+        }
+        // MEMORY LEAK FIX: Complete Subjects to release subscriptions
+        if (this.destroy$) {
+            this.destroy$.complete();
+            this.destroy$ = null;
+        }
+        if (this.viewInit$) {
+            this.viewInit$.complete();
+            this.viewInit$ = null;
+        }
+        // MEMORY LEAK FIX: Clear references to prevent memory leaks
+        this.Widgets = null;
+        this.Variables = null;
+        this.Actions = null;
+        this.App = null;
+        this.containerWidget = null;
+        this.i18nService = null;
+        this.appLocale = null;
+        this.partialDirective = null;
+        this.pageDirective = null;
+        this.Prefab = null;
+        this.scriptLoaderService = null;
+        this.Viewport = null;
+        this.route = null;
+        this.appManager = null;
+        this.navigationService = null;
+        this.router = null;
+        this.pageParams = null;
+        this.viewParent = null;
+        // MEMORY LEAK FIX: Cleanup FragmentMonitor resources
+        this.cleanupFragmentMonitor();
     }
     ngOnAttach(refreshData) {
         this.unmute();
@@ -1368,9 +1451,42 @@ class BasePageComponent extends FragmentMonitor {
         });
     }
     ngOnDestroy() {
+        // MEMORY LEAK FIX: Unwatch all Page-scoped watchers for THIS specific page when page is destroyed
+        if (this.pageName) {
+            const removedCount = $unwatchAllByScope('Page', this.pageName);
+            if (removedCount > 0) {
+                console.log(`🧹 Cleaned up ${removedCount} Page-scoped watcher(s) for page ${this.pageName}`);
+            }
+        }
         //this.captureApplicationThumbnail();
         this.savePageSnapShot();
-        this.destroy$.complete();
+        // MEMORY LEAK FIX: Complete Subjects to release subscriptions
+        if (this.destroy$) {
+            this.destroy$.complete();
+            this.destroy$ = null;
+        }
+        if (this.viewInit$) {
+            this.viewInit$.complete();
+            this.viewInit$ = null;
+        }
+        // MEMORY LEAK FIX: Clear references to prevent memory leaks
+        this.Widgets = null;
+        this.Variables = null;
+        this.Actions = null;
+        this.App = null;
+        this.route = null;
+        this.appManager = null;
+        this.navigationService = null;
+        this.router = null;
+        this.pageParams = null;
+        this.i18nService = null;
+        this.appLocale = null;
+        this.pageDirective = null;
+        this.$page = null;
+        this.scriptLoaderService = null;
+        this.Viewport = null;
+        // MEMORY LEAK FIX: Cleanup FragmentMonitor resources
+        this.cleanupFragmentMonitor();
     }
     captureApplicationThumbnail() {
         const root = this;
@@ -1735,7 +1851,38 @@ class BaseCustomWidgetComponent extends FragmentMonitor {
         }, 100);
     }
     ngOnDestroy() {
-        this.destroy$.complete();
+        // MEMORY LEAK FIX: Complete Subjects to release subscriptions
+        if (this.destroy$) {
+            this.destroy$.complete();
+            this.destroy$ = null;
+        }
+        if (this.viewInit$) {
+            this.viewInit$.complete();
+            this.viewInit$ = null;
+        }
+        // MEMORY LEAK FIX: Clear references to prevent memory leaks
+        this.Widgets = null;
+        this.BaseWidget = null;
+        this.Variables = null;
+        this.Actions = null;
+        this.App = null;
+        this.containerWidget = null;
+        this.i18nService = null;
+        this.appLocale = null;
+        this.pageDirective = null;
+        this.Prefab = null;
+        this.scriptLoaderService = null;
+        this.customwidgetConfigProvider = null;
+        this.Viewport = null;
+        this.route = null;
+        this.appManager = null;
+        this.navigationService = null;
+        this.router = null;
+        this.props = null;
+        this.events = null;
+        this.viewParent = null;
+        // MEMORY LEAK FIX: Cleanup FragmentMonitor resources
+        this.cleanupFragmentMonitor();
     }
     ngOnAttach(refreshData) {
         this.unmute();
@@ -1962,7 +2109,36 @@ class BasePrefabComponent extends FragmentMonitor {
         });
     }
     ngOnDestroy() {
-        this.destroy$.complete();
+        // MEMORY LEAK FIX: Unwatch all Prefab-scoped watchers for THIS specific prefab when prefab is destroyed
+        // Only unwatch watchers for this prefab, not all prefabs (other prefabs may still be on the page)
+        if (this.prefabName) {
+            $unwatchAllByScope('Prefab', this.prefabName);
+        }
+        // MEMORY LEAK FIX: Complete Subjects to release subscriptions
+        if (this.destroy$) {
+            this.destroy$.complete();
+            this.destroy$ = null;
+        }
+        if (this.viewInit$) {
+            this.viewInit$.complete();
+            this.viewInit$ = null;
+        }
+        // MEMORY LEAK FIX: Clear references to prevent memory leaks
+        this.Widgets = null;
+        this.Variables = null;
+        this.Actions = null;
+        this.App = null;
+        this.containerWidget = null;
+        this.prefabMngr = null;
+        this.i18nService = null;
+        this.appLocale = null;
+        this.prefabContainerDirective = null;
+        this.scriptLoaderService = null;
+        this.pageDirective = null;
+        this.Viewport = null;
+        this.viewParent = null;
+        // MEMORY LEAK FIX: Cleanup FragmentMonitor resources
+        this.cleanupFragmentMonitor();
     }
     // user overrides this
     onPropertyChange() { }
@@ -2016,6 +2192,12 @@ class BaseLayoutComponent {
     }
     //TODO: To work cache properly need to implement the below methods and WmRouteReuseStrategy
     ngOnDestroy() {
+        // MEMORY LEAK FIX: Clear references to prevent memory leaks
+        this.App = null;
+        this.routerOutlet = null;
+        this.pageDirective = null;
+        this.layoutPages = null;
+        this.layoutName = null;
     }
     canReuse() {
     }
@@ -2718,8 +2900,42 @@ class BaseSpaPageComponent extends FragmentMonitor {
         });
     }
     ngOnDestroy() {
+        // MEMORY LEAK FIX: Unwatch all Page-scoped watchers for THIS specific page when page is destroyed
+        if (this.pageName) {
+            $unwatchAllByScope('Page', this.pageName);
+            // if (removedCount > 0) {
+            //     console.log(`🧹 Cleaned up ${removedCount} Page-scoped watcher(s) for page ${this.pageName}`);
+            // }
+        }
         this.savePageSnapShot();
-        this.destroy$.complete();
+        // MEMORY LEAK FIX: Complete Subjects to release subscriptions
+        if (this.destroy$) {
+            this.destroy$.complete();
+            this.destroy$ = null;
+        }
+        if (this.viewInit$) {
+            this.viewInit$.complete();
+            this.viewInit$ = null;
+        }
+        // MEMORY LEAK FIX: Clear references to prevent memory leaks
+        this.Widgets = null;
+        this.Variables = null;
+        this.Actions = null;
+        this.App = null;
+        this.route = null;
+        this.appManager = null;
+        this.navigationService = null;
+        this.router = null;
+        this.pageParams = null;
+        this.i18nService = null;
+        this.appLocale = null;
+        this.layoutDirective = null;
+        this.spaPageDirective = null;
+        this.$page = null;
+        this.scriptLoaderService = null;
+        this.Viewport = null;
+        // MEMORY LEAK FIX: Cleanup FragmentMonitor resources
+        this.cleanupFragmentMonitor();
     }
     onReady() { }
     onBeforePageReady() { }
@@ -2805,7 +3021,7 @@ class AccessrolesDirective {
         this.securityService = securityService;
         this.inj = inj;
         this.processed = false;
-        this.context = {};
+        this.context = {}; // Changed from readonly to allow cleanup
         const securityConfig = this.securityService.get();
         this.securityEnabled = get(securityConfig, 'securityEnabled');
         this.isUserAuthenticated = get(securityConfig, 'authenticated');
@@ -2878,6 +3094,15 @@ class AccessrolesDirective {
             this.viewContainerRef.clear();
         }
     }
+    ngOnDestroy() {
+        // MEMORY LEAK FIX: Clear context to release references to parent scope data
+        if (this.context) {
+            Object.keys(this.context).forEach(key => {
+                delete this.context[key];
+            });
+            this.context = null;
+        }
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AccessrolesDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }, { token: i2.SecurityService }, { token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: AccessrolesDirective, isStandalone: true, selector: "[accessroles]", inputs: { accessroles: "accessroles" }, ngImport: i0 }); }
 }
@@ -3107,7 +3332,10 @@ class PipeProvider {
             this.preparePipeMeta(CurrencyPipe, 'currency', true, [this._locale]),
             this.preparePipeMeta(DatePipe, 'date', true, [this._locale]),
             this.preparePipeMeta(ToDatePipe, 'toDate', true, [
-                new DatePipe(this._locale), undefined, this.injector.get(CustomPipeManager)
+                new DatePipe(this._locale),
+                undefined,
+                this.injector.get(App),
+                this.injector.get(CustomPipeManager)
             ]),
             this.preparePipeMeta(ToNumberPipe, 'toNumber', true, [
                 new DecimalPipe(this._locale),
@@ -3124,7 +3352,7 @@ class PipeProvider {
                 new DecimalPipe(this._locale)
             ]),
             this.preparePipeMeta(StringToNumberPipe, 'stringToNumber', true),
-            this.preparePipeMeta(CustomPipe, 'custom', true, [this.injector.get(CustomPipeManager)]),
+            this.preparePipeMeta(CustomPipe, 'custom', true, [this.injector.get(App), this.injector.get(CustomPipeManager)]),
             this.preparePipeMeta(TrustAsPipe, 'trustAs', true, [this.domSanitizer]),
             this.preparePipeMeta(SanitizePipe, 'sanitize', true, [this.domSanitizer]),
             this.preparePipeMeta(TemplateReplacePipe, 'templateReplace', true),
@@ -3287,7 +3515,8 @@ class AppRef {
         this.isTemplateBundleType = wmProjectProperties.type === "TEMPLATEBUNDLE" /* PROJECT_TYPE.TEMPLATE_BUNDLE */;
         this.targetPlatform = wmProjectProperties.platformType;
         this.isPrism = wmProjectProperties.template === "PRISM";
-        this.httpService.registerOnSessionTimeout(this.on401.bind(this));
+        // MEMORY LEAK FIX: Store unsubscribe function for cleanup
+        this.sessionTimeoutUnsubscribe = this.httpService.registerOnSessionTimeout(this.on401.bind(this));
         this.appLocale = this.i18nService.getAppLocale();
         this.httpService.setLocale(this.appLocale);
     }
@@ -3374,6 +3603,19 @@ class AppRef {
             registerFnByExpr(expr, fn[0], fn[1]);
         });
     }
+    /**
+     * Utility method to check if an object has a property
+     * This is commonly used in expressions to check object properties
+     * @param obj The object to check
+     * @param prop The property name to check
+     * @returns true if the object has the property, false otherwise
+     */
+    hasOwnObjectProperty(obj, prop) {
+        if (!obj || typeof obj !== 'object') {
+            return false;
+        }
+        return Object.prototype.hasOwnProperty.call(obj, prop);
+    }
     setMode(modes, shouldPersist = false) {
         const htmlEl = document.getElementsByTagName('html')[0];
         //html element sanity check
@@ -3402,6 +3644,24 @@ class AppRef {
             localStorage.setItem('wm-app-modes', JSON.stringify(modes));
     }
     ;
+    ngOnDestroy() {
+        // MEMORY LEAK FIX: Destroy EventNotifier to release subscribers
+        if (this._eventNotifier) {
+            this._eventNotifier.destroy();
+            this._eventNotifier = null;
+        }
+        // MEMORY LEAK FIX: Unsubscribe from session timeout
+        if (this.sessionTimeoutUnsubscribe) {
+            this.sessionTimeoutUnsubscribe();
+            this.sessionTimeoutUnsubscribe = null;
+        }
+        // MEMORY LEAK FIX: Clear references
+        this.Variables = null;
+        this.Actions = null;
+        this.appLocale = null;
+        this.modes = null;
+        this.dynamicComponentContainerRef = null;
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppRef, deps: [{ token: i0.Injector }, { token: i1.AbstractI18nService }, { token: i1.StatePersistence }, { token: i1.AbstractHttpService }, { token: i2.SecurityService }, { token: i1$1.RouteReuseStrategy }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppRef }); }
 }
@@ -3904,6 +4164,20 @@ class SpinnerServiceImpl extends AbstractSpinnerService {
             this.messagesByContext[ctx] = {};
         }
     }
+    ngOnDestroy() {
+        // MEMORY LEAK FIX: Complete Subject to release subscriptions
+        if (this.messageSource) {
+            this.messageSource.complete();
+            this.messageSource = null;
+        }
+        // MEMORY LEAK FIX: Clear messages by context
+        if (this.messagesByContext) {
+            Object.keys(this.messagesByContext).forEach(key => {
+                delete this.messagesByContext[key];
+            });
+            this.messagesByContext = null;
+        }
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpinnerServiceImpl, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpinnerServiceImpl }); }
 }
@@ -4419,6 +4693,7 @@ class AppComponent {
         this.isApplicationType = false;
         this.enableSkipToMainContent = getWmProjectProperties().enableSkipToMainContent === 'true' || getWmProjectProperties().enableSkipToMainContent === true;
         this.retryCount = 0;
+        this.appManagerSubscriptions = []; // MEMORY LEAK FIX: Track appManager subscriptions
         this.appLocale = {};
         this.spinner = { show: false, messages: [], arialabel: '' };
         this.isOAuthDialogOpen = false;
@@ -4431,7 +4706,8 @@ class AppComponent {
             this.customIconsLoaderService.load();
         }
         // subscribe to OAuth changes
-        oAuthService.getOAuthProvidersAsObservable().subscribe((providers) => {
+        // MEMORY LEAK FIX: Store subscription reference for cleanup
+        this.oAuthProvidersSubscription = oAuthService.getOAuthProvidersAsObservable().subscribe((providers) => {
             this.providersConfig = providers;
             if (providers.length) {
                 this.showOAuthDialog();
@@ -4441,7 +4717,8 @@ class AppComponent {
             }
         });
         // Subscribe to the message source to show/hide app spinner
-        this.spinnerService.getMessageSource().asObservable().subscribe((data) => {
+        // MEMORY LEAK FIX: Store subscription reference for cleanup
+        this.spinnerMessageSubscription = this.spinnerService.getMessageSource().asObservable().subscribe((data) => {
             // setTimeout is to avoid 'ExpressionChangedAfterItHasBeenCheckedError'
             setTimeout(() => {
                 this.spinner.show = data.show;
@@ -4453,7 +4730,8 @@ class AppComponent {
         setTheme('bs3');
         let spinnerId;
         let onPageRendered = noop$1;
-        this.router.events.subscribe(e => {
+        // MEMORY LEAK FIX: Store subscription reference for cleanup
+        this.routerEventsSubscription = this.router.events.subscribe(e => {
             if (e instanceof NavigationStart) {
                 let page = e.url.split('?')[0];
                 page = page.substring(1);
@@ -4488,12 +4766,13 @@ class AppComponent {
                 }, 1000);
             }
         });
-        this.appManager.subscribe('pageReady', () => {
+        // MEMORY LEAK FIX: Store subscription unsubscribe functions
+        this.appManagerSubscriptions.push(this.appManager.subscribe('pageReady', () => {
             onPageRendered();
-        });
-        this.appManager.subscribe('pageAttach', () => {
+        }));
+        this.appManagerSubscriptions.push(this.appManager.subscribe('pageAttach', () => {
             onPageRendered();
-        });
+        }));
     }
     showOAuthDialog() {
         if (!this.isOAuthDialogOpen) {
@@ -4568,9 +4847,35 @@ class AppComponent {
         $invokeWatchers();
     }
     ngOnDestroy() {
+        // MEMORY LEAK FIX: Unwatch all App-scoped watchers when app is destroyed
+        $unwatchAllByScope('App');
+        // MEMORY LEAK FIX: Unsubscribe from navigation end subscription
         if (this.navigationEndSubscription) {
             this.navigationEndSubscription.unsubscribe();
-        }
+            this.navigationEndSubscription = null;
+        }
+        // MEMORY LEAK FIX: Unsubscribe from OAuth providers subscription
+        if (this.oAuthProvidersSubscription) {
+            this.oAuthProvidersSubscription.unsubscribe();
+            this.oAuthProvidersSubscription = null;
+        }
+        // MEMORY LEAK FIX: Unsubscribe from spinner message subscription
+        if (this.spinnerMessageSubscription) {
+            this.spinnerMessageSubscription.unsubscribe();
+            this.spinnerMessageSubscription = null;
+        }
+        // MEMORY LEAK FIX: Unsubscribe from router events subscription
+        if (this.routerEventsSubscription) {
+            this.routerEventsSubscription.unsubscribe();
+            this.routerEventsSubscription = null;
+        }
+        // MEMORY LEAK FIX: Unsubscribe from appManager subscriptions
+        this.appManagerSubscriptions.forEach(unsubscribe => {
+            if (unsubscribe) {
+                unsubscribe();
+            }
+        });
+        this.appManagerSubscriptions = [];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppComponent, deps: [{ token: PipeProvider }, { token: i0.ApplicationRef }, { token: i0.ElementRef }, { token: i2$2.OAuthService }, { token: i1.AbstractDialogService }, { token: i1.AbstractSpinnerService }, { token: i0.NgZone }, { token: i1$1.Router }, { token: i1.App }, { token: AppManagerService }, { token: i1.CustomIconsLoaderService }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: AppComponent, isStandalone: true, selector: "app-root", viewQueries: [{ propertyName: "routerOutlet", first: true, predicate: RouterOutlet, descendants: true }, { propertyName: "dynamicComponentContainerRef", first: true, predicate: ["dynamicComponent"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "@if (startApp) {\n    @if(enableSkipToMainContent) {\n        <div id=\"app-focus-start\" tabindex=\"-1\"></div>\n        <a href=\"javascript:void(0);\" class=\"skip\" (click)=\"skipToAppContent($event)\">{{appLocale.LABEL_SKIP_TO_MAIN_CONTENT || 'Skip to main content'}}</a>\n    }\n    <router-outlet></router-outlet>\n  @if (isApplicationType) {\n    <div wmContainer partialContainer content=\"Common\" hidden class=\"ng-hide\"></div>\n  }\n  <app-spinner name=\"globalspinner\" classname=\"global-spinner\" role=\"alert\" aria-live=\"assertive\" [attr.aria-label]=\"spinner.arialabel || 'Loading'\" [show]=\"spinner.show\" [spinnermessages]=\"spinner.messages\"></app-spinner>\n  <div wmDialog name=\"oAuthLoginDialog\" title=\"Application is requesting you to sign in with\"\n    close.event=\"closeOAuthDialog()\">\n    <ng-template #dialogBody>\n      <ul class=\"list-items\">\n        @for (provider of providersConfig; track provider) {\n          <li class=\"list-item\">\n            <button class=\"btn\" (click)=\"provider.invoke()\">{{provider.name}}</button>\n          </li>\n        }\n      </ul>\n    </ng-template>\n  </div>\n  <div wmConfirmDialog name=\"_app-confirm-dialog\" title.bind=\"title\" message.bind=\"message\" oktext.bind=\"oktext\"\n    canceltext.bind=\"canceltext\" closable=\"false\" iconclass.bind=\"iconclass\"\n  escape.event=\"onEscape()\" ok.event=\"onOk()\" cancel.event=\"onCancel()\" close.event=\"onClose()\" opened.event=\"onOpen()\"></div>\n  @if (!isApplicationType) {\n    <div  wmConfirmDialog name=\"PrefabConfirmDialog\" title.bind=\"title\" message.bind=\"text\" oktext.bind=\"okButtonText\"\n      canceltext.bind=\"cancelButtonText\" closable=\"false\" iconclass.bind=\"iconclass\"\n    escape.event=\"onEscape()\" ok.event=\"onOk()\" cancel.event=\"onCancel()\" close.event=\"onClose()\" opened.event=\"onOpen()\"></div>\n  }\n  @if (!isApplicationType) {\n    <div  wmAlertDialog name=\"PrefabAlertDialog\" title.bind=\"title\" message.bind=\"text\" oktext.bind=\"okButtonText\"\n      canceltext.bind=\"cancelButtonText\" closable=\"false\" iconclass.bind=\"iconclass\"\n    escape.event=\"onEscape()\" ok.event=\"onOk()\" cancel.event=\"onCancel()\" close.event=\"onClose()\" opened.event=\"onOpen()\"></div>\n  }\n  <div wmAppExt></div>\n  <i id=\"wm-mobile-display\"></i>\n}\n<!--Dummy container to create the component dynamically-->\n<ng-container #dynamicComponent></ng-container>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: AlertDialogComponent, selector: "div[wmAlertDialog]" }, { kind: "component", type: ConfirmDialogComponent, selector: "div[wmConfirmDialog]" }, { kind: "component", type: DialogComponent, selector: "div[wmDialog]" }, { kind: "component", type: AppSpinnerComponent, selector: "app-spinner", inputs: ["show", "spinnermessages", "classname", "arialabel"] }, { kind: "directive", type: ContainerDirective, selector: "[wmContainer]" }, { kind: "directive", type: PartialParamHandlerDirective, selector: "[partialContainer]" }, { kind: "directive", type: PartialContainerDirective, selector: "[partialContainer]" }], encapsulation: i0.ViewEncapsulation.None }); }
@@ -4679,6 +4984,14 @@ class PrefabDirective {
             }
         });
     }
+    ngOnDestroy() {
+        // MEMORY LEAK FIX: Clear ViewContainerRef to destroy dynamically created components
+        if (this.vcRef) {
+            this.vcRef.clear();
+        }
+        // MEMORY LEAK FIX: Clear ElementRef reference
+        this.elRef = null;
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PrefabDirective, deps: [{ token: WidgetRef, self: true }, { token: i0.ViewContainerRef }, { token: i0.ElementRef }, { token: PrefabManagerService }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }, { token: ComponentRefProvider }], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: PrefabDirective, isStandalone: true, selector: "[wmPrefab][prefabname]", ngImport: i0 }); }
 }
@@ -4699,7 +5012,8 @@ const PREFAB = 'PREFAB';
 class PrefabPreviewComponent {
     constructor(prefabManager) {
         this.prefabManager = prefabManager;
-        window.addEventListener('message', e => {
+        // MEMORY LEAK FIX: Store bound function reference for cleanup
+        this.windowMessageListener = (e) => {
             const context = e.data && e.data.context;
             if (context !== PREFAB) {
                 return;
@@ -4718,7 +5032,8 @@ class PrefabPreviewComponent {
             else if (action === 'invoke-script') {
                 this.invokeScript(payload);
             }
-        });
+        };
+        window.addEventListener('message', this.windowMessageListener);
     }
     postMessage(action, payload) {
         const data = {
@@ -4735,7 +5050,8 @@ class PrefabPreviewComponent {
     }
     init() {
         this.previewMode = true;
-        this.prefabInstance.readyState.subscribe(() => { }, () => { }, () => {
+        // MEMORY LEAK FIX: Store subscription reference
+        this.readyStateSubscription = this.prefabInstance.readyState.subscribe(() => { }, () => { }, () => {
             this.prefabManager.getConfig('__self__')
                 .then(config => {
                 this.config = config;
@@ -4769,6 +5085,22 @@ class PrefabPreviewComponent {
         this.setupEventListeners();
         this.postMessage('init');
     }
+    ngOnDestroy() {
+        // MEMORY LEAK FIX: Remove window message listener
+        if (this.windowMessageListener) {
+            window.removeEventListener('message', this.windowMessageListener);
+            this.windowMessageListener = null;
+        }
+        // MEMORY LEAK FIX: Unsubscribe from readyState
+        if (this.readyStateSubscription) {
+            this.readyStateSubscription.unsubscribe();
+            this.readyStateSubscription = null;
+        }
+        // MEMORY LEAK FIX: Clear ViewChild reference
+        this.prefabInstance = null;
+        // MEMORY LEAK FIX: Clear config
+        this.config = null;
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PrefabPreviewComponent, deps: [{ token: PrefabManagerService }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: PrefabPreviewComponent, isStandalone: true, selector: "wm-prefab-preview", viewQueries: [{ propertyName: "prefabInstance", first: true, predicate: PrefabDirective$1, descendants: true, static: true }], ngImport: i0, template: `
         <div class="prefab-preview row">
@@ -4849,6 +5181,7 @@ class DynamicComponentRefProviderService {
                        selector: selector of the component
                        transpile: flag for transpiling HTML. By default it is true
                        nocache: flag for render it from cache or not. By default it is true
+     * @returns ComponentRef - the created component reference for cleanup
      */
     async addComponent(target, markup, context = {}, options = {}) {
         options.transpile = isDefined(options.transpile) ? options.transpile : true;
@@ -4858,6 +5191,8 @@ class DynamicComponentRefProviderService {
         const component = this.app.dynamicComponentContainerRef.createComponent(componentFactoryRef, 0, get(options, 'inj'));
         extendProto(component.instance, context);
         target.appendChild(component.location.nativeElement);
+        // MEMORY LEAK FIX: Return component reference so caller can destroy it
+        return component;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DynamicComponentRefProviderService, deps: [{ token: i1.App }, { token: AppManagerService }, { token: i0.Compiler }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DynamicComponentRefProviderService }); }