kritzel-stencil 0.0.130 → 0.0.132

package/dist/components/{p-C9-70hiF.js → p-B3VQubt_.js}

@@ -1,11 +1,13 @@
-import { O as ObjectHelper } from './p-Bb6od8He.js';
 import { K as KritzelMouseButton } from './p-D8W6LE-c.js';
+import { O as ObjectHelper } from './p-EXPChOF6.js';
 
 class KritzelBaseCommand {
-    constructor(store, initiator, skipHistory = false) {
-        var _a, _b;
-        this._store = store;
-        this.initiator = (_b = (_a = initiator === null || initiator === void 0 ? void 0 : initiator.constructor) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : 'Unknown';
+    _core;
+    initiator;
+    skipHistory;
+    constructor(core, initiator, skipHistory = false) {
+        this._core = core;
+        this.initiator = initiator?.constructor?.name ?? 'Unknown';
         this.skipHistory = skipHistory;
     }
     execute() {
@@ -17,8 +19,11 @@ class KritzelBaseCommand {
 }
 
 class UpdateObjectCommand extends KritzelBaseCommand {
-    constructor(store, initiator, object, updatedProperties, skipHistory = false) {
-        super(store, initiator, skipHistory);
+    object;
+    updatedProperties;
+    previousProperties;
+    constructor(core, initiator, object, updatedProperties, skipHistory = false) {
+        super(core, initiator, skipHistory);
         this.object = object;
         this.updatedProperties = updatedProperties;
         this.previousProperties = {};
@@ -34,7 +39,7 @@ class UpdateObjectCommand extends KritzelBaseCommand {
                 this.object[key] = this.updatedProperties[key];
             }
         }
-        this._store.updateObjectInDatabase(ObjectHelper.clone(this.object));
+        this._core.updateObjectInDatabase(this.object);
     }
     undo() {
         for (const key in this.previousProperties) {
@@ -42,13 +47,14 @@ class UpdateObjectCommand extends KritzelBaseCommand {
                 this.object[key] = this.previousProperties[key];
             }
         }
-        this._store.updateObjectInDatabase(ObjectHelper.clone(this.object));
+        this._core.updateObjectInDatabase(this.object);
     }
 }
 
 class KritzelToolRegistry {
-    static registerTool(toolName, constructor, store) {
-        const toolInstance = new constructor(store);
+    static registry = {};
+    static registerTool(toolName, constructor, core) {
+        const toolInstance = new constructor(core);
         toolInstance.name = toolName;
         this.registry[toolName] = toolInstance;
         return toolInstance;
@@ -62,13 +68,13 @@ class KritzelToolRegistry {
         return toolInstance;
     }
 }
-KritzelToolRegistry.registry = {};
 
 class KritzelBaseTool {
-    constructor(store) {
-        this.__class__ = this.constructor.name;
-        this.name = 'base-tool';
-        this._store = store;
+    __class__ = this.constructor.name;
+    name = 'base-tool';
+    _core;
+    constructor(core) {
+        this._core = core;
     }
     onActivate() {
         // default implementation
@@ -88,24 +94,31 @@ class KritzelBaseTool {
     handleWheel(_event) {
         // default implementation
     }
-    revive(object) {
+    serialize() {
+        return {
+            __class__: this.__class__,
+            name: this.name,
+        };
+    }
+    deserialize(object) {
         Object.assign(this, object);
         return this;
     }
 }
 
 class AddObjectCommand extends KritzelBaseCommand {
-    constructor(store, initiator, object, skipHistory = false) {
-        super(store, initiator, skipHistory);
+    object;
+    constructor(core, initiator, object, skipHistory = false) {
+        super(core, initiator, skipHistory);
         this.object = object;
     }
     execute() {
-        this._store.state.objectsMap.insert(this.object);
-        this._store.addObjectToDatabase(ObjectHelper.clone(this.object));
+        this._core.store.state.objectsMap.insert(this.object);
+        this._core.addObjectToDatabase(this.object);
     }
     undo() {
-        this._store.state.objectsMap.remove(object => object.id === this.object.id);
-        this._store.deleteObjectFromDatabase(this.object.id);
+        this._core.store.state.objectsMap.remove(object => object.id === this.object.id);
+        this._core.deleteObjectFromDatabase(this.object.id);
     }
 }
 
@@ -124,11 +137,7 @@ class KritzelEventHelper {
         const contextMenu = path.find(element => element.classList && element.classList.contains('context-menu'));
         return !!contextMenu;
     }
-    static onLongTouchPress(event, onSuccess, onCancel) {
-        if (event.pointerType !== 'touch') {
-            onCancel === null || onCancel === void 0 ? void 0 : onCancel();
-            return () => { };
-        }
+    static onLongPress(event, onSuccess, onCancel) {
         const longPressTimeout = 400;
         const moveThreshold = 10;
         const startX = event.clientX;
@@ -141,7 +150,7 @@ class KritzelEventHelper {
         const cancel = () => {
             clearTimeout(timer);
             removeListeners();
-            onCancel === null || onCancel === void 0 ? void 0 : onCancel();
+            onCancel?.();
         };
         const onPointerMove = (e) => {
             if (Math.abs(e.clientX - startX) > moveThreshold || Math.abs(e.clientY - startY) > moveThreshold) {
@@ -216,28 +225,28 @@ class KritzelKeyboardHelper {
 }
 
 class KritzelTextTool extends KritzelBaseTool {
-    constructor(store) {
-        super(store);
-        this.fontFamily = 'Arial';
-        this.fontSize = 16;
-        this.fontColor = '#000000';
-        this.palette = [
-            '#000000',
-            '#FFFFFF',
-            '#FF0000',
-            '#00FF00',
-            '#0000FF',
-            '#FFFF00',
-            '#FF00FF',
-            '#00FFFF',
-            '#808080',
-            '#C0C0C0',
-            '#800000',
-            '#008000',
-            '#000080',
-            '#808000',
-            '#800080',
-        ];
+    fontFamily = 'Arial';
+    fontSize = 16;
+    fontColor = '#000000';
+    palette = [
+        '#000000',
+        '#FFFFFF',
+        '#FF0000',
+        '#00FF00',
+        '#0000FF',
+        '#FFFF00',
+        '#FF00FF',
+        '#00FFFF',
+        '#808080',
+        '#C0C0C0',
+        '#800000',
+        '#008000',
+        '#000080',
+        '#808000',
+        '#800080',
+    ];
+    constructor(core) {
+        super(core);
     }
     handlePointerDown(event) {
         if (event.cancelable) {
@@ -246,80 +255,79 @@ class KritzelTextTool extends KritzelBaseTool {
         if (event.pointerType === 'mouse') {
             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 (this._store.state.activeText === null && object && object instanceof KritzelText) {
-                this._store.state.activeText = object;
+            const object = this._core.findObjectById(objectElement?.id);
+            if (this._core.store.state.activeText === null && object && object instanceof KritzelText) {
+                this._core.store.setState('activeText', object);
                 object.focus();
                 return;
             }
-            if (this._store.state.activeText !== null && object instanceof KritzelText) {
+            if (this._core.store.state.activeText !== null && object instanceof KritzelText) {
                 object.focus();
                 return;
             }
-            if (this._store.state.activeText !== null) {
-                this._store.resetActiveText();
-                this._store.setState('activeTool', KritzelToolRegistry.getTool('selection'));
+            if (this._core.store.state.activeText !== null) {
+                this._core.resetActiveText();
+                this._core.store.setState('activeTool', KritzelToolRegistry.getTool('selection'));
                 return;
             }
             if (KritzelEventHelper.isLeftClick(event) === false) {
                 return;
             }
-            const clientX = event.clientX - this._store.offsetX;
-            const clientY = event.clientY - this._store.offsetY;
-            const text = KritzelText.create(this._store, this.fontSize, this.fontFamily);
+            const clientX = event.clientX - this._core.store.offsetX;
+            const clientY = event.clientY - this._core.store.offsetY;
+            const text = KritzelText.create(this._core, this.fontSize, this.fontFamily);
             text.fontColor = this.fontColor;
-            text.translateX = (clientX - this._store.state.translateX) / this._store.state.scale;
-            text.translateY = (clientY - this._store.state.translateY) / this._store.state.scale;
-            text.zIndex = this._store.currentZIndex;
-            this._store.state.activeText = text;
-            this._store.history.executeCommand(new AddObjectCommand(this._store, this, text));
+            text.translateX = (clientX - this._core.store.state.translateX) / this._core.store.state.scale;
+            text.translateY = (clientY - this._core.store.state.translateY) / this._core.store.state.scale;
+            text.zIndex = this._core.store.currentZIndex;
+            this._core.store.setState('activeText', text);
+            this._core.history.executeCommand(new AddObjectCommand(this._core, this, text));
         }
         if (event.pointerType === 'touch') {
-            const activePointers = Array.from(this._store.state.pointers.values());
+            const activePointers = Array.from(this._core.store.state.pointers.values());
             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 (this._store.state.activeText === null && object && object instanceof KritzelText) {
-                this._store.state.activeText = object;
+            const object = this._core.findObjectById(objectElement?.id);
+            if (this._core.store.state.activeText === null && object && object instanceof KritzelText) {
+                this._core.store.setState('activeText', object);
                 object.focus();
                 return;
             }
-            if (this._store.state.activeText !== null && object instanceof KritzelText) {
+            if (this._core.store.state.activeText !== null && object instanceof KritzelText) {
                 object.focus();
                 return;
             }
-            if (this._store.state.activeText !== null) {
-                this._store.resetActiveText();
-                this._store.setState('activeTool', KritzelToolRegistry.getTool('selection'));
+            if (this._core.store.state.activeText !== null) {
+                this._core.resetActiveText();
+                this._core.store.setState('activeTool', KritzelToolRegistry.getTool('selection'));
                 return;
             }
             if (activePointers.length > 1) {
                 return;
             }
             KritzelKeyboardHelper.disableInteractiveWidget();
-            const clientX = Math.round(activePointers[0].clientX - this._store.offsetX);
-            const clientY = Math.round(activePointers[0].clientY - this._store.offsetY);
-            const text = KritzelText.create(this._store, this.fontSize, this.fontFamily);
+            const clientX = Math.round(activePointers[0].clientX - this._core.store.offsetX);
+            const clientY = Math.round(activePointers[0].clientY - this._core.store.offsetY);
+            const text = KritzelText.create(this._core, this.fontSize, this.fontFamily);
             text.fontColor = this.fontColor;
-            text.translateX = (clientX - this._store.state.translateX) / this._store.state.scale;
-            text.translateY = (clientY - this._store.state.translateY) / this._store.state.scale;
-            text.zIndex = this._store.currentZIndex;
-            this._store.state.activeText = text;
-            this._store.history.executeCommand(new AddObjectCommand(this._store, this, text));
+            text.translateX = (clientX - this._core.store.state.translateX) / this._core.store.state.scale;
+            text.translateY = (clientY - this._core.store.state.translateY) / this._core.store.state.scale;
+            text.zIndex = this._core.store.currentZIndex;
+            this._core.store.setState('activeText', text);
+            this._core.history.executeCommand(new AddObjectCommand(this._core, this, text));
         }
     }
     handlePointerUp(event) {
-        var _a, _b, _c, _d;
         if (event.cancelable) {
             event.preventDefault();
         }
         if (event.pointerType === 'mouse') {
-            (_a = this._store.state.activeText) === null || _a === void 0 ? void 0 : _a.updateTextareaDimensions();
-            (_b = this._store.state.activeText) === null || _b === void 0 ? void 0 : _b.focus();
+            this._core.store.state.activeText?.updateTextareaDimensions();
+            this._core.store.state.activeText?.focus();
         }
         if (event.pointerType === 'touch') {
-            (_c = this._store.state.activeText) === null || _c === void 0 ? void 0 : _c.updateTextareaDimensions();
-            (_d = this._store.state.activeText) === null || _d === void 0 ? void 0 : _d.focus();
+            this._core.store.state.activeText?.updateTextareaDimensions();
+            this._core.store.state.activeText?.focus();
             KritzelKeyboardHelper.enableInteractiveWidget();
         }
     }
@@ -379,6 +387,34 @@ class KritzelGeometryHelper {
 }
 
 class KritzelBaseObject {
+    __class__ = 'KritzelBaseObject';
+    _core;
+    _elementRef;
+    id;
+    workspaceId;
+    x;
+    y;
+    translateX;
+    translateY;
+    height;
+    width;
+    backgroundColor;
+    borderColor;
+    borderWidth = 0;
+    opacity = 1;
+    padding = 0;
+    scale;
+    resizing = false;
+    rotation = 0;
+    markedForRemoval = false;
+    zIndex = 0;
+    isVisible = true;
+    isSelected = false;
+    isHovered = false;
+    isMounted = false;
+    isEditable = false;
+    isInteractive = false;
+    isDebugInfoVisible = false;
     get totalWidth() {
         return this.width + this.padding * 2;
     }
@@ -464,28 +500,13 @@ class KritzelBaseObject {
         return this.translateY + this.totalHeight / 2;
     }
     constructor() {
-        this.__class__ = 'KritzelBaseObject';
-        this.borderWidth = 0;
-        this.opacity = 1;
-        this.padding = 0;
-        this.resizing = false;
-        this.rotation = 0;
-        this.markedForRemoval = false;
-        this.zIndex = 0;
-        this.isVisible = true;
-        this.isSelected = false;
-        this.isHovered = false;
-        this.isMounted = false;
-        this.isEditable = false;
-        this.isInteractive = false;
-        this.isDebugInfoVisible = false;
         this.id = this.generateId();
     }
-    static create(store) {
+    static create(core) {
         const object = new KritzelBaseObject();
-        object._store = store;
-        object.zIndex = store.currentZIndex;
-        object.workspaceId = store.state.activeWorkspace.id;
+        object._core = core;
+        object.zIndex = core.store.currentZIndex;
+        object.workspaceId = core.store.state.activeWorkspace.id;
         return object;
     }
     mount(element) {
@@ -512,23 +533,23 @@ class KritzelBaseObject {
     }
     isInViewport() {
         const viewportBounds = {
-            x: -this._store.state.translateX / this._store.state.scale,
-            y: -this._store.state.translateY / this._store.state.scale,
-            width: this._store.state.viewportWidth / this._store.state.scale,
-            height: this._store.state.viewportHeight / this._store.state.scale};
+            x: -this._core.store.state.translateX / this._core.store.state.scale,
+            y: -this._core.store.state.translateY / this._core.store.state.scale,
+            width: this._core.store.state.viewportWidth / this._core.store.state.scale,
+            height: this._core.store.state.viewportHeight / this._core.store.state.scale};
         return (this.boundingBox.x < viewportBounds.x + viewportBounds.width &&
             this.boundingBox.x + this.boundingBox.width > viewportBounds.x &&
             this.boundingBox.y < viewportBounds.y + viewportBounds.height &&
             this.boundingBox.y + this.boundingBox.height > viewportBounds.y);
     }
     centerInViewport() {
-        const scale = this._store.state.scale;
-        this.translateX = (this._store.state.viewportWidth / 2 - this.totalWidth / 2 - this._store.state.translateX) / scale;
-        this.translateY = (this._store.state.viewportHeight / 2 - this.totalHeight / 2 - this._store.state.translateY) / scale;
+        const scale = this._core.store.state.scale;
+        this.translateX = (this._core.store.state.viewportWidth / 2 - this.totalWidth / 2 - this._core.store.state.translateX) / scale;
+        this.translateY = (this._core.store.state.viewportHeight / 2 - this.totalHeight / 2 - this._core.store.state.translateY) / scale;
     }
     move(startX, startY, endX, endY) {
-        const deltaX = (startX - endX) / this._store.state.scale;
-        const deltaY = (startY - endY) / this._store.state.scale;
+        const deltaX = (startX - endX) / this._core.store.state.scale;
+        const deltaY = (startY - endY) / this._core.store.state.scale;
         this.translateX += deltaX;
         this.translateY += deltaY;
     }
@@ -554,7 +575,12 @@ class KritzelBaseObject {
     onSelectedClick() {
         // This method can be overridden by subclasses to handle click events when the object is selected.
     }
-    revive(object) {
+    serialize() {
+        return {
+            ...ObjectHelper.clone(this)
+        };
+    }
+    deserialize(object) {
         Object.assign(this, object);
         return this;
     }
@@ -574,26 +600,26 @@ class KritzelBaseObject {
     updatePosition(x, y) {
         this.translateX = x;
         this.translateY = y;
-        this._store.state.objectsMap.update(this);
+        this._core.store.state.objectsMap.update(this);
     }
 }
 
 class KritzelText extends KritzelBaseObject {
+    __class__ = 'KritzelText';
+    value = '';
+    fontFamily = 'Arial';
+    fontSize = 8;
+    fontColor = '#000000';
+    initialWidth = 3;
+    isNew = true;
+    isDebugInfoVisible = true;
+    isEditable = true;
+    rows = 1;
     get isReadonly() {
-        return !(this._store.state.activeTool instanceof KritzelTextTool);
+        return !(this._core.store.state.activeTool instanceof KritzelTextTool);
     }
     constructor(config) {
         super();
-        this.__class__ = 'KritzelText';
-        this.value = '';
-        this.fontFamily = 'Arial';
-        this.fontSize = 8;
-        this.fontColor = '#000000';
-        this.initialWidth = 3;
-        this.isNew = true;
-        this.isDebugInfoVisible = true;
-        this.isEditable = true;
-        this.rows = 1;
         if (config) {
             this.value = config.value || ' ';
             this.translateX = config.translateX || 0;
@@ -606,22 +632,22 @@ class KritzelText extends KritzelBaseObject {
             this.scale = config.scale || 1;
         }
     }
-    static create(store, fontSize, fontFamily) {
+    static create(core, fontSize, fontFamily) {
         const object = new KritzelText();
-        object._store = store;
+        object._core = core;
         object.id = object.generateId();
-        object.workspaceId = store.state.activeWorkspace.id;
+        object.workspaceId = core.store.state.activeWorkspace.id;
         object.fontSize = fontSize;
         object.fontFamily = fontFamily;
         object.translateX = 0;
         object.translateY = 0;
-        object.width = object.initialWidth / (object._store.state.scale < 0 ? object._store.state.scale : 1);
-        object.height = (object.fontSize * 1.2) / (object._store.state.scale < 0 ? object._store.state.scale : 1);
+        object.width = object.initialWidth / (object._core.store.state.scale < 0 ? object._core.store.state.scale : 1);
+        object.height = (object.fontSize * 1.2) / (object._core.store.state.scale < 0 ? object._core.store.state.scale : 1);
         object.padding = 5;
         object.backgroundColor = 'transparent';
-        object.scale = object._store.state.scale;
+        object.scale = object._core.store.state.scale;
         object.value = ' ';
-        object.zIndex = store.currentZIndex;
+        object.zIndex = core.store.currentZIndex;
         return object;
     }
     mount(element) {
@@ -675,7 +701,7 @@ class KritzelText extends KritzelBaseObject {
             document.body.removeChild(span);
             this.width = textWidth;
             this.height = textHeight;
-            this._store.history.executeCommand(new UpdateObjectCommand(this._store, this, this, Object.assign({}, this)));
+            this._core.history.executeCommand(new UpdateObjectCommand(this._core, this, this, { ...this }));
         }
     }
     focus() {
@@ -708,10 +734,10 @@ class KritzelText extends KritzelBaseObject {
         }
     }
     edit() {
-        this._store.setState('activeTool', KritzelToolRegistry.getTool('text'));
-        this._store.state.selectionGroup = null;
-        this._store.state.selectionBox = null;
-        this._store.state.activeText = this;
+        this._core.store.setState('activeTool', KritzelToolRegistry.getTool('text'));
+        this._core.store.setState('selectionGroup', null);
+        this._core.store.setState('selectionBox', null);
+        this._core.store.setState('activeText', this);
         setTimeout(() => {
             this.focus();
         }, 300);
@@ -740,47 +766,50 @@ class KritzelMathHelper {
 }
 
 class KritzelPath extends KritzelBaseObject {
+    __class__ = 'KritzelPath';
+    points;
+    d;
+    stroke = 'none';
+    strokeWidth;
+    lineSlack = 0.5;
+    fill;
+    x = 0;
+    y = 0;
+    height = 0;
+    width = 0;
+    scale = 1;
+    options;
+    isVisible = true;
+    isDebugInfoVisible = true;
+    _adjustedPoints = null;
     get viewBox() {
         return `${this.x} ${this.y} ${this.width} ${this.height}`;
     }
     constructor(config) {
-        var _a, _b, _c, _d, _e, _f;
         super();
-        this.__class__ = 'KritzelPath';
-        this.stroke = 'none';
-        this.lineSlack = 0.5;
-        this.x = 0;
-        this.y = 0;
-        this.height = 0;
-        this.width = 0;
-        this.scale = 1;
-        this.isVisible = true;
-        this.isDebugInfoVisible = true;
-        this._adjustedPoints = null;
         this.options = config;
-        this.points = (_a = config === null || config === void 0 ? void 0 : config.points) !== null && _a !== void 0 ? _a : [];
-        this.translateX = (_b = config === null || config === void 0 ? void 0 : config.translateX) !== null && _b !== void 0 ? _b : 0;
-        this.translateY = (_c = config === null || config === void 0 ? void 0 : config.translateY) !== null && _c !== void 0 ? _c : 0;
-        this.scale = (_d = config === null || config === void 0 ? void 0 : config.scale) !== null && _d !== void 0 ? _d : 1;
-        this.strokeWidth = (_e = config === null || config === void 0 ? void 0 : config.strokeWidth) !== null && _e !== void 0 ? _e : 8;
-        this.fill = (_f = config === null || config === void 0 ? void 0 : config.fill) !== null && _f !== void 0 ? _f : '#000000';
+        this.points = config?.points ?? [];
+        this.translateX = config?.translateX ?? 0;
+        this.translateY = config?.translateY ?? 0;
+        this.scale = config?.scale ?? 1;
+        this.strokeWidth = config?.strokeWidth ?? 8;
+        this.fill = config?.fill ?? '#000000';
         this.d = this.generateSvgPath();
         this.updateDimensions();
     }
-    static create(store, options) {
-        var _a, _b, _c, _d, _e, _f;
+    static create(core, options) {
         const object = new KritzelPath();
-        object._store = store;
+        object._core = core;
         object.id = object.generateId();
-        object.workspaceId = store.state.activeWorkspace.id;
+        object.workspaceId = core.store.state.activeWorkspace.id;
         object.options = options;
-        object.points = (_a = options === null || options === void 0 ? void 0 : options.points) !== null && _a !== void 0 ? _a : [];
-        object.translateX = (_b = options === null || options === void 0 ? void 0 : options.translateX) !== null && _b !== void 0 ? _b : 0;
-        object.translateY = (_c = options === null || options === void 0 ? void 0 : options.translateY) !== null && _c !== void 0 ? _c : 0;
-        object.scale = (_d = options === null || options === void 0 ? void 0 : options.scale) !== null && _d !== void 0 ? _d : 1;
-        object.strokeWidth = (_e = options === null || options === void 0 ? void 0 : options.strokeWidth) !== null && _e !== void 0 ? _e : 8;
-        object.fill = (_f = options === null || options === void 0 ? void 0 : options.fill) !== null && _f !== void 0 ? _f : '#000000';
-        object.zIndex = store.currentZIndex;
+        object.points = options?.points ?? [];
+        object.translateX = options?.translateX ?? 0;
+        object.translateY = options?.translateY ?? 0;
+        object.scale = options?.scale ?? 1;
+        object.strokeWidth = options?.strokeWidth ?? 8;
+        object.fill = options?.fill ?? '#000000';
+        object.zIndex = core.store.currentZIndex;
         object.d = object.generateSvgPath();
         object.updateDimensions();
         return object;
@@ -808,8 +837,8 @@ class KritzelPath extends KritzelBaseObject {
         this._adjustedPoints = null;
     }
     move(startX, startY, endX, endY) {
-        const deltaX = (startX - endX) / this._store.state.scale;
-        const deltaY = (startY - endY) / this._store.state.scale;
+        const deltaX = (startX - endX) / this._core.store.state.scale;
+        const deltaY = (startY - endY) / this._core.store.state.scale;
         this.translateX += deltaX;
         this.translateY += deltaY;
         this._adjustedPoints = null;
@@ -888,11 +917,10 @@ class KritzelPath extends KritzelBaseObject {
         this.translateX = x;
         this.translateY = y;
         this._adjustedPoints = null;
-        this._store.state.objectsMap.update(this);
+        this._core.store.state.objectsMap.update(this);
     }
     computeAdjustedPoints() {
-        var _a;
-        if (!((_a = this.points) === null || _a === void 0 ? void 0 : _a.length)) {
+        if (!this.points?.length) {
             return [];
         }
         const angle = this.rotation;
@@ -1005,15 +1033,15 @@ class KritzelPath extends KritzelBaseObject {
 }
 
 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'],
-        };
+    type = 'pen';
+    color = '#000000';
+    size = 6;
+    palettes = {
+        pen: ['#000000', '#FFFFFF', '#FF0000', '#00FF00', '#0000FF', '#FFFF00', '#FF00FF', '#00FFFF', '#808080', '#C0C0C0', '#800000', '#008000', '#000080', '#808000', '#800080'],
+        highlighter: ['#ffff00', '#ffb347', '#b4ffb4'],
+    };
+    constructor(core) {
+        super(core);
     }
     handlePointerDown(event) {
         if (event.cancelable) {
@@ -1021,34 +1049,34 @@ class KritzelBrushTool extends KritzelBaseTool {
         }
         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, {
+                this._core.store.setState('isDrawing', true);
+                const x = event.clientX - this._core.store.offsetX;
+                const y = event.clientY - this._core.store.offsetY;
+                this._core.store.setState('currentPath', KritzelPath.create(this._core, {
                     points: [[x, y]],
-                    translateX: -this._store.state.translateX,
-                    translateY: -this._store.state.translateY,
-                    scale: this._store.state.scale,
+                    translateX: -this._core.store.state.translateX,
+                    translateY: -this._core.store.state.translateY,
+                    scale: this._core.store.state.scale,
                     fill: this.color,
                     strokeWidth: this.size,
-                });
+                }));
             }
         }
         if (event.pointerType === 'touch') {
-            const activePointers = Array.from(this._store.state.pointers.values());
+            const activePointers = Array.from(this._core.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, {
+                const x = Math.round(activePointers[0].clientX - this._core.store.offsetX);
+                const y = Math.round(activePointers[0].clientY - this._core.store.offsetY);
+                this._core.store.setState('isDrawing', true);
+                this._core.store.setState('currentPath', KritzelPath.create(this._core, {
                     points: [[x, y]],
-                    translateX: -this._store.state.translateX,
-                    translateY: -this._store.state.translateY,
-                    scale: this._store.state.scale,
+                    translateX: -this._core.store.state.translateX,
+                    translateY: -this._core.store.state.translateY,
+                    scale: this._core.store.state.scale,
                     fill: this.color,
                     strokeWidth: this.size,
-                });
-                this._store.rerender();
+                }));
+                this._core.rerender();
             }
         }
     }
@@ -1057,34 +1085,34 @@ class KritzelBrushTool extends KritzelBaseTool {
             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,
+            if (this._core.store.state.isDrawing) {
+                const x = event.clientX - this._core.store.offsetX;
+                const y = event.clientY - this._core.store.offsetY;
+                this._core.store.setState('currentPath', KritzelPath.create(this._core, {
+                    points: [...this._core.store.state.currentPath.points, [x, y]],
+                    translateX: -this._core.store.state.translateX,
+                    translateY: -this._core.store.state.translateY,
+                    scale: this._core.store.state.scale,
                     fill: this.color,
                     strokeWidth: this.size,
-                });
-                this._store.rerender();
+                }));
+                this._core.rerender();
             }
         }
         if (event.pointerType === 'touch') {
-            const activePointers = Array.from(this._store.state.pointers.values());
+            const activePointers = Array.from(this._core.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,
+                const x = Math.round(activePointers[0].clientX - this._core.store.offsetX);
+                const y = Math.round(activePointers[0].clientY - this._core.store.offsetY);
+                this._core.store.setState('currentPath', KritzelPath.create(this._core, {
+                    points: [...this._core.store.state.currentPath.points, [x, y]],
+                    translateX: -this._core.store.state.translateX,
+                    translateY: -this._core.store.state.translateY,
+                    scale: this._core.store.state.scale,
                     fill: this.color,
                     strokeWidth: this.size,
-                });
-                this._store.rerender();
+                }));
+                this._core.rerender();
             }
         }
     }
@@ -1093,30 +1121,34 @@ class KritzelBrushTool extends KritzelBaseTool {
             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));
+            if (this._core.store.state.isDrawing) {
+                this._core.store.setState('isDrawing', false);
+                if (this._core.store.state.currentPath) {
+                    const currentPath = this._core.store.state.currentPath;
+                    currentPath.zIndex = this._core.store.currentZIndex;
+                    this._core.store.setState('currentPath', currentPath);
+                    this._core.history.executeCommand(new AddObjectCommand(this._core, this, this._core.store.state.currentPath));
                 }
-                this._store.state.currentPath = undefined;
+                this._core.store.setState('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));
+            if (this._core.store.state.isDrawing) {
+                this._core.store.setState('isDrawing', false);
+                if (this._core.store.state.currentPath) {
+                    const currentPath = this._core.store.state.currentPath;
+                    currentPath.zIndex = this._core.store.currentZIndex;
+                    this._core.store.setState('currentPath', currentPath);
+                    this._core.history.executeCommand(new AddObjectCommand(this._core, this, currentPath));
                 }
-                this._store.state.currentPath = undefined;
-                this._store.rerender();
+                this._core.store.setState('currentPath', undefined);
+                this._core.rerender();
             }
         }
     }
 }
 
 export { AddObjectCommand as A, KritzelText as K, UpdateObjectCommand as U, KritzelPath as a, KritzelBrushTool as b, KritzelTextTool as c, KritzelKeyboardHelper as d, KritzelBaseObject as e, KritzelBaseCommand as f, KritzelBaseTool as g, KritzelEventHelper as h, KritzelToolRegistry as i };
-//# sourceMappingURL=p-C9-70hiF.js.map
+//# sourceMappingURL=p-B3VQubt_.js.map
 
-//# sourceMappingURL=p-C9-70hiF.js.map
+//# sourceMappingURL=p-B3VQubt_.js.map