react-data-grid icon indicating copy to clipboard operation
react-data-grid copied to clipboard

Expose unselectCell on DataGrid handle

Open marcellofuschi opened this issue 1 month ago • 3 comments

Working with DataGrid I found myself needing to unselect the selected cell (when the user moves focus to an external element)

marcellofuschi avatar Dec 06 '25 12:12 marcellofuschi

:warning: Please install the 'codecov app svg image' to ensure uploads and comments are reliably processed by Codecov.

Codecov Report

:x: Patch coverage is 0% with 3 lines in your changes missing coverage. Please review. :white_check_mark: Project coverage is 97.09%. Comparing base (17d564b) to head (0135d78).

Files with missing lines Patch % Lines
src/DataGrid.tsx 0.00% 3 Missing :warning:
Additional details and impacted files
@@            Coverage Diff             @@
##             main    #3927      +/-   ##
==========================================
- Coverage   97.34%   97.09%   -0.25%     
==========================================
  Files          36       36              
  Lines        1169     1172       +3     
  Branches      345      345              
==========================================
  Hits         1138     1138              
- Misses         31       34       +3     
Files with missing lines Coverage Δ
src/DataGrid.tsx 98.10% <0.00%> (-0.71%) :arrow_down:
:rocket: New features to boost your workflow:
  • :snowflake: Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • :package: JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

codecov-commenter avatar Dec 06 '25 12:12 codecov-commenter

The selection outline persists even when the cell is not focused. We can do the following to show the outline only on focused cells? Does that work for you or the intention is to actually clear the selected position?

<DataGrid className="my-class" ../>

.my-class {
  .rdg-cell[aria-selected='true'] {
    outline: none;
  }

  .rdg-cell:focus {
    outline: var(--rdg-selection-width) solid var(--rdg-selection-color);
  }
} 

https://github.com/Comcast/react-data-grid/blob/main/src/style/cell.ts#L25

amanmahajan7 avatar Dec 08 '25 16:12 amanmahajan7

The intention is to clear the selected position because we base some other UI behavior on the selected cell, and when not focused we'd like to avoid triggering that behavior

marcellofuschi avatar Dec 10 '25 09:12 marcellofuschi