@sequent-org/moodboard 1.2.1 → 1.2.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sequent-org/moodboard",
-  "version": "1.2.1",
+  "version": "1.2.3",
   "type": "module",
   "description": "Interactive moodboard",
   "main": "./src/index.js",

package/src/core/PixiEngine.js

@@ -189,7 +189,6 @@ export class PixiEngine {
         // Сохраняем позицию (центр) на случай, если инстанс пересоздаст геометрию
         const position = { x: pixiObject.x, y: pixiObject.y };
         
-        console.log(`🎨 Обновляем размер объекта ${objectId}, тип: ${objectType}`);
         
         // Для Graphics объектов (рамки, фигуры) нужно пересоздать геометрию
         // Делегируем изменение размера объекту, если есть инстанс с updateSize
@@ -209,7 +208,6 @@ export class PixiEngine {
         // Очищаем графику
         pixiObject.clear();
         
-        console.log(`🔄 Пересоздаем Graphics объект, тип: ${objectType}`);
         
         // Определяем что рисовать по типу объекта
         if (objectType === 'drawing') {

package/src/core/commands/DeleteObjectCommand.js

@@ -23,14 +23,6 @@ export class DeleteObjectCommand extends BaseCommand {
         
         // Для изображений убедимся, что есть src URL для восстановления
         if (this.objectData.type === 'image') {
-            console.log('🔧 DEBUG DeleteObjectCommand: исходные данные изображения:', {
-                id: this.objectData.id,
-                imageId: this.objectData.imageId,
-                src: this.objectData.src,
-                propertiesSrc: this.objectData.properties?.src,
-                hasBase64Src: !!(this.objectData.src && this.objectData.src.startsWith('data:')),
-                hasBase64Props: !!(this.objectData.properties?.src && this.objectData.properties.src.startsWith('data:'))
-            });
             
             if (this.objectData.imageId) {
                 const imageUrl = `/api/images/${this.objectData.imageId}/file`;
@@ -44,29 +36,16 @@ export class DeleteObjectCommand extends BaseCommand {
                 }
                 this.objectData.properties.src = imageUrl;
                 
-                console.log('🔧 DEBUG DeleteObjectCommand: обновленные данные изображения:', {
-                    id: this.objectData.id,
-                    imageId: this.objectData.imageId,
-                    src: this.objectData.src,
-                    propertiesSrc: this.objectData.properties?.src
-                });
             } else {
-                console.warn('🔧 DEBUG DeleteObjectCommand: у изображения нет imageId, оставляем как есть');
             }
         }
         
         // Для файлов сохраняем информацию для возможной очистки с сервера
         if (this.objectData.type === 'file') {
-            console.log('🔧 DEBUG DeleteObjectCommand: исходные данные файла:', {
-                id: this.objectData.id,
-                fileId: this.objectData.fileId,
-                fileName: this.objectData.properties?.fileName
-            });
             
             if (this.objectData.fileId) {
                 // Сохраняем fileId для удаления с сервера
                 this.fileIdToDelete = this.objectData.fileId;
-                console.log('🔧 DEBUG DeleteObjectCommand: файл будет удален с сервера:', this.fileIdToDelete);
             }
         }
         
@@ -97,25 +76,9 @@ export class DeleteObjectCommand extends BaseCommand {
     }
 
     undo() {
-        // DEBUG: Логируем состояние объекта при Undo
-        if (this.objectData.type === 'image') {
-            console.log('🔄 DEBUG Undo изображения:', {
-                id: this.objectData.id,
-                imageId: this.objectData.imageId,
-                src: this.objectData.src,
-                propertiesSrc: this.objectData.properties?.src,
-                hasBase64Src: !!(this.objectData.src && this.objectData.src.startsWith('data:')),
-                hasBase64Props: !!(this.objectData.properties?.src && this.objectData.properties.src.startsWith('data:'))
-            });
-        }
         
         // Специальная обработка для файловых объектов
         if (this.objectData.type === 'file' && this.fileIdToDelete) {
-            console.log('🔄 DEBUG Undo файла:', {
-                id: this.objectData.id,
-                fileId: this.objectData.fileId,
-                fileName: this.objectData.properties?.fileName
-            });
             
             // Файл был удален с сервера, создаем объект с предупреждением
             const restoredObjectData = { ...this.objectData };

package/src/core/commands/EditFileNameCommand.js

@@ -68,7 +68,6 @@ export class EditFileNameCommand extends BaseCommand {
             // Синхронизируем с сервером, если есть fileId
             if (objectData.fileId && this.coreMoodboard.fileUploadService) {
                 try {
-                    console.log('🔄 Синхронизируем название файла с сервером:', { fileId: objectData.fileId, fileName });
                     await this.coreMoodboard.fileUploadService.updateFileMetadata(objectData.fileId, { 
                         fileName: fileName 
                     });

package/src/core/commands/ResizeObjectCommand.js

@@ -38,10 +38,6 @@ export class ResizeObjectCommand extends BaseCommand {
         
 
         
-        // Отладка ресайза
-        if (position && object) {
-            console.log(`🔧 Ресайз объекта ${this.objectId}: newSize(${size.width}, ${size.height}), newPosition(${position.x}, ${position.y})`);
-        }
         
         // Обновляем размер в PIXI с указанием типа
         this.coreMoodboard.pixi.updateObjectSize(this.objectId, size, objectType);
@@ -57,14 +53,7 @@ export class ResizeObjectCommand extends BaseCommand {
                 pixiObject.y = position.y + halfH;
                 object.position.x = position.x;
                 object.position.y = position.y;
-                console.log(`🎯 После ресайза: center(${pixiObject.x}, ${pixiObject.y}), leftTop(${position.x}, ${position.y})`);
                 
-                // Проверим, где находятся границы объекта
-                const leftEdge = pixiObject.x - size.width / 2;
-                const rightEdge = pixiObject.x + size.width / 2;
-                const topEdge = pixiObject.y - size.height / 2;
-                const bottomEdge = pixiObject.y + size.height / 2;
-                console.log(`📏 Границы объекта: left=${leftEdge}, right=${rightEdge}, top=${topEdge}, bottom=${bottomEdge}`);
 
             }
         }
@@ -103,7 +92,6 @@ export class ResizeObjectCommand extends BaseCommand {
         
         // Если этот объект выделен, обновляем ручки
         if (activeTool.selectedObjects && activeTool.selectedObjects.has(this.objectId)) {
-            console.log(`🔄 Обновляем ручки для объекта ${this.objectId} после Undo/Redo`);
             activeTool.updateResizeHandles();
         }
     }

package/src/core/commands/RotateObjectCommand.js

@@ -22,7 +22,6 @@ export class RotateObjectCommand extends BaseCommand {
             objectId: this.objectId,
             angle: this.newAngle
         });
-        console.log(`🔄 Поворачиваем объект ${this.objectId} на ${this.newAngle}°`);
     }
 
     undo() {

package/src/core/index.js

@@ -1402,7 +1402,6 @@ export class CoreMoodBoard {
         this.eventBus.on(Events.Object.TransformUpdated, (data) => {
             // Обновляем ручки если объект выделен
             if (this.selectTool && this.selectTool.selection && this.selectTool.selection.has(data.objectId)) {
-                console.log(`🔄 Core: Объект ${data.objectId} изменен через команду, обновляем ручки SelectTool`);
                 this.selectTool.updateResizeHandles();
             }
         });
@@ -1567,7 +1566,6 @@ export class CoreMoodBoard {
                     
                     // Сохраняем изменения
                     this.state.markDirty();
-                    console.log(`✅ Состояние объекта ${objectId} обновлено`);
                 } else {
                     console.warn(`❌ Объект ${objectId} не найден в состоянии`);
                 }
@@ -1590,7 +1588,6 @@ export class CoreMoodBoard {
         this.eventBus.on('file:metadata:updated', (data) => {
             const { objectId, fileId, metadata } = data;
             if (objectId && metadata) {
-                console.log(`🔄 Обновляем метаданные файла ${objectId} с сервера:`, metadata);
                 
                 // Обновляем объект в состоянии
                 const objects = this.state.getObjects();
@@ -1619,7 +1616,6 @@ export class CoreMoodBoard {
                         
                         // Обновляем состояние
                         this.state.markDirty();
-                        console.log(`✅ Метаданные файла ${objectId} синхронизированы с сервером`);
                     }
                 }
             }
@@ -1848,7 +1844,6 @@ export class CoreMoodBoard {
             try {
                 const result = await this.cleanupUnusedImages();
                 if (result.deletedCount > 0) {
-                    console.log(`✅ Автоматически очищено ${result.deletedCount} неиспользуемых изображений`);
                 }
             } catch (error) {
                 // Не прерываем выполнение при ошибке cleanup
@@ -1923,7 +1918,6 @@ export class CoreMoodBoard {
         if (object) {
             object.rotation = angle;
             this.state.markDirty();
-            console.log(`🔄 Угол объекта ${objectId} обновлен: ${angle}°`);
         }
     }
 

package/src/initNoBundler.js

@@ -13,7 +13,6 @@ import { EmojiLoaderNoBundler } from './utils/emojiLoaderNoBundler.js';
  * @returns {Promise<MoodBoard>} готовый экземпляр MoodBoard
  */
 export async function initMoodBoardNoBundler(container, options = {}, basePath = '') {
-    console.log('🚀 Инициализация MoodBoard без bundler...');
     
     // 1. Загружаем стили
     const styleLoader = new StyleLoader();
@@ -31,13 +30,13 @@ export async function initMoodBoardNoBundler(container, options = {}, basePath =
         ...options,
         emojiLoader: emojiLoader,
         emojiGroups: emojiGroups,
+        emojiBasePath: basePath ? `${basePath}src/assets/emodji/` : null,
         noBundler: true
     };
     
     // 5. Создаем MoodBoard
     const moodboard = new MoodBoard(container, enhancedOptions);
     
-    console.log('✅ MoodBoard инициализирован без bundler');
     
     return moodboard;
 }
@@ -138,7 +137,8 @@ export function quickInitMoodBoard(container, options = {}, basePath = '') {
     const moodboard = new MoodBoard(container, {
         ...options,
         noBundler: true,
-        skipEmojiLoader: true // Пропускаем автозагрузку эмоджи
+        skipEmojiLoader: true, // Пропускаем автозагрузку эмоджи
+        emojiBasePath: basePath ? `${basePath}src/assets/emodji/` : null
     });
     
     return moodboard;

package/src/moodboard/MoodBoard.js

@@ -124,7 +124,6 @@ export class MoodBoard {
             // Загружаем данные (сначала пробуем загрузить с сервера, потом дефолтные)
             await this.loadExistingBoard();
             
-            console.log('MoodBoard initialized');
         } catch (error) {
             console.error('MoodBoard init failed:', error);
             throw error;
@@ -159,7 +158,10 @@ export class MoodBoard {
         this.toolbar = new Toolbar(
             this.toolbarContainer, 
             this.coreMoodboard.eventBus,
-            this.options.theme
+            this.options.theme,
+            {
+                emojiBasePath: this.options.emojiBasePath || null
+            }
         );
         
         // Добавляем функцию для отладки иконок в window
@@ -350,8 +352,6 @@ export class MoodBoard {
             
         } catch (error) {
             console.warn('⚠️ Ошибка загрузки доски, создаем новую:', error.message);
-            console.debug('ApiClient доступен:', !!this.coreMoodboard.apiClient);
-            console.debug('Метод restoreObjectUrls доступен:', !!(this.coreMoodboard.apiClient && typeof this.coreMoodboard.apiClient.restoreObjectUrls === 'function'));
             // Если загрузка не удалась, используем дефолтные данные
             this.dataManager.loadData(this.data);
         }
@@ -435,6 +435,5 @@ export class MoodBoard {
         // Очищаем ссылку на контейнер
         this.container = null;
         
-        console.log('MoodBoard успешно уничтожен');
     }
 }

package/src/tools/AlignmentGuides.js

@@ -36,13 +36,11 @@ export class AlignmentGuides {
         
         this._attachEvents();
         
-        console.log('AlignmentGuides: Инициализированы направляющие линии выравнивания');
     }
 
     _attachEvents() {
         // Одиночное перетаскивание
         this.eventBus.on(Events.Tool.DragStart, (data) => {
-            console.log('AlignmentGuides: Начало перетаскивания объекта:', data.object);
             this.isDragging = true;
             this.currentDragObject = data.object;
             this.currentDragObjects = [];
@@ -122,7 +120,6 @@ export class AlignmentGuides {
         
         // Отображаем найденные направляющие
         if (guides.length > 0) {
-            console.log('AlignmentGuides: Найдено направляющих:', guides.length);
             this._showGuides(guides);
         }
     }

package/src/tools/ResizeHandles.js

@@ -96,7 +96,6 @@ export class ResizeHandles {
             this.container.y = objectCenterY;
             this.container.pivot.set(objectPivotX, objectPivotY);
             
-            console.log(`🔄 Поворот ручек: ${(this.targetObject.rotation * 180 / Math.PI).toFixed(1)}°, центр: (${objectCenterX}, ${objectCenterY}), pivot: (${objectPivotX}, ${objectPivotY})`);
             
             // Используем локальные границы для создания ручек
             this.workingBounds = {

package/src/tools/object-tools/PlacementTool.js

@@ -105,7 +105,11 @@ export class PlacementTool extends BaseTool {
             this.eventBus.on(Events.Place.FileSelected, (fileData) => {
                 this.selectedFile = fileData;
                 this.selectedImage = null;
-                this.showFileGhost();
+                
+                // Если PlacementTool уже активен - показываем призрак сразу
+                if (this.world) {
+                    this.showFileGhost();
+                }
             });
 
             // Обработка отмены выбора файла
@@ -562,9 +566,10 @@ export class PlacementTool extends BaseTool {
             const worldPoint = this._toWorld(cursorX, cursorY);
             this.updateGhostPosition(worldPoint.x, worldPoint.y);
         }
-        // Попробуем дождаться загрузки веб-шрифта Caveat до отрисовки
-        const pendingFont = (this.pending.properties?.fontFamily) || 'Caveat, Arial, cursive';
-        const primaryFont = String(pendingFont).split(',')[0].trim().replace(/^['"]|['"]$/g, '') || 'Caveat';
+        // Попробуем дождаться загрузки веб-шрифта Caveat до отрисовки  
+        // Для файлов используем selectedFile, а не pending
+        const fileFont = (this.selectedFile.properties?.fontFamily) || 'Caveat, Arial, cursive';
+        const primaryFont = String(fileFont).split(',')[0].trim().replace(/^['"]|['"]$/g, '') || 'Caveat';
         
         // Размеры
         const width = this.selectedFile.properties.width || 120;
@@ -722,9 +727,10 @@ export class PlacementTool extends BaseTool {
         this.ghostContainer = new PIXI.Container();
         this.ghostContainer.alpha = 0.6; // Полупрозрачность
         
-        // Размеры призрака
-        const maxWidth = this.selectedImage.properties.width || 300;
-        const maxHeight = this.selectedImage.properties.height || 200;
+        // Размеры призрака - используем размеры из pending/selected, если есть
+        const isEmojiIcon = this.selectedImage.properties?.isEmojiIcon;
+        const maxWidth = this.selectedImage.properties.width || (isEmojiIcon ? 64 : 300);
+        const maxHeight = this.selectedImage.properties.height || (isEmojiIcon ? 64 : 200);
         
         try {
             // Создаем превью изображения
@@ -816,8 +822,10 @@ export class PlacementTool extends BaseTool {
         this.ghostContainer = new PIXI.Container();
         this.ghostContainer.alpha = 0.6;
 
-        const maxWidth = this.pending.size?.width || this.pending.properties?.width || 56;
-        const maxHeight = this.pending.size?.height || this.pending.properties?.height || 56;
+        // Для эмоджи используем точные размеры из pending для согласованности
+        const isEmojiIcon = this.pending.properties?.isEmojiIcon;
+        const maxWidth = this.pending.size?.width || this.pending.properties?.width || (isEmojiIcon ? 64 : 56);
+        const maxHeight = this.pending.size?.height || this.pending.properties?.height || (isEmojiIcon ? 64 : 56);
 
         try {
             const texture = await PIXI.Texture.fromURL(src);
@@ -853,15 +861,23 @@ export class PlacementTool extends BaseTool {
 
         this.world.addChild(this.ghostContainer);
 
-        // Кастомный курсор: мини-превью иконки рядом с курсором
-        try {
-            if (this.app && this.app.view && src) {
-                const cursorSize = 24;
-                const url = encodeURI(src);
-                // Используем CSS cursor с изображением, если поддерживается
-                this.app.view.style.cursor = `url(${url}) ${Math.floor(cursorSize/2)} ${Math.floor(cursorSize/2)}, default`;
+        // Для эмоджи не используем кастомный курсор, чтобы избежать дублирования призраков
+        if (!isEmojiIcon) {
+            // Кастомный курсор только для обычных изображений
+            try {
+                if (this.app && this.app.view && src) {
+                    const cursorSize = 24;
+                    const url = encodeURI(src);
+                    // Используем CSS cursor с изображением, если поддерживается
+                    this.app.view.style.cursor = `url(${url}) ${Math.floor(cursorSize/2)} ${Math.floor(cursorSize/2)}, default`;
+                }
+            } catch (_) {}
+        } else {
+            // Для эмоджи используем стандартный курсор
+            if (this.app && this.app.view) {
+                this.app.view.style.cursor = 'crosshair';
             }
-        } catch (_) {}
+        }
     }
 
     /**

package/src/tools/object-tools/SelectTool.js

@@ -136,7 +136,6 @@ export class SelectTool extends BaseTool {
             this.eventBus.on(Events.Object.Deleted, (data) => {
                 const objectId = data?.objectId || data;
                 if (objectId && this.selection.has(objectId)) {
-                    console.log(`🗑️ SelectTool: Объект ${objectId} удален, убираем из выделения`);
                     this.removeFromSelection(objectId);
                     
                     // Если выделение стало пустым, скрываем ручки
@@ -164,7 +163,6 @@ export class SelectTool extends BaseTool {
      */
     activate(app) {
         super.activate();
-        console.log('🔧 SelectTool активирован, app:', !!app);
 		// Сохраняем ссылку на PIXI app для оверлеев (рамка выделения)
 		this.app = app;
         
@@ -224,7 +222,6 @@ export class SelectTool extends BaseTool {
         } else if (!app) {
             console.log('❌ PIXI app не передан в activate');
         } else {
-            console.log('ℹ️ ResizeHandles уже созданы');
         }
     }
 
@@ -272,7 +269,6 @@ export class SelectTool extends BaseTool {
         
         // Если активен текстовый редактор, закрываем его при клике вне
         if (this.textEditor.active) {
-            console.log('🔧 SelectTool: closing text editor on mouse down, objectType:', this.textEditor.objectType, 'objectId:', this.textEditor.objectId);
             if (this.textEditor.objectType === 'file') {
                 this._closeFileNameEditor(true);
             } else {
@@ -529,7 +525,6 @@ export class SelectTool extends BaseTool {
     onKeyDown(event) {
         // Проверяем, не активен ли текстовый редактор (редактирование названия файла или текста)
         if (this.textEditor && this.textEditor.active) {
-            console.log('🔒 SelectTool: Текстовый редактор активен, пропускаем обработку клавиш');
             return; // Не обрабатываем клавиши во время редактирования
         }
         
@@ -793,7 +788,6 @@ export class SelectTool extends BaseTool {
      * Начало изменения размера
      */
     startResize(handle, objectId) {
-        console.log(`🔧 Начинаем resize: ручка ${handle}, объект ${objectId}`);
         // Групповой resize
         if (objectId === this.groupId && this.selection.size() > 1) {
             this.isGroupResizing = true;
@@ -1263,7 +1257,6 @@ export class SelectTool extends BaseTool {
      */
     
         addToSelection(object) {
-        console.log(`➕ Добавляем в выделение: ${object}`);
         this.selection.add(object);
         this.emit(Events.Tool.SelectionAdd, { object });
         this.updateResizeHandles();
@@ -2061,13 +2054,11 @@ export class SelectTool extends BaseTool {
         // Завершение
         const isNewCreation = !!create;
         const finalize = (commit) => {
-            console.log('🔧 SelectTool: finalize called with commit:', commit, 'objectId:', objectId, 'objectType:', this.textEditor.objectType);
             const value = textarea.value.trim();
             const commitValue = commit && value.length > 0;
             
             // Сохраняем objectType ДО сброса this.textEditor
             const currentObjectType = this.textEditor.objectType;
-            console.log('🔧 SelectTool: finalize - saved objectType:', currentObjectType);
             
             // Показываем статичный текст только если не отменяем создание нового пустого
             if (objectId && (commitValue || !isNewCreation)) {
@@ -2140,11 +2131,9 @@ export class SelectTool extends BaseTool {
                 if (isNewCreation && objectId) {
                     this.eventBus.emit(Events.Tool.ObjectsDelete, { objects: [objectId] });
                 }
-                console.log('🔧 SelectTool: finalize - no commit, returning');
                 return;
             }
             if (objectId == null) {
-                console.log('🔧 SelectTool: finalize - creating new object');
                 // Создаем объект с правильным типом
                 const objectType = currentObjectType || 'text';
                 // Конвертируем размеры редактора (px) в мировые единицы
@@ -2163,7 +2152,6 @@ export class SelectTool extends BaseTool {
             } else {
                 // Обновление существующего: используем команду обновления содержимого
                 if (currentObjectType === 'note') {
-                    console.log('🔧 SelectTool: updating note content via UpdateObjectContent');
                     // Для записок обновляем содержимое через PixiEngine
                     this.eventBus.emit(Events.Tool.UpdateObjectContent, { 
                         objectId: objectId, 
@@ -2179,7 +2167,6 @@ export class SelectTool extends BaseTool {
                     });
                 } else {
                     // Для обычного текста тоже используем обновление содержимого
-                    console.log('🔧 SelectTool: finalize - updating text content via UpdateObjectContent');
                     this.eventBus.emit(Events.Tool.UpdateObjectContent, { 
                         objectId: objectId, 
                         content: value 
@@ -2429,7 +2416,6 @@ export class SelectTool extends BaseTool {
      * Закрывает редактор названия файла
      */
     _closeFileNameEditor(commit) {
-        console.log('🔧 SelectTool: _closeFileNameEditor called with commit:', commit);
         
         // Проверяем, что редактор существует и не закрыт
         if (!this.textEditor || !this.textEditor.textarea || this.textEditor.closing) {
@@ -2444,7 +2430,6 @@ export class SelectTool extends BaseTool {
         const commitValue = commit && value.length > 0;
         const objectId = this.textEditor.objectId;
         
-        console.log('🔧 SelectTool: _closeFileNameEditor - objectId:', objectId, 'commitValue:', commitValue, 'newName:', value);
         
         // Убираем wrapper из DOM
         if (this.textEditor.wrapper && this.textEditor.wrapper.parentNode) {
@@ -2464,7 +2449,6 @@ export class SelectTool extends BaseTool {
                 
                 // Применяем изменения если нужно
                 if (commitValue && value !== this.textEditor.properties.fileName) {
-                    console.log('🔧 Применяем новое название файла:', value);
                     
                     // Создаем команду изменения названия файла
                     const oldName = this.textEditor.properties.fileName || 'Untitled';
@@ -2492,7 +2476,6 @@ export class SelectTool extends BaseTool {
     }
 
     _closeTextEditor(commit) {
-        console.log('🔧 SelectTool: _closeTextEditor called with commit:', commit);
         const textarea = this.textEditor.textarea;
         if (!textarea) return;
         const value = textarea.value.trim();
@@ -2502,7 +2485,6 @@ export class SelectTool extends BaseTool {
         const position = this.textEditor.position;
         const properties = this.textEditor.properties;
         
-        console.log('🔧 SelectTool: _closeTextEditor - objectType:', objectType, 'objectId:', objectId, 'commitValue:', commitValue);
         
         // Показываем статичный текст после завершения редактирования для всех типов объектов
         if (objectId) {
@@ -2524,7 +2506,6 @@ export class SelectTool extends BaseTool {
         if (!commitValue) return;
         if (objectId == null) {
             // Создаём новый объект через ToolbarAction
-            console.log('🔧 SelectTool: creating new object via ToolbarAction, type:', objectType);
             this.eventBus.emit(Events.UI.ToolbarAction, {
                 type: objectType,
                 id: objectType,

package/src/ui/FilePropertiesPanel.js

@@ -74,7 +74,6 @@ export class FilePropertiesPanel {
         const pixi = this.core?.pixi?.objects?.get ? this.core.pixi.objects.get(id) : null;
         const isFile = !!(pixi && pixi._mb && pixi._mb.type === 'file');
         
-        console.log('📎 FilePropertiesPanel: updateFromSelection - id=', id, 'isFile=', isFile);
         
         if (isFile) {
             this.showFor(id);
@@ -84,7 +83,6 @@ export class FilePropertiesPanel {
     }
 
     showFor(objectId) {
-        console.log('📎 FilePropertiesPanel: Showing panel for objectId:', objectId);
         this.currentId = objectId;
         if (this.panel) {
             this.panel.style.display = 'flex';
@@ -223,7 +221,6 @@ export class FilePropertiesPanel {
 
             // Скачиваем файл
             await this.core.fileUploadService.downloadFile(fileId, fileName);
-            console.log('✅ Файл скачан:', fileName);
 
             // Восстанавливаем кнопку
             setTimeout(() => {

package/src/ui/FramePropertiesPanel.js

@@ -73,7 +73,6 @@ export class FramePropertiesPanel {
         const pixi = this.core?.pixi?.objects?.get ? this.core.pixi.objects.get(id) : null;
         const isFrame = !!(pixi && pixi._mb && pixi._mb.type === 'frame');
         
-        console.log('🖼️ FramePropertiesPanel: updateFromSelection - id=', id, 'isFrame=', isFrame);
         
         if (isFrame) {
             this.showFor(id);
@@ -83,7 +82,6 @@ export class FramePropertiesPanel {
     }
 
     showFor(objectId) {
-        console.log('🖼️ FramePropertiesPanel: Showing panel for objectId:', objectId);
         this.currentId = objectId;
         if (this.panel) {
             this.panel.style.display = 'flex';
@@ -164,18 +162,10 @@ export class FramePropertiesPanel {
             panelY = y + height + 40;
         }
 
-        console.log('🖼️ FramePropertiesPanel: Positioning above frame:', {
-            frameX: x, frameY: y, frameWidth: width, frameHeight: height,
-            panelX, panelY
-        });
 
         this.panel.style.left = `${Math.round(panelX)}px`;
         this.panel.style.top = `${Math.round(panelY)}px`;
         
-        console.log('🖼️ FramePropertiesPanel: Panel CSS applied:', {
-            left: this.panel.style.left,
-            top: this.panel.style.top
-        });
     }
 
     _createFrameControls(panel) {
@@ -302,7 +292,6 @@ export class FramePropertiesPanel {
     _changeFrameTitle(newTitle) {
         if (!this.currentId) return;
 
-        console.log('🖼️ FramePropertiesPanel: Changing frame title to:', newTitle);
 
         // Обновляем свойства объекта
         this.eventBus.emit(Events.Object.StateChanged, {
@@ -455,7 +444,6 @@ export class FramePropertiesPanel {
     _selectColor(color) {
         if (!this.currentId) return;
 
-        console.log('🖼️ FramePropertiesPanel: Selecting color:', color);
 
         // Обновляем визуальное отображение кнопки
         this.colorButton.style.backgroundColor = color.hex;

package/src/ui/HtmlHandlesLayer.js

@@ -61,7 +61,6 @@ export class HtmlHandlesLayer {
             if (this.core?.selectTool && data.objectId) {
                 const isSelected = this.core.selectTool.selectedObjects.has(data.objectId);
                 if (isSelected) {
-                    console.log(`🔄 HtmlHandlesLayer: Объект ${data.objectId} изменен через команду, обновляем рамку`);
                     this.update();
                 }
             }

package/src/ui/NotePropertiesPanel.js

@@ -73,7 +73,6 @@ export class NotePropertiesPanel {
         const pixi = this.core?.pixi?.objects?.get ? this.core.pixi.objects.get(id) : null;
         const isNote = !!(pixi && pixi._mb && pixi._mb.type === 'note');
         
-        console.log('📝 NotePropertiesPanel: updateFromSelection - id=', id, 'isNote=', isNote);
         
         if (isNote) {
             this.showFor(id);
@@ -83,7 +82,6 @@ export class NotePropertiesPanel {
     }
 
     showFor(objectId) {
-        console.log('📝 NotePropertiesPanel: Showing panel for objectId:', objectId);
         this.currentId = objectId;
         if (this.panel) {
             this.panel.style.display = 'flex';
@@ -471,7 +469,6 @@ export class NotePropertiesPanel {
     _selectColor(color, propertyName) {
         if (!this.currentId) return;
 
-        console.log(`📝 NotePropertiesPanel: Selecting ${propertyName}:`, color);
 
         // Обновляем соответствующую кнопку
         if (propertyName === 'backgroundColor' && this.backgroundColorButton) {
@@ -497,7 +494,6 @@ export class NotePropertiesPanel {
     _changeFontSize(fontSize) {
         if (!this.currentId) return;
 
-        console.log('📝 NotePropertiesPanel: Changing font size to:', fontSize);
 
         // Отправляем событие изменения размера шрифта
         this.eventBus.emit(Events.Object.StateChanged, {
@@ -509,7 +505,6 @@ export class NotePropertiesPanel {
     _changeFontFamily(fontFamily) {
         if (!this.currentId) return;
 
-        console.log('📝 NotePropertiesPanel: Changing font family to:', fontFamily);
 
         this.eventBus.emit(Events.Object.StateChanged, {
             objectId: this.currentId,

package/src/ui/TextPropertiesPanel.js

@@ -681,7 +681,6 @@ export class TextPropertiesPanel {
     _changeFontFamily(fontFamily) {
         if (!this.currentId) return;
 
-        console.log('🔧 TextPropertiesPanel: Changing font family to:', fontFamily);
 
         // Обновляем свойства объекта через StateManager (в properties)
         this.eventBus.emit(Events.Object.StateChanged, {
@@ -698,7 +697,6 @@ export class TextPropertiesPanel {
     _changeFontSize(fontSize) {
         if (!this.currentId) return;
 
-        console.log('🔧 TextPropertiesPanel: Changing font size to:', fontSize);
 
         // Обновляем свойства объекта через StateManager
         this.eventBus.emit(Events.Object.StateChanged, {
@@ -715,7 +713,6 @@ export class TextPropertiesPanel {
     _changeTextColor(color) {
         if (!this.currentId) return;
 
-        console.log('🔧 TextPropertiesPanel: Changing text color to:', color);
 
         // Обновляем свойства объекта через StateManager
         this.eventBus.emit(Events.Object.StateChanged, {
@@ -732,7 +729,6 @@ export class TextPropertiesPanel {
     _changeBackgroundColor(backgroundColor) {
         if (!this.currentId) return;
 
-        console.log('🔧 TextPropertiesPanel: Changing background color to:', backgroundColor);
 
         // Обновляем свойства объекта через StateManager
         this.eventBus.emit(Events.Object.StateChanged, {

package/src/ui/Toolbar.js

@@ -5,11 +5,14 @@ import { Events } from '../core/events/Events.js';
 import { IconLoader } from '../utils/iconLoader.js';
 
 export class Toolbar {
-    constructor(container, eventBus, theme = 'light') {
+    constructor(container, eventBus, theme = 'light', options = {}) {
         this.container = container;
         this.eventBus = eventBus;
         this.theme = theme;
         
+        // Базовый путь для ассетов (эмоджи и другие ресурсы)
+        this.emojiBasePath = options.emojiBasePath || null;
+        
         // Инициализируем IconLoader
         this.iconLoader = new IconLoader();
         
@@ -575,11 +578,9 @@ export class Toolbar {
     setActiveToolbarButton(toolName) {
         if (!this.element) return;
         
-        console.log('🎯 Toolbar: Установка активной кнопки для инструмента:', toolName, 'placeSelectedButtonId:', this.placeSelectedButtonId);
         
         // Сбрасываем активные классы
         this.element.querySelectorAll('.moodboard-toolbar__button--active').forEach(el => {
-            console.log('🔄 Deactivating button:', el.dataset.toolId);
             el.classList.remove('moodboard-toolbar__button--active');
         });
         
@@ -611,16 +612,13 @@ export class Toolbar {
         }
         
         if (!btnId) {
-            console.warn('⚠️ Toolbar: Не найден btnId для инструмента:', toolName);
             return;
         }
         
         const btn = this.element.querySelector(`.moodboard-toolbar__button--${btnId}`);
         if (btn) {
             btn.classList.add('moodboard-toolbar__button--active');
-            console.log('✅ Toolbar: Активирована кнопка:', btnId);
         } else {
-            console.warn('⚠️ Toolbar: Не найдена кнопка с селектором:', `.moodboard-toolbar__button--${btnId}`);
         }
     }
     
@@ -930,7 +928,6 @@ export class Toolbar {
             });
         } else {
             // Режим без bundler - используем статичный список
-            console.log('🎭 Toolbar: Режим без bundler, используем статичные эмоджи');
             groups = this.getFallbackEmojiGroups();
         }
 
@@ -966,9 +963,13 @@ export class Toolbar {
 
                 // Перетаскивание: начинаем только если был реальный drag (движение > 4px)
                 btn.addEventListener('mousedown', (e) => {
+                    // Блокируем одновременную обработку
+                    if (btn.__clickProcessing || btn.__dragActive) return;
+                    
                     const startX = e.clientX;
                     const startY = e.clientY;
                     let startedDrag = false;
+                    
                     const onMove = (ev) => {
                         if (startedDrag) return;
                         const dx = Math.abs(ev.clientX - startX);
@@ -976,6 +977,10 @@ export class Toolbar {
                         if (dx > 4 || dy > 4) {
                             startedDrag = true;
                             btn.__dragActive = true;
+                            
+                            // Блокируем click handler
+                            btn.__clickProcessing = true;
+                            
                             const target = 64;
                             const targetW = target;
                             const targetH = target;
@@ -994,8 +999,11 @@ export class Toolbar {
                     };
                     const onUp = () => {
                         cleanup();
-                        // Снимем флаг сразу после клика, чтобы click мог отфильтроваться
-                        setTimeout(() => { btn.__dragActive = false; }, 0);
+                        // Снимаем флаги с задержкой
+                        setTimeout(() => { 
+                            btn.__dragActive = false;
+                            btn.__clickProcessing = false;
+                        }, 50);
                     };
                     const cleanup = () => {
                         document.removeEventListener('mousemove', onMove);
@@ -1005,8 +1013,13 @@ export class Toolbar {
                     document.addEventListener('mouseup', onUp, { once: true });
                 });
 
-                btn.addEventListener('click', () => {
-                    if (btn.__dragActive) return; // не обрабатываем клик после drag
+                btn.addEventListener('click', (e) => {
+                    // Блокируем обработку клика если был drag или если уже обрабатывается
+                    if (btn.__dragActive || btn.__clickProcessing) return;
+                    
+                    btn.__clickProcessing = true;
+                    setTimeout(() => { btn.__clickProcessing = false; }, 100);
+                    
                     this.animateButton(btn);
                     const target = 64; // кратно 128 для лучшей четкости при даунскейле
                     const targetW = target;
@@ -1079,22 +1092,43 @@ export class Toolbar {
      * Определяет базовый путь для эмоджи в зависимости от режима
      */
     getEmojiBasePath() {
-        // Проверяем, есть ли глобальная настройка базового пути
+        // 1. Приоритет: опция basePath из конструктора
+        if (this.emojiBasePath) {
+            return this.emojiBasePath.endsWith('/') ? this.emojiBasePath : this.emojiBasePath + '/';
+        }
+
+        // 2. Глобальная настройка (абсолютный URL)
         if (window.MOODBOARD_BASE_PATH) {
-            return `${window.MOODBOARD_BASE_PATH}src/assets/emodji/`;
+            const basePath = window.MOODBOARD_BASE_PATH.endsWith('/') ? window.MOODBOARD_BASE_PATH : window.MOODBOARD_BASE_PATH + '/';
+            return `${basePath}src/assets/emodji/`;
+        }
+        
+        // 3. Вычисление от URL текущего модуля (import.meta.url)
+        try {
+            // Используем import.meta.url для получения абсолютного пути к ассетам
+            const currentModuleUrl = import.meta.url;
+            // От текущего модуля (ui/Toolbar.js) поднимаемся к корню пакета и идем к assets
+            const emojiUrl = new URL('../assets/emodji/', currentModuleUrl).href;
+            return emojiUrl;
+        } catch (error) {
+            console.warn('⚠️ Не удалось определить путь через import.meta.url:', error);
         }
         
-        // Попытка определить автоматически
-        const scripts = document.querySelectorAll('script[src]');
-        for (const script of scripts) {
-            if (script.src.includes('moodboard') || script.src.includes('node_modules')) {
-                const baseUrl = new URL(script.src).origin;
-                return `${baseUrl}/node_modules/moodboard-futurello/src/assets/emodji/`;
+        // 4. Fallback: поиск script тега для определения базового URL
+        try {
+            const currentScript = document.currentScript;
+            if (currentScript && currentScript.src) {
+                // Пытаемся определить от текущего скрипта
+                const scriptUrl = new URL(currentScript.src);
+                const baseUrl = new URL('../assets/emodji/', scriptUrl).href;
+                return baseUrl;
             }
+        } catch (error) {
+            console.warn('⚠️ Не удалось определить путь через currentScript:', error);
         }
         
-        // Fallback: относительный путь
-        return './src/assets/emodji/';
+        // 5. Последний fallback: абсолютный путь от корня домена
+        return '/src/assets/emodji/';
     }
 
     toggleEmojiPopup(anchorButton) {
@@ -1357,7 +1391,6 @@ export class Toolbar {
      * @param {string} iconName - имя иконки
      */
     async reloadToolbarIcon(iconName) {
-        console.log(`🔄 Начинаем обновление иконки ${iconName} в тулбаре...`);
         try {
             // Перезагружаем иконку
             const newSvgContent = await this.iconLoader.reloadIcon(iconName);
@@ -1374,9 +1407,7 @@ export class Toolbar {
                 
                 // Добавляем новый SVG
                 this.createSvgIcon(button, iconName);
-                console.log(`✅ Иконка ${iconName} обновлена в интерфейсе!`);
             } else {
-                console.warn(`⚠️ Кнопка с иконкой ${iconName} не найдена`);
             }
         } catch (error) {
             console.error(`❌ Ошибка обновления иконки ${iconName}:`, error);

package/src/ui/Topbar.js

@@ -64,9 +64,6 @@ export class Topbar {
         this.element = document.createElement('div');
         this.element.className = `moodboard-topbar moodboard-topbar--${this.theme}`;
         
-        console.log('🔍 Topbar: создаю верхнюю панель');
-        console.log('🔍 Topbar: this.icons содержит:', this.icons);
-        console.log('🔍 Topbar: количество иконок:', Object.keys(this.icons).length);
         
         // Кнопки выбора вида сетки (без функциональности)
         const buttons = [
@@ -80,14 +77,11 @@ export class Topbar {
             const btn = document.createElement('button');
             btn.className = 'moodboard-topbar__button';
             
-            console.log(`🔍 Topbar: создаю кнопку для иконки "${cfg.icon}"`);
             
             // Создаем SVG иконку
             if (this.icons[cfg.icon]) {
-                console.log(`✅ Topbar: иконка "${cfg.icon}" найдена, создаю SVG`);
                 this.createSvgIcon(btn, cfg.icon);
             } else {
-                console.warn(`⚠️ Topbar: иконка "${cfg.icon}" не найдена, создаю fallback`);
                 // Fallback: создаем простую текстовую иконку
                 const fallbackIcon = document.createElement('span');
                 fallbackIcon.textContent = cfg.icon.charAt(0).toUpperCase();
@@ -111,14 +105,11 @@ export class Topbar {
         paintBtn.className = 'moodboard-topbar__button moodboard-topbar__button--paint';
         paintBtn.title = 'Палитра фона';
         
-        console.log('🔍 Topbar: создаю кнопку краски');
         
         // Создаем SVG иконку
         if (this.icons['paint']) {
-            console.log('✅ Topbar: иконка paint найдена, создаю SVG');
             this.createSvgIcon(paintBtn, 'paint');
         } else {
-            console.warn('⚠️ Topbar: иконка paint не найдена, создаю fallback');
             // Fallback: создаем простую текстовую иконку
             const fallbackIcon = document.createElement('span');
             fallbackIcon.textContent = '🎨';
@@ -144,11 +135,8 @@ export class Topbar {
      * Создает SVG иконку для кнопки
      */
     createSvgIcon(button, iconName) {
-        console.log(`🔍 Topbar: создаю SVG иконку "${iconName}"`);
-        console.log(`🔍 Topbar: доступные иконки:`, Object.keys(this.icons));
         
         if (this.icons[iconName]) {
-            console.log(`✅ Topbar: иконка "${iconName}" найдена, создаю SVG элемент`);
             // Создаем SVG элемент из загруженного содержимого
             const tempDiv = document.createElement('div');
             tempDiv.innerHTML = this.icons[iconName];
@@ -162,12 +150,9 @@ export class Topbar {
                 
                 // Добавляем SVG в кнопку
                 button.appendChild(svg);
-                console.log(`✅ Topbar: SVG иконка "${iconName}" успешно добавлена в кнопку`);
             } else {
-                console.warn(`⚠️ Topbar: не удалось найти SVG элемент в содержимом иконки "${iconName}"`);
             }
         } else {
-            console.warn(`⚠️ Topbar: иконка "${iconName}" не найдена в this.icons`);
         }
     }
 

package/src/utils/emojiResolver.js

@@ -67,13 +67,18 @@ export function emojiToLocalUrl(emoji) {
     }
 }
 
-// Карта локальных изображений (SVG и PNG) из src/assets/emodji (собирается Vite'ом)
-// Ключи вида '../assets/emodji/1f600.svg' / '../assets/emodji/1f600.png' → URL
-const _localEmojiModules = import.meta && typeof import.meta.glob === 'function'
-  ? {
-      ...import.meta.glob('../assets/emodji/**/*.{svg,SVG,png,PNG}', { eager: true, query: '?url', import: 'default' })
+// Карта локальных изображений (SVG и PNG) из src/assets/emodji
+// В режиме с bundler используем import.meta.glob, иначе fallback
+const _localEmojiModules = (() => {
+  if (typeof import.meta !== 'undefined' && import.meta.glob) {
+    try {
+      return import.meta.glob('../assets/emodji/**/*.{svg,SVG,png,PNG}', { eager: true, query: '?url', import: 'default' });
+    } catch (error) {
+      return {};
     }
-  : {};
+  }
+  return {};
+})();
 
 // Индекс по имени файла (без пути)
 const _localEmojiIndex = (() => {
@@ -119,3 +124,43 @@ export function buildLocalPaths(emoji) {
     }
 }
 
+/**
+ * Возвращает абсолютный URL для эмоджи с учетом базового пути
+ * @param {string} emoji - эмоджи символ
+ * @param {string} basePath - базовый путь к ассетам
+ * @returns {string|null} абсолютный URL или null
+ */
+export function resolveEmojiAbsoluteUrl(emoji, basePath = null) {
+    try {
+        const base = emojiFilenameBase(emoji);
+        if (!base) return null;
+        
+        // Определяем базовый путь
+        let resolvedBasePath = basePath;
+        
+        if (!resolvedBasePath) {
+            // Пытаемся определить от import.meta.url
+            try {
+                resolvedBasePath = new URL('../assets/emodji/', import.meta.url).href;
+            } catch (error) {
+                // Fallback на глобальную настройку
+                if (window.MOODBOARD_BASE_PATH) {
+                    const globalPath = window.MOODBOARD_BASE_PATH.endsWith('/') ? window.MOODBOARD_BASE_PATH : window.MOODBOARD_BASE_PATH + '/';
+                    resolvedBasePath = `${globalPath}src/assets/emodji/`;
+                } else {
+                    resolvedBasePath = '/src/assets/emodji/';
+                }
+            }
+        }
+        
+        // Формируем URL (приоритет PNG, потом SVG)
+        if (!resolvedBasePath.endsWith('/')) resolvedBasePath += '/';
+        
+        // Возвращаем URL в формате готовом для использования
+        return `${resolvedBasePath}Смайлики/${base}.png`; // Большинство эмоджи в папке Смайлики
+        
+    } catch (error) {
+        return null;
+    }
+}
+

package/src/utils/styleLoader.js

@@ -19,18 +19,15 @@ export class StyleLoader {
             'src/ui/styles/panels.css'
         ];
 
-        console.log('🎨 StyleLoader: Загружаем стили MoodBoard...');
 
         for (const stylePath of styles) {
             try {
                 await this.loadStyle(basePath + stylePath);
-                console.log(`✅ Стиль загружен: ${stylePath}`);
             } catch (error) {
                 console.warn(`⚠️ Ошибка загрузки стиля ${stylePath}:`, error);
             }
         }
 
-        console.log('🎨 StyleLoader: Все стили загружены');
     }
 
     /**