feat: autocomplete borders (#548)

src/grid/controller/runners/setBorderRunner.ts

@@ -13,8 +13,11 @@ export const SetBorderRunner = (sheet: Sheet, statement: Statement, app?: PixiAp
   reverse_statement.data.border = sheet.borders.get(statement.data.position[0], statement.data.position[1]);
 
   // set border
-  if (border === undefined) sheet.borders.clear([{ x: statement.data.position[0], y: statement.data.position[1] }]);
-  else sheet.borders.update([border]);
+  if (border === undefined || (!border.horizontal && !border.vertical)) {
+    sheet.borders.clear([{ x: statement.data.position[0], y: statement.data.position[1] }]);
+  } else {
+    sheet.borders.update([border]);
+  }
 
   // return reverse statement
   return reverse_statement;

src/grid/sheet/CellRectangle.ts

@@ -19,11 +19,26 @@ export class CellRectangle {
     this.cells = cells;
   }
 
-  addBorders(gridBorders: GridBorders): void {
-    this.borders = gridBorders.getBorders(this.size);
+  /**
+   * adds a simple list of borders in the CellRectangle's cells (does not create a full array like cells for now)
+   * @param gridBorders
+   * @param extend - extends borders one to the right and one down (to cover "neighboring" border)
+   */
+  addBorders(gridBorders: GridBorders, extend?: boolean): void {
+    if (extend) {
+      this.borders = gridBorders.getBorders(
+        new Rectangle(this.size.left, this.size.top, this.size.width + 1, this.size.height + 1)
+      );
+    } else {
+      this.borders = gridBorders.getBorders(this.size);
+    }
   }
 
   get(x: number, y: number): CellAndFormat | undefined {
     return this.cells[y * (this.size.width + 1) + x];
   }
+
+  getBorder(x: number, y: number): Border | undefined {
+    return this.borders?.find((border) => border.x === x && border.y === y);
+  }
 }

src/gridGL/interaction/pointer/PointerAutoComplete/PointerAutoComplete.ts

@@ -106,8 +106,8 @@ export class PointerAutoComplete {
       if (!setInteractionState) throw new Error('Expected setInteractionState to be defined in PointerAutoComplete');
 
       // handle dragging from the corner
-      if (intersects.rectanglePoint(this.app.cursor.indicator, world)) {
-      } else if (this.active) {
+      // if (intersects.rectanglePoint(this.app.cursor.indicator, world)) {
+      if (this.active) {
         const { column, row } = this.app.sheet.gridOffsets.getRowColumnFromWorld(world.x, world.y);
         const { selection, screenSelection } = this;
         if (!selection || !screenSelection) {
@@ -135,6 +135,7 @@ export class PointerAutoComplete {
           rectangle.height = row - selection.y + 1;
         } else {
           this.stateVertical = undefined;
+          this.toVertical = undefined;
         }
 
         if (column === selection.left && selection.left === selection.right) {
@@ -164,6 +165,7 @@ export class PointerAutoComplete {
           rectangle.width = column - selection.x + 1;
         } else {
           this.stateHorizontal = undefined;
+          this.toHorizontal = undefined;
         }
         this.app.boxCells.populate({
           gridRectangle: rectangle,