@elixpo/lixsketch 5.5.9 → 5.5.10

package/dist/react/{textTool-KY4AYUTC.js → textTool-HY5NMM7H.js}

@@ -6,7 +6,7 @@ import {
   handleTextMouseMove,
   handleTextMouseUp,
   updateCodeToggleForShape
-} from "./chunk-YVCENC7J.js";
+} from "./chunk-5QIT2WBE.js";
 import "./chunk-LHRTXNVE.js";
 import "./chunk-BZE4CEBG.js";
 import "./chunk-L5OARZJ7.js";
@@ -18,4 +18,4 @@ export {
   handleTextMouseUp,
   updateCodeToggleForShape
 };
-//# sourceMappingURL=textTool-KY4AYUTC.js.map
+//# sourceMappingURL=textTool-HY5NMM7H.js.map

package/package.json

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

package/src/react/components/sidebars/TextSidebar.jsx

@@ -27,7 +27,7 @@ export default function TextSidebar() {
   const activeTool = useSketchStore((s) => s.activeTool)
   const selectedShapeSidebar = useSketchStore((s) => s.selectedShapeSidebar)
   const [textColor, setTextColor] = useState('#fff')
-  const [fontSize, setFontSize] = useState('M')
+  const [fontSize, setFontSize] = useState('S')
   const [font, setFont] = useState('lixFont')
   const [codeMode, setCodeMode] = useState(false)
   const [language, setLanguage] = useState('javascript')

package/src/shapes/TextShape.js

@@ -25,9 +25,28 @@ function updateSelectionFeedback() {}
 function deselectElement() { selectedElement = null; }
 function selectElement(el) { selectedElement = el; }
 
+function removeLegacySoftWrap(groupElement) {
+    const textElement = groupElement.querySelector('text');
+    if (!textElement || !textElement.hasAttribute('data-wrap-width')) return;
+    const source = textElement.getAttribute('data-wrap-source');
+    if (source === null) return;
+
+    while (textElement.firstChild) textElement.removeChild(textElement.firstChild);
+    const x = textElement.getAttribute('x') || 0;
+    source.split('\n').forEach((line, index) => {
+        const tspan = textElement.ownerDocument.createElementNS('http://www.w3.org/2000/svg', 'tspan');
+        tspan.setAttribute('x', x);
+        tspan.setAttribute('dy', index === 0 ? '0' : '1.2em');
+        tspan.textContent = line || ' ';
+        textElement.appendChild(tspan);
+    });
+    textElement.removeAttribute('data-wrap-width');
+}
+
 class TextShape {
     constructor(groupElement) {
         this.group = groupElement;
+        removeLegacySoftWrap(groupElement);
         this.shapeName = 'text';
         this.shapeID = groupElement.getAttribute('id') || `text-${String(Date.now()).slice(0, 8)}-${Math.floor(Math.random() * 10000)}`;
         

package/src/tools/textTool.js

@@ -27,7 +27,7 @@ import {
     getSelectedCodeBlock
 } from './codeTool.js';
 
-let textSize = "30px";
+let textSize = "20px";
 let textFont = "lixFont";
 let textColor = null;
 let textAlign = "left";
@@ -196,10 +196,8 @@ function makeTextEditable(textElement, groupElement) {
     input.setAttribute("aria-label", "Edit canvas text");
     input.setAttribute("data-editing", "true");
 
-    // Issue #48 phase D follow-up: prefer the persisted `data-wrap-
-    // source` when present so re-opening the editor shows the user's
-    // original line breaks instead of the auto-wrap output. Falls back
-    // to tspan-concatenation for legacy text shapes.
+    // Prefer the persisted source so re-opening the editor preserves only
+    // the line breaks the user explicitly inserted with Shift+Enter.
     let textContent = '';
     const storedSource = textElement.getAttribute('data-wrap-source');
     if (storedSource !== null && storedSource !== '') {
@@ -224,12 +222,10 @@ function makeTextEditable(textElement, groupElement) {
     input.style.boxSizing = "border-box";
     input.style.overflow = "hidden";
     input.style.resize = "none";
-    input.style.whiteSpace = "pre-wrap";
+    input.style.whiteSpace = "pre";
     input.style.minHeight = "1.2em";
     input.style.zIndex = "10000";
 
-    const svgRect = svg.getBoundingClientRect();
-
     // Use the group element's own screenCTM which includes group transform + SVG viewBox transform
     const textBBox = textElement.getBBox();
     let pt = svg.createSVGPoint();
@@ -243,17 +239,15 @@ function makeTextEditable(textElement, groupElement) {
     input.style.top = `${screenPt.y}px`;
 
     const svgZoomFactor = svg.getScreenCTM() ? svg.getScreenCTM().a : 1;
-    const screenWidth = textBBox.width * svgZoomFactor;
-
     input.style.width = "auto";
     input.style.height = "auto";
 
-    const currentFontSize = textElement.getAttribute("font-size") || "30px";
+    const currentFontSize = textElement.getAttribute("font-size") || "20px";
     const currentFontFamily = textElement.getAttribute("font-family") || "lixFont";
     const currentFill = textElement.getAttribute("fill") || "#fff";
     const currentAnchor = textElement.getAttribute("text-anchor") || "start";
     // Scale font-size by zoom so the textarea matches what the user sees on canvas
-    const rawSize = parseFloat(currentFontSize) || 30;
+    const rawSize = parseFloat(currentFontSize) || 20;
     const scaledFontSize = `${rawSize * svgZoomFactor}px`;
 
     input.style.minWidth = "150px";
@@ -261,53 +255,31 @@ function makeTextEditable(textElement, groupElement) {
     input.style.width = "auto";
     input.style.height = "auto";
     input.style.overflow = "visible";
-    input.style.whiteSpace = "pre-wrap";
-    input.style.wordBreak = "break-word";
+    input.style.whiteSpace = "pre";
+    input.style.wordBreak = "normal";
+    input.style.overflowWrap = "normal";
     input.style.fontSize = scaledFontSize;
     input.style.fontFamily = currentFontFamily;
     input.style.color = currentFill;
     input.style.lineHeight = "1.2em";
     input.style.textAlign = currentAnchor === "middle" ? "center" : currentAnchor === "end" ? "right" : "left";
     input.style.backgroundColor = "transparent";
-    // Keep an obvious editing-only bounding box around the textarea. The
-    // editor is removed by renderText(), so this never becomes part of the
-    // rendered canvas or exported scene.
-    const _isDark = typeof document !== 'undefined'
-        && document.body
-        && document.body.classList.contains('theme-dark');
-    const editingBorder = _isDark ? "rgba(139,136,232,0.95)" : "rgba(91,87,209,0.92)";
-    input.style.border = `2px solid ${editingBorder}`;
-    input.style.backgroundColor = _isDark
-        ? "rgba(91,87,209,0.08)"
-        : "rgba(91,87,209,0.05)";
-    input.style.boxShadow = `0 0 0 2px ${_isDark ? "rgba(139,136,232,0.18)" : "rgba(91,87,209,0.14)"}`;
-    input.style.borderRadius = "4px";
+    input.style.border = "none";
+    input.style.boxShadow = "none";
     input.style.outline = "none";
     document.body.appendChild(input);
 
     const adjustHeight = () => {
         input.style.height = 'auto';
         input.style.height = input.scrollHeight + 'px';
-        const maxHeight = svgRect.height - (screenPt.y);
-        if (input.scrollHeight > maxHeight) {
-            input.style.height = maxHeight + 'px';
-            input.style.overflowY = 'auto';
-        } else {
-            input.style.overflowY = 'hidden';
-        }
+        input.style.overflowY = 'hidden';
     };
 
     const adjustWidth = () => {
         input.style.width = 'auto';
-        const maxWidth = svgRect.width - (screenPt.x);
         const contentWidth = Math.max(input.scrollWidth, 150);
-        if (contentWidth > maxWidth) {
-            input.style.width = maxWidth + 'px';
-            input.style.overflowX = 'auto';
-        } else {
-            input.style.width = contentWidth + 'px';
-            input.style.overflowX = 'hidden';
-        }
+        input.style.width = contentWidth + 'px';
+        input.style.overflowX = 'hidden';
     };
     adjustHeight();
     adjustWidth();
@@ -349,58 +321,12 @@ function makeTextEditable(textElement, groupElement) {
     groupElement.style.display = "none";
 }
 
-/**
- * Issue #48 phase D follow-up: true text wrapping driven by E/W width.
- *
- * `paint(textElement, source, wrapWidth)` renders the user-typed `source`
- * string into tspans, soft-wrapping any line that exceeds `wrapWidth`
- * pixels (in SVG units). `wrapWidth = null | 0` falls back to the old
- * "explicit newlines only" behaviour so existing text shapes that have
- * never been width-resized look identical.
- *
- * The raw `source` is persisted on the element as `data-wrap-source`
- * so subsequent edits (textarea re-open) and serialisation can rebuild
- * the original content even after auto-wrap inserted line breaks.
- */
-function measureSegment(text, refTextElement) {
-    if (!text) return 0;
-    const NS = 'http://www.w3.org/2000/svg';
-    const probe = document.createElementNS(NS, 'tspan');
-    probe.textContent = text;
-    refTextElement.appendChild(probe);
-    let width = 0;
-    try { width = probe.getComputedTextLength(); } catch {}
-    refTextElement.removeChild(probe);
-    return width;
-}
-
-function paintTextContent(textElement, source, wrapWidth) {
+/** Render only explicit editor line breaks; text never soft-wraps. */
+function paintTextContent(textElement, source) {
     while (textElement.firstChild) textElement.removeChild(textElement.firstChild);
     const x = textElement.getAttribute('x') || 0;
     const NS = 'http://www.w3.org/2000/svg';
-    const paragraphs = (source || '').split('\n');
-    const finalLines = [];
-
-    for (const paragraph of paragraphs) {
-        const para = paragraph.replace(/ /g, ' ');
-        if (!wrapWidth || wrapWidth <= 0) {
-            finalLines.push(para || ' ');
-            continue;
-        }
-        // Word-wrap the paragraph against wrapWidth.
-        const words = para.split(/(\s+)/);  // keep separators so spacing survives
-        let cur = '';
-        for (const token of words) {
-            const candidate = cur + token;
-            if (measureSegment(candidate, textElement) > wrapWidth && cur.trim().length > 0) {
-                finalLines.push(cur);
-                cur = token.replace(/^\s+/, '');  // drop the leading break-space
-            } else {
-                cur = candidate;
-            }
-        }
-        finalLines.push(cur.length ? cur : ' ');
-    }
+    const finalLines = (source || '').split('\n').map((line) => line.replace(/ /g, ' '));
 
     finalLines.forEach((line, i) => {
         const tspan = document.createElementNS(NS, 'tspan');
@@ -411,21 +337,6 @@ function paintTextContent(textElement, source, wrapWidth) {
     });
 }
 
-function getWrapSource(textElement) {
-    const stored = textElement.getAttribute('data-wrap-source');
-    if (stored !== null && stored !== '') return stored;
-    // Fallback: rebuild from existing tspans (legacy text shapes without
-    // the attribute). Join each tspan as a paragraph.
-    const tspans = textElement.querySelectorAll('tspan');
-    if (tspans.length === 0) return textElement.textContent || '';
-    return Array.from(tspans).map((t) => (t.textContent || '').replace(/ /g, ' ')).join('\n');
-}
-
-function getWrapWidth(textElement) {
-    const v = parseFloat(textElement.getAttribute('data-wrap-width') || '');
-    return Number.isFinite(v) && v > 0 ? v : 0;
-}
-
 function renderText(input, textElement, deleteIfEmpty = false) {
     if (!input || !document.body.contains(input)) {
          return;
@@ -483,13 +394,12 @@ function renderText(input, textElement, deleteIfEmpty = false) {
             removeSelectionFeedback();
         }
     } else {
-        // Persist the raw editor content so future E/W resizes can re-wrap
-        // from the user's original line breaks instead of the auto-inserted
-        // ones. Then call the shared paint helper \u2014 it falls back to the
-        // legacy "explicit newlines only" path when no wrap-width is set.
+        // Persist and render only the user's explicit Shift+Enter line
+        // breaks. Long lines remain long on the infinite canvas.
         const cleanSource = text.replace(/\u00A0/g, ' ');
         textElement.setAttribute('data-wrap-source', cleanSource);
-        paintTextContent(textElement, cleanSource, getWrapWidth(textElement));
+        textElement.removeAttribute('data-wrap-width');
+        paintTextContent(textElement, cleanSource);
 
         gElement.style.display = 'block';
 
@@ -551,18 +461,13 @@ function createSelectionFeedback(groupElement) {
     selectionBox.setAttribute("pointer-events", "none");
     groupElement.appendChild(selectionBox);
 
-    // Issue #48 bug #5 + phase D follow-up: E/W midpoint anchors drive
-    // TRUE word-wrap. Dragging E/W sets `data-wrap-width` on the text
-    // element; the paint helper re-flows tspans so the text wraps into
-    // multiple lines. Corner anchors keep their font-size scaling
-    // behaviour.
+    // Corner anchors scale font size. Width handles are intentionally
+    // omitted because text width is content-driven and never soft-wraps.
     const handlesData = [
         { name: 'nw', x: selX, y: selY, cursor: 'nwse-resize' },
         { name: 'ne', x: selX + selWidth, y: selY, cursor: 'nesw-resize' },
         { name: 'sw', x: selX, y: selY + selHeight, cursor: 'nesw-resize' },
         { name: 'se', x: selX + selWidth, y: selY + selHeight, cursor: 'nwse-resize' },
-        { name: 'e',  x: selX + selWidth, y: selY + selHeight / 2, cursor: 'ew-resize' },
-        { name: 'w',  x: selX, y: selY + selHeight / 2, cursor: 'ew-resize' },
     ];
 
     resizeHandles = {};
@@ -668,10 +573,6 @@ function updateSelectionFeedback() {
         { name: 'ne', x: selX + selWidth, y: selY },
         { name: 'sw', x: selX, y: selY + selHeight },
         { name: 'se', x: selX + selWidth, y: selY + selHeight },
-        // Issue #48 bug #5: keep E/W midpoint handles aligned with the
-        // resize so they follow the box as it scales.
-        { name: 'e',  x: selX + selWidth, y: selY + selHeight / 2 },
-        { name: 'w',  x: selX, y: selY + selHeight / 2 },
     ];
 
     handlesData.forEach(handle => {
@@ -963,7 +864,6 @@ const handleMouseMove = (event) => {
         const startHeight = startBBox.height;
 
         let anchorX, anchorY;
-        const isEdgeWidth = currentResizeHandle === 'e' || currentResizeHandle === 'w';
 
         switch (currentResizeHandle) {
             case 'nw':
@@ -982,34 +882,8 @@ const handleMouseMove = (event) => {
                 anchorX = startX;
                 anchorY = startY;
                 break;
-            case 'e':
-                anchorX = startX;
-                anchorY = startY + startHeight / 2;
-                break;
-            case 'w':
-                anchorX = startX + startWidth;
-                anchorY = startY + startHeight / 2;
-                break;
-        }
-
-        // Issue #48 phase D follow-up: E/W now drives TRUE word-wrap.
-        // The drag distance becomes the wrap-width target; we re-paint
-        // the text with the new width and short-circuit the font-size
-        // scaling path that the corners use.
-        if (isEdgeWidth) {
-            const newWrap = Math.abs(currentPoint.x - anchorX);
-            const minWrap = startFontSize * 2;  // at least ~one short word wide
-            const clampedWrap = Math.max(minWrap, newWrap);
-            textElement.setAttribute('data-wrap-width', String(clampedWrap));
-            const source = getWrapSource(textElement);
-            paintTextContent(textElement, source, clampedWrap);
-            if (typeof updateSelectionFeedback === 'function') {
-                setTimeout(updateSelectionFeedback, 0);
-            }
-            return;
         }
 
-        const newWidth = Math.abs(currentPoint.x - anchorX);
         const newHeight = Math.abs(currentPoint.y - anchorY);
         const chosenScale = newHeight / startHeight;
 
@@ -1044,14 +918,6 @@ const handleMouseMove = (event) => {
                 newAnchorX = currentBBox.x;
                 newAnchorY = currentBBox.y;
                 break;
-            case 'e':
-                newAnchorX = currentBBox.x;
-                newAnchorY = currentBBox.y + currentBBox.height / 2;
-                break;
-            case 'w':
-                newAnchorX = currentBBox.x + currentBBox.width;
-                newAnchorY = currentBBox.y + currentBBox.height / 2;
-                break;
         }
 
         const deltaX = anchorX - newAnchorX;

package/dist/react/TextShape-54ZJ66E3.js

@@ -1,8 +0,0 @@
-"use client";
-import {
-  TextShape
-} from "./chunk-QXFBG7OM.js";
-export {
-  TextShape
-};
-//# sourceMappingURL=TextShape-54ZJ66E3.js.map

package/dist/react/chunk-QXFBG7OM.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/shapes/TextShape.js"],
-  "sourcesContent": ["/* eslint-disable */\n// TextShape class - extracted from writeText.js\n// Depends on globals: svg, shapes, currentShape\n\nfunction extractRotationFromTransform(el) {\n    const t = el.getAttribute(\"transform\") || \"\";\n    const m = t.match(/rotate\\(([^,)]+)/);\n    return m ? parseFloat(m[1]) : 0;\n}\nfunction updateAttachedArrows(wrapper) {\n    if (!wrapper || typeof shapes === \"undefined\") return;\n    shapes.forEach(s => {\n        if (s && s.shapeName === \"arrow\" && typeof s.updateAttachments === \"function\") {\n            if ((s.attachedToStart && s.attachedToStart.shape === wrapper) ||\n                (s.attachedToEnd && s.attachedToEnd.shape === wrapper)) {\n                s.updateAttachments();\n            }\n        }\n    });\n}\nlet isDragging = false;\nlet hoveredFrameText = null;\nlet selectedElement = null;\nfunction updateSelectionFeedback() {}\nfunction deselectElement() { selectedElement = null; }\nfunction selectElement(el) { selectedElement = el; }\n\nclass TextShape {\n    constructor(groupElement) {\n        this.group = groupElement;\n        this.shapeName = 'text';\n        this.shapeID = groupElement.getAttribute('id') || `text-${String(Date.now()).slice(0, 8)}-${Math.floor(Math.random() * 10000)}`;\n        \n        // Frame attachment properties\n        this.parentFrame = null;\n        \n        // Update group attributes \u2014 ensure data-type is set for textTool interaction\n        this.group.setAttribute('type', 'text');\n        this.group.setAttribute('data-type', 'text-group');\n        this.group.shapeName = 'text';\n        this.group.shapeID = this.shapeID;\n    }\n    \n    // Position and dimension properties for frame compatibility\n    get x() {\n        const transform = this.group.transform.baseVal.consolidate();\n        return transform ? transform.matrix.e : parseFloat(this.group.getAttribute('data-x')) || 0;\n    }\n    \n    set x(value) {\n        const transform = this.group.transform.baseVal.consolidate();\n        const currentY = transform ? transform.matrix.f : parseFloat(this.group.getAttribute('data-y')) || 0;\n        const rotation = extractRotationFromTransform(this.group) || 0;\n        const textElement = this.group.querySelector('text');\n        if (textElement) {\n            const bbox = textElement.getBBox();\n            const centerX = bbox.x + bbox.width / 2;\n            const centerY = bbox.y + bbox.height / 2;\n            this.group.setAttribute('transform', `translate(${value}, ${currentY}) rotate(${rotation}, ${centerX}, ${centerY})`);\n        } else {\n            this.group.setAttribute('transform', `translate(${value}, ${currentY})`);\n        }\n        this.group.setAttribute('data-x', value);\n    }\n    \n    get y() {\n        const transform = this.group.transform.baseVal.consolidate();\n        return transform ? transform.matrix.f : parseFloat(this.group.getAttribute('data-y')) || 0;\n    }\n    \n    set y(value) {\n        const transform = this.group.transform.baseVal.consolidate();\n        const currentX = transform ? transform.matrix.e : parseFloat(this.group.getAttribute('data-x')) || 0;\n        const rotation = extractRotationFromTransform(this.group) || 0;\n        const textElement = this.group.querySelector('text');\n        if (textElement) {\n            const bbox = textElement.getBBox();\n            const centerX = bbox.x + bbox.width / 2;\n            const centerY = bbox.y + bbox.height / 2;\n            this.group.setAttribute('transform', `translate(${currentX}, ${value}) rotate(${rotation}, ${centerX}, ${centerY})`);\n        } else {\n            this.group.setAttribute('transform', `translate(${currentX}, ${value})`);\n        }\n        this.group.setAttribute('data-y', value);\n    }\n    \n    get width() {\n        const textElement = this.group.querySelector('text');\n        if (textElement) {\n            return textElement.getBBox().width;\n        }\n        return 0;\n    }\n    \n    set width(value) {\n        // Text width is determined by content and font size, not directly settable\n        // This is here for frame compatibility but doesn't change the text\n    }\n    \n    get height() {\n        const textElement = this.group.querySelector('text');\n        if (textElement) {\n            return textElement.getBBox().height;\n        }\n        return 0;\n    }\n    \n    set height(value) {\n        // Text height is determined by content and font size, not directly settable\n        // This is here for frame compatibility but doesn't change the text\n    }\n    \n    get rotation() {\n        return extractRotationFromTransform(this.group) || 0;\n    }\n    \n    set rotation(value) {\n        const currentTransform = this.group.transform.baseVal.consolidate();\n        const currentX = currentTransform ? currentTransform.matrix.e : 0;\n        const currentY = currentTransform ? currentTransform.matrix.f : 0;\n        const textElement = this.group.querySelector('text');\n        if (textElement) {\n            const bbox = textElement.getBBox();\n            const centerX = bbox.x + bbox.width / 2;\n            const centerY = bbox.y + bbox.height / 2;\n            this.group.setAttribute('transform', `translate(${currentX}, ${currentY}) rotate(${value}, ${centerX}, ${centerY})`);\n        }\n    }\n\n    move(dx, dy) {\n        const currentTransform = this.group.transform.baseVal.consolidate();\n        const currentX = currentTransform ? currentTransform.matrix.e : 0;\n        const currentY = currentTransform ? currentTransform.matrix.f : 0;\n\n        this.x = currentX + dx;\n        this.y = currentY + dy;\n\n        // Only update frame containment if we're actively dragging the shape itself\n        // and not being moved by a parent frame\n        if (isDragging && !this.isBeingMovedByFrame) {\n            this.updateFrameContainment();\n        }\n\n        this.updateAttachedArrows();\n    }\n\n    updateAttachedArrows() {\n        updateAttachedArrows(this);\n    }\n\n    updateFrameContainment() {\n        // Don't update if we're being moved by a frame\n        if (this.isBeingMovedByFrame) return;\n        \n        let targetFrame = null;\n        \n        // Find which frame this shape is over\n        if (typeof shapes !== 'undefined' && Array.isArray(shapes)) {\n            shapes.forEach(shape => {\n                if (shape.shapeName === 'frame' && shape.isShapeInFrame(this)) {\n                    targetFrame = shape;\n                }\n            });\n        }\n        \n        // If we have a parent frame and we're being dragged, temporarily remove clipping\n        if (this.parentFrame && isDragging) {\n            this.parentFrame.temporarilyRemoveFromFrame(this);\n        }\n        \n        // Update frame highlighting\n        if (hoveredFrameText && hoveredFrameText !== targetFrame) {\n            hoveredFrameText.removeHighlight();\n        }\n        \n        if (targetFrame && targetFrame !== hoveredFrameText) {\n            targetFrame.highlightFrame();\n        }\n        \n        hoveredFrameText = targetFrame;\n    }\n\n    contains(x, y) {\n        const textElement = this.group.querySelector('text');\n        if (!textElement || typeof textElement.getBBox !== 'function') return false;\n\n        let bbox;\n        try { bbox = textElement.getBBox(); } catch { return false; }\n        const padding = 8; // Selection padding\n\n        const CTM = this.group.getCTM();\n        if (!CTM) return false;\n        \n        const inverseCTM = CTM.inverse();\n        const svgPoint = svg.createSVGPoint();\n        svgPoint.x = x;\n        svgPoint.y = y;\n        const transformedPoint = svgPoint.matrixTransform(inverseCTM);\n        \n        return transformedPoint.x >= bbox.x - padding && \n               transformedPoint.x <= bbox.x + bbox.width + padding &&\n               transformedPoint.y >= bbox.y - padding && \n               transformedPoint.y <= bbox.y + bbox.height + padding;\n    }\n\n    // Add draw method for consistency with other shapes\n    draw() {\n        // Text doesn't need redrawing like other shapes, but we need this method for consistency\n        if (selectedElement === this.group) {\n            updateSelectionFeedback();\n        }\n    }\n\n    // Add methods for frame compatibility\n    removeSelection() {\n        if (selectedElement === this.group) {\n            deselectElement();\n        }\n    }\n\n    selectShape() {\n        // Use the real textTool selectElement (with selection feedback) if available\n        if (typeof window !== 'undefined' && window.__selectTextElement) {\n            window.__selectTextElement(this.group);\n        } else {\n            selectElement(this.group);\n        }\n    }\n}\n\nexport { TextShape };\n"],
-  "mappings": "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",
-  "names": []
-}