@node-projects/web-component-designer 0.2.30 → 0.2.32

package/dist/elements/widgets/designerView/tools/toolBar/popups/BoxShadowEditorWindow.js

@@ -139,12 +139,12 @@ export class BoxShadowEditorWindow extends DraggableToolWindow {
         display: flex;
         flex-direction: column;
         width: 380px;
-        color: #ddd;
+        color: var(--wcd-color-text, #ddd);
         font-family: sans-serif;
         font-size: 12px;
         padding: 8px;
         gap: 8px;
-        background: #2c2c2c;
+        background: var(--wcd-color-surface-raised, #2c2c2c);
       }
       .preview-area {
         display: flex;
@@ -153,12 +153,12 @@ export class BoxShadowEditorWindow extends DraggableToolWindow {
         height: 110px;
         background: repeating-conic-gradient(#444 0% 25%, #333 0% 50%) 0 0 / 16px 16px;
         border-radius: 4px;
-        border: 1px solid #111;
+        border: 1px solid var(--wcd-color-border-strong, #111);
       }
       .preview-box {
         width: 70px;
         height: 70px;
-        background: #fff;
+        background: var(--wcd-box-shadow-editor-preview-background, #fff);
         border-radius: 4px;
       }
       .layers-row {
@@ -174,8 +174,8 @@ export class BoxShadowEditorWindow extends DraggableToolWindow {
         min-height: 60px;
         max-height: 100px;
         overflow-y: auto;
-        background: #1e1e1e;
-        border: 1px solid #111;
+        background: var(--wcd-color-surface, #1e1e1e);
+        border: 1px solid var(--wcd-color-border-strong, #111);
         border-radius: 3px;
       }
       .layer-list li {
@@ -189,13 +189,13 @@ export class BoxShadowEditorWindow extends DraggableToolWindow {
         text-overflow: ellipsis;
       }
       .layer-list li.selected {
-        background: #3a3a5a;
+        background: var(--wcd-box-shadow-editor-preview-box-background, #3a3a5a);
       }
       .layer-list li .swatch {
         width: 12px;
         height: 12px;
         border-radius: 2px;
-        border: 1px solid #555;
+        border: 1px solid var(--wcd-color-border, #555);
         flex-shrink: 0;
         display: inline-block;
       }
@@ -210,9 +210,9 @@ export class BoxShadowEditorWindow extends DraggableToolWindow {
         height: 24px;
         padding: 0;
         font-size: 14px;
-        background: #444;
-        color: #ddd;
-        border: 1px solid #222;
+        background: var(--wcd-color-surface-hover, #444);
+        color: var(--wcd-color-text, #ddd);
+        border: 1px solid var(--wcd-color-border-strong, #222);
         border-radius: 3px;
         cursor: pointer;
         line-height: 1;
@@ -224,13 +224,13 @@ export class BoxShadowEditorWindow extends DraggableToolWindow {
         gap: 4px 6px;
         align-items: center;
       }
-      .controls label { color: #aaa; }
+      .controls label { color: var(--wcd-color-text-muted, #aaa); }
       .controls input[type=range] { width: 100%; }
       .controls input[type=number] {
         width: 100%;
-        background: #1e1e1e;
-        border: 1px solid #444;
-        color: #ddd;
+        background: var(--wcd-color-surface, #1e1e1e);
+        border: 1px solid var(--wcd-color-border, #444);
+        color: var(--wcd-color-text, #ddd);
         border-radius: 3px;
         padding: 2px 4px;
       }
@@ -238,8 +238,8 @@ export class BoxShadowEditorWindow extends DraggableToolWindow {
         width: 100%;
         height: 24px;
         padding: 1px;
-        background: #1e1e1e;
-        border: 1px solid #444;
+        background: var(--wcd-color-surface, #1e1e1e);
+        border: 1px solid var(--wcd-color-border, #444);
         border-radius: 3px;
         cursor: pointer;
       }
@@ -257,10 +257,10 @@ export class BoxShadowEditorWindow extends DraggableToolWindow {
         user-select: none;
       }
       .css-out {
-        background: #1e1e1e;
-        border: 1px solid #333;
+        background: var(--wcd-color-surface, #1e1e1e);
+        border: 1px solid var(--wcd-color-border, #333);
         border-radius: 3px;
-        color: #7ec8e3;
+        color: var(--wcd-color-accent-text, #7ec8e3);
         font-family: monospace;
         font-size: 11px;
         padding: 6px;
@@ -276,20 +276,20 @@ export class BoxShadowEditorWindow extends DraggableToolWindow {
       .actions .load-btn { margin-right: auto; }
       .actions button, .apply-btn {
         padding: 4px 12px;
-        background: #3a3a3a;
-        color: #ddd;
-        border: 1px solid #555;
+        background: var(--wcd-color-surface-raised, #3a3a3a);
+        color: var(--wcd-color-text, #ddd);
+        border: 1px solid var(--wcd-color-border, #555);
         border-radius: 3px;
         cursor: pointer;
         font-size: 12px;
       }
       .actions button:hover, .apply-btn:hover { background: #555; }
       .apply-btn {
-        background: #3a6a9a;
-        border-color: #2a5a8a;
+        background: var(--wcd-color-accent, #3a6a9a);
+        border-color: var(--wcd-color-accent-border, #2a5a8a);
       }
       .apply-btn:hover { background: #4a7aaa; }
-      .val-label { text-align: right; color: #888; }
+      .val-label { text-align: right; color: var(--wcd-color-text-muted, #888); }
     `;
     }
     get windowTemplate() {

package/dist/elements/widgets/designerView/tools/toolBar/popups/DraggableToolWindow.js

@@ -20,10 +20,10 @@ export class DraggableToolWindow extends BaseCustomWebComponentConstructorAppend
       touch-action: none;
     }
     .window-frame {
-      background: #2c2c2c;
-      border: 1px solid #111;
+      background: var(--wcd-color-surface-raised, #2c2c2c);
+      border: 1px solid var(--wcd-color-border-strong, #111);
       border-radius: 4px;
-      box-shadow: 0 4px 24px rgba(0,0,0,0.7);
+      box-shadow: 0 4px 24px var(--wcd-tool-window-shadow-color, rgba(0,0,0,0.7));
       display: flex;
       flex-direction: column;
       overflow: hidden;
@@ -32,7 +32,7 @@ export class DraggableToolWindow extends BaseCustomWebComponentConstructorAppend
       display: flex;
       align-items: center;
       justify-content: space-between;
-      background: #1a1a1a;
+      background: var(--wcd-color-surface, #1a1a1a);
       padding: 2px 5px;
       cursor: move;
       flex-shrink: 0;
@@ -40,7 +40,7 @@ export class DraggableToolWindow extends BaseCustomWebComponentConstructorAppend
       box-sizing: border-box;
     }
     .title-text {
-      color: #ccc;
+      color: var(--wcd-color-text-muted, #ccc);
       font-size: 11px;
       font-family: sans-serif;
       font-weight: 500;
@@ -54,7 +54,7 @@ export class DraggableToolWindow extends BaseCustomWebComponentConstructorAppend
       height: 14px;
       background: none;
       border: none;
-      color: #888;
+      color: var(--wcd-color-text-muted, #888);
       font-size: 12px;
       line-height: 1;
       cursor: pointer;
@@ -66,8 +66,8 @@ export class DraggableToolWindow extends BaseCustomWebComponentConstructorAppend
       flex-shrink: 0;
     }
     .close-btn:hover {
-      background: #c0392b;
-      color: #fff;
+      background: var(--wcd-tool-window-close-hover-background, #c0392b);
+      color: var(--wcd-color-text, #fff);
     }
     .window-content {
       overflow: auto;

package/dist/elements/widgets/designerView/tools/toolBar/popups/GradientEditorWindow.js

@@ -253,23 +253,23 @@ export class GradientEditorWindow extends DraggableToolWindow {
         display: flex;
         flex-direction: column;
         width: 380px;
-        color: #ddd;
+        color: var(--wcd-color-text, #ddd);
         font-family: sans-serif;
         font-size: 12px;
         gap: 6px;
         padding: 8px;
-        background: #2a2a2a;
+        background: var(--wcd-color-surface-raised, #2a2a2a);
       }
       .preview-strip {
         height: 50px;
         border-radius: 4px 4px 0 0;
-        border: 1px solid #444;
+        border: 1px solid var(--wcd-color-border, #444);
         border-bottom: none;
       }
       .stop-track {
         height: 20px;
         background: repeating-conic-gradient(#333 0% 25%, #444 0% 50%) 0 0 / 10px 10px;
-        border: 1px solid #444;
+        border: 1px solid var(--wcd-color-border, #444);
         border-radius: 0 0 4px 4px;
         position: relative;
         cursor: crosshair;
@@ -281,14 +281,14 @@ export class GradientEditorWindow extends DraggableToolWindow {
         width: 16px;
         height: 16px;
         border-radius: 50%;
-        border: 2px solid #aaa;
+        border: 2px solid var(--wcd-gradient-editor-stop-border-color, #aaa);
         cursor: pointer;
         transform: translateX(-50%);
         transition: border-color 0.1s;
       }
       .stop-marker.selected {
-        border-color: #fff;
-        box-shadow: 0 0 0 2px #3a7ad5;
+        border-color: var(--wcd-gradient-editor-stop-selected-border-color, #fff);
+        box-shadow: 0 0 0 2px var(--wcd-gradient-editor-stop-selected-glow-color, #3a7ad5);
         z-index: 1;
       }
       .row {
@@ -303,21 +303,21 @@ export class GradientEditorWindow extends DraggableToolWindow {
       .row.multi {
         grid-template-columns: 70px 1fr 70px 1fr;
       }
-      .row label { color: #aaa; }
+      .row label { color: var(--wcd-color-text-muted, #aaa); }
       .row input[type=range] { width: 100%; }
       .row input[type=color] {
         width: 100%;
         height: 22px;
         padding: 1px;
-        border: 1px solid #555;
+        border: 1px solid var(--wcd-color-border, #555);
         border-radius: 3px;
-        background: #1e1e1e;
+        background: var(--wcd-color-surface, #1e1e1e);
         cursor: pointer;
       }
       select {
-        background: #2e2e2e;
-        color: #ddd;
-        border: 1px solid #555;
+        background: var(--wcd-color-surface-raised, #2e2e2e);
+        color: var(--wcd-color-text, #ddd);
+        border: 1px solid var(--wcd-color-border, #555);
         border-radius: 3px;
         padding: 2px 4px;
         font-size: 11px;
@@ -325,14 +325,14 @@ export class GradientEditorWindow extends DraggableToolWindow {
       }
       .separator {
         height: 1px;
-        background: #444;
+        background: var(--wcd-color-surface-hover, #444);
         margin: 2px 0;
       }
       .stop-header {
         display: flex;
         justify-content: space-between;
         align-items: center;
-        color: #888;
+        color: var(--wcd-color-text-muted, #888);
         font-size: 11px;
       }
       .stop-header .stop-actions {
@@ -341,20 +341,20 @@ export class GradientEditorWindow extends DraggableToolWindow {
       }
       .stop-actions button {
         padding: 1px 7px;
-        background: #3a3a3a;
-        color: #ddd;
-        border: 1px solid #555;
+        background: var(--wcd-color-surface-raised, #3a3a3a);
+        color: var(--wcd-color-text, #ddd);
+        border: 1px solid var(--wcd-color-border, #555);
         border-radius: 3px;
         cursor: pointer;
         font-size: 12px;
       }
       .stop-actions button:hover { background: #555; }
-      .val-label { text-align: right; color: #888; }
+      .val-label { text-align: right; color: var(--wcd-color-text-muted, #888); }
       .css-out {
-        background: #1e1e1e;
-        border: 1px solid #333;
+        background: var(--wcd-color-surface, #1e1e1e);
+        border: 1px solid var(--wcd-color-border, #333);
         border-radius: 3px;
-        color: #7ec8e3;
+        color: var(--wcd-color-accent-text, #7ec8e3);
         font-family: monospace;
         font-size: 11px;
         padding: 6px;
@@ -370,17 +370,17 @@ export class GradientEditorWindow extends DraggableToolWindow {
       .actions .load-btn { margin-right: auto; }
       .actions button, .apply-btn {
         padding: 4px 12px;
-        background: #3a3a3a;
-        color: #ddd;
-        border: 1px solid #555;
+        background: var(--wcd-color-surface-raised, #3a3a3a);
+        color: var(--wcd-color-text, #ddd);
+        border: 1px solid var(--wcd-color-border, #555);
         border-radius: 3px;
         cursor: pointer;
         font-size: 12px;
       }
       .actions button:hover, .apply-btn:hover { background: #555; }
       .apply-btn {
-        background: #3a6a9a;
-        border-color: #2a5a8a;
+        background: var(--wcd-color-accent, #3a6a9a);
+        border-color: var(--wcd-color-accent-border, #2a5a8a);
       }
       .apply-btn:hover { background: #4a7aaa; }
     `;

package/dist/elements/widgets/designerView/tools/toolBar/popups/TextShadowEditorWindow.js

@@ -102,16 +102,16 @@ export class TextShadowEditorWindow extends DraggableToolWindow {
         display: flex;
         flex-direction: column;
         width: 360px;
-        color: #ddd;
+        color: var(--wcd-color-text, #ddd);
         font-family: sans-serif;
         font-size: 12px;
         gap: 6px;
         padding: 8px;
-        background: #2a2a2a;
+        background: var(--wcd-color-surface-raised, #2a2a2a);
       }
       .preview-area {
-        background: #1a1a1a;
-        border: 1px solid #444;
+        background: var(--wcd-color-surface, #1a1a1a);
+        border: 1px solid var(--wcd-color-border, #444);
         border-radius: 4px;
         height: 60px;
         display: flex;
@@ -121,7 +121,7 @@ export class TextShadowEditorWindow extends DraggableToolWindow {
       .preview-text {
         font-size: 28px;
         font-weight: bold;
-        color: #fff;
+        color: var(--wcd-color-text, #fff);
         user-select: none;
       }
       .layers-row {
@@ -133,11 +133,11 @@ export class TextShadowEditorWindow extends DraggableToolWindow {
         list-style: none;
         margin: 0;
         padding: 0;
-        border: 1px solid #444;
+        border: 1px solid var(--wcd-color-border, #444);
         border-radius: 3px;
         max-height: 80px;
         overflow-y: auto;
-        background: #1e1e1e;
+        background: var(--wcd-color-surface, #1e1e1e);
       }
       .layer-list li {
         display: flex;
@@ -152,7 +152,7 @@ export class TextShadowEditorWindow extends DraggableToolWindow {
       .swatch {
         width: 12px; height: 12px;
         border-radius: 2px;
-        border: 1px solid #555;
+        border: 1px solid var(--wcd-color-border, #555);
         flex-shrink: 0;
       }
       .disabled-label { opacity: 0.4; }
@@ -163,9 +163,9 @@ export class TextShadowEditorWindow extends DraggableToolWindow {
       }
       .layer-buttons button {
         width: 22px; height: 22px;
-        background: #3a3a3a;
-        color: #ddd;
-        border: 1px solid #555;
+        background: var(--wcd-color-surface-raised, #3a3a3a);
+        color: var(--wcd-color-text, #ddd);
+        border: 1px solid var(--wcd-color-border, #555);
         border-radius: 3px;
         cursor: pointer;
         font-size: 13px;
@@ -178,15 +178,15 @@ export class TextShadowEditorWindow extends DraggableToolWindow {
         gap: 3px 6px;
         align-items: center;
       }
-      .controls label { color: #aaa; }
+      .controls label { color: var(--wcd-color-text-muted, #aaa); }
       .controls input[type=range] { width: 100%; }
       .controls input[type=color] {
         width: 100%;
         height: 22px;
         padding: 1px;
-        border: 1px solid #555;
+        border: 1px solid var(--wcd-color-border, #555);
         border-radius: 3px;
-        background: #1e1e1e;
+        background: var(--wcd-color-surface, #1e1e1e);
         cursor: pointer;
       }
       .check-row {
@@ -202,10 +202,10 @@ export class TextShadowEditorWindow extends DraggableToolWindow {
         user-select: none;
       }
       .css-out {
-        background: #1e1e1e;
-        border: 1px solid #333;
+        background: var(--wcd-color-surface, #1e1e1e);
+        border: 1px solid var(--wcd-color-border, #333);
         border-radius: 3px;
-        color: #7ec8e3;
+        color: var(--wcd-color-accent-text, #7ec8e3);
         font-family: monospace;
         font-size: 11px;
         padding: 6px;
@@ -221,20 +221,20 @@ export class TextShadowEditorWindow extends DraggableToolWindow {
       .actions .load-btn { margin-right: auto; }
       .actions button, .apply-btn {
         padding: 4px 12px;
-        background: #3a3a3a;
-        color: #ddd;
-        border: 1px solid #555;
+        background: var(--wcd-color-surface-raised, #3a3a3a);
+        color: var(--wcd-color-text, #ddd);
+        border: 1px solid var(--wcd-color-border, #555);
         border-radius: 3px;
         cursor: pointer;
         font-size: 12px;
       }
       .actions button:hover, .apply-btn:hover { background: #555; }
       .apply-btn {
-        background: #3a6a9a;
-        border-color: #2a5a8a;
+        background: var(--wcd-color-accent, #3a6a9a);
+        border-color: var(--wcd-color-accent-border, #2a5a8a);
       }
       .apply-btn:hover { background: #4a7aaa; }
-      .val-label { text-align: right; color: #888; }
+      .val-label { text-align: right; color: var(--wcd-color-text-muted, #888); }
     `;
     }
     get windowTemplate() {

package/dist/elements/widgets/designerView/tools/toolBar/popups/TransformToolPopup.js

@@ -49,7 +49,7 @@ export class TransformToolPopup extends DraggableToolWindow {
         grid-row-gap: 2px;
         font-size: small;
         margin: 10px;
-        color: white;
+        color: var(--wcd-color-text, white);
       }
       #button-div{
         display: grid;
@@ -79,7 +79,7 @@ export class TransformToolPopup extends DraggableToolWindow {
       #cube-background{
         width: 60px;
         height: 60px;
-        background: gray;
+        background: var(--wcd-transform-tool-divider-color, gray);
         margin-top: 20px;
         margin-left: 20px;
       }
@@ -91,7 +91,7 @@ export class TransformToolPopup extends DraggableToolWindow {
         justify-content: center;
         align-items: center;
         width: 100%;
-        color: white;
+        color: var(--wcd-color-text, white);
       }
     `;
     }

package/dist/elements/widgets/layerDepthView/layerDepthView.js

@@ -9,8 +9,8 @@ export class LayerDepthView extends BaseCustomWebComponentConstructorAppend {
           height: 100%;
           position: relative;
           isolation: isolate;
-          background: #f3f4f6;
-          color: #111827;
+          background: var(--wcd-layer-depth-view-background, #f3f4f6);
+          color: var(--wcd-layer-depth-view-text-color, #111827);
           user-select: none;
           -webkit-user-select: none;
         }
@@ -50,7 +50,7 @@ export class LayerDepthView extends BaseCustomWebComponentConstructorAppend {
           display: none;
           align-items: center;
           justify-content: center;
-          color: #4b5563;
+          color: var(--wcd-layer-depth-view-muted-color, #4b5563);
           font: 13px sans-serif;
           pointer-events: none;
         }
@@ -66,8 +66,8 @@ export class LayerDepthView extends BaseCustomWebComponentConstructorAppend {
           gap: 8px;
           box-sizing: border-box;
           padding: 7px 9px;
-          background: rgba(255, 255, 255, 0.92);
-          border: 1px solid rgba(17, 24, 39, 0.14);
+          background: var(--wcd-layer-depth-view-card-background, rgba(255, 255, 255, 0.92));
+          border: 1px solid var(--wcd-layer-depth-view-card-border-color, rgba(17, 24, 39, 0.14));
           font: 12px sans-serif;
           pointer-events: auto;
           z-index: 1;

package/dist/elements/widgets/miniatureView/miniatureView.js

@@ -34,7 +34,7 @@ export class MiniatureView extends BaseCustomWebComponentConstructorAppend {
           left: 0;
           width: 100%;
           height: 100%;
-          border: 1px solid black;
+          border: 1px solid var(--wcd-miniature-view-border-color, black);
           pointer-events: none;
         }`;
     static template = html `

package/dist/elements/widgets/paletteView/paletteElements.js

@@ -12,7 +12,7 @@ export class PaletteElements extends BaseCustomWebComponentLazyAppend {
 
     button {
       background-color: transparent;
-      color: white;
+      color: var(--wcd-color-text, white);
       border: none;
       font-size: 13px;
       display: block;
@@ -22,7 +22,7 @@ export class PaletteElements extends BaseCustomWebComponentLazyAppend {
       padding: 8px 14px;
     }
     button:hover {
-      background: var(--light-grey, #383f52);
+      background: var(--wcd-palette-item-hover-background, var(--light-grey, var(--wcd-color-surface-hover, #383f52)));
     }
 
     table {
@@ -30,7 +30,7 @@ export class PaletteElements extends BaseCustomWebComponentLazyAppend {
     }
 
     td {
-      color: white;
+      color: var(--wcd-color-text, white);
       font-size: 13px;
     }
 

package/dist/elements/widgets/paletteView/paletteView.js

@@ -11,6 +11,13 @@ export class PaletteView extends BaseCustomWebComponentLazyAppend {
       flex-direction: column;
       flex: 1;
       height: 100%;
+      min-height: 0;
+      overflow: hidden;
+    }
+
+    node-projects-designer-tab-control {
+      flex: 1;
+      min-height: 0;
     }`;
     constructor() {
         super();

package/dist/elements/widgets/paletteView/paletteView.js.map

@@ -1 +1 @@
-{"version":3,"file":"paletteView.js","sourceRoot":"","sources":["../../../../src/elements/widgets/paletteView/paletteView.ts"],"names":[],"mappings":"AAAA,OAAO,sCAAsC,CAAC;AAE9C,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAC1E,OAAO,EAAE,gCAAgC,EAAE,GAAG,EAAE,MAAM,yCAAyC,CAAC;AAGhG,MAAM,OAAO,WAAY,SAAQ,gCAAgC;IAExD,QAAQ,GAAG,QAAQ,CAAC;IAEnB,mBAAmB,CAAqB;IAEhD,MAAM,CAAmB,KAAK,GAAG,GAAG,CAAA;;;;;;MAMhC,CAAC;IAEL;QACE,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,4BAA4B,EAAE,CAAC;QAEpC,IAAI,CAAC,mBAAmB,GAAG,IAAI,kBAAkB,EAAE,CAAC;QACpD,IAAI,CAAC,mBAAmB,CAAC,aAAa,GAAG,CAAC,CAAC;QAC3C,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;IACxD,CAAC;IAEM,KAAK,CAAC,YAAY,CAAC,gBAAkC,EAAE,gBAAoC;QAChG,IAAI,CAAC,mBAAmB,CAAC,SAAS,GAAG,EAAE,CAAC;QACxC,KAAK,MAAM,CAAC,IAAI,gBAAgB,EAAE,CAAC;YACjC,IAAI,CAAC;gBACH,IAAI,QAAQ,GAAG,MAAM,CAAC,CAAC,WAAW,EAAE,CAAC;gBACrC,IAAI,cAAc,GAAG,IAAI,eAAe,EAAE,CAAC;gBAC3C,cAAc,CAAC,KAAK,GAAG,CAAC,CAAC,IAAI,CAAC;gBAC9B,IAAI,CAAC,mBAAmB,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;gBACrD,cAAc,CAAC,YAAY,CAAC,gBAAgB,EAAE,QAAQ,CAAC,CAAC;gBACxD,CAAC,CAAC,iBAAiB,EAAE,EAAE,CAAC,KAAK,IAAI,EAAE;oBACjC,cAAc,CAAC,YAAY,CAAC,gBAAgB,EAAE,MAAM,CAAC,CAAC,WAAW,EAAE,CAAC,CAAC;gBACvE,CAAC,CAAC,CAAC;YACL,CAAC;YAAC,OAAO,GAAG,EAAE,CAAC;gBACb,OAAO,CAAC,IAAI,CAAC,wBAAwB,EAAE,GAAG,CAAC,CAAC;YAC9C,CAAC;QACH,CAAC;QACD,IAAI,CAAC,mBAAmB,CAAC,YAAY,EAAE,CAAC;IAC1C,CAAC;;AAGH,cAAc,CAAC,MAAM,CAAC,4BAA4B,EAAE,WAAW,CAAC,CAAC"}
+{"version":3,"file":"paletteView.js","sourceRoot":"","sources":["../../../../src/elements/widgets/paletteView/paletteView.ts"],"names":[],"mappings":"AAAA,OAAO,sCAAsC,CAAC;AAE9C,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAC1E,OAAO,EAAE,gCAAgC,EAAE,GAAG,EAAE,MAAM,yCAAyC,CAAC;AAGhG,MAAM,OAAO,WAAY,SAAQ,gCAAgC;IAExD,QAAQ,GAAG,QAAQ,CAAC;IAEnB,mBAAmB,CAAqB;IAEhD,MAAM,CAAmB,KAAK,GAAG,GAAG,CAAA;;;;;;;;;;;;;MAahC,CAAC;IAEL;QACE,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,4BAA4B,EAAE,CAAC;QAEpC,IAAI,CAAC,mBAAmB,GAAG,IAAI,kBAAkB,EAAE,CAAC;QACpD,IAAI,CAAC,mBAAmB,CAAC,aAAa,GAAG,CAAC,CAAC;QAC3C,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;IACxD,CAAC;IAEM,KAAK,CAAC,YAAY,CAAC,gBAAkC,EAAE,gBAAoC;QAChG,IAAI,CAAC,mBAAmB,CAAC,SAAS,GAAG,EAAE,CAAC;QACxC,KAAK,MAAM,CAAC,IAAI,gBAAgB,EAAE,CAAC;YACjC,IAAI,CAAC;gBACH,IAAI,QAAQ,GAAG,MAAM,CAAC,CAAC,WAAW,EAAE,CAAC;gBACrC,IAAI,cAAc,GAAG,IAAI,eAAe,EAAE,CAAC;gBAC3C,cAAc,CAAC,KAAK,GAAG,CAAC,CAAC,IAAI,CAAC;gBAC9B,IAAI,CAAC,mBAAmB,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;gBACrD,cAAc,CAAC,YAAY,CAAC,gBAAgB,EAAE,QAAQ,CAAC,CAAC;gBACxD,CAAC,CAAC,iBAAiB,EAAE,EAAE,CAAC,KAAK,IAAI,EAAE;oBACjC,cAAc,CAAC,YAAY,CAAC,gBAAgB,EAAE,MAAM,CAAC,CAAC,WAAW,EAAE,CAAC,CAAC;gBACvE,CAAC,CAAC,CAAC;YACL,CAAC;YAAC,OAAO,GAAG,EAAE,CAAC;gBACb,OAAO,CAAC,IAAI,CAAC,wBAAwB,EAAE,GAAG,CAAC,CAAC;YAC9C,CAAC;QACH,CAAC;QACD,IAAI,CAAC,mBAAmB,CAAC,YAAY,EAAE,CAAC;IAC1C,CAAC;;AAGH,cAAc,CAAC,MAAM,CAAC,4BAA4B,EAAE,WAAW,CAAC,CAAC"}

package/dist/elements/widgets/propertyGrid/PropertyGrid.js

@@ -23,10 +23,10 @@ export class PropertyGrid extends BaseCustomWebComponentLazyAppend {
       -webkit-user-select: none;
     }
     button:hover {
-      box-shadow: inset 0 3px 0 var(--light-grey);
+      box-shadow: inset 0 3px 0 var(--wcd-property-grid-tab-indicator-inactive-color, var(--light-grey));
     }
     button:focus {
-      box-shadow: inset 0 3px 0 var(--highlight-pink, #e91e63);
+      box-shadow: inset 0 3px 0 var(--wcd-property-grid-tab-indicator-color, var(--highlight-pink, var(--wcd-color-accent, #e91e63)));
     }
     `;
     static properties = {