Table Selection: Implement Multi-Cell Range Selection Logic for a Spreadsheet-Like Grid

Question

## Round 1 - Coding (Frontend)

## Problem

Implement the selection logic for a spreadsheet grid. Support:

- `select_cell(row, col)` — single cell selection, clears previous.
- `extend_selection(row, col)` — extend selection from anchor to `(row, col)` (shift+click behavior).
- `toggle_cell(row, col)` — add/remove a cell from selection (ctrl+click).
- `get_selected_cells() -> set[tuple[int,int]]` — return all currently selected cells.
- `get_selection_bounds() -> tuple[int,int,int,int]` — return `(min_row, min_col, max_row, max_col)` of selection.

```python
class TableSelection:
    def select_cell(self, row: int, col: int) -> None: ...
    def extend_selection(self, row: int, col: int) -> None: ...
    def toggle_cell(self, row: int, col: int) -> None: ...
    def get_selected_cells(self) -> set[tuple[int,int]]: ...
```

```
select_cell(0,0)           # selected: {(0,0)}, anchor=(0,0)
extend_selection(2,2)       # selected: full 3x3 block (0,0)-(2,2)
toggle_cell(1,1)            # deselect center; selected: 8 border cells
get_selection_bounds()      # -> (0,0,2,2)
```

## Follow-ups

1. `extend_selection` fills a rectangular block. How do you enumerate all cells in that block efficiently?
2. How does keyboard navigation (arrow keys + shift) map to your API?
3. What if the grid has 1 million rows? How do you represent a large contiguous selection without storing every cell?
4. Describe how you would serialize the selection state for copy-paste operations.

Table Selection: Implement Multi-Cell Range Selection Logic for a Spreadsheet-Like Grid

Interview Experience

Full Details

About This Question

Topics

More Figma Interview Questions