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

package/index.d.ts

@@ -29,7 +29,7 @@ export * from './components/edit-option-radio-button-group';
 export * from './components/edit-option-slider';
 export * from './components/edit-option-switch';
 export * from './components/edit-option-text-field';
-export * from './components/filter-data-item-picker';
+export * from './components/data-items-select';
 export * from './components/filter-expression-picker';
 export * from './components/filter-item';
 export * from './components/filter-value-picker';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@luzmo/analytics-components-kit",
-  "version": "1.0.1-alpha.97",
+  "version": "1.0.1-alpha.99",
   "type": "module",
   "main": "./components/index.js",
   "module": "./components/index.js",
@@ -31,6 +31,11 @@
       "import": "./components/ai-interaction-textarea/index.js",
       "require": "./components/ai-interaction-textarea/index.cjs"
     },
+    "./data-items-select": {
+      "types": "./components/data-items-select/index.d.ts",
+      "import": "./components/data-items-select/index.js",
+      "require": "./components/data-items-select/index.cjs"
+    },
     "./dataset-icon": {
       "types": "./components/dataset-icon/index.d.ts",
       "import": "./components/dataset-icon/index.js",
@@ -91,6 +96,11 @@
       "import": "./components/droppable-slot/index.js",
       "require": "./components/droppable-slot/index.cjs"
     },
+    "./edit-filters": {
+      "types": "./components/edit-filters/index.d.ts",
+      "import": "./components/edit-filters/index.js",
+      "require": "./components/edit-filters/index.cjs"
+    },
     "./edit-item": {
       "types": "./components/edit-item/index.d.ts",
       "import": "./components/edit-item/index.js",
@@ -166,21 +176,11 @@
       "import": "./components/edit-option-text-field/index.js",
       "require": "./components/edit-option-text-field/index.cjs"
     },
-    "./filter-data-item-picker": {
-      "types": "./components/filter-data-item-picker/index.d.ts",
-      "import": "./components/filter-data-item-picker/index.js",
-      "require": "./components/filter-data-item-picker/index.cjs"
-    },
     "./filter-expression-picker": {
       "types": "./components/filter-expression-picker/index.d.ts",
       "import": "./components/filter-expression-picker/index.js",
       "require": "./components/filter-expression-picker/index.cjs"
     },
-    "./filter-group": {
-      "types": "./components/filter-group/index.d.ts",
-      "import": "./components/filter-group/index.js",
-      "require": "./components/filter-group/index.cjs"
-    },
     "./filter-item": {
       "types": "./components/filter-item/index.d.ts",
       "import": "./components/filter-item/index.js",
@@ -288,7 +288,7 @@
     "@lit/localize": "^0.12.2",
     "@lit/task": "^1.0.1",
     "@luzmo/icons": "^1.0.1-alpha.25",
-    "@luzmo/lucero": "^1.0.1-alpha.38",
+    "@luzmo/lucero": "^1.0.1-alpha.40",
     "colorjs.io": "^0.5.2",
     "lit": "^3.3.1"
   },

package/types.d.ts

@@ -10,6 +10,7 @@ import { TemplateResult } from 'lit';
 export type { Column, ColumnSubtype, ColumnType, GenericSlotContent, SlotName, VizItemSlots, VizItemType } from '@luzmo/dashboard-contents-types';
 export type { DraggableDataItemData } from './components/draggable-data-item';
 export type { DroppableSlotConfiguration, SlotContentsChangedEventDetail } from './components/droppable-slot';
+export type { FilterCondition, FilterGroup } from './components/edit-filters/types';
 export type { MeasureColumnsItem, SlotContentChangedEventDetail, SlotListChangedEventDetail, SlotMenuActiveEventDetail, SlotMenuHighlightEventDetail } from './components/slot-menu';
 export declare enum PeriodOverPeriodCondition {
     HasDatetimeColumnAndNoComparisonFilters = "hasDatetimeColumnAndNoComparisonFilters",
@@ -113,3 +114,11 @@ export interface Dataset {
  * Viz item menu button types that can be selected
  */
 export type VizItemMenuButton = 'clone' | 'edit' | 'delete';
+export type DataItemExtended = DataItem & {
+    [key: string]: unknown;
+};
+export type DataItemSelected = DataItemExtended & {
+    datasetId: string;
+    columnId?: string;
+    formulaId?: string;
+} & Omit<DataItemExtended, 'id'>;

package/utils/filters/expressions.d.ts

@@ -10,6 +10,6 @@ export type FilterExpressionConfiguration = {
     type: ColumnType[];
     subtype?: ColumnSubtype[];
 };
-export type FilterExpressionKey = '? = ?' | '? != ?' | '? in ?' | '? not in ?' | '? like ?' | '? not like ?' | '? starts with ?' | '? not starts with ?' | '? ends with ?' | '? not ends with ?' | '? < ?' | '? <= ?' | '? > ?' | '? >= ?' | '? between ?' | 'last_now' | 'last_available' | 'last_completed' | 'next_now' | 'next_full' | 'to_date' | '? is null' | '? is not null';
+export type FilterExpressionKey = '? = ?' | '? != ?' | '? in ?' | '? not in ?' | '? like ?' | '? not like ?' | '? starts with ?' | '? not starts with ?' | '? ends with ?' | '? not ends with ?' | '? < ?' | '? <= ?' | '? > ?' | '? >= ?' | '? between ?' | 'last_now' | 'last_available' | 'last_completed' | 'next_now' | 'more_than_ago' | 'or_more_ago' | 'next_full' | 'to_date' | '? is null' | '? is not null';
 export declare const filterExpressionsConfigurations: () => FilterExpressionConfiguration[];
 export declare const getValidExpressions: (type?: ColumnType, subtype?: ColumnSubtype, isFormula?: boolean) => FilterExpressionConfiguration[];

package/angular/components/filter-group.component.ts

@@ -1,29 +0,0 @@
-import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy } from '@angular/core';
-
-
-@Component({
-  selector: 'luzmo-filter-group',
-  standalone: true,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  template: `<luzmo-filter-group
-        [attr.language]="language"
-        [attr.content-language]="contentLanguage"
-        [attr.filters]="filters"
-        [attr.size]="size"
-        [attr.disabled]="disabled"
-        [attr.autofocus]="autofocus"
-        [attr.tabIndex]="tabIndex"
->
-  <ng-content></ng-content>
-</luzmo-filter-group>`
-})
-export class FilterGroupComponent {
-  @Input() language?: string;
-  @Input() contentLanguage?: string;
-  @Input() filters?: any[];
-  @Input() size?: any;
-  @Input() disabled?: any;
-  @Input() autofocus?: any;
-  @Input() tabIndex?: any;
-
-}

package/angular/esm/components/filter-data-item-picker.component.d.ts

@@ -1,30 +0,0 @@
-import { EventEmitter } from '@angular/core';
-import type { DataItem } from '../types';
-import * as i0 from "@angular/core";
-export declare class FilterDataItemPickerComponent {
-    language?: string;
-    contentLanguage?: string;
-    hasLabel?: boolean;
-    label?: string;
-    icons?: 'none' | 'only-menu' | 'all';
-    allowEmpty?: boolean;
-    placeholder?: string;
-    dataItemId?: string;
-    loading?: boolean;
-    invalid?: boolean;
-    datasetsDataItems?: {
-        id: string;
-        name: {
-            [key: string]: string;
-        };
-        columns: DataItem[];
-        formulas: DataItem[];
-    }[];
-    size?: any;
-    disabled?: any;
-    autofocus?: any;
-    tabIndex?: any;
-    dataItemSelected: EventEmitter<CustomEvent<any>>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<FilterDataItemPickerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<FilterDataItemPickerComponent, "luzmo-filter-data-item-picker", never, { "language": { "alias": "language"; "required": false; }; "contentLanguage": { "alias": "contentLanguage"; "required": false; }; "hasLabel": { "alias": "hasLabel"; "required": false; }; "label": { "alias": "label"; "required": false; }; "icons": { "alias": "icons"; "required": false; }; "allowEmpty": { "alias": "allowEmpty"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "dataItemId": { "alias": "dataItemId"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "datasetsDataItems": { "alias": "datasetsDataItems"; "required": false; }; "size": { "alias": "size"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "autofocus": { "alias": "autofocus"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; }, { "dataItemSelected": "dataItemSelected"; }, never, ["*"], true, never>;
-}

package/angular/esm/components/filter-group.component.d.ts

@@ -1,12 +0,0 @@
-import * as i0 from "@angular/core";
-export declare class FilterGroupComponent {
-    language?: string;
-    contentLanguage?: string;
-    filters?: any[];
-    size?: any;
-    disabled?: any;
-    autofocus?: any;
-    tabIndex?: any;
-    static ɵfac: i0.ɵɵFactoryDeclaration<FilterGroupComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<FilterGroupComponent, "luzmo-filter-group", never, { "language": { "alias": "language"; "required": false; }; "contentLanguage": { "alias": "contentLanguage"; "required": false; }; "filters": { "alias": "filters"; "required": false; }; "size": { "alias": "size"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "autofocus": { "alias": "autofocus"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; }, {}, never, ["*"], true, never>;
-}

package/angular/esm/components/filter-group.component.js

@@ -1,56 +0,0 @@
-import { Component, Input, ChangeDetectionStrategy } from '@angular/core';
-import * as i0 from "@angular/core";
-export class FilterGroupComponent {
-    language;
-    contentLanguage;
-    filters;
-    size;
-    disabled;
-    autofocus;
-    tabIndex;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: FilterGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.3", type: FilterGroupComponent, isStandalone: true, selector: "luzmo-filter-group", inputs: { language: "language", contentLanguage: "contentLanguage", filters: "filters", size: "size", disabled: "disabled", autofocus: "autofocus", tabIndex: "tabIndex" }, ngImport: i0, template: `<luzmo-filter-group
-        [attr.language]="language"
-        [attr.content-language]="contentLanguage"
-        [attr.filters]="filters"
-        [attr.size]="size"
-        [attr.disabled]="disabled"
-        [attr.autofocus]="autofocus"
-        [attr.tabIndex]="tabIndex"
->
-  <ng-content></ng-content>
-</luzmo-filter-group>`, isInline: true, dependencies: [{ kind: "component", type: FilterGroupComponent, selector: "luzmo-filter-group", inputs: ["language", "contentLanguage", "filters", "size", "disabled", "autofocus", "tabIndex"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: FilterGroupComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'luzmo-filter-group',
-                    standalone: true,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    template: `<luzmo-filter-group
-        [attr.language]="language"
-        [attr.content-language]="contentLanguage"
-        [attr.filters]="filters"
-        [attr.size]="size"
-        [attr.disabled]="disabled"
-        [attr.autofocus]="autofocus"
-        [attr.tabIndex]="tabIndex"
->
-  <ng-content></ng-content>
-</luzmo-filter-group>`
-                }]
-        }], propDecorators: { language: [{
-                type: Input
-            }], contentLanguage: [{
-                type: Input
-            }], filters: [{
-                type: Input
-            }], size: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], autofocus: [{
-                type: Input
-            }], tabIndex: [{
-                type: Input
-            }] } });

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

@@ -1,47 +0,0 @@
-/*! * 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

@@ -1,7 +0,0 @@
-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-group/filter-group.d.ts

@@ -1,26 +0,0 @@
-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

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