@one-paragon/angular-utilities 2.0.4 → 2.0.5

package/action-state/ngrx.d.ts

@@ -26,6 +26,6 @@ export interface State extends EntityState<ActionStatus> {
 }
 export declare const initialState: StatusState;
 export declare const getStatusState: import("@ngrx/store").MemoizedSelector<object, State, import("@ngrx/store").DefaultProjectorFn<State>>;
-export declare const selectIds: import("@ngrx/store").MemoizedSelector<object, string[] | number[], (entityState: EntityState<ActionStatus>) => string[] | number[]>, selectEntities: import("@ngrx/store").MemoizedSelector<object, import("@ngrx/entity").Dictionary<ActionStatus>, (entityState: EntityState<ActionStatus>) => import("@ngrx/entity").Dictionary<ActionStatus>>, selectAll: import("@ngrx/store").MemoizedSelector<object, ActionStatus[], (entityState: EntityState<ActionStatus>) => ActionStatus[]>, selectTotal: import("@ngrx/store").MemoizedSelector<object, number, (entityState: EntityState<ActionStatus>) => number>;
+export declare const selectIds: import("@ngrx/store").MemoizedSelector<object, number[] | string[], (entityState: EntityState<ActionStatus>) => string[] | number[]>, selectEntities: import("@ngrx/store").MemoizedSelector<object, import("@ngrx/entity").Dictionary<ActionStatus>, (entityState: EntityState<ActionStatus>) => import("@ngrx/entity").Dictionary<ActionStatus>>, selectAll: import("@ngrx/store").MemoizedSelector<object, ActionStatus[], (entityState: EntityState<ActionStatus>) => ActionStatus[]>, selectTotal: import("@ngrx/store").MemoizedSelector<object, number, (entityState: EntityState<ActionStatus>) => number>;
 export declare const selectEntity: (id: string) => import("@ngrx/store").MemoizedSelector<object, any, (s1: import("@ngrx/entity").Dictionary<ActionStatus>) => any>;
 export declare function actionStatusReducer(state: StatusState | undefined, action: Action): StatusState;

package/fesm2022/one-paragon-angular-utilities.mjs

@@ -887,6 +887,10 @@ class VirtualScrollOptions {
      * If `maxViewPortHeight` is set that will be the max table size
      */
     dynamicHeight = false;
+    /**
+     * If `dynamicHeight` is set to true, we will try to add this amount of space from the bottom of view port
+     */
+    dynamicalHeightBuffer = 0;
 }
 class PaginatorOptions {
     pageSize = undefined;
@@ -5264,22 +5268,28 @@ class VirtualScrollContainer {
         const virtualScrollOptions = this.$virtualScrollOptions();
         const t = this.tableContainer.elementRef.nativeElement.querySelector(`#${TableContainerComponent.headerId}`);
         const rect = t?.getBoundingClientRect();
-        const viewportHeight = window.innerHeight;
-        const distanceFromBottom = viewportHeight - rect.bottom;
+        const windowHeight = window.innerHeight;
+        const distanceFromBottom = windowHeight - rect.bottom;
         const rowHeight = this.computedRowHeight();
         const footerHeight = this.computedFooterHeight();
         const headerHeight = this.computedHeaderHeight();
+        const buffer = this.computedBuffer();
+        const horizontalScrollPadding = el.nativeElement.scrollWidth > el.nativeElement.clientWidth ? 17 : 0;
         const maxViewPortHeightPx = parseTbSizeToPixels(virtualScrollOptions.maxViewPortHeight) || 0;
         let tableSize = distanceFromBottom;
         if (virtualScrollOptions?.maxViewPortHeight && maxViewPortHeightPx < tableSize) {
             tableSize = maxViewPortHeightPx;
         }
-        const available = (distanceFromBottom - footerHeight) - headerHeight - (this.$usePaginator() ? 20 : 0);
+        const available = (distanceFromBottom - footerHeight)
+            - headerHeight
+            - (this.$usePaginator() ? 20 : 0)
+            - buffer
+            - horizontalScrollPadding;
         const amountOfRowsThatWillFit = Math.floor(available / rowHeight);
         const minAmountOfRows = virtualScrollOptions?.amountOfVisibleItems || this.defaultOptions.amountOfVisibleItems;
         const amountOfVisibleItems = Math.min(Math.max(amountOfRowsThatWillFit, minAmountOfRows), this.$dataLength());
         let height = (rowHeight * amountOfVisibleItems);
-        height += (footerHeight + headerHeight);
+        height += (footerHeight + headerHeight + horizontalScrollPadding);
         this.setHeight(height, el);
     }
     setHeight(height, el) {
@@ -5309,6 +5319,12 @@ class VirtualScrollContainer {
     computedFooterHeight = computed(() => {
         return parseFloat(this.genericTable()?.$footerHeight()?.replace('px', '') || '0');
     });
+    computedBuffer = computed(() => {
+        const virtualScrollOptions = this.state.$tableSettings().virtualSettings;
+        if (!virtualScrollOptions.dynamicalHeightBuffer)
+            return 0;
+        return parseTbSizeToPixels(virtualScrollOptions.dynamicalHeightBuffer) || 0;
+    });
     scrollStrategy = new TableVirtualScrollStrategy(this);
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: VirtualScrollContainer, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.0.0", type: VirtualScrollContainer, isStandalone: true, selector: "tb-virtual-scroll-container", queries: [{ propertyName: "genericTable", first: true, predicate: GenericTableComponent, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true, isSignal: true }], ngImport: i0, template: `