barsa-novin-ray-core 2.3.93 → 2.3.95

package/fesm2022/barsa-novin-ray-core.mjs

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
 import { Injectable, inject, ElementRef, Input, ChangeDetectionStrategy, Component, Pipe, ComponentFactoryResolver, Injector, ApplicationRef, Compiler, DOCUMENT, NgModuleFactory, InjectionToken, NgZone, EventEmitter, ChangeDetectorRef, Renderer2, HostBinding, Output, HostListener, ViewContainerRef, ViewChild, signal, Directive, TemplateRef, input, NgModule, NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA, provideAppInitializer, ErrorHandler } from '@angular/core';
-import { Subject, from, BehaviorSubject, of, exhaustMap, map as map$1, combineLatest, withLatestFrom as withLatestFrom$1, fromEvent, forkJoin, takeUntil as takeUntil$1, filter as filter$1, throwError, merge, interval, tap as tap$1, concatMap as concatMap$1, catchError as catchError$1, finalize as finalize$1, Observable, debounceTime as debounceTime$1, timer, mergeWith, Subscription } from 'rxjs';
+import { Subject, from, BehaviorSubject, of, exhaustMap, map as map$1, combineLatest, withLatestFrom as withLatestFrom$1, fromEvent, forkJoin, takeUntil as takeUntil$1, filter as filter$1, throwError, merge, interval, concatMap as concatMap$1, catchError as catchError$1, finalize as finalize$1, take, debounceTime as debounceTime$1, skip, Observable, tap as tap$1, timer, mergeWith, Subscription } from 'rxjs';
 import * as i1 from '@angular/router';
 import { Router, NavigationEnd, ActivatedRoute, RouterEvent, NavigationStart, RouterModule } from '@angular/router';
 import { DomSanitizer, Title } from '@angular/platform-browser';
@@ -6250,7 +6250,9 @@ class ContainerService {
         this.oldActiveSystem = null;
         this.detachParent = true;
         this.masterDetails = false;
+        this.state = 'attach';
         this.isMobile = getDeviceIsMobile();
+        this.addModules = new Subject();
         this._activatedRoute = inject(ActivatedRoute);
         this._router = inject(Router);
         this._portalService = inject(PortalService);
@@ -6271,6 +6273,7 @@ class ContainerService {
     }
     setViewContainerRef(viewContainerRef) {
         this._viewContainerRef = viewContainerRef;
+        this.state = 'attach';
         if (this._parentService && this.detachParent) {
             this._parentService.detach();
         }
@@ -6310,6 +6313,7 @@ class ContainerService {
     }
     detach() {
         this._setScrollPosition();
+        this.state = 'detach';
         this._viewRef = this._viewContainerRef.detach();
     }
     _setScrollPosition() {
@@ -6341,6 +6345,9 @@ class ContainerService {
             this._viewContainerRef.insert(this._viewRef);
             this._restoreScrollPostion();
         }
+        else {
+            this.addModules.next();
+        }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ContainerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ContainerService }); }
@@ -7795,35 +7802,16 @@ const NOTIFICATION_WEBWORKER_FACTORY = new InjectionToken('notificaion-worker');
 
 class ServiceWorkerNotificationService {
     constructor() {
-        this.hasRegistration = false;
         this._logService = inject(LogService);
         this._swPush = inject(SwPush);
         this._portalService = inject(PortalService);
-        this._notificationPermissionAllowed = true;
-        const _logService = this._logService;
-        const _swPush = this._swPush;
-        _logService.info(`swPush enable ${_swPush.isEnabled}`);
-        _swPush.notificationClicks.pipe(tap$1((c) => console.log(c))).subscribe((e) => {
-            if (!e.notification.tag) {
-                return;
-            }
-            this.closeNotifications([e.notification.tag]);
-            let actionTitle = e.action;
-            if (actionTitle === '') {
-                actionTitle = 'show';
-            }
-            if (!BarsaApi?.LoginFormData?.IsUserLoggedIn) {
-                return;
-            }
-            this._portalService.ExecuteNotificationAction(e.notification.tag, actionTitle);
-            // TODO:exeucte action
-            // not handled!!
-        });
-        this.getSw().then((c) => (this.hasRegistration = !!c));
-        this.handlePermission();
+        this._notificationPermissionAllowed = false;
+        this._hasRegistration = false;
+        this.init();
     }
+    // بررسی وضعیت فعلی
     get isEnabled() {
-        return this._swPush.isEnabled && this.hasRegistration && this._notificationPermissionAllowed;
+        return this._swPush.isEnabled && this._hasRegistration && this._notificationPermissionAllowed;
     }
     async closeNotifications(tags) {
         const sw = await this.getSw();
@@ -7837,6 +7825,7 @@ class ServiceWorkerNotificationService {
             }
         });
     }
+    // نمایش دستی نوتیفیکیشن (برای تست)
     async showNotification(payload) {
         const sw = await this.getSw();
         if (!sw) {
@@ -7876,43 +7865,40 @@ class ServiceWorkerNotificationService {
             data
         });
     }
-    handlePermission() {
-        if (!navigator?.permissions?.query) {
-            return;
-        }
-        return navigator.permissions
-            .query({ name: 'notifications' })
-            .then(this.permissionQuery.bind(this))
-            .catch(this.permissionError.bind(this));
+    async init() {
+        this._logService.info(`SwPush enabled: ${this._swPush.isEnabled}`);
+        // مدیریت کلیک روی نوتیفیکیشن‌ها
+        this._swPush.notificationClicks.subscribe((e) => {
+            if (!e.notification.tag) {
+                return;
+            }
+            const actionTitle = e.action || 'show';
+            if (!BarsaApi?.LoginFormData?.IsUserLoggedIn) {
+                return;
+            }
+            this._portalService.ExecuteNotificationAction(e.notification.tag, actionTitle);
+        });
+        // بررسی مجوز و ثبت سرویس‌ورکر
+        await this.registerServiceWorker();
+        await this.requestPermission();
     }
-    permissionQuery(result) {
-        let newPrompt;
-        if (result.state === 'granted') {
-            // notifications allowed, go wild
-        }
-        else if (result.state === 'prompt') {
-            // we can ask the user
-            newPrompt = Notification.requestPermission();
-        }
-        else if (result.state === 'denied') {
-            // notifications were disabled
-            this._notificationPermissionAllowed = false;
+    async requestPermission() {
+        if (Notification.permission === 'default') {
+            await Notification.requestPermission();
         }
-        result.onchange = () => console.log({ updatedPermission: result });
-        return newPrompt || result;
+        this._notificationPermissionAllowed = Notification.permission === 'granted';
     }
-    permissionError(error) {
-        this._notificationPermissionAllowed = false;
-        console.error(error);
+    async registerServiceWorker() {
+        if (!('serviceWorker' in navigator)) {
+            return;
+        }
+        const reg = await navigator.serviceWorker.getRegistration();
+        this._hasRegistration = !!reg;
     }
     async getSw() {
-        if (!navigator.serviceWorker) {
-            this.hasRegistration = false;
-            return undefined;
-        }
-        const x = await navigator.serviceWorker.getRegistration('custom-ngsw-worker.js');
-        this.hasRegistration = !!x;
-        return x;
+        const reg = await navigator.serviceWorker.getRegistration();
+        this._hasRegistration = !!reg;
+        return reg;
     }
     _isSupported() {
         if (!('serviceWorker' in navigator)) {
@@ -9328,7 +9314,8 @@ class ContainerComponent extends BaseComponent {
         this._cdr = inject(ChangeDetectorRef);
         this._renderer2 = inject(Renderer2);
         this._dialogService = inject(DIALOG_SERVICE, { optional: true });
-        this._containerService = inject(ContainerService, { self: true, optional: true });
+        this._containerServiceParent = inject(ContainerService, { self: true, optional: true });
+        this._containerService = inject(ContainerService);
         this._formDialogComponent = inject(FORM_DIALOG_COMPONENT, { optional: true });
         this.oldContainerContainer = this._barsaDialogService.containerComponent;
         this._barsaDialogService.containerComponent = this;
@@ -9348,12 +9335,10 @@ class ContainerComponent extends BaseComponent {
         BarsaApi.Bw.FormHandler = this;
         this.oldNavigation = BarsaApi.Bw.Navigate;
         BarsaApi.Bw.Navigate = (navigation, isRelative, queryParams, data) => {
-            this._containerService?.navigate(navigation, isRelative, queryParams, data);
+            this._containerServiceParent?.navigate(navigation, isRelative, queryParams, data);
         };
         super.ngOnInit();
-        if (this._containerService) {
-            this._containerService.setViewContainerRef(this._vcr);
-        }
+        this._containerService?.setViewContainerRef(this.containerRef);
     }
     ngOnDestroy() {
         BarsaApi.Bw.FormHandler = this.parentContainer;
@@ -9392,10 +9377,12 @@ class PageBaseComponent extends ContainerComponent {
         super(...arguments);
         this.hasRoute = true;
         this.fullscreen = true;
+        this.componentsAddedToPage = false;
     }
     ngAfterViewInit() {
         super.ngAfterViewInit();
-        this.addModulesToDom();
+        this._containerService.state === 'attach' && this.addModulesToDom();
+        this._containerService?.addModules.pipe(takeUntil(this._onDestroy$)).subscribe(() => this.addModulesToDom());
     }
     addModulesToDom() {
         this.getData$()
@@ -9442,6 +9429,9 @@ class PageBaseComponent extends ContainerComponent {
         return controlUi;
     }
     addModulesToPage(modules) {
+        if (this.componentsAddedToPage) {
+            return;
+        }
         modules = modules.sort((a, b) => (Number(a.OrderNumber) > Number(b.OrderNumber) ? 1 : -1));
         from(modules)
             .pipe(takeUntil(this._onDestroy$), concatMap((module) => this.getComponentFactory(module.Component).pipe(tap((controlUi) => {
@@ -9454,7 +9444,10 @@ class PageBaseComponent extends ContainerComponent {
                 this._vcr.insert(controlUi.hostView);
             }
         }))))
-            .subscribe(() => this._cdr.detectChanges());
+            .subscribe(() => {
+            this.componentsAddedToPage = true;
+            this._cdr.detectChanges();
+        });
     }
     getComponentFactory(uiComponent) {
         return this._portalService.getComponent(uiComponent.Module, uiComponent.ModuleFileName, uiComponent.Name, uiComponent.Selector, this._injector);
@@ -9936,57 +9929,6 @@ class FilesValidationHelper {
     }
 }
 
-var IntersectionStatus;
-(function (IntersectionStatus) {
-    IntersectionStatus["Visible"] = "Visible";
-    IntersectionStatus["Pending"] = "Pending";
-    IntersectionStatus["NotVisible"] = "NotVisible";
-})(IntersectionStatus || (IntersectionStatus = {}));
-/* eslint-disable */
-const fromIntersectionObserver = (element, config, debounce = 0, autoStop = true) => new Observable((subscriber) => {
-    const subject$ = new Subject();
-    const intersectionObserver = new IntersectionObserver((entries, observer) => {
-        entries.forEach((entry) => {
-            if (isIntersecting(entry)) {
-                subject$.next({ entry, observer });
-            }
-        });
-    }, config);
-    subject$.subscribe(() => {
-        subscriber.next(IntersectionStatus.Pending);
-    });
-    subject$.pipe(debounceTime(debounce), filter(Boolean)).subscribe(async (x) => {
-        const { entry, observer } = x;
-        const isEntryVisible = await isVisible(entry.target);
-        if (isEntryVisible) {
-            subscriber.next(IntersectionStatus.Visible);
-            autoStop && observer.unobserve(entry.target);
-        }
-        else {
-            subscriber.next(IntersectionStatus.NotVisible);
-        }
-    });
-    intersectionObserver.observe(element);
-    return {
-        unsubscribe() {
-            intersectionObserver.disconnect();
-            subject$.unsubscribe();
-        }
-    };
-});
-async function isVisible(element) {
-    return new Promise((resolve) => {
-        const observer = new IntersectionObserver(([entry]) => {
-            resolve(entry.isIntersecting);
-            observer.disconnect();
-        });
-        observer.observe(element);
-    });
-}
-function isIntersecting(entry) {
-    return true; // entry.isIntersecting || entry.intersectionRatio > 0;
-}
-
 class ReportViewBaseComponent extends BaseComponent {
     constructor() {
         super(...arguments);
@@ -10035,6 +9977,8 @@ class ReportViewBaseComponent extends BaseComponent {
         this._groupByService = inject(GroupByService, { skipSelf: true, optional: true });
         this._containerWidth = 0;
         this._firstVisible = false;
+        this._onVisible$ = new Subject();
+        this.$resize = new Subject();
     }
     set containerWidth(val) {
         this._containerWidth = val;
@@ -10067,16 +10011,20 @@ class ReportViewBaseComponent extends BaseComponent {
             });
         }
         this._setRowIndicator(this.columns);
-        const config = {
-            root: null,
-            rootMargin: '0px',
-            threshold: 0.5
-        };
-        fromIntersectionObserver(this._el.nativeElement, config, 0.5, false)
-            .pipe(takeUntil$1(this._onDestroy$))
-            .subscribe((status) => {
-            this.onVisibilityChange(status);
-        });
+        this._handleResize();
+        this.$resize
+            .asObservable()
+            .pipe(takeUntil$1(this._onDestroy$), take(1), debounceTime$1(50))
+            .subscribe(() => this.onVisible());
+        this.$resize
+            .asObservable()
+            .pipe(takeUntil$1(this._onDestroy$), skip(1), debounceTime$1(50))
+            .subscribe(() => this.onResize());
+    }
+    ngOnDestroy() {
+        if (this._ro) {
+            this._ro.disconnect();
+        }
     }
     ngOnChanges(changes) {
         super.ngOnChanges(changes);
@@ -10091,12 +10039,6 @@ class ReportViewBaseComponent extends BaseComponent {
             this.detectChanges();
         }
     }
-    onVisibilityChange(e, ..._args) {
-        if (e === 'Visible') {
-            this._visibility = 'visible';
-            this._renderer2.setStyle(this._el.nativeElement, 'visibility', 'visible');
-        }
-    }
     onDeselectAll() {
         this.deselectAll.emit();
     }
@@ -10189,6 +10131,35 @@ class ReportViewBaseComponent extends BaseComponent {
     _trackByRow(index, row) {
         return `${row.$Group ? row.$Group : row.Id}${index}`;
     }
+    onVisible() {
+        this._visibility = 'visible';
+        this._renderer2.setStyle(this._el.nativeElement, 'visibility', 'visible');
+        this._onVisible$.next();
+    }
+    onResize() { }
+    _handleResize() {
+        fromEvent(window, 'resize')
+            .pipe(takeUntil$1(this._onDestroy$))
+            .subscribe(() => {
+            this.$resize.next();
+        });
+        // اگر container تغییر اندازه پیدا کرد (مثلاً parent تغییر کنه)
+        try {
+            this._ro = new ResizeObserver(() => {
+                requestAnimationFrame(() => {
+                    this.$resize.next();
+                });
+            });
+            if (this._el?.nativeElement) {
+                this._ro.observe(this._el.nativeElement);
+            }
+        }
+        catch {
+            // مرورگرهای خیلی قدیمی ممکنه ResizeObserver نداشته باشند
+            // در آنصورت rely به window resize می‌کنیم
+            // no-op
+        }
+    }
     onActionListClick(mo, index, itemId) {
         if (itemId === 'Show') {
             this.onRowClick({ mo, index });
@@ -10715,8 +10686,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
 class FormPageBaseComponent extends ContainerComponent {
     constructor() {
         super(...arguments);
-        this.$resize = new Subject();
-        this._containerService = inject(ContainerService, { skipSelf: true, optional: true });
+        this._containerServiceParent = inject(ContainerService, { skipSelf: true, optional: true });
         /* eslint-disable */
         this.ShowFormPanelControl = (formpanelCtrlr) => {
             this._portalService.ShowFormPanelControl(formpanelCtrlr, this._router, this._activatedRoute, this._formDialogComponent, false, this._vcr);
@@ -10743,17 +10713,13 @@ class FormPageBaseComponent extends ContainerComponent {
             const state = this._router.getCurrentNavigation()?.extras.state;
             this.prepareIds(state?.formPanelCtrlrId, params);
         });
-        this.$resize
-            .asObservable()
-            .pipe(takeUntil(this._onDestroy$), debounceTime$1(200))
-            .subscribe(() => this._resize());
+        this.hideAllPageContent();
     }
     ngAfterViewInit() {
         super.ngAfterViewInit();
         if (!this.formPanelCtrlr) {
             this.formPanelCtrlr = this._portalService.formPanels[this.formpanelCtrlrId];
         }
-        this.$resize.next();
         if (BarsaApi.LoginFormData.IsServiceDesk) {
             setTimeout(() => {
                 window.scrollTo({ top: 0 });
@@ -10768,50 +10734,11 @@ class FormPageBaseComponent extends ContainerComponent {
     _resize() {
         this.hideAllPageContent();
     }
-    _handleResize() {
-        fromEvent(window, 'resize')
-            .pipe(takeUntil(this._onDestroy$))
-            .subscribe(() => {
-            this.$resize.next();
-        });
-        // اگر container تغییر اندازه پیدا کرد (مثلاً parent تغییر کنه)
-        try {
-            this._ro = new ResizeObserver(() => {
-                requestAnimationFrame(() => {
-                    this.$resize.next();
-                });
-            });
-            if (this._el?.nativeElement) {
-                this._ro.observe(this._el.nativeElement);
-            }
-        }
-        catch {
-            // مرورگرهای خیلی قدیمی ممکنه ResizeObserver نداشته باشند
-            // در آنصورت rely به window resize می‌کنیم
-            // no-op
-        }
-    }
     hideAllPageContent() {
-        this._containerService?.hideFormPage();
-        // const pages = document.querySelectorAll('.absolute-page');
-        // pages?.forEach((pageEl) => {
-        //     if (pageEl !== this._el.nativeElement) {
-        //         (pageEl as HTMLElement).classList.remove('absolute-page');
-        //         (pageEl as HTMLElement).classList.add('absolute-page-removed');
-        //     }
-        // });
-        // if (pages && pages.length > 0) {
-        //     (pages[pages.length - 1]?.firstChild as HTMLElement)?.classList?.remove('hide');
-        // }
+        this._containerServiceParent?.hideFormPage();
     }
     removeLastHidePage() {
-        this._containerService?.showFormPage();
-        // const pages = document.querySelectorAll('.absolute-page-removed');
-        // if (pages && pages.length > 0) {
-        //     const last: null | Element = pages[pages.length - 1];
-        //     last?.classList?.add('absolute-page');
-        //     last?.classList?.remove('absolute-page-removed');
-        // }
+        this._containerServiceParent?.showFormPage();
     }
     onFormClose() {
         if (this._activatedRoute.snapshot.params.isFirst &&
@@ -11050,11 +10977,11 @@ class FormComponent extends BaseComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: FormComponent, isStandalone: false, selector: "bnrc-form", inputs: { params: "params", customFormPanelUi: "customFormPanelUi", formPanelCtrl: "formPanelCtrl", UlvMainCtrlr: "UlvMainCtrlr", formPanelCtrlId: "formPanelCtrlId", saveOnChange: "saveOnChange", inlineEditInReport: "inlineEditInReport" }, outputs: { titleChanged: "titleChanged", moChanged: "moChanged", formClose: "formClose", uiComponent: "uiComponent", formRendered: "formRendered", bruleAction: "bruleAction", beforeTransition: "beforeTransition", afterTransition: "afterTransition" }, viewQueries: [{ propertyName: "vcr", first: true, predicate: ["placeholder"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: '<ng-container #placeholder> </ng-container>', isInline: true, styles: [":host{display:block;width:100%}:host ::ng-deep bsu-ly-layout-container-of-root.ismobile bnrc-field-ui{padding:.3rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: FormComponent, isStandalone: false, selector: "bnrc-form", inputs: { params: "params", customFormPanelUi: "customFormPanelUi", formPanelCtrl: "formPanelCtrl", UlvMainCtrlr: "UlvMainCtrlr", formPanelCtrlId: "formPanelCtrlId", saveOnChange: "saveOnChange", inlineEditInReport: "inlineEditInReport" }, outputs: { titleChanged: "titleChanged", moChanged: "moChanged", formClose: "formClose", uiComponent: "uiComponent", formRendered: "formRendered", bruleAction: "bruleAction", beforeTransition: "beforeTransition", afterTransition: "afterTransition" }, viewQueries: [{ propertyName: "vcr", first: true, predicate: ["placeholder"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: '<ng-container #placeholder> </ng-container>', isInline: true, styles: [":host{display:block;width:100%;min-height:100%}:host ::ng-deep bsu-ly-layout-container-of-root.ismobile bnrc-field-ui{padding:.3rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bnrc-form', template: '<ng-container #placeholder> </ng-container>', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, styles: [":host{display:block;width:100%}:host ::ng-deep bsu-ly-layout-container-of-root.ismobile bnrc-field-ui{padding:.3rem}\n"] }]
+            args: [{ selector: 'bnrc-form', template: '<ng-container #placeholder> </ng-container>', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, styles: [":host{display:block;width:100%;min-height:100%}:host ::ng-deep bsu-ly-layout-container-of-root.ismobile bnrc-field-ui{padding:.3rem}\n"] }]
         }], ctorParameters: () => [], propDecorators: { params: [{
                 type: Input
             }], customFormPanelUi: [{
@@ -11173,12 +11100,18 @@ class FormPageComponent extends FormPageBaseComponent {
     constructor() {
         super(...arguments);
         this.sectionClass = true;
-        this.absolutePageClass = true;
+        this.absolutePageClass = false;
     }
     ngOnInit() {
         this.containerRef = this.formRef.vcr; // it must be first because we change containerRef
         super.ngOnInit();
     }
+    ngAfterViewInit() {
+        super.ngAfterViewInit();
+        if (!this._el.nativeElement.classList.contains('absolute-page-removed')) {
+            this.absolutePageClass = true;
+        }
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FormPageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: FormPageComponent, isStandalone: false, selector: "bnrc-form-page", inputs: { formPanelCtrlr: "formPanelCtrlr" }, host: { properties: { "class.section": "this.sectionClass", "class.absolute-page": "this.absolutePageClass" } }, providers: [FormService, ContainerService], viewQueries: [{ propertyName: "formRef", first: true, predicate: FormComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
         <bnrc-form
@@ -11405,8 +11338,8 @@ class EmptyPageComponent extends PageWithFormHandlerBaseComponent {
         const isModal = this.settings?.IsModal;
         const isRelativePage = this._activatedRoute.snapshot.data?.pageData?.Component?.Settings?.IsRelativePage;
         if (isRelativePage || isModal) {
-            if (this._containerService) {
-                this._containerService.detachParent = false;
+            if (this._containerServiceParent) {
+                this._containerServiceParent.detachParent = false;
             }
             else {
                 this._log.error(nullOrUndefinedString('EmptyPageComponent=> _containerService'));
@@ -11460,8 +11393,8 @@ class MasterDetailsPageComponent extends PageWithFormHandlerBaseComponent {
         this.settings = BarsaApi.Common.Util.TryGetValue(this._activatedRoute, 'data._value.pageData.Component.Settings', null);
         const isModal = this.settings?.IsModal;
         if (isModal) {
-            if (this._containerService) {
-                this._containerService.detachParent = false;
+            if (this._containerServiceParent) {
+                this._containerServiceParent.detachParent = false;
             }
             else {
                 this._log.error(nullOrUndefinedString('EmptyPageComponent=> _containerService'));
@@ -11470,7 +11403,7 @@ class MasterDetailsPageComponent extends PageWithFormHandlerBaseComponent {
             this.ismodal = true;
         }
         super.ngOnInit();
-        this._containerService && (this._containerService.masterDetails = true);
+        this._containerServiceParent && (this._containerServiceParent.masterDetails = true);
         // if (!BarsaApi.LoginFormData.IsServiceDesk && !isModal) {
         //     this._position = 'initial';
         // }
@@ -13064,7 +12997,7 @@ class RootPortalComponent extends PageBaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: RootPortalComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: RootPortalComponent, isStandalone: false, selector: "bnrc-root-portal", host: { properties: { "attr.dir": "this._dir", "attr.devicesize": "this._deviceSize" } }, viewQueries: [{ propertyName: "sectionRef", first: true, predicate: ["sectionRef"], descendants: true }, { propertyName: "footerRefVcr", first: true, predicate: ["footerRef"], descendants: true, read: ViewContainerRef }], usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: RootPortalComponent, isStandalone: false, selector: "bnrc-root-portal", host: { properties: { "attr.dir": "this._dir", "attr.devicesize": "this._deviceSize" } }, providers: [ContainerService], viewQueries: [{ propertyName: "sectionRef", first: true, predicate: ["sectionRef"], descendants: true }, { propertyName: "footerRefVcr", first: true, predicate: ["footerRef"], descendants: true, read: ViewContainerRef }], usesInheritance: true, ngImport: i0, template: `
         <div
             class="tw-hidden grid-cols-0 tw-grid-cols-1 tw-grid-cols-2 tw-grid-cols-3 tw-grid-cols-4 tw-grid-cols-5 
             tw-grid-cols-6 tw-grid-cols-7 tw-grid-cols-8 tw-grid-cols-9 tw-grid-cols-10 tw-grid-cols-11 tw-grid-cols-12"
@@ -13204,6 +13137,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
         }
     `,
                     changeDetection: ChangeDetectionStrategy.OnPush,
+                    providers: [ContainerService],
                     standalone: false
                 }]
         }], propDecorators: { sectionRef: [{
@@ -13508,6 +13442,57 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
                 type: Input
             }] } });
 
+var IntersectionStatus;
+(function (IntersectionStatus) {
+    IntersectionStatus["Visible"] = "Visible";
+    IntersectionStatus["Pending"] = "Pending";
+    IntersectionStatus["NotVisible"] = "NotVisible";
+})(IntersectionStatus || (IntersectionStatus = {}));
+/* eslint-disable */
+const fromIntersectionObserver = (element, config, debounce = 0, autoStop = true) => new Observable((subscriber) => {
+    const subject$ = new Subject();
+    const intersectionObserver = new IntersectionObserver((entries, observer) => {
+        entries.forEach((entry) => {
+            if (isIntersecting(entry)) {
+                subject$.next({ entry, observer });
+            }
+        });
+    }, config);
+    subject$.subscribe(() => {
+        subscriber.next(IntersectionStatus.Pending);
+    });
+    subject$.pipe(debounceTime(debounce), filter(Boolean)).subscribe(async (x) => {
+        const { entry, observer } = x;
+        const isEntryVisible = await isVisible(entry.target);
+        if (isEntryVisible) {
+            subscriber.next(IntersectionStatus.Visible);
+            autoStop && observer.unobserve(entry.target);
+        }
+        else {
+            subscriber.next(IntersectionStatus.NotVisible);
+        }
+    });
+    intersectionObserver.observe(element);
+    return {
+        unsubscribe() {
+            intersectionObserver.disconnect();
+            subject$.unsubscribe();
+        }
+    };
+});
+async function isVisible(element) {
+    return new Promise((resolve) => {
+        const observer = new IntersectionObserver(([entry]) => {
+            resolve(entry.isIntersecting);
+            observer.disconnect();
+        });
+        observer.observe(element);
+    });
+}
+function isIntersecting(entry) {
+    return true; // entry.isIntersecting || entry.intersectionRatio > 0;
+}
+
 class IntersectionObserverDirective {
     constructor() {
         this.intersectionDebounce = 0;
@@ -15253,7 +15238,8 @@ class ColumnValueDirective extends BaseDirective {
     }
     _setInnerHtml(value) {
         if (value) {
-            this._renderer2.setProperty(this._el.nativeElement, 'innerHTML', `<span>&#x202B;${value}&#x202C;</span>`);
+            const formattedValue = `\u202B${value}\u202C`;
+            this._renderer2.setProperty(this._el.nativeElement, 'textContent', formattedValue);
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ColumnValueDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
@@ -15518,7 +15504,7 @@ class ResizeHandlerDirective extends BaseDirective {
         this._handleResize();
         this.$resize
             .asObservable()
-            .pipe(takeUntil$1(this._onDestroy$), debounceTime$1(200))
+            .pipe(takeUntil$1(this._onDestroy$), debounceTime$1(50))
             .subscribe(() => this._resize());
     }
     ngOnDestroy() {