simple-table-core 3.0.13 → 3.2.1

package/dist/cjs/src/core/SimpleTableVanilla.d.ts

@@ -35,6 +35,7 @@ export declare class SimpleTableVanilla {
     private cellRegistry;
     private headerRegistry;
     private rowIndexMap;
+    private animationCoordinator;
     private autoScaleManager;
     private dimensionManager;
     private scrollManager;
@@ -54,7 +55,31 @@ export declare class SimpleTableVanilla {
     private lastScrollTop;
     private isUpdating;
     constructor(container: HTMLElement, config: SimpleTableConfig);
+    private applyAnimationsConfig;
     private rebuildRowIndexMap;
+    private getBodyContainers;
+    private getHeaderContainers;
+    /**
+     * All cell-bearing containers — body sections AND header sections — that the
+     * animation coordinator needs to inspect. Headers participate in FLIP for
+     * column reorder so their cells slide to their new slot rather than
+     * teleporting.
+     */
+    private getAnimatableContainers;
+    /**
+     * Capture pre-change cell positions for the FLIP animation, including
+     * conceptual positions for cells outside the virtualization viewport so
+     * incoming cells can animate from off-screen on column reorder/sort. The
+     * `play` step that runs at the end of the next render consumes this
+     * snapshot to inverse-transform cells from their old visual positions and
+     * tween them to their new ones.
+     *
+     * Called on every layout-affecting state change — including the chain of
+     * mid-drag `setHeaders` calls that fire on each `dragover` swap — so that
+     * displaced columns slide smoothly out of the dragged column's way rather
+     * than snapping into place.
+     */
+    private captureAnimationSnapshot;
     private initializeManagers;
     mount(): void;
     private setupManagers;

package/dist/cjs/src/core/rendering/RenderOrchestrator.d.ts

@@ -10,10 +10,12 @@ import { SortManager } from "../../managers/SortManager";
 import { FilterManager } from "../../managers/FilterManager";
 import { SelectionManager } from "../../managers/SelectionManager";
 import { RowSelectionManager } from "../../managers/RowSelectionManager";
+import type { AnimationCoordinator, CellPosition } from "../../managers/AnimationCoordinator";
 import { FlattenRowsResult } from "../../utils/rowFlattening";
 import { ProcessRowsResult } from "../../utils/rowProcessing";
 import { MergedColumnEditorConfig, ResolvedIcons } from "../initialization/TableInitializer";
 export interface RenderContext {
+    animationCoordinator?: AnimationCoordinator;
     cellRegistry: Map<string, any>;
     collapsedHeaders: Set<Accessor>;
     collapsedRows: Map<string, number>;
@@ -102,6 +104,8 @@ export declare class RenderOrchestrator {
     constructor();
     getCachedFlattenResult(): FlattenRowsResult | null;
     getLastProcessedResult(): ProcessRowsResult | null;
+    /** See {@link TableRenderer.getCurrentBodyLayouts}. */
+    getCurrentBodyLayouts(): Map<HTMLElement, Map<string, CellPosition>>;
     invalidateCache(type?: "body" | "header" | "context" | "all"): void;
     computeEffectiveHeaders(headers: HeaderObject[], config: SimpleTableConfig, customTheme: CustomTheme, containerWidth?: number): HeaderObject[];
     /**

package/dist/cjs/src/core/rendering/SectionRenderer.d.ts

@@ -2,6 +2,7 @@ import HeaderObject, { Accessor } from "../../types/HeaderObject";
 import { HeaderRenderContext } from "../../utils/headerCellRenderer";
 import { CellRenderContext } from "../../utils/bodyCellRenderer";
 import TableRow from "../../types/TableRow";
+import type { AnimationCoordinator, CellPosition } from "../../managers/AnimationCoordinator";
 export interface HeaderSectionParams {
     headers: HeaderObject[];
     collapsedHeaders: Set<Accessor>;
@@ -29,6 +30,9 @@ export interface BodySectionParams {
     fullTableRows?: TableRow[];
     renderedStartIndex?: number;
     renderedEndIndex?: number;
+    /** When provided, body cell renderer hands outgoing cells to the coordinator
+     * for FLIP-style out-animation instead of removing them immediately. */
+    animationCoordinator?: AnimationCoordinator;
 }
 export declare class SectionRenderer {
     private headerSections;
@@ -36,6 +40,7 @@ export declare class SectionRenderer {
     private bodyCellsCache;
     private headerCellsCache;
     private contextCache;
+    private bodySectionSnapshots;
     private nextColIndexMap;
     private stateRowsMap;
     private nestedGridRowsMap;
@@ -57,5 +62,35 @@ export declare class SectionRenderer {
      * Get the next colIndex after rendering a section
      */
     getNextColIndex(sectionKey: string): number;
+    /**
+     * Build a per-section layout map covering every cell in the dataset (every
+     * row × every leaf header), not just the cells in the current virtualization
+     * band. Used by the animation coordinator: it needs positions for off-screen
+     * rows so that:
+     *
+     *   - Cells that newly enter the visible band (e.g. row sorted from bottom
+     *     to top) can FLIP in from their actual pre-change off-screen `top`.
+     *   - Cells that leave the visible band (e.g. row sorted from top to
+     *     bottom) can be retained and slid to their actual post-change
+     *     off-screen `top` before being removed.
+     *
+     * The body container clips overflow so cells whose interpolated position
+     * falls outside the viewport simply aren't painted — the animation looks
+     * like a slide in from / out to the viewport edge.
+     */
+    getCurrentBodyLayouts(): Map<HTMLElement, Map<string, CellPosition>>;
+    /**
+     * Compute every cell position the section currently knows about (every row
+     * × every leaf header), including positions for off-screen rows, by using
+     * the most recent snapshot config for `sectionKey`. Returns null if no
+     * snapshot has been captured for this section yet.
+     */
+    getFullSectionLayout(sectionKey: string): Map<string, CellPosition> | null;
+    /**
+     * Refresh the per-section snapshot config so getCurrentBodyLayouts can
+     * recompute positions for any row × column combination the section
+     * currently knows about.
+     */
+    private captureSnapshotConfig;
     cleanup(): void;
 }

package/dist/cjs/src/core/rendering/TableRenderer.d.ts

@@ -7,7 +7,9 @@ import { SortManager } from "../../managers/SortManager";
 import { FilterManager } from "../../managers/FilterManager";
 import { SelectionManager } from "../../managers/SelectionManager";
 import { RowSelectionManager } from "../../managers/RowSelectionManager";
+import type { AnimationCoordinator, CellPosition } from "../../managers/AnimationCoordinator";
 export interface TableRendererDeps {
+    animationCoordinator?: AnimationCoordinator;
     cellRegistry: Map<string, any>;
     collapsedHeaders: Set<Accessor>;
     collapsedRows: Map<string, number>;
@@ -81,6 +83,8 @@ export declare class TableRenderer {
     constructor();
     private scheduleRender;
     invalidateCache(type?: "body" | "header" | "context" | "all"): void;
+    /** See {@link SectionRenderer.getCurrentBodyLayouts}. */
+    getCurrentBodyLayouts(): Map<HTMLElement, Map<string, CellPosition>>;
     renderHeader(container: HTMLElement, calculatedHeaderHeight: number, maxHeaderDepth: number, deps: TableRendererDeps): void;
     renderBody(container: HTMLElement, processedResult: any, deps: TableRendererDeps): void;
     renderFooter(container: HTMLElement, totalRows: number, currentPage: number, onPageChange: (page: number) => void, deps: TableRendererDeps): void;

package/dist/cjs/src/index.d.ts

@@ -42,8 +42,9 @@ import type { IconsConfig } from "./types/IconsConfig";
 import type { GetRowId, GetRowIdParams } from "./types/GetRowId";
 import type { SimpleTableConfig } from "./types/SimpleTableConfig";
 import type { SimpleTableProps } from "./types/SimpleTableProps";
+import type { AnimationsConfig } from "./types/AnimationsConfig";
 import type { RowId } from "./types/RowId";
 import type { PinnedSectionsState } from "./types/PinnedSectionsState";
 export { SimpleTableVanilla };
 export { asRows } from "./utils/asRows";
-export type { Accessor, AggregationConfig, AggregationType, BoundingBox, Cell, CellChangeProps, CellClickProps, CellRenderer, CellRendererProps, CellValue, ChartOptions, ColumnEditorConfig, ColumnEditorCustomRenderer, ColumnEditorCustomRendererProps, ColumnEditorRowRenderer, ColumnEditorRowRendererComponents, ColumnEditorRowRendererProps, ColumnEditorSearchFunction, ColumnType, ColumnVisibilityState, Comparator, ComparatorProps, CustomTheme, CustomThemeProps, DragHandlerProps, EmptyStateRenderer, EmptyStateRendererProps, EnumOption, ErrorStateRenderer, ErrorStateRendererProps, ExportToCSVProps, ExportValueGetter, ExportValueProps, FilterCondition, FooterRendererProps, GetRowId, GetRowIdParams, IconsConfig, LoadingStateRenderer, LoadingStateRendererProps, HeaderDropdown, HeaderDropdownProps, HeaderObject, HeaderRenderer, HeaderRendererProps, HeaderRendererComponents, OnRowGroupExpandProps, OnSortProps, QuickFilterConfig, QuickFilterGetter, QuickFilterGetterProps, QuickFilterMode, Row, RowButtonProps, RowId, RowSelectionChangeProps, RowState, SetHeaderRenameProps, SharedTableProps, ShowWhen, SimpleTableConfig, SimpleTableProps, SortColumn, TableAPI, TableFilterState, TableHeaderProps, TableRowProps, Theme, PinnedSectionsState, UpdateDataProps, ValueFormatter, ValueFormatterProps, ValueGetter, ValueGetterProps, };
+export type { Accessor, AggregationConfig, AggregationType, AnimationsConfig, BoundingBox, Cell, CellChangeProps, CellClickProps, CellRenderer, CellRendererProps, CellValue, ChartOptions, ColumnEditorConfig, ColumnEditorCustomRenderer, ColumnEditorCustomRendererProps, ColumnEditorRowRenderer, ColumnEditorRowRendererComponents, ColumnEditorRowRendererProps, ColumnEditorSearchFunction, ColumnType, ColumnVisibilityState, Comparator, ComparatorProps, CustomTheme, CustomThemeProps, DragHandlerProps, EmptyStateRenderer, EmptyStateRendererProps, EnumOption, ErrorStateRenderer, ErrorStateRendererProps, ExportToCSVProps, ExportValueGetter, ExportValueProps, FilterCondition, FooterRendererProps, GetRowId, GetRowIdParams, IconsConfig, LoadingStateRenderer, LoadingStateRendererProps, HeaderDropdown, HeaderDropdownProps, HeaderObject, HeaderRenderer, HeaderRendererProps, HeaderRendererComponents, OnRowGroupExpandProps, OnSortProps, QuickFilterConfig, QuickFilterGetter, QuickFilterGetterProps, QuickFilterMode, Row, RowButtonProps, RowId, RowSelectionChangeProps, RowState, SetHeaderRenameProps, SharedTableProps, ShowWhen, SimpleTableConfig, SimpleTableProps, SortColumn, TableAPI, TableFilterState, TableHeaderProps, TableRowProps, Theme, PinnedSectionsState, UpdateDataProps, ValueFormatter, ValueFormatterProps, ValueGetter, ValueGetterProps, };

package/dist/cjs/src/managers/AnimationCoordinator.d.ts

@@ -0,0 +1,142 @@
+export interface AnimationCoordinatorOptions {
+    duration?: number;
+    easing?: string;
+}
+export interface CellPosition {
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+}
+/**
+ * FLIP-style animation coordinator for body cells with virtualization awareness.
+ *
+ * Triggered explicitly via {@link captureSnapshot} (before a layout-affecting
+ * change) and {@link play} (after the renderer has placed cells at their new
+ * positions).
+ *
+ * Three classes of cells participate in an animation:
+ *   - Persistent cells (visible before AND after): the same DOM node moves to
+ *     a new `top`/`left`; FLIP slides it from the old visual spot.
+ *   - Incoming cells (off-screen before, in DOM after): the renderer creates
+ *     them at their new position; if the snapshot has their pre-change
+ *     position (computed for ALL rows, not just the band), FLIP slides them
+ *     in from there. The portion that's outside the body's overflow clip is
+ *     never painted, so cells appear to slide in from the viewport edge.
+ *   - Outgoing cells (in DOM before, off-screen after): the renderer hands
+ *     them to {@link retainCell} along with their post-change off-screen
+ *     position; FLIP slides them out to that position, then removes them.
+ */
+export declare class AnimationCoordinator {
+    private enabled;
+    private duration;
+    private easing;
+    /** Pre-change positions for any cell we want to consider for animation. */
+    private snapshot;
+    private inFlight;
+    /** Outgoing cells the renderer handed off; keyed per container so play() finds them. */
+    private retainedCells;
+    private prefersReducedMotion;
+    /**
+     * Per-render cache of scroller layout metrics. Reading
+     * `scrollHeight`/`clientHeight`/etc. after a style mutation forces a sync
+     * layout flush; without this cache, scaleFlipDistance() forces a fresh
+     * flush for every cell in the retain/play loops, turning a single sort
+     * into hundreds of layout passes (observed: 513ms in `msRemove` for ~287
+     * cells, growing across consecutive sorts as DOM size grows). The cache
+     * is cleared at the boundaries of a render cycle (captureSnapshot start
+     * and play end / cancel) since column count and section heights are
+     * stable within a single sort.
+     */
+    private scrollerMetricsCache;
+    constructor(opts?: AnimationCoordinatorOptions);
+    setEnabled(enabled: boolean): void;
+    setDuration(duration: number): void;
+    setEasing(easing: string): void;
+    isEnabled(): boolean;
+    isInFlight(cellId: string): boolean;
+    /**
+     * Read scroller layout metrics for `container`, caching the result for the
+     * remainder of the current render cycle. Subsequent calls in the same
+     * cycle (e.g. for every cell in a retain or play loop) skip the DOM read,
+     * which would otherwise force a synchronous layout flush after each style
+     * mutation in the loop.
+     */
+    private getScrollerMetrics;
+    private clearScrollerMetricsCache;
+    /**
+     * Capture pre-change positions for cells we may want to animate.
+     *
+     * @param args.containers Body containers; rendered cells are read from the DOM.
+     * @param args.preLayouts Optional per-container conceptual layout. Should
+     *   include positions for ALL rows in the dataset (not just the visible
+     *   band) so cells that newly enter the band can FLIP in from their actual
+     *   pre-change location and cells that leave the band can FLIP out to it.
+     */
+    captureSnapshot(args: {
+        containers: Array<HTMLElement | null | undefined>;
+        preLayouts?: Map<HTMLElement, Map<string, CellPosition>>;
+    }): void;
+    /**
+     * The renderer asks before removing a cell whether the coordinator wants to
+     * keep it for an out-animation.
+     */
+    shouldRetain(cellId: string): boolean;
+    /**
+     * Hand a cell that the renderer would otherwise remove to the coordinator.
+     * The coordinator updates its absolute positioning to the post-change layout
+     * and will animate it from the snapshotted pre-change visual position to
+     * that new position during {@link play}, then remove it from the DOM.
+     *
+     * The new position can be off-screen (e.g. the row sorted to a position
+     * outside the visible band) — the body container's `overflow: hidden`
+     * naturally clips the cell as it slides past the viewport edge.
+     */
+    retainCell(args: {
+        cellId: string;
+        element: HTMLElement;
+        container: HTMLElement;
+        newPosition: CellPosition;
+    }): void;
+    /**
+     * Take ownership of a retained (outgoing) ghost element so the renderer can
+     * promote it back to a live cell — rather than tearing it down and creating
+     * a fresh node — when its row becomes visible again. Returns the element
+     * with its retained-only attributes/state stripped, or `null` if no ghost
+     * is currently retained for this id in the container.
+     *
+     * Reusing the ghost preserves DOM continuity: the next play() step reads
+     * the cell's mid-flight visual position from the snapshot (captured before
+     * the render) and FLIPs it from there to its new live destination, so the
+     * row glides instead of disappearing and a freshly created replacement
+     * doesn't pop into existence at a clipped FLIP entry point.
+     */
+    claimRetainedForReuse(cellId: string, container: HTMLElement): HTMLElement | null;
+    /**
+     * Discard any retained cell with this id in the given container. Called by
+     * the renderer when it's about to create a fresh cell with the same id, so
+     * we don't have two DOM nodes claiming the same logical slot.
+     */
+    discardRetainedIfPresent(cellId: string, container: HTMLElement): void;
+    /**
+     * Apply the FLIP invert + play step to every cell present in the snapshot
+     * that is now in the DOM (either as an actively rendered cell or as a
+     * retained cell). Clears the snapshot.
+     */
+    play(args: {
+        containers: Array<HTMLElement | null | undefined>;
+    }): void;
+    /**
+     * Cancel every in-flight transition and clear any armed snapshot. Active
+     * cells snap to their final positions; retained cells are removed from the
+     * DOM so we don't leak nodes.
+     */
+    cancel(): void;
+    destroy(): void;
+    private readPosition;
+    private startTransition;
+    private cancelInFlight;
+    private finalizeCell;
+    private finishElement;
+    private isCellRetained;
+}

package/dist/cjs/src/types/AnimationsConfig.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Configuration for cell animations on sort and programmatic column reorder.
+ *
+ * The animation coordinator runs FLIP-style transitions when cells move between
+ * positions. All fields are optional; omit the prop entirely to use defaults.
+ */
+export interface AnimationsConfig {
+    /** Master toggle. Defaults to `true`. When `false`, no other field has effect. */
+    enabled?: boolean;
+    /** Animation duration in milliseconds. Defaults to `240`. */
+    duration?: number;
+    /** CSS easing function. Defaults to `cubic-bezier(0.2, 0.8, 0.2, 1)`. */
+    easing?: string;
+}

package/dist/cjs/src/types/SimpleTableConfig.d.ts

@@ -18,7 +18,9 @@ import { GetRowId } from "./GetRowId";
 import { ColumnEditorConfig } from "./ColumnEditorConfig";
 import { VanillaIconsConfig } from "./IconsConfig";
 import { QuickFilterConfig } from "./QuickFilterTypes";
+import { AnimationsConfig } from "./AnimationsConfig";
 export interface SimpleTableConfig {
+    animations?: AnimationsConfig;
     autoExpandColumns?: boolean;
     canExpandRowGroup?: (row: Row) => boolean;
     cellUpdateFlash?: boolean;

package/dist/cjs/src/types/SimpleTableProps.d.ts

@@ -18,7 +18,9 @@ import { GetRowId } from "./GetRowId";
 import { ColumnEditorConfig } from "./ColumnEditorConfig";
 import { IconsConfig } from "./IconsConfig";
 import { QuickFilterConfig } from "./QuickFilterTypes";
+import { AnimationsConfig } from "./AnimationsConfig";
 export interface SimpleTableProps {
+    animations?: AnimationsConfig;
     autoExpandColumns?: boolean;
     canExpandRowGroup?: (row: Row) => boolean;
     cellUpdateFlash?: boolean;

package/dist/cjs/src/types/TableRow.d.ts

@@ -9,6 +9,15 @@ type TableRow = {
     position: number;
     row: Row;
     rowId: (string | number)[];
+    /**
+     * Position-independent identity for the row, used as the basis for the
+     * cell DOM `id` and the animation coordinator's snapshot key. When
+     * `getRowId` is provided, this is `String(customId)` (optionally prefixed
+     * by grouping keys for nested rows). Lets the same DOM cell survive a
+     * sort, so FLIP can animate the row to its new position. Falls back to
+     * the positional rowId string when `getRowId` is absent.
+     */
+    stableRowKey?: string;
     rowPath?: (string | number)[];
     rowIndexPath?: number[];
     stateIndicator?: {

package/dist/cjs/src/utils/bodyCell/types.d.ts

@@ -17,6 +17,12 @@ export interface AbsoluteBodyCell {
     rowIndex: number;
     colIndex: number;
     rowId: string;
+    /**
+     * Position-independent stable key (mirror of `tableRow.stableRowKey`),
+     * used to compute the cell DOM `id` and the animation snapshot key when
+     * `getRowId` is provided. Falls back to `rowId` (positional) when absent.
+     */
+    stableRowKey?: string;
     displayRowNumber: number;
     depth: number;
     isOdd: boolean;

package/dist/cjs/src/utils/bodyCellRenderer.d.ts

@@ -1,5 +1,6 @@
 import { AbsoluteBodyCell, CellRenderContext } from "./bodyCell/types";
 import type TableRow from "../types/TableRow";
+import type { AnimationCoordinator, CellPosition } from "../managers/AnimationCoordinator";
 export type { AbsoluteBodyCell, CellData, CellEditParams, CellClickParams, CellRegistryEntry, CellRenderContext, } from "./bodyCell/types";
 export { cleanupBodyCellRendering } from "./bodyCell/eventTracking";
-export declare const renderBodyCells: (container: HTMLElement, cells: AbsoluteBodyCell[], context: CellRenderContext, scrollLeft?: number, allRows?: TableRow[], positionOnly?: boolean) => void;
+export declare const renderBodyCells: (container: HTMLElement, cells: AbsoluteBodyCell[], context: CellRenderContext, scrollLeft?: number, allRows?: TableRow[], positionOnly?: boolean, animationCoordinator?: AnimationCoordinator, fullCellLayout?: Map<string, CellPosition>) => void;

package/dist/cjs/src/utils/headerCell/styling.d.ts

@@ -2,4 +2,6 @@ import { AbsoluteCell, HeaderRenderContext } from "./types";
 export declare const calculateHeaderCellClasses: (cell: AbsoluteCell, context: HeaderRenderContext, isLastMainAutoExpandColumn: boolean) => string;
 export declare const createHeaderCellElement: (cell: AbsoluteCell, context: HeaderRenderContext, isLastMainAutoExpandColumn: boolean) => HTMLElement;
 export declare const getLastHeaderIndex: (absoluteCells: AbsoluteCell[]) => number;
+/** Replace sort/filter/collapse icons on an existing header cell, preserving label/drag handlers. */
+export declare const refreshHeaderCellIcons: (cellElement: HTMLElement, header: AbsoluteCell["header"], context: HeaderRenderContext) => void;
 export declare const updateHeaderCellElement: (cellElement: HTMLElement, cell: AbsoluteCell, context: HeaderRenderContext, isLastMainAutoExpandColumn: boolean) => void;

package/dist/cjs/src/utils/rowUtils.d.ts

@@ -92,6 +92,31 @@ export declare const generateRowId: (params: GenerateRowIdParams) => (string | n
  * @returns A string representation of the row ID
  */
 export declare const rowIdToString: (rowId: (string | number)[]) => string;
+/**
+ * Generate a position-independent stable row key.
+ *
+ * Unlike `generateRowId`, the stable key never includes positional indices, so
+ * it survives sort/filter operations. It is used as the basis for the cell DOM
+ * `id` and the animation coordinator's snapshot key, allowing the same DOM
+ * element to be reused for the same logical row across re-orders (enabling
+ * FLIP-based sort animations).
+ *
+ * When `getRowId` is provided, the key is derived from the user-supplied id.
+ * When it is not, the key falls back to the row object's identity (via a
+ * WeakMap) so animations still work for plain row arrays. For nested rows the
+ * parent's stable key is included as a prefix so siblings of different parents
+ * do not collide.
+ */
+export declare const generateStableRowKey: (params: {
+    getRowId?: GetRowId;
+    row: Row;
+    depth: number;
+    index: number;
+    rowPath: (string | number)[];
+    rowIndexPath: number[];
+    groupingKey?: string;
+    parentStableKey?: string | null;
+}) => string;
 /**
  * Get nested rows from a row based on the grouping path
  */

package/dist/cjs/stories/examples/BasicExample.d.ts

@@ -6,6 +6,7 @@ export declare const basicExampleDefaults: {
     selectableCells: boolean;
     columnReordering: boolean;
     height: string;
+    useOddEvenRowBackground: boolean;
 };
 export declare function createBasicData(rowLength: number): Row[];
 export declare function renderBasicExample(args?: Partial<UniversalVanillaArgs>): HTMLElement;

package/dist/cjs/stories/examples/sales-example/SalesExample.d.ts

@@ -1,5 +1,8 @@
 import { type UniversalVanillaArgs } from "../../vanillaStoryConfig";
 export declare const salesExampleDefaults: {
+    animations: {
+        enabled: boolean;
+    };
     columnResizing: boolean;
     columnReordering: boolean;
     selectableCells: boolean;

package/dist/cjs/stories/tests/32-ThemesTests.stories.d.ts

@@ -70,6 +70,25 @@ export declare const UseHoverRowBackground: {
     }) => Promise<void>;
 };
 export declare const UseOddEvenRowBackground: {
+    tags: string[];
+    render: () => HTMLDivElement & {
+        _table?: import("../../src/index").SimpleTableVanilla | undefined;
+    };
+    play: ({ canvasElement }: {
+        canvasElement: HTMLElement;
+    }) => Promise<void>;
+};
+export declare const UseOddEvenRowBackgroundDisabled: {
+    tags: string[];
+    render: () => HTMLDivElement & {
+        _table?: import("../../src/index").SimpleTableVanilla | undefined;
+    };
+    play: ({ canvasElement }: {
+        canvasElement: HTMLElement;
+    }) => Promise<void>;
+};
+export declare const UseOddEvenRowBackgroundVisualEffect: {
+    tags: string[];
     render: () => HTMLDivElement & {
         _table?: import("../../src/index").SimpleTableVanilla | undefined;
     };