@luzmo/analytics-components-kit 1.0.1-alpha.86 → 1.0.1-alpha.89

package/components/draggable-data-item-level/index.js

@@ -17,33 +17,24 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-import { g as P, d as V, s as B } from "../get-css-variable-YlLiVgo8.js";
-import { luzmoIcon as x, luzmoDragLines as M, luzmoArrows as U, luzmoInfoCircleOutline as F } from "@luzmo/icons";
+import { g as w, d as k, s as C } from "../get-css-variable-CdwF98oh.js";
+import { luzmoIcon as v, luzmoDragLines as I, luzmoArrows as S, luzmoInfoCircleOutline as D } from "@luzmo/icons";
 import "@luzmo/lucero/icon";
 import "@luzmo/lucero/tooltip";
-import { unsafeCSS as q, html as I } from "lit";
-import { property as c } from "lit/decorators.js";
-import { L as A } from "../focusable-DCIFkpiW.js";
-import { S as G } from "../sized-mixin-cJbo3PKR.js";
-import { c as O, a as N } from "../calculate-data-item-icon-DZDqb3xu.js";
-import { l as W } from "../localize-BX7q0S0M.js";
+import { unsafeCSS as _, html as b } from "lit";
+import { property as s } from "lit/decorators.js";
+import { L as E } from "../focusable-BS2pbY7w.js";
+import { S as H } from "../sized-mixin-cJbo3PKR.js";
+import { c as x, a as $ } from "../calculate-data-item-icon-DMDhKq_m.js";
+import { l as L } from "../localize-CcDpq940.js";
 (function() {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
-    const o = document.createElement("style");
-    o.setAttribute("data-luzmo-vars", ""), o.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-background-color-alt-1: rgb(250, 250, 250);--luzmo-background-color-alt-2: rgb(239, 239, 239);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-color-disabled);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-secondary-outline: rgba(255, 0, 255, 0.2);--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: #b3241f;--luzmo-negative-color-down: #9f231f;--luzmo-negative-color-focus: #b3241f;--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-positive-color: rgb(20, 150, 101);--luzmo-positive-color-hover: rgb(17, 128, 86);--luzmo-positive-color-down: rgb(16, 105, 71);--luzmo-positive-color-focus: rgb(17, 128, 86);--luzmo-positive-color-rgb: 20, 150, 101;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: rgb(70, 70, 70);--luzmo-selected-color-down: rgb(40, 40, 40);--luzmo-selected-color-focus: rgb(70, 70, 70);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: rgb(0, 0, 0);--luzmo-selected-color-hard-down: rgb(0, 0, 0);--luzmo-selected-color-hard-focus: rgb(0, 0, 0);--luzmo-color-informative: #1a77e9;--luzmo-color-informative-rgb: 26, 119, 233;--luzmo-color-disabled: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(o);
+    const e = document.createElement("style");
+    e.setAttribute("data-luzmo-vars", ""), e.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-background-color-alt-1: rgb(250, 250, 250);--luzmo-background-color-alt-2: rgb(239, 239, 239);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-color-disabled);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-secondary-outline: rgba(255, 0, 255, 0.2);--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: #b3241f;--luzmo-negative-color-down: #9f231f;--luzmo-negative-color-focus: #b3241f;--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-positive-color: rgb(20, 150, 101);--luzmo-positive-color-hover: rgb(17, 128, 86);--luzmo-positive-color-down: rgb(16, 105, 71);--luzmo-positive-color-focus: rgb(17, 128, 86);--luzmo-positive-color-rgb: 20, 150, 101;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: rgb(70, 70, 70);--luzmo-selected-color-down: rgb(40, 40, 40);--luzmo-selected-color-focus: rgb(70, 70, 70);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: rgb(0, 0, 0);--luzmo-selected-color-hard-down: rgb(0, 0, 0);--luzmo-selected-color-hard-focus: rgb(0, 0, 0);--luzmo-color-informative: #1a77e9;--luzmo-color-informative-rgb: 26, 119, 233;--luzmo-color-disabled: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(e);
   }
 })();
-const J = ":host{font-family:var(--luzmo-draggable-data-item-level-font-family, var(--luzmo-font-family));color:var(--luzmo-draggable-data-item-level-font-color, var(--draggable-data-item-level-font-color))}.draggable-data-item-level{transition:background-color var(--luzmo-animation-duration);background-color:var(--luzmo-draggable-data-item-level-background-color, var(--draggable-data-item-level-background-color));display:grid;grid-template-columns:var(--luzmo-draggable-data-item-level-drag-handle-width, var(--draggable-data-item-level-drag-handle-width)) var(--luzmo-draggable-data-item-level-data-icon-width, var(--draggable-data-item-level-data-icon-width)) 1fr var(--luzmo-draggable-data-item-level-description-width, var(--draggable-data-item-level-description-width, auto));gap:var(--luzmo-draggable-data-item-level-gap, var(--draggable-data-item-level-gap));align-items:center;padding:0 var(--luzmo-draggable-data-item-level-horizontal-padding, var(--draggable-data-item-level-horizontal-padding));border-radius:var(--luzmo-draggable-data-item-level-border-radius, var(--draggable-data-item-level-border-radius));border-width:var(--luzmo-draggable-data-item-level-border-width, var(--draggable-data-item-level-border-width));border-style:var(--luzmo-draggable-data-item-level-border-style, var(--draggable-data-item-level-border-style));border-color:var(--luzmo-draggable-data-item-level-border-color, var(--draggable-data-item-level-border-color));height:var(--luzmo-draggable-data-item-level-height, var(--draggable-data-item-level-height));cursor:move}.draggable-data-item-level:hover{background-color:var(--luzmo-draggable-data-item-level-background-color-hover, var(--draggable-data-item-level-background-color-hover));color:var(--luzmo-draggable-data-item-level-font-color-hover, var(--draggable-data-item-level-font-color-hover));border-color:var(--luzmo-draggable-data-item-level-border-color-hover, var(--draggable-data-item-level-border-color-hover))}.draggable-data-item-level:hover .data-description{color:var(--luzmo-draggable-data-item-level-font-color-hover, var(--draggable-data-item-level-font-color-hover))}.draggable-data-item-level .data-label{font-size:var(--luzmo-draggable-data-item-level-label-font-size, var(--draggable-data-item-level-label-font-size));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.draggable-data-item-level .data-description{height:100%;display:flex;align-items:center;background-color:transparent;outline:none;border:none;color:var(--luzmo-draggable-data-item-level-font-color, var(--draggable-data-item-level-font-color));font-size:var(--luzmo-draggable-data-item-level-label-font-size, var(--draggable-data-item-level-label-font-size))}:host([sublevel]) .draggable-data-item-level{height:var(--luzmo-draggable-data-item-level-sublevel-height, var(--draggable-data-item-level-sublevel-height));background-color:var(--luzmo-draggable-data-item-level-sublevel-background-color, var(--draggable-data-item-level-sublevel-background-color));border-color:var(--luzmo-draggable-data-item-level-sublevel-border-color, var(--draggable-data-item-level-sublevel-border-color));margin-inline-start:var(--luzmo-draggable-data-item-level-sublevel-margin-inline-start, var(--draggable-data-item-level-sublevel-margin-inline-start));grid-template-columns:var(--luzmo-draggable-data-item-level-sublevel-drag-handle-width, var(--luzmo-draggable-data-item-level-drag-handle-width)) 1fr}:host([sublevel]) .draggable-data-item-level:hover{background-color:var(--luzmo-draggable-data-item-level-sublevel-background-color-hover, var(--draggable-data-item-level-sublevel-background-color-hover));color:var(--luzmo-draggable-data-item-level-sublevel-font-color-hover, var(--draggable-data-item-level-sublevel-font-color-hover))}:host([sublevel]) .draggable-data-item-level .drag-handle-icon{width:var(--luzmo-draggable-data-item-level-sublevel-drag-handle-width, var(--draggable-data-item-level-sublevel-drag-handle-width));text-align:center}:host(.highlighted) .draggable-data-item-level:not(:hover){background-color:var(--luzmo-draggable-data-item-level-background-color-highlighted, var(--draggable-data-item-level-background-color-highlighted));color:var(--luzmo-draggable-data-item-level-font-color-highlighted, var(--draggable-data-item-level-font-color-highlighted));border-color:var(--luzmo-draggable-data-item-level-border-color-highlighted, var(--draggable-data-item-level-border-color-highlighted))}:host(.highlighted) .draggable-data-item-level:not(:hover) .data-description{color:var(--luzmo-draggable-data-item-level-font-color-highlighted, var(--draggable-data-item-level-font-color-highlighted))}:host([disabled]) .draggable-data-item-level{background-color:var(--luzmo-draggable-data-item-level-background-color-disabled, var(--draggable-data-item-level-background-color-disabled));color:var(--luzmo-draggable-data-item-level-color-disabled, var(--draggable-data-item-level-color-disabled));cursor:not-allowed}:host([disabled]) .drag-handle-icon{opacity:.25}:host([sublevel][disabled]) .draggable-data-item-level{background-color:var(--luzmo-draggable-data-item-level-sublevel-background-color-disabled, var(--draggable-data-item-level-sublevel-background-color-disabled))}:host(.pulse) .draggable-data-item-level{box-shadow:0 0 0 0 var(--luzmo-draggable-data-item-level-pulse-color, var(--draggable-data-item-level-pulse-color)),0 0 0 0 var(--luzmo-draggable-data-item-level-pulse-color, var(--draggable-data-item-level-pulse-color));animation:draggableDataItemPulse 1.5s infinite cubic-bezier(.66,.33,0,1)}:host(.focus) .draggable-data-item-level{background-color:var(--luzmo-draggable-data-item-level-background-color-focus, var(--draggable-data-item-level-background-color-focus));color:var(--luzmo-draggable-data-item-level-font-color-focus, var(--draggable-data-item-level-font-color-focus));border-color:var(--luzmo-draggable-data-item-level-border-color-focus, var(--draggable-data-item-level-border-color-focus))}:host(.focus) .draggable-data-item-level .data-description{color:var(--luzmo-draggable-data-item-level-font-color-focus, var(--draggable-data-item-level-font-color-focus))}@keyframes draggableDataItemPulse{0%{box-shadow:0 0 0 0 var(--luzmo-draggable-data-item-level-pulse-color, var(--draggable-data-item-level-pulse-color)),0 0 0 0 var(--luzmo-draggable-data-item-level-pulse-color, var(--draggable-data-item-level-pulse-color))}to{box-shadow:0 0 0 .5rem transparent,0 0 0 .5rem transparent}}.drag-handle-icon{opacity:.6;font-size:var(--luzmo-draggable-data-item-level-drag-handle-size, var(--luzmo-draggable-data-item-level-drag-handle-size));width:var(--luzmo-draggable-data-item-level-drag-handle-width, var(--luzmo-draggable-data-item-level-drag-handle-width));text-align:center;justify-self:center}.data-icon-type{width:var(--luzmo-draggable-data-item-level-data-icon-width, var(--luzmo-draggable-data-item-level-data-icon-width));text-align:center;position:relative;justify-self:center}.with-secondary-icon{clip-path:polygon(0 0,60% 0,65% 60%,100% 65%,100% 100%,0 100%)}.secondary-icon{position:absolute;bottom:45%;left:70%;width:auto;font-size:.75em;line-height:1}:host([variant=highlight]){--draggable-data-item-level-background-color: var( --luzmo-background-color-highlight );--draggable-data-item-level-border-color: var( --luzmo-background-color-highlight );--draggable-data-item-level-background-color-hover: var( --luzmo-background-color-highlight-hover );--draggable-data-item-level-font-color-hover: var(--luzmo-font-color-hover);--draggable-data-item-level-border-color-hover: var( --luzmo-background-color-highlight-hover )}:host{--draggable-data-item-level-height: var(--luzmo-component-height);--draggable-data-item-level-label-font-size: var(--luzmo-font-size);--draggable-data-item-level-icon-type-size: var(--luzmo-font-size);--draggable-data-item-level-horizontal-padding: var(--luzmo-spacing-5);--draggable-data-item-level-border-width: var(--luzmo-border-width);--draggable-data-item-level-border-style: solid;--draggable-data-item-level-border-color: var(--luzmo-border-color-hover);--draggable-data-item-level-border-radius: var(--luzmo-border-radius);--draggable-data-item-level-gap: var(--luzmo-spacing-4);--draggable-data-item-level-font-color: var(--luzmo-font-color);--draggable-data-item-level-color-disabled: var(--luzmo-color-disabled);--draggable-data-item-level-background-color-disabled: var( --luzmo-background-color-disabled );--luzmo-draggable-data-item-level-drag-handle-size: var(--luzmo-font-size-s);--luzmo-draggable-data-item-level-drag-handle-width: var( --draggable-data-item-level-icon-type-size );--luzmo-draggable-data-item-level-data-icon-width: calc( var(--draggable-data-item-level-icon-type-size) + var(--luzmo-spacing-3) );--luzmo-draggable-data-item-level-description-width: calc( var(--draggable-data-item-level-icon-type-size) + var(--luzmo-spacing-2) );--draggable-data-item-level-sublevel-height: var(--luzmo-component-height-s);--draggable-data-item-level-sublevel-border-color: transparent;--draggable-data-item-level-sublevel-background-color: transparent;--draggable-data-item-level-sublevel-background-color-disabled: transparent;--draggable-data-item-level-sublevel-margin-inline-start: calc( var(--draggable-data-item-level-gap) + var(--luzmo-draggable-data-item-level-drag-handle-width) );--luzmo-draggable-data-item-level-sublevel-drag-handle-width: var( --luzmo-draggable-data-item-level-data-icon-width );--draggable-data-item-level-sublevel-background-color-hover: rgba( var(--luzmo-border-color-rgb), .05 )}:host([hide-type-icon]){--draggable-data-item-level-sublevel-margin-inline-start: var( --draggable-data-item-level-gap )}:host(.highlighted){--draggable-data-item-level-background-color-highlighted: var( --luzmo-primary );--draggable-data-item-level-font-color-highlighted: var( --luzmo-primary-inverse-color );--draggable-data-item-level-border-color-highlighted: var( --luzmo-border-color )}:host(.focus){--draggable-data-item-level-background-color-focus: var( --luzmo-background-color-focus, var(--luzmo-secondary) );--draggable-data-item-level-font-color-focus: var( --luzmo-font-color-focus, var(--luzmo-secondary-inverse-color) );--draggable-data-item-level-border-color-focus: var( --luzmo-border-color-focus, var(--luzmo-secondary) )}:host(.pulse){--draggable-data-item-level-pulse-color: var( --luzmo-secondary-outline, rgba(var(--luzmo-secondary-rgb), .4) )}:host([size=s]){--draggable-data-item-level-height: var(--luzmo-component-height-s);--draggable-data-item-level-label-font-size: var(--luzmo-font-size-s);--draggable-data-item-level-icon-type-size: var(--luzmo-font-size-s);--draggable-data-item-level-horizontal-padding: var(--luzmo-spacing-4);--draggable-data-item-level-border-radius: var(--luzmo-border-radius);--draggable-data-item-level-gap: var(--luzmo-spacing-3);--draggable-data-item-level-sublevel-height: var(--luzmo-component-height-xs);--luzmo-draggable-data-item-level-drag-handle-size: var(--luzmo-font-size-xs)}:host([size=l]){--draggable-data-item-level-height: var(--luzmo-component-height-l);--draggable-data-item-level-label-font-size: var(--luzmo-font-size-l);--draggable-data-item-level-icon-type-size: var(--luzmo-font-size-l);--draggable-data-item-level-horizontal-padding: var(--luzmo-spacing-5);--draggable-data-item-level-border-radius: var(--luzmo-border-radius-l);--draggable-data-item-level-gap: var(--luzmo-spacing-5);--draggable-data-item-level-sublevel-height: var(--luzmo-component-height);--luzmo-draggable-data-item-level-drag-handle-size: var(--luzmo-font-size)}:host([size=xl]){--draggable-data-item-level-height: var(--luzmo-component-height-xl);--draggable-data-item-level-label-font-size: var(--luzmo-font-size-xl);--draggable-data-item-level-icon-type-size: var(--luzmo-font-size-xl);--draggable-data-item-level-horizontal-padding: var(--luzmo-spacing-5);--draggable-data-item-level-border-radius: var(--luzmo-border-radius-xl);--draggable-data-item-level-gap: var(--luzmo-spacing-5);--draggable-data-item-level-sublevel-height: var(--luzmo-component-height-l);--luzmo-draggable-data-item-level-drag-handle-size: var(--luzmo-font-size-l)}:host{box-sizing:border-box}", K = (a) => {
-  var b, h, m, u, v, z, p, f, y, w, k, S, _, E, H, $, L;
-  const o = a.source.element;
-  let e = "";
-  (u = (m = (h = (b = a.source) == null ? void 0 : b.element) == null ? void 0 : h.renderRoot) == null ? void 0 : m.querySelector(".data-label")) != null && u.textContent && (e = (p = (z = (v = a.source) == null ? void 0 : v.element) == null ? void 0 : z.renderRoot) == null ? void 0 : p.querySelector(
-    ".data-label"
-  ).textContent), e || (e = W(
-    (y = (f = a == null ? void 0 : a.source) == null ? void 0 : f.data) == null ? void 0 : y.label,
-    (k = (w = a == null ? void 0 : a.source) == null ? void 0 : w.element) == null ? void 0 : k.language
-  ), e = e || "Untitled");
-  const i = (_ = (S = a == null ? void 0 : a.source) == null ? void 0 : S.data) == null ? void 0 : _.type, t = (H = (E = a == null ? void 0 : a.source) == null ? void 0 : E.data) == null ? void 0 : H.subtype, r = O({ type: i, subtype: t }, o.size), l = {};
+const P = ":host{font-family:var(--luzmo-draggable-data-item-level-font-family, var(--luzmo-font-family));color:var(--luzmo-draggable-data-item-level-font-color, var(--draggable-data-item-level-font-color))}.draggable-data-item-level{transition:background-color var(--luzmo-animation-duration);background-color:var(--luzmo-draggable-data-item-level-background-color, var(--draggable-data-item-level-background-color));display:grid;grid-template-columns:var(--luzmo-draggable-data-item-level-drag-handle-width, var(--draggable-data-item-level-drag-handle-width)) var(--luzmo-draggable-data-item-level-data-icon-width, var(--draggable-data-item-level-data-icon-width)) 1fr var(--luzmo-draggable-data-item-level-description-width, var(--draggable-data-item-level-description-width, auto));gap:var(--luzmo-draggable-data-item-level-gap, var(--draggable-data-item-level-gap));align-items:center;padding:0 var(--luzmo-draggable-data-item-level-horizontal-padding, var(--draggable-data-item-level-horizontal-padding));border-radius:var(--luzmo-draggable-data-item-level-border-radius, var(--draggable-data-item-level-border-radius));border-width:var(--luzmo-draggable-data-item-level-border-width, var(--draggable-data-item-level-border-width));border-style:var(--luzmo-draggable-data-item-level-border-style, var(--draggable-data-item-level-border-style));border-color:var(--luzmo-draggable-data-item-level-border-color, var(--draggable-data-item-level-border-color))}.draggable-data-item-level:hover{background-color:var(--luzmo-draggable-data-item-level-background-color-hover, var(--draggable-data-item-level-background-color-hover));color:var(--luzmo-draggable-data-item-level-font-color-hover, var(--draggable-data-item-level-font-color-hover));border-color:var(--luzmo-draggable-data-item-level-border-color-hover, var(--draggable-data-item-level-border-color-hover))}.draggable-data-item-level:hover .data-description{color:var(--luzmo-draggable-data-item-level-font-color-hover, var(--draggable-data-item-level-font-color-hover))}.draggable-data-item-level .data-label{font-size:var(--luzmo-draggable-data-item-level-label-font-size, var(--draggable-data-item-level-label-font-size));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.draggable-data-item-level .data-description{height:100%;display:flex;align-items:center;background-color:transparent;outline:none;border:none;color:var(--luzmo-draggable-data-item-level-font-color, var(--draggable-data-item-level-font-color));font-size:var(--luzmo-draggable-data-item-level-label-font-size, var(--draggable-data-item-level-label-font-size))}.draggable-data-item-level{height:var(--luzmo-draggable-data-item-level-height, var(--draggable-data-item-level-height));cursor:move}:host([sublevel]) .draggable-data-item-level{height:var(--luzmo-draggable-data-item-level-sublevel-height, var(--draggable-data-item-level-sublevel-height));background-color:var(--luzmo-draggable-data-item-level-sublevel-background-color, var(--draggable-data-item-level-sublevel-background-color));border-color:var(--luzmo-draggable-data-item-level-sublevel-border-color, var(--draggable-data-item-level-sublevel-border-color));margin-inline-start:var(--luzmo-draggable-data-item-level-sublevel-margin-inline-start, var(--draggable-data-item-level-sublevel-margin-inline-start));grid-template-columns:var(--luzmo-draggable-data-item-level-sublevel-drag-handle-width, var(--luzmo-draggable-data-item-level-drag-handle-width)) 1fr}:host([sublevel]) .draggable-data-item-level:hover{background-color:var(--luzmo-draggable-data-item-level-sublevel-background-color-hover, var(--draggable-data-item-level-sublevel-background-color-hover));color:var(--luzmo-draggable-data-item-level-sublevel-font-color-hover, var(--draggable-data-item-level-sublevel-font-color-hover))}:host([sublevel]) .draggable-data-item-level .drag-handle-icon{width:var(--luzmo-draggable-data-item-level-sublevel-drag-handle-width, var(--draggable-data-item-level-sublevel-drag-handle-width));text-align:center}:host(.highlighted) .draggable-data-item-level:not(:hover){background-color:var(--luzmo-draggable-data-item-level-background-color-highlighted, var(--draggable-data-item-level-background-color-highlighted));color:var(--luzmo-draggable-data-item-level-font-color-highlighted, var(--draggable-data-item-level-font-color-highlighted));border-color:var(--luzmo-draggable-data-item-level-border-color-highlighted, var(--draggable-data-item-level-border-color-highlighted))}:host(.highlighted) .draggable-data-item-level:not(:hover) .data-description{color:var(--luzmo-draggable-data-item-level-font-color-highlighted, var(--draggable-data-item-level-font-color-highlighted))}:host([disabled]) .draggable-data-item-level{background-color:var(--luzmo-draggable-data-item-level-background-color-disabled, var(--draggable-data-item-level-background-color-disabled));color:var(--luzmo-draggable-data-item-level-color-disabled, var(--draggable-data-item-level-color-disabled));cursor:not-allowed}:host([disabled]) .drag-handle-icon{opacity:.25}:host([sublevel][disabled]) .draggable-data-item-level{background-color:var(--luzmo-draggable-data-item-level-sublevel-background-color-disabled, var(--draggable-data-item-level-sublevel-background-color-disabled))}:host(.pulse) .draggable-data-item-level{box-shadow:0 0 0 0 var(--luzmo-draggable-data-item-level-pulse-color, var(--draggable-data-item-level-pulse-color)),0 0 0 0 var(--luzmo-draggable-data-item-level-pulse-color, var(--draggable-data-item-level-pulse-color));animation:draggableDataItemPulse 1.5s infinite cubic-bezier(.66,.33,0,1)}:host(.focus) .draggable-data-item-level{background-color:var(--luzmo-draggable-data-item-level-background-color-focus, var(--draggable-data-item-level-background-color-focus));color:var(--luzmo-draggable-data-item-level-font-color-focus, var(--draggable-data-item-level-font-color-focus));border-color:var(--luzmo-draggable-data-item-level-border-color-focus, var(--draggable-data-item-level-border-color-focus))}:host(.focus) .draggable-data-item-level .data-description{color:var(--luzmo-draggable-data-item-level-font-color-focus, var(--draggable-data-item-level-font-color-focus))}@keyframes draggableDataItemPulse{0%{box-shadow:0 0 0 0 var(--luzmo-draggable-data-item-level-pulse-color, var(--draggable-data-item-level-pulse-color)),0 0 0 0 var(--luzmo-draggable-data-item-level-pulse-color, var(--draggable-data-item-level-pulse-color))}to{box-shadow:0 0 0 .5rem transparent,0 0 0 .5rem transparent}}.drag-handle-icon{opacity:.6;font-size:var(--luzmo-draggable-data-item-level-drag-handle-size, var(--luzmo-draggable-data-item-level-drag-handle-size));width:var(--luzmo-draggable-data-item-level-drag-handle-width, var(--luzmo-draggable-data-item-level-drag-handle-width));text-align:center;justify-self:center}.data-icon-type{width:var(--luzmo-draggable-data-item-level-data-icon-width, var(--luzmo-draggable-data-item-level-data-icon-width));text-align:center;position:relative;justify-self:center}.with-secondary-icon{clip-path:polygon(0 0,60% 0,65% 60%,100% 65%,100% 100%,0 100%)}.secondary-icon{position:absolute;bottom:45%;left:70%;width:auto;font-size:.75em;line-height:1}:host([variant=highlight]){--draggable-data-item-level-background-color: var( --luzmo-background-color-highlight );--draggable-data-item-level-border-color: var( --luzmo-background-color-highlight );--draggable-data-item-level-background-color-hover: var( --luzmo-background-color-highlight-hover );--draggable-data-item-level-font-color-hover: var(--luzmo-font-color-hover);--draggable-data-item-level-border-color-hover: var( --luzmo-background-color-highlight-hover )}:host{--draggable-data-item-level-height: var(--luzmo-component-height);--draggable-data-item-level-label-font-size: var(--luzmo-font-size);--draggable-data-item-level-icon-type-size: var(--luzmo-font-size);--draggable-data-item-level-horizontal-padding: var(--luzmo-spacing-5);--draggable-data-item-level-border-width: var(--luzmo-border-width);--draggable-data-item-level-border-style: solid;--draggable-data-item-level-border-color: var(--luzmo-border-color-hover);--draggable-data-item-level-border-radius: var(--luzmo-border-radius);--draggable-data-item-level-gap: var(--luzmo-spacing-4);--draggable-data-item-level-font-color: var(--luzmo-font-color);--draggable-data-item-level-color-disabled: var(--luzmo-color-disabled);--draggable-data-item-level-background-color-disabled: var( --luzmo-background-color-disabled );--luzmo-draggable-data-item-level-drag-handle-size: var(--luzmo-font-size-s);--luzmo-draggable-data-item-level-drag-handle-width: var( --draggable-data-item-level-icon-type-size );--luzmo-draggable-data-item-level-data-icon-width: calc( var(--draggable-data-item-level-icon-type-size) + var(--luzmo-spacing-3) );--luzmo-draggable-data-item-level-description-width: calc( var(--draggable-data-item-level-icon-type-size) + var(--luzmo-spacing-2) );--draggable-data-item-level-sublevel-height: var(--luzmo-component-height-s);--draggable-data-item-level-sublevel-border-color: transparent;--draggable-data-item-level-sublevel-background-color: transparent;--draggable-data-item-level-sublevel-background-color-disabled: transparent;--draggable-data-item-level-sublevel-margin-inline-start: calc( var(--draggable-data-item-level-gap) + var(--luzmo-draggable-data-item-level-drag-handle-width) );--luzmo-draggable-data-item-level-sublevel-drag-handle-width: var( --luzmo-draggable-data-item-level-data-icon-width );--draggable-data-item-level-sublevel-background-color-hover: rgba( var(--luzmo-border-color-rgb), .05 )}:host([hide-type-icon]){--draggable-data-item-level-sublevel-margin-inline-start: var( --draggable-data-item-level-gap )}:host(.highlighted){--draggable-data-item-level-background-color-highlighted: var( --luzmo-primary );--draggable-data-item-level-font-color-highlighted: var( --luzmo-primary-inverse-color );--draggable-data-item-level-border-color-highlighted: var( --luzmo-border-color )}:host(.focus){--draggable-data-item-level-background-color-focus: var( --luzmo-background-color-focus, var(--luzmo-secondary) );--draggable-data-item-level-font-color-focus: var( --luzmo-font-color-focus, var(--luzmo-secondary-inverse-color) );--draggable-data-item-level-border-color-focus: var( --luzmo-border-color-focus, var(--luzmo-secondary) )}:host(.pulse){--draggable-data-item-level-pulse-color: var( --luzmo-secondary-outline, rgba(var(--luzmo-secondary-rgb), .4) )}:host([size=s]){--draggable-data-item-level-height: var(--luzmo-component-height-s);--draggable-data-item-level-label-font-size: var(--luzmo-font-size-s);--draggable-data-item-level-icon-type-size: var(--luzmo-font-size-s);--draggable-data-item-level-horizontal-padding: var(--luzmo-spacing-4);--draggable-data-item-level-border-radius: var(--luzmo-border-radius);--draggable-data-item-level-gap: var(--luzmo-spacing-3);--draggable-data-item-level-sublevel-height: var(--luzmo-component-height-xs);--luzmo-draggable-data-item-level-drag-handle-size: var(--luzmo-font-size-xs)}:host([size=l]){--draggable-data-item-level-height: var(--luzmo-component-height-l);--draggable-data-item-level-label-font-size: var(--luzmo-font-size-l);--draggable-data-item-level-icon-type-size: var(--luzmo-font-size-l);--draggable-data-item-level-horizontal-padding: var(--luzmo-spacing-5);--draggable-data-item-level-border-radius: var(--luzmo-border-radius-l);--draggable-data-item-level-gap: var(--luzmo-spacing-5);--draggable-data-item-level-sublevel-height: var(--luzmo-component-height);--luzmo-draggable-data-item-level-drag-handle-size: var(--luzmo-font-size)}:host([size=xl]){--draggable-data-item-level-height: var(--luzmo-component-height-xl);--draggable-data-item-level-label-font-size: var(--luzmo-font-size-xl);--draggable-data-item-level-icon-type-size: var(--luzmo-font-size-xl);--draggable-data-item-level-horizontal-padding: var(--luzmo-spacing-5);--draggable-data-item-level-border-radius: var(--luzmo-border-radius-xl);--draggable-data-item-level-gap: var(--luzmo-spacing-5);--draggable-data-item-level-sublevel-height: var(--luzmo-component-height-l);--luzmo-draggable-data-item-level-drag-handle-size: var(--luzmo-font-size-l)}:host{box-sizing:border-box}", O = (n) => {
+  const e = n.source.element, a = n.source.data, t = e.renderRoot?.querySelector(".data-label")?.textContent || L(a.name, e.language) || "Untitled", o = a.type, r = a.subtype, d = x({ type: o, subtype: r }, e.size), l = {};
   [
     [
       "borderColor",
@@ -90,21 +81,21 @@ const J = ":host{font-family:var(--luzmo-draggable-data-item-level-font-family,
       "--luzmo-draggable-data-item-level-gap",
       "--draggable-data-item-level-gap"
     ]
-  ].forEach(([C, j, R]) => {
-    const T = P(o, j) || P(o, R);
-    l[C] = T;
+  ].forEach(([g, h, p]) => {
+    const y = w(e, h) || w(e, p);
+    l[g] = y;
   });
-  const n = document.createElement("div"), g = document.createElement("div");
-  if (n.innerHTML = e, Object.assign(n.style, {
+  const u = document.createElement("div"), m = document.createElement("div");
+  if (u.innerHTML = t, Object.assign(u.style, {
     maxWidth: "12rem",
     overflow: "hidden",
     textOverflow: "ellipsis",
     whiteSpace: "nowrap"
-  }), !((L = ($ = a == null ? void 0 : a.source) == null ? void 0 : $.element) != null && L.sublevel)) {
-    const C = document.createElement("luzmo-icon");
-    C.icon = r, g.append(C);
+  }), !e.sublevel) {
+    const g = document.createElement("luzmo-icon");
+    g.icon = d, m.append(g);
   }
-  return g.append(n), Object.assign(g.style, {
+  return m.append(u), Object.assign(m.style, {
     display: "flex",
     alignItems: "center",
     maxWidth: "12rem",
@@ -118,52 +109,51 @@ const J = ":host{font-family:var(--luzmo-draggable-data-item-level-font-family,
     color: l.color,
     padding: `0 ${l.horizontalPadding}`,
     gap: l.gap
-  }), g;
+  }), m;
 };
-var Q = Object.defineProperty, s = (a, o, e, i) => {
-  for (var t = void 0, r = a.length - 1, l; r >= 0; r--)
-    (l = a[r]) && (t = l(o, e, t) || t);
-  return t && Q(o, e, t), t;
+var V = Object.defineProperty, c = (n, e, a, t) => {
+  for (var o = void 0, r = n.length - 1, d; r >= 0; r--)
+    (d = n[r]) && (o = d(e, a, o) || o);
+  return o && V(e, a, o), o;
 };
-const D = class D extends G(A, {
+const f = class f extends H(E, {
   validSizes: ["s", "m", "l", "xl"],
   noDefaultSize: !0
 }) {
   constructor() {
-    super(...arguments), this.language = "en", this.data = {}, this._isCurrentlyHighlighted = !1, this._handleHighlight = (o) => {
-      var u, v, z, p, f, y;
-      const e = o.detail ?? {}, { columnId: i, level: t, formulaId: r } = e, l = ((u = this.data) == null ? void 0 : u.columnId) ?? ((v = this.data) == null ? void 0 : v.column) ?? ((z = this.data) == null ? void 0 : z.formulaId) ?? ((p = this.data) == null ? void 0 : p.formula) ?? ((f = this.data) == null ? void 0 : f.id), n = ((y = this.data) == null ? void 0 : y.level) ?? 0, g = t ?? 0, b = (l === i || l === r) && n === g, h = (l === i || l === r) && n === 0 && g > 0, m = b || h;
-      if (this.classList.toggle("highlighted", m), m && !this._isCurrentlyHighlighted) {
+    super(...arguments), this.language = "en", this.data = {}, this._isCurrentlyHighlighted = !1, this._handleHighlight = (e) => {
+      const a = e.detail ?? {}, { columnId: t, level: o, formulaId: r } = a, d = this.data?.columnId ?? this.data?.column ?? this.data?.formulaId ?? this.data?.formula ?? this.data?.id, l = this.data?.level ?? 0, z = o ?? 0, u = (d === t || d === r) && l === z, m = (d === t || d === r) && l === 0 && z > 0, g = u || m;
+      if (this.classList.toggle("highlighted", g), g && !this._isCurrentlyHighlighted) {
         this._isCurrentlyHighlighted = !0;
-        const w = this.getBoundingClientRect(), k = window.innerHeight || document.documentElement.clientHeight;
-        if (w.top < 0 || w.bottom > k)
+        const h = this.getBoundingClientRect(), p = window.innerHeight || document.documentElement.clientHeight;
+        if (h.top < 0 || h.bottom > p)
           try {
             this.scrollIntoView({ block: "center" });
           } catch {
             this.scrollIntoView(!0);
           }
-      } else !m && this._isCurrentlyHighlighted && (this._isCurrentlyHighlighted = !1);
+      } else !g && this._isCurrentlyHighlighted && (this._isCurrentlyHighlighted = !1);
     }, this._clearHighlight = () => {
       this.classList.remove("highlighted"), this._isCurrentlyHighlighted = !1;
-    }, this.dataItemLevelDropped = (o) => {
+    }, this.dataItemLevelDropped = (e) => {
       this.dispatchEvent(
         new CustomEvent("data-item-dropped", {
           bubbles: !0,
           composed: !0,
           cancelable: !0,
           detail: {
-            data: o
+            data: e
           }
         })
       );
-    }, this.dataItemLevelDragStarted = () => {
+    }, this.dataItemLevelDragStarted = (e) => {
       this.dispatchEvent(
         new CustomEvent("data-item-drag-started", {
           bubbles: !0,
           composed: !0,
           cancelable: !0,
           detail: {
-            data: this.data
+            data: e
           }
         })
       );
@@ -176,53 +166,51 @@ const D = class D extends G(A, {
     super.connectedCallback(), window.addEventListener("slot-menu-highlight", this._handleHighlight), window.addEventListener("slot-menu-inactive", this._clearHighlight);
   }
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  firstUpdated(o) {
-    this._cleanupDraggable = V({
+  firstUpdated(e) {
+    this._cleanupDraggable = k({
       element: this,
       canDrag: () => !this.disabled,
       onDragStart: () => {
-        this.style.opacity = "0.5", this.dataItemLevelDragStarted();
+        this.style.opacity = "0.5", this.dataItemLevelDragStarted(this.data);
       },
       onDrop: () => {
         this.style.opacity = "1", this.dataItemLevelDropped(this.data);
       },
-      getInitialData: () => {
-        const e = { ...this.data };
-        return this.label && this.language && !this.sublevel && (e.label = {}, e.label[this.language] = this.label), this.description && this.language && (e.description = {}, e.description[this.language] = this.description), e;
-      },
-      onGenerateDragPreview: (e) => {
-        const i = e.nativeSetDragImage;
-        B({
-          render({ container: t }) {
-            const r = K(e);
-            t.append(r);
+      getInitialData: () => ({ ...this.data }),
+      onGenerateDragPreview: (a) => {
+        const t = a.nativeSetDragImage;
+        C({
+          render({ container: o }) {
+            const r = O(a);
+            o.append(r);
           },
-          nativeSetDragImage: i
+          nativeSetDragImage: t
         });
       }
     });
   }
   render() {
-    var t, r, l, n, g, b, h, m, u, v;
-    const o = this.label ?? ((r = (t = this.data) == null ? void 0 : t.label) == null ? void 0 : r[this.language]) ?? ((g = (l = this.data) == null ? void 0 : l.label) == null ? void 0 : g[Object.keys((n = this.data) == null ? void 0 : n.label)[0]]) ?? "Untitled", e = this.description ?? ((h = (b = this.data) == null ? void 0 : b.description) == null ? void 0 : h[this.language]) ?? ((v = (m = this.data) == null ? void 0 : m.description) == null ? void 0 : v[Object.keys((u = this.data) == null ? void 0 : u.description)[0]]), i = this.secondaryIconType ? N(this.secondaryIconType, this.size) : void 0;
-    return I`
+    if (!this.data)
+      return b`<div class="draggable-data-item-level" tabindex="0"></div>`;
+    const e = this.data.name?.[this.language] ?? this.data.name?.[Object.keys(this.data.name)[0]] ?? "Untitled", a = this.data.description?.[this.language] ?? this.data.description?.[Object.keys(this.data.description)[0]], t = $(this.data, this.size);
+    return b`
       <div class="draggable-data-item-level" tabindex="0">
         <div class="drag-handle-icon">
-          ${this.sublevel ? x(M) : x(U)}
+          ${this.sublevel ? v(I) : v(S)}
         </div>
-        ${this.sublevel || this.hideTypeIcon ? "" : I`<div class="data-icon-type">
-              <div class=${this.secondaryIconType ? "with-secondary-icon" : ""}>
-                ${x(O(this.data, this.size))}
+        ${this.sublevel || this.hideTypeIcon ? "" : b`<div class="data-icon-type">
+              <div class=${t ? "with-secondary-icon" : ""}>
+                ${v(x(this.data, this.size))}
               </div>
-              ${i ? I`<div class="secondary-icon">
-                    ${x(i)}
+              ${t ? b`<div class="secondary-icon">
+                    ${v(t)}
                   </div>` : ""}
             </div>`}
-        <div class="data-label">${o}</div>
-        ${!this.sublevel && e ? I`<button class="data-description">
-              ${x(F)}
+        <div class="data-label">${e}</div>
+        ${!this.sublevel && a ? b`<button class="data-description">
+              ${v(D)}
               <luzmo-tooltip self-managed placement="top" size=${this.size}>
-                ${e}
+                ${a}
               </luzmo-tooltip>
             </button>` : ""}
         <luzmo-tooltip
@@ -232,45 +220,36 @@ const D = class D extends G(A, {
           show-only-if-truncated
           truncated-element-selector=".data-label"
         >
-          ${o}
+          ${e}
         </luzmo-tooltip>
       </div>
     `;
   }
 };
-D.styles = q(J);
-let d = D;
-s([
-  c({ type: String, reflect: !0 })
-], d.prototype, "variant");
-s([
-  c({ type: Boolean, reflect: !0, attribute: "hide-type-icon" })
-], d.prototype, "hideTypeIcon");
-s([
-  c({ type: Boolean, reflect: !0 })
-], d.prototype, "sublevel");
-s([
-  c({ type: String, reflect: !0 })
-], d.prototype, "language");
-s([
-  c({ type: Boolean, reflect: !0 })
-], d.prototype, "disabled");
-s([
-  c({ type: String, reflect: !0 })
-], d.prototype, "label");
-s([
-  c({ type: String, reflect: !0 })
-], d.prototype, "description");
-s([
-  c({ type: String, reflect: !0, attribute: "secondary-icon-type" })
-], d.prototype, "secondaryIconType");
-s([
-  c({ type: Object })
-], d.prototype, "data");
+f.styles = _(P);
+let i = f;
+c([
+  s({ type: String, reflect: !0 })
+], i.prototype, "variant");
+c([
+  s({ type: Boolean, reflect: !0, attribute: "hide-type-icon" })
+], i.prototype, "hideTypeIcon");
+c([
+  s({ type: Boolean, reflect: !0 })
+], i.prototype, "sublevel");
+c([
+  s({ type: String, reflect: !0 })
+], i.prototype, "language");
+c([
+  s({ type: Boolean, reflect: !0 })
+], i.prototype, "disabled");
+c([
+  s({ type: Object })
+], i.prototype, "data");
 customElements.get("luzmo-draggable-data-item-level") || customElements.define(
   "luzmo-draggable-data-item-level",
-  d
+  i
 );
 export {
-  d as LuzmoDraggableDataItemLevel
+  i as LuzmoDraggableDataItemLevel
 };

package/components/draggable-data-item-level/types.d.ts

@@ -0,0 +1,12 @@
+import type { DraggableDataItemData } from '../draggable-data-item/types';
+export interface DataItemDroppedEventDetail {
+    data: DraggableDataItemData;
+}
+export interface DataItemDragStartedEventDetail {
+    data: DraggableDataItemData;
+}
+export interface SlotMenuHighlightEventDetail {
+    columnId?: string;
+    level?: number;
+    formulaId?: string;
+}

package/components/{dropdown-filter-options.config-D9dvPypF.js → dropdown-filter-options.config-CGJTtgAX.js}

@@ -17,7 +17,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-const t = [
+const l = [
   {
     key: "general",
     type: "group",
@@ -54,7 +54,7 @@ const t = [
           label: "Filter with Apply button",
           default: !1
         },
-        visibleIf: ({ options: e }) => e == null ? void 0 : e.multiselect
+        visibleIf: ({ options: e }) => e?.multiselect
       },
       {
         key: "showCheckboxes",
@@ -63,7 +63,7 @@ const t = [
           label: "Show checkboxes",
           default: !0
         },
-        visibleIf: ({ options: e }) => e == null ? void 0 : e.multiselect
+        visibleIf: ({ options: e }) => e?.multiselect
       },
       {
         key: "display.search",
@@ -72,7 +72,7 @@ const t = [
           label: "Search",
           default: !0
         },
-        visibleIf: ({ options: e }) => !(e != null && e.multiselect)
+        visibleIf: ({ options: e }) => !e?.multiselect
       },
       {
         key: "display.clear",
@@ -81,7 +81,7 @@ const t = [
           label: "Show clear selection",
           default: !0
         },
-        visibleIf: ({ options: e }) => !(e != null && e.multiselect)
+        visibleIf: ({ options: e }) => !e?.multiselect
       }
     ]
   },
@@ -121,10 +121,7 @@ const t = [
           label: "Text",
           placeholder: "Select..."
         },
-        visibleIf: ({ options: e }) => {
-          var l;
-          return ((l = e == null ? void 0 : e.display) == null ? void 0 : l.placeholder) !== !1;
-        }
+        visibleIf: ({ options: e }) => e?.display?.placeholder !== !1
       }
     ]
   },
@@ -159,5 +156,5 @@ const t = [
   }
 ];
 export {
-  t as default
+  l as default
 };

package/components/{dropdown-filter-options.config-DS-MORmq.cjs → dropdown-filter-options.config-DJvfCTk7.cjs}

@@ -17,4 +17,4 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=[{key:"general",type:"group",open:!0,children:[{key:"display.title",control:{type:"switch",label:"Title",default:!1}},{key:"display.label",control:{type:"switch",label:"Label",default:!1}},{key:"multiselect",control:{type:"switch",label:"Multiselect",default:!1}},{key:"applyFiltersWithButton",control:{type:"switch",label:"Filter with Apply button",default:!1},visibleIf:({options:e})=>e==null?void 0:e.multiselect},{key:"showCheckboxes",control:{type:"switch",label:"Show checkboxes",default:!0},visibleIf:({options:e})=>e==null?void 0:e.multiselect},{key:"display.search",control:{type:"switch",label:"Search",default:!0},visibleIf:({options:e})=>!(e!=null&&e.multiselect)},{key:"display.clear",control:{type:"switch",label:"Show clear selection",default:!0},visibleIf:({options:e})=>!(e!=null&&e.multiselect)}]},{key:"order",type:"group",open:!1,children:[{key:"sort.direction",control:{type:"picker",label:"Ordering",default:"asc",enum:["asc","desc"]}}]},{key:"placeholder",type:"group",open:!0,children:[{key:"display.placeholder",control:{type:"switch",label:"Display",default:!0}},{key:"placeholder",control:{type:"multi-language-field",label:"Text",placeholder:"Select..."},visibleIf:({options:e})=>{var l;return((l=e==null?void 0:e.display)==null?void 0:l.placeholder)!==!1}}]},{key:"padding",type:"group",open:!1,children:[{key:"padding.left",control:{label:"Padding left",type:"number-field",default:16,min:0,max:100,step:1}},{key:"padding.right",control:{label:"Padding right",type:"number-field",default:16,min:0,max:100,step:1}}]}];exports.default=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=[{key:"general",type:"group",open:!0,children:[{key:"display.title",control:{type:"switch",label:"Title",default:!1}},{key:"display.label",control:{type:"switch",label:"Label",default:!1}},{key:"multiselect",control:{type:"switch",label:"Multiselect",default:!1}},{key:"applyFiltersWithButton",control:{type:"switch",label:"Filter with Apply button",default:!1},visibleIf:({options:e})=>e?.multiselect},{key:"showCheckboxes",control:{type:"switch",label:"Show checkboxes",default:!0},visibleIf:({options:e})=>e?.multiselect},{key:"display.search",control:{type:"switch",label:"Search",default:!0},visibleIf:({options:e})=>!e?.multiselect},{key:"display.clear",control:{type:"switch",label:"Show clear selection",default:!0},visibleIf:({options:e})=>!e?.multiselect}]},{key:"order",type:"group",open:!1,children:[{key:"sort.direction",control:{type:"picker",label:"Ordering",default:"asc",enum:["asc","desc"]}}]},{key:"placeholder",type:"group",open:!0,children:[{key:"display.placeholder",control:{type:"switch",label:"Display",default:!0}},{key:"placeholder",control:{type:"multi-language-field",label:"Text",placeholder:"Select..."},visibleIf:({options:e})=>e?.display?.placeholder!==!1}]},{key:"padding",type:"group",open:!1,children:[{key:"padding.left",control:{label:"Padding left",type:"number-field",default:16,min:0,max:100,step:1}},{key:"padding.right",control:{label:"Padding right",type:"number-field",default:16,min:0,max:100,step:1}}]}];exports.default=l;

package/components/droppable-slot/droppable-slot.d.ts

@@ -4,13 +4,14 @@ import '@luzmo/lucero/tooltip';
 import { PropertyValues } from 'lit';
 import { LuzmoElement } from '../../utils/base';
 import './../slot-menu';
+import type { DroppableSlotConfiguration } from './types';
 declare const LuzmoDroppableSlot_base: typeof LuzmoElement & {
     new (...args: any[]): import("../../utils/base/sized-mixin").SizedElementInterface;
     prototype: import("../../utils/base/sized-mixin").SizedElementInterface;
 };
 /**
  * @element luzmo-droppable-slot
- * @fires slot-contents-changed - Announces that the slot contents has changed
+ * @fires {CustomEvent<SlotContentsChangedEventDetail>} slot-contents-changed - Announces that the slot contents has changed
  */
 export declare class LuzmoDroppableSlot extends LuzmoDroppableSlot_base {
     static styles: import("lit").CSSResult;
@@ -19,11 +20,12 @@ export declare class LuzmoDroppableSlot extends LuzmoDroppableSlot_base {
     private _slotsConfig?;
     itemType?: VizItemType;
     slotName?: SlotName;
-    slotConfiguration: any;
+    slotConfiguration: DroppableSlotConfiguration;
     slotsContents: VizItemSlots;
     label?: string;
     language: string;
     dragBoundary?: string;
+    rotate: boolean;
     /**
      * The API URL of the databroker
      * @default https://api.luzmo.com