[IndexTable] Don't trigger onSelectionChange() on edges of disabled c…

…heckbox
Shopify · Apr 22, 2024 · a83084b · a83084b
1 parent 1539f0e
commit a83084b
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 2 deletions.
diff --git a/.changeset/breezy-ghosts-pay.md b/.changeset/breezy-ghosts-pay.md
@@ -0,0 +1,5 @@
+---
+'@shopify/polaris': patch
+---
+
+Fixed edges of disabled `IndexTable.Row` `Checkbox` triggering selection
diff --git a/polaris-react/src/components/IndexTable/components/Row/Row.tsx b/polaris-react/src/components/IndexTable/components/Row/Row.tsx
@@ -71,7 +71,13 @@ export const Row = memo(function Row({
       event.stopPropagation();
       let selectionType = SelectionType.Single;
 
-      if (('key' in event && event.key !== ' ') || !onSelectionChange) return;
+      if (
+        disabled ||
+        !selectable ||
+        ('key' in event && event.key !== ' ') ||
+        !onSelectionChange
+      )
+        return;
 
       if (event.nativeEvent.shiftKey) {
         selectionType = SelectionType.Multi;
@@ -82,7 +88,15 @@ export const Row = memo(function Row({
       const selection: string | Range = selectionRange ?? id;
       onSelectionChange(selectionType, !selected, selection, position);
     },
-    [id, onSelectionChange, selected, selectionRange, position],
+    [
+      id,
+      onSelectionChange,
+      selected,
+      selectionRange,
+      position,
+      disabled,
+      selectable,
+    ],
   );
 
   const contextValue = useMemo(