@tilde-nlp/ngx-common 6.1.21 → 6.1.23

package/esm2022/lib/multi-functional-table/multi-functional-table.component.mjs

@@ -551,11 +551,11 @@ export class MultiFunctionalTableComponent {
             i0.ɵɵproperty("ngForOf", ctx.configurableColumns);
             i0.ɵɵadvance(3);
             i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(30, 19, "MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT_SAVE"), " ");
-        } }, dependencies: [i3.NgForOf, i3.NgIf, i4.MatTable, i4.MatHeaderCellDef, i4.MatHeaderRowDef, i4.MatColumnDef, i4.MatCellDef, i4.MatRowDef, i4.MatHeaderCell, i4.MatCell, i4.MatHeaderRow, i4.MatRow, i4.MatNoDataRow, i5.MatButton, i5.MatIconButton, i6.MatMenu, i6.MatMenuTrigger, i7.MatCheckbox, i8.NgControlStatus, i8.NgModel, i9.FilterBarComponent, i10.DefaultLayoutDirective, i10.DefaultLayoutGapDirective, i10.DefaultLayoutAlignDirective, i10.DefaultFlexDirective, i11.DefaultClassDirective, i12.MatTooltip, i13.StatusDisplayComponent, i14.MatIcon, i2.TranslatePipe], styles: ["[_nghost-%COMP%]     th, [_nghost-%COMP%]     tr{white-space:nowrap}[_nghost-%COMP%]     td:not(:first-of-type){padding-right:10px!important}[_nghost-%COMP%]     tr.mat-mdc-row:hover, [_nghost-%COMP%]     tr.mat-mdc-row.highlight{background-color:var(--base-95)}[_nghost-%COMP%]     tr.mat-mdc-row.highlight-error{background-color:var(--warning-light)}[_nghost-%COMP%]     .export-data .mdc-button__label{display:flex;align-items:center}[_nghost-%COMP%]     .mat-mdc-cell, [_nghost-%COMP%]     .mat-mdc-header-cell, [_nghost-%COMP%]     .mdc-data-table__row:last-child{border-bottom-color:var(--base-70)}[_nghost-%COMP%]     .mdc-data-table__row:last-child{border-bottom-width:1px;border-bottom-style:solid}[_nghost-%COMP%]     .mdc-data-table__cell:nth-child(2), [_nghost-%COMP%]     .mdc-data-table__header-cell:nth-child(2){padding:0 16px 0 10px}[_nghost-%COMP%]     td+.cdk-column-columnSelect{display:none}[_nghost-%COMP%]     .clear-filters-wrapper .mat-mdc-icon-button, [_nghost-%COMP%]     .clear-filters-wrapper .mat-mdc-icon-button .mat-mdc-button-touch-target{height:36px!important;width:36px!important}[_nghost-%COMP%]     .clear-filters-wrapper mat-icon{margin-top:-2px;margin-left:-2px}[_nghost-%COMP%]     .filter-active{background-color:var(--neutral-95)}table[_ngcontent-%COMP%]{width:100%}.wild-search-wrapper[_ngcontent-%COMP%]{position:relative;padding:5px 10px;border-radius:4px;border:1px solid var(--neutral-50);margin:0 8px}.wild-search-wrapper[_ngcontent-%COMP%]   input[_ngcontent-%COMP%]{margin-right:30px}.wild-search-wrapper[_ngcontent-%COMP%]   .search-icon[_ngcontent-%COMP%]{color:var(--base-40)}.wild-search-wrapper[_ngcontent-%COMP%]   .wild-search-clear-btn[_ngcontent-%COMP%]{position:absolute;right:3px}.wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%], .wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%]   .mat-mdc-button-touch-target[_ngcontent-%COMP%]{height:33px!important;width:33px!important}.wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%]   mat-icon[_ngcontent-%COMP%], .wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%]   .material-icons[_ngcontent-%COMP%], .wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%]   .material-icons-outlined[_ngcontent-%COMP%]{top:5px!important;left:5px!important}.mobile[_ngcontent-%COMP%]   .wild-search-wrapper[_ngcontent-%COMP%]{margin:0}.column-selector-wrapper[_ngcontent-%COMP%]{display:flex;justify-content:end}.column-select-menu[_ngcontent-%COMP%]{padding:8px 18px 8px 8px}.column-select-save[_ngcontent-%COMP%]{padding-left:8px;padding-top:8px}.column-select-save[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{width:100%}.row-clickable[_ngcontent-%COMP%]{cursor:pointer}.row-clickable[_ngcontent-%COMP%]:active{background-color:var(--base-70)!important}.material-icons[_ngcontent-%COMP%], .material-icons-outlined[_ngcontent-%COMP%]{margin-right:.5rem}.table-action-button[_ngcontent-%COMP%]{margin-bottom:1rem}th.mat-mdc-header-cell[_ngcontent-%COMP%]:first-of-type, td.mat-mdc-cell[_ngcontent-%COMP%]:first-of-type, td.mat-mdc-footer-cell[_ngcontent-%COMP%]:first-of-type{padding:0 0 0 10px}.row-select[_ngcontent-%COMP%]{width:0}.table-overflow[_ngcontent-%COMP%]{overflow-x:auto}.table-dragable[_ngcontent-%COMP%]{cursor:grab;-webkit-user-select:none;user-select:none}.table-dragable[_ngcontent-%COMP%]:active{cursor:grabbing}.table-sticky-header[_ngcontent-%COMP%]{max-height:70vh}"] }); }
+        } }, dependencies: [i3.NgForOf, i3.NgIf, i4.MatTable, i4.MatHeaderCellDef, i4.MatHeaderRowDef, i4.MatColumnDef, i4.MatCellDef, i4.MatRowDef, i4.MatHeaderCell, i4.MatCell, i4.MatHeaderRow, i4.MatRow, i4.MatNoDataRow, i5.MatButton, i5.MatIconButton, i6.MatMenu, i6.MatMenuTrigger, i7.MatCheckbox, i8.NgControlStatus, i8.NgModel, i9.FilterBarComponent, i10.DefaultLayoutDirective, i10.DefaultLayoutGapDirective, i10.DefaultLayoutAlignDirective, i10.DefaultFlexDirective, i11.DefaultClassDirective, i12.MatTooltip, i13.StatusDisplayComponent, i14.MatIcon, i2.TranslatePipe], styles: ["[_nghost-%COMP%]     th, [_nghost-%COMP%]     tr{white-space:nowrap}[_nghost-%COMP%]     td:not(:first-of-type){padding-right:10px!important}[_nghost-%COMP%]     tr.mat-mdc-row:hover, [_nghost-%COMP%]     tr.mat-mdc-row.highlight{background-color:var(--base-95)}[_nghost-%COMP%]     tr.mat-mdc-row.highlight-error{background-color:var(--warning-light)}[_nghost-%COMP%]     .export-data .mdc-button__label{display:flex;align-items:center}[_nghost-%COMP%]     .mat-mdc-cell, [_nghost-%COMP%]     .mat-mdc-header-cell, [_nghost-%COMP%]     .mdc-data-table__row:last-child{border-bottom-color:var(--base-70)}[_nghost-%COMP%]     .mdc-data-table__row:last-child{border-bottom-width:1px;border-bottom-style:solid}[_nghost-%COMP%]     .mdc-data-table__cell:nth-child(2), [_nghost-%COMP%]     .mdc-data-table__header-cell:nth-child(2){padding:0 16px 0 10px}[_nghost-%COMP%]     td+.cdk-column-columnSelect{display:none}[_nghost-%COMP%]     .clear-filters-wrapper .mat-mdc-icon-button, [_nghost-%COMP%]     .clear-filters-wrapper .mat-mdc-icon-button .mat-mdc-button-touch-target{height:36px!important;width:36px!important}[_nghost-%COMP%]     .clear-filters-wrapper mat-icon{margin-top:-2px;margin-left:-2px}[_nghost-%COMP%]     .filter-active{background-color:var(--neutral-95)}[_nghost-%COMP%]     .row-actions{opacity:0}[_nghost-%COMP%]     .highlight .row-actions{opacity:1}table[_ngcontent-%COMP%]{width:100%}.wild-search-wrapper[_ngcontent-%COMP%]{position:relative;padding:5px 10px;border-radius:4px;border:1px solid var(--neutral-50);margin:0 8px}.wild-search-wrapper[_ngcontent-%COMP%]   input[_ngcontent-%COMP%]{margin-right:30px}.wild-search-wrapper[_ngcontent-%COMP%]   .search-icon[_ngcontent-%COMP%]{color:var(--base-40)}.wild-search-wrapper[_ngcontent-%COMP%]   .wild-search-clear-btn[_ngcontent-%COMP%]{position:absolute;right:3px}.wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%], .wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%]   .mat-mdc-button-touch-target[_ngcontent-%COMP%]{height:33px!important;width:33px!important}.wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%]   mat-icon[_ngcontent-%COMP%], .wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%]   .material-icons[_ngcontent-%COMP%], .wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%]   .material-icons-outlined[_ngcontent-%COMP%]{top:5px!important;left:5px!important}.mobile[_ngcontent-%COMP%]   .wild-search-wrapper[_ngcontent-%COMP%]{margin:0}.column-selector-wrapper[_ngcontent-%COMP%]{display:flex;justify-content:end}.column-select-menu[_ngcontent-%COMP%]{padding:8px 18px 8px 8px}.column-select-save[_ngcontent-%COMP%]{padding-left:8px;padding-top:8px}.column-select-save[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{width:100%}.row-clickable[_ngcontent-%COMP%]{cursor:pointer}.row-clickable[_ngcontent-%COMP%]:active{background-color:var(--base-70)!important}.material-icons[_ngcontent-%COMP%], .material-icons-outlined[_ngcontent-%COMP%]{margin-right:.5rem}.table-action-button[_ngcontent-%COMP%]{margin-bottom:1rem}th.mat-mdc-header-cell[_ngcontent-%COMP%]:first-of-type, td.mat-mdc-cell[_ngcontent-%COMP%]:first-of-type, td.mat-mdc-footer-cell[_ngcontent-%COMP%]:first-of-type{padding:0 0 0 10px}.row-select[_ngcontent-%COMP%]{width:0}.table-overflow[_ngcontent-%COMP%]{overflow-x:auto}.table-dragable[_ngcontent-%COMP%]{cursor:grab;-webkit-user-select:none;user-select:none}.table-dragable[_ngcontent-%COMP%]:active{cursor:grabbing}.table-sticky-header[_ngcontent-%COMP%]{max-height:70vh}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MultiFunctionalTableComponent, [{
         type: Component,
-        args: [{ selector: 'tld-multi-functional-table', template: "<div [ngClass.lt-md]=\"'mobile'\" fxLayout=\"column\" fxLayoutGap=\"0.75rem\">\r\n  <div fxLayout=\"row\" fxLayout.lt-md=\"column\" fxLayoutGap.lt-md=\"0.75rem\">\r\n    <div\r\n      fxFlex\r\n      fxLayout.lt-md=\"column\"\r\n      fxLayoutGap=\"0.75rem\"\r\n      fxLayoutAlign=\"start center\"\r\n      fxLayoutAlign.lt-md=\"start start\"\r\n      class=\"action-row\"\r\n    >\r\n      <button\r\n        class=\"export-data\"\r\n        mat-stroked-button\r\n        color=\"primary-accent-darker\"\r\n        *ngIf=\"exportActive\"\r\n        (click)=\"export()\"\r\n      >\r\n        <span class=\"material-icons-outlined\">cloud_download</span>\r\n        <span>{{ \"MULTI_FUNCTIONAL_TABLE.EXPORT\" | translate }}</span>\r\n      </button>\r\n\r\n      <div\r\n        *ngIf=\"filterActive && showFilterToggle\"\r\n        fxFlex\r\n        fxLayoutGap=\"0.5rem\"\r\n        fxLayoutAlign=\"start center\"\r\n      >\r\n        <button\r\n          [class.filter-active]=\"filterBarVisible\"\r\n          mat-stroked-button\r\n          color=\"primary-accent-darker\"\r\n          (click)=\"toggleFilterBar()\"\r\n        >\r\n          <span class=\"material-icons\">filter_list</span>\r\n          <span>{{ \"MULTI_FUNCTIONAL_TABLE.FILTER_TOGGLE\" | translate }}</span>\r\n        </button>\r\n\r\n        <div *ngIf=\"showFilterReset\" class=\"clear-filters-wrapper\">\r\n          <button mat-icon-button (click)=\"clearFilters()\">\r\n            <mat-icon>close</mat-icon>\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <div\r\n      *ngIf=\"showSearch\"\r\n      fxLayout=\"row\"\r\n      fxLayoutAlign=\"start center\"\r\n      class=\"wild-search-wrapper\"\r\n    >\r\n      <mat-icon\r\n        class=\"search-icon\"\r\n        [matTooltip]=\"hideSearchTooltip ? '' : (searchTooltip | translate)\"\r\n        >search</mat-icon\r\n      >\r\n      <input\r\n        #wildSearch\r\n        type=\"text\"\r\n        [placeholder]=\"searchTitle | translate\"\r\n        (keyup)=\"search($event)\"\r\n      />\r\n      <button\r\n        *ngIf=\"showSearchClearButton && wildSearch.value\"\r\n        mat-icon-button\r\n        class=\"wild-search-clear-btn\"\r\n        (click)=\"wildSearch.value = ''; search({ target: { value: '' } })\"\r\n      >\r\n        <mat-icon>close</mat-icon>\r\n      </button>\r\n    </div>\r\n\r\n    <ng-content select=\"[additionalActions]\"></ng-content>\r\n  </div>\r\n\r\n  <tld-filter-bar\r\n    *ngIf=\"config.filter && config.filter.enabled\"\r\n    #filterBar\r\n    [filterRowVisible]=\"filterBarVisible\"\r\n    [settings]=\"config.filter.settings\"\r\n    (filterBarChange)=\"filtersChanged($event)\"\r\n  >\r\n  </tld-filter-bar>\r\n\r\n  <ng-content select=\"[batchActions]\"></ng-content>\r\n\r\n  <div\r\n    #tableContainer\r\n    class=\"table-overflow\"\r\n    [class.table-sticky-header]=\"config?.stickyHeader\"\r\n    [class.table-dragable]=\"tableOverflow && !config?.disableMouseDragging\"\r\n    (mousedown)=\"onMouseDown($event)\"\r\n    (mouseup)=\"onMouseUp()\"\r\n    (mouseleave)=\"onMouseUp()\"\r\n    (mousemove)=\"onMouseMove($event)\"\r\n  >\r\n    <table\r\n      #table\r\n      mat-table\r\n      [dataSource]=\"config.dataSource\"\r\n      [trackBy]=\"trackByFn\"\r\n    >\r\n      <ng-content></ng-content>\r\n      <ng-container [matColumnDef]=\"batchColumnName\">\r\n        <th class=\"row-select\" mat-header-cell *matHeaderCellDef disable-export>\r\n          <mat-checkbox\r\n            [matTooltip]=\"'MULTI_FUNCTIONAL_TABLE.SELECT_ALL' | translate\"\r\n            [disabled]=\"config.batchConfig!.checkBoxesDisabled\"\r\n            (change)=\"toggleAllRowSelection()\"\r\n            [checked]=\"matSelection.hasValue() && isAllSelected()\"\r\n            [indeterminate]=\"matSelection.hasValue() && !isAllSelected()\"\r\n          >\r\n          </mat-checkbox>\r\n        </th>\r\n        <td\r\n          class=\"row-select\"\r\n          mat-cell\r\n          *matCellDef=\"let element\"\r\n          disable-export\r\n        >\r\n          <mat-checkbox\r\n            [matTooltip]=\"'MULTI_FUNCTIONAL_TABLE.SELECT' | translate\"\r\n            *ngIf=\"\r\n              isRowCheckboxAlwaysVisible ||\r\n              hoveredRow === element ||\r\n              matSelection.isSelected(element)\r\n            \"\r\n            [disabled]=\"\r\n              config.batchConfig!.checkBoxesDisabled ||\r\n              (preselectedItems.includes(element) && disablePreselectedItems)\r\n            \"\r\n            (click)=\"$event.stopPropagation()\"\r\n            (change)=\"toggleElementSelection(element)\"\r\n            [checked]=\"matSelection.isSelected(element)\"\r\n          >\r\n          </mat-checkbox>\r\n        </td>\r\n      </ng-container>\r\n      <tr\r\n        mat-header-row\r\n        *matHeaderRowDef=\"displayColumns; sticky: config?.stickyHeader ?? false\"\r\n      ></tr>\r\n      <tr\r\n        mat-row\r\n        *matRowDef=\"let row; columns: displayColumns\"\r\n        (click)=\"\r\n          config?.rowClickCallback && (!config.disableRowClick || !config?.disableRowClick(row))\r\n            ? config?.rowClickCallback(row)\r\n            : null\r\n        \"\r\n        (mouseover)=\"hoveredRow = row\"\r\n        (mouseleave)=\"hoveredRow = null\"\r\n        [class.row-clickable]=\"\r\n          config?.rowClickCallback && (!config.disableRowClick || !config?.disableRowClick(row))\r\n        \"\r\n        [class.highlight-error]=\"highlightErrorElement(row)\"\r\n        [class.highlight]=\"row === hoveredRow || highlightElement(row)\"\r\n      ></tr>\r\n\r\n      <ng-container [matColumnDef]=\"columnSelectColumnName\">\r\n        <th class=\"row-select\" mat-header-cell *matHeaderCellDef disable-export>\r\n          <div class=\"column-selector-wrapper\">\r\n            <button\r\n              class=\"column-selector\"\r\n              mat-icon-button\r\n              color=\"primary-accent-darker\"\r\n              [matMenuTriggerFor]=\"columnMenu\"\r\n            >\r\n              <span class=\"material-icons\">more_vert</span>\r\n            </button>\r\n          </div>\r\n        </th>\r\n        <td\r\n          class=\"row-select\"\r\n          mat-cell\r\n          *matCellDef=\"let element\"\r\n          disable-export\r\n        ></td>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"noDataRowActive\">\r\n        <tr *matNoDataRow>\r\n          <!-- add random number to make sure it takes full width -->\r\n          <td colspan=\"99\">\r\n            <lib-status-display [config]=\"noDataRowConfig\"></lib-status-display>\r\n          </td>\r\n        </tr>\r\n      </ng-container>\r\n    </table>\r\n  </div>\r\n</div>\r\n\r\n<mat-menu #columnMenu=\"matMenu\">\r\n  <div class=\"column-select-menu\" (click)=\"$event.stopPropagation()\">\r\n    <div *ngFor=\"let column of configurableColumns\">\r\n      <mat-checkbox [(ngModel)]=\"column.selected\">\r\n        {{ column.displayName | translate }}\r\n      </mat-checkbox>\r\n    </div>\r\n\r\n    <div class=\"column-select-save\">\r\n      <button\r\n        mat-flat-button\r\n        color=\"primary-accent-darker\"\r\n        (click)=\"updateDisplayColumns()\"\r\n      >\r\n        {{ \"MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT_SAVE\" | translate }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</mat-menu>\r\n", styles: [":host ::ng-deep th,:host ::ng-deep tr{white-space:nowrap}:host ::ng-deep td:not(:first-of-type){padding-right:10px!important}:host ::ng-deep tr.mat-mdc-row:hover,:host ::ng-deep tr.mat-mdc-row.highlight{background-color:var(--base-95)}:host ::ng-deep tr.mat-mdc-row.highlight-error{background-color:var(--warning-light)}:host ::ng-deep .export-data .mdc-button__label{display:flex;align-items:center}:host ::ng-deep .mat-mdc-cell,:host ::ng-deep .mat-mdc-header-cell,:host ::ng-deep .mdc-data-table__row:last-child{border-bottom-color:var(--base-70)}:host ::ng-deep .mdc-data-table__row:last-child{border-bottom-width:1px;border-bottom-style:solid}:host ::ng-deep .mdc-data-table__cell:nth-child(2),:host ::ng-deep .mdc-data-table__header-cell:nth-child(2){padding:0 16px 0 10px}:host ::ng-deep td+.cdk-column-columnSelect{display:none}:host ::ng-deep .clear-filters-wrapper .mat-mdc-icon-button,:host ::ng-deep .clear-filters-wrapper .mat-mdc-icon-button .mat-mdc-button-touch-target{height:36px!important;width:36px!important}:host ::ng-deep .clear-filters-wrapper mat-icon{margin-top:-2px;margin-left:-2px}:host ::ng-deep .filter-active{background-color:var(--neutral-95)}table{width:100%}.wild-search-wrapper{position:relative;padding:5px 10px;border-radius:4px;border:1px solid var(--neutral-50);margin:0 8px}.wild-search-wrapper input{margin-right:30px}.wild-search-wrapper .search-icon{color:var(--base-40)}.wild-search-wrapper .wild-search-clear-btn{position:absolute;right:3px}.wild-search-wrapper .mat-mdc-icon-button,.wild-search-wrapper .mat-mdc-icon-button .mat-mdc-button-touch-target{height:33px!important;width:33px!important}.wild-search-wrapper .mat-mdc-icon-button mat-icon,.wild-search-wrapper .mat-mdc-icon-button .material-icons,.wild-search-wrapper .mat-mdc-icon-button .material-icons-outlined{top:5px!important;left:5px!important}.mobile .wild-search-wrapper{margin:0}.column-selector-wrapper{display:flex;justify-content:end}.column-select-menu{padding:8px 18px 8px 8px}.column-select-save{padding-left:8px;padding-top:8px}.column-select-save button{width:100%}.row-clickable{cursor:pointer}.row-clickable:active{background-color:var(--base-70)!important}.material-icons,.material-icons-outlined{margin-right:.5rem}.table-action-button{margin-bottom:1rem}th.mat-mdc-header-cell:first-of-type,td.mat-mdc-cell:first-of-type,td.mat-mdc-footer-cell:first-of-type{padding:0 0 0 10px}.row-select{width:0}.table-overflow{overflow-x:auto}.table-dragable{cursor:grab;-webkit-user-select:none;user-select:none}.table-dragable:active{cursor:grabbing}.table-sticky-header{max-height:70vh}\n"] }]
+        args: [{ selector: 'tld-multi-functional-table', template: "<div [ngClass.lt-md]=\"'mobile'\" fxLayout=\"column\" fxLayoutGap=\"0.75rem\">\r\n  <div fxLayout=\"row\" fxLayout.lt-md=\"column\" fxLayoutGap.lt-md=\"0.75rem\">\r\n    <div\r\n      fxFlex\r\n      fxLayout.lt-md=\"column\"\r\n      fxLayoutGap=\"0.75rem\"\r\n      fxLayoutAlign=\"start center\"\r\n      fxLayoutAlign.lt-md=\"start start\"\r\n      class=\"action-row\"\r\n    >\r\n      <button\r\n        class=\"export-data\"\r\n        mat-stroked-button\r\n        color=\"primary-accent-darker\"\r\n        *ngIf=\"exportActive\"\r\n        (click)=\"export()\"\r\n      >\r\n        <span class=\"material-icons-outlined\">cloud_download</span>\r\n        <span>{{ \"MULTI_FUNCTIONAL_TABLE.EXPORT\" | translate }}</span>\r\n      </button>\r\n\r\n      <div\r\n        *ngIf=\"filterActive && showFilterToggle\"\r\n        fxFlex\r\n        fxLayoutGap=\"0.5rem\"\r\n        fxLayoutAlign=\"start center\"\r\n      >\r\n        <button\r\n          [class.filter-active]=\"filterBarVisible\"\r\n          mat-stroked-button\r\n          color=\"primary-accent-darker\"\r\n          (click)=\"toggleFilterBar()\"\r\n        >\r\n          <span class=\"material-icons\">filter_list</span>\r\n          <span>{{ \"MULTI_FUNCTIONAL_TABLE.FILTER_TOGGLE\" | translate }}</span>\r\n        </button>\r\n\r\n        <div *ngIf=\"showFilterReset\" class=\"clear-filters-wrapper\">\r\n          <button mat-icon-button (click)=\"clearFilters()\">\r\n            <mat-icon>close</mat-icon>\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <div\r\n      *ngIf=\"showSearch\"\r\n      fxLayout=\"row\"\r\n      fxLayoutAlign=\"start center\"\r\n      class=\"wild-search-wrapper\"\r\n    >\r\n      <mat-icon\r\n        class=\"search-icon\"\r\n        [matTooltip]=\"hideSearchTooltip ? '' : (searchTooltip | translate)\"\r\n        >search</mat-icon\r\n      >\r\n      <input\r\n        #wildSearch\r\n        type=\"text\"\r\n        [placeholder]=\"searchTitle | translate\"\r\n        (keyup)=\"search($event)\"\r\n      />\r\n      <button\r\n        *ngIf=\"showSearchClearButton && wildSearch.value\"\r\n        mat-icon-button\r\n        class=\"wild-search-clear-btn\"\r\n        (click)=\"wildSearch.value = ''; search({ target: { value: '' } })\"\r\n      >\r\n        <mat-icon>close</mat-icon>\r\n      </button>\r\n    </div>\r\n\r\n    <ng-content select=\"[additionalActions]\"></ng-content>\r\n  </div>\r\n\r\n  <tld-filter-bar\r\n    *ngIf=\"config.filter && config.filter.enabled\"\r\n    #filterBar\r\n    [filterRowVisible]=\"filterBarVisible\"\r\n    [settings]=\"config.filter.settings\"\r\n    (filterBarChange)=\"filtersChanged($event)\"\r\n  >\r\n  </tld-filter-bar>\r\n\r\n  <ng-content select=\"[batchActions]\"></ng-content>\r\n\r\n  <div\r\n    #tableContainer\r\n    class=\"table-overflow\"\r\n    [class.table-sticky-header]=\"config?.stickyHeader\"\r\n    [class.table-dragable]=\"tableOverflow && !config?.disableMouseDragging\"\r\n    (mousedown)=\"onMouseDown($event)\"\r\n    (mouseup)=\"onMouseUp()\"\r\n    (mouseleave)=\"onMouseUp()\"\r\n    (mousemove)=\"onMouseMove($event)\"\r\n  >\r\n    <table\r\n      #table\r\n      mat-table\r\n      [dataSource]=\"config.dataSource\"\r\n      [trackBy]=\"trackByFn\"\r\n    >\r\n      <ng-content></ng-content>\r\n      <ng-container [matColumnDef]=\"batchColumnName\">\r\n        <th class=\"row-select\" mat-header-cell *matHeaderCellDef disable-export>\r\n          <mat-checkbox\r\n            [matTooltip]=\"'MULTI_FUNCTIONAL_TABLE.SELECT_ALL' | translate\"\r\n            [disabled]=\"config.batchConfig!.checkBoxesDisabled\"\r\n            (change)=\"toggleAllRowSelection()\"\r\n            [checked]=\"matSelection.hasValue() && isAllSelected()\"\r\n            [indeterminate]=\"matSelection.hasValue() && !isAllSelected()\"\r\n          >\r\n          </mat-checkbox>\r\n        </th>\r\n        <td\r\n          class=\"row-select\"\r\n          mat-cell\r\n          *matCellDef=\"let element\"\r\n          disable-export\r\n        >\r\n          <mat-checkbox\r\n            [matTooltip]=\"'MULTI_FUNCTIONAL_TABLE.SELECT' | translate\"\r\n            *ngIf=\"\r\n              isRowCheckboxAlwaysVisible ||\r\n              hoveredRow === element ||\r\n              matSelection.isSelected(element)\r\n            \"\r\n            [disabled]=\"\r\n              config.batchConfig!.checkBoxesDisabled ||\r\n              (preselectedItems.includes(element) && disablePreselectedItems)\r\n            \"\r\n            (click)=\"$event.stopPropagation()\"\r\n            (change)=\"toggleElementSelection(element)\"\r\n            [checked]=\"matSelection.isSelected(element)\"\r\n          >\r\n          </mat-checkbox>\r\n        </td>\r\n      </ng-container>\r\n      <tr\r\n        mat-header-row\r\n        *matHeaderRowDef=\"displayColumns; sticky: config?.stickyHeader ?? false\"\r\n      ></tr>\r\n      <tr\r\n        mat-row\r\n        *matRowDef=\"let row; columns: displayColumns\"\r\n        (click)=\"\r\n          config?.rowClickCallback && (!config.disableRowClick || !config?.disableRowClick(row))\r\n            ? config?.rowClickCallback(row)\r\n            : null\r\n        \"\r\n        (mouseover)=\"hoveredRow = row\"\r\n        (mouseleave)=\"hoveredRow = null\"\r\n        [class.row-clickable]=\"\r\n          config?.rowClickCallback && (!config.disableRowClick || !config?.disableRowClick(row))\r\n        \"\r\n        [class.highlight-error]=\"highlightErrorElement(row)\"\r\n        [class.highlight]=\"row === hoveredRow || highlightElement(row)\"\r\n      ></tr>\r\n\r\n      <ng-container [matColumnDef]=\"columnSelectColumnName\">\r\n        <th class=\"row-select\" mat-header-cell *matHeaderCellDef disable-export>\r\n          <div class=\"column-selector-wrapper\">\r\n            <button\r\n              class=\"column-selector\"\r\n              mat-icon-button\r\n              color=\"primary-accent-darker\"\r\n              [matMenuTriggerFor]=\"columnMenu\"\r\n            >\r\n              <span class=\"material-icons\">more_vert</span>\r\n            </button>\r\n          </div>\r\n        </th>\r\n        <td\r\n          class=\"row-select\"\r\n          mat-cell\r\n          *matCellDef=\"let element\"\r\n          disable-export\r\n        ></td>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"noDataRowActive\">\r\n        <tr *matNoDataRow>\r\n          <!-- add random number to make sure it takes full width -->\r\n          <td colspan=\"99\">\r\n            <lib-status-display [config]=\"noDataRowConfig\"></lib-status-display>\r\n          </td>\r\n        </tr>\r\n      </ng-container>\r\n    </table>\r\n  </div>\r\n</div>\r\n\r\n<mat-menu #columnMenu=\"matMenu\">\r\n  <div class=\"column-select-menu\" (click)=\"$event.stopPropagation()\">\r\n    <div *ngFor=\"let column of configurableColumns\">\r\n      <mat-checkbox [(ngModel)]=\"column.selected\">\r\n        {{ column.displayName | translate }}\r\n      </mat-checkbox>\r\n    </div>\r\n\r\n    <div class=\"column-select-save\">\r\n      <button\r\n        mat-flat-button\r\n        color=\"primary-accent-darker\"\r\n        (click)=\"updateDisplayColumns()\"\r\n      >\r\n        {{ \"MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT_SAVE\" | translate }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</mat-menu>\r\n", styles: [":host ::ng-deep th,:host ::ng-deep tr{white-space:nowrap}:host ::ng-deep td:not(:first-of-type){padding-right:10px!important}:host ::ng-deep tr.mat-mdc-row:hover,:host ::ng-deep tr.mat-mdc-row.highlight{background-color:var(--base-95)}:host ::ng-deep tr.mat-mdc-row.highlight-error{background-color:var(--warning-light)}:host ::ng-deep .export-data .mdc-button__label{display:flex;align-items:center}:host ::ng-deep .mat-mdc-cell,:host ::ng-deep .mat-mdc-header-cell,:host ::ng-deep .mdc-data-table__row:last-child{border-bottom-color:var(--base-70)}:host ::ng-deep .mdc-data-table__row:last-child{border-bottom-width:1px;border-bottom-style:solid}:host ::ng-deep .mdc-data-table__cell:nth-child(2),:host ::ng-deep .mdc-data-table__header-cell:nth-child(2){padding:0 16px 0 10px}:host ::ng-deep td+.cdk-column-columnSelect{display:none}:host ::ng-deep .clear-filters-wrapper .mat-mdc-icon-button,:host ::ng-deep .clear-filters-wrapper .mat-mdc-icon-button .mat-mdc-button-touch-target{height:36px!important;width:36px!important}:host ::ng-deep .clear-filters-wrapper mat-icon{margin-top:-2px;margin-left:-2px}:host ::ng-deep .filter-active{background-color:var(--neutral-95)}:host ::ng-deep .row-actions{opacity:0}:host ::ng-deep .highlight .row-actions{opacity:1}table{width:100%}.wild-search-wrapper{position:relative;padding:5px 10px;border-radius:4px;border:1px solid var(--neutral-50);margin:0 8px}.wild-search-wrapper input{margin-right:30px}.wild-search-wrapper .search-icon{color:var(--base-40)}.wild-search-wrapper .wild-search-clear-btn{position:absolute;right:3px}.wild-search-wrapper .mat-mdc-icon-button,.wild-search-wrapper .mat-mdc-icon-button .mat-mdc-button-touch-target{height:33px!important;width:33px!important}.wild-search-wrapper .mat-mdc-icon-button mat-icon,.wild-search-wrapper .mat-mdc-icon-button .material-icons,.wild-search-wrapper .mat-mdc-icon-button .material-icons-outlined{top:5px!important;left:5px!important}.mobile .wild-search-wrapper{margin:0}.column-selector-wrapper{display:flex;justify-content:end}.column-select-menu{padding:8px 18px 8px 8px}.column-select-save{padding-left:8px;padding-top:8px}.column-select-save button{width:100%}.row-clickable{cursor:pointer}.row-clickable:active{background-color:var(--base-70)!important}.material-icons,.material-icons-outlined{margin-right:.5rem}.table-action-button{margin-bottom:1rem}th.mat-mdc-header-cell:first-of-type,td.mat-mdc-cell:first-of-type,td.mat-mdc-footer-cell:first-of-type{padding:0 0 0 10px}.row-select{width:0}.table-overflow{overflow-x:auto}.table-dragable{cursor:grab;-webkit-user-select:none;user-select:none}.table-dragable:active{cursor:grabbing}.table-sticky-header{max-height:70vh}\n"] }]
     }], () => [{ type: i1.DOMService }, { type: i2.TranslateService }], { config: [{
             type: Input
         }], highlightedElements: [{

package/esm2022/lib/toast/models/toast.model.mjs

@@ -1,2 +1,2 @@
 export {};
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9hc3QubW9kZWwuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtY29tbW9uL3NyYy9saWIvdG9hc3QvbW9kZWxzL3RvYXN0Lm1vZGVsLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgaW50ZXJmYWNlIFRvYXN0IHtcclxuICBpZDogbnVtYmVyO1xyXG4gIG1lc3NhZ2U6IHN0cmluZztcclxufVxyXG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9hc3QubW9kZWwuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtY29tbW9uL3NyYy9saWIvdG9hc3QvbW9kZWxzL3RvYXN0Lm1vZGVsLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgaW50ZXJmYWNlIFRvYXN0IHtcclxuICBpZDogbnVtYmVyO1xyXG4gIG1lc3NhZ2U6IHN0cmluZztcclxuICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25vLWV4cGxpY2l0LWFueVxyXG4gIGxvY2FsaXphdGlvblBhcmFtcz86IGFueTtcclxufVxyXG4iXX0=

package/esm2022/lib/toast/toast-service/toast-service.service.mjs

@@ -9,16 +9,22 @@ export class ToastService {
     watchToasts() {
         return this.subject.asObservable();
     }
-    showToast(message) {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    showToast(message, appearanceTime, localizationParams) {
+        const animationDurationTime = 500;
         const toast = {
             id: new Date().getTime(),
             message,
+            localizationParams
         };
         this.toasts.push(toast);
         this.subject.next(this.toasts);
+        setTimeout(() => {
+            document.querySelector('.toast')?.classList.add("fade-out");
+        }, (appearanceTime ?? 3000) - animationDurationTime);
         setTimeout(() => {
             this.closeToast(toast.id);
-        }, 3000);
+        }, appearanceTime ?? 3000);
     }
     closeToast(id) {
         this.toasts = this.toasts.filter((toast) => toast.id !== id);
@@ -33,4 +39,4 @@ export class ToastService {
                 providedIn: 'root',
             }]
     }], null, null); })();
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9hc3Qtc2VydmljZS5zZXJ2aWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWNvbW1vbi9zcmMvbGliL3RvYXN0L3RvYXN0LXNlcnZpY2UvdG9hc3Qtc2VydmljZS5zZXJ2aWNlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDM0MsT0FBTyxFQUFjLE9BQU8sRUFBRSxNQUFNLE1BQU0sQ0FBQzs7QUFNM0MsTUFBTSxPQUFPLFlBQVk7SUFIekI7UUFJVSxXQUFNLEdBQVksRUFBRSxDQUFDO1FBRTdCLFlBQU8sR0FBRyxJQUFJLE9BQU8sRUFBVyxDQUFDO0tBd0JsQztJQXRCQyxXQUFXO1FBQ1QsT0FBTyxJQUFJLENBQUMsT0FBTyxDQUFDLFlBQVksRUFBRSxDQUFDO0lBQ3JDLENBQUM7SUFFRCxTQUFTLENBQUMsT0FBZTtRQUN2QixNQUFNLEtBQUssR0FBVTtZQUNuQixFQUFFLEVBQUUsSUFBSSxJQUFJLEVBQUUsQ0FBQyxPQUFPLEVBQUU7WUFDeEIsT0FBTztTQUNSLENBQUM7UUFFRixJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUN4QixJQUFJLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUM7UUFFL0IsVUFBVSxDQUFDLEdBQUcsRUFBRTtZQUNkLElBQUksQ0FBQyxVQUFVLENBQUMsS0FBSyxDQUFDLEVBQUUsQ0FBQyxDQUFDO1FBQzVCLENBQUMsRUFBRSxJQUFJLENBQUMsQ0FBQztJQUNYLENBQUM7SUFFRCxVQUFVLENBQUMsRUFBVTtRQUNuQixJQUFJLENBQUMsTUFBTSxHQUFHLElBQUksQ0FBQyxNQUFNLENBQUMsTUFBTSxDQUFDLENBQUMsS0FBSyxFQUFFLEVBQUUsQ0FBQyxLQUFLLENBQUMsRUFBRSxLQUFLLEVBQUUsQ0FBQyxDQUFDO1FBQzdELElBQUksQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQztJQUNqQyxDQUFDOzZHQTFCVSxZQUFZO3VFQUFaLFlBQVksV0FBWixZQUFZLG1CQUZYLE1BQU07O2lGQUVQLFlBQVk7Y0FIeEIsVUFBVTtlQUFDO2dCQUNWLFVBQVUsRUFBRSxNQUFNO2FBQ25CIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgSW5qZWN0YWJsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBPYnNlcnZhYmxlLCBTdWJqZWN0IH0gZnJvbSAncnhqcyc7XHJcbmltcG9ydCB7IFRvYXN0IH0gZnJvbSAnLi4vbW9kZWxzL3RvYXN0Lm1vZGVsJztcclxuXHJcbkBJbmplY3RhYmxlKHtcclxuICBwcm92aWRlZEluOiAncm9vdCcsXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBUb2FzdFNlcnZpY2Uge1xyXG4gIHByaXZhdGUgdG9hc3RzOiBUb2FzdFtdID0gW107XHJcblxyXG4gIHN1YmplY3QgPSBuZXcgU3ViamVjdDxUb2FzdFtdPigpO1xyXG5cclxuICB3YXRjaFRvYXN0cygpOiBPYnNlcnZhYmxlPFRvYXN0W10+IHtcclxuICAgIHJldHVybiB0aGlzLnN1YmplY3QuYXNPYnNlcnZhYmxlKCk7XHJcbiAgfVxyXG5cclxuICBzaG93VG9hc3QobWVzc2FnZTogc3RyaW5nKTogdm9pZCB7XHJcbiAgICBjb25zdCB0b2FzdDogVG9hc3QgPSB7XHJcbiAgICAgIGlkOiBuZXcgRGF0ZSgpLmdldFRpbWUoKSxcclxuICAgICAgbWVzc2FnZSxcclxuICAgIH07XHJcblxyXG4gICAgdGhpcy50b2FzdHMucHVzaCh0b2FzdCk7XHJcbiAgICB0aGlzLnN1YmplY3QubmV4dCh0aGlzLnRvYXN0cyk7XHJcblxyXG4gICAgc2V0VGltZW91dCgoKSA9PiB7XHJcbiAgICAgIHRoaXMuY2xvc2VUb2FzdCh0b2FzdC5pZCk7XHJcbiAgICB9LCAzMDAwKTtcclxuICB9XHJcblxyXG4gIGNsb3NlVG9hc3QoaWQ6IG51bWJlcik6IHZvaWQge1xyXG4gICAgdGhpcy50b2FzdHMgPSB0aGlzLnRvYXN0cy5maWx0ZXIoKHRvYXN0KSA9PiB0b2FzdC5pZCAhPT0gaWQpO1xyXG4gICAgdGhpcy5zdWJqZWN0Lm5leHQodGhpcy50b2FzdHMpO1xyXG4gIH1cclxufVxyXG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9hc3Qtc2VydmljZS5zZXJ2aWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWNvbW1vbi9zcmMvbGliL3RvYXN0L3RvYXN0LXNlcnZpY2UvdG9hc3Qtc2VydmljZS5zZXJ2aWNlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDM0MsT0FBTyxFQUFjLE9BQU8sRUFBRSxNQUFNLE1BQU0sQ0FBQzs7QUFNM0MsTUFBTSxPQUFPLFlBQVk7SUFIekI7UUFJVSxXQUFNLEdBQVksRUFBRSxDQUFDO1FBRTdCLFlBQU8sR0FBRyxJQUFJLE9BQU8sRUFBVyxDQUFDO0tBK0JsQztJQTdCQyxXQUFXO1FBQ1QsT0FBTyxJQUFJLENBQUMsT0FBTyxDQUFDLFlBQVksRUFBRSxDQUFDO0lBQ3JDLENBQUM7SUFFRCw4REFBOEQ7SUFDOUQsU0FBUyxDQUFDLE9BQWUsRUFBRSxjQUF1QixFQUFFLGtCQUF3QjtRQUMxRSxNQUFNLHFCQUFxQixHQUFHLEdBQUcsQ0FBQztRQUNsQyxNQUFNLEtBQUssR0FBVTtZQUNuQixFQUFFLEVBQUUsSUFBSSxJQUFJLEVBQUUsQ0FBQyxPQUFPLEVBQUU7WUFDeEIsT0FBTztZQUNQLGtCQUFrQjtTQUNuQixDQUFDO1FBRUYsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDeEIsSUFBSSxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDO1FBRS9CLFVBQVUsQ0FBQyxHQUFHLEVBQUU7WUFDZCxRQUFRLENBQUMsYUFBYSxDQUFDLFFBQVEsQ0FBQyxFQUFFLFNBQVMsQ0FBQyxHQUFHLENBQUMsVUFBVSxDQUFDLENBQUE7UUFDN0QsQ0FBQyxFQUFFLENBQUMsY0FBYyxJQUFJLElBQUksQ0FBQyxHQUFHLHFCQUFxQixDQUFDLENBQUE7UUFFcEQsVUFBVSxDQUFDLEdBQUcsRUFBRTtZQUNkLElBQUksQ0FBQyxVQUFVLENBQUMsS0FBSyxDQUFDLEVBQUUsQ0FBQyxDQUFDO1FBQzVCLENBQUMsRUFBRSxjQUFjLElBQUksSUFBSSxDQUFDLENBQUM7SUFDN0IsQ0FBQztJQUVELFVBQVUsQ0FBQyxFQUFVO1FBQ25CLElBQUksQ0FBQyxNQUFNLEdBQUcsSUFBSSxDQUFDLE1BQU0sQ0FBQyxNQUFNLENBQUMsQ0FBQyxLQUFLLEVBQUUsRUFBRSxDQUFDLEtBQUssQ0FBQyxFQUFFLEtBQUssRUFBRSxDQUFDLENBQUM7UUFDN0QsSUFBSSxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDO0lBQ2pDLENBQUM7NkdBakNVLFlBQVk7dUVBQVosWUFBWSxXQUFaLFlBQVksbUJBRlgsTUFBTTs7aUZBRVAsWUFBWTtjQUh4QixVQUFVO2VBQUM7Z0JBQ1YsVUFBVSxFQUFFLE1BQU07YUFDbkIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBJbmplY3RhYmxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IE9ic2VydmFibGUsIFN1YmplY3QgfSBmcm9tICdyeGpzJztcclxuaW1wb3J0IHsgVG9hc3QgfSBmcm9tICcuLi9tb2RlbHMvdG9hc3QubW9kZWwnO1xyXG5cclxuQEluamVjdGFibGUoe1xyXG4gIHByb3ZpZGVkSW46ICdyb290JyxcclxufSlcclxuZXhwb3J0IGNsYXNzIFRvYXN0U2VydmljZSB7XHJcbiAgcHJpdmF0ZSB0b2FzdHM6IFRvYXN0W10gPSBbXTtcclxuXHJcbiAgc3ViamVjdCA9IG5ldyBTdWJqZWN0PFRvYXN0W10+KCk7XHJcblxyXG4gIHdhdGNoVG9hc3RzKCk6IE9ic2VydmFibGU8VG9hc3RbXT4ge1xyXG4gICAgcmV0dXJuIHRoaXMuc3ViamVjdC5hc09ic2VydmFibGUoKTtcclxuICB9XHJcblxyXG4gIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAdHlwZXNjcmlwdC1lc2xpbnQvbm8tZXhwbGljaXQtYW55XHJcbiAgc2hvd1RvYXN0KG1lc3NhZ2U6IHN0cmluZywgYXBwZWFyYW5jZVRpbWU/OiBudW1iZXIsIGxvY2FsaXphdGlvblBhcmFtcz86IGFueSk6IHZvaWQge1xyXG4gICAgY29uc3QgYW5pbWF0aW9uRHVyYXRpb25UaW1lID0gNTAwO1xyXG4gICAgY29uc3QgdG9hc3Q6IFRvYXN0ID0ge1xyXG4gICAgICBpZDogbmV3IERhdGUoKS5nZXRUaW1lKCksXHJcbiAgICAgIG1lc3NhZ2UsXHJcbiAgICAgIGxvY2FsaXphdGlvblBhcmFtc1xyXG4gICAgfTtcclxuXHJcbiAgICB0aGlzLnRvYXN0cy5wdXNoKHRvYXN0KTtcclxuICAgIHRoaXMuc3ViamVjdC5uZXh0KHRoaXMudG9hc3RzKTtcclxuXHJcbiAgICBzZXRUaW1lb3V0KCgpID0+IHtcclxuICAgICAgZG9jdW1lbnQucXVlcnlTZWxlY3RvcignLnRvYXN0Jyk/LmNsYXNzTGlzdC5hZGQoXCJmYWRlLW91dFwiKVxyXG4gICAgfSwgKGFwcGVhcmFuY2VUaW1lID8/IDMwMDApIC0gYW5pbWF0aW9uRHVyYXRpb25UaW1lKVxyXG5cclxuICAgIHNldFRpbWVvdXQoKCkgPT4ge1xyXG4gICAgICB0aGlzLmNsb3NlVG9hc3QodG9hc3QuaWQpO1xyXG4gICAgfSwgYXBwZWFyYW5jZVRpbWUgPz8gMzAwMCk7XHJcbiAgfVxyXG5cclxuICBjbG9zZVRvYXN0KGlkOiBudW1iZXIpOiB2b2lkIHtcclxuICAgIHRoaXMudG9hc3RzID0gdGhpcy50b2FzdHMuZmlsdGVyKCh0b2FzdCkgPT4gdG9hc3QuaWQgIT09IGlkKTtcclxuICAgIHRoaXMuc3ViamVjdC5uZXh0KHRoaXMudG9hc3RzKTtcclxuICB9XHJcbn1cclxuIl19

package/esm2022/lib/toast/toast.component.mjs

@@ -23,7 +23,7 @@ function ToastComponent_For_2_Template(rf, ctx) { if (rf & 1) {
 } if (rf & 2) {
     const toast_r2 = ctx.$implicit;
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 1, toast_r2.message));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(3, 1, toast_r2.message, toast_r2 == null ? null : toast_r2.localizationParams));
 } }
 export class ToastComponent {
     constructor() {
@@ -42,16 +42,16 @@ export class ToastComponent {
     static { this.ɵfac = function ToastComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ToastComponent)(); }; }
     static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ToastComponent, selectors: [["lib-toast"]], standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 3, vars: 0, consts: [[1, "toast-container"], [1, "toast"], ["mat-icon-button", "", 3, "click"]], template: function ToastComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
-            i0.ɵɵrepeaterCreate(1, ToastComponent_For_2_Template, 7, 3, "div", 1, _forTrack0);
+            i0.ɵɵrepeaterCreate(1, ToastComponent_For_2_Template, 7, 4, "div", 1, _forTrack0);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
             i0.ɵɵadvance();
             i0.ɵɵrepeater(ctx.toasts);
-        } }, dependencies: [CommonModule, MatIconModule, i1.MatIcon, MatButtonModule, i2.MatIconButton, TranslateModule, i3.TranslatePipe], styles: [".toast-container[_ngcontent-%COMP%]{display:flex;justify-content:center;width:100%;position:absolute;bottom:50px}.toast[_ngcontent-%COMP%]{position:relative;display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:400;min-width:350px;padding:4px 4px 4px 16px;letter-spacing:.25px;line-height:20px;border-radius:4px;box-shadow:0 1px 3px #0000004d;box-shadow:0 4px 8px 3px #00000026;color:#feedee;background-color:#382e2f;animation:_ngcontent-%COMP%_slide-in .5s forwards,_ngcontent-%COMP%_fade-out .5s 2.5s forwards}.toast[_ngcontent-%COMP%]:not(:first-of-type){margin-top:10px}[_nghost-%COMP%]     .mat-icon{color:#feedee}@keyframes _ngcontent-%COMP%_slide-in{0%{margin-bottom:-50px;opacity:0}to{margin-bottom:0;opacity:1}}@keyframes _ngcontent-%COMP%_fade-out{0%{opacity:1}to{opacity:0}}"] }); }
+        } }, dependencies: [CommonModule, MatIconModule, i1.MatIcon, MatButtonModule, i2.MatIconButton, TranslateModule, i3.TranslatePipe], styles: [".toast-container[_ngcontent-%COMP%]{display:flex;flex-direction:column;align-items:center;width:100%;position:absolute;bottom:50px}.toast[_ngcontent-%COMP%]{max-width:fit-content;position:relative;display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:400;min-width:350px;padding:4px 4px 4px 16px;letter-spacing:.25px;line-height:20px;border-radius:4px;box-shadow:0 1px 3px #0000004d;box-shadow:0 4px 8px 3px #00000026;color:#feedee;background-color:#382e2f;animation:_ngcontent-%COMP%_slide-in .5s forwards}.toast[_ngcontent-%COMP%]:not(:first-of-type){margin-top:10px}.fade-out[_ngcontent-%COMP%]{animation:_ngcontent-%COMP%_fade-out .5s forwards}[_nghost-%COMP%]     .mat-icon{color:#feedee}@keyframes _ngcontent-%COMP%_slide-in{0%{margin-bottom:-50px;opacity:0}to{margin-bottom:0;opacity:1}}@keyframes _ngcontent-%COMP%_fade-out{0%{opacity:1}to{opacity:0}}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ToastComponent, [{
         type: Component,
-        args: [{ selector: 'lib-toast', standalone: true, imports: [CommonModule, MatIconModule, MatButtonModule, TranslateModule], template: "<div class=\"toast-container\">\r\n  @for (toast of toasts; track toast.id) {\r\n  <div class=\"toast\">\r\n    <span>{{ toast.message | translate }}</span>\r\n    <button mat-icon-button (click)=\"closeToast(toast.id)\">\r\n      <mat-icon>close</mat-icon>\r\n    </button>\r\n  </div>\r\n  }\r\n</div>\r\n", styles: [".toast-container{display:flex;justify-content:center;width:100%;position:absolute;bottom:50px}.toast{position:relative;display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:400;min-width:350px;padding:4px 4px 4px 16px;letter-spacing:.25px;line-height:20px;border-radius:4px;box-shadow:0 1px 3px #0000004d;box-shadow:0 4px 8px 3px #00000026;color:#feedee;background-color:#382e2f;animation:slide-in .5s forwards,fade-out .5s 2.5s forwards}.toast:not(:first-of-type){margin-top:10px}:host ::ng-deep .mat-icon{color:#feedee}@keyframes slide-in{0%{margin-bottom:-50px;opacity:0}to{margin-bottom:0;opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}\n"] }]
+        args: [{ selector: 'lib-toast', standalone: true, imports: [CommonModule, MatIconModule, MatButtonModule, TranslateModule], template: "<div class=\"toast-container\">\r\n  @for (toast of toasts; track toast.id) {\r\n  <div class=\"toast\">\r\n    <span>{{ toast.message | translate: toast?.localizationParams }}</span>\r\n    <button mat-icon-button (click)=\"closeToast(toast.id)\">\r\n      <mat-icon>close</mat-icon>\r\n    </button>\r\n  </div>\r\n  }\r\n</div>\r\n", styles: [".toast-container{display:flex;flex-direction:column;align-items:center;width:100%;position:absolute;bottom:50px}.toast{max-width:fit-content;position:relative;display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:400;min-width:350px;padding:4px 4px 4px 16px;letter-spacing:.25px;line-height:20px;border-radius:4px;box-shadow:0 1px 3px #0000004d;box-shadow:0 4px 8px 3px #00000026;color:#feedee;background-color:#382e2f;animation:slide-in .5s forwards}.toast:not(:first-of-type){margin-top:10px}.fade-out{animation:fade-out .5s forwards}:host ::ng-deep .mat-icon{color:#feedee}@keyframes slide-in{0%{margin-bottom:-50px;opacity:0}to{margin-bottom:0;opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}\n"] }]
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ToastComponent, { className: "ToastComponent", filePath: "lib\\toast\\toast.component.ts", lineNumber: 16 }); })();
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9hc3QuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWNvbW1vbi9zcmMvbGliL3RvYXN0L3RvYXN0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1jb21tb24vc3JjL2xpYi90b2FzdC90b2FzdC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sRUFBVSxNQUFNLGVBQWUsQ0FBQztBQUUxRCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUN2RCxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sMEJBQTBCLENBQUM7QUFDM0QsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHFCQUFxQixDQUFDOzs7Ozs7OztJQ0hsRCxBQURGLDhCQUFtQixXQUNYO0lBQUEsWUFBK0I7O0lBQUEsaUJBQU87SUFDNUMsaUNBQXVEO0lBQS9CLHFNQUFTLDhCQUFvQixLQUFDO0lBQ3BELGdDQUFVO0lBQUEscUJBQUs7SUFFbkIsQUFERSxBQURpQixpQkFBVyxFQUNuQixFQUNMOzs7SUFKRSxlQUErQjtJQUEvQiw0REFBK0I7O0FEWXpDLE1BQU0sT0FBTyxjQUFjO0lBUDNCO1FBUUUsV0FBTSxHQUFZLEVBQUUsQ0FBQztRQUVyQixXQUFNLEdBQUcsTUFBTSxDQUFDLFlBQVksQ0FBQyxDQUFDO0tBVy9CO0lBWEMsTUFBTSxDQUF3QjtJQUU5QixRQUFRO1FBQ04sSUFBSSxDQUFDLE1BQU0sQ0FBQyxXQUFXLEVBQUUsQ0FBQyxTQUFTLENBQUM7WUFDbEMsSUFBSSxFQUFFLENBQUMsTUFBTSxFQUFFLEVBQUUsQ0FBQyxDQUFDLElBQUksQ0FBQyxNQUFNLEdBQUcsTUFBTSxDQUFDO1NBQ3pDLENBQUMsQ0FBQztJQUNMLENBQUM7SUFFRCxVQUFVLENBQUMsRUFBVTtRQUNuQixJQUFJLENBQUMsTUFBTSxDQUFDLFVBQVUsQ0FBQyxFQUFFLENBQUMsQ0FBQztJQUM3QixDQUFDOytHQWJVLGNBQWM7b0VBQWQsY0FBYztZQ2YzQiw4QkFBNkI7WUFDM0IsaUZBT0M7WUFDSCxpQkFBTTs7WUFSSixjQU9DO1lBUEQseUJBT0M7NEJER1MsWUFBWSxFQUFFLGFBQWEsY0FBRSxlQUFlLG9CQUFFLGVBQWU7O2lGQUk1RCxjQUFjO2NBUDFCLFNBQVM7MkJBQ0UsV0FBVyxjQUNULElBQUksV0FDUCxDQUFDLFlBQVksRUFBRSxhQUFhLEVBQUUsZUFBZSxFQUFFLGVBQWUsQ0FBQzs7a0ZBSTdELGNBQWMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIGluamVjdCwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IFRvYXN0IH0gZnJvbSAnLi9tb2RlbHMvdG9hc3QubW9kZWwnO1xyXG5pbXBvcnQgeyBUb2FzdFNlcnZpY2UgfSBmcm9tICcuL3RvYXN0LXNlcnZpY2UnO1xyXG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xyXG5pbXBvcnQgeyBNYXRJY29uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvaWNvbic7XHJcbmltcG9ydCB7IE1hdEJ1dHRvbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL2J1dHRvbic7XHJcbmltcG9ydCB7IFRyYW5zbGF0ZU1vZHVsZSB9IGZyb20gJ0BuZ3gtdHJhbnNsYXRlL2NvcmUnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdsaWItdG9hc3QnLFxyXG4gIHN0YW5kYWxvbmU6IHRydWUsXHJcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZSwgTWF0SWNvbk1vZHVsZSwgTWF0QnV0dG9uTW9kdWxlLCBUcmFuc2xhdGVNb2R1bGVdLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi90b2FzdC5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmw6ICcuL3RvYXN0LmNvbXBvbmVudC5zY3NzJyxcclxufSlcclxuZXhwb3J0IGNsYXNzIFRvYXN0Q29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcclxuICB0b2FzdHM6IFRvYXN0W10gPSBbXTtcclxuXHJcbiAgI3RvYXN0ID0gaW5qZWN0KFRvYXN0U2VydmljZSk7XHJcblxyXG4gIG5nT25Jbml0KCk6IHZvaWQge1xyXG4gICAgdGhpcy4jdG9hc3Qud2F0Y2hUb2FzdHMoKS5zdWJzY3JpYmUoe1xyXG4gICAgICBuZXh0OiAodG9hc3RzKSA9PiAodGhpcy50b2FzdHMgPSB0b2FzdHMpLFxyXG4gICAgfSk7XHJcbiAgfVxyXG5cclxuICBjbG9zZVRvYXN0KGlkOiBudW1iZXIpIHtcclxuICAgIHRoaXMuI3RvYXN0LmNsb3NlVG9hc3QoaWQpO1xyXG4gIH1cclxufVxyXG4iLCI8ZGl2IGNsYXNzPVwidG9hc3QtY29udGFpbmVyXCI+XHJcbiAgQGZvciAodG9hc3Qgb2YgdG9hc3RzOyB0cmFjayB0b2FzdC5pZCkge1xyXG4gIDxkaXYgY2xhc3M9XCJ0b2FzdFwiPlxyXG4gICAgPHNwYW4+e3sgdG9hc3QubWVzc2FnZSB8IHRyYW5zbGF0ZSB9fTwvc3Bhbj5cclxuICAgIDxidXR0b24gbWF0LWljb24tYnV0dG9uIChjbGljayk9XCJjbG9zZVRvYXN0KHRvYXN0LmlkKVwiPlxyXG4gICAgICA8bWF0LWljb24+Y2xvc2U8L21hdC1pY29uPlxyXG4gICAgPC9idXR0b24+XHJcbiAgPC9kaXY+XHJcbiAgfVxyXG48L2Rpdj5cclxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9hc3QuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWNvbW1vbi9zcmMvbGliL3RvYXN0L3RvYXN0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1jb21tb24vc3JjL2xpYi90b2FzdC90b2FzdC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sRUFBVSxNQUFNLGVBQWUsQ0FBQztBQUUxRCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUN2RCxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sMEJBQTBCLENBQUM7QUFDM0QsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHFCQUFxQixDQUFDOzs7Ozs7OztJQ0hsRCxBQURGLDhCQUFtQixXQUNYO0lBQUEsWUFBMEQ7O0lBQUEsaUJBQU87SUFDdkUsaUNBQXVEO0lBQS9CLHFNQUFTLDhCQUFvQixLQUFDO0lBQ3BELGdDQUFVO0lBQUEscUJBQUs7SUFFbkIsQUFERSxBQURpQixpQkFBVyxFQUNuQixFQUNMOzs7SUFKRSxlQUEwRDtJQUExRCxtSEFBMEQ7O0FEWXBFLE1BQU0sT0FBTyxjQUFjO0lBUDNCO1FBUUUsV0FBTSxHQUFZLEVBQUUsQ0FBQztRQUVyQixXQUFNLEdBQUcsTUFBTSxDQUFDLFlBQVksQ0FBQyxDQUFDO0tBVy9CO0lBWEMsTUFBTSxDQUF3QjtJQUU5QixRQUFRO1FBQ04sSUFBSSxDQUFDLE1BQU0sQ0FBQyxXQUFXLEVBQUUsQ0FBQyxTQUFTLENBQUM7WUFDbEMsSUFBSSxFQUFFLENBQUMsTUFBTSxFQUFFLEVBQUUsQ0FBQyxDQUFDLElBQUksQ0FBQyxNQUFNLEdBQUcsTUFBTSxDQUFDO1NBQ3pDLENBQUMsQ0FBQztJQUNMLENBQUM7SUFFRCxVQUFVLENBQUMsRUFBVTtRQUNuQixJQUFJLENBQUMsTUFBTSxDQUFDLFVBQVUsQ0FBQyxFQUFFLENBQUMsQ0FBQztJQUM3QixDQUFDOytHQWJVLGNBQWM7b0VBQWQsY0FBYztZQ2YzQiw4QkFBNkI7WUFDM0IsaUZBT0M7WUFDSCxpQkFBTTs7WUFSSixjQU9DO1lBUEQseUJBT0M7NEJER1MsWUFBWSxFQUFFLGFBQWEsY0FBRSxlQUFlLG9CQUFFLGVBQWU7O2lGQUk1RCxjQUFjO2NBUDFCLFNBQVM7MkJBQ0UsV0FBVyxjQUNULElBQUksV0FDUCxDQUFDLFlBQVksRUFBRSxhQUFhLEVBQUUsZUFBZSxFQUFFLGVBQWUsQ0FBQzs7a0ZBSTdELGNBQWMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIGluamVjdCwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IFRvYXN0IH0gZnJvbSAnLi9tb2RlbHMvdG9hc3QubW9kZWwnO1xyXG5pbXBvcnQgeyBUb2FzdFNlcnZpY2UgfSBmcm9tICcuL3RvYXN0LXNlcnZpY2UnO1xyXG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xyXG5pbXBvcnQgeyBNYXRJY29uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvaWNvbic7XHJcbmltcG9ydCB7IE1hdEJ1dHRvbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL2J1dHRvbic7XHJcbmltcG9ydCB7IFRyYW5zbGF0ZU1vZHVsZSB9IGZyb20gJ0BuZ3gtdHJhbnNsYXRlL2NvcmUnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdsaWItdG9hc3QnLFxyXG4gIHN0YW5kYWxvbmU6IHRydWUsXHJcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZSwgTWF0SWNvbk1vZHVsZSwgTWF0QnV0dG9uTW9kdWxlLCBUcmFuc2xhdGVNb2R1bGVdLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi90b2FzdC5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmw6ICcuL3RvYXN0LmNvbXBvbmVudC5zY3NzJyxcclxufSlcclxuZXhwb3J0IGNsYXNzIFRvYXN0Q29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcclxuICB0b2FzdHM6IFRvYXN0W10gPSBbXTtcclxuXHJcbiAgI3RvYXN0ID0gaW5qZWN0KFRvYXN0U2VydmljZSk7XHJcblxyXG4gIG5nT25Jbml0KCk6IHZvaWQge1xyXG4gICAgdGhpcy4jdG9hc3Qud2F0Y2hUb2FzdHMoKS5zdWJzY3JpYmUoe1xyXG4gICAgICBuZXh0OiAodG9hc3RzKSA9PiAodGhpcy50b2FzdHMgPSB0b2FzdHMpLFxyXG4gICAgfSk7XHJcbiAgfVxyXG5cclxuICBjbG9zZVRvYXN0KGlkOiBudW1iZXIpIHtcclxuICAgIHRoaXMuI3RvYXN0LmNsb3NlVG9hc3QoaWQpO1xyXG4gIH1cclxufVxyXG4iLCI8ZGl2IGNsYXNzPVwidG9hc3QtY29udGFpbmVyXCI+XHJcbiAgQGZvciAodG9hc3Qgb2YgdG9hc3RzOyB0cmFjayB0b2FzdC5pZCkge1xyXG4gIDxkaXYgY2xhc3M9XCJ0b2FzdFwiPlxyXG4gICAgPHNwYW4+e3sgdG9hc3QubWVzc2FnZSB8IHRyYW5zbGF0ZTogdG9hc3Q/LmxvY2FsaXphdGlvblBhcmFtcyB9fTwvc3Bhbj5cclxuICAgIDxidXR0b24gbWF0LWljb24tYnV0dG9uIChjbGljayk9XCJjbG9zZVRvYXN0KHRvYXN0LmlkKVwiPlxyXG4gICAgICA8bWF0LWljb24+Y2xvc2U8L21hdC1pY29uPlxyXG4gICAgPC9idXR0b24+XHJcbiAgPC9kaXY+XHJcbiAgfVxyXG48L2Rpdj5cclxuIl19

package/fesm2022/tilde-nlp-ngx-common.mjs

@@ -4158,11 +4158,11 @@ class MultiFunctionalTableComponent {
             i0.ɵɵproperty("ngForOf", ctx.configurableColumns);
             i0.ɵɵadvance(3);
             i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(30, 19, "MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT_SAVE"), " ");
-        } }, dependencies: [i1$2.NgForOf, i1$2.NgIf, i4$2.MatTable, i4$2.MatHeaderCellDef, i4$2.MatHeaderRowDef, i4$2.MatColumnDef, i4$2.MatCellDef, i4$2.MatRowDef, i4$2.MatHeaderCell, i4$2.MatCell, i4$2.MatHeaderRow, i4$2.MatRow, i4$2.MatNoDataRow, i2$1.MatButton, i2$1.MatIconButton, i5$1.MatMenu, i5$1.MatMenuTrigger, i7.MatCheckbox, i4$1.NgControlStatus, i4$1.NgModel, FilterBarComponent, i2$3.DefaultLayoutDirective, i2$3.DefaultLayoutGapDirective, i2$3.DefaultLayoutAlignDirective, i2$3.DefaultFlexDirective, i3.DefaultClassDirective, i2$2.MatTooltip, StatusDisplayComponent, i1.MatIcon, i1$1.TranslatePipe], styles: ["[_nghost-%COMP%]     th, [_nghost-%COMP%]     tr{white-space:nowrap}[_nghost-%COMP%]     td:not(:first-of-type){padding-right:10px!important}[_nghost-%COMP%]     tr.mat-mdc-row:hover, [_nghost-%COMP%]     tr.mat-mdc-row.highlight{background-color:var(--base-95)}[_nghost-%COMP%]     tr.mat-mdc-row.highlight-error{background-color:var(--warning-light)}[_nghost-%COMP%]     .export-data .mdc-button__label{display:flex;align-items:center}[_nghost-%COMP%]     .mat-mdc-cell, [_nghost-%COMP%]     .mat-mdc-header-cell, [_nghost-%COMP%]     .mdc-data-table__row:last-child{border-bottom-color:var(--base-70)}[_nghost-%COMP%]     .mdc-data-table__row:last-child{border-bottom-width:1px;border-bottom-style:solid}[_nghost-%COMP%]     .mdc-data-table__cell:nth-child(2), [_nghost-%COMP%]     .mdc-data-table__header-cell:nth-child(2){padding:0 16px 0 10px}[_nghost-%COMP%]     td+.cdk-column-columnSelect{display:none}[_nghost-%COMP%]     .clear-filters-wrapper .mat-mdc-icon-button, [_nghost-%COMP%]     .clear-filters-wrapper .mat-mdc-icon-button .mat-mdc-button-touch-target{height:36px!important;width:36px!important}[_nghost-%COMP%]     .clear-filters-wrapper mat-icon{margin-top:-2px;margin-left:-2px}[_nghost-%COMP%]     .filter-active{background-color:var(--neutral-95)}table[_ngcontent-%COMP%]{width:100%}.wild-search-wrapper[_ngcontent-%COMP%]{position:relative;padding:5px 10px;border-radius:4px;border:1px solid var(--neutral-50);margin:0 8px}.wild-search-wrapper[_ngcontent-%COMP%]   input[_ngcontent-%COMP%]{margin-right:30px}.wild-search-wrapper[_ngcontent-%COMP%]   .search-icon[_ngcontent-%COMP%]{color:var(--base-40)}.wild-search-wrapper[_ngcontent-%COMP%]   .wild-search-clear-btn[_ngcontent-%COMP%]{position:absolute;right:3px}.wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%], .wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%]   .mat-mdc-button-touch-target[_ngcontent-%COMP%]{height:33px!important;width:33px!important}.wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%]   mat-icon[_ngcontent-%COMP%], .wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%]   .material-icons[_ngcontent-%COMP%], .wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%]   .material-icons-outlined[_ngcontent-%COMP%]{top:5px!important;left:5px!important}.mobile[_ngcontent-%COMP%]   .wild-search-wrapper[_ngcontent-%COMP%]{margin:0}.column-selector-wrapper[_ngcontent-%COMP%]{display:flex;justify-content:end}.column-select-menu[_ngcontent-%COMP%]{padding:8px 18px 8px 8px}.column-select-save[_ngcontent-%COMP%]{padding-left:8px;padding-top:8px}.column-select-save[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{width:100%}.row-clickable[_ngcontent-%COMP%]{cursor:pointer}.row-clickable[_ngcontent-%COMP%]:active{background-color:var(--base-70)!important}.material-icons[_ngcontent-%COMP%], .material-icons-outlined[_ngcontent-%COMP%]{margin-right:.5rem}.table-action-button[_ngcontent-%COMP%]{margin-bottom:1rem}th.mat-mdc-header-cell[_ngcontent-%COMP%]:first-of-type, td.mat-mdc-cell[_ngcontent-%COMP%]:first-of-type, td.mat-mdc-footer-cell[_ngcontent-%COMP%]:first-of-type{padding:0 0 0 10px}.row-select[_ngcontent-%COMP%]{width:0}.table-overflow[_ngcontent-%COMP%]{overflow-x:auto}.table-dragable[_ngcontent-%COMP%]{cursor:grab;-webkit-user-select:none;user-select:none}.table-dragable[_ngcontent-%COMP%]:active{cursor:grabbing}.table-sticky-header[_ngcontent-%COMP%]{max-height:70vh}"] }); }
+        } }, dependencies: [i1$2.NgForOf, i1$2.NgIf, i4$2.MatTable, i4$2.MatHeaderCellDef, i4$2.MatHeaderRowDef, i4$2.MatColumnDef, i4$2.MatCellDef, i4$2.MatRowDef, i4$2.MatHeaderCell, i4$2.MatCell, i4$2.MatHeaderRow, i4$2.MatRow, i4$2.MatNoDataRow, i2$1.MatButton, i2$1.MatIconButton, i5$1.MatMenu, i5$1.MatMenuTrigger, i7.MatCheckbox, i4$1.NgControlStatus, i4$1.NgModel, FilterBarComponent, i2$3.DefaultLayoutDirective, i2$3.DefaultLayoutGapDirective, i2$3.DefaultLayoutAlignDirective, i2$3.DefaultFlexDirective, i3.DefaultClassDirective, i2$2.MatTooltip, StatusDisplayComponent, i1.MatIcon, i1$1.TranslatePipe], styles: ["[_nghost-%COMP%]     th, [_nghost-%COMP%]     tr{white-space:nowrap}[_nghost-%COMP%]     td:not(:first-of-type){padding-right:10px!important}[_nghost-%COMP%]     tr.mat-mdc-row:hover, [_nghost-%COMP%]     tr.mat-mdc-row.highlight{background-color:var(--base-95)}[_nghost-%COMP%]     tr.mat-mdc-row.highlight-error{background-color:var(--warning-light)}[_nghost-%COMP%]     .export-data .mdc-button__label{display:flex;align-items:center}[_nghost-%COMP%]     .mat-mdc-cell, [_nghost-%COMP%]     .mat-mdc-header-cell, [_nghost-%COMP%]     .mdc-data-table__row:last-child{border-bottom-color:var(--base-70)}[_nghost-%COMP%]     .mdc-data-table__row:last-child{border-bottom-width:1px;border-bottom-style:solid}[_nghost-%COMP%]     .mdc-data-table__cell:nth-child(2), [_nghost-%COMP%]     .mdc-data-table__header-cell:nth-child(2){padding:0 16px 0 10px}[_nghost-%COMP%]     td+.cdk-column-columnSelect{display:none}[_nghost-%COMP%]     .clear-filters-wrapper .mat-mdc-icon-button, [_nghost-%COMP%]     .clear-filters-wrapper .mat-mdc-icon-button .mat-mdc-button-touch-target{height:36px!important;width:36px!important}[_nghost-%COMP%]     .clear-filters-wrapper mat-icon{margin-top:-2px;margin-left:-2px}[_nghost-%COMP%]     .filter-active{background-color:var(--neutral-95)}[_nghost-%COMP%]     .row-actions{opacity:0}[_nghost-%COMP%]     .highlight .row-actions{opacity:1}table[_ngcontent-%COMP%]{width:100%}.wild-search-wrapper[_ngcontent-%COMP%]{position:relative;padding:5px 10px;border-radius:4px;border:1px solid var(--neutral-50);margin:0 8px}.wild-search-wrapper[_ngcontent-%COMP%]   input[_ngcontent-%COMP%]{margin-right:30px}.wild-search-wrapper[_ngcontent-%COMP%]   .search-icon[_ngcontent-%COMP%]{color:var(--base-40)}.wild-search-wrapper[_ngcontent-%COMP%]   .wild-search-clear-btn[_ngcontent-%COMP%]{position:absolute;right:3px}.wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%], .wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%]   .mat-mdc-button-touch-target[_ngcontent-%COMP%]{height:33px!important;width:33px!important}.wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%]   mat-icon[_ngcontent-%COMP%], .wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%]   .material-icons[_ngcontent-%COMP%], .wild-search-wrapper[_ngcontent-%COMP%]   .mat-mdc-icon-button[_ngcontent-%COMP%]   .material-icons-outlined[_ngcontent-%COMP%]{top:5px!important;left:5px!important}.mobile[_ngcontent-%COMP%]   .wild-search-wrapper[_ngcontent-%COMP%]{margin:0}.column-selector-wrapper[_ngcontent-%COMP%]{display:flex;justify-content:end}.column-select-menu[_ngcontent-%COMP%]{padding:8px 18px 8px 8px}.column-select-save[_ngcontent-%COMP%]{padding-left:8px;padding-top:8px}.column-select-save[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{width:100%}.row-clickable[_ngcontent-%COMP%]{cursor:pointer}.row-clickable[_ngcontent-%COMP%]:active{background-color:var(--base-70)!important}.material-icons[_ngcontent-%COMP%], .material-icons-outlined[_ngcontent-%COMP%]{margin-right:.5rem}.table-action-button[_ngcontent-%COMP%]{margin-bottom:1rem}th.mat-mdc-header-cell[_ngcontent-%COMP%]:first-of-type, td.mat-mdc-cell[_ngcontent-%COMP%]:first-of-type, td.mat-mdc-footer-cell[_ngcontent-%COMP%]:first-of-type{padding:0 0 0 10px}.row-select[_ngcontent-%COMP%]{width:0}.table-overflow[_ngcontent-%COMP%]{overflow-x:auto}.table-dragable[_ngcontent-%COMP%]{cursor:grab;-webkit-user-select:none;user-select:none}.table-dragable[_ngcontent-%COMP%]:active{cursor:grabbing}.table-sticky-header[_ngcontent-%COMP%]{max-height:70vh}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MultiFunctionalTableComponent, [{
         type: Component,
-        args: [{ selector: 'tld-multi-functional-table', template: "<div [ngClass.lt-md]=\"'mobile'\" fxLayout=\"column\" fxLayoutGap=\"0.75rem\">\r\n  <div fxLayout=\"row\" fxLayout.lt-md=\"column\" fxLayoutGap.lt-md=\"0.75rem\">\r\n    <div\r\n      fxFlex\r\n      fxLayout.lt-md=\"column\"\r\n      fxLayoutGap=\"0.75rem\"\r\n      fxLayoutAlign=\"start center\"\r\n      fxLayoutAlign.lt-md=\"start start\"\r\n      class=\"action-row\"\r\n    >\r\n      <button\r\n        class=\"export-data\"\r\n        mat-stroked-button\r\n        color=\"primary-accent-darker\"\r\n        *ngIf=\"exportActive\"\r\n        (click)=\"export()\"\r\n      >\r\n        <span class=\"material-icons-outlined\">cloud_download</span>\r\n        <span>{{ \"MULTI_FUNCTIONAL_TABLE.EXPORT\" | translate }}</span>\r\n      </button>\r\n\r\n      <div\r\n        *ngIf=\"filterActive && showFilterToggle\"\r\n        fxFlex\r\n        fxLayoutGap=\"0.5rem\"\r\n        fxLayoutAlign=\"start center\"\r\n      >\r\n        <button\r\n          [class.filter-active]=\"filterBarVisible\"\r\n          mat-stroked-button\r\n          color=\"primary-accent-darker\"\r\n          (click)=\"toggleFilterBar()\"\r\n        >\r\n          <span class=\"material-icons\">filter_list</span>\r\n          <span>{{ \"MULTI_FUNCTIONAL_TABLE.FILTER_TOGGLE\" | translate }}</span>\r\n        </button>\r\n\r\n        <div *ngIf=\"showFilterReset\" class=\"clear-filters-wrapper\">\r\n          <button mat-icon-button (click)=\"clearFilters()\">\r\n            <mat-icon>close</mat-icon>\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <div\r\n      *ngIf=\"showSearch\"\r\n      fxLayout=\"row\"\r\n      fxLayoutAlign=\"start center\"\r\n      class=\"wild-search-wrapper\"\r\n    >\r\n      <mat-icon\r\n        class=\"search-icon\"\r\n        [matTooltip]=\"hideSearchTooltip ? '' : (searchTooltip | translate)\"\r\n        >search</mat-icon\r\n      >\r\n      <input\r\n        #wildSearch\r\n        type=\"text\"\r\n        [placeholder]=\"searchTitle | translate\"\r\n        (keyup)=\"search($event)\"\r\n      />\r\n      <button\r\n        *ngIf=\"showSearchClearButton && wildSearch.value\"\r\n        mat-icon-button\r\n        class=\"wild-search-clear-btn\"\r\n        (click)=\"wildSearch.value = ''; search({ target: { value: '' } })\"\r\n      >\r\n        <mat-icon>close</mat-icon>\r\n      </button>\r\n    </div>\r\n\r\n    <ng-content select=\"[additionalActions]\"></ng-content>\r\n  </div>\r\n\r\n  <tld-filter-bar\r\n    *ngIf=\"config.filter && config.filter.enabled\"\r\n    #filterBar\r\n    [filterRowVisible]=\"filterBarVisible\"\r\n    [settings]=\"config.filter.settings\"\r\n    (filterBarChange)=\"filtersChanged($event)\"\r\n  >\r\n  </tld-filter-bar>\r\n\r\n  <ng-content select=\"[batchActions]\"></ng-content>\r\n\r\n  <div\r\n    #tableContainer\r\n    class=\"table-overflow\"\r\n    [class.table-sticky-header]=\"config?.stickyHeader\"\r\n    [class.table-dragable]=\"tableOverflow && !config?.disableMouseDragging\"\r\n    (mousedown)=\"onMouseDown($event)\"\r\n    (mouseup)=\"onMouseUp()\"\r\n    (mouseleave)=\"onMouseUp()\"\r\n    (mousemove)=\"onMouseMove($event)\"\r\n  >\r\n    <table\r\n      #table\r\n      mat-table\r\n      [dataSource]=\"config.dataSource\"\r\n      [trackBy]=\"trackByFn\"\r\n    >\r\n      <ng-content></ng-content>\r\n      <ng-container [matColumnDef]=\"batchColumnName\">\r\n        <th class=\"row-select\" mat-header-cell *matHeaderCellDef disable-export>\r\n          <mat-checkbox\r\n            [matTooltip]=\"'MULTI_FUNCTIONAL_TABLE.SELECT_ALL' | translate\"\r\n            [disabled]=\"config.batchConfig!.checkBoxesDisabled\"\r\n            (change)=\"toggleAllRowSelection()\"\r\n            [checked]=\"matSelection.hasValue() && isAllSelected()\"\r\n            [indeterminate]=\"matSelection.hasValue() && !isAllSelected()\"\r\n          >\r\n          </mat-checkbox>\r\n        </th>\r\n        <td\r\n          class=\"row-select\"\r\n          mat-cell\r\n          *matCellDef=\"let element\"\r\n          disable-export\r\n        >\r\n          <mat-checkbox\r\n            [matTooltip]=\"'MULTI_FUNCTIONAL_TABLE.SELECT' | translate\"\r\n            *ngIf=\"\r\n              isRowCheckboxAlwaysVisible ||\r\n              hoveredRow === element ||\r\n              matSelection.isSelected(element)\r\n            \"\r\n            [disabled]=\"\r\n              config.batchConfig!.checkBoxesDisabled ||\r\n              (preselectedItems.includes(element) && disablePreselectedItems)\r\n            \"\r\n            (click)=\"$event.stopPropagation()\"\r\n            (change)=\"toggleElementSelection(element)\"\r\n            [checked]=\"matSelection.isSelected(element)\"\r\n          >\r\n          </mat-checkbox>\r\n        </td>\r\n      </ng-container>\r\n      <tr\r\n        mat-header-row\r\n        *matHeaderRowDef=\"displayColumns; sticky: config?.stickyHeader ?? false\"\r\n      ></tr>\r\n      <tr\r\n        mat-row\r\n        *matRowDef=\"let row; columns: displayColumns\"\r\n        (click)=\"\r\n          config?.rowClickCallback && (!config.disableRowClick || !config?.disableRowClick(row))\r\n            ? config?.rowClickCallback(row)\r\n            : null\r\n        \"\r\n        (mouseover)=\"hoveredRow = row\"\r\n        (mouseleave)=\"hoveredRow = null\"\r\n        [class.row-clickable]=\"\r\n          config?.rowClickCallback && (!config.disableRowClick || !config?.disableRowClick(row))\r\n        \"\r\n        [class.highlight-error]=\"highlightErrorElement(row)\"\r\n        [class.highlight]=\"row === hoveredRow || highlightElement(row)\"\r\n      ></tr>\r\n\r\n      <ng-container [matColumnDef]=\"columnSelectColumnName\">\r\n        <th class=\"row-select\" mat-header-cell *matHeaderCellDef disable-export>\r\n          <div class=\"column-selector-wrapper\">\r\n            <button\r\n              class=\"column-selector\"\r\n              mat-icon-button\r\n              color=\"primary-accent-darker\"\r\n              [matMenuTriggerFor]=\"columnMenu\"\r\n            >\r\n              <span class=\"material-icons\">more_vert</span>\r\n            </button>\r\n          </div>\r\n        </th>\r\n        <td\r\n          class=\"row-select\"\r\n          mat-cell\r\n          *matCellDef=\"let element\"\r\n          disable-export\r\n        ></td>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"noDataRowActive\">\r\n        <tr *matNoDataRow>\r\n          <!-- add random number to make sure it takes full width -->\r\n          <td colspan=\"99\">\r\n            <lib-status-display [config]=\"noDataRowConfig\"></lib-status-display>\r\n          </td>\r\n        </tr>\r\n      </ng-container>\r\n    </table>\r\n  </div>\r\n</div>\r\n\r\n<mat-menu #columnMenu=\"matMenu\">\r\n  <div class=\"column-select-menu\" (click)=\"$event.stopPropagation()\">\r\n    <div *ngFor=\"let column of configurableColumns\">\r\n      <mat-checkbox [(ngModel)]=\"column.selected\">\r\n        {{ column.displayName | translate }}\r\n      </mat-checkbox>\r\n    </div>\r\n\r\n    <div class=\"column-select-save\">\r\n      <button\r\n        mat-flat-button\r\n        color=\"primary-accent-darker\"\r\n        (click)=\"updateDisplayColumns()\"\r\n      >\r\n        {{ \"MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT_SAVE\" | translate }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</mat-menu>\r\n", styles: [":host ::ng-deep th,:host ::ng-deep tr{white-space:nowrap}:host ::ng-deep td:not(:first-of-type){padding-right:10px!important}:host ::ng-deep tr.mat-mdc-row:hover,:host ::ng-deep tr.mat-mdc-row.highlight{background-color:var(--base-95)}:host ::ng-deep tr.mat-mdc-row.highlight-error{background-color:var(--warning-light)}:host ::ng-deep .export-data .mdc-button__label{display:flex;align-items:center}:host ::ng-deep .mat-mdc-cell,:host ::ng-deep .mat-mdc-header-cell,:host ::ng-deep .mdc-data-table__row:last-child{border-bottom-color:var(--base-70)}:host ::ng-deep .mdc-data-table__row:last-child{border-bottom-width:1px;border-bottom-style:solid}:host ::ng-deep .mdc-data-table__cell:nth-child(2),:host ::ng-deep .mdc-data-table__header-cell:nth-child(2){padding:0 16px 0 10px}:host ::ng-deep td+.cdk-column-columnSelect{display:none}:host ::ng-deep .clear-filters-wrapper .mat-mdc-icon-button,:host ::ng-deep .clear-filters-wrapper .mat-mdc-icon-button .mat-mdc-button-touch-target{height:36px!important;width:36px!important}:host ::ng-deep .clear-filters-wrapper mat-icon{margin-top:-2px;margin-left:-2px}:host ::ng-deep .filter-active{background-color:var(--neutral-95)}table{width:100%}.wild-search-wrapper{position:relative;padding:5px 10px;border-radius:4px;border:1px solid var(--neutral-50);margin:0 8px}.wild-search-wrapper input{margin-right:30px}.wild-search-wrapper .search-icon{color:var(--base-40)}.wild-search-wrapper .wild-search-clear-btn{position:absolute;right:3px}.wild-search-wrapper .mat-mdc-icon-button,.wild-search-wrapper .mat-mdc-icon-button .mat-mdc-button-touch-target{height:33px!important;width:33px!important}.wild-search-wrapper .mat-mdc-icon-button mat-icon,.wild-search-wrapper .mat-mdc-icon-button .material-icons,.wild-search-wrapper .mat-mdc-icon-button .material-icons-outlined{top:5px!important;left:5px!important}.mobile .wild-search-wrapper{margin:0}.column-selector-wrapper{display:flex;justify-content:end}.column-select-menu{padding:8px 18px 8px 8px}.column-select-save{padding-left:8px;padding-top:8px}.column-select-save button{width:100%}.row-clickable{cursor:pointer}.row-clickable:active{background-color:var(--base-70)!important}.material-icons,.material-icons-outlined{margin-right:.5rem}.table-action-button{margin-bottom:1rem}th.mat-mdc-header-cell:first-of-type,td.mat-mdc-cell:first-of-type,td.mat-mdc-footer-cell:first-of-type{padding:0 0 0 10px}.row-select{width:0}.table-overflow{overflow-x:auto}.table-dragable{cursor:grab;-webkit-user-select:none;user-select:none}.table-dragable:active{cursor:grabbing}.table-sticky-header{max-height:70vh}\n"] }]
+        args: [{ selector: 'tld-multi-functional-table', template: "<div [ngClass.lt-md]=\"'mobile'\" fxLayout=\"column\" fxLayoutGap=\"0.75rem\">\r\n  <div fxLayout=\"row\" fxLayout.lt-md=\"column\" fxLayoutGap.lt-md=\"0.75rem\">\r\n    <div\r\n      fxFlex\r\n      fxLayout.lt-md=\"column\"\r\n      fxLayoutGap=\"0.75rem\"\r\n      fxLayoutAlign=\"start center\"\r\n      fxLayoutAlign.lt-md=\"start start\"\r\n      class=\"action-row\"\r\n    >\r\n      <button\r\n        class=\"export-data\"\r\n        mat-stroked-button\r\n        color=\"primary-accent-darker\"\r\n        *ngIf=\"exportActive\"\r\n        (click)=\"export()\"\r\n      >\r\n        <span class=\"material-icons-outlined\">cloud_download</span>\r\n        <span>{{ \"MULTI_FUNCTIONAL_TABLE.EXPORT\" | translate }}</span>\r\n      </button>\r\n\r\n      <div\r\n        *ngIf=\"filterActive && showFilterToggle\"\r\n        fxFlex\r\n        fxLayoutGap=\"0.5rem\"\r\n        fxLayoutAlign=\"start center\"\r\n      >\r\n        <button\r\n          [class.filter-active]=\"filterBarVisible\"\r\n          mat-stroked-button\r\n          color=\"primary-accent-darker\"\r\n          (click)=\"toggleFilterBar()\"\r\n        >\r\n          <span class=\"material-icons\">filter_list</span>\r\n          <span>{{ \"MULTI_FUNCTIONAL_TABLE.FILTER_TOGGLE\" | translate }}</span>\r\n        </button>\r\n\r\n        <div *ngIf=\"showFilterReset\" class=\"clear-filters-wrapper\">\r\n          <button mat-icon-button (click)=\"clearFilters()\">\r\n            <mat-icon>close</mat-icon>\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <div\r\n      *ngIf=\"showSearch\"\r\n      fxLayout=\"row\"\r\n      fxLayoutAlign=\"start center\"\r\n      class=\"wild-search-wrapper\"\r\n    >\r\n      <mat-icon\r\n        class=\"search-icon\"\r\n        [matTooltip]=\"hideSearchTooltip ? '' : (searchTooltip | translate)\"\r\n        >search</mat-icon\r\n      >\r\n      <input\r\n        #wildSearch\r\n        type=\"text\"\r\n        [placeholder]=\"searchTitle | translate\"\r\n        (keyup)=\"search($event)\"\r\n      />\r\n      <button\r\n        *ngIf=\"showSearchClearButton && wildSearch.value\"\r\n        mat-icon-button\r\n        class=\"wild-search-clear-btn\"\r\n        (click)=\"wildSearch.value = ''; search({ target: { value: '' } })\"\r\n      >\r\n        <mat-icon>close</mat-icon>\r\n      </button>\r\n    </div>\r\n\r\n    <ng-content select=\"[additionalActions]\"></ng-content>\r\n  </div>\r\n\r\n  <tld-filter-bar\r\n    *ngIf=\"config.filter && config.filter.enabled\"\r\n    #filterBar\r\n    [filterRowVisible]=\"filterBarVisible\"\r\n    [settings]=\"config.filter.settings\"\r\n    (filterBarChange)=\"filtersChanged($event)\"\r\n  >\r\n  </tld-filter-bar>\r\n\r\n  <ng-content select=\"[batchActions]\"></ng-content>\r\n\r\n  <div\r\n    #tableContainer\r\n    class=\"table-overflow\"\r\n    [class.table-sticky-header]=\"config?.stickyHeader\"\r\n    [class.table-dragable]=\"tableOverflow && !config?.disableMouseDragging\"\r\n    (mousedown)=\"onMouseDown($event)\"\r\n    (mouseup)=\"onMouseUp()\"\r\n    (mouseleave)=\"onMouseUp()\"\r\n    (mousemove)=\"onMouseMove($event)\"\r\n  >\r\n    <table\r\n      #table\r\n      mat-table\r\n      [dataSource]=\"config.dataSource\"\r\n      [trackBy]=\"trackByFn\"\r\n    >\r\n      <ng-content></ng-content>\r\n      <ng-container [matColumnDef]=\"batchColumnName\">\r\n        <th class=\"row-select\" mat-header-cell *matHeaderCellDef disable-export>\r\n          <mat-checkbox\r\n            [matTooltip]=\"'MULTI_FUNCTIONAL_TABLE.SELECT_ALL' | translate\"\r\n            [disabled]=\"config.batchConfig!.checkBoxesDisabled\"\r\n            (change)=\"toggleAllRowSelection()\"\r\n            [checked]=\"matSelection.hasValue() && isAllSelected()\"\r\n            [indeterminate]=\"matSelection.hasValue() && !isAllSelected()\"\r\n          >\r\n          </mat-checkbox>\r\n        </th>\r\n        <td\r\n          class=\"row-select\"\r\n          mat-cell\r\n          *matCellDef=\"let element\"\r\n          disable-export\r\n        >\r\n          <mat-checkbox\r\n            [matTooltip]=\"'MULTI_FUNCTIONAL_TABLE.SELECT' | translate\"\r\n            *ngIf=\"\r\n              isRowCheckboxAlwaysVisible ||\r\n              hoveredRow === element ||\r\n              matSelection.isSelected(element)\r\n            \"\r\n            [disabled]=\"\r\n              config.batchConfig!.checkBoxesDisabled ||\r\n              (preselectedItems.includes(element) && disablePreselectedItems)\r\n            \"\r\n            (click)=\"$event.stopPropagation()\"\r\n            (change)=\"toggleElementSelection(element)\"\r\n            [checked]=\"matSelection.isSelected(element)\"\r\n          >\r\n          </mat-checkbox>\r\n        </td>\r\n      </ng-container>\r\n      <tr\r\n        mat-header-row\r\n        *matHeaderRowDef=\"displayColumns; sticky: config?.stickyHeader ?? false\"\r\n      ></tr>\r\n      <tr\r\n        mat-row\r\n        *matRowDef=\"let row; columns: displayColumns\"\r\n        (click)=\"\r\n          config?.rowClickCallback && (!config.disableRowClick || !config?.disableRowClick(row))\r\n            ? config?.rowClickCallback(row)\r\n            : null\r\n        \"\r\n        (mouseover)=\"hoveredRow = row\"\r\n        (mouseleave)=\"hoveredRow = null\"\r\n        [class.row-clickable]=\"\r\n          config?.rowClickCallback && (!config.disableRowClick || !config?.disableRowClick(row))\r\n        \"\r\n        [class.highlight-error]=\"highlightErrorElement(row)\"\r\n        [class.highlight]=\"row === hoveredRow || highlightElement(row)\"\r\n      ></tr>\r\n\r\n      <ng-container [matColumnDef]=\"columnSelectColumnName\">\r\n        <th class=\"row-select\" mat-header-cell *matHeaderCellDef disable-export>\r\n          <div class=\"column-selector-wrapper\">\r\n            <button\r\n              class=\"column-selector\"\r\n              mat-icon-button\r\n              color=\"primary-accent-darker\"\r\n              [matMenuTriggerFor]=\"columnMenu\"\r\n            >\r\n              <span class=\"material-icons\">more_vert</span>\r\n            </button>\r\n          </div>\r\n        </th>\r\n        <td\r\n          class=\"row-select\"\r\n          mat-cell\r\n          *matCellDef=\"let element\"\r\n          disable-export\r\n        ></td>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"noDataRowActive\">\r\n        <tr *matNoDataRow>\r\n          <!-- add random number to make sure it takes full width -->\r\n          <td colspan=\"99\">\r\n            <lib-status-display [config]=\"noDataRowConfig\"></lib-status-display>\r\n          </td>\r\n        </tr>\r\n      </ng-container>\r\n    </table>\r\n  </div>\r\n</div>\r\n\r\n<mat-menu #columnMenu=\"matMenu\">\r\n  <div class=\"column-select-menu\" (click)=\"$event.stopPropagation()\">\r\n    <div *ngFor=\"let column of configurableColumns\">\r\n      <mat-checkbox [(ngModel)]=\"column.selected\">\r\n        {{ column.displayName | translate }}\r\n      </mat-checkbox>\r\n    </div>\r\n\r\n    <div class=\"column-select-save\">\r\n      <button\r\n        mat-flat-button\r\n        color=\"primary-accent-darker\"\r\n        (click)=\"updateDisplayColumns()\"\r\n      >\r\n        {{ \"MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT_SAVE\" | translate }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</mat-menu>\r\n", styles: [":host ::ng-deep th,:host ::ng-deep tr{white-space:nowrap}:host ::ng-deep td:not(:first-of-type){padding-right:10px!important}:host ::ng-deep tr.mat-mdc-row:hover,:host ::ng-deep tr.mat-mdc-row.highlight{background-color:var(--base-95)}:host ::ng-deep tr.mat-mdc-row.highlight-error{background-color:var(--warning-light)}:host ::ng-deep .export-data .mdc-button__label{display:flex;align-items:center}:host ::ng-deep .mat-mdc-cell,:host ::ng-deep .mat-mdc-header-cell,:host ::ng-deep .mdc-data-table__row:last-child{border-bottom-color:var(--base-70)}:host ::ng-deep .mdc-data-table__row:last-child{border-bottom-width:1px;border-bottom-style:solid}:host ::ng-deep .mdc-data-table__cell:nth-child(2),:host ::ng-deep .mdc-data-table__header-cell:nth-child(2){padding:0 16px 0 10px}:host ::ng-deep td+.cdk-column-columnSelect{display:none}:host ::ng-deep .clear-filters-wrapper .mat-mdc-icon-button,:host ::ng-deep .clear-filters-wrapper .mat-mdc-icon-button .mat-mdc-button-touch-target{height:36px!important;width:36px!important}:host ::ng-deep .clear-filters-wrapper mat-icon{margin-top:-2px;margin-left:-2px}:host ::ng-deep .filter-active{background-color:var(--neutral-95)}:host ::ng-deep .row-actions{opacity:0}:host ::ng-deep .highlight .row-actions{opacity:1}table{width:100%}.wild-search-wrapper{position:relative;padding:5px 10px;border-radius:4px;border:1px solid var(--neutral-50);margin:0 8px}.wild-search-wrapper input{margin-right:30px}.wild-search-wrapper .search-icon{color:var(--base-40)}.wild-search-wrapper .wild-search-clear-btn{position:absolute;right:3px}.wild-search-wrapper .mat-mdc-icon-button,.wild-search-wrapper .mat-mdc-icon-button .mat-mdc-button-touch-target{height:33px!important;width:33px!important}.wild-search-wrapper .mat-mdc-icon-button mat-icon,.wild-search-wrapper .mat-mdc-icon-button .material-icons,.wild-search-wrapper .mat-mdc-icon-button .material-icons-outlined{top:5px!important;left:5px!important}.mobile .wild-search-wrapper{margin:0}.column-selector-wrapper{display:flex;justify-content:end}.column-select-menu{padding:8px 18px 8px 8px}.column-select-save{padding-left:8px;padding-top:8px}.column-select-save button{width:100%}.row-clickable{cursor:pointer}.row-clickable:active{background-color:var(--base-70)!important}.material-icons,.material-icons-outlined{margin-right:.5rem}.table-action-button{margin-bottom:1rem}th.mat-mdc-header-cell:first-of-type,td.mat-mdc-cell:first-of-type,td.mat-mdc-footer-cell:first-of-type{padding:0 0 0 10px}.row-select{width:0}.table-overflow{overflow-x:auto}.table-dragable{cursor:grab;-webkit-user-select:none;user-select:none}.table-dragable:active{cursor:grabbing}.table-sticky-header{max-height:70vh}\n"] }]
     }], () => [{ type: DOMService }, { type: i1$1.TranslateService }], { config: [{
             type: Input
         }], highlightedElements: [{
@@ -7187,16 +7187,22 @@ class ToastService {
     watchToasts() {
         return this.subject.asObservable();
     }
-    showToast(message) {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    showToast(message, appearanceTime, localizationParams) {
+        const animationDurationTime = 500;
         const toast = {
             id: new Date().getTime(),
             message,
+            localizationParams
         };
         this.toasts.push(toast);
         this.subject.next(this.toasts);
+        setTimeout(() => {
+            document.querySelector('.toast')?.classList.add("fade-out");
+        }, (appearanceTime ?? 3000) - animationDurationTime);
         setTimeout(() => {
             this.closeToast(toast.id);
-        }, 3000);
+        }, appearanceTime ?? 3000);
     }
     closeToast(id) {
         this.toasts = this.toasts.filter((toast) => toast.id !== id);
@@ -7227,7 +7233,7 @@ function ToastComponent_For_2_Template(rf, ctx) { if (rf & 1) {
 } if (rf & 2) {
     const toast_r2 = ctx.$implicit;
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 1, toast_r2.message));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(3, 1, toast_r2.message, toast_r2 == null ? null : toast_r2.localizationParams));
 } }
 class ToastComponent {
     constructor() {
@@ -7246,16 +7252,16 @@ class ToastComponent {
     static { this.ɵfac = function ToastComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ToastComponent)(); }; }
     static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ToastComponent, selectors: [["lib-toast"]], standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 3, vars: 0, consts: [[1, "toast-container"], [1, "toast"], ["mat-icon-button", "", 3, "click"]], template: function ToastComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
-            i0.ɵɵrepeaterCreate(1, ToastComponent_For_2_Template, 7, 3, "div", 1, _forTrack0);
+            i0.ɵɵrepeaterCreate(1, ToastComponent_For_2_Template, 7, 4, "div", 1, _forTrack0);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
             i0.ɵɵadvance();
             i0.ɵɵrepeater(ctx.toasts);
-        } }, dependencies: [CommonModule, MatIconModule, i1.MatIcon, MatButtonModule, i2$1.MatIconButton, TranslateModule, i1$1.TranslatePipe], styles: [".toast-container[_ngcontent-%COMP%]{display:flex;justify-content:center;width:100%;position:absolute;bottom:50px}.toast[_ngcontent-%COMP%]{position:relative;display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:400;min-width:350px;padding:4px 4px 4px 16px;letter-spacing:.25px;line-height:20px;border-radius:4px;box-shadow:0 1px 3px #0000004d;box-shadow:0 4px 8px 3px #00000026;color:#feedee;background-color:#382e2f;animation:_ngcontent-%COMP%_slide-in .5s forwards,_ngcontent-%COMP%_fade-out .5s 2.5s forwards}.toast[_ngcontent-%COMP%]:not(:first-of-type){margin-top:10px}[_nghost-%COMP%]     .mat-icon{color:#feedee}@keyframes _ngcontent-%COMP%_slide-in{0%{margin-bottom:-50px;opacity:0}to{margin-bottom:0;opacity:1}}@keyframes _ngcontent-%COMP%_fade-out{0%{opacity:1}to{opacity:0}}"] }); }
+        } }, dependencies: [CommonModule, MatIconModule, i1.MatIcon, MatButtonModule, i2$1.MatIconButton, TranslateModule, i1$1.TranslatePipe], styles: [".toast-container[_ngcontent-%COMP%]{display:flex;flex-direction:column;align-items:center;width:100%;position:absolute;bottom:50px}.toast[_ngcontent-%COMP%]{max-width:fit-content;position:relative;display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:400;min-width:350px;padding:4px 4px 4px 16px;letter-spacing:.25px;line-height:20px;border-radius:4px;box-shadow:0 1px 3px #0000004d;box-shadow:0 4px 8px 3px #00000026;color:#feedee;background-color:#382e2f;animation:_ngcontent-%COMP%_slide-in .5s forwards}.toast[_ngcontent-%COMP%]:not(:first-of-type){margin-top:10px}.fade-out[_ngcontent-%COMP%]{animation:_ngcontent-%COMP%_fade-out .5s forwards}[_nghost-%COMP%]     .mat-icon{color:#feedee}@keyframes _ngcontent-%COMP%_slide-in{0%{margin-bottom:-50px;opacity:0}to{margin-bottom:0;opacity:1}}@keyframes _ngcontent-%COMP%_fade-out{0%{opacity:1}to{opacity:0}}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ToastComponent, [{
         type: Component,
-        args: [{ selector: 'lib-toast', standalone: true, imports: [CommonModule, MatIconModule, MatButtonModule, TranslateModule], template: "<div class=\"toast-container\">\r\n  @for (toast of toasts; track toast.id) {\r\n  <div class=\"toast\">\r\n    <span>{{ toast.message | translate }}</span>\r\n    <button mat-icon-button (click)=\"closeToast(toast.id)\">\r\n      <mat-icon>close</mat-icon>\r\n    </button>\r\n  </div>\r\n  }\r\n</div>\r\n", styles: [".toast-container{display:flex;justify-content:center;width:100%;position:absolute;bottom:50px}.toast{position:relative;display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:400;min-width:350px;padding:4px 4px 4px 16px;letter-spacing:.25px;line-height:20px;border-radius:4px;box-shadow:0 1px 3px #0000004d;box-shadow:0 4px 8px 3px #00000026;color:#feedee;background-color:#382e2f;animation:slide-in .5s forwards,fade-out .5s 2.5s forwards}.toast:not(:first-of-type){margin-top:10px}:host ::ng-deep .mat-icon{color:#feedee}@keyframes slide-in{0%{margin-bottom:-50px;opacity:0}to{margin-bottom:0;opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}\n"] }]
+        args: [{ selector: 'lib-toast', standalone: true, imports: [CommonModule, MatIconModule, MatButtonModule, TranslateModule], template: "<div class=\"toast-container\">\r\n  @for (toast of toasts; track toast.id) {\r\n  <div class=\"toast\">\r\n    <span>{{ toast.message | translate: toast?.localizationParams }}</span>\r\n    <button mat-icon-button (click)=\"closeToast(toast.id)\">\r\n      <mat-icon>close</mat-icon>\r\n    </button>\r\n  </div>\r\n  }\r\n</div>\r\n", styles: [".toast-container{display:flex;flex-direction:column;align-items:center;width:100%;position:absolute;bottom:50px}.toast{max-width:fit-content;position:relative;display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:400;min-width:350px;padding:4px 4px 4px 16px;letter-spacing:.25px;line-height:20px;border-radius:4px;box-shadow:0 1px 3px #0000004d;box-shadow:0 4px 8px 3px #00000026;color:#feedee;background-color:#382e2f;animation:slide-in .5s forwards}.toast:not(:first-of-type){margin-top:10px}.fade-out{animation:fade-out .5s forwards}:host ::ng-deep .mat-icon{color:#feedee}@keyframes slide-in{0%{margin-bottom:-50px;opacity:0}to{margin-bottom:0;opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}\n"] }]
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ToastComponent, { className: "ToastComponent", filePath: "lib\\toast\\toast.component.ts", lineNumber: 16 }); })();