@sustaina/shared-ui 1.6.1 → 1.6.2

package/dist/index.d.mts

@@ -203,11 +203,22 @@ type DataTableStatusContent = {
     emptyData?: ContentSlot;
     emptyFilteredData?: ContentSlot;
 };
+type ScrollInfo = {
+    scrollTop: number;
+    scrollHeight: number;
+    clientHeight: number;
+    scrollableHeight: number;
+    distanceToBottom: number;
+    ratioToBottom: number;
+    isTopReached: boolean;
+    isBottomReached: boolean;
+};
 type DataTableScrollFetch = {
     enabled: boolean;
     fetchMore?: () => void;
     hasMore?: boolean;
     isFetchingMore?: boolean;
+    scrollThreshold?: number | ((info: ScrollInfo) => boolean);
 };
 type DataTableProps<TData extends RowData$1> = {
     data: TData[];
@@ -505,4 +516,4 @@ type UseTruncatedOptions<T> = {
 type UseTruncatedResult = boolean;
 declare const useTruncated: <T extends HTMLElement = any>({ elementRef, onChange, resizeDetectDelay }: UseTruncatedOptions<T>) => UseTruncatedResult;
 
-export { AdvanceSearch, type Breakpoints, Button, type Column, type ContentSlot, DataTable, type DataTableChildrenKeyHandler, type DataTableColumnFilter, type DataTableColumnFilterProps, type DataTableColumnGrouping, type DataTableColumnOrdering, type DataTableColumnPinning, type DataTableColumnSorting, type DataTableColumnVisibility, type DataTableComponentProps, type DataTableFilterConfig, type DataTableFilters, type DataTableGlobalFilter, type DataTableHeaderCell, type DataTableProps, type DataTableRenderHeaderHandler, type DataTableRenderHeaderProps, type DataTableRenderRowHandler, type DataTableRenderRowProps, type DataTableRowCell, type DataTableRowClickHandler, type DataTableRowClickMode, type DataTableRowExpansion, type DataTableRowIdKeyHandler, type DataTableRowSelection, type DataTableScrollFetch, type DataTableStatusContent, type DatatableColumnResizing, DialogAlert, type DialogAlertProps, type DialogVariant, type FieldSchema, FormErrorMessage, type FormErrorMessageProps, FormField, FormFieldContext, type FormFieldContextValue, type FormFieldProps, FormItem, FormItemContext, type FormItemContextValue, type FormItemProps, FormLabel, type FormLabelProps, type GridPayload, GridSettingsModal, type GridSettingsModalProps, HeaderCell, type HeaderCellProps, _default as Navbar, type NavbarProps, NumberInput, type NumberInputProps, PreventPageLeave, type RowClickType, type SorterProps, TextInput, type TextInputProps, type UseFormFieldOptions, type UseFormFieldReturn, type UseHoverResult, type UseMediaQueryOptions, type UseMediaQueryResult, type UsePreventPageLeaveOptions, type UseScreenSizeResult, type UseTruncatedOptions, type UseTruncatedResult, booleanToSelectValue, buttonVariants, cn, compareAlphanumeric, debounce, getColumnIdFromTable, isDefined, isEmptyObject, renderContentSlot, selectValueToBoolean, stripNullishObject, useFormField, useGridSettingsStore, useHover, useIntersectionObserver, useMediaQuery, usePreventPageLeave, usePreventPageLeaveStore, useScreenSize, useTruncated };
+export { AdvanceSearch, type Breakpoints, Button, type Column, type ContentSlot, DataTable, type DataTableChildrenKeyHandler, type DataTableColumnFilter, type DataTableColumnFilterProps, type DataTableColumnGrouping, type DataTableColumnOrdering, type DataTableColumnPinning, type DataTableColumnSorting, type DataTableColumnVisibility, type DataTableComponentProps, type DataTableFilterConfig, type DataTableFilters, type DataTableGlobalFilter, type DataTableHeaderCell, type DataTableProps, type DataTableRenderHeaderHandler, type DataTableRenderHeaderProps, type DataTableRenderRowHandler, type DataTableRenderRowProps, type DataTableRowCell, type DataTableRowClickHandler, type DataTableRowClickMode, type DataTableRowExpansion, type DataTableRowIdKeyHandler, type DataTableRowSelection, type DataTableScrollFetch, type DataTableStatusContent, type DatatableColumnResizing, DialogAlert, type DialogAlertProps, type DialogVariant, type FieldSchema, FormErrorMessage, type FormErrorMessageProps, FormField, FormFieldContext, type FormFieldContextValue, type FormFieldProps, FormItem, FormItemContext, type FormItemContextValue, type FormItemProps, FormLabel, type FormLabelProps, type GridPayload, GridSettingsModal, type GridSettingsModalProps, HeaderCell, type HeaderCellProps, _default as Navbar, type NavbarProps, NumberInput, type NumberInputProps, PreventPageLeave, type RowClickType, type ScrollInfo, type SorterProps, TextInput, type TextInputProps, type UseFormFieldOptions, type UseFormFieldReturn, type UseHoverResult, type UseMediaQueryOptions, type UseMediaQueryResult, type UsePreventPageLeaveOptions, type UseScreenSizeResult, type UseTruncatedOptions, type UseTruncatedResult, booleanToSelectValue, buttonVariants, cn, compareAlphanumeric, debounce, getColumnIdFromTable, isDefined, isEmptyObject, renderContentSlot, selectValueToBoolean, stripNullishObject, useFormField, useGridSettingsStore, useHover, useIntersectionObserver, useMediaQuery, usePreventPageLeave, usePreventPageLeaveStore, useScreenSize, useTruncated };

package/dist/index.d.ts

@@ -203,11 +203,22 @@ type DataTableStatusContent = {
     emptyData?: ContentSlot;
     emptyFilteredData?: ContentSlot;
 };
+type ScrollInfo = {
+    scrollTop: number;
+    scrollHeight: number;
+    clientHeight: number;
+    scrollableHeight: number;
+    distanceToBottom: number;
+    ratioToBottom: number;
+    isTopReached: boolean;
+    isBottomReached: boolean;
+};
 type DataTableScrollFetch = {
     enabled: boolean;
     fetchMore?: () => void;
     hasMore?: boolean;
     isFetchingMore?: boolean;
+    scrollThreshold?: number | ((info: ScrollInfo) => boolean);
 };
 type DataTableProps<TData extends RowData$1> = {
     data: TData[];
@@ -505,4 +516,4 @@ type UseTruncatedOptions<T> = {
 type UseTruncatedResult = boolean;
 declare const useTruncated: <T extends HTMLElement = any>({ elementRef, onChange, resizeDetectDelay }: UseTruncatedOptions<T>) => UseTruncatedResult;
 
-export { AdvanceSearch, type Breakpoints, Button, type Column, type ContentSlot, DataTable, type DataTableChildrenKeyHandler, type DataTableColumnFilter, type DataTableColumnFilterProps, type DataTableColumnGrouping, type DataTableColumnOrdering, type DataTableColumnPinning, type DataTableColumnSorting, type DataTableColumnVisibility, type DataTableComponentProps, type DataTableFilterConfig, type DataTableFilters, type DataTableGlobalFilter, type DataTableHeaderCell, type DataTableProps, type DataTableRenderHeaderHandler, type DataTableRenderHeaderProps, type DataTableRenderRowHandler, type DataTableRenderRowProps, type DataTableRowCell, type DataTableRowClickHandler, type DataTableRowClickMode, type DataTableRowExpansion, type DataTableRowIdKeyHandler, type DataTableRowSelection, type DataTableScrollFetch, type DataTableStatusContent, type DatatableColumnResizing, DialogAlert, type DialogAlertProps, type DialogVariant, type FieldSchema, FormErrorMessage, type FormErrorMessageProps, FormField, FormFieldContext, type FormFieldContextValue, type FormFieldProps, FormItem, FormItemContext, type FormItemContextValue, type FormItemProps, FormLabel, type FormLabelProps, type GridPayload, GridSettingsModal, type GridSettingsModalProps, HeaderCell, type HeaderCellProps, _default as Navbar, type NavbarProps, NumberInput, type NumberInputProps, PreventPageLeave, type RowClickType, type SorterProps, TextInput, type TextInputProps, type UseFormFieldOptions, type UseFormFieldReturn, type UseHoverResult, type UseMediaQueryOptions, type UseMediaQueryResult, type UsePreventPageLeaveOptions, type UseScreenSizeResult, type UseTruncatedOptions, type UseTruncatedResult, booleanToSelectValue, buttonVariants, cn, compareAlphanumeric, debounce, getColumnIdFromTable, isDefined, isEmptyObject, renderContentSlot, selectValueToBoolean, stripNullishObject, useFormField, useGridSettingsStore, useHover, useIntersectionObserver, useMediaQuery, usePreventPageLeave, usePreventPageLeaveStore, useScreenSize, useTruncated };
+export { AdvanceSearch, type Breakpoints, Button, type Column, type ContentSlot, DataTable, type DataTableChildrenKeyHandler, type DataTableColumnFilter, type DataTableColumnFilterProps, type DataTableColumnGrouping, type DataTableColumnOrdering, type DataTableColumnPinning, type DataTableColumnSorting, type DataTableColumnVisibility, type DataTableComponentProps, type DataTableFilterConfig, type DataTableFilters, type DataTableGlobalFilter, type DataTableHeaderCell, type DataTableProps, type DataTableRenderHeaderHandler, type DataTableRenderHeaderProps, type DataTableRenderRowHandler, type DataTableRenderRowProps, type DataTableRowCell, type DataTableRowClickHandler, type DataTableRowClickMode, type DataTableRowExpansion, type DataTableRowIdKeyHandler, type DataTableRowSelection, type DataTableScrollFetch, type DataTableStatusContent, type DatatableColumnResizing, DialogAlert, type DialogAlertProps, type DialogVariant, type FieldSchema, FormErrorMessage, type FormErrorMessageProps, FormField, FormFieldContext, type FormFieldContextValue, type FormFieldProps, FormItem, FormItemContext, type FormItemContextValue, type FormItemProps, FormLabel, type FormLabelProps, type GridPayload, GridSettingsModal, type GridSettingsModalProps, HeaderCell, type HeaderCellProps, _default as Navbar, type NavbarProps, NumberInput, type NumberInputProps, PreventPageLeave, type RowClickType, type ScrollInfo, type SorterProps, TextInput, type TextInputProps, type UseFormFieldOptions, type UseFormFieldReturn, type UseHoverResult, type UseMediaQueryOptions, type UseMediaQueryResult, type UsePreventPageLeaveOptions, type UseScreenSizeResult, type UseTruncatedOptions, type UseTruncatedResult, booleanToSelectValue, buttonVariants, cn, compareAlphanumeric, debounce, getColumnIdFromTable, isDefined, isEmptyObject, renderContentSlot, selectValueToBoolean, stripNullishObject, useFormField, useGridSettingsStore, useHover, useIntersectionObserver, useMediaQuery, usePreventPageLeave, usePreventPageLeaveStore, useScreenSize, useTruncated };

package/dist/index.js

@@ -898,15 +898,33 @@ var DataTable = ({
   }, [centerVisibleLeafColumns, leftVisibleLeftColumns, rightVisibleLeafColumns]);
   const fetchMoreOnScrollReached = React4.useCallback(
     (containerRefElement) => {
-      if (!scrollFetch?.enabled) {
+      if (!scrollFetch?.enabled || !containerRefElement || scrollFetch?.isFetchingMore || !scrollFetch?.hasMore || !scrollFetch?.fetchMore) {
         return;
       }
-      if (containerRefElement) {
-        const { scrollHeight, scrollTop, clientHeight } = containerRefElement;
-        const threshold = 1.5;
-        if (scrollHeight - scrollTop - clientHeight < clientHeight * threshold && !scrollFetch?.isFetchingMore && scrollFetch?.hasMore && scrollFetch?.fetchMore) {
-          scrollFetch.fetchMore();
-        }
+      const { scrollHeight, scrollTop, clientHeight } = containerRefElement;
+      const scrollableHeight = scrollHeight - clientHeight;
+      const distanceToBottom = scrollHeight - clientHeight - scrollTop;
+      const ratioToBottom = scrollableHeight > 0 ? scrollTop / scrollableHeight : 1;
+      const info = {
+        scrollTop,
+        scrollHeight,
+        clientHeight,
+        scrollableHeight,
+        distanceToBottom,
+        ratioToBottom,
+        isTopReached: scrollTop === 0,
+        isBottomReached: distanceToBottom <= 0
+      };
+      let shouldTrigger = false;
+      if (typeof scrollFetch.scrollThreshold === "number") {
+        shouldTrigger = info.ratioToBottom >= scrollFetch.scrollThreshold;
+      } else if (typeof scrollFetch.scrollThreshold === "function") {
+        shouldTrigger = scrollFetch.scrollThreshold(info);
+      } else {
+        shouldTrigger = info.ratioToBottom >= 0.7;
+      }
+      if (shouldTrigger) {
+        scrollFetch.fetchMore();
       }
     },
     // eslint-disable-next-line react-hooks/exhaustive-deps