@ts-core/angular 11.0.78 → 11.0.82

package/bottomSheet/{component/BottomSheetImpl.d.ts → BottomSheetImpl.d.ts}

@@ -1,16 +1,19 @@
 import { Observable, Subject, Subscription } from 'rxjs';
 import { DestroyableContainer } from '@ts-core/common';
 import { MatBottomSheetRef } from '@angular/material/bottom-sheet';
-import { WindowConfig } from '../../window/WindowConfig';
-import { IWindow } from '../../window/IWindow';
-import { IWindowContent } from '../../window/IWindowContent';
-import { WindowProperties } from '../../window/WindowProperties';
+import { WindowConfig } from '../window/WindowConfig';
+import { IWindow } from '../window/IWindow';
+import { IWindowContent } from '../window/IWindowContent';
+import { WindowProperties } from '../window/WindowProperties';
 export declare class BottomSheetImpl<T = any> extends DestroyableContainer implements IWindow {
     static BLINK_DELAY: number;
     static SHAKE_DELAY: number;
     private _isBlink;
     private blinkTimer;
     private _isDisabled;
+    private _wrapper;
+    private _backdrop;
+    private _container;
     protected properties: WindowProperties;
     protected subscription: Subscription;
     protected observer: Subject<string>;
@@ -24,7 +27,12 @@ export declare class BottomSheetImpl<T = any> extends DestroyableContainer imple
     protected getConfig(): WindowConfig;
     protected getContainer(): HTMLElement;
     protected getReference(): MatBottomSheetRef<IWindowContent<T>>;
+    protected isNeedClickStopPropagation(event: MouseEvent): boolean;
     private stopBlinkIfNeed;
+    protected mouseDownHandler(event: MouseEvent): void;
+    protected mouseClickHandler(event: MouseEvent): void;
+    private mouseDownHandlerProxy;
+    private mouseClickHandlerProxy;
     emit(event: string): void;
     close(): void;
     destroy(): void;

package/bottomSheet/component/BottomSheetBaseComponent.d.ts

@@ -0,0 +1,19 @@
+import { ComponentFactoryResolver, ComponentRef } from '@angular/core';
+import { BottomSheetImpl } from '../BottomSheetImpl';
+import { BottomSheetCloseElementComponent } from './bottom-sheet-close-element/bottom-sheet-close-element.component';
+export declare class BottomSheetBaseComponent extends BottomSheetImpl {
+    static CLOSE_COMPONENT: typeof BottomSheetCloseElementComponent;
+    protected closeWindow: ComponentRef<any>;
+    protected setProperties(): void;
+    protected createWindowComponents(): void;
+    protected commitIsBlinkProperties(): void;
+    protected commitIsDisabledProperties(): void;
+    protected commitIsShakingProperties(): void;
+    protected isNeedClickStopPropagation(event: MouseEvent): boolean;
+    protected get resolver(): ComponentFactoryResolver;
+    protected get blinkClass(): string;
+    protected get disabledClass(): string;
+    protected get minimizedClass(): string;
+    protected get shakingClass(): string;
+    destroy(): void;
+}

package/bottomSheet/component/bottom-sheet-close-element/bottom-sheet-close-element.component.d.ts

@@ -0,0 +1,10 @@
+import { ElementRef } from '@angular/core';
+import { WindowElement } from '../../../window/component/WindowElement';
+export declare class BottomSheetCloseElementComponent extends WindowElement {
+    static ICON_CLASS: string;
+    static ICON_VALUE: string;
+    constructor(element: ElementRef);
+    protected createChildren(): void;
+    protected destroyChildren(): void;
+    private mouseClickHandler;
+}

package/bundles/ts-core-angular.umd.js

@@ -5145,9 +5145,19 @@
             _this.blinkToggle = function () {
                 _this.isBlink = !_this.isBlink;
             };
+            _this.mouseDownHandlerProxy = function (event) {
+                _this.mouseDownHandler(event);
+            };
+            _this.mouseClickHandlerProxy = function (event) {
+                _this.mouseClickHandler(event);
+            };
             _this.observer = new rxjs.Subject();
             _this.properties = properties;
             _this.content.window = _this;
+            // Have to save for unsubscribe on destroy
+            _this._wrapper = _this.properties.overlay.hostElement;
+            _this._backdrop = _this.properties.overlay.backdropElement;
+            _this._container = _this.properties.overlay.overlayElement;
             _this.setProperties();
             _this.getReference().afterOpened().pipe(operators$1.takeUntil(_this.destroyed)).subscribe(_this.setOpened);
             _this.getReference().afterDismissed().pipe(operators$1.takeUntil(_this.destroyed)).subscribe(_this.setClosed);
@@ -5156,6 +5166,10 @@
         BottomSheetImpl.prototype.setProperties = function () {
             ViewUtil.addClass(this.container, 'vi-bottom-sheet');
             ViewUtil.toggleClass(this.container, 'vi-modal', this.config.isModal);
+            if (!this.config.isModal) {
+                this.container.addEventListener('click', this.mouseClickHandlerProxy, true);
+                this.container.addEventListener('mousedown', this.mouseDownHandlerProxy);
+            }
         };
         BottomSheetImpl.prototype.commitIsBlinkProperties = function () { };
         BottomSheetImpl.prototype.commitIsDisabledProperties = function () { };
@@ -5168,6 +5182,9 @@
         BottomSheetImpl.prototype.getReference = function () {
             return this.properties.reference;
         };
+        BottomSheetImpl.prototype.isNeedClickStopPropagation = function (event) {
+            return false;
+        };
         BottomSheetImpl.prototype.stopBlinkIfNeed = function () {
             this.isBlink = false;
             if (!this.blinkTimer) {
@@ -5176,6 +5193,14 @@
             clearInterval(this.blinkTimer);
             this.blinkTimer = null;
         };
+        BottomSheetImpl.prototype.mouseDownHandler = function (event) {
+            this.setOnTop();
+        };
+        BottomSheetImpl.prototype.mouseClickHandler = function (event) {
+            if (this.isNeedClickStopPropagation(event)) {
+                event.stopPropagation();
+            }
+        };
         // --------------------------------------------------------------------------
         //
         //  Public Methods
@@ -5192,6 +5217,8 @@
                 return;
             }
             _super.prototype.destroy.call(this);
+            this._container.removeEventListener('click', this.mouseClickHandlerProxy, true);
+            this._container.removeEventListener('mousedown', this.mouseDownHandlerProxy);
             if (!_.isNil(this.content)) {
                 this.content.destroy();
             }
@@ -5200,6 +5227,9 @@
                 this.observer = null;
             }
             this.properties = null;
+            this._wrapper = null;
+            this._backdrop = null;
+            this._container = null;
             clearInterval(this.blinkTimer);
             this.blinkTimer = null;
         };
@@ -5307,21 +5337,21 @@
         });
         Object.defineProperty(BottomSheetImpl.prototype, "container", {
             get: function () {
-                return !_.isNil(this.reference) ? this.properties.overlay.overlayElement : null;
+                return this._container;
             },
             enumerable: false,
             configurable: true
         });
         Object.defineProperty(BottomSheetImpl.prototype, "wrapper", {
             get: function () {
-                return !_.isNil(this.properties.reference) ? this.properties.overlay.hostElement : null;
+                return this._wrapper;
             },
             enumerable: false,
             configurable: true
         });
         Object.defineProperty(BottomSheetImpl.prototype, "backdrop", {
             get: function () {
-                return !_.isNil(this.properties.reference) ? this.properties.overlay.backdropElement : null;
+                return this._backdrop;
             },
             enumerable: false,
             configurable: true
@@ -5367,6 +5397,261 @@
     BottomSheetImpl.BLINK_DELAY = 500;
     BottomSheetImpl.SHAKE_DELAY = 500;
 
+    var WindowElement = /** @class */ (function (_super) {
+        __extends(WindowElement, _super);
+        // --------------------------------------------------------------------------
+        //
+        // 	Constructor
+        //
+        // --------------------------------------------------------------------------
+        function WindowElement(element) {
+            var _this = _super.call(this) || this;
+            _this.element = element;
+            return _this;
+        }
+        // --------------------------------------------------------------------------
+        //
+        // 	Private Methods
+        //
+        // --------------------------------------------------------------------------
+        WindowElement.prototype.checkWindowParent = function () {
+            var container = this.getContainer();
+            if (container) {
+                ViewUtil.appendChild(container, this.element.nativeElement);
+            }
+        };
+        WindowElement.prototype.getContainer = function () {
+            var item = ViewUtil.parseElement(this.element.nativeElement);
+            while (item && item.nodeName.toLowerCase() !== 'mat-dialog-container') {
+                item = item.parentElement;
+            }
+            return item;
+        };
+        WindowElement.prototype.createChildren = function () { };
+        WindowElement.prototype.destroyChildren = function () { };
+        WindowElement.prototype.commitWindowProperties = function () { };
+        // --------------------------------------------------------------------------
+        //
+        // 	Public Methods
+        //
+        // --------------------------------------------------------------------------
+        WindowElement.prototype.ngAfterViewInit = function () {
+            this.createChildren();
+            this.checkWindowParent();
+        };
+        WindowElement.prototype.destroy = function () {
+            if (this.isDestroyed) {
+                return;
+            }
+            _super.prototype.destroy.call(this);
+            this.destroyChildren();
+            this.element = null;
+            this.window = null;
+        };
+        Object.defineProperty(WindowElement.prototype, "nativeElement", {
+            // --------------------------------------------------------------------------
+            //
+            // 	Protected Properties
+            //
+            // --------------------------------------------------------------------------
+            get: function () {
+                return this.element ? this.element.nativeElement : null;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(WindowElement.prototype, "window", {
+            // --------------------------------------------------------------------------
+            //
+            // 	Public Properties
+            //
+            // --------------------------------------------------------------------------
+            get: function () {
+                return this._window;
+            },
+            set: function (value) {
+                if (value === this._window) {
+                    return;
+                }
+                this._window = value;
+                if (this.window) {
+                    this.commitWindowProperties();
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        return WindowElement;
+    }(common.DestroyableContainer));
+
+    var BottomSheetCloseElementComponent = /** @class */ (function (_super) {
+        __extends(BottomSheetCloseElementComponent, _super);
+        // --------------------------------------------------------------------------
+        //
+        // 	Constructor
+        //
+        // --------------------------------------------------------------------------
+        function BottomSheetCloseElementComponent(element) {
+            var _this = _super.call(this, element) || this;
+            // --------------------------------------------------------------------------
+            //
+            // 	Event Handlers
+            //
+            // --------------------------------------------------------------------------
+            _this.mouseClickHandler = function (event) {
+                event.stopPropagation();
+                if (!_.isNil(_this.window)) {
+                    _this.window.close();
+                }
+            };
+            return _this;
+        }
+        // --------------------------------------------------------------------------
+        //
+        // 	Private Methods
+        //
+        // --------------------------------------------------------------------------
+        BottomSheetCloseElementComponent.prototype.createChildren = function () {
+            _super.prototype.createChildren.call(this);
+            if (!_.isNil(BottomSheetCloseElementComponent.ICON_VALUE)) {
+                ViewUtil.setProperty(this.nativeElement, 'innerHTML', BottomSheetCloseElementComponent.ICON_VALUE);
+            }
+            if (!_.isNil(BottomSheetCloseElementComponent.ICON_CLASS)) {
+                ViewUtil.addClasses(this.nativeElement, BottomSheetCloseElementComponent.ICON_CLASS);
+            }
+            ViewUtil.addClass(this.nativeElement, 'mouse-active');
+            this.nativeElement.addEventListener('click', this.mouseClickHandler, true);
+        };
+        BottomSheetCloseElementComponent.prototype.destroyChildren = function () {
+            _super.prototype.destroyChildren.call(this);
+            this.nativeElement.removeEventListener('click', this.mouseClickHandler, true);
+        };
+        return BottomSheetCloseElementComponent;
+    }(WindowElement));
+    // --------------------------------------------------------------------------
+    //
+    // 	Constants
+    //
+    // --------------------------------------------------------------------------
+    BottomSheetCloseElementComponent.ICON_CLASS = 'fas fa-times';
+    BottomSheetCloseElementComponent.ICON_VALUE = null;
+    BottomSheetCloseElementComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'vi-bottom-sheet-close-element',
+                    template: '',
+                    styles: [":host{display:block;position:absolute;color:#fff;background-color:rgba(0,0,0,.4);border-radius:50%;padding:8px;font-size:14px;font-weight:700}:host:hover{background-color:rgba(0,0,0,.6)}:host.small{font-size:10px;padding:4px}"]
+                },] }
+    ];
+    BottomSheetCloseElementComponent.ctorParameters = function () { return [
+        { type: i0.ElementRef }
+    ]; };
+
+    var BottomSheetBaseComponent = /** @class */ (function (_super) {
+        __extends(BottomSheetBaseComponent, _super);
+        function BottomSheetBaseComponent() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        // --------------------------------------------------------------------------
+        //
+        //  Protected Methods
+        //
+        // --------------------------------------------------------------------------
+        BottomSheetBaseComponent.prototype.setProperties = function () {
+            _super.prototype.setProperties.call(this);
+            this.createWindowComponents();
+        };
+        BottomSheetBaseComponent.prototype.createWindowComponents = function () {
+            if (!(this.content.container instanceof i0.ViewContainerRef)) {
+                return;
+            }
+            if (!this.config.disableClose && !this.closeWindow) {
+                var factory = this.resolver.resolveComponentFactory(BottomSheetBaseComponent.CLOSE_COMPONENT);
+                this.closeWindow = this.content.container.createComponent(factory);
+                this.closeWindow.instance.window = this;
+            }
+        };
+        BottomSheetBaseComponent.prototype.commitIsBlinkProperties = function () {
+            ViewUtil.toggleClass(this.container, this.blinkClass, this.isBlink);
+        };
+        BottomSheetBaseComponent.prototype.commitIsDisabledProperties = function () {
+            ViewUtil.toggleClass(this.container, this.disabledClass, this.isDisabled);
+            ViewUtil.toggleClass(this.content.element, this.disabledClass, this.isDisabled);
+            ViewUtil.toggleClass(this.content.element.nativeElement.parentElement, this.disabledClass, this.isDisabled);
+        };
+        BottomSheetBaseComponent.prototype.commitIsShakingProperties = function () {
+            ViewUtil.toggleClass(this.container, this.shakingClass, this.isShaking);
+        };
+        BottomSheetBaseComponent.prototype.isNeedClickStopPropagation = function (event) {
+            if (!_super.prototype.isNeedClickStopPropagation.call(this, event)) {
+                return false;
+            }
+            if (this.closeWindow && this.closeWindow.location.nativeElement === event.target) {
+                return false;
+            }
+            return true;
+        };
+        Object.defineProperty(BottomSheetBaseComponent.prototype, "resolver", {
+            // --------------------------------------------------------------------------
+            //
+            //  Protected Properties
+            //
+            // --------------------------------------------------------------------------
+            get: function () {
+                return APPLICATION_INJECTOR().get(i0.ComponentFactoryResolver);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(BottomSheetBaseComponent.prototype, "blinkClass", {
+            get: function () {
+                return 'vi-blink';
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(BottomSheetBaseComponent.prototype, "disabledClass", {
+            get: function () {
+                return 'vi-disabled';
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(BottomSheetBaseComponent.prototype, "minimizedClass", {
+            get: function () {
+                return 'vi-minimized';
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(BottomSheetBaseComponent.prototype, "shakingClass", {
+            get: function () {
+                return 'shake-constant shake-horizontal';
+            },
+            enumerable: false,
+            configurable: true
+        });
+        // --------------------------------------------------------------------------
+        //
+        //  Public Methods
+        //
+        // --------------------------------------------------------------------------
+        BottomSheetBaseComponent.prototype.destroy = function () {
+            if (this.isDestroyed) {
+                return;
+            }
+            _super.prototype.destroy.call(this);
+            // Components will destroy automatically
+            this.closeWindow = null;
+        };
+        return BottomSheetBaseComponent;
+    }(BottomSheetImpl));
+    // --------------------------------------------------------------------------
+    //
+    //  Static Properties
+    //
+    // --------------------------------------------------------------------------
+    BottomSheetBaseComponent.CLOSE_COMPONENT = BottomSheetCloseElementComponent;
+
     var IWindowContent = /** @class */ (function (_super) {
         __extends(IWindowContent, _super);
         // --------------------------------------------------------------------------
@@ -5583,93 +5868,6 @@
         { type: language.LanguageService }
     ]; };
 
-    var WindowElement = /** @class */ (function (_super) {
-        __extends(WindowElement, _super);
-        // --------------------------------------------------------------------------
-        //
-        // 	Constructor
-        //
-        // --------------------------------------------------------------------------
-        function WindowElement(element) {
-            var _this = _super.call(this) || this;
-            _this.element = element;
-            return _this;
-        }
-        // --------------------------------------------------------------------------
-        //
-        // 	Private Methods
-        //
-        // --------------------------------------------------------------------------
-        WindowElement.prototype.checkWindowParent = function () {
-            var container = this.getContainer();
-            if (container) {
-                ViewUtil.appendChild(container, this.element.nativeElement);
-            }
-        };
-        WindowElement.prototype.getContainer = function () {
-            var item = ViewUtil.parseElement(this.element.nativeElement);
-            while (item && item.nodeName.toLowerCase() !== 'mat-dialog-container') {
-                item = item.parentElement;
-            }
-            return item;
-        };
-        WindowElement.prototype.createChildren = function () { };
-        WindowElement.prototype.destroyChildren = function () { };
-        WindowElement.prototype.commitWindowProperties = function () { };
-        // --------------------------------------------------------------------------
-        //
-        // 	Public Methods
-        //
-        // --------------------------------------------------------------------------
-        WindowElement.prototype.ngAfterViewInit = function () {
-            this.createChildren();
-            this.checkWindowParent();
-        };
-        WindowElement.prototype.destroy = function () {
-            if (this.isDestroyed) {
-                return;
-            }
-            _super.prototype.destroy.call(this);
-            this.destroyChildren();
-            this.element = null;
-            this.window = null;
-        };
-        Object.defineProperty(WindowElement.prototype, "nativeElement", {
-            // --------------------------------------------------------------------------
-            //
-            // 	Protected Properties
-            //
-            // --------------------------------------------------------------------------
-            get: function () {
-                return this.element ? this.element.nativeElement : null;
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(WindowElement.prototype, "window", {
-            // --------------------------------------------------------------------------
-            //
-            // 	Public Properties
-            //
-            // --------------------------------------------------------------------------
-            get: function () {
-                return this._window;
-            },
-            set: function (value) {
-                if (value === this._window) {
-                    return;
-                }
-                this._window = value;
-                if (this.window) {
-                    this.commitWindowProperties();
-                }
-            },
-            enumerable: false,
-            configurable: true
-        });
-        return WindowElement;
-    }(common.DestroyableContainer));
-
     var WindowCloseElementComponent = /** @class */ (function (_super) {
         __extends(WindowCloseElementComponent, _super);
         // --------------------------------------------------------------------------
@@ -6104,7 +6302,7 @@
         });
         Object.defineProperty(WindowBaseComponent.prototype, "blinkClass", {
             get: function () {
-                return 'blink';
+                return 'vi-blink';
             },
             enumerable: false,
             configurable: true
@@ -6537,7 +6735,7 @@
             _this.dialog = dialog;
             _this.language = language;
             _this.observer = new rxjs.Subject();
-            _this.factory = new WindowFactory(BottomSheetImpl);
+            _this.factory = new WindowFactory(BottomSheetBaseComponent);
             _this.questionComponent = WindowQuestionComponent;
             return _this;
         }
@@ -6619,9 +6817,8 @@
         { type: language.LanguageService }
     ]; };
 
-    // import { WindowQuestionComponent } from '../window/component/window-question/window-question.component';
     var IMPORTS = [common$1.CommonModule, forms.FormsModule, i1$1.MatBottomSheetModule, button.MatButtonModule, LanguageModule];
-    var ENTRY_COMPONENTS = [];
+    var ENTRY_COMPONENTS = [BottomSheetCloseElementComponent];
     var DECLARATIONS = __spread(ENTRY_COMPONENTS);
     var EXPORTS = __spread(DECLARATIONS);
     var BottomSheetModule = /** @class */ (function () {
@@ -8314,7 +8511,7 @@
     CdkTablePaginableComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'vi-cdk-table-paginable',
-                    template: "<mat-table\n    class=\"flex-grow-1 vertical-scroll-only\"\n    matSort\n    [dataSource]=\"table?.table?.dataSource\"\n    [trackBy]=\"table.trackByFn\"\n    [matSortActive]=\"sortActive\"\n    [matSortDirection]=\"sortDirection\"\n    [class.mat-nav-list]=\"settings?.isInteractive\"\n    (matSortChange)=\"table.sortEventHandler($event)\"\n>\n    <ng-container *ngFor=\"let column of columns; trackBy: columnTrackBy\">\n        <ng-container [matColumnDef]=\"column.name\">\n            <mat-header-cell\n                class=\"px-2\"\n                mat-sort-header\n                [disableClear]=\"true\"\n                [disabled]=\"column.isDisableSort\"\n                [ngClass]=\"column.headerClassName\"\n                *matHeaderCellDef\n            >\n                <span [innerHTML]=\"column.headerId | viTranslate\"></span>\n            </mat-header-cell>\n\n            <mat-cell\n                class=\"px-2\"\n                (click)=\"cellClickHandler(row, column)\"\n                *matCellDef=\"let row\"\n                [ngClass]=\"row | viCdkTableColumnClassName: column\"\n                [ngStyle]=\"row | viCdkTableColumnStyleName: column\"\n            >\n                <span [ngClass]=\"column | viCdkTableCellClassName\" [vi-html-content-title]=\"row | viCdkTableColumnValue: column\"></span>\n            </mat-cell>\n        </ng-container>\n    </ng-container>\n\n    <mat-header-row *matHeaderRowDef=\"columnNames\"></mat-header-row>\n\n    <mat-row\n        class=\"mat-list-item\"\n        *matRowDef=\"let row; columns: columnNames\"\n        [ngClass]=\"row | viCdkTableRowClassName: rows:selectedRows\"\n        [ngStyle]=\"row | viCdkTableRowStyleName: rows:selectedRows\"\n        (click)=\"rowClicked.emit(row)\"\n    ></mat-row>\n</mat-table>\n\n<p class=\"p-3 flex-shrink-0 text-center mouse-inactive\" *ngIf=\"table?.length === 0\" [innerHTML]=\"settings?.noDataId | viTranslate\"></p>\n\n<mat-progress-bar class=\"flex-shrink-0 border transparent\" mode=\"indeterminate\" *ngIf=\"table?.isLoading\" style=\"margin-bottom: -1px\"></mat-progress-bar>\n\n<div class=\"paginator-container d-flex border-sm-top align-items-center justify-content-end flex-shrink-0\">\n    <ng-content></ng-content>\n    <mat-paginator\n        class=\"flex-shrink-0\"\n        [pageSize]=\"table?.pageSize\"\n        [pageIndex]=\"table?.pageIndex\"\n        [length]=\"table?.total\"\n        (page)=\"table?.pageEventHandler($event)\"\n        [pageSizeOptions]=\"paginator?.pageSizes\"\n        [showFirstLastButtons]=\"paginator?.showFirstLastButtons\"\n        [hidePageSize]=\"paginator?.hidePageSize\"\n        *ngIf=\"paginator && table?.length > 0\"\n    ></mat-paginator>\n</div>\n"
+                    template: "<mat-table\n    class=\"flex-grow-1 vertical-scroll-only\"\n    matSort\n    [dataSource]=\"table?.table?.dataSource\"\n    [trackBy]=\"table.trackByFn\"\n    [matSortActive]=\"sortActive\"\n    [matSortDirection]=\"sortDirection\"\n    [class.mat-nav-list]=\"settings?.isInteractive\"\n    (matSortChange)=\"table.sortEventHandler($event)\"\n>\n    <ng-container *ngFor=\"let column of columns; trackBy: columnTrackBy\">\n        <ng-container [matColumnDef]=\"column.name\">\n            <mat-header-cell\n                class=\"px-2\"\n                mat-sort-header\n                [disableClear]=\"true\"\n                [disabled]=\"column.isDisableSort\"\n                [ngClass]=\"column.headerClassName\"\n                *matHeaderCellDef\n            >\n                <span [innerHTML]=\"column.headerId | viTranslate\"></span>\n            </mat-header-cell>\n\n            <mat-cell\n                class=\"px-2\"\n                (click)=\"cellClickHandler(row, column)\"\n                *matCellDef=\"let row\"\n                [ngClass]=\"row | viCdkTableColumnClassName: column\"\n                [ngStyle]=\"row | viCdkTableColumnStyleName: column\"\n            >\n                <span [ngClass]=\"column | viCdkTableCellClassName\" [vi-html-content-title]=\"row | viCdkTableColumnValue: column\"></span>\n            </mat-cell>\n        </ng-container>\n    </ng-container>\n\n    <mat-header-row *matHeaderRowDef=\"columnNames\"></mat-header-row>\n\n    <mat-row\n        class=\"mat-list-item\"\n        *matRowDef=\"let row; columns: columnNames\"\n        [ngClass]=\"row | viCdkTableRowClassName: rows:selectedRows\"\n        [ngStyle]=\"row | viCdkTableRowStyleName: rows:selectedRows\"\n        (click)=\"rowClicked.emit(row)\"\n    ></mat-row>\n\n    <p class=\"p-3 flex-shrink-0 text-center mouse-inactive\" [vi-translate]=\"settings?.noDataId\" *matNoDataRow></p>\n    \n</mat-table>\n\n<!--\n<p class=\"p-3 flex-shrink-0 text-center mouse-inactive\" *ngIf=\"table?.length === 0\" [innerHTML]=\"settings?.noDataId | viTranslate\"></p>\n-->\n\n<mat-progress-bar class=\"flex-shrink-0 border\" [mode]=\"table?.isLoading ? 'indeterminate' : 'determinate'\"></mat-progress-bar>\n\n<div class=\"paginator-container d-flex align-items-center justify-content-end flex-shrink-0\">\n    <ng-content></ng-content>\n    <mat-paginator\n        class=\"flex-shrink-0\"\n        [pageSize]=\"table?.pageSize\"\n        [pageIndex]=\"table?.pageIndex\"\n        [length]=\"table?.total\"\n        (page)=\"table?.pageEventHandler($event)\"\n        [pageSizeOptions]=\"paginator?.pageSizes\"\n        [showFirstLastButtons]=\"paginator?.showFirstLastButtons\"\n        [hidePageSize]=\"paginator?.hidePageSize\"\n        *ngIf=\"paginator && table?.length > 0\"\n    ></mat-paginator>\n</div>\n"
                 },] }
     ];
     CdkTablePaginableComponent.ctorParameters = function () { return [
@@ -8341,7 +8538,7 @@
     CdkTableFilterableComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'vi-cdk-table-filterable',
-                    template: "<mat-table class=\"flex-grow-1 vertical-scroll-only\" matSort [dataSource]=\"table?.table?.dataSource\" [matSortActive]=\"sortActive\" [matSortDirection]=\"sortDirection\"\n    [class.mat-nav-list]=\"settings?.isInteractive\" (matSortChange)=\"table.sortEventHandler($event)\">\n  \n    <ng-container *ngFor=\"let column of columns;trackBy:columnTrackBy\">\n        <ng-container [matColumnDef]=\"column.name\">\n            <mat-header-cell class=\"px-2\" mat-sort-header [disableClear]=\"true\" [disabled]=\"column.isDisableSort\" [ngClass]=\"column.headerClassName\" \n                *matHeaderCellDef>\n                <span [innerHTML]=\"column.headerId | viTranslate\"></span>\n            </mat-header-cell>\n            <mat-cell class=\"px-2\" (click)=\"cellClickHandler(row, column)\" *matCellDef=\"let row\" \n                [ngClass]=\"row | viCdkTableColumnClassName: column\" [ngStyle]=\"row | viCdkTableColumnStyleName: column\" >\n                <span [ngClass]=\"column | viCdkTableCellClassName\" [vi-html-content-title]=\"row | viCdkTableColumnValue: column\"></span>\n            </mat-cell>\n        </ng-container>\n    </ng-container>\n\n    <mat-header-row *matHeaderRowDef=\"columnNames\"></mat-header-row>\n\n    <mat-row class=\"mat-list-item\" *matRowDef=\"let row; columns: columnNames\"\n        [ngClass]=\"row | viCdkTableRowClassName: rows : selectedRows\" [ngStyle]=\"row | viCdkTableRowStyleName: rows : selectedRows\"\n        (click)=\"rowClicked.emit(row)\"></mat-row>\n\n</mat-table>\n\n<p class=\"p-3 flex-shrink-0 text-center mouse-inactive\" *ngIf=\"!table?.isLoading && table?.length === 0\" [innerHTML]=\"settings?.noDataId | viTranslate\"></p>\n\n<mat-progress-bar class=\"flex-shrink-0 border transparent\" mode=\"indeterminate\" *ngIf=\"table?.isLoading\"\n    style=\"margin-bottom: -1px;\"></mat-progress-bar>\n"
+                    template: "<mat-table\n    class=\"flex-grow-1 vertical-scroll-only\"\n    matSort\n    [dataSource]=\"table?.table?.dataSource\"\n    [matSortActive]=\"sortActive\"\n    [matSortDirection]=\"sortDirection\"\n    [class.mat-nav-list]=\"settings?.isInteractive\"\n    (matSortChange)=\"table.sortEventHandler($event)\"\n>\n    <ng-container *ngFor=\"let column of columns; trackBy: columnTrackBy\">\n        <ng-container [matColumnDef]=\"column.name\">\n            <mat-header-cell\n                class=\"px-2\"\n                mat-sort-header\n                [disableClear]=\"true\"\n                [disabled]=\"column.isDisableSort\"\n                [ngClass]=\"column.headerClassName\"\n                *matHeaderCellDef\n            >\n                <span [innerHTML]=\"column.headerId | viTranslate\"></span>\n            </mat-header-cell>\n            <mat-cell\n                class=\"px-2\"\n                (click)=\"cellClickHandler(row, column)\"\n                *matCellDef=\"let row\"\n                [ngClass]=\"row | viCdkTableColumnClassName: column\"\n                [ngStyle]=\"row | viCdkTableColumnStyleName: column\"\n            >\n                <span [ngClass]=\"column | viCdkTableCellClassName\" [vi-html-content-title]=\"row | viCdkTableColumnValue: column\"></span>\n            </mat-cell>\n        </ng-container>\n    </ng-container>\n\n    <mat-header-row *matHeaderRowDef=\"columnNames\"></mat-header-row>\n\n    <mat-row\n        class=\"mat-list-item\"\n        *matRowDef=\"let row; columns: columnNames\"\n        [ngClass]=\"row | viCdkTableRowClassName: rows:selectedRows\"\n        [ngStyle]=\"row | viCdkTableRowStyleName: rows:selectedRows\"\n        (click)=\"rowClicked.emit(row)\"\n    ></mat-row>\n\n    <p class=\"p-3 flex-shrink-0 text-center mouse-inactive\" [vi-translate]=\"settings?.noDataId\" *matNoDataRow></p>\n</mat-table>\n\n<mat-progress-bar class=\"flex-shrink-0 border transparent\" [mode]=\"table?.isLoading ? 'indeterminate' : 'determinate'\"></mat-progress-bar>\n"
                 },] }
     ];
     CdkTableFilterableComponent.ctorParameters = function () { return [
@@ -10230,10 +10427,10 @@
                     _this.status = common.LoadableStatus.LOADING;
                 }
                 else if (event instanceof router.NavigationEnd || event instanceof router.NavigationCancel || event instanceof router.NavigationError) {
-                    _this.status = common.LoadableStatus.LOADED;
                     if (event instanceof router.NavigationEnd) {
                         _this._lastUrl = event.url;
                     }
+                    _this.status = common.LoadableStatus.LOADED;
                 }
             });
         };
@@ -10271,7 +10468,7 @@
                         this.isNeedUpdateExtras = false;
                         this.applyExtras(this.extrasToApply);
                     }
-                    this.observer.next(new observer.ObservableData(common.LoadableEvent.COMPLETE));
+                    this.observer.next(new observer.ObservableData(common.LoadableEvent.COMPLETE, { url: this.url, lastUrl: this.lastUrl }));
                     break;
             }
             if (newStatus === common.LoadableStatus.LOADED || newStatus === common.LoadableStatus.ERROR) {
@@ -10431,6 +10628,13 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(RouterBaseService.prototype, "lastUrlTree", {
+            get: function () {
+                return this.router.parseUrl(this.lastUrl);
+            },
+            enumerable: false,
+            configurable: true
+        });
         Object.defineProperty(RouterBaseService.prototype, "router", {
             get: function () {
                 return this._router;
@@ -10728,15 +10932,16 @@
     exports.ɵk = NotificationComponent;
     exports.ɵl = NotificationQuestionBaseComponent;
     exports.ɵm = BottomSheetModule;
-    exports.ɵn = CdkTableColumnValuePipe;
-    exports.ɵo = CdkTableColumnClassNamePipe;
-    exports.ɵp = CdkTableColumnStyleNamePipe;
-    exports.ɵq = CdkTableRowStyleNamePipe;
-    exports.ɵr = CdkTableRowClassNamePipe;
-    exports.ɵs = CdkTableCellClassNamePipe;
-    exports.ɵt = CdkTablePaginableComponent;
-    exports.ɵu = CdkTableFilterableComponent;
-    exports.ɵv = ValueAccessor;
+    exports.ɵn = BottomSheetCloseElementComponent;
+    exports.ɵo = CdkTableColumnValuePipe;
+    exports.ɵp = CdkTableColumnClassNamePipe;
+    exports.ɵq = CdkTableColumnStyleNamePipe;
+    exports.ɵr = CdkTableRowStyleNamePipe;
+    exports.ɵs = CdkTableRowClassNamePipe;
+    exports.ɵt = CdkTableCellClassNamePipe;
+    exports.ɵu = CdkTablePaginableComponent;
+    exports.ɵv = CdkTableFilterableComponent;
+    exports.ɵw = ValueAccessor;
 
     Object.defineProperty(exports, '__esModule', { value: true });