mui · flaviendelangle · Oct 5, 2021 · Aug 26, 2021 · Aug 26, 2021 · Aug 27, 2021
diff --git a/docs/pages/api-docs/data-grid/grid-api.md b/docs/pages/api-docs/data-grid/grid-api.md
@@ -55,8 +55,8 @@ import { GridApi } from '@mui/x-data-grid-pro';
 | <span class="prop-name">hideFilterPanel</span>         | <span class="prop-type">() =&gt; void</span>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | Hides the filter panel.                                                                                                                                        |
 | <span class="prop-name">hidePreferences</span>         | <span class="prop-type">() =&gt; void</span>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | Hides the preferences panel.                                                                                                                                   |
 | <span class="prop-name">isCellEditable</span>          | <span class="prop-type">(params: GridCellParams) =&gt; boolean</span>                                                                                                                                                                                                                                                                                                                                                                                                                                                                           | Controls if a cell is editable.                                                                                                                                |
-| <span class="prop-name">isRowSelected</span>           | <span class="prop-type">(id: GridRowId) =&gt; boolean</span>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | Returns the current selection status of a row                                                                                                                  |
-| <span class="prop-name">publishEvent</span>            | <span class="prop-type">(name: string, params?: any, event?: MuiEvent&lt;MouseEvent \| UIEvent \| Event \| SyntheticEvent&lt;Element, Event&gt; \| ClipboardEvent \| ProgressEvent&lt;EventTarget&gt; \| ErrorEvent \| AnimationEvent \| InputEvent \| FocusEvent \| CompositionEvent \| DragEvent \| FormDataEvent \| PointerEvent \| KeyboardEvent \| SecurityPolicyViolationEvent \| TouchEvent \| TransitionEvent \| WheelEvent&gt;) =&gt; void</span>                                                                                      | Emits an event.                                                                                                                                                |
+| <span class="prop-name">isRowSelected</span>           | <span class="prop-type">(id: GridRowId) =&gt; boolean</span>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | Determines if a row is selected or not.                                                                                                                        |
+| <span class="prop-name">publishEvent</span>            | <span class="prop-type">(name: string, params?: any, event?: MuiEvent&lt;MouseEvent \| UIEvent \| Event \| SyntheticEvent&lt;Element, Event&gt; \| ProgressEvent&lt;EventTarget&gt; \| ClipboardEvent \| ErrorEvent \| AnimationEvent \| InputEvent \| FocusEvent \| CompositionEvent \| DragEvent \| FormDataEvent \| PointerEvent \| KeyboardEvent \| SecurityPolicyViolationEvent \| TouchEvent \| TransitionEvent \| WheelEvent&gt;) =&gt; void</span>                                                                                      | Emits an event.                                                                                                                                                |
 | <span class="prop-name">resize</span>                  | <span class="prop-type">() =&gt; void</span>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | Triggers a resize of the component and recalculation of width and height.                                                                                      |
 | <span class="prop-name">scroll</span>                  | <span class="prop-type">(params: Partial&lt;GridScrollParams&gt;) =&gt; void</span>                                                                                                                                                                                                                                                                                                                                                                                                                                                             | Triggers the viewport to scroll to the given positions (in pixels).                                                                                            |
 | <span class="prop-name">scrollToIndexes</span>         | <span class="prop-type">(params: Partial&lt;GridCellIndexCoordinates&gt;) =&gt; boolean</span>                                                                                                                                                                                                                                                                                                                                                                                                                                                  | Triggers the viewport to scroll to the cell at indexes given by `params`.<br />Returns `true` if the grid had to scroll to reach the target.                   |

diff --git a/docs/pages/api-docs/data-grid/grid-selection-api.json b/docs/pages/api-docs/data-grid/grid-selection-api.json
@@ -9,7 +9,7 @@
     },
     {
       "name": "isRowSelected",
-      "description": "Returns the current selection status of a row",
+      "description": "Determines if a row is selected or not.",
       "type": "(id: GridRowId) => boolean"
     },
     {

diff --git a/packages/grid/_modules_/grid/components/GridViewport.tsx b/packages/grid/_modules_/grid/components/GridViewport.tsx
@@ -73,7 +73,7 @@ export const GridViewport: ViewportType = React.forwardRef<HTMLDivElement, {}>(
         <GridRow
           key={id}
           id={id}
-          selected={!!selectionLookup.get(id)}
+          selected={selectionLookup[id] !== undefined}
           rowIndex={renderState.renderContext!.firstRowIdx! + idx}
         >
           <GridEmptyCell width={renderState.renderContext!.leftEmptyWidth} height={rowHeight} />

diff --git a/packages/grid/_modules_/grid/hooks/features/keyboard/useGridKeyboard.ts b/packages/grid/_modules_/grid/hooks/features/keyboard/useGridKeyboard.ts
@@ -67,7 +67,11 @@ export const useGridKeyboard = (apiRef: GridApiRef): void => {
 
       if (isSpaceKey(event.key) && event.shiftKey) {
         event.preventDefault();
-        apiRef.current.selectRow(cellParams.id, undefined, false);
+        apiRef.current.selectRow(
+          cellParams.id,
+          !apiRef.current.isRowSelected(cellParams.id),
+          false,
+        );
         return;
       }
 

diff --git a/packages/grid/_modules_/grid/hooks/features/selection/useGridSelection.ts b/packages/grid/_modules_/grid/hooks/features/selection/useGridSelection.ts
@@ -179,7 +179,9 @@ export const useGridSelection = (apiRef: GridApiRef, props: GridComponentProps):
 
         event.stopPropagation();
       } else {
-        const resetSelection = !canHaveMultipleSelection || (!hasCtrlKey && !checkboxSelection);
+        // Without checkboxSelection, multiple selection is only allowed if CTRL is pressed
+        const isMultipleSelectionDisabled = !checkboxSelection && !hasCtrlKey;
+        const resetSelection = !canHaveMultipleSelection || isMultipleSelectionDisabled;
 
         if (resetSelection) {
           apiRef.current.selectRow(
@@ -194,7 +196,13 @@ export const useGridSelection = (apiRef: GridApiRef, props: GridComponentProps):
 
       lastRowToggledByClick.current = params.id;
     },
-    [apiRef, checkboxSelection, canHaveMultipleSelection, disableSelectionOnClick, checkboxSelection],
+    [
+      apiRef,
+      checkboxSelection,
+      canHaveMultipleSelection,
+      disableSelectionOnClick,
+      checkboxSelection,
+    ],
   );
 
   useGridApiEventHandler(apiRef, GridEvents.rowClick, handleRowClick);

diff --git a/packages/grid/_modules_/grid/models/api/gridSelectionApi.ts b/packages/grid/_modules_/grid/models/api/gridSelectionApi.ts
@@ -6,7 +6,7 @@ import { GridRowId, GridRowModel } from '../gridRows';
 export interface GridSelectionApi {
   /**
    * Change the selection state of a row.
-   * @param {GridRowId} id The id of the row
+   * @param {GridRowId} id The id of the row.
    * @param {boolean} isSelected Pass `false` to unselect a row. Default is `true`.
    * @param {boolean} resetSelection Whether to reset the already selected rows or not. Default is `false`.
    */
@@ -32,8 +32,8 @@ export interface GridSelectionApi {
     resetSelection?: boolean,
   ) => void;
   /**
-   * Returns the current selection status of a row
-   * @param {GridRowId} id The id of the row
+   * Determines if a row is selected or not.
+   * @param {GridRowId} id The id of the row.
    * @returns {boolean} A boolean indicating if the row is selected.
    */
   isRowSelected: (id: GridRowId) => boolean;

diff --git a/packages/grid/data-grid/src/tests/selection.DataGrid.test.tsx b/packages/grid/data-grid/src/tests/selection.DataGrid.test.tsx
@@ -141,11 +141,31 @@ describe('<DataGrid /> - Selection', () => {
         />,
       );
 
-      // TODO: ID 1 should not be selected
-      // expect(getSelectedRowIndexes()).to.deep.equal([0]);
-      // TODO: ID 1 and 3 should not be selected
-      // setProps({ selectionModel: [0, 1, 2, 3] });
-      // expect(getSelectedRowIndexes()).to.deep.equal([0, 2])
+      expect(getSelectedRowIndexes()).to.deep.equal([0]);
+      setProps({ selectionModel: [0, 1, 2, 3] });
+      expect(getSelectedRowIndexes()).to.deep.equal([0, 2]);
+    });
+
+    it('should filter out unselectable rows when the selectionModel prop changes', () => {
+      const { setProps } = render(
+        <TestDataGridSelection
+          selectionModel={[1]}
+          isRowSelectable={(params) => params.id > 0}
+          checkboxSelection
+        />,
+      );
+      expect(getSelectedRowIndexes()).to.deep.equal([1]);
+      expect(getColumnHeaderCell(0).querySelector('input')).to.have.attr(
+        'data-indeterminate',
+        'true',
+      );
+
+      setProps({ selectionModel: [0] });
+      expect(getColumnHeaderCell(0).querySelector('input')).to.have.attr(
+        'data-indeterminate',
+        'false',
+      );
+      expect(getSelectedRowIndexes()).to.deep.equal([]);
     });
   });
 

diff --git a/packages/grid/x-grid/src/tests/selection.DataGridPro.test.tsx b/packages/grid/x-grid/src/tests/selection.DataGridPro.test.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { getColumnValues, getSelectedRowIndexes } from 'test/utils/helperFn';
+import { getColumnValues, getRow, getSelectedRowIndexes } from 'test/utils/helperFn';
 import {
   // @ts-expect-error need to migrate helpers to TypeScript
   screen,