Merge pull request #61358 from abzokhattab/fix-distance-rate-multiselect-v2

Author: blimpich

src/components/SelectionList/BaseSelectionList.tsx

@@ -129,6 +129,7 @@ function BaseSelectionList<TItem extends ListItem>(
         shouldDebounceScrolling = false,
         shouldPreventActiveCellVirtualization = false,
         shouldScrollToFocusedIndex = true,
+        isSmallScreenWidth,
         onContentSizeChange,
         listItemTitleStyles,
         initialNumToRender = 12,
@@ -413,6 +414,11 @@ function BaseSelectionList<TItem extends ListItem>(
 
                 if (shouldShowTextInput) {
                     clearInputAfterSelect();
+                } else if (isSmallScreenWidth) {
+                    if (!item.isDisabledCheckbox) {
+                        onCheckboxPress?.(item);
+                    }
+                    return;
                 }
             }
 
@@ -438,6 +444,8 @@ function BaseSelectionList<TItem extends ListItem>(
             shouldPreventDefaultFocusOnSelectRow,
             isFocused,
             isScreenFocused,
+            isSmallScreenWidth,
+            onCheckboxPress,
         ],
     );
 

src/components/SelectionList/types.ts

@@ -716,6 +716,9 @@ type SelectionListProps<TItem extends ListItem> = Partial<ChildrenProps> & {
     /** Whether to scroll to the focused index */
     shouldScrollToFocusedIndex?: boolean;
 
+    /** Whether the layout is narrow */
+    isSmallScreenWidth?: boolean;
+
     /** Called when scrollable content view of the ScrollView changes */
     onContentSizeChange?: (w: number, h: number) => void;
 

src/components/SelectionListWithModal/index.tsx

@@ -115,6 +115,7 @@ function SelectionListWithModal<TItem extends ListItem>(
                 sections={sections}
                 onLongPressRow={handleLongPressRow}
                 isScreenFocused={isScreenFocused}
+                isSmallScreenWidth={isSmallScreenWidth}
                 // eslint-disable-next-line react/jsx-props-no-spreading
                 {...rest}
             />