@elixpo/lixsketch 5.4.1 → 5.4.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elixpo/lixsketch",
-  "version": "5.4.1",
+  "version": "5.4.2",
   "description": "Open-source SVG whiteboard engine with hand-drawn aesthetics — the core of LixSketch",
   "type": "module",
   "main": "src/index.js",

package/src/core/EventDispatcher.js

@@ -8,7 +8,7 @@ import { handleMouseDownCircle, handleMouseMoveCircle, handleMouseUpCircle } fro
 import { handleMouseUpImage, handleMouseDownImage, handleMouseMoveImage } from '../tools/imageTool.js';
 import { handleMouseDownLine, handleMouseMoveLine, handleMouseUpLine } from '../tools/lineTool.js';
 import { handleFreehandMouseDown, handleFreehandMouseMove, handleFreehandMouseUp } from '../tools/freehandTool.js';
-import { handleTextMouseDown, handleTextMouseMove, handleTextMouseUp } from '../tools/textTool.js';
+import { handleTextMouseDown, handleTextMouseMove, handleTextMouseUp, enterEditMode } from '../tools/textTool.js';
 import { handleMouseDownFrame, handleMouseMoveFrame, handleMouseUpFrame } from '../tools/frameTool.js';
 import { handleMultiSelectionMouseDown, handleMultiSelectionMouseMove, handleMultiSelectionMouseUp, removeMultiSelectionRect, multiSelection, isMultiSelecting} from './Selection.js';
 import { handleMouseDownIcon, handleMouseMoveIcon, handleMouseUpIcon } from '../tools/iconTool.js';
@@ -464,6 +464,15 @@ function _onMouseEnter(e) {
     }
 }
 
+const handleMainDblClick = (e) => {
+    // Double-click on a text group from any tool: enter text edit mode
+    const targetTextGroup = e.target.closest('g[data-type="text-group"]');
+    if (targetTextGroup) {
+        e.stopPropagation();
+        enterEditMode(targetTextGroup);
+    }
+};
+
 function initEventDispatcher(svgEl) {
     if (_boundSvg) cleanupEventDispatcher();
     const target = svgEl || svg;
@@ -472,6 +481,7 @@ function initEventDispatcher(svgEl) {
     target.addEventListener('mouseup', handleMainMouseUp);
     target.addEventListener('mouseleave', handleMainMouseLeave);
     target.addEventListener('mouseenter', _onMouseEnter);
+    target.addEventListener('dblclick', handleMainDblClick);
     _boundSvg = target;
 }
 
@@ -488,6 +498,7 @@ function cleanupEventDispatcher() {
         _boundSvg.removeEventListener('mouseup', handleMainMouseUp);
         _boundSvg.removeEventListener('mouseleave', handleMainMouseLeave);
         _boundSvg.removeEventListener('mouseenter', _onMouseEnter);
+        _boundSvg.removeEventListener('dblclick', handleMainDblClick);
         _boundSvg = null;
     }
 }

package/src/core/Selection.js

@@ -80,9 +80,10 @@ function highlightShapesInSelectionRect(currentX, currentY) {
         shapes.forEach(shape => {
             if (isShapeInSelectionRect(shape, selBounds)) {
                 // Add a semi-transparent overlay to the shape's group
-                if (shape.group) {
+                if (shape.group && typeof shape.group.getBBox === 'function') {
+                    let bbox;
+                    try { bbox = shape.group.getBBox(); } catch { return; }
                     const overlay = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
-                    const bbox = shape.group.getBBox();
                     overlay.setAttribute('x', bbox.x - 2);
                     overlay.setAttribute('y', bbox.y - 2);
                     overlay.setAttribute('width', bbox.width + 4);

package/src/shapes/CodeShape.js

@@ -202,11 +202,12 @@ class CodeShape {
 
     contains(x, y) {
         const codeElement = this.group.querySelector('text');
-        if (!codeElement) return false;
-        
-        const bbox = codeElement.getBBox();
+        if (!codeElement || typeof codeElement.getBBox !== 'function') return false;
+
+        let bbox;
+        try { bbox = codeElement.getBBox(); } catch { return false; }
         const padding = 8; // Selection padding
-        
+
         const CTM = this.group.getCTM();
         if (!CTM) return false;
         

package/src/shapes/TextShape.js

@@ -182,11 +182,12 @@ class TextShape {
 
     contains(x, y) {
         const textElement = this.group.querySelector('text');
-        if (!textElement) return false;
-        
-        const bbox = textElement.getBBox();
+        if (!textElement || typeof textElement.getBBox !== 'function') return false;
+
+        let bbox;
+        try { bbox = textElement.getBBox(); } catch { return false; }
         const padding = 8; // Selection padding
-        
+
         const CTM = this.group.getCTM();
         if (!CTM) return false;
         

package/src/tools/textTool.js

@@ -51,6 +51,7 @@ let rotationStartTransform = null;
 let initialHandlePosRelGroup = null;
 let initialGroupTx = 0;
 let initialGroupTy = 0;
+let initialInverseScreenCTM = null;
 
 // Frame attachment variables
 let draggedShapeInitialFrameText = null;
@@ -753,6 +754,10 @@ function startResize(event, anchor) {
 
   startPoint = getSVGCoordinates(event, selectedElement);
 
+  // Freeze the group's screen CTM at resize start so mouse→local mapping stays stable
+  const groupScreenCTM = selectedElement.getScreenCTM();
+  initialInverseScreenCTM = groupScreenCTM ? groupScreenCTM.inverse() : null;
+
   const currentTransform = selectedElement.transform.baseVal.consolidate();
   initialGroupTx = currentTransform ? currentTransform.matrix.e : 0;
   initialGroupTy = currentTransform ? currentTransform.matrix.f : 0;
@@ -828,7 +833,16 @@ const handleMouseMove = (event) => {
         const textElement = selectedElement.querySelector('text');
         if (!textElement || !startBBox || startFontSize === null || !startPoint || !initialHandlePosRelGroup) return;
 
-        const currentPoint = getSVGCoordinates(event, selectedElement);
+        // Use the frozen initial CTM so the mapping doesn't shift as we change the group transform
+        let currentPoint;
+        if (initialInverseScreenCTM) {
+            const pt = svg.createSVGPoint();
+            pt.x = event.clientX;
+            pt.y = event.clientY;
+            currentPoint = pt.matrixTransform(initialInverseScreenCTM);
+        } else {
+            currentPoint = getSVGCoordinates(event, selectedElement);
+        }
 
         const startX = startBBox.x;
         const startY = startBBox.y;
@@ -1820,4 +1834,4 @@ window.__setCodeLanguage = function(lang) {
     }
 };
 
-export { handleTextMouseDown, handleTextMouseMove, handleTextMouseUp, updateCodeToggleForShape, deselectElement as deselectTextElement };
+export { handleTextMouseDown, handleTextMouseMove, handleTextMouseUp, updateCodeToggleForShape, deselectElement as deselectTextElement, enterEditMode };