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

package/components/droppable-slot/index.js

@@ -17,34 +17,58 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-import { a as _ } from "../get-css-variable-DEf4GhTH.js";
-import { ContextProvider as x } from "@lit/context";
-import { msg as c, localized as D } from "@lit/localize";
-import { Task as k } from "@lit/task";
-import { luzmoIcon as b, luzmoCog as w, luzmoTrashOutline as S } from "@luzmo/icons";
+import { a as w } from "../get-css-variable-CdwF98oh.js";
+import { ContextProvider as k } from "@lit/context";
+import { msg as m, localized as S } from "@lit/localize";
+import { Task as A } from "@lit/task";
+import { luzmoIcon as z, luzmoCog as E, luzmoTrashOutline as L } from "@luzmo/icons";
 import "@luzmo/lucero/tooltip";
-import { d as f } from "../index-BGb_wRRW.js";
-import { l as E } from "../localize-CcDpq940.js";
-import { html as d, unsafeCSS as A } from "lit";
-import { property as n, query as v, state as y } from "lit/decorators.js";
-import { L } from "../focusable-BS2pbY7w.js";
-import { S as $ } from "../sized-mixin-cJbo3PKR.js";
-import { s as T } from "../index-3WsfvkZF.js";
-import { signal as u, computed as I } from "@lit-labs/signals";
-import { P as h } from "../types-RxAJdtVT.js";
-import { g as O, t as M, s as U } from "../set-locale-hKTMz37h.js";
+import { d as y } from "../index-DNPULp4A.js";
+import { i as c, l as I } from "../localize-CcDpq940.js";
+import { D as $ } from "../en-D3ihEGXg.js";
+import { html as d, unsafeCSS as O } from "lit";
+import { property as n, query as _, state as x } from "lit/decorators.js";
+import { L as T } from "../focusable-BS2pbY7w.js";
+import { S as M } from "../sized-mixin-cJbo3PKR.js";
+import { s as U } from "../index-CqKpf0B8.js";
+import { signal as h, computed as F } from "@lit-labs/signals";
+import { P as g } from "../types-RxAJdtVT.js";
+import { g as P, t as B, s as G } from "../set-locale-hKTMz37h.js";
 import "../slot-menu/index.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 t = document.createElement("style");
+    t.setAttribute("data-luzmo-vars", ""), t.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(t);
   }
 })();
-class P {
+const R = (o, t) => {
+  const e = {
+    type: o.type,
+    datasetId: o.datasetId,
+    set: o.datasetId
+    // TODO: Remove this once column/set -> columnId/datasetId migration is fully done.
+  };
+  "columnId" in o && !c(o.columnId) && o.columnId !== "" ? (e.columnId = o.columnId, e.column = o.columnId) : "formulaId" in o && !c(o.formulaId) && o.formulaId !== "" && (e.formulaId = o.formulaId, e.formula = o.formulaId);
+  const l = o.type === "datetime" || o.type === "array[datetime]", r = { ...o.name ?? { en: "Untitled" } };
+  let i = o.level;
+  if (l && (i = i ?? o.lowestLevel ?? 9, t)) {
+    const p = $.shortLevels?.filter((b) => b !== "All") ?? [], u = Math.max(0, Math.min(p.length - 1, (i ?? 1) - 1)), f = p[u];
+    if (f) {
+      const b = `(${f})`, D = Object.keys(r);
+      for (const v of D)
+        r[v] = `${r[v]} ${b}`;
+    }
+  }
+  return e.label = r, c(o.subtype) || (e.subtype = o.subtype), "lowestLevel" in o && !c(o.lowestLevel) && (e.lowestLevel = o.lowestLevel), c(o.format) || (e.format = o.format), c(i) || (e.level = i), c(o.lowestLevel) || (e.lowestLevel = o.lowestLevel), o.type === "numeric" && o.subtype === "currency" && o.currency?.symbol && (e.currency = o.currency.symbol), Array.isArray(o.duration_levels) && o.duration_format && (e.duration = {
+    levels: o.duration_levels,
+    format: o.duration_format
+  }), e;
+};
+class N {
   constructor() {
-    this.slotContents = u([]), this.slotsContents = u([]), this.periodOverPeriodUiType = u(
+    this.slotContents = h([]), this.slotsContents = h([]), this.periodOverPeriodUiType = h(
       null
-    ), this.linkedDataset = u(
+    ), this.linkedDataset = h(
       []
     ), this._popEnabledChartTypes = [
       "area-chart",
@@ -52,36 +76,31 @@ class P {
       "combination-chart",
       "column-chart",
       "line-chart"
-    ], this.activeSlotContents = I(() => this.slotContents.get()[this.activeIndex.get()]), this.activeIndex = u(0);
+    ], this.activeSlotContents = F(() => this.slotContents.get()[this.activeIndex.get()]), this.activeIndex = h(0);
   }
-  isArrayColumnType(o) {
-    return (/* @__PURE__ */ new Set([
-      "array[numeric]",
-      "array[spatial]",
-      "array[datetime]",
-      "array[hierarchy]"
-    ])).has(o);
+  isArrayColumnType(t) {
+    return t.startsWith("array[");
   }
-  setPeriodOverPeriodCondition(o, e) {
+  setPeriodOverPeriodCondition(t, e) {
     if (!e?.periodOverPeriod?.newUi) {
-      this.periodOverPeriodUiType.set(this.oldConditionalLogic(o));
+      this.periodOverPeriodUiType.set(this.oldConditionalLogic(t));
       return;
     }
     this.periodOverPeriodUiType.set(
       this.getUiConditionToApply(e)
     );
   }
-  getUiConditionToApply(o) {
-    const e = this.hasDatetimeColumnOnCategoryOrXAxis(), l = o?.periodOverPeriod?.hasConnectedComparisonFilter, r = this.linkedDataset.get().some(
+  getUiConditionToApply(t) {
+    const e = this.hasDatetimeColumnOnCategoryOrXAxis(), l = t?.periodOverPeriod?.hasConnectedComparisonFilter, r = this.linkedDataset.get().some(
       ({ columns: i }) => i?.some((p) => p.type === "datetime")
     );
-    return !e && !l && !r ? null : e && l ? h.HasDatetimeColumnAndComparisonFilters : e && !l ? h.HasDatetimeColumnAndNoComparisonFilters : !e && l ? h.NoDatetimeColumnButComparisonFilters : h.NoDatetimeColumnAndNoComparisonFilters;
+    return !e && !l && !r ? null : e && l ? g.HasDatetimeColumnAndComparisonFilters : e && !l ? g.HasDatetimeColumnAndNoComparisonFilters : !e && l ? g.NoDatetimeColumnButComparisonFilters : g.NoDatetimeColumnAndNoComparisonFilters;
   }
-  oldConditionalLogic(o) {
+  oldConditionalLogic(t) {
     const e = this.slotsContents.get() ?? [], r = (e.find(
-      (m) => ["y-axis", "x-axis", "row"].includes(m.name)
-    )?.content ?? [])?.[0] ?? null, i = e.find((m) => m.name === "measure")?.content ?? [];
-    return r && this._popEnabledChartTypes.includes(o) && r.type === "datetime" && !this.isArrayColumnType(r.type) && !r.datetimeDisplayMode && r.level !== 4 && i.length > 0 ? h.OldImplementation : null;
+      (u) => ["y-axis", "x-axis", "row"].includes(u.name)
+    )?.content ?? [])?.[0] ?? null, i = e.find((u) => u.name === "measure")?.content ?? [];
+    return r && this._popEnabledChartTypes.includes(t) && r.type === "datetime" && !this.isArrayColumnType(r.type) && !r.datetimeDisplayMode && r.level !== 4 && i.length > 0 ? g.OldImplementation : null;
   }
   /**
    * Detects if there's a datetime column on Category or X-axis slots
@@ -93,54 +112,54 @@ class P {
     return !!(l && l.type === "datetime" && !this.isArrayColumnType(l.type));
   }
   /** Replace the full list (e.g. after dropping or re-ordering). */
-  setContents(o, e) {
-    if (this.slotContents.set(o), this.activeIndex.get() >= o.length && this.activeIndex.set(o.length > 0 ? o.length - 1 : 0), e) {
+  setContents(t, e) {
+    if (this.slotContents.set(t), this.activeIndex.get() >= t.length && this.activeIndex.set(t.length > 0 ? t.length - 1 : 0), e) {
       const l = structuredClone(this.slotsContents.get()) ?? [], r = l.find((i) => i.name === e);
-      r && (r.content = o), this.setFullContents(l);
+      r && (r.content = t), this.setFullContents(l);
     }
   }
-  setFullContents(o) {
-    this.slotsContents.set(o);
+  setFullContents(t) {
+    this.slotsContents.set(t);
   }
   /** Change which item is considered active (e.g. user clicked in list). */
-  updateActive(o) {
-    o >= 0 && o < this.slotContents.get().length && this.activeIndex.set(o);
+  updateActive(t) {
+    t >= 0 && t < this.slotContents.get().length && this.activeIndex.set(t);
   }
   /** Update / overwrite a single content entry. */
-  updateContent(o, e = this.activeIndex.get()) {
+  updateContent(t, e = this.activeIndex.get()) {
     if (e < 0 || e >= this.slotContents.get().length) return;
     const l = [...this.slotContents.get()];
-    l[e] = structuredClone(o), this.slotContents.set(l);
+    l[e] = structuredClone(t), this.slotContents.set(l);
   }
   /** Remove one content entry by index. */
-  removeContent(o) {
-    if (o < 0 || o >= this.slotContents.get().length) return;
-    const e = this.slotContents.get().filter((l, r) => r !== o);
+  removeContent(t) {
+    if (t < 0 || t >= this.slotContents.get().length) return;
+    const e = this.slotContents.get().filter((l, r) => r !== t);
     this.slotContents.set(e), this.activeIndex.get() >= e.length && this.activeIndex.set(e.length > 0 ? e.length - 1 : 0);
   }
 }
-const G = ":host{font-family:var(--luzmo-droppable-slot-font-family, var(--luzmo-font-family));--slot-height: var( --luzmo-droppable-slot-height, var(--droppable-slot-height) )}.droppable-slot-wrapper{position:relative;width:var(--slot-height);min-width:var(--slot-height);height:auto;overflow:visible}.droppable-slot[filled]{border:var(--luzmo-droppable-slot-filled-border-width, var(--droppable-slot-filled-border-width)) var(--luzmo-droppable-slot-filled-border-style, var(--droppable-slot-filled-border-style)) var(--luzmo-droppable-slot-filled-border-color, var(--droppable-slot-filled-border-color));background-color:var(--luzmo-droppable-slot-filled-background-color, var(--droppable-slot-filled-background-color));color:var(--luzmo-droppable-slot-filled-color, var(--droppable-slot-filled-color));padding-right:0;gap:var(--luzmo-droppable-slot-filled-gap, var(--droppable-slot-filled-gap))}.droppable-slot[filled]>*:not(luzmo-overlay){cursor:pointer}.droppable-slot{background-color:var(--luzmo-droppable-slot-background-color, var(--droppable-slot-background-color));color:var(--luzmo-droppable-slot-font-color, var(--droppable-slot-font-color));border:var(--luzmo-droppable-slot-border-width, var(--droppable-slot-border-width)) var(--luzmo-droppable-slot-border-style, var(--droppable-slot-border-style)) var(--luzmo-droppable-slot-border-color, var(--droppable-slot-border-color));display:flex;justify-content:space-between;align-items:center;padding-left:var(--luzmo-droppable-slot-edge-to-label, var(--droppable-slot-edge-to-label));padding-right:var(--luzmo-droppable-slot-label-to-controls, var(--droppable-slot-label-to-controls));border-radius:var(--luzmo-droppable-slot-border-radius, var(--droppable-slot-border-radius));height:var(--luzmo-droppable-slot-height, var(--droppable-slot-height))}:host(.pulse) .droppable-slot{animation:dropelementpulse 1s infinite ease-in-out}:host([accept-drag]) .droppable-slot{background-color:var(--luzmo-droppable-slot-accept-drag-background-color, var(--droppable-slot-accept-drag-background-color));color:var(--luzmo-droppable-slot-accept-drag-font-color, var(--droppable-slot-accept-drag-font-color));border-color:var(--luzmo-droppable-slot-accept-drag-border-color, var(--droppable-slot-accept-drag-border-color));animation:dropelementpulse 1s infinite ease-in-out}:host([accept-drag]) .controls{background-color:var(--luzmo-droppable-slot-accept-drag-controls-background-color, var(--droppable-slot-accept-drag-controls-background-color));color:var(--luzmo-droppable-slot-accept-drag-controls-color, var(--droppable-slot-accept-drag-controls-color))}:host([would-accept-drag]) .droppable-slot:not([filled]){animation:var(--luzmo-slot-would-accept-drop-animation, none)}@keyframes dropelementpulse{0%{box-shadow:0 0 0 0 var(--luzmo-droppable-slot-pulse-color, var(--droppable-slot-pulse-color)),0 0 0 0 var(--luzmo-droppable-slot-pulse-color, var(--droppable-slot-pulse-color))}to{box-shadow:0 0 0 1rem transparent,0 0 0 1rem transparent}}:host([disabled]) .droppable-slot{background-color:var(--luzmo-droppable-slot-background-color-disabled, var(--droppable-slot-background-color-disabled));color:var(--luzmo-droppable-slot-color-disabled, var(--droppable-slot-color-disabled));cursor:not-allowed}:host([disabled]) .drag-handle-icon{opacity:.25;font-size:12px}.drag-handle-icon{opacity:.5;font-size:12px}.droppable-slot-label{font-size:var(--luzmo-droppable-slot-label-font-size, var(--droppable-slot-label-font-size));padding-top:var(--luzmo-droppable-slot-label-padding-top, var(--droppable-slot-label-padding-top));padding-bottom:var(--luzmo-droppable-slot-label-padding-bottom, var(--droppable-slot-label-padding-bottom));flex-grow:1;max-width:var(--luzmo-droppable-slot-label-max-width);margin-right:var(--luzmo-droppable-slot-text-to-controls, var(--droppable-slot-text-to-controls));overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.controls{height:100%;display:flex;align-items:center;gap:var(--luzmo-droppable-slot-controls-gap, var(--droppable-slot-controls-gap));background-color:var(--luzmo-droppable-slot-controls-background-color, var(--droppable-slot-controls-background-color));color:var(--luzmo-droppable-slot-controls-color, var(--droppable-slot-controls-color));margin-right:var(--luzmo-droppable-slot-controls-to-edge, var(--droppable-slot-controls-to-edge));padding:0 var(--luzmo-droppable-slot-controls-horizontal-padding, var(--droppable-slot-controls-horizontal-padding));font-size:var(--luzmo-droppable-slot-controls-font-size)}.controls div{cursor:pointer;height:100%;display:flex;align-items:center;padding:0 var(--luzmo-droppable-slot-controls-control-horizontal-padding, var(--droppable-slot-controls-control-horizontal-padding))}.droppable-slot.rotate{position:absolute;top:0;left:50%;transform-origin:center;max-width:15rem;transform:translate(-50%) rotate(-90deg)}luzmo-slot-menu[placement=bottom],luzmo-slot-menu[placement=top],luzmo-slot-menu[placement=bottom-start],luzmo-slot-menu[placement=top-start],luzmo-slot-menu[placement=bottom-end],luzmo-slot-menu[placement=top-end]{margin:var(--luzmo-droppable-slot-overlay-vertical-gap, var(--droppable-slot-overlay-vertical-gap)) 0}luzmo-slot-menu[placement=left],luzmo-slot-menu[placement=right],luzmo-slot-menu[placement=left-start],luzmo-slot-menu[placement=right-start],luzmo-slot-menu[placement=left-end],luzmo-slot-menu[placement=right-end]{margin:0 var(--luzmo-droppable-slot-overlay-horizontal-gap, var(--droppable-slot-overlay-horizontal-gap))}:host{--droppable-slot-border-width: var(--luzmo-border-width);--droppable-slot-border-style: dashed;--droppable-slot-border-color: var(--luzmo-border-color);--droppable-slot-background-color: transparent;--droppable-slot-accept-drag-background-color: var(--luzmo-positive-color);--droppable-slot-accept-drag-color: white;--droppable-slot-accept-drag-border-color: var(--luzmo-positive-color-down);--droppable-slot-accept-drag-font-color: white;--droppable-slot-font-color: var(--luzmo-font-color);--droppable-slot-controls-background-color: var(--luzmo-primary-down);--droppable-slot-controls-color: var(--luzmo-primary-inverse-color);--droppable-slot-accept-drag-controls-background-color: var( --luzmo-positive-color-down );--droppable-slot-accept-drag-controls-color: white;--droppable-slot-text-to-controls: var(--luzmo-spacing-3);--droppable-slot-controls-to-edge: 0;--droppable-slot-controls-gap: var(--luzmo-spacing-2);--droppable-slot-controls-horizontal-padding: var(--luzmo-spacing-2);--droppable-slot-controls-control-horizontal-padding: var(--luzmo-spacing-3);--droppable-slot-filled-background-color: var(--luzmo-primary);--droppable-slot-filled-color: var(--luzmo-primary-inverse-color);--droppable-slot-filled-border-width: var(--luzmo-border-width);--droppable-slot-filled-border-style: solid;--droppable-slot-filled-border-color: var(--luzmo-primary-down);--droppable-slot-height: var( --luzmo-droppable-slot-height, var(--luzmo-component-height) );--droppable-slot-label-font-size: var(--luzmo-font-size);--droppable-slot-icon-type-font-size: var(--luzmo-font-size);--droppable-slot-edge-to-label: var(--luzmo-spacing-5);--droppable-slot-label-to-controls: var(--luzmo-spacing-5);--droppable-slot-color-disabled: var(--luzmo-color-disabled);--droppable-slot-background-color-disabled: var( --luzmo-background-color-disabled );--droppable-slot-pulse-color: var(--luzmo-secondary-outline);--droppable-slot-border-radius: var(--luzmo-border-radius);--droppable-slot-filled-gap: var(--luzmo-spacing-5)}:host{--droppable-slot-height: var( --luzmo-droppable-slot-height, var(--luzmo-component-height) );--droppable-slot-label-font-size: var(--luzmo-font-size);--droppable-slot-icon-type-font-size: var(--luzmo-font-size);--droppable-slot-horizontal-padding: var(--luzmo-spacing-4);--droppable-slot-overlay-horizontal-gap: var(--luzmo-spacing-4);--droppable-slot-overlay-vertical-gap: var(--luzmo-spacing-4)}:host([size=s]){--droppable-slot-height: var( --luzmo-droppable-slot-height, var(--luzmo-component-height-s) );--droppable-slot-label-font-size: var(--luzmo-font-size-s);--droppable-slot-icon-type-font-size: var(--luzmo-font-size-s);--droppable-slot-horizontal-padding: var(--luzmo-spacing-4);--droppable-slot-overlay-horizontal-gap: var(--luzmo-spacing-4);--droppable-slot-overlay-vertical-gap: var(--luzmo-spacing-4)}:host([size=l]){--droppable-slot-height: var( --luzmo-droppable-slot-height, var(--luzmo-component-height-l) );--droppable-slot-label-font-size: var(--luzmo-font-size-l);--droppable-slot-icon-type-font-size: var(--luzmo-font-size-l);--droppable-slot-horizontal-padding: var(--luzmo-spacing-5);--droppable-slot-overlay-horizontal-gap: var(--luzmo-spacing-5);--droppable-slot-overlay-vertical-gap: var(--luzmo-spacing-5)}:host([size=xl]){--droppable-slot-height: var( --luzmo-droppable-slot-height, var(--luzmo-component-height-xl) );--droppable-slot-label-font-size: var(--luzmo-font-size-xl);--droppable-slot-icon-type-font-size: var(--luzmo-font-size-xl);--droppable-slot-horizontal-padding: var(--luzmo-spacing-5);--droppable-slot-overlay-horizontal-gap: var(--luzmo-spacing-5);--droppable-slot-overlay-vertical-gap: var(--luzmo-spacing-5)}:host{box-sizing:border-box}", z = {
-  Category: () => c("Category", { desc: "Category label" }),
-  Measure: () => c("Measure", { desc: "Measure label" }),
-  Legend: () => c("Legend", { desc: "Legend label" }),
-  "Y-Axis": () => c("Y-Axis", { desc: "Y-Axis label" }),
-  "X-Axis": () => c("X-Axis", { desc: "X-Axis label" }),
-  "Group by": () => c("Group by", { desc: "Group by label" })
+const j = ":host{font-family:var(--luzmo-droppable-slot-font-family, var(--luzmo-font-family));--slot-height: var( --luzmo-droppable-slot-height, var(--droppable-slot-height) )}.droppable-slot-wrapper{position:relative;width:var(--slot-height);min-width:var(--slot-height);height:auto;overflow:visible}.droppable-slot[filled]{border:var(--luzmo-droppable-slot-filled-border-width, var(--droppable-slot-filled-border-width)) var(--luzmo-droppable-slot-filled-border-style, var(--droppable-slot-filled-border-style)) var(--luzmo-droppable-slot-filled-border-color, var(--droppable-slot-filled-border-color));background-color:var(--luzmo-droppable-slot-filled-background-color, var(--droppable-slot-filled-background-color));color:var(--luzmo-droppable-slot-filled-color, var(--droppable-slot-filled-color));padding-right:0;gap:var(--luzmo-droppable-slot-filled-gap, var(--droppable-slot-filled-gap))}.droppable-slot[filled]>*:not(luzmo-overlay){cursor:pointer}.droppable-slot{background-color:var(--luzmo-droppable-slot-background-color, var(--droppable-slot-background-color));color:var(--luzmo-droppable-slot-font-color, var(--droppable-slot-font-color));border:var(--luzmo-droppable-slot-border-width, var(--droppable-slot-border-width)) var(--luzmo-droppable-slot-border-style, var(--droppable-slot-border-style)) var(--luzmo-droppable-slot-border-color, var(--droppable-slot-border-color));display:flex;justify-content:space-between;align-items:center;padding-left:var(--luzmo-droppable-slot-edge-to-label, var(--droppable-slot-edge-to-label));padding-right:var(--luzmo-droppable-slot-label-to-controls, var(--droppable-slot-label-to-controls));border-radius:var(--luzmo-droppable-slot-border-radius, var(--droppable-slot-border-radius));height:var(--luzmo-droppable-slot-height, var(--droppable-slot-height))}:host(.pulse) .droppable-slot{animation:dropelementpulse 1s infinite ease-in-out}:host([accept-drag]) .droppable-slot{background-color:var(--luzmo-droppable-slot-accept-drag-background-color, var(--droppable-slot-accept-drag-background-color));color:var(--luzmo-droppable-slot-accept-drag-font-color, var(--droppable-slot-accept-drag-font-color));border-color:var(--luzmo-droppable-slot-accept-drag-border-color, var(--droppable-slot-accept-drag-border-color));animation:dropelementpulse 1s infinite ease-in-out}:host([accept-drag]) .controls{background-color:var(--luzmo-droppable-slot-accept-drag-controls-background-color, var(--droppable-slot-accept-drag-controls-background-color));color:var(--luzmo-droppable-slot-accept-drag-controls-color, var(--droppable-slot-accept-drag-controls-color))}:host([would-accept-drag]) .droppable-slot:not([filled]){animation:var(--luzmo-slot-would-accept-drop-animation, none)}@keyframes dropelementpulse{0%{box-shadow:0 0 0 0 var(--luzmo-droppable-slot-pulse-color, var(--droppable-slot-pulse-color)),0 0 0 0 var(--luzmo-droppable-slot-pulse-color, var(--droppable-slot-pulse-color))}to{box-shadow:0 0 0 1rem transparent,0 0 0 1rem transparent}}:host([disabled]) .droppable-slot{background-color:var(--luzmo-droppable-slot-background-color-disabled, var(--droppable-slot-background-color-disabled));color:var(--luzmo-droppable-slot-color-disabled, var(--droppable-slot-color-disabled));cursor:not-allowed}:host([disabled]) .drag-handle-icon{opacity:.25;font-size:12px}.drag-handle-icon{opacity:.5;font-size:12px}.droppable-slot-label{font-size:var(--luzmo-droppable-slot-label-font-size, var(--droppable-slot-label-font-size));padding-top:var(--luzmo-droppable-slot-label-padding-top, var(--droppable-slot-label-padding-top));padding-bottom:var(--luzmo-droppable-slot-label-padding-bottom, var(--droppable-slot-label-padding-bottom));flex-grow:1;max-width:var(--luzmo-droppable-slot-label-max-width);margin-right:var(--luzmo-droppable-slot-text-to-controls, var(--droppable-slot-text-to-controls));overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.controls{height:100%;display:flex;align-items:center;gap:var(--luzmo-droppable-slot-controls-gap, var(--droppable-slot-controls-gap));background-color:var(--luzmo-droppable-slot-controls-background-color, var(--droppable-slot-controls-background-color));color:var(--luzmo-droppable-slot-controls-color, var(--droppable-slot-controls-color));margin-right:var(--luzmo-droppable-slot-controls-to-edge, var(--droppable-slot-controls-to-edge));padding:0 var(--luzmo-droppable-slot-controls-horizontal-padding, var(--droppable-slot-controls-horizontal-padding));font-size:var(--luzmo-droppable-slot-controls-font-size)}.controls div{cursor:pointer;height:100%;display:flex;align-items:center;padding:0 var(--luzmo-droppable-slot-controls-control-horizontal-padding, var(--droppable-slot-controls-control-horizontal-padding))}.droppable-slot.rotate{position:absolute;top:0;left:50%;transform-origin:center;max-width:15rem;transform:translate(-50%) rotate(-90deg)}luzmo-slot-menu[placement=bottom],luzmo-slot-menu[placement=top],luzmo-slot-menu[placement=bottom-start],luzmo-slot-menu[placement=top-start],luzmo-slot-menu[placement=bottom-end],luzmo-slot-menu[placement=top-end]{margin:var(--luzmo-droppable-slot-overlay-vertical-gap, var(--droppable-slot-overlay-vertical-gap)) 0}luzmo-slot-menu[placement=left],luzmo-slot-menu[placement=right],luzmo-slot-menu[placement=left-start],luzmo-slot-menu[placement=right-start],luzmo-slot-menu[placement=left-end],luzmo-slot-menu[placement=right-end]{margin:0 var(--luzmo-droppable-slot-overlay-horizontal-gap, var(--droppable-slot-overlay-horizontal-gap))}:host{--droppable-slot-border-width: var(--luzmo-border-width);--droppable-slot-border-style: dashed;--droppable-slot-border-color: var(--luzmo-border-color);--droppable-slot-background-color: transparent;--droppable-slot-accept-drag-background-color: var(--luzmo-positive-color);--droppable-slot-accept-drag-color: white;--droppable-slot-accept-drag-border-color: var(--luzmo-positive-color-down);--droppable-slot-accept-drag-font-color: white;--droppable-slot-font-color: var(--luzmo-font-color);--droppable-slot-controls-background-color: var(--luzmo-primary-down);--droppable-slot-controls-color: var(--luzmo-primary-inverse-color);--droppable-slot-accept-drag-controls-background-color: var( --luzmo-positive-color-down );--droppable-slot-accept-drag-controls-color: white;--droppable-slot-text-to-controls: var(--luzmo-spacing-3);--droppable-slot-controls-to-edge: 0;--droppable-slot-controls-gap: var(--luzmo-spacing-2);--droppable-slot-controls-horizontal-padding: var(--luzmo-spacing-2);--droppable-slot-controls-control-horizontal-padding: var(--luzmo-spacing-3);--droppable-slot-filled-background-color: var(--luzmo-primary);--droppable-slot-filled-color: var(--luzmo-primary-inverse-color);--droppable-slot-filled-border-width: var(--luzmo-border-width);--droppable-slot-filled-border-style: solid;--droppable-slot-filled-border-color: var(--luzmo-primary-down);--droppable-slot-height: var( --luzmo-droppable-slot-height, var(--luzmo-component-height) );--droppable-slot-label-font-size: var(--luzmo-font-size);--droppable-slot-icon-type-font-size: var(--luzmo-font-size);--droppable-slot-edge-to-label: var(--luzmo-spacing-5);--droppable-slot-label-to-controls: var(--luzmo-spacing-5);--droppable-slot-color-disabled: var(--luzmo-color-disabled);--droppable-slot-background-color-disabled: var( --luzmo-background-color-disabled );--droppable-slot-pulse-color: rgba(var(--luzmo-positive-color-rgb), .2);--droppable-slot-border-radius: var(--luzmo-border-radius);--droppable-slot-filled-gap: var(--luzmo-spacing-5)}:host{--droppable-slot-height: var( --luzmo-droppable-slot-height, var(--luzmo-component-height) );--droppable-slot-label-font-size: var(--luzmo-font-size);--droppable-slot-icon-type-font-size: var(--luzmo-font-size);--droppable-slot-horizontal-padding: var(--luzmo-spacing-4);--droppable-slot-overlay-horizontal-gap: var(--luzmo-spacing-4);--droppable-slot-overlay-vertical-gap: var(--luzmo-spacing-4)}:host([size=s]){--droppable-slot-height: var( --luzmo-droppable-slot-height, var(--luzmo-component-height-s) );--droppable-slot-label-font-size: var(--luzmo-font-size-s);--droppable-slot-icon-type-font-size: var(--luzmo-font-size-s);--droppable-slot-horizontal-padding: var(--luzmo-spacing-4);--droppable-slot-overlay-horizontal-gap: var(--luzmo-spacing-4);--droppable-slot-overlay-vertical-gap: var(--luzmo-spacing-4)}:host([size=l]){--droppable-slot-height: var( --luzmo-droppable-slot-height, var(--luzmo-component-height-l) );--droppable-slot-label-font-size: var(--luzmo-font-size-l);--droppable-slot-icon-type-font-size: var(--luzmo-font-size-l);--droppable-slot-horizontal-padding: var(--luzmo-spacing-5);--droppable-slot-overlay-horizontal-gap: var(--luzmo-spacing-5);--droppable-slot-overlay-vertical-gap: var(--luzmo-spacing-5)}:host([size=xl]){--droppable-slot-height: var( --luzmo-droppable-slot-height, var(--luzmo-component-height-xl) );--droppable-slot-label-font-size: var(--luzmo-font-size-xl);--droppable-slot-icon-type-font-size: var(--luzmo-font-size-xl);--droppable-slot-horizontal-padding: var(--luzmo-spacing-5);--droppable-slot-overlay-horizontal-gap: var(--luzmo-spacing-5);--droppable-slot-overlay-vertical-gap: var(--luzmo-spacing-5)}:host{box-sizing:border-box}", C = {
+  Category: () => m("Category", { desc: "Category label" }),
+  Measure: () => m("Measure", { desc: "Measure label" }),
+  Legend: () => m("Legend", { desc: "Legend label" }),
+  "Y-Axis": () => m("Y-Axis", { desc: "Y-Axis label" }),
+  "X-Axis": () => m("X-Axis", { desc: "X-Axis label" }),
+  "Group by": () => m("Group by", { desc: "Group by label" })
 };
-var B = Object.defineProperty, F = Object.getOwnPropertyDescriptor, s = (t, o, e, l) => {
-  for (var r = l > 1 ? void 0 : l ? F(o, e) : o, i = t.length - 1, p; i >= 0; i--)
-    (p = t[i]) && (r = (l ? p(o, e, r) : p(r)) || r);
-  return l && r && B(o, e, r), r;
+var H = Object.defineProperty, V = Object.getOwnPropertyDescriptor, a = (o, t, e, l) => {
+  for (var r = l > 1 ? void 0 : l ? V(t, e) : t, i = o.length - 1, p; i >= 0; i--)
+    (p = o[i]) && (r = (l ? p(t, e, r) : p(r)) || r);
+  return l && r && H(t, e, r), r;
 };
-let a = class extends $(L, {
+let s = class extends M(T, {
   validSizes: ["s", "m", "l", "xl"],
   noDefaultSize: !0
 }) {
   constructor() {
-    super(), this._loadSlotsConfig = new k(this, {
-      task: async ([t]) => {
-        if (t && t !== this._itemTypeLoaded) {
-          const o = /* @__PURE__ */ Object.assign({
+    super(), this._loadSlotsConfig = new A(this, {
+      task: async ([o]) => {
+        if (o && o !== this._itemTypeLoaded) {
+          const t = /* @__PURE__ */ Object.assign({
             "../../item-definitions/area-chart/area-chart-slots.config.ts": () => import("../area-chart-slots.config-DoytjTpw.js"),
             "../../item-definitions/bar-chart/bar-chart-slots.config.ts": () => import("../bar-chart-slots.config-Dn0IV43j.js"),
             "../../item-definitions/box-plot/box-plot-slots.config.ts": () => import("../box-plot-slots.config-FI5Id-7p.js"),
@@ -186,16 +205,16 @@ let a = class extends $(L, {
             "../../item-definitions/venn-diagram/venn-diagram-slots.config.ts": () => import("../venn-diagram-slots.config-BPxkBFb6.js"),
             "../../item-definitions/video/video-slots.config.ts": () => import("../video-slots.config-IpwUxDyU.js"),
             "../../item-definitions/wordcloud-chart/wordcloud-chart-slots.config.ts": () => import("../wordcloud-chart-slots.config-BS4sOOHt.js")
-          }), e = `../../item-definitions/${t}/${t}-slots.config.ts`;
-          if (o[e]) {
-            const l = await o[e]();
-            this._itemTypeLoaded = t, this._slotsConfig = l?.default ?? {};
+          }), e = `../../item-definitions/${o}/${o}-slots.config.ts`;
+          if (t[e]) {
+            const l = await t[e]();
+            this._itemTypeLoaded = o, this._slotsConfig = l?.default ?? {};
           }
           return this._slotsConfig;
         }
       },
       args: () => [this.itemType, this.language]
-    }), this.slotConfiguration = {}, this.slotsContents = [], this.language = "en", this.apiUrl = "https://api.luzmo.com", this.authKey = "", this.authToken = "", this.menu = "default", this.placement = "bottom-end", this._slotContents = [], this._overlayReady = !1, this._store = new P(), this._currentSlotContents = [], this._lastFetchedDatasetId = null, this._linkedDatasetsIds = [], this._acceptableColumnTypes = [
+    }), this._slotsConfig = [], this.slotConfiguration = {}, this.slotsContents = [], this.language = "en", this.rotate = !1, this.apiUrl = "https://api.luzmo.com", this.authKey = "", this.authToken = "", this.menu = "default", this.placement = "bottom-end", this._slotContents = [], this._overlayReady = !1, this._store = new N(), this._currentSlotContents = [], this._lastFetchedDatasetId = null, this._linkedDatasetsIds = [], this._acceptableColumnTypes = [
       "datetime",
       "hierarchy",
       "numeric",
@@ -205,36 +224,15 @@ let a = class extends $(L, {
       "array[hierarchy]",
       "array[spatial]"
     ], this._attachDroppable = () => {
-      this._cleanupDroppable || (this._cleanupDroppable = _({
+      this._cleanupDroppable || (this._cleanupDroppable = w({
         element: this,
-        onDrop: async (t) => {
-          const o = { ...t.source?.data }, e = {
-            ...o?.label ?? { en: "Untitled" }
-          }, l = o?.type;
-          if (l === "datetime" && !o.level && (o.level = o.lowestLevel ?? (o.subtype === "date" ? 5 : 9)), l === "datetime" && t?.source?.element?.hasAttribute("sublevel")) {
-            const p = [
-              "(Yr)",
-              "(Qtr)",
-              "(Mth)",
-              "(Wk)",
-              "(Date)",
-              "(Hr)",
-              "(Min)",
-              "(Sec)",
-              "(Msec)"
-            ], m = o?.level ?? 1, C = Object.keys(e);
-            for (const g of C)
-              e[g] = `${e[g]} ${p[m - 1]}`;
-            o.label = o.name = e;
-          }
-          const { securable_id: r } = o;
-          r && r !== this._lastFetchedDatasetId && (this._lastFetchedDatasetId = r, await f.fetchDatasetsRecursive([r]), this._linkedDatasetsIds = f.getLinkedDatasetsIds(r));
-          const i = this._slotContents?.length === 0;
-          this._slotContents = this.slotConfiguration?.canAcceptMultipleDataItems ? [...this._slotContents ?? [], o] : [o], this.removeAttribute("accept-drag"), i ? (this._overlayReady = !1, setTimeout(() => {
+        onDrop: async (o) => {
+          const t = { ...o.source?.data }, e = o?.source?.element?.hasAttribute("sublevel") ?? !1, l = this._slotContents?.length === 0, r = t.datasetId, i = R(t, e);
+          this._slotContents = this.slotConfiguration?.canAcceptMultipleDataItems ? [...this._slotContents ?? [], i] : [i], this.removeAttribute("accept-drag"), r && r !== this._lastFetchedDatasetId && (this._lastFetchedDatasetId = r, await y.fetchDatasetsRecursive([r]), this._linkedDatasetsIds = y.getLinkedDatasetsIds(r)), l ? (this._overlayReady = !1, setTimeout(() => {
             this._overlayReady = !0;
           }, 200)) : this._overlayReady = !0, this.changedSlotContents(this._slotContents, this._linkedDatasetsIds), this.classList.remove("pulse");
         },
-        canDrop: ({ source: t }) => this._canDropItem({ source: t }),
+        canDrop: ({ source: o }) => this._canDropItem({ source: o }),
         getDropEffect: () => "move",
         onDragEnter: () => {
           this.setAttribute("accept-drag", ""), this.classList.add("pulse");
@@ -243,44 +241,42 @@ let a = class extends $(L, {
           this.removeAttribute("accept-drag"), this.classList.remove("pulse");
         }
       }));
-    }, this._canDropItem = ({ source: t }) => {
+    }, this._canDropItem = ({ source: o }) => {
       if (![
         "LUZMO-DRAGGABLE-DATA-ITEM-LEVEL",
         "LUZMO-DRAGGABLE-DATA-ITEM"
-      ].includes(t.element?.tagName) || !this.slotConfiguration?.canAcceptFormula && (t?.data?.formulaId || t?.data?.formula || t?.data?.entity === "formula"))
+      ].includes(o.element?.tagName) || !this.slotConfiguration?.canAcceptFormula && (o?.data?.formulaId || o?.data?.formula || o?.data?.entity === "formula"))
         return !1;
-      const o = this.slotConfiguration?.acceptableDataItemTypes?.length > 0 ? this.slotConfiguration.acceptableDataItemTypes : this._acceptableColumnTypes;
-      return t?.data?.type && !o.includes(t?.data?.type) ? !1 : !(t?.data?.subtype && this.slotConfiguration?.acceptableColumnSubtypes?.length > 0 && !this.slotConfiguration.acceptableColumnSubtypes.includes(
-        t?.data?.subtype
-      ));
-    }, this.changedSlotContents = (t, o = []) => {
-      this._store?.setContents(t, this.slotName), this.dispatchEvent(
+      const { acceptableDataItemTypes: t, acceptableColumnSubtypes: e } = this.slotConfiguration ?? {}, l = Array.isArray(t) && t.length > 0 ? t : this._acceptableColumnTypes;
+      return o?.data?.type && !l.includes(o?.data?.type) ? !1 : !(o?.data?.subtype && Array.isArray(e) && e.length > 0 && !e.includes(o?.data?.subtype));
+    }, this.changedSlotContents = (o, t = []) => {
+      this._store?.setContents(o, this.slotName), this.dispatchEvent(
         new CustomEvent("slot-contents-changed", {
           bubbles: !0,
           composed: !0,
           cancelable: !0,
           detail: {
-            slotContents: t,
-            linkedDatasetsIds: o
+            slotContents: o,
+            linkedDatasetsIds: t
           }
         })
       );
-    }, this._handleDragStart = (t) => {
-      const o = t, e = o.detail?.data;
+    }, this._handleDragStart = (o) => {
+      const t = o, e = t.detail?.data;
       if (this._overlayElement && (this._overlayElement.open = !1), !e) return;
       const l = {
         data: e,
         element: {
-          tagName: o.target instanceof HTMLElement && o.target.tagName === "LUZMO-DRAGGABLE-DATA-ITEM-LEVEL" ? "LUZMO-DRAGGABLE-DATA-ITEM-LEVEL" : "LUZMO-DRAGGABLE-DATA-ITEM"
+          tagName: t.target instanceof HTMLElement && t.target.tagName === "LUZMO-DRAGGABLE-DATA-ITEM-LEVEL" ? "LUZMO-DRAGGABLE-DATA-ITEM-LEVEL" : "LUZMO-DRAGGABLE-DATA-ITEM"
         }
       };
       this._canDropItem({ source: l }) && this.setAttribute("would-accept-drag", "");
     }, this._handleDragEnd = () => {
       this.removeAttribute("would-accept-drag");
-    }, this._handleOverlayClick = (t) => {
-      t.detail > 0 && t.target === this._overlayElement ? this._overlayElement.open = !1 : t.stopPropagation();
-    }, new x(this, {
-      context: T,
+    }, this._handleOverlayClick = (o) => {
+      o.detail > 0 && o.target === this._overlayElement ? this._overlayElement.open = !1 : o.stopPropagation();
+    }, new k(this, {
+      context: U,
       initialValue: this._store
     });
   }
@@ -293,15 +289,15 @@ let a = class extends $(L, {
       this._handleDragStart
     ), document.removeEventListener("data-item-dropped", this._handleDragEnd);
   }
-  emptySlotContents(t) {
-    t.preventDefault(), t.stopPropagation(), this._slotContents = [], this.changedSlotContents([]);
+  emptySlotContents(o) {
+    o.preventDefault(), o.stopPropagation(), this._slotContents = [], this.changedSlotContents([]);
   }
-  willUpdate(t) {
-    t.has("slotConfiguration") && (this._cleanupDroppable && (this._cleanupDroppable(), this._cleanupDroppable = void 0), this._attachDroppable()), t.has("slotsContents") && this._processSlotsContents(), t.has("language") && this.language !== O() && ([...M].includes(this.language ?? "en") || this.language === "en") && U(this.language);
+  willUpdate(o) {
+    o.has("slotConfiguration") && (this._cleanupDroppable && (this._cleanupDroppable(), this._cleanupDroppable = void 0), this._attachDroppable()), o.has("slotsContents") && this._processSlotsContents(), o.has("language") && this.language !== P() && ([...B].includes(this.language ?? "en") || this.language === "en") && G(this.language);
   }
   _processSlotsContents() {
     this._store?.setFullContents(this.slotsContents), this._slotContents = this.slotsContents?.find(
-      (t) => t.name === this.slotName
+      (o) => o.name === this.slotName
     )?.content ?? [], this._currentSlotContents = [...this._slotContents], this._slotContents?.length > 0 && (this._overlayReady = !0), this._store?.setContents(this._slotContents);
   }
   firstUpdated() {
@@ -310,9 +306,9 @@ let a = class extends $(L, {
   /**
    * Handle overlay open event - reset slot menu position
    */
-  _onOverlayClosed(t) {
-    const o = t.overlay;
-    this._slotMenuElement && o === this._overlayElement && (setTimeout(() => {
+  _onOverlayClosed(o) {
+    const t = o.overlay;
+    this._slotMenuElement && t === this._overlayElement && (setTimeout(() => {
       this._slotMenuElement.resetPosition();
     }, 500), this.dispatchEvent(
       new CustomEvent("slot-menu-inactive", {
@@ -321,9 +317,9 @@ let a = class extends $(L, {
       })
     ));
   }
-  _onOverlayOpened(t) {
-    const o = t.overlay;
-    if (this._slotMenuElement && o === this._overlayElement) {
+  _onOverlayOpened(o) {
+    const t = o.overlay;
+    if (this._slotMenuElement && t === this._overlayElement) {
       const e = this._store?.activeIndex.get?.() ?? 0, l = this._slotContents?.[e] ?? this._slotContents?.[0];
       if (!l) return;
       const r = l?.column ?? l?.columnId, i = l?.set ?? l?.datasetId, p = l?.formula;
@@ -332,7 +328,7 @@ let a = class extends $(L, {
           bubbles: !0,
           composed: !0,
           detail: {
-            securableId: i
+            datasetId: i
           }
         })
       ), setTimeout(() => {
@@ -341,55 +337,55 @@ let a = class extends $(L, {
             bubbles: !0,
             composed: !0,
             detail: {
-              columnId: r,
-              securableId: i,
-              formulaId: p,
-              level: l?.level ?? 0
+              datasetId: i,
+              level: l?.level ?? 0,
+              ...r && { columnId: r },
+              ...p && { formulaId: p }
             }
           })
         );
       }));
     }
   }
-  _onSlotMenuChanges(t) {
-    t.preventDefault(), t.stopPropagation();
-    const o = t.detail.linkedDatasetsIds;
-    this._slotContents.length === t.detail.slotContents?.length ? (this._currentSlotContents = t.detail.slotContents, this.changedSlotContents(this._currentSlotContents, o)) : (this._slotContents = t.detail.slotContents, this.changedSlotContents(this._slotContents, o));
+  _onSlotMenuChanges(o) {
+    o.preventDefault(), o.stopPropagation();
+    const t = o.detail.linkedDatasetsIds;
+    this._slotContents.length === o.detail.slotContents?.length ? (this._currentSlotContents = o.detail.slotContents, this.changedSlotContents(this._currentSlotContents, t)) : (this._slotContents = o.detail.slotContents, this.changedSlotContents(this._slotContents, t));
   }
   get _fullLabel() {
-    let t = "";
-    const o = z[this.slotConfiguration?.label] ? z[this.slotConfiguration?.label]() : this.slotConfiguration?.label;
-    this._currentSlotContents?.length === 1 ? t = E(
+    let o = "";
+    const t = C[this.slotConfiguration?.label] ? C[this.slotConfiguration?.label]() : this.slotConfiguration?.label;
+    this._currentSlotContents?.length === 1 ? o = I(
       this._currentSlotContents?.[0]?.label,
       this.language
-    ) ?? "Untitled" : this._currentSlotContents?.length > 1 && (t = `${this._currentSlotContents.length} items`);
-    let e = this.label || o || "Untitled";
-    return this._currentSlotContents?.length > 0 && (e += this._currentSlotContents?.length > 1 ? `: ${this._currentSlotContents.length} items` : `: ${t}`), e;
+    ) ?? "Untitled" : this._currentSlotContents?.length > 1 && (o = `${this._currentSlotContents.length} items`);
+    let e = this.label || t || "Untitled";
+    return this._currentSlotContents?.length > 0 && (e += this._currentSlotContents?.length > 1 ? `: ${this._currentSlotContents.length} items` : `: ${o}`), e;
   }
   droppableSlotMarkup() {
-    const t = d`
+    const o = d`
       <div
         id="trigger"
-        class="droppable-slot ${this.slotConfiguration?.rotate ? "rotate" : ""}"
+        class="droppable-slot ${this.rotate ? "rotate" : ""}"
         ?filled=${this._slotContents?.length > 0}
       >
         <div class="droppable-slot-label">${this._fullLabel}</div>
         ${this._slotContents?.length > 0 && !(this.hideConfiguration && this.hideDelete) ? d`<div class="controls">
               ${this.hideConfiguration ? "" : d`<div>
-                    ${b(w)}
+                    ${z(E)}
                     <luzmo-tooltip
                       self-managed
-                      placement=${this.slotConfiguration?.rotate ? "right" : "top"}
+                      placement=${this.rotate ? "right" : "top"}
                       size=${this.size}
                     >
                       edit
                     </luzmo-tooltip>
                   </div> `}
               ${this.hideDelete ? "" : d`<div @click=${this.emptySlotContents}>
-                    ${b(S)}
+                    ${z(L)}
                     <luzmo-tooltip
                       self-managed
-                      placement=${this.slotConfiguration?.rotate ? "right" : "top"}
+                      placement=${this.rotate ? "right" : "top"}
                       size=${this.size}
                     >
                       Delete
@@ -399,7 +395,7 @@ let a = class extends $(L, {
         ${this._slotContents?.length > 0 && this._overlayReady ? d`<luzmo-overlay
               trigger="trigger@click"
               .placement=${this.placement}
-              offset=${this.slotConfiguration?.rotate ? "-100" : "-20"}
+              offset=${this.rotate ? "-100" : "-20"}
               @luzmo-closed=${this._onOverlayClosed}
               @luzmo-opened=${this._onOverlayOpened}
               @click=${this._handleOverlayClick}
@@ -427,86 +423,89 @@ let a = class extends $(L, {
             </luzmo-overlay>` : ""}
       </div>
     `;
-    return this.slotConfiguration?.rotate ? d`<div class="droppable-slot-wrapper">${t}</div>` : t;
+    return this.rotate ? d`<div class="droppable-slot-wrapper">${o}</div>` : o;
   }
   render() {
     return this.slotConfiguration && Object.keys(this.slotConfiguration).length > 0 ? this.droppableSlotMarkup() : this._loadSlotsConfig.render({
       pending: () => d`<p>Loading...</p>`,
-      complete: (t) => {
-        if (this.slotName && this.itemType && t) {
-          const o = t.find((e) => e.name === this.slotName);
-          o && (this.slotConfiguration = o);
+      complete: (o) => {
+        if (this.slotName && this.itemType && o) {
+          const t = o.find((e) => e.name === this.slotName);
+          t && (this.slotConfiguration = t);
         }
         return this.droppableSlotMarkup();
       },
-      error: (t) => d`
+      error: (o) => d`
         <div>
           Could not load droppable slot: '${this.slotName}' of chart
-          '${this.itemType}': ${t}.
+          '${this.itemType}': ${o}.
         </div>
       `
     });
   }
 };
-a.styles = A(G);
-s([
+s.styles = O(j);
+a([
   n({ type: String, reflect: !0, attribute: "item-type" })
-], a.prototype, "itemType", 2);
-s([
+], s.prototype, "itemType", 2);
+a([
   n({ type: String, reflect: !0, attribute: "slot-name" })
-], a.prototype, "slotName", 2);
-s([
+], s.prototype, "slotName", 2);
+a([
   n({ type: Object })
-], a.prototype, "slotConfiguration", 2);
-s([
+], s.prototype, "slotConfiguration", 2);
+a([
   n({ type: Object })
-], a.prototype, "slotsContents", 2);
-s([
+], s.prototype, "slotsContents", 2);
+a([
   n({ type: String, reflect: !0 })
-], a.prototype, "label", 2);
-s([
+], s.prototype, "label", 2);
+a([
   n({ type: String, reflect: !0 })
-], a.prototype, "language", 2);
-s([
+], s.prototype, "language", 2);
+a([
   n({ type: String, reflect: !0, attribute: "drag-boundary" })
-], a.prototype, "dragBoundary", 2);
-s([
+], s.prototype, "dragBoundary", 2);
+a([
+  n({ type: Boolean, reflect: !0 })
+], s.prototype, "rotate", 2);
+a([
   n({ type: String, attribute: "api-url", reflect: !0 })
-], a.prototype, "apiUrl", 2);
-s([
+], s.prototype, "apiUrl", 2);
+a([
   n({ type: String, attribute: "auth-key", reflect: !0 })
-], a.prototype, "authKey", 2);
-s([
+], s.prototype, "authKey", 2);
+a([
   n({ type: String, attribute: "auth-token", reflect: !0 })
-], a.prototype, "authToken", 2);
-s([
+], s.prototype, "authToken", 2);
+a([
   n({ type: String, reflect: !0 })
-], a.prototype, "menu", 2);
-s([
+], s.prototype, "menu", 2);
+a([
   n({ type: String, reflect: !0 })
-], a.prototype, "placement", 2);
-s([
+], s.prototype, "placement", 2);
+a([
   n({ type: Boolean, reflect: !0, attribute: "hide-delete" })
-], a.prototype, "hideDelete", 2);
-s([
+], s.prototype, "hideDelete", 2);
+a([
   n({ type: Boolean, reflect: !0, attribute: "hide-configuration" })
-], a.prototype, "hideConfiguration", 2);
-s([
-  v("luzmo-slot-menu")
-], a.prototype, "_slotMenuElement", 2);
-s([
-  v("luzmo-overlay")
-], a.prototype, "_overlayElement", 2);
-s([
-  y()
-], a.prototype, "_slotContents", 2);
-s([
-  y()
-], a.prototype, "_overlayReady", 2);
-a = s([
-  D()
-], a);
-customElements.get("luzmo-droppable-slot") || customElements.define("luzmo-droppable-slot", a);
+], s.prototype, "hideConfiguration", 2);
+a([
+  _("luzmo-slot-menu")
+], s.prototype, "_slotMenuElement", 2);
+a([
+  _("luzmo-overlay")
+], s.prototype, "_overlayElement", 2);
+a([
+  x()
+], s.prototype, "_slotContents", 2);
+a([
+  x()
+], s.prototype, "_overlayReady", 2);
+s = a([
+  S()
+], s);
+customElements.get("luzmo-droppable-slot") || customElements.define("luzmo-droppable-slot", s);
 export {
-  a as LuzmoDroppableSlot
+  s as LuzmoDroppableSlot
 };