@anth0nycodes/fabric-history 0.2.0 → 0.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -59,6 +59,28 @@ await canvas.undo();
59
59
  await canvas.redo();
60
60
  ```
61
61
 
62
+ ### Using with `@erase2d/fabric`
63
+
64
+ To enable history tracking for erasing operations, use the `setEraserBrush` method with an `EraserBrush` from [`@erase2d/fabric`](https://github.com/erase2d/fabric). This ensures that erasing actions trigger the `erasing:end` event required for history tracking.
65
+
66
+ ```typescript
67
+ import { CanvasWithHistory } from "@anth0nycodes/fabric-history";
68
+ import { EraserBrush } from "@erase2d/fabric";
69
+
70
+ const canvas = new CanvasWithHistory("my-canvas", {
71
+ width: 800,
72
+ height: 600,
73
+ });
74
+
75
+ // Create and set the eraser brush
76
+ const eraser = new EraserBrush(canvas);
77
+ eraser.width = 20;
78
+ canvas.setEraserBrush(eraser);
79
+
80
+ // Enable drawing mode to use the eraser
81
+ canvas.isDrawingMode = true;
82
+ ```
83
+
62
84
  ## API
63
85
 
64
86
  ### `CanvasWithHistory`
@@ -67,15 +89,16 @@ Extends fabric.js `Canvas` class with history management capabilities.
67
89
 
68
90
  #### Methods
69
91
 
70
- | Method | Returns | Description |
71
- | ---------------- | --------------- | ----------------------------------------------------------------------------------------------------- |
72
- | `undo()` | `Promise<void>` | Undo the most recent action |
73
- | `redo()` | `Promise<void>` | Redo the most recently undone action |
74
- | `canUndo()` | `boolean` | Check if an undo action is available |
75
- | `canRedo()` | `boolean` | Check if a redo action is available |
76
- | `clearHistory()` | `void` | Clear the undo and redo history stacks |
77
- | `clearCanvas()` | `void` | Clear the canvas and save the cleared state to history (use this instead of the inherited `clear()`) |
78
- | `dispose()` | `void` | Clean up event listeners and dispose the canvas |
92
+ | Method | Returns | Description |
93
+ | ------------------------ | --------------- | ---------------------------------------------------------------------------------------------------- |
94
+ | `undo()` | `Promise<void>` | Undo the most recent action |
95
+ | `redo()` | `Promise<void>` | Redo the most recently undone action |
96
+ | `canUndo()` | `boolean` | Check if an undo action is available |
97
+ | `canRedo()` | `boolean` | Check if a redo action is available |
98
+ | `setEraserBrush(eraser)` | `void` | Set an `EraserBrush` from `@erase2d/fabric` to enable history tracking for erasing operations |
99
+ | `clearHistory()` | `void` | Clear the undo and redo history stacks |
100
+ | `clearCanvas()` | `void` | Clear the canvas and save the cleared state to history (use this instead of the inherited `clear()`) |
101
+ | `dispose()` | `void` | Clean up event listeners and dispose the canvas |
79
102
 
80
103
  #### Tracked Events
81
104
 
@@ -92,12 +115,12 @@ History is automatically saved when these fabric.js events occur:
92
115
 
93
116
  `CanvasWithHistory` fires custom events that you can listen to for history state changes:
94
117
 
95
- | Event | Payload | Description |
96
- | ----------------- | ------------------------------------------------ | ---------------------------------- |
97
- | `history:append` | `{ json: string, initial: boolean }` | Fired when a state is saved |
98
- | `history:undo` | `{ lastUndoAction: string }` | Fired when an undo is performed |
99
- | `history:redo` | `{ lastRedoAction: string }` | Fired when a redo is performed |
100
- | `history:cleared` | `{}` | Fired when history stacks cleared |
118
+ | Event | Payload | Description |
119
+ | ----------------- | ------------------------------------ | --------------------------------- |
120
+ | `history:append` | `{ json: string, initial: boolean }` | Fired when a state is saved |
121
+ | `history:undo` | `{ lastUndoAction: string }` | Fired when an undo is performed |
122
+ | `history:redo` | `{ lastRedoAction: string }` | Fired when a redo is performed |
123
+ | `history:cleared` | `{}` | Fired when history stacks cleared |
101
124
 
102
125
  **Example:**
103
126
 
package/dist/canvas.d.ts CHANGED
@@ -1,3 +1,4 @@
1
+ import type { EraserBrush } from "@erase2d/fabric";
1
2
  import { Canvas, type TEvent } from "fabric";
2
3
  declare module "fabric" {
3
4
  interface CanvasEvents {
@@ -47,8 +48,6 @@ export declare class CanvasWithHistory extends Canvas {
47
48
  private _handleSelectionCreated;
48
49
  /**
49
50
  * Stores the updated multi-selection state inside `_selectedObjects` and sets the `_isMultiSelection` flag to true if there are more than 1 objects selected.
50
- *
51
- * @param options - The options object containing the updated selected objects.
52
51
  */
53
52
  private _handleSelectionUpdated;
54
53
  /**
@@ -108,10 +107,6 @@ export declare class CanvasWithHistory extends Canvas {
108
107
  * @param historyState - The JSON string representing the canvas history state to load.
109
108
  */
110
109
  private _loadFromHistory;
111
- /**
112
- * Clears the history stacks for undo and redo.
113
- */
114
- clearHistory(): void;
115
110
  /**
116
111
  * Debug method to log relevant events to the console. Always remember to remove before pushing once you're done debugging locally!
117
112
  */
@@ -120,6 +115,16 @@ export declare class CanvasWithHistory extends Canvas {
120
115
  * Unsubscribes all relevant fabric event listeners.
121
116
  */
122
117
  private _disposeEventListeners;
118
+ /**
119
+ * Sets the provided `EraserBrush` instance as the canvas's eraser brush. This method is necessary to ensure that erasing actions are properly recorded in the history stack, as the default Fabric.js eraser brush does not trigger the relevant events for history tracking.
120
+ *
121
+ * @param eraser - The EraserBrush instance to set as the canvas's eraser brush.
122
+ */
123
+ setEraserBrush(eraser: EraserBrush): void;
124
+ /**
125
+ * Clears the history stacks for undo and redo.
126
+ */
127
+ clearHistory(): void;
123
128
  /**
124
129
  * Cleans up event listeners and history stacks before disposing of the canvas instance.
125
130
  */
@@ -1 +1 @@
1
- {"version":3,"file":"canvas.d.ts","sourceRoot":"","sources":["../src/canvas.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,MAAM,EAGN,KAAK,MAAM,EACZ,MAAM,QAAQ,CAAC;AAGhB,OAAO,QAAQ,QAAQ,CAAC;IACtB,UAAU,YAAY;QACpB,gBAAgB,EAAE,OAAO,CAAC,MAAM,CAAC,GAAG;YAClC;;eAEG;YACH,IAAI,EAAE,MAAM,CAAC;YACb;;eAEG;YACH,OAAO,EAAE,OAAO,CAAC;SAClB,CAAC;QACF,cAAc,EAAE,OAAO,CAAC,MAAM,CAAC,GAAG;YAChC;;eAEG;YACH,cAAc,EAAE,MAAM,CAAC;SACxB,CAAC;QACF,cAAc,EAAE,OAAO,CAAC,MAAM,CAAC,GAAG;YAChC;;eAEG;YACH,cAAc,EAAE,MAAM,CAAC;SACxB,CAAC;QACF,iBAAiB,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC;KACpC;CACF;AAED,qBAAa,iBAAkB,SAAQ,MAAM;IAE3C,OAAO,CAAC,YAAY,CAAW;IAC/B,OAAO,CAAC,YAAY,CAAW;IAG/B,OAAO,CAAC,gBAAgB,CAAiB;IACzC,OAAO,CAAC,iBAAiB,CAAU;IAGnC,OAAO,CAAC,gBAAgB,CAAU;IAClC,OAAO,CAAC,kBAAkB,CAAU;IAEpC,OAAO,CAAC,oBAAoB,CAAS;gBAEzB,GAAG,IAAI,EAAE,qBAAqB,CAAC,OAAO,MAAM,CAAC;IAezD;;OAEG;IACH,OAAO,CAAC,mBAAmB;IAc3B;;;;OAIG;IACH,OAAO,CAAC,uBAAuB;IAS/B;;;;OAIG;IACH,OAAO,CAAC,uBAAuB;IAM/B;;OAEG;IACH,OAAO,CAAC,uBAAuB;IAK/B;;OAEG;IACH,OAAO,CAAC,wBAAwB;IAMhC;;;;OAIG;IACH,OAAO,CAAC,oBAAoB;IAsB5B;;OAEG;IACH,OAAO,CAAC,mBAAmB;IAI3B;;;;;OAKG;IACH,OAAO,CAAC,qBAAqB;IAM7B;;;;OAIG;IACH,OAAO,CAAC,eAAe;IAIvB;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAW1B;;OAEG;IACG,IAAI;IAiBV;;OAEG;IACH,OAAO;IAIP;;OAEG;IACG,IAAI;IAeV;;OAEG;IACH,OAAO;IAIP;;;;OAIG;YACW,gBAAgB;IAa9B;;OAEG;IACH,YAAY;IAMZ;;OAEG;IACH,OAAO,CAAC,aAAa;IAwBrB;;OAEG;IACH,OAAO,CAAC,sBAAsB;IAc9B;;OAEG;IACH,OAAO;IAMP;;;;;;OAMG;IACH,WAAW;CAMZ"}
1
+ {"version":3,"file":"canvas.d.ts","sourceRoot":"","sources":["../src/canvas.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAgB,MAAM,iBAAiB,CAAC;AACjE,OAAO,EACL,MAAM,EAGN,KAAK,MAAM,EACZ,MAAM,QAAQ,CAAC;AAGhB,OAAO,QAAQ,QAAQ,CAAC;IACtB,UAAU,YAAY;QACpB,gBAAgB,EAAE,OAAO,CAAC,MAAM,CAAC,GAAG;YAClC;;eAEG;YACH,IAAI,EAAE,MAAM,CAAC;YACb;;eAEG;YACH,OAAO,EAAE,OAAO,CAAC;SAClB,CAAC;QACF,cAAc,EAAE,OAAO,CAAC,MAAM,CAAC,GAAG;YAChC;;eAEG;YACH,cAAc,EAAE,MAAM,CAAC;SACxB,CAAC;QACF,cAAc,EAAE,OAAO,CAAC,MAAM,CAAC,GAAG;YAChC;;eAEG;YACH,cAAc,EAAE,MAAM,CAAC;SACxB,CAAC;QACF,iBAAiB,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC;KACpC;CACF;AAED,qBAAa,iBAAkB,SAAQ,MAAM;IAE3C,OAAO,CAAC,YAAY,CAAW;IAC/B,OAAO,CAAC,YAAY,CAAW;IAG/B,OAAO,CAAC,gBAAgB,CAAiB;IACzC,OAAO,CAAC,iBAAiB,CAAU;IAGnC,OAAO,CAAC,gBAAgB,CAAU;IAClC,OAAO,CAAC,kBAAkB,CAAU;IAEpC,OAAO,CAAC,oBAAoB,CAAS;gBAEzB,GAAG,IAAI,EAAE,qBAAqB,CAAC,OAAO,MAAM,CAAC;IAezD;;OAEG;IACH,OAAO,CAAC,mBAAmB;IAc3B;;;;OAIG;IACH,OAAO,CAAC,uBAAuB;IAS/B;;OAEG;IACH,OAAO,CAAC,uBAAuB;IAW/B;;OAEG;IACH,OAAO,CAAC,uBAAuB;IAK/B;;OAEG;IACH,OAAO,CAAC,wBAAwB;IAMhC;;;;OAIG;IACH,OAAO,CAAC,oBAAoB;IAuB5B;;OAEG;IACH,OAAO,CAAC,mBAAmB;IAI3B;;;;;OAKG;IACH,OAAO,CAAC,qBAAqB;IAM7B;;;;OAIG;IACH,OAAO,CAAC,eAAe;IAIvB;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAW1B;;OAEG;IACG,IAAI;IAiBV;;OAEG;IACH,OAAO;IAIP;;OAEG;IACG,IAAI;IAeV;;OAEG;IACH,OAAO;IAIP;;;;OAIG;YACW,gBAAgB;IAa9B;;OAEG;IACH,OAAO,CAAC,aAAa;IAwBrB;;OAEG;IACH,OAAO,CAAC,sBAAsB;IAc9B;;;;OAIG;IACH,cAAc,CAAC,MAAM,EAAE,WAAW;IAmBlC;;OAEG;IACH,YAAY;IAMZ;;OAEG;IACH,OAAO;IAMP;;;;;;OAMG;IACH,WAAW;CAMZ"}
package/dist/canvas.js CHANGED
@@ -52,11 +52,14 @@ export class CanvasWithHistory extends Canvas {
52
52
  }
53
53
  /**
54
54
  * Stores the updated multi-selection state inside `_selectedObjects` and sets the `_isMultiSelection` flag to true if there are more than 1 objects selected.
55
- *
56
- * @param options - The options object containing the updated selected objects.
57
55
  */
58
- _handleSelectionUpdated(options) {
56
+ _handleSelectionUpdated() {
59
57
  const allSelectedObjects = this.getActiveObjects();
58
+ /*
59
+ Uses reference to `getActiveObjects()` instead of the callback's `options.selected` because `options.selected`
60
+ only contains the objects that are currently selected, it doesn't cover all the previously
61
+ selected objects that are in the current ActiveSelection.
62
+ */
60
63
  this._selectedObjects = allSelectedObjects;
61
64
  this._isMultiSelection = allSelectedObjects.length > 1;
62
65
  }
@@ -81,14 +84,15 @@ export class CanvasWithHistory extends Canvas {
81
84
  * @param options - The options object containing details about the removed object.
82
85
  */
83
86
  _handleObjectRemoved(options) {
87
+ // handle object:removed events differently based on whether or not the removed object is within an ActiveSelection
88
+ if (
84
89
  /*
85
- Check !_historyProcessing to prevent recursion: this.remove() fires
86
- object:removed events, which would re-enter this handler while we're
87
- still processing the first removal.
90
+ !this._historyProcessing is included to prevent unintended recursive behavior
91
+ caused by this.remove() since that also triggers an object:removed event
88
92
  */
89
- if (!this._historyProcessing &&
93
+ !this._historyProcessing &&
90
94
  this._isMultiSelection &&
91
- this._selectedObjects.some((obj) => obj === options.target)) {
95
+ this._selectedObjects.includes(options.target)) {
92
96
  this._historyProcessing = true;
93
97
  const objectsToRemove = [...this._selectedObjects];
94
98
  this._selectedObjects = [];
@@ -206,14 +210,6 @@ export class CanvasWithHistory extends Canvas {
206
210
  this._historyProcessing = false;
207
211
  }
208
212
  }
209
- /**
210
- * Clears the history stacks for undo and redo.
211
- */
212
- clearHistory() {
213
- this._historySaveInitialState();
214
- this._historyRedo = [];
215
- this.fire("history:cleared");
216
- }
217
213
  /**
218
214
  * Debug method to log relevant events to the console. Always remember to remove before pushing once you're done debugging locally!
219
215
  */
@@ -253,6 +249,36 @@ export class CanvasWithHistory extends Canvas {
253
249
  "selection:cleared": this._handleSelectionCleared.bind(this),
254
250
  });
255
251
  }
252
+ /**
253
+ * Sets the provided `EraserBrush` instance as the canvas's eraser brush. This method is necessary to ensure that erasing actions are properly recorded in the history stack, as the default Fabric.js eraser brush does not trigger the relevant events for history tracking.
254
+ *
255
+ * @param eraser - The EraserBrush instance to set as the canvas's eraser brush.
256
+ */
257
+ setEraserBrush(eraser) {
258
+ this.freeDrawingBrush = eraser;
259
+ eraser.on("end", async (e) => {
260
+ const { targets: erasedTargets, path } = e.detail;
261
+ // Prevent the default commit so we can control when history is saved
262
+ e.preventDefault();
263
+ // Manually commit the erasing and wait for it to complete
264
+ await eraser.commit({ targets: erasedTargets, path });
265
+ // Now fire erasing:end after the canvas state has been updated
266
+ this.fire("erasing:end", {
267
+ path,
268
+ targets: erasedTargets,
269
+ subTargets: [],
270
+ drawables: {},
271
+ });
272
+ });
273
+ }
274
+ /**
275
+ * Clears the history stacks for undo and redo.
276
+ */
277
+ clearHistory() {
278
+ this._historySaveInitialState();
279
+ this._historyRedo = [];
280
+ this.fire("history:cleared");
281
+ }
256
282
  /**
257
283
  * Cleans up event listeners and history stacks before disposing of the canvas instance.
258
284
  */
@@ -1 +1 @@
1
- {"version":3,"file":"canvas.js","sourceRoot":"","sources":["../src/canvas.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,MAAM,GAIP,MAAM,QAAQ,CAAC;AA+BhB,MAAM,OAAO,iBAAkB,SAAQ,MAAM;IAC3C,2BAA2B;IACnB,YAAY,CAAW;IACvB,YAAY,CAAW;IAE/B,6BAA6B;IACrB,gBAAgB,CAAiB;IACjC,iBAAiB,CAAU;IAEnC,2EAA2E;IACnE,gBAAgB,CAAU;IAC1B,kBAAkB,CAAU;IAE5B,oBAAoB,CAAS;IAErC,YAAY,GAAG,IAA0C;QACvD,KAAK,CAAC,GAAG,IAAI,CAAC,CAAC;QAEf,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;QACvB,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;QACvB,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;QAC3B,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC;QAC/B,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC;QAC9B,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;QAChC,IAAI,CAAC,oBAAoB,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QAEnD,IAAI,CAAC,mBAAmB,EAAE,CAAC;QAC3B,IAAI,CAAC,wBAAwB,EAAE,CAAC;IAClC,CAAC;IAED;;OAEG;IACK,mBAAmB;QACzB,IAAI,CAAC,EAAE,CAAC;YACN,cAAc,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC;YAClD,aAAa,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC;YACjD,cAAc,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC;YAClD,gBAAgB,EAAE,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,IAAI,CAAC;YACtD,eAAe,EAAE,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC;YACpD,iBAAiB,EAAE,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC;YACxD,mBAAmB,EAAE,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC;YAC5D,mBAAmB,EAAE,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC;YAC5D,mBAAmB,EAAE,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC;SAC7D,CAAC,CAAC;IACL,CAAC;IAED;;;;OAIG;IACK,uBAAuB,CAAC,OAAqC;QACnE,MAAM,sBAAsB,GAAG,OAAO,CAAC,QAAQ,CAAC;QAEhD,IAAI,sBAAsB,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACtC,IAAI,CAAC,gBAAgB,GAAG,sBAAsB,CAAC;YAC/C,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;QAChC,CAAC;IACH,CAAC;IAED;;;;OAIG;IACK,uBAAuB,CAAC,OAAqC;QACnE,MAAM,kBAAkB,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACnD,IAAI,CAAC,gBAAgB,GAAG,kBAAkB,CAAC;QAC3C,IAAI,CAAC,iBAAiB,GAAG,kBAAkB,CAAC,MAAM,GAAG,CAAC,CAAC;IACzD,CAAC;IAED;;OAEG;IACK,uBAAuB;QAC7B,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;QAC3B,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC;IACjC,CAAC;IAED;;OAEG;IACK,wBAAwB;QAC9B,MAAM,YAAY,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QAC5C,IAAI,CAAC,YAAY,GAAG,CAAC,YAAY,CAAC,CAAC;QACnC,IAAI,CAAC,oBAAoB,GAAG,YAAY,CAAC;IAC3C,CAAC;IAED;;;;OAIG;IACK,oBAAoB,CAAC,OAAiC;QAC5D;;;;UAIE;QACF,IACE,CAAC,IAAI,CAAC,kBAAkB;YACxB,IAAI,CAAC,iBAAiB;YACtB,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,KAAK,OAAO,CAAC,MAAM,CAAC,EAC3D,CAAC;YACD,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;YAC/B,MAAM,eAAe,GAAG,CAAC,GAAG,IAAI,CAAC,gBAAgB,CAAC,CAAC;YACnD,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;YAC3B,IAAI,CAAC,MAAM,CAAC,GAAG,eAAe,CAAC,CAAC;YAChC,IAAI,CAAC,mBAAmB,EAAE,CAAC;YAC3B,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;YAChC,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAC5B,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAC5B,CAAC;IACH,CAAC;IACD;;OAEG;IACK,mBAAmB;QACzB,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;IAC/B,CAAC;IAED;;;;;OAKG;IACK,qBAAqB;QAC3B,0GAA0G;QAC1G,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC;QAC9B,IAAI,CAAC,kBAAkB,EAAE,CAAC;IAC5B,CAAC;IAED;;;;OAIG;IACK,eAAe;QACrB,OAAO,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC;IAC/C,CAAC;IAED;;OAEG;IACK,kBAAkB;QACxB,IAAI,IAAI,CAAC,kBAAkB,IAAI,IAAI,CAAC,gBAAgB;YAAE,OAAO;QAC7D,MAAM,UAAU,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QAE1C,IAAI,IAAI,CAAC,oBAAoB,KAAK,UAAU;YAAE,OAAO,CAAC,mBAAmB;QACzE,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QACnC,IAAI,CAAC,oBAAoB,GAAG,UAAU,CAAC;QACvC,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;QACvB,IAAI,CAAC,IAAI,CAAC,gBAAgB,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;IACpE,CAAC;IAED;;OAEG;IACH,KAAK,CAAC,IAAI;QACR,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,IAAI,CAAC;YAAE,OAAO;QAC1C,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;QAE/B,MAAM,WAAW,GAAG,IAAI,CAAC,YAAY,CAAC,GAAG,EAAE,CAAC;QAC5C,IAAI,CAAC,WAAW;YAAE,OAAO;QAEzB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAEpC,sEAAsE;QACtE,MAAM,aAAa,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QACtE,IAAI,CAAC,aAAa;YAAE,OAAO;QAC3B,IAAI,CAAC,oBAAoB,GAAG,aAAa,CAAC;QAC1C,MAAM,IAAI,CAAC,gBAAgB,CAAC,aAAa,CAAC,CAAC;QAC3C,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,EAAE,cAAc,EAAE,WAAW,EAAE,CAAC,CAAC;IAC7D,CAAC;IAED;;OAEG;IACH,OAAO;QACL,OAAO,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC;IACtC,CAAC;IAED;;OAEG;IACH,KAAK,CAAC,IAAI;QACR,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,KAAK,CAAC;YAAE,OAAO;QAC3C,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;QAE/B,MAAM,WAAW,GAAG,IAAI,CAAC,YAAY,CAAC,GAAG,EAAE,CAAC;QAC5C,IAAI,CAAC,WAAW;YAAE,OAAO;QAEzB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAEpC,0CAA0C;QAC1C,IAAI,CAAC,oBAAoB,GAAG,WAAW,CAAC;QACxC,MAAM,IAAI,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAC;QACzC,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,EAAE,cAAc,EAAE,WAAW,EAAE,CAAC,CAAC;IAC7D,CAAC;IAED;;OAEG;IACH,OAAO;QACL,OAAO,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC;IACtC,CAAC;IAED;;;;OAIG;IACK,KAAK,CAAC,gBAAgB,CAAC,YAAoB;QACjD,IAAI,CAAC;YACH,IAAI,CAAC,KAAK,EAAE,CAAC;YACb,IAAI,CAAC,mBAAmB,EAAE,CAAC;YAC3B,MAAM,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC;YAClD,IAAI,CAAC,gBAAgB,EAAE,CAAC;QAC1B,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,OAAO,CAAC,KAAK,CAAC,6BAA6B,EAAE,KAAK,CAAC,CAAC;QACtD,CAAC;gBAAS,CAAC;YACT,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;QAClC,CAAC;IACH,CAAC;IAED;;OAEG;IACH,YAAY;QACV,IAAI,CAAC,wBAAwB,EAAE,CAAC;QAChC,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;QACvB,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;IAC/B,CAAC;IAED;;OAEG;IACK,aAAa;QACnB,MAAM,MAAM,GAAG;YACb,cAAc;YACd,aAAa;YACb,cAAc;YACd,gBAAgB;YAChB,eAAe;YACf,iBAAiB;YACjB,mBAAmB;YACnB,mBAAmB;YACnB,gBAAgB;YAChB,gBAAgB;YAChB,cAAc;YACd,cAAc;YACd,iBAAiB;SAClB,CAAC;QAEF,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE;YACnB,IAAI,CAAC,EAAE,CAAC,CAAuB,EAAE,GAAG,EAAE,CACpC,OAAO,CAAC,GAAG,CAAC,uBAAuB,CAAC,EAAE,CAAC,CACxC,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC;IAED;;OAEG;IACK,sBAAsB;QAC5B,IAAI,CAAC,GAAG,CAAC;YACP,cAAc,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC;YAClD,aAAa,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC;YACjD,cAAc,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC;YAClD,gBAAgB,EAAE,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,IAAI,CAAC;YACtD,eAAe,EAAE,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC;YACpD,iBAAiB,EAAE,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC;YACxD,mBAAmB,EAAE,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC;YAC5D,mBAAmB,EAAE,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC;YAC5D,mBAAmB,EAAE,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC;SAC7D,CAAC,CAAC;IACL,CAAC;IAED;;OAEG;IACH,OAAO;QACL,IAAI,CAAC,sBAAsB,EAAE,CAAC;QAC9B,IAAI,CAAC,YAAY,EAAE,CAAC;QACpB,OAAO,KAAK,CAAC,OAAO,EAAE,CAAC;IACzB,CAAC;IAED;;;;;;OAMG;IACH,WAAW;QACT,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;QAC/B,IAAI,CAAC,KAAK,EAAE,CAAC;QACb,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;QAChC,IAAI,CAAC,kBAAkB,EAAE,CAAC;IAC5B,CAAC;CACF"}
1
+ {"version":3,"file":"canvas.js","sourceRoot":"","sources":["../src/canvas.ts"],"names":[],"mappings":"AACA,OAAO,EACL,MAAM,GAIP,MAAM,QAAQ,CAAC;AA+BhB,MAAM,OAAO,iBAAkB,SAAQ,MAAM;IAC3C,2BAA2B;IACnB,YAAY,CAAW;IACvB,YAAY,CAAW;IAE/B,6BAA6B;IACrB,gBAAgB,CAAiB;IACjC,iBAAiB,CAAU;IAEnC,2EAA2E;IACnE,gBAAgB,CAAU;IAC1B,kBAAkB,CAAU;IAE5B,oBAAoB,CAAS;IAErC,YAAY,GAAG,IAA0C;QACvD,KAAK,CAAC,GAAG,IAAI,CAAC,CAAC;QAEf,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;QACvB,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;QACvB,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;QAC3B,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC;QAC/B,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC;QAC9B,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;QAChC,IAAI,CAAC,oBAAoB,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QAEnD,IAAI,CAAC,mBAAmB,EAAE,CAAC;QAC3B,IAAI,CAAC,wBAAwB,EAAE,CAAC;IAClC,CAAC;IAED;;OAEG;IACK,mBAAmB;QACzB,IAAI,CAAC,EAAE,CAAC;YACN,cAAc,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC;YAClD,aAAa,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC;YACjD,cAAc,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC;YAClD,gBAAgB,EAAE,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,IAAI,CAAC;YACtD,eAAe,EAAE,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC;YACpD,iBAAiB,EAAE,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC;YACxD,mBAAmB,EAAE,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC;YAC5D,mBAAmB,EAAE,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC;YAC5D,mBAAmB,EAAE,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC;SAC7D,CAAC,CAAC;IACL,CAAC;IAED;;;;OAIG;IACK,uBAAuB,CAAC,OAAqC;QACnE,MAAM,sBAAsB,GAAG,OAAO,CAAC,QAAQ,CAAC;QAEhD,IAAI,sBAAsB,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACtC,IAAI,CAAC,gBAAgB,GAAG,sBAAsB,CAAC;YAC/C,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;QAChC,CAAC;IACH,CAAC;IAED;;OAEG;IACK,uBAAuB;QAC7B,MAAM,kBAAkB,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACnD;;;;UAIE;QACF,IAAI,CAAC,gBAAgB,GAAG,kBAAkB,CAAC;QAC3C,IAAI,CAAC,iBAAiB,GAAG,kBAAkB,CAAC,MAAM,GAAG,CAAC,CAAC;IACzD,CAAC;IAED;;OAEG;IACK,uBAAuB;QAC7B,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;QAC3B,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC;IACjC,CAAC;IAED;;OAEG;IACK,wBAAwB;QAC9B,MAAM,YAAY,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QAC5C,IAAI,CAAC,YAAY,GAAG,CAAC,YAAY,CAAC,CAAC;QACnC,IAAI,CAAC,oBAAoB,GAAG,YAAY,CAAC;IAC3C,CAAC;IAED;;;;OAIG;IACK,oBAAoB,CAAC,OAAiC;QAC5D,mHAAmH;QACnH;QACE;;;UAGE;QACF,CAAC,IAAI,CAAC,kBAAkB;YACxB,IAAI,CAAC,iBAAiB;YACtB,IAAI,CAAC,gBAAgB,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAC9C,CAAC;YACD,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;YAC/B,MAAM,eAAe,GAAG,CAAC,GAAG,IAAI,CAAC,gBAAgB,CAAC,CAAC;YACnD,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;YAC3B,IAAI,CAAC,MAAM,CAAC,GAAG,eAAe,CAAC,CAAC;YAChC,IAAI,CAAC,mBAAmB,EAAE,CAAC;YAC3B,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;YAChC,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAC5B,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAC5B,CAAC;IACH,CAAC;IAED;;OAEG;IACK,mBAAmB;QACzB,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;IAC/B,CAAC;IAED;;;;;OAKG;IACK,qBAAqB;QAC3B,0GAA0G;QAC1G,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC;QAC9B,IAAI,CAAC,kBAAkB,EAAE,CAAC;IAC5B,CAAC;IAED;;;;OAIG;IACK,eAAe;QACrB,OAAO,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC;IAC/C,CAAC;IAED;;OAEG;IACK,kBAAkB;QACxB,IAAI,IAAI,CAAC,kBAAkB,IAAI,IAAI,CAAC,gBAAgB;YAAE,OAAO;QAC7D,MAAM,UAAU,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QAE1C,IAAI,IAAI,CAAC,oBAAoB,KAAK,UAAU;YAAE,OAAO,CAAC,mBAAmB;QACzE,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QACnC,IAAI,CAAC,oBAAoB,GAAG,UAAU,CAAC;QACvC,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;QACvB,IAAI,CAAC,IAAI,CAAC,gBAAgB,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;IACpE,CAAC;IAED;;OAEG;IACH,KAAK,CAAC,IAAI;QACR,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,IAAI,CAAC;YAAE,OAAO;QAC1C,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;QAE/B,MAAM,WAAW,GAAG,IAAI,CAAC,YAAY,CAAC,GAAG,EAAE,CAAC;QAC5C,IAAI,CAAC,WAAW;YAAE,OAAO;QAEzB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAEpC,sEAAsE;QACtE,MAAM,aAAa,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QACtE,IAAI,CAAC,aAAa;YAAE,OAAO;QAC3B,IAAI,CAAC,oBAAoB,GAAG,aAAa,CAAC;QAC1C,MAAM,IAAI,CAAC,gBAAgB,CAAC,aAAa,CAAC,CAAC;QAC3C,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,EAAE,cAAc,EAAE,WAAW,EAAE,CAAC,CAAC;IAC7D,CAAC;IAED;;OAEG;IACH,OAAO;QACL,OAAO,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC;IACtC,CAAC;IAED;;OAEG;IACH,KAAK,CAAC,IAAI;QACR,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,KAAK,CAAC;YAAE,OAAO;QAC3C,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;QAE/B,MAAM,WAAW,GAAG,IAAI,CAAC,YAAY,CAAC,GAAG,EAAE,CAAC;QAC5C,IAAI,CAAC,WAAW;YAAE,OAAO;QAEzB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAEpC,0CAA0C;QAC1C,IAAI,CAAC,oBAAoB,GAAG,WAAW,CAAC;QACxC,MAAM,IAAI,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAC;QACzC,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,EAAE,cAAc,EAAE,WAAW,EAAE,CAAC,CAAC;IAC7D,CAAC;IAED;;OAEG;IACH,OAAO;QACL,OAAO,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC;IACtC,CAAC;IAED;;;;OAIG;IACK,KAAK,CAAC,gBAAgB,CAAC,YAAoB;QACjD,IAAI,CAAC;YACH,IAAI,CAAC,KAAK,EAAE,CAAC;YACb,IAAI,CAAC,mBAAmB,EAAE,CAAC;YAC3B,MAAM,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC;YAClD,IAAI,CAAC,gBAAgB,EAAE,CAAC;QAC1B,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,OAAO,CAAC,KAAK,CAAC,6BAA6B,EAAE,KAAK,CAAC,CAAC;QACtD,CAAC;gBAAS,CAAC;YACT,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;QAClC,CAAC;IACH,CAAC;IAED;;OAEG;IACK,aAAa;QACnB,MAAM,MAAM,GAAG;YACb,cAAc;YACd,aAAa;YACb,cAAc;YACd,gBAAgB;YAChB,eAAe;YACf,iBAAiB;YACjB,mBAAmB;YACnB,mBAAmB;YACnB,gBAAgB;YAChB,gBAAgB;YAChB,cAAc;YACd,cAAc;YACd,iBAAiB;SAClB,CAAC;QAEF,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE;YACnB,IAAI,CAAC,EAAE,CAAC,CAAuB,EAAE,GAAG,EAAE,CACpC,OAAO,CAAC,GAAG,CAAC,uBAAuB,CAAC,EAAE,CAAC,CACxC,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC;IAED;;OAEG;IACK,sBAAsB;QAC5B,IAAI,CAAC,GAAG,CAAC;YACP,cAAc,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC;YAClD,aAAa,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC;YACjD,cAAc,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC;YAClD,gBAAgB,EAAE,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,IAAI,CAAC;YACtD,eAAe,EAAE,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC;YACpD,iBAAiB,EAAE,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC;YACxD,mBAAmB,EAAE,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC;YAC5D,mBAAmB,EAAE,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC;YAC5D,mBAAmB,EAAE,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC;SAC7D,CAAC,CAAC;IACL,CAAC;IAED;;;;OAIG;IACH,cAAc,CAAC,MAAmB;QAChC,IAAI,CAAC,gBAAgB,GAAG,MAAM,CAAC;QAE/B,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,CAAsB,EAAE,EAAE;YAChD,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,IAAI,EAAE,GAAG,CAAC,CAAC,MAAM,CAAC;YAClD,qEAAqE;YACrE,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,0DAA0D;YAC1D,MAAM,MAAM,CAAC,MAAM,CAAC,EAAE,OAAO,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAC;YACtD,+DAA+D;YAC/D,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;gBACvB,IAAI;gBACJ,OAAO,EAAE,aAAa;gBACtB,UAAU,EAAE,EAAE;gBACd,SAAS,EAAE,EAAE;aACd,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC;IAED;;OAEG;IACH,YAAY;QACV,IAAI,CAAC,wBAAwB,EAAE,CAAC;QAChC,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;QACvB,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;IAC/B,CAAC;IAED;;OAEG;IACH,OAAO;QACL,IAAI,CAAC,sBAAsB,EAAE,CAAC;QAC9B,IAAI,CAAC,YAAY,EAAE,CAAC;QACpB,OAAO,KAAK,CAAC,OAAO,EAAE,CAAC;IACzB,CAAC;IAED;;;;;;OAMG;IACH,WAAW;QACT,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;QAC/B,IAAI,CAAC,KAAK,EAAE,CAAC;QACb,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;QAChC,IAAI,CAAC,kBAAkB,EAAE,CAAC;IAC5B,CAAC;CACF"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@anth0nycodes/fabric-history",
3
- "version": "0.2.0",
3
+ "version": "0.3.1",
4
4
  "description": "A library built on top of fabric.js that allows for easy access to canvas history.",
5
5
  "type": "module",
6
6
  "main": "dist/index.js",
@@ -31,6 +31,7 @@
31
31
  "fabric": ">=6.0.0 <8.0.0"
32
32
  },
33
33
  "devDependencies": {
34
+ "@erase2d/fabric": "^1.2.1",
34
35
  "@ianvs/prettier-plugin-sort-imports": "^4.7.0",
35
36
  "@vitest/browser-playwright": "^4.0.18",
36
37
  "@vitest/coverage-v8": "^4.0.18",
package/src/canvas.ts CHANGED
@@ -1,3 +1,4 @@
1
+ import type { EraserBrush, ErasingEvent } from "@erase2d/fabric";
1
2
  import {
2
3
  Canvas,
3
4
  type CanvasEvents,
@@ -97,11 +98,14 @@ export class CanvasWithHistory extends Canvas {
97
98
 
98
99
  /**
99
100
  * Stores the updated multi-selection state inside `_selectedObjects` and sets the `_isMultiSelection` flag to true if there are more than 1 objects selected.
100
- *
101
- * @param options - The options object containing the updated selected objects.
102
101
  */
103
- private _handleSelectionUpdated(options: { selected: FabricObject[] }) {
102
+ private _handleSelectionUpdated() {
104
103
  const allSelectedObjects = this.getActiveObjects();
104
+ /*
105
+ Uses reference to `getActiveObjects()` instead of the callback's `options.selected` because `options.selected`
106
+ only contains the objects that are currently selected, it doesn't cover all the previously
107
+ selected objects that are in the current ActiveSelection.
108
+ */
105
109
  this._selectedObjects = allSelectedObjects;
106
110
  this._isMultiSelection = allSelectedObjects.length > 1;
107
111
  }
@@ -129,15 +133,15 @@ export class CanvasWithHistory extends Canvas {
129
133
  * @param options - The options object containing details about the removed object.
130
134
  */
131
135
  private _handleObjectRemoved(options: { target: FabricObject }) {
132
- /*
133
- Check !_historyProcessing to prevent recursion: this.remove() fires
134
- object:removed events, which would re-enter this handler while we're
135
- still processing the first removal.
136
- */
136
+ // handle object:removed events differently based on whether or not the removed object is within an ActiveSelection
137
137
  if (
138
+ /*
139
+ !this._historyProcessing is included to prevent unintended recursive behavior
140
+ caused by this.remove() since that also triggers an object:removed event
141
+ */
138
142
  !this._historyProcessing &&
139
143
  this._isMultiSelection &&
140
- this._selectedObjects.some((obj) => obj === options.target)
144
+ this._selectedObjects.includes(options.target)
141
145
  ) {
142
146
  this._historyProcessing = true;
143
147
  const objectsToRemove = [...this._selectedObjects];
@@ -150,6 +154,7 @@ export class CanvasWithHistory extends Canvas {
150
154
  this._historySaveAction();
151
155
  }
152
156
  }
157
+
153
158
  /**
154
159
  * Starts the movement event listener for objects.
155
160
  */
@@ -262,15 +267,6 @@ export class CanvasWithHistory extends Canvas {
262
267
  }
263
268
  }
264
269
 
265
- /**
266
- * Clears the history stacks for undo and redo.
267
- */
268
- clearHistory() {
269
- this._historySaveInitialState();
270
- this._historyRedo = [];
271
- this.fire("history:cleared");
272
- }
273
-
274
270
  /**
275
271
  * Debug method to log relevant events to the console. Always remember to remove before pushing once you're done debugging locally!
276
272
  */
@@ -315,6 +311,39 @@ export class CanvasWithHistory extends Canvas {
315
311
  });
316
312
  }
317
313
 
314
+ /**
315
+ * Sets the provided `EraserBrush` instance as the canvas's eraser brush. This method is necessary to ensure that erasing actions are properly recorded in the history stack, as the default Fabric.js eraser brush does not trigger the relevant events for history tracking.
316
+ *
317
+ * @param eraser - The EraserBrush instance to set as the canvas's eraser brush.
318
+ */
319
+ setEraserBrush(eraser: EraserBrush) {
320
+ this.freeDrawingBrush = eraser;
321
+
322
+ eraser.on("end", async (e: ErasingEvent<"end">) => {
323
+ const { targets: erasedTargets, path } = e.detail;
324
+ // Prevent the default commit so we can control when history is saved
325
+ e.preventDefault();
326
+ // Manually commit the erasing and wait for it to complete
327
+ await eraser.commit({ targets: erasedTargets, path });
328
+ // Now fire erasing:end after the canvas state has been updated
329
+ this.fire("erasing:end", {
330
+ path,
331
+ targets: erasedTargets,
332
+ subTargets: [],
333
+ drawables: {},
334
+ });
335
+ });
336
+ }
337
+
338
+ /**
339
+ * Clears the history stacks for undo and redo.
340
+ */
341
+ clearHistory() {
342
+ this._historySaveInitialState();
343
+ this._historyRedo = [];
344
+ this.fire("history:cleared");
345
+ }
346
+
318
347
  /**
319
348
  * Cleans up event listeners and history stacks before disposing of the canvas instance.
320
349
  */
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=canvas.test.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"canvas.test.d.ts","sourceRoot":"","sources":["../src/canvas.test.ts"],"names":[],"mappings":""}
@@ -1,137 +0,0 @@
1
- // @vitest-environment jsdom
2
- import { Circle, Path, Rect } from "fabric";
3
- import { beforeEach, describe, expect, test } from "vitest";
4
- import { CanvasWithHistory } from "./canvas";
5
- describe("canvas operations with history management", () => {
6
- let canvas;
7
- let circle;
8
- let path;
9
- let rect;
10
- beforeEach(() => {
11
- const canvasEl = document.createElement("canvas");
12
- canvas = new CanvasWithHistory(canvasEl);
13
- circle = new Circle({
14
- radius: 20,
15
- fill: "green",
16
- left: 100,
17
- top: 100,
18
- });
19
- path = new Path("M 0 0 L 100 100 L 0 100 z", {
20
- fill: "",
21
- stroke: "red",
22
- });
23
- rect = new Rect({
24
- left: 100,
25
- top: 100,
26
- fill: "red",
27
- width: 50,
28
- height: 50,
29
- });
30
- });
31
- test("canvas only contains rect and circle after undo", async () => {
32
- canvas.add(rect);
33
- canvas.add(circle);
34
- canvas.add(path);
35
- await canvas.undo();
36
- // After undo: canvas should only contain rect and circle object
37
- expect(canvas.contains(path)).toBe(false);
38
- });
39
- test("canvas only contains circle after undo", async () => {
40
- canvas.add(circle);
41
- canvas.add(rect);
42
- canvas.add(path);
43
- await canvas.undo();
44
- await canvas.undo();
45
- // After undo: canvas should only contain circle object
46
- expect(canvas.contains(rect) && canvas.contains(path)).toBe(false);
47
- });
48
- test("canvas contains nothing after undo", async () => {
49
- canvas.add(path);
50
- await canvas.undo();
51
- // After undo: canvas should have 0 objects
52
- expect(canvas.contains(path)).toBe(false);
53
- });
54
- // Redo tests
55
- test("canvas contains path again after undo then redo", async () => {
56
- canvas.add(rect);
57
- canvas.add(circle);
58
- canvas.add(path);
59
- await canvas.undo();
60
- await canvas.redo();
61
- // After redo: canvas should contain all 3 objects again
62
- expect(canvas.getObjects().length).toBe(3);
63
- });
64
- test("canvas contains rect and path after two undos then one redo", async () => {
65
- canvas.add(rect);
66
- canvas.add(circle);
67
- canvas.add(path);
68
- await canvas.undo();
69
- await canvas.undo();
70
- await canvas.redo();
71
- // After 2 undos and 1 redo: canvas should contain rect and circle
72
- expect(canvas.getObjects().length).toBe(2);
73
- });
74
- test("canvas contains all objects after multiple undos then multiple redos", async () => {
75
- canvas.add(rect);
76
- canvas.add(circle);
77
- canvas.add(path);
78
- await canvas.undo();
79
- await canvas.undo();
80
- await canvas.undo();
81
- // After 3 undos: canvas should be empty
82
- expect(canvas.getObjects().length).toBe(0);
83
- await canvas.redo();
84
- await canvas.redo();
85
- await canvas.redo();
86
- // After 3 redos: canvas should contain all 3 objects
87
- expect(canvas.getObjects().length).toBe(3);
88
- });
89
- test("redo does nothing when there is nothing to redo", async () => {
90
- canvas.add(rect);
91
- canvas.add(circle);
92
- await canvas.redo();
93
- // Redo with no prior undo: canvas should still contain 2 objects
94
- expect(canvas.getObjects().length).toBe(2);
95
- });
96
- test("redo stack is cleared after new action", async () => {
97
- canvas.add(rect);
98
- canvas.add(circle);
99
- canvas.add(path);
100
- await canvas.undo();
101
- // Add a new object after undo (this should clear redo stack)
102
- const newRect = new Rect({
103
- left: 200,
104
- top: 200,
105
- fill: "blue",
106
- width: 30,
107
- height: 30,
108
- });
109
- canvas.add(newRect);
110
- // Try to redo - should do nothing since redo stack was cleared
111
- await canvas.redo();
112
- // Canvas should still have 3 objects (rect, circle, newRect) - path should not come back
113
- expect(canvas.getObjects().length).toBe(3);
114
- expect(canvas.canRedo()).toBe(false);
115
- });
116
- test("canUndo returns correct value", async () => {
117
- expect(canvas.canUndo()).toBe(false);
118
- canvas.add(rect);
119
- expect(canvas.canUndo()).toBe(true);
120
- await canvas.undo();
121
- expect(canvas.canUndo()).toBe(false);
122
- });
123
- test("canRedo returns correct value", async () => {
124
- canvas.add(rect);
125
- expect(canvas.canRedo()).toBe(false);
126
- await canvas.undo();
127
- expect(canvas.canRedo()).toBe(true);
128
- await canvas.redo();
129
- expect(canvas.canRedo()).toBe(false);
130
- });
131
- test("undo does nothing when there is nothing to undo", async () => {
132
- await canvas.undo();
133
- // Undo on empty canvas: should still be empty with no errors
134
- expect(canvas.getObjects().length).toBe(0);
135
- });
136
- });
137
- //# sourceMappingURL=canvas.test.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"canvas.test.js","sourceRoot":"","sources":["../src/canvas.test.ts"],"names":[],"mappings":"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"}