diff --git a/src/components/Grid/Cell.tsx b/src/components/Grid/Cell.tsx index 41ff093a..c8d0b12d 100644 --- a/src/components/Grid/Cell.tsx +++ b/src/components/Grid/Cell.tsx @@ -59,12 +59,12 @@ export const Cell = memo( const cellRef = useRef(null); useEffect(() => { - if (rowCount !== 1) return; + if (!rowAutoHeight) return; else if (cellRef.current) { const height = cellRef.current.getBoundingClientRect().height; updateRowHeight(rowIndex, height); } - }, [rowCount, updateRowHeight, rowIndex]); + }, [updateRowHeight, rowIndex, rowAutoHeight]); const styleWithHeight = { ...style, diff --git a/src/components/Grid/Grid.test.tsx b/src/components/Grid/Grid.test.tsx index 89a9ac6e..4ddcc0d9 100644 --- a/src/components/Grid/Grid.test.tsx +++ b/src/components/Grid/Grid.test.tsx @@ -2,7 +2,6 @@ import { CellProps, Grid, GridProps } from "@/components"; import { renderCUI } from "@/utils/test-utils"; import { SelectionFocus } from "./types"; import { ReactNode } from "react"; -import { act } from "react-dom/test-utils"; const Cell: CellProps = ({ type, rowIndex, columnIndex, isScrolling, ...props }) => { let content = `${rowIndex} ${columnIndex} - ${type}`; diff --git a/src/components/Grid/Grid.tsx b/src/components/Grid/Grid.tsx index 017e7eab..8fa695d2 100644 --- a/src/components/Grid/Grid.tsx +++ b/src/components/Grid/Grid.tsx @@ -227,8 +227,7 @@ export const Grid = forwardRef( const updateRowHeight = useCallback( (rowIndex: number, height: number) => { - if (rowCount !== 1) return; - + if (!rowAutoHeight) return; const prevHeight = rowHeightsRef.current.get(rowIndex) ?? 0; if (height > prevHeight) { rowHeightsRef.current.set(rowIndex, height); @@ -237,7 +236,7 @@ export const Grid = forwardRef( } } }, - [rowCount] + [rowAutoHeight] ); const customOnCopy: () => Promise = useMemo(() => { diff --git a/src/components/Grid/Header.tsx b/src/components/Grid/Header.tsx index 4725e972..32b5a9de 100644 --- a/src/components/Grid/Header.tsx +++ b/src/components/Grid/Header.tsx @@ -153,7 +153,6 @@ const Column = ({ $isLastRow={false} $isFirstRow $height={height} - $overflow="hidden" data-grid-row={-1} data-grid-column={columnIndex} data-selected={isSelected} diff --git a/src/components/Grid/RowNumberColumn.tsx b/src/components/Grid/RowNumberColumn.tsx index 12c00d0e..8c39cc4c 100644 --- a/src/components/Grid/RowNumberColumn.tsx +++ b/src/components/Grid/RowNumberColumn.tsx @@ -103,7 +103,6 @@ const RowNumber = ({ $isSelectedLeft={isSelected} $isSelectedTop={isSelectedTop} $rowAutoHeight={rowAutoHeight} - $overflow="hidden" data-selected={isSelected} data-grid-row={currentRowIndex} data-grid-column={-1} diff --git a/src/components/Grid/StyledCell.tsx b/src/components/Grid/StyledCell.tsx index b3c2a5fb..975cfdee 100644 --- a/src/components/Grid/StyledCell.tsx +++ b/src/components/Grid/StyledCell.tsx @@ -14,7 +14,6 @@ export const StyledCell = styled.div<{ $type?: "body" | "header"; $showBorder: boolean; $rowAutoHeight?: boolean; - $overflow?: string; }>` display: block; text-align: left; @@ -37,11 +36,10 @@ export const StyledCell = styled.div<{ $type = "body", $showBorder, $rowAutoHeight, - $overflow, }) => ` height: ${$rowAutoHeight ? "100%" : `${$height}px`}; min-height: ${$rowAutoHeight ? "auto" : ""}; - overflow-y: ${$overflow ? $overflow : "auto"}; + overflow-y: ${$rowAutoHeight ? "auto" : ""}; background: ${theme.click.grid[$type].cell.color.background[$selectionType]}; color: ${ $type === "header"