@fundamental-ngx/platform 0.43.18 → 0.43.20

package/fesm2020/fundamental-ngx-platform-table.mjs

@@ -1200,7 +1200,7 @@ class P13ColumnsDialogComponent {
     }
 }
 P13ColumnsDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: P13ColumnsDialogComponent, deps: [{ token: i1$2.DialogRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-P13ColumnsDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: P13ColumnsDialogComponent, selector: "ng-component", providers: [{ provide: RESETTABLE_TOKEN, useExisting: P13ColumnsDialogComponent }], ngImport: i0, template: "<fd-dialog class=\"fdp-table-p13-columns-dialog\">\n    <fd-dialog-header>\n        <ng-template fdkTemplate=\"header\">\n            <div fd-bar-left>\n                <fd-bar-element>\n                    <h4 fd-title [headerSize]=\"4\">\n                        {{ 'platformTable.P13ColumnsDialogHeader' | fdTranslate }}\n                    </h4>\n                </fd-bar-element>\n            </div>\n            <div fd-bar-right>\n                <fd-bar-element>\n                    <fdp-table-reset-button></fdp-table-reset-button>\n                </fd-bar-element>\n            </div>\n        </ng-template>\n    </fd-dialog-header>\n\n    <fd-dialog-body>\n        <fd-toolbar>\n            <fdp-search-field\n                [placeholder]=\"'platformTable.P13ColumnsDialogSearchPlaceholder' | fdTranslate\"\n                [inputText]=\"(_searchQuerySubject | async) || ''\"\n                [suggestions]=\"[]\"\n                (inputChange)=\"_searchInputChange($event)\"\n                fdkInitialFocus\n            ></fdp-search-field>\n\n            <fd-toolbar-spacer></fd-toolbar-spacer>\n\n            <!-- Show Selected/All -->\n            <button fd-toolbar-item fd-button fdType=\"transparent\" (click)=\"_toggleShowAll()\">\n                <ng-container *ngIf=\"(_showAllItemsSubject | async) === true; else showAll\">\n                    {{ 'platformTable.P13ColumnsDialogsShowSelected' | fdTranslate }}\n                </ng-container>\n                <ng-template #showAll>\n                    {{ 'platformTable.P13ColumnsDialogShowAll' | fdTranslate }}\n                </ng-template>\n            </button>\n\n            <!-- Active Button Movement -->\n            <button\n                fd-toolbar-item\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"collapse-group\"\n                [disabled]=\"_moveUpDisabled\"\n                [attr.aria-label]=\"'platformTable.P13ColumnsDialogMoveToTopBtn' | fdTranslate\"\n                [title]=\"'platformTable.P13ColumnsDialogMoveToTopBtn' | fdTranslate\"\n                (click)=\"_moveActiveToTop()\"\n            ></button>\n\n            <button\n                fd-toolbar-item\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"slim-arrow-up\"\n                [disabled]=\"_moveUpDisabled\"\n                [attr.aria-label]=\"'platformTable.P13ColumnsDialogMoveUpBtn' | fdTranslate\"\n                [title]=\"'platformTable.P13ColumnsDialogMoveUpBtn' | fdTranslate\"\n                (click)=\"_moveActiveUp()\"\n            ></button>\n\n            <button\n                fd-toolbar-item\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"slim-arrow-down\"\n                [disabled]=\"_moveDownDisabled\"\n                [attr.aria-label]=\"'platformTable.P13ColumnsDialogMoveDownBtn' | fdTranslate\"\n                [title]=\"'platformTable.P13ColumnsDialogMoveDownBtn' | fdTranslate\"\n                (click)=\"_moveActiveDown()\"\n            ></button>\n\n            <button\n                fd-toolbar-item\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"expand-group\"\n                [disabled]=\"_moveDownDisabled\"\n                [attr.aria-label]=\"'platformTable.P13ColumnsDialogMoveToBottomBtn' | fdTranslate\"\n                [title]=\"'platformTable.P13ColumnsDialogMoveToBottomBtn' | fdTranslate\"\n                (click)=\"_moveActiveToBottom()\"\n            ></button>\n        </fd-toolbar>\n\n        <ul fd-list>\n            <li fd-list-item>\n                <fd-checkbox\n                    [ngModel]=\"_selectedColumnsCount === _selectableColumns.length\"\n                    (ngModelChange)=\"_toggleSelectAll($event)\"\n                    [disabled]=\"_selectAllDisabled\"\n                ></fd-checkbox>\n                <span fd-list-title>\n                    {{\n                        'platformTable.P13ColumnsDialogSelectAll'\n                            | fdTranslate\n                                : {\n                                      selectedColumnsCount: _selectedColumnsCount,\n                                      selectableColumnsCount: _selectableColumns.length\n                                  }\n                    }}\n                </span>\n            </li>\n            <li\n                fd-list-item\n                *ngFor=\"let item of _filteredColumns; trackBy: _filterByColumnKy\"\n                [class.fd-select-item--selected]=\"item.selected\"\n                [class.fd-select-item--active]=\"item.active\"\n                (click)=\"_setActiveColumn(item)\"\n            >\n                <fd-checkbox [(ngModel)]=\"item.selected\" (ngModelChange)=\"_onToggleColumn()\"></fd-checkbox>\n                <span fd-list-title>\n                    {{ item.column.label }}\n                </span>\n            </li>\n        </ul>\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n        <fd-dialog-footer-button>\n            <button\n                fd-button\n                fdType=\"emphasized\"\n                fd-dialog-decisive-button\n                [label]=\"'platformTable.P13ColumnsDialogConfirmationBtnLabel' | fdTranslate\"\n                (click)=\"confirm()\"\n            ></button>\n        </fd-dialog-footer-button>\n\n        <fd-dialog-footer-button>\n            <button\n                fd-button\n                fdType=\"transparent\"\n                fd-dialog-decisive-button\n                [label]=\"'platformTable.P13ColumnsDialogCancelBtnLabel' | fdTranslate\"\n                (click)=\"cancel()\"\n            ></button>\n        </fd-dialog-footer-button>\n    </fd-dialog-footer>\n</fd-dialog>\n", styles: [".fdp-table-p13-columns-dialog fd-toolbar{position:sticky;top:0;z-index:1;display:block}.fdp-table-p13-columns-dialog .fd-select-item--active{background:#e5f0fa;background:var(--sapList_SelectionBackgroundColor, #e5f0fa)}.fdp-table-p13-columns-dialog .group-row{display:flex;align-items:center;margin-bottom:.5rem}.fdp-table-p13-columns-dialog .group-row .fd-popover-custom{display:block}.fdp-table-p13-columns-dialog .group-row__checkbox,.fdp-table-p13-columns-dialog .group-row__actions,.fdp-table-p13-columns-dialog .group-row__select{margin-right:1rem}.fdp-table-p13-columns-dialog .group-row__select{flex:1 1 0}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i3$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i3$2.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: i4$1.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i6$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i6$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1$2.DialogFooterButtonComponent, selector: "fd-dialog-footer-button" }, { kind: "directive", type: i1$2.DialogDecisiveButtonDirective, selector: "[fd-dialog-decisive-button]" }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth", "isTitle"] }, { kind: "component", type: i5.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i2.TemplateDirective, selector: "[fdkTemplate], [fdTemplate]", inputs: ["fdkTemplate"] }, { kind: "directive", type: i2.InitialFocusDirective, selector: "[fdkInitialFocus], [fdInitialFocus], [fd-initial-focus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "component", type: i11$1.SearchFieldComponent, selector: "fdp-search-field", inputs: ["categoryMode", "appearance", "placeholder", "mobile", "mobileConfig", "disableRefresh", "disableSearch", "suggestions", "dataSource", "inputText", "categories", "currentCategory", "categoryLabel", "hideCategoryLabel", "isLoading", "ariaLabel", "ariaLabelledby", "searchSuggestionMessage", "searchSuggestionNavigateMessage", "forceSearchButton", "disableSuggestionsFoundAnnouncer"], outputs: ["inputChange", "searchSubmit", "cancelSearch", "isOpenChange"] }, { kind: "component", type: ResetButtonComponent, selector: "fdp-table-reset-button" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i11.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+P13ColumnsDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: P13ColumnsDialogComponent, selector: "ng-component", providers: [{ provide: RESETTABLE_TOKEN, useExisting: P13ColumnsDialogComponent }], ngImport: i0, template: "<fd-dialog class=\"fdp-table-p13-columns-dialog\">\n    <fd-dialog-header>\n        <ng-template fdkTemplate=\"header\">\n            <div fd-bar-left>\n                <fd-bar-element>\n                    <h4 fd-title [headerSize]=\"4\">\n                        {{ 'platformTable.P13ColumnsDialogHeader' | fdTranslate }}\n                    </h4>\n                </fd-bar-element>\n            </div>\n            <div fd-bar-right>\n                <fd-bar-element>\n                    <fdp-table-reset-button></fdp-table-reset-button>\n                </fd-bar-element>\n            </div>\n        </ng-template>\n    </fd-dialog-header>\n\n    <fd-dialog-body>\n        <fd-toolbar>\n            <fdp-search-field\n                [placeholder]=\"'platformTable.P13ColumnsDialogSearchPlaceholder' | fdTranslate\"\n                [inputText]=\"(_searchQuerySubject | async) || ''\"\n                [suggestions]=\"[]\"\n                (inputChange)=\"_searchInputChange($event)\"\n                fdkInitialFocus\n            ></fdp-search-field>\n\n            <fd-toolbar-spacer></fd-toolbar-spacer>\n\n            <!-- Show Selected/All -->\n            <button fd-toolbar-item fd-button fdType=\"transparent\" (click)=\"_toggleShowAll()\">\n                <ng-container *ngIf=\"(_showAllItemsSubject | async) === true; else showAll\">\n                    {{ 'platformTable.P13ColumnsDialogsShowSelected' | fdTranslate }}\n                </ng-container>\n                <ng-template #showAll>\n                    {{ 'platformTable.P13ColumnsDialogShowAll' | fdTranslate }}\n                </ng-template>\n            </button>\n\n            <!-- Active Button Movement -->\n            <button\n                fd-toolbar-item\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"collapse-group\"\n                [disabled]=\"_moveUpDisabled\"\n                [attr.aria-label]=\"'platformTable.P13ColumnsDialogMoveToTopBtn' | fdTranslate\"\n                [title]=\"'platformTable.P13ColumnsDialogMoveToTopBtn' | fdTranslate\"\n                (click)=\"_moveActiveToTop()\"\n            ></button>\n\n            <button\n                fd-toolbar-item\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"slim-arrow-up\"\n                [disabled]=\"_moveUpDisabled\"\n                [attr.aria-label]=\"'platformTable.P13ColumnsDialogMoveUpBtn' | fdTranslate\"\n                [title]=\"'platformTable.P13ColumnsDialogMoveUpBtn' | fdTranslate\"\n                (click)=\"_moveActiveUp()\"\n            ></button>\n\n            <button\n                fd-toolbar-item\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"slim-arrow-down\"\n                [disabled]=\"_moveDownDisabled\"\n                [attr.aria-label]=\"'platformTable.P13ColumnsDialogMoveDownBtn' | fdTranslate\"\n                [title]=\"'platformTable.P13ColumnsDialogMoveDownBtn' | fdTranslate\"\n                (click)=\"_moveActiveDown()\"\n            ></button>\n\n            <button\n                fd-toolbar-item\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"expand-group\"\n                [disabled]=\"_moveDownDisabled\"\n                [attr.aria-label]=\"'platformTable.P13ColumnsDialogMoveToBottomBtn' | fdTranslate\"\n                [title]=\"'platformTable.P13ColumnsDialogMoveToBottomBtn' | fdTranslate\"\n                (click)=\"_moveActiveToBottom()\"\n            ></button>\n        </fd-toolbar>\n\n        <ul fd-list>\n            <li fd-list-item>\n                <fd-checkbox\n                    [ngModel]=\"_selectedColumnsCount === _selectableColumns.length\"\n                    (ngModelChange)=\"_toggleSelectAll($event)\"\n                    [disabled]=\"_selectAllDisabled\"\n                ></fd-checkbox>\n                <span fd-list-title>\n                    {{\n                        'platformTable.P13ColumnsDialogSelectAll'\n                            | fdTranslate\n                                : {\n                                      selectedColumnsCount: _selectedColumnsCount,\n                                      selectableColumnsCount: _selectableColumns.length\n                                  }\n                    }}\n                </span>\n            </li>\n            <li\n                fd-list-item\n                *ngFor=\"let item of _filteredColumns; trackBy: _filterByColumnKy\"\n                [class.fd-select-item--selected]=\"item.selected\"\n                [class.fd-select-item--active]=\"item.active\"\n                (click)=\"_setActiveColumn(item)\"\n            >\n                <fd-checkbox [(ngModel)]=\"item.selected\" (ngModelChange)=\"_onToggleColumn()\"></fd-checkbox>\n                <span fd-list-title>\n                    {{ item.column.label }}\n                </span>\n            </li>\n        </ul>\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n        <fd-dialog-footer-button>\n            <button\n                fd-button\n                fdType=\"emphasized\"\n                fd-dialog-decisive-button\n                [label]=\"'platformTable.P13ColumnsDialogConfirmationBtnLabel' | fdTranslate\"\n                (click)=\"confirm()\"\n            ></button>\n        </fd-dialog-footer-button>\n\n        <fd-dialog-footer-button>\n            <button\n                fd-button\n                fdType=\"transparent\"\n                fd-dialog-decisive-button\n                [label]=\"'platformTable.P13ColumnsDialogCancelBtnLabel' | fdTranslate\"\n                (click)=\"cancel()\"\n            ></button>\n        </fd-dialog-footer-button>\n    </fd-dialog-footer>\n</fd-dialog>\n", styles: [".fdp-table-p13-columns-dialog fd-toolbar{position:sticky;top:0;z-index:1;display:block}.fdp-table-p13-columns-dialog .fd-select-item--active{background:#e5f0fa;background:var(--sapList_SelectionBackgroundColor, #e5f0fa)}.fdp-table-p13-columns-dialog .group-row{display:flex;align-items:center;margin-bottom:.5rem}.fdp-table-p13-columns-dialog .group-row .fd-popover-custom{display:block}.fdp-table-p13-columns-dialog .group-row__checkbox,.fdp-table-p13-columns-dialog .group-row__actions,.fdp-table-p13-columns-dialog .group-row__select{margin-right:1rem}.fdp-table-p13-columns-dialog .group-row__select{flex:1 1 0}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i3$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i3$2.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: i4$1.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i6$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i6$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText", "ariaRole"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1$2.DialogFooterButtonComponent, selector: "fd-dialog-footer-button" }, { kind: "directive", type: i1$2.DialogDecisiveButtonDirective, selector: "[fd-dialog-decisive-button]" }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth", "isTitle"] }, { kind: "component", type: i5.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i2.TemplateDirective, selector: "[fdkTemplate], [fdTemplate]", inputs: ["fdkTemplate"] }, { kind: "directive", type: i2.InitialFocusDirective, selector: "[fdkInitialFocus], [fdInitialFocus], [fd-initial-focus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "component", type: i11$1.SearchFieldComponent, selector: "fdp-search-field", inputs: ["categoryMode", "appearance", "placeholder", "mobile", "mobileConfig", "disableRefresh", "disableSearch", "suggestions", "dataSource", "inputText", "categories", "currentCategory", "categoryLabel", "hideCategoryLabel", "isLoading", "ariaLabel", "ariaLabelledby", "searchSuggestionMessage", "searchSuggestionNavigateMessage", "forceSearchButton", "disableSuggestionsFoundAnnouncer"], outputs: ["inputChange", "searchSubmit", "cancelSearch", "isOpenChange"] }, { kind: "component", type: ResetButtonComponent, selector: "fdp-table-reset-button" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i11.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: P13ColumnsDialogComponent, decorators: [{
             type: Component,
             args: [{ encapsulation: ViewEncapsulation.None, providers: [{ provide: RESETTABLE_TOKEN, useExisting: P13ColumnsDialogComponent }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-dialog class=\"fdp-table-p13-columns-dialog\">\n    <fd-dialog-header>\n        <ng-template fdkTemplate=\"header\">\n            <div fd-bar-left>\n                <fd-bar-element>\n                    <h4 fd-title [headerSize]=\"4\">\n                        {{ 'platformTable.P13ColumnsDialogHeader' | fdTranslate }}\n                    </h4>\n                </fd-bar-element>\n            </div>\n            <div fd-bar-right>\n                <fd-bar-element>\n                    <fdp-table-reset-button></fdp-table-reset-button>\n                </fd-bar-element>\n            </div>\n        </ng-template>\n    </fd-dialog-header>\n\n    <fd-dialog-body>\n        <fd-toolbar>\n            <fdp-search-field\n                [placeholder]=\"'platformTable.P13ColumnsDialogSearchPlaceholder' | fdTranslate\"\n                [inputText]=\"(_searchQuerySubject | async) || ''\"\n                [suggestions]=\"[]\"\n                (inputChange)=\"_searchInputChange($event)\"\n                fdkInitialFocus\n            ></fdp-search-field>\n\n            <fd-toolbar-spacer></fd-toolbar-spacer>\n\n            <!-- Show Selected/All -->\n            <button fd-toolbar-item fd-button fdType=\"transparent\" (click)=\"_toggleShowAll()\">\n                <ng-container *ngIf=\"(_showAllItemsSubject | async) === true; else showAll\">\n                    {{ 'platformTable.P13ColumnsDialogsShowSelected' | fdTranslate }}\n                </ng-container>\n                <ng-template #showAll>\n                    {{ 'platformTable.P13ColumnsDialogShowAll' | fdTranslate }}\n                </ng-template>\n            </button>\n\n            <!-- Active Button Movement -->\n            <button\n                fd-toolbar-item\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"collapse-group\"\n                [disabled]=\"_moveUpDisabled\"\n                [attr.aria-label]=\"'platformTable.P13ColumnsDialogMoveToTopBtn' | fdTranslate\"\n                [title]=\"'platformTable.P13ColumnsDialogMoveToTopBtn' | fdTranslate\"\n                (click)=\"_moveActiveToTop()\"\n            ></button>\n\n            <button\n                fd-toolbar-item\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"slim-arrow-up\"\n                [disabled]=\"_moveUpDisabled\"\n                [attr.aria-label]=\"'platformTable.P13ColumnsDialogMoveUpBtn' | fdTranslate\"\n                [title]=\"'platformTable.P13ColumnsDialogMoveUpBtn' | fdTranslate\"\n                (click)=\"_moveActiveUp()\"\n            ></button>\n\n            <button\n                fd-toolbar-item\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"slim-arrow-down\"\n                [disabled]=\"_moveDownDisabled\"\n                [attr.aria-label]=\"'platformTable.P13ColumnsDialogMoveDownBtn' | fdTranslate\"\n                [title]=\"'platformTable.P13ColumnsDialogMoveDownBtn' | fdTranslate\"\n                (click)=\"_moveActiveDown()\"\n            ></button>\n\n            <button\n                fd-toolbar-item\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"expand-group\"\n                [disabled]=\"_moveDownDisabled\"\n                [attr.aria-label]=\"'platformTable.P13ColumnsDialogMoveToBottomBtn' | fdTranslate\"\n                [title]=\"'platformTable.P13ColumnsDialogMoveToBottomBtn' | fdTranslate\"\n                (click)=\"_moveActiveToBottom()\"\n            ></button>\n        </fd-toolbar>\n\n        <ul fd-list>\n            <li fd-list-item>\n                <fd-checkbox\n                    [ngModel]=\"_selectedColumnsCount === _selectableColumns.length\"\n                    (ngModelChange)=\"_toggleSelectAll($event)\"\n                    [disabled]=\"_selectAllDisabled\"\n                ></fd-checkbox>\n                <span fd-list-title>\n                    {{\n                        'platformTable.P13ColumnsDialogSelectAll'\n                            | fdTranslate\n                                : {\n                                      selectedColumnsCount: _selectedColumnsCount,\n                                      selectableColumnsCount: _selectableColumns.length\n                                  }\n                    }}\n                </span>\n            </li>\n            <li\n                fd-list-item\n                *ngFor=\"let item of _filteredColumns; trackBy: _filterByColumnKy\"\n                [class.fd-select-item--selected]=\"item.selected\"\n                [class.fd-select-item--active]=\"item.active\"\n                (click)=\"_setActiveColumn(item)\"\n            >\n                <fd-checkbox [(ngModel)]=\"item.selected\" (ngModelChange)=\"_onToggleColumn()\"></fd-checkbox>\n                <span fd-list-title>\n                    {{ item.column.label }}\n                </span>\n            </li>\n        </ul>\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n        <fd-dialog-footer-button>\n            <button\n                fd-button\n                fdType=\"emphasized\"\n                fd-dialog-decisive-button\n                [label]=\"'platformTable.P13ColumnsDialogConfirmationBtnLabel' | fdTranslate\"\n                (click)=\"confirm()\"\n            ></button>\n        </fd-dialog-footer-button>\n\n        <fd-dialog-footer-button>\n            <button\n                fd-button\n                fdType=\"transparent\"\n                fd-dialog-decisive-button\n                [label]=\"'platformTable.P13ColumnsDialogCancelBtnLabel' | fdTranslate\"\n                (click)=\"cancel()\"\n            ></button>\n        </fd-dialog-footer-button>\n    </fd-dialog-footer>\n</fd-dialog>\n", styles: [".fdp-table-p13-columns-dialog fd-toolbar{position:sticky;top:0;z-index:1;display:block}.fdp-table-p13-columns-dialog .fd-select-item--active{background:#e5f0fa;background:var(--sapList_SelectionBackgroundColor, #e5f0fa)}.fdp-table-p13-columns-dialog .group-row{display:flex;align-items:center;margin-bottom:.5rem}.fdp-table-p13-columns-dialog .group-row .fd-popover-custom{display:block}.fdp-table-p13-columns-dialog .group-row__checkbox,.fdp-table-p13-columns-dialog .group-row__actions,.fdp-table-p13-columns-dialog .group-row__select{margin-right:1rem}.fdp-table-p13-columns-dialog .group-row__select{flex:1 1 0}\n"] }]
@@ -1630,7 +1630,7 @@ class FiltersListStepComponent {
     }
 }
 FiltersListStepComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FiltersListStepComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-FiltersListStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FiltersListStepComponent, selector: "fdp-filters-list-step", inputs: { filters: "filters" }, outputs: { selectFilter: "selectFilter" }, providers: [{ provide: FILTERS_VIEW_STEP_TOKEN, useExisting: forwardRef(() => FiltersListStepComponent) }], viewQueries: [{ propertyName: "titleTemplateRef", first: true, predicate: ["titleTemplate"], descendants: true }, { propertyName: "bodyTemplateRef", first: true, predicate: ["bodyTemplate"], descendants: true }], ngImport: i0, template: "<ng-template #titleTemplate>\n    <h4 fd-title [headerSize]=\"4\">{{ 'platformTable.filterDialogFilterTitle' | fdTranslate }}</h4>\n</ng-template>\n\n<ng-template #bodyTemplate>\n    <ul fd-list [navigationIndicator]=\"true\">\n        <li fd-list-group-header>{{ 'platformTable.filterDialogFilterBy' | fdTranslate }}</li>\n\n        <li fd-list-item *ngFor=\"let filter of filters\">\n            <a fd-list-link (click)=\"selectFilter.emit(filter)\">\n                <span fd-list-title>{{ filter.label }}</span>\n            </a>\n        </li>\n    </ul>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i6$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i6$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i6$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i5.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "pipe", type: i11.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+FiltersListStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FiltersListStepComponent, selector: "fdp-filters-list-step", inputs: { filters: "filters" }, outputs: { selectFilter: "selectFilter" }, providers: [{ provide: FILTERS_VIEW_STEP_TOKEN, useExisting: forwardRef(() => FiltersListStepComponent) }], viewQueries: [{ propertyName: "titleTemplateRef", first: true, predicate: ["titleTemplate"], descendants: true }, { propertyName: "bodyTemplateRef", first: true, predicate: ["bodyTemplate"], descendants: true }], ngImport: i0, template: "<ng-template #titleTemplate>\n    <h4 fd-title [headerSize]=\"4\">{{ 'platformTable.filterDialogFilterTitle' | fdTranslate }}</h4>\n</ng-template>\n\n<ng-template #bodyTemplate>\n    <ul fd-list [navigationIndicator]=\"true\">\n        <li fd-list-group-header>{{ 'platformTable.filterDialogFilterBy' | fdTranslate }}</li>\n\n        <li fd-list-item *ngFor=\"let filter of filters\">\n            <a fd-list-link (click)=\"selectFilter.emit(filter)\">\n                <span fd-list-title>{{ filter.label }}</span>\n            </a>\n        </li>\n    </ul>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i6$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i6$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText", "ariaRole"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i6$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i5.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "pipe", type: i11.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FiltersListStepComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fdp-filters-list-step', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: FILTERS_VIEW_STEP_TOKEN, useExisting: forwardRef(() => FiltersListStepComponent) }], template: "<ng-template #titleTemplate>\n    <h4 fd-title [headerSize]=\"4\">{{ 'platformTable.filterDialogFilterTitle' | fdTranslate }}</h4>\n</ng-template>\n\n<ng-template #bodyTemplate>\n    <ul fd-list [navigationIndicator]=\"true\">\n        <li fd-list-group-header>{{ 'platformTable.filterDialogFilterBy' | fdTranslate }}</li>\n\n        <li fd-list-item *ngFor=\"let filter of filters\">\n            <a fd-list-link (click)=\"selectFilter.emit(filter)\">\n                <span fd-list-title>{{ filter.label }}</span>\n            </a>\n        </li>\n    </ul>\n</ng-template>\n" }]
@@ -1737,7 +1737,7 @@ class FilterSingleSelectComponent {
     }
 }
 FilterSingleSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FilterSingleSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-FilterSingleSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FilterSingleSelectComponent, selector: "fdp-filter-single-select", inputs: { options: "options", filterBy: "filterBy" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<ul fd-list [selection]=\"true\">\n    <li fd-list-item [selected]=\"_value === NOT_FILTERED_OPTION_VALUE\">\n        <fd-radio-button\n            name=\"sort-by\"\n            [value]=\"NOT_FILTERED_OPTION_VALUE\"\n            state=\"default\"\n            [ngModel]=\"_value\"\n            (ngModelChange)=\"_onValueChange($event)\"\n        ></fd-radio-button>\n        <span fd-list-title>{{ 'platformTable.filterDialogNotFilteredLabel' | fdTranslate }}</span>\n    </li>\n    <li fd-list-item *ngFor=\"let option of options\" [selected]=\"option.value === _value\">\n        <fd-radio-button\n            [ngModel]=\"_value\"\n            (ngModelChange)=\"_onValueChange($event)\"\n            [value]=\"option.value\"\n            name=\"filtering-settings-single-select\"\n        ></fd-radio-button>\n        <span fd-list-title>{{ option.label }}</span>\n    </li>\n</ul>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5$1.RadioButtonComponent, selector: "fd-radio-button", inputs: ["ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "title", "tabIndex", "state", "disabled", "selectedValue", "name", "id", "value", "required", "standalone"] }, { kind: "component", type: i6$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i6$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "pipe", type: i11.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+FilterSingleSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FilterSingleSelectComponent, selector: "fdp-filter-single-select", inputs: { options: "options", filterBy: "filterBy" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<ul fd-list [selection]=\"true\">\n    <li fd-list-item [selected]=\"_value === NOT_FILTERED_OPTION_VALUE\">\n        <fd-radio-button\n            name=\"sort-by\"\n            [value]=\"NOT_FILTERED_OPTION_VALUE\"\n            state=\"default\"\n            [ngModel]=\"_value\"\n            (ngModelChange)=\"_onValueChange($event)\"\n        ></fd-radio-button>\n        <span fd-list-title>{{ 'platformTable.filterDialogNotFilteredLabel' | fdTranslate }}</span>\n    </li>\n    <li fd-list-item *ngFor=\"let option of options\" [selected]=\"option.value === _value\">\n        <fd-radio-button\n            [ngModel]=\"_value\"\n            (ngModelChange)=\"_onValueChange($event)\"\n            [value]=\"option.value\"\n            name=\"filtering-settings-single-select\"\n        ></fd-radio-button>\n        <span fd-list-title>{{ option.label }}</span>\n    </li>\n</ul>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5$1.RadioButtonComponent, selector: "fd-radio-button", inputs: ["ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "title", "tabIndex", "state", "disabled", "selectedValue", "name", "id", "value", "required", "standalone"] }, { kind: "component", type: i6$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i6$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText", "ariaRole"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "pipe", type: i11.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FilterSingleSelectComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fdp-filter-single-select', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ul fd-list [selection]=\"true\">\n    <li fd-list-item [selected]=\"_value === NOT_FILTERED_OPTION_VALUE\">\n        <fd-radio-button\n            name=\"sort-by\"\n            [value]=\"NOT_FILTERED_OPTION_VALUE\"\n            state=\"default\"\n            [ngModel]=\"_value\"\n            (ngModelChange)=\"_onValueChange($event)\"\n        ></fd-radio-button>\n        <span fd-list-title>{{ 'platformTable.filterDialogNotFilteredLabel' | fdTranslate }}</span>\n    </li>\n    <li fd-list-item *ngFor=\"let option of options\" [selected]=\"option.value === _value\">\n        <fd-radio-button\n            [ngModel]=\"_value\"\n            (ngModelChange)=\"_onValueChange($event)\"\n            [value]=\"option.value\"\n            name=\"filtering-settings-single-select\"\n        ></fd-radio-button>\n        <span fd-list-title>{{ option.label }}</span>\n    </li>\n</ul>\n" }]
@@ -1777,7 +1777,7 @@ class FilterMultiSelectComponent {
     }
 }
 FilterMultiSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FilterMultiSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-FilterMultiSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FilterMultiSelectComponent, selector: "fdp-filter-multi-select", inputs: { options: "options", filterBy: "filterBy" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<ul fd-list [selection]=\"true\">\n    <li fd-list-item *ngFor=\"let option of _selectableOptions\" [selected]=\"option.selected\">\n        <fd-checkbox [ngModel]=\"option.selected\" (ngModelChange)=\"_onSelectChange(option, $event)\"></fd-checkbox>\n        <span fd-list-title>{{ option.label }}</span>\n    </li>\n</ul>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$1.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i6$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i6$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+FilterMultiSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FilterMultiSelectComponent, selector: "fdp-filter-multi-select", inputs: { options: "options", filterBy: "filterBy" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<ul fd-list [selection]=\"true\">\n    <li fd-list-item *ngFor=\"let option of _selectableOptions\" [selected]=\"option.selected\">\n        <fd-checkbox [ngModel]=\"option.selected\" (ngModelChange)=\"_onSelectChange(option, $event)\"></fd-checkbox>\n        <span fd-list-title>{{ option.label }}</span>\n    </li>\n</ul>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$1.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i6$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i6$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText", "ariaRole"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FilterMultiSelectComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fdp-filter-multi-select', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ul fd-list [selection]=\"true\">\n    <li fd-list-item *ngFor=\"let option of _selectableOptions\" [selected]=\"option.selected\">\n        <fd-checkbox [ngModel]=\"option.selected\" (ngModelChange)=\"_onSelectChange(option, $event)\"></fd-checkbox>\n        <span fd-list-title>{{ option.label }}</span>\n    </li>\n</ul>\n" }]
@@ -2093,7 +2093,7 @@ class GroupingComponent {
     }
 }
 GroupingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GroupingComponent, deps: [{ token: i1$2.DialogRef }, { token: i1.Table }], target: i0.ɵɵFactoryTarget.Component });
-GroupingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GroupingComponent, selector: "ng-component", providers: [{ provide: RESETTABLE_TOKEN, useExisting: forwardRef(() => GroupingComponent) }], ngImport: i0, template: "<fd-dialog>\n    <fd-dialog-header>\n        <ng-template fdkTemplate=\"header\">\n            <div fd-bar-left>\n                <fd-bar-element>\n                    <h4 fd-title [headerSize]=\"4\">{{ 'platformTable.groupDialogHeader' | fdTranslate }}</h4>\n                </fd-bar-element>\n            </div>\n            <div fd-bar-right>\n                <fd-bar-element>\n                    <fdp-table-reset-button></fdp-table-reset-button>\n                </fd-bar-element>\n            </div>\n        </ng-template>\n    </fd-dialog-header>\n\n    <fd-dialog-body>\n        <ul fd-list [selection]=\"true\">\n            <li fd-list-group-header>\n                <span fd-list-title>{{ 'platformTable.groupDialogGroupOrderHeader' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item [selected]=\"direction === SORT_DIRECTION.ASC\">\n                <fd-radio-button\n                    name=\"sort-order\"\n                    value=\"asc\"\n                    state=\"default\"\n                    [ngModel]=\"direction\"\n                    (ngModelChange)=\"_groupOrderChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.groupDialogGroupOrderAsc' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item [selected]=\"direction === SORT_DIRECTION.DESC\">\n                <fd-radio-button\n                    name=\"sort-order\"\n                    value=\"desc\"\n                    state=\"default\"\n                    [ngModel]=\"direction\"\n                    (ngModelChange)=\"_groupOrderChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.groupDialogGroupOrderDesc' | fdTranslate }}</span>\n            </li>\n        </ul>\n\n        <ul fd-list [selection]=\"true\">\n            <li fd-list-group-header>\n                <span fd-list-title>{{ 'platformTable.groupDialogGroupByHeader' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item [selected]=\"NOT_GROUPED_OPTION_VALUE === field\">\n                <fd-radio-button\n                    name=\"sort-by\"\n                    [value]=\"NOT_GROUPED_OPTION_VALUE\"\n                    state=\"default\"\n                    [ngModel]=\"field\"\n                    (ngModelChange)=\"_groupFieldChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.groupDialogNotGroupedLabel' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item *ngFor=\"let column of columns\" [selected]=\"column.key === field\">\n                <fd-radio-button\n                    name=\"sort-by\"\n                    [value]=\"column.key\"\n                    state=\"default\"\n                    [ngModel]=\"field\"\n                    (ngModelChange)=\"_groupFieldChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ column.label }}</span>\n            </li>\n        </ul>\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n        <fd-button-bar\n            fdType=\"emphasized\"\n            [label]=\"'platformTable.groupDialogConfirmBtnLabel' | fdTranslate\"\n            (click)=\"confirm()\"\n        >\n        </fd-button-bar>\n        <fd-button-bar\n            [label]=\"'platformTable.groupDialogCancelBtnLabel' | fdTranslate\"\n            fdkInitialFocus\n            (click)=\"cancel()\"\n        >\n        </fd-button-bar>\n    </fd-dialog-footer>\n</fd-dialog>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5$1.RadioButtonComponent, selector: "fd-radio-button", inputs: ["ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "title", "tabIndex", "state", "disabled", "selectedValue", "name", "id", "value", "required", "standalone"] }, { kind: "component", type: i6$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i6$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i6$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth", "isTitle"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i5.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i2.TemplateDirective, selector: "[fdkTemplate], [fdTemplate]", inputs: ["fdkTemplate"] }, { kind: "directive", type: i2.InitialFocusDirective, selector: "[fdkInitialFocus], [fdInitialFocus], [fd-initial-focus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "component", type: ResetButtonComponent, selector: "fdp-table-reset-button" }, { kind: "pipe", type: i11.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+GroupingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GroupingComponent, selector: "ng-component", providers: [{ provide: RESETTABLE_TOKEN, useExisting: forwardRef(() => GroupingComponent) }], ngImport: i0, template: "<fd-dialog>\n    <fd-dialog-header>\n        <ng-template fdkTemplate=\"header\">\n            <div fd-bar-left>\n                <fd-bar-element>\n                    <h4 fd-title [headerSize]=\"4\">{{ 'platformTable.groupDialogHeader' | fdTranslate }}</h4>\n                </fd-bar-element>\n            </div>\n            <div fd-bar-right>\n                <fd-bar-element>\n                    <fdp-table-reset-button></fdp-table-reset-button>\n                </fd-bar-element>\n            </div>\n        </ng-template>\n    </fd-dialog-header>\n\n    <fd-dialog-body>\n        <ul fd-list [selection]=\"true\">\n            <li fd-list-group-header>\n                <span fd-list-title>{{ 'platformTable.groupDialogGroupOrderHeader' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item [selected]=\"direction === SORT_DIRECTION.ASC\">\n                <fd-radio-button\n                    name=\"sort-order\"\n                    value=\"asc\"\n                    state=\"default\"\n                    [ngModel]=\"direction\"\n                    (ngModelChange)=\"_groupOrderChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.groupDialogGroupOrderAsc' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item [selected]=\"direction === SORT_DIRECTION.DESC\">\n                <fd-radio-button\n                    name=\"sort-order\"\n                    value=\"desc\"\n                    state=\"default\"\n                    [ngModel]=\"direction\"\n                    (ngModelChange)=\"_groupOrderChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.groupDialogGroupOrderDesc' | fdTranslate }}</span>\n            </li>\n        </ul>\n\n        <ul fd-list [selection]=\"true\">\n            <li fd-list-group-header>\n                <span fd-list-title>{{ 'platformTable.groupDialogGroupByHeader' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item [selected]=\"NOT_GROUPED_OPTION_VALUE === field\">\n                <fd-radio-button\n                    name=\"sort-by\"\n                    [value]=\"NOT_GROUPED_OPTION_VALUE\"\n                    state=\"default\"\n                    [ngModel]=\"field\"\n                    (ngModelChange)=\"_groupFieldChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.groupDialogNotGroupedLabel' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item *ngFor=\"let column of columns\" [selected]=\"column.key === field\">\n                <fd-radio-button\n                    name=\"sort-by\"\n                    [value]=\"column.key\"\n                    state=\"default\"\n                    [ngModel]=\"field\"\n                    (ngModelChange)=\"_groupFieldChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ column.label }}</span>\n            </li>\n        </ul>\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n        <fd-button-bar\n            fdType=\"emphasized\"\n            [label]=\"'platformTable.groupDialogConfirmBtnLabel' | fdTranslate\"\n            (click)=\"confirm()\"\n        >\n        </fd-button-bar>\n        <fd-button-bar\n            [label]=\"'platformTable.groupDialogCancelBtnLabel' | fdTranslate\"\n            fdkInitialFocus\n            (click)=\"cancel()\"\n        >\n        </fd-button-bar>\n    </fd-dialog-footer>\n</fd-dialog>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5$1.RadioButtonComponent, selector: "fd-radio-button", inputs: ["ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "title", "tabIndex", "state", "disabled", "selectedValue", "name", "id", "value", "required", "standalone"] }, { kind: "component", type: i6$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i6$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText", "ariaRole"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i6$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth", "isTitle"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i5.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i2.TemplateDirective, selector: "[fdkTemplate], [fdTemplate]", inputs: ["fdkTemplate"] }, { kind: "directive", type: i2.InitialFocusDirective, selector: "[fdkInitialFocus], [fdInitialFocus], [fd-initial-focus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "component", type: ResetButtonComponent, selector: "fdp-table-reset-button" }, { kind: "pipe", type: i11.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GroupingComponent, decorators: [{
             type: Component,
             args: [{ providers: [{ provide: RESETTABLE_TOKEN, useExisting: forwardRef(() => GroupingComponent) }], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<fd-dialog>\n    <fd-dialog-header>\n        <ng-template fdkTemplate=\"header\">\n            <div fd-bar-left>\n                <fd-bar-element>\n                    <h4 fd-title [headerSize]=\"4\">{{ 'platformTable.groupDialogHeader' | fdTranslate }}</h4>\n                </fd-bar-element>\n            </div>\n            <div fd-bar-right>\n                <fd-bar-element>\n                    <fdp-table-reset-button></fdp-table-reset-button>\n                </fd-bar-element>\n            </div>\n        </ng-template>\n    </fd-dialog-header>\n\n    <fd-dialog-body>\n        <ul fd-list [selection]=\"true\">\n            <li fd-list-group-header>\n                <span fd-list-title>{{ 'platformTable.groupDialogGroupOrderHeader' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item [selected]=\"direction === SORT_DIRECTION.ASC\">\n                <fd-radio-button\n                    name=\"sort-order\"\n                    value=\"asc\"\n                    state=\"default\"\n                    [ngModel]=\"direction\"\n                    (ngModelChange)=\"_groupOrderChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.groupDialogGroupOrderAsc' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item [selected]=\"direction === SORT_DIRECTION.DESC\">\n                <fd-radio-button\n                    name=\"sort-order\"\n                    value=\"desc\"\n                    state=\"default\"\n                    [ngModel]=\"direction\"\n                    (ngModelChange)=\"_groupOrderChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.groupDialogGroupOrderDesc' | fdTranslate }}</span>\n            </li>\n        </ul>\n\n        <ul fd-list [selection]=\"true\">\n            <li fd-list-group-header>\n                <span fd-list-title>{{ 'platformTable.groupDialogGroupByHeader' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item [selected]=\"NOT_GROUPED_OPTION_VALUE === field\">\n                <fd-radio-button\n                    name=\"sort-by\"\n                    [value]=\"NOT_GROUPED_OPTION_VALUE\"\n                    state=\"default\"\n                    [ngModel]=\"field\"\n                    (ngModelChange)=\"_groupFieldChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.groupDialogNotGroupedLabel' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item *ngFor=\"let column of columns\" [selected]=\"column.key === field\">\n                <fd-radio-button\n                    name=\"sort-by\"\n                    [value]=\"column.key\"\n                    state=\"default\"\n                    [ngModel]=\"field\"\n                    (ngModelChange)=\"_groupFieldChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ column.label }}</span>\n            </li>\n        </ul>\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n        <fd-button-bar\n            fdType=\"emphasized\"\n            [label]=\"'platformTable.groupDialogConfirmBtnLabel' | fdTranslate\"\n            (click)=\"confirm()\"\n        >\n        </fd-button-bar>\n        <fd-button-bar\n            [label]=\"'platformTable.groupDialogCancelBtnLabel' | fdTranslate\"\n            fdkInitialFocus\n            (click)=\"cancel()\"\n        >\n        </fd-button-bar>\n    </fd-dialog-footer>\n</fd-dialog>\n" }]
@@ -2182,7 +2182,7 @@ class SortingComponent {
     }
 }
 SortingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SortingComponent, deps: [{ token: i1$2.DialogRef }, { token: i1.Table }], target: i0.ɵɵFactoryTarget.Component });
-SortingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SortingComponent, selector: "ng-component", providers: [{ provide: RESETTABLE_TOKEN, useExisting: forwardRef(() => SortingComponent) }], ngImport: i0, template: "<fd-dialog>\n    <fd-dialog-header>\n        <ng-template fdkTemplate=\"header\">\n            <div fd-bar-left>\n                <fd-bar-element>\n                    <h4 fd-title [headerSize]=\"4\">{{ 'platformTable.sortDialogHeader' | fdTranslate }}</h4>\n                </fd-bar-element>\n            </div>\n            <div fd-bar-right>\n                <fd-bar-element>\n                    <fdp-table-reset-button></fdp-table-reset-button>\n                </fd-bar-element>\n            </div>\n        </ng-template>\n    </fd-dialog-header>\n\n    <fd-dialog-body>\n        <ul fd-list [selection]=\"true\">\n            <li fd-list-group-header>\n                <span fd-list-title>{{ 'platformTable.sortDialogSortOrderHeader' | fdTranslate }}</span>\n            </li>\n\n            <li fd-list-item [selected]=\"direction === SORT_DIRECTION.ASC\">\n                <fd-radio-button\n                    name=\"sort-order\"\n                    value=\"asc\"\n                    state=\"default\"\n                    [ngModel]=\"direction\"\n                    (ngModelChange)=\"_sortDirectionChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.sortDialogSortOrderAsc' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item [selected]=\"direction === SORT_DIRECTION.DESC\">\n                <fd-radio-button\n                    name=\"sort-order\"\n                    value=\"desc\"\n                    state=\"default\"\n                    [ngModel]=\"direction\"\n                    (ngModelChange)=\"_sortDirectionChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.sortDialogSortOrderDesc' | fdTranslate }}</span>\n            </li>\n        </ul>\n\n        <ul fd-list [selection]=\"true\">\n            <li fd-list-group-header>\n                <span fd-list-title>{{ 'platformTable.sortDialogSortByHeader' | fdTranslate }}</span>\n            </li>\n\n            <li fd-list-item *ngIf=\"allowDisablingSorting\" [selected]=\"field === NOT_SORTED_OPTION_VALUE\">\n                <fd-radio-button\n                    name=\"sort-by\"\n                    [value]=\"NOT_SORTED_OPTION_VALUE\"\n                    state=\"default\"\n                    [ngModel]=\"field\"\n                    (ngModelChange)=\"_sortFieldChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.sortDialogNotSortedLabel' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item *ngFor=\"let column of columns\" [selected]=\"column.key === field\">\n                <fd-radio-button\n                    name=\"sort-by\"\n                    [value]=\"column.key\"\n                    state=\"default\"\n                    [ngModel]=\"field\"\n                    (ngModelChange)=\"_sortFieldChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ column.label }}</span>\n            </li>\n        </ul>\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n        <fd-button-bar\n            fdType=\"emphasized\"\n            [label]=\"'platformTable.sortDialogConfirmBtnLabel' | fdTranslate\"\n            (click)=\"confirm()\"\n        >\n        </fd-button-bar>\n        <fd-button-bar\n            [label]=\"'platformTable.sortDialogCancelBtnLabel' | fdTranslate\"\n            fdkInitialFocus\n            (click)=\"cancel()\"\n        >\n        </fd-button-bar>\n    </fd-dialog-footer>\n</fd-dialog>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5$1.RadioButtonComponent, selector: "fd-radio-button", inputs: ["ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "title", "tabIndex", "state", "disabled", "selectedValue", "name", "id", "value", "required", "standalone"] }, { kind: "component", type: i6$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i6$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i6$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth", "isTitle"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i5.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i2.TemplateDirective, selector: "[fdkTemplate], [fdTemplate]", inputs: ["fdkTemplate"] }, { kind: "directive", type: i2.InitialFocusDirective, selector: "[fdkInitialFocus], [fdInitialFocus], [fd-initial-focus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "component", type: ResetButtonComponent, selector: "fdp-table-reset-button" }, { kind: "pipe", type: i11.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+SortingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SortingComponent, selector: "ng-component", providers: [{ provide: RESETTABLE_TOKEN, useExisting: forwardRef(() => SortingComponent) }], ngImport: i0, template: "<fd-dialog>\n    <fd-dialog-header>\n        <ng-template fdkTemplate=\"header\">\n            <div fd-bar-left>\n                <fd-bar-element>\n                    <h4 fd-title [headerSize]=\"4\">{{ 'platformTable.sortDialogHeader' | fdTranslate }}</h4>\n                </fd-bar-element>\n            </div>\n            <div fd-bar-right>\n                <fd-bar-element>\n                    <fdp-table-reset-button></fdp-table-reset-button>\n                </fd-bar-element>\n            </div>\n        </ng-template>\n    </fd-dialog-header>\n\n    <fd-dialog-body>\n        <ul fd-list [selection]=\"true\">\n            <li fd-list-group-header>\n                <span fd-list-title>{{ 'platformTable.sortDialogSortOrderHeader' | fdTranslate }}</span>\n            </li>\n\n            <li fd-list-item [selected]=\"direction === SORT_DIRECTION.ASC\">\n                <fd-radio-button\n                    name=\"sort-order\"\n                    value=\"asc\"\n                    state=\"default\"\n                    [ngModel]=\"direction\"\n                    (ngModelChange)=\"_sortDirectionChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.sortDialogSortOrderAsc' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item [selected]=\"direction === SORT_DIRECTION.DESC\">\n                <fd-radio-button\n                    name=\"sort-order\"\n                    value=\"desc\"\n                    state=\"default\"\n                    [ngModel]=\"direction\"\n                    (ngModelChange)=\"_sortDirectionChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.sortDialogSortOrderDesc' | fdTranslate }}</span>\n            </li>\n        </ul>\n\n        <ul fd-list [selection]=\"true\">\n            <li fd-list-group-header>\n                <span fd-list-title>{{ 'platformTable.sortDialogSortByHeader' | fdTranslate }}</span>\n            </li>\n\n            <li fd-list-item *ngIf=\"allowDisablingSorting\" [selected]=\"field === NOT_SORTED_OPTION_VALUE\">\n                <fd-radio-button\n                    name=\"sort-by\"\n                    [value]=\"NOT_SORTED_OPTION_VALUE\"\n                    state=\"default\"\n                    [ngModel]=\"field\"\n                    (ngModelChange)=\"_sortFieldChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.sortDialogNotSortedLabel' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item *ngFor=\"let column of columns\" [selected]=\"column.key === field\">\n                <fd-radio-button\n                    name=\"sort-by\"\n                    [value]=\"column.key\"\n                    state=\"default\"\n                    [ngModel]=\"field\"\n                    (ngModelChange)=\"_sortFieldChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ column.label }}</span>\n            </li>\n        </ul>\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n        <fd-button-bar\n            fdType=\"emphasized\"\n            [label]=\"'platformTable.sortDialogConfirmBtnLabel' | fdTranslate\"\n            (click)=\"confirm()\"\n        >\n        </fd-button-bar>\n        <fd-button-bar\n            [label]=\"'platformTable.sortDialogCancelBtnLabel' | fdTranslate\"\n            fdkInitialFocus\n            (click)=\"cancel()\"\n        >\n        </fd-button-bar>\n    </fd-dialog-footer>\n</fd-dialog>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5$1.RadioButtonComponent, selector: "fd-radio-button", inputs: ["ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "title", "tabIndex", "state", "disabled", "selectedValue", "name", "id", "value", "required", "standalone"] }, { kind: "component", type: i6$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i6$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText", "ariaRole"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i6$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth", "isTitle"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i5.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i2.TemplateDirective, selector: "[fdkTemplate], [fdTemplate]", inputs: ["fdkTemplate"] }, { kind: "directive", type: i2.InitialFocusDirective, selector: "[fdkInitialFocus], [fdInitialFocus], [fd-initial-focus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "component", type: ResetButtonComponent, selector: "fdp-table-reset-button" }, { kind: "pipe", type: i11.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SortingComponent, decorators: [{
             type: Component,
             args: [{ providers: [{ provide: RESETTABLE_TOKEN, useExisting: forwardRef(() => SortingComponent) }], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<fd-dialog>\n    <fd-dialog-header>\n        <ng-template fdkTemplate=\"header\">\n            <div fd-bar-left>\n                <fd-bar-element>\n                    <h4 fd-title [headerSize]=\"4\">{{ 'platformTable.sortDialogHeader' | fdTranslate }}</h4>\n                </fd-bar-element>\n            </div>\n            <div fd-bar-right>\n                <fd-bar-element>\n                    <fdp-table-reset-button></fdp-table-reset-button>\n                </fd-bar-element>\n            </div>\n        </ng-template>\n    </fd-dialog-header>\n\n    <fd-dialog-body>\n        <ul fd-list [selection]=\"true\">\n            <li fd-list-group-header>\n                <span fd-list-title>{{ 'platformTable.sortDialogSortOrderHeader' | fdTranslate }}</span>\n            </li>\n\n            <li fd-list-item [selected]=\"direction === SORT_DIRECTION.ASC\">\n                <fd-radio-button\n                    name=\"sort-order\"\n                    value=\"asc\"\n                    state=\"default\"\n                    [ngModel]=\"direction\"\n                    (ngModelChange)=\"_sortDirectionChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.sortDialogSortOrderAsc' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item [selected]=\"direction === SORT_DIRECTION.DESC\">\n                <fd-radio-button\n                    name=\"sort-order\"\n                    value=\"desc\"\n                    state=\"default\"\n                    [ngModel]=\"direction\"\n                    (ngModelChange)=\"_sortDirectionChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.sortDialogSortOrderDesc' | fdTranslate }}</span>\n            </li>\n        </ul>\n\n        <ul fd-list [selection]=\"true\">\n            <li fd-list-group-header>\n                <span fd-list-title>{{ 'platformTable.sortDialogSortByHeader' | fdTranslate }}</span>\n            </li>\n\n            <li fd-list-item *ngIf=\"allowDisablingSorting\" [selected]=\"field === NOT_SORTED_OPTION_VALUE\">\n                <fd-radio-button\n                    name=\"sort-by\"\n                    [value]=\"NOT_SORTED_OPTION_VALUE\"\n                    state=\"default\"\n                    [ngModel]=\"field\"\n                    (ngModelChange)=\"_sortFieldChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ 'platformTable.sortDialogNotSortedLabel' | fdTranslate }}</span>\n            </li>\n            <li fd-list-item *ngFor=\"let column of columns\" [selected]=\"column.key === field\">\n                <fd-radio-button\n                    name=\"sort-by\"\n                    [value]=\"column.key\"\n                    state=\"default\"\n                    [ngModel]=\"field\"\n                    (ngModelChange)=\"_sortFieldChange($event)\"\n                ></fd-radio-button>\n                <span fd-list-title>{{ column.label }}</span>\n            </li>\n        </ul>\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n        <fd-button-bar\n            fdType=\"emphasized\"\n            [label]=\"'platformTable.sortDialogConfirmBtnLabel' | fdTranslate\"\n            (click)=\"confirm()\"\n        >\n        </fd-button-bar>\n        <fd-button-bar\n            [label]=\"'platformTable.sortDialogCancelBtnLabel' | fdTranslate\"\n            fdkInitialFocus\n            (click)=\"cancel()\"\n        >\n        </fd-button-bar>\n    </fd-dialog-footer>\n</fd-dialog>\n" }]
@@ -3808,6 +3808,16 @@ class TableComponent extends Table {
         const tableEl = this.table.nativeElement;
         tableEl.rows[position.rowIndex].cells[position.colIndex].focus();
     }
+    /**
+     * Clears the array of table rows. Triggered when new data source is applied.
+     */
+    clearTableRows() {
+        this._tableRows = [];
+        this._tableRowsVisible = [];
+        this._tableRowsInViewPortPlaceholder = [];
+        this._newTableRows = [];
+        this._dataSourceTableRows = [];
+    }
     // Private API
     /** @hidden */
     _scrollToOverlappedCell() {
@@ -4010,14 +4020,6 @@ class TableComponent extends Table {
     }
     /** @hidden */
     _listenToTableRowsPipe() {
-        this._subscriptions.add(
-        /*
-         * Reset table when the data source is changed,
-         * because new data source can have different set of data
-         */
-        this._dataSourceDirective.dataSourceChanged.subscribe(() => {
-            this._setTableRows([]);
-        }));
         this._subscriptions.add(this._dataSourceDirective.items$
             .pipe(
         // map source items to table rows
@@ -4167,7 +4169,7 @@ class TableComponent extends Table {
             return convertTreeTableRowToFlatList(source, this.rowNavigatable);
         }
         if (isJsObject(item)) {
-            return convertTreeObjectsToTableRows(source, this.selectionMode, this._tableRows, this.rowComparator, this.relationKey, this.hasChildrenKey, this.selectedKey, this.expandedStateKey, this.rowNavigatable);
+            return convertTreeObjectsToTableRows(source, this.selectionMode, this._tableRows, this.rowComparator, this.relationKey, this.hasChildrenKey, this.selectedKey, this.expandedStateKey, this.rowNavigatable, this.enableTristateMode);
         }
         return [];
     }