@porscheinformatik/clr-addons 15.0.0 → 15.0.1

package/fesm2020/clr-addons.mjs

@@ -1,11 +1,11 @@
 import * as i0 from '@angular/core';
-import { Component, NgModule, Injectable, EventEmitter, Input, Output, Directive, ViewChild, ContentChildren, TemplateRef, ViewChildren, HostBinding, ElementRef, Renderer2, forwardRef, ContentChild, HostListener, InjectionToken, Inject, Optional } from '@angular/core';
+import { Component, NgModule, Injectable, EventEmitter, Input, Output, Directive, ViewChild, ContentChildren, TemplateRef, ViewChildren, HostBinding, ElementRef, Renderer2, forwardRef, ContentChild, Optional, HostListener, InjectionToken, Inject } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule, DOCUMENT } from '@angular/common';
 import * as i3$1 from '@angular/forms';
 import { FormsModule, NG_VALIDATORS, NgControl, NG_VALUE_ACCESSOR } from '@angular/forms';
 import * as i2 from '@clr/angular';
-import { ClarityModule, ClrFormsModule, ClrDropdown, ClrForm, ClrAlert, ClrAxis, ClrSide, ClrAlignment, ClrPopoverToggleService, ClrPopoverEventsService, ClrPopoverPositionService, ClrIconModule, ClrDropdownModule, ClrDatagridPagination, ClrDatagridFilter } from '@clr/angular';
+import { ClarityModule, ClrFormsModule, ClrDropdown, ClrForm, ClrAlert, ClrAxis, ClrSide, ClrAlignment, ClrPopoverToggleService, ClrPopoverEventsService, ClrPopoverPositionService, ClrIconModule, ClrDropdownModule, ClrDatagridSortOrder, DatagridPropertyComparator, ClrDatagridPagination, ClrDatagridFilter } from '@clr/angular';
 import { Subject, BehaviorSubject, timer, asyncScheduler, interval, of, ReplaySubject, takeUntil as takeUntil$1, delay } from 'rxjs';
 import { takeUntil, observeOn, take } from 'rxjs/operators';
 import * as i3 from '@angular/router';
@@ -3068,7 +3068,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImpor
         }] });
 
 /*
- * Copyright (c) 2018-2022 Porsche Informatik. All Rights Reserved.
+ * Copyright (c) 2018-2023 Porsche Informatik. All Rights Reserved.
  * This software is released under MIT license.
  * The full license information can be found in LICENSE in the root directory of this project.
  */
@@ -3151,7 +3151,7 @@ class ClrSearchField {
         }
     }
 }
-ClrSearchField.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrSearchField, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i3$1.NgControl }], target: i0.ɵɵFactoryTarget.Directive });
+ClrSearchField.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrSearchField, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i3$1.NgControl, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
 ClrSearchField.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: ClrSearchField, selector: "[clrSearch]", host: { properties: { "class.search-input": "true" } }, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrSearchField, decorators: [{
             type: Directive,
@@ -3159,7 +3159,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImpor
                     selector: '[clrSearch]',
                     host: { '[class.search-input]': 'true' },
                 }]
-        }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i3$1.NgControl }]; } });
+        }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i3$1.NgControl, decorators: [{
+                    type: Optional
+                }] }]; } });
 
 /*
  * Copyright (c) 2018-2019 Porsche Informatik. All Rights Reserved.
@@ -4649,8 +4651,10 @@ class StatePersistenceKeyDirective {
         const volatileDataState = this.getVolatileDataState();
         const localStorageState = this.getLocalStorageState();
         this.initFilter(volatileDataState);
+        this.initSorting(localStorageState);
         this.initDatagridPersister();
-        if (this.pagination && this.pagination.page) {
+        const paginationPersistenceEnabled = this.options.persistPagination ?? true;
+        if (this.pagination?.page && paginationPersistenceEnabled) {
             this.initPageSizePersister(localStorageState);
             this.initCurrentPage(volatileDataState);
         }
@@ -4685,7 +4689,8 @@ class StatePersistenceKeyDirective {
         }
     }
     initFilter(savedState) {
-        if (savedState.columns) {
+        const filterPersistenceEnabled = this.options.persistFilters ?? true;
+        if (savedState.columns && filterPersistenceEnabled) {
             Object.keys(savedState.columns).forEach(prop => {
                 const filter = this.getFilter(prop);
                 if (filter) {
@@ -4697,13 +4702,40 @@ class StatePersistenceKeyDirective {
             });
         }
     }
+    initSorting(savedState) {
+        const sortPersistenceEnabled = this.options.persistSort ?? true;
+        if (savedState.sortBy && sortPersistenceEnabled) {
+            this.datagrid.columns.forEach(column => {
+                if (this.getSortProperty(column.sortBy) === savedState.sortBy) {
+                    column.sortOrder = savedState.sortReverse ? ClrDatagridSortOrder.DESC : ClrDatagridSortOrder.ASC;
+                }
+                else {
+                    column.sortOrder = ClrDatagridSortOrder.UNSORTED;
+                }
+            });
+        }
+    }
     initDatagridPersister() {
         // delay is needed, as onDestroy the filters emit empty values.
         // So delay it to the end of the current cycle, so the directive is also destroyed before it gets the next values
         this.datagrid.refresh.pipe(delay(0), takeUntil(this.destroy$)).subscribe(dgState => {
-            const state = this.getVolatileDataState();
+            this.persistFiltersAndCurrentPage(dgState);
+            this.persistSorting(dgState);
+            if (this.canShowPaginationDescription) {
+                this.updatePaginationDescription();
+            }
+        });
+        this.datagrid.items.change.pipe(takeUntil(this.destroy$)).subscribe(() => this.updatePaginationDescription());
+    }
+    persistFiltersAndCurrentPage(dgState) {
+        const filterPersistenceEnabled = this.options.persistFilters ?? true;
+        const paginationPersistenceEnabled = this.options.persistPagination ?? true;
+        const state = this.getVolatileDataState();
+        state.columns = state.columns || {};
+        if (paginationPersistenceEnabled) {
             state.currentPage = dgState.page?.current;
-            state.columns = state.columns || {};
+        }
+        if (filterPersistenceEnabled) {
             Object.keys(state.columns).forEach(prop => (state.columns[prop].filterValue = undefined));
             dgState.filters?.forEach(filter => {
                 const property = this.getFilterPropertyName(filter);
@@ -4712,12 +4744,17 @@ class StatePersistenceKeyDirective {
                     state.columns[property].filterValue = this.enrichFilterValue(filter);
                 }
             });
-            (this.useLocalStoreOnly ? localStorage : sessionStorage).setItem(this.options.key, JSON.stringify(state));
-            if (this.canShowPaginationDescription) {
-                this.updatePaginationDescription();
-            }
-        });
-        this.datagrid.items.change.pipe(takeUntil(this.destroy$)).subscribe(() => this.updatePaginationDescription());
+        }
+        (this.useLocalStoreOnly ? localStorage : sessionStorage).setItem(this.options.key, JSON.stringify(state));
+    }
+    persistSorting(dgState) {
+        const sortPersistenceEnabled = this.options.persistSort ?? true;
+        if (sortPersistenceEnabled) {
+            const state = this.getLocalStorageState();
+            state.sortBy = this.getSortProperty(dgState.sort?.by);
+            state.sortReverse = dgState.sort?.reverse;
+            localStorage.setItem(this.options.key, JSON.stringify(state));
+        }
     }
     /**
      * Pagination description must be set by this directive,
@@ -4784,6 +4821,17 @@ class StatePersistenceKeyDirective {
         const filterWithProp = filter;
         return (filterWithProp.property?.prop || filterWithProp.property);
     }
+    getSortProperty(sortBy) {
+        if (sortBy) {
+            if (typeof sortBy === 'string') {
+                return sortBy;
+            }
+            if (sortBy instanceof DatagridPropertyComparator) {
+                return sortBy.prop;
+            }
+        }
+        return undefined;
+    }
     ngOnDestroy() {
         this.destroy$.next();
         this.destroy$.complete();
@@ -4825,7 +4873,8 @@ class ColumnHiddenStatePersistenceDirective {
         this.destroy$ = new Subject();
     }
     ngOnInit() {
-        if (this.statePersistenceKey?.options.key && this.columnDirective?.clrDgField) {
+        const persistenceEnabled = this.statePersistenceKey?.options?.persistHiddenColumns ?? true;
+        if (this.statePersistenceKey?.options.key && this.columnDirective?.clrDgField && persistenceEnabled) {
             /* set hidden states from local storage (if existing) */
             this.initHiddenState();
             /* listen to state changes and persist in local storage */