kritzel-stencil 0.0.126 → 0.0.128

package/dist/collection/classes/structures/octree.structure.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"octree.structure.js","sourceRoot":"","sources":["../../../src/classes/structures/octree.structure.ts"],"names":[],"mappings":"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","sourcesContent":["import { KritzelBoundingBox } from '../../interfaces/bounding-box.interface';\r\nimport { KritzelBaseObject } from '../objects/base-object.class';\r\n\r\nexport class KritzelOctree<T extends KritzelBaseObject<any>> {\r\n  private bounds: KritzelBoundingBox;\r\n  private capacity: number;\r\n  private objects: T[] = [];\r\n  private children: KritzelOctree<T>[] | null = null;\r\n\r\n  constructor(bounds: KritzelBoundingBox, capacity: number = 8) {\r\n    this.bounds = bounds;\r\n    this.capacity = capacity;\r\n  }\r\n\r\n  reset(): void {\r\n    this.objects = [];\r\n    this.children = null;\r\n  }\r\n\r\n  insert(object: T): boolean {\r\n    if (!this.intersects(object.rotatedBoundingBox, this.bounds)) {\r\n      return false;\r\n    }\r\n\r\n    if (this.objects.length < this.capacity && this.children === null) {\r\n      this.objects.push(object);\r\n      return true;\r\n    }\r\n\r\n    if (this.children === null) {\r\n      this.subdivide();\r\n    }\r\n\r\n    for (const child of this.children!) {\r\n      if (child.insert(object)) {\r\n        return true;\r\n      }\r\n    }\r\n\r\n    return false;\r\n  }\r\n\r\n  update(object: T): boolean {\r\n    const index = this.objects.findIndex(o => o.id === object.id);\r\n\r\n    if (index !== -1) {\r\n      this.objects[index] = object;\r\n      return true;\r\n    }\r\n    if (this.children !== null) {\r\n      for (const child of this.children) {\r\n        if (child.update(object)) {\r\n          return true;\r\n        }\r\n      }\r\n    }\r\n    return false;\r\n  }\r\n\r\n  remove(predicate: (object: T) => boolean): void {\r\n    const index = this.objects.findIndex(o => predicate(o));\r\n    if (index !== -1) {\r\n      this.objects.splice(index, 1);\r\n    }\r\n\r\n    if (this.children !== null) {\r\n      for (const child of this.children) {\r\n        child.remove(predicate);\r\n      }\r\n    }\r\n  }\r\n\r\n  query(range: KritzelBoundingBox): T[] {\r\n    const results: T[] = [];\r\n\r\n    if (!this.intersects(range, this.bounds)) {\r\n      return results;\r\n    }\r\n\r\n    for (const object of this.objects) {\r\n      if (this.intersects(object.rotatedBoundingBox, range)) {\r\n        results.push(object);\r\n      }\r\n    }\r\n\r\n    if (this.children !== null) {\r\n      for (const child of this.children) {\r\n        results.push(...child.query(range));\r\n      }\r\n    }\r\n\r\n    return results;\r\n  }\r\n\r\n  filter(predicate: (object: T) => boolean): T[] {\r\n    const results: T[] = this.objects.filter(o => predicate(o));\r\n    if (this.children !== null) {\r\n      for (const child of this.children) {\r\n        results.push(...child.filter(predicate));\r\n      }\r\n    }\r\n    return results;\r\n  }\r\n\r\n  allObjects(): T[] {\r\n    const results: T[] = [...this.objects];\r\n    if (this.children !== null) {\r\n      for (const child of this.children) {\r\n        results.push(...child.allObjects());\r\n      }\r\n    }\r\n    return results;\r\n  }\r\n\r\n  private subdivide(): void {\r\n    const { x, y, z, width, height, depth } = this.bounds;\r\n    const halfWidth = width / 2;\r\n    const halfHeight = height / 2;\r\n    const halfDepth = depth / 2;\r\n\r\n    this.children = [\r\n      new KritzelOctree<T>({ x, y, z, width: halfWidth, height: halfHeight, depth: halfDepth }, this.capacity),\r\n      new KritzelOctree<T>({ x: x + halfWidth, y, z, width: halfWidth, height: halfHeight, depth: halfDepth }, this.capacity),\r\n      new KritzelOctree<T>({ x, y: y + halfHeight, z, width: halfWidth, height: halfHeight, depth: halfDepth }, this.capacity),\r\n      new KritzelOctree<T>({ x: x + halfWidth, y: y + halfHeight, z, width: halfWidth, height: halfHeight, depth: halfDepth }, this.capacity),\r\n      new KritzelOctree<T>({ x, y, z: z + halfDepth, width: halfWidth, height: halfHeight, depth: halfDepth }, this.capacity),\r\n      new KritzelOctree<T>({ x: x + halfWidth, y, z: z + halfDepth, width: halfWidth, height: halfHeight, depth: halfDepth }, this.capacity),\r\n      new KritzelOctree<T>({ x, y: y + halfHeight, z: z + halfDepth, width: halfWidth, height: halfHeight, depth: halfDepth }, this.capacity),\r\n      new KritzelOctree<T>({ x: x + halfWidth, y: y + halfHeight, z: z + halfDepth, width: halfWidth, height: halfHeight, depth: halfDepth }, this.capacity),\r\n    ];\r\n  }\r\n\r\n  private intersects(a: KritzelBoundingBox, b: KritzelBoundingBox): boolean {\r\n    return !(\r\n      a.x >= b.x + b.width || // a is completely to the right of b\r\n      a.x + a.width <= b.x || // a is completely to the left of b\r\n      a.y >= b.y + b.height || // a is completely below b\r\n      a.y + a.height <= b.y // a is completely above b\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/classes/tools/base-tool.class.js

@@ -0,0 +1,31 @@
+export class KritzelBaseTool {
+    constructor(store) {
+        this.__class__ = this.constructor.name;
+        this.name = 'base-tool';
+        this._store = store;
+        void this._store; // Avoid unused variable warning
+    }
+    onActivate() {
+        // default implementation
+    }
+    onDeactivate() {
+        // default implementation
+    }
+    handlePointerDown(_event) {
+        // default implementation
+    }
+    handlePointerMove(_event) {
+        // default implementation
+    }
+    handlePointerUp(_event) {
+        // default implementation
+    }
+    handleWheel(_event) {
+        // default implementation
+    }
+    revive(object) {
+        Object.assign(this, object);
+        return this;
+    }
+}
+//# sourceMappingURL=base-tool.class.js.map

package/dist/collection/classes/tools/base-tool.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base-tool.class.js","sourceRoot":"","sources":["../../../src/classes/tools/base-tool.class.ts"],"names":[],"mappings":"AAIA,MAAM,OAAO,eAAe;IAO1B,YAAY,KAAmB;QAN/B,cAAS,GAAW,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;QAE1C,SAAI,GAAW,WAAW,CAAC;QAKzB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,KAAK,IAAI,CAAC,MAAM,CAAC,CAAC,gCAAgC;IACpD,CAAC;IAED,UAAU;QACR,yBAAyB;IAC3B,CAAC;IAED,YAAY;QACV,yBAAyB;IAC3B,CAAC;IAED,iBAAiB,CAAC,MAAoB;QACpC,yBAAyB;IAC3B,CAAC;IAED,iBAAiB,CAAC,MAAoB;QACpC,yBAAyB;IAC3B,CAAC;IAED,eAAe,CAAC,MAAoB;QAClC,yBAAyB;IAC3B,CAAC;IAED,WAAW,CAAC,MAAkB;QAC5B,yBAAyB;IAC3B,CAAC;IAED,MAAM,CAAC,MAAW;QAChB,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;QAC5B,OAAO,IAAI,CAAC;IACd,CAAC;CACF","sourcesContent":["import { KritzelTool } from '../../components';\r\nimport { KritzelSerializable } from '../../interfaces/serializable.interface';\r\nimport { KritzelStore } from '../store.class';\r\n\r\nexport class KritzelBaseTool implements KritzelTool, KritzelSerializable {\r\n  __class__: string = this.constructor.name;\r\n\r\n  name: string = 'base-tool';\r\n\r\n  protected readonly _store: KritzelStore;\r\n\r\n  constructor(store: KritzelStore) {\r\n    this._store = store;\r\n    void this._store; // Avoid unused variable warning\r\n  }\r\n\r\n  onActivate(): void {\r\n    // default implementation\r\n  }\r\n\r\n  onDeactivate(): void {\r\n    // default implementation\r\n  }\r\n\r\n  handlePointerDown(_event: PointerEvent): void {\r\n    // default implementation\r\n  }\r\n\r\n  handlePointerMove(_event: PointerEvent): void {\r\n    // default implementation\r\n  }\r\n\r\n  handlePointerUp(_event: PointerEvent): void {\r\n    // default implementation\r\n  }\r\n\r\n  handleWheel(_event: WheelEvent): void {\r\n    // default implementation\r\n  }\r\n\r\n  revive(object: any): KritzelSerializable {\r\n    Object.assign(this, object);\r\n    return this;\r\n  }\r\n}\r\n"]}

package/dist/collection/classes/tools/brush-tool.class.js

@@ -0,0 +1,116 @@
+import { KritzelEventHelper } from "../../helpers/event.helper";
+import { AddObjectCommand } from "../commands/add-object.command";
+import { KritzelPath } from "../objects/path.class";
+import { KritzelBaseTool } from "./base-tool.class";
+export class KritzelBrushTool extends KritzelBaseTool {
+    constructor(store) {
+        super(store);
+        this.type = 'pen';
+        this.color = '#000000';
+        this.size = 6;
+        this.palettes = {
+            pen: ['#000000', '#FFFFFF', '#FF0000', '#00FF00', '#0000FF', '#FFFF00', '#FF00FF', '#00FFFF', '#808080', '#C0C0C0', '#800000', '#008000', '#000080', '#808000', '#800080'],
+            highlighter: ['#ffff00', '#ffb347', '#b4ffb4'],
+        };
+    }
+    handlePointerDown(event) {
+        if (event.cancelable) {
+            event.preventDefault();
+        }
+        if (event.pointerType === 'mouse') {
+            if (KritzelEventHelper.isLeftClick(event)) {
+                this._store.state.isDrawing = true;
+                const x = event.clientX - this._store.offsetX;
+                const y = event.clientY - this._store.offsetY;
+                this._store.state.currentPath = KritzelPath.create(this._store, {
+                    points: [[x, y]],
+                    translateX: -this._store.state.translateX,
+                    translateY: -this._store.state.translateY,
+                    scale: this._store.state.scale,
+                    fill: this.color,
+                    strokeWidth: this.size,
+                });
+            }
+        }
+        if (event.pointerType === 'touch') {
+            const activePointers = Array.from(this._store.state.pointers.values());
+            if (activePointers.length === 1) {
+                const x = Math.round(activePointers[0].clientX - this._store.offsetX);
+                const y = Math.round(activePointers[0].clientY - this._store.offsetY);
+                this._store.state.isDrawing = true;
+                this._store.state.currentPath = KritzelPath.create(this._store, {
+                    points: [[x, y]],
+                    translateX: -this._store.state.translateX,
+                    translateY: -this._store.state.translateY,
+                    scale: this._store.state.scale,
+                    fill: this.color,
+                    strokeWidth: this.size,
+                });
+                this._store.rerender();
+            }
+        }
+    }
+    handlePointerMove(event) {
+        if (event.cancelable) {
+            event.preventDefault();
+        }
+        if (event.pointerType === 'mouse') {
+            if (this._store.state.isDrawing) {
+                const x = event.clientX - this._store.offsetX;
+                const y = event.clientY - this._store.offsetY;
+                this._store.state.currentPath = KritzelPath.create(this._store, {
+                    points: [...this._store.state.currentPath.points, [x, y]],
+                    translateX: -this._store.state.translateX,
+                    translateY: -this._store.state.translateY,
+                    scale: this._store.state.scale,
+                    fill: this.color,
+                    strokeWidth: this.size,
+                });
+                this._store.rerender();
+            }
+        }
+        if (event.pointerType === 'touch') {
+            const activePointers = Array.from(this._store.state.pointers.values());
+            if (activePointers.length === 1) {
+                const x = Math.round(activePointers[0].clientX - this._store.offsetX);
+                const y = Math.round(activePointers[0].clientY - this._store.offsetY);
+                this._store.state.currentPath = KritzelPath.create(this._store, {
+                    points: [...this._store.state.currentPath.points, [x, y]],
+                    translateX: -this._store.state.translateX,
+                    translateY: -this._store.state.translateY,
+                    scale: this._store.state.scale,
+                    fill: this.color,
+                    strokeWidth: this.size,
+                });
+                this._store.rerender();
+            }
+        }
+    }
+    handlePointerUp(event) {
+        if (event.cancelable) {
+            event.preventDefault();
+        }
+        if (event.pointerType === 'mouse') {
+            if (this._store.state.isDrawing) {
+                this._store.state.isDrawing = false;
+                if (this._store.state.currentPath) {
+                    this._store.state.currentPath.zIndex = this._store.currentZIndex;
+                    this._store.history.executeCommand(new AddObjectCommand(this._store, this, this._store.state.currentPath));
+                }
+                this._store.state.currentPath = undefined;
+            }
+        }
+        if (event.pointerType === 'touch') {
+            if (this._store.state.isDrawing) {
+                this._store.state.isDrawing = false;
+                if (this._store.state.currentPath) {
+                    this._store.state.currentPath.zIndex = this._store.currentZIndex;
+                    this._store.history.executeCommand(new AddObjectCommand(this._store, this, this._store.state.currentPath));
+                }
+                this._store.state.currentPath = undefined;
+                this._store.rerender();
+            }
+        }
+    }
+}
+//# sourceMappingURL=brush-tool.class.js.map

package/dist/collection/classes/tools/brush-tool.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"brush-tool.class.js","sourceRoot":"","sources":["../../../src/classes/tools/brush-tool.class.ts"],"names":[],"mappings":"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","sourcesContent":["import { KritzelEventHelper } from '../../helpers/event.helper';\r\nimport { KritzelStore } from '../store.class';\r\nimport { AddObjectCommand } from '../commands/add-object.command';\r\nimport { KritzelPath } from '../objects/path.class';\r\nimport { KritzelBaseTool } from './base-tool.class';\r\n\r\nexport class KritzelBrushTool extends KritzelBaseTool {\r\n  type: 'pen' | 'highlighter' = 'pen';\r\n\r\n  color: string = '#000000';\r\n\r\n  size: number = 6;\r\n\r\n  palettes: {\r\n    [brushType: string]: string[];\r\n  } = {\r\n    pen: ['#000000', '#FFFFFF', '#FF0000', '#00FF00', '#0000FF', '#FFFF00', '#FF00FF', '#00FFFF', '#808080', '#C0C0C0', '#800000', '#008000', '#000080', '#808000', '#800080'],\r\n    highlighter: ['#ffff00', '#ffb347', '#b4ffb4'],\r\n  };\r\n\r\n  constructor(store: KritzelStore) {\r\n    super(store);\r\n  }\r\n\r\n  handlePointerDown(event: PointerEvent): void {\r\n    if (event.cancelable) {\r\n      event.preventDefault();\r\n    }\r\n\r\n    if (event.pointerType === 'mouse') {\r\n      if (KritzelEventHelper.isLeftClick(event)) {\r\n        this._store.state.isDrawing = true;\r\n        const x = event.clientX - this._store.offsetX;\r\n        const y = event.clientY - this._store.offsetY;\r\n\r\n        this._store.state.currentPath = KritzelPath.create(this._store, {\r\n          points: [[x, y]],\r\n          translateX: -this._store.state.translateX,\r\n          translateY: -this._store.state.translateY,\r\n          scale: this._store.state.scale,\r\n          fill: this.color,\r\n          strokeWidth: this.size,\r\n        });\r\n      }\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      const activePointers = Array.from(this._store.state.pointers.values());\r\n\r\n      if (activePointers.length === 1) {\r\n        const x = Math.round(activePointers[0].clientX - this._store.offsetX);\r\n        const y = Math.round(activePointers[0].clientY - this._store.offsetY);\r\n\r\n        this._store.state.isDrawing = true;\r\n\r\n        this._store.state.currentPath = KritzelPath.create(this._store, {\r\n          points: [[x, y]],\r\n          translateX: -this._store.state.translateX,\r\n          translateY: -this._store.state.translateY,\r\n          scale: this._store.state.scale,\r\n          fill: this.color,\r\n          strokeWidth: this.size,\r\n        });\r\n\r\n        this._store.rerender();\r\n      }\r\n    }\r\n  }\r\n\r\n  handlePointerMove(event: PointerEvent): void {\r\n    if (event.cancelable) {\r\n      event.preventDefault();\r\n    }\r\n\r\n    if (event.pointerType === 'mouse') {\r\n      if (this._store.state.isDrawing) {\r\n        const x = event.clientX - this._store.offsetX;\r\n        const y = event.clientY - this._store.offsetY;\r\n\r\n        this._store.state.currentPath = KritzelPath.create(this._store, {\r\n          points: [...this._store.state.currentPath.points, [x, y]],\r\n          translateX: -this._store.state.translateX,\r\n          translateY: -this._store.state.translateY,\r\n          scale: this._store.state.scale,\r\n          fill: this.color,\r\n          strokeWidth: this.size,\r\n        });\r\n\r\n        this._store.rerender();\r\n      }\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      const activePointers = Array.from(this._store.state.pointers.values());\r\n\r\n      if (activePointers.length === 1) {\r\n        const x = Math.round(activePointers[0].clientX - this._store.offsetX);\r\n        const y = Math.round(activePointers[0].clientY - this._store.offsetY);\r\n\r\n        this._store.state.currentPath = KritzelPath.create(this._store, {\r\n          points: [...this._store.state.currentPath.points, [x, y]],\r\n          translateX: -this._store.state.translateX,\r\n          translateY: -this._store.state.translateY,\r\n          scale: this._store.state.scale,\r\n          fill: this.color,\r\n          strokeWidth: this.size,\r\n        });\r\n\r\n        this._store.rerender();\r\n      }\r\n    }\r\n  }\r\n\r\n  handlePointerUp(event: PointerEvent): void {\r\n    if (event.cancelable) {\r\n      event.preventDefault();\r\n    }\r\n\r\n    if (event.pointerType === 'mouse') {\r\n      if (this._store.state.isDrawing) {\r\n        this._store.state.isDrawing = false;\r\n\r\n        if (this._store.state.currentPath) {\r\n          this._store.state.currentPath.zIndex = this._store.currentZIndex;\r\n          this._store.history.executeCommand(new AddObjectCommand(this._store, this, this._store.state.currentPath));\r\n        }\r\n\r\n        this._store.state.currentPath = undefined;\r\n      }\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      if (this._store.state.isDrawing) {\r\n        this._store.state.isDrawing = false;\r\n\r\n        if (this._store.state.currentPath) {\r\n          this._store.state.currentPath.zIndex = this._store.currentZIndex;\r\n          this._store.history.executeCommand(new AddObjectCommand(this._store, this, this._store.state.currentPath));\r\n        }\r\n\r\n        this._store.state.currentPath = undefined;\r\n\r\n        this._store.rerender();\r\n      }\r\n    }\r\n  }\r\n}\r\n"]}

package/dist/collection/classes/tools/eraser-tool.class.js

@@ -0,0 +1,86 @@
+import { KritzelEventHelper } from "../../helpers/event.helper";
+import { BatchCommand } from "../commands/batch.command";
+import { RemoveObjectCommand } from "../commands/remove-object.command";
+import { KritzelBaseTool } from "./base-tool.class";
+export class KritzelEraserTool extends KritzelBaseTool {
+    constructor(store) {
+        super(store);
+        this.touchStartTimeout = null;
+    }
+    handlePointerDown(event) {
+        if (event.pointerType === 'mouse') {
+            if (KritzelEventHelper.isLeftClick(event)) {
+                this._store.state.isErasing = true;
+            }
+        }
+        if (event.pointerType === 'touch') {
+            this.touchStartTimeout = setTimeout(() => {
+                if (this._store.state.pointers.size === 1 && !this._store.state.isScaling) {
+                    this._store.state.isErasing = true;
+                }
+            }, 80);
+        }
+    }
+    handlePointerMove(event) {
+        var _a;
+        if (event.pointerType === 'mouse') {
+            if (this._store.state.isErasing) {
+                const selectedObjects = this._store.getObjectsFromPointerEvent(event, '.object');
+                if (selectedObjects.length === 0)
+                    return;
+                const x = this._store.state.pointerX;
+                const y = this._store.state.pointerY;
+                selectedObjects.forEach(selectedObject => {
+                    selectedObject.markedForRemoval = selectedObject.hitTest(x, y);
+                });
+                this._store.rerender();
+            }
+        }
+        if (event.pointerType === 'touch') {
+            if (this._store.state.pointers.size === 1 && this._store.state.isErasing) {
+                const shadowRoot = (_a = this._store.state.host) === null || _a === void 0 ? void 0 : _a.shadowRoot;
+                if (!shadowRoot)
+                    return;
+                const selectedObjects = this._store.getObjectsFromPointerEvent(event, '.object');
+                if (selectedObjects.length === 0)
+                    return;
+                const x = this._store.state.pointerX;
+                const y = this._store.state.pointerY;
+                selectedObjects.forEach(selectedObject => {
+                    selectedObject.markedForRemoval = selectedObject.hitTest(x, y);
+                });
+                this._store.rerender();
+            }
+        }
+    }
+    handlePointerUp(event) {
+        if (event.pointerType === 'mouse') {
+            if (this._store.state.isErasing) {
+                const removeCommands = this._store.allObjects.filter(object => object.markedForRemoval).map(object => {
+                    object.markedForRemoval = false;
+                    return new RemoveObjectCommand(this._store, this, object);
+                });
+                if (removeCommands.length > 0) {
+                    this._store.history.executeCommand(new BatchCommand(this._store, this, removeCommands));
+                }
+                this._store.state.isErasing = false;
+            }
+        }
+        if (event.pointerType === 'touch') {
+            clearTimeout(this.touchStartTimeout);
+            if (this._store.state.isErasing) {
+                const removeCommands = this._store.allObjects
+                    .filter(object => object.markedForRemoval)
+                    .map(object => {
+                    object.markedForRemoval = false;
+                    return new RemoveObjectCommand(this._store, this, object);
+                });
+                if (removeCommands.length > 0) {
+                    this._store.history.executeCommand(new BatchCommand(this._store, this, removeCommands));
+                }
+                this._store.state.isErasing = false;
+            }
+        }
+    }
+}
+//# sourceMappingURL=eraser-tool.class.js.map

package/dist/collection/classes/tools/eraser-tool.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"eraser-tool.class.js","sourceRoot":"","sources":["../../../src/classes/tools/eraser-tool.class.ts"],"names":[],"mappings":"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","sourcesContent":["import { KritzelEventHelper } from '../../helpers/event.helper';\r\nimport { KritzelStore } from '../store.class';\r\nimport { BatchCommand } from '../commands/batch.command';\r\nimport { RemoveObjectCommand } from '../commands/remove-object.command';\r\nimport { KritzelBaseTool } from './base-tool.class';\r\n\r\nexport class KritzelEraserTool extends KritzelBaseTool {\r\n  touchStartTimeout: any = null;\r\n\r\n  constructor(store: KritzelStore) {\r\n    super(store);\r\n  }\r\n\r\n  handlePointerDown(event: PointerEvent): void {\r\n    if (event.pointerType === 'mouse') {\r\n      if (KritzelEventHelper.isLeftClick(event)) {\r\n        this._store.state.isErasing = true;\r\n      }\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      this.touchStartTimeout = setTimeout(() => {\r\n        if (this._store.state.pointers.size === 1 && !this._store.state.isScaling) {\r\n          this._store.state.isErasing = true;\r\n        }\r\n      }, 80);\r\n    }\r\n  }\r\n\r\n  handlePointerMove(event: PointerEvent): void {\r\n    if (event.pointerType === 'mouse') {\r\n      if (this._store.state.isErasing) {\r\n        \r\n        const selectedObjects = this._store.getObjectsFromPointerEvent(event, '.object');\r\n\r\n        if (selectedObjects.length === 0) return;\r\n\r\n        const x = this._store.state.pointerX;\r\n        const y = this._store.state.pointerY;\r\n\r\n        selectedObjects.forEach(selectedObject => {\r\n          selectedObject.markedForRemoval = selectedObject.hitTest(x, y);\r\n        });\r\n\r\n        this._store.rerender();\r\n      }\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      if (this._store.state.pointers.size === 1 && this._store.state.isErasing) {\r\n        const shadowRoot = this._store.state.host?.shadowRoot;\r\n        if (!shadowRoot) return;\r\n        \r\n        const selectedObjects = this._store.getObjectsFromPointerEvent(event, '.object');\r\n\r\n        if (selectedObjects.length === 0) return;\r\n\r\n        const x = this._store.state.pointerX;\r\n        const y = this._store.state.pointerY;\r\n\r\n        selectedObjects.forEach(selectedObject => {\r\n          selectedObject.markedForRemoval = selectedObject.hitTest(x, y);\r\n        });\r\n\r\n        this._store.rerender();\r\n      }\r\n    }\r\n  }\r\n\r\n  handlePointerUp(event: PointerEvent): void {\r\n    if (event.pointerType === 'mouse') {\r\n      if (this._store.state.isErasing) {\r\n        const removeCommands = this._store.allObjects.filter(object => object.markedForRemoval).map(object => {\r\n          object.markedForRemoval = false;\r\n          return new RemoveObjectCommand(this._store, this, object);\r\n        });\r\n\r\n        if (removeCommands.length > 0) {\r\n          this._store.history.executeCommand(new BatchCommand(this._store, this, removeCommands));\r\n        }\r\n\r\n        this._store.state.isErasing = false;\r\n      }\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      clearTimeout(this.touchStartTimeout);\r\n\r\n      if (this._store.state.isErasing) {\r\n        const removeCommands = this._store.allObjects\r\n          .filter(object => object.markedForRemoval)\r\n          .map(object => {\r\n            object.markedForRemoval = false;\r\n            return new RemoveObjectCommand(this._store, this, object);\r\n          });\r\n\r\n        if (removeCommands.length > 0) {\r\n          this._store.history.executeCommand(new BatchCommand(this._store, this, removeCommands));\r\n        }\r\n\r\n        this._store.state.isErasing = false;\r\n      }\r\n    }\r\n  }\r\n}\r\n"]}

package/dist/collection/classes/tools/image-tool.class.js

@@ -0,0 +1,91 @@
+import { KritzelSelectionGroup } from "../objects/selection-group.class";
+import { KritzelImage } from "../objects/image.class";
+import { KritzelBaseTool } from "./base-tool.class";
+import { AddObjectCommand } from "../commands/add-object.command";
+import { BatchCommand } from "../commands/batch.command";
+import { AddSelectionGroupCommand } from "../commands/add-selection-group.command";
+import imageCompression from "browser-image-compression";
+import { KritzelToolRegistry } from "../registries/tool.registry";
+export class KritzelImageTool extends KritzelBaseTool {
+    constructor(store) {
+        super(store);
+        this.fileInput = null;
+        this.maxCompressionSize = 300;
+        this.setupFileInput();
+    }
+    onActivate() {
+        this.openFilePicker();
+    }
+    openFilePicker() {
+        if (this._store.isDisabled) {
+            return;
+        }
+        this.fileInput.click();
+    }
+    setupFileInput() {
+        this.fileInput = document.createElement('input');
+        this.fileInput.type = 'file';
+        this.fileInput.accept = 'image/*';
+        this.fileInput.style.display = 'none';
+        this.fileInput.addEventListener('change', this.handleFileSelect.bind(this));
+        this.fileInput.addEventListener('cancel', this.handleCancel.bind(this));
+        document.body.appendChild(this.fileInput);
+    }
+    handleFileSelect(event) {
+        const input = event.target;
+        if (input.files && input.files[0]) {
+            const file = input.files[0];
+            imageCompression(file, {
+                maxWidthOrHeight: this.maxCompressionSize,
+            })
+                .then(compressedFile => {
+                this.readFile(compressedFile);
+            })
+                .catch(error => {
+                console.error('Error during image compression or processing:', error);
+                this.handleCancel();
+            });
+        }
+        else {
+            console.info('File selection cancelled by user.');
+            this.handleCancel();
+        }
+        if (input) {
+            input.value = '';
+        }
+    }
+    readFile(file) {
+        const reader = new FileReader();
+        reader.onload = e => {
+            var _a;
+            const img = new Image();
+            img.src = (_a = e.target) === null || _a === void 0 ? void 0 : _a.result;
+            img.onload = () => this.createKritzelImage(img);
+        };
+        reader.readAsDataURL(file);
+    }
+    createKritzelImage(img) {
+        const image = KritzelImage.create(this._store);
+        const { scaledWidth, scaledHeight } = image.calculateScaledDimensions(img);
+        image.src = img.src;
+        image.width = scaledWidth;
+        image.height = scaledHeight;
+        image.zIndex = this._store.currentZIndex;
+        image.centerInViewport();
+        this.addImageToStore(image);
+        return image;
+    }
+    addImageToStore(image) {
+        const selectionGroup = KritzelSelectionGroup.create(this._store);
+        selectionGroup.addOrRemove(image);
+        selectionGroup.isSelected = true;
+        const addImageCommand = new AddObjectCommand(this._store, this, image);
+        const addSelectionGroupCommand = new AddSelectionGroupCommand(this._store, this, selectionGroup);
+        this._store.history.executeCommand(new BatchCommand(this._store, this, [addImageCommand, addSelectionGroupCommand]));
+        this._store.setState('activeTool', KritzelToolRegistry.getTool('selection'));
+    }
+    handleCancel() {
+        this._store.setState('activeTool', KritzelToolRegistry.getTool('selection'));
+    }
+}
+//# sourceMappingURL=image-tool.class.js.map

package/dist/collection/classes/tools/image-tool.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-tool.class.js","sourceRoot":"","sources":["../../../src/classes/tools/image-tool.class.ts"],"names":[],"mappings":"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","sourcesContent":["import { KritzelSelectionGroup } from '../objects/selection-group.class';\r\nimport { KritzelImage } from '../objects/image.class';\r\nimport { KritzelStore } from '../store.class';\r\nimport { KritzelBaseTool } from './base-tool.class';\r\nimport { AddObjectCommand } from '../commands/add-object.command';\r\nimport { BatchCommand } from '../commands/batch.command';\r\nimport { AddSelectionGroupCommand } from '../commands/add-selection-group.command';\r\nimport imageCompression from 'browser-image-compression';\r\nimport { KritzelToolRegistry } from '../registries/tool.registry';\r\n\r\nexport class KritzelImageTool extends KritzelBaseTool {\r\n  fileInput: HTMLInputElement | null = null;\r\n\r\n  maxCompressionSize: number = 300;\r\n\r\n  constructor(store: KritzelStore) {\r\n    super(store);\r\n    this.setupFileInput();\r\n  }\r\n\r\n  override onActivate(): void {\r\n    this.openFilePicker();\r\n  }\r\n\r\n  private openFilePicker(): void {\r\n     if(this._store.isDisabled){\r\n      return;\r\n    }\r\n    \r\n    this.fileInput.click();\r\n  }\r\n\r\n  private setupFileInput(): void {\r\n    this.fileInput = document.createElement('input');\r\n    this.fileInput.type = 'file';\r\n    this.fileInput.accept = 'image/*';\r\n    this.fileInput.style.display = 'none';\r\n\r\n    this.fileInput.addEventListener('change', this.handleFileSelect.bind(this));\r\n    this.fileInput.addEventListener('cancel', this.handleCancel.bind(this));\r\n    document.body.appendChild(this.fileInput);\r\n  }\r\n\r\n  private handleFileSelect(event: Event): void {\r\n    const input = event.target as HTMLInputElement;\r\n    if (input.files && input.files[0]) {\r\n      const file = input.files[0];\r\n      imageCompression(file, {\r\n        maxWidthOrHeight: this.maxCompressionSize,\r\n      })\r\n        .then(compressedFile => {\r\n          this.readFile(compressedFile);\r\n        })\r\n        .catch(error => {\r\n          console.error('Error during image compression or processing:', error);\r\n          this.handleCancel();\r\n        });\r\n    } else {\r\n      console.info('File selection cancelled by user.');\r\n      this.handleCancel();\r\n    }\r\n\r\n    if (input) {\r\n      input.value = '';\r\n    }\r\n  }\r\n\r\n  private readFile(file: File): void {\r\n    const reader = new FileReader();\r\n    reader.onload = e => {\r\n      const img = new Image();\r\n      img.src = e.target?.result as string;\r\n      img.onload = () => this.createKritzelImage(img);\r\n    };\r\n    reader.readAsDataURL(file);\r\n  }\r\n\r\n\r\n  private createKritzelImage(img: HTMLImageElement): KritzelImage {\r\n    const image = KritzelImage.create(this._store);\r\n    const { scaledWidth, scaledHeight } = image.calculateScaledDimensions(img);\r\n    image.src = img.src;\r\n    image.width = scaledWidth;\r\n    image.height = scaledHeight;\r\n    image.zIndex = this._store.currentZIndex;\r\n    image.centerInViewport();\r\n    this.addImageToStore(image);\r\n    return image;\r\n  }\r\n\r\n  private addImageToStore(image: KritzelImage): void {\r\n    const selectionGroup = KritzelSelectionGroup.create(this._store);\r\n    selectionGroup.addOrRemove(image);\r\n    selectionGroup.isSelected = true;\r\n\r\n    const addImageCommand = new AddObjectCommand(this._store, this, image);\r\n    const addSelectionGroupCommand = new AddSelectionGroupCommand(this._store, this, selectionGroup);\r\n\r\n    this._store.history.executeCommand(new BatchCommand(this._store, this, [addImageCommand, addSelectionGroupCommand]));\r\n\r\n    this._store.setState('activeTool', KritzelToolRegistry.getTool('selection'));\r\n  }\r\n\r\n  private handleCancel(): void {\r\n    this._store.setState('activeTool', KritzelToolRegistry.getTool('selection'));\r\n  }\r\n}\r\n"]}

package/dist/collection/classes/tools/selection-tool.class.js

@@ -0,0 +1,156 @@
+import { KritzelEventHelper } from "../../helpers/event.helper";
+import { RemoveSelectionGroupCommand } from "../commands/remove-selection-group.command";
+import { KritzelMoveHandler } from "../handlers/move.handler";
+import { KritzelResizeHandler } from "../handlers/resize.handler";
+import { KritzelRotationHandler } from "../handlers/rotation.handler";
+import { KritzelSelectionHandler } from "../handlers/selection.handler";
+import { KritzelSelectionGroup } from "../objects/selection-group.class";
+import { KritzelBaseTool } from "./base-tool.class";
+import { KritzelHoverHandler } from "../handlers/hover.handler";
+export class KritzelSelectionTool extends KritzelBaseTool {
+    constructor(store) {
+        super(store);
+        this.selectionHandler = new KritzelSelectionHandler(this._store);
+        this.moveHandler = new KritzelMoveHandler(this._store);
+        this.hoverHandler = new KritzelHoverHandler(this._store);
+        this.resizeHandler = new KritzelResizeHandler(this._store);
+        this.rotationHandler = new KritzelRotationHandler(this._store);
+    }
+    handlePointerDown(event) {
+        if (event.cancelable) {
+            event.preventDefault();
+        }
+        if (event.pointerType === 'mouse') {
+            if (KritzelEventHelper.isLeftClick(event)) {
+                this._store.state.isResizeHandleSelected = this.isHandleSelected(event);
+                this._store.state.isRotationHandleSelected = this.isRotationHandleSelected(event);
+                this._store.state.resizeHandleType = this.getHandleType(event);
+                const selectedObject = this.getSelectedObject(event);
+                const isDifferentObject = selectedObject && this._store.state.selectionGroup && selectedObject.id !== this._store.state.selectionGroup.id;
+                if ((selectedObject === null || isDifferentObject) &&
+                    this._store.state.selectionGroup &&
+                    !this._store.state.isResizeHandleSelected &&
+                    !this._store.state.isRotationHandleSelected) {
+                    this._store.history.executeCommand(new RemoveSelectionGroupCommand(this._store, this._store.state.selectionGroup));
+                }
+                if (selectedObject && selectedObject.isSelected === false && (selectedObject === null || selectedObject === void 0 ? void 0 : selectedObject.objects.length) === 1 && selectedObject.objects[0].isInteractive) {
+                    return;
+                }
+            }
+            this.moveHandler.handlePointerDown(event);
+            this.selectionHandler.handlePointerDown(event);
+            this.resizeHandler.handlePointerDown(event);
+            this.rotationHandler.handlePointerDown(event);
+            this._store.rerender();
+        }
+        if (event.pointerType === 'touch') {
+            if (this._store.state.isScaling === true) {
+                return;
+            }
+            if (this._store.state.pointers.size === 1) {
+                this._store.state.isResizeHandleSelected = this.isHandleSelected(event);
+                this._store.state.isRotationHandleSelected = this.isRotationHandleSelected(event);
+                this._store.state.resizeHandleType = this.getHandleType(event);
+                const selectedObject = this.getSelectedObject(event);
+                const isDifferentObject = selectedObject && this._store.state.selectionGroup && selectedObject.id !== this._store.state.selectionGroup.id;
+                if (!this._store.state.selectionGroup && selectedObject) {
+                    this._store.state.skipContextMenu = true;
+                }
+                if ((selectedObject === null || isDifferentObject) &&
+                    this._store.state.selectionGroup &&
+                    !this._store.state.isResizeHandleSelected &&
+                    !this._store.state.isRotationHandleSelected) {
+                    this._store.history.executeCommand(new RemoveSelectionGroupCommand(this._store, this._store.state.selectionGroup));
+                }
+            }
+            this.rotationHandler.handlePointerDown(event);
+            this.resizeHandler.handlePointerDown(event);
+            this.moveHandler.handlePointerDown(event);
+            this.selectionHandler.handlePointerDown(event);
+        }
+    }
+    handlePointerMove(event) {
+        if (event.cancelable) {
+            event.preventDefault();
+        }
+        if (event.pointerType === 'mouse') {
+            this.moveHandler.handlePointerMove(event);
+            this.hoverHandler.handlePointerMove(event);
+            this.selectionHandler.handlePointerMove(event);
+            this.resizeHandler.handlePointerMove(event);
+            this.rotationHandler.handlePointerMove(event);
+            this._store.rerender();
+        }
+        if (event.pointerType === 'touch') {
+            if (this._store.state.isScaling === true) {
+                return;
+            }
+            this.rotationHandler.handlePointerMove(event);
+            this.resizeHandler.handlePointerMove(event);
+            this.moveHandler.handlePointerMove(event);
+            this.selectionHandler.handlePointerMove(event);
+            this._store.rerender();
+        }
+    }
+    handlePointerUp(event) {
+        if (event.cancelable) {
+            event.preventDefault();
+        }
+        if (event.pointerType === 'mouse') {
+            this.moveHandler.handlePointerUp(event);
+            this.selectionHandler.handlePointerUp(event);
+            this.resizeHandler.handlePointerUp(event);
+            this.rotationHandler.handlePointerUp(event);
+            this._store.rerender();
+        }
+        if (event.pointerType === 'touch') {
+            if (this._store.state.isScaling === true) {
+                return;
+            }
+            this.rotationHandler.handlePointerUp(event);
+            this.resizeHandler.handlePointerUp(event);
+            this.moveHandler.handlePointerUp(event);
+            this.selectionHandler.handlePointerUp(event);
+        }
+    }
+    getSelectedObject(event) {
+        const path = event.composedPath().slice(1);
+        const objectElement = path.find(element => element.classList && element.classList.contains('object'));
+        const object = this._store.findObjectById(objectElement === null || objectElement === void 0 ? void 0 : objectElement.id);
+        if (!object) {
+            return null;
+        }
+        if (object instanceof KritzelSelectionGroup) {
+            return object;
+        }
+        else {
+            const group = KritzelSelectionGroup.create(this._store);
+            group.translateX = 0;
+            group.translateY = 0;
+            group.addOrRemove(object);
+            return group;
+        }
+    }
+    getHandleType(event) {
+        var _a;
+        const shadowRoot = (_a = this._store.state.host) === null || _a === void 0 ? void 0 : _a.shadowRoot;
+        if (!shadowRoot)
+            return;
+        const elementAtPoint = shadowRoot.elementFromPoint(event.clientX, event.clientY);
+        const handle = elementAtPoint === null || elementAtPoint === void 0 ? void 0 : elementAtPoint.closest('.resize-handle-overlay');
+        return handle === null || handle === void 0 ? void 0 : handle.classList[1];
+    }
+    isHandleSelected(event) {
+        var _a;
+        const shadowRoot = (_a = this._store.state.host) === null || _a === void 0 ? void 0 : _a.shadowRoot;
+        if (!shadowRoot)
+            return false;
+        const elementAtPoint = shadowRoot.elementFromPoint(event.clientX, event.clientY);
+        return !!(elementAtPoint === null || elementAtPoint === void 0 ? void 0 : elementAtPoint.classList.contains('resize-handle-overlay'));
+    }
+    isRotationHandleSelected(event) {
+        const path = event.composedPath();
+        return !!path.find(element => element.classList && element.classList.contains('rotation-handle-overlay'));
+    }
+}
+//# sourceMappingURL=selection-tool.class.js.map

package/dist/collection/classes/tools/selection-tool.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"selection-tool.class.js","sourceRoot":"","sources":["../../../src/classes/tools/selection-tool.class.ts"],"names":[],"mappings":"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","sourcesContent":["import { KritzelHandleType } from '../../enums/handle-type.enum';\r\nimport { KritzelEventHelper } from '../../helpers/event.helper';\r\nimport { KritzelStore } from '../store.class';\r\nimport { RemoveSelectionGroupCommand } from '../commands/remove-selection-group.command';\r\nimport { KritzelMoveHandler } from '../handlers/move.handler';\r\nimport { KritzelResizeHandler } from '../handlers/resize.handler';\r\nimport { KritzelRotationHandler } from '../handlers/rotation.handler';\r\nimport { KritzelSelectionHandler } from '../handlers/selection.handler';\r\nimport { KritzelSelectionGroup } from '../objects/selection-group.class';\r\nimport { KritzelBaseTool } from './base-tool.class';\r\nimport { KritzelHoverHandler } from '../handlers/hover.handler';\r\n\r\nexport class KritzelSelectionTool extends KritzelBaseTool {\r\n  selectionHandler: KritzelSelectionHandler;\r\n  moveHandler: KritzelMoveHandler;\r\n  hoverHandler: KritzelHoverHandler;\r\n  resizeHandler: KritzelResizeHandler;\r\n  rotationHandler: KritzelRotationHandler;\r\n\r\n  constructor(store: KritzelStore) {\r\n    super(store);\r\n    this.selectionHandler = new KritzelSelectionHandler(this._store);\r\n    this.moveHandler = new KritzelMoveHandler(this._store);\r\n    this.hoverHandler = new KritzelHoverHandler(this._store);\r\n    this.resizeHandler = new KritzelResizeHandler(this._store);\r\n    this.rotationHandler = new KritzelRotationHandler(this._store);\r\n  }\r\n\r\n  handlePointerDown(event: PointerEvent): void {\r\n     if (event.cancelable) {\r\n      event.preventDefault();\r\n    }\r\n\r\n    if (event.pointerType === 'mouse') {\r\n      if (KritzelEventHelper.isLeftClick(event)) {\r\n        this._store.state.isResizeHandleSelected = this.isHandleSelected(event);\r\n        this._store.state.isRotationHandleSelected = this.isRotationHandleSelected(event);\r\n        this._store.state.resizeHandleType = this.getHandleType(event);\r\n\r\n        const selectedObject = this.getSelectedObject(event);\r\n        const isDifferentObject = selectedObject && this._store.state.selectionGroup && selectedObject.id !== this._store.state.selectionGroup.id;\r\n\r\n        if (\r\n          (selectedObject === null || isDifferentObject) &&\r\n          this._store.state.selectionGroup &&\r\n          !this._store.state.isResizeHandleSelected &&\r\n          !this._store.state.isRotationHandleSelected\r\n        ) {\r\n          this._store.history.executeCommand(new RemoveSelectionGroupCommand(this._store, this._store.state.selectionGroup));\r\n        }\r\n\r\n        if(selectedObject && selectedObject.isSelected === false && selectedObject?.objects.length === 1 && selectedObject.objects[0].isInteractive) {\r\n          return;\r\n        }\r\n      }\r\n\r\n      this.moveHandler.handlePointerDown(event);\r\n      this.selectionHandler.handlePointerDown(event);\r\n      this.resizeHandler.handlePointerDown(event);\r\n      this.rotationHandler.handlePointerDown(event);\r\n\r\n      this._store.rerender();\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      if (this._store.state.isScaling === true) {\r\n        return;\r\n      }\r\n\r\n      if (this._store.state.pointers.size === 1) {\r\n        this._store.state.isResizeHandleSelected = this.isHandleSelected(event);\r\n        this._store.state.isRotationHandleSelected = this.isRotationHandleSelected(event);\r\n        this._store.state.resizeHandleType = this.getHandleType(event);\r\n\r\n        const selectedObject = this.getSelectedObject(event);\r\n        const isDifferentObject = selectedObject && this._store.state.selectionGroup && selectedObject.id !== this._store.state.selectionGroup.id;\r\n\r\n        if (!this._store.state.selectionGroup && selectedObject) {\r\n          this._store.state.skipContextMenu = true;\r\n        }\r\n\r\n        if (\r\n          (selectedObject === null || isDifferentObject) &&\r\n          this._store.state.selectionGroup &&\r\n          !this._store.state.isResizeHandleSelected &&\r\n          !this._store.state.isRotationHandleSelected\r\n        ) {\r\n          this._store.history.executeCommand(new RemoveSelectionGroupCommand(this._store, this._store.state.selectionGroup));\r\n        }\r\n\r\n      }\r\n\r\n      this.rotationHandler.handlePointerDown(event);\r\n      this.resizeHandler.handlePointerDown(event);\r\n      this.moveHandler.handlePointerDown(event);\r\n      this.selectionHandler.handlePointerDown(event);\r\n    }\r\n  }\r\n\r\n  handlePointerMove(event: PointerEvent): void {\r\n     if (event.cancelable) {\r\n      event.preventDefault();\r\n    }\r\n\r\n    if (event.pointerType === 'mouse') {\r\n      this.moveHandler.handlePointerMove(event);\r\n      this.hoverHandler.handlePointerMove(event);\r\n      this.selectionHandler.handlePointerMove(event);\r\n      this.resizeHandler.handlePointerMove(event);\r\n      this.rotationHandler.handlePointerMove(event);\r\n\r\n      this._store.rerender();\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      if (this._store.state.isScaling === true) {\r\n        return;\r\n      }\r\n\r\n      this.rotationHandler.handlePointerMove(event);\r\n      this.resizeHandler.handlePointerMove(event);\r\n      this.moveHandler.handlePointerMove(event);\r\n      this.selectionHandler.handlePointerMove(event);\r\n\r\n      this._store.rerender();\r\n    }\r\n  }\r\n\r\n  handlePointerUp(event: PointerEvent): void {\r\n     if (event.cancelable) {\r\n      event.preventDefault();\r\n    }\r\n\r\n    if (event.pointerType === 'mouse') {\r\n      this.moveHandler.handlePointerUp(event);\r\n      this.selectionHandler.handlePointerUp(event);\r\n      this.resizeHandler.handlePointerUp(event);\r\n      this.rotationHandler.handlePointerUp(event);\r\n\r\n      this._store.rerender();\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      if (this._store.state.isScaling === true) {\r\n        return;\r\n      }\r\n\r\n      this.rotationHandler.handlePointerUp(event);\r\n      this.resizeHandler.handlePointerUp(event);\r\n      this.moveHandler.handlePointerUp(event);\r\n      this.selectionHandler.handlePointerUp(event);\r\n    }\r\n  }\r\n\r\n  private getSelectedObject(event: PointerEvent): KritzelSelectionGroup | null {\r\n    const path = event.composedPath().slice(1) as HTMLElement[];\r\n    const objectElement = path.find(element => element.classList && element.classList.contains('object'));\r\n    const object = this._store.findObjectById(objectElement?.id);\r\n\r\n    if (!object) {\r\n      return null;\r\n    }\r\n\r\n    if (object instanceof KritzelSelectionGroup) {\r\n      return object;\r\n    } else {\r\n      const group = KritzelSelectionGroup.create(this._store);\r\n      group.translateX = 0;\r\n      group.translateY = 0;\r\n      group.addOrRemove(object);\r\n      return group;\r\n    }\r\n  }\r\n\r\n  private getHandleType(event: PointerEvent): KritzelHandleType | undefined {\r\n    const shadowRoot = this._store.state.host?.shadowRoot;\r\n    if (!shadowRoot) return;\r\n\r\n    const elementAtPoint = shadowRoot.elementFromPoint(event.clientX, event.clientY);\r\n\r\n    const handle = elementAtPoint?.closest('.resize-handle-overlay') as HTMLElement | null;\r\n\r\n    return handle?.classList[1] as KritzelHandleType;\r\n  }\r\n\r\n  private isHandleSelected(event: PointerEvent): boolean {\r\n    const shadowRoot = this._store.state.host?.shadowRoot;\r\n    if (!shadowRoot) return false;\r\n\r\n    const elementAtPoint = shadowRoot.elementFromPoint(event.clientX, event.clientY);\r\n\r\n    return !!elementAtPoint?.classList.contains('resize-handle-overlay');\r\n  }\r\n\r\n  private isRotationHandleSelected(event: PointerEvent): boolean {\r\n    const path = event.composedPath() as HTMLElement[];\r\n\r\n    return !!path.find(element => element.classList && element.classList.contains('rotation-handle-overlay'));\r\n  }\r\n}\r\n"]}