@sequent-org/moodboard 1.4.31 → 1.4.33

package/src/core/commands/UpdateShapeStyleCommand.js

@@ -0,0 +1,121 @@
+/**
+ * Команда изменения стиля фигуры (цвет заливки, тип, обводка, радиус скругления) — одно действие в истории.
+ * Поддерживает частичные обновления: хранит только те поля, которые изменились.
+ *
+ * Снапшот: { color?, properties?: { kind?, cornerRadius?, borderColor?, borderWidth?, borderStyle?, borderOpacity? } }
+ */
+import { BaseCommand } from './BaseCommand.js';
+import { Events } from '../events/Events.js';
+
+export class UpdateShapeStyleCommand extends BaseCommand {
+    /**
+     * @param {Object} coreMoodboard — ядро доски
+     * @param {string} objectId — id объекта-фигуры
+     * @param {Object} oldSnapshot — прежние значения (только изменяемые поля)
+     * @param {Object} newSnapshot — новые значения (только изменяемые поля)
+     */
+    constructor(coreMoodboard, objectId, oldSnapshot, newSnapshot) {
+        super('update_shape_style', 'Изменить стиль фигуры');
+        this.coreMoodboard = coreMoodboard;
+        this.objectId = objectId;
+        this.oldSnapshot = oldSnapshot;
+        this.newSnapshot = newSnapshot;
+    }
+
+    execute() {
+        this._apply(this.newSnapshot);
+    }
+
+    undo() {
+        // Локальный undo отключён: история состояния загружается с сервера по версиям.
+    }
+
+    canMergeWith(other) {
+        return other instanceof UpdateShapeStyleCommand &&
+            other.objectId === this.objectId &&
+            _snapshotKeysMatch(this.newSnapshot, other.newSnapshot);
+    }
+
+    mergeWith(other) {
+        if (!this.canMergeWith(other)) throw new Error('Cannot merge commands');
+        this.newSnapshot = other.newSnapshot;
+        this.timestamp = other.timestamp;
+    }
+
+    _apply(snapshot) {
+        const { coreMoodboard, objectId } = this;
+        const object = coreMoodboard.state.getObjects().find(o => o.id === objectId);
+        if (!object) return;
+
+        // Обновить состояние
+        if ('color' in snapshot) {
+            object.color = snapshot.color;
+        }
+        if (snapshot.properties) {
+            if (!object.properties) object.properties = {};
+            Object.assign(object.properties, snapshot.properties);
+        }
+        coreMoodboard.state.markDirty();
+
+        // Обновить PIXI-инстанс
+        const pixiObject = coreMoodboard.pixi?.objects?.get(objectId);
+        const instance = pixiObject?._mb?.instance;
+
+        if (instance) {
+            if ('color' in snapshot && instance.setColor) {
+                instance.setColor(snapshot.color);
+            }
+            if (snapshot.properties) {
+                const p = snapshot.properties;
+
+                // kind и cornerRadius — через setProperties (borderStyle идёт только в setStroke)
+                if ((p.kind !== undefined || p.cornerRadius !== undefined) && instance.setProperties) {
+                    instance.setProperties({ kind: p.kind, cornerRadius: p.cornerRadius });
+                }
+
+                // Параметры обводки (borderStyle здесь тоже)
+                const hasStroke = p.borderColor !== undefined || p.borderWidth !== undefined ||
+                    p.borderStyle !== undefined || p.borderOpacity !== undefined;
+                if (hasStroke && instance.setStroke) {
+                    instance.setStroke({
+                        borderColor: p.borderColor,
+                        borderWidth: p.borderWidth,
+                        borderStyle: p.borderStyle,
+                        borderOpacity: p.borderOpacity,
+                    });
+                }
+            }
+        }
+
+        // Синхронизировать _mb.properties с новым состоянием
+        if (pixiObject?._mb) {
+            if (!pixiObject._mb.properties) pixiObject._mb.properties = {};
+            if ('color' in snapshot) pixiObject._mb.color = snapshot.color;
+            if (snapshot.properties) Object.assign(pixiObject._mb.properties, snapshot.properties);
+        }
+
+        // Уведомить остальных подписчиков (с флагом чтобы избежать рекурсии в tryCreateShapeStyleCommand)
+        const updates = {};
+        if ('color' in snapshot) updates.color = snapshot.color;
+        if (snapshot.properties) updates.properties = { ...snapshot.properties };
+
+        coreMoodboard.eventBus.emit(Events.Object.StateChanged, {
+            objectId,
+            updates,
+            _fromCommand: true,
+        });
+    }
+}
+
+/**
+ * Проверяет, что два снапшота содержат одинаковый набор ключей — для слияния команд.
+ */
+function _snapshotKeysMatch(a, b) {
+    const topA = Object.keys(a).sort().join(',');
+    const topB = Object.keys(b).sort().join(',');
+    if (topA !== topB) return false;
+    if (a.properties && b.properties) {
+        return Object.keys(a.properties).sort().join(',') === Object.keys(b.properties).sort().join(',');
+    }
+    return !(a.properties || b.properties);
+}

package/src/core/commands/UpdateTextStyleCommand.js

@@ -1,11 +1,14 @@
 /**
- * Команда изменения свойств текста (шрифт, размер, цвет, фон) для системы Undo/Redo.
- * Поддерживает: fontFamily, fontSize, color, backgroundColor.
+ * Команда изменения свойств текста для системы Undo/Redo.
+ * Поддерживает: fontFamily, fontSize, color, backgroundColor, markdown,
+ * bold, italic, underline, strikethrough, textAlign, lineHeight, listType.
  */
 import { BaseCommand } from './BaseCommand.js';
 import { Events } from '../events/Events.js';
 import { syncPixiTextProperties } from '../../ui/text-properties/TextPropertiesPanelMapper.js';
 
+const PROPERTY_LEVEL = ['fontFamily', 'markdown', 'bold', 'italic', 'underline', 'strikethrough', 'textAlign', 'lineHeight', 'listType'];
+
 export class UpdateTextStyleCommand extends BaseCommand {
     /**
      * @param {Object} coreMoodboard — ядро доски
@@ -52,9 +55,9 @@ export class UpdateTextStyleCommand extends BaseCommand {
 
         const { property } = this;
 
-        if (property === 'fontFamily') {
+        if (PROPERTY_LEVEL.includes(property)) {
             if (!object.properties) object.properties = {};
-            object.properties.fontFamily = value;
+            object.properties[property] = value;
         } else {
             object[property] = value;
         }
@@ -69,8 +72,8 @@ export class UpdateTextStyleCommand extends BaseCommand {
 
         syncPixiTextProperties(this.coreMoodboard.eventBus, this.objectId, { [property]: value });
 
-        const updates = property === 'fontFamily'
-            ? { properties: { fontFamily: value } }
+        const updates = PROPERTY_LEVEL.includes(property)
+            ? { properties: { [property]: value } }
             : { [property]: value };
         this.coreMoodboard.eventBus.emit(Events.Object.StateChanged, {
             objectId: this.objectId,
@@ -85,6 +88,14 @@ function _propertyLabel(property) {
         fontSize: 'размер шрифта',
         color: 'цвет текста',
         backgroundColor: 'фон текста',
+        markdown: 'markdown-режим',
+        bold: 'жирный текст',
+        italic: 'курсив',
+        underline: 'подчёркивание',
+        strikethrough: 'зачёркивание',
+        textAlign: 'выравнивание текста',
+        lineHeight: 'межстрочный интервал',
+        listType: 'тип списка',
     };
     return labels[property] || property;
 }

package/src/core/commands/index.js

@@ -18,3 +18,6 @@ export { UpdateTextStyleCommand } from './UpdateTextStyleCommand.js';
 export { UpdateNoteStyleCommand } from './UpdateNoteStyleCommand.js';
 export { UpdateFramePropertiesCommand } from './UpdateFramePropertiesCommand.js';
 export { UpdateFrameTypeCommand } from './UpdateFrameTypeCommand.js';
+export { CreateConnectorCommand } from './CreateConnectorCommand.js';
+export { UpdateConnectorCommand } from './UpdateConnectorCommand.js';
+export { UpdateShapeStyleCommand } from './UpdateShapeStyleCommand.js';

package/src/core/events/Events.js

@@ -9,6 +9,8 @@ export const Events = {
 		SelectionRemove: 'tool:selection:remove',
 		SelectionClear: 'tool:selection:clear',
 		SelectionAll: 'tool:selection:all',
+		BoxSelectStart: 'tool:box:select:start',
+		BoxSelectCommit: 'tool:box:select:commit',
 		HitTest: 'tool:hit:test',
 		GetSelection: 'tool:get:selection',
 		GetAllObjects: 'tool:get:all:objects',
@@ -153,6 +155,26 @@ export const Events = {
 	Draw: {
 		BrushSet: 'draw:brush:set',
 	},
+
+	Lasso: {
+		ModeSet: 'lasso:mode:set',
+	},
+
+	Comment: {
+		PinCreated: 'comment:pin:created',
+		ThreadOpened: 'comment:thread:opened',
+		MessageAdded: 'comment:message:added',
+		Resolved: 'comment:resolved',
+		ColorChanged: 'comment:color:changed',
+		Deleted: 'comment:deleted',
+		RemoteUpdated: 'comment:remote:updated',
+		OpenDraftAt: 'comment:open:draft:at',
+		ThreadDeleted: 'comment:thread:deleted',
+		DraftOpened: 'comment:draft:opened',
+		DraftClosed: 'comment:draft:closed',
+		ResolvedFilterChanged: 'comment:resolved:filter:changed',
+		ListOpened: 'comment:list:opened',
+	},
 };
 
 

package/src/core/flows/LayerAndViewportFlow.js

@@ -247,6 +247,7 @@ export function setupLayerAndViewportFlow(core) {
         const s = world?.scale?.x || 1;
         world.x = view.clientWidth / 2 - worldX * s;
         world.y = view.clientHeight / 2 - worldY * s;
+        core.eventBus.emit(Events.Viewport.Changed);
     });
 
     core.eventBus.on(Events.Tool.GroupDragStart, (data) => {

package/src/core/flows/ObjectLifecycleFlow.js

@@ -6,14 +6,24 @@ import {
     UpdateTextStyleCommand,
     UpdateNoteStyleCommand,
     UpdateFramePropertiesCommand,
+    UpdateConnectorCommand,
+    UpdateShapeStyleCommand,
 } from '../commands/index.js';
 
-const TEXT_STYLE_PROPS = ['fontFamily', 'fontSize', 'color', 'backgroundColor'];
+const TEXT_STYLE_PROPS = ['fontFamily', 'fontSize', 'color', 'backgroundColor', 'markdown', 'bold', 'italic', 'underline', 'strikethrough', 'textAlign', 'lineHeight', 'listType'];
+const TEXT_STYLE_PROPERTY_LEVEL = ['fontFamily', 'markdown', 'bold', 'italic', 'underline', 'strikethrough', 'textAlign', 'lineHeight', 'listType'];
 const TEXT_STYLE_DEFAULTS = {
     fontFamily: 'Roboto, Arial, sans-serif',
     fontSize: 18,
     color: '#000000',
     backgroundColor: 'transparent',
+    markdown: false,
+    bold: false,
+    italic: false,
+    underline: false,
+    strikethrough: false,
+    textAlign: 'left',
+    listType: 'none',
 };
 
 const NOTE_STYLE_PROPS = ['fontFamily', 'fontSize', 'textColor', 'backgroundColor'];
@@ -24,6 +34,64 @@ const NOTE_STYLE_DEFAULTS = {
     backgroundColor: 0xfff9c4,
 };
 
+/**
+ * Если updates содержит color или shape-properties — создаёт UpdateShapeStyleCommand и выполняет её.
+ * Защищена от рекурсии: при emit из команды (_fromCommand=true) object уже обновлён,
+ * oldValue === newValue для всех полей → hasChanges = false → return false.
+ * @returns {boolean} true, если команда создана и применена
+ */
+const SHAPE_PROP_KEYS = ['kind', 'cornerRadius', 'borderColor', 'borderWidth', 'borderStyle', 'borderOpacity'];
+
+function tryCreateShapeStyleCommand(core, object, objectId, updates) {
+    if (object.type !== 'shape') return false;
+
+    const hasColor = 'color' in updates;
+    const hasProps = updates.properties &&
+        Object.keys(updates.properties).some(k => SHAPE_PROP_KEYS.includes(k));
+
+    if (!hasColor && !hasProps) return false;
+
+    const newSnapshot = {};
+    const oldSnapshot = {};
+    let hasChanges = false;
+
+    if (hasColor) {
+        const oldColor = object.color;
+        const newColor = updates.color;
+        if (oldColor !== newColor) {
+            oldSnapshot.color = oldColor;
+            newSnapshot.color = newColor;
+            hasChanges = true;
+        }
+    }
+
+    if (hasProps) {
+        oldSnapshot.properties = {};
+        newSnapshot.properties = {};
+        for (const key of SHAPE_PROP_KEYS) {
+            if (key in updates.properties) {
+                const oldVal = object.properties?.[key];
+                const newVal = updates.properties[key];
+                if (oldVal !== newVal) {
+                    oldSnapshot.properties[key] = oldVal;
+                    newSnapshot.properties[key] = newVal;
+                    hasChanges = true;
+                }
+            }
+        }
+        if (Object.keys(newSnapshot.properties).length === 0) {
+            delete oldSnapshot.properties;
+            delete newSnapshot.properties;
+        }
+    }
+
+    if (!hasChanges) return false;
+
+    const command = new UpdateShapeStyleCommand(core, objectId, oldSnapshot, newSnapshot);
+    core.history.executeCommand(command);
+    return true;
+}
+
 /**
  * Если updates.properties содержит ровно одно свойство стиля записки — создаёт UpdateNoteStyleCommand.
  * @returns {boolean} true, если команда создана и применена
@@ -56,9 +124,12 @@ function tryCreateTextStyleCommand(core, object, objectId, updates) {
     let property = null;
     let newValue = null;
 
-    if (updates.properties?.fontFamily !== undefined && Object.keys(updates).length === 1) {
-        property = 'fontFamily';
-        newValue = updates.properties.fontFamily;
+    if (updates.properties && Object.keys(updates).length === 1) {
+        const propKeys = Object.keys(updates.properties);
+        if (propKeys.length === 1 && TEXT_STYLE_PROPERTY_LEVEL.includes(propKeys[0])) {
+            property = propKeys[0];
+            newValue = updates.properties[property];
+        }
     } else if (updates.fontSize !== undefined && !updates.properties && Object.keys(updates).length === 1) {
         property = 'fontSize';
         newValue = typeof updates.fontSize === 'string' ? parseInt(updates.fontSize, 10) : updates.fontSize;
@@ -72,8 +143,8 @@ function tryCreateTextStyleCommand(core, object, objectId, updates) {
 
     if (!property || !TEXT_STYLE_PROPS.includes(property)) return false;
 
-    const oldValue = property === 'fontFamily'
-        ? (object.properties?.fontFamily ?? TEXT_STYLE_DEFAULTS.fontFamily)
+    const oldValue = TEXT_STYLE_PROPERTY_LEVEL.includes(property)
+        ? (object.properties?.[property] ?? TEXT_STYLE_DEFAULTS[property])
         : (object[property] ?? object.properties?.[property] ?? TEXT_STYLE_DEFAULTS[property]);
 
     if (oldValue === newValue) return false;
@@ -83,6 +154,50 @@ function tryCreateTextStyleCommand(core, object, objectId, updates) {
     return true;
 }
 
+const CONNECTOR_STYLE_KEYS = ['stroke', 'width', 'dash', 'route', 'head'];
+
+/**
+ * Если updates.properties.style содержит поля стиля коннектора —
+ * создаёт UpdateConnectorCommand и выполняет её через историю.
+ * Также обрабатывает start/end (для swap-кнопки).
+ * @returns {boolean} true — команда применена, дальнейшая обработка не нужна
+ */
+function tryCreateConnectorStyleCommand(core, object, objectId, updates) {
+    if (object.type !== 'connector') return false;
+    if (!updates.properties) return false;
+
+    const { style, start, end } = updates.properties;
+
+    // Проверяем, что в updates.properties только style/start/end (и нет посторонних ключей)
+    const allowedKeys = new Set(['style', 'start', 'end', 'locked']);
+    const hasOtherKeys = Object.keys(updates.properties).some(k => !allowedKeys.has(k));
+    if (hasOtherKeys) return false;
+    // Должно быть хотя бы одно из: style, start, end
+    if (!style && start === undefined && end === undefined
+        && updates.properties.locked === undefined) return false;
+
+    const commandUpdates = {};
+    if (style !== undefined) commandUpdates.style = style;
+    if (start !== undefined) commandUpdates.start = start;
+    if (end   !== undefined) commandUpdates.end   = end;
+
+    // locked хранится в properties напрямую, не через UpdateConnectorCommand
+    if (updates.properties.locked !== undefined) {
+        if (!object.properties) object.properties = {};
+        object.properties.locked = updates.properties.locked;
+        if (Object.keys(commandUpdates).length === 0) {
+            core.state.markDirty();
+            return true;
+        }
+    }
+
+    if (Object.keys(commandUpdates).length === 0) return false;
+
+    const command = new UpdateConnectorCommand(core, objectId, commandUpdates);
+    core.history.executeCommand(command);
+    return true;
+}
+
 const FRAME_PROP_KEYS = ['title'];
 
 /**
@@ -131,7 +246,18 @@ export function setupObjectLifecycleFlow(core) {
 
     core.eventBus.on(Events.Tool.HitTest, (data) => {
         const result = core.pixi.hitTest(data.x, data.y);
-        data.result = result;
+        if (result.type !== 'object' && core.connectorLayer) {
+            const worldLayer = core.pixi.worldLayer;
+            const worldPoint = worldLayer.toLocal({ x: data.x, y: data.y });
+            const id = core.connectorLayer.hitTest(worldPoint);
+            if (id) {
+                data.result = { type: 'object', object: id, pixiObject: core.pixi.objects.get(id) };
+            } else {
+                data.result = result;
+            }
+        } else {
+            data.result = result;
+        }
     });
 
     core.eventBus.on(Events.Tool.GetObjectPosition, (data) => {
@@ -228,9 +354,15 @@ export function setupObjectLifecycleFlow(core) {
         const noteStyleChange = tryCreateNoteStyleCommand(core, object, objectId, updates);
         if (noteStyleChange) return;
 
+        const shapeStyleChange = tryCreateShapeStyleCommand(core, object, objectId, updates);
+        if (shapeStyleChange) return;
+
         const textStyleChange = tryCreateTextStyleCommand(core, object, objectId, updates);
         if (textStyleChange) return;
 
+        const connectorStyleChange = tryCreateConnectorStyleCommand(core, object, objectId, updates);
+        if (connectorStyleChange) return;
+
         const framePropsChange = tryCreateFramePropertiesCommand(core, object, objectId, updates);
         if (framePropsChange) return;
 
@@ -282,6 +414,22 @@ export function setupObjectLifecycleFlow(core) {
                     }
                 }
             }
+
+            if (object.type === 'drawing' && updates.properties && instance.setStyle) {
+                const styleUpdates = {};
+                if (updates.properties.strokeColor !== undefined) {
+                    styleUpdates.strokeColor = updates.properties.strokeColor;
+                }
+                if (updates.properties.strokeWidth !== undefined) {
+                    styleUpdates.strokeWidth = updates.properties.strokeWidth;
+                }
+                if (updates.properties.mode !== undefined) {
+                    styleUpdates.mode = updates.properties.mode;
+                }
+                if (Object.keys(styleUpdates).length > 0) {
+                    instance.setStyle(styleUpdates);
+                }
+            }
         }
 
         core.state.markDirty();

package/src/core/index.js

@@ -346,6 +346,17 @@ export class CoreMoodBoard {
     }
 
     createObject(type, position, properties = {}, extraData = {}) {
+        const validType = typeof type === 'string' && type.length > 0;
+        const validPos = position && typeof position === 'object'
+            && typeof position.x === 'number' && typeof position.y === 'number';
+        if (!validType || !validPos) {
+            console.error(
+                '[MoodBoard] createObject: неверные аргументы. Ожидается createObject(type, position, properties, extraData), ' +
+                'где type — непустая строка, position — { x: number, y: number }.',
+                { type, position }
+            );
+            return null;
+        }
         const exists = (id) => {
             const inState = (this.state.state.objects || []).some(o => o.id === id);
             const inPixi = this.pixi?.objects?.has ? this.pixi.objects.has(id) : false;
@@ -394,7 +405,10 @@ export class CoreMoodBoard {
                 properties = { ...(properties || {}), title: 'Фрейм 1' };
             }
         }
-        const snappedCreatePos = this.gridSnapResolver
+        // Рисованные объекты (drawing) должны оставаться ровно там, где их нарисовали —
+        // примагничивание bbox к сетке сдвигало бы готовую линию относительно превью.
+        const shouldSnap = this.gridSnapResolver && type !== 'drawing';
+        const snappedCreatePos = shouldSnap
             ? this.gridSnapResolver.snapWorldTopLeft(position, {
                 width: initialWidth,
                 height: initialHeight,
@@ -514,6 +528,19 @@ export class CoreMoodBoard {
             }
         } catch (_) { /* no-op */ }
 
+        const loadId = objectData?.id ?? '(без id)';
+        const validType = typeof objectData?.type === 'string' && objectData.type.length > 0;
+        const pos = objectData?.position;
+        const validPos = pos && typeof pos === 'object'
+            && typeof pos.x === 'number' && typeof pos.y === 'number';
+        if (!validType || !validPos) {
+            console.warn(
+                `[MoodBoard] Пропуск объекта при загрузке (${loadId}): невалидные type или position`,
+                objectData
+            );
+            return null;
+        }
+
         // Инициализируем флаг компенсации пивота для загруженных объектов.
         // В state координаты хранятся как левый-верх. PIXI позиционирует по центру (anchor/pivot по центру),
         // поэтому при создании нужно ДОБАВИТЬ половину ширины/высоты (т.е. pivotCompensated должен быть false),

package/src/grid/CrossGridZoomPhases.js

@@ -80,9 +80,9 @@ function sanitizeColor(value, fallback = 0xB0B0B0) {
     return Math.max(0, Math.min(0xFFFFFF, Math.round(n)));
 }
 
-const DEFAULT_CROSS_COLOR = 0xC2C2C2;       // 194,194,194
-const DEFAULT_MID_CROSS_COLOR = 0xA7A7A7;   // 167,167,167
-const DEFAULT_SMALL_CROSS_COLOR = 0xCDCDCD; // 205,205,205
+const DEFAULT_CROSS_COLOR = 0xCFD3DB;       // 207,211,219 — крупная сетка, чуть заметнее
+const DEFAULT_MID_CROSS_COLOR = 0xD6DAE1;   // 214,218,225 — средний участок
+const DEFAULT_SMALL_CROSS_COLOR = 0xDDE0E6; // 221,224,230 — плотная сетка, самый тихий
 const COLOR_BAND_HIGH = 'high';
 const COLOR_BAND_MID = 'mid';
 const COLOR_BAND_SMALL = 'small';

package/src/initNoBundler.js

@@ -59,7 +59,7 @@ export function injectCriticalStyles() {
             width: 100%;
             height: 100%;
             overflow: hidden;
-            background: #f7fbff;
+            background: #f0f6fc;
         }
         
         .moodboard-workspace__toolbar {

package/src/moodboard/DataManager.js

@@ -131,12 +131,40 @@ export class DataManager {
                 window.moodboardMindmapHtmlTextLayer.rebuildFromState();
                 window.moodboardMindmapHtmlTextLayer.updateAll();
             }
+            // Нормализуем геометрию майндмапа после загрузки. Устаревшие доски могли
+            // сохранить растянутые координаты (раньше зазор между узлами зависел от
+            // зума). Перелейаут с фиксированным мировым зазором приводит их к норме.
+            // board:loaded для этого не годится: он эмитится при инициализации ядра
+            // на пустой доске, до загрузки объектов и подписки слоя ручек.
+            this._relayoutMindmapAfterLoad();
             if (window.moodboardMindmapConnectionLayer) {
                 window.moodboardMindmapConnectionLayer.updateAll();
             }
         }, 100);
 
     }
+
+    /**
+     * Приводит геометрию майндмапа к норме после загрузки доски.
+     * Запускается дважды: сразу (по сохранённым размерам) и с задержкой —
+     * чтобы перехватить узлы после авто-фита ширины/высоты текста.
+     */
+    _relayoutMindmapAfterLoad() {
+        const run = () => {
+            const renderer = window.moodboardHtmlHandlesLayer?.domRenderer;
+            if (renderer?.relayoutAllMindmapCompounds) {
+                renderer.relayoutAllMindmapCompounds();
+            }
+        };
+        run();
+        setTimeout(run, 80);
+        setTimeout(() => {
+            run();
+            if (window.moodboardMindmapConnectionLayer) {
+                window.moodboardMindmapConnectionLayer.updateAll();
+            }
+        }, 250);
+    }
     
     /**
      * Загружает настройки viewport (позиция и зум)

package/src/moodboard/MoodBoard.js

@@ -42,8 +42,18 @@ export class MoodBoard {
             onSave: null,
             onLoad: null,
             onDestroy: null,
+            enableComments: false,
+            currentUser: null,
+            comments: null,
             ...options
         };
+
+        /** @type {{ applyRemote: (event: object) => void } | null} */
+        this.comments = null;
+        this.commentService = null;
+        this.commentPinLayer = null;
+        this.commentThreadPopover = null;
+        this.commentListPanel = null;
         
         this.data = data;
         
@@ -183,6 +193,23 @@ export class MoodBoard {
      * Очистка ресурсов
      */
     destroy() {
+        if (this.commentPinLayer) {
+            this.commentPinLayer.destroy();
+            this.commentPinLayer = null;
+        }
+        if (this.commentThreadPopover) {
+            this.commentThreadPopover.destroy();
+            this.commentThreadPopover = null;
+        }
+        if (this.commentListPanel) {
+            this.commentListPanel.destroy();
+            this.commentListPanel = null;
+        }
+        if (this.commentService) {
+            this.commentService.destroy();
+            this.commentService = null;
+        }
+        this.comments = null;
         destroyMoodBoard(this);
     }