@luzmo/analytics-components-kit 1.0.1-alpha.91 → 1.0.1-alpha.96

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

@@ -25,15 +25,15 @@ import "@luzmo/lucero/icon";
 import "@luzmo/lucero/number-field";
 import "@luzmo/lucero/picker";
 import "@luzmo/lucero/progress-circle";
-import { unsafeCSS as b, html as a } from "lit";
-import { msg as i, localized as k } from "@lit/localize";
+import { unsafeCSS as b, html as s } from "lit";
+import { msg as l, localized as k } from "@lit/localize";
 import { luzmoCheckboxChecked as c, luzmoCheckbox as p } from "@luzmo/icons";
-import { a as S, S as f, f as _ } from "../en-D3ihEGXg.js";
-import { a as F, b as z, W as g } from "../periods.const-CjHXYn-w.js";
-import { property as d, query as m } from "lit/decorators.js";
-import { L as w } from "../focusable-BS2pbY7w.js";
+import { a as S, S as f, f as _ } from "../en-BOTjhwEc.js";
+import { a as w, b as z, W as g } from "../periods.const-CjHXYn-w.js";
+import { property as d, query as n } from "lit/decorators.js";
+import { L as F } from "../focusable-DCIFkpiW.js";
 import { S as $, E as x } from "../sized-mixin-cJbo3PKR.js";
-import { g as A, t as L, s as D } from "../set-locale-hKTMz37h.js";
+import { g as A, t as L, s as D } from "../set-locale-Dp3N_gXN.js";
 (function() {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
     const e = document.createElement("style");
@@ -41,17 +41,17 @@ import { g as A, t as L, s as D } from "../set-locale-hKTMz37h.js";
   }
 })();
 const y = {
-  "~": () => i("Auto", { desc: "Automatic setting of the option" }),
+  "~": () => l("Auto", { desc: "Automatic setting of the option" }),
   "/": () => "/",
   "-": () => "-",
   ".": () => "."
 }, E = ":host{font-family:var(--luzmo-display-settings-datetime-font-family, var(--luzmo-font-family))}:host .settings-container{display:flex;flex-direction:column;gap:var(--luzmo-display-settings-vertical-gap, var(--luzmo-spacing-2))}:host .settings-row{display:flex;justify-content:flex-start;align-items:center;gap:var(--luzmo-display-settings-datetime-gap, var(--display-settings-datetime-gap))}:host{--display-settings-datetime-example-font-size: var(--luzmo-font-size);--display-settings-datetime-example-color: var(--luzmo-font-color);--display-settings-datetime-example-label-font-weight: bold;--display-settings-datetime-example-label-color: var(--luzmo-primary);--display-settings-datetime-example-language-color: var(--luzmo-primary)}:host{--display-settings-datetime-gap: var(--luzmo-spacing-3);--display-settings-datetime-example-height: var(--luzmo-component-height);--display-settings-datetime-example-font-size: var(--luzmo-font-size-s)}:host([size=s]){--display-settings-datetime-gap: var(--luzmo-spacing-3);--display-settings-datetime-example-height: var(--luzmo-component-height-s);--display-settings-datetime-example-font-size: var(--luzmo-font-size-s)}:host([size=l]){--display-settings-datetime-gap: var(--luzmo-spacing-4);--display-settings-datetime-example-height: var(--luzmo-component-height-l);--display-settings-datetime-example-font-size: var(--luzmo-font-size)}:host([size=xl]){--display-settings-datetime-gap: var(--luzmo-spacing-5);--display-settings-datetime-example-height: var(--luzmo-component-height-xl);--display-settings-datetime-example-font-size: var(--luzmo-font-size-l)}";
-var M = Object.defineProperty, C = Object.getOwnPropertyDescriptor, l = (t, e, o, r) => {
-  for (var n = r > 1 ? void 0 : r ? C(e, o) : e, h = t.length - 1, u; h >= 0; h--)
-    (u = t[h]) && (n = (r ? u(e, o, n) : u(n)) || n);
-  return r && n && M(e, o, n), n;
+var M = Object.defineProperty, C = Object.getOwnPropertyDescriptor, m = (t, e, o, a) => {
+  for (var i = a > 1 ? void 0 : a ? C(e, o) : e, h = t.length - 1, u; h >= 0; h--)
+    (u = t[h]) && (i = (a ? u(e, o, i) : u(i)) || i);
+  return a && i && M(e, o, i), i;
 };
-let s = class extends $(w, {
+let r = class extends $(F, {
   validSizes: Object.values(x)
 }) {
   constructor() {
@@ -62,9 +62,9 @@ let s = class extends $(w, {
             "../../utils/formatter/formats/cs.ts": () => import("../cs-DVZ0Tapy.js"),
             "../../utils/formatter/formats/da.ts": () => import("../da-DHy05oSR.js"),
             "../../utils/formatter/formats/de.ts": () => import("../de-iM39JlAt.js"),
-            "../../utils/formatter/formats/en-GB.ts": () => import("../en-GB-ialeqj_z.js"),
-            "../../utils/formatter/formats/en-US.ts": () => import("../en-D3ihEGXg.js").then((o) => o.e),
-            "../../utils/formatter/formats/en.ts": () => import("../en-D3ihEGXg.js").then((o) => o.b),
+            "../../utils/formatter/formats/en-GB.ts": () => import("../en-GB-CEHEs8F2.js"),
+            "../../utils/formatter/formats/en-US.ts": () => import("../en-BOTjhwEc.js").then((o) => o.e),
+            "../../utils/formatter/formats/en.ts": () => import("../en-BOTjhwEc.js").then((o) => o.b),
             "../../utils/formatter/formats/es.ts": () => import("../es-KhTq4jX8.js"),
             "../../utils/formatter/formats/fi.ts": () => import("../fi-Dh_ebgpe.js"),
             "../../utils/formatter/formats/fr.ts": () => import("../fr-CU727YF1.js"),
@@ -86,7 +86,7 @@ let s = class extends $(w, {
           });
           if (e[`../../utils/formatter/formats/${t}.ts`]) {
             const o = await e[`../../utils/formatter/formats/${t}.ts`]();
-            this._localeFormats = o?.default ?? {};
+            this._localeFormats = (o == null ? void 0 : o.default) ?? {};
           }
           return this._contentLanguageLoaded = t, this._localeFormats;
         }
@@ -109,27 +109,30 @@ let s = class extends $(w, {
     return [b(E)];
   }
   _parseSlotContent() {
-    this._dateLevel = this.slotContent?.level ?? this.slotContent?.lowestLevel ?? 5, this._displayAs = this.slotContent?.datetimeDisplayMode ?? "default", this._displayAs === "weekday_number" && (this._displayAs = "day_in_week", this._weekDayAndMonthInYearFormat = "number"), this._displayAs === "weekday_name" && (this._displayAs = "day_in_week"), this._displayAs === "month_number" && (this._displayAs = "month_in_year", this._weekDayAndMonthInYearFormat = "number"), this._displayAs === "month_name" && (this._displayAs = "month_in_year"), this._parseSavedFormat();
+    var t, e, o;
+    this._dateLevel = ((t = this.slotContent) == null ? void 0 : t.level) ?? ((e = this.slotContent) == null ? void 0 : e.lowestLevel) ?? 5, this._displayAs = ((o = this.slotContent) == null ? void 0 : o.datetimeDisplayMode) ?? "default", this._displayAs === "weekday_number" && (this._displayAs = "day_in_week", this._weekDayAndMonthInYearFormat = "number"), this._displayAs === "weekday_name" && (this._displayAs = "day_in_week"), this._displayAs === "month_number" && (this._displayAs = "month_in_year", this._weekDayAndMonthInYearFormat = "number"), this._displayAs === "month_name" && (this._displayAs = "month_in_year"), this._parseSavedFormat();
   }
   _parseSavedFormat() {
-    const t = this.slotContent?.format ?? S, e = t.match(/[./-]/);
-    if (this._dateSeparator = t.includes("~") ? "~" : e?.[0] ?? "~", t.includes("%amd"))
+    var o;
+    const t = ((o = this.slotContent) == null ? void 0 : o.format) ?? S, e = t.match(/[./-]/);
+    if (this._dateSeparator = t.includes("~") ? "~" : (e == null ? void 0 : e[0]) ?? "~", t.includes("%amd"))
       this._dateFormat = "auto";
     else {
-      const o = t.indexOf("%d"), r = t.indexOf("%m");
-      o !== -1 && r !== -1 && (this._dateFormat = o < r ? "ddmm" : "mmdd");
+      const a = t.indexOf("%d"), i = t.indexOf("%m");
+      a !== -1 && i !== -1 && (this._dateFormat = a < i ? "ddmm" : "mmdd");
     }
     this._24hFormat = t.includes("%H"), this._monthName = /%B|%b/.test(t), this._weekDay = /%a|%A/.test(t), this._monthName && (this._monthNameFormat = t.includes("%b") ? "short" : "long"), this._weekDay && (this._weekDayAndMonthInYearFormat = t.includes("%a") ? "short" : "long");
   }
   _calculateFormat() {
+    var o;
     let t;
-    const e = this._localeFormats?.smartDateFormats ?? f;
+    const e = ((o = this._localeFormats) == null ? void 0 : o.smartDateFormats) ?? f;
     this._monthName ? (t = e.filter(
-      (o) => o.monthType === "name" && o.longText === (this._monthNameFormat === "long") && o.weekday === this._weekDay
+      (a) => a.monthType === "name" && a.longText === (this._monthNameFormat === "long") && a.weekday === this._weekDay
     ), t.length > 0 ? this._format = t[0].key : (this._weekDayAndMonthInYearFormat = "short", this._weekDay = !0, this._format = "%a %e %B %Y")) : (t = this._dateLevel && this._dateLevel === 4 ? e.filter(
-      (o) => o.monthType === "number" && o.mmdd === (this._weekFormat === "mmdd" ? !0 : this._weekFormat === "ddmm" ? !1 : null) && o.separator === this._dateSeparator
+      (a) => a.monthType === "number" && a.mmdd === (this._weekFormat === "mmdd" ? !0 : this._weekFormat === "ddmm" ? !1 : null) && a.separator === this._dateSeparator
     ) : e.filter(
-      (o) => o.monthType === "number" && o.mmdd === (this._dateFormat === "mmdd" ? !0 : this._dateFormat === "ddmm" ? !1 : null) && o.separator === this._dateSeparator
+      (a) => a.monthType === "number" && a.mmdd === (this._dateFormat === "mmdd" ? !0 : this._dateFormat === "ddmm" ? !1 : null) && a.separator === this._dateSeparator
     ), this._dateFormat === "auto" && this._dateLevel && this._dateLevel !== 4 ? this._format = "%amd" + this._dateSeparator + "%Y" : t.length > 0 ? this._format = t[0].key : (this._dateFormat = "ddmm", this._dateSeparator = "/", this._format = "%d/%m/%Y")), this._dateLevel && this._dateLevel > 5 && (this._format += this._24hFormat ? " %H:%M:%S.%L" : " %I:%M:%S.%L %p");
   }
   _setWeekStartsOn() {
@@ -139,16 +142,19 @@ let s = class extends $(w, {
     this._displayAs = this._displayAsElement.value, this._sendEvent(), this.requestUpdate();
   }
   _setWeekdayAndMonthInYearFormat() {
-    this._weekDayAndMonthInYearFormat = this._weekDayAndMonthInYearFormatElement.selected?.[0] ?? "long", this._sendEvent(), this.requestUpdate();
+    var t;
+    this._weekDayAndMonthInYearFormat = ((t = this._weekDayAndMonthInYearFormatElement.selected) == null ? void 0 : t[0]) ?? "long", this._sendEvent(), this.requestUpdate();
   }
   _setMonthNameFormat() {
-    this._monthNameFormat = this._monthNameFormatElement.selected?.[0], this._sendEvent(), this.requestUpdate();
+    var t;
+    this._monthNameFormat = (t = this._monthNameFormatElement.selected) == null ? void 0 : t[0], this._sendEvent(), this.requestUpdate();
   }
   _setMonthName() {
     this._monthName = this._monthNameElement.selected, this._sendEvent(), this.requestUpdate();
   }
   _setWeekFormat() {
-    this._weekFormat = this._weekFormatElement.selected?.[0], this._sendEvent(), this.requestUpdate();
+    var t;
+    this._weekFormat = (t = this._weekFormatElement.selected) == null ? void 0 : t[0], this._sendEvent(), this.requestUpdate();
   }
   _setDateFormat() {
     this._dateFormat = this._dateFormatElement.value, this._sendEvent(), this.requestUpdate();
@@ -169,14 +175,15 @@ let s = class extends $(w, {
     t.has("slotContent") && (this._parseSlotContent(), this._calculateSlotContent()), t.has("language") && this.language !== A() && ([...L].includes(this.language ?? "en") || this.language === "en") && D(this.language);
   }
   _renderDisplaySettings() {
-    const t = F?.[`level${this._dateLevel ?? 0}`]?.map(
-      (e) => a`<luzmo-menu-item value=${e.key}>
-          ${e.i18n()}
+    var e, o;
+    const t = (o = (e = w) == null ? void 0 : e[`level${this._dateLevel ?? 0}`]) == null ? void 0 : o.map(
+      (a) => s`<luzmo-menu-item value=${a.key}>
+          ${a.i18n()}
         </luzmo-menu-item>`
     );
-    return a`<div class="setting">
+    return s`<div class="setting">
       <luzmo-field-label for="display-as"
-        >${i("Display", {
+        >${l("Display", {
       desc: "Label for display setting"
     })}</luzmo-field-label
       >
@@ -194,12 +201,12 @@ let s = class extends $(w, {
   _renderWeekDayAndMonthNameFormatSettings() {
     const t = Object.keys(
       z
-    ).map((e) => a`<luzmo-action-button value=${e}>
+    ).map((e) => s`<luzmo-action-button value=${e}>
         ${z[e]()}
       </luzmo-action-button>`);
-    return a` <div class="setting">
+    return s` <div class="setting">
       <luzmo-field-label for="weekday-and-month-in-year-format"
-        >${i("Format", {
+        >${l("Format", {
       desc: "Label for format setting"
     })}</luzmo-field-label
       >
@@ -217,9 +224,9 @@ let s = class extends $(w, {
     </div>`;
   }
   _renderMonthNameFormatSettings() {
-    return a` <div class="setting">
+    return s` <div class="setting">
       <luzmo-field-label for="month-name-format"
-        >${i("Format", {
+        >${l("Format", {
       desc: "Label for format setting"
     })}</luzmo-field-label
       >
@@ -233,23 +240,24 @@ let s = class extends $(w, {
         @change=${this._setMonthNameFormat}
       >
         <luzmo-action-button value="short">
-          ${i("Short", { desc: "Short format option" })}
+          ${l("Short", { desc: "Short format option" })}
         </luzmo-action-button>
         <luzmo-action-button value="long">
-          ${i("Long", { desc: "Long format option" })}
+          ${l("Long", { desc: "Long format option" })}
         </luzmo-action-button>
       </luzmo-action-group>
     </div>`;
   }
   _renderWeekFormatSettings() {
-    const t = this._localeFormats?.smartDateFormats ?? f, e = t.find(
-      (r) => r.mmdd === !0 && r.separator === this._dateSeparator && r.monthType === "number"
+    var a;
+    const t = ((a = this._localeFormats) == null ? void 0 : a.smartDateFormats) ?? f, e = t.find(
+      (i) => i.mmdd === !0 && i.separator === this._dateSeparator && i.monthType === "number"
     ), o = t.find(
-      (r) => r.mmdd === !1 && r.separator === this._dateSeparator && r.monthType === "number"
+      (i) => i.mmdd === !1 && i.separator === this._dateSeparator && i.monthType === "number"
     );
-    return a` <div class="setting">
+    return s` <div class="setting">
       <luzmo-field-label for="week-format"
-        >${i("Format", {
+        >${l("Format", {
       desc: "Label for format setting"
     })}</luzmo-field-label
       >
@@ -267,7 +275,7 @@ let s = class extends $(w, {
       {
         ...this._currentSlotContent,
         type: "datetime",
-        format: o?.key
+        format: o == null ? void 0 : o.key
       },
       {
         localFormats: this._localeFormats,
@@ -280,7 +288,7 @@ let s = class extends $(w, {
       {
         ...this._currentSlotContent,
         type: "datetime",
-        format: e?.key
+        format: e == null ? void 0 : e.key
       },
       {
         localFormats: this._localeFormats,
@@ -293,13 +301,13 @@ let s = class extends $(w, {
   }
   _renderWeekStartsOnSettings() {
     const t = Object.keys(g).map(
-      (e) => a`<luzmo-menu-item value=${e}>
+      (e) => s`<luzmo-menu-item value=${e}>
           ${g[e]()}
         </luzmo-menu-item>`
     );
-    return a`<div class="setting">
+    return s`<div class="setting">
       <luzmo-field-label for="week-start"
-        >${i("Week starts on", {
+        >${l("Week starts on", {
       desc: "Label for week start setting"
     })}</luzmo-field-label
       >
@@ -315,9 +323,9 @@ let s = class extends $(w, {
     </div>`;
   }
   _renderMonthNameSettings() {
-    return a`<div class="settings-">
+    return s`<div class="settings-">
       <luzmo-field-label for="month-name"
-        >${i("Month", { desc: "Month format setting" })}</luzmo-field-label
+        >${l("Month", { desc: "Month format setting" })}</luzmo-field-label
       >
       <luzmo-action-button
         id="month-name"
@@ -332,15 +340,15 @@ let s = class extends $(w, {
           .size=${this.size}
           .icon=${this._monthName ? c : p}
         ></luzmo-icon>
-        ${i("Name")}
+        ${l("Name")}
       </luzmo-action-button>
     </div>`;
   }
   _renderDateFormatSettings() {
     const t = this._dateSeparator === "~" ? "/" : this._dateSeparator;
-    return a`<div class="setting">
+    return s`<div class="setting">
       <luzmo-field-label for="date-format"
-        >${i("Format", {
+        >${l("Format", {
       desc: "Label for format setting"
     })}</luzmo-field-label
       >
@@ -352,7 +360,7 @@ let s = class extends $(w, {
         @change=${this._setDateFormat}
       >
         <luzmo-menu-item value="auto">
-          ${i("Auto", { desc: "Automatic setting of the option" })}
+          ${l("Auto", { desc: "Automatic setting of the option" })}
         </luzmo-menu-item>
         <luzmo-menu-item value="mmdd">12${t}31</luzmo-menu-item>
         <luzmo-menu-item value="ddmm">31${t}12</luzmo-menu-item>
@@ -361,13 +369,13 @@ let s = class extends $(w, {
   }
   _renderSeparatorSettings() {
     const t = Object.keys(y).map(
-      (e) => a`<luzmo-menu-item value=${e}>
+      (e) => s`<luzmo-menu-item value=${e}>
           ${y[e]()}
         </luzmo-menu-item>`
     );
-    return a`<div class="setting">
+    return s`<div class="setting">
       <luzmo-field-label for="date-separator"
-        >${i("Separator", {
+        >${l("Separator", {
       desc: "Label for date separator setting"
     })}</luzmo-field-label
       >
@@ -383,9 +391,9 @@ let s = class extends $(w, {
     </div>`;
   }
   _render24hFormatSettings() {
-    return a`<div class="settings-">
+    return s`<div class="settings-">
       <luzmo-field-label for="format-24h"
-        >${i("24h", {
+        >${l("24h", {
       desc: "Label for 24h format setting"
     })}</luzmo-field-label
       >
@@ -406,9 +414,9 @@ let s = class extends $(w, {
     </div>`;
   }
   _renderWeekdaySettings() {
-    return a`<div class="settings-">
+    return s`<div class="settings-">
       <luzmo-field-label for="weekday"
-        >${i("Weekday", {
+        >${l("Weekday", {
       desc: "Label for weekday setting"
     })}</luzmo-field-label
       >
@@ -425,20 +433,20 @@ let s = class extends $(w, {
           .size=${this.size}
           .icon=${this._weekDay ? c : p}
         ></luzmo-icon>
-        ${i("Show")}
+        ${l("Show")}
       </luzmo-action-button>
     </div>`;
   }
   _renderAllSettings() {
-    return a`<div class="settings-container">
-      ${this._dateLevel && ![1, 9].includes(this._dateLevel) ? a` <div class="settings-row">
+    return s`<div class="settings-container">
+      ${this._dateLevel && ![1, 9].includes(this._dateLevel) ? s` <div class="settings-row">
             ${this._renderDisplaySettings()}
             ${this._dateLevel && this._dateLevel >= 5 && this._displayAs === "day_in_week" ? this._renderWeekStartsOnSettings() : ""}
           </div>` : ""}
-      ${["month_in_year", "day_in_week"].includes(this._displayAs ?? "") ? a` <div class="settings-row">
+      ${["month_in_year", "day_in_week"].includes(this._displayAs ?? "") ? s` <div class="settings-row">
             ${this._renderWeekDayAndMonthNameFormatSettings()}
           </div>` : ""}
-      ${this._dateLevel && this._dateLevel > 1 && this._displayAs === "default" ? a` <div class="settings-row">
+      ${this._dateLevel && this._dateLevel > 1 && this._displayAs === "default" ? s` <div class="settings-row">
             ${this._dateLevel && this._dateLevel !== 4 && this._dateLevel !== 2 ? this._renderMonthNameSettings() : ""}
             ${this._dateLevel && this._dateLevel !== 4 && this._dateLevel > 2 && this._monthName ? this._renderMonthNameFormatSettings() : ""}
             ${this._dateLevel && this._dateLevel === 4 && !this._monthName ? this._renderWeekFormatSettings() : ""}
@@ -451,7 +459,7 @@ let s = class extends $(w, {
   }
   render() {
     return this._loadLocaleFormatsConfig.render({
-      pending: () => a`<luzmo-progress-circle
+      pending: () => s`<luzmo-progress-circle
           indeterminate
           .size=${this.size}
         ></luzmo-progress-circle>`,
@@ -460,55 +468,55 @@ let s = class extends $(w, {
     });
   }
 };
-l([
+m([
   d({ type: String })
-], s.prototype, "language", 2);
-l([
+], r.prototype, "language", 2);
+m([
   d({ type: String })
-], s.prototype, "contentLanguage", 2);
-l([
+], r.prototype, "contentLanguage", 2);
+m([
   d({ type: String })
-], s.prototype, "size", 2);
-l([
+], r.prototype, "size", 2);
+m([
   d({ type: Object, reflect: !1 })
-], s.prototype, "slotContent", 2);
-l([
-  m("#display-as")
-], s.prototype, "_displayAsElement", 2);
-l([
-  m("#week-start")
-], s.prototype, "_weekStartElement", 2);
-l([
-  m("#weekday-and-month-in-year-format")
-], s.prototype, "_weekDayAndMonthInYearFormatElement", 2);
-l([
-  m("#month-name-format")
-], s.prototype, "_monthNameFormatElement", 2);
-l([
-  m("#month-name")
-], s.prototype, "_monthNameElement", 2);
-l([
-  m("#week-format")
-], s.prototype, "_weekFormatElement", 2);
-l([
-  m("#date-format")
-], s.prototype, "_dateFormatElement", 2);
-l([
-  m("#date-separator")
-], s.prototype, "_dateSeparatorElement", 2);
-l([
-  m("#weekday")
-], s.prototype, "_weekDayElement", 2);
-l([
-  m("#format-24h")
-], s.prototype, "_format24hElement", 2);
-s = l([
+], r.prototype, "slotContent", 2);
+m([
+  n("#display-as")
+], r.prototype, "_displayAsElement", 2);
+m([
+  n("#week-start")
+], r.prototype, "_weekStartElement", 2);
+m([
+  n("#weekday-and-month-in-year-format")
+], r.prototype, "_weekDayAndMonthInYearFormatElement", 2);
+m([
+  n("#month-name-format")
+], r.prototype, "_monthNameFormatElement", 2);
+m([
+  n("#month-name")
+], r.prototype, "_monthNameElement", 2);
+m([
+  n("#week-format")
+], r.prototype, "_weekFormatElement", 2);
+m([
+  n("#date-format")
+], r.prototype, "_dateFormatElement", 2);
+m([
+  n("#date-separator")
+], r.prototype, "_dateSeparatorElement", 2);
+m([
+  n("#weekday")
+], r.prototype, "_weekDayElement", 2);
+m([
+  n("#format-24h")
+], r.prototype, "_format24hElement", 2);
+r = m([
   k()
-], s);
+], r);
 customElements.get("luzmo-display-settings-datetime") || customElements.define(
   "luzmo-display-settings-datetime",
-  s
+  r
 );
 export {
-  s as LuzmoDisplaySettingsDatetime
+  r as LuzmoDisplaySettingsDatetime
 };

package/components/display-settings-grand-totals/index.js

@@ -25,22 +25,22 @@ import { msg as u, localized as z } from "@lit/localize";
 import { luzmoCheckboxChecked as g, luzmoCheckbox as p } from "@luzmo/icons";
 import { property as m, state as b } from "lit/decorators.js";
 import { ifDefined as f } from "lit/directives/if-defined.js";
-import { L as h } from "../focusable-BS2pbY7w.js";
+import { L as h } from "../focusable-DCIFkpiW.js";
 import { S as v, E as x } from "../sized-mixin-cJbo3PKR.js";
-import { g as y, t as w, s as C } from "../set-locale-hKTMz37h.js";
+import { g as y, t as w, s as C } from "../set-locale-Dp3N_gXN.js";
 (function() {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
-    const l = document.createElement("style");
-    l.setAttribute("data-luzmo-vars", ""), l.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-background-color-alt-1: rgb(250, 250, 250);--luzmo-background-color-alt-2: rgb(239, 239, 239);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-color-disabled);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-secondary-outline: rgba(255, 0, 255, 0.2);--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: #b3241f;--luzmo-negative-color-down: #9f231f;--luzmo-negative-color-focus: #b3241f;--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-positive-color: rgb(20, 150, 101);--luzmo-positive-color-hover: rgb(17, 128, 86);--luzmo-positive-color-down: rgb(16, 105, 71);--luzmo-positive-color-focus: rgb(17, 128, 86);--luzmo-positive-color-rgb: 20, 150, 101;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: rgb(70, 70, 70);--luzmo-selected-color-down: rgb(40, 40, 40);--luzmo-selected-color-focus: rgb(70, 70, 70);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: rgb(0, 0, 0);--luzmo-selected-color-hard-down: rgb(0, 0, 0);--luzmo-selected-color-hard-focus: rgb(0, 0, 0);--luzmo-color-informative: #1a77e9;--luzmo-color-informative-rgb: 26, 119, 233;--luzmo-color-disabled: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(l);
+    const o = document.createElement("style");
+    o.setAttribute("data-luzmo-vars", ""), o.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-background-color-alt-1: rgb(250, 250, 250);--luzmo-background-color-alt-2: rgb(239, 239, 239);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-color-disabled);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-secondary-outline: rgba(255, 0, 255, 0.2);--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: #b3241f;--luzmo-negative-color-down: #9f231f;--luzmo-negative-color-focus: #b3241f;--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-positive-color: rgb(20, 150, 101);--luzmo-positive-color-hover: rgb(17, 128, 86);--luzmo-positive-color-down: rgb(16, 105, 71);--luzmo-positive-color-focus: rgb(17, 128, 86);--luzmo-positive-color-rgb: 20, 150, 101;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: rgb(70, 70, 70);--luzmo-selected-color-down: rgb(40, 40, 40);--luzmo-selected-color-focus: rgb(70, 70, 70);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: rgb(0, 0, 0);--luzmo-selected-color-hard-down: rgb(0, 0, 0);--luzmo-selected-color-hard-focus: rgb(0, 0, 0);--luzmo-color-informative: #1a77e9;--luzmo-color-informative-rgb: 26, 119, 233;--luzmo-color-disabled: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(o);
   }
 })();
 const _ = ":host .settings-container{display:flex;flex-direction:column;gap:var(--luzmo-display-settings-vertical-gap, var(--luzmo-spacing-2))}:host .settings-row{display:flex;justify-content:flex-start;align-items:center;gap:var(--luzmo-display-settings-grand-totals-gap, var(--display-settings-grand-totals-gap))}:host{--display-settings-grand-totals-gap: var(--luzmo-spacing-3)}:host([size=s]){--display-settings-grand-totals-gap: var(--luzmo-spacing-3)}:host([size=l]){--display-settings-grand-totals-gap: var(--luzmo-spacing-4)}:host([size=xl]){--display-settings-grand-totals-gap: var(--luzmo-spacing-5)}";
-var S = Object.defineProperty, k = Object.getOwnPropertyDescriptor, s = (o, l, a, r) => {
-  for (var e = r > 1 ? void 0 : r ? k(l, a) : l, n = o.length - 1, i; n >= 0; n--)
-    (i = o[n]) && (e = (r ? i(l, a, e) : i(e)) || e);
-  return r && e && S(l, a, e), e;
+var S = Object.defineProperty, k = Object.getOwnPropertyDescriptor, a = (l, o, t, s) => {
+  for (var e = s > 1 ? void 0 : s ? k(o, t) : o, n = l.length - 1, i; n >= 0; n--)
+    (i = l[n]) && (e = (s ? i(o, t, e) : i(e)) || e);
+  return s && e && S(o, t, e), e;
 };
-let t = class extends v(h, {
+let r = class extends v(h, {
   validSizes: Object.values(x)
 }) {
   constructor() {
@@ -49,14 +49,15 @@ let t = class extends v(h, {
   static get styles() {
     return [c(_)];
   }
-  willUpdate(o) {
-    o.has("slotContent") && (this._enabled = this.slotContent?.grandTotals?.enabled ?? !1), o.has("language") && this.language !== y() && ([...w].includes(this.language ?? "en") || this.language === "en") && C(this.language);
+  willUpdate(l) {
+    var o, t;
+    l.has("slotContent") && (this._enabled = ((t = (o = this.slotContent) == null ? void 0 : o.grandTotals) == null ? void 0 : t.enabled) ?? !1), l.has("language") && this.language !== y() && ([...w].includes(this.language ?? "en") || this.language === "en") && C(this.language);
   }
   toggleGrandTotals() {
     this._enabled = !this._enabled, this.sendEvent();
   }
   sendEvent() {
-    const o = {
+    const l = {
       enabled: !!this._enabled
     };
     this.dispatchEvent(
@@ -67,7 +68,7 @@ let t = class extends v(h, {
         detail: {
           slotContent: {
             ...this.slotContent,
-            grandTotals: o
+            grandTotals: l
           }
         }
       })
@@ -103,22 +104,22 @@ let t = class extends v(h, {
     </div>`;
   }
 };
-s([
+a([
   m({ type: String, reflect: !0 })
-], t.prototype, "language", 2);
-s([
+], r.prototype, "language", 2);
+a([
   m()
-], t.prototype, "slotContent", 2);
-s([
+], r.prototype, "slotContent", 2);
+a([
   b()
-], t.prototype, "_enabled", 2);
-t = s([
+], r.prototype, "_enabled", 2);
+r = a([
   z()
-], t);
+], r);
 customElements.get("luzmo-display-settings-grand-totals") || customElements.define(
   "luzmo-display-settings-grand-totals",
-  t
+  r
 );
 export {
-  t as LuzmoDisplaySettingsGrandTotals
+  r as LuzmoDisplaySettingsGrandTotals
 };