@trudb/tru-common-lib 0.1.969 → 0.1.970

package/fesm2022/trudb-tru-common-lib.mjs

@@ -3348,26 +3348,10 @@ const SELECT_ALL_ICON = `
   <svg height="20px" fill="#000000" width="20px" x="0px" y="0px" viewBox="0 -10 100 125" enable-background="new 0 0 100 100" xml:space="preserve"><g><path d="M99,99H2.598L99,2.598V99z"/></g></svg>
 `;
 const DESC_SORT_ICON = `
-<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <!-- "Z" shape in gray -->
-  <text x="2" y="8" font-family="Segoe UI, Arial" font-size="7" fill="#444" font-weight="bold">Z</text>
-  <!-- "A" shape in blue -->
-  <text x="2" y="15" font-family="Segoe UI, Arial" font-size="7" fill="#1976D2" font-weight="bold">A</text>
-  <!-- Downward arrow in gray -->
-  <path d="M12.5 3V14" stroke="#444" stroke-width="1.5" stroke-linecap="round"/>
-  <path d="M10.5 12L12.5 14L14.5 12" stroke="#444" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>
+  <svg height="20px" viewBox="0 -960 960 960" width="20px" fill="#e3e3e3"><path d="M480-96 216-360l51-51 177 177v-630h72v630l177-177 51 51L480-96Z"/></svg>
 `;
 const ASC_SORT_ICON = `
-<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <!-- A -->
-  <text x="2" y="8" font-family="Segoe UI, Arial" font-size="7" fill="#1976D2" font-weight="bold">A</text>
-  <!-- Z -->
-  <text x="2" y="16" font-family="Segoe UI, Arial" font-size="7" fill="#444" font-weight="bold">Z</text>
-  <!-- Down Arrow -->
-  <line x1="12.5" y1="3" x2="12.5" y2="14" stroke="#444" stroke-width="1.5" stroke-linecap="round"/>
-  <polyline points="10,12 12.5,15 15,12" fill="none" stroke="#444" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>
+  <svg height="20px" viewBox="0 -960 960 960" width="20px" fill="#e3e3e3"><path d="M444-144v-534l-57 57-51-51 144-144 144 144-51 51-57-57v534h-72Z"/></svg>
 `;
 const NO_SORT_ICON = `
 <svg height="20px" viewBox="0 -960 960 960" width="20px" fill="#949494">
@@ -5900,18 +5884,15 @@ var TruDataGridTypes;
 class TruDataGridHeader {
     headerRef;
     params;
-    ascSort = 'inactive';
-    descSort = 'inactive';
-    noSort = 'inactive';
+    ascSort = false;
+    descSort = false;
     isHovering = false;
     columnMenuIsOpen = false;
     showFilterMenu = false;
     filterIsActive = false;
     agInit(params) {
         this.params = params;
-        this.params.column.addEventListener('sortChanged', this.onSortChanged.bind(this));
         this.params.api.addEventListener('cellFocused', this.onCellFocused.bind(this));
-        this.onSortChanged();
     }
     getHeaderParams() {
         return this.params;
@@ -5919,31 +5900,6 @@ class TruDataGridHeader {
     refresh(params) {
         return false;
     }
-    onSortChanged() {
-        this.ascSort = this.descSort = this.noSort = 'inactive';
-        if (this.params.column.isSortAscending()) {
-            this.ascSort = 'active';
-        }
-        else if (this.params.column.isSortDescending()) {
-            this.descSort = 'active';
-        }
-        else {
-            this.noSort = 'active';
-        }
-    }
-    onSortRequested(event) {
-        var order = null;
-        if (this.params.column.isSortAscending()) {
-            order = 'desc';
-        }
-        else if (this.params.column.isSortDescending()) {
-            order = null;
-        }
-        else {
-            order = 'asc';
-        }
-        this.params.setSort(order, event.shiftKey);
-    }
     onSelectAllIconClicked() {
         this.params.api.selectAll();
     }
@@ -5968,6 +5924,8 @@ class TruDataGridHeader {
                 this.columnMenuIsOpen = false;
                 this.showFilterMenu = this.isHovering && this.params.api.getDisplayedRowCount() > 0 || this.columnMenuIsOpen || this.params.column.isFilterActive();
                 this.filterIsActive = this.params.column.isFilterActive();
+                this.ascSort = this.params.column.isSortAscending();
+                this.descSort = this.params.column.isSortDescending();
             });
             this.columnMenuIsOpen = true;
         }
@@ -5987,7 +5945,6 @@ class TruDataGridHeader {
         this.filterIsActive = this.params.column.isFilterActive();
     }
     ngOnDestroy() {
-        this.params.column.removeEventListener('sortChanged', this.onSortChanged.bind(this));
         this.params.api.removeEventListener('cellFocused', this.onCellFocused.bind(this));
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: TruDataGridHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
@@ -6000,8 +5957,10 @@ class TruDataGridHeader {
         </div>
         <div class="ag-header-control-filter-container" *ngIf="showFilterMenu">
           <span ref="eFilterButton" class="ag-filter-icon" (click)="onFilterMenuButtonClicked($event)">
-            <mat-icon class="ag-header-more" [svgIcon]="'more-icon'" *ngIf="!filterIsActive;"></mat-icon>
-            <mat-icon class="ag-header-filter" [svgIcon]="'filter-icon'" *ngIf="filterIsActive;"></mat-icon>
+            <mat-icon class="ag-header-more" [svgIcon]="'more-icon'" *ngIf="!filterIsActive && !ascSort && !descSort"></mat-icon>
+            <mat-icon class="ag-header-asc" [svgIcon]="'asc-sort-icon'" *ngIf="ascSort"></mat-icon>
+            <mat-icon class="ag-header-desc" [svgIcon]="'desc-sort-icon'" *ngIf="descSort"></mat-icon>
+            <mat-icon class="ag-header-filter" [svgIcon]="'filter-icon'" *ngIf="filterIsActive"></mat-icon>
           </span>
         </div>
       </div>
@@ -6019,8 +5978,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
         </div>
         <div class="ag-header-control-filter-container" *ngIf="showFilterMenu">
           <span ref="eFilterButton" class="ag-filter-icon" (click)="onFilterMenuButtonClicked($event)">
-            <mat-icon class="ag-header-more" [svgIcon]="'more-icon'" *ngIf="!filterIsActive;"></mat-icon>
-            <mat-icon class="ag-header-filter" [svgIcon]="'filter-icon'" *ngIf="filterIsActive;"></mat-icon>
+            <mat-icon class="ag-header-more" [svgIcon]="'more-icon'" *ngIf="!filterIsActive && !ascSort && !descSort"></mat-icon>
+            <mat-icon class="ag-header-asc" [svgIcon]="'asc-sort-icon'" *ngIf="ascSort"></mat-icon>
+            <mat-icon class="ag-header-desc" [svgIcon]="'desc-sort-icon'" *ngIf="descSort"></mat-icon>
+            <mat-icon class="ag-header-filter" [svgIcon]="'filter-icon'" *ngIf="filterIsActive"></mat-icon>
           </span>
         </div>
       </div>