react-spreadsheet icon indicating copy to clipboard operation
react-spreadsheet copied to clipboard

Autofill Handle

Open iddan opened this issue 2 years ago • 2 comments

This PR introduces an Excel-style auto-fill handle and a modular auto-fill architecture that intelligently detects and continues patterns when dragging.

What's New

Auto-Fill Handle

  • Small draggable handle appears on the bottom-right corner of selected cells
  • Drag to fill cells with smart pattern continuation
  • Visual feedback with dashed border during auto-fill operation

Architecture

The auto-fill system uses a plugin-based architecture with specialized pattern matchers:

src/auto-fill/
├── auto-fill-range.ts      # Main orchestrator
├── types.ts                 # Core AutoFiller interface
├── numeric.ts               # Numeric patterns (1, 2, 3...)
├── text-with-number.ts      # Text with numbers (Task 1 → Task 2)
├── date.ts                  # Days/months lists
├── formula.ts               # Formula reference updating
└── general.ts               # Fallback (repeating values)

How it works:

  1. Pattern Detection: When auto-fill ends, the system checks the selected cells against each auto-filler
  2. Priority Order: More specific patterns (formulas, numbers) are checked before general ones (repeating)
  3. Value Generation: The matched auto-filler generates values for empty cells based on the detected pattern

Supported Patterns:

  • ✅ Formulas with relative/absolute references (=A1=A2, =$A$1 stays =$A$1)
  • ✅ Numeric sequences (1, 2, 3... or 10, 5, 0...)
  • ✅ Text with numbers (Task 1 → Task 2, Item 001 → Item 002)
  • ✅ Days of week (Monday → Tuesday → Wednesday)
  • ✅ Months (January → February, Jan → Feb)
  • ✅ Repeating values (fallback)

Feature Coverage

32 passing tests covering all pattern types and edge cases including formula updates, case preservation, and wrapping behavior. Missing cases are highlighted with .skip()

Todo

  • [ ] Fix dragging back to single cell
  • [ ] Separate between the selected and auto-filled ranges, and update auto-fillter accordingly
  • [ ] Limit autofill drag to a single axis
  • [ ] Implement all autofill behaviours

iddan avatar Jun 13 '23 13:06 iddan

Hi! Are you planning to merge this PR?

andrewLapshov avatar Sep 02 '24 14:09 andrewLapshov

Hi! Are you planning to merge this PR?

Wondering the same. Are you planning to merge this PR?

sandzone avatar Oct 24 '24 16:10 sandzone