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

package/components/filter-data-item-picker/index.cjs

@@ -0,0 +1,47 @@
+/*! * A kit of modern Luzmo Web Components for analytics in your web application.
+ * 
+ * Copyright © 2025 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"});require("@luzmo/lucero/field-label");require("@luzmo/lucero/icon");require("@luzmo/lucero/menu");require("@luzmo/lucero/picker");const m=require("lit"),f=require("@lit/localize"),p=require("@luzmo/lucero/utils"),I=require("../set-locale-BRRalqne.cjs"),r=require("lit/decorators.js"),y=require("../calculate-data-item-icon-DtVGbet3.cjs"),z=require("../localize-C4zNlrwK.cjs"),D=":host{--var: blue}:host{font-family:var(--luzmo-font-family)}";var b=Object.defineProperty,L=Object.getOwnPropertyDescriptor,o=(h,e,a,s)=>{for(var i=s>1?void 0:s?L(e,a):e,t=h.length-1,l;t>=0;t--)(l=h[t])&&(i=(s?l(e,a,i):l(i))||i);return s&&i&&b(e,a,i),i};exports.LuzmoFilterDataItemPicker=class extends p.SizedMixin(p.LuzmoElement,{validSizes:Object.values(p.ElementSizes)}){constructor(){super(...arguments),this.language="en",this.contentLanguage="en",this.hasLabel=!1,this.icons="only-menu",this.allowEmpty=!1,this.placeholder="",this.dataItemId="",this.loading=!1,this.invalid=!1,this.datasetsDataItems=[]}static get styles(){return[m.unsafeCSS(D)]}_sendChangeEvent(){this.dispatchEvent(new CustomEvent("data-item-selected",{bubbles:!0,composed:!0,cancelable:!0,detail:{dataItem:this._dataItemSelected}}))}setDataItem(e){const a=e?.detail;for(const s of this.datasetsDataItems){const i=s.columns,t=s.formulas,l=i.find(c=>c.id===a),n=c=>{this._dataItemSelected=c,this.dataItemId=a,this._sendChangeEvent()};if(l){n(l);break}const d=t.find(c=>c.id===a);if(d){n(d);break}}}_findDataItemInDatasetsDataItems(e){for(const a of this.datasetsDataItems){const s=a.columns,i=a.formulas,t=s?.find(n=>n.id===e);if(t){this._dataItemSelected=t,this._dataItemSelected.datasetId=a.id,["hierarchy","datetime"].includes(t.type??"")&&(this._dataItemSelected.lowestLevel=t.lowestLevel);break}const l=i?.find(n=>n.id===e);if(l){this._dataItemSelected=l,this._dataItemSelected.isFormula=!0,this._dataItemSelected.datasetId=a.id,["hierarchy","datetime"].includes(l.type??"")&&(this._dataItemSelected.lowestLevel=l.lowestLevel);break}}}willUpdate(e){const a=e.has("language"),s=e.has("dataItemId"),i=e.has("datasetsDataItems");if(a&&this.language!==I.getLocale()&&([...I.targetLocales].includes(this.language??"en")||this.language==="en")&&I.setLocale(this.language),(s||i)&&(this._findDataItemInDatasetsDataItems(this.dataItemId),!this._dataItemSelected&&!this.allowEmpty&&!this.loading)){for(const t of this.datasetsDataItems)if(t?.columns?.length>0){this._dataItemSelected=t.columns[0];break}else if(t?.formulas?.length>0){this._dataItemSelected=t.formulas[0];break}this.dataItemId=this._dataItemSelected?.id,this._sendChangeEvent()}}render(){let e=m.html``;for(const i of this.datasetsDataItems??[]){const t=i?.columns??[],l=i?.formulas??[],n=u=>{const g=m.html`
+          <luzmo-icon
+            slot="icon"
+            .size=${this.size}
+            .icon=${y.calculateDataItemIcon(u,this.size)}
+          >
+          </luzmo-icon>
+        `;return m.html`<luzmo-menu-item value=${u.id}>
+          ${this.icons==="none"?"":g}
+          ${z.localize(u?.name??{},this.contentLanguage)}
+        </luzmo-menu-item>`},d=t.map(u=>n(u)),c=l.map(u=>n(u));e=m.html`${d} ${c}`}const a=m.html`${e}`,s=m.html`
+      <luzmo-field-label for="data-item" size=${this.size}
+        >${this.label??f.msg("Select...")}
+      </luzmo-field-label>
+    `;return m.html` ${this.hasLabel?s:""}
+      <luzmo-picker
+        label=${this.placeholder??f.msg("Select...")}
+        id="data-item"
+        size=${this.size}
+        .icons=${!this.icons||["none","only-menu"].includes(this.icons)?"none":void 0}
+        variant="highlight"
+        .pending=${this.loading}
+        .invalid=${this.invalid}
+        value=${this.dataItemId}
+        @change=${this.setDataItem}
+      >
+        ${a}
+      </luzmo-picker>`}};o([r.property({type:String,reflect:!0})],exports.LuzmoFilterDataItemPicker.prototype,"language",2);o([r.property({type:String,attribute:"content-language",reflect:!0})],exports.LuzmoFilterDataItemPicker.prototype,"contentLanguage",2);o([r.property({type:Boolean,attribute:"has-label",reflect:!0})],exports.LuzmoFilterDataItemPicker.prototype,"hasLabel",2);o([r.property({type:String,reflect:!0})],exports.LuzmoFilterDataItemPicker.prototype,"label",2);o([r.property({type:String,reflect:!0})],exports.LuzmoFilterDataItemPicker.prototype,"icons",2);o([r.property({type:Boolean,attribute:"allow-empty",reflect:!0})],exports.LuzmoFilterDataItemPicker.prototype,"allowEmpty",2);o([r.property({type:String,attribute:"placeholder",reflect:!0})],exports.LuzmoFilterDataItemPicker.prototype,"placeholder",2);o([r.property({type:String,attribute:"data-item-id",reflect:!0})],exports.LuzmoFilterDataItemPicker.prototype,"dataItemId",2);o([r.property({type:Boolean,attribute:"loading",reflect:!0})],exports.LuzmoFilterDataItemPicker.prototype,"loading",2);o([r.property({type:Boolean,attribute:"invalid",reflect:!0})],exports.LuzmoFilterDataItemPicker.prototype,"invalid",2);o([r.property({type:Array,reflect:!1})],exports.LuzmoFilterDataItemPicker.prototype,"datasetsDataItems",2);exports.LuzmoFilterDataItemPicker=o([f.localized()],exports.LuzmoFilterDataItemPicker);customElements.get("luzmo-filter-data-item-picker")||customElements.define("luzmo-filter-data-item-picker",exports.LuzmoFilterDataItemPicker);

package/components/filter-data-item-picker/index.d.ts

@@ -0,0 +1,7 @@
+import { LuzmoFilterDataItemPicker } from './filter-data-item-picker';
+declare global {
+    interface HTMLElementTagNameMap {
+        'luzmo-filter-data-item-picker': LuzmoFilterDataItemPicker;
+    }
+}
+export { LuzmoFilterDataItemPicker } from './filter-data-item-picker';

package/components/filter-data-item-picker/index.js

@@ -21,13 +21,13 @@ import "@luzmo/lucero/field-label";
 import "@luzmo/lucero/icon";
 import "@luzmo/lucero/menu";
 import "@luzmo/lucero/picker";
-import { unsafeCSS as g, html as f } from "lit";
+import { unsafeCSS as g, html as d } from "lit";
 import { msg as z, localized as p } from "@lit/localize";
-import { SizedMixin as b, LuzmoElement as y, ElementSizes as v } from "@luzmo/lucero/utils";
-import { g as I, t as x, s as S } from "../set-locale-Dp3N_gXN.js";
-import { property as u } from "lit/decorators.js";
-import { c as w } from "../calculate-data-item-icon-DjlZwMdO.js";
-import { l as _ } from "../localize-BX7q0S0M.js";
+import { SizedMixin as b, LuzmoElement as v, ElementSizes as y } from "@luzmo/lucero/utils";
+import { g as I, t as x, s as S } from "../set-locale-hKTMz37h.js";
+import { property as n } from "lit/decorators.js";
+import { c as w } from "../calculate-data-item-icon-DMDhKq_m.js";
+import { l as _ } from "../localize-CcDpq940.js";
 (function() {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
     const o = document.createElement("style");
@@ -35,13 +35,13 @@ import { l as _ } from "../localize-BX7q0S0M.js";
   }
 })();
 const D = ":host{--var: blue}:host{font-family:var(--luzmo-font-family)}";
-var k = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, n = (l, o, i, e) => {
-  for (var t = e > 1 ? void 0 : e ? $(o, i) : o, a = l.length - 1, r; a >= 0; a--)
-    (r = l[a]) && (t = (e ? r(o, i, t) : r(t)) || t);
-  return e && t && k(o, i, t), t;
+var k = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, m = (t, o, s, a) => {
+  for (var e = a > 1 ? void 0 : a ? $(o, s) : o, r = t.length - 1, i; r >= 0; r--)
+    (i = t[r]) && (e = (a ? i(o, s, e) : i(e)) || e);
+  return a && e && k(o, s, e), e;
 };
-let s = class extends b(y, {
-  validSizes: Object.values(v)
+let l = class extends b(v, {
+  validSizes: Object.values(y)
 }) {
   constructor() {
     super(...arguments), this.language = "en", this.contentLanguage = "en", this.hasLabel = !1, this.icons = "only-menu", this.allowEmpty = !1, this.placeholder = "", this.dataItemId = "", this.loading = !1, this.invalid = !1, this.datasetsDataItems = [];
@@ -61,57 +61,56 @@ let s = class extends b(y, {
       })
     );
   }
-  setDataItem(l) {
-    const o = l == null ? void 0 : l.detail;
-    for (const i of this.datasetsDataItems) {
-      const e = i.columns, t = i.formulas, a = e.find((d) => d.id === o), r = (d) => {
-        this._dataItemSelected = d, this.dataItemId = o, this._sendChangeEvent();
+  setDataItem(t) {
+    const o = t?.detail;
+    for (const s of this.datasetsDataItems) {
+      const a = s.columns, e = s.formulas, r = a.find((u) => u.id === o), i = (u) => {
+        this._dataItemSelected = u, this.dataItemId = o, this._sendChangeEvent();
       };
-      if (a) {
-        r(a);
+      if (r) {
+        i(r);
         break;
       }
-      const m = t.find((d) => d.id === o);
-      if (m) {
-        r(m);
+      const f = e.find((u) => u.id === o);
+      if (f) {
+        i(f);
         break;
       }
     }
   }
-  _findDataItemInDatasetsDataItems(l) {
+  _findDataItemInDatasetsDataItems(t) {
     for (const o of this.datasetsDataItems) {
-      const i = o.columns, e = o.formulas, t = i == null ? void 0 : i.find((r) => r.id === l);
-      if (t) {
-        this._dataItemSelected = t, this._dataItemSelected.datasetId = o.id, ["hierarchy", "datetime"].includes(t.type ?? "") && (this._dataItemSelected.lowestLevel = t.lowestLevel);
+      const s = o.columns, a = o.formulas, e = s?.find((i) => i.id === t);
+      if (e) {
+        this._dataItemSelected = e, this._dataItemSelected.datasetId = o.id, ["hierarchy", "datetime"].includes(e.type ?? "") && (this._dataItemSelected.lowestLevel = e.lowestLevel);
         break;
       }
-      const a = e == null ? void 0 : e.find((r) => r.id === l);
-      if (a) {
-        this._dataItemSelected = a, this._dataItemSelected.isFormula = !0, this._dataItemSelected.datasetId = o.id, ["hierarchy", "datetime"].includes(a.type ?? "") && (this._dataItemSelected.lowestLevel = a.lowestLevel);
+      const r = a?.find((i) => i.id === t);
+      if (r) {
+        this._dataItemSelected = r, this._dataItemSelected.isFormula = !0, this._dataItemSelected.datasetId = o.id, ["hierarchy", "datetime"].includes(r.type ?? "") && (this._dataItemSelected.lowestLevel = r.lowestLevel);
         break;
       }
     }
   }
-  willUpdate(l) {
-    var t, a, r;
-    const o = l.has("language"), i = l.has("dataItemId"), e = l.has("datasetsDataItems");
-    if (o && this.language !== I() && ([...x].includes(this.language ?? "en") || this.language === "en") && S(this.language), (i || e) && (this._findDataItemInDatasetsDataItems(this.dataItemId), !this._dataItemSelected && !this.allowEmpty && !this.loading)) {
-      for (const m of this.datasetsDataItems)
-        if (((t = m == null ? void 0 : m.columns) == null ? void 0 : t.length) > 0) {
-          this._dataItemSelected = m.columns[0];
+  willUpdate(t) {
+    const o = t.has("language"), s = t.has("dataItemId"), a = t.has("datasetsDataItems");
+    if (o && this.language !== I() && ([...x].includes(this.language ?? "en") || this.language === "en") && S(this.language), (s || a) && (this._findDataItemInDatasetsDataItems(this.dataItemId), !this._dataItemSelected && !this.allowEmpty && !this.loading)) {
+      for (const e of this.datasetsDataItems)
+        if (e?.columns?.length > 0) {
+          this._dataItemSelected = e.columns[0];
           break;
-        } else if (((a = m == null ? void 0 : m.formulas) == null ? void 0 : a.length) > 0) {
-          this._dataItemSelected = m.formulas[0];
+        } else if (e?.formulas?.length > 0) {
+          this._dataItemSelected = e.formulas[0];
           break;
         }
-      this.dataItemId = (r = this._dataItemSelected) == null ? void 0 : r.id, this._sendChangeEvent();
+      this.dataItemId = this._dataItemSelected?.id, this._sendChangeEvent();
     }
   }
   render() {
-    let l = f``;
-    for (const e of this.datasetsDataItems ?? []) {
-      const t = (e == null ? void 0 : e.columns) ?? [], a = (e == null ? void 0 : e.formulas) ?? [], r = (c) => {
-        const h = f`
+    let t = d``;
+    for (const a of this.datasetsDataItems ?? []) {
+      const e = a?.columns ?? [], r = a?.formulas ?? [], i = (c) => {
+        const h = d`
           <luzmo-icon
             slot="icon"
             .size=${this.size}
@@ -119,19 +118,19 @@ let s = class extends b(y, {
           >
           </luzmo-icon>
         `;
-        return f`<luzmo-menu-item value=${c.id}>
+        return d`<luzmo-menu-item value=${c.id}>
           ${this.icons === "none" ? "" : h}
-          ${_((c == null ? void 0 : c.name) ?? {}, this.contentLanguage)}
+          ${_(c?.name ?? {}, this.contentLanguage)}
         </luzmo-menu-item>`;
-      }, m = t.map((c) => r(c)), d = a.map((c) => r(c));
-      l = f`${m} ${d}`;
+      }, f = e.map((c) => i(c)), u = r.map((c) => i(c));
+      t = d`${f} ${u}`;
     }
-    const o = f`${l}`, i = f`
+    const o = d`${t}`, s = d`
       <luzmo-field-label for="data-item" size=${this.size}
         >${this.label ?? z("Select...")}
       </luzmo-field-label>
     `;
-    return f` ${this.hasLabel ? i : ""}
+    return d` ${this.hasLabel ? s : ""}
       <luzmo-picker
         label=${this.placeholder ?? z("Select...")}
         id="data-item"
@@ -147,46 +146,46 @@ let s = class extends b(y, {
       </luzmo-picker>`;
   }
 };
-n([
-  u({ type: String, reflect: !0 })
-], s.prototype, "language", 2);
-n([
-  u({ type: String, attribute: "content-language", reflect: !0 })
-], s.prototype, "contentLanguage", 2);
-n([
-  u({ type: Boolean, attribute: "has-label", reflect: !0 })
-], s.prototype, "hasLabel", 2);
-n([
-  u({ type: String, reflect: !0 })
-], s.prototype, "label", 2);
-n([
-  u({ type: String, reflect: !0 })
-], s.prototype, "icons", 2);
-n([
-  u({ type: Boolean, attribute: "allow-empty", reflect: !0 })
-], s.prototype, "allowEmpty", 2);
-n([
-  u({ type: String, attribute: "placeholder", reflect: !0 })
-], s.prototype, "placeholder", 2);
-n([
-  u({ type: String, attribute: "data-item-id", reflect: !0 })
-], s.prototype, "dataItemId", 2);
-n([
-  u({ type: Boolean, attribute: "loading", reflect: !0 })
-], s.prototype, "loading", 2);
-n([
-  u({ type: Boolean, attribute: "invalid", reflect: !0 })
-], s.prototype, "invalid", 2);
-n([
-  u({ type: Array, reflect: !1 })
-], s.prototype, "datasetsDataItems", 2);
-s = n([
+m([
+  n({ type: String, reflect: !0 })
+], l.prototype, "language", 2);
+m([
+  n({ type: String, attribute: "content-language", reflect: !0 })
+], l.prototype, "contentLanguage", 2);
+m([
+  n({ type: Boolean, attribute: "has-label", reflect: !0 })
+], l.prototype, "hasLabel", 2);
+m([
+  n({ type: String, reflect: !0 })
+], l.prototype, "label", 2);
+m([
+  n({ type: String, reflect: !0 })
+], l.prototype, "icons", 2);
+m([
+  n({ type: Boolean, attribute: "allow-empty", reflect: !0 })
+], l.prototype, "allowEmpty", 2);
+m([
+  n({ type: String, attribute: "placeholder", reflect: !0 })
+], l.prototype, "placeholder", 2);
+m([
+  n({ type: String, attribute: "data-item-id", reflect: !0 })
+], l.prototype, "dataItemId", 2);
+m([
+  n({ type: Boolean, attribute: "loading", reflect: !0 })
+], l.prototype, "loading", 2);
+m([
+  n({ type: Boolean, attribute: "invalid", reflect: !0 })
+], l.prototype, "invalid", 2);
+m([
+  n({ type: Array, reflect: !1 })
+], l.prototype, "datasetsDataItems", 2);
+l = m([
   p()
-], s);
+], l);
 customElements.get("luzmo-filter-data-item-picker") || customElements.define(
   "luzmo-filter-data-item-picker",
-  s
+  l
 );
 export {
-  s as LuzmoFilterDataItemPicker
+  l as LuzmoFilterDataItemPicker
 };

package/components/filter-expression-picker/filter-expression-picker.d.ts

@@ -0,0 +1,74 @@
+import '@luzmo/lucero/field-label';
+import '@luzmo/lucero/menu';
+import '@luzmo/lucero/select';
+import { CSSResultArray, PropertyValues, TemplateResult } from 'lit';
+import { ColumnSubtype, ColumnType } from '@luzmo/dashboard-contents-types';
+import { LuzmoElement } from '@luzmo/lucero/utils';
+declare const LuzmoFilterExpressionPicker_base: typeof LuzmoElement & {
+    new (...args: any[]): import("@luzmo/lucero").SizedElementInterface;
+    prototype: import("@luzmo/lucero").SizedElementInterface;
+};
+/**
+ * @element luzmo-filter-expression-picker
+ */
+export declare class LuzmoFilterExpressionPicker extends LuzmoFilterExpressionPicker_base {
+    static get styles(): CSSResultArray;
+    /**
+     * The language of the settings interface
+     */
+    language: string;
+    /**
+     * The language of the settings interface
+     */
+    filter?: any;
+    /**
+     * Whether the picker has a label
+     */
+    hasLabel: boolean;
+    /**
+     * The label for the picker, if hasLabel is true
+     */
+    label?: string;
+    /**
+     * Allow no selection. If true, the picker will not show a value when no item is selected. Else if no value is provided it will pick the first item.
+     */
+    allowEmpty: boolean;
+    /**
+     * The placeholder text for the picker is no value selected. If allowEmpty is true, this will be used as the label.
+     */
+    placeholder: string;
+    /**
+     * Whether the picker is disabled
+     */
+    disabled: boolean;
+    /**
+     * The type of the column
+     */
+    type?: ColumnType;
+    /**
+     * The subtype of the column
+     */
+    subtype?: ColumnSubtype;
+    /**
+     * Whether the expression is invalid
+     */
+    invalid: boolean;
+    /**
+     * Whether the column is a formula
+     */
+    isFormula: boolean;
+    /**
+     * The rich expression, mainly bc WTD, YTD, MTD, QTD are not valid expressions -> to_date
+     */
+    private _richExpression?;
+    /**
+     * The unit, if WTD, YTD, MTD, QTD
+     */
+    private _unit?;
+    private _expressionConfigurations;
+    private _sendChangeEvent;
+    setExpression(event: CustomEvent): void;
+    protected willUpdate(changedProperties: PropertyValues): void;
+    protected render(): TemplateResult;
+}
+export {};

package/components/filter-expression-picker/index.cjs

@@ -0,0 +1,20 @@
+/*! * A kit of modern Luzmo Web Components for analytics in your web application.
+ * 
+ * Copyright © 2025 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 e=require("../index-BNAmjOkm.cjs");Object.defineProperty(exports,"LuzmoFilterExpressionPicker",{enumerable:!0,get:()=>e.LuzmoFilterExpressionPicker});

package/components/filter-expression-picker/index.d.ts

@@ -0,0 +1,7 @@
+import { LuzmoFilterExpressionPicker } from './filter-expression-picker';
+declare global {
+    interface HTMLElementTagNameMap {
+        'luzmo-filter-expression-picker': LuzmoFilterExpressionPicker;
+    }
+}
+export { LuzmoFilterExpressionPicker } from './filter-expression-picker';

package/components/filter-expression-picker/index.js

@@ -17,7 +17,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-import { L as u } from "../index-D0GBF6tg.js";
+import { L as u } from "../index-DdyZ2g5L.js";
 (function() {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
     const o = document.createElement("style");

package/components/filter-group/filter-group.d.ts

@@ -0,0 +1,26 @@
+import { LuzmoElement } from '@luzmo/lucero/utils';
+import { CSSResultArray, TemplateResult } from 'lit';
+declare const LuzmoFilterGroup_base: typeof LuzmoElement & {
+    new (...args: any[]): import("@luzmo/lucero").SizedElementInterface;
+    prototype: import("@luzmo/lucero").SizedElementInterface;
+};
+/**
+ * @element luzmo-filter-group
+ */
+export declare class LuzmoFilterGroup extends LuzmoFilterGroup_base {
+    static get styles(): CSSResultArray;
+    /**
+     * The language of the settings interface
+     */
+    language: string;
+    /**
+     * The language to use for locale-aware formatting and labels
+     */
+    contentLanguage: string;
+    /**
+     * The filters to display in the group
+     */
+    filters: any[];
+    protected render(): TemplateResult;
+}
+export {};

package/components/filter-group/index.d.ts

@@ -0,0 +1,7 @@
+import { LuzmoFilterGroup } from './filter-group';
+declare global {
+    interface HTMLElementTagNameMap {
+        'luzmo-filter-group': LuzmoFilterGroup;
+    }
+}
+export { LuzmoFilterGroup } from './filter-group';

package/components/filter-item/filter-item.d.ts

@@ -0,0 +1,76 @@
+import { CSSResultArray, PropertyValues, TemplateResult } from 'lit';
+import { LuzmoElement } from '@luzmo/lucero/utils';
+import './../filter-data-item-picker';
+import './../filter-expression-picker';
+import './../filter-value-picker';
+declare const LuzmoFilterItem_base: typeof LuzmoElement & {
+    new (...args: any[]): import("@luzmo/lucero").SizedElementInterface;
+    prototype: import("@luzmo/lucero").SizedElementInterface;
+};
+/**
+ * @element luzmo-filter-item
+ */
+export declare class LuzmoFilterItem extends LuzmoFilterItem_base {
+    static get styles(): CSSResultArray;
+    /**
+     * The API URL of the databroker
+     * @default https://api.luzmo.com
+     * @description The URL of the databroker API
+     */
+    apiUrl?: string;
+    /**
+     * The auth key of the databroker
+     */
+    authKey?: string;
+    /**
+     * The auth token of the databroker
+     */
+    authToken?: string;
+    /**
+     * The cache time of the databroker
+     * @default 30000
+     * @description The time to cache the data in milliseconds
+     */
+    cacheTime?: number;
+    /**
+     * The language of the settings interface
+     */
+    language: string;
+    /**
+     * The language of the content
+     */
+    contentLanguage: string;
+    /**
+     * The time zone to use for the date picker
+     */
+    timeZone?: string;
+    /**
+     * The dataset ids to fetch columns & formulas
+     */
+    datasetIds?: string[];
+    /**
+     * The filter to display
+     */
+    filter: any;
+    private _type?;
+    private _subType?;
+    private _isFormula?;
+    private _error?;
+    private _loading;
+    private _datasetsDataItems;
+    connectedCallback(): void;
+    /**
+     * Fetches hierarchy values from the databroker
+     */
+    private _fetchDatasetDataItems;
+    protected willUpdate(changedProperties: PropertyValues): void;
+    private _sendChangeEvent;
+    private setFilterDataItem;
+    private setFilterExpression;
+    private setFilterValue;
+    protected renderDataItemPicker(): TemplateResult<1>;
+    protected renderExpressionPicker(): TemplateResult<1>;
+    protected renderValuePicker(): TemplateResult<1>;
+    protected render(): TemplateResult;
+}
+export {};

package/components/filter-item/index.cjs

@@ -0,0 +1,52 @@
+/*! * A kit of modern Luzmo Web Components for analytics in your web application.
+ * 
+ * Copyright © 2025 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 m=require("lit"),d=require("@lit/localize"),p=require("@luzmo/lucero/utils"),h=require("../set-locale-BRRalqne.cjs"),c=require("../index-CFL6gmIu.cjs"),a=require("lit/decorators.js"),f=require("../index-BNAmjOkm.cjs");require("../filter-data-item-picker/index.cjs");require("../filter-value-picker/index.cjs");const g=":host{display:flex;flex-direction:row;gap:var(--luzmo-filter-item-gap, var(--filter-item-gap))}:host{--filter-item-gap: var(--luzmo-spacing-3)}:host([size=s]){--filter-item-gap: var(--luzmo-spacing-2)}:host([size=m]){--filter-item-gap: var(--luzmo-spacing-3)}:host([size=l]){--filter-item-gap: calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1))}:host([size=xl]){--filter-item-gap: var(--luzmo-spacing-4)}";var y=Object.defineProperty,I=Object.getOwnPropertyDescriptor,r=(u,t,e,s)=>{for(var i=s>1?void 0:s?I(t,e):t,l=u.length-1,n;l>=0;l--)(n=u[l])&&(i=(s?n(t,e,i):n(i))||i);return s&&i&&y(t,e,i),i};exports.LuzmoFilterItem=class extends p.SizedMixin(p.LuzmoElement,{validSizes:Object.values(p.ElementSizes)}){constructor(){super(...arguments),this.apiUrl="https://api.luzmo.com",this.language="en",this.contentLanguage="en",this.filter={},this._loading=!1,this._datasetsDataItems=[]}static get styles(){return[m.unsafeCSS(g)]}connectedCallback(){super.connectedCallback();const t={};this.apiUrl&&(t.apiUrl=this.apiUrl),this.cacheTime&&(t.staleTime=this.cacheTime,t.gcTime=this.cacheTime*2),this.authKey&&this.authToken&&(t.authKey=this.authKey,t.authToken=this.authToken),c.dataBroker.configure(t)}async _fetchDatasetDataItems(){if(!this.datasetIds||this.datasetIds.length===0){this._error="Missing dataset ids to fetch columns & formulas";return}this._loading=!0,this._error=null;try{const t=await c.dataBroker.fetchDatasetsWithColumnsAndFormulas(this.datasetIds);for(const e of t)for(const s of[...e.columns,...e.formulas])s.id=e.id;this._datasetsDataItems=t}catch(t){console.error("Error fetching dataset columns & formulas:",t),this._error=t instanceof Error?t.message:"Unknown error",this._datasetsDataItems=[]}finally{this._loading=!1}}willUpdate(t){const e=t.has("filter"),s=t.has("language"),i=t.has("datasetIds"),l=t.has("_datasetsDataItems");if(s&&this.language!==h.getLocale()&&([...h.targetLocales].includes(this.language??"en")||this.language==="en")&&h.setLocale(this.language),e||i||l&&this.filter?.parameters?.[0]?.columnId&&(this.filter?.parameters?.[0]?.datasetId||this.filter?.parameters?.[0]?.formulaId)){const n=this._datasetsDataItems.find(o=>o.id===this.filter.parameters?.[0]?.datasetId);if(n){for(const o of[...n.columns||[],...n?.formulas||[]])if(o.id===this.filter.parameters?.[0]?.columnId||o.id===this.filter.parameters?.[0]?.formulaId){this._type=o.type,this._subType=o.subtype,this._isFormula=o.id===this.filter.parameters?.[0]?.formulaId;break}}}i&&this._fetchDatasetDataItems()}_sendChangeEvent(){this.dispatchEvent(new CustomEvent("filter-changed",{bubbles:!0,composed:!0,cancelable:!0,detail:{filter:this.filter}}))}setFilterDataItem(t){const e=this._type,s=this.filter?.parameters?.[0]?.columnId||this.filter?.parameters?.[0]?.formulaId,i=t.detail?.dataItem?.id;this._type=t.detail?.dataItem?.type,this._subType=t.detail?.dataItem?.subtype,this._isFormula=t.detail?.dataItem?.isFormula;const l=f.getValidExpressions(this._type,this._subType,this._isFormula);this.filter=structuredClone(this.filter??{}),l?.includes(this.filter?.expression)||(this.filter.expression=l?.[0]?.expression),this.filter.parameters=this.filter?.parameters??[],this.filter.parameters[0]={datasetId:t.detail?.dataItem?.datasetId},this._isFormula?this.filter.parameters[0].formulaId=t.detail?.dataItem?.id:this.filter.parameters[0].columnId=t.detail?.dataItem?.id,t.detail?.dataItem?.lowestLevel,e!==this._type?this._type==="hierarchy"?(this.filter.expression="? like ?",this.filter.parameters[1]=""):this._type==="numeric"?(this.filter.expression="? > ?",this.filter.parameters[1]=0):this._type==="datetime"?(this.filter.expression="? < ?",this.filter.parameters[1]=new Date().toISOString()):(this.filter.expression="? is not null",this.filter.parameters=[this.filter.parameters[0]]):s!==i&&this._type==="hierarchy"&&(this.filter.parameters[1]=["? in ?","? not in ?"].includes(this.filter.expression)?[]:""),this._sendChangeEvent()}setFilterExpression(t){const e=structuredClone(this.filter??{}),s=e.expression;if(e.expression=t.detail?.expression,s!==e.expression){if(["? is null","? is not null"].includes(e.expression))e.parameters=[e.parameters[0]];else if(this._type==="datetime")if(["YTD","QTD","MTD","WTD"].includes(e.expression)){const i=t?.detail?.unit;i&&(e.parameters[1]={unit:typeof i=="number"?i:1})}else if(["last_completed","next_full","to_date"].includes(e.expression)){const i=e?.parameters?.[1]?.unit;e.parameters[1]={unit:typeof i=="number"?i:1}}else if(["last_now","last_available","next_now"].includes(e.expression)){const i=e?.parameters?.[1]?.unit,l=e?.parameters?.[1]?.quantity;e.parameters[1]={unit:typeof i=="number"?i:1,quantity:typeof l=="number"?l:1}}else e.parameters[1]=new Date().toISOString();else this._type==="hierarchy"?["? in ?","? not in ?"].includes(e.expression)?["? = ?","? != ?"].includes(s)?e.parameters[1]=e.parameters[1]?[e.parameters[1]]:[]:e.parameters[1]=[]:["? = ?","? != ?"].includes(e.expression)?["? in ?","? not in ?"].includes(s)?e.parameters[1]=Array.isArray(e.parameters[1])&&e.parameters[1][0]?e.parameters[1][0]:"":e.parameters[1]="":e.parameters[1]=["? in ?","? not in ?"].includes(s)?"":e.parameters[1]??"":this._type==="numeric"&&(["? in ?","? not in ?"].includes(e.expression)&&["? in ?","? not in ?"].includes(s)?e.parameters[1]=e.parameters[1]??[]:["? in ?","? not in ?"].includes(e.expression)?e.parameters[1]=[]:e.parameters[1]=["? in ?","? not in ?"].includes(s)?0:e.parameters[1]??0);this.filter=e,this._sendChangeEvent()}}setFilterValue(t){this.filter.parameters[1]=t?.detail?.value,this._sendChangeEvent()}renderDataItemPicker(){return m.html`<luzmo-filter-data-item-picker
+      .language=${this.language}
+      .contentLanguage=${this.contentLanguage}
+      .size=${this.size}
+      .dataItemId=${this._loading?"":this.filter?.parameters?.[0]?.columnId||this.filter?.parameters?.[0]?.formulaId}
+      .datasetsDataItems=${this._datasetsDataItems}
+      .invalid=${!!this._error}
+      .loading=${this._loading}
+      @data-item-selected=${this.setFilterDataItem}
+    ></luzmo-filter-data-item-picker>`}renderExpressionPicker(){const t=!this.filter?.parameters?.[0]?.datasetId||!this.filter?.parameters?.[0]?.columnId;return m.html`<luzmo-filter-expression-picker
+      .language=${this.language}
+      .size=${this.size}
+      .type=${this._type}
+      .subtype=${this._subType}
+      .filter=${this.filter}
+      ?isFormula=${this._isFormula}
+      ?disabled=${t}
+      @expression-selected=${this.setFilterExpression}
+    ></luzmo-filter-expression-picker>`}renderValuePicker(){const t=!this.filter?.parameters?.[0]?.datasetId||!this.filter?.parameters?.[0]?.columnId;return m.html`<luzmo-filter-value-picker
+      .apiUrl=${this.apiUrl}
+      .authKey=${this.authKey}
+      .authToken=${this.authToken}
+      .cacheTime=${this.cacheTime}
+      .language=${this.language}
+      .contentLanguage=${this.contentLanguage}
+      .timeZone=${this.timeZone}
+      .size=${this.size}
+      .filter=${this.filter}
+      .valueType=${this._type}
+      ?disabled=${t}
+      @filter-value-changed=${this.setFilterValue}
+    ></luzmo-filter-value-picker>`}render(){return m.html`${this.renderDataItemPicker()} ${this.renderExpressionPicker()}
+    ${this.renderValuePicker()}`}};r([a.property({type:String,attribute:"api-url",reflect:!0})],exports.LuzmoFilterItem.prototype,"apiUrl",2);r([a.property({type:String,attribute:"auth-key",reflect:!0})],exports.LuzmoFilterItem.prototype,"authKey",2);r([a.property({type:String,attribute:"auth-token",reflect:!0})],exports.LuzmoFilterItem.prototype,"authToken",2);r([a.property({type:Number,attribute:"cache-time",reflect:!0})],exports.LuzmoFilterItem.prototype,"cacheTime",2);r([a.property({type:String,reflect:!0})],exports.LuzmoFilterItem.prototype,"language",2);r([a.property({type:String,reflect:!0})],exports.LuzmoFilterItem.prototype,"contentLanguage",2);r([a.property({type:String,attribute:"time-zone",reflect:!0})],exports.LuzmoFilterItem.prototype,"timeZone",2);r([a.property({type:Array,attribute:"dataset-ids",reflect:!0})],exports.LuzmoFilterItem.prototype,"datasetIds",2);r([a.property({type:Object,reflect:!1})],exports.LuzmoFilterItem.prototype,"filter",2);r([a.state()],exports.LuzmoFilterItem.prototype,"_type",2);r([a.state()],exports.LuzmoFilterItem.prototype,"_subType",2);r([a.state()],exports.LuzmoFilterItem.prototype,"_isFormula",2);r([a.state()],exports.LuzmoFilterItem.prototype,"_error",2);r([a.state()],exports.LuzmoFilterItem.prototype,"_loading",2);r([a.state()],exports.LuzmoFilterItem.prototype,"_datasetsDataItems",2);exports.LuzmoFilterItem=r([d.localized()],exports.LuzmoFilterItem);customElements.get("luzmo-filter-item")||customElements.define("luzmo-filter-item",exports.LuzmoFilterItem);

package/components/filter-item/index.d.ts

@@ -0,0 +1,7 @@
+import { LuzmoFilterItem } from './filter-item';
+declare global {
+    interface HTMLElementTagNameMap {
+        'luzmo-filter-item': LuzmoFilterItem;
+    }
+}
+export { LuzmoFilterItem } from './filter-item';