Merge branch 'canary' into ts42

Author: nstepien

src/Cell.tsx

@@ -1,9 +1,8 @@
-import { forwardRef, memo, useRef } from 'react';
+import { forwardRef, memo } from 'react';
 import clsx from 'clsx';
 
 import type { CellRendererProps } from './types';
 import { getCellStyle, wrapEvent } from './utils';
-import { useCombinedRefs } from './hooks';
 
 function Cell<R, SR>({
   className,
@@ -24,8 +23,6 @@ function Cell<R, SR>({
   selectRow,
   ...props
 }: CellRendererProps<R, SR>, ref: React.Ref<HTMLDivElement>) {
-  const cellRef = useRef<HTMLDivElement>(null);
-
   const { cellClass } = column;
   className = clsx(
     'rdg-cell',
@@ -70,7 +67,7 @@ function Cell<R, SR>({
       role="gridcell"
       aria-colindex={column.idx + 1} // aria-colindex is 1-based
       aria-selected={isCellSelected}
-      ref={useCombinedRefs(cellRef, ref)}
+      ref={ref}
       className={className}
       style={getCellStyle(column)}
       onClick={wrapEvent(handleClick, onClick)}

src/hooks/index.ts

@@ -1,4 +1,3 @@
-export * from './useCombinedRefs';
 export * from './useClickOutside';
 export * from './useGridDimensions';
 export * from './useViewportColumns';

stories/demos/AllFeatures.tsx

@@ -1,7 +1,7 @@
 import faker from 'faker';
-import { useState, useRef } from 'react';
+import { useState } from 'react';
 import DataGrid, { SelectColumn, TextEditor } from '../../src';
-import type { Column, DataGridHandle, FillEvent, PasteEvent } from '../../src';
+import type { Column, FillEvent, PasteEvent } from '../../src';
 import DropDownEditor from './components/Editors/DropDownEditor';
 import { ImageFormatter } from './components/Formatters';
 
@@ -184,7 +184,6 @@ export function AllFeatures() {
   const [rows, setRows] = useState(() => createRows(2000));
   const [selectedRows, setSelectedRows] = useState(() => new Set<React.Key>());
   const [isLoading, setIsLoading] = useState(false);
-  const gridRef = useRef<DataGridHandle>(null);
 
   function handleFill({ columnKey, sourceRow, targetRows }: FillEvent<Row>): Row[] {
     return targetRows.map(row => ({ ...row, [columnKey as keyof Row]: sourceRow[columnKey as keyof Row] }));
@@ -216,7 +215,6 @@ export function AllFeatures() {
   return (
     <div className="all-features">
       <DataGrid
-        ref={gridRef}
         columns={columns}
         rows={rows}
         rowKeyGetter={rowKeyGetter}

stories/demos/components/HeaderRenderers/DraggableHeaderRenderer.tsx

@@ -3,7 +3,7 @@ import type { DragObjectWithType } from 'react-dnd';
 
 import { SortableHeaderCell } from '../../../../src';
 import type { HeaderRendererProps } from '../../../../src';
-import { useCombinedRefs } from '../../../../src/hooks';
+import { useCombinedRefs } from '../../../useCombinedRefs';
 
 interface ColumnDragObject extends DragObjectWithType {
   key: string;

stories/demos/components/RowRenderers/DraggableRowRenderer.tsx

@@ -4,7 +4,7 @@ import clsx from 'clsx';
 
 import { Row } from '../../../../src';
 import type { RowRendererProps } from '../../../../src';
-import { useCombinedRefs } from '../../../../src/hooks';
+import { useCombinedRefs } from '../../../useCombinedRefs';
 
 import './DraggableRowRenderer.less';