@sequent-org/moodboard 1.4.30 → 1.4.32

package/src/ui/handles/HandlesInteractionController.js

@@ -42,10 +42,10 @@ export class HandlesInteractionController {
         const screenX = cssRect.left - offsetLeft;
         const screenY = cssRect.top - offsetTop;
         return {
-            x: ((screenX * rendererRes) - tx) / s,
-            y: ((screenY * rendererRes) - ty) / s,
-            width: (cssRect.width * rendererRes) / s,
-            height: (cssRect.height * rendererRes) / s,
+            x: (screenX - tx) / s,
+            y: (screenY - ty) / s,
+            width: cssRect.width / s,
+            height: cssRect.height / s,
         };
     }
 
@@ -155,6 +155,37 @@ export class HandlesInteractionController {
         const dir = e.currentTarget.dataset.dir;
         const id = e.currentTarget.dataset.id;
         const isGroup = id === '__group__';
+
+        // Детектируем двойной клик/тап по ручке текстового объекта → открываем редактор вместо resize.
+        // Необходимо, т.к. при dblclick второй mousedown попадает на HTML-ручку (stopPropagation
+        // обрывает bubbling до canvas), поэтому нативный dblclick до canvas не доходит.
+        if (!isGroup) {
+            const _now = performance.now();
+            if (!this._lastHandleDownTime) this._lastHandleDownTime = {};
+            const _prevTime = this._lastHandleDownTime[id];
+            this._lastHandleDownTime[id] = _now;
+            if (_prevTime !== undefined && (_now - _prevTime) < 300) {
+                const _typeReq = { objectId: id, pixiObject: null };
+                this.host.eventBus.emit(Events.Tool.GetObjectPixi, _typeReq);
+                const _mbType = _typeReq.pixiObject?._mb?.type;
+                if (_mbType === 'text' || _mbType === 'simple-text' || _mbType === 'note') {
+                    const _posData = { objectId: id, position: null };
+                    this.host.eventBus.emit(Events.Tool.GetObjectPosition, _posData);
+                    if (_posData.position) {
+                        this.host.eventBus.emit(Events.Tool.ObjectEdit, {
+                            id,
+                            type: _mbType,
+                            position: _posData.position,
+                            properties: _typeReq.pixiObject?._mb?.properties || {},
+                            caretClick: { clientX: e.clientX, clientY: e.clientY },
+                            create: false,
+                        });
+                    }
+                    return;
+                }
+            }
+        }
+
         const world = this.host.core.pixi.worldLayer || this.host.core.pixi.app.stage;
         const s = world?.scale?.x || 1;
         const tx = world?.x || 0;
@@ -328,10 +359,10 @@ export class HandlesInteractionController {
             const screenY = (newTop - offsetTop);
             const screenW = newW;
             const screenH = newH;
-            const worldX = ((screenX * rendererRes) - tx) / s;
-            const worldY = ((screenY * rendererRes) - ty) / s;
-            const worldW = (screenW * rendererRes) / s;
-            const worldH = (screenH * rendererRes) / s;
+            const worldX = (screenX - tx) / s;
+            const worldY = (screenY - ty) / s;
+            const worldW = screenW / s;
+            const worldH = screenH / s;
 
             if (isGroup) {
                 this.host.eventBus.emit(Events.Tool.GroupResizeUpdate, {
@@ -359,8 +390,8 @@ export class HandlesInteractionController {
         };
 
         const onUp = () => {
-            document.removeEventListener('mousemove', onMove);
-            document.removeEventListener('mouseup', onUp);
+            document.removeEventListener('pointermove', onMove);
+            document.removeEventListener('pointerup', onUp);
             const endCSS = {
                 left: parseFloat(box.style.left),
                 top: parseFloat(box.style.top),
@@ -371,10 +402,10 @@ export class HandlesInteractionController {
             const screenY = (endCSS.top - offsetTop);
             const screenW = endCSS.width;
             const screenH = endCSS.height;
-            const worldX = ((screenX * rendererRes) - tx) / s;
-            const worldY = ((screenY * rendererRes) - ty) / s;
-            const worldW = (screenW * rendererRes) / s;
-            const worldH = (screenH * rendererRes) / s;
+            const worldX = (screenX - tx) / s;
+            const worldY = (screenY - ty) / s;
+            const worldW = screenW / s;
+            const worldH = screenH / s;
 
             if (isGroup) {
                 this.host.eventBus.emit(Events.Tool.GroupResizeEnd, { objects });
@@ -406,7 +437,7 @@ export class HandlesInteractionController {
                             el.style.width = `${Math.max(1, Math.round(endCSS.width))}px`;
                             el.style.height = 'auto';
                             const measured = Math.max(1, Math.round(el.scrollHeight));
-                            const worldH2 = (measured * rendererRes) / s;
+                            const worldH2 = measured / s;
                             const fixData = {
                                 object: id,
                                 size: { width: worldW, height: worldH2 },
@@ -419,8 +450,8 @@ export class HandlesInteractionController {
             }
         };
 
-        document.addEventListener('mousemove', onMove);
-        document.addEventListener('mouseup', onUp);
+        document.addEventListener('pointermove', onMove);
+        document.addEventListener('pointerup', onUp);
     }
 
     onEdgeResizeDown(e) {
@@ -600,10 +631,10 @@ export class HandlesInteractionController {
             const screenY = (newTop - offsetTop);
             const screenW = newW;
             const screenH = newH;
-            const worldX = ((screenX * rendererRes) - tx) / s;
-            const worldY = ((screenY * rendererRes) - ty) / s;
-            const worldW = (screenW * rendererRes) / s;
-            const worldH = (screenH * rendererRes) / s;
+            const worldX = (screenX - tx) / s;
+            const worldY = (screenY - ty) / s;
+            const worldW = screenW / s;
+            const worldH = screenH / s;
             const edgePositionChanged = (newLeft !== startCSS.left) || (newTop !== startCSS.top);
 
             if (isGroup) {
@@ -624,8 +655,8 @@ export class HandlesInteractionController {
         };
 
         const onUp = () => {
-            document.removeEventListener('mousemove', onMove);
-            document.removeEventListener('mouseup', onUp);
+            document.removeEventListener('pointermove', onMove);
+            document.removeEventListener('pointerup', onUp);
             const endCSS = {
                 left: parseFloat(box.style.left),
                 top: parseFloat(box.style.top),
@@ -636,10 +667,10 @@ export class HandlesInteractionController {
             const screenY = (endCSS.top - offsetTop);
             const screenW = endCSS.width;
             const screenH = endCSS.height;
-            const worldX = ((screenX * rendererRes) - tx) / s;
-            const worldY = ((screenY * rendererRes) - ty) / s;
-            const worldW = (screenW * rendererRes) / s;
-            const worldH = (screenH * rendererRes) / s;
+            const worldX = (screenX - tx) / s;
+            const worldY = (screenY - ty) / s;
+            const worldW = screenW / s;
+            const worldH = screenH / s;
 
             if (isGroup) {
                 this.host.eventBus.emit(Events.Tool.GroupResizeEnd, { objects });
@@ -654,7 +685,7 @@ export class HandlesInteractionController {
                             el.style.width = `${Math.max(1, Math.round(endCSS.width))}px`;
                             el.style.height = 'auto';
                             const measured = Math.max(1, Math.round(el.scrollHeight));
-                            finalWorldH = (measured * rendererRes) / s;
+                            finalWorldH = measured / s;
                         }
                     } catch (_) {}
                 }
@@ -670,8 +701,8 @@ export class HandlesInteractionController {
             }
         };
 
-        document.addEventListener('mousemove', onMove);
-        document.addEventListener('mouseup', onUp);
+        document.addEventListener('pointermove', onMove);
+        document.addEventListener('pointerup', onUp);
     }
 
     onRotateHandleDown(e, box) {
@@ -741,8 +772,8 @@ export class HandlesInteractionController {
         };
 
         const onRotateUp = (ev) => {
-            document.removeEventListener('mousemove', onRotateMove);
-            document.removeEventListener('mouseup', onRotateUp);
+            document.removeEventListener('pointermove', onRotateMove);
+            document.removeEventListener('pointerup', onRotateUp);
 
             if (handleElement) {
                 handleElement.style.cursor = 'grab';
@@ -766,7 +797,7 @@ export class HandlesInteractionController {
             }
         };
 
-        document.addEventListener('mousemove', onRotateMove);
-        document.addEventListener('mouseup', onRotateUp);
+        document.addEventListener('pointermove', onRotateMove);
+        document.addEventListener('pointerup', onRotateUp);
     }
 }

package/src/ui/handles/HandlesPositioningService.js

@@ -102,14 +102,49 @@ export class HandlesPositioningService {
         const screenX = cssRect.left - offsetLeft;
         const screenY = cssRect.top - offsetTop;
         return {
-            x: ((screenX * rendererRes) - tx) / s,
-            y: ((screenY * rendererRes) - ty) / s,
-            width: (cssRect.width * rendererRes) / s,
-            height: (cssRect.height * rendererRes) / s,
+            x: (screenX - tx) / s,
+            y: (screenY - ty) / s,
+            width: cssRect.width / s,
+            height: cssRect.height / s,
         };
     }
 
     getSingleSelectionWorldBounds(id, pixi) {
+        // Для текстовых объектов (type=text/simple-text) рамку строим по реальному DOM-боксу
+        // букв, а не по сохранённому width/height из state. Только для неповёрнутых объектов:
+        // getBoundingClientRect повёрнутого элемента — axis-aligned, даст неверный размер.
+        if (typeof document !== 'undefined') {
+            const textEl = document.querySelector(`.mb-text[data-id="${id}"]`);
+            if (textEl) {
+                const rotationData = { objectId: id, rotation: 0 };
+                this.host.eventBus.emit(Events.Tool.GetObjectRotation, rotationData);
+                if (Math.abs(rotationData.rotation || 0) < 0.001) {
+                    try {
+                        const r = textEl.getBoundingClientRect();
+                        // Пустой/создаваемый текст: .mb-text схлопнут (высота ~2px),
+                        // плейсхолдер живёт в textarea редактора, а не в этом div.
+                        // В этом случае DOM-боксу не доверяем — падаем в state-размер ниже.
+                        const hasContent = !!(textEl.textContent && textEl.textContent.trim());
+                        if (hasContent && r.width > 2 && r.height > 2) {
+                            const view = this.host.core.pixi.app.view;
+                            const viewRect = view.getBoundingClientRect();
+                            const { world } = this.getWorldTransform();
+                            // getBoundingClientRect в CSS pixels; viewRect тоже; разность —
+                            // глобальные PIXI-координаты (toGlobal/toLocal работают в CSS px).
+                            const tl = world.toLocal(new PIXI.Point(r.left - viewRect.left, r.top - viewRect.top));
+                            const br = world.toLocal(new PIXI.Point(r.right - viewRect.left, r.bottom - viewRect.top));
+                            return {
+                                x: Math.min(tl.x, br.x),
+                                y: Math.min(tl.y, br.y),
+                                width: Math.max(1, Math.abs(br.x - tl.x)),
+                                height: Math.max(1, Math.abs(br.y - tl.y)),
+                            };
+                        }
+                    } catch (_) {}
+                }
+            }
+        }
+
         const positionData = { objectId: id, position: null };
         const sizeData = { objectId: id, size: null };
         this.host.eventBus.emit(Events.Tool.GetObjectPosition, positionData);
@@ -199,8 +234,8 @@ export class HandlesPositioningService {
         const screenX = centerX - offsetLeft;
         const screenY = centerY - offsetTop;
         return {
-            x: ((screenX * rendererRes) - tx) / s,
-            y: ((screenY * rendererRes) - ty) / s,
+            x: (screenX - tx) / s,
+            y: (screenY - ty) / s,
         };
     }
 }

package/src/ui/mindmap/MindmapCollapseGraph.js

@@ -0,0 +1,169 @@
+/**
+ * Чистые функции для работы с деревом майндмапа (collapse/expand).
+ * Без PIXI, без побочных эффектов, без импортов UI.
+ */
+
+const MINDMAP_TYPE = 'mindmap';
+const CHILD_ROLE = 'child';
+const VALID_SIDES = new Set(['left', 'right', 'bottom']);
+
+function isMindmapNode(obj) {
+    return obj?.type === MINDMAP_TYPE;
+}
+
+function asMeta(obj) {
+    return obj?.properties?.mindmap || {};
+}
+
+function asNonEmptyString(value) {
+    return typeof value === 'string' && value.trim().length > 0 ? value.trim() : null;
+}
+
+/**
+ * Резолв родителя — та же логика, что в MindmapConnectionLayer.resolveLegacyLink.
+ * Возвращает parentId или null.
+ */
+function resolveParentId(child, byId, rootByCompoundId) {
+    const meta = asMeta(child);
+    const compoundId = meta.compoundId || null;
+    let parentId = meta.parentId || null;
+    const childId = child?.id || null;
+
+    if (!parentId || parentId === childId) {
+        parentId = asNonEmptyString(meta.branchRootId);
+    }
+
+    const parent = parentId ? byId.get(parentId) : null;
+    if (!parent && compoundId) {
+        const rootId = rootByCompoundId.get(compoundId) || null;
+        if (rootId && rootId !== childId) parentId = rootId;
+    }
+
+    if (parentId === childId && compoundId) {
+        const rootId = rootByCompoundId.get(compoundId) || null;
+        if (rootId && rootId !== childId) parentId = rootId;
+    }
+
+    return parentId || null;
+}
+
+function buildIndexMaps(objects) {
+    const arr = Array.isArray(objects) ? objects : [];
+    const mindmaps = arr.filter(isMindmapNode);
+    const byId = new Map(mindmaps.map((o) => [o.id, o]));
+    const rootByCompoundId = new Map();
+    mindmaps.forEach((o) => {
+        const meta = asMeta(o);
+        const cid = asNonEmptyString(meta.compoundId);
+        if (meta.role === 'root' && cid) {
+            rootByCompoundId.set(cid, o.id);
+        }
+    });
+    return { byId, rootByCompoundId };
+}
+
+/**
+ * Строит индекс parent → [children] для всех майндмап-нод.
+ * @param {object[]} objects — массив всех объектов доски
+ * @returns {Map<string, object[]>}
+ */
+export function buildChildrenIndex(objects) {
+    const arr = Array.isArray(objects) ? objects : [];
+    const { byId, rootByCompoundId } = buildIndexMaps(arr);
+
+    const index = new Map();
+    arr.filter(isMindmapNode).forEach((obj) => {
+        const meta = asMeta(obj);
+        if (meta.role !== CHILD_ROLE) return;
+        const parentId = resolveParentId(obj, byId, rootByCompoundId);
+        if (!parentId) return;
+        if (!index.has(parentId)) index.set(parentId, []);
+        index.get(parentId).push(obj);
+    });
+
+    return index;
+}
+
+/**
+ * Возвращает id всех потомков nodeId (рекурсивно, все уровни).
+ * @param {object[]} objects
+ * @param {string} nodeId
+ * @returns {string[]}
+ */
+export function getDescendantIds(objects, nodeId) {
+    const childrenIndex = buildChildrenIndex(objects);
+    const result = [];
+    const queue = [nodeId];
+    const visited = new Set();
+
+    while (queue.length > 0) {
+        const id = queue.shift();
+        if (visited.has(id)) continue;
+        visited.add(id);
+        const children = childrenIndex.get(id) || [];
+        for (const child of children) {
+            result.push(child.id);
+            queue.push(child.id);
+        }
+    }
+
+    return result;
+}
+
+/**
+ * Возвращает true, если у любого предка nodeId стоит collapsed === true.
+ * @param {object[]} objects
+ * @param {string} nodeId
+ * @returns {boolean}
+ */
+export function isHiddenByCollapsedAncestor(objects, nodeId) {
+    const { byId, rootByCompoundId } = buildIndexMaps(objects);
+    const node = byId.get(nodeId);
+    if (!node) return false;
+
+    let currentId = resolveParentId(node, byId, rootByCompoundId);
+    const visited = new Set();
+
+    while (currentId) {
+        if (visited.has(currentId)) break;
+        visited.add(currentId);
+        const ancestor = byId.get(currentId);
+        if (!ancestor) break;
+        if (asMeta(ancestor).collapsed === true) return true;
+        currentId = resolveParentId(ancestor, byId, rootByCompoundId);
+    }
+
+    return false;
+}
+
+/**
+ * Число всех потомков ноды — для отображения в бейдже.
+ * @param {object[]} objects
+ * @param {string} nodeId
+ * @returns {number}
+ */
+export function countVisibleDescendantsForBadge(objects, nodeId) {
+    return getDescendantIds(objects, nodeId).length;
+}
+
+/**
+ * Возвращает стороны ('left'|'right'|'bottom'), по которым у ноды есть дети.
+ * Используется для размещения кнопки collapse со стороны детей.
+ * @param {object[]} objects
+ * @param {string} nodeId
+ * @returns {Set<string>}
+ */
+export function getChildrenSidesWithChildren(objects, nodeId) {
+    const { byId, rootByCompoundId } = buildIndexMaps(objects);
+    const sides = new Set();
+
+    (Array.isArray(objects) ? objects : []).filter(isMindmapNode).forEach((obj) => {
+        const meta = asMeta(obj);
+        if (meta.role !== CHILD_ROLE) return;
+        const parentId = resolveParentId(obj, byId, rootByCompoundId);
+        if (parentId !== nodeId) return;
+        if (VALID_SIDES.has(meta.side)) sides.add(meta.side);
+    });
+
+    return sides;
+}