@fundamental-ngx/platform 0.43.33 → 0.43.35

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

@@ -3,7 +3,7 @@ import { InjectionToken, Injectable, EventEmitter, inject, Directive, Input, Out
 import * as i2 from '@fundamental-ngx/cdk/utils';
 import { DestroyedService, isString, dfs, RtlService, KeyUtil, resizeObservable, FDK_FOCUSABLE_ITEM_DIRECTIVE, FocusableItemDirective } from '@fundamental-ngx/cdk/utils';
 import { isDataSource, DataSourceDirective, FD_DATA_SOURCE_TRANSFORMER } from '@fundamental-ngx/cdk/data-source';
-import { Subject, BehaviorSubject, isObservable, Subscription, filter as filter$1, fromEvent, Observable } from 'rxjs';
+import { Subject, BehaviorSubject, isObservable, Subscription, filter as filter$1, fromEvent, Observable, take as take$1, takeUntil as takeUntil$1 } from 'rxjs';
 import { map, takeUntil, take, skip, startWith, filter, debounceTime, distinctUntilChanged, share, tap } from 'rxjs/operators';
 import { ContentDensityMode } from '@fundamental-ngx/core/content-density';
 import { isSelectItem, isDataSource as isDataSource$1, isString as isString$1, isFunction } from '@fundamental-ngx/platform/shared';
@@ -2014,6 +2014,18 @@ class TableInitialState {
 class TableVirtualScroll {
 }
 
+class TableCellActivateEvent {
+    /**
+     * Table cell activate event
+     * @param columnIndex Index of the clicked column
+     * @param row Row that was activated
+     */
+    constructor(columnIndex, row) {
+        this.columnIndex = columnIndex;
+        this.row = row;
+    }
+}
+
 /* eslint-disable @typescript-eslint/member-ordering */
 class TableDraggableDirective extends TableDraggable {
     constructor() {
@@ -2835,6 +2847,10 @@ class TableRowService {
         /** @hidden */
         this._cellFocusedSubject = new Subject();
         /** @hidden */
+        this._cellActivateSubject = new Subject();
+        /** Stream that emits when the table cell being focused. */
+        this.cellActivate$ = this._cellActivateSubject.asObservable();
+        /** @hidden */
         this._toggleAllSelectableRowsSubject = new Subject();
         /** Stream that emits when toggling all selectable rows is needed. */
         this.toggleAllSelectableRows$ = this._toggleAllSelectableRowsSubject.asObservable();
@@ -2865,6 +2881,10 @@ class TableRowService {
     cellClicked(evt) {
         this._cellClickedSubject.next(evt);
     }
+    /** @hidden */
+    cellActivate(columnIndex, row) {
+        this._cellActivateSubject.next({ columnIndex, row: row.value });
+    }
     /** `cellFocused$` stream trigger. */
     cellFocused(evt) {
         this._cellFocusedSubject.next(evt);
@@ -3570,6 +3590,134 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
             args: [{ selector: '[fdpViewSettingsFilterCustomDef]', standalone: true }]
         }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } });
 
+class ViewportRootService {
+    constructor() {
+        /** hidden */
+        this.rootNode = null;
+        /** hidden */
+        this.rootElement$ = new Subject();
+    }
+    /** hidden */
+    setRootNode(node) {
+        this.rootNode = node;
+        this.rootElement$.next(this.rootNode);
+    }
+    /** hidden */
+    getRootNode() {
+        return this.rootNode;
+    }
+}
+ViewportRootService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ViewportRootService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+ViewportRootService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ViewportRootService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ViewportRootService, decorators: [{
+            type: Injectable
+        }] });
+
+class FdpRenderVisibleCellDirective {
+    /** @hidden */
+    constructor(el, renderer, viewContainer, cdr) {
+        this.el = el;
+        this.renderer = renderer;
+        this.viewContainer = viewContainer;
+        this.cdr = cdr;
+        /** @hidden */
+        this._destroy$ = new Subject();
+        /** @hidden */
+        this._viewportRootService = inject(ViewportRootService);
+    }
+    /** @hidden */
+    ngOnInit() {
+        if (!this._viewportRootService.getRootNode()) {
+            this._viewportRootService.rootElement$.pipe(take$1(1)).subscribe((rootNode) => {
+                if (rootNode) {
+                    this.checkViewport();
+                }
+            });
+        }
+        else {
+            this.checkViewport();
+        }
+    }
+    /** @hidden */
+    checkViewport() {
+        const options = {
+            root: this._viewportRootService.getRootNode(),
+            rootMargin: '50px',
+            threshold: 0.0
+        };
+        const observer = new Observable((subscriber) => {
+            const intersectionObserver = new IntersectionObserver((entries) => {
+                const { isIntersecting } = entries[0];
+                subscriber.next(isIntersecting);
+            }, options);
+            intersectionObserver.observe(this.el.nativeElement.parentElement);
+            this._destroy$.subscribe(() => {
+                intersectionObserver.disconnect();
+            });
+            return {
+                unsubscribe() {
+                    intersectionObserver.disconnect();
+                }
+            };
+        });
+        observer.pipe(takeUntil$1(this._destroy$)).subscribe((inViewPort) => {
+            this.updateView(inViewPort);
+        });
+    }
+    /** @hidden */
+    ngOnDestroy() {
+        this._destroy$.next();
+        this._destroy$.complete();
+    }
+    /** @hidden */
+    updateView(inViewPort) {
+        if (this.viewContainer.length === 0) {
+            if (inViewPort) {
+                this.viewContainer.createEmbeddedView(this.tableViewport);
+                this.currentTemplate = this.tableViewport;
+            }
+            else {
+                this.viewContainer.createEmbeddedView(this.viewportFallback);
+                this.currentTemplate = this.viewportFallback;
+            }
+        }
+        else {
+            if (inViewPort && this.currentTemplate !== this.tableViewport) {
+                if (this.currentViewRef) {
+                    this.viewContainer.remove(0);
+                    this.viewContainer.insert(this.currentViewRef);
+                }
+                else {
+                    this.viewContainer.clear();
+                    this.viewContainer.createEmbeddedView(this.tableViewport);
+                }
+                this.currentTemplate = this.tableViewport;
+            }
+            else if (!inViewPort && this.currentTemplate !== this.viewportFallback) {
+                this.currentViewRef = this.viewContainer.detach(0);
+                this.viewContainer.clear();
+                this.viewContainer.createEmbeddedView(this.viewportFallback);
+                this.currentTemplate = this.viewportFallback;
+            }
+        }
+        this.cdr.markForCheck(); // Mark parent component for change detection
+    }
+}
+FdpRenderVisibleCellDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FdpRenderVisibleCellDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ViewContainerRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
+FdpRenderVisibleCellDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: FdpRenderVisibleCellDirective, isStandalone: true, selector: "[fdpOnlyRenderVisibleCell]", inputs: { tableViewport: "tableViewport", viewportFallback: "viewportFallback" }, providers: [DestroyedService], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FdpRenderVisibleCellDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[fdpOnlyRenderVisibleCell]',
+                    standalone: true,
+                    providers: [DestroyedService]
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ViewContainerRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { tableViewport: [{
+                type: Input
+            }], viewportFallback: [{
+                type: Input
+            }] } });
+
 class TableCellStylesPipe {
     /** @hidden */
     transform(column, isRtl, semanticHighlightingColumnWidth, selectionColumnWidth, isFrozenColumn, isFrozenEndColumn, prevColumnWidthPx, columnWidth, nextColumnWidthPx) {
@@ -3730,7 +3878,8 @@ const importExports = [
     TableCellStylesPipe,
     ColumnResizableSidePipe,
     RowClassesPipe,
-    TableColumnSortingDirectionPipe
+    TableColumnSortingDirectionPipe,
+    FdpRenderVisibleCellDirective
 ];
 class TableHelpersModule {
 }
@@ -3758,7 +3907,8 @@ TableHelpersModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", vers
         TableCellStylesPipe,
         ColumnResizableSidePipe,
         RowClassesPipe,
-        TableColumnSortingDirectionPipe], exports: [TableInitialStateDirective,
+        TableColumnSortingDirectionPipe,
+        FdpRenderVisibleCellDirective], exports: [TableInitialStateDirective,
         TableDraggableDirective,
         TableVirtualScrollDirective,
         PlatformTableColumnResponsiveDirective,
@@ -3781,7 +3931,8 @@ TableHelpersModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", vers
         TableCellStylesPipe,
         ColumnResizableSidePipe,
         RowClassesPipe,
-        TableColumnSortingDirectionPipe] });
+        TableColumnSortingDirectionPipe,
+        FdpRenderVisibleCellDirective] });
 TableHelpersModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TableHelpersModule });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TableHelpersModule, decorators: [{
             type: NgModule,
@@ -3795,5 +3946,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ARIA_SORT, ArrayTableDataProvider, ArrayTableDataSource, BaseTableDataProvider, BaseTableDataSource, ChildTableDataSource, ColumnAlign, ColumnResizableSidePipe, ColumnsChange, DEFAULT_HIGHLIGHTING_KEY, DEFAULT_TABLE_PAGE, DEFAULT_TABLE_SEARCH_INPUT, DEFAULT_TABLE_STATE, EDITABLE_ROW_SEMANTIC_STATE, EditableTableCell, FDP_TABLE_DRAGGABLE_DIRECTIVE, FDP_TABLE_STATE_DIRECTIVE, FDP_TABLE_VIRTUAL_SCROLL_DIRECTIVE, FILTER_BOOLEAN_STRATEGIES, FILTER_BOOLEAN_STRATEGY, FILTER_DATE_STRATEGIES, FILTER_DATE_STRATEGY, FILTER_DEFAULT_STRATEGIES, FILTER_DEFAULT_STRATEGY, FILTER_NUMBER_STRATEGIES, FILTER_NUMBER_STRATEGY, FILTER_STRATEGY, FILTER_STRING_STRATEGIES, FILTER_STRING_STRATEGY, FdpCellDef, FdpEditableCellDef, FdpEditableCellFormDirective, FdpHeaderCellDef, FdpTableCell, FdpTableHeader, FdpViewSettingsFilterCustomDef, FilterType, FilterableColumnDataType, ObservableTableDataProvider, ObservableTableDataSource, PageChange, PlatformTableCellResizableDirective, PlatformTableColumnResponsiveDirective, ROW_HEIGHT, RowClassesPipe, SELECTION_COLUMN_WIDTH, SEMANTIC_HIGHLIGHTING_COLUMN_WIDTH, SaveRowsEvent, SelectionCellStylesPipe, SelectionMode, SortDirection, TABLE_CELL_RESIZABLE_THRESHOLD_PX, TABLE_COLUMN_MIN_WIDTH, TABLE_RESIZER_BORDER_WIDTH, TABLE_SCROLLABLE, Table, TableCellHeaderPopoverDirective, TableCellStylesPipe, TableChildrenDataProvider, TableColumn, TableColumnFreezeEvent, TableColumnResizeService, TableColumnSortingDirectionPipe, TableColumnsChangeEvent, TableDataProvider, TableDataSource, TableDataSourceDirective, TableDataSourceParser, TableDraggable, TableDraggableDirective, TableFilterChangeEvent, TableGroupChangeEvent, TableHeaderResizerDirective, TableHelpersModule, TableInitialState, TableInitialStateDirective, TablePageChangeEvent, TableResponsiveService, TableRowActivateEvent, TableRowImpl, TableRowSelectionChangeEvent, TableRowService, TableRowToggleOpenStateEvent, TableRowType, TableRowsRearrangeEvent, TableScrollDispatcherService, TableScrollableDirective, TableSearchChangeEvent, TableSelectionChangeEvent, TableService, TableSortChangeEvent, TableVirtualScroll, TableVirtualScrollDirective, applySelectionToChildren, buildNewRowSkeleton, convertObjectsToTableRows, convertTreeLikeToFlatList, convertTreeObjectsToTableRows, convertTreeTableRowToFlatList, createGroupedTableRowsTree, filterByBoolean, filterByDate, filterByNumber, filterByString, findRowChildren, getFilterStrategiesBasedOnDataType, getFreezableColumns, getFreezableEndColumns, getRowParents, getScrollBarWidth, getSelectableRows, getSelectionStatusByRowValue, getUniqueListValuesByKey, isCollectionFilter, isGroupRow, isItemRow, isRowNavigatable, isSelectableRow, isTableRow, isTreeRow, isTreeRowFirstCell, newTableRow, sortTreeLikeGroupedRows, toDataStream };
+export { ARIA_SORT, ArrayTableDataProvider, ArrayTableDataSource, BaseTableDataProvider, BaseTableDataSource, ChildTableDataSource, ColumnAlign, ColumnResizableSidePipe, ColumnsChange, DEFAULT_HIGHLIGHTING_KEY, DEFAULT_TABLE_PAGE, DEFAULT_TABLE_SEARCH_INPUT, DEFAULT_TABLE_STATE, EDITABLE_ROW_SEMANTIC_STATE, EditableTableCell, FDP_TABLE_DRAGGABLE_DIRECTIVE, FDP_TABLE_STATE_DIRECTIVE, FDP_TABLE_VIRTUAL_SCROLL_DIRECTIVE, FILTER_BOOLEAN_STRATEGIES, FILTER_BOOLEAN_STRATEGY, FILTER_DATE_STRATEGIES, FILTER_DATE_STRATEGY, FILTER_DEFAULT_STRATEGIES, FILTER_DEFAULT_STRATEGY, FILTER_NUMBER_STRATEGIES, FILTER_NUMBER_STRATEGY, FILTER_STRATEGY, FILTER_STRING_STRATEGIES, FILTER_STRING_STRATEGY, FdpCellDef, FdpEditableCellDef, FdpEditableCellFormDirective, FdpHeaderCellDef, FdpRenderVisibleCellDirective, FdpTableCell, FdpTableHeader, FdpViewSettingsFilterCustomDef, FilterType, FilterableColumnDataType, ObservableTableDataProvider, ObservableTableDataSource, PageChange, PlatformTableCellResizableDirective, PlatformTableColumnResponsiveDirective, ROW_HEIGHT, RowClassesPipe, SELECTION_COLUMN_WIDTH, SEMANTIC_HIGHLIGHTING_COLUMN_WIDTH, SaveRowsEvent, SelectionCellStylesPipe, SelectionMode, SortDirection, TABLE_CELL_RESIZABLE_THRESHOLD_PX, TABLE_COLUMN_MIN_WIDTH, TABLE_RESIZER_BORDER_WIDTH, TABLE_SCROLLABLE, Table, TableCellActivateEvent, TableCellHeaderPopoverDirective, TableCellStylesPipe, TableChildrenDataProvider, TableColumn, TableColumnFreezeEvent, TableColumnResizeService, TableColumnSortingDirectionPipe, TableColumnsChangeEvent, TableDataProvider, TableDataSource, TableDataSourceDirective, TableDataSourceParser, TableDraggable, TableDraggableDirective, TableFilterChangeEvent, TableGroupChangeEvent, TableHeaderResizerDirective, TableHelpersModule, TableInitialState, TableInitialStateDirective, TablePageChangeEvent, TableResponsiveService, TableRowActivateEvent, TableRowImpl, TableRowSelectionChangeEvent, TableRowService, TableRowToggleOpenStateEvent, TableRowType, TableRowsRearrangeEvent, TableScrollDispatcherService, TableScrollableDirective, TableSearchChangeEvent, TableSelectionChangeEvent, TableService, TableSortChangeEvent, TableVirtualScroll, TableVirtualScrollDirective, ViewportRootService, applySelectionToChildren, buildNewRowSkeleton, convertObjectsToTableRows, convertTreeLikeToFlatList, convertTreeObjectsToTableRows, convertTreeTableRowToFlatList, createGroupedTableRowsTree, filterByBoolean, filterByDate, filterByNumber, filterByString, findRowChildren, getFilterStrategiesBasedOnDataType, getFreezableColumns, getFreezableEndColumns, getRowParents, getScrollBarWidth, getSelectableRows, getSelectionStatusByRowValue, getUniqueListValuesByKey, isCollectionFilter, isGroupRow, isItemRow, isRowNavigatable, isSelectableRow, isTableRow, isTreeRow, isTreeRowFirstCell, newTableRow, sortTreeLikeGroupedRows, toDataStream };
 //# sourceMappingURL=fundamental-ngx-platform-table-helpers.mjs.map