simple-table-core 1.2.2 → 1.2.4

package/dist/components/animate/Animate.d.ts

@@ -0,0 +1,13 @@
+import React, { ReactNode, MutableRefObject } from "react";
+import TableRow from "../../types/TableRow";
+interface AnimateProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "id"> {
+    children: ReactNode;
+    id: string;
+    parentRef?: MutableRefObject<HTMLDivElement | null>;
+    tableRow?: TableRow;
+}
+export declare const Animate: {
+    ({ children, id, parentRef, tableRow, ...props }: AnimateProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default Animate;

package/dist/components/animate/animation-utils.d.ts

@@ -0,0 +1,70 @@
+import { AnimationConfig, FlipAnimationOptions, CustomAnimationOptions } from "./types";
+/**
+ * Check if user prefers reduced motion
+ */
+export declare const prefersReducedMotion: () => boolean;
+/**
+ * Animation configs for different types of movements
+ */
+export declare const ANIMATION_CONFIGS: {
+    readonly COLUMN_REORDER: {
+        readonly duration: 180;
+        readonly easing: "cubic-bezier(0.2, 0.0, 0.2, 1)";
+        readonly delay: 0;
+    };
+    readonly ROW_REORDER: {
+        readonly duration: 10000;
+        readonly easing: "cubic-bezier(0.2, 0.0, 0.2, 1)";
+        readonly delay: 0;
+    };
+    readonly REDUCED_MOTION: {
+        readonly duration: 150;
+        readonly easing: "ease-out";
+        readonly delay: 0;
+    };
+};
+/**
+ * Create a custom animation config with smart defaults
+ */
+export declare const createAnimationConfig: (overrides?: Partial<AnimationConfig>) => AnimationConfig;
+/**
+ * Calculates the invert values for FLIP animation
+ */
+export declare const calculateInvert: (fromBounds: DOMRect | {
+    x: number;
+    y: number;
+}, toBounds: DOMRect) => {
+    x: number;
+    y: number;
+};
+/**
+ * Applies initial transform to element for FLIP animation
+ */
+export declare const applyInitialTransform: (element: HTMLElement, invert: {
+    x: number;
+    y: number;
+}) => void;
+/**
+ * Get appropriate animation config based on movement type and user preferences
+ */
+export declare const getAnimationConfig: (options?: FlipAnimationOptions, movementType?: "column" | "row") => AnimationConfig;
+/**
+ * Performs FLIP animation on a single element
+ * This function can be called multiple times on the same element - it will automatically
+ * interrupt any ongoing animation and start a new one.
+ */
+export declare const flipElement: ({ element, finalConfig, fromBounds, toBounds, }: {
+    element: HTMLElement;
+    finalConfig: FlipAnimationOptions;
+    fromBounds: DOMRect;
+    toBounds: DOMRect;
+}) => Promise<void>;
+/**
+ * Performs custom coordinate animation with absolute position control
+ * This allows you to animate an element from one Y coordinate to another,
+ * completely independent of the element's actual DOM position.
+ */
+export declare const animateWithCustomCoordinates: ({ element, options, }: {
+    element: HTMLElement;
+    options: CustomAnimationOptions;
+}) => Promise<void>;

package/dist/components/animate/types.d.ts

@@ -0,0 +1,26 @@
+export interface AnimationConfig {
+    duration: number;
+    easing: string;
+    delay?: number;
+}
+export interface FlipAnimationOptions {
+    duration?: number;
+    easing?: string;
+    delay?: number;
+    maxX?: number;
+    maxY?: number;
+    maxYLeavingRatio?: number;
+    maxYEnteringRatio?: number;
+    onComplete?: () => void;
+    respectReducedMotion?: boolean;
+}
+export interface CustomAnimationOptions {
+    startY: number;
+    endY: number;
+    finalY?: number;
+    duration?: number;
+    easing?: string;
+    delay?: number;
+    onComplete?: () => void;
+    respectReducedMotion?: boolean;
+}

package/dist/components/dropdown/Dropdown.d.ts

@@ -1,7 +1,7 @@
 import React, { ReactNode } from "react";
 export interface DropdownProps {
     children: ReactNode;
-    containerRef?: React.RefObject<HTMLElement>;
+    containerRef?: React.MutableRefObject<HTMLElement>;
     onClose: () => void;
     open?: boolean;
     overflow?: "auto" | "visible";

package/dist/components/filters/shared/FilterInput.d.ts

@@ -6,6 +6,7 @@ interface FilterInputProps {
     placeholder?: string;
     autoFocus?: boolean;
     className?: string;
+    onEnterPress?: () => void;
 }
 declare const FilterInput: React.FC<FilterInputProps>;
 export default FilterInput;

package/dist/components/scroll-sync/ScrollSyncPane.d.ts

@@ -1,6 +1,6 @@
-import { FC, ReactElement, RefObject } from "react";
+import { FC, ReactElement, MutableRefObject } from "react";
 interface ScrollSyncPaneProps {
-    childRef: RefObject<HTMLElement | null>;
+    childRef: MutableRefObject<HTMLElement | null>;
     children: ReactElement<any>;
 }
 export declare const ScrollSyncPane: FC<ScrollSyncPaneProps>;

package/dist/components/simple-table/RenderCells.d.ts

@@ -10,7 +10,7 @@ interface RenderCellsProps {
     pinned?: Pinned;
     rowIndex: number;
     rowIndices: RowIndices;
-    visibleRow: TableRowType;
+    tableRow: TableRowType;
 }
-declare const RenderCells: ({ columnIndexStart, columnIndices, headers, pinned, rowIndex, rowIndices, visibleRow, }: RenderCellsProps) => import("react/jsx-runtime").JSX.Element;
+declare const RenderCells: ({ columnIndexStart, columnIndices, headers, pinned, rowIndex, rowIndices, tableRow, }: RenderCellsProps) => import("react/jsx-runtime").JSX.Element;
 export default RenderCells;

package/dist/components/simple-table/SimpleTable.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode, RefObject } from "react";
+import { ReactNode, MutableRefObject } from "react";
 import HeaderObject from "../../types/HeaderObject";
 import CellChangeProps from "../../types/CellChangeProps";
 import Theme from "../../types/Theme";
@@ -8,7 +8,7 @@ import TableRefType from "../../types/TableRefType";
 import OnNextPage from "../../types/OnNextPage";
 import "../../styles/simple-table.css";
 import { TableFilterState } from "../../types/FilterTypes";
-import SortConfig from "../../types/SortConfig";
+import { SortColumn } from "../../types/SortConfig";
 interface SimpleTableProps {
     allowAnimations?: boolean;
     cellUpdateFlash?: boolean;
@@ -32,7 +32,7 @@ interface SimpleTableProps {
     onGridReady?: () => void;
     onLoadMore?: () => void;
     onNextPage?: OnNextPage;
-    onSortChange?: (sort: SortConfig | null) => void;
+    onSortChange?: (sort: SortColumn | null) => void;
     prevIcon?: ReactNode;
     rowGrouping?: string[];
     rowHeight?: number;
@@ -44,7 +44,7 @@ interface SimpleTableProps {
     shouldPaginate?: boolean;
     sortDownIcon?: ReactNode;
     sortUpIcon?: ReactNode;
-    tableRef?: RefObject<TableRefType | null>;
+    tableRef?: MutableRefObject<TableRefType | null>;
     theme?: Theme;
     useOddColumnBackground?: boolean;
     useHoverRowBackground?: boolean;

package/dist/components/simple-table/TableBody.d.ts

@@ -1,3 +1,3 @@
 import TableBodyProps from "../../types/TableBodyProps";
-declare const TableBody: ({ headerContainerRef, mainTemplateColumns, pinnedLeftColumns, pinnedLeftTemplateColumns, pinnedLeftWidth, pinnedRightColumns, pinnedRightTemplateColumns, pinnedRightWidth, setScrollTop, tableRows, visibleRows, }: TableBodyProps) => import("react/jsx-runtime").JSX.Element;
+declare const TableBody: ({ mainTemplateColumns, pinnedLeftColumns, pinnedLeftTemplateColumns, pinnedLeftWidth, pinnedRightColumns, pinnedRightTemplateColumns, pinnedRightWidth, rowsToRender, setScrollTop, tableRows, }: TableBodyProps) => import("react/jsx-runtime").JSX.Element;
 export default TableBody;

package/dist/components/simple-table/TableCell.d.ts

@@ -1,14 +1,3 @@
-/// <reference types="react" />
 import TableCellProps from "../../types/TableCellProps";
-interface CellProps {
-    borderClass: string;
-    colIndex: number;
-    header: TableCellProps["header"];
-    isHighlighted: boolean;
-    isInitialFocused: boolean;
-    nestedIndex: number;
-    rowIndex: number;
-    visibleRow: TableCellProps["visibleRow"];
-}
-declare const TableCell: import("react").ForwardRefExoticComponent<CellProps & import("react").RefAttributes<HTMLDivElement>>;
+declare const TableCell: ({ borderClass, colIndex, header, isHighlighted, isInitialFocused, nestedIndex, rowIndex, tableRow, }: TableCellProps) => import("react/jsx-runtime").JSX.Element;
 export default TableCell;

package/dist/components/simple-table/TableContent.d.ts

@@ -1,13 +1,13 @@
 import { Dispatch, SetStateAction } from "react";
-import SortConfig from "../../types/SortConfig";
+import { SortColumn } from "../../types/SortConfig";
 import TableRow from "../../types/TableRow";
 interface TableContentLocalProps {
     pinnedLeftWidth: number;
     pinnedRightWidth: number;
     setScrollTop: Dispatch<SetStateAction<number>>;
-    sort: SortConfig | null;
+    sort: SortColumn | null;
     tableRows: TableRow[];
-    visibleRows: TableRow[];
+    rowsToRender: TableRow[];
 }
-declare const TableContent: ({ pinnedLeftWidth, pinnedRightWidth, setScrollTop, sort, tableRows, visibleRows, }: TableContentLocalProps) => import("react/jsx-runtime").JSX.Element;
+declare const TableContent: ({ pinnedLeftWidth, pinnedRightWidth, setScrollTop, sort, tableRows, rowsToRender, }: TableContentLocalProps) => import("react/jsx-runtime").JSX.Element;
 export default TableContent;

package/dist/components/simple-table/TableHeader.d.ts

@@ -1,3 +1,3 @@
 import TableHeaderProps from "../../types/TableHeaderProps";
-declare const TableHeader: ({ centerHeaderRef, headerContainerRef, headers, mainTemplateColumns, pinnedLeftColumns, pinnedLeftTemplateColumns, pinnedRightColumns, pinnedRightTemplateColumns, sort, pinnedLeftWidth, pinnedRightWidth, }: TableHeaderProps) => import("react/jsx-runtime").JSX.Element;
+declare const TableHeader: ({ centerHeaderRef, headers, mainTemplateColumns, pinnedLeftColumns, pinnedLeftTemplateColumns, pinnedRightColumns, pinnedRightTemplateColumns, sort, pinnedLeftWidth, pinnedRightWidth, }: TableHeaderProps) => import("react/jsx-runtime").JSX.Element;
 export default TableHeader;

package/dist/components/simple-table/TableHeaderCell.d.ts

@@ -1,6 +1,5 @@
-/// <reference types="react" />
 import HeaderObject from "../../types/HeaderObject";
-import SortConfig from "../../types/SortConfig";
+import { SortColumn } from "../../types/SortConfig";
 interface HeaderCellProps {
     colIndex: number;
     gridColumnEnd: number;
@@ -9,7 +8,7 @@ interface HeaderCellProps {
     gridRowStart: number;
     header: HeaderObject;
     reverse?: boolean;
-    sort: SortConfig | null;
+    sort: SortColumn | null;
 }
-declare const TableHeaderCell: import("react").ForwardRefExoticComponent<HeaderCellProps & import("react").RefAttributes<HTMLDivElement>>;
+declare const TableHeaderCell: ({ colIndex, gridColumnEnd, gridColumnStart, gridRowEnd, gridRowStart, header, reverse, sort, }: HeaderCellProps) => import("react/jsx-runtime").JSX.Element | null;
 export default TableHeaderCell;

package/dist/components/simple-table/TableHorizontalScrollbar.d.ts

@@ -1,9 +1,9 @@
 import { RefObject } from "react";
 declare const TableHorizontalScrollbar: ({ mainBodyWidth, mainBodyRef, pinnedLeftWidth, pinnedRightWidth, tableBodyContainerRef, }: {
-    mainBodyRef: RefObject<HTMLDivElement | null>;
+    mainBodyRef: RefObject<HTMLDivElement>;
     mainBodyWidth: number;
     pinnedLeftWidth: number;
     pinnedRightWidth: number;
-    tableBodyContainerRef: RefObject<HTMLDivElement | null>;
+    tableBodyContainerRef: RefObject<HTMLDivElement>;
 }) => import("react/jsx-runtime").JSX.Element | null;
 export default TableHorizontalScrollbar;

package/dist/components/simple-table/TableRow.d.ts

@@ -14,7 +14,7 @@ interface TableRowProps {
     rowHeight: number;
     rowIndices: RowIndices;
     setHoveredIndex: (index: number | null) => void;
-    visibleRow: TableRowType;
+    tableRow: TableRowType;
 }
-declare const TableRow: ({ columnIndices, columnIndexStart, gridTemplateColumns, headers, hoveredIndex, index, pinned, rowHeight, rowIndices, setHoveredIndex, visibleRow, }: TableRowProps) => import("react/jsx-runtime").JSX.Element;
+declare const TableRow: ({ columnIndices, columnIndexStart, gridTemplateColumns, headers, hoveredIndex, index, pinned, rowHeight, rowIndices, setHoveredIndex, tableRow, }: TableRowProps) => import("react/jsx-runtime").JSX.Element;
 export default TableRow;

package/dist/components/simple-table/TableSection.d.ts

@@ -1,4 +1,4 @@
-import { RefObject } from "react";
+/// <reference types="react" />
 import TableRowType from "../../types/TableRow";
 import { Pinned } from "../../types/Pinned";
 import HeaderObject from "../../types/HeaderObject";
@@ -10,14 +10,13 @@ interface TableSectionProps {
     headers: HeaderObject[];
     hoveredIndex: number | null;
     pinned?: Pinned;
-    ref?: RefObject<HTMLDivElement | null>;
     rowHeight: number;
     rowIndices: RowIndices;
+    rowsToRender: TableRowType[];
     setHoveredIndex: (index: number | null) => void;
     templateColumns: string;
     totalHeight: number;
-    visibleRows: TableRowType[];
     width?: number;
 }
-declare const TableSection: ({ columnIndexStart, columnIndices, headers, hoveredIndex, pinned, ref, rowHeight, rowIndices, setHoveredIndex, templateColumns, totalHeight, visibleRows, width, }: TableSectionProps) => import("react/jsx-runtime").JSX.Element | null;
+declare const TableSection: import("react").ForwardRefExoticComponent<TableSectionProps & import("react").RefAttributes<HTMLDivElement>>;
 export default TableSection;

package/dist/context/TableContext.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode, RefObject, Dispatch, SetStateAction } from "react";
+import { ReactNode, RefObject, MutableRefObject, Dispatch, SetStateAction } from "react";
 import { TableFilterState, FilterCondition } from "../types/FilterTypes";
 import TableRow from "../types/TableRow";
 import Cell from "../types/Cell";
@@ -15,10 +15,9 @@ interface TableContextType {
     cellUpdateFlash?: boolean;
     columnReordering: boolean;
     columnResizing: boolean;
-    draggedHeaderRef: RefObject<HeaderObject | null>;
+    draggedHeaderRef: MutableRefObject<HeaderObject | null>;
     editColumns?: boolean;
     expandIcon?: ReactNode;
-    unexpandedRows: Set<string>;
     filters: TableFilterState;
     forceUpdate: () => void;
     getBorderClass: (cell: Cell) => string;
@@ -27,21 +26,25 @@ interface TableContextType {
     handleClearFilter: (accessor: string) => void;
     handleMouseDown: (cell: Cell) => void;
     handleMouseOver: (cell: Cell) => void;
+    headerContainerRef: RefObject<HTMLDivElement>;
     headers: HeaderObject[];
-    hoveredHeaderRef: RefObject<HeaderObject | null>;
+    hoveredHeaderRef: MutableRefObject<HeaderObject | null>;
+    isAnimating: boolean;
     isCopyFlashing: (cell: Cell) => boolean;
     isInitialFocusedCell: (cell: Cell) => boolean;
+    isResizing: boolean;
+    isScrolling: boolean;
     isSelected: (cell: Cell) => boolean;
     isWarningFlashing: (cell: Cell) => boolean;
-    mainBodyRef: RefObject<HTMLDivElement | null>;
+    mainBodyRef: RefObject<HTMLDivElement>;
     nextIcon: ReactNode;
     onCellEdit?: (props: any) => void;
     onColumnOrderChange?: (newHeaders: HeaderObject[]) => void;
     onLoadMore?: () => void;
     onSort: OnSortProps;
     onTableHeaderDragEnd: (newHeaders: HeaderObject[]) => void;
-    pinnedLeftRef: RefObject<HTMLDivElement | null>;
-    pinnedRightRef: RefObject<HTMLDivElement | null>;
+    pinnedLeftRef: RefObject<HTMLDivElement>;
+    pinnedRightRef: RefObject<HTMLDivElement>;
     prevIcon: ReactNode;
     rowGrouping?: string[];
     rowHeight: number;
@@ -49,17 +52,20 @@ interface TableContextType {
     scrollbarWidth: number;
     selectColumns?: (columnIndices: number[], isShiftKey?: boolean) => void;
     selectableColumns: boolean;
-    setUnexpandedRows: Dispatch<SetStateAction<Set<string>>>;
     setHeaders: Dispatch<SetStateAction<HeaderObject[]>>;
     setInitialFocusedCell: Dispatch<SetStateAction<Cell | null>>;
+    setIsResizing: Dispatch<SetStateAction<boolean>>;
+    setIsScrolling: Dispatch<SetStateAction<boolean>>;
     setSelectedCells: Dispatch<SetStateAction<Set<string>>>;
     setSelectedColumns: Dispatch<SetStateAction<Set<number>>>;
+    setUnexpandedRows: Dispatch<SetStateAction<Set<string>>>;
     shouldPaginate: boolean;
     sortDownIcon: ReactNode;
     sortUpIcon: ReactNode;
-    tableBodyContainerRef: RefObject<HTMLDivElement | null>;
+    tableBodyContainerRef: RefObject<HTMLDivElement>;
     tableRows: TableRow[];
     theme: Theme;
+    unexpandedRows: Set<string>;
     useHoverRowBackground: boolean;
     useOddColumnBackground: boolean;
     useOddEvenRowBackground: boolean;

package/dist/hooks/useExternalFilters.d.ts

@@ -0,0 +1,6 @@
+import { TableFilterState } from "../types/FilterTypes";
+declare const useExternalFilters: ({ filters, onFilterChange, }: {
+    filters: TableFilterState;
+    onFilterChange?: ((filters: TableFilterState) => void) | undefined;
+}) => void;
+export default useExternalFilters;

package/dist/hooks/useExternalSort.d.ts

@@ -0,0 +1,6 @@
+import { SortColumn } from "../types/SortConfig";
+declare const useExternalSort: ({ sort, onSortChange, }: {
+    sort: SortColumn | null;
+    onSortChange?: ((sort: SortColumn | null) => void) | undefined;
+}) => void;
+export default useExternalSort;

package/dist/hooks/useFilterableData.d.ts

@@ -0,0 +1,17 @@
+import { TableFilterState, FilterCondition } from "../types/FilterTypes";
+import Row from "../types/Row";
+interface UseFilterableDataProps {
+    rows: Row[];
+    externalFilterHandling: boolean;
+    onFilterChange?: (filters: TableFilterState) => void;
+}
+interface UseFilterableDataReturn {
+    filteredRows: Row[];
+    updateFilter: (filter: FilterCondition) => void;
+    clearFilter: (accessor: string) => void;
+    clearAllFilters: () => void;
+    filters: TableFilterState;
+    computeFilteredRowsPreview: (filter: FilterCondition) => Row[];
+}
+declare const useFilterableData: ({ rows, externalFilterHandling, onFilterChange, }: UseFilterableDataProps) => UseFilterableDataReturn;
+export default useFilterableData;

package/dist/hooks/useOnGridReady.d.ts

@@ -0,0 +1,4 @@
+declare const useOnGridReady: ({ onGridReady }: {
+    onGridReady?: (() => void) | undefined;
+}) => void;
+export default useOnGridReady;

package/dist/hooks/useScrollbarWidth.d.ts

@@ -0,0 +1,9 @@
+import { RefObject } from "react";
+declare const useScrollbarWidth: ({ tableBodyContainerRef, }: {
+    tableBodyContainerRef: RefObject<HTMLDivElement>;
+}) => {
+    setScrollbarWidth: import("react").Dispatch<import("react").SetStateAction<number>>;
+    scrollbarWidth: number;
+    tableBodyContainerRef: RefObject<HTMLDivElement>;
+};
+export default useScrollbarWidth;

package/dist/hooks/useSortableData.d.ts

@@ -1,17 +1,16 @@
-/// <reference types="react" />
 import HeaderObject from "../types/HeaderObject";
 import Row from "../types/Row";
-import SortConfig from "../types/SortConfig";
+import { SortColumn } from "../types/SortConfig";
 declare const useSortableData: ({ headers, tableRows, externalSortHandling, onSortChange, rowGrouping, }: {
     headers: HeaderObject[];
     tableRows: Row[];
     externalSortHandling: boolean;
-    onSortChange?: ((sort: SortConfig | null) => void) | undefined;
+    onSortChange?: ((sort: SortColumn | null) => void) | undefined;
     rowGrouping?: string[] | undefined;
 }) => {
-    setSort: import("react").Dispatch<import("react").SetStateAction<SortConfig | null>>;
-    sort: SortConfig | null;
+    sort: SortColumn | null;
     sortedRows: Row[];
-    updateSort: (columnIndex: number, accessor: string) => void;
+    updateSort: (accessor: string) => void;
+    computeSortedRowsPreview: (accessor: string) => Row[];
 };
 export default useSortableData;

package/dist/hooks/useTableAPI.d.ts

@@ -0,0 +1,10 @@
+import { MutableRefObject } from "react";
+import { Row, TableRefType } from "..";
+import { CellRegistryEntry } from "../context/TableContext";
+declare const useTableAPI: ({ tableRef, rows, rowIdAccessor, cellRegistryRef, }: {
+    tableRef?: MutableRefObject<TableRefType | null> | undefined;
+    rows: Row[];
+    rowIdAccessor: string;
+    cellRegistryRef: MutableRefObject<Map<string, CellRegistryEntry>>;
+}) => void;
+export default useTableAPI;

package/dist/hooks/useTableRowProcessing.d.ts

@@ -0,0 +1,27 @@
+import Row from "../types/Row";
+interface UseTableRowProcessingProps {
+    allowAnimations: boolean;
+    sortedRows: Row[];
+    originalRows: Row[];
+    currentPage: number;
+    rowsPerPage: number;
+    shouldPaginate: boolean;
+    rowGrouping?: string[];
+    rowIdAccessor: string;
+    unexpandedRows: Set<string>;
+    expandAll: boolean;
+    contentHeight: number;
+    rowHeight: number;
+    scrollTop: number;
+    computeFilteredRowsPreview: (filter: any) => Row[];
+    computeSortedRowsPreview: (accessor: string) => Row[];
+}
+declare const useTableRowProcessing: ({ allowAnimations, sortedRows, originalRows, currentPage, rowsPerPage, shouldPaginate, rowGrouping, rowIdAccessor, unexpandedRows, expandAll, contentHeight, rowHeight, scrollTop, computeFilteredRowsPreview, computeSortedRowsPreview, }: UseTableRowProcessingProps) => {
+    currentTableRows: import("../types/TableRow").default[];
+    currentVisibleRows: import("../types/TableRow").default[];
+    isAnimating: boolean;
+    prepareForFilterChange: (filter: any) => void;
+    prepareForSortChange: (accessor: string) => void;
+    rowsToRender: any[];
+};
+export default useTableRowProcessing;

package/dist/hooks/useWindowResize.d.ts

@@ -1,7 +1,7 @@
 import { RefObject } from "react";
 declare const useWindowResize: ({ forceUpdate, tableBodyContainerRef, setScrollbarWidth, }: {
     forceUpdate: () => void;
-    tableBodyContainerRef: RefObject<HTMLDivElement | null>;
+    tableBodyContainerRef: RefObject<HTMLDivElement>;
     setScrollbarWidth: (width: number) => void;
 }) => void;
 export default useWindowResize;