UPDATE: Select multiple columns/rows

Also fixed a bug where a second column would not pick up salyes correctly

base/src/test/user_model/test_column_style.rs

@@ -455,3 +455,50 @@ fn column_style_then_width() {
         DEFAULT_COLUMN_WIDTH * 2.0
     );
 }
+
+#[test]
+fn test_row_column_column() {
+    let mut model = UserModel::new_empty("model", "en", "UTC").unwrap();
+
+    let column_c_range = Area {
+        sheet: 0,
+        row: 1,
+        column: 3,
+        width: 1,
+        height: LAST_ROW,
+    };
+
+    let column_e_range = Area {
+        sheet: 0,
+        row: 1,
+        column: 5,
+        width: 1,
+        height: LAST_ROW,
+    };
+
+    let row_5_range = Area {
+        sheet: 0,
+        row: 5,
+        column: 1,
+        width: LAST_COLUMN,
+        height: 1,
+    };
+
+    // update the row style
+    model
+        .update_range_style(&row_5_range, "fill.bg_color", "#333444")
+        .unwrap();
+
+    // update the column style
+    model
+        .update_range_style(&column_c_range, "fill.bg_color", "#555666")
+        .unwrap();
+
+    model
+        .update_range_style(&column_e_range, "fill.bg_color", "#CCC111")
+        .unwrap();
+
+    // test E5 has the column style
+    let style = model.get_cell_style(0, 5, 5).unwrap();
+    assert_eq!(style.fill.bg_color, Some("#CCC111".to_string()));
+}

base/src/user_model/common.rs

@@ -1156,6 +1156,19 @@ impl UserModel {
                     new_value: Box::new(style),
                 });
 
+                // We need to update the styles in all cells that have a row style
+                for row_s in styled_rows.iter() {
+                    let row = row_s.r;
+                    self.update_single_cell_style(
+                        sheet,
+                        row,
+                        column,
+                        style_path,
+                        value,
+                        &mut diff_list,
+                    )?;
+                }
+
                 // Update style in all cells that have different styles
                 // FIXME: We need a better way to transverse of cells in a column
                 for &row in &data_rows {
@@ -1175,22 +1188,6 @@ impl UserModel {
                         }
                     }
                 }
-                // We need to update the styles in all cells that have a row style
-                for row_s in styled_rows.iter() {
-                    let row = row_s.r;
-                    if data_rows.contains(&row) {
-                        // Skip if the row has data
-                        continue;
-                    }
-                    self.update_single_cell_style(
-                        sheet,
-                        row,
-                        column,
-                        style_path,
-                        value,
-                        &mut diff_list,
-                    )?;
-                }
             }
         } else if range.column == 1 && range.width == LAST_COLUMN {
             // Full rows

webapp/IronCalc/src/components/usePointer.ts

@@ -15,8 +15,8 @@ interface PointerSettings {
   worksheetCanvas: RefObject<WorksheetCanvas | null>;
   worksheetElement: RefObject<HTMLDivElement | null>;
   onCellSelected: (cell: Cell, event: React.MouseEvent) => void;
-  onRowSelected: (row: number) => void;
+  onRowSelected: (row: number, shift: boolean) => void;
-  onColumnSelected: (column: number) => void;
+  onColumnSelected: (column: number, shift: boolean) => void;
   onAllSheetSelected: () => void;
   onAreaSelecting: (cell: Cell) => void;
   onAreaSelected: () => void;
@@ -161,7 +161,7 @@ const usePointer = (options: PointerSettings): PointerEvents => {
           // Click on a row number
           const cell = worksheet.getCellByCoordinates(headerColumnWidth, y);
           if (cell) {
-            onRowSelected(cell.row);
+            onRowSelected(cell.row, event.shiftKey);
           }
         } else if (
           x > headerColumnWidth &&
@@ -172,7 +172,7 @@ const usePointer = (options: PointerSettings): PointerEvents => {
           // Click on a column letter
           const cell = worksheet.getCellByCoordinates(x, headerRowHeight);
           if (cell) {
-            onColumnSelected(cell.column);
+            onColumnSelected(cell.column, event.shiftKey);
           }
         }
         return;

webapp/IronCalc/src/components/worksheet.tsx

@@ -112,14 +112,36 @@ function Worksheet(props: {
         if (width < 0) {
           return;
         }
-        model.setColumnWidth(sheet, column, width);
+        // if the column is one of the selected columns, we need to update the width of all selected columns
+        // FIXME: This is a bit of a hack, we should probably have a separate function for this
+        const { range } = model.getSelectedView();
+        if (column >= range[1] && column <= range[3]) {
+          model.setColumnWidth(sheet, column, width);
+          for (let i = range[1]; i <= range[3]; i++) {
+            if (i !== column) {
+              model.setColumnWidth(sheet, i, width);
+            }
+          }
+        } else {
+          model.setColumnWidth(sheet, column, width);
+        }
         worksheetCanvas.current?.renderSheet();
       },
       onRowHeightChanges(sheet, row, height) {
         if (height < 0) {
           return;
         }
-        model.setRowHeight(sheet, row, height);
+        const { range } = model.getSelectedView();
+        if (row >= range[0] && row <= range[2]) {
+          model.setRowHeight(sheet, row, height);
+          for (let i = range[0]; i <= range[2]; i++) {
+            if (i !== row) {
+              model.setRowHeight(sheet, i, height);
+            }
+          }
+        } else {
+          model.setRowHeight(sheet, row, height);
+        }
         worksheetCanvas.current?.renderSheet();
       },
     });
@@ -157,14 +179,28 @@ function Worksheet(props: {
       model,
       workbookState,
       refresh,
-      onColumnSelected: (column: number) => {
+      onColumnSelected: (column: number, shift: boolean) => {
-        model.setSelectedCell(1, column);
+        let firstColumn = column;
-        model.setSelectedRange(1, column, LAST_ROW, column);
+        let lastColumn = column;
+        if (shift) {
+          const { range } = model.getSelectedView();
+          firstColumn = Math.min(range[1], column, range[3]);
+          lastColumn = Math.max(range[3], column, range[1]);
+        }
+        model.setSelectedCell(1, firstColumn);
+        model.setSelectedRange(1, firstColumn, LAST_ROW, lastColumn);
         refresh();
       },
-      onRowSelected: (row: number) => {
+      onRowSelected: (row: number, shift: boolean) => {
-        model.setSelectedCell(row, 1);
+        let firstRow = row;
-        model.setSelectedRange(row, 1, row, LAST_COLUMN);
+        let lastRow = row;
+        if (shift) {
+          const { range } = model.getSelectedView();
+          firstRow = Math.min(range[0], row, range[2]);
+          lastRow = Math.max(range[2], row, range[0]);
+        }
+        model.setSelectedCell(firstRow, 1);
+        model.setSelectedRange(firstRow, 1, lastRow, LAST_COLUMN);
         refresh();
       },
       onAllSheetSelected: () => {
@@ -326,7 +362,7 @@ function Worksheet(props: {
           Math.min(rowStart, extendedArea.rowStart),
           Math.min(columnStart, extendedArea.columnStart),
           Math.max(rowStart + height - 1, extendedArea.rowEnd),
-          Math.max(columnStart + width - 1, extendedArea.columnEnd),
+          Math.max(columnStart + width - 1, extendedArea.columnEnd)
         );
         workbookState.clearExtendToArea();
         canvas.renderSheet();