@luzmo/analytics-components-kit 1.0.1-alpha.11 → 1.0.1-alpha.13

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

@@ -17,7 +17,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-import { h as b } from "../task-Cr9aRIbV.js";
+import { h as S } from "../task-Cr9aRIbV.js";
 import "../index-CdCtJpK9.js";
 import "../index-Bee1uunR.js";
 import "../index-BYfDERr7.js";
@@ -25,45 +25,45 @@ import "../index-ymMEPngt.js";
 import "../index-B3ve6cAj.js";
 import "../index-B5Wvyv9s.js";
 import "../index-CfEn3fIT.js";
-import { k, a as x, x as s, n as d } from "../property-B2F7x7Cz.js";
-import { m as S, d as w } from "../sized-mixin-BxMraZLS-B_y0PzR3.js";
-import { m as i, t as F, s as $, l as A } from "../set-locale-DJYT4V7U.js";
+import { k, a as x, x as a, n as d } from "../property-B2F7x7Cz.js";
+import { m as w, d as F } from "../sized-mixin-BxMraZLS-B_y0PzR3.js";
+import { m as i, t as $, s as A, l as L } from "../set-locale-DJYT4V7U.js";
 import { C as p, h as c } from "../luzmo-icons-BE2T8vWu.js";
-import { S as _, f } from "../en-DlRadzUI.js";
-import { a as L, b as z, W as g } from "../periods.const-GHh5bPfs.js";
+import { S as f, f as _, D as v } from "../formatter-CQDms6fU.js";
+import { a as D, b as g, W as z } from "../periods.const-GHh5bPfs.js";
 import { e as n } from "../query-Ddbd72Um.js";
-const v = () => {
+const b = () => {
   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-color-negative: #ca221c;--luzmo-color-negative-hover: #b3241f;--luzmo-color-negative-down: #9f231f;--luzmo-color-negative-focus: #b3241f;--luzmo-color-negative-rgb: 202, 34, 28;--luzmo-color-positive: rgb(20, 150, 101);--luzmo-color-positive-hover: rgb(17, 128, 86);--luzmo-color-positive-down: rgb(16, 105, 71);--luzmo-color-positive-focus: rgb(17, 128, 86);--luzmo-color-positive-rgb: 20, 150, 101;--luzmo-color-selected: rgb(110, 110, 110);--luzmo-color-selected-hover: rgb(70, 70, 70);--luzmo-color-selected-down: rgb(40, 40, 40);--luzmo-color-selected-focus: rgb(70, 70, 70);--luzmo-color-selected-hard: #1e1e1e;--luzmo-color-selected-hard-hover: rgb(0, 0, 0);--luzmo-color-selected-hard-down: rgb(0, 0, 0);--luzmo-color-selected-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);
   }
 };
-v();
+b();
 const y = {
   "~": () => i("Auto", { desc: "Automatic setting of the option" }),
   "/": () => "/",
   "-": () => "-",
   ".": () => "."
-}, D = ":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-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 .example-container{line-height:var(--luzmo-display-settings-datetime-example-height, var(--display-settings-datetime-example-height));font-size:var(--luzmo-display-settings-datetime-example-font-size, var(--display-settings-datetime-example-font-size));color:var(--luzmo-display-settings-datetime-example-color, var(--display-settings-datetime-example-color))}:host .example-container .example-label{font-weight:var(--luzmo-display-settings-datetime-example-label-font-weight, var(--display-settings-datetime-example-label-font-weight));color:var(--luzmo-display-settings-datetime-example-label-color, var(--display-settings-datetime-example-label-color))}:host .example-container .example-language{text-transform:uppercase;color:var(--luzmo-display-settings-datetime-example-language-color, var(--display-settings-datetime-example-language-color))}: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 E = Object.defineProperty, M = Object.getOwnPropertyDescriptor, m = (t, e, a, o) => {
-  for (var l = o > 1 ? void 0 : o ? M(e, a) : e, h = t.length - 1, u; h >= 0; h--)
-    (u = t[h]) && (l = (o ? u(e, a, l) : u(l)) || l);
-  return o && l && E(e, a, l), l;
+}, 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-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 .example-container{line-height:var(--luzmo-display-settings-datetime-example-height, var(--display-settings-datetime-example-height));font-size:var(--luzmo-display-settings-datetime-example-font-size, var(--display-settings-datetime-example-font-size));color:var(--luzmo-display-settings-datetime-example-color, var(--display-settings-datetime-example-color))}:host .example-container .example-label{font-weight:var(--luzmo-display-settings-datetime-example-label-font-weight, var(--display-settings-datetime-example-label-font-weight));color:var(--luzmo-display-settings-datetime-example-label-color, var(--display-settings-datetime-example-label-color))}:host .example-container .example-language{text-transform:uppercase;color:var(--luzmo-display-settings-datetime-example-language-color, var(--display-settings-datetime-example-language-color))}: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, m = (t, e, s, o) => {
+  for (var l = o > 1 ? void 0 : o ? C(e, s) : e, h = t.length - 1, u; h >= 0; h--)
+    (u = t[h]) && (l = (o ? u(e, s, l) : u(l)) || l);
+  return o && l && M(e, s, l), l;
 };
-let r = class extends S(k, {
-  validSizes: Object.values(w)
+let r = class extends w(k, {
+  validSizes: Object.values(F)
 }) {
   constructor() {
-    super(...arguments), this._loadLocaleFormatsConfig = new b(this, {
+    super(...arguments), this._loadLocaleFormatsConfig = new S(this, {
       task: async ([t]) => {
         if (t && t !== this._contentLanguageLoaded) {
           const e = /* @__PURE__ */ Object.assign({
             "../../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-C9t4MSgD.js"),
-            "../../utils/formatter/formats/en-US.ts": () => import("../en-DlRadzUI.js").then((a) => a.e),
-            "../../utils/formatter/formats/en.ts": () => import("../en-DlRadzUI.js").then((a) => a.a),
+            "../../utils/formatter/formats/en-GB.ts": () => import("../en-GB-BtLbN8o_.js"),
+            "../../utils/formatter/formats/en-US.ts": () => Promise.resolve().then(() => N),
+            "../../utils/formatter/formats/en.ts": () => Promise.resolve().then(() => O),
             "../../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"),
@@ -84,8 +84,8 @@ let r = class extends S(k, {
             "../../utils/formatter/formats/zh-TW.ts": () => import("../zh-TW-wsl7eFSd.js")
           });
           if (e[`../../utils/formatter/formats/${t}.ts`]) {
-            const a = await e[`../../utils/formatter/formats/${t}.ts`]();
-            this._localeFormats = (a == null ? void 0 : a.default) ?? {};
+            const s = await e[`../../utils/formatter/formats/${t}.ts`]();
+            this._localeFormats = (s == null ? void 0 : s.default) ?? {};
           }
           return this._contentLanguageLoaded = t, this._localeFormats;
         }
@@ -105,16 +105,16 @@ let r = class extends S(k, {
     };
   }
   static get styles() {
-    return [x(D)];
+    return [x(E)];
   }
   _parseSlotContent() {
     var t, e;
     this._dateLevel = this.slotContent.level ?? ((t = this.slotContent) == null ? void 0 : t.lowestLevel) ?? 5, this._displayAs = ((e = this.slotContent) == null ? void 0 : e.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");
   }
   _calculateFormat() {
-    var a;
+    var s;
     let t;
-    const e = ((a = this._localeFormats) == null ? void 0 : a.smartDateFormats) ?? _;
+    const e = ((s = this._localeFormats) == null ? void 0 : s.smartDateFormats) ?? f;
     this._monthName ? (t = e.filter(
       (o) => o.monthType === "name" && o.longText === (this._monthNameFormat === "long") && o.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(
@@ -160,16 +160,16 @@ let r = class extends S(k, {
     this._currentSlotContent = { ...this.slotContent }, this._calculateFormat(), this._currentSlotContent.format = this._format, this._displayAs === "default" ? delete this._currentSlotContent.datetimeDisplayMode : (this._currentSlotContent.datetimeDisplayMode = this._displayAs, this._displayAs === "week_in_year" ? this._currentSlotContent.datetimeDisplayMode = this._weekDayAndMonthInYearFormat === "number" ? "week_number" : "week_name" : this._displayAs === "month_in_year" ? this._currentSlotContent.datetimeDisplayMode = this._weekDayAndMonthInYearFormat === "number" ? "month_number" : "month_name" : this._displayAs === "day_in_week" && (this._currentSlotContent.datetimeDisplayMode = this._weekDayAndMonthInYearFormat === "number" ? "weekday_number" : "weekday_name", this._currentSlotContent.weekStart = this._weekStart), this._weekDayAndMonthInYearFormat && (this._dateLevel === 3 ? this._currentSlotContent.monthNameFormat = this._weekDayAndMonthInYearFormat : this._dateLevel === 5 && (this._currentSlotContent.weekDayNameFormat = this._weekDayAndMonthInYearFormat)));
   }
   willUpdate(t) {
-    t.has("slotContent") && (this._parseSlotContent(), this._calculateSlotContent()), t.has("language") && ([...F].includes(this.language) || this.language === "en") && ($(this.language), this.requestUpdate());
+    t.has("slotContent") && (this._parseSlotContent(), this._calculateSlotContent()), t.has("language") && ([...$].includes(this.language) || this.language === "en") && (A(this.language), this.requestUpdate());
   }
   _renderDisplaySettings() {
-    var e, a;
-    const t = (a = (e = L) == null ? void 0 : e[`level${this._dateLevel ?? 0}`]) == null ? void 0 : a.map(
-      (o) => s`<luzmo-menu-item value=${o.key}>
+    var e, s;
+    const t = (s = (e = D) == null ? void 0 : e[`level${this._dateLevel ?? 0}`]) == null ? void 0 : s.map(
+      (o) => a`<luzmo-menu-item value=${o.key}>
           ${o.i18n()}
         </luzmo-menu-item>`
     );
-    return s`<div class="setting">
+    return a`<div class="setting">
       <luzmo-field-label for="display-as"
         >${i("Display", {
       desc: "Label for display setting"
@@ -188,11 +188,11 @@ let r = class extends S(k, {
   }
   _renderWeekDayAndMonthNameFormatSettings() {
     const t = Object.keys(
-      z
-    ).map((e) => s`<luzmo-action-button value=${e}>
-        ${z[e]()}
+      g
+    ).map((e) => a`<luzmo-action-button value=${e}>
+        ${g[e]()}
       </luzmo-action-button>`);
-    return s` <div class="setting">
+    return a` <div class="setting">
       <luzmo-field-label for="weekday-and-month-in-year-format"
         >${i("Format", {
       desc: "Label for format setting"
@@ -212,7 +212,7 @@ let r = class extends S(k, {
     </div>`;
   }
   _renderMonthNameFormatSettings() {
-    return s` <div class="setting">
+    return a` <div class="setting">
       <luzmo-field-label for="month-name-format"
         >${i("Format", {
       desc: "Label for format setting"
@@ -238,12 +238,12 @@ let r = class extends S(k, {
   }
   _renderWeekFormatSettings() {
     var o;
-    const t = ((o = this._localeFormats) == null ? void 0 : o.smartDateFormats) ?? _, e = t.find(
+    const t = ((o = this._localeFormats) == null ? void 0 : o.smartDateFormats) ?? f, e = t.find(
       (l) => l.mmdd === !0 && l.separator === this._dateSeparator && l.monthType === "number"
-    ), a = t.find(
+    ), s = t.find(
       (l) => l.mmdd === !1 && l.separator === this._dateSeparator && l.monthType === "number"
     );
-    return s` <div class="setting">
+    return a` <div class="setting">
       <luzmo-field-label for="week-format"
         >${i("Format", {
       desc: "Label for format setting"
@@ -259,11 +259,11 @@ let r = class extends S(k, {
         @change=${this._setWeekFormat}
       >
         <luzmo-action-button value="ddmm">
-          ${f(
+          ${_(
       {
         ...this._currentSlotContent,
         type: "datetime",
-        format: a == null ? void 0 : a.key
+        format: s == null ? void 0 : s.key
       },
       {
         localFormats: this._localeFormats,
@@ -272,7 +272,7 @@ let r = class extends S(k, {
     )(/* @__PURE__ */ new Date())}
         </luzmo-action-button>
         <luzmo-action-button value="mmdd"
-          >${f(
+          >${_(
       {
         ...this._currentSlotContent,
         type: "datetime",
@@ -288,12 +288,12 @@ let r = class extends S(k, {
     </div>`;
   }
   _renderWeekStartsOnSettings() {
-    const t = Object.keys(g).map(
-      (e) => s`<luzmo-menu-item value=${e}>
-          ${g[e]()}
+    const t = Object.keys(z).map(
+      (e) => a`<luzmo-menu-item value=${e}>
+          ${z[e]()}
         </luzmo-menu-item>`
     );
-    return s`<div class="setting">
+    return a`<div class="setting">
       <luzmo-field-label for="week-start"
         >${i("Week starts on", {
       desc: "Label for week start setting"
@@ -311,7 +311,7 @@ let r = class extends S(k, {
     </div>`;
   }
   _renderMonthNameSettings() {
-    return s`<div class="settings-">
+    return a`<div class="settings-">
       <luzmo-field-label for="month-name"
         >${i("Month", { desc: "Month format setting" })}</luzmo-field-label
       >
@@ -334,7 +334,7 @@ let r = class extends S(k, {
   }
   _renderDateFormatSettings() {
     const t = this._dateSeparator === "~" ? "/" : this._dateSeparator;
-    return s`<div class="setting">
+    return a`<div class="setting">
       <luzmo-field-label for="date-format"
         >${i("Format", {
       desc: "Label for format setting"
@@ -357,11 +357,11 @@ let r = class extends S(k, {
   }
   _renderSeparatorSettings() {
     const t = Object.keys(y).map(
-      (e) => s`<luzmo-menu-item value=${e}>
+      (e) => a`<luzmo-menu-item value=${e}>
           ${y[e]()}
         </luzmo-menu-item>`
     );
-    return s`<div class="setting">
+    return a`<div class="setting">
       <luzmo-field-label for="date-separator"
         >${i("Separator", {
       desc: "Label for date separator setting"
@@ -379,7 +379,7 @@ let r = class extends S(k, {
     </div>`;
   }
   _render24hFormatSettings() {
-    return s`<div class="settings-">
+    return a`<div class="settings-">
       <luzmo-field-label for="format-24h"
         >${i("24h", {
       desc: "Label for 24h format setting"
@@ -402,7 +402,7 @@ let r = class extends S(k, {
     </div>`;
   }
   _renderWeekdaySettings() {
-    return s`<div class="settings-">
+    return a`<div class="settings-">
       <luzmo-field-label for="weekday"
         >${i("Weekday", {
       desc: "Label for weekday setting"
@@ -426,8 +426,8 @@ let r = class extends S(k, {
     </div>`;
   }
   _renderExampleFormat() {
-    return s`<span class="example">
-        ${f(
+    return a`<span class="example">
+        ${_(
       {
         ...this._currentSlotContent,
         type: "datetime"
@@ -438,20 +438,20 @@ let r = class extends S(k, {
       }
     )(!this._displayAs || this._displayAs === "default" ? /* @__PURE__ */ new Date() : 1)}
       </span>
-      ${(this._dateSeparator === "~" || this._dateFormat === "auto") && !this._monthName ? s`<span class="example-language">
+      ${(this._dateSeparator === "~" || this._dateFormat === "auto") && !this._monthName ? a`<span class="example-language">
             (${this.contentLanguage})
           </span>` : ""}`;
   }
   _renderAllSettings() {
-    return s`<div class="settings-container">
-      ${this._dateLevel && ![1, 9].includes(this._dateLevel) ? s` <div class="settings-row">
+    return a`<div class="settings-container">
+      ${this._dateLevel && ![1, 9].includes(this._dateLevel) ? a` <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 ?? "") ? s` <div class="settings-row">
+      ${["month_in_year", "day_in_week"].includes(this._displayAs ?? "") ? a` <div class="settings-row">
             ${this._renderWeekDayAndMonthNameFormatSettings()}
           </div>` : ""}
-      ${this._dateLevel && this._dateLevel > 1 && this._displayAs === "default" ? s` <div class="settings-row">
+      ${this._dateLevel && this._dateLevel > 1 && this._displayAs === "default" ? a` <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() : ""}
@@ -472,7 +472,7 @@ let r = class extends S(k, {
   }
   render() {
     return this._loadLocaleFormatsConfig.render({
-      pending: () => s`<luzmo-progress-circle
+      pending: () => a`<luzmo-progress-circle
           indeterminate
           .size=${this.size}
         ></luzmo-progress-circle>`,
@@ -524,12 +524,19 @@ m([
   n("#format-24h")
 ], r.prototype, "_format24hElement", 2);
 r = m([
-  A()
+  L()
 ], r);
 customElements.get("luzmo-display-settings-datetime") || customElements.define(
   "luzmo-display-settings-datetime",
   r
 );
+const N = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  default: v
+}, Symbol.toStringTag, { value: "Module" })), O = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  default: v
+}, Symbol.toStringTag, { value: "Module" }));
 export {
   r as LuzmoDisplaySettingsDatetime
 };

package/components/donut-chart.config-B_38UAqp.cjs

@@ -0,0 +1,20 @@
+/*! * A kit of modern Luzmo Web Components for analytics in your web application.
+ * 
+ * Copyright © 2024 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.
+ * */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=[{key:"general",type:"group",open:!0,children:[{key:"mode",control:{type:"picker",default:"donut",enum:["donut","pie"]}},{key:"slices.half",control:{type:"picker",default:"full",enum:["full","half"],fromOptionValue:e=>e?"half":"full",toOptionValue:e=>e==="half"}},{type:"divider"},{key:"display.title",control:{type:"switch",label:"Title",default:!0}},{key:"display.legend",control:{type:"switch",label:"Legend",default:!0}},{key:"display.categoryLabels",control:{type:"radio-button-group",enum:["list","labels"],fromOptionValue:e=>e?"labels":"list",toOptionValue:e=>e==="labels",sideEffect:(e,n)=>(e==="labels"&&(n.display.legend=!1),n)}}]},{key:"slices",type:"group",open:!0,children:[{key:"sort.by",control:{type:"picker",default:"measure",enum:["measure","category"]}},{key:"display.values",control:{type:"picker",default:"none",enum:["none","absolute","percentage"]}},{key:"slices.width",control:{type:"slider",default:.35,min:.05,max:.9,step:.01}},{key:"slices.maxNumber",control:{type:"number-field",default:12,min:0,max:50,step:1}},{key:"slices.minPercentage",control:{type:"number-field",default:3,min:0,max:100,step:1}},{key:"slices.roundedCorners",control:{type:"slider",default:8,min:0,max:24,step:1,extraLabel:(e,n,r)=>{var l,t;if(typeof((l=r==null?void 0:r.itemSpecific)==null?void 0:l.rounding)=="number")return typeof((t=e==null?void 0:e.slices)==null?void 0:t.roundedCorners)!="number"?"auto":"reset"},extraLabelHasClickAction:(e,n,r)=>{var l,t;return!(typeof((l=r==null?void 0:r.itemSpecific)==null?void 0:l.rounding)!="number"||typeof((t=e==null?void 0:e.slices)==null?void 0:t.roundedCorners)!="number")},extraLabelClickAction:(e,n,r)=>{var t;const l={...e};return((t=l==null?void 0:l.slices)==null?void 0:t.roundedCorners)!==void 0&&delete l.slices.roundedCorners,{value:null,options:l}}}},{key:"slices.padding",control:{type:"slider",default:5,min:0,max:20,step:1,extraLabel:(e,n,r)=>{var l,t;if(typeof((l=r==null?void 0:r.itemSpecific)==null?void 0:l.padding)=="number")return typeof((t=e==null?void 0:e.slices)==null?void 0:t.padding)!="number"?"auto":"reset"},extraLabelHasClickAction:(e,n,r)=>{var l,t;return!(typeof((l=r==null?void 0:r.itemSpecific)==null?void 0:l.padding)!="number"||typeof((t=e==null?void 0:e.slices)==null?void 0:t.padding)!="number")},extraLabelClickAction:(e,n,r)=>{var t;const l={...e};return((t=l==null?void 0:l.slices)==null?void 0:t.padding)!==void 0&&delete l.slices.padding,{value:null,options:l}}}}]}];exports.default=u;

package/components/{donut-chart.config-3DhKiSSM.js → donut-chart.config-DuJFyp4z.js}

@@ -17,7 +17,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-const u = [
+const a = [
   {
     key: "general",
     type: "group",
@@ -48,6 +48,7 @@ const u = [
         key: "display.title",
         control: {
           type: "switch",
+          label: "Title",
           default: !0
         }
       },
@@ -55,6 +56,7 @@ const u = [
         key: "display.legend",
         control: {
           type: "switch",
+          label: "Legend",
           default: !0
         }
       },
@@ -173,5 +175,5 @@ const u = [
   }
 ];
 export {
-  u as default
+  a as default
 };

package/components/dropdown-filter.config-BPBxTuLQ.cjs

@@ -0,0 +1,20 @@
+/*! * A kit of modern Luzmo Web Components for analytics in your web application.
+ * 
+ * Copyright © 2024 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.
+ * */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=[{key:"general",type:"group",open:!0,children:[{key:"display.title",control:{type:"switch",label:"Title",default:!1}},{key:"display.label",control:{type:"switch",label:"Label",default:!1}},{key:"multiselect",control:{type:"switch",label:"Multiselect",default:!1}},{key:"applyFiltersWithButton",control:{type:"switch",label:"Filter with Apply button",default:!1},visibleIf:e=>e==null?void 0:e.multiselect},{key:"showCheckboxes",control:{type:"switch",label:"Show checkboxes",default:!0},visibleIf:e=>e==null?void 0:e.multiselect},{key:"display.search",control:{type:"switch",label:"Search",default:!0},visibleIf:e=>!(e!=null&&e.multiselect)},{key:"display.clear",control:{type:"switch",label:"Show clear selection",default:!0},visibleIf:e=>!(e!=null&&e.multiselect)}]},{key:"order",type:"group",open:!1,children:[{key:"sort.direction",control:{type:"picker",label:"Ordering",default:"asc",enum:["asc","desc"]}}]},{key:"placeholder",type:"group",open:!0,children:[{key:"display.placeholder",control:{type:"switch",label:"Display",default:!0}},{key:"placeholder",control:{type:"multi-language-field",label:"Text",placeholder:"Search..."},visibleIf:e=>{var l;return((l=e==null?void 0:e.display)==null?void 0:l.placeholder)!==!1}}]},{key:"padding",type:"group",open:!1,children:[{key:"padding.left",control:{label:"Padding left",type:"number-field",default:16,min:0,max:100,step:1}},{key:"padding.right",control:{label:"Padding right",type:"number-field",default:16,min:0,max:100,step:1}}]}];exports.default=t;

package/components/dropdown-filter.config-Drv-A4zw.js

@@ -0,0 +1,163 @@
+/*! * A kit of modern Luzmo Web Components for analytics in your web application.
+ * 
+ * Copyright © 2024 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.
+ * */
+const t = [
+  {
+    key: "general",
+    type: "group",
+    open: !0,
+    children: [
+      {
+        key: "display.title",
+        control: {
+          type: "switch",
+          label: "Title",
+          default: !1
+        }
+      },
+      {
+        key: "display.label",
+        control: {
+          type: "switch",
+          label: "Label",
+          default: !1
+        }
+      },
+      {
+        key: "multiselect",
+        control: {
+          type: "switch",
+          label: "Multiselect",
+          default: !1
+        }
+      },
+      {
+        key: "applyFiltersWithButton",
+        control: {
+          type: "switch",
+          label: "Filter with Apply button",
+          default: !1
+        },
+        visibleIf: (e) => e == null ? void 0 : e.multiselect
+      },
+      {
+        key: "showCheckboxes",
+        control: {
+          type: "switch",
+          label: "Show checkboxes",
+          default: !0
+        },
+        visibleIf: (e) => e == null ? void 0 : e.multiselect
+      },
+      {
+        key: "display.search",
+        control: {
+          type: "switch",
+          label: "Search",
+          default: !0
+        },
+        visibleIf: (e) => !(e != null && e.multiselect)
+      },
+      {
+        key: "display.clear",
+        control: {
+          type: "switch",
+          label: "Show clear selection",
+          default: !0
+        },
+        visibleIf: (e) => !(e != null && e.multiselect)
+      }
+    ]
+  },
+  {
+    key: "order",
+    type: "group",
+    open: !1,
+    children: [
+      {
+        key: "sort.direction",
+        control: {
+          type: "picker",
+          label: "Ordering",
+          default: "asc",
+          enum: ["asc", "desc"]
+        }
+      }
+    ]
+  },
+  {
+    key: "placeholder",
+    type: "group",
+    open: !0,
+    children: [
+      {
+        key: "display.placeholder",
+        control: {
+          type: "switch",
+          label: "Display",
+          default: !0
+        }
+      },
+      {
+        key: "placeholder",
+        control: {
+          type: "multi-language-field",
+          label: "Text",
+          placeholder: "Search..."
+        },
+        visibleIf: (e) => {
+          var l;
+          return ((l = e == null ? void 0 : e.display) == null ? void 0 : l.placeholder) !== !1;
+        }
+      }
+    ]
+  },
+  {
+    key: "padding",
+    type: "group",
+    open: !1,
+    children: [
+      {
+        key: "padding.left",
+        control: {
+          label: "Padding left",
+          type: "number-field",
+          default: 16,
+          min: 0,
+          max: 100,
+          step: 1
+        }
+      },
+      {
+        key: "padding.right",
+        control: {
+          label: "Padding right",
+          type: "number-field",
+          default: 16,
+          min: 0,
+          max: 100,
+          step: 1
+        }
+      }
+    ]
+  }
+];
+export {
+  t as default
+};