kritzel-stencil 0.0.145 → 0.0.146

package/dist/cjs/{default-text-tool.config-D2dP2xyB.js → default-text-tool.config-C0W0noF9.js}

@@ -355,6 +355,32 @@ class KritzelKeyboardHelper {
     }
 }
 
+class KritzelDevicesHelper {
+    static isTouchDevice() {
+        return window.matchMedia('(any-pointer: coarse)').matches;
+    }
+    static isAndroid() {
+        return /android/i.test(navigator.userAgent);
+    }
+    static isIOS() {
+        return /iPad|iPhone|iPod/.test(navigator.userAgent);
+    }
+    static detectOS() {
+        if (this.isIOS()) {
+            return 'iOS';
+        }
+        else if (this.isAndroid()) {
+            return 'Android';
+        }
+        else {
+            return 'Other';
+        }
+    }
+    static isFirefox() {
+        return /firefox/i.test(navigator.userAgent);
+    }
+}
+
 // ::- Persistent data structure representing an ordered mapping from
 // strings to values, with some convenient update methods.
 function OrderedMap(content) {
@@ -13908,17 +13934,12 @@ class KritzelText extends KritzelBaseObject {
             }),
             editable: () => false,
             dispatchTransaction: transaction => {
-                // Apply the transaction to get the new state
                 const newState = this.editor.state.apply(transaction);
-                // Update the editor state first
                 this.editor.updateState(newState);
-                // Only update content and adjust size if the document actually changed
-                // AND it's not from a remote source (to prevent infinite loops)
                 if (transaction.docChanged) {
                     this.content = newState.doc.toJSON();
                     this.adjustSizeOnInput();
                     if (!transaction.getMeta('fromRemote')) {
-                        // Mark updates as temporary while editing - they'll be consolidated on save
                         this._core.store.state.objectsMap.update(this, { temporary: true });
                     }
                 }
@@ -13930,7 +13951,6 @@ class KritzelText extends KritzelBaseObject {
         if (this.editor && content) {
             const newDoc = this.editor.state.schema.nodeFromJSON(content);
             const tr = this.editor.state.tr.replaceWith(0, this.editor.state.doc.content.size, newDoc.content);
-            // Mark this transaction as coming from remote/external source
             tr.setMeta('fromRemote', true);
             this.editor.dispatch(tr);
         }
@@ -13978,39 +13998,46 @@ class KritzelText extends KritzelBaseObject {
     focus(coords) {
         if (this.editor) {
             const doc = this.editor.state.doc;
-            if (coords) {
+            if (coords.x && coords.y) {
                 const pos = this.editor.posAtCoords({ left: coords.x, top: coords.y });
                 if (pos) {
                     this.editor.dispatch(this.editor.state.tr.setSelection(TextSelection.create(doc, pos.pos)));
                     this.editor.focus();
+                    if (KritzelDevicesHelper.isIOS()) {
+                        this.scrollIntoViewOnIOS();
+                    }
                     return;
                 }
             }
             const end = Math.max(1, doc.content.size - 1);
             this.editor.dispatch(this.editor.state.tr.setSelection(TextSelection.create(doc, end)));
             this.editor.focus();
+            if (KritzelDevicesHelper.isIOS()) {
+                this.scrollIntoViewOnIOS();
+            }
         }
     }
+    scrollIntoViewOnIOS() {
+        setTimeout(() => {
+            if (this.editor && this.editor.dom) {
+                this.editor.dom.scrollIntoView({
+                    behavior: 'smooth',
+                    block: 'center',
+                    inline: 'nearest'
+                });
+            }
+        }, 300);
+    }
     edit(event) {
         KritzelKeyboardHelper.disableInteractiveWidget();
         this.uneditedObject = this.clone();
         this._core.store.setState('activeTool', KritzelToolRegistry.getTool('text'));
-        if (this.editor) {
-            this.editor.setProps({ editable: () => true });
-        }
+        this.editor.setProps({ editable: () => true });
         this.isEditing = true;
         this._core.rerender();
-        requestAnimationFrame(() => {
-            this.adjustSizeOnInput();
-            // Focus after the DOM has been updated
-            if (event) {
-                this.focus({ x: event.clientX, y: event.clientY });
-            }
-            else {
-                this.focus();
-            }
-            KritzelKeyboardHelper.enableInteractiveWidget();
-        });
+        this.adjustSizeOnInput();
+        this.focus({ x: event?.clientX, y: event?.clientY });
+        KritzelKeyboardHelper.enableInteractiveWidget();
     }
     save() {
         requestAnimationFrame(() => this.adjustSizeOnInput());
@@ -14018,9 +14045,7 @@ class KritzelText extends KritzelBaseObject {
         this.editor.setProps({ editable: () => false });
         this.editor.dom.blur();
         this.isEditing = false;
-        // Consolidate all temporary keystrokes into a single undo item
         this._core.store.state.objectsMap.consolidateTemporaryItems();
-        // Final update with normal origin
         this._core.store.state.objectsMap.update(this);
     }
     handlePointerDown(event) {
@@ -14862,7 +14887,7 @@ class KritzelTextTool extends KritzelBaseTool {
             text.zIndex = this._core.store.currentZIndex;
             this._core.store.state.objectsMap.insert(text);
             this._core.rerender();
-            requestAnimationFrame(() => text.edit(event));
+            text.edit(event);
         }
         if (event.pointerType === 'touch') {
             const activePointers = Array.from(this._core.store.state.pointers.values());
@@ -14887,7 +14912,6 @@ class KritzelTextTool extends KritzelBaseTool {
             if (activePointers.length > 1) {
                 return;
             }
-            KritzelKeyboardHelper.disableInteractiveWidget();
             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);
@@ -14897,19 +14921,14 @@ class KritzelTextTool extends KritzelBaseTool {
             text.zIndex = this._core.store.currentZIndex;
             this._core.store.state.objectsMap.insert(text);
             this._core.rerender();
+            text.edit(event);
         }
     }
     handlePointerUp(event) {
         if (event.cancelable) {
             event.preventDefault();
         }
-        if (event.pointerType === 'mouse') {
-            this._core.store.activeText?.edit(event);
-        }
-        if (event.pointerType === 'touch') {
-            this._core.store.activeText?.edit(event);
-            KritzelKeyboardHelper.enableInteractiveWidget();
-        }
+        this._core.store.activeText?.edit(event);
     }
 }
 
@@ -31260,6 +31279,7 @@ exports.KritzelBaseHandler = KritzelBaseHandler;
 exports.KritzelBaseObject = KritzelBaseObject;
 exports.KritzelBaseTool = KritzelBaseTool;
 exports.KritzelBrushTool = KritzelBrushTool;
+exports.KritzelDevicesHelper = KritzelDevicesHelper;
 exports.KritzelEraserTool = KritzelEraserTool;
 exports.KritzelEventHelper = KritzelEventHelper;
 exports.KritzelImage = KritzelImage;
@@ -31305,6 +31325,6 @@ exports.varStorage = varStorage;
 exports.writeVarString = writeVarString$2;
 exports.writeVarUint = writeVarUint$2;
 exports.writeVarUint8Array = writeVarUint8Array$2;
-//# sourceMappingURL=default-text-tool.config-D2dP2xyB.js.map
+//# sourceMappingURL=default-text-tool.config-C0W0noF9.js.map
 
-//# sourceMappingURL=default-text-tool.config-D2dP2xyB.js.map
+//# sourceMappingURL=default-text-tool.config-C0W0noF9.js.map