kritzel-stencil 0.0.121 → 0.0.122

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

@@ -22,28 +22,34 @@ export class KritzelEraserTool extends KritzelBaseTool {
         }
     }
     handlePointerMove(event) {
-        var _a, _b;
+        var _a;
         if (event.pointerType === 'mouse') {
             if (this._store.state.isErasing) {
-                const shadowRoot = (_a = this._store.state.host) === null || _a === void 0 ? void 0 : _a.shadowRoot;
-                if (!shadowRoot)
-                    return;
-                const selectedObject = this._store.getObjectFromPointerEvent(event, '.object');
-                if (!selectedObject)
+                const selectedObjects = this._store.getObjectsFromPointerEvent(event, '.object');
+                if (selectedObjects.length === 0)
                     return;
-                selectedObject.markedForRemoval = true;
+                console.log('selectedObjects', selectedObjects);
+                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 = (_b = this._store.state.host) === null || _b === void 0 ? void 0 : _b.shadowRoot;
+                const shadowRoot = (_a = this._store.state.host) === null || _a === void 0 ? void 0 : _a.shadowRoot;
                 if (!shadowRoot)
                     return;
-                const selectedObject = this._store.getObjectFromPointerEvent(event, '.object');
-                if (!selectedObject)
+                const selectedObjects = this._store.getObjectsFromPointerEvent(event, '.object');
+                if (selectedObjects.length === 0)
                     return;
-                selectedObject.markedForRemoval = true;
+                const x = this._store.state.pointerX;
+                const y = this._store.state.pointerY;
+                selectedObjects.forEach(selectedObject => {
+                    selectedObject.markedForRemoval = selectedObject.hitTest(x, y);
+                });
                 this._store.rerender();
             }
         }
@@ -51,9 +57,7 @@ export class KritzelEraserTool extends KritzelBaseTool {
     handlePointerUp(event) {
         if (event.pointerType === 'mouse') {
             if (this._store.state.isErasing) {
-                const removeCommands = this._store.allObjects
-                    .filter(object => object.markedForRemoval)
-                    .map(object => {
+                const removeCommands = this._store.allObjects.filter(object => object.markedForRemoval).map(object => {
                     object.markedForRemoval = false;
                     return new RemoveObjectCommand(this._store, this, object);
                 });

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

@@ -1 +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        const shadowRoot = this._store.state.host?.shadowRoot;\r\n        if (!shadowRoot) return;\r\n\r\n        const selectedObject = this._store.getObjectFromPointerEvent(event, '.object');\r\n        if (!selectedObject) return;\r\n\r\n        selectedObject.markedForRemoval = true;\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 selectedObject = this._store.getObjectFromPointerEvent(event, '.object');\r\n        if (!selectedObject) return;\r\n\r\n        selectedObject.markedForRemoval = true;\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\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    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"]}
+{"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        console.log('selectedObjects', selectedObjects);\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

@@ -75,7 +75,7 @@ export class KritzelImageTool extends KritzelBaseTool {
     addImageToStore(image) {
         const selectionGroup = KritzelSelectionGroup.create(this._store);
         selectionGroup.addOrRemove(image);
-        selectionGroup.selected = true;
+        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]));

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

@@ -1 +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    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.selected = 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"]}
+{"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    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

@@ -31,12 +31,8 @@ export class KritzelSelectionTool extends KritzelBaseTool {
                     !this._store.state.isRotationHandleSelected) {
                     this._store.history.executeCommand(new RemoveSelectionGroupCommand(this._store, this._store.state.selectionGroup));
                 }
-                if (selectedObject && selectedObject.selected && selectedObject.objects.length === 1) {
-                    setTimeout(() => {
-                        if (this._store.state.isDragging === false && this._store.state.isResizing === false && this._store.state.isRotating === false) {
-                            selectedObject.objects[0].onSelectedClick();
-                        }
-                    }, 100);
+                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);

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

@@ -1 +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\n\r\nexport class KritzelSelectionTool extends KritzelBaseTool {\r\n  selectionHandler: KritzelSelectionHandler;\r\n  moveHandler: KritzelMoveHandler;\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.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.selected && selectedObject.objects.length === 1) {\r\n          setTimeout(() => {\r\n            if (this._store.state.isDragging === false && this._store.state.isResizing === false && this._store.state.isRotating === false) {\r\n              selectedObject.objects[0].onSelectedClick();\r\n            }\r\n          }, 100);\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.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"]}
+{"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\n\r\nexport class KritzelSelectionTool extends KritzelBaseTool {\r\n  selectionHandler: KritzelSelectionHandler;\r\n  moveHandler: KritzelMoveHandler;\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.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.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"]}

package/dist/collection/classes/viewport.class.js

@@ -48,21 +48,27 @@ export class KritzelViewport {
     }
     handlePointerMove(event) {
         if (event.pointerType === 'mouse') {
-            const adjustedClientX = event.clientX - this._store.offsetX;
-            const adjustedClientY = event.clientY - this._store.offsetY;
-            this._store.state.cursorX = adjustedClientX;
-            this._store.state.cursorY = adjustedClientY;
+            const hostRect = this._store.state.host.getBoundingClientRect();
+            const xRelativeToHost = event.clientX - hostRect.left;
+            const yRelativeToHost = event.clientY - hostRect.top;
+            this._store.state.pointerX = (xRelativeToHost - this._store.state.translateX) / this._store.state.scale;
+            this._store.state.pointerY = (yRelativeToHost - this._store.state.translateY) / this._store.state.scale;
             if (this._store.state.isPanning) {
-                this._store.state.translateX -= this._store.state.startX - adjustedClientX;
-                this._store.state.translateY -= this._store.state.startY - adjustedClientY;
-                this._store.state.startX = adjustedClientX;
-                this._store.state.startY = adjustedClientY;
+                this._store.state.translateX -= this._store.state.startX - xRelativeToHost;
+                this._store.state.translateY -= this._store.state.startY - yRelativeToHost;
+                this._store.state.startX = xRelativeToHost;
+                this._store.state.startY = yRelativeToHost;
                 this._store.state.hasViewportChanged = true;
                 this._store.state.skipContextMenu = true;
                 this._store.rerender();
             }
         }
         if (event.pointerType === 'touch') {
+            const hostRect = this._store.state.host.getBoundingClientRect();
+            const xRelativeToHost = event.clientX - hostRect.left;
+            const yRelativeToHost = event.clientY - hostRect.top;
+            this._store.state.pointerX = (xRelativeToHost - this._store.state.translateX) / this._store.state.scale;
+            this._store.state.pointerY = (yRelativeToHost - this._store.state.translateY) / this._store.state.scale;
             const activePointers = Array.from(this._store.state.pointers.values());
             if (activePointers.length === 2) {
                 const firstTouchX = activePointers[0].clientX - this._store.offsetX;
@@ -116,13 +122,15 @@ export class KritzelViewport {
     }
     handleZoom(event) {
         const rect = this._store.state.host.getBoundingClientRect();
-        this._store.state.cursorX = event.clientX - rect.left;
-        this._store.state.cursorY = event.clientY - rect.top;
+        const xRelativeToHost = event.clientX - rect.left;
+        const yRelativeToHost = event.clientY - rect.top;
+        this._store.state.pointerX = (xRelativeToHost - this._store.state.translateX) / this._store.state.scale;
+        this._store.state.pointerY = (yRelativeToHost - this._store.state.translateY) / this._store.state.scale;
         const delta = event.deltaY > 0 ? -this._store.state.scaleStep * this._store.state.scale : this._store.state.scaleStep * this._store.state.scale;
         const newScale = Math.min(this._store.state.scaleMax, Math.max(this._store.state.scaleMin, this._store.state.scale + delta));
         const scaleRatio = newScale / this._store.state.scale;
-        const translateXAdjustment = (this._store.state.cursorX - this._store.state.translateX) * (scaleRatio - 1);
-        const translateYAdjustment = (this._store.state.cursorY - this._store.state.translateY) * (scaleRatio - 1);
+        const translateXAdjustment = (xRelativeToHost - this._store.state.translateX) * (scaleRatio - 1);
+        const translateYAdjustment = (yRelativeToHost - this._store.state.translateY) * (scaleRatio - 1);
         this._store.state.scale = newScale;
         this._store.state.translateX -= translateXAdjustment;
         this._store.state.translateY -= translateYAdjustment;

package/dist/collection/classes/viewport.class.js.map

@@ -1 +1 @@
-{"version":3,"file":"viewport.class.js","sourceRoot":"","sources":["../../src/classes/viewport.class.ts"],"names":[],"mappings":"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","sourcesContent":["import { KritzelMouseButton } from '../enums/event-button.enum';\r\nimport { KritzelEventHelper } from '../helpers/event.helper';\r\nimport { KritzelStore } from './store.class';\r\n\r\nexport class KritzelViewport {\r\n  private readonly _store: KritzelStore;\r\n\r\n  initialTouchDistance: number = 0;\r\n  startX: number = 0;\r\n  startY: number = 0;\r\n\r\n  constructor(store: KritzelStore, host: HTMLElement) {\r\n    this._store = store;\r\n    this._store.state.host = host;\r\n    this._store.state.viewportWidth = host.clientWidth;\r\n    this._store.state.viewportHeight = host.clientHeight;\r\n    this._store.state.startX = 0;\r\n    this._store.state.startY = 0;\r\n    this._store.state.translateX = 0;\r\n    this._store.state.translateY = 0;\r\n  }\r\n\r\n  handleResize(): void {\r\n    this._store.state.viewportWidth = this._store.state.host.clientWidth;\r\n    this._store.state.viewportHeight = this._store.state.host.clientHeight;\r\n    this._store.state.hasViewportChanged = true;\r\n    this._store.rerender();\r\n  }\r\n\r\n  handlePointerDown(event: PointerEvent): void {\r\n    if (event.pointerType === 'mouse') {\r\n      const adjustedClientX = event.clientX - this._store.offsetX;\r\n      const adjustedClientY = event.clientY - this._store.offsetY;\r\n\r\n      if (event.button === KritzelMouseButton.Right) {\r\n        this._store.state.isPanning = true;\r\n        this._store.state.startX = adjustedClientX;\r\n        this._store.state.startY = adjustedClientY;\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 === 2) {\r\n        this._store.state.currentPath = null;\r\n        this._store.state.isScaling = true;\r\n\r\n        const firstTouchX = activePointers[0].clientX - this._store.offsetX;\r\n        const firstTouchY = activePointers[0].clientY - this._store.offsetY;\r\n\r\n        const secondTouchX = activePointers[1].clientX - this._store.offsetX;\r\n        const secondTouchY = activePointers[1].clientY - this._store.offsetY;\r\n\r\n        this.initialTouchDistance = Math.sqrt(Math.pow(firstTouchX - secondTouchX, 2) + Math.pow(firstTouchY - secondTouchY, 2));\r\n\r\n        this.startX = (firstTouchX + secondTouchX) / 2;\r\n        this.startY = (firstTouchY + secondTouchY) / 2;\r\n        this._store.rerender();\r\n      }\r\n    }\r\n  }\r\n\r\n  handlePointerMove(event: PointerEvent): void {\r\n    if (event.pointerType === 'mouse') {\r\n      const adjustedClientX = event.clientX - this._store.offsetX;\r\n      const adjustedClientY = event.clientY - this._store.offsetY;\r\n\r\n      this._store.state.cursorX = adjustedClientX;\r\n      this._store.state.cursorY = adjustedClientY;\r\n\r\n      if (this._store.state.isPanning) {\r\n        this._store.state.translateX -= this._store.state.startX - adjustedClientX;\r\n        this._store.state.translateY -= this._store.state.startY - adjustedClientY;\r\n        this._store.state.startX = adjustedClientX;\r\n        this._store.state.startY = adjustedClientY;\r\n        this._store.state.hasViewportChanged = true;\r\n        this._store.state.skipContextMenu = true;\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 === 2) {\r\n        const firstTouchX = activePointers[0].clientX - this._store.offsetX;\r\n        const firstTouchY = activePointers[0].clientY - this._store.offsetY;\r\n\r\n        const secondTouchX = activePointers[1].clientX - this._store.offsetX;\r\n        const secondTouchY = activePointers[1].clientY - this._store.offsetY;\r\n\r\n        const currentTouchDistance = Math.sqrt(Math.pow(firstTouchX - secondTouchX, 2) + Math.pow(firstTouchY - secondTouchY, 2));\r\n\r\n        const midpointX = (firstTouchX + secondTouchX) / 2;\r\n        const midpointY = (firstTouchY + secondTouchY) / 2;\r\n\r\n        const scaleRatio = currentTouchDistance / this.initialTouchDistance!;\r\n        const newScale = this._store.state.scale * scaleRatio;\r\n\r\n        if (newScale > this._store.state.scaleMax || newScale < this._store.state.scaleMin) {\r\n          this._store.state.translateX += midpointX - this.startX;\r\n          this._store.state.translateY += midpointY - this.startY;\r\n        } else {\r\n          const translateXAdjustment = (midpointX - this._store.state.translateX) * (scaleRatio - 1);\r\n          const translateYAdjustment = (midpointY - this._store.state.translateY) * (scaleRatio - 1);\r\n\r\n          this._store.state.translateX += midpointX - this.startX - translateXAdjustment;\r\n          this._store.state.translateY += midpointY - this.startY - translateYAdjustment;\r\n          this._store.state.scale = newScale;\r\n\r\n          this.initialTouchDistance = currentTouchDistance;\r\n        }\r\n\r\n        this.startX = midpointX;\r\n        this.startY = midpointY;\r\n\r\n        this._store.state.hasViewportChanged = true;\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.isPanning) {\r\n        this._store.state.isPanning = false;\r\n        this._store.rerender();\r\n      }\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      this._store.state.isScaling = false;\r\n      this._store.rerender();\r\n    }\r\n  }\r\n\r\n  handleWheel(event: WheelEvent): void {\r\n    event.preventDefault();\r\n\r\n    if (event.ctrlKey === true && KritzelEventHelper.isMainMouseWheel(event)) {\r\n      this.handleZoom(event);\r\n    }\r\n\r\n    if (!event.ctrlKey) {\r\n      this.handlePan(event);\r\n    }\r\n  }\r\n\r\n  private handleZoom(event: WheelEvent): void {\r\n    const rect = this._store.state.host.getBoundingClientRect();\r\n    this._store.state.cursorX = event.clientX - rect.left;\r\n    this._store.state.cursorY = event.clientY - rect.top;\r\n\r\n    const delta = event.deltaY > 0 ? -this._store.state.scaleStep * this._store.state.scale : this._store.state.scaleStep * this._store.state.scale;\r\n    const newScale = Math.min(this._store.state.scaleMax, Math.max(this._store.state.scaleMin, this._store.state.scale + delta));\r\n\r\n    const scaleRatio = newScale / this._store.state.scale;\r\n    const translateXAdjustment = (this._store.state.cursorX - this._store.state.translateX) * (scaleRatio - 1);\r\n    const translateYAdjustment = (this._store.state.cursorY - this._store.state.translateY) * (scaleRatio - 1);\r\n\r\n    this._store.state.scale = newScale;\r\n\r\n    this._store.state.translateX -= translateXAdjustment;\r\n    this._store.state.translateY -= translateYAdjustment;\r\n\r\n    this._store.state.hasViewportChanged = true;\r\n    this._store.rerender();\r\n  }\r\n\r\n  private handlePan(event: WheelEvent): void {\r\n    const panSpeed = 0.8;\r\n\r\n    this._store.state.translateX -= event.deltaX * panSpeed;\r\n    this._store.state.translateY -= event.deltaY * panSpeed;\r\n\r\n    this._store.state.hasViewportChanged = true;\r\n    this._store.rerender();\r\n  }\r\n}"]}
+{"version":3,"file":"viewport.class.js","sourceRoot":"","sources":["../../src/classes/viewport.class.ts"],"names":[],"mappings":"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","sourcesContent":["import { KritzelMouseButton } from '../enums/event-button.enum';\r\nimport { KritzelEventHelper } from '../helpers/event.helper';\r\nimport { KritzelStore } from './store.class';\r\n\r\nexport class KritzelViewport {\r\n  private readonly _store: KritzelStore;\r\n\r\n  initialTouchDistance: number = 0;\r\n  startX: number = 0;\r\n  startY: number = 0;\r\n\r\n  constructor(store: KritzelStore, host: HTMLElement) {\r\n    this._store = store;\r\n    this._store.state.host = host;\r\n    this._store.state.viewportWidth = host.clientWidth;\r\n    this._store.state.viewportHeight = host.clientHeight;\r\n    this._store.state.startX = 0;\r\n    this._store.state.startY = 0;\r\n    this._store.state.translateX = 0;\r\n    this._store.state.translateY = 0;\r\n  }\r\n\r\n  handleResize(): void {\r\n    this._store.state.viewportWidth = this._store.state.host.clientWidth;\r\n    this._store.state.viewportHeight = this._store.state.host.clientHeight;\r\n    this._store.state.hasViewportChanged = true;\r\n    this._store.rerender();\r\n  }\r\n\r\n  handlePointerDown(event: PointerEvent): void {\r\n    if (event.pointerType === 'mouse') {\r\n      const adjustedClientX = event.clientX - this._store.offsetX;\r\n      const adjustedClientY = event.clientY - this._store.offsetY;\r\n\r\n      if (event.button === KritzelMouseButton.Right) {\r\n        this._store.state.isPanning = true;\r\n        this._store.state.startX = adjustedClientX;\r\n        this._store.state.startY = adjustedClientY;\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 === 2) {\r\n        this._store.state.currentPath = null;\r\n        this._store.state.isScaling = true;\r\n\r\n        const firstTouchX = activePointers[0].clientX - this._store.offsetX;\r\n        const firstTouchY = activePointers[0].clientY - this._store.offsetY;\r\n\r\n        const secondTouchX = activePointers[1].clientX - this._store.offsetX;\r\n        const secondTouchY = activePointers[1].clientY - this._store.offsetY;\r\n\r\n        this.initialTouchDistance = Math.sqrt(Math.pow(firstTouchX - secondTouchX, 2) + Math.pow(firstTouchY - secondTouchY, 2));\r\n\r\n        this.startX = (firstTouchX + secondTouchX) / 2;\r\n        this.startY = (firstTouchY + secondTouchY) / 2;\r\n        this._store.rerender();\r\n      }\r\n    }\r\n  }\r\n\r\n  handlePointerMove(event: PointerEvent): void {\r\n    if (event.pointerType === 'mouse') {\r\n      const hostRect = this._store.state.host.getBoundingClientRect();\r\n      const xRelativeToHost = event.clientX - hostRect.left;\r\n      const yRelativeToHost = event.clientY - hostRect.top;\r\n\r\n      this._store.state.pointerX = (xRelativeToHost - this._store.state.translateX) / this._store.state.scale;\r\n      this._store.state.pointerY = (yRelativeToHost - this._store.state.translateY) / this._store.state.scale;\r\n\r\n      if (this._store.state.isPanning) {\r\n        this._store.state.translateX -= this._store.state.startX - xRelativeToHost;\r\n        this._store.state.translateY -= this._store.state.startY - yRelativeToHost;\r\n        this._store.state.startX = xRelativeToHost;\r\n        this._store.state.startY = yRelativeToHost;\r\n        this._store.state.hasViewportChanged = true;\r\n        this._store.state.skipContextMenu = true;\r\n        this._store.rerender();\r\n      }\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      const hostRect = this._store.state.host.getBoundingClientRect();\r\n      const xRelativeToHost = event.clientX - hostRect.left;\r\n      const yRelativeToHost = event.clientY - hostRect.top;\r\n\r\n      this._store.state.pointerX = (xRelativeToHost - this._store.state.translateX) / this._store.state.scale;\r\n      this._store.state.pointerY = (yRelativeToHost - this._store.state.translateY) / this._store.state.scale;\r\n\r\n      const activePointers = Array.from(this._store.state.pointers.values());\r\n\r\n      if (activePointers.length === 2) {\r\n        const firstTouchX = activePointers[0].clientX - this._store.offsetX;\r\n        const firstTouchY = activePointers[0].clientY - this._store.offsetY;\r\n\r\n        const secondTouchX = activePointers[1].clientX - this._store.offsetX;\r\n        const secondTouchY = activePointers[1].clientY - this._store.offsetY;\r\n\r\n        const currentTouchDistance = Math.sqrt(Math.pow(firstTouchX - secondTouchX, 2) + Math.pow(firstTouchY - secondTouchY, 2));\r\n\r\n        const midpointX = (firstTouchX + secondTouchX) / 2;\r\n        const midpointY = (firstTouchY + secondTouchY) / 2;\r\n\r\n        const scaleRatio = currentTouchDistance / this.initialTouchDistance!;\r\n        const newScale = this._store.state.scale * scaleRatio;\r\n\r\n        if (newScale > this._store.state.scaleMax || newScale < this._store.state.scaleMin) {\r\n          this._store.state.translateX += midpointX - this.startX;\r\n          this._store.state.translateY += midpointY - this.startY;\r\n        } else {\r\n          const translateXAdjustment = (midpointX - this._store.state.translateX) * (scaleRatio - 1);\r\n          const translateYAdjustment = (midpointY - this._store.state.translateY) * (scaleRatio - 1);\r\n\r\n          this._store.state.translateX += midpointX - this.startX - translateXAdjustment;\r\n          this._store.state.translateY += midpointY - this.startY - translateYAdjustment;\r\n          this._store.state.scale = newScale;\r\n\r\n          this.initialTouchDistance = currentTouchDistance;\r\n        }\r\n\r\n        this.startX = midpointX;\r\n        this.startY = midpointY;\r\n\r\n        this._store.state.hasViewportChanged = true;\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.isPanning) {\r\n        this._store.state.isPanning = false;\r\n        this._store.rerender();\r\n      }\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      this._store.state.isScaling = false;\r\n      this._store.rerender();\r\n    }\r\n  }\r\n\r\n  handleWheel(event: WheelEvent): void {\r\n    event.preventDefault();\r\n\r\n    if (event.ctrlKey === true && KritzelEventHelper.isMainMouseWheel(event)) {\r\n      this.handleZoom(event);\r\n    }\r\n\r\n    if (!event.ctrlKey) {\r\n      this.handlePan(event);\r\n    }\r\n  }\r\n\r\n  private handleZoom(event: WheelEvent): void {\r\n    const rect = this._store.state.host.getBoundingClientRect();\r\n    const xRelativeToHost = event.clientX - rect.left;\r\n    const yRelativeToHost = event.clientY - rect.top;\r\n\r\n    this._store.state.pointerX = (xRelativeToHost - this._store.state.translateX) / this._store.state.scale;\r\n    this._store.state.pointerY = (yRelativeToHost - this._store.state.translateY) / this._store.state.scale;\r\n\r\n    const delta = event.deltaY > 0 ? -this._store.state.scaleStep * this._store.state.scale : this._store.state.scaleStep * this._store.state.scale;\r\n    const newScale = Math.min(this._store.state.scaleMax, Math.max(this._store.state.scaleMin, this._store.state.scale + delta));\r\n\r\n    const scaleRatio = newScale / this._store.state.scale;\r\n    const translateXAdjustment = (xRelativeToHost - this._store.state.translateX) * (scaleRatio - 1);\r\n    const translateYAdjustment = (yRelativeToHost - this._store.state.translateY) * (scaleRatio - 1);\r\n\r\n    this._store.state.scale = newScale;\r\n\r\n    this._store.state.translateX -= translateXAdjustment;\r\n    this._store.state.translateY -= translateYAdjustment;\r\n\r\n    this._store.state.hasViewportChanged = true;\r\n    this._store.rerender();\r\n  }\r\n\r\n  private handlePan(event: WheelEvent): void {\r\n    const panSpeed = 0.8;\r\n\r\n    this._store.state.translateX -= event.deltaX * panSpeed;\r\n    this._store.state.translateY -= event.deltaY * panSpeed;\r\n\r\n    this._store.state.hasViewportChanged = true;\r\n    this._store.rerender();\r\n  }\r\n}\r\n"]}

package/dist/collection/components/core/kritzel-editor/kritzel-editor.js

@@ -23,8 +23,8 @@ export class KritzelEditor {
                 name: 'brush',
                 type: 'tool',
                 tool: KritzelBrushTool,
-                isDefault: true,
                 icon: 'pen',
+                isDefault: true,
                 config: DEFAULT_BRUSH_CONFIG,
             },
             {
@@ -76,14 +76,14 @@ export class KritzelEditor {
                             object.edit();
                         }
                     }
-                }
+                },
             },
             { label: 'Copy', icon: 'copy', action: () => this.engineRef.copy() },
             {
                 label: 'Paste',
                 icon: 'paste',
                 disabled: async () => (await this.engineRef.getCopiedObjects()).length === 0,
-                action: (menu, _) => this.engineRef.paste(menu.x, menu.y)
+                action: (menu, _) => this.engineRef.paste(menu.x, menu.y),
             },
             { label: 'Delete', icon: 'delete', action: () => this.engineRef.delete() },
             { label: 'Bring to Front', icon: 'bring-to-front', action: () => this.engineRef.moveToTop() },
@@ -162,7 +162,7 @@ export class KritzelEditor {
         }
     }
     render() {
-        return (h(Host, { key: '2b269b9caee7c54eaea7782e22b0aa4620a89787' }, h("kritzel-engine", { key: '9ba5fbb01d673fdc74c1d9789640f3e513d290d2', ref: el => (this.engineRef = el), onIsEngineReady: () => (this.isEngineReady = true), scaleMax: this.scaleMax, scaleMin: this.scaleMin, globalContextMenuItems: this.globalContextMenuItems, objectContextMenuItems: this.objectContextMenuItems }), h("kritzel-controls", { key: 'f21688e22f401430966561f5992049c9faf077c1', ref: el => (this.controlsRef = el), controls: this.controls, isUtilityPanelVisible: this.isUtilityPanelVisible, style: this.isControlsVisible ? { display: 'flex' } : { display: 'none' }, onIsControlsReady: () => (this.isControlsReady = true) })));
+        return (h(Host, { key: 'f2fa7efff5baf4df8a9b2100b96e1546731b006b' }, h("kritzel-engine", { key: 'd4fc5d1b0827656119b14c9e2971818904f41c3f', ref: el => (this.engineRef = el), onIsEngineReady: () => (this.isEngineReady = true), scaleMax: this.scaleMax, scaleMin: this.scaleMin, globalContextMenuItems: this.globalContextMenuItems, objectContextMenuItems: this.objectContextMenuItems }), h("kritzel-controls", { key: 'd5f3a9b3d23090bbc8f36b8f974226697868988d', ref: el => (this.controlsRef = el), controls: this.controls, isUtilityPanelVisible: this.isUtilityPanelVisible, style: this.isControlsVisible ? { display: 'flex' } : { display: 'none' }, onIsControlsReady: () => (this.isControlsReady = true) })));
     }
     static get is() { return "kritzel-editor"; }
     static get originalStyleUrls() {
@@ -240,7 +240,7 @@ export class KritzelEditor {
                 },
                 "getter": false,
                 "setter": false,
-                "defaultValue": "[\r\n    {\r\n      name: 'selection',\r\n      type: 'tool',\r\n      tool: KritzelSelectionTool,\r\n      icon: 'cursor',\r\n    },\r\n    {\r\n      name: 'brush',\r\n      type: 'tool',\r\n      tool: KritzelBrushTool,\r\n      isDefault: true,\r\n      icon: 'pen',\r\n      config: DEFAULT_BRUSH_CONFIG,\r\n    },\r\n    {\r\n      name: 'eraser',\r\n      type: 'tool',\r\n      tool: KritzelEraserTool,\r\n      icon: 'eraser',\r\n    },\r\n    {\r\n      name: 'text',\r\n      type: 'tool',\r\n      tool: KritzelTextTool,\r\n      icon: 'type',\r\n      config: DEFAULT_TEXT_CONFIG,\r\n    },\r\n    {\r\n      name: 'image',\r\n      type: 'tool',\r\n      tool: KritzelImageTool,\r\n      icon: 'image',\r\n    },\r\n    {\r\n      name: 'divider',\r\n      type: 'divider',\r\n    },\r\n    {\r\n      name: 'config',\r\n      type: 'config',\r\n    },\r\n  ]"
+                "defaultValue": "[\r\n    {\r\n      name: 'selection',\r\n      type: 'tool',\r\n      tool: KritzelSelectionTool,\r\n      icon: 'cursor',\r\n    },\r\n    {\r\n      name: 'brush',\r\n      type: 'tool',\r\n      tool: KritzelBrushTool,\r\n      icon: 'pen',\r\n      isDefault: true,\r\n      config: DEFAULT_BRUSH_CONFIG,\r\n    },\r\n    {\r\n      name: 'eraser',\r\n      type: 'tool',\r\n      tool: KritzelEraserTool,\r\n      icon: 'eraser',\r\n    },\r\n    {\r\n      name: 'text',\r\n      type: 'tool',\r\n      tool: KritzelTextTool,\r\n      icon: 'type',\r\n      config: DEFAULT_TEXT_CONFIG,\r\n    },\r\n    {\r\n      name: 'image',\r\n      type: 'tool',\r\n      tool: KritzelImageTool,\r\n      icon: 'image',\r\n    },\r\n    {\r\n      name: 'divider',\r\n      type: 'divider',\r\n    },\r\n    {\r\n      name: 'config',\r\n      type: 'config',\r\n    },\r\n  ]"
             },
             "globalContextMenuItems": {
                 "type": "unknown",
@@ -290,7 +290,7 @@ export class KritzelEditor {
                 },
                 "getter": false,
                 "setter": false,
-                "defaultValue": "[\r\n    {\r\n      label: 'Edit',\r\n      icon: 'pen',\r\n      visible: (_, objects) => objects.length === 1 && objects[0].isEditable,\r\n      action: (_, objects) => {\r\n        if (objects.length === 1) {\r\n          const object = objects[0];\r\n          if (object.isEditable) {\r\n            object.edit();\r\n          }\r\n        }\r\n      }\r\n    },\r\n    { label: 'Copy', icon: 'copy', action: () => this.engineRef.copy() },\r\n    {\r\n      label: 'Paste',\r\n      icon: 'paste',\r\n      disabled: async () => (await this.engineRef.getCopiedObjects()).length === 0,\r\n      action: (menu, _) => this.engineRef.paste(menu.x, menu.y)\r\n    },\r\n    { label: 'Delete', icon: 'delete', action: () => this.engineRef.delete() },\r\n    { label: 'Bring to Front', icon: 'bring-to-front', action: () => this.engineRef.moveToTop() },\r\n    { label: 'Send to Back', icon: 'send-to-back', action: () => this.engineRef.moveToBottom() },\r\n  ]"
+                "defaultValue": "[\r\n    {\r\n      label: 'Edit',\r\n      icon: 'pen',\r\n      visible: (_, objects) => objects.length === 1 && objects[0].isEditable,\r\n      action: (_, objects) => {\r\n        if (objects.length === 1) {\r\n          const object = objects[0];\r\n          if (object.isEditable) {\r\n            object.edit();\r\n          }\r\n        }\r\n      },\r\n    },\r\n    { label: 'Copy', icon: 'copy', action: () => this.engineRef.copy() },\r\n    {\r\n      label: 'Paste',\r\n      icon: 'paste',\r\n      disabled: async () => (await this.engineRef.getCopiedObjects()).length === 0,\r\n      action: (menu, _) => this.engineRef.paste(menu.x, menu.y),\r\n    },\r\n    { label: 'Delete', icon: 'delete', action: () => this.engineRef.delete() },\r\n    { label: 'Bring to Front', icon: 'bring-to-front', action: () => this.engineRef.moveToTop() },\r\n    { label: 'Send to Back', icon: 'send-to-back', action: () => this.engineRef.moveToBottom() },\r\n  ]"
             },
             "customSvgIcons": {
                 "type": "unknown",

package/dist/collection/components/core/kritzel-editor/kritzel-editor.js.map

@@ -1 +1 @@
-{"version":3,"file":"kritzel-editor.js","sourceRoot":"","sources":["../../../../src/components/core/kritzel-editor/kritzel-editor.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Listen, Prop, Element, h, Method, Event, State, EventEmitter, Watch } from '@stencil/core';\r\nimport { KritzelIconRegistry } from '../../../classes/registries/icon-registry.class';\r\nimport { KritzelToolbarControl } from '../../../interfaces/toolbar-control.interface';\r\nimport { KritzelBaseObject } from '../../../classes/objects/base-object.class';\r\nimport { KritzelSelectionTool } from '../../../classes/tools/selection-tool.class';\r\nimport { KritzelEraserTool } from '../../../classes/tools/eraser-tool.class';\r\nimport { KritzelImageTool } from '../../../classes/tools/image-tool.class';\r\nimport { KritzelBrushTool } from '../../../classes/tools/brush-tool.class';\r\nimport { KritzelTextTool } from '../../../classes/tools/text-tool.class';\r\nimport { ContextMenuItem } from '../../../interfaces/context-menu-item.interface';\r\nimport { DEFAULT_BRUSH_CONFIG } from '../../../configs/default-brush-tool.config';\r\nimport { DEFAULT_TEXT_CONFIG } from '../../../configs/default-text-tool.config';\r\nimport { ABSOLUTE_SCALE_MAX, ABSOLUTE_SCALE_MIN } from '../../../constants/engine.constants';\r\n\r\n@Component({\r\n  tag: 'kritzel-editor',\r\n  styleUrl: 'kritzel-editor.css',\r\n  shadow: false,\r\n})\r\nexport class KritzelEditor {\r\n  @Prop()\r\n  scaleMax: number = ABSOLUTE_SCALE_MAX;\r\n\r\n  @Prop()\r\n  scaleMin: number = ABSOLUTE_SCALE_MIN;\r\n\r\n  @Prop()\r\n  controls: KritzelToolbarControl[] = [\r\n    {\r\n      name: 'selection',\r\n      type: 'tool',\r\n      tool: KritzelSelectionTool,\r\n      icon: 'cursor',\r\n    },\r\n    {\r\n      name: 'brush',\r\n      type: 'tool',\r\n      tool: KritzelBrushTool,\r\n      isDefault: true,\r\n      icon: 'pen',\r\n      config: DEFAULT_BRUSH_CONFIG,\r\n    },\r\n    {\r\n      name: 'eraser',\r\n      type: 'tool',\r\n      tool: KritzelEraserTool,\r\n      icon: 'eraser',\r\n    },\r\n    {\r\n      name: 'text',\r\n      type: 'tool',\r\n      tool: KritzelTextTool,\r\n      icon: 'type',\r\n      config: DEFAULT_TEXT_CONFIG,\r\n    },\r\n    {\r\n      name: 'image',\r\n      type: 'tool',\r\n      tool: KritzelImageTool,\r\n      icon: 'image',\r\n    },\r\n    {\r\n      name: 'divider',\r\n      type: 'divider',\r\n    },\r\n    {\r\n      name: 'config',\r\n      type: 'config',\r\n    },\r\n  ];\r\n\r\n  @Prop()\r\n  globalContextMenuItems: ContextMenuItem[] = [\r\n    {\r\n      label: 'Paste',\r\n      icon: 'paste',\r\n      disabled: async () => (await this.engineRef.getCopiedObjects()).length === 0,\r\n      action: menu => this.engineRef.paste(menu.x, menu.y),\r\n    },\r\n    { label: 'Select All', icon: 'select-all', action: () => this.selectAllObjectsInViewport() },\r\n  ];\r\n\r\n  @Prop()\r\n  objectContextMenuItems: ContextMenuItem[] = [\r\n    {\r\n      label: 'Edit',\r\n      icon: 'pen',\r\n      visible: (_, objects) => objects.length === 1 && objects[0].isEditable,\r\n      action: (_, objects) => {\r\n        if (objects.length === 1) {\r\n          const object = objects[0];\r\n          if (object.isEditable) {\r\n            object.edit();\r\n          }\r\n        }\r\n      }\r\n    },\r\n    { label: 'Copy', icon: 'copy', action: () => this.engineRef.copy() },\r\n    {\r\n      label: 'Paste',\r\n      icon: 'paste',\r\n      disabled: async () => (await this.engineRef.getCopiedObjects()).length === 0,\r\n      action: (menu, _) => this.engineRef.paste(menu.x, menu.y)\r\n    },\r\n    { label: 'Delete', icon: 'delete', action: () => this.engineRef.delete() },\r\n    { label: 'Bring to Front', icon: 'bring-to-front', action: () => this.engineRef.moveToTop() },\r\n    { label: 'Send to Back', icon: 'send-to-back', action: () => this.engineRef.moveToBottom() },\r\n  ];\r\n\r\n  @Prop()\r\n  customSvgIcons: Record<string, string> = {};\r\n\r\n  @Prop()\r\n  isControlsVisible: boolean = true;\r\n\r\n  @Prop()\r\n  isUtilityPanelVisible: boolean = true;\r\n\r\n  @Event()\r\n  isReady: EventEmitter<HTMLElement>;\r\n\r\n  @Element()\r\n  host!: HTMLElement;\r\n\r\n  @State()\r\n  isEngineReady: boolean = false;\r\n\r\n  @State()\r\n  isControlsReady: boolean = false;\r\n\r\n  @Watch('isEngineReady')\r\n  onIsEngineReady(newValue: boolean) {\r\n    if (newValue && this.isControlsReady) {\r\n      this.checkIsReady();\r\n    }\r\n  }\r\n\r\n  @Watch('isControlsReady')\r\n  onIsControlsReady(newValue: boolean) {\r\n    if (newValue && this.isEngineReady) {\r\n      this.checkIsReady();\r\n    }\r\n  }\r\n\r\n  @Method()\r\n  async getObjectById<T extends KritzelBaseObject>(id: string): Promise<T | null> {\r\n    return this.engineRef.getObjectById(id);\r\n  }\r\n\r\n  @Method()\r\n  async addObject<T extends KritzelBaseObject>(object: T): Promise<T | null> {\r\n    return this.engineRef.addObject(object);\r\n  }\r\n\r\n  @Method()\r\n  async updateObject<T extends KritzelBaseObject>(object: T, updatedProperties: Partial<T>): Promise<T | null> {\r\n    return this.engineRef.updateObject(object, updatedProperties);\r\n  }\r\n\r\n  @Method()\r\n  async removeObject<T extends KritzelBaseObject>(object: T): Promise<T | null> {\r\n    return this.engineRef.removeObject(object);\r\n  }\r\n\r\n  @Method()\r\n  async getSelectedObjects(): Promise<KritzelBaseObject[]> {\r\n    return this.engineRef.getSelectedObjects();\r\n  }\r\n\r\n  @Method()\r\n  async selectObjects(objects: KritzelBaseObject[]) {\r\n    return this.engineRef.selectObjects(objects);\r\n  }\r\n\r\n  @Method()\r\n  async selectAllObjectsInViewport() {\r\n    return this.engineRef.selectAllObjectsInViewport();\r\n  }\r\n\r\n  @Method()\r\n  async clearSelection() {\r\n    this.engineRef.clearSelection();\r\n  }\r\n\r\n  @Method()\r\n  async centerObjectInViewport(object: KritzelBaseObject) {\r\n    return this.engineRef.centerObjectInViewport(object);\r\n  }\r\n\r\n  @Listen('dblclick', { passive: false })\r\n  handleTouchStart(event: MouseEvent) {\r\n    if (event.cancelable) {\r\n      event.preventDefault();\r\n    }\r\n  }\r\n\r\n  @Listen('keydown', { target: 'window' })\r\n  handleKeyDown(event) {\r\n    if (event.key === 'Escape') {\r\n      event.preventDefault();\r\n      this.controlsRef?.closeTooltip();\r\n    }\r\n  }\r\n\r\n  engineRef!: HTMLKritzelEngineElement;\r\n\r\n  controlsRef!: HTMLKritzelControlsElement;\r\n\r\n  componentDidLoad() {\r\n    this.registerCustomSvgIcons();\r\n  }\r\n\r\n  async checkIsReady() {\r\n    await customElements.whenDefined('kritzel-editor');\r\n    await customElements.whenDefined('kritzel-controls');\r\n    await customElements.whenDefined('kritzel-engine');\r\n\r\n    if (!this.isEngineReady || !this.isControlsReady) {\r\n      return;\r\n    }\r\n\r\n    this.isReady.emit(this.host);\r\n  }\r\n\r\n  private registerCustomSvgIcons() {\r\n    for (const [name, svg] of Object.entries(this.customSvgIcons)) {\r\n      KritzelIconRegistry.register(name, svg);\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <kritzel-engine\r\n          ref={el => (this.engineRef = el)}\r\n          onIsEngineReady={() => (this.isEngineReady = true)}\r\n          scaleMax={this.scaleMax}\r\n          scaleMin={this.scaleMin}\r\n          globalContextMenuItems={this.globalContextMenuItems}\r\n          objectContextMenuItems={this.objectContextMenuItems}\r\n        ></kritzel-engine>\r\n\r\n        <kritzel-controls\r\n          ref={el => (this.controlsRef = el)}\r\n          controls={this.controls}\r\n          isUtilityPanelVisible={this.isUtilityPanelVisible}\r\n          style={this.isControlsVisible ? { display: 'flex' } : { display: 'none' }}\r\n          onIsControlsReady={() => (this.isControlsReady = true)}\r\n        ></kritzel-controls>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"kritzel-editor.js","sourceRoot":"","sources":["../../../../src/components/core/kritzel-editor/kritzel-editor.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Listen, Prop, Element, h, Method, Event, State, EventEmitter, Watch } from '@stencil/core';\r\nimport { KritzelIconRegistry } from '../../../classes/registries/icon-registry.class';\r\nimport { KritzelToolbarControl } from '../../../interfaces/toolbar-control.interface';\r\nimport { KritzelBaseObject } from '../../../classes/objects/base-object.class';\r\nimport { KritzelSelectionTool } from '../../../classes/tools/selection-tool.class';\r\nimport { KritzelEraserTool } from '../../../classes/tools/eraser-tool.class';\r\nimport { KritzelImageTool } from '../../../classes/tools/image-tool.class';\r\nimport { KritzelBrushTool } from '../../../classes/tools/brush-tool.class';\r\nimport { KritzelTextTool } from '../../../classes/tools/text-tool.class';\r\nimport { ContextMenuItem } from '../../../interfaces/context-menu-item.interface';\r\nimport { DEFAULT_BRUSH_CONFIG } from '../../../configs/default-brush-tool.config';\r\nimport { DEFAULT_TEXT_CONFIG } from '../../../configs/default-text-tool.config';\r\nimport { ABSOLUTE_SCALE_MAX, ABSOLUTE_SCALE_MIN } from '../../../constants/engine.constants';\r\n\r\n@Component({\r\n  tag: 'kritzel-editor',\r\n  styleUrl: 'kritzel-editor.css',\r\n  shadow: false,\r\n})\r\nexport class KritzelEditor {\r\n  @Prop()\r\n  scaleMax: number = ABSOLUTE_SCALE_MAX;\r\n\r\n  @Prop()\r\n  scaleMin: number = ABSOLUTE_SCALE_MIN;\r\n\r\n  @Prop()\r\n  controls: KritzelToolbarControl[] = [\r\n    {\r\n      name: 'selection',\r\n      type: 'tool',\r\n      tool: KritzelSelectionTool,\r\n      icon: 'cursor',\r\n    },\r\n    {\r\n      name: 'brush',\r\n      type: 'tool',\r\n      tool: KritzelBrushTool,\r\n      icon: 'pen',\r\n      isDefault: true,\r\n      config: DEFAULT_BRUSH_CONFIG,\r\n    },\r\n    {\r\n      name: 'eraser',\r\n      type: 'tool',\r\n      tool: KritzelEraserTool,\r\n      icon: 'eraser',\r\n    },\r\n    {\r\n      name: 'text',\r\n      type: 'tool',\r\n      tool: KritzelTextTool,\r\n      icon: 'type',\r\n      config: DEFAULT_TEXT_CONFIG,\r\n    },\r\n    {\r\n      name: 'image',\r\n      type: 'tool',\r\n      tool: KritzelImageTool,\r\n      icon: 'image',\r\n    },\r\n    {\r\n      name: 'divider',\r\n      type: 'divider',\r\n    },\r\n    {\r\n      name: 'config',\r\n      type: 'config',\r\n    },\r\n  ];\r\n\r\n  @Prop()\r\n  globalContextMenuItems: ContextMenuItem[] = [\r\n    {\r\n      label: 'Paste',\r\n      icon: 'paste',\r\n      disabled: async () => (await this.engineRef.getCopiedObjects()).length === 0,\r\n      action: menu => this.engineRef.paste(menu.x, menu.y),\r\n    },\r\n    { label: 'Select All', icon: 'select-all', action: () => this.selectAllObjectsInViewport() },\r\n  ];\r\n\r\n  @Prop()\r\n  objectContextMenuItems: ContextMenuItem[] = [\r\n    {\r\n      label: 'Edit',\r\n      icon: 'pen',\r\n      visible: (_, objects) => objects.length === 1 && objects[0].isEditable,\r\n      action: (_, objects) => {\r\n        if (objects.length === 1) {\r\n          const object = objects[0];\r\n          if (object.isEditable) {\r\n            object.edit();\r\n          }\r\n        }\r\n      },\r\n    },\r\n    { label: 'Copy', icon: 'copy', action: () => this.engineRef.copy() },\r\n    {\r\n      label: 'Paste',\r\n      icon: 'paste',\r\n      disabled: async () => (await this.engineRef.getCopiedObjects()).length === 0,\r\n      action: (menu, _) => this.engineRef.paste(menu.x, menu.y),\r\n    },\r\n    { label: 'Delete', icon: 'delete', action: () => this.engineRef.delete() },\r\n    { label: 'Bring to Front', icon: 'bring-to-front', action: () => this.engineRef.moveToTop() },\r\n    { label: 'Send to Back', icon: 'send-to-back', action: () => this.engineRef.moveToBottom() },\r\n  ];\r\n\r\n  @Prop()\r\n  customSvgIcons: Record<string, string> = {};\r\n\r\n  @Prop()\r\n  isControlsVisible: boolean = true;\r\n\r\n  @Prop()\r\n  isUtilityPanelVisible: boolean = true;\r\n\r\n  @Event()\r\n  isReady: EventEmitter<HTMLElement>;\r\n\r\n  @Element()\r\n  host!: HTMLElement;\r\n\r\n  @State()\r\n  isEngineReady: boolean = false;\r\n\r\n  @State()\r\n  isControlsReady: boolean = false;\r\n\r\n  @Watch('isEngineReady')\r\n  onIsEngineReady(newValue: boolean) {\r\n    if (newValue && this.isControlsReady) {\r\n      this.checkIsReady();\r\n    }\r\n  }\r\n\r\n  @Watch('isControlsReady')\r\n  onIsControlsReady(newValue: boolean) {\r\n    if (newValue && this.isEngineReady) {\r\n      this.checkIsReady();\r\n    }\r\n  }\r\n\r\n  @Method()\r\n  async getObjectById<T extends KritzelBaseObject>(id: string): Promise<T | null> {\r\n    return this.engineRef.getObjectById(id);\r\n  }\r\n\r\n  @Method()\r\n  async addObject<T extends KritzelBaseObject>(object: T): Promise<T | null> {\r\n    return this.engineRef.addObject(object);\r\n  }\r\n\r\n  @Method()\r\n  async updateObject<T extends KritzelBaseObject>(object: T, updatedProperties: Partial<T>): Promise<T | null> {\r\n    return this.engineRef.updateObject(object, updatedProperties);\r\n  }\r\n\r\n  @Method()\r\n  async removeObject<T extends KritzelBaseObject>(object: T): Promise<T | null> {\r\n    return this.engineRef.removeObject(object);\r\n  }\r\n\r\n  @Method()\r\n  async getSelectedObjects(): Promise<KritzelBaseObject[]> {\r\n    return this.engineRef.getSelectedObjects();\r\n  }\r\n\r\n  @Method()\r\n  async selectObjects(objects: KritzelBaseObject[]) {\r\n    return this.engineRef.selectObjects(objects);\r\n  }\r\n\r\n  @Method()\r\n  async selectAllObjectsInViewport() {\r\n    return this.engineRef.selectAllObjectsInViewport();\r\n  }\r\n\r\n  @Method()\r\n  async clearSelection() {\r\n    this.engineRef.clearSelection();\r\n  }\r\n\r\n  @Method()\r\n  async centerObjectInViewport(object: KritzelBaseObject) {\r\n    return this.engineRef.centerObjectInViewport(object);\r\n  }\r\n\r\n  @Listen('dblclick', { passive: false })\r\n  handleTouchStart(event: MouseEvent) {\r\n    if (event.cancelable) {\r\n      event.preventDefault();\r\n    }\r\n  }\r\n\r\n  @Listen('keydown', { target: 'window' })\r\n  handleKeyDown(event) {\r\n    if (event.key === 'Escape') {\r\n      event.preventDefault();\r\n      this.controlsRef?.closeTooltip();\r\n    }\r\n  }\r\n\r\n  engineRef!: HTMLKritzelEngineElement;\r\n\r\n  controlsRef!: HTMLKritzelControlsElement;\r\n\r\n  componentDidLoad() {\r\n    this.registerCustomSvgIcons();\r\n  }\r\n\r\n  async checkIsReady() {\r\n    await customElements.whenDefined('kritzel-editor');\r\n    await customElements.whenDefined('kritzel-controls');\r\n    await customElements.whenDefined('kritzel-engine');\r\n\r\n    if (!this.isEngineReady || !this.isControlsReady) {\r\n      return;\r\n    }\r\n\r\n    this.isReady.emit(this.host);\r\n  }\r\n\r\n  private registerCustomSvgIcons() {\r\n    for (const [name, svg] of Object.entries(this.customSvgIcons)) {\r\n      KritzelIconRegistry.register(name, svg);\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <kritzel-engine\r\n          ref={el => (this.engineRef = el)}\r\n          onIsEngineReady={() => (this.isEngineReady = true)}\r\n          scaleMax={this.scaleMax}\r\n          scaleMin={this.scaleMin}\r\n          globalContextMenuItems={this.globalContextMenuItems}\r\n          objectContextMenuItems={this.objectContextMenuItems}\r\n        ></kritzel-engine>\r\n\r\n        <kritzel-controls\r\n          ref={el => (this.controlsRef = el)}\r\n          controls={this.controls}\r\n          isUtilityPanelVisible={this.isUtilityPanelVisible}\r\n          style={this.isControlsVisible ? { display: 'flex' } : { display: 'none' }}\r\n          onIsControlsReady={() => (this.isControlsReady = true)}\r\n        ></kritzel-controls>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}