@linzjs/step-ag-grid 27.2.3 → 27.3.1

package/package.json

@@ -2,7 +2,7 @@
   "name": "@linzjs/step-ag-grid",
   "repository": "github:linz/step-ag-grid.git",
   "license": "MIT",
-  "version": "27.2.3",
+  "version": "27.3.1",
   "keywords": [
     "aggrid",
     "ag-grid",

package/src/components/Grid.tsx

@@ -50,6 +50,8 @@ export interface GridProps<TData extends GridBaseRow = GridBaseRow> {
   readOnly?: boolean; // set all editables to false when read only, make all styles black, otherwise style is gray for not editable
   defaultPostSort?: boolean; // Retain sort order after edit, Defaults to true.
   selectable?: boolean;
+  enableClickSelection?: boolean;
+  enableSelectionWithoutKeys?: boolean;
   hideSelectColumn?: boolean;
   theme?: string; // should have prefix ag-theme-
   ['data-testid']?: string;
@@ -668,7 +670,8 @@ export const Grid = <TData extends GridBaseRow = GridBaseRow>({
           rowSelection={
             selectable
               ? {
-                  enableClickSelection: false,
+                  enableSelectionWithoutKeys: params.enableSelectionWithoutKeys ?? false,
+                  enableClickSelection: params.enableClickSelection ?? false,
                   mode: rowSelection == 'single' ? 'singleRow' : 'multiRow',
                 }
               : undefined
@@ -747,7 +750,10 @@ export const Grid = <TData extends GridBaseRow = GridBaseRow>({
               }
               return false;
             },
-            onCellClicked: clickInputWhenContainingCellClicked,
+            onCellClicked:
+              params.enableSelectionWithoutKeys || params.enableClickSelection
+                ? undefined
+                : clickInputWhenContainingCellClicked,
           }}
         />
       </div>

package/src/components/clickInputWhenContainingCellClicked.tsx

@@ -28,9 +28,11 @@ export const clickInputWhenContainingCellClicked = (params: CellClickedEvent) =>
     if (!cell) return;
 
     const input = cell.querySelector('input, button');
-    if (!input) return;
+    if (!input) {
+      return;
+    }
 
-    input?.dispatchEvent(event);
+    input.dispatchEvent(event);
   };
 
   setTimeout(clickInput, 20);

package/src/stories/grid/GridReadOnly.stories.tsx

@@ -244,6 +244,8 @@ const GridReadOnlyTemplate: StoryFn<typeof Grid> = (props: GridProps) => {
         data-testid={'readonly'}
         {...props}
         selectable={true}
+        enableClickSelection={true}
+        enableSelectionWithoutKeys={true}
         autoSelectFirstRow={true}
         externalSelectedItems={externalSelectedItems}
         setExternalSelectedItems={setExternalSelectedItems}