@luzmo/analytics-components-kit 1.0.8 → 1.0.9-beta.1

package/components/slot-menu-1zlmyLVl.js

@@ -1,1060 +0,0 @@
-/*! * A kit of modern Luzmo Web Components for analytics in your web application.
- * 
- * Copyright © 2026 Luzmo
- * All rights reserved.
- * Luzmo web components (“Luzmo Web Components”)
- * must be used according to the Luzmo Terms of Service.
- * This license allows users with a current active Luzmo account
- * to use the Luzmo Web Components. This license terminates
- * automatically if a user no longer has an active Luzmo account.
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
- * 
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- * */
-import { n as e, o as t, t as n } from "./pragmatic-element-adapter-C_7HSvGV.js";
-import { i as r, n as i, t as a } from "./base-IE9Qxmub.js";
-import { n as o } from "./localized-mixin-DhiGdPMj.js";
-import { t as s } from "./data-broker-B0uUO5er.js";
-import { n as c, s as l } from "./type-check-CGREdneG.js";
-import { t as u } from "./localize-BT7REYBY.js";
-import { a as d, f, i as p, l as m, t as h } from "./period-over-period-condition.const-IOVIrgKJ.js";
-import "./formula-CdAkO1za.js";
-import { n as g, t as _ } from "./get-css-variable-r1spgqX0.js";
-import { luzmoArrows as v, luzmoCalculator as y, luzmoClose12 as b, luzmoFormula as x, luzmoIcon as S, luzmoInfoCircleOutline as ee, luzmoTrashOutline as C } from "@luzmo/icons";
-import "@luzmo/lucero/icon";
-import { html as w, nothing as te, unsafeCSS as T } from "lit";
-import { property as E, query as D, queryAll as ne, state as O } from "lit/decorators.js";
-import { msg as k } from "@lit/localize";
-import "@luzmo/lucero/action-button";
-import "@luzmo/lucero/tooltip";
-import { guard as re } from "lit/directives/guard.js";
-import "@luzmo/lucero/field-label";
-import { ifDefined as A } from "lit/directives/if-defined.js";
-import "@luzmo/lucero/divider";
-import "@luzmo/lucero/text-field";
-import { Task as ie } from "@lit/task";
-import { ContextProvider as ae, consume as j, createContext as oe } from "@lit/context";
-import { SignalWatcher as M, computed as N, signal as P } from "@lit-labs/signals";
-import "@luzmo/lucero/multi-language-field";
-import "@luzmo/lucero/progress-circle";
-//#region node_modules/uuid/dist/regex.js
-var F = /^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-8][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000|ffffffff-ffff-ffff-ffff-ffffffffffff)$/i;
-//#endregion
-//#region node_modules/uuid/dist/validate.js
-function I(e) {
-	return typeof e == "string" && F.test(e);
-}
-//#endregion
-//#region src/utils/data-field-types/default-acceptable-data-field-types.ts
-var se = [
-	"datetime",
-	"hierarchy",
-	"numeric",
-	"spatial",
-	"array[datetime]",
-	"array[numeric]",
-	"array[hierarchy]",
-	"array[spatial]"
-], L = oe(Symbol("slot-store-context")), R = class {
-	constructor() {
-		this.slotContents = P([]), this.slotsContents = P([]), this.periodOverPeriodUiType = P(null), this.periodOverPeriodAllowsPeriodsWithoutDatetimeColumn = P(!1), this.periodOverPeriodHidesPastValue = P(!1), this.linkedDataset = P([]), this._popEnabledChartTypes = [
-			"area-chart",
-			"bar-chart",
-			"combination-chart",
-			"column-chart",
-			"line-chart"
-		], this._popPeriodsWithoutDatetimeColumnItemTypes = ["kpi"], this._popWithoutPastValueItemTypes = ["kpi"], this.activeSlotContents = N(() => this.slotContents.get()[this.activeIndex.get()]), this.activeIndex = P(0);
-	}
-	isArrayColumnType(e) {
-		return e.startsWith("array[");
-	}
-	setPeriodOverPeriodCondition(e, t) {
-		if (this.periodOverPeriodAllowsPeriodsWithoutDatetimeColumn.set(this._popPeriodsWithoutDatetimeColumnItemTypes.includes(e)), this.periodOverPeriodHidesPastValue.set(this._popWithoutPastValueItemTypes.includes(e)), !t?.periodOverPeriod?.newUi) {
-			this.periodOverPeriodUiType.set(this.oldConditionalLogic(e));
-			return;
-		}
-		this.periodOverPeriodUiType.set(this.getUiConditionToApply(t));
-	}
-	getUiConditionToApply(e) {
-		let t = this.hasDatetimeColumnOnCategoryOrXAxis(), n = e?.periodOverPeriod?.hasConnectedComparisonFilter, r = this.linkedDataset.get().some(({ columns: e }) => e?.some((e) => e.type === "datetime"));
-		return !t && !n && !r ? null : t && n ? h.HasDatetimeColumnAndComparisonFilters : t && !n ? h.HasDatetimeColumnAndNoComparisonFilters : !t && n ? h.NoDatetimeColumnButComparisonFilters : h.NoDatetimeColumnAndNoComparisonFilters;
-	}
-	oldConditionalLogic(e) {
-		let t = this.slotsContents.get() ?? [], n = (t.find((e) => [
-			"y-axis",
-			"x-axis",
-			"row"
-		].includes(e.name))?.content ?? [])?.[0] ?? null, r = t.find((e) => e.name === "measure")?.content ?? [];
-		return n && this._popEnabledChartTypes.includes(e) && n.type === "datetime" && !this.isArrayColumnType(n.type) && (!n.datetimeDisplayMode || n.datetimeDisplayMode === "default") && n.level !== 4 && r.length > 0 ? h.OldImplementation : null;
-	}
-	hasDatetimeColumnOnCategoryOrXAxis() {
-		let e = ((this.slotsContents.get() ?? []).find((e) => ["y-axis", "x-axis"].includes(e.name))?.content ?? [])?.[0] ?? null;
-		return !!(e && e.type === "datetime" && !this.isArrayColumnType(e.type));
-	}
-	setContents(e, t) {
-		if (this.slotContents.set(e), this.activeIndex.get() >= e.length && this.activeIndex.set(e.length > 0 ? e.length - 1 : 0), t) {
-			let n = structuredClone(this.slotsContents.get()) ?? [], r = n.find((e) => e.name === t);
-			r && (r.content = e), this.setFullContents(n);
-		}
-	}
-	setFullContents(e) {
-		this.slotsContents.set(e);
-	}
-	updateActive(e) {
-		e >= 0 && e < this.slotContents.get().length && this.activeIndex.set(e);
-	}
-	updateContent(e, t = this.activeIndex.get()) {
-		if (t < 0 || t >= this.slotContents.get().length) return;
-		let n = [...this.slotContents.get()];
-		n[t] = structuredClone(e), this.slotContents.set(n);
-	}
-	removeContent(e) {
-		if (e < 0 || e >= this.slotContents.get().length) return;
-		let t = this.slotContents.get().filter((t, n) => n !== e);
-		this.slotContents.set(t), this.activeIndex.get() >= t.length && this.activeIndex.set(t.length > 0 ? t.length - 1 : 0);
-	}
-}, z = (e) => typeof e == "string" && e.trim().length > 0, B = (e) => !!(e && z(e.formula) && !e.formulaId && !l(e.formula)), V = (e) => !!(e && z(e.expression) && !e.columnId && !e.column && !e.formulaId && !e.formula), H = (e) => V(e) ? e?.expression : B(e) ? e?.formula : void 0, ce = (e) => e?.columnId ?? e?.formulaId ?? e?.column ?? e?.formula ?? e?.expression, U = (e, t) => V(e) ? !0 : !e || !B(e) ? !1 : d({
-	slotName: String(t.name ?? ""),
-	slotType: t.type,
-	contentKind: p(e)
-}) === "measure", W = (e) => {
-	let t = B(e);
-	return w`<span class="calculation-label">
-    <span class="calculation-label-icon" aria-hidden="true">${S(t ? x : y)}</span>
-    <span>${t ? k("Formula", { desc: "Label for the formula type" }) : k("Expression", { desc: "Label for the expression type" })}</span>
-  </span>`;
-}, le = (e, t) => {
-	let n = {
-		type: e.type,
-		datasetId: e.datasetId,
-		set: e.datasetId
-	};
-	"columnId" in e && !c(e.columnId) && e.columnId !== "" ? (n.columnId = e.columnId, n.column = e.columnId) : "formulaId" in e && !c(e.formulaId) && e.formulaId !== "" ? (n.formulaId = e.formulaId, n.formula = e.formulaId) : "formula" in e && typeof e.formula == "string" && e.formula !== "" && (n.formula = e.formula);
-	let r = e.type === "datetime" || e.type === "array[datetime]", i = { ...e.name ?? { en: "Untitled" } }, a = e.level;
-	if (r && (a = a ?? e.lowestLevel ?? 9, t)) {
-		let e = f.shortLevels?.filter((e) => e !== "All") ?? [], t = e[Math.max(0, Math.min(e.length - 1, (a ?? 1) - 1))];
-		if (t) {
-			let e = `(${t})`, n = Object.keys(i);
-			for (let t of n) i[t] = `${i[t]} ${e}`;
-		}
-	}
-	return n.label = i, c(e.subtype) || (n.subtype = e.subtype), "lowestLevel" in e && !c(e.lowestLevel) && (n.lowestLevel = e.lowestLevel), c(e.format) || (n.format = e.format), c(a) || (n.level = a), c(e.lowestLevel) || (n.lowestLevel = e.lowestLevel), e.type === "numeric" && e.subtype === "currency" && e.currency?.symbol && (n.currency = e.currency.symbol), Array.isArray(e.duration_levels) && e.duration_format && (n.duration = {
-		levels: e.duration_levels,
-		format: e.duration_format
-	}), n;
-}, ue = ":host{font-family:var(--luzmo-display-settings-font-family,var(--luzmo-font-family));font-size:var(--luzmo-display-settings-font-size,var(--display-settings-font-size));color:var(--luzmo-display-settings-font-color,var(--luzmo-font-color))}.settings-container{gap:var(--luzmo-display-settings-vertical-gap,var(--luzmo-spacing-2));flex-direction:column;display:flex}.settings-row{justify-content:flex-start;align-items:center;gap:var(--luzmo-display-settings-gap,var(--display-settings-gap));display:flex}.label-container{align-items:center;gap:var(--luzmo-display-settings-gap,var(--display-settings-gap));min-width:0;display:flex}.calculation-preview{align-items:flex-start}.calculation-preview luzmo-field-label{--luzmo-field-label-side-aligned-height:auto;--luzmo-field-label-min-height:auto;--luzmo-field-label-padding-block:0;--luzmo-field-label-line-height:1.5}.calculation-preview luzmo-formula{max-block-size:6em;max-inline-size:var(--luzmo-display-settings-calculation-max-width,var(--display-settings-calculation-max-width));overflow-wrap:anywhere;align-items:flex-start;min-width:0;display:inline-flex;overflow-y:auto}.calculation-preview luzmo-formula::-webkit-scrollbar{width:var(--luzmo-scrollbar-size)}.calculation-preview luzmo-formula::-webkit-scrollbar-track{background:var(--luzmo-scrollbar-track-background);border-radius:var(--luzmo-scrollbar-track-border-radius)}.calculation-preview luzmo-formula::-webkit-scrollbar-thumb{background:var(--luzmo-scrollbar-thumb-background);border-radius:var(--luzmo-scrollbar-thumb-border-radius)}.calculation-preview luzmo-formula::-webkit-scrollbar-thumb:hover{background:var(--luzmo-scrollbar-thumb-hover-background)}.calculation-preview luzmo-formula{scrollbar-width:var(--luzmo-scrollbar-width,thin);scrollbar-color:var(--luzmo-scrollbar-thumb-background) var(--luzmo-scrollbar-track-background)}luzmo-divider{margin:var(--luzmo-display-settings-ids-container-vertical-margin,var(--display-settings-ids-container-vertical-margin)) 0}luzmo-tooltip{--tooltip-font-size:var(--luzmo-display-settings-tooltip-font-size,var(--tooltip-font-size))}.setting{align-items:center;display:flex}.label-action-container{justify-content:space-between;align-items:center;gap:var(--luzmo-display-settings-info-to-remove-icon-gap,var(--display-settings-info-to-remove-icon-gap));display:flex}.label-action-container luzmo-action-button{margin-inline-start:var(--luzmo-spacing-2)}.ids-container{gap:var(--luzmo-display-settings-ids-container-gap,var(--luzmo-spacing-2));border-radius:50%;flex-direction:column;display:flex}.id-label{text-transform:var(--luzmo-display-settings-id-label-text-transform,var(--display-settings-id-label-text-transform));font-size:var(--luzmo-display-settings-id-label-font-size,var(--display-settings-id-label-font-size));color:var(--luzmo-display-settings-id-label-color,var(--display-settings-id-label-color))}.id-value{-webkit-user-select:text;user-select:text;cursor:text}.example-container{line-height:var(--luzmo-display-settings-example-height,var(--display-settings-example-height));font-size:var(--luzmo-display-settings-example-font-size,var(--display-settings-example-font-size));color:var(--luzmo-display-settings-example-color,var(--display-settings-example-color))}.example-container .example-label{font-weight:var(--luzmo-display-settings-example-label-font-weight,var(--display-settings-example-label-font-weight));color:var(--luzmo-display-settings-example-label-color,var(--display-settings-example-label-color))}.example-container .example-language{text-transform:uppercase;color:var(--luzmo-display-settings-example-language-color,var(--display-settings-example-language-color))}.example-container{gap:var(--luzmo-display-settings-example-container-gap,var(--luzmo-spacing-2))}:host{--display-settings-font-family:var(--luzmo-font-family);--display-settings-id-label-text-transform:uppercase;--display-settings-id-label-color:var(--luzmo-primary);--display-settings-font-size:var(--luzmo-font-size);--display-settings-id-label-font-size:var(--luzmo-font-size-s);--display-settings-gap:var(--luzmo-spacing-3);--display-settings-ids-container-vertical-margin:var(--luzmo-spacing-4);--display-settings-info-to-remove-icon-gap:var(--luzmo-spacing-5);--display-settings-calculation-max-width:20rem}:host([size=s]){--display-settings-id-label-font-size:var(--luzmo-font-size-s);--display-settings-font-size:var(--luzmo-font-size-s);--display-settings-gap:var(--luzmo-spacing-3);--display-settings-ids-container-vertical-margin:var(--luzmo-spacing-3);--display-settings-info-to-remove-icon-gap:var(--luzmo-spacing-4);--display-settings-calculation-max-width:16rem}:host([size=l]){--display-settings-id-label-font-size:var(--luzmo-font-size);--display-settings-font-size:var(--luzmo-font-size-l);--display-settings-gap:var(--luzmo-spacing-4);--display-settings-ids-container-vertical-margin:var(--luzmo-spacing-5);--display-settings-info-to-remove-icon-gap:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--display-settings-calculation-max-width:24rem}:host([size=xl]){--display-settings-id-label-font-size:var(--luzmo-font-size-l);--display-settings-font-size:var(--luzmo-font-size-xl);--display-settings-gap:var(--luzmo-spacing-5);--display-settings-ids-container-vertical-margin:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--display-settings-info-to-remove-icon-gap:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-2));--display-settings-calculation-max-width:28rem}:host{--display-settings-example-font-size:var(--luzmo-font-size);--display-settings-example-color:var(--luzmo-font-color);--display-settings-example-label-font-weight:bold;--display-settings-example-label-color:var(--luzmo-primary);--display-settings-example-language-color:var(--luzmo-primary);--display-settings-example-height:var(--luzmo-component-height)}:host([size=s]){--display-settings-example-height:var(--luzmo-component-height-s);--display-settings-example-font-size:var(--luzmo-font-size-s)}:host([size=l]){--display-settings-example-height:var(--luzmo-component-height-l);--display-settings-example-font-size:var(--luzmo-font-size)}:host([size=xl]){--display-settings-example-height:var(--luzmo-component-height-xl);--display-settings-example-font-size:var(--luzmo-font-size-l)}", G = class extends M(i(r, { validSizes: Object.values(a) })) {
-	constructor(...e) {
-		super(...e), this._loadDisplaySettings = new ie(this, {
-			task: async ([e, t, n, r, i, a]) => {
-				let o = [];
-				a && o.push("grandTotals"), n && o.push("periodOverPeriod"), (e === "numeric" || e === "mixed" && this._currentSlotContent?.type === "numeric") && o.push("numeric"), e !== "numeric" && this._currentSlotContent?.type === "datetime" && o.push("datetime"), !["numeric", "mixed"].includes(e ?? "") && this._currentSlotContent?.type === "numeric" && !r && o.push("binning"), n && !this._settingsTypeLoaded.periodOverPeriod && (await import("./display-settings-period-over-period-W3dPK8LR.js").then((e) => e.t), this._settingsTypeLoaded.periodOverPeriod = !0), o.length > 0 && !t && (o.includes("numeric") && !this._settingsTypeLoaded.numeric ? (await import("./display-settings-numeric-B8MCRz-V.js").then((e) => e.t), this._settingsTypeLoaded.numeric = !0) : o.includes("datetime") && !this._settingsTypeLoaded.datetime && i ? (await import("./display-settings-datetime-5rq55OAn.js").then((e) => e.t), this._settingsTypeLoaded.datetime = !0) : o.includes("binning") && !this._settingsTypeLoaded.binning ? (await import("./display-settings-binning-CaE87u3h.js").then((e) => e.t), this._settingsTypeLoaded.binning = !0) : o.includes("grandTotals") && !this._settingsTypeLoaded.grandTotals && (await import("./display-settings-grand-totals-DnKvI34n.js").then((e) => e.t), this._settingsTypeLoaded.grandTotals = !0));
-			},
-			args: () => [
-				this.slotType,
-				this.hideDisplaySettings,
-				this._store?.periodOverPeriodUiType.get(),
-				this.isBinningDisabled,
-				this.areDatetimeOptionsEnabled,
-				this.areGrandTotalsEnabled,
-				this.slotContent
-			]
-		}), this.language = "en", this.contentLanguage = "en", this.slotType = "numeric", this.slotName = "measure", this.slotContent = {}, this.datasetsDataFields = [], this.apiUrl = "https://api.luzmo.com", this.authKey = "", this.authToken = "", this._showIds = !1, this.measureColumns = [], this._settingsTypeLoaded = {
-			binning: !1,
-			datetime: !1,
-			numeric: !1,
-			grandTotals: !1,
-			periodOverPeriod: !1,
-			hierarchy: !0
-		}, this._currentSlotContent = {};
-	}
-	static get styles() {
-		return [T(ue)];
-	}
-	_datasetDatetimeColumns() {
-		return this._store?.linkedDataset.get().flatMap((e) => e.columns?.filter((e) => e.type === "datetime").map((t) => ({
-			...t,
-			datasetId: e.id
-		})));
-	}
-	willUpdate(e) {
-		let t = this._store?.activeSlotContents.get(), n = this._store?.periodOverPeriodUiType.get();
-		if (this.periodOverPeriodUiType !== n && (this.periodOverPeriodUiType = n), this._store) {
-			t !== this._lastStoreContent && (this._lastStoreContent = t, this._currentSlotContent = t ? structuredClone(t) : {});
-			return;
-		}
-		if (e.has("slotContent") || Object.keys(this._currentSlotContent).length === 0) {
-			let e = this.slotContent;
-			e && (this._currentSlotContent = structuredClone(e));
-		}
-	}
-	get datasetId() {
-		return this._currentSlotContent.datasetId ?? this._currentSlotContent.set;
-	}
-	get formulaOrColumnId() {
-		return this._currentSlotContent.formulaId ?? this._currentSlotContent.expression ?? this._currentSlotContent.formula ?? this._currentSlotContent.columnId ?? this._currentSlotContent.column;
-	}
-	resetInfoVisibility(e) {
-		this._showIds && this._toggleIds(e);
-	}
-	_onSlotContentChange(e) {
-		e.stopPropagation(), e.preventDefault(), this._currentSlotContent = structuredClone(e.detail.slotContent), this._sendEvent(), this.requestUpdate();
-	}
-	_onLabelChange() {
-		this._currentSlotContent = structuredClone(this._currentSlotContent), this._currentSlotContent.label = this._multiLanguageFieldElement.value || {}, this._sendEvent(), this.requestUpdate();
-	}
-	_sendEvent() {
-		this.dispatchEvent(new CustomEvent("luzmo-slot-content-changed", {
-			bubbles: !0,
-			composed: !0,
-			cancelable: !0,
-			detail: { slotContent: { ...this._currentSlotContent } }
-		})), this._store && (this._store.updateContent({ ...this._currentSlotContent }), this._lastStoreContent = this._store.activeSlotContents.get());
-	}
-	_removeEvent() {
-		this.dispatchEvent(new CustomEvent("luzmo-remove-slot-content", {
-			bubbles: !0,
-			composed: !0,
-			cancelable: !0,
-			detail: { slotContent: this._currentSlotContent }
-		}));
-	}
-	_toggleIds(e = !0) {
-		this._showIds = !this._showIds, e && this.dispatchEvent(new CustomEvent("luzmo-info-visibility-changed", { detail: {
-			isVisible: this._showIds,
-			slotContent: { ...this._currentSlotContent }
-		} }));
-	}
-	_renderExampleRow() {
-		let e = this.slotType === "numeric" || this.slotType === "mixed" && this._currentSlotContent.type === "numeric", t = this.slotType !== "datetime" && this._currentSlotContent.type === "datetime" && this.areDatetimeOptionsEnabled;
-		if (!(e || t)) return te;
-		let n = !this._currentSlotContent.datetimeDisplayMode || this._currentSlotContent.datetimeDisplayMode === "default", r = e ? 1234.56 : n ? /* @__PURE__ */ new Date() : 1, i = m({
-			...this._currentSlotContent,
-			type: e ? "numeric" : "datetime"
-		}, {
-			locale: this.contentLanguage,
-			level: this._currentSlotContent.level
-		})(r);
-		return w`<div class="settings-row example-container">
-      <span class="example-label"
-        >${k("Example", { desc: "Label for example" })}:</span
-      >
-      <span class="example">${i}</span>
-    </div>`;
-	}
-	_renderDisplaySettings() {
-		let e = {
-			name: this.slotName,
-			type: this.slotType
-		}, t = U(this._currentSlotContent, e) ? H(this._currentSlotContent) : void 0, n = B(this._currentSlotContent) ? k("Formula", { desc: "Label for the formula type" }) : k("Expression", { desc: "Label for the expression type" }), r = this._currentSlotContent.datasetId ?? this._currentSlotContent.set;
-		return w`<div class="settings-container">
-        <div class="settings-row">
-          <div class="setting">
-            <div class="label-container">
-              <luzmo-field-label side-aligned="start" .size=${this.size}
-                >Label:</luzmo-field-label
-              >
-              <luzmo-multi-language-field
-                label="Label"
-                .language=${this.contentLanguage}
-                .value=${this._currentSlotContent.label ?? {}}
-                .size=${this.size}
-                debounce="200"
-                @change=${this._onLabelChange}
-              ></luzmo-multi-language-field>
-            </div>
-            <div class="label-action-container">
-              <luzmo-action-button quiet .size=${this.size} .label=${k("Show dataset and column IDs", { desc: "Show IDs button label" })} aria-expanded=${this._showIds} @click=${this._toggleIds}>
-                ${S(ee)}
-                <luzmo-tooltip self-managed placement="top" size=${this.size}>
-                  ${k("Show dataset and column IDs", { desc: "Show IDs button label" })}
-                </luzmo-tooltip>
-              </luzmo-action-button>
-              ${this.showRemoveButton ? w`<luzmo-action-button quiet .size=${this.size} .label=${k("Remove", { desc: "Remove button label" })} @click=${this._removeEvent}>
-                    ${S(C)}
-                    <luzmo-tooltip
-                      self-managed
-                      placement="top"
-                      size=${this.size}
-                    >
-                      ${k("Remove", { desc: "Remove button label" })}
-                    </luzmo-tooltip>
-                  </luzmo-action-button>` : ""}
-            </div>
-          </div>
-        </div>
-        ${t ? w`<div class="settings-row">
-              <div class="setting">
-                <div class="label-container calculation-preview">
-                  <luzmo-field-label side-aligned="start" .size=${this.size}
-                    >${n}:</luzmo-field-label
-                  >
-                  <luzmo-formula
-                    display="text"
-                    .expression=${t}
-                    .datasetsDataFields=${this.datasetsDataFields}
-                    .datasetIds=${r ? [r] : []}
-                    .apiUrl=${this.apiUrl}
-                    .authKey=${this.authKey}
-                    .authToken=${this.authToken}
-                    .contentLanguage=${this.contentLanguage}
-                    .size=${this.size}
-                  ></luzmo-formula>
-                </div>
-              </div>
-            </div>` : ""}
-        ${this.areGrandTotalsEnabled ? w`<luzmo-display-settings-grand-totals
-              .language=${this.language}
-              .slotContent=${this._currentSlotContent}
-              .size=${this.size}
-              @luzmo-slot-content-changed=${this._onSlotContentChange}
-            ></luzmo-display-settings-grand-totals>` : ""}
-        ${this.slotType === "numeric" || this.slotType === "mixed" && this._currentSlotContent.type === "numeric" ? w`<luzmo-display-settings-numeric
-              .language=${this.language}
-              .slotContent=${this._currentSlotContent}
-              .size=${this.size}
-              .measureColumns=${this.measureColumns}
-              .isAggregationDisabled=${this.isAggregationDisabled}
-              .isCumulativeSumEnabled=${this.isCumulativeSumEnabled}
-              @luzmo-slot-content-changed=${this._onSlotContentChange}
-            ></luzmo-display-settings-numeric>` : ""}
-        ${this.slotType !== "numeric" && this._currentSlotContent.type === "datetime" && this.areDatetimeOptionsEnabled ? w`<luzmo-display-settings-datetime
-              .language=${this.language}
-              .contentLanguage=${this.contentLanguage}
-              .slotContent=${this._currentSlotContent}
-              .size=${this.size}
-              @luzmo-slot-content-changed=${this._onSlotContentChange}
-            ></luzmo-display-settings-datetime>` : ""}
-        ${!["numeric", "mixed"].includes(this.slotType ?? "") && this._currentSlotContent.type === "numeric" && !this.isBinningDisabled ? w`<luzmo-display-settings-binning
-              .language=${this.language}
-              .slotContent=${this._currentSlotContent}
-              .size=${this.size}
-              @luzmo-slot-content-changed=${this._onSlotContentChange}
-            ></luzmo-display-settings-binning>` : ""}
-        ${this.periodOverPeriodUiType ? w`<luzmo-display-settings-period-over-period
-              .language=${this.language}
-              .slotContent=${this._currentSlotContent}
-              .size=${this.size}
-              .periodOverPeriodUiType=${this.periodOverPeriodUiType}
-              .allowPeriodsWithoutDatetimeColumn=${this._store?.periodOverPeriodAllowsPeriodsWithoutDatetimeColumn.get() ?? !1}
-              .hidePastValue=${this._store?.periodOverPeriodHidesPastValue.get() ?? !1}
-              .linkedDatasetDatetimeColumns=${this._datasetDatetimeColumns()}
-              @luzmo-slot-content-changed=${this._onSlotContentChange}
-            ></luzmo-display-settings-period-over-period>` : ""}
-        ${this._renderExampleRow()}
-      </div>
-      ${this._showIds ? w` <luzmo-divider></luzmo-divider>
-            <div class="ids-container">
-              <div>
-                <span class="id-label"
-                  >${this._currentSlotContent.formula || this._currentSlotContent.formulaId || this._currentSlotContent.expression ? k("Formula", { desc: "Label for the formula type" }) : k("Column", { desc: "Label for column type" })}:
-                </span>
-                <span class="id-value">
-                  ${this.formulaOrColumnId}
-                </span>
-              </div>
-              <div>
-                <span class="id-label">Dataset: </span>
-                <span class="id-value">
-                  ${this.datasetId}
-                </span>
-              </div>
-              <div></div>
-            </div>` : ""}`;
-	}
-	render() {
-		return this._loadDisplaySettings.render({
-			pending: () => w`<luzmo-progress-circle
-          indeterminate
-          .label=${k("Loading", { desc: "Loading spinner label" })}
-          .size=${this.size}
-        ></luzmo-progress-circle>`,
-			complete: () => this._renderDisplaySettings(),
-			error: () => this._renderDisplaySettings()
-		});
-	}
-	disconnectedCallback() {
-		super.disconnectedCallback?.(), this._loadDisplaySettings.abort?.();
-	}
-};
-//#endregion
-//#region src/components/display-settings/index.ts
-o([E({ type: String })], G.prototype, "language", void 0), o([E({
-	type: String,
-	attribute: "content-language"
-})], G.prototype, "contentLanguage", void 0), o([E({
-	type: Boolean,
-	attribute: "hide-display-settings"
-})], G.prototype, "hideDisplaySettings", void 0), o([E({ type: Boolean })], G.prototype, "isBinningDisabled", void 0), o([E({ type: Boolean })], G.prototype, "areDatetimeOptionsEnabled", void 0), o([E({ type: Boolean })], G.prototype, "areGrandTotalsEnabled", void 0), o([E({ type: Boolean })], G.prototype, "isAggregationDisabled", void 0), o([E({ type: Boolean })], G.prototype, "isCumulativeSumEnabled", void 0), o([E({ type: String })], G.prototype, "periodOverPeriodUiType", void 0), o([E({
-	type: Boolean,
-	attribute: "show-remove-button"
-})], G.prototype, "showRemoveButton", void 0), o([E({
-	type: String,
-	attribute: "slot-type"
-})], G.prototype, "slotType", void 0), o([E({
-	type: String,
-	attribute: "slot-name"
-})], G.prototype, "slotName", void 0), o([E({
-	type: Object,
-	attribute: !1
-})], G.prototype, "slotContent", void 0), o([E({ attribute: !1 })], G.prototype, "datasetsDataFields", void 0), o([E({
-	type: String,
-	attribute: "api-url",
-	reflect: !0
-})], G.prototype, "apiUrl", void 0), o([E({
-	type: String,
-	attribute: "auth-key",
-	reflect: !0
-})], G.prototype, "authKey", void 0), o([E({
-	type: String,
-	attribute: "auth-token",
-	reflect: !0
-})], G.prototype, "authToken", void 0), o([O()], G.prototype, "_showIds", void 0), o([E({
-	type: Array,
-	reflect: !1
-})], G.prototype, "measureColumns", void 0), o([D("luzmo-multi-language-field")], G.prototype, "_multiLanguageFieldElement", void 0), o([j({
-	context: L,
-	subscribe: !0
-})], G.prototype, "_store", void 0), customElements.get("luzmo-display-settings") || customElements.define("luzmo-display-settings", G);
-//#endregion
-//#region src/utils/drag/draggable.ts
-function de({ element: e, handle: t, boundary: n = document.documentElement, onDragStart: r, onDragEnd: i }) {
-	if (!e || !t) throw Error("makeDraggable: element and handle are required");
-	let a = e.ownerDocument ?? document, o = -1, s = 0, c = 0, l = 0, u = 0, d = 0, f = 0, p = 0, m = 0, h = (t) => {
-		if (t.pointerId !== o) return;
-		let r = t.clientX - s, i = t.clientY - c, a = (n ?? document.documentElement).getBoundingClientRect(), h = l + r, g = u + i;
-		h = Math.min(Math.max(h, a.left), a.right - d), g = Math.min(Math.max(g, a.top), a.bottom - f);
-		let _ = h - l, v = g - u, y = p + _, b = m + v;
-		e.style.transform = `translate3d(${y}px, ${b}px, 0)`;
-	}, g = (e) => {
-		e.pointerId === o && (a.removeEventListener("pointermove", h), a.removeEventListener("pointerup", g), o = -1, i?.());
-	}, _ = (n) => {
-		if (n.button !== 0) return;
-		o = n.pointerId;
-		let i = e.getBoundingClientRect();
-		l = i.left, u = i.top, d = i.width, f = i.height, s = n.clientX, c = n.clientY;
-		try {
-			let t = a.defaultView?.getComputedStyle(e);
-			if (t) {
-				let e = new DOMMatrixReadOnly(t.transform);
-				p = e.m41, m = e.m42;
-			}
-		} catch {
-			p = 0, m = 0;
-		}
-		t.setPointerCapture(o), a.addEventListener("pointermove", h), a.addEventListener("pointerup", g), r?.();
-	};
-	return t.addEventListener("pointerdown", _), () => {
-		t.removeEventListener("pointerdown", _), a.removeEventListener("pointermove", h), a.removeEventListener("pointerup", g);
-	};
-}
-//#endregion
-//#region node_modules/@atlaskit/motion/dist/esm/utils/durations.js
-var K = {
-	none: 0,
-	small: 100,
-	medium: 350,
-	large: 700
-}, q = .5;
-K.none, K.small * q, K.medium * q, K.large * q;
-//#endregion
-//#region node_modules/@atlaskit/pragmatic-drag-and-drop-flourish/dist/esm/trigger-post-move-flash.js
-function fe(e) {
-	e.animate([{ backgroundColor: "var(--ds-background-selected, #E9F2FF)" }, {}], {
-		duration: K.large,
-		easing: "cubic-bezier(0.25, 0.1, 0.25, 1.0)",
-		iterations: 1
-	});
-}
-//#endregion
-//#region node_modules/@atlaskit/pragmatic-drag-and-drop-hitbox/dist/esm/closest-edge.js
-function J(e, t) {
-	var n = Object.keys(e);
-	if (Object.getOwnPropertySymbols) {
-		var r = Object.getOwnPropertySymbols(e);
-		t && (r = r.filter(function(t) {
-			return Object.getOwnPropertyDescriptor(e, t).enumerable;
-		})), n.push.apply(n, r);
-	}
-	return n;
-}
-function Y(e) {
-	for (var n = 1; n < arguments.length; n++) {
-		var r = arguments[n] == null ? {} : arguments[n];
-		n % 2 ? J(Object(r), !0).forEach(function(n) {
-			t(e, n, r[n]);
-		}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : J(Object(r)).forEach(function(t) {
-			Object.defineProperty(e, t, Object.getOwnPropertyDescriptor(r, t));
-		});
-	}
-	return e;
-}
-var pe = {
-	top: function(e, t) {
-		return Math.abs(t.y - e.top);
-	},
-	right: function(e, t) {
-		return Math.abs(e.right - t.x);
-	},
-	bottom: function(e, t) {
-		return Math.abs(e.bottom - t.y);
-	},
-	left: function(e, t) {
-		return Math.abs(t.x - e.left);
-	}
-}, X = Symbol("closestEdge");
-function me(e, n) {
-	var r = n.element, i = n.input, a = n.allowedEdges, o = {
-		x: i.clientX,
-		y: i.clientY
-	}, s = r.getBoundingClientRect(), c = a.map(function(e) {
-		return {
-			edge: e,
-			value: pe[e](s, o)
-		};
-	}).sort(function(e, t) {
-		return e.value - t.value;
-	})[0]?.edge ?? null;
-	return Y(Y({}, e), {}, t({}, X, c));
-}
-function Z(e) {
-	return e[X] ?? null;
-}
-//#endregion
-//#region src/components/slot-menu-list/slot-menu-list.module.scss?inline
-var he = ":host{font-family:var(--luzmo-slot-menu-list-font-family,var(--luzmo-font-family));font-size:var(--luzmo-slot-menu-list-font-size,var(--slot-menu-list-font-size));color:var(--luzmo-slot-menu-list-font-color,var(--luzmo-font-color))}ul{margin:0;padding:0;list-style:none}:host{max-height:var(--luzmo-slot-menu-list-max-height,var(--slot-menu-list-max-height));margin:0;padding:0;list-style:none;overflow-y:auto}:host::-webkit-scrollbar{width:var(--luzmo-slot-menu-list-scrollbar-width,var(--slot-menu-list-scrollbar-width))}:host::-webkit-scrollbar-track{background:var(--luzmo-slot-menu-list-scrollbar-track-background,var(--slot-menu-list-scrollbar-track-background));border-radius:var(--luzmo-slot-menu-list-scrollbar-track-border-radius,var(--slot-menu-list-scrollbar-track-border-radius))}:host::-webkit-scrollbar-thumb{background:var(--luzmo-slot-menu-list-scrollbar-thumb-background,var(--slot-menu-list-scrollbar-thumb-background));border-radius:var(--luzmo-slot-menu-list-scrollbar-thumb-border-radius,var(--slot-menu-list-scrollbar-thumb-border-radius))}:host::-webkit-scrollbar-thumb:hover{background:var(--luzmo-slot-menu-list-scrollbar-thumb-hover-background,var(--slot-menu-list-scrollbar-thumb-hover-background))}:host{scrollbar-width:var(--luzmo-scrollbar-width,thin);scrollbar-color:var(--luzmo-slot-menu-list-scrollbar-thumb-background,var(--slot-menu-list-scrollbar-thumb-background)) var(--luzmo-slot-menu-list-scrollbar-track-background,var(--slot-menu-list-scrollbar-track-background));border-right:var(--luzmo-slot-menu-list-border-right-width,var(--luzmo-border-width)) solid var(--luzmo-slot-menu-list-border-right-color,var(--luzmo-border-color))}:host li{cursor:pointer;position:relative}:host li:hover{background-color:var(--luzmo-slot-menu-list-background-color-hover,var(--slot-menu-list-background-color-hover))}:host li{border-bottom:var(--luzmo-slot-menu-list-border-bottom-width,var(--slot-menu-list-border-bottom-width)) solid var(--luzmo-slot-menu-list-border-bottom-color,var(--slot-menu-list-border-bottom-color))}:host .active{background-color:var(--luzmo-slot-menu-list-active-background-color,var(--slot-menu-list-active-background-color));color:var(--luzmo-slot-menu-list-active-color,var(--slot-menu-list-active-color))}:host .active:hover{background-color:var(--luzmo-slot-menu-list-active-background-color-hover,var(--slot-menu-list-active-background-color-hover))}:host .active .draggable-slot-content:focus-visible{background-color:var(--luzmo-slot-menu-list-active-background-color-hover,var(--slot-menu-list-active-background-color-hover));outline:none}:host .active .draggable-slot-content-remove:focus-visible{outline-color:var(--luzmo-slot-menu-list-active-color,var(--slot-menu-list-active-color));background-color:var(--luzmo-slot-menu-list-active-background-color-hover,var(--slot-menu-list-active-background-color-hover))}.calculation-label{align-items:center;gap:var(--luzmo-spacing-3);display:inline-flex}.calculation-label-icon{flex:none;display:inline-flex}.drop-indicator{height:var(--luzmo-slot-menu-list-drop-indicator-height,var(--slot-menu-list-drop-indicator-height));background-color:var(--luzmo-slot-menu-list-drop-indicator-color,var(--slot-menu-list-drop-indicator-color));position:absolute;left:0;right:0}.drop-indicator:before{content:\"\";border:var(--luzmo-slot-menu-list-drop-indicator-height,var(--slot-menu-list-drop-indicator-height)) solid var(--luzmo-slot-menu-list-drop-indicator-color,var(--slot-menu-list-drop-indicator-color));background:var(--luzmo-slot-menu-list-drop-indicator-background,var(--luzmo-background-color));width:100%;left:calc(-.5 * (var(--luzmo-slot-menu-list-drop-indicator-circle-size,var(--slot-menu-list-drop-indicator-circle-size)) + var(--luzmo-slot-menu-list-drop-indicator-height,var(--slot-menu-list-drop-indicator-height))));top:calc(-.5 * (var(--luzmo-slot-menu-list-drop-indicator-circle-size,var(--slot-menu-list-drop-indicator-circle-size)) + var(--luzmo-slot-menu-list-drop-indicator-height,var(--slot-menu-list-drop-indicator-height))));height:var(--luzmo-slot-menu-list-drop-indicator-circle-size,var(--slot-menu-list-drop-indicator-circle-size));width:var(--luzmo-slot-menu-list-drop-indicator-circle-size,var(--slot-menu-list-drop-indicator-circle-size));border-radius:50%;display:block;position:absolute}.drop-indicator[data-edge=top]{top:calc(-.5 * var(--luzmo-slot-menu-list-drop-indicator-height,var(--slot-menu-list-drop-indicator-height)))}.drop-indicator[data-edge=bottom]{bottom:calc(-.5 * var(--luzmo-slot-menu-list-drop-indicator-height,var(--slot-menu-list-drop-indicator-height)))}.draggable-slot-content{justify-content:space-between;gap:var(--luzmo-slot-menu-label-to-icon-gap,var(--slot-menu-label-to-icon-gap));touch-action:none;cursor:pointer;align-items:center;display:flex}.draggable-slot-content:focus-visible{background-color:color-mix(in srgb, var(--luzmo-primary) 20%, transparent);outline:none}.draggable-slot-content .draggable-slot-content-label{padding-block:var(--luzmo-slot-menu-list-item-vertical-padding,var(--slot-menu-list-item-vertical-padding));text-overflow:ellipsis;white-space:nowrap;font:inherit;color:inherit;cursor:inherit;text-align:start;background:0 0;border:none;flex:auto;padding-inline-start:var(--luzmo-slot-menu-list-item-horizontal-padding,var(--slot-menu-list-item-horizontal-padding));overflow:hidden}.draggable-slot-content .draggable-slot-content-remove{padding:var(--luzmo-spacing-1);font:inherit;color:inherit;cursor:inherit;border-radius:var(--luzmo-border-radius);background:0 0;border:none;flex:none;justify-content:center;align-items:center;margin-inline-end:var(--luzmo-slot-menu-list-item-horizontal-padding,var(--slot-menu-list-item-horizontal-padding));display:flex}.draggable-slot-content .draggable-slot-content-remove:focus-visible{outline:var(--luzmo-indicator-width) solid var(--luzmo-indicator-color);outline-offset:1px}:host{--slot-menu-list-active-background-color:var(--luzmo-primary);--slot-menu-list-active-background-color-hover:var(--luzmo-primary-hover);--slot-menu-list-active-color:var(--luzmo-primary-inverse-color);--slot-menu-list-background-color-hover:var(--luzmo-background-color-hover);--slot-menu-list-drop-indicator-color:var(--luzmo-font-color-down);--slot-menu-list-drop-indicator-height:2px;--slot-menu-list-drop-indicator-circle-size:4px;--slot-menu-list-border-bottom-width:0px;--slot-menu-list-border-bottom-color:transparent;--slot-menu-list-max-height:calc(var(--luzmo-component-height) * 4);--slot-menu-list-scrollbar-width:var(--luzmo-scrollbar-size);--slot-menu-list-scrollbar-track-background:var(--luzmo-scrollbar-track-background);--slot-menu-list-scrollbar-track-border-radius:var(--luzmo-scrollbar-track-border-radius);--slot-menu-list-scrollbar-thumb-background:var(--luzmo-scrollbar-thumb-background);--slot-menu-list-scrollbar-thumb-border-radius:var(--luzmo-scrollbar-thumb-border-radius);--slot-menu-list-scrollbar-thumb-hover-background:var(--luzmo-scrollbar-thumb-hover-background);--slot-menu-display-settings-min-width:19rem;--slot-menu-min-height:calc(var(--luzmo-component-height) * 2);--slot-menu-font-size:var(--luzmo-font-size);--slot-menu-list-item-horizontal-padding:var(--luzmo-spacing-4);--slot-menu-list-item-vertical-padding:var(--luzmo-spacing-3);--slot-menu-label-to-icon-gap:var(--luzmo-spacing-3)}:host([size=s]){--slot-menu-display-settings-min-width:16rem;--slot-menu-min-height:calc(var(--luzmo-component-height-s) * 2);--slot-menu-font-size:var(--luzmo-font-size-s);--slot-menu-list-item-horizontal-padding:var(--luzmo-spacing-3);--slot-menu-list-item-vertical-padding:var(--luzmo-spacing-3);--slot-menu-label-to-icon-gap:var(--luzmo-spacing-2)}:host([size=l]){--slot-menu-display-settings-min-width:23rem;--slot-menu-min-height:calc(var(--luzmo-component-height-l) * 2);--slot-menu-font-size:var(--luzmo-font-size-l);--slot-menu-list-item-horizontal-padding:var(--luzmo-spacing-5);--slot-menu-list-item-vertical-padding:var(--luzmo-spacing-3);--slot-menu-label-to-icon-gap:var(--luzmo-spacing-4)}:host([size=xl]){--slot-menu-display-settings-min-width:26rem;--slot-menu-min-height:calc(var(--luzmo-component-height-xl) * 2);--slot-menu-font-size:var(--luzmo-font-size-xl);--slot-menu-list-item-horizontal-padding:var(--luzmo-spacing-5);--slot-menu-list-item-vertical-padding:var(--luzmo-spacing-4);--slot-menu-label-to-icon-gap:var(--luzmo-spacing-5)}", Q = class extends i(r, { validSizes: Object.values(a) }) {
-	constructor(...t) {
-		super(...t), this.language = "en", this.contentLanguage = "en", this.slotContents = [], this.slotName = "measure", this.slotType = "numeric", this.activeIndex = 0, this._sendChangeEvent = () => {
-			this.dispatchEvent(new CustomEvent("luzmo-slot-list-changed", {
-				bubbles: !0,
-				composed: !0,
-				cancelable: !0,
-				detail: {
-					slotContents: structuredClone(this.slotContents),
-					activeIndex: this.activeIndex
-				}
-			}));
-		}, this._cleanupFns = [], this._attachAll = () => {
-			[...this._draggableSlotContentElements].forEach((t) => {
-				let r = this._sendChangeEvent.bind(this), i = this, a = n({
-					element: t,
-					onGenerateDragPreview({ nativeSetDragImage: e }) {
-						g({
-							nativeSetDragImage: e,
-							render({ container: e }) {
-								let n = document.createElement("div");
-								n.classList.add("drag-preview");
-								let r = {};
-								[
-									[
-										"borderColor",
-										"--luzmo-slot-menu-list-border-color",
-										"--luzmo-border-color"
-									],
-									[
-										"backgroundColor",
-										"--luzmo-slot-menu-list-background-color",
-										"--luzmo-background-color"
-									],
-									[
-										"color",
-										"--luzmo-slot-menu-list-font-color",
-										"--slot-menu-list-font-color"
-									],
-									[
-										"fontSize",
-										"--luzmo-slot-menu-list-font-size",
-										"--slot-menu-list-font-size"
-									],
-									[
-										"horizontalPadding",
-										"--luzmo-slot-menu-list-item-horizontal-padding",
-										"--slot-menu-list-item-horizontal-padding"
-									],
-									[
-										"verticalPadding",
-										"--luzmo-slot-menu-list-item-vertical-padding",
-										"--slot-menu-list-item-vertical-padding"
-									],
-									[
-										"borderRadius",
-										"--luzmo-slot-menu-list-border-radius",
-										"--luzmo-border-radius"
-									],
-									[
-										"fontFamily",
-										"--luzmo-slot-menu-list-font-family",
-										"--luzmo-font-family"
-									]
-								].forEach(([e, n, i]) => {
-									let a = _(t, n) || _(t, i);
-									r[e] = a;
-								}), n.textContent = t.querySelector("[data-task-content]")?.textContent || t.dataset.taskLabel || t.textContent, Object.assign(n.style, {
-									border: `1px solid ${r.borderColor}`,
-									backgroundColor: r.backgroundColor,
-									borderRadius: r.borderRadius,
-									fontFamily: r.fontFamily,
-									fontSize: r.fontSize,
-									color: r.color,
-									paddingInline: `${r.horizontalPadding}`,
-									paddingBlock: `${r.verticalPadding}`
-								}), e.append(n);
-							}
-						});
-					},
-					getInitialData() {
-						let e = t.parentElement, n = 0;
-						return e && (n = [...e.parentElement?.children ?? []].indexOf(e)), { index: n };
-					},
-					onDragStart() {
-						t.style.opacity = "0.5";
-					},
-					onDrop() {
-						t.style.opacity = "1";
-					}
-				});
-				this._cleanupFns.push(a);
-				let o = e({
-					element: t,
-					canDrop({ source: e }) {
-						return e.element !== t && e?.element?.classList.contains("draggable-slot-content");
-					},
-					getData(e) {
-						return me({}, {
-							element: t,
-							input: e.input,
-							allowedEdges: ["top", "bottom"]
-						});
-					},
-					getIsSticky() {
-						return !0;
-					},
-					onDragEnter({ self: e }) {
-						let n = Z(e.data);
-						if (!n) return;
-						let r = document.createElement("div");
-						r.classList.add("drop-indicator"), r.dataset.edge = n, t.after(r);
-					},
-					onDrag({ self: e }) {
-						let n = Z(e.data);
-						if (!n) {
-							t.nextElementSibling?.remove();
-							return;
-						}
-						if (t.nextElementSibling?.getAttribute("data-edge") === n) return;
-						t.nextElementSibling?.remove();
-						let r = document.createElement("div");
-						r.classList.add("drop-indicator"), r.dataset.edge = n, t.after(r);
-					},
-					onDragLeave() {
-						t.nextElementSibling?.remove();
-					},
-					onDrop({ self: e, source: n }) {
-						t.nextElementSibling?.remove();
-						let a = Z(e.data), o = e.element.parentElement;
-						if (typeof n.data.index == "number" && o) {
-							let e = [...o.parentElement?.children ?? []].indexOf(o);
-							a === "bottom" && n.data.index >= e && e < (o?.parentElement?.children?.length ?? 0) - 1 ? e += 1 : a === "top" && e > n.data.index && --e;
-							let t = i.activeIndex, r = n.data.index, s = e, c = i.slotContents[r];
-							i.slotContents.splice(r, 1), i.slotContents.splice(s, 0, c), r === t ? i.activeIndex = s : r < t && s >= t ? i.activeIndex = t - 1 : r > t && s <= t && (i.activeIndex = t + 1);
-						}
-						a && (fe(n.element), i.requestUpdate(), r());
-					}
-				});
-				this._cleanupFns.push(o);
-			});
-		}, this._detachAll = () => {
-			this._cleanupFns.forEach((e) => e()), this._cleanupFns = [];
-		};
-	}
-	static get styles() {
-		return [T(he)];
-	}
-	willUpdate() {
-		this._detachAll();
-	}
-	updated() {
-		this._attachAll();
-	}
-	disconnectedCallback() {
-		super.disconnectedCallback(), this._detachAll();
-	}
-	setActiveIndex(e) {
-		this.activeIndex = e, this._sendChangeEvent();
-	}
-	removeSlotContent(e) {
-		this.slotContents = this.slotContents.filter((t, n) => n !== e), this.activeIndex = this.slotContents.length === 0 ? 0 : Math.min(this.activeIndex, this.slotContents.length - 1), this._sendChangeEvent();
-	}
-	_moveItem(e, t) {
-		let n = this.slotContents[e], r = [...this.slotContents];
-		r.splice(e, 1), r.splice(t, 0, n), this.slotContents = r, this.activeIndex === e ? this.activeIndex = t : e < this.activeIndex && t >= this.activeIndex ? --this.activeIndex : e > this.activeIndex && t <= this.activeIndex && (this.activeIndex += 1), this._sendChangeEvent(), this.updateComplete.then(() => this._draggableSlotContentElements[t]?.focus());
-	}
-	_handleContentKeydown(e, t) {
-		switch (t.key) {
-			case " ":
-			case "Enter":
-				t.preventDefault(), this.setActiveIndex(e);
-				break;
-			case "ArrowUp":
-				t.preventDefault(), t.altKey && e > 0 ? this._moveItem(e, e - 1) : !t.altKey && e > 0 && this._draggableSlotContentElements[e - 1]?.focus();
-				break;
-			case "ArrowDown":
-				t.preventDefault(), t.altKey && e < this.slotContents.length - 1 ? this._moveItem(e, e + 1) : !t.altKey && e < this.slotContents.length - 1 && this._draggableSlotContentElements[e + 1]?.focus();
-				break;
-		}
-	}
-	_handleTrashClick(e, t) {
-		t.stopPropagation(), this.removeSlotContent(e);
-	}
-	_handleTrashKeydown(e) {
-		(e.key === " " || e.key === "Enter") && e.stopPropagation();
-	}
-	render() {
-		let e = {
-			name: this.slotName,
-			type: this.slotType
-		}, t = this.slotContents.map((t, n) => {
-			let r = u(t.label ?? {}, this.contentLanguage) ?? k("Untitled", { desc: "Fallback label for a slot content without a name" }), i = U(t, e) ? H(t) : void 0, a = n === this.activeIndex;
-			return w`<li class=${a ? "active" : ""}>
-          <div class="draggable-slot-content"
-            data-task-label=${i ?? r}
-            tabindex="0"
-            role="option"
-            aria-selected=${a ? "true" : "false"}
-            @click=${this.setActiveIndex.bind(this, n)}
-            @keydown=${this._handleContentKeydown.bind(this, n)}
-          >
-            <span class="draggable-slot-content-label" data-task-content>
-              ${i ? W(t) : r}
-            </span>
-            <button
-              class="draggable-slot-content-remove"
-              aria-label=${k("Remove", { desc: "Remove button label" })}
-              @click=${this._handleTrashClick.bind(this, n)}
-              @keydown=${this._handleTrashKeydown}
-            >
-              ${S(C)}
-            </button>
-          </div>
-        </li>`;
-		});
-		return w`<ul role="listbox" aria-label=${k("Slot contents", { desc: "Accessible label for slot menu content list" })}>${t}</ul>`;
-	}
-};
-//#endregion
-//#region src/components/slot-menu-list/index.ts
-o([E({
-	type: String,
-	reflect: !0
-})], Q.prototype, "language", void 0), o([E({
-	type: String,
-	attribute: "content-language",
-	reflect: !0
-})], Q.prototype, "contentLanguage", void 0), o([ne(".draggable-slot-content")], Q.prototype, "_draggableSlotContentElements", void 0), o([E({ type: Array })], Q.prototype, "slotContents", void 0), o([E({
-	type: String,
-	attribute: "slot-name",
-	reflect: !0
-})], Q.prototype, "slotName", void 0), o([E({
-	type: String,
-	attribute: "slot-type",
-	reflect: !0
-})], Q.prototype, "slotType", void 0), o([E({ type: Number })], Q.prototype, "activeIndex", void 0), customElements.get("luzmo-slot-menu-list") || customElements.define("luzmo-slot-menu-list", Q);
-//#endregion
-//#region src/components/slot-menu/slot-menu.module.scss?inline
-var ge = ":host{font-family:var(--luzmo-slot-menu-font-family,var(--luzmo-font-family));font-size:var(--luzmo-slot-menu-font-size,var(--slot-menu-font-size));color:var(--luzmo-slot-menu-font-color,var(--luzmo-font-color));width:fit-content;display:block}luzmo-slot-menu-list{min-width:var(--luzmo-slot-menu-list-min-width,var(--slot-menu-list-min-width));max-width:var(--luzmo-slot-menu-list-max-width,var(--slot-menu-list-max-width));background-color:var(--luzmo-slot-menu-list-background-color,var(--slot-menu-list-background-color));border-bottom-left-radius:var(--luzmo-slot-menu-list-border-radius,var(--slot-menu-list-border-radius))}.slot-contents-container{border:var(--luzmo-slot-menu-border-width,var(--luzmo-border-width)) solid var(--luzmo-slot-menu-border-color,var(--luzmo-border-color));border-radius:var(--luzmo-slot-menu-border-radius,var(--luzmo-border-radius));background:var(--luzmo-slot-menu-background-color,var(--luzmo-background-color));--slot-menu-popup-filter:drop-shadow(var(--luzmo-slot-menu-popup-shadow-horizontal,var(--slot-menu-popup-shadow-horizontal)) var(--luzmo-slot-menu-popup-shadow-vertical,var(--slot-menu-popup-shadow-vertical)) var(--luzmo-slot-menu-popup-shadow-blur,var(--slot-menu-popup-shadow-blur)) var(--luzmo-slot-menu-popup-shadow-color,var(--slot-menu-popup-shadow-color)));filter:var(--luzmo-slot-menu-popup-filter,var(--slot-menu-popup-filter));border-top-left-radius:0;position:relative}.slot-contents-container .inner-container{align-items:stretch;display:flex}.slot-contents-container .inner-container luzmo-display-settings{min-width:var(--luzmo-slot-menu-display-settings-min-width,var(--slot-menu-display-settings-min-width));padding:var(--luzmo-slot-menu-display-settings-vertical-padding,var(--slot-menu-display-settings-vertical-padding)) var(--luzmo-slot-menu-display-settings-horizontal-padding,var(--slot-menu-display-settings-horizontal-padding))}.slot-contents-container:has(>.close) .inner-container luzmo-display-settings{padding-block-start:var(--luzmo-slot-menu-close-button-clearance,var(--slot-menu-close-button-clearance))}:host([variant=popup]) .slot-contents-container{border-top-left-radius:var(--luzmo-slot-menu-border-radius,var(--luzmo-border-radius));overflow:hidden}.slot-menu-top-menu{border-radius:var(--luzmo-slot-menu-border-radius,var(--luzmo-border-radius));z-index:1;width:fit-content;margin-bottom:calc(-1 * var(--luzmo-slot-menu-border-width,var(--luzmo-border-width)));border-bottom-right-radius:0;border-bottom-left-radius:0;align-items:center;display:flex;position:relative;overflow:hidden}.drag-handle{background-color:var(--luzmo-slot-menu-drag-handle-background-color,var(--luzmo-background-color-highlight));cursor:move;border:var(--luzmo-slot-menu-drag-handle-border-width,var(--slot-menu-drag-handle-border-width)) solid var(--luzmo-slot-menu-border-color,var(--luzmo-background-color-highlight));width:fit-content;font-size:var(--luzmo-slot-menu-drag-handle-size,var(--slot-menu-drag-handle-size));padding:var(--luzmo-slot-menu-drag-handle-vertical-padding,var(--slot-menu-drag-handle-vertical-padding)) var(--luzmo-slot-menu-drag-handle-horizontal-padding,var(--slot-menu-drag-handle-horizontal-padding));border-bottom:none}.drag-handle:hover{background-color:var(--luzmo-slot-menu-drag-handle-background-color-hover,var(--luzmo-background-color-highlight-hover))}.drag-handle:focus-visible{box-shadow:0 0 0 var(--luzmo-indicator-width) var(--luzmo-indicator-color)}.slot-content-action{max-width:var(--luzmo-slot-menu-top-menu-label-max-width,var(--slot-menu-top-menu-label-max-width));gap:var(--luzmo-slot-menu-label-to-icon-gap,var(--slot-menu-label-to-icon-gap));background-color:var(--luzmo-slot-menu-content-label-background-color,var(--luzmo-primary));color:var(--luzmo-slot-menu-content-label-color,var(--luzmo-primary-inverse-color));border:var(--luzmo-slot-menu-border-width,var(--luzmo-border-width)) solid var(--luzmo-slot-menu-content-label-border-color,var(--luzmo-primary));padding:var(--luzmo-slot-menu-drag-handle-vertical-padding,var(--slot-menu-drag-handle-vertical-padding)) var(--luzmo-slot-menu-drag-handle-horizontal-padding,var(--slot-menu-drag-handle-horizontal-padding));border-bottom:none;flex:0 auto;display:flex}.slot-content-action:hover{background-color:var(--luzmo-slot-menu-content-label-background-color-hover,var(--luzmo-primary-hover))}.slot-content-action:focus{background-color:var(--luzmo-slot-menu-content-label-background-color-focus,var(--luzmo-primary-focus))}.slot-content-action .slot-content-label{white-space:nowrap;text-overflow:ellipsis;flex:auto;overflow:hidden}.slot-content-action .slot-content-remove{cursor:pointer;border-radius:var(--luzmo-slot-menu-border-radius,var(--luzmo-border-radius));font:inherit;color:inherit;background:0 0;border:none;flex:none;padding:0}.slot-content-action .slot-content-remove:focus-visible{background-color:var(--luzmo-slot-menu-content-label-background-color-focus,var(--luzmo-primary-focus));box-shadow:0 0 0 var(--luzmo-indicator-width) var(--luzmo-slot-menu-content-label-color,var(--luzmo-primary-inverse-color));outline:none}.calculation-label{align-items:center;gap:var(--luzmo-spacing-3);display:inline-flex}.calculation-label-icon{flex:none;display:inline-flex}.close{font:inherit;color:inherit;right:var(--luzmo-slot-menu-close-icon-right,var(--slot-menu-close-icon-right));cursor:pointer;top:calc(-2 * var(--luzmo-slot-menu-border-width,var(--luzmo-border-width)));background:0 0;background-color:var(--luzmo-slot-menu-close-button-background-color,var(--luzmo-background-color-highlight));font-size:var(--luzmo-slot-menu-close-button-size,var(--slot-menu-close-button-size));border:none;border:var(--luzmo-slot-menu-border-width,var(--luzmo-border-width)) solid var(--luzmo-slot-menu-border-color,var(--luzmo-border-color));border-radius:var(--luzmo-slot-menu-border-radius,var(--luzmo-border-radius));padding:0;padding:var(--luzmo-slot-menu-close-button-vertical-padding,var(--slot-menu-close-button-vertical-padding)) var(--luzmo-slot-menu-close-button-horizontal-padding,var(--slot-menu-close-button-horizontal-padding));border-top-left-radius:0;border-top-right-radius:0;position:absolute}.close:hover{background-color:var(--luzmo-slot-menu-close-button-background-color-hover,var(--luzmo-background-color-highlight-hover))}.close:focus-visible{border-color:var(--luzmo-indicator-color);outline:none}:host{--slot-menu-display-settings-min-width:19rem;--slot-menu-min-height:calc(var(--luzmo-component-height) * 2);--slot-menu-font-size:var(--luzmo-font-size);--slot-menu-display-settings-horizontal-padding:var(--luzmo-spacing-5);--slot-menu-display-settings-vertical-padding:var(--luzmo-spacing-4);--slot-menu-top-menu-label-max-width:12rem;--slot-menu-list-min-width:8rem;--slot-menu-list-max-width:12rem;--slot-menu-label-to-icon-gap:var(--luzmo-spacing-3);--slot-menu-drag-handle-size:var(--luzmo-font-size);--slot-menu-drag-handle-vertical-padding:var(--luzmo-spacing-2);--slot-menu-drag-handle-horizontal-padding:var(--luzmo-spacing-3);--slot-menu-drag-handle-border-width:var(--luzmo-border-width);--slot-menu-close-button-size:var(--luzmo-font-size-s);--slot-menu-close-button-vertical-padding:var(--luzmo-spacing-2);--slot-menu-close-button-horizontal-padding:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--slot-menu-close-button-clearance:calc(var(--luzmo-slot-menu-close-button-size,var(--slot-menu-close-button-size)) + 2 * var(--luzmo-slot-menu-close-button-vertical-padding,var(--slot-menu-close-button-vertical-padding)) + 2 * var(--luzmo-slot-menu-border-width,var(--luzmo-border-width)) + var(--luzmo-spacing-2));--slot-menu-popup-shadow-horizontal:0;--slot-menu-popup-shadow-vertical:1px;--slot-menu-popup-shadow-blur:4px;--slot-menu-popup-shadow-color:var(--luzmo-border-color);--slot-menu-popup-box-shadow:var(--slot-menu-popup-shadow-horizontal) var(--slot-menu-popup-shadow-vertical) var(--slot-menu-popup-shadow-blur) var(--slot-menu-popup-shadow-color);--slot-menu-close-icon-right:1rem;--slot-menu-list-border-radius:var(--luzmo-border-radius)}:host([size=s]){--slot-menu-display-settings-min-width:16rem;--slot-menu-min-height:calc(var(--luzmo-component-height-s) * 2);--slot-menu-font-size:var(--luzmo-font-size-s);--slot-menu-display-settings-horizontal-padding:var(--luzmo-spacing-4);--slot-menu-display-settings-vertical-padding:var(--luzmo-spacing-3);--slot-menu-top-menu-label-max-width:10rem;--slot-menu-list-min-width:6rem;--slot-menu-list-max-width:10rem;--slot-menu-label-to-icon-gap:var(--luzmo-spacing-2);--slot-menu-drag-handle-size:var(--luzmo-font-size-s);--slot-menu-drag-handle-vertical-padding:var(--luzmo-spacing-2);--slot-menu-drag-handle-horizontal-padding:var(--luzmo-spacing-3);--slot-menu-close-button-size:var(--luzmo-font-size-xs);--slot-menu-close-button-vertical-padding:var(--luzmo-spacing-2);--slot-menu-close-button-horizontal-padding:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1))}:host([size=l]){--slot-menu-display-settings-min-width:23rem;--slot-menu-min-height:calc(var(--luzmo-component-height-l) * 2);--slot-menu-font-size:var(--luzmo-font-size-l);--slot-menu-display-settings-horizontal-padding:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--slot-menu-display-settings-vertical-padding:var(--luzmo-spacing-5);--slot-menu-top-menu-label-max-width:14rem;--slot-menu-list-min-width:9rem;--slot-menu-list-max-width:14rem;--slot-menu-label-to-icon-gap:var(--luzmo-spacing-4);--slot-menu-drag-handle-size:var(--luzmo-font-size-l);--slot-menu-drag-handle-vertical-padding:var(--luzmo-spacing-3);--slot-menu-drag-handle-horizontal-padding:var(--luzmo-spacing-3);--slot-menu-close-button-size:var(--luzmo-font-size);--slot-menu-close-button-vertical-padding:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--slot-menu-close-button-horizontal-padding:var(--luzmo-spacing-3)}:host([size=xl]){--slot-menu-display-settings-min-width:26rem;--slot-menu-min-height:calc(var(--luzmo-component-height-xl) * 2);--slot-menu-font-size:var(--luzmo-font-size-xl);--slot-menu-display-settings-horizontal-padding:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-2));--slot-menu-display-settings-vertical-padding:var(--luzmo-spacing-5);--slot-menu-top-menu-label-max-width:16rem;--slot-menu-list-min-width:10rem;--slot-menu-list-max-width:16rem;--slot-menu-label-to-icon-gap:var(--luzmo-spacing-5);--slot-menu-drag-handle-size:var(--luzmo-font-size-xl);--slot-menu-drag-handle-vertical-padding:var(--luzmo-spacing-3);--slot-menu-drag-handle-horizontal-padding:var(--luzmo-spacing-4);--slot-menu-close-button-size:var(--luzmo-font-size-l);--slot-menu-close-button-vertical-padding:var(--luzmo-spacing-3);--slot-menu-close-button-horizontal-padding:var(--luzmo-spacing-3)}", $ = class extends M(i(r, { validSizes: Object.values(a) })) {
-	constructor(...e) {
-		super(...e), this.language = "en", this.contentLanguage = "en", this.slotType = "numeric", this.variant = "draggable", this._periodOverPeriodUiType = null, this.measureColumns = [], this.apiUrl = "https://api.luzmo.com", this.authKey = "", this.authToken = "", this.datasetsDataFields = [], this._slotContents = [], this._activeIndex = this.slotIndex ?? 0, this._linkedDatasetsIds = [];
-	}
-	static get styles() {
-		return [T(ge)];
-	}
-	get _store() {
-		return this._consumedStore ? this._consumedStore : (this._ownStore || (this._ownStore = new R(), new ae(this, {
-			context: L,
-			initialValue: this._ownStore
-		})), this._ownStore);
-	}
-	get _currentSlotContent() {
-		return this._slotContents[this.slotIndex ?? this._activeIndex] ?? {};
-	}
-	get _currentLabel() {
-		return u(this._currentSlotContent.label, this.contentLanguage) ?? "Untitled";
-	}
-	_renderCurrentLabel() {
-		let e = {
-			name: this.slotName,
-			type: this.slotType
-		};
-		return U(this._currentSlotContent, e) ? W(this._currentSlotContent) : this._currentLabel;
-	}
-	connectedCallback() {
-		let e = {};
-		this.apiUrl && (e.apiUrl = this.apiUrl), this.authKey && this.authToken && (e.authKey = this.authKey, e.authToken = this.authToken), s.configure(e), super.connectedCallback(), this._attachDragHandle();
-	}
-	disconnectedCallback() {
-		super.disconnectedCallback(), this._cleanupDrag &&= (this._cleanupDrag(), void 0), this._panelResizeObserver?.disconnect(), this._panelResizeObserver = void 0;
-	}
-	_syncListMaxHeight() {
-		let e = this.displaySettingsElement, t = this.slotMenuListElement;
-		if (!e || !t) return;
-		let n = e.offsetHeight;
-		n > 0 && t.style.setProperty("--luzmo-slot-menu-list-max-height", `${n}px`);
-	}
-	_observePanelResize() {
-		let e = this.displaySettingsElement;
-		e && (this._panelResizeObserver ||= new ResizeObserver(() => this._syncListMaxHeight()), this._panelResizeObserver.disconnect(), this._panelResizeObserver.observe(e), this._syncListMaxHeight());
-	}
-	_attachDragHandle() {
-		if (this._cleanupDrag || this.variant !== "draggable" || this.noDrag) return;
-		let e = this.renderRoot.querySelector(".drag-handle");
-		if (!e) return;
-		let t = this.dragBoundary ? document.querySelector(this.dragBoundary) : document.documentElement;
-		this._cleanupDrag = de({
-			element: this,
-			handle: e,
-			boundary: t
-		});
-	}
-	_sendChangeEvent() {
-		let e = this._store.slotContents.get();
-		this.dispatchEvent(new CustomEvent("luzmo-slot-contents-changed", {
-			bubbles: !0,
-			composed: !0,
-			cancelable: !0,
-			detail: {
-				slotContents: structuredClone(e),
-				linkedDatasetsIds: [...this._linkedDatasetsIds]
-			}
-		}));
-	}
-	resetInfoVisibility() {
-		this.displaySettingsElement?.resetInfoVisibility && this.displaySettingsElement.resetInfoVisibility(!1);
-	}
-	_sendCloseEvent() {
-		this.dispatchEvent(new CustomEvent("luzmo-close", {
-			bubbles: !0,
-			composed: !0,
-			cancelable: !0
-		}));
-	}
-	isArrayColumnType(e) {
-		return e.startsWith("array[");
-	}
-	async willUpdate(e) {
-		let t = this._store, n = t.slotContents.get(), r = e.has("slotContents");
-		Array.isArray(this.slotContents) && (n.length === 0 || r) && t.setContents(structuredClone(this.slotContents), this.slotName);
-		let i = t.slotContents.get();
-		if (i !== this._slotContents) {
-			this._slotContents = i;
-			let { set: e, column: n } = this._currentSlotContent;
-			if (e && I(e) && e !== this._lastFetchedDatasetId) {
-				if (this._lastFetchedDatasetId = e, await s.fetchDatasetsRecursive([e]), !this.isConnected) return;
-				this._linkedDatasetsIds = s.getLinkedDatasetsIds(e);
-			}
-			let r = s.getAvailableDatasets();
-			this.measureColumns = r.map((e) => ({
-				datasetId: e.id,
-				datasetName: e.name,
-				columns: e.columns?.filter((e) => e.type === "numeric" && e.id !== n)
-			})), t.activeIndex.get() !== this._activeIndex && t.updateActive(this._activeIndex);
-			let a = this.itemType === "kpi" ? "comparison-measure" : "measure";
-			if (this.slotName === a) {
-				t.linkedDataset.set(r.filter((t) => t.id === e)), t.setPeriodOverPeriodCondition(this.itemType, this._currentSlotContent);
-				let n = this._currentSlotContent.subtype === "duration" && this.isArrayColumnType(this._currentSlotContent.type);
-				this._periodOverPeriodUiType = n ? null : t.periodOverPeriodUiType.get();
-			}
-		}
-	}
-	updated() {
-		this.displaySettingsElement && (this.displaySettingsElement.periodOverPeriodUiType = this._periodOverPeriodUiType, this.displaySettingsElement.measureColumns = this.measureColumns, this.displaySettingsElement.showRemoveButton = this.variant === "popup" && (typeof this.slotIndex == "number" || this._slotContents?.length === 1)), this._observePanelResize();
-	}
-	_handleSlotListChange(e) {
-		let t = this._store, n = structuredClone(e.detail.slotContents), r = e.detail.activeIndex;
-		r !== this._activeIndex && (this._activeIndex = r, t.updateActive(r)), t.setContents(n, this.slotName), this._slotContents = t.slotContents.get();
-		let i = this._slotContents[this._activeIndex], a = i?.column ?? i?.columnId, o = i?.set ?? i?.datasetId, s = i?.formulaId ?? (l(i?.formula) ? i.formula : void 0);
-		(a || s) && o && (this.dispatchEvent(new CustomEvent("luzmo-slot-menu-active", {
-			bubbles: !0,
-			composed: !0,
-			detail: { datasetId: o }
-		})), setTimeout(() => {
-			this.dispatchEvent(new CustomEvent("luzmo-slot-menu-highlight", {
-				bubbles: !0,
-				composed: !0,
-				detail: {
-					datasetId: o,
-					level: i?.level ?? 0,
-					...a && { columnId: a },
-					...s && { formulaId: s }
-				}
-			}));
-		})), this._slotContents.length <= 1 && this.requestUpdate(), this._sendChangeEvent();
-	}
-	_handleSlotContentChange(e) {
-		let t = this._store, n = this.slotIndex ?? this._activeIndex;
-		t.updateContent(structuredClone(e.detail.slotContent), n), this._slotContents = t.slotContents.get(), this.slotMenuListElement && (this.slotMenuListElement.slotContents = this._slotContents), this._sendChangeEvent();
-	}
-	removeSlotContent(e) {
-		let t = this._store;
-		t.removeContent(e), this._slotContents = t.slotContents.get(), this._slotContents.length === 0 && this.dispatchEvent(new CustomEvent("luzmo-slot-menu-inactive", {
-			bubbles: !0,
-			composed: !0
-		})), this._sendChangeEvent(), this.close(), this.requestUpdate();
-	}
-	close() {
-		this._sendCloseEvent(), this.resetInfoVisibility();
-	}
-	_removeActiveSlotContent() {
-		this.removeSlotContent(this.slotIndex ?? this._activeIndex);
-	}
-	_handleInfoVisibilityChanged(e) {
-		this.dispatchEvent(new CustomEvent("luzmo-info-visibility-changed", { detail: e.detail }));
-	}
-	render() {
-		let e = `${this.slotType}-${this._currentSlotContent?.type ?? ""}`;
-		return w`<div class="slot-menu-top-menu" role="region" aria-label=${k("Slot menu", { desc: "Accessible label for slot menu region" })}>
-        ${this.variant === "draggable" ? w`<div class="drag-handle">${S(v)}</div>` : ""}
-        ${this._slotContents && this._slotContents.length === 1 && this.variant !== "popup" ? w` <div class="slot-content-action">
-              <div class="slot-content-label">${this._renderCurrentLabel()}</div>
-              <button
-                class="slot-content-remove"
-                aria-label=${k("Remove", { desc: "Remove button label" })}
-                @click=${this.removeSlotContent.bind(this, 0)}
-              >
-                ${S(C)}
-              </button>
-            </div>` : ""}
-      </div>
-      <div
-        class="slot-contents-container ${this._slotContents?.length > 1 ? "multiple" : ""}"
-      >
-        ${this.variant === "popup" ? "" : w`<button class="close" aria-label=${k("Close", {
-			id: "close-action",
-			desc: "Close button label"
-		})} @click=${this.close}>
-              ${S(b)}
-            </button>`}
-        <div class="inner-container">
-          ${this._slotContents?.length > 1 && typeof this.slotIndex != "number" ? w`<luzmo-slot-menu-list
-                .slotContents=${this._slotContents}
-                .contentLanguage=${this.contentLanguage}
-                .slotName=${this.slotName}
-                .slotType=${this.slotType}
-                .activeIndex=${this.slotIndex ?? this._activeIndex}
-                @luzmo-slot-list-changed=${this._handleSlotListChange}
-              ></luzmo-slot-menu-list>` : ""}
-          ${re([
-			this.variant,
-			this.language,
-			this.contentLanguage,
-			this._periodOverPeriodUiType,
-			this._activeIndex,
-			this.size,
-			e,
-			this.slotName,
-			this.datasetsDataFields,
-			this.apiUrl,
-			this.authKey,
-			this.authToken
-		], () => w`<luzmo-display-settings
-                .size=${this.size}
-                .language=${this.language}
-                .contentLanguage=${this.contentLanguage}
-                .slotName=${this.slotName}
-                .slotType=${this.slotType}
-                .measureColumns=${this.measureColumns}
-                .showRemoveButton=${this.variant === "popup" && (typeof this.slotIndex == "number" || this._slotContents?.length === 1)}
-                .slotContent=${this._currentSlotContent}
-                .datasetsDataFields=${this.datasetsDataFields}
-                api-url=${A(this.apiUrl)}
-                auth-key=${A(this.authKey)}
-                auth-token=${A(this.authToken)}
-                .areGrandTotalsEnabled=${this.areGrandTotalsEnabled}
-                .areDatetimeOptionsEnabled=${this.areDatetimeOptionsEnabled}
-                .isBinningDisabled=${this.isBinningDisabled}
-                .isAggregationDisabled=${this.isAggregationDisabled}
-                .isCumulativeSumEnabled=${this.isCumulativeSumEnabled}
-                @luzmo-slot-content-changed=${this._handleSlotContentChange}
-                @luzmo-remove-slot-content=${this._removeActiveSlotContent}
-                @luzmo-info-visibility-changed=${this._handleInfoVisibilityChanged}
-              ></luzmo-display-settings>`)}
-        </div>
-      </div>`;
-	}
-	firstUpdated() {
-		this._attachDragHandle(), this._observePanelResize();
-	}
-	resetPosition() {
-		this.style.transform = "";
-	}
-};
-//#endregion
-//#region src/components/slot-menu/index.ts
-o([E({
-	type: String,
-	reflect: !0
-})], $.prototype, "language", void 0), o([E({
-	type: String,
-	attribute: "content-language",
-	reflect: !0
-})], $.prototype, "contentLanguage", void 0), o([E({
-	type: String,
-	attribute: "slot-type",
-	reflect: !0
-})], $.prototype, "slotType", void 0), o([E({
-	type: String,
-	attribute: "slot-name",
-	reflect: !0
-})], $.prototype, "slotName", void 0), o([E({
-	type: String,
-	attribute: "item-type",
-	reflect: !0
-})], $.prototype, "itemType", void 0), o([E({
-	type: Boolean,
-	attribute: "no-drag",
-	reflect: !0
-})], $.prototype, "noDrag", void 0), o([E({
-	type: Boolean,
-	attribute: "no-close",
-	reflect: !0
-})], $.prototype, "noClose", void 0), o([E({
-	type: String,
-	reflect: !0
-})], $.prototype, "variant", void 0), o([E({
-	type: Boolean,
-	attribute: "no-top-menu-label",
-	reflect: !0
-})], $.prototype, "noTopMenuLabel", void 0), o([j({
-	context: L,
-	subscribe: !0
-})], $.prototype, "_consumedStore", void 0), o([E({
-	type: String,
-	attribute: "drag-boundary",
-	reflect: !1
-})], $.prototype, "dragBoundary", void 0), o([E({ type: Boolean })], $.prototype, "areGrandTotalsEnabled", void 0), o([E({ type: Boolean })], $.prototype, "areDatetimeOptionsEnabled", void 0), o([E({ type: Boolean })], $.prototype, "isBinningDisabled", void 0), o([E({ type: Boolean })], $.prototype, "isAggregationDisabled", void 0), o([E({ type: Boolean })], $.prototype, "isCumulativeSumEnabled", void 0), o([E({
-	type: Array,
-	reflect: !1,
-	attribute: "slot-contents"
-})], $.prototype, "slotContents", void 0), o([O()], $.prototype, "_periodOverPeriodUiType", void 0), o([O()], $.prototype, "measureColumns", void 0), o([E({
-	type: Number,
-	reflect: !1,
-	attribute: "slot-index"
-})], $.prototype, "slotIndex", void 0), o([D("luzmo-display-settings")], $.prototype, "displaySettingsElement", void 0), o([D("luzmo-slot-menu-list")], $.prototype, "slotMenuListElement", void 0), o([E({
-	type: String,
-	attribute: "api-url",
-	reflect: !0
-})], $.prototype, "apiUrl", void 0), o([E({
-	type: String,
-	attribute: "auth-key",
-	reflect: !0
-})], $.prototype, "authKey", void 0), o([E({
-	type: String,
-	attribute: "auth-token",
-	reflect: !0
-})], $.prototype, "authToken", void 0), o([E({ attribute: !1 })], $.prototype, "datasetsDataFields", void 0), o([O()], $.prototype, "_slotContents", void 0), customElements.get("luzmo-slot-menu") || customElements.define("luzmo-slot-menu", $);
-//#endregion
-export { W as a, R as c, le as i, L as l, Q as n, ce as o, G as r, U as s, $ as t, se as u };