@sheetxl/grid-react 0.7.20 → 0.7.22

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sheetxl/grid-react",
   "description": "Grid React - Advanced grid component for React",
-  "version": "0.7.20",
+  "version": "0.7.22",
   "license": "SEE LICENSE IN <LICENSE>",
   "type": "module",
   "exports": {
@@ -41,8 +41,8 @@
     "table"
   ],
   "dependencies": {
-    "@sheetxl/utils": "^0.7.20",
-    "@sheetxl/utils-react": "^0.7.20",
+    "@sheetxl/utils": "^0.7.22",
+    "@sheetxl/utils-react": "^0.7.22",
     "clsx": "^2.1.1",
     "react-merge-refs": "^3.0.2",
     "react-use": "^17.6.0",

package/types/index.d.ts

@@ -3,11 +3,11 @@ import { AxisOrientationFlags } from '@sheetxl/utils';
 import { Bounds } from '@sheetxl/utils';
 import { CellCoords } from '@sheetxl/utils';
 import { CellFinder } from '@sheetxl/utils-react';
-import { CellLayout } from '@sheetxl/utils-react';
 import { default as default_2 } from 'react';
 import { Direction } from '@sheetxl/utils';
 import { HiddenHeadersAt } from '@sheetxl/utils-react';
 import { HorizontalAlignment } from '@sheetxl/utils-react';
+import { ICellLayout } from '@sheetxl/utils-react';
 import { ICommands } from '@sheetxl/utils-react';
 import { IScrollPaneElement } from '@sheetxl/utils-react';
 import { ItemSizer } from '@sheetxl/utils-react';
@@ -37,7 +37,7 @@ export declare interface AnimatedStrokeProps {
 
 /**
  * Data grid component for rendering cells onto a virtual panel.
- * This component coordinates between CellLayout and CellRenderer.
+ * This component coordinates between ICellLayout and CellRenderer.
  * This component expects a width and height to be passed to it.
  *
  * * To support dynamic width/height based on div sizing wrap this is @see <Grid>
@@ -114,7 +114,7 @@ export declare interface CellRendererProps<T = any> extends React.HTMLAttributes
     /**
      * The view that is rendering a collection of cells
      */
-    view: GridView;
+    view: IGridView;
     /**
      * The RangeCoords that is being rendering.
      * @remarks
@@ -155,7 +155,7 @@ export declare interface EditorOverlayResults {
     /**
      * Editor component to be injected.
      */
-    overlay: <T>(view: GridView, ref: default_2.Ref<T>) => default_2.ReactNode;
+    renderOverlay: <T>(view: IGridView, ref?: default_2.Ref<T>) => default_2.ReactNode;
     /**
      * Bind to keyboard event
      */
@@ -279,7 +279,7 @@ export declare interface GridProps extends default_2.HTMLAttributes<HTMLDivEleme
     /**
      * The layout for the cells
      */
-    layout?: CellLayout;
+    layout?: ICellLayout;
     /**
      * Called on scroll, subject to debouncing. Used for programmatic changes. Called even on load
      */
@@ -316,11 +316,11 @@ export declare interface GridProps extends default_2.HTMLAttributes<HTMLDivEleme
     /**
      * Allow for customization of freezeTopDivider
      */
-    freezeLeftProps?: Partial<LineProps>;
+    propsFreezeLeft?: Partial<LineProps>;
     /**
      * Allow for customization of freezeTopDivider
      */
-    freezeTopProps?: Partial<LineProps>;
+    propsFreezeTop?: Partial<LineProps>;
     /**
      * Called right before a row is being rendered.
      * Will be called for frozen cells and merged cells
@@ -339,7 +339,7 @@ export declare interface GridProps extends default_2.HTMLAttributes<HTMLDivEleme
      * the pointerEvents are set to none. To enable interaction this should be
      * overwritten.
      */
-    cellRenderer?: (props: CellRendererProps) => default_2.ReactNode;
+    renderCell?: (props: CellRendererProps) => default_2.ReactNode;
     /**
      * Allow for cells to be inset. This is a way to account for borders. By default this is 1, 1, 1,x.
      */
@@ -347,18 +347,18 @@ export declare interface GridProps extends default_2.HTMLAttributes<HTMLDivEleme
     /**
      * Render elements for the view. This will be called whenever the viewport changes.
      */
-    overlays?: ((view: GridView) => default_2.ReactNode)[];
+    renderOverlays?: ((view: IGridView) => default_2.ReactNode)[];
     /**
      * Props passed to all overlayRenderers
      */
-    overlaysProps?: default_2.HTMLAttributes<HTMLDivElement>;
+    propsOverlays?: default_2.HTMLAttributes<HTMLDivElement>;
     /**
      * Used for rendering overlays. Similar to cell render but covers the entire area.
+     *
      * @param props
-     * @returns
      */
-    overlayRenderer?: <T = any>(props: OverlayRendererProps, ref: default_2.Ref<T>) => default_2.ReactNode;
-    overlayProps?: default_2.HTMLAttributes<HTMLDivElement>;
+    renderOverlay?: <T extends HTMLDivElement = HTMLDivElement>(props: OverlayRendererProps<T>) => default_2.ReactNode;
+    propsOverlay?: default_2.HTMLAttributes<HTMLDivElement>;
     /**
      * Overlays are generally clipped to fit in the viewport but
      * this allows for the properties to be overridden.
@@ -367,11 +367,11 @@ export declare interface GridProps extends default_2.HTMLAttributes<HTMLDivEleme
     /**
      * Allows users to Wrap stage children in Top level Context
      */
-    stageWrapper?: (children: default_2.ReactNode) => default_2.ReactNode;
+    wrapperStage?: (children: default_2.ReactNode) => default_2.ReactNode;
     /**
      * Props that can be injected to stage
      */
-    stageProps?: default_2.HTMLAttributes<HTMLDivElement>;
+    propsStage?: default_2.HTMLAttributes<HTMLDivElement>;
     /**
      * Show grid lines.
      * Useful for spreadsheets
@@ -387,11 +387,11 @@ export declare interface GridProps extends default_2.HTMLAttributes<HTMLDivEleme
     /**
      * Gridline props for rows.
      */
-    gridLineRowsProps?: default_2.SVGProps<SVGPathElement>;
+    propsGridLineRows?: default_2.SVGProps<SVGPathElement>;
     /**
      * Gridline props for columns.
      */
-    gridLineColumnsProps?: default_2.SVGProps<SVGPathElement>;
+    propsGridLineColumns?: default_2.SVGProps<SVGPathElement>;
     /**
      * Will skip rendering for this row and the adjacent rows in the given direction.
      */
@@ -421,7 +421,7 @@ export declare interface GridProps extends default_2.HTMLAttributes<HTMLDivEleme
      *   iterated and if hiddenCellAt does not return false then cellRender will be
      *   called.
      */
-    getVisibleCells?: (view: GridView) => ({
+    getVisibleCells?: (view: IGridView) => ({
         coords: CellCoords;
         value?: any;
         range?: RangeCoords;
@@ -476,151 +476,14 @@ export declare interface GridSurfaceStyle extends PaintStyle {
     darkMode?: boolean;
 }
 
-/**
- * Describes the view of a grid.
- *
- * @remarks
- * Useful for overlay rendering.
- */
-export declare interface GridView {
-    /**
-     * Returns the underlying stage element for the view.
-     *
-     * @remarks
-     * Useful for capturing stage events.
-     */
-    getStage(): HTMLDivElement | null;
-    /**
-     * The anchor for the view.
-     */
-    getAnchor(): AnchorLocation;
-    /**
-     * Allow for dimensions to be determined for various cells.
-     * The cellLayout is inclusive of the zoom
-     */
-    getLayout(): CellLayout;
-    /**
-     * Useful for internal rendering.
-     *
-     * @remarks
-     * The cell layout will account for zoom factors already.
-     */
-    getZoom(): number;
-    /**
-     * This captures the total viewable range.
-     *
-     * @remarks
-     * Will have the sames values as {@link getVisibleRows} and {@link getVisibleColumns}.
-     */
-    getVisibleRangeCoords(): RangeCoords;
-    /**
-     * Useful for scanning. Contains a list of row offsets that are visible.
-     * Guaranteed to be non-null but may be zero length if no rows are visible.
-     */
-    getVisibleRows(): readonly number[];
-    /**
-     * Useful for scanning. Contains a list of column offsets that are visible.
-     * Guaranteed to be non-null but may be zero length if no column are visible.
-     */
-    getVisibleColumns(): readonly number[];
-    /**
-     * Returns the SizedOffsets for columns.
-     */
-    getVisibleColumnOffsets(): SizedOffset;
-    /**
-     * Returns the SizedOffsets for rows.
-     */
-    getVisibleRowOffsets(): SizedOffset;
-    /**
-     * Returns the range coords that captures the entire view.
-     */
-    getTotalRangeCoords(): RangeCoords;
-    /**
-     * Clip a rectangle against the viewport.
-     *
-     * @remarks
-     * * A negative inset will extend outside of the viewport;
-     * * Useful when elements should visually 'flow' off of the viewport. (i.e. selection with borders)
-     */
-    toClipBounds(bounds?: Bounds, insets?: number | Bounds): Bounds;
-    /**
-     * Returns the viewport bounds for an absolute bounds.
-     */
-    toViewBounds(bounds: Bounds): Bounds;
-    /**
-     * Returns the absolute bounds for a viewport bounds.
-     */
-    toAbsoluteBounds(bounds: Bounds): Bounds;
-    /**
-     * The bounds of the the overlay relative to the total view.
-     */
-    getBounds(): Bounds;
-    /**
-     * Additional inside padding.
-     */
-    getInsets(): Rectangle;
-    /**
-     * Returns the cell as a range. If this cell is merged this will be reflected.
-     * Note - This is slightly more sophisticated than rowSpan and colSpan
-     * because it allows for queries that are not on the top/left.
-     */
-    getCellCoordsAsRangeCoords(coords: CellCoords): RangeCoords;
-    /**
-     * Returns a bounds for a given range.
-     * If not specified then will return for the cellRange.
-     *
-     * @param adjustment This allows you to adjust the rect. Note - This is not like insets
-     *
-     * @remarks
-     * The bounds are relative to the view.
-     */
-    getRangeCoordsBounds(range?: RangeCoords, adjustment?: Partial<Rectangle>): Bounds;
-    /**
-     * Scroll the cell coords into view.
-     * If the coord does not have an index it will only scroll in a single direction.
-     */
-    scrollCellCoordsIntoView(coords: Partial<CellCoords>, options?: globalThis.ScrollIntoViewOptions | boolean): Promise<Partial<TopLeft>>;
-    /**
-     * Returns the coords at the offset.
-     * @param x - The x offset relative to the view
-     * @param y - The y offset relative to the view
-     * @param actualCell - Don't return the topLeft of a merge. Default value `false`.
-     */
-    getCellCoordsFromClient(x: number, y: number, actualCell?: boolean): CellCoords | null;
-    /**
-     * Indicate the allowable scroll directions.
-     */
-    getScrollOrientation(): AxisOrientationFlags;
-    getScrollTopLeft(): TopLeft;
-    getFreezeTopLeft(): TopLeft;
-    /**
-     * Returns the total size of all rendered values in pixels.
-     */
-    getTotalSize(): Size;
-    /**
-     * This is the size for all views (but not including the headers)
-     */
-    getViewportSize(): Size;
-    /**
-     * Allows for access to all current views.
-     */
-    allViews(): Partial<Record<AnchorLocation, GridView>>;
-    /**
-     * Returns a point relative to the view.
-     */
-    getRelativePointFromClient(x: number, y: number): Point | null;
-}
-
 /**
  * A divider placed between headers to provider a visual cue for various actions.
  * Resize, hide/unhide, etc.
  */
-export declare const HeaderDivider: default_2.FC<HeaderDividerAnchorProps & {
-    ref?: default_2.Ref<IHeaderDividerElement>;
-}>;
+export declare const HeaderDivider: default_2.NamedExoticComponent<Omit<HeaderDividerAnchorProps, "ref"> & default_2.RefAttributes<IHeaderDividerElement>>;
 
 export declare interface HeaderDividerAnchorProps extends HeaderDividerProps {
-    dividerRenderer?: (props: HeaderDividerRendererProps, refForward?: default_2.Ref<IHeaderDividerElement>) => default_2.ReactNode;
+    renderDivider?: (props: HeaderDividerRendererProps) => default_2.ReactNode;
     /**
      * The number of pixels to mouse before resizing starts.
      * If this number is less than 1 then it will be 1.
@@ -674,7 +537,7 @@ export declare interface HeaderDividerAnchorProps extends HeaderDividerProps {
  */
 export declare interface HeaderDividerProps extends default_2.HTMLAttributes<HTMLDivElement> {
     orientation: RangeOrientation;
-    view: GridView;
+    view: IGridView;
     index: number;
     /**
      * This should disable interaction. This should also
@@ -819,17 +682,17 @@ export declare interface IGridAttributes {
      * over a frozen pane it will return the frozen pane otherwise
      * it will return the center view.
      */
-    getViewFromClient: (x: number, y: number) => GridView;
+    getViewFromClient: (x: number, y: number) => IGridView;
     /**
      * Returns the view for the given coords. If coord is
      * over a frozen pane it will return the frozen pane otherwise
      * it will return the center view.
      */
-    getViewFromCellCoords: (coords: CellCoords) => GridView;
+    getViewFromCellCoords: (coords: CellCoords) => IGridView;
     /**
      * Returns null if the view does not exist.
      */
-    getViewFromLocation: (anchor: AnchorLocation) => GridView | null;
+    getViewFromLocation: (anchor: AnchorLocation) => IGridView | null;
     /**
      * Called when the view has been changed.
      * @remarks
@@ -848,6 +711,141 @@ export declare interface IGridAttributes {
 export declare interface IGridElement extends HTMLDivElement, IGridAttributes {
 }
 
+/**
+ * Describes the view of a grid.
+ *
+ * @remarks
+ * Useful for overlay rendering.
+ */
+export declare interface IGridView {
+    /**
+     * Returns the underlying stage element for the view.
+     *
+     * @remarks
+     * Useful for capturing stage events.
+     */
+    getStage(): HTMLDivElement | null;
+    /**
+     * The anchor for the view.
+     */
+    getAnchor(): AnchorLocation;
+    /**
+     * Allow for dimensions to be determined for various cells.
+     * The cellLayout is inclusive of the zoom
+     */
+    getLayout(): ICellLayout;
+    /**
+     * Useful for internal rendering.
+     *
+     * @remarks
+     * The cell layout will account for zoom factors already.
+     */
+    getZoom(): number;
+    /**
+     * This captures the total viewable range.
+     *
+     * @remarks
+     * Will have the sames values as {@link getVisibleRows} and {@link getVisibleColumns}.
+     */
+    getVisibleRangeCoords(): RangeCoords;
+    /**
+     * Useful for scanning. Contains a list of row offsets that are visible.
+     * Guaranteed to be non-null but may be zero length if no rows are visible.
+     */
+    getVisibleRows(): readonly number[];
+    /**
+     * Useful for scanning. Contains a list of column offsets that are visible.
+     * Guaranteed to be non-null but may be zero length if no column are visible.
+     */
+    getVisibleColumns(): readonly number[];
+    /**
+     * Returns the SizedOffsets for columns.
+     */
+    getVisibleColumnOffsets(): SizedOffset;
+    /**
+     * Returns the SizedOffsets for rows.
+     */
+    getVisibleRowOffsets(): SizedOffset;
+    /**
+     * Returns the range coords that captures the entire view.
+     */
+    getTotalRangeCoords(): RangeCoords;
+    /**
+     * Clip a rectangle against the viewport.
+     *
+     * @remarks
+     * * A negative inset will extend outside of the viewport;
+     * * Useful when elements should visually 'flow' off of the viewport. (i.e. selection with borders)
+     */
+    toClipBounds(bounds?: Bounds, insets?: number | Bounds): Bounds;
+    /**
+     * Returns the viewport bounds for an absolute bounds.
+     */
+    toViewBounds(bounds: Bounds): Bounds;
+    /**
+     * Returns the absolute bounds for a viewport bounds.
+     */
+    toAbsoluteBounds(bounds: Bounds): Bounds;
+    /**
+     * The bounds of the the overlay relative to the total view.
+     */
+    getBounds(): Bounds;
+    /**
+     * Additional inside padding.
+     */
+    getInsets(): Rectangle;
+    /**
+     * Returns the cell as a range. If this cell is merged this will be reflected.
+     * Note - This is slightly more sophisticated than rowSpan and colSpan
+     * because it allows for queries that are not on the top/left.
+     */
+    getCellCoordsAsRangeCoords(coords: CellCoords): RangeCoords;
+    /**
+     * Returns a bounds for a given range.
+     * If not specified then will return for the cellRange.
+     *
+     * @param adjustment This allows you to adjust the rect. Note - This is not like insets
+     *
+     * @remarks
+     * The bounds are relative to the view.
+     */
+    getRangeCoordsBounds(range?: RangeCoords, adjustment?: Partial<Rectangle>): Bounds;
+    /**
+     * Scroll the cell coords into view.
+     * If the coord does not have an index it will only scroll in a single direction.
+     */
+    scrollCellCoordsIntoView(coords: Partial<CellCoords>, options?: globalThis.ScrollIntoViewOptions | boolean): Promise<Partial<TopLeft>>;
+    /**
+     * Returns the coords at the offset.
+     * @param x - The x offset relative to the view
+     * @param y - The y offset relative to the view
+     * @param actualCell - Don't return the topLeft of a merge. Default value `false`.
+     */
+    getCellCoordsFromClient(x: number, y: number, actualCell?: boolean): CellCoords | null;
+    /**
+     * Indicate the allowable scroll directions.
+     */
+    getScrollOrientation(): AxisOrientationFlags;
+    getScrollTopLeft(): TopLeft;
+    getFreezeTopLeft(): TopLeft;
+    /**
+     * Returns the total size of all rendered values in pixels.
+     */
+    getTotalSize(): Size;
+    /**
+     * This is the size for all views (but not including the headers)
+     */
+    getViewportSize(): Size;
+    /**
+     * Allows for access to all current views.
+     */
+    allViews(): Partial<Record<AnchorLocation, IGridView>>;
+    /**
+     * Returns a point relative to the view.
+     */
+    getRelativePointFromClient(x: number, y: number): Point | null;
+}
+
 export declare interface IHeaderDividerAttributes {
 }
 
@@ -857,21 +855,22 @@ export declare interface IHeaderDividerElement extends HTMLDivElement, IHeaderDi
 export declare interface LineProps extends default_2.SVGProps<SVGSVGElement> {
     linePoints: number[];
     bounds: Bounds;
-    pathProps?: default_2.SVGProps<SVGPathElement>;
+    propsPath?: default_2.SVGProps<SVGPathElement>;
 }
 
 export declare type NewHeaderSelectionMode = "clear" | "modify" | "append";
 
 export declare type NewSelectionMode = "clear" | "modify" | "append";
 
-export declare interface OverlayRendererProps extends React.HTMLAttributes<HTMLElement>, React.Attributes {
+export declare interface OverlayRendererProps<T extends HTMLDivElement = any> extends React.HTMLAttributes<HTMLDivElement>, React.Attributes {
     /**
      * The view that is rendering a collection of cells
      */
-    view: GridView;
+    view: IGridView;
     onStageKeyDown?: (e: React.KeyboardEvent<Element>) => void;
     onStagePointerDown?: (e: React.PointerEvent<Element>) => void;
     onStageDoubleClick?: (e: React.PointerEvent<Element>) => void;
+    ref?: React.Ref<T>;
 }
 
 export declare interface PaintStyle {
@@ -887,7 +886,7 @@ export declare const safeSelectionCoords: (prev?: SelectionCoords) => SelectionC
 /**
  * ScrollableGrid. This wraps BaseGrid and manages bounds to create consistent css behavior for consumers
  */
-export declare const ScrollableGrid: default_2.NamedExoticComponent<Omit<ScrollableGridProps, "ref"> & default_2.RefAttributes<IGridElement>>;
+export declare const ScrollableGrid: default_2.NamedExoticComponent<Omit<ScrollableGridProps, "ref"> & default_2.RefAttributes<IGridElement & IScrollPaneElement>>;
 
 export declare interface ScrollableGridProps extends GridProps, ScrollPaneProps {
     /**
@@ -907,8 +906,8 @@ export { Selection_2 as Selection }
 export declare const SELECTION_CLIP_INSETS = -10;
 
 export declare interface SelectionPointerHandlerOptions extends Omit<PointerHandlerOptions, "onPointerDown" | "onPointerMoveOrWait"> {
-    onSelectionPointerDown: (event: default_2.PointerEvent<Element>, modifiers: PointerModifiers, view?: GridView, coords?: CellCoords, pivotCoords?: CellCoords, extendSelection?: boolean, scrollToAnchor?: boolean, resetCellAnchor?: boolean) => boolean | void;
-    onSelectionPointerMoveOrWait?: (event: default_2.PointerEvent<Element>, modifiers: PointerModifiers, originalEvent: default_2.PointerEvent<Element>, view?: GridView, coords?: CellCoords, pivotCoords?: CellCoords, scrollToAnchor?: boolean, resetCellAnchor?: boolean) => void;
+    onSelectionPointerDown: (event: default_2.PointerEvent<Element>, modifiers: PointerModifiers, view?: IGridView, coords?: CellCoords, pivotCoords?: CellCoords, extendSelection?: boolean, scrollToAnchor?: boolean, resetCellAnchor?: boolean) => boolean | void;
+    onSelectionPointerMoveOrWait?: (event: default_2.PointerEvent<Element>, modifiers: PointerModifiers, originalEvent: default_2.PointerEvent<Element>, view?: IGridView, coords?: CellCoords, pivotCoords?: CellCoords, scrollToAnchor?: boolean, resetCellAnchor?: boolean) => void;
 }
 
 export declare type SelectionPolicy = "single" | "range" | "multiple";
@@ -918,7 +917,13 @@ export declare interface SelectionProps extends SVGRectProps {
      * @defaultValue false unless props are set
      */
     isAnimatedStroke?: boolean;
-    animatedStrokeProps?: AnimatedStrokeProps;
+    /**
+     * Customize props for Animated Stroke
+     */
+    propsAnimatedStroke?: AnimatedStrokeProps;
+    /**
+     * The range that this selection represents.
+     */
     range: RangeCoords;
     /**
      * An area may or may not contain an anchor cell.
@@ -956,7 +961,7 @@ export declare interface SelectionResults {
      * // TODO - make this a function that takes props and received onMouse, onKeyboard
      * (we can then make selection overlays a function that doesn't rerender the table (or sheet on move))
      */
-    overlay: (view: GridView) => default_2.ReactNode;
+    renderOverlay: (view: IGridView) => default_2.ReactNode;
     /**
      * Navigate left/right/up/down
      * @param direction The direction to navigate.
@@ -1051,8 +1056,8 @@ declare const SVGRect_2: (props: SVGRectProps) => JSX.Element;
 export { SVGRect_2 as SVGRect }
 
 export declare interface SVGRectProps extends default_2.SVGProps<SVGSVGElement> {
-    pathBounds?: Bounds;
-    pathProps?: default_2.SVGProps<SVGPathElement>;
+    boundsPath?: Bounds;
+    propsPath?: default_2.SVGProps<SVGPathElement>;
 }
 
 export declare interface TextStyle extends PaintStyle {
@@ -1082,7 +1087,7 @@ export declare interface TouchSelectHandleProps extends default_2.HTMLAttributes
      */
     anchor: 'tl' | 'br' | 'l' | 't' | 'r' | 'b';
     range: RangeCoords;
-    view: GridView;
+    view: IGridView;
     size?: number;
     borderWidth?: number;
     borderStroke?: string;
@@ -1113,7 +1118,7 @@ export declare interface TouchSelectHandleProps extends default_2.HTMLAttributes
 /**
  * Hook to manage cell layout
  */
-export declare const useCellLayout: (props: UseCellLayoutProps | null) => CellLayout;
+export declare const useCellLayout: (props: UseCellLayoutProps | null) => ICellLayout;
 
 export declare interface UseCellLayoutProps {
     /**
@@ -1251,7 +1256,7 @@ export declare interface useKeyboardEditorOverlayOptions {
     /**
      * The view that is being used for rendering
      */
-    view: GridView;
+    view: IGridView;
     /**
      * Active selected cell. This is required to enable
      * the editor to activate when a key is pressed
@@ -1300,7 +1305,7 @@ export declare interface useKeyboardEditorOverlayOptions {
      * @returns Either `true` or an `StartEditEvent`
      */
     isEditorStartPointerEvent?: (e: PointerEvent, coords: CellCoords) => boolean | StartEditEvent;
-    containerProps?: default_2.HTMLAttributes<HTMLDivElement>;
+    propsContainer?: default_2.HTMLAttributes<HTMLDivElement>;
     borderStrokeFill?: string;
     borderStrokeWidth?: number;
     /**
@@ -1312,7 +1317,7 @@ export declare interface useKeyboardEditorOverlayOptions {
 /**
  * Hook to enable selection in grid
  */
-export declare const useSelection: ({ gridRef, commands, layout, selection: propSelection, onSelectionChange: propOnSelectionChange, onSelectionDragStart: propOnSelectionDragStart, onSelectionDragEnd: propOnSelectionDragEnd, selectionPolicy, newSelectionMode, allowDeselectSelection, onFillPreview: propOnFillPreview, onFillCancel: propOnFillCancel, onFillDone: propOnFillDone, onFill: propOnFill, disableFillDrag, fillHandleBorderColor, hiddenRowsAt: propHiddenRowsAt, hiddenColumnsAt: propHiddenColumnsAt, isContentfulCell: propsIsContentfulCell, contentfulCellFinder: propContentfulCellFinder, getDataCoords, alwaysScrollToActiveCoords, selectionBounds: propSelectionBounds, pointerDownInterceptor, pointerMoveInterceptor, mergedRanges, canSelectionSpanMergedCells, onMoveDragStart: propOnMoveDragStart, onMoveDragUpdate: propOnMoveDragUpdate, onMoveDragEnd: propOnMoveDragEnd, onMoveDragDone: propOnMoveDragDone, selectionRenderer: propSelectionRenderer, disableMoveDrag, getCellCoordsAsRangeCoords, moveDragHitSize, moveDragOutlineSize, selectionBackgroundColor, selectionBorderColor, selectionRemoveBorderColor, selectionRemoveBackgroundColor, disableTouchSelection, touchSelectHandleProps, }: UseSelectionOptions) => SelectionResults;
+export declare const useSelection: ({ gridRef, commands, layout, selection: propSelection, onSelectionChange: propOnSelectionChange, onSelectionDragStart: propOnSelectionDragStart, onSelectionDragEnd: propOnSelectionDragEnd, selectionPolicy, newSelectionMode, allowDeselectSelection, onFillPreview: propOnFillPreview, onFillCancel: propOnFillCancel, onFillDone: propOnFillDone, onFill: propOnFill, disableFillDrag, fillHandleBorderColor, hiddenRowsAt: propHiddenRowsAt, hiddenColumnsAt: propHiddenColumnsAt, isContentfulCell: propsIsContentfulCell, contentfulCellFinder: propContentfulCellFinder, getDataCoords, alwaysScrollToActiveCoords, selectionBounds: propSelectionBounds, pointerDownInterceptor, pointerMoveInterceptor, mergedRanges, canSelectionSpanMergedCells, onMoveDragStart: propOnMoveDragStart, onMoveDragUpdate: propOnMoveDragUpdate, onMoveDragEnd: propOnMoveDragEnd, onMoveDragDone: propOnMoveDragDone, renderSelection: propRenderSelection, disableMoveDrag, getCellCoordsAsRangeCoords, moveDragHitSize, moveDragOutlineSize, selectionBackgroundColor, selectionBorderColor, selectionRemoveBorderColor, selectionRemoveBackgroundColor, disableTouchSelection, propsTouchSelectHandle, }: UseSelectionOptions) => SelectionResults;
 
 export declare interface UseSelectionOptions {
     /**
@@ -1323,7 +1328,7 @@ export declare interface UseSelectionOptions {
     /**
      * This is used for pageUp/pageDown and getHiddenAuto.
      */
-    layout?: CellLayout;
+    layout?: ICellLayout;
     /**
      * selections
      */
@@ -1458,11 +1463,11 @@ export declare interface UseSelectionOptions {
     /**
      * If touch is enabled.
      */
-    touchSelectHandleProps?: TouchSelectHandleProps;
+    propsTouchSelectHandle?: TouchSelectHandleProps;
     /**
      * Allow users to customize selected cells design
      */
-    selectionRenderer?: (props: SelectionProps) => default_2.ReactNode;
+    renderSelection?: (props: SelectionProps) => default_2.ReactNode;
     /**
      * Border color of selected area
      */