@sequent-org/moodboard 1.2.53 → 1.2.54

package/package.json

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

package/src/ui/Topbar.js

@@ -277,11 +277,21 @@ export class Topbar {
         });
         pop.appendChild(grid);
 
-        // Выделяем активный цвет галочкой
+        // Выделяем активный цвет галочкой (надежно — по data-hex)
         try {
+            // 1) Пытаемся получить текущий цвет фона канваса
             const boardHex = this._getCurrentBoardBackgroundHex();
-            const targetHex = (this.mapBoardToBtnHex(boardHex) || '#B3E5FC').toLowerCase();
-            const match = grid.querySelector(`[data-hex="${targetHex}"]`);
+            // 2) Маппим к hex кнопки палитры
+            let targetHex = this.mapBoardToBtnHex(boardHex || '') || '';
+            // 3) Если не удалось — пробуем взять цвет с кнопки (custom prop)
+            if (!targetHex && this._paintBtn) {
+                const prop = getComputedStyle(this._paintBtn).getPropertyValue('--paint-btn-color') || '';
+                targetHex = prop.trim();
+            }
+            // 4) Фолбэк — первый цвет из палитры
+            if (!targetHex) targetHex = '#B3E5FC';
+            const normalized = String(targetHex).trim().toLowerCase();
+            const match = grid.querySelector(`[data-hex="${normalized}"]`);
             if (match) match.classList.add('is-active');
         } catch (_) {}
 
@@ -291,16 +301,7 @@ export class Topbar {
         pop.style.left = `${rect.left - this.element.getBoundingClientRect().left}px`;
         pop.style.top = `${rect.bottom - this.element.getBoundingClientRect().top + 6}px`;
 
-        // Подсветить текущий активный кружок (с галочкой)
-        try {
-            const currentBtnHex = (this._paintBtn && getComputedStyle(this._paintBtn).getPropertyValue('--paint-btn-color')) || '';
-            const normalized = currentBtnHex.trim() || '#B3E5FC';
-            const match = Array.from(grid.children).find((el) => {
-                const bg = el && el.style && el.style.background ? el.style.background.toLowerCase() : '';
-                return bg === normalized.toLowerCase();
-            });
-            if (match) match.classList.add('is-active');
-        } catch (_) {}
+        // (дополнительная подсветка не требуется — активируем по data-hex выше)
 
         this.element.appendChild(pop);
         this._paintPopover = pop;