@luzmo/analytics-components-kit 1.0.1-alpha.47 → 1.0.1-alpha.49

package/components/display-settings-numeric/index.js

@@ -17,54 +17,56 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-import { m as s, g as x, t as A, s as L } from "../set-locale-DbEAMqUs.js";
-import { l as F } from "../localized-decorator-DNr1P1m0.js";
-import "../index-rQxtPaJl.js";
-import "../index-BHJH1eGn.js";
+import { m as a, g as w, t as S, s as D } from "../set-locale-GI34z_M7.js";
+import { l as C } from "../localized-decorator-Bl5gcI6n.js";
+import "../index-D_jFGBMs.js";
+import "../index-BW3AUnEX.js";
 import "../index-CsDgk_sj.js";
-import "../index-Bdy8Bz-n.js";
-import "../index-Desl7GJ0.js";
-import "../index-CDpuEf8W.js";
+import "../index-BssHAgUU.js";
+import "../index-DsP81c4M.js";
+import "../index-B2ngKWOI.js";
 import "../index-CTVNGPeT.js";
-import { d as v } from "../decompose-numeric-format-BuZcjH2k.js";
-import { r as S, x as l, E as $, n as f } from "../property-BFMfZY1k.js";
-import { a7 as D, ac as w } from "../luzmo-icons-DnAqAQCX.js";
-import { a as C } from "../index-DUF6bALI.js";
-import { r as N } from "../state-BSTa7W6f.js";
-import { e as d } from "../query-Ddbd72Um.js";
-import { L as E } from "../focusable-Bhf_beoW.js";
-import { S as M, E as O } from "../sized-mixin-CkdMApAU.js";
-const y = () => {
+import { d as y } from "../decompose-numeric-format-BuZcjH2k.js";
+import { r as N, x as r, E as f, n as _ } from "../property-DCzt3DR1.js";
+import { a8 as z, ac as E } from "../luzmo-icons-CVeTZ59u.js";
+import { a as I } from "../index-DUF6bALI.js";
+import "../index-BmshD32H.js";
+import { c as M, a as O } from "../calculate-data-item-icon-Dpvf1aLI.js";
+import { l as x } from "../localize-BX7q0S0M.js";
+import { r as k } from "../state-nDsQPund.js";
+import { e as g } from "../query-Ddbd72Um.js";
+import { L as W } from "../focusable-BbymtxWI.js";
+import { S as T, E as U } from "../sized-mixin-BGzkX2g1.js";
+const L = () => {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
-    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-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-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);
+    const e = document.createElement("style");
+    e.setAttribute("data-luzmo-vars", ""), e.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-color-disabled);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-secondary-outline: rgba(255, 0, 255, 0.2);--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: #b3241f;--luzmo-negative-color-down: #9f231f;--luzmo-negative-color-focus: #b3241f;--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-positive-color: rgb(20, 150, 101);--luzmo-positive-color-hover: rgb(17, 128, 86);--luzmo-positive-color-down: rgb(16, 105, 71);--luzmo-positive-color-focus: rgb(17, 128, 86);--luzmo-positive-color-rgb: 20, 150, 101;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: rgb(70, 70, 70);--luzmo-selected-color-down: rgb(40, 40, 40);--luzmo-selected-color-focus: rgb(70, 70, 70);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: rgb(0, 0, 0);--luzmo-selected-color-hard-down: rgb(0, 0, 0);--luzmo-selected-color-hard-focus: rgb(0, 0, 0);--luzmo-color-informative: #1a77e9;--luzmo-color-informative-rgb: 26, 119, 233;--luzmo-color-disabled: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(e);
   }
 };
-y();
-const I = ":host .settings-container{display:flex;flex-direction:column;gap:var(--luzmo-spacing-2)}:host .settings-row{display:flex;justify-content:flex-start;align-items:center;gap:var(--luzmo-display-settings-numeric-gap, var(--display-settings-numeric-gap))}.duration-angle-down-icon{margin-inline-start:var(--luzmo-numeric-duration-levels-dropdown-icon-margin-inline-start, var(--numeric-duration-levels-dropdown-icon-margin-inline-start))}:host{--display-settings-numeric-gap: var(--luzmo-spacing-3);--numeric-duration-levels-dropdown-icon-margin-inline-start: var( --luzmo-spacing-2 )}:host([size=s]){--display-settings-numeric-gap: var(--luzmo-spacing-3);--numeric-duration-levels-dropdown-icon-margin-inline-start: var( --luzmo-spacing-1 )}:host([size=l]){--display-settings-numeric-gap: var(--luzmo-spacing-4);--numeric-duration-levels-dropdown-icon-margin-inline-start: var( --luzmo-spacing-3 )}:host([size=xl]){--display-settings-numeric-gap: var(--luzmo-spacing-5);--numeric-duration-levels-dropdown-icon-margin-inline-start: var( --luzmo-spacing-4 )}", k = {
-  sum: () => s("Sum", { desc: "Numeric Aggregation option" }),
-  cumulativesum: () => s("Cumulative sum", { desc: "Numeric Aggregation option" }),
-  average: () => s("Average", { desc: "Numeric Aggregation option" }),
-  weightedaverage: () => s("Weighted average", { desc: "Numeric Aggregation option" }),
-  median: () => s("Median", { desc: "Numeric Aggregation option" }),
-  count: () => s("Count", { desc: "Numeric Aggregation option" }),
-  distinctcount: () => s("Distinct count", { desc: "Numeric Aggregation option" }),
-  min: () => s("Minimum", { desc: "Numeric Aggregation option" }),
-  max: () => s("Maximum", { desc: "Numeric Aggregation option" }),
-  stddev: () => s("Standard deviation", { desc: "Numeric Aggregation option" }),
-  rate: () => s("Rate", { desc: "Numeric Aggregation option" })
-}, _ = {
+L();
+const j = ":host .settings-container{display:flex;flex-direction:column;gap:var(--luzmo-spacing-2)}:host .settings-row{display:flex;justify-content:flex-start;align-items:center;gap:var(--luzmo-display-settings-numeric-gap, var(--display-settings-numeric-gap))}.duration-angle-down-icon{margin-inline-start:var(--luzmo-numeric-duration-levels-dropdown-icon-margin-inline-start, var(--numeric-duration-levels-dropdown-icon-margin-inline-start))}.dataset-header{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;font-weight:600;text-transform:uppercase;margin-bottom:.5rem;margin-top:.5rem;margin-left:1rem}.no-weight-label{margin-left:1rem}.with-secondary-icon{clip-path:polygon(0 0,60% 0,65% 60%,100% 65%,100% 100%,0 100%)}.secondary-icon{position:absolute;bottom:45%;left:60%;width:auto;font-size:.75em;line-height:1}.data-icon-type{width:1.5rem;text-align:center;position:relative;display:inline-block}:host{--display-settings-numeric-gap: var(--luzmo-spacing-3);--numeric-duration-levels-dropdown-icon-margin-inline-start: var( --luzmo-spacing-2 )}:host([size=s]){--display-settings-numeric-gap: var(--luzmo-spacing-3);--numeric-duration-levels-dropdown-icon-margin-inline-start: var( --luzmo-spacing-1 )}:host([size=l]){--display-settings-numeric-gap: var(--luzmo-spacing-4);--numeric-duration-levels-dropdown-icon-margin-inline-start: var( --luzmo-spacing-3 )}:host([size=xl]){--display-settings-numeric-gap: var(--luzmo-spacing-5);--numeric-duration-levels-dropdown-icon-margin-inline-start: var( --luzmo-spacing-4 )}", P = {
+  sum: () => a("Sum", { desc: "Numeric Aggregation option" }),
+  cumulativesum: () => a("Cumulative sum", { desc: "Numeric Aggregation option" }),
+  average: () => a("Average", { desc: "Numeric Aggregation option" }),
+  median: () => a("Median", { desc: "Numeric Aggregation option" }),
+  count: () => a("Count", { desc: "Numeric Aggregation option" }),
+  distinctcount: () => a("Distinct count", { desc: "Numeric Aggregation option" }),
+  min: () => a("Minimum", { desc: "Numeric Aggregation option" }),
+  max: () => a("Maximum", { desc: "Numeric Aggregation option" }),
+  stddev: () => a("Standard deviation", { desc: "Numeric Aggregation option" }),
+  rate: () => a("Rate", { desc: "Numeric Aggregation option" })
+}, A = {
   general: "123",
   percentage: "%",
   scientific: "SI"
-}, b = {
-  time: () => s("Time", { desc: "Time format option" }),
-  short: () => s("Short", { desc: "Short format option" }),
-  long: () => s("Long", { desc: "Long format option" })
-}, p = {
+}, $ = {
+  time: () => a("Time", { desc: "Time format option" }),
+  short: () => a("Short", { desc: "Short format option" }),
+  long: () => a("Long", { desc: "Long format option" })
+}, v = {
   Auto: {
     auto: !0,
-    label: () => s("Auto", { desc: "Automatic setting of the option" })
+    label: () => a("Auto", { desc: "Automatic setting of the option" })
   },
   "1,000.00": {
     auto: !1,
@@ -80,7 +82,7 @@ const I = ":host .settings-container{display:flex;flex-direction:column;gap:var(
   },
   "1000.00": { auto: !1, label: () => "1000.00", decimalSeparator: "." },
   "1000,00": { auto: !1, label: () => "1000,00", decimalSeparator: "," }
-}, T = {
+}, G = {
   levels: [
     { level: 1, label: "years" },
     { level: 2, label: "quarters" },
@@ -93,109 +95,116 @@ const I = ":host .settings-container{display:flex;flex-direction:column;gap:var(
     { level: 9, label: "milliseconds" }
   ]
 };
-var W = Object.defineProperty, U = Object.getOwnPropertyDescriptor, u = (t, e, o, a) => {
-  for (var i = a > 1 ? void 0 : a ? U(e, o) : e, r = t.length - 1, m; r >= 0; r--)
-    (m = t[r]) && (i = (a ? m(e, o, i) : m(i)) || i);
-  return a && i && W(e, o, i), i;
+var R = Object.defineProperty, q = Object.getOwnPropertyDescriptor, m = (e, t, o, s) => {
+  for (var i = s > 1 ? void 0 : s ? q(t, o) : t, l = e.length - 1, u; l >= 0; l--)
+    (u = e[l]) && (i = (s ? u(t, o, i) : u(i)) || i);
+  return s && i && R(t, o, i), i;
 };
-let n = class extends M(E, {
-  validSizes: Object.values(O)
+let n = class extends T(W, {
+  validSizes: Object.values(U)
 }) {
   constructor() {
     super(...arguments), this.language = "en", this.slotContent = {}, this.measureColumns = [], this._durationLevels = [], this._renderDurationLevelMenu = !1, this._sendEvent = () => {
-      const t = { ...this.slotContent };
-      t.format = this._format, t.aggregationFunc = this._aggregationFunc, this._aggregationWeightColumn ? t.aggregationWeight = { ...this._aggregationWeightColumn } : this._aggregationFunc === "rate" && (t.aggregationFunc = "average"), this._displayMode === "duration" ? (t.duration = t.duration ?? {}, t.duration.format = this._durationFormat, t.duration.levels = this._durationLevels) : delete t.duration, this.dispatchEvent(
+      const e = { ...this.slotContent };
+      e.format = this._format, e.aggregationFunc = this._aggregationFunc, this._aggregationWeightColumn ? e.aggregationWeight = { ...this._aggregationWeightColumn } : delete e.aggregationWeight, this._displayMode === "duration" ? (e.duration = e.duration ?? {}, e.duration.format = this._durationFormat, e.duration.levels = this._durationLevels) : delete e.duration, this.dispatchEvent(
         new CustomEvent("slot-content-changed", {
           bubbles: !0,
           composed: !0,
           cancelable: !0,
           detail: {
-            slotContent: t
+            slotContent: e
           }
         })
       );
     };
   }
   static get styles() {
-    return [S(I)];
+    return [N(j)];
   }
   _parseSavedNumericFormatSettings() {
-    var t, e, o, a, i, r, m, g, h, z;
-    if (this._displayMode = ((t = this.slotContent) == null ? void 0 : t.subtype) === "duration" ? ((a = (o = (e = this.slotContent) == null ? void 0 : e.duration) == null ? void 0 : o.levels) == null ? void 0 : a.length) === 1 ? "numeric" : "duration" : "numeric", this._durationFormat = ((r = (i = this.slotContent) == null ? void 0 : i.duration) == null ? void 0 : r.format) ?? "short", this._durationLevels = ((g = (m = this.slotContent) == null ? void 0 : m.duration) == null ? void 0 : g.levels) ?? [1], this._displayMode === "duration")
+    var e, t, o, s, i, l, u, c, h, p;
+    if (this._displayMode = ((e = this.slotContent) == null ? void 0 : e.subtype) === "duration" ? ((s = (o = (t = this.slotContent) == null ? void 0 : t.duration) == null ? void 0 : o.levels) == null ? void 0 : s.length) === 1 ? "numeric" : "duration" : "numeric", this._durationFormat = ((l = (i = this.slotContent) == null ? void 0 : i.duration) == null ? void 0 : l.format) ?? "short", this._durationLevels = ((c = (u = this.slotContent) == null ? void 0 : u.duration) == null ? void 0 : c.levels) ?? [1], this._displayMode === "duration")
       this._precision = 2, this._commaDecimals = !1, this._thousandSeparator = !1;
     else {
       this._format = ((h = this.slotContent) == null ? void 0 : h.format) ?? ".0f";
-      const c = v(this._format ?? ".0f");
-      this._isAuto = ((z = c.typeFormat) == null ? void 0 : z.includes("a")) ?? !1, ["%", "a%", "y", "ay"].includes(c.typeFormat) ? this._displayAs = "percentage" : ["s", "as", "w", "aw"].includes(c.typeFormat) ? this._displayAs = "scientific" : this._displayAs = "general", this._precision = c.precision ? Number.parseInt(c.precision.replace(".", ""), 10) : this._displayAs === "scientific" ? 1 : 0, this._commaDecimals = ["z", "az", "y", "ay", "w", "aw"].includes(
-        c.typeFormat
-      ), this._thousandSeparator = c.comma === ",", this._isAuto ? this._numericFormatGroup = "Auto" : this._commaDecimals && this._thousandSeparator ? this._numericFormatGroup = "1.000,00" : !this._commaDecimals && this._thousandSeparator ? this._numericFormatGroup = "1,000.00" : this._commaDecimals && !this._thousandSeparator ? this._numericFormatGroup = "1000,00" : !this._commaDecimals && !this._thousandSeparator && (this._numericFormatGroup = "1000.00");
+      const d = y(this._format ?? ".0f");
+      this._isAuto = ((p = d.typeFormat) == null ? void 0 : p.includes("a")) ?? !1, ["%", "a%", "y", "ay"].includes(d.typeFormat) ? this._displayAs = "percentage" : ["s", "as", "w", "aw"].includes(d.typeFormat) ? this._displayAs = "scientific" : this._displayAs = "general", this._precision = d.precision ? Number.parseInt(d.precision.replace(".", ""), 10) : this._displayAs === "scientific" ? 1 : 0, this._commaDecimals = ["z", "az", "y", "ay", "w", "aw"].includes(
+        d.typeFormat
+      ), this._thousandSeparator = d.comma === ",", this._isAuto ? this._numericFormatGroup = "Auto" : this._commaDecimals && this._thousandSeparator ? this._numericFormatGroup = "1.000,00" : !this._commaDecimals && this._thousandSeparator ? this._numericFormatGroup = "1,000.00" : this._commaDecimals && !this._thousandSeparator ? this._numericFormatGroup = "1000,00" : !this._commaDecimals && !this._thousandSeparator && (this._numericFormatGroup = "1000.00");
     }
   }
   _setNumericDisplayAs() {
-    var t, e;
-    this._displayAs = ((e = (t = this._displayAsElement) == null ? void 0 : t.selected) == null ? void 0 : e[0]) ?? "general", this._displayAs === "scientific" && (this._precision = Math.max(this._precision ?? 0, 1), this._thousandSeparator = !1), this._setNumericFormat(), this._sendEvent(), this.requestUpdate();
+    var e, t;
+    this._displayAs = ((t = (e = this._displayAsElement) == null ? void 0 : e.selected) == null ? void 0 : t[0]) ?? "general", this._displayAs === "scientific" && (this._precision = Math.max(this._precision ?? 0, 1), this._thousandSeparator = !1), this._setNumericFormat(), this._sendEvent(), this.requestUpdate();
   }
-  _setNumericSeparators(t) {
-    const e = p[(t == null ? void 0 : t.detail) ?? "Auto"];
+  _setNumericSeparators(e) {
+    const t = v[(e == null ? void 0 : e.detail) ?? "Auto"];
     this._thousandSeparator = [",", "."].includes(
-      (e == null ? void 0 : e.thousandSeparator) ?? ""
-    ), this._commaDecimals = (e == null ? void 0 : e.decimalSeparator) === ",", this._isAuto = e == null ? void 0 : e.auto, this._setNumericFormat(), this._sendEvent();
+      (t == null ? void 0 : t.thousandSeparator) ?? ""
+    ), this._commaDecimals = (t == null ? void 0 : t.decimalSeparator) === ",", this._isAuto = t == null ? void 0 : t.auto, this._setNumericFormat(), this._sendEvent();
   }
   _setPrecision() {
     this._precision = this._precisionElement.value, this._setNumericFormat(), this._sendEvent();
   }
   _setNumericFormat() {
     var o;
-    let t = "f";
-    const e = this.slotContent.subtype === "duration" ? this._durationLevels && ((o = this._durationLevels) == null ? void 0 : o.length) === 1 ? "numeric" : "duration" : "numeric";
-    this._maxDurationLevel = Math.min(...this._durationLevels), e === "duration" ? (!["time", "short", "long"].includes(this._durationFormat ?? "") || this._maxDurationLevel < 6 && this._durationFormat === "time") && (this._durationFormat = "short") : (this._displayAs === "general" && this._commaDecimals ? t = "z" : this._displayAs === "percentage" && this._commaDecimals ? t = "y" : this._displayAs === "scientific" && this._commaDecimals ? t = "w" : this._displayAs === "percentage" ? t = "%" : this._displayAs === "scientific" && (t = "s"), this._format = (this._thousandSeparator || this._isAuto ? "," : "") + "." + this._precision + (this._isAuto ? "a" : "") + t);
+    let e = "f";
+    const t = this.slotContent.subtype === "duration" ? this._durationLevels && ((o = this._durationLevels) == null ? void 0 : o.length) === 1 ? "numeric" : "duration" : "numeric";
+    this._maxDurationLevel = Math.min(...this._durationLevels), t === "duration" ? (!["time", "short", "long"].includes(this._durationFormat ?? "") || this._maxDurationLevel < 6 && this._durationFormat === "time") && (this._durationFormat = "short") : (this._displayAs === "general" && this._commaDecimals ? e = "z" : this._displayAs === "percentage" && this._commaDecimals ? e = "y" : this._displayAs === "scientific" && this._commaDecimals ? e = "w" : this._displayAs === "percentage" ? e = "%" : this._displayAs === "scientific" && (e = "s"), this._format = (this._thousandSeparator || this._isAuto ? "," : "") + "." + this._precision + (this._isAuto ? "a" : "") + e);
   }
   _setAggregationFunc() {
-    const t = this._aggregationFunc, e = this.slotContent.format;
-    if (this._aggregationElement.value !== t) {
-      if (this._aggregationFunc = this._aggregationElement.value, t === "rate") {
-        const o = v(e), a = ["%", "y", "a%", "ay"].includes(
-          o.typeFormat
+    var i;
+    const e = this._aggregationElement.value, t = this._aggregationFunc, o = this.slotContent.format;
+    if (e !== (t === "weightedaverage" ? "average" : t)) {
+      if (this._aggregationFunc = e === "average" && ((i = this._aggregationWeightColumn) != null && i.column) ? "weightedaverage" : e, t === "rate") {
+        const l = y(o), u = ["%", "y", "a%", "ay"].includes(
+          l.typeFormat
         );
-        this.slotContent.subtype === "currency" && a && this._setNumericDisplayAs();
+        this.slotContent.subtype === "currency" && u && this._setNumericDisplayAs();
       }
       this._sendEvent(), (this._aggregationFunc === "rate" || t === "rate") && this.requestUpdate();
     }
   }
   _setAggregationWeight() {
-    const t = this._aggregationWeightElement.value;
-    if (t === "none")
-      this._aggregationWeightColumn = void 0;
+    var o;
+    const e = this._aggregationWeightElement.value, t = this._aggregationFunc;
+    if (e === "none")
+      this._aggregationWeightColumn = void 0, this._aggregationFunc === "weightedaverage" && (this._aggregationFunc = "average");
     else {
-      const e = this.measureColumns.find(
-        (o) => o.columnId === t
-      );
-      this._aggregationWeightColumn = {
-        column: e == null ? void 0 : e.columnId,
-        set: e == null ? void 0 : e.datasetId,
-        columnSubType: e == null ? void 0 : e.subtype
-      };
+      let s, i;
+      for (const l of this.measureColumns ?? []) {
+        const u = (o = l.columns) == null ? void 0 : o.find((c) => c.id === e);
+        if (u) {
+          s = u, i = l.datasetId;
+          break;
+        }
+      }
+      s && (this._aggregationWeightColumn = {
+        column: s.id,
+        set: i,
+        columnSubType: s.subtype
+      }), this._aggregationFunc === "average" && (this._aggregationFunc = "weightedaverage");
     }
-    this._sendEvent();
+    this._sendEvent(), this.requestUpdate(), (t === "weightedaverage" && this._aggregationFunc === "average" || t === "average" && this._aggregationFunc === "weightedaverage") && this.requestUpdate();
   }
   _setDurationLevels() {
-    const t = this._durationLevels, e = this._durationLevelsElement.value.split(",").filter((o) => o !== "").map((o) => Number.parseInt(o, 10));
-    this._durationLevels = ((e == null ? void 0 : e.length) ?? 0) >= 1 ? e : t, this._maxDurationLevel = Math.min(...this._durationLevels), this._fillTimeDurationLevels(), this._setNumericFormat(), this._sendEvent(), this.requestUpdate();
+    const e = this._durationLevels, t = this._durationLevelsElement.value.split(",").filter((o) => o !== "").map((o) => Number.parseInt(o, 10));
+    this._durationLevels = ((t == null ? void 0 : t.length) ?? 0) >= 1 ? t : e, this._maxDurationLevel = Math.min(...this._durationLevels), this._fillTimeDurationLevels(), this._setNumericFormat(), this._sendEvent(), this.requestUpdate();
   }
   _setDurationFormat() {
-    var t, e;
-    this._durationFormat = (e = (t = this._durationFormatElement) == null ? void 0 : t.selected) == null ? void 0 : e[0], this._fillTimeDurationLevels(), this._setNumericFormat(), this._sendEvent(), this.requestUpdate();
+    var e, t;
+    this._durationFormat = (t = (e = this._durationFormatElement) == null ? void 0 : e.selected) == null ? void 0 : t[0], this._fillTimeDurationLevels(), this._setNumericFormat(), this._sendEvent(), this.requestUpdate();
   }
   _fillTimeDurationLevels() {
     if (this._durationFormat === "time") {
-      const t = this._durationLevels.sort().at(-1);
-      if ([7, 8, 9].includes(t)) {
-        const e = {
+      const e = this._durationLevels.sort().at(-1);
+      if ([7, 8, 9].includes(e)) {
+        const t = {
           lev7: [6],
           lev8: [6, 7],
           lev9: [6, 7, 8]
         };
-        for (const o of e["lev" + t])
+        for (const o of t["lev" + e])
           this._durationLevels.includes(o) || this._durationLevels.push(o);
         this._durationLevels = [...this._durationLevels].sort();
       }
@@ -237,39 +246,39 @@ let n = class extends M(E, {
         });
       }
     } */
-  willUpdate(t) {
-    var e, o, a, i, r;
-    t.has("slotContent") && (this._parseSavedNumericFormatSettings(), this._aggregationFunc = ((e = this.slotContent) == null ? void 0 : e.aggregationFunc) ?? (((o = this.slotContent) == null ? void 0 : o.type) === "numeric" ? "sum" : "count"), this._aggregationWeightColumn = (a = this.slotContent) == null ? void 0 : a.aggregationWeight, this._isFormula = ((i = this.slotContent) == null ? void 0 : i.formula) || ((r = this.slotContent) == null ? void 0 : r.formulaId)), t.has("language") && this.language !== x() && ([...A].includes(this.language ?? "en") || this.language === "en") && L(this.language);
+  willUpdate(e) {
+    var t, o, s, i, l;
+    e.has("slotContent") && (this._parseSavedNumericFormatSettings(), this._aggregationFunc = ((t = this.slotContent) == null ? void 0 : t.aggregationFunc) ?? (((o = this.slotContent) == null ? void 0 : o.type) === "numeric" ? "sum" : "count"), this._aggregationWeightColumn = (s = this.slotContent) == null ? void 0 : s.aggregationWeight, this._isFormula = ((i = this.slotContent) == null ? void 0 : i.formula) || ((l = this.slotContent) == null ? void 0 : l.formulaId)), e.has("language") && this.language !== w() && ([...S].includes(this.language ?? "en") || this.language === "en") && D(this.language);
   }
   firstUpdated() {
-    var t;
-    (t = this.slotContent) != null && t.duration && this._durationLevelsOverlay.addEventListener(
+    var e;
+    (e = this.slotContent) != null && e.duration && this._durationLevelsOverlay.addEventListener(
       "slottable-request",
-      (e) => {
-        this._renderDurationLevelMenu = e.data !== C;
+      (t) => {
+        this._renderDurationLevelMenu = t.data !== I;
       }
     );
   }
   _renderDurationLevelsSettings() {
-    const t = T.levels.map((e) => {
+    const e = G.levels.map((t) => {
       let o = !1;
-      return this._durationFormat === "time" && e.level >= 6 && this._durationLevels.includes(e.level) && e.level !== Math.max(...this._durationLevels) && (o = !0), this._durationLevels.length === 1 && this._durationLevels.includes(e.level) && (o = !0), l`<luzmo-menu-item
-        value=${e.level}
-        ?selected=${this._durationLevels.includes(e.level)}
+      return this._durationFormat === "time" && t.level >= 6 && this._durationLevels.includes(t.level) && t.level !== Math.max(...this._durationLevels) && (o = !0), this._durationLevels.length === 1 && this._durationLevels.includes(t.level) && (o = !0), r`<luzmo-menu-item
+        value=${t.level}
+        ?selected=${this._durationLevels.includes(t.level)}
         ?disabled=${o}
       >
-        ${e.label}
+        ${t.label}
       </luzmo-menu-item>`;
     });
-    return l` <div class="setting">
+    return r` <div class="setting">
       <luzmo-field-label for="duration-levels">
-        ${s("Duration levels", { desc: "Label for duration levels setting" })}
+        ${a("Duration levels", { desc: "Label for duration levels setting" })}
       </luzmo-field-label>
       <luzmo-action-button id="trigger" size=${this.size}>
         ${this._durationLevels.length}
         ${this._durationLevels.length === 1 ? "level" : "levels"} active
         <span class="duration-angle-down-icon">
-          ${D(w)}
+          ${z(E)}
         </span>
       </luzmo-action-button>
       <luzmo-overlay
@@ -280,26 +289,26 @@ let n = class extends M(E, {
         type="page"
       >
         <luzmo-popover style="position: relative">
-          ${this._renderDurationLevelMenu ? l` <luzmo-menu
+          ${this._renderDurationLevelMenu ? r` <luzmo-menu
                 id="duration-levels"
                 size=${this.size}
                 selects="multiple"
                 .value=${this._durationLevels.join(",")}
                 @change=${this._setDurationLevels}
               >
-                ${t}
+                ${e}
               </luzmo-menu>` : ""}
         </luzmo-popover>
       </luzmo-overlay>
     </div>`;
   }
   _renderDurationFormatSettings() {
-    const t = Object.keys(b).map((e) => e === "time" && (this._maxDurationLevel ?? 1) < 6 ? "" : l`<luzmo-action-button value=${e}>
-        ${b[e]()}
+    const e = Object.keys($).map((t) => t === "time" && (this._maxDurationLevel ?? 1) < 6 ? "" : r`<luzmo-action-button value=${t}>
+        ${$[t]()}
       </luzmo-action-button>`);
-    return l` <div class="setting">
+    return r` <div class="setting">
       <luzmo-field-label for="duration-format">
-        ${s("Format", { desc: "Label for format setting" })}
+        ${a("Format", { desc: "Label for format setting" })}
       </luzmo-field-label>
       <luzmo-action-group
         emphasized
@@ -310,19 +319,19 @@ let n = class extends M(E, {
         selects="single"
         @change=${this._setDurationFormat}
       >
-        ${t}
+        ${e}
       </luzmo-action-group>
     </div>`;
   }
   _renderNumericDisplayAsSettings() {
-    const t = Object.keys(_).map(
-      (e) => l`<luzmo-action-button value=${e}
-          >${_[e]}</luzmo-action-button
+    const e = Object.keys(A).map(
+      (t) => r`<luzmo-action-button value=${t}
+          >${A[t]}</luzmo-action-button
         >`
     );
-    return l`<div class="setting">
+    return r`<div class="setting">
       <luzmo-field-label for="display-as">
-        ${s("Display as", {
+        ${a("Display as", {
       desc: "Label for display as setting for the datetime field"
     })}
       </luzmo-field-label>
@@ -335,19 +344,19 @@ let n = class extends M(E, {
         selects="single"
         @change=${this._setNumericDisplayAs}
       >
-        ${t}
+        ${e}
       </luzmo-action-group>
     </div>`;
   }
   _renderNumericFormatSettings() {
-    const t = Object.keys(p).map(
-      (e) => l`<luzmo-menu-item value=${e}>
-          ${p[e].label()}
+    const e = Object.keys(v).map(
+      (t) => r`<luzmo-menu-item value=${t}>
+          ${v[t].label()}
         </luzmo-menu-item>`
     );
-    return l` <div class="setting">
+    return r` <div class="setting">
         <luzmo-field-label for="format">
-          ${s("Format", { desc: "Label for format setting" })}
+          ${a("Format", { desc: "Label for format setting" })}
         </luzmo-field-label>
         <luzmo-picker
           id="format"
@@ -356,14 +365,14 @@ let n = class extends M(E, {
           value=${this._numericFormatGroup ?? "Auto"}
           @change=${this._setNumericSeparators}
         >
-          ${t}
+          ${e}
         </luzmo-picker>
       </div>
       <div class="setting">
         <luzmo-field-label for="precision" id="precision-label">
-          ${this._displayAs === "scientific" ? s("Precision", {
+          ${this._displayAs === "scientific" ? a("Precision", {
       desc: "Label for precision setting"
-    }) : s("Decimals", {
+    }) : a("Decimals", {
       desc: "Label for decimals setting"
     })}
         </luzmo-field-label>
@@ -378,102 +387,134 @@ let n = class extends M(E, {
       </div>`;
   }
   _renderAggregationSettings() {
-    var o, a;
-    const t = Object.entries(k).filter(
-      ([i]) => {
-        var r;
-        return ["count", "distinctcount"].includes(i) || ((r = this.slotContent) == null ? void 0 : r.type) === "numeric";
+    var o;
+    const e = Object.entries(P).filter(
+      ([s]) => {
+        var i;
+        return ["count", "distinctcount"].includes(s) || ((i = this.slotContent) == null ? void 0 : i.type) === "numeric";
       }
     ).map(
-      ([i, r]) => l`<luzmo-menu-item value=${i}>${r()}</luzmo-menu-item>`
-    ), e = [
-      l`<luzmo-menu-item value="none">No weight</luzmo-menu-item>`,
-      ...this.measureColumns.map((i) => {
-        var m, g, h;
-        const r = ((m = i == null ? void 0 : i.label) == null ? void 0 : m[this.language ?? "en"]) ?? ((h = i == null ? void 0 : i.label) == null ? void 0 : h[(g = Object.keys(i == null ? void 0 : i.label)) == null ? void 0 : g[0]]) ?? "Untitled";
-        return l`<luzmo-menu-item value=${i.id}>
-          ${r}
-        </luzmo-menu-item>`;
+      ([s, i]) => r`<luzmo-menu-item value=${s}>${i()}</luzmo-menu-item>`
+    ), t = [
+      r`<luzmo-menu-item value="none" class="no-weight">
+        <span class="no-weight-label">No weight</span>
+      </luzmo-menu-item>`,
+      ...(this.measureColumns ?? []).flatMap((s) => {
+        const i = typeof s.datasetName == "object" ? x(
+          s.datasetName,
+          this.language
+        ) : s.datasetName, l = r`<div class="dataset-header">
+          ${i}
+          <luzmo-tooltip self-managed placement="right" size=${this.size}>
+            ${i}
+          </luzmo-tooltip>
+        </div>`, u = (s.columns ?? []).map((c) => {
+          const h = typeof c.name == "object" ? x(c.name, this.language) : c.name, p = z(M(c, "s")), d = c.expression ? O("derived", "s") : void 0, b = !!d, F = b ? r`<span class="secondary-icon"
+                >${z(d)}</span
+              >` : f;
+          return r`<luzmo-menu-item value=${c.id}>
+            <span class="data-icon-type" slot="icon">
+              <span class=${b ? "with-secondary-icon" : ""}
+                >${p}</span
+              >
+              ${F}
+            </span>
+            <span class="column-label text-truncate">${h}</span>
+            <luzmo-tooltip self-managed placement="right" size=${this.size}>
+              ${h}
+            </luzmo-tooltip>
+          </luzmo-menu-item>`;
+        });
+        return [l, ...u];
       })
     ];
-    return l`<div class="settings-row">
+    return r`<div class="settings-row">
       <div class="setting">
         <luzmo-field-label for="aggregation">
-          ${s("Aggregation", { desc: "Label for aggregation setting" })}
+          ${a("Aggregation", { desc: "Label for aggregation setting" })}
         </luzmo-field-label>
         <luzmo-picker
           id="aggregation"
           size=${this.size}
           variant="highlight"
-          value=${this._aggregationFunc ?? (((o = this.slotContent) == null ? void 0 : o.type) === "numeric" ? "sum" : "count")}
+          value=${(() => {
+      var i;
+      const s = ((i = this.slotContent) == null ? void 0 : i.type) === "numeric" ? "sum" : "count";
+      return this._aggregationFunc === "weightedaverage" ? "average" : this._aggregationFunc ?? s;
+    })()}
           @change=${this._setAggregationFunc}
         >
-          ${t}
+          ${e}
         </luzmo-picker>
       </div>
-      ${this._aggregationFunc === "rate" ? l`<div class="setting">
+      ${["rate", "average", "weightedaverage"].includes(
+      this._aggregationFunc ?? ""
+    ) ? r`<div class="setting">
             <luzmo-field-label for="weighting-column">
-              Denominator
+              ${this._aggregationFunc === "rate" ? "Denominator" : "Weight"}
             </luzmo-field-label>
-            <luzmo-picker
-              id="weighting-column"
-              size=${this.size}
-              variant="highlight"
-              value=${((a = this._aggregationWeightColumn) == null ? void 0 : a.column) ?? "none"}
-              @change=${this._setAggregationWeight}
-            >
-              ${e}
-            </luzmo-picker>
+            ${this.measureColumns.length > 0 ? r`
+                  <luzmo-picker
+                    id="weighting-column"
+                    size=${this.size}
+                    variant="highlight"
+                    icons="none"
+                    value=${((o = this._aggregationWeightColumn) == null ? void 0 : o.column) ?? "none"}
+                    @change=${this._setAggregationWeight}
+                  >
+                    ${t}
+                  </luzmo-picker>
+                ` : f}
           </div>` : ""}
     </div>`;
   }
   render() {
-    var t;
-    return l`<div class="settings-container">
+    var e;
+    return r`<div class="settings-container">
       <div class="settings-row">
       ${this._displayMode === "duration" ? this._renderDurationLevelsSettings() : this._renderNumericDisplayAsSettings()}
-      ${((t = this._durationLevels) == null ? void 0 : t.length) > 1 ? this._renderDurationFormatSettings() : this._renderNumericFormatSettings()}
+      ${((e = this._durationLevels) == null ? void 0 : e.length) > 1 ? this._renderDurationFormatSettings() : this._renderNumericFormatSettings()}
       </div>
-      ${this._isFormula ? $ : this._renderAggregationSettings()}
+      ${this._isFormula ? f : this._renderAggregationSettings()}
       </div>
     </div>`;
   }
 };
-u([
-  f({ type: String, reflect: !0 })
+m([
+  _({ type: String, reflect: !0 })
 ], n.prototype, "language", 2);
-u([
-  f({ type: Object, reflect: !0 })
+m([
+  _({ type: Object, reflect: !0 })
 ], n.prototype, "slotContent", 2);
-u([
-  f({ type: Array, reflect: !1 })
+m([
+  _({ type: Array, reflect: !1 })
 ], n.prototype, "measureColumns", 2);
-u([
-  d("#display-as")
+m([
+  g("#display-as")
 ], n.prototype, "_displayAsElement", 2);
-u([
-  d("#precision")
+m([
+  g("#precision")
 ], n.prototype, "_precisionElement", 2);
-u([
-  d("#aggregation")
+m([
+  g("#aggregation")
 ], n.prototype, "_aggregationElement", 2);
-u([
-  d("#weighting-column")
+m([
+  g("#weighting-column")
 ], n.prototype, "_aggregationWeightElement", 2);
-u([
-  d("#duration-levels")
+m([
+  g("#duration-levels")
 ], n.prototype, "_durationLevelsElement", 2);
-u([
-  d("#duration-format")
+m([
+  g("#duration-format")
 ], n.prototype, "_durationFormatElement", 2);
-u([
-  d("#duration-levels-overlay")
+m([
+  g("#duration-levels-overlay")
 ], n.prototype, "_durationLevelsOverlay", 2);
-u([
-  N()
+m([
+  k()
 ], n.prototype, "_renderDurationLevelMenu", 2);
-n = u([
-  F()
+n = m([
+  C()
 ], n);
 customElements.get("luzmo-display-settings-numeric") || customElements.define(
   "luzmo-display-settings-numeric",