react-konva-grid
Version:
Declarative React Canvas Grid primitive for Data table, Pivot table, Excel Worksheets
586 lines • 95.4 kB
HTML
<!doctype html>
<html class="default no-js">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>"Grid" | react-konva-grid</title>
<meta name="description" content="Documentation for react-konva-grid">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../assets/css/main.css">
</head>
<body>
<header>
<div class="tsd-page-toolbar">
<div class="container">
<div class="table-wrap">
<div class="table-cell" id="tsd-search" data-index="../assets/js/search.json" data-base="..">
<div class="field">
<label for="tsd-search-field" class="tsd-widget search no-caption">Search</label>
<input id="tsd-search-field" type="text" />
</div>
<ul class="results">
<li class="state loading">Preparing search index...</li>
<li class="state failure">The search index is not available</li>
</ul>
<a href="../index.html" class="title">react-konva-grid</a>
</div>
<div class="table-cell" id="tsd-widgets">
<div id="tsd-filter">
<a href="#" class="tsd-widget options no-caption" data-toggle="options">Options</a>
<div class="tsd-filter-group">
<div class="tsd-select" id="tsd-filter-visibility">
<span class="tsd-select-label">All</span>
<ul class="tsd-select-list">
<li data-value="public">Public</li>
<li data-value="protected">Public/Protected</li>
<li data-value="private" class="selected">All</li>
</ul>
</div>
<input type="checkbox" id="tsd-filter-inherited" checked />
<label class="tsd-widget" for="tsd-filter-inherited">Inherited</label>
<input type="checkbox" id="tsd-filter-externals" checked />
<label class="tsd-widget" for="tsd-filter-externals">Externals</label>
<input type="checkbox" id="tsd-filter-only-exported" />
<label class="tsd-widget" for="tsd-filter-only-exported">Only exported</label>
</div>
</div>
<a href="#" class="tsd-widget menu no-caption" data-toggle="menu">Menu</a>
</div>
</div>
</div>
</div>
<div class="tsd-page-title">
<div class="container">
<ul class="tsd-breadcrumb">
<li>
<a href="../globals.html">Globals</a>
</li>
<li>
<a href="_grid_.html">"Grid"</a>
</li>
</ul>
<h1>Module "Grid"</h1>
</div>
</div>
</header>
<div class="container container-main">
<div class="row">
<div class="col-8 col-content">
<section class="tsd-panel-group tsd-index-group">
<h2>Index</h2>
<section class="tsd-panel tsd-index-panel">
<div class="tsd-index-content">
<section class="tsd-index-section ">
<h3>Interfaces</h3>
<ul class="tsd-index-list">
<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/_grid_.areaprops.html" class="tsd-kind-icon">Area<wbr>Props</a></li>
<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/_grid_.areastyle.html" class="tsd-kind-icon">Area<wbr>Style</a></li>
<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/_grid_.cellinterface.html" class="tsd-kind-icon">Cell<wbr>Interface</a></li>
<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/_grid_.cellposition.html" class="tsd-kind-icon">Cell<wbr>Position</a></li>
<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/_grid_.gridprops.html" class="tsd-kind-icon">Grid<wbr>Props</a></li>
<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/_grid_.instanceinterface.html" class="tsd-kind-icon">Instance<wbr>Interface</a></li>
<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/_grid_.optionalcellinterface.html" class="tsd-kind-icon">Optional<wbr>Cell<wbr>Interface</a></li>
<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/_grid_.rendererprops.html" class="tsd-kind-icon">Renderer<wbr>Props</a></li>
<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/_grid_.scrollstate.html" class="tsd-kind-icon">Scroll<wbr>State</a></li>
<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/_grid_.selectionarea.html" class="tsd-kind-icon">Selection<wbr>Area</a></li>
<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/_grid_.selectionprops.html" class="tsd-kind-icon">Selection<wbr>Props</a></li>
<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/_grid_.snapcolumnprops.html" class="tsd-kind-icon">Snap<wbr>Column<wbr>Props</a></li>
<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/_grid_.snaprowprops.html" class="tsd-kind-icon">Snap<wbr>Row<wbr>Props</a></li>
<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/_grid_.viewportprops.html" class="tsd-kind-icon">View<wbr>Port<wbr>Props</a></li>
</ul>
</section>
<section class="tsd-index-section ">
<h3>Type aliases</h3>
<ul class="tsd-index-list">
<li class="tsd-kind-type-alias tsd-parent-kind-module"><a href="_grid_.html#cellmetadata" class="tsd-kind-icon">Cell<wbr>Meta<wbr>Data</a></li>
<li class="tsd-kind-type-alias tsd-parent-kind-module"><a href="_grid_.html#cellmetadatamap" class="tsd-kind-icon">Cell<wbr>Meta<wbr>Data<wbr>Map</a></li>
<li class="tsd-kind-type-alias tsd-parent-kind-module"><a href="_grid_.html#gridref" class="tsd-kind-icon">Grid<wbr>Ref</a></li>
<li class="tsd-kind-type-alias tsd-parent-kind-module"><a href="_grid_.html#itemsizer" class="tsd-kind-icon">Item<wbr>Sizer</a></li>
<li class="tsd-kind-type-alias tsd-parent-kind-module"><a href="_grid_.html#mergedcellmap" class="tsd-kind-icon">Merged<wbr>Cell<wbr>Map</a></li>
<li class="tsd-kind-type-alias tsd-parent-kind-module tsd-has-type-parameter"><a href="_grid_.html#optional" class="tsd-kind-icon">Optional</a></li>
<li class="tsd-kind-type-alias tsd-parent-kind-module"><a href="_grid_.html#optionalscrollcoords" class="tsd-kind-icon">Optional<wbr>Scroll<wbr>Coords</a></li>
<li class="tsd-kind-type-alias tsd-parent-kind-module"><a href="_grid_.html#refattribute" class="tsd-kind-icon">Ref<wbr>Attribute</a></li>
<li class="tsd-kind-type-alias tsd-parent-kind-module"><a href="_grid_.html#rendercomponent" class="tsd-kind-icon">Render<wbr>Component</a></li>
<li class="tsd-kind-type-alias tsd-parent-kind-module"><a href="_grid_.html#scrollcoords" class="tsd-kind-icon">Scroll<wbr>Coords</a></li>
<li class="tsd-kind-type-alias tsd-parent-kind-module"><a href="_grid_.html#stylingprops" class="tsd-kind-icon">Styling<wbr>Props</a></li>
</ul>
</section>
<section class="tsd-index-section ">
<h3>Variables</h3>
<ul class="tsd-index-list">
<li class="tsd-kind-variable tsd-parent-kind-module tsd-is-not-exported"><a href="_grid_.html#default_estimated_item_size" class="tsd-kind-icon">DEFAULT_<wbr>ESTIMATED_<wbr>ITEM_<wbr>SIZE</a></li>
<li class="tsd-kind-variable tsd-parent-kind-module"><a href="_grid_.html#grid" class="tsd-kind-icon">Grid</a></li>
<li class="tsd-kind-variable tsd-parent-kind-module tsd-is-not-exported"><a href="_grid_.html#reset_scroll_events_debounce_interval" class="tsd-kind-icon">RESET_<wbr>SCROLL_<wbr>EVENTS_<wbr>DEBOUNCE_<wbr>INTERVAL</a></li>
</ul>
</section>
<section class="tsd-index-section tsd-is-not-exported">
<h3>Functions</h3>
<ul class="tsd-index-list">
<li class="tsd-kind-function tsd-parent-kind-module tsd-is-not-exported"><a href="_grid_.html#defaultcolumnwidth" class="tsd-kind-icon">default<wbr>Column<wbr>Width</a></li>
<li class="tsd-kind-function tsd-parent-kind-module tsd-is-not-exported"><a href="_grid_.html#defaultrowheight" class="tsd-kind-icon">default<wbr>Row<wbr>Height</a></li>
<li class="tsd-kind-function tsd-parent-kind-module tsd-is-not-exported"><a href="_grid_.html#defaultselectionrenderer" class="tsd-kind-icon">default<wbr>Selection<wbr>Renderer</a></li>
</ul>
</section>
<section class="tsd-index-section tsd-is-not-exported">
<h3>Object literals</h3>
<ul class="tsd-index-list">
<li class="tsd-kind-object-literal tsd-parent-kind-module tsd-is-not-exported"><a href="_grid_.html#defaultshadowsettings" class="tsd-kind-icon">default<wbr>Shadow<wbr>Settings</a></li>
</ul>
</section>
</div>
</section>
</section>
<section class="tsd-panel-group tsd-member-group ">
<h2>Type aliases</h2>
<section class="tsd-panel tsd-member tsd-kind-type-alias tsd-parent-kind-module">
<a name="cellmetadata" class="tsd-anchor"></a>
<h3>Cell<wbr>Meta<wbr>Data</h3>
<div class="tsd-signature tsd-kind-icon">Cell<wbr>Meta<wbr>Data<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-symbol">{ </span>offset<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">; </span>size<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol"> }</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in <a href="https://github.com/rmdort/konva-grid/blob/41d9546/src/Grid.tsx#L247">src/Grid.tsx:247</a></li>
</ul>
</aside>
<div class="tsd-type-declaration">
<h4>Type declaration</h4>
<ul class="tsd-parameters">
<li class="tsd-parameter">
<h5>offset<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span></h5>
</li>
<li class="tsd-parameter">
<h5>size<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span></h5>
</li>
</ul>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-type-alias tsd-parent-kind-module">
<a name="cellmetadatamap" class="tsd-anchor"></a>
<h3>Cell<wbr>Meta<wbr>Data<wbr>Map</h3>
<div class="tsd-signature tsd-kind-icon">Cell<wbr>Meta<wbr>Data<wbr>Map<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">Record</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">, </span><a href="_grid_.html#cellmetadata" class="tsd-signature-type">CellMetaData</a><span class="tsd-signature-symbol">></span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in <a href="https://github.com/rmdort/konva-grid/blob/41d9546/src/Grid.tsx#L246">src/Grid.tsx:246</a></li>
</ul>
</aside>
</section>
<section class="tsd-panel tsd-member tsd-kind-type-alias tsd-parent-kind-module">
<a name="gridref" class="tsd-anchor"></a>
<h3>Grid<wbr>Ref</h3>
<div class="tsd-signature tsd-kind-icon">Grid<wbr>Ref<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-symbol">{ </span>container<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">HTMLDivElement</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span><span class="tsd-signature-symbol">; </span>focus<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">; </span>getCellBounds<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>coords<span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><a href="../interfaces/_grid_.areaprops.html" class="tsd-signature-type">AreaProps</a><span class="tsd-signature-symbol">; </span>getCellCoordsFromOffset<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>x<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span>, y<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a><span class="tsd-signature-symbol">; </span>getCellOffsetFromCoords<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>coords<span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><a href="../interfaces/_grid_.cellposition.html" class="tsd-signature-type">CellPosition</a><span class="tsd-signature-symbol">; </span>getScrollPosition<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><a href="_grid_.html#scrollcoords" class="tsd-signature-type">ScrollCoords</a><span class="tsd-signature-symbol">; </span>getViewPort<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><a href="../interfaces/_grid_.viewportprops.html" class="tsd-signature-type">ViewPortProps</a><span class="tsd-signature-symbol">; </span>isMergedCell<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>coords<span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">; </span>resetAfterIndices<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>coords<span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a>, shouldForceUpdate<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">false</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">true</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">; </span>resizeColumns<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>indices<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">[]</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">; </span>resizeRows<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>indices<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">[]</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">; </span>scrollTo<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>scrollPosition<span class="tsd-signature-symbol">: </span><a href="_grid_.html#scrollcoords" class="tsd-signature-type">ScrollCoords</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">; </span>scrollToItem<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>coords<span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.optionalcellinterface.html" class="tsd-signature-type">OptionalCellInterface</a>, align<span class="tsd-signature-symbol">?: </span><a href="../enums/_helpers_.align.html" class="tsd-signature-type">Align</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">; </span>stage<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">typeof </span><span class="tsd-signature-type">Stage</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span><span class="tsd-signature-symbol"> }</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in <a href="https://github.com/rmdort/konva-grid/blob/41d9546/src/Grid.tsx#L265">src/Grid.tsx:265</a></li>
</ul>
</aside>
<div class="tsd-type-declaration">
<h4>Type declaration</h4>
<ul class="tsd-parameters">
<li class="tsd-parameter">
<h5>container<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">HTMLDivElement</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span></h5>
</li>
<li class="tsd-parameter">
<h5>focus<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span></h5>
<ul class="tsd-parameters">
<li class="tsd-parameter-signature">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4>
</li>
</ul>
</li>
</ul>
</li>
<li class="tsd-parameter">
<h5>get<wbr>Cell<wbr>Bounds<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>coords<span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><a href="../interfaces/_grid_.areaprops.html" class="tsd-signature-type">AreaProps</a></h5>
<ul class="tsd-parameters">
<li class="tsd-parameter-signature">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>coords<span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.areaprops.html" class="tsd-signature-type">AreaProps</a></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-parameters-title">Parameters</h4>
<ul class="tsd-parameters">
<li>
<h5>coords: <a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a></h5>
</li>
</ul>
<h4 class="tsd-returns-title">Returns <a href="../interfaces/_grid_.areaprops.html" class="tsd-signature-type">AreaProps</a></h4>
</li>
</ul>
</li>
</ul>
</li>
<li class="tsd-parameter">
<h5>get<wbr>Cell<wbr>Coords<wbr>From<wbr>Offset<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>x<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span>, y<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a></h5>
<ul class="tsd-parameters">
<li class="tsd-parameter-signature">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>x<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span>, y<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-parameters-title">Parameters</h4>
<ul class="tsd-parameters">
<li>
<h5>x: <span class="tsd-signature-type">number</span></h5>
</li>
<li>
<h5>y: <span class="tsd-signature-type">number</span></h5>
</li>
</ul>
<h4 class="tsd-returns-title">Returns <a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a></h4>
</li>
</ul>
</li>
</ul>
</li>
<li class="tsd-parameter">
<h5>get<wbr>Cell<wbr>Offset<wbr>From<wbr>Coords<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>coords<span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><a href="../interfaces/_grid_.cellposition.html" class="tsd-signature-type">CellPosition</a></h5>
<ul class="tsd-parameters">
<li class="tsd-parameter-signature">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>coords<span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.cellposition.html" class="tsd-signature-type">CellPosition</a></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-parameters-title">Parameters</h4>
<ul class="tsd-parameters">
<li>
<h5>coords: <a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a></h5>
</li>
</ul>
<h4 class="tsd-returns-title">Returns <a href="../interfaces/_grid_.cellposition.html" class="tsd-signature-type">CellPosition</a></h4>
</li>
</ul>
</li>
</ul>
</li>
<li class="tsd-parameter">
<h5>get<wbr>Scroll<wbr>Position<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><a href="_grid_.html#scrollcoords" class="tsd-signature-type">ScrollCoords</a></h5>
<ul class="tsd-parameters">
<li class="tsd-parameter-signature">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="_grid_.html#scrollcoords" class="tsd-signature-type">ScrollCoords</a></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-returns-title">Returns <a href="_grid_.html#scrollcoords" class="tsd-signature-type">ScrollCoords</a></h4>
</li>
</ul>
</li>
</ul>
</li>
<li class="tsd-parameter">
<h5>get<wbr>View<wbr>Port<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><a href="../interfaces/_grid_.viewportprops.html" class="tsd-signature-type">ViewPortProps</a></h5>
<ul class="tsd-parameters">
<li class="tsd-parameter-signature">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.viewportprops.html" class="tsd-signature-type">ViewPortProps</a></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-returns-title">Returns <a href="../interfaces/_grid_.viewportprops.html" class="tsd-signature-type">ViewPortProps</a></h4>
</li>
</ul>
</li>
</ul>
</li>
<li class="tsd-parameter">
<h5>is<wbr>Merged<wbr>Cell<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>coords<span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">boolean</span></h5>
<ul class="tsd-parameters">
<li class="tsd-parameter-signature">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>coords<span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-parameters-title">Parameters</h4>
<ul class="tsd-parameters">
<li>
<h5>coords: <a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a></h5>
</li>
</ul>
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">boolean</span></h4>
</li>
</ul>
</li>
</ul>
</li>
<li class="tsd-parameter">
<h5>reset<wbr>After<wbr>Indices<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>coords<span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a>, shouldForceUpdate<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">false</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">true</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span></h5>
<ul class="tsd-parameters">
<li class="tsd-parameter-signature">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>coords<span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a>, shouldForceUpdate<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">false</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">true</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-parameters-title">Parameters</h4>
<ul class="tsd-parameters">
<li>
<h5>coords: <a href="../interfaces/_grid_.cellinterface.html" class="tsd-signature-type">CellInterface</a></h5>
</li>
<li>
<h5><span class="tsd-flag ts-flagOptional">Optional</span> shouldForceUpdate: <span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">false</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">true</span></h5>
</li>
</ul>
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4>
</li>
</ul>
</li>
</ul>
</li>
<li class="tsd-parameter">
<h5>resize<wbr>Columns<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>indices<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">[]</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span></h5>
<ul class="tsd-parameters">
<li class="tsd-parameter-signature">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>indices<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">[]</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-parameters-title">Parameters</h4>
<ul class="tsd-parameters">
<li>
<h5>indices: <span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">[]</span></h5>
</li>
</ul>
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4>
</li>
</ul>
</li>
</ul>
</li>
<li class="tsd-parameter">
<h5>resize<wbr>Rows<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>indices<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">[]</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span></h5>
<ul class="tsd-parameters">
<li class="tsd-parameter-signature">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>indices<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">[]</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-parameters-title">Parameters</h4>
<ul class="tsd-parameters">
<li>
<h5>indices: <span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">[]</span></h5>
</li>
</ul>
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4>
</li>
</ul>
</li>
</ul>
</li>
<li class="tsd-parameter">
<h5>scroll<wbr>To<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>scrollPosition<span class="tsd-signature-symbol">: </span><a href="_grid_.html#scrollcoords" class="tsd-signature-type">ScrollCoords</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span></h5>
<ul class="tsd-parameters">
<li class="tsd-parameter-signature">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>scrollPosition<span class="tsd-signature-symbol">: </span><a href="_grid_.html#scrollcoords" class="tsd-signature-type">ScrollCoords</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-parameters-title">Parameters</h4>
<ul class="tsd-parameters">
<li>
<h5>scrollPosition: <a href="_grid_.html#scrollcoords" class="tsd-signature-type">ScrollCoords</a></h5>
</li>
</ul>
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4>
</li>
</ul>
</li>
</ul>
</li>
<li class="tsd-parameter">
<h5>scroll<wbr>ToItem<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span>coords<span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.optionalcellinterface.html" class="tsd-signature-type">OptionalCellInterface</a>, align<span class="tsd-signature-symbol">?: </span><a href="../enums/_helpers_.align.html" class="tsd-signature-type">Align</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span></h5>
<ul class="tsd-parameters">
<li class="tsd-parameter-signature">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>coords<span class="tsd-signature-symbol">: </span><a href="../interfaces/_grid_.optionalcellinterface.html" class="tsd-signature-type">OptionalCellInterface</a>, align<span class="tsd-signature-symbol">?: </span><a href="../enums/_helpers_.align.html" class="tsd-signature-type">Align</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-parameters-title">Parameters</h4>
<ul class="tsd-parameters">
<li>
<h5>coords: <a href="../interfaces/_grid_.optionalcellinterface.html" class="tsd-signature-type">OptionalCellInterface</a></h5>
</li>
<li>
<h5><span class="tsd-flag ts-flagOptional">Optional</span> align: <a href="../enums/_helpers_.align.html" class="tsd-signature-type">Align</a></h5>
</li>
</ul>
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4>
</li>
</ul>
</li>
</ul>
</li>
<li class="tsd-parameter">
<h5>stage<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">typeof </span><span class="tsd-signature-type">Stage</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span></h5>
</li>
</ul>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-type-alias tsd-parent-kind-module">
<a name="itemsizer" class="tsd-anchor"></a>
<h3>Item<wbr>Sizer</h3>
<div class="tsd-signature tsd-kind-icon">Item<wbr>Sizer<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-symbol">(</span>index<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">number</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in <a href="https://github.com/rmdort/konva-grid/blob/41d9546/src/Grid.tsx#L205">src/Grid.tsx:205</a></li>
</ul>
</aside>
<div class="tsd-type-declaration">
<h4>Type declaration</h4>
<ul class="tsd-parameters">
<li class="tsd-parameter-signature">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-type-alias">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>index<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-parameters-title">Parameters</h4>
<ul class="tsd-parameters">
<li>
<h5>index: <span class="tsd-signature-type">number</span></h5>
</li>
</ul>
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">number</span></h4>
</li>
</ul>
</li>
</ul>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-type-alias tsd-parent-kind-module">
<a name="mergedcellmap" class="tsd-anchor"></a>
<h3>Merged<wbr>Cell<wbr>Map</h3>
<div class="tsd-signature tsd-kind-icon">Merged<wbr>Cell<wbr>Map<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">Map</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">, </span><a href="../interfaces/_grid_.areaprops.html" class="tsd-signature-type">AreaProps</a><span class="tsd-signature-symbol">></span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in <a href="https://github.com/rmdort/konva-grid/blob/41d9546/src/Grid.tsx#L285">src/Grid.tsx:285</a></li>
</ul>
</aside>
</section>
<section class="tsd-panel tsd-member tsd-kind-type-alias tsd-parent-kind-module tsd-has-type-parameter">
<a name="optional" class="tsd-anchor"></a>
<h3>Optional</h3>
<div class="tsd-signature tsd-kind-icon">Optional<T, K><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">Pick</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">Partial</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">T</span><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">, </span><span class="tsd-signature-type">K</span><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> & </span><span class="tsd-signature-type">Omit</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">T</span><span class="tsd-signature-symbol">, </span><span class="tsd-signature-type">K</span><span class="tsd-signature-symbol">></span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in <a href="https://github.com/rmdort/konva-grid/blob/41d9546/src/Grid.tsx#L178">src/Grid.tsx:178</a></li>
</ul>
</aside>
<h4 class="tsd-type-parameters-title">Type parameters</h4>
<ul class="tsd-type-parameters">
<li>
<h4>T</h4>
</li>
<li>
<h4>K<span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">keyof </span><span class="tsd-signature-type">T</span></h4>
</li>
</ul>
</section>
<section class="tsd-panel tsd-member tsd-kind-type-alias tsd-parent-kind-module">
<a name="optionalscrollcoords" class="tsd-anchor"></a>
<h3>Optional<wbr>Scroll<wbr>Coords</h3>
<div class="tsd-signature tsd-kind-icon">Optional<wbr>Scroll<wbr>Coords<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-symbol">{ </span>scrollLeft<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">; </span>scrollTop<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol"> }</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in <a href="https://github.com/rmdort/konva-grid/blob/41d9546/src/Grid.tsx#L186">src/Grid.tsx:186</a></li>
</ul>
</aside>
<div class="tsd-type-declaration">
<h4>Type declaration</h4>
<ul class="tsd-parameters">
<li class="tsd-parameter">
<h5><span class="tsd-flag ts-flagOptional">Optional</span> scroll<wbr>Left<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">number</span></h5>
</li>
<li class="tsd-parameter">
<h5><span class="tsd-flag ts-flagOptional">Optional</span> scroll<wbr>Top<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">number</span></h5>
</li>
</ul>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-type-alias tsd-parent-kind-module">
<a name="refattribute" class="tsd-anchor"></a>
<h3>Ref<wbr>Attribute</h3>
<div class="tsd-signature tsd-kind-icon">Ref<wbr>Attribute<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-symbol">{ </span>ref<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">React.MutableRefObject</span><span class="tsd-signature-symbol"><</span><a href="_grid_.html#gridref" class="tsd-signature-type">GridRef</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> }</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in <a href="https://github.com/rmdort/konva-grid/blob/41d9546/src/Grid.tsx#L174">src/Grid.tsx:174</a></li>
</ul>
</aside>
<div class="tsd-type-declaration">
<h4>Type declaration</h4>
<ul class="tsd-parameters">
<li class="tsd-parameter">
<h5><span class="tsd-flag ts-flagOptional">Optional</span> ref<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">React.MutableRefObject</span><span class="tsd-signature-symbol"><</span><a href="_grid_.html#gridref" class="tsd-signature-type">GridRef</a><span class="tsd-signature-symbol">></span></h5>
</li>
</ul>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-type-alias tsd-parent-kind-module">
<a name="rendercomponent" class="tsd-anchor"></a>
<h3>Render<wbr>Component</h3>
<div class="tsd-signature tsd-kind-icon">Render<wbr>Component<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">React.FC</span><span class="tsd-signature-symbol"><</span><a href="../interfaces/_grid_.rendererprops.html" class="tsd-signature-type">RendererProps</a><span class="tsd-signature-symbol">></span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in <a href="https://github.com/rmdort/konva-grid/blob/41d9546/src/Grid.tsx#L195">src/Grid.tsx:195</a></li>
</ul>
</aside>
</section>
<section class="tsd-panel tsd-member tsd-kind-type-alias tsd-parent-kind-module">
<a name="scrollcoords" class="tsd-anchor"></a>
<h3>Scroll<wbr>Coords</h3>
<div class="tsd-signature tsd-kind-icon">Scroll<wbr>Coords<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-symbol">{ </span>scrollLeft<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">; </span>scrollTop<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol"> }</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in <a href="https://github.com/rmdort/konva-grid/blob/41d9546/src/Grid.tsx#L181">src/Grid.tsx:181</a></li>
</ul>
</aside>
<div class="tsd-type-declaration">
<h4>Type declaration</h4>
<ul class="tsd-parameters">
<li class="tsd-parameter">
<h5>scroll<wbr>Left<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span></h5>
</li>
<li class="tsd-parameter">
<h5>scroll<wbr>Top<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span></h5>
</li>
</ul>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-type-alias tsd-parent-kind-module">
<a name="stylingprops" class="tsd-anchor"></a>
<h3>Styling<wbr>Props</h3>
<div class="tsd-signature tsd-kind-icon">Styling<wbr>Props<span class="tsd-signature-symbol">:</span> <a href="../interfaces/_grid_.areastyle.html" class="tsd-signature-type">AreaStyle</a><span class="tsd-signature-symbol">[]</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in <a href="https://github.com/rmdort/konva-grid/blob/41d9546/src/Grid.tsx#L287">src/Grid.tsx:287</a></li>
</ul>
</aside>
</section>
</section>
<section class="tsd-panel-group tsd-member-group ">
<h2>Variables</h2>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-module tsd-is-not-exported">
<a name="default_estimated_item_size" class="tsd-anchor"></a>
<h3><span class="tsd-flag ts-flagConst">Const</span> DEFAULT_<wbr>ESTIMATED_<wbr>ITEM_<wbr>SIZE</h3>
<div class="tsd-signature tsd-kind-icon">DEFAULT_<wbr>ESTIMATED_<wbr>ITEM_<wbr>SIZE<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">50</span><span class="tsd-signature-symbol"> = 50</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in <a href="https://github.com/rmdort/konva-grid/blob/41d9546/src/Grid.tsx#L293">src/Grid.tsx:293</a></li>
</ul>
</aside>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-module">
<a name="grid" class="tsd-anchor"></a>
<h3><span class="tsd-flag ts-flagConst">Const</span> Grid</h3>
<div class="tsd-signature tsd-kind-icon">Grid<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">React.FC</span><span class="tsd-signature-symbol"><</span><a href="../interfaces/_grid_.gridprops.html" class="tsd-signature-type">GridProps</a><span class="tsd-signature-symbol"> & </span><a href="_grid_.html#refattribute" class="tsd-signature-type">RefAttribute</a><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol"> = memo(forwardRef<GridRef, GridProps>((props, forwardedRef) => {const {width: containerWidth = 800,height: containerHeight = 600,estimatedColumnWidth,estimatedRowHeight,rowHeight = defaultRowHeight,columnWidth = defaultColumnWidth,rowCount = 0,columnCount = 0,scrollbarSize = 13,onScroll,showScrollbar = true,selectionBackgroundColor = "rgb(14, 101, 235, 0.1)",selectionBorderColor = "#1a73e8",selectionStrokeWidth = 1,activeCellStrokeWidth = 2,activeCell,selections = [],frozenRows = 0,frozenColumns = 0,itemRenderer = defaultItemRenderer,mergedCells = [],snap = false,scrollThrottleTimeout = 100,onViewChange,selectionRenderer = defaultSelectionRenderer,onBeforeRenderRow,showFrozenShadow = true,shadowSettings = defaultShadowSettings,borderStyles = [],children,stageProps,wrapper = (children: React.ReactNode): React.ReactNode => children,...rest} = props;invariant(!(children && typeof children !== "function"),"Children should be a function");/* Expose some methods in ref */useImperativeHandle(forwardedRef, () => {return {scrollTo,scrollToItem,stage: stageRef.current,container: containerRef.current,resetAfterIndices,getScrollPosition,isMergedCell,getCellBounds,getCellCoordsFromOffset,getCellOffsetFromCoords,focus: () => containerRef.current?.focus(),resizeColumns,resizeRows,getViewPort,};});const instanceProps = useRef<InstanceInterface>({co