ngx-st-tables 17.0.5 → 17.0.8

package/assets/base-table.scss

@@ -16,7 +16,7 @@
   .clear {
     padding: 0;
 
-    i {
+    mat-icon {
       height: 20px;
       width: 20px;
       font-size: 20px;
@@ -131,7 +131,7 @@ table {
               color: #000;
             }
 
-            i {
+            mat-icon {
               color: #333;
             }
           }

package/esm2022/lib/components/local-table/local-table.component.mjs

@@ -226,11 +226,11 @@ export class LocalTableComponent {
         this.setDisplayedColumns();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: LocalTableComponent, deps: [{ token: i1.LocalTableService }, { token: i0.ChangeDetectorRef }, { token: i2.Router }, { token: i2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: LocalTableComponent, selector: "ngx-st-local-table", inputs: { tableSettings: "tableSettings", globalSearchSettings: "globalSearchSettings", pageSize: "pageSize", allowPickColumns: "allowPickColumns", configurationsSettings: "configurationsSettings", localStorageName: "localStorageName", bindSearchToUrl: "bindSearchToUrl", columns: "columns", data: "data" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }], ngImport: i0, template: "<div class=\"local-table\">\n  <div class=\"row align-items-center\">\n    @if (configurationsSettings || allowPickColumns) {\n      <div class=\"col row align-items-center\" style=\"padding: 0\">\n        @if (allowPickColumns) {\n          <div class=\"col-auto\" style=\"padding: 0\">\n            <button\n              mat-icon-button\n              class=\"col-auto\"\n              [matMenuTriggerFor]=\"columnsMenu\"\n            >\n              <mat-icon> view_week </mat-icon>\n            </button>\n            <mat-menu #columnsMenu=\"matMenu\" xPosition=\"after\">\n              @for (column of columnsArray; track column) {\n                @if (!column.notShowInColumnPick) {\n                  <div mat-menu-item>\n                    <mat-checkbox\n                      [(ngModel)]=\"column.visible\"\n                      (ngModelChange)=\"columnVisibleChanged(column)\"\n                      style=\"margin-top: 5px\"\n                      (click)=\"$event.stopPropagation()\"\n                    >\n                      {{ column.translateColumnName }}\n                    </mat-checkbox>\n                  </div>\n                }\n              }\n            </mat-menu>\n          </div>\n        }\n        @if (configurationsSettings) {\n          <st-configurations\n            [configurationsSettings]=\"configurationsSettings\"\n            [configurations]=\"configurations\"\n            [initSelectedConfig]=\"initConfig\"\n            (createNewConfig)=\"newConfigCreated($event)\"\n            (removeConfig)=\"configRemoved($event)\"\n            (changeConfig)=\"configChanged($event)\"\n          ></st-configurations>\n        }\n      </div>\n    }\n\n    @if (globalSearchSettings?.show) {\n      <div class=\"col\" style=\"padding: 0; margin-bottom: -15px\">\n        <mat-form-field>\n          <mat-label>{{ globalSearchSettings?.label || 'Search' }}</mat-label>\n          <input matInput (keyup)=\"applySearch()\" [(ngModel)]=\"searchModel\" />\n          <button\n            matSuffix\n            mat-icon-button\n            aria-label=\"Clear\"\n            (click)=\"clearSearch()\"\n          >\n            <mat-icon style=\"font-size: 22px\">close</mat-icon>\n          </button>\n        </mat-form-field>\n      </div>\n    }\n  </div>\n\n  <table\n    [ngClass]=\"{ 'no-hover': !tableSettings?.rowClickAction }\"\n    mat-table\n    [dataSource]=\"tableSource\"\n    matSort\n  >\n    @for (column of displayedColumns; track column) {\n      <ng-container [matColumnDef]=\"column\">\n        <th\n          mat-header-cell\n          *matHeaderCellDef\n          style=\"{{\n            columns[column].width ? 'width:' + columns[column].width : ''\n          }}\"\n          mat-sort-header\n          [disabled]=\"!columns[column].sort\"\n        >\n          {{ columns[column].translateColumnName }}\n          @if (columns[column].search) {\n            <mat-icon\n              class=\"search-icon\"\n              [matMenuTriggerFor]=\"menu\"\n              (click)=\"$event.stopPropagation()\"\n            >\n              search\n            </mat-icon>\n          }\n          <mat-menu #menu=\"matMenu\" xPosition=\"before\">\n            <mat-form-field class=\"col\">\n              <mat-label>{{\n                columns[column].searchLabel || 'Search'\n              }}</mat-label>\n              <input\n                matInput\n                (keyup)=\"applySearch()\"\n                [(ngModel)]=\"searchModel\"\n                (click)=\"$event.stopPropagation()\"\n              />\n              <button\n                matSuffix\n                mat-icon-button\n                aria-label=\"Clear\"\n                (click)=\"searchModel = ''\"\n              >\n                <mat-icon>close</mat-icon>\n              </button>\n            </mat-form-field>\n          </mat-menu>\n        </th>\n        <td\n          mat-cell\n          *matCellDef=\"let element\"\n          style=\"{{\n            columns[column].width ? 'width:' + columns[column].width : ''\n          }}\"\n        >\n          @if (columns[column].actions && columns[column].actions!.length > 0) {\n            <div\n              class=\"actions-container\"\n              style=\"overflow-y: hidden\"\n              [ngClass]=\"{ 'justify-content-end': columns[column].flexRight }\"\n            >\n              @for (action of columns[column].actions; track action) {\n                @if (checkIfActionVisible(element, action)) {\n                  @if (!action.url && action.action) {\n                    <button\n                      style=\"padding: 7px 7px; width: 40px; height: 40px\"\n                      class=\"col-auto\"\n                      mat-icon-button\n                      type=\"button\"\n                      matTooltip=\"{{ action.tooltipName || '' }}\"\n                      [matTooltipDisabled]=\"!!!action.tooltipName\"\n                      (click)=\"action.action(element)\"\n                    >\n                      <mat-icon>{{ action.iconName }}</mat-icon>\n                    </button>\n                  }\n                  @if (action.url) {\n                    <a [routerLink]=\"action.url\">\n                      <button\n                        class=\"col-auto\"\n                        mat-icon-button\n                        type=\"button\"\n                        matTooltip=\"{{ action.tooltipName || '' }}\"\n                        [matTooltipDisabled]=\"!!!action.tooltipName\"\n                      >\n                        <mat-icon>{{ action.iconName }}</mat-icon>\n                      </button>\n                    </a>\n                  }\n                }\n              }\n            </div>\n          }\n          @if (!columns[column].actions) {\n            @if (columns[column].translateValue) {\n              <p style=\"margin: 0; padding: 0\">\n                {{ columns[column].translateValue![element[column]] || '' }}\n              </p>\n            }\n            @if (!columns[column].translateValue) {\n              @if (!columns[column].type || columns[column].type === 'string') {\n                <p style=\"margin: 0; padding: 0\">{{ element[column] }}</p>\n              }\n              @if (columns[column].type === 'date') {\n                <p style=\"margin: 0; padding: 0\">\n                  {{ element[column] | stDateTimeFormatPipe }}\n                </p>\n              }\n            }\n          }\n        </td>\n      </ng-container>\n    }\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n    <tr\n      mat-row\n      *matRowDef=\"let row; columns: displayedColumns\"\n      (click)=\"\n        tableSettings?.rowClickAction ? tableSettings.rowClickAction(row) : null\n      \"\n    ></tr>\n  </table>\n  <mat-paginator\n    [pageIndex]=\"pageIndex\"\n    [pageSizeOptions]=\"[5, 10, 15, 20, 25]\"\n    (page)=\"pageChanged($event)\"\n    [showFirstLastButtons]=\"true\"\n  ></mat-paginator>\n</div>\n", styles: ["", ".search-form button{height:40px}.search-form mat-form-field:first-child{padding-left:0}.search-form mat-form-field:last-child{padding-right:0}.search-form .clear{padding:0}.search-form .clear i{height:20px;width:20px;font-size:20px;cursor:pointer}table{width:100%;box-shadow:none}table th.mat-mdc-header-cell,table td.mat-mdc-cell,table td.mat-mdc-footer-cell{padding:0}table th.mat-mdc-header-cell:first-of-type,table td.mat-mdc-cell:first-of-type,table td.mat-mdc-footer-cell:first-of-type{padding-left:12px}table th.mat-mdc-header-cell:last-of-type,table td.mat-mdc-cell:last-of-type,table td.mat-mdc-footer-cell:last-of-type{padding-right:12px}table::ng-deep thead tr{background-color:#fff9c4;height:40px!important}table::ng-deep thead tr th{border-color:#fdd835;color:#0000008a;font-size:12px}table::ng-deep tbody>tr{cursor:pointer}table::ng-deep tbody>tr.active{background-color:#a5d6a7}table::ng-deep tbody>tr.active td{border-bottom-color:#81c784!important}table::ng-deep tbody>tr:hover{background-color:#a5d6a7!important}table::ng-deep tbody>tr:hover td{border-bottom-color:#81c784!important}table::ng-deep tbody>tr.disabled{cursor:not-allowed}table::ng-deep tbody>tr.disabled:hover{background-color:inherit!important}table::ng-deep tbody>tr.detail-row{height:0;cursor:default}table::ng-deep tbody>tr.detail-row:hover{background-color:transparent}table::ng-deep tbody>tr.detail-row .element-detail{overflow:hidden;display:flex}table::ng-deep tbody>tr.detail-row .element-detail p{padding:20px 0;margin-bottom:0;white-space:pre-wrap}table::ng-deep tbody>tr td i.active-row{color:#1b5e20;font-weight:700;font-size:25px;height:25px;width:25px;margin-top:2px}table::ng-deep tbody>tr td>div{max-height:200px;overflow:hidden;overflow-y:auto}table::ng-deep tbody>tr td a button{color:#000}table::ng-deep tbody>tr td a i{color:#333}table::ng-deep .mat-column-active{width:48px}table.no-hover::ng-deep tbody tr{cursor:default}table.no-hover::ng-deep tbody tr.active{background-color:transparent!important}table.no-hover::ng-deep tbody tr.active td{border-bottom-color:#0000001f!important}table.no-hover::ng-deep tbody tr:hover{background-color:transparent!important}table.no-hover::ng-deep tbody tr:hover td{border-bottom-color:#0000001f!important}table.admin-table::ng-deep .actions-cell{width:100px}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i6.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i6.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i6.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i6.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i6.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i6.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i6.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i6.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i6.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i7.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i8.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i9.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i10.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i11.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i11.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i11.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i12.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i12.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i13.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i13.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i13.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i14.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i15.ConfigurationsComponent, selector: "st-configurations[configurationsSettings]", inputs: ["configurationsSettings", "configurations", "initSelectedConfig"], outputs: ["createNewConfig", "removeConfig", "changeConfig"] }, { kind: "pipe", type: i16.DateTimeFormatPipe, name: "stDateTimeFormatPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: LocalTableComponent, selector: "ngx-st-local-table", inputs: { tableSettings: "tableSettings", globalSearchSettings: "globalSearchSettings", pageSize: "pageSize", allowPickColumns: "allowPickColumns", configurationsSettings: "configurationsSettings", localStorageName: "localStorageName", bindSearchToUrl: "bindSearchToUrl", columns: "columns", data: "data" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }], ngImport: i0, template: "<div class=\"local-table\">\n  <div class=\"row align-items-center\">\n    @if (configurationsSettings || allowPickColumns) {\n      <div class=\"col row align-items-center\" style=\"padding: 0\">\n        @if (allowPickColumns) {\n          <div class=\"col-auto\" style=\"padding: 0\">\n            <button\n              mat-icon-button\n              class=\"col-auto\"\n              [matMenuTriggerFor]=\"columnsMenu\"\n            >\n              <mat-icon> view_week </mat-icon>\n            </button>\n            <mat-menu #columnsMenu=\"matMenu\" xPosition=\"after\">\n              @for (column of columnsArray; track column) {\n                @if (!column.notShowInColumnPick) {\n                  <div mat-menu-item>\n                    <mat-checkbox\n                      [(ngModel)]=\"column.visible\"\n                      (ngModelChange)=\"columnVisibleChanged(column)\"\n                      style=\"margin-top: 5px\"\n                      (click)=\"$event.stopPropagation()\"\n                    >\n                      {{ column.translateColumnName }}\n                    </mat-checkbox>\n                  </div>\n                }\n              }\n            </mat-menu>\n          </div>\n        }\n        @if (configurationsSettings) {\n          <st-configurations\n            [configurationsSettings]=\"configurationsSettings\"\n            [configurations]=\"configurations\"\n            [initSelectedConfig]=\"initConfig\"\n            (createNewConfig)=\"newConfigCreated($event)\"\n            (removeConfig)=\"configRemoved($event)\"\n            (changeConfig)=\"configChanged($event)\"\n          ></st-configurations>\n        }\n      </div>\n    }\n\n    @if (globalSearchSettings?.show) {\n      <div class=\"col\" style=\"padding: 0; margin-bottom: -15px\">\n        <mat-form-field>\n          <mat-label>{{ globalSearchSettings?.label || 'Search' }}</mat-label>\n          <input matInput (keyup)=\"applySearch()\" [(ngModel)]=\"searchModel\" />\n          <button\n            matSuffix\n            mat-icon-button\n            aria-label=\"Clear\"\n            (click)=\"clearSearch()\"\n          >\n            <mat-icon style=\"font-size: 22px\">close</mat-icon>\n          </button>\n        </mat-form-field>\n      </div>\n    }\n  </div>\n\n  <table\n    [ngClass]=\"{ 'no-hover': !tableSettings?.rowClickAction }\"\n    mat-table\n    [dataSource]=\"tableSource\"\n    matSort\n  >\n    @for (column of displayedColumns; track column) {\n      <ng-container [matColumnDef]=\"column\">\n        <th\n          mat-header-cell\n          *matHeaderCellDef\n          style=\"{{\n            columns[column].width ? 'width:' + columns[column].width : ''\n          }}\"\n          mat-sort-header\n          [disabled]=\"!columns[column].sort\"\n        >\n          {{ columns[column].translateColumnName }}\n          @if (columns[column].search) {\n            <mat-icon\n              class=\"search-icon\"\n              [matMenuTriggerFor]=\"menu\"\n              (click)=\"$event.stopPropagation()\"\n            >\n              search\n            </mat-icon>\n          }\n          <mat-menu #menu=\"matMenu\" xPosition=\"before\">\n            <mat-form-field class=\"col\">\n              <mat-label>{{\n                columns[column].searchLabel || 'Search'\n              }}</mat-label>\n              <input\n                matInput\n                (keyup)=\"applySearch()\"\n                [(ngModel)]=\"searchModel\"\n                (click)=\"$event.stopPropagation()\"\n              />\n              <button\n                matSuffix\n                mat-icon-button\n                aria-label=\"Clear\"\n                (click)=\"searchModel = ''\"\n              >\n                <mat-icon>close</mat-icon>\n              </button>\n            </mat-form-field>\n          </mat-menu>\n        </th>\n        <td\n          mat-cell\n          *matCellDef=\"let element\"\n          style=\"{{\n            columns[column].width ? 'width:' + columns[column].width : ''\n          }}\"\n        >\n          @if (columns[column].actions && columns[column].actions!.length > 0) {\n            <div\n              class=\"actions-container\"\n              style=\"overflow-y: hidden\"\n              [ngClass]=\"{ 'justify-content-end': columns[column].flexRight }\"\n            >\n              @for (action of columns[column].actions; track action) {\n                @if (checkIfActionVisible(element, action)) {\n                  @if (!action.url && action.action) {\n                    <button\n                      style=\"padding: 7px 7px; width: 40px; height: 40px\"\n                      class=\"col-auto\"\n                      mat-icon-button\n                      type=\"button\"\n                      matTooltip=\"{{ action.tooltipName || '' }}\"\n                      [matTooltipDisabled]=\"!!!action.tooltipName\"\n                      (click)=\"action.action(element)\"\n                    >\n                      <mat-icon>{{ action.iconName }}</mat-icon>\n                    </button>\n                  }\n                  @if (action.url) {\n                    <a [routerLink]=\"action.url\">\n                      <button\n                        class=\"col-auto\"\n                        mat-icon-button\n                        type=\"button\"\n                        matTooltip=\"{{ action.tooltipName || '' }}\"\n                        [matTooltipDisabled]=\"!!!action.tooltipName\"\n                      >\n                        <mat-icon>{{ action.iconName }}</mat-icon>\n                      </button>\n                    </a>\n                  }\n                }\n              }\n            </div>\n          }\n          @if (!columns[column].actions) {\n            @if (columns[column].translateValue) {\n              <p style=\"margin: 0; padding: 0\">\n                {{ columns[column].translateValue![element[column]] || '' }}\n              </p>\n            }\n            @if (!columns[column].translateValue) {\n              @if (!columns[column].type || columns[column].type === 'string') {\n                <p style=\"margin: 0; padding: 0\">{{ element[column] }}</p>\n              }\n              @if (columns[column].type === 'date') {\n                <p style=\"margin: 0; padding: 0\">\n                  {{ element[column] | stDateTimeFormatPipe }}\n                </p>\n              }\n            }\n          }\n        </td>\n      </ng-container>\n    }\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n    <tr\n      mat-row\n      *matRowDef=\"let row; columns: displayedColumns\"\n      (click)=\"\n        tableSettings?.rowClickAction ? tableSettings.rowClickAction(row) : null\n      \"\n    ></tr>\n  </table>\n  <mat-paginator\n    [pageIndex]=\"pageIndex\"\n    [pageSizeOptions]=\"[5, 10, 15, 20, 25]\"\n    (page)=\"pageChanged($event)\"\n    [showFirstLastButtons]=\"true\"\n  ></mat-paginator>\n</div>\n", styles: ["", ".search-form button{height:40px}.search-form mat-form-field:first-child{padding-left:0}.search-form mat-form-field:last-child{padding-right:0}.search-form .clear{padding:0}.search-form .clear mat-icon{height:20px;width:20px;font-size:20px;cursor:pointer}table{width:100%;box-shadow:none}table th.mat-mdc-header-cell,table td.mat-mdc-cell,table td.mat-mdc-footer-cell{padding:0}table th.mat-mdc-header-cell:first-of-type,table td.mat-mdc-cell:first-of-type,table td.mat-mdc-footer-cell:first-of-type{padding-left:12px}table th.mat-mdc-header-cell:last-of-type,table td.mat-mdc-cell:last-of-type,table td.mat-mdc-footer-cell:last-of-type{padding-right:12px}table::ng-deep thead tr{background-color:#fff9c4;height:40px!important}table::ng-deep thead tr th{border-color:#fdd835;color:#0000008a;font-size:12px}table::ng-deep tbody>tr{cursor:pointer}table::ng-deep tbody>tr.active{background-color:#a5d6a7}table::ng-deep tbody>tr.active td{border-bottom-color:#81c784!important}table::ng-deep tbody>tr:hover{background-color:#a5d6a7!important}table::ng-deep tbody>tr:hover td{border-bottom-color:#81c784!important}table::ng-deep tbody>tr.disabled{cursor:not-allowed}table::ng-deep tbody>tr.disabled:hover{background-color:inherit!important}table::ng-deep tbody>tr.detail-row{height:0;cursor:default}table::ng-deep tbody>tr.detail-row:hover{background-color:transparent}table::ng-deep tbody>tr.detail-row .element-detail{overflow:hidden;display:flex}table::ng-deep tbody>tr.detail-row .element-detail p{padding:20px 0;margin-bottom:0;white-space:pre-wrap}table::ng-deep tbody>tr td i.active-row{color:#1b5e20;font-weight:700;font-size:25px;height:25px;width:25px;margin-top:2px}table::ng-deep tbody>tr td>div{max-height:200px;overflow:hidden;overflow-y:auto}table::ng-deep tbody>tr td a button{color:#000}table::ng-deep tbody>tr td a mat-icon{color:#333}table::ng-deep .mat-column-active{width:48px}table.no-hover::ng-deep tbody tr{cursor:default}table.no-hover::ng-deep tbody tr.active{background-color:transparent!important}table.no-hover::ng-deep tbody tr.active td{border-bottom-color:#0000001f!important}table.no-hover::ng-deep tbody tr:hover{background-color:transparent!important}table.no-hover::ng-deep tbody tr:hover td{border-bottom-color:#0000001f!important}table.admin-table::ng-deep .actions-cell{width:100px}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i6.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i6.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i6.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i6.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i6.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i6.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i6.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i6.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i6.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i7.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i8.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i9.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i10.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i11.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i11.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i11.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i12.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i12.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i13.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i13.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i13.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i14.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i15.ConfigurationsComponent, selector: "st-configurations[configurationsSettings]", inputs: ["configurationsSettings", "configurations", "initSelectedConfig"], outputs: ["createNewConfig", "removeConfig", "changeConfig"] }, { kind: "pipe", type: i16.DateTimeFormatPipe, name: "stDateTimeFormatPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: LocalTableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ngx-st-local-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"local-table\">\n  <div class=\"row align-items-center\">\n    @if (configurationsSettings || allowPickColumns) {\n      <div class=\"col row align-items-center\" style=\"padding: 0\">\n        @if (allowPickColumns) {\n          <div class=\"col-auto\" style=\"padding: 0\">\n            <button\n              mat-icon-button\n              class=\"col-auto\"\n              [matMenuTriggerFor]=\"columnsMenu\"\n            >\n              <mat-icon> view_week </mat-icon>\n            </button>\n            <mat-menu #columnsMenu=\"matMenu\" xPosition=\"after\">\n              @for (column of columnsArray; track column) {\n                @if (!column.notShowInColumnPick) {\n                  <div mat-menu-item>\n                    <mat-checkbox\n                      [(ngModel)]=\"column.visible\"\n                      (ngModelChange)=\"columnVisibleChanged(column)\"\n                      style=\"margin-top: 5px\"\n                      (click)=\"$event.stopPropagation()\"\n                    >\n                      {{ column.translateColumnName }}\n                    </mat-checkbox>\n                  </div>\n                }\n              }\n            </mat-menu>\n          </div>\n        }\n        @if (configurationsSettings) {\n          <st-configurations\n            [configurationsSettings]=\"configurationsSettings\"\n            [configurations]=\"configurations\"\n            [initSelectedConfig]=\"initConfig\"\n            (createNewConfig)=\"newConfigCreated($event)\"\n            (removeConfig)=\"configRemoved($event)\"\n            (changeConfig)=\"configChanged($event)\"\n          ></st-configurations>\n        }\n      </div>\n    }\n\n    @if (globalSearchSettings?.show) {\n      <div class=\"col\" style=\"padding: 0; margin-bottom: -15px\">\n        <mat-form-field>\n          <mat-label>{{ globalSearchSettings?.label || 'Search' }}</mat-label>\n          <input matInput (keyup)=\"applySearch()\" [(ngModel)]=\"searchModel\" />\n          <button\n            matSuffix\n            mat-icon-button\n            aria-label=\"Clear\"\n            (click)=\"clearSearch()\"\n          >\n            <mat-icon style=\"font-size: 22px\">close</mat-icon>\n          </button>\n        </mat-form-field>\n      </div>\n    }\n  </div>\n\n  <table\n    [ngClass]=\"{ 'no-hover': !tableSettings?.rowClickAction }\"\n    mat-table\n    [dataSource]=\"tableSource\"\n    matSort\n  >\n    @for (column of displayedColumns; track column) {\n      <ng-container [matColumnDef]=\"column\">\n        <th\n          mat-header-cell\n          *matHeaderCellDef\n          style=\"{{\n            columns[column].width ? 'width:' + columns[column].width : ''\n          }}\"\n          mat-sort-header\n          [disabled]=\"!columns[column].sort\"\n        >\n          {{ columns[column].translateColumnName }}\n          @if (columns[column].search) {\n            <mat-icon\n              class=\"search-icon\"\n              [matMenuTriggerFor]=\"menu\"\n              (click)=\"$event.stopPropagation()\"\n            >\n              search\n            </mat-icon>\n          }\n          <mat-menu #menu=\"matMenu\" xPosition=\"before\">\n            <mat-form-field class=\"col\">\n              <mat-label>{{\n                columns[column].searchLabel || 'Search'\n              }}</mat-label>\n              <input\n                matInput\n                (keyup)=\"applySearch()\"\n                [(ngModel)]=\"searchModel\"\n                (click)=\"$event.stopPropagation()\"\n              />\n              <button\n                matSuffix\n                mat-icon-button\n                aria-label=\"Clear\"\n                (click)=\"searchModel = ''\"\n              >\n                <mat-icon>close</mat-icon>\n              </button>\n            </mat-form-field>\n          </mat-menu>\n        </th>\n        <td\n          mat-cell\n          *matCellDef=\"let element\"\n          style=\"{{\n            columns[column].width ? 'width:' + columns[column].width : ''\n          }}\"\n        >\n          @if (columns[column].actions && columns[column].actions!.length > 0) {\n            <div\n              class=\"actions-container\"\n              style=\"overflow-y: hidden\"\n              [ngClass]=\"{ 'justify-content-end': columns[column].flexRight }\"\n            >\n              @for (action of columns[column].actions; track action) {\n                @if (checkIfActionVisible(element, action)) {\n                  @if (!action.url && action.action) {\n                    <button\n                      style=\"padding: 7px 7px; width: 40px; height: 40px\"\n                      class=\"col-auto\"\n                      mat-icon-button\n                      type=\"button\"\n                      matTooltip=\"{{ action.tooltipName || '' }}\"\n                      [matTooltipDisabled]=\"!!!action.tooltipName\"\n                      (click)=\"action.action(element)\"\n                    >\n                      <mat-icon>{{ action.iconName }}</mat-icon>\n                    </button>\n                  }\n                  @if (action.url) {\n                    <a [routerLink]=\"action.url\">\n                      <button\n                        class=\"col-auto\"\n                        mat-icon-button\n                        type=\"button\"\n                        matTooltip=\"{{ action.tooltipName || '' }}\"\n                        [matTooltipDisabled]=\"!!!action.tooltipName\"\n                      >\n                        <mat-icon>{{ action.iconName }}</mat-icon>\n                      </button>\n                    </a>\n                  }\n                }\n              }\n            </div>\n          }\n          @if (!columns[column].actions) {\n            @if (columns[column].translateValue) {\n              <p style=\"margin: 0; padding: 0\">\n                {{ columns[column].translateValue![element[column]] || '' }}\n              </p>\n            }\n            @if (!columns[column].translateValue) {\n              @if (!columns[column].type || columns[column].type === 'string') {\n                <p style=\"margin: 0; padding: 0\">{{ element[column] }}</p>\n              }\n              @if (columns[column].type === 'date') {\n                <p style=\"margin: 0; padding: 0\">\n                  {{ element[column] | stDateTimeFormatPipe }}\n                </p>\n              }\n            }\n          }\n        </td>\n      </ng-container>\n    }\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n    <tr\n      mat-row\n      *matRowDef=\"let row; columns: displayedColumns\"\n      (click)=\"\n        tableSettings?.rowClickAction ? tableSettings.rowClickAction(row) : null\n      \"\n    ></tr>\n  </table>\n  <mat-paginator\n    [pageIndex]=\"pageIndex\"\n    [pageSizeOptions]=\"[5, 10, 15, 20, 25]\"\n    (page)=\"pageChanged($event)\"\n    [showFirstLastButtons]=\"true\"\n  ></mat-paginator>\n</div>\n", styles: [".search-form button{height:40px}.search-form mat-form-field:first-child{padding-left:0}.search-form mat-form-field:last-child{padding-right:0}.search-form .clear{padding:0}.search-form .clear i{height:20px;width:20px;font-size:20px;cursor:pointer}table{width:100%;box-shadow:none}table th.mat-mdc-header-cell,table td.mat-mdc-cell,table td.mat-mdc-footer-cell{padding:0}table th.mat-mdc-header-cell:first-of-type,table td.mat-mdc-cell:first-of-type,table td.mat-mdc-footer-cell:first-of-type{padding-left:12px}table th.mat-mdc-header-cell:last-of-type,table td.mat-mdc-cell:last-of-type,table td.mat-mdc-footer-cell:last-of-type{padding-right:12px}table::ng-deep thead tr{background-color:#fff9c4;height:40px!important}table::ng-deep thead tr th{border-color:#fdd835;color:#0000008a;font-size:12px}table::ng-deep tbody>tr{cursor:pointer}table::ng-deep tbody>tr.active{background-color:#a5d6a7}table::ng-deep tbody>tr.active td{border-bottom-color:#81c784!important}table::ng-deep tbody>tr:hover{background-color:#a5d6a7!important}table::ng-deep tbody>tr:hover td{border-bottom-color:#81c784!important}table::ng-deep tbody>tr.disabled{cursor:not-allowed}table::ng-deep tbody>tr.disabled:hover{background-color:inherit!important}table::ng-deep tbody>tr.detail-row{height:0;cursor:default}table::ng-deep tbody>tr.detail-row:hover{background-color:transparent}table::ng-deep tbody>tr.detail-row .element-detail{overflow:hidden;display:flex}table::ng-deep tbody>tr.detail-row .element-detail p{padding:20px 0;margin-bottom:0;white-space:pre-wrap}table::ng-deep tbody>tr td i.active-row{color:#1b5e20;font-weight:700;font-size:25px;height:25px;width:25px;margin-top:2px}table::ng-deep tbody>tr td>div{max-height:200px;overflow:hidden;overflow-y:auto}table::ng-deep tbody>tr td a button{color:#000}table::ng-deep tbody>tr td a i{color:#333}table::ng-deep .mat-column-active{width:48px}table.no-hover::ng-deep tbody tr{cursor:default}table.no-hover::ng-deep tbody tr.active{background-color:transparent!important}table.no-hover::ng-deep tbody tr.active td{border-bottom-color:#0000001f!important}table.no-hover::ng-deep tbody tr:hover{background-color:transparent!important}table.no-hover::ng-deep tbody tr:hover td{border-bottom-color:#0000001f!important}table.admin-table::ng-deep .actions-cell{width:100px}\n"] }]
+            args: [{ selector: 'ngx-st-local-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"local-table\">\n  <div class=\"row align-items-center\">\n    @if (configurationsSettings || allowPickColumns) {\n      <div class=\"col row align-items-center\" style=\"padding: 0\">\n        @if (allowPickColumns) {\n          <div class=\"col-auto\" style=\"padding: 0\">\n            <button\n              mat-icon-button\n              class=\"col-auto\"\n              [matMenuTriggerFor]=\"columnsMenu\"\n            >\n              <mat-icon> view_week </mat-icon>\n            </button>\n            <mat-menu #columnsMenu=\"matMenu\" xPosition=\"after\">\n              @for (column of columnsArray; track column) {\n                @if (!column.notShowInColumnPick) {\n                  <div mat-menu-item>\n                    <mat-checkbox\n                      [(ngModel)]=\"column.visible\"\n                      (ngModelChange)=\"columnVisibleChanged(column)\"\n                      style=\"margin-top: 5px\"\n                      (click)=\"$event.stopPropagation()\"\n                    >\n                      {{ column.translateColumnName }}\n                    </mat-checkbox>\n                  </div>\n                }\n              }\n            </mat-menu>\n          </div>\n        }\n        @if (configurationsSettings) {\n          <st-configurations\n            [configurationsSettings]=\"configurationsSettings\"\n            [configurations]=\"configurations\"\n            [initSelectedConfig]=\"initConfig\"\n            (createNewConfig)=\"newConfigCreated($event)\"\n            (removeConfig)=\"configRemoved($event)\"\n            (changeConfig)=\"configChanged($event)\"\n          ></st-configurations>\n        }\n      </div>\n    }\n\n    @if (globalSearchSettings?.show) {\n      <div class=\"col\" style=\"padding: 0; margin-bottom: -15px\">\n        <mat-form-field>\n          <mat-label>{{ globalSearchSettings?.label || 'Search' }}</mat-label>\n          <input matInput (keyup)=\"applySearch()\" [(ngModel)]=\"searchModel\" />\n          <button\n            matSuffix\n            mat-icon-button\n            aria-label=\"Clear\"\n            (click)=\"clearSearch()\"\n          >\n            <mat-icon style=\"font-size: 22px\">close</mat-icon>\n          </button>\n        </mat-form-field>\n      </div>\n    }\n  </div>\n\n  <table\n    [ngClass]=\"{ 'no-hover': !tableSettings?.rowClickAction }\"\n    mat-table\n    [dataSource]=\"tableSource\"\n    matSort\n  >\n    @for (column of displayedColumns; track column) {\n      <ng-container [matColumnDef]=\"column\">\n        <th\n          mat-header-cell\n          *matHeaderCellDef\n          style=\"{{\n            columns[column].width ? 'width:' + columns[column].width : ''\n          }}\"\n          mat-sort-header\n          [disabled]=\"!columns[column].sort\"\n        >\n          {{ columns[column].translateColumnName }}\n          @if (columns[column].search) {\n            <mat-icon\n              class=\"search-icon\"\n              [matMenuTriggerFor]=\"menu\"\n              (click)=\"$event.stopPropagation()\"\n            >\n              search\n            </mat-icon>\n          }\n          <mat-menu #menu=\"matMenu\" xPosition=\"before\">\n            <mat-form-field class=\"col\">\n              <mat-label>{{\n                columns[column].searchLabel || 'Search'\n              }}</mat-label>\n              <input\n                matInput\n                (keyup)=\"applySearch()\"\n                [(ngModel)]=\"searchModel\"\n                (click)=\"$event.stopPropagation()\"\n              />\n              <button\n                matSuffix\n                mat-icon-button\n                aria-label=\"Clear\"\n                (click)=\"searchModel = ''\"\n              >\n                <mat-icon>close</mat-icon>\n              </button>\n            </mat-form-field>\n          </mat-menu>\n        </th>\n        <td\n          mat-cell\n          *matCellDef=\"let element\"\n          style=\"{{\n            columns[column].width ? 'width:' + columns[column].width : ''\n          }}\"\n        >\n          @if (columns[column].actions && columns[column].actions!.length > 0) {\n            <div\n              class=\"actions-container\"\n              style=\"overflow-y: hidden\"\n              [ngClass]=\"{ 'justify-content-end': columns[column].flexRight }\"\n            >\n              @for (action of columns[column].actions; track action) {\n                @if (checkIfActionVisible(element, action)) {\n                  @if (!action.url && action.action) {\n                    <button\n                      style=\"padding: 7px 7px; width: 40px; height: 40px\"\n                      class=\"col-auto\"\n                      mat-icon-button\n                      type=\"button\"\n                      matTooltip=\"{{ action.tooltipName || '' }}\"\n                      [matTooltipDisabled]=\"!!!action.tooltipName\"\n                      (click)=\"action.action(element)\"\n                    >\n                      <mat-icon>{{ action.iconName }}</mat-icon>\n                    </button>\n                  }\n                  @if (action.url) {\n                    <a [routerLink]=\"action.url\">\n                      <button\n                        class=\"col-auto\"\n                        mat-icon-button\n                        type=\"button\"\n                        matTooltip=\"{{ action.tooltipName || '' }}\"\n                        [matTooltipDisabled]=\"!!!action.tooltipName\"\n                      >\n                        <mat-icon>{{ action.iconName }}</mat-icon>\n                      </button>\n                    </a>\n                  }\n                }\n              }\n            </div>\n          }\n          @if (!columns[column].actions) {\n            @if (columns[column].translateValue) {\n              <p style=\"margin: 0; padding: 0\">\n                {{ columns[column].translateValue![element[column]] || '' }}\n              </p>\n            }\n            @if (!columns[column].translateValue) {\n              @if (!columns[column].type || columns[column].type === 'string') {\n                <p style=\"margin: 0; padding: 0\">{{ element[column] }}</p>\n              }\n              @if (columns[column].type === 'date') {\n                <p style=\"margin: 0; padding: 0\">\n                  {{ element[column] | stDateTimeFormatPipe }}\n                </p>\n              }\n            }\n          }\n        </td>\n      </ng-container>\n    }\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n    <tr\n      mat-row\n      *matRowDef=\"let row; columns: displayedColumns\"\n      (click)=\"\n        tableSettings?.rowClickAction ? tableSettings.rowClickAction(row) : null\n      \"\n    ></tr>\n  </table>\n  <mat-paginator\n    [pageIndex]=\"pageIndex\"\n    [pageSizeOptions]=\"[5, 10, 15, 20, 25]\"\n    (page)=\"pageChanged($event)\"\n    [showFirstLastButtons]=\"true\"\n  ></mat-paginator>\n</div>\n", styles: [".search-form button{height:40px}.search-form mat-form-field:first-child{padding-left:0}.search-form mat-form-field:last-child{padding-right:0}.search-form .clear{padding:0}.search-form .clear mat-icon{height:20px;width:20px;font-size:20px;cursor:pointer}table{width:100%;box-shadow:none}table th.mat-mdc-header-cell,table td.mat-mdc-cell,table td.mat-mdc-footer-cell{padding:0}table th.mat-mdc-header-cell:first-of-type,table td.mat-mdc-cell:first-of-type,table td.mat-mdc-footer-cell:first-of-type{padding-left:12px}table th.mat-mdc-header-cell:last-of-type,table td.mat-mdc-cell:last-of-type,table td.mat-mdc-footer-cell:last-of-type{padding-right:12px}table::ng-deep thead tr{background-color:#fff9c4;height:40px!important}table::ng-deep thead tr th{border-color:#fdd835;color:#0000008a;font-size:12px}table::ng-deep tbody>tr{cursor:pointer}table::ng-deep tbody>tr.active{background-color:#a5d6a7}table::ng-deep tbody>tr.active td{border-bottom-color:#81c784!important}table::ng-deep tbody>tr:hover{background-color:#a5d6a7!important}table::ng-deep tbody>tr:hover td{border-bottom-color:#81c784!important}table::ng-deep tbody>tr.disabled{cursor:not-allowed}table::ng-deep tbody>tr.disabled:hover{background-color:inherit!important}table::ng-deep tbody>tr.detail-row{height:0;cursor:default}table::ng-deep tbody>tr.detail-row:hover{background-color:transparent}table::ng-deep tbody>tr.detail-row .element-detail{overflow:hidden;display:flex}table::ng-deep tbody>tr.detail-row .element-detail p{padding:20px 0;margin-bottom:0;white-space:pre-wrap}table::ng-deep tbody>tr td i.active-row{color:#1b5e20;font-weight:700;font-size:25px;height:25px;width:25px;margin-top:2px}table::ng-deep tbody>tr td>div{max-height:200px;overflow:hidden;overflow-y:auto}table::ng-deep tbody>tr td a button{color:#000}table::ng-deep tbody>tr td a mat-icon{color:#333}table::ng-deep .mat-column-active{width:48px}table.no-hover::ng-deep tbody tr{cursor:default}table.no-hover::ng-deep tbody tr.active{background-color:transparent!important}table.no-hover::ng-deep tbody tr.active td{border-bottom-color:#0000001f!important}table.no-hover::ng-deep tbody tr:hover{background-color:transparent!important}table.no-hover::ng-deep tbody tr:hover td{border-bottom-color:#0000001f!important}table.admin-table::ng-deep .actions-cell{width:100px}\n"] }]
         }], ctorParameters: () => [{ type: i1.LocalTableService }, { type: i0.ChangeDetectorRef }, { type: i2.Router }, { type: i2.ActivatedRoute }], propDecorators: { paginator: [{
                 type: ViewChild,
                 args: [MatPaginator]

package/esm2022/lib/components/material-table/material-table-caption/material-table-caption.component.mjs

@@ -0,0 +1,137 @@
+import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, } from '@angular/core';
+import { FormControl } from '@angular/forms';
+import { StBaseService, StSubscribeDestroyComponent, } from 'ngx-st-base-functions';
+import { debounceTime, distinctUntilChanged, filter, take, takeUntil, } from 'rxjs/operators';
+import { MaterialTableFilterDialogComponent, } from './material-table-filter-dialog/material-table-filter-dialog.component';
+import { MaterialTableOrderColumnDialogComponent } from './material-table-order-column-dialog/material-table-order-column-dialog.component';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/material/dialog";
+import * as i2 from "@angular/common";
+import * as i3 from "@angular/material/button";
+import * as i4 from "@angular/material/icon";
+import * as i5 from "@angular/material/form-field";
+import * as i6 from "@angular/material/input";
+import * as i7 from "@angular/forms";
+import * as i8 from "@angular/material/select";
+import * as i9 from "@angular/material/core";
+import * as i10 from "@angular/material/badge";
+export class MaterialTableCaptionComponent extends StSubscribeDestroyComponent {
+    set columns(data) {
+        this._columns = data ? data : [];
+        this.updateColumns();
+    }
+    get columns() {
+        return this._columns;
+    }
+    constructor(dialog) {
+        super();
+        this.dialog = dialog;
+        this.allowPickColumns = true;
+        this.allowReorderColumns = true;
+        this.initGlobalSearch = '';
+        this.initFilters = {};
+        this._columns = [];
+        this.captionDataChanged = new EventEmitter();
+        this.showFilterButton = false;
+        this.selectedColumns = new FormControl([]);
+        this.globalSearch = new FormControl('');
+        this.activeFiltersCount = 0;
+        this.columnsOrder = [];
+        this.filters = {};
+    }
+    ngOnInit() {
+        this.globalSearch.setValue(this.initGlobalSearch || '');
+        this.filters = this.initFilters || {};
+        this.setActiveFiltersCount();
+        this.selectedColumns.valueChanges
+            .pipe(takeUntil(this.ngDestroyed$), distinctUntilChanged((prev, curr) => JSON.stringify(prev) === JSON.stringify(curr)), debounceTime(400))
+            .subscribe(value => {
+            console.log('selectedColumnsChanged');
+            this.emitCaptionDataChanged();
+        });
+        this.globalSearch.valueChanges
+            .pipe(takeUntil(this.ngDestroyed$), distinctUntilChanged((prev, curr) => JSON.stringify(prev) === JSON.stringify(curr)), debounceTime(400))
+            .subscribe(value => {
+            console.log('globalSearchChanged');
+            this.emitCaptionDataChanged();
+        });
+    }
+    openFilterDialog() {
+        this.dialog
+            .open(MaterialTableFilterDialogComponent, {
+            data: {
+                initFilters: this.filters,
+                columns: this.columns,
+            },
+            maxWidth: '450px',
+            width: '100%',
+            autoFocus: false,
+        })
+            .afterClosed()
+            .pipe(take(1), filter(StBaseService.notNull))
+            .subscribe((res) => {
+            this.filters = res.filters;
+            this.setActiveFiltersCount();
+            console.log('filtersChanged');
+            this.emitCaptionDataChanged();
+        });
+    }
+    openReorderColumnsDialog() {
+        this.dialog
+            .open(MaterialTableOrderColumnDialogComponent, {
+            data: {
+                columns: this.columns,
+            },
+            maxWidth: '450px',
+            width: '100%',
+            autoFocus: false,
+        })
+            .afterClosed()
+            .pipe(take(1), filter(StBaseService.notNull))
+            .subscribe((result) => {
+            this.columnsOrder = result.columnsOrder;
+            console.log('columnsOrderChanged');
+            this.emitCaptionDataChanged();
+        });
+    }
+    emitCaptionDataChanged() {
+        this.captionDataChanged.emit({
+            selectedColumns: this.selectedColumns.value || [],
+            globalSearch: this.globalSearch.value || '',
+            columnsOrder: this.columnsOrder || [],
+            filters: this.filters,
+        });
+    }
+    updateColumns() {
+        const columnsFilters = this._columns.filter(column => column.filter);
+        this.showFilterButton = columnsFilters.length > 0;
+        this.selectedColumns.setValue(this._columns.filter(col => col.visible).map(col => col.field) || []);
+        this.columnsOrder = this._columns.map(col => col.field) || [];
+    }
+    setActiveFiltersCount() {
+        const filtersKeys = Object.keys(this.filters);
+        this.activeFiltersCount =
+            filtersKeys.filter(key => this.filters[key]).length || 0;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MaterialTableCaptionComponent, deps: [{ token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: MaterialTableCaptionComponent, selector: "st-material-table-caption", inputs: { globalSearchSettings: "globalSearchSettings", allowPickColumns: "allowPickColumns", allowReorderColumns: "allowReorderColumns", initGlobalSearch: "initGlobalSearch", initFilters: "initFilters", columns: "columns" }, outputs: { captionDataChanged: "captionDataChanged" }, usesInheritance: true, ngImport: i0, template: "<div\r\n  class=\"st-material-table-caption row align-items-center\"\r\n  [ngClass]=\"{\r\n    'justify-content-between': allowPickColumns && globalSearchSettings?.show,\r\n    'justify-content-end': !allowPickColumns && globalSearchSettings?.show\r\n  }\"\r\n>\r\n  @if (allowPickColumns) {\r\n    <div class=\"col-auto d-flex align-items-center\">\r\n      <mat-form-field appearance=\"outline\">\r\n        <mat-select [formControl]=\"selectedColumns\" multiple>\r\n          <mat-select-trigger>\r\n            {{ selectedColumns.value ? selectedColumns.value.length : 0 }}\r\n            columns selected\r\n          </mat-select-trigger>\r\n          @for (column of columns; track column.field) {\r\n            <mat-option [value]=\"column.field\">{{\r\n              column.translateColumnName || column.field\r\n            }}</mat-option>\r\n          }\r\n        </mat-select>\r\n      </mat-form-field>\r\n\r\n      @if (allowReorderColumns) {\r\n        <button mat-icon-button (click)=\"openReorderColumnsDialog()\">\r\n          <mat-icon class=\"reorder-icon\">low_priority</mat-icon>\r\n        </button>\r\n      }\r\n    </div>\r\n  }\r\n\r\n  @if (globalSearchSettings?.show) {\r\n    <div class=\"col-auto d-flex align-items-center\">\r\n      @if (showFilterButton) {\r\n        <button mat-icon-button (click)=\"openFilterDialog()\">\r\n          <mat-icon\r\n            [matBadge]=\"activeFiltersCount\"\r\n            [matBadgeHidden]=\"!activeFiltersCount\"\r\n            [matBadgeSize]=\"'small'\"\r\n            matBadgePosition=\"before\"\r\n            >filter_alt</mat-icon\r\n          >\r\n        </button>\r\n      }\r\n\r\n      <mat-form-field appearance=\"outline\">\r\n        <input\r\n          matInput\r\n          [formControl]=\"globalSearch\"\r\n          [placeholder]=\"globalSearchSettings?.label || 'Global Search'\"\r\n        />\r\n        <button\r\n          matSuffix\r\n          mat-icon-button\r\n          aria-label=\"Clear\"\r\n          (click)=\"globalSearch.setValue('')\"\r\n        >\r\n          <mat-icon style=\"font-size: 22px\">close</mat-icon>\r\n        </button>\r\n      </mat-form-field>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".st-material-table-caption{width:100%;margin-top:5px}.st-material-table-caption .reorder-icon{transform:scaleX(-1) rotate(90deg)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i8.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i8.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i9.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i10.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MaterialTableCaptionComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'st-material-table-caption', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  class=\"st-material-table-caption row align-items-center\"\r\n  [ngClass]=\"{\r\n    'justify-content-between': allowPickColumns && globalSearchSettings?.show,\r\n    'justify-content-end': !allowPickColumns && globalSearchSettings?.show\r\n  }\"\r\n>\r\n  @if (allowPickColumns) {\r\n    <div class=\"col-auto d-flex align-items-center\">\r\n      <mat-form-field appearance=\"outline\">\r\n        <mat-select [formControl]=\"selectedColumns\" multiple>\r\n          <mat-select-trigger>\r\n            {{ selectedColumns.value ? selectedColumns.value.length : 0 }}\r\n            columns selected\r\n          </mat-select-trigger>\r\n          @for (column of columns; track column.field) {\r\n            <mat-option [value]=\"column.field\">{{\r\n              column.translateColumnName || column.field\r\n            }}</mat-option>\r\n          }\r\n        </mat-select>\r\n      </mat-form-field>\r\n\r\n      @if (allowReorderColumns) {\r\n        <button mat-icon-button (click)=\"openReorderColumnsDialog()\">\r\n          <mat-icon class=\"reorder-icon\">low_priority</mat-icon>\r\n        </button>\r\n      }\r\n    </div>\r\n  }\r\n\r\n  @if (globalSearchSettings?.show) {\r\n    <div class=\"col-auto d-flex align-items-center\">\r\n      @if (showFilterButton) {\r\n        <button mat-icon-button (click)=\"openFilterDialog()\">\r\n          <mat-icon\r\n            [matBadge]=\"activeFiltersCount\"\r\n            [matBadgeHidden]=\"!activeFiltersCount\"\r\n            [matBadgeSize]=\"'small'\"\r\n            matBadgePosition=\"before\"\r\n            >filter_alt</mat-icon\r\n          >\r\n        </button>\r\n      }\r\n\r\n      <mat-form-field appearance=\"outline\">\r\n        <input\r\n          matInput\r\n          [formControl]=\"globalSearch\"\r\n          [placeholder]=\"globalSearchSettings?.label || 'Global Search'\"\r\n        />\r\n        <button\r\n          matSuffix\r\n          mat-icon-button\r\n          aria-label=\"Clear\"\r\n          (click)=\"globalSearch.setValue('')\"\r\n        >\r\n          <mat-icon style=\"font-size: 22px\">close</mat-icon>\r\n        </button>\r\n      </mat-form-field>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".st-material-table-caption{width:100%;margin-top:5px}.st-material-table-caption .reorder-icon{transform:scaleX(-1) rotate(90deg)}\n"] }]
+        }], ctorParameters: () => [{ type: i1.MatDialog }], propDecorators: { globalSearchSettings: [{
+                type: Input
+            }], allowPickColumns: [{
+                type: Input
+            }], allowReorderColumns: [{
+                type: Input
+            }], initGlobalSearch: [{
+                type: Input
+            }], initFilters: [{
+                type: Input
+            }], columns: [{
+                type: Input
+            }], captionDataChanged: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWF0ZXJpYWwtdGFibGUtY2FwdGlvbi5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtc3QtdGFibGVzL3NyYy9saWIvY29tcG9uZW50cy9tYXRlcmlhbC10YWJsZS9tYXRlcmlhbC10YWJsZS1jYXB0aW9uL21hdGVyaWFsLXRhYmxlLWNhcHRpb24uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXN0LXRhYmxlcy9zcmMvbGliL2NvbXBvbmVudHMvbWF0ZXJpYWwtdGFibGUvbWF0ZXJpYWwtdGFibGUtY2FwdGlvbi9tYXRlcmlhbC10YWJsZS1jYXB0aW9uLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFlBQVksRUFDWixLQUFLLEVBRUwsTUFBTSxHQUNQLE1BQU0sZUFBZSxDQUFDO0FBR3ZCLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUM3QyxPQUFPLEVBQ0wsYUFBYSxFQUNiLDJCQUEyQixHQUM1QixNQUFNLHVCQUF1QixDQUFDO0FBQy9CLE9BQU8sRUFDTCxZQUFZLEVBQ1osb0JBQW9CLEVBQ3BCLE1BQU0sRUFDTixJQUFJLEVBQ0osU0FBUyxHQUNWLE1BQU0sZ0JBQWdCLENBQUM7QUFFeEIsT0FBTyxFQUNMLGtDQUFrQyxHQUVuQyxNQUFNLHVFQUF1RSxDQUFDO0FBQy9FLE9BQU8sRUFBRSx1Q0FBdUMsRUFBRSxNQUFNLG1GQUFtRixDQUFDOzs7Ozs7Ozs7Ozs7QUFRNUksTUFBTSxPQUFPLDZCQUNYLFNBQVEsMkJBQTJCO0lBa0JuQyxJQUNJLE9BQU8sQ0FBQyxJQUFzQztRQUNoRCxJQUFJLENBQUMsUUFBUSxHQUFHLElBQUksQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUM7UUFDakMsSUFBSSxDQUFDLGFBQWEsRUFBRSxDQUFDO0lBQ3ZCLENBQUM7SUFFRCxJQUFJLE9BQU87UUFDVCxPQUFPLElBQUksQ0FBQyxRQUFRLENBQUM7SUFDdkIsQ0FBQztJQWlCRCxZQUFvQixNQUFpQjtRQUNuQyxLQUFLLEVBQUUsQ0FBQztRQURVLFdBQU0sR0FBTixNQUFNLENBQVc7UUFwQ3JDLHFCQUFnQixHQUFZLElBQUksQ0FBQztRQUdqQyx3QkFBbUIsR0FBWSxJQUFJLENBQUM7UUFHcEMscUJBQWdCLEdBQUcsRUFBRSxDQUFDO1FBR3RCLGdCQUFXLEdBQThCLEVBQUUsQ0FBQztRQVlwQyxhQUFRLEdBQXFDLEVBQUUsQ0FBQztRQUd4RCx1QkFBa0IsR0FBc0MsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUUzRSxxQkFBZ0IsR0FBRyxLQUFLLENBQUM7UUFFekIsb0JBQWUsR0FBRyxJQUFJLFdBQVcsQ0FBVyxFQUFFLENBQUMsQ0FBQztRQUNoRCxpQkFBWSxHQUFHLElBQUksV0FBVyxDQUFDLEVBQUUsQ0FBQyxDQUFDO1FBRW5DLHVCQUFrQixHQUFHLENBQUMsQ0FBQztRQUVmLGlCQUFZLEdBQWEsRUFBRSxDQUFDO1FBQzVCLFlBQU8sR0FBOEIsRUFBRSxDQUFDO0lBSWhELENBQUM7SUFFRCxRQUFRO1FBQ04sSUFBSSxDQUFDLFlBQVksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLGdCQUFnQixJQUFJLEVBQUUsQ0FBQyxDQUFDO1FBQ3hELElBQUksQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLFdBQVcsSUFBSSxFQUFFLENBQUM7UUFDdEMsSUFBSSxDQUFDLHFCQUFxQixFQUFFLENBQUM7UUFFN0IsSUFBSSxDQUFDLGVBQWUsQ0FBQyxZQUFZO2FBQzlCLElBQUksQ0FDSCxTQUFTLENBQUMsSUFBSSxDQUFDLFlBQVksQ0FBQyxFQUM1QixvQkFBb0IsQ0FDbEIsQ0FBQyxJQUFJLEVBQUUsSUFBSSxFQUFFLEVBQUUsQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxLQUFLLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLENBQzlELEVBQ0QsWUFBWSxDQUFDLEdBQUcsQ0FBQyxDQUNsQjthQUNBLFNBQVMsQ0FBQyxLQUFLLENBQUMsRUFBRTtZQUNqQixPQUFPLENBQUMsR0FBRyxDQUFDLHdCQUF3QixDQUFDLENBQUM7WUFDdEMsSUFBSSxDQUFDLHNCQUFzQixFQUFFLENBQUM7UUFDaEMsQ0FBQyxDQUFDLENBQUM7UUFFTCxJQUFJLENBQUMsWUFBWSxDQUFDLFlBQVk7YUFDM0IsSUFBSSxDQUNILFNBQVMsQ0FBQyxJQUFJLENBQUMsWUFBWSxDQUFDLEVBQzVCLG9CQUFvQixDQUNsQixDQUFDLElBQUksRUFBRSxJQUFJLEVBQUUsRUFBRSxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLEtBQUssSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsQ0FDOUQsRUFDRCxZQUFZLENBQUMsR0FBRyxDQUFDLENBQ2xCO2FBQ0EsU0FBUyxDQUFDLEtBQUssQ0FBQyxFQUFFO1lBQ2pCLE9BQU8sQ0FBQyxHQUFHLENBQUMscUJBQXFCLENBQUMsQ0FBQztZQUNuQyxJQUFJLENBQUMsc0JBQXNCLEVBQUUsQ0FBQztRQUNoQyxDQUFDLENBQUMsQ0FBQztJQUNQLENBQUM7SUFFRCxnQkFBZ0I7UUFDZCxJQUFJLENBQUMsTUFBTTthQUNSLElBQUksQ0FBQyxrQ0FBa0MsRUFBRTtZQUN4QyxJQUFJLEVBQUU7Z0JBQ0osV0FBVyxFQUFFLElBQUksQ0FBQyxPQUFPO2dCQUN6QixPQUFPLEVBQUUsSUFBSSxDQUFDLE9BQU87YUFDdEI7WUFDRCxRQUFRLEVBQUUsT0FBTztZQUNqQixLQUFLLEVBQUUsTUFBTTtZQUNiLFNBQVMsRUFBRSxLQUFLO1NBQ2pCLENBQUM7YUFDRCxXQUFXLEVBQUU7YUFDYixJQUFJLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxFQUFFLE1BQU0sQ0FBQyxhQUFhLENBQUMsT0FBTyxDQUFDLENBQUM7YUFDNUMsU0FBUyxDQUFDLENBQUMsR0FBb0MsRUFBRSxFQUFFO1lBQ2xELElBQUksQ0FBQyxPQUFPLEdBQUcsR0FBRyxDQUFDLE9BQU8sQ0FBQztZQUMzQixJQUFJLENBQUMscUJBQXFCLEVBQUUsQ0FBQztZQUM3QixPQUFPLENBQUMsR0FBRyxDQUFDLGdCQUFnQixDQUFDLENBQUM7WUFDOUIsSUFBSSxDQUFDLHNCQUFzQixFQUFFLENBQUM7UUFDaEMsQ0FBQyxDQUFDLENBQUM7SUFDUCxDQUFDO0lBRUQsd0JBQXdCO1FBQ3RCLElBQUksQ0FBQyxNQUFNO2FBQ1IsSUFBSSxDQUFDLHVDQUF1QyxFQUFFO1lBQzdDLElBQUksRUFBRTtnQkFDSixPQUFPLEVBQUUsSUFBSSxDQUFDLE9BQU87YUFDdEI7WUFDRCxRQUFRLEVBQUUsT0FBTztZQUNqQixLQUFLLEVBQUUsTUFBTTtZQUNiLFNBQVMsRUFBRSxLQUFLO1NBQ2pCLENBQUM7YUFDRCxXQUFXLEVBQUU7YUFDYixJQUFJLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxFQUFFLE1BQU0sQ0FBQyxhQUFhLENBQUMsT0FBTyxDQUFDLENBQUM7YUFDNUMsU0FBUyxDQUFDLENBQUMsTUFBa0MsRUFBRSxFQUFFO1lBQ2hELElBQUksQ0FBQyxZQUFZLEdBQUcsTUFBTSxDQUFDLFlBQVksQ0FBQztZQUN4QyxPQUFPLENBQUMsR0FBRyxDQUFDLHFCQUFxQixDQUFDLENBQUM7WUFDbkMsSUFBSSxDQUFDLHNCQUFzQixFQUFFLENBQUM7UUFDaEMsQ0FBQyxDQUFDLENBQUM7SUFDUCxDQUFDO0lBRU8sc0JBQXNCO1FBQzVCLElBQUksQ0FBQyxrQkFBa0IsQ0FBQyxJQUFJLENBQUM7WUFDM0IsZUFBZSxFQUFFLElBQUksQ0FBQyxlQUFlLENBQUMsS0FBSyxJQUFJLEVBQUU7WUFDakQsWUFBWSxFQUFFLElBQUksQ0FBQyxZQUFZLENBQUMsS0FBSyxJQUFJLEVBQUU7WUFDM0MsWUFBWSxFQUFFLElBQUksQ0FBQyxZQUFZLElBQUksRUFBRTtZQUNyQyxPQUFPLEVBQUUsSUFBSSxDQUFDLE9BQU87U0FDdEIsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVPLGFBQWE7UUFDbkIsTUFBTSxjQUFjLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxNQUFNLENBQUMsTUFBTSxDQUFDLEVBQUUsQ0FBQyxNQUFNLENBQUMsTUFBTSxDQUFDLENBQUM7UUFDckUsSUFBSSxDQUFDLGdCQUFnQixHQUFHLGNBQWMsQ0FBQyxNQUFNLEdBQUcsQ0FBQyxDQUFDO1FBQ2xELElBQUksQ0FBQyxlQUFlLENBQUMsUUFBUSxDQUMzQixJQUFJLENBQUMsUUFBUSxDQUFDLE1BQU0sQ0FBQyxHQUFHLENBQUMsRUFBRSxDQUFDLEdBQUcsQ0FBQyxPQUFPLENBQUMsQ0FBQyxHQUFHLENBQUMsR0FBRyxDQUFDLEVBQUUsQ0FBQyxHQUFHLENBQUMsS0FBSyxDQUFDLElBQUksRUFBRSxDQUNyRSxDQUFDO1FBQ0YsSUFBSSxDQUFDLFlBQVksR0FBRyxJQUFJLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxHQUFHLENBQUMsRUFBRSxDQUFDLEdBQUcsQ0FBQyxLQUFLLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDaEUsQ0FBQztJQUVPLHFCQUFxQjtRQUMzQixNQUFNLFdBQVcsR0FBRyxNQUFNLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztRQUM5QyxJQUFJLENBQUMsa0JBQWtCO1lBQ3JCLFdBQVcsQ0FBQyxNQUFNLENBQUMsR0FBRyxDQUFDLEVBQUUsQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsTUFBTSxJQUFJLENBQUMsQ0FBQztJQUM3RCxDQUFDOytHQTlJVSw2QkFBNkI7bUdBQTdCLDZCQUE2QixpWENuQzFDLDZwRUErREE7OzRGRDVCYSw2QkFBNkI7a0JBTnpDLFNBQVM7K0JBQ0UsMkJBQTJCLG1CQUdwQix1QkFBdUIsQ0FBQyxNQUFNOzhFQU8vQyxvQkFBb0I7c0JBRG5CLEtBQUs7Z0JBSU4sZ0JBQWdCO3NCQURmLEtBQUs7Z0JBSU4sbUJBQW1CO3NCQURsQixLQUFLO2dCQUlOLGdCQUFnQjtzQkFEZixLQUFLO2dCQUlOLFdBQVc7c0JBRFYsS0FBSztnQkFJRixPQUFPO3NCQURWLEtBQUs7Z0JBYU4sa0JBQWtCO3NCQURqQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcclxuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcclxuICBDb21wb25lbnQsXHJcbiAgRXZlbnRFbWl0dGVyLFxyXG4gIElucHV0LFxyXG4gIE9uSW5pdCxcclxuICBPdXRwdXQsXHJcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IFN0R2xvYmFsU2VhcmNoU2V0dGluZ3NNb2RlbCB9IGZyb20gJy4uLy4uLy4uL21vZGVscy9zdC1nbG9iYWwtc2VhcmNoLXNldHRpbmdzLm1vZGVsJztcclxuaW1wb3J0IHsgVmlld1N0TWF0ZXJpYWxUYWJsZUNvbHVtbk1vZGVsIH0gZnJvbSAnLi4vLi4vLi4vbW9kZWxzL3ZpZXcvdmlldy1zdC1tYXRlcmlhbC10YWJsZS1jb2x1bW4ubW9kZWwnO1xyXG5pbXBvcnQgeyBGb3JtQ29udHJvbCB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcclxuaW1wb3J0IHtcclxuICBTdEJhc2VTZXJ2aWNlLFxyXG4gIFN0U3Vic2NyaWJlRGVzdHJveUNvbXBvbmVudCxcclxufSBmcm9tICduZ3gtc3QtYmFzZS1mdW5jdGlvbnMnO1xyXG5pbXBvcnQge1xyXG4gIGRlYm91bmNlVGltZSxcclxuICBkaXN0aW5jdFVudGlsQ2hhbmdlZCxcclxuICBmaWx0ZXIsXHJcbiAgdGFrZSxcclxuICB0YWtlVW50aWwsXHJcbn0gZnJvbSAncnhqcy9vcGVyYXRvcnMnO1xyXG5pbXBvcnQgeyBNYXREaWFsb2cgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9kaWFsb2cnO1xyXG5pbXBvcnQge1xyXG4gIE1hdGVyaWFsVGFibGVGaWx0ZXJEaWFsb2dDb21wb25lbnQsXHJcbiAgTWF0ZXJpYWxUYWJsZUZpbHRlckRpYWxvZ1Jlc3VsdCxcclxufSBmcm9tICcuL21hdGVyaWFsLXRhYmxlLWZpbHRlci1kaWFsb2cvbWF0ZXJpYWwtdGFibGUtZmlsdGVyLWRpYWxvZy5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBNYXRlcmlhbFRhYmxlT3JkZXJDb2x1bW5EaWFsb2dDb21wb25lbnQgfSBmcm9tICcuL21hdGVyaWFsLXRhYmxlLW9yZGVyLWNvbHVtbi1kaWFsb2cvbWF0ZXJpYWwtdGFibGUtb3JkZXItY29sdW1uLWRpYWxvZy5jb21wb25lbnQnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdzdC1tYXRlcmlhbC10YWJsZS1jYXB0aW9uJyxcclxuICB0ZW1wbGF0ZVVybDogJy4vbWF0ZXJpYWwtdGFibGUtY2FwdGlvbi5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vbWF0ZXJpYWwtdGFibGUtY2FwdGlvbi5jb21wb25lbnQuc2NzcyddLFxyXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgTWF0ZXJpYWxUYWJsZUNhcHRpb25Db21wb25lbnRcclxuICBleHRlbmRzIFN0U3Vic2NyaWJlRGVzdHJveUNvbXBvbmVudFxyXG4gIGltcGxlbWVudHMgT25Jbml0XHJcbntcclxuICBASW5wdXQoKVxyXG4gIGdsb2JhbFNlYXJjaFNldHRpbmdzOiBTdEdsb2JhbFNlYXJjaFNldHRpbmdzTW9kZWw7XHJcblxyXG4gIEBJbnB1dCgpXHJcbiAgYWxsb3dQaWNrQ29sdW1uczogYm9vbGVhbiA9IHRydWU7XHJcblxyXG4gIEBJbnB1dCgpXHJcbiAgYWxsb3dSZW9yZGVyQ29sdW1uczogYm9vbGVhbiA9IHRydWU7XHJcblxyXG4gIEBJbnB1dCgpXHJcbiAgaW5pdEdsb2JhbFNlYXJjaCA9ICcnO1xyXG5cclxuICBASW5wdXQoKVxyXG4gIGluaXRGaWx0ZXJzOiB7IFtrZXk6IHN0cmluZ106IHN0cmluZyB9ID0ge307XHJcblxyXG4gIEBJbnB1dCgpXHJcbiAgc2V0IGNvbHVtbnMoZGF0YTogVmlld1N0TWF0ZXJpYWxUYWJsZUNvbHVtbk1vZGVsW10pIHtcclxuICAgIHRoaXMuX2NvbHVtbnMgPSBkYXRhID8gZGF0YSA6IFtdO1xyXG4gICAgdGhpcy51cGRhdGVDb2x1bW5zKCk7XHJcbiAgfVxyXG5cclxuICBnZXQgY29sdW1ucygpIHtcclxuICAgIHJldHVybiB0aGlzLl9jb2x1bW5zO1xyXG4gIH1cclxuXHJcbiAgcHJpdmF0ZSBfY29sdW1uczogVmlld1N0TWF0ZXJpYWxUYWJsZUNvbHVtbk1vZGVsW10gPSBbXTtcclxuXHJcbiAgQE91dHB1dCgpXHJcbiAgY2FwdGlvbkRhdGFDaGFuZ2VkOiBFdmVudEVtaXR0ZXI8SUNhcHRpb25EYXRhQ2hhbmdlZD4gPSBuZXcgRXZlbnRFbWl0dGVyKCk7XHJcblxyXG4gIHNob3dGaWx0ZXJCdXR0b24gPSBmYWxzZTtcclxuXHJcbiAgc2VsZWN0ZWRDb2x1bW5zID0gbmV3IEZvcm1Db250cm9sKDxzdHJpbmdbXT5bXSk7XHJcbiAgZ2xvYmFsU2VhcmNoID0gbmV3IEZvcm1Db250cm9sKCcnKTtcclxuXHJcbiAgYWN0aXZlRmlsdGVyc0NvdW50ID0gMDtcclxuXHJcbiAgcHJpdmF0ZSBjb2x1bW5zT3JkZXI6IHN0cmluZ1tdID0gW107XHJcbiAgcHJpdmF0ZSBmaWx0ZXJzOiB7IFtrZXk6IHN0cmluZ106IHN0cmluZyB9ID0ge307XHJcblxyXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgZGlhbG9nOiBNYXREaWFsb2cpIHtcclxuICAgIHN1cGVyKCk7XHJcbiAgfVxyXG5cclxuICBuZ09uSW5pdCgpOiB2b2lkIHtcclxuICAgIHRoaXMuZ2xvYmFsU2VhcmNoLnNldFZhbHVlKHRoaXMuaW5pdEdsb2JhbFNlYXJjaCB8fCAnJyk7XHJcbiAgICB0aGlzLmZpbHRlcnMgPSB0aGlzLmluaXRGaWx0ZXJzIHx8IHt9O1xyXG4gICAgdGhpcy5zZXRBY3RpdmVGaWx0ZXJzQ291bnQoKTtcclxuXHJcbiAgICB0aGlzLnNlbGVjdGVkQ29sdW1ucy52YWx1ZUNoYW5nZXNcclxuICAgICAgLnBpcGUoXHJcbiAgICAgICAgdGFrZVVudGlsKHRoaXMubmdEZXN0cm95ZWQkKSxcclxuICAgICAgICBkaXN0aW5jdFVudGlsQ2hhbmdlZChcclxuICAgICAgICAgIChwcmV2LCBjdXJyKSA9PiBKU09OLnN0cmluZ2lmeShwcmV2KSA9PT0gSlNPTi5zdHJpbmdpZnkoY3VycilcclxuICAgICAgICApLFxyXG4gICAgICAgIGRlYm91bmNlVGltZSg0MDApXHJcbiAgICAgIClcclxuICAgICAgLnN1YnNjcmliZSh2YWx1ZSA9PiB7XHJcbiAgICAgICAgY29uc29sZS5sb2coJ3NlbGVjdGVkQ29sdW1uc0NoYW5nZWQnKTtcclxuICAgICAgICB0aGlzLmVtaXRDYXB0aW9uRGF0YUNoYW5nZWQoKTtcclxuICAgICAgfSk7XHJcblxyXG4gICAgdGhpcy5nbG9iYWxTZWFyY2gudmFsdWVDaGFuZ2VzXHJcbiAgICAgIC5waXBlKFxyXG4gICAgICAgIHRha2VVbnRpbCh0aGlzLm5nRGVzdHJveWVkJCksXHJcbiAgICAgICAgZGlzdGluY3RVbnRpbENoYW5nZWQoXHJcbiAgICAgICAgICAocHJldiwgY3VycikgPT4gSlNPTi5zdHJpbmdpZnkocHJldikgPT09IEpTT04uc3RyaW5naWZ5KGN1cnIpXHJcbiAgICAgICAgKSxcclxuICAgICAgICBkZWJvdW5jZVRpbWUoNDAwKVxyXG4gICAgICApXHJcbiAgICAgIC5zdWJzY3JpYmUodmFsdWUgPT4ge1xyXG4gICAgICAgIGNvbnNvbGUubG9nKCdnbG9iYWxTZWFyY2hDaGFuZ2VkJyk7XHJcbiAgICAgICAgdGhpcy5lbWl0Q2FwdGlvbkRhdGFDaGFuZ2VkKCk7XHJcbiAgICAgIH0pO1xyXG4gIH1cclxuXHJcbiAgb3BlbkZpbHRlckRpYWxvZygpIHtcclxuICAgIHRoaXMuZGlhbG9nXHJcbiAgICAgIC5vcGVuKE1hdGVyaWFsVGFibGVGaWx0ZXJEaWFsb2dDb21wb25lbnQsIHtcclxuICAgICAgICBkYXRhOiB7XHJcbiAgICAgICAgICBpbml0RmlsdGVyczogdGhpcy5maWx0ZXJzLFxyXG4gICAgICAgICAgY29sdW1uczogdGhpcy5jb2x1bW5zLFxyXG4gICAgICAgIH0sXHJcbiAgICAgICAgbWF4V2lkdGg6ICc0NTBweCcsXHJcbiAgICAgICAgd2lkdGg6ICcxMDAlJyxcclxuICAgICAgICBhdXRvRm9jdXM6IGZhbHNlLFxyXG4gICAgICB9KVxyXG4gICAgICAuYWZ0ZXJDbG9zZWQoKVxyXG4gICAgICAucGlwZSh0YWtlKDEpLCBmaWx0ZXIoU3RCYXNlU2VydmljZS5ub3ROdWxsKSlcclxuICAgICAgLnN1YnNjcmliZSgocmVzOiBNYXRlcmlhbFRhYmxlRmlsdGVyRGlhbG9nUmVzdWx0KSA9PiB7XHJcbiAgICAgICAgdGhpcy5maWx0ZXJzID0gcmVzLmZpbHRlcnM7XHJcbiAgICAgICAgdGhpcy5zZXRBY3RpdmVGaWx0ZXJzQ291bnQoKTtcclxuICAgICAgICBjb25zb2xlLmxvZygnZmlsdGVyc0NoYW5nZWQnKTtcclxuICAgICAgICB0aGlzLmVtaXRDYXB0aW9uRGF0YUNoYW5nZWQoKTtcclxuICAgICAgfSk7XHJcbiAgfVxyXG5cclxuICBvcGVuUmVvcmRlckNvbHVtbnNEaWFsb2coKSB7XHJcbiAgICB0aGlzLmRpYWxvZ1xyXG4gICAgICAub3BlbihNYXRlcmlhbFRhYmxlT3JkZXJDb2x1bW5EaWFsb2dDb21wb25lbnQsIHtcclxuICAgICAgICBkYXRhOiB7XHJcbiAgICAgICAgICBjb2x1bW5zOiB0aGlzLmNvbHVtbnMsXHJcbiAgICAgICAgfSxcclxuICAgICAgICBtYXhXaWR0aDogJzQ1MHB4JyxcclxuICAgICAgICB3aWR0aDogJzEwMCUnLFxyXG4gICAgICAgIGF1dG9Gb2N1czogZmFsc2UsXHJcbiAgICAgIH0pXHJcbiAgICAgIC5hZnRlckNsb3NlZCgpXHJcbiAgICAgIC5waXBlKHRha2UoMSksIGZpbHRlcihTdEJhc2VTZXJ2aWNlLm5vdE51bGwpKVxyXG4gICAgICAuc3Vic2NyaWJlKChyZXN1bHQ6IHsgY29sdW1uc09yZGVyOiBzdHJpbmdbXSB9KSA9PiB7XHJcbiAgICAgICAgdGhpcy5jb2x1bW5zT3JkZXIgPSByZXN1bHQuY29sdW1uc09yZGVyO1xyXG4gICAgICAgIGNvbnNvbGUubG9nKCdjb2x1bW5zT3JkZXJDaGFuZ2VkJyk7XHJcbiAgICAgICAgdGhpcy5lbWl0Q2FwdGlvbkRhdGFDaGFuZ2VkKCk7XHJcbiAgICAgIH0pO1xyXG4gIH1cclxuXHJcbiAgcHJpdmF0ZSBlbWl0Q2FwdGlvbkRhdGFDaGFuZ2VkKCkge1xyXG4gICAgdGhpcy5jYXB0aW9uRGF0YUNoYW5nZWQuZW1pdCh7XHJcbiAgICAgIHNlbGVjdGVkQ29sdW1uczogdGhpcy5zZWxlY3RlZENvbHVtbnMudmFsdWUgfHwgW10sXHJcbiAgICAgIGdsb2JhbFNlYXJjaDogdGhpcy5nbG9iYWxTZWFyY2gudmFsdWUgfHwgJycsXHJcbiAgICAgIGNvbHVtbnNPcmRlcjogdGhpcy5jb2x1bW5zT3JkZXIgfHwgW10sXHJcbiAgICAgIGZpbHRlcnM6IHRoaXMuZmlsdGVycyxcclxuICAgIH0pO1xyXG4gIH1cclxuXHJcbiAgcHJpdmF0ZSB1cGRhdGVDb2x1bW5zKCkge1xyXG4gICAgY29uc3QgY29sdW1uc0ZpbHRlcnMgPSB0aGlzLl9jb2x1bW5zLmZpbHRlcihjb2x1bW4gPT4gY29sdW1uLmZpbHRlcik7XHJcbiAgICB0aGlzLnNob3dGaWx0ZXJCdXR0b24gPSBjb2x1bW5zRmlsdGVycy5sZW5ndGggPiAwO1xyXG4gICAgdGhpcy5zZWxlY3RlZENvbHVtbnMuc2V0VmFsdWUoXHJcbiAgICAgIHRoaXMuX2NvbHVtbnMuZmlsdGVyKGNvbCA9PiBjb2wudmlzaWJsZSkubWFwKGNvbCA9PiBjb2wuZmllbGQpIHx8IFtdXHJcbiAgICApO1xyXG4gICAgdGhpcy5jb2x1bW5zT3JkZXIgPSB0aGlzLl9jb2x1bW5zLm1hcChjb2wgPT4gY29sLmZpZWxkKSB8fCBbXTtcclxuICB9XHJcblxyXG4gIHByaXZhdGUgc2V0QWN0aXZlRmlsdGVyc0NvdW50KCkge1xyXG4gICAgY29uc3QgZmlsdGVyc0tleXMgPSBPYmplY3Qua2V5cyh0aGlzLmZpbHRlcnMpO1xyXG4gICAgdGhpcy5hY3RpdmVGaWx0ZXJzQ291bnQgPVxyXG4gICAgICBmaWx0ZXJzS2V5cy5maWx0ZXIoa2V5ID0+IHRoaXMuZmlsdGVyc1trZXldKS5sZW5ndGggfHwgMDtcclxuICB9XHJcbn1cclxuXHJcbmV4cG9ydCBpbnRlcmZhY2UgSUNhcHRpb25EYXRhQ2hhbmdlZCB7XHJcbiAgc2VsZWN0ZWRDb2x1bW5zOiBzdHJpbmdbXTtcclxuICBnbG9iYWxTZWFyY2g6IHN0cmluZztcclxuICBjb2x1bW5zT3JkZXI6IHN0cmluZ1tdO1xyXG4gIGZpbHRlcnM6IHsgW2tleTogc3RyaW5nXTogc3RyaW5nIH07XHJcbn1cclxuIiwiPGRpdlxyXG4gIGNsYXNzPVwic3QtbWF0ZXJpYWwtdGFibGUtY2FwdGlvbiByb3cgYWxpZ24taXRlbXMtY2VudGVyXCJcclxuICBbbmdDbGFzc109XCJ7XHJcbiAgICAnanVzdGlmeS1jb250ZW50LWJldHdlZW4nOiBhbGxvd1BpY2tDb2x1bW5zICYmIGdsb2JhbFNlYXJjaFNldHRpbmdzPy5zaG93LFxyXG4gICAgJ2p1c3RpZnktY29udGVudC1lbmQnOiAhYWxsb3dQaWNrQ29sdW1ucyAmJiBnbG9iYWxTZWFyY2hTZXR0aW5ncz8uc2hvd1xyXG4gIH1cIlxyXG4+XHJcbiAgQGlmIChhbGxvd1BpY2tDb2x1bW5zKSB7XHJcbiAgICA8ZGl2IGNsYXNzPVwiY29sLWF1dG8gZC1mbGV4IGFsaWduLWl0ZW1zLWNlbnRlclwiPlxyXG4gICAgICA8bWF0LWZvcm0tZmllbGQgYXBwZWFyYW5jZT1cIm91dGxpbmVcIj5cclxuICAgICAgICA8bWF0LXNlbGVjdCBbZm9ybUNvbnRyb2xdPVwic2VsZWN0ZWRDb2x1bW5zXCIgbXVsdGlwbGU+XHJcbiAgICAgICAgICA8bWF0LXNlbGVjdC10cmlnZ2VyPlxyXG4gICAgICAgICAgICB7eyBzZWxlY3RlZENvbHVtbnMudmFsdWUgPyBzZWxlY3RlZENvbHVtbnMudmFsdWUubGVuZ3RoIDogMCB9fVxyXG4gICAgICAgICAgICBjb2x1bW5zIHNlbGVjdGVkXHJcbiAgICAgICAgICA8L21hdC1zZWxlY3QtdHJpZ2dlcj5cclxuICAgICAgICAgIEBmb3IgKGNvbHVtbiBvZiBjb2x1bW5zOyB0cmFjayBjb2x1bW4uZmllbGQpIHtcclxuICAgICAgICAgICAgPG1hdC1vcHRpb24gW3ZhbHVlXT1cImNvbHVtbi5maWVsZFwiPnt7XHJcbiAgICAgICAgICAgICAgY29sdW1uLnRyYW5zbGF0ZUNvbHVtbk5hbWUgfHwgY29sdW1uLmZpZWxkXHJcbiAgICAgICAgICAgIH19PC9tYXQtb3B0aW9uPlxyXG4gICAgICAgICAgfVxyXG4gICAgICAgIDwvbWF0LXNlbGVjdD5cclxuICAgICAgPC9tYXQtZm9ybS1maWVsZD5cclxuXHJcbiAgICAgIEBpZiAoYWxsb3dSZW9yZGVyQ29sdW1ucykge1xyXG4gICAgICAgIDxidXR0b24gbWF0LWljb24tYnV0dG9uIChjbGljayk9XCJvcGVuUmVvcmRlckNvbHVtbnNEaWFsb2coKVwiPlxyXG4gICAgICAgICAgPG1hdC1pY29uIGNsYXNzPVwicmVvcmRlci1pY29uXCI+bG93X3ByaW9yaXR5PC9tYXQtaWNvbj5cclxuICAgICAgICA8L2J1dHRvbj5cclxuICAgICAgfVxyXG4gICAgPC9kaXY+XHJcbiAgfVxyXG5cclxuICBAaWYgKGdsb2JhbFNlYXJjaFNldHRpbmdzPy5zaG93KSB7XHJcbiAgICA8ZGl2IGNsYXNzPVwiY29sLWF1dG8gZC1mbGV4IGFsaWduLWl0ZW1zLWNlbnRlclwiPlxyXG4gICAgICBAaWYgKHNob3dGaWx0ZXJCdXR0b24pIHtcclxuICAgICAgICA8YnV0dG9uIG1hdC1pY29uLWJ1dHRvbiAoY2xpY2spPVwib3BlbkZpbHRlckRpYWxvZygpXCI+XHJcbiAgICAgICAgICA8bWF0LWljb25cclxuICAgICAgICAgICAgW21hdEJhZGdlXT1cImFjdGl2ZUZpbHRlcnNDb3VudFwiXHJcbiAgICAgICAgICAgIFttYXRCYWRnZUhpZGRlbl09XCIhYWN0aXZlRmlsdGVyc0NvdW50XCJcclxuICAgICAgICAgICAgW21hdEJhZGdlU2l6ZV09XCInc21hbGwnXCJcclxuICAgICAgICAgICAgbWF0QmFkZ2VQb3NpdGlvbj1cImJlZm9yZVwiXHJcbiAgICAgICAgICAgID5maWx0ZXJfYWx0PC9tYXQtaWNvblxyXG4gICAgICAgICAgPlxyXG4gICAgICAgIDwvYnV0dG9uPlxyXG4gICAgICB9XHJcblxyXG4gICAgICA8bWF0LWZvcm0tZmllbGQgYXBwZWFyYW5jZT1cIm91dGxpbmVcIj5cclxuICAgICAgICA8aW5wdXRcclxuICAgICAgICAgIG1hdElucHV0XHJcbiAgICAgICAgICBbZm9ybUNvbnRyb2xdPVwiZ2xvYmFsU2VhcmNoXCJcclxuICAgICAgICAgIFtwbGFjZWhvbGRlcl09XCJnbG9iYWxTZWFyY2hTZXR0aW5ncz8ubGFiZWwgfHwgJ0dsb2JhbCBTZWFyY2gnXCJcclxuICAgICAgICAvPlxyXG4gICAgICAgIDxidXR0b25cclxuICAgICAgICAgIG1hdFN1ZmZpeFxyXG4gICAgICAgICAgbWF0LWljb24tYnV0dG9uXHJcbiAgICAgICAgICBhcmlhLWxhYmVsPVwiQ2xlYXJcIlxyXG4gICAgICAgICAgKGNsaWNrKT1cImdsb2JhbFNlYXJjaC5zZXRWYWx1ZSgnJylcIlxyXG4gICAgICAgID5cclxuICAgICAgICAgIDxtYXQtaWNvbiBzdHlsZT1cImZvbnQtc2l6ZTogMjJweFwiPmNsb3NlPC9tYXQtaWNvbj5cclxuICAgICAgICA8L2J1dHRvbj5cclxuICAgICAgPC9tYXQtZm9ybS1maWVsZD5cclxuICAgIDwvZGl2PlxyXG4gIH1cclxuPC9kaXY+XHJcbiJdfQ==

package/esm2022/lib/components/material-table/material-table-caption/material-table-filter-dialog/material-table-filter-dialog.component.mjs

@@ -0,0 +1,68 @@
+import { ChangeDetectionStrategy, Component, Inject, } from '@angular/core';
+import { MAT_DIALOG_DATA } from '@angular/material/dialog';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/material/dialog";
+import * as i2 from "@angular/forms";
+import * as i3 from "@angular/common";
+import * as i4 from "@angular/material/button";
+import * as i5 from "@angular/material/icon";
+import * as i6 from "@angular/material/form-field";
+import * as i7 from "@angular/material/input";
+export class MaterialTableFilterDialogComponent {
+    constructor(dialogData, dialogRef, fb, changeDetectorRef) {
+        this.dialogData = dialogData;
+        this.dialogRef = dialogRef;
+        this.fb = fb;
+        this.changeDetectorRef = changeDetectorRef;
+        this.filterColumns = [];
+        this.formGroup = this.fb.group({});
+        this.allVisible = true;
+    }
+    ngOnInit() {
+        this.filterColumns = this.dialogData.columns
+            .filter(column => column.filter)
+            .map(col => {
+            this.formGroup.addControl(col.field, this.fb.control(''));
+            return {
+                ...col,
+            };
+        });
+        if (this.dialogData.initFilters) {
+            const filtersKeys = Object.keys(this.dialogData.initFilters);
+            filtersKeys.forEach(key => {
+                if (this.formGroup.get(key)) {
+                    this.formGroup.get(key)?.setValue(this.dialogData.initFilters[key]);
+                }
+            });
+        }
+    }
+    showAllFilters() {
+        this.filterColumns.forEach(column => {
+            column.expanded = true;
+        });
+        this.allVisible = true;
+        this.changeDetectorRef.markForCheck();
+    }
+    hideAllFilters() {
+        this.filterColumns.forEach(column => {
+            column.expanded = false;
+        });
+        this.allVisible = false;
+        this.changeDetectorRef.markForCheck();
+    }
+    saveFilters() {
+        this.dialogRef.close({
+            filters: this.formGroup.getRawValue(),
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MaterialTableFilterDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }, { token: i2.NonNullableFormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: MaterialTableFilterDialogComponent, selector: "st-material-table-filter-dialog", ngImport: i0, template: "<div mat-dialog-title class=\"filters-dialog-title-container\">\r\n  <div class=\"row justify-content-between align-items-center\">\r\n    <div class=\"col-auto\">\r\n      <h3>Filters</h3>\r\n    </div>\r\n    <div class=\"col-auto\">\r\n      <button mat-icon-button (click)=\"showAllFilters()\" *ngIf=\"!allVisible\">\r\n        <mat-icon>unfold_more</mat-icon>\r\n      </button>\r\n      <button mat-icon-button (click)=\"hideAllFilters()\" *ngIf=\"allVisible\">\r\n        <mat-icon>unfold_less</mat-icon>\r\n      </button>\r\n    </div>\r\n  </div>\r\n  <hr />\r\n</div>\r\n\r\n<mat-dialog-content>\r\n  <form [formGroup]=\"formGroup\">\r\n    @for (column of filterColumns; track column.field) {\r\n      @switch (column.type) {\r\n        @case ('string') {\r\n          <div class=\"filter\">\r\n            <div class=\"filter-title row justify-content-between\">\r\n              {{ column.translateColumnName || column.field }}\r\n\r\n              @if (column.expanded) {\r\n                <mat-icon (click)=\"column.expanded = !column.expanded\"\r\n                  >keyboard_arrow_up</mat-icon\r\n                >\r\n              } @else {\r\n                <mat-icon (click)=\"column.expanded = !column.expanded\"\r\n                  >keyboard_arrow_down</mat-icon\r\n                >\r\n              }\r\n            </div>\r\n            <div\r\n              class=\"filter-content row\"\r\n              [ngClass]=\"{ hide: !column.expanded }\"\r\n            >\r\n              <div class=\"col-auto\">\r\n                <mat-form-field appearance=\"outline\" style=\"width: 100px\">\r\n                  <mat-label>Filter</mat-label>\r\n                  <input\r\n                    matInput\r\n                    type=\"text\"\r\n                    [disabled]=\"true\"\r\n                    [value]=\"'Contains'\"\r\n                  />\r\n                </mat-form-field>\r\n              </div>\r\n\r\n              <div class=\"col\">\r\n                <mat-form-field appearance=\"outline\">\r\n                  <mat-label>Search</mat-label>\r\n                  <input\r\n                    matInput\r\n                    type=\"text\"\r\n                    [disabled]=\"column.visible\"\r\n                    [formControlName]=\"column.field\"\r\n                  />\r\n                  <button\r\n                    matSuffix\r\n                    mat-icon-button\r\n                    aria-label=\"Clear\"\r\n                    (click)=\"formGroup.controls[column.field].setValue('')\"\r\n                  >\r\n                    <mat-icon style=\"font-size: 22px\">close</mat-icon>\r\n                  </button>\r\n                </mat-form-field>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        }\r\n      }\r\n    }\r\n  </form>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n  <div class=\"row justify-content-between\">\r\n    <button mat-flat-button mat-dialog-close>Cancel</button>\r\n    <button mat-flat-button color=\"accent\" (click)=\"saveFilters()\">Save</button>\r\n  </div>\r\n</mat-dialog-actions>\r\n", styles: [".filters-dialog-title-container{display:flex;align-items:center;flex-direction:column;padding-bottom:0;margin-bottom:0}.filters-dialog-title-container:before{display:none!important}.filters-dialog-title-container div.row>div.col-auto{padding:0!important}.filters-dialog-title-container div.row>div.col-auto h3{margin-bottom:0}.filters-dialog-title-container hr{margin-top:.5rem}.filter{width:100%;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid #e0e0e0}.filter .filter-title{padding:.5rem 0;color:#000c;font-size:1rem;font-weight:500}.filter .filter-title mat-icon{cursor:pointer}.filter .filter-content{margin-top:.5rem;gap:.5rem}.filter .filter-content.hide{display:none}.filter .filter-content>div.col-auto,.filter .filter-content>div.col{padding:0!important}.filter .filter-content mat-form-field{width:100%}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatLabel, selector: "mat-label" }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MaterialTableFilterDialogComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'st-material-table-filter-dialog', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div mat-dialog-title class=\"filters-dialog-title-container\">\r\n  <div class=\"row justify-content-between align-items-center\">\r\n    <div class=\"col-auto\">\r\n      <h3>Filters</h3>\r\n    </div>\r\n    <div class=\"col-auto\">\r\n      <button mat-icon-button (click)=\"showAllFilters()\" *ngIf=\"!allVisible\">\r\n        <mat-icon>unfold_more</mat-icon>\r\n      </button>\r\n      <button mat-icon-button (click)=\"hideAllFilters()\" *ngIf=\"allVisible\">\r\n        <mat-icon>unfold_less</mat-icon>\r\n      </button>\r\n    </div>\r\n  </div>\r\n  <hr />\r\n</div>\r\n\r\n<mat-dialog-content>\r\n  <form [formGroup]=\"formGroup\">\r\n    @for (column of filterColumns; track column.field) {\r\n      @switch (column.type) {\r\n        @case ('string') {\r\n          <div class=\"filter\">\r\n            <div class=\"filter-title row justify-content-between\">\r\n              {{ column.translateColumnName || column.field }}\r\n\r\n              @if (column.expanded) {\r\n                <mat-icon (click)=\"column.expanded = !column.expanded\"\r\n                  >keyboard_arrow_up</mat-icon\r\n                >\r\n              } @else {\r\n                <mat-icon (click)=\"column.expanded = !column.expanded\"\r\n                  >keyboard_arrow_down</mat-icon\r\n                >\r\n              }\r\n            </div>\r\n            <div\r\n              class=\"filter-content row\"\r\n              [ngClass]=\"{ hide: !column.expanded }\"\r\n            >\r\n              <div class=\"col-auto\">\r\n                <mat-form-field appearance=\"outline\" style=\"width: 100px\">\r\n                  <mat-label>Filter</mat-label>\r\n                  <input\r\n                    matInput\r\n                    type=\"text\"\r\n                    [disabled]=\"true\"\r\n                    [value]=\"'Contains'\"\r\n                  />\r\n                </mat-form-field>\r\n              </div>\r\n\r\n              <div class=\"col\">\r\n                <mat-form-field appearance=\"outline\">\r\n                  <mat-label>Search</mat-label>\r\n                  <input\r\n                    matInput\r\n                    type=\"text\"\r\n                    [disabled]=\"column.visible\"\r\n                    [formControlName]=\"column.field\"\r\n                  />\r\n                  <button\r\n                    matSuffix\r\n                    mat-icon-button\r\n                    aria-label=\"Clear\"\r\n                    (click)=\"formGroup.controls[column.field].setValue('')\"\r\n                  >\r\n                    <mat-icon style=\"font-size: 22px\">close</mat-icon>\r\n                  </button>\r\n                </mat-form-field>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        }\r\n      }\r\n    }\r\n  </form>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n  <div class=\"row justify-content-between\">\r\n    <button mat-flat-button mat-dialog-close>Cancel</button>\r\n    <button mat-flat-button color=\"accent\" (click)=\"saveFilters()\">Save</button>\r\n  </div>\r\n</mat-dialog-actions>\r\n", styles: [".filters-dialog-title-container{display:flex;align-items:center;flex-direction:column;padding-bottom:0;margin-bottom:0}.filters-dialog-title-container:before{display:none!important}.filters-dialog-title-container div.row>div.col-auto{padding:0!important}.filters-dialog-title-container div.row>div.col-auto h3{margin-bottom:0}.filters-dialog-title-container hr{margin-top:.5rem}.filter{width:100%;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid #e0e0e0}.filter .filter-title{padding:.5rem 0;color:#000c;font-size:1rem;font-weight:500}.filter .filter-title mat-icon{cursor:pointer}.filter .filter-content{margin-top:.5rem;gap:.5rem}.filter .filter-content.hide{display:none}.filter .filter-content>div.col-auto,.filter .filter-content>div.col{padding:0!important}.filter .filter-content mat-form-field{width:100%}\n"] }]
+        }], ctorParameters: () => [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [MAT_DIALOG_DATA]
+                }] }, { type: i1.MatDialogRef }, { type: i2.NonNullableFormBuilder }, { type: i0.ChangeDetectorRef }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWF0ZXJpYWwtdGFibGUtZmlsdGVyLWRpYWxvZy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtc3QtdGFibGVzL3NyYy9saWIvY29tcG9uZW50cy9tYXRlcmlhbC10YWJsZS9tYXRlcmlhbC10YWJsZS1jYXB0aW9uL21hdGVyaWFsLXRhYmxlLWZpbHRlci1kaWFsb2cvbWF0ZXJpYWwtdGFibGUtZmlsdGVyLWRpYWxvZy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtc3QtdGFibGVzL3NyYy9saWIvY29tcG9uZW50cy9tYXRlcmlhbC10YWJsZS9tYXRlcmlhbC10YWJsZS1jYXB0aW9uL21hdGVyaWFsLXRhYmxlLWZpbHRlci1kaWFsb2cvbWF0ZXJpYWwtdGFibGUtZmlsdGVyLWRpYWxvZy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ0wsdUJBQXVCLEVBRXZCLFNBQVMsRUFDVCxNQUFNLEdBRVAsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLGVBQWUsRUFBZ0IsTUFBTSwwQkFBMEIsQ0FBQzs7Ozs7Ozs7O0FBVXpFLE1BQU0sT0FBTyxrQ0FBa0M7SUFPN0MsWUFFUyxVQUdOLEVBQ00sU0FHTixFQUNPLEVBQTBCLEVBQzFCLGlCQUFvQztRQVRyQyxlQUFVLEdBQVYsVUFBVSxDQUdoQjtRQUNNLGNBQVMsR0FBVCxTQUFTLENBR2Y7UUFDTyxPQUFFLEdBQUYsRUFBRSxDQUF3QjtRQUMxQixzQkFBaUIsR0FBakIsaUJBQWlCLENBQW1CO1FBakI5QyxrQkFBYSxHQUFxQyxFQUFFLENBQUM7UUFFckQsY0FBUyxHQUFjLElBQUksQ0FBQyxFQUFFLENBQUMsS0FBSyxDQUFDLEVBQUUsQ0FBQyxDQUFDO1FBRXpDLGVBQVUsR0FBRyxJQUFJLENBQUM7SUFjZixDQUFDO0lBRUosUUFBUTtRQUNOLElBQUksQ0FBQyxhQUFhLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxPQUFPO2FBQ3pDLE1BQU0sQ0FBQyxNQUFNLENBQUMsRUFBRSxDQUFDLE1BQU0sQ0FBQyxNQUFNLENBQUM7YUFDL0IsR0FBRyxDQUFDLEdBQUcsQ0FBQyxFQUFFO1lBQ1QsSUFBSSxDQUFDLFNBQVMsQ0FBQyxVQUFVLENBQUMsR0FBRyxDQUFDLEtBQUssRUFBRSxJQUFJLENBQUMsRUFBRSxDQUFDLE9BQU8sQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDO1lBRTFELE9BQU87Z0JBQ0wsR0FBRyxHQUFHO2FBQ1AsQ0FBQztRQUNKLENBQUMsQ0FBQyxDQUFDO1FBRUwsSUFBSSxJQUFJLENBQUMsVUFBVSxDQUFDLFdBQVcsRUFBRSxDQUFDO1lBQ2hDLE1BQU0sV0FBVyxHQUFHLE1BQU0sQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxXQUFXLENBQUMsQ0FBQztZQUM3RCxXQUFXLENBQUMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxFQUFFO2dCQUN4QixJQUFJLElBQUksQ0FBQyxTQUFTLENBQUMsR0FBRyxDQUFDLEdBQUcsQ0FBQyxFQUFFLENBQUM7b0JBQzVCLElBQUksQ0FBQyxTQUFTLENBQUMsR0FBRyxDQUFDLEdBQUcsQ0FBQyxFQUFFLFFBQVEsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLFdBQVcsQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDO2dCQUN0RSxDQUFDO1lBQ0gsQ0FBQyxDQUFDLENBQUM7UUFDTCxDQUFDO0lBQ0gsQ0FBQztJQUVELGNBQWM7UUFDWixJQUFJLENBQUMsYUFBYSxDQUFDLE9BQU8sQ0FBQyxNQUFNLENBQUMsRUFBRTtZQUNsQyxNQUFNLENBQUMsUUFBUSxHQUFHLElBQUksQ0FBQztRQUN6QixDQUFDLENBQUMsQ0FBQztRQUNILElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDO1FBQ3ZCLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxZQUFZLEVBQUUsQ0FBQztJQUN4QyxDQUFDO0lBRUQsY0FBYztRQUNaLElBQUksQ0FBQyxhQUFhLENBQUMsT0FBTyxDQUFDLE1BQU0sQ0FBQyxFQUFFO1lBQ2xDLE1BQU0sQ0FBQyxRQUFRLEdBQUcsS0FBSyxDQUFDO1FBQzFCLENBQUMsQ0FBQyxDQUFDO1FBQ0gsSUFBSSxDQUFDLFVBQVUsR0FBRyxLQUFLLENBQUM7UUFDeEIsSUFBSSxDQUFDLGlCQUFpQixDQUFDLFlBQVksRUFBRSxDQUFDO0lBQ3hDLENBQUM7SUFFRCxXQUFXO1FBQ1QsSUFBSSxDQUFDLFNBQVMsQ0FBQyxLQUFLLENBQUM7WUFDbkIsT0FBTyxFQUFFLElBQUksQ0FBQyxTQUFTLENBQUMsV0FBVyxFQUFFO1NBQ3RDLENBQUMsQ0FBQztJQUNMLENBQUM7K0dBOURVLGtDQUFrQyxrQkFRbkMsZUFBZTttR0FSZCxrQ0FBa0MsdUVDakIvQyw4aUdBb0ZBOzs0RkRuRWEsa0NBQWtDO2tCQU45QyxTQUFTOytCQUNFLGlDQUFpQyxtQkFHMUIsdUJBQXVCLENBQUMsTUFBTTs7MEJBVTVDLE1BQU07MkJBQUMsZUFBZSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XHJcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXHJcbiAgQ2hhbmdlRGV0ZWN0b3JSZWYsXHJcbiAgQ29tcG9uZW50LFxyXG4gIEluamVjdCxcclxuICBPbkluaXQsXHJcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IE1BVF9ESUFMT0dfREFUQSwgTWF0RGlhbG9nUmVmIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvZGlhbG9nJztcclxuaW1wb3J0IHsgVmlld1N0TWF0ZXJpYWxUYWJsZUNvbHVtbk1vZGVsIH0gZnJvbSAnLi4vLi4vLi4vLi4vbW9kZWxzL3ZpZXcvdmlldy1zdC1tYXRlcmlhbC10YWJsZS1jb2x1bW4ubW9kZWwnO1xyXG5pbXBvcnQgeyBGb3JtR3JvdXAsIE5vbk51bGxhYmxlRm9ybUJ1aWxkZXIgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ3N0LW1hdGVyaWFsLXRhYmxlLWZpbHRlci1kaWFsb2cnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9tYXRlcmlhbC10YWJsZS1maWx0ZXItZGlhbG9nLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi9tYXRlcmlhbC10YWJsZS1maWx0ZXItZGlhbG9nLmNvbXBvbmVudC5zY3NzJ10sXHJcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBNYXRlcmlhbFRhYmxlRmlsdGVyRGlhbG9nQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcclxuICBmaWx0ZXJDb2x1bW5zOiBWaWV3U3RNYXRlcmlhbFRhYmxlQ29sdW1uTW9kZWxbXSA9IFtdO1xyXG5cclxuICBmb3JtR3JvdXA6IEZvcm1Hcm91cCA9IHRoaXMuZmIuZ3JvdXAoe30pO1xyXG5cclxuICBhbGxWaXNpYmxlID0gdHJ1ZTtcclxuXHJcbiAgY29uc3RydWN0b3IoXHJcbiAgICBASW5qZWN0KE1BVF9ESUFMT0dfREFUQSlcclxuICAgIHB1YmxpYyBkaWFsb2dEYXRhOiB7XHJcbiAgICAgIGNvbHVtbnM6IFZpZXdTdE1hdGVyaWFsVGFibGVDb2x1bW5Nb2RlbFtdO1xyXG4gICAgICBpbml0RmlsdGVyczogeyBba2V5OiBzdHJpbmddOiBzdHJpbmcgfTtcclxuICAgIH0sXHJcbiAgICBwdWJsaWMgZGlhbG9nUmVmOiBNYXREaWFsb2dSZWY8XHJcbiAgICAgIE1hdGVyaWFsVGFibGVGaWx0ZXJEaWFsb2dDb21wb25lbnQsXHJcbiAgICAgIE1hdGVyaWFsVGFibGVGaWx0ZXJEaWFsb2dSZXN1bHRcclxuICAgID4sXHJcbiAgICBwcml2YXRlIGZiOiBOb25OdWxsYWJsZUZvcm1CdWlsZGVyLFxyXG4gICAgcHJpdmF0ZSBjaGFuZ2VEZXRlY3RvclJlZjogQ2hhbmdlRGV0ZWN0b3JSZWZcclxuICApIHt9XHJcblxyXG4gIG5nT25Jbml0KCkge1xyXG4gICAgdGhpcy5maWx0ZXJDb2x1bW5zID0gdGhpcy5kaWFsb2dEYXRhLmNvbHVtbnNcclxuICAgICAgLmZpbHRlcihjb2x1bW4gPT4gY29sdW1uLmZpbHRlcilcclxuICAgICAgLm1hcChjb2wgPT4ge1xyXG4gICAgICAgIHRoaXMuZm9ybUdyb3VwLmFkZENvbnRyb2woY29sLmZpZWxkLCB0aGlzLmZiLmNvbnRyb2woJycpKTtcclxuXHJcbiAgICAgICAgcmV0dXJuIHtcclxuICAgICAgICAgIC4uLmNvbCxcclxuICAgICAgICB9O1xyXG4gICAgICB9KTtcclxuXHJcbiAgICBpZiAodGhpcy5kaWFsb2dEYXRhLmluaXRGaWx0ZXJzKSB7XHJcbiAgICAgIGNvbnN0IGZpbHRlcnNLZXlzID0gT2JqZWN0LmtleXModGhpcy5kaWFsb2dEYXRhLmluaXRGaWx0ZXJzKTtcclxuICAgICAgZmlsdGVyc0tleXMuZm9yRWFjaChrZXkgPT4ge1xyXG4gICAgICAgIGlmICh0aGlzLmZvcm1Hcm91cC5nZXQoa2V5KSkge1xyXG4gICAgICAgICAgdGhpcy5mb3JtR3JvdXAuZ2V0KGtleSk/LnNldFZhbHVlKHRoaXMuZGlhbG9nRGF0YS5pbml0RmlsdGVyc1trZXldKTtcclxuICAgICAgICB9XHJcbiAgICAgIH0pO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgc2hvd0FsbEZpbHRlcnMoKSB7XHJcbiAgICB0aGlzLmZpbHRlckNvbHVtbnMuZm9yRWFjaChjb2x1bW4gPT4ge1xyXG4gICAgICBjb2x1bW4uZXhwYW5kZWQgPSB0cnVlO1xyXG4gICAgfSk7XHJcbiAgICB0aGlzLmFsbFZpc2libGUgPSB0cnVlO1xyXG4gICAgdGhpcy5jaGFuZ2VEZXRlY3RvclJlZi5tYXJrRm9yQ2hlY2soKTtcclxuICB9XHJcblxyXG4gIGhpZGVBbGxGaWx0ZXJzKCkge1xyXG4gICAgdGhpcy5maWx0ZXJDb2x1bW5zLmZvckVhY2goY29sdW1uID0+IHtcclxuICAgICAgY29sdW1uLmV4cGFuZGVkID0gZmFsc2U7XHJcbiAgICB9KTtcclxuICAgIHRoaXMuYWxsVmlzaWJsZSA9IGZhbHNlO1xyXG4gICAgdGhpcy5jaGFuZ2VEZXRlY3RvclJlZi5tYXJrRm9yQ2hlY2soKTtcclxuICB9XHJcblxyXG4gIHNhdmVGaWx0ZXJzKCkge1xyXG4gICAgdGhpcy5kaWFsb2dSZWYuY2xvc2Uoe1xyXG4gICAgICBmaWx0ZXJzOiB0aGlzLmZvcm1Hcm91cC5nZXRSYXdWYWx1ZSgpLFxyXG4gICAgfSk7XHJcbiAgfVxyXG59XHJcblxyXG5leHBvcnQgaW50ZXJmYWNlIE1hdGVyaWFsVGFibGVGaWx0ZXJEaWFsb2dSZXN1bHQge1xyXG4gIGZpbHRlcnM6IHsgW2tleTogc3RyaW5nXTogc3RyaW5nIH07XHJcbn1cclxuIiwiPGRpdiBtYXQtZGlhbG9nLXRpdGxlIGNsYXNzPVwiZmlsdGVycy1kaWFsb2ctdGl0bGUtY29udGFpbmVyXCI+XHJcbiAgPGRpdiBjbGFzcz1cInJvdyBqdXN0aWZ5LWNvbnRlbnQtYmV0d2VlbiBhbGlnbi1pdGVtcy1jZW50ZXJcIj5cclxuICAgIDxkaXYgY2xhc3M9XCJjb2wtYXV0b1wiPlxyXG4gICAgICA8aDM+RmlsdGVyczwvaDM+XHJcbiAgICA8L2Rpdj5cclxuICAgIDxkaXYgY2xhc3M9XCJjb2wtYXV0b1wiPlxyXG4gICAgICA8YnV0dG9uIG1hdC1pY29uLWJ1dHRvbiAoY2xpY2spPVwic2hvd0FsbEZpbHRlcnMoKVwiICpuZ0lmPVwiIWFsbFZpc2libGVcIj5cclxuICAgICAgICA8bWF0LWljb24+dW5mb2xkX21vcmU8L21hdC1pY29uPlxyXG4gICAgICA8L2J1dHRvbj5cclxuICAgICAgPGJ1dHRvbiBtYXQtaWNvbi1idXR0b24gKGNsaWNrKT1cImhpZGVBbGxGaWx0ZXJzKClcIiAqbmdJZj1cImFsbFZpc2libGVcIj5cclxuICAgICAgICA8bWF0LWljb24+dW5mb2xkX2xlc3M8L21hdC1pY29uPlxyXG4gICAgICA8L2J1dHRvbj5cclxuICAgIDwvZGl2PlxyXG4gIDwvZGl2PlxyXG4gIDxociAvPlxyXG48L2Rpdj5cclxuXHJcbjxtYXQtZGlhbG9nLWNvbnRlbnQ+XHJcbiAgPGZvcm0gW2Zvcm1Hcm91cF09XCJmb3JtR3JvdXBcIj5cclxuICAgIEBmb3IgKGNvbHVtbiBvZiBmaWx0ZXJDb2x1bW5zOyB0cmFjayBjb2x1bW4uZmllbGQpIHtcclxuICAgICAgQHN3aXRjaCAoY29sdW1uLnR5cGUpIHtcclxuICAgICAgICBAY2FzZSAoJ3N0cmluZycpIHtcclxuICAgICAgICAgIDxkaXYgY2xhc3M9XCJmaWx0ZXJcIj5cclxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cImZpbHRlci10aXRsZSByb3cganVzdGlmeS1jb250ZW50LWJldHdlZW5cIj5cclxuICAgICAgICAgICAgICB7eyBjb2x1bW4udHJhbnNsYXRlQ29sdW1uTmFtZSB8fCBjb2x1bW4uZmllbGQgfX1cclxuXHJcbiAgICAgICAgICAgICAgQGlmIChjb2x1bW4uZXhwYW5kZWQpIHtcclxuICAgICAgICAgICAgICAgIDxtYXQtaWNvbiAoY2xpY2spPVwiY29sdW1uLmV4cGFuZGVkID0gIWNvbHVtbi5leHBhbmRlZFwiXHJcbiAgICAgICAgICAgICAgICAgID5rZXlib2FyZF9hcnJvd191cDwvbWF0LWljb25cclxuICAgICAgICAgICAgICAgID5cclxuICAgICAgICAgICAgICB9IEBlbHNlIHtcclxuICAgICAgICAgICAgICAgIDxtYXQtaWNvbiAoY2xpY2spPVwiY29sdW1uLmV4cGFuZGVkID0gIWNvbHVtbi5leHBhbmRlZFwiXHJcbiAgICAgICAgICAgICAgICAgID5rZXlib2FyZF9hcnJvd19kb3duPC9tYXQtaWNvblxyXG4gICAgICAgICAgICAgICAgPlxyXG4gICAgICAgICAgICAgIH1cclxuICAgICAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgICAgIDxkaXZcclxuICAgICAgICAgICAgICBjbGFzcz1cImZpbHRlci1jb250ZW50IHJvd1wiXHJcbiAgICAgICAgICAgICAgW25nQ2xhc3NdPVwieyBoaWRlOiAhY29sdW1uLmV4cGFuZGVkIH1cIlxyXG4gICAgICAgICAgICA+XHJcbiAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cImNvbC1hdXRvXCI+XHJcbiAgICAgICAgICAgICAgICA8bWF0LWZvcm0tZmllbGQgYXBwZWFyYW5jZT1cIm91dGxpbmVcIiBzdHlsZT1cIndpZHRoOiAxMDBweFwiPlxyXG4gICAgICAgICAgICAgICAgICA8bWF0LWxhYmVsPkZpbHRlcjwvbWF0LWxhYmVsPlxyXG4gICAgICAgICAgICAgICAgICA8aW5wdXRcclxuICAgICAgICAgICAgICAgICAgICBtYXRJbnB1dFxyXG4gICAgICAgICAgICAgICAgICAgIHR5cGU9XCJ0ZXh0XCJcclxuICAgICAgICAgICAgICAgICAgICBbZGlzYWJsZWRdPVwidHJ1ZVwiXHJcbiAgICAgICAgICAgICAgICAgICAgW3ZhbHVlXT1cIidDb250YWlucydcIlxyXG4gICAgICAgICAgICAgICAgICAvPlxyXG4gICAgICAgICAgICAgICAgPC9tYXQtZm9ybS1maWVsZD5cclxuICAgICAgICAgICAgICA8L2Rpdj5cclxuXHJcbiAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cImNvbFwiPlxyXG4gICAgICAgICAgICAgICAgPG1hdC1mb3JtLWZpZWxkIGFwcGVhcmFuY2U9XCJvdXRsaW5lXCI+XHJcbiAgICAgICAgICAgICAgICAgIDxtYXQtbGFiZWw+U2VhcmNoPC9tYXQtbGFiZWw+XHJcbiAgICAgICAgICAgICAgICAgIDxpbnB1dFxyXG4gICAgICAgICAgICAgICAgICAgIG1hdElucHV0XHJcbiAgICAgICAgICAgICAgICAgICAgdHlwZT1cInRleHRcIlxyXG4gICAgICAgICAgICAgICAgICAgIFtkaXNhYmxlZF09XCJjb2x1bW4udmlzaWJsZVwiXHJcbiAgICAgICAgICAgICAgICAgICAgW2Zvcm1Db250cm9sTmFtZV09XCJjb2x1bW4uZmllbGRcIlxyXG4gICAgICAgICAgICAgICAgICAvPlxyXG4gICAgICAgICAgICAgICAgICA8YnV0dG9uXHJcbiAgICAgICAgICAgICAgICAgICAgbWF0U3VmZml4XHJcbiAgICAgICAgICAgICAgICAgICAgbWF0LWljb24tYnV0dG9uXHJcbiAgICAgICAgICAgICAgICAgICAgYXJpYS1sYWJlbD1cIkNsZWFyXCJcclxuICAgICAgICAgICAgICAgICAgICAoY2xpY2spPVwiZm9ybUdyb3VwLmNvbnRyb2xzW2NvbHVtbi5maWVsZF0uc2V0VmFsdWUoJycpXCJcclxuICAgICAgICAgICAgICAgICAgPlxyXG4gICAgICAgICAgICAgICAgICAgIDxtYXQtaWNvbiBzdHlsZT1cImZvbnQtc2l6ZTogMjJweFwiPmNsb3NlPC9tYXQtaWNvbj5cclxuICAgICAgICAgICAgICAgICAgPC9idXR0b24+XHJcbiAgICAgICAgICAgICAgICA8L21hdC1mb3JtLWZpZWxkPlxyXG4gICAgICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgIH1cclxuICAgICAgfVxyXG4gICAgfVxyXG4gIDwvZm9ybT5cclxuPC9tYXQtZGlhbG9nLWNvbnRlbnQ+XHJcbjxtYXQtZGlhbG9nLWFjdGlvbnM+XHJcbiAgPGRpdiBjbGFzcz1cInJvdyBqdXN0aWZ5LWNvbnRlbnQtYmV0d2VlblwiPlxyXG4gICAgPGJ1dHRvbiBtYXQtZmxhdC1idXR0b24gbWF0LWRpYWxvZy1jbG9zZT5DYW5jZWw8L2J1dHRvbj5cclxuICAgIDxidXR0b24gbWF0LWZsYXQtYnV0dG9uIGNvbG9yPVwiYWNjZW50XCIgKGNsaWNrKT1cInNhdmVGaWx0ZXJzKClcIj5TYXZlPC9idXR0b24+XHJcbiAgPC9kaXY+XHJcbjwvbWF0LWRpYWxvZy1hY3Rpb25zPlxyXG4iXX0=

package/esm2022/lib/components/material-table/material-table-caption/material-table-order-column-dialog/material-table-order-column-dialog.component.mjs

@@ -0,0 +1,36 @@
+import { Component, Inject } from '@angular/core';
+import { MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { moveItemInArray } from '@angular/cdk/drag-drop';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/material/dialog";
+import * as i2 from "@angular/material/button";
+import * as i3 from "@angular/material/icon";
+import * as i4 from "@angular/cdk/drag-drop";
+export class MaterialTableOrderColumnDialogComponent {
+    constructor(dialogData, dialogRef) {
+        this.dialogData = dialogData;
+        this.dialogRef = dialogRef;
+        this.columns = [];
+    }
+    ngOnInit() {
+        this.columns = this.dialogData.columns.map(column => ({ ...column }));
+    }
+    drop(event) {
+        moveItemInArray(this.columns, event.previousIndex, event.currentIndex);
+    }
+    saveOrder() {
+        this.dialogRef.close({
+            columnsOrder: this.columns.map(column => column.field),
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MaterialTableOrderColumnDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: MaterialTableOrderColumnDialogComponent, selector: "st-material-table-order-column-dialog", ngImport: i0, template: "<h3 mat-dialog-title>Reorder Columns</h3>\r\n<mat-dialog-content>\r\n  <div\r\n    cdkDropList\r\n    class=\"reorder-column-list\"\r\n    (cdkDropListDropped)=\"drop($event)\"\r\n  >\r\n    @for (column of columns; track column.field) {\r\n      <div class=\"reorder-column-element\" cdkDrag>\r\n        <div class=\"row\">\r\n          <mat-icon>drag_indicator</mat-icon>\r\n          <p>{{ column.translateColumnName || column.field }}</p>\r\n        </div>\r\n        @if (!column.visible) {\r\n          <mat-icon class=\"column-hidden\">visibility_off</mat-icon>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n  <div class=\"row justify-content-between\">\r\n    <button mat-flat-button mat-dialog-close>Cancel</button>\r\n    <button mat-flat-button color=\"accent\" (click)=\"saveOrder()\">Save</button>\r\n  </div>\r\n</mat-dialog-actions>\r\n", styles: [".reorder-column-list{width:100%;border:solid 1px #ccc}.reorder-column-list .reorder-column-element{width:100%;padding:20px 10px;border-bottom:solid 1px #ccc;color:#000000de;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;cursor:move;background:#fff}.reorder-column-list .reorder-column-element:last-child{border-bottom:none}.reorder-column-list .reorder-column-element .column-hidden{opacity:.3}.reorder-column-list .reorder-column-element p{margin-bottom:0;margin-top:1px}.cdk-drag-preview{overflow-y:hidden;padding:20px 10px;border:none;box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-preview p{margin-top:5px}.cdk-drag-preview mat-icon{display:none}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.reorder-column-element:last-child{border:none}.reorder-column-list.cdk-drop-list-dragging .reorder-column-element:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], dependencies: [{ kind: "component", type: i2.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i4.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i4.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MaterialTableOrderColumnDialogComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'st-material-table-order-column-dialog', template: "<h3 mat-dialog-title>Reorder Columns</h3>\r\n<mat-dialog-content>\r\n  <div\r\n    cdkDropList\r\n    class=\"reorder-column-list\"\r\n    (cdkDropListDropped)=\"drop($event)\"\r\n  >\r\n    @for (column of columns; track column.field) {\r\n      <div class=\"reorder-column-element\" cdkDrag>\r\n        <div class=\"row\">\r\n          <mat-icon>drag_indicator</mat-icon>\r\n          <p>{{ column.translateColumnName || column.field }}</p>\r\n        </div>\r\n        @if (!column.visible) {\r\n          <mat-icon class=\"column-hidden\">visibility_off</mat-icon>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n  <div class=\"row justify-content-between\">\r\n    <button mat-flat-button mat-dialog-close>Cancel</button>\r\n    <button mat-flat-button color=\"accent\" (click)=\"saveOrder()\">Save</button>\r\n  </div>\r\n</mat-dialog-actions>\r\n", styles: [".reorder-column-list{width:100%;border:solid 1px #ccc}.reorder-column-list .reorder-column-element{width:100%;padding:20px 10px;border-bottom:solid 1px #ccc;color:#000000de;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;cursor:move;background:#fff}.reorder-column-list .reorder-column-element:last-child{border-bottom:none}.reorder-column-list .reorder-column-element .column-hidden{opacity:.3}.reorder-column-list .reorder-column-element p{margin-bottom:0;margin-top:1px}.cdk-drag-preview{overflow-y:hidden;padding:20px 10px;border:none;box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-preview p{margin-top:5px}.cdk-drag-preview mat-icon{display:none}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.reorder-column-element:last-child{border:none}.reorder-column-list.cdk-drop-list-dragging .reorder-column-element:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"] }]
+        }], ctorParameters: () => [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [MAT_DIALOG_DATA]
+                }] }, { type: i1.MatDialogRef }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWF0ZXJpYWwtdGFibGUtb3JkZXItY29sdW1uLWRpYWxvZy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtc3QtdGFibGVzL3NyYy9saWIvY29tcG9uZW50cy9tYXRlcmlhbC10YWJsZS9tYXRlcmlhbC10YWJsZS1jYXB0aW9uL21hdGVyaWFsLXRhYmxlLW9yZGVyLWNvbHVtbi1kaWFsb2cvbWF0ZXJpYWwtdGFibGUtb3JkZXItY29sdW1uLWRpYWxvZy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtc3QtdGFibGVzL3NyYy9saWIvY29tcG9uZW50cy9tYXRlcmlhbC10YWJsZS9tYXRlcmlhbC10YWJsZS1jYXB0aW9uL21hdGVyaWFsLXRhYmxlLW9yZGVyLWNvbHVtbi1kaWFsb2cvbWF0ZXJpYWwtdGFibGUtb3JkZXItY29sdW1uLWRpYWxvZy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sRUFBVSxNQUFNLGVBQWUsQ0FBQztBQUMxRCxPQUFPLEVBQUUsZUFBZSxFQUFnQixNQUFNLDBCQUEwQixDQUFDO0FBQ3pFLE9BQU8sRUFBZSxlQUFlLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQzs7Ozs7O0FBUXRFLE1BQU0sT0FBTyx1Q0FBdUM7SUFHbEQsWUFFUyxVQUF5RCxFQUN6RCxTQUdOO1FBSk0sZUFBVSxHQUFWLFVBQVUsQ0FBK0M7UUFDekQsY0FBUyxHQUFULFNBQVMsQ0FHZjtRQVJILFlBQU8sR0FBcUMsRUFBRSxDQUFDO0lBUzVDLENBQUM7SUFFSixRQUFRO1FBQ04sSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLE9BQU8sQ0FBQyxHQUFHLENBQUMsTUFBTSxDQUFDLEVBQUUsQ0FBQyxDQUFDLEVBQUUsR0FBRyxNQUFNLEVBQUUsQ0FBQyxDQUFDLENBQUM7SUFDeEUsQ0FBQztJQUVELElBQUksQ0FBQyxLQUE0QjtRQUMvQixlQUFlLENBQUMsSUFBSSxDQUFDLE9BQU8sRUFBRSxLQUFLLENBQUMsYUFBYSxFQUFFLEtBQUssQ0FBQyxZQUFZLENBQUMsQ0FBQztJQUN6RSxDQUFDO0lBRUQsU0FBUztRQUNQLElBQUksQ0FBQyxTQUFTLENBQUMsS0FBSyxDQUFDO1lBQ25CLFlBQVksRUFBRSxJQUFJLENBQUMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxNQUFNLENBQUMsRUFBRSxDQUFDLE1BQU0sQ0FBQyxLQUFLLENBQUM7U0FDdkQsQ0FBQyxDQUFDO0lBQ0wsQ0FBQzsrR0F4QlUsdUNBQXVDLGtCQUl4QyxlQUFlO21HQUpkLHVDQUF1Qyw2RUNWcEQsNjRCQTBCQTs7NEZEaEJhLHVDQUF1QztrQkFMbkQsU0FBUzsrQkFDRSx1Q0FBdUM7OzBCQVE5QyxNQUFNOzJCQUFDLGVBQWUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEluamVjdCwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IE1BVF9ESUFMT0dfREFUQSwgTWF0RGlhbG9nUmVmIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvZGlhbG9nJztcclxuaW1wb3J0IHsgQ2RrRHJhZ0Ryb3AsIG1vdmVJdGVtSW5BcnJheSB9IGZyb20gJ0Bhbmd1bGFyL2Nkay9kcmFnLWRyb3AnO1xyXG5pbXBvcnQgeyBWaWV3U3RNYXRlcmlhbFRhYmxlQ29sdW1uTW9kZWwgfSBmcm9tICcuLi8uLi8uLi8uLi9tb2RlbHMvdmlldy92aWV3LXN0LW1hdGVyaWFsLXRhYmxlLWNvbHVtbi5tb2RlbCc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ3N0LW1hdGVyaWFsLXRhYmxlLW9yZGVyLWNvbHVtbi1kaWFsb2cnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9tYXRlcmlhbC10YWJsZS1vcmRlci1jb2x1bW4tZGlhbG9nLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi9tYXRlcmlhbC10YWJsZS1vcmRlci1jb2x1bW4tZGlhbG9nLmNvbXBvbmVudC5zY3NzJ10sXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBNYXRlcmlhbFRhYmxlT3JkZXJDb2x1bW5EaWFsb2dDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gIGNvbHVtbnM6IFZpZXdTdE1hdGVyaWFsVGFibGVDb2x1bW5Nb2RlbFtdID0gW107XHJcblxyXG4gIGNvbnN0cnVjdG9yKFxyXG4gICAgQEluamVjdChNQVRfRElBTE9HX0RBVEEpXHJcbiAgICBwdWJsaWMgZGlhbG9nRGF0YTogeyBjb2x1bW5zOiBWaWV3U3RNYXRlcmlhbFRhYmxlQ29sdW1uTW9kZWxbXSB9LFxyXG4gICAgcHVibGljIGRpYWxvZ1JlZjogTWF0RGlhbG9nUmVmPFxyXG4gICAgICBNYXRlcmlhbFRhYmxlT3JkZXJDb2x1bW5EaWFsb2dDb21wb25lbnQsXHJcbiAgICAgIE1hdGVyaWFsVGFibGVPcmRlckNvbHVtbkRpYWxvZ1Jlc3VsdFxyXG4gICAgPlxyXG4gICkge31cclxuXHJcbiAgbmdPbkluaXQoKSB7XHJcbiAgICB0aGlzLmNvbHVtbnMgPSB0aGlzLmRpYWxvZ0RhdGEuY29sdW1ucy5tYXAoY29sdW1uID0+ICh7IC4uLmNvbHVtbiB9KSk7XHJcbiAgfVxyXG5cclxuICBkcm9wKGV2ZW50OiBDZGtEcmFnRHJvcDxzdHJpbmdbXT4pIHtcclxuICAgIG1vdmVJdGVtSW5BcnJheSh0aGlzLmNvbHVtbnMsIGV2ZW50LnByZXZpb3VzSW5kZXgsIGV2ZW50LmN1cnJlbnRJbmRleCk7XHJcbiAgfVxyXG5cclxuICBzYXZlT3JkZXIoKSB7XHJcbiAgICB0aGlzLmRpYWxvZ1JlZi5jbG9zZSh7XHJcbiAgICAgIGNvbHVtbnNPcmRlcjogdGhpcy5jb2x1bW5zLm1hcChjb2x1bW4gPT4gY29sdW1uLmZpZWxkKSxcclxuICAgIH0pO1xyXG4gIH1cclxufVxyXG5cclxuZXhwb3J0IGludGVyZmFjZSBNYXRlcmlhbFRhYmxlT3JkZXJDb2x1bW5EaWFsb2dSZXN1bHQge1xyXG4gIGNvbHVtbnNPcmRlcjogc3RyaW5nW107XHJcbn1cclxuIiwiPGgzIG1hdC1kaWFsb2ctdGl0bGU+UmVvcmRlciBDb2x1bW5zPC9oMz5cclxuPG1hdC1kaWFsb2ctY29udGVudD5cclxuICA8ZGl2XHJcbiAgICBjZGtEcm9wTGlzdFxyXG4gICAgY2xhc3M9XCJyZW9yZGVyLWNvbHVtbi1saXN0XCJcclxuICAgIChjZGtEcm9wTGlzdERyb3BwZWQpPVwiZHJvcCgkZXZlbnQpXCJcclxuICA+XHJcbiAgICBAZm9yIChjb2x1bW4gb2YgY29sdW1uczsgdHJhY2sgY29sdW1uLmZpZWxkKSB7XHJcbiAgICAgIDxkaXYgY2xhc3M9XCJyZW9yZGVyLWNvbHVtbi1lbGVtZW50XCIgY2RrRHJhZz5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwicm93XCI+XHJcbiAgICAgICAgICA8bWF0LWljb24+ZHJhZ19pbmRpY2F0b3I8L21hdC1pY29uPlxyXG4gICAgICAgICAgPHA+e3sgY29sdW1uLnRyYW5zbGF0ZUNvbHVtbk5hbWUgfHwgY29sdW1uLmZpZWxkIH19PC9wPlxyXG4gICAgICAgIDwvZGl2PlxyXG4gICAgICAgIEBpZiAoIWNvbHVtbi52aXNpYmxlKSB7XHJcbiAgICAgICAgICA8bWF0LWljb24gY2xhc3M9XCJjb2x1bW4taGlkZGVuXCI+dmlzaWJpbGl0eV9vZmY8L21hdC1pY29uPlxyXG4gICAgICAgIH1cclxuICAgICAgPC9kaXY+XHJcbiAgICB9XHJcbiAgPC9kaXY+XHJcbjwvbWF0LWRpYWxvZy1jb250ZW50PlxyXG48bWF0LWRpYWxvZy1hY3Rpb25zPlxyXG4gIDxkaXYgY2xhc3M9XCJyb3cganVzdGlmeS1jb250ZW50LWJldHdlZW5cIj5cclxuICAgIDxidXR0b24gbWF0LWZsYXQtYnV0dG9uIG1hdC1kaWFsb2ctY2xvc2U+Q2FuY2VsPC9idXR0b24+XHJcbiAgICA8YnV0dG9uIG1hdC1mbGF0LWJ1dHRvbiBjb2xvcj1cImFjY2VudFwiIChjbGljayk9XCJzYXZlT3JkZXIoKVwiPlNhdmU8L2J1dHRvbj5cclxuICA8L2Rpdj5cclxuPC9tYXQtZGlhbG9nLWFjdGlvbnM+XHJcbiJdfQ==