@luzmo/analytics-components-kit 1.2.1 → 1.4.0

package/angular/esm/components/item-option-positions-number-field.js

@@ -15,10 +15,6 @@ export class LuzmoItemOptionPositionsNumberField {
     get nativeElement() {
         return this.host;
     }
-    /** The value applied to all positions when sync is enabled. */
-    syncedValue;
-    /** Internal timer handle used to debounce change events. */
-    debounceTimeout;
     /** Which positions to render input fields for (e.g. top/right/bottom/left, or corners and center). */
     positions;
     /** The current numeric value for each position. */
@@ -35,6 +31,10 @@ export class LuzmoItemOptionPositionsNumberField {
     debounce;
     /** Whether all positions are currently synced to a single value. */
     sync;
+    /** The value applied to all positions when sync is enabled. */
+    syncedValue;
+    /** Internal timer handle used to debounce change events. */
+    debounceTimeout;
     /** Emitted when the option value changes. */
     luzmoOptionChanged = output({ alias: 'luzmoOptionChanged' });
     constructor() {
@@ -48,12 +48,6 @@ export class LuzmoItemOptionPositionsNumberField {
     ngOnChanges(changes) {
         for (const key of Object.keys(changes)) {
             switch (key) {
-                case 'syncedValue':
-                    this.setHostProperty('syncedValue', changes['syncedValue'].currentValue);
-                    break;
-                case 'debounceTimeout':
-                    this.setHostProperty('debounceTimeout', changes['debounceTimeout'].currentValue);
-                    break;
                 case 'positions':
                     this.setHostProperty('positions', changes['positions'].currentValue);
                     break;
@@ -78,6 +72,12 @@ export class LuzmoItemOptionPositionsNumberField {
                 case 'sync':
                     this.setHostProperty('sync', changes['sync'].currentValue);
                     break;
+                case 'syncedValue':
+                    this.setHostProperty('syncedValue', changes['syncedValue'].currentValue);
+                    break;
+                case 'debounceTimeout':
+                    this.setHostProperty('debounceTimeout', changes['debounceTimeout'].currentValue);
+                    break;
                 default:
                     break;
             }
@@ -99,7 +99,7 @@ export class LuzmoItemOptionPositionsNumberField {
         }));
     }
     static ɵfac = function LuzmoItemOptionPositionsNumberField_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoItemOptionPositionsNumberField)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoItemOptionPositionsNumberField, selectors: [["luzmo-item-option-positions-number-field"]], inputs: { syncedValue: "syncedValue", debounceTimeout: "debounceTimeout", positions: "positions", values: "values", canSync: [2, "canSync", "canSync", booleanAttribute], positionConfiguration: "positionConfiguration", invalid: [2, "invalid", "invalid", booleanAttribute], readonly: [2, "readonly", "readonly", booleanAttribute], debounce: "debounce", sync: [2, "sync", "sync", booleanAttribute] }, outputs: { luzmoOptionChanged: "luzmoOptionChanged" }, exportAs: ["luzmoItemOptionPositionsNumberField"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoItemOptionPositionsNumberField_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoItemOptionPositionsNumberField, selectors: [["luzmo-item-option-positions-number-field"]], inputs: { positions: "positions", values: "values", canSync: [2, "canSync", "canSync", booleanAttribute], positionConfiguration: "positionConfiguration", invalid: [2, "invalid", "invalid", booleanAttribute], readonly: [2, "readonly", "readonly", booleanAttribute], debounce: "debounce", sync: [2, "sync", "sync", booleanAttribute], syncedValue: "syncedValue", debounceTimeout: "debounceTimeout" }, outputs: { luzmoOptionChanged: "luzmoOptionChanged" }, exportAs: ["luzmoItemOptionPositionsNumberField"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoItemOptionPositionsNumberField_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵprojection(0);
         } }, encapsulation: 2 });
@@ -113,13 +113,7 @@ export class LuzmoItemOptionPositionsNumberField {
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 template: '<ng-content />'
             }]
-    }], () => [], { syncedValue: [{
-            type: Input,
-            args: [{ alias: 'syncedValue' }]
-        }], debounceTimeout: [{
-            type: Input,
-            args: [{ alias: 'debounceTimeout' }]
-        }], positions: [{
+    }], () => [], { positions: [{
             type: Input,
             args: [{ alias: 'positions' }]
         }], values: [{
@@ -143,5 +137,11 @@ export class LuzmoItemOptionPositionsNumberField {
         }], sync: [{
             type: Input,
             args: [{ alias: 'sync', transform: booleanAttribute }]
+        }], syncedValue: [{
+            type: Input,
+            args: [{ alias: 'syncedValue' }]
+        }], debounceTimeout: [{
+            type: Input,
+            args: [{ alias: 'debounceTimeout' }]
         }], luzmoOptionChanged: [{ type: i0.Output, args: ["luzmoOptionChanged"] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoItemOptionPositionsNumberField, { className: "LuzmoItemOptionPositionsNumberField", filePath: "components/item-option-positions-number-field.ts", lineNumber: 16 }); })();

package/angular/esm/components/item-option-radio-button-group.d.ts

@@ -11,8 +11,6 @@ export declare class LuzmoItemOptionRadioButtonGroup implements OnChanges {
     private readonly listenerCleanup;
     /** The underlying custom element instance. Use to call imperative methods. */
     get nativeElement(): LuzmoItemOptionRadioButtonGroupHostElement;
-    /** Internal timer handle used to debounce change events. */
-    debounceTimeout?: any;
     /** The available options to choose from (key → label). */
     values?: Record<string, string>;
     /** Whether the control is disabled (non-interactive). */
@@ -25,6 +23,8 @@ export declare class LuzmoItemOptionRadioButtonGroup implements OnChanges {
     parseValue?: unknown;
     /** Optional transform applied to the control's value before it is emitted in the change event. */
     toValue?: unknown;
+    /** Internal timer handle used to debounce change events. */
+    debounceTimeout?: any;
     /** Emitted when the option value changes. */
     readonly luzmoOptionChanged: import("@angular/core").OutputEmitterRef<CustomEvent<ItemOptionChangedEventDetail>>;
     constructor();
@@ -38,7 +38,7 @@ export declare class LuzmoItemOptionRadioButtonGroup implements OnChanges {
     private setHostProperty;
     private bindEvents;
     static ɵfac: i0.ɵɵFactoryDeclaration<LuzmoItemOptionRadioButtonGroup, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoItemOptionRadioButtonGroup, "luzmo-item-option-radio-button-group", ["luzmoItemOptionRadioButtonGroup"], { "debounceTimeout": { "alias": "debounceTimeout"; "required": false; }; "values": { "alias": "values"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; "default": { "alias": "default"; "required": false; }; "parseValue": { "alias": "parseValue"; "required": false; }; "toValue": { "alias": "toValue"; "required": false; }; }, { "luzmoOptionChanged": "luzmoOptionChanged"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoItemOptionRadioButtonGroup, "luzmo-item-option-radio-button-group", ["luzmoItemOptionRadioButtonGroup"], { "values": { "alias": "values"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; "default": { "alias": "default"; "required": false; }; "parseValue": { "alias": "parseValue"; "required": false; }; "toValue": { "alias": "toValue"; "required": false; }; "debounceTimeout": { "alias": "debounceTimeout"; "required": false; }; }, { "luzmoOptionChanged": "luzmoOptionChanged"; }, never, ["*"], true, never>;
     static ngAcceptInputType_disabled: unknown;
 }
 /** The underlying custom element type for LuzmoItemOptionRadioButtonGroup */

package/angular/esm/components/item-option-radio-button-group.js

@@ -15,8 +15,6 @@ export class LuzmoItemOptionRadioButtonGroup {
     get nativeElement() {
         return this.host;
     }
-    /** Internal timer handle used to debounce change events. */
-    debounceTimeout;
     /** The available options to choose from (key → label). */
     values;
     /** Whether the control is disabled (non-interactive). */
@@ -29,6 +27,8 @@ export class LuzmoItemOptionRadioButtonGroup {
     parseValue;
     /** Optional transform applied to the control's value before it is emitted in the change event. */
     toValue;
+    /** Internal timer handle used to debounce change events. */
+    debounceTimeout;
     /** Emitted when the option value changes. */
     luzmoOptionChanged = output({ alias: 'luzmoOptionChanged' });
     constructor() {
@@ -42,9 +42,6 @@ export class LuzmoItemOptionRadioButtonGroup {
     ngOnChanges(changes) {
         for (const key of Object.keys(changes)) {
             switch (key) {
-                case 'debounceTimeout':
-                    this.setHostProperty('debounceTimeout', changes['debounceTimeout'].currentValue);
-                    break;
                 case 'values':
                     this.setHostProperty('values', changes['values'].currentValue);
                     break;
@@ -63,6 +60,9 @@ export class LuzmoItemOptionRadioButtonGroup {
                 case 'toValue':
                     this.setHostProperty('toValue', changes['toValue'].currentValue);
                     break;
+                case 'debounceTimeout':
+                    this.setHostProperty('debounceTimeout', changes['debounceTimeout'].currentValue);
+                    break;
                 default:
                     break;
             }
@@ -84,7 +84,7 @@ export class LuzmoItemOptionRadioButtonGroup {
         }));
     }
     static ɵfac = function LuzmoItemOptionRadioButtonGroup_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoItemOptionRadioButtonGroup)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoItemOptionRadioButtonGroup, selectors: [["luzmo-item-option-radio-button-group"]], inputs: { debounceTimeout: "debounceTimeout", values: "values", disabled: [2, "disabled", "disabled", booleanAttribute], value: "value", default: "default", parseValue: "parseValue", toValue: "toValue" }, outputs: { luzmoOptionChanged: "luzmoOptionChanged" }, exportAs: ["luzmoItemOptionRadioButtonGroup"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoItemOptionRadioButtonGroup_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoItemOptionRadioButtonGroup, selectors: [["luzmo-item-option-radio-button-group"]], inputs: { values: "values", disabled: [2, "disabled", "disabled", booleanAttribute], value: "value", default: "default", parseValue: "parseValue", toValue: "toValue", debounceTimeout: "debounceTimeout" }, outputs: { luzmoOptionChanged: "luzmoOptionChanged" }, exportAs: ["luzmoItemOptionRadioButtonGroup"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoItemOptionRadioButtonGroup_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵprojection(0);
         } }, encapsulation: 2 });
@@ -98,10 +98,7 @@ export class LuzmoItemOptionRadioButtonGroup {
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 template: '<ng-content />'
             }]
-    }], () => [], { debounceTimeout: [{
-            type: Input,
-            args: [{ alias: 'debounceTimeout' }]
-        }], values: [{
+    }], () => [], { values: [{
             type: Input,
             args: [{ alias: 'values' }]
         }], disabled: [{
@@ -119,5 +116,8 @@ export class LuzmoItemOptionRadioButtonGroup {
         }], toValue: [{
             type: Input,
             args: [{ alias: 'toValue' }]
+        }], debounceTimeout: [{
+            type: Input,
+            args: [{ alias: 'debounceTimeout' }]
         }], luzmoOptionChanged: [{ type: i0.Output, args: ["luzmoOptionChanged"] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoItemOptionRadioButtonGroup, { className: "LuzmoItemOptionRadioButtonGroup", filePath: "components/item-option-radio-button-group.ts", lineNumber: 16 }); })();

package/angular/esm/components/item-option-text-field.d.ts

@@ -11,8 +11,6 @@ export declare class LuzmoItemOptionTextField implements OnChanges {
     private readonly listenerCleanup;
     /** The underlying custom element instance. Use to call imperative methods. */
     get nativeElement(): LuzmoItemOptionTextFieldHostElement;
-    /** Internal timer handle used to debounce change events. */
-    debounceTimeout?: any;
     /** The current text value. */
     value?: string;
     /** Whether the control is shown in an invalid state. */
@@ -23,6 +21,8 @@ export declare class LuzmoItemOptionTextField implements OnChanges {
     placeholder?: string;
     /** Delay in milliseconds before the change event is emitted after the user stops interacting. */
     debounce?: number;
+    /** Internal timer handle used to debounce change events. */
+    debounceTimeout?: any;
     /** Emitted when the option value changes. */
     readonly luzmoOptionChanged: import("@angular/core").OutputEmitterRef<CustomEvent<ItemOptionChangedEventDetail>>;
     constructor();
@@ -36,7 +36,7 @@ export declare class LuzmoItemOptionTextField implements OnChanges {
     private setHostProperty;
     private bindEvents;
     static ɵfac: i0.ɵɵFactoryDeclaration<LuzmoItemOptionTextField, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoItemOptionTextField, "luzmo-item-option-text-field", ["luzmoItemOptionTextField"], { "debounceTimeout": { "alias": "debounceTimeout"; "required": false; }; "value": { "alias": "value"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "debounce": { "alias": "debounce"; "required": false; }; }, { "luzmoOptionChanged": "luzmoOptionChanged"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoItemOptionTextField, "luzmo-item-option-text-field", ["luzmoItemOptionTextField"], { "value": { "alias": "value"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "debounce": { "alias": "debounce"; "required": false; }; "debounceTimeout": { "alias": "debounceTimeout"; "required": false; }; }, { "luzmoOptionChanged": "luzmoOptionChanged"; }, never, ["*"], true, never>;
     static ngAcceptInputType_invalid: unknown;
     static ngAcceptInputType_readonly: unknown;
 }

package/angular/esm/components/item-option-text-field.js

@@ -15,8 +15,6 @@ export class LuzmoItemOptionTextField {
     get nativeElement() {
         return this.host;
     }
-    /** Internal timer handle used to debounce change events. */
-    debounceTimeout;
     /** The current text value. */
     value;
     /** Whether the control is shown in an invalid state. */
@@ -27,6 +25,8 @@ export class LuzmoItemOptionTextField {
     placeholder;
     /** Delay in milliseconds before the change event is emitted after the user stops interacting. */
     debounce;
+    /** Internal timer handle used to debounce change events. */
+    debounceTimeout;
     /** Emitted when the option value changes. */
     luzmoOptionChanged = output({ alias: 'luzmoOptionChanged' });
     constructor() {
@@ -40,9 +40,6 @@ export class LuzmoItemOptionTextField {
     ngOnChanges(changes) {
         for (const key of Object.keys(changes)) {
             switch (key) {
-                case 'debounceTimeout':
-                    this.setHostProperty('debounceTimeout', changes['debounceTimeout'].currentValue);
-                    break;
                 case 'value':
                     this.setHostProperty('value', changes['value'].currentValue);
                     break;
@@ -58,6 +55,9 @@ export class LuzmoItemOptionTextField {
                 case 'debounce':
                     this.setHostProperty('debounce', changes['debounce'].currentValue);
                     break;
+                case 'debounceTimeout':
+                    this.setHostProperty('debounceTimeout', changes['debounceTimeout'].currentValue);
+                    break;
                 default:
                     break;
             }
@@ -79,7 +79,7 @@ export class LuzmoItemOptionTextField {
         }));
     }
     static ɵfac = function LuzmoItemOptionTextField_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoItemOptionTextField)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoItemOptionTextField, selectors: [["luzmo-item-option-text-field"]], inputs: { debounceTimeout: "debounceTimeout", value: "value", invalid: [2, "invalid", "invalid", booleanAttribute], readonly: [2, "readonly", "readonly", booleanAttribute], placeholder: "placeholder", debounce: "debounce" }, outputs: { luzmoOptionChanged: "luzmoOptionChanged" }, exportAs: ["luzmoItemOptionTextField"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoItemOptionTextField_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoItemOptionTextField, selectors: [["luzmo-item-option-text-field"]], inputs: { value: "value", invalid: [2, "invalid", "invalid", booleanAttribute], readonly: [2, "readonly", "readonly", booleanAttribute], placeholder: "placeholder", debounce: "debounce", debounceTimeout: "debounceTimeout" }, outputs: { luzmoOptionChanged: "luzmoOptionChanged" }, exportAs: ["luzmoItemOptionTextField"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoItemOptionTextField_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵprojection(0);
         } }, encapsulation: 2 });
@@ -93,10 +93,7 @@ export class LuzmoItemOptionTextField {
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 template: '<ng-content />'
             }]
-    }], () => [], { debounceTimeout: [{
-            type: Input,
-            args: [{ alias: 'debounceTimeout' }]
-        }], value: [{
+    }], () => [], { value: [{
             type: Input,
             args: [{ alias: 'value' }]
         }], invalid: [{
@@ -111,5 +108,8 @@ export class LuzmoItemOptionTextField {
         }], debounce: [{
             type: Input,
             args: [{ alias: 'debounce' }]
+        }], debounceTimeout: [{
+            type: Input,
+            args: [{ alias: 'debounceTimeout' }]
         }], luzmoOptionChanged: [{ type: i0.Output, args: ["luzmoOptionChanged"] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoItemOptionTextField, { className: "LuzmoItemOptionTextField", filePath: "components/item-option-text-field.ts", lineNumber: 16 }); })();

package/angular/esm/components/item-slot-picker-panel.d.ts

@@ -34,7 +34,7 @@ export declare class LuzmoItemSlotPickerPanel implements OnChanges {
     datasetsDataFields?: Array<DatasetsDataFields & Pick<DatasetMetadata, 'description'>>;
     /** Array of dataset IDs to fetch and display. Used as an alternative to datasetsDataFields - when provided (and datasetsDataFields is empty), the component will fetch the dataset metadata automatically. Requires apiUrl, authKey, and authToken to be set. */
     datasetIds?: string[];
-    /** The currently selected dataset ID. If not provided, defaults to the first available dataset. */
+    /** The currently selected dataset ID. If not provided, defaults to the first available dataset, except when the panel fetches the dataset list itself. */
     selectedDatasetId?: string;
     /** Whether to show the dataset picker dropdown. */
     datasetPicker?: boolean;

package/angular/esm/components/item-slot-picker-panel.js

@@ -35,7 +35,7 @@ export class LuzmoItemSlotPickerPanel {
     datasetsDataFields;
     /** Array of dataset IDs to fetch and display. Used as an alternative to datasetsDataFields - when provided (and datasetsDataFields is empty), the component will fetch the dataset metadata automatically. Requires apiUrl, authKey, and authToken to be set. */
     datasetIds;
-    /** The currently selected dataset ID. If not provided, defaults to the first available dataset. */
+    /** The currently selected dataset ID. If not provided, defaults to the first available dataset, except when the panel fetches the dataset list itself. */
     selectedDatasetId;
     /** Whether to show the dataset picker dropdown. */
     datasetPicker;

package/angular/esm/components/item-slot-picker.d.ts

@@ -42,6 +42,8 @@ export declare class LuzmoItemSlotPicker implements OnChanges {
     label?: string;
     /** Whether the picker allows single or multiple selections. Only relevant if the slot configuration allows multiple data fields. */
     selects?: 'single' | 'multiple';
+    /** Whether the search input is visible: `on`, `off`, or `auto`. */
+    search?: 'on' | 'off' | 'auto';
     /** Where to show icons */
     icons?: 'none' | 'menu-only' | 'all';
     /** The placeholder text for the picker is no value selected. */
@@ -60,8 +62,6 @@ export declare class LuzmoItemSlotPicker implements OnChanges {
     hideClear?: boolean;
     /** The language for UI labels. Supported values: 'en', 'nl', 'fr', 'de', 'es' */
     language?: string;
-    /** Whether the search input is visible: `on`, `off`, or `auto`. */
-    search?: 'on' | 'off' | 'auto';
     /** The size of the element */
     size?: 's' | 'm' | 'l' | 'xl';
     /** Announces that the slot contents has changed */
@@ -77,7 +77,7 @@ export declare class LuzmoItemSlotPicker implements OnChanges {
     private setHostProperty;
     private bindEvents;
     static ɵfac: i0.ɵɵFactoryDeclaration<LuzmoItemSlotPicker, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoItemSlotPicker, "luzmo-item-slot-picker", ["luzmoItemSlotPicker"], { "apiUrl": { "alias": "apiUrl"; "required": false; }; "authKey": { "alias": "authKey"; "required": false; }; "authToken": { "alias": "authToken"; "required": false; }; "itemType": { "alias": "itemType"; "required": false; }; "slotName": { "alias": "slotName"; "required": false; }; "slotConfiguration": { "alias": "slotConfiguration"; "required": false; }; "slotContents": { "alias": "slotContents"; "required": false; }; "contentLanguage": { "alias": "contentLanguage"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "grows": { "alias": "grows"; "required": false; }; "menu": { "alias": "menu"; "required": false; }; "hasLabel": { "alias": "hasLabel"; "required": false; }; "label": { "alias": "label"; "required": false; }; "selects": { "alias": "selects"; "required": false; }; "icons": { "alias": "icons"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "datasetsDataFields": { "alias": "datasetsDataFields"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "slotMenuPlacement": { "alias": "slotMenuPlacement"; "required": false; }; "slotMenuMode": { "alias": "slotMenuMode"; "required": false; }; "hideConfiguration": { "alias": "hideConfiguration"; "required": false; }; "hideClear": { "alias": "hideClear"; "required": false; }; "language": { "alias": "language"; "required": false; }; "search": { "alias": "search"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, { "luzmoSlotContentsChanged": "luzmoSlotContentsChanged"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoItemSlotPicker, "luzmo-item-slot-picker", ["luzmoItemSlotPicker"], { "apiUrl": { "alias": "apiUrl"; "required": false; }; "authKey": { "alias": "authKey"; "required": false; }; "authToken": { "alias": "authToken"; "required": false; }; "itemType": { "alias": "itemType"; "required": false; }; "slotName": { "alias": "slotName"; "required": false; }; "slotConfiguration": { "alias": "slotConfiguration"; "required": false; }; "slotContents": { "alias": "slotContents"; "required": false; }; "contentLanguage": { "alias": "contentLanguage"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "grows": { "alias": "grows"; "required": false; }; "menu": { "alias": "menu"; "required": false; }; "hasLabel": { "alias": "hasLabel"; "required": false; }; "label": { "alias": "label"; "required": false; }; "selects": { "alias": "selects"; "required": false; }; "search": { "alias": "search"; "required": false; }; "icons": { "alias": "icons"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "datasetsDataFields": { "alias": "datasetsDataFields"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "slotMenuPlacement": { "alias": "slotMenuPlacement"; "required": false; }; "slotMenuMode": { "alias": "slotMenuMode"; "required": false; }; "hideConfiguration": { "alias": "hideConfiguration"; "required": false; }; "hideClear": { "alias": "hideClear"; "required": false; }; "language": { "alias": "language"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, { "luzmoSlotContentsChanged": "luzmoSlotContentsChanged"; }, never, ["*"], true, never>;
     static ngAcceptInputType_disabled: unknown;
     static ngAcceptInputType_grows: unknown;
     static ngAcceptInputType_hasLabel: unknown;

package/angular/esm/components/item-slot-picker.js

@@ -43,6 +43,8 @@ export class LuzmoItemSlotPicker {
     label;
     /** Whether the picker allows single or multiple selections. Only relevant if the slot configuration allows multiple data fields. */
     selects;
+    /** Whether the search input is visible: `on`, `off`, or `auto`. */
+    search;
     /** Where to show icons */
     icons;
     /** The placeholder text for the picker is no value selected. */
@@ -61,8 +63,6 @@ export class LuzmoItemSlotPicker {
     hideClear;
     /** The language for UI labels. Supported values: 'en', 'nl', 'fr', 'de', 'es' */
     language;
-    /** Whether the search input is visible: `on`, `off`, or `auto`. */
-    search;
     /** The size of the element */
     size;
     /** Announces that the slot contents has changed */
@@ -120,6 +120,9 @@ export class LuzmoItemSlotPicker {
                 case 'selects':
                     this.setHostProperty('selects', changes['selects'].currentValue);
                     break;
+                case 'search':
+                    this.setHostProperty('search', changes['search'].currentValue);
+                    break;
                 case 'icons':
                     this.setHostProperty('icons', changes['icons'].currentValue);
                     break;
@@ -147,9 +150,6 @@ export class LuzmoItemSlotPicker {
                 case 'language':
                     this.setHostProperty('language', changes['language'].currentValue);
                     break;
-                case 'search':
-                    this.setHostProperty('search', changes['search'].currentValue);
-                    break;
                 case 'size':
                     this.setHostProperty('size', changes['size'].currentValue);
                     break;
@@ -174,7 +174,7 @@ export class LuzmoItemSlotPicker {
         }));
     }
     static ɵfac = function LuzmoItemSlotPicker_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoItemSlotPicker)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoItemSlotPicker, selectors: [["luzmo-item-slot-picker"]], inputs: { apiUrl: "apiUrl", authKey: "authKey", authToken: "authToken", itemType: "itemType", slotName: "slotName", slotConfiguration: "slotConfiguration", slotContents: "slotContents", contentLanguage: "contentLanguage", disabled: [2, "disabled", "disabled", booleanAttribute], grows: [2, "grows", "grows", booleanAttribute], menu: "menu", hasLabel: [2, "hasLabel", "hasLabel", booleanAttribute], label: "label", selects: "selects", icons: "icons", placeholder: "placeholder", datasetsDataFields: "datasetsDataFields", placement: "placement", slotMenuPlacement: "slotMenuPlacement", slotMenuMode: "slotMenuMode", hideConfiguration: [2, "hideConfiguration", "hideConfiguration", booleanAttribute], hideClear: [2, "hideClear", "hideClear", booleanAttribute], language: "language", search: "search", size: "size" }, outputs: { luzmoSlotContentsChanged: "luzmoSlotContentsChanged" }, exportAs: ["luzmoItemSlotPicker"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoItemSlotPicker_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoItemSlotPicker, selectors: [["luzmo-item-slot-picker"]], inputs: { apiUrl: "apiUrl", authKey: "authKey", authToken: "authToken", itemType: "itemType", slotName: "slotName", slotConfiguration: "slotConfiguration", slotContents: "slotContents", contentLanguage: "contentLanguage", disabled: [2, "disabled", "disabled", booleanAttribute], grows: [2, "grows", "grows", booleanAttribute], menu: "menu", hasLabel: [2, "hasLabel", "hasLabel", booleanAttribute], label: "label", selects: "selects", search: "search", icons: "icons", placeholder: "placeholder", datasetsDataFields: "datasetsDataFields", placement: "placement", slotMenuPlacement: "slotMenuPlacement", slotMenuMode: "slotMenuMode", hideConfiguration: [2, "hideConfiguration", "hideConfiguration", booleanAttribute], hideClear: [2, "hideClear", "hideClear", booleanAttribute], language: "language", size: "size" }, outputs: { luzmoSlotContentsChanged: "luzmoSlotContentsChanged" }, exportAs: ["luzmoItemSlotPicker"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoItemSlotPicker_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵprojection(0);
         } }, encapsulation: 2 });
@@ -230,6 +230,9 @@ export class LuzmoItemSlotPicker {
         }], selects: [{
             type: Input,
             args: [{ alias: 'selects' }]
+        }], search: [{
+            type: Input,
+            args: [{ alias: 'search' }]
         }], icons: [{
             type: Input,
             args: [{ alias: 'icons' }]
@@ -257,9 +260,6 @@ export class LuzmoItemSlotPicker {
         }], language: [{
             type: Input,
             args: [{ alias: 'language' }]
-        }], search: [{
-            type: Input,
-            args: [{ alias: 'search' }]
         }], size: [{
             type: Input,
             args: [{ alias: 'size' }]

package/angular/package.json

@@ -29,9 +29,9 @@
   "peerDependencies": {
     "@angular/core": "^17.3.0 || ^18.0.0 || ^19.0.0 || ^20.0.0 || ^21.0.0 || ^22.0.0",
     "@angular/forms": "^17.3.0 || ^18.0.0 || ^19.0.0 || ^20.0.0 || ^21.0.0 || ^22.0.0",
-    "@luzmo/analytics-components-kit": "1.2.1"
+    "@luzmo/analytics-components-kit": "1.4.0"
   },
-  "version": "1.2.1",
+  "version": "1.4.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/cumulio-internal/analytics-components-kit.git"

package/components/add-to-dashboard/dashboard-actions.d.ts

@@ -7,7 +7,8 @@ export declare function pageAcrossSources(sources: DashboardSource[], offset: nu
 /**
  * Built-in `DashboardActions` on the public API with the given credentials. Rights come from the token: an
  * embed token's `access.dashboards` grants plus the user's own access rights. `create` is only present for
- * an embed token with a designer or owner role or for any other token type. With the `flag_dashboard_variants`
+ * an embed token with a designer or owner role, or for any other token type unless the user is an
+ * organization viewer (a user with no organization role keeps it). With the `flag_dashboard_variants`
  * user flag, use-only dashboards and their variants are listed, and `addToVariant` follows the `create` rule.
  */
 export declare function createDashboardActions(config: BuiltInDashboardActionsConfig): Promise<DashboardActions>;

package/components/add-to-dashboard/index.cjs

@@ -17,4 +17,4 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../add-to-dashboard-NwsCPIlg.cjs");Object.defineProperty(exports,"LuzmoAddToDashboard",{enumerable:!0,get:function(){return e.t}}),exports.createDashboardActions=e.n;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../add-to-dashboard-BtzTZdjN.cjs");Object.defineProperty(exports,"LuzmoAddToDashboard",{enumerable:!0,get:function(){return e.t}}),exports.createDashboardActions=e.n;

package/components/add-to-dashboard/index.js

@@ -17,4 +17,4 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-export { t as LuzmoAddToDashboard, n as createDashboardActions } from "../add-to-dashboard-NcVHlqrc.js";
+export { t as LuzmoAddToDashboard, n as createDashboardActions } from "../add-to-dashboard-Bu6S3qVz.js";

package/components/{add-to-dashboard-NwsCPIlg.cjs → add-to-dashboard-BtzTZdjN.cjs}

@@ -17,7 +17,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-require("./tokens-BWMfo_w4.cjs");const e=require("./base-CGDNY_7v.cjs"),t=require("./decorate-DCJt-2rt.cjs"),n=require("./localized-mixin-EoNvtTBG.cjs"),r=require("./data-broker-DCghLjhq.cjs"),i=require("./localize-D3i4Epy_.cjs"),a=require("./chart-helpers-ufZ6VbXs.cjs");let o=require("@luzmo/icons");require("@luzmo/lucero/action-button"),require("@luzmo/lucero/button"),require("@luzmo/lucero/icon"),require("@luzmo/lucero/overlay"),require("@luzmo/lucero/popover"),require("@luzmo/lucero/tooltip");let s=require("lit"),c=require("lit/decorators.js"),l=require("@lit/localize");require("@luzmo/lucero/progress-circle"),require("@luzmo/lucero/checkbox"),require("@luzmo/lucero/divider"),require("@luzmo/lucero/field-group"),require("@luzmo/lucero/menu"),require("@luzmo/lucero/notice"),require("@luzmo/lucero/search");let u=require("lit/directives/if-defined.js");var d=`:host{align-items:flex-end;gap:var(--luzmo-spacing-2);font-family:var(--luzmo-font-family);flex-direction:column;display:inline-flex}.trigger-spinner{--luzmo-progress-circle-size:var(--luzmo-icon-size-xs)}.trigger-chevron{margin-inline-start:var(--luzmo-spacing-1)}.picker{gap:var(--luzmo-spacing-3);width:var(--luzmo-add-to-dashboard-picker-width,var(--add-to-dashboard-picker-width));max-width:90vw;padding:var(--luzmo-spacing-2);color:var(--luzmo-font-color);font-size:var(--luzmo-font-size-s);flex-direction:column;display:flex}luzmo-search{width:100%}.list{max-height:var(--luzmo-add-to-dashboard-list-max-height,var(--add-to-dashboard-list-max-height));flex-direction:column;display:flex;overflow-y:auto}.menu{--luzmo-menu-max-height:none;flex:none;width:100%;overflow:visible}.create-row{--luzmo-menu-item-label-icon-color-default:var(--luzmo-primary)}.thumbnail{object-fit:cover;border:var(--luzmo-border-width) solid var(--luzmo-border-color);border-radius:var(--luzmo-border-radius);width:2.75rem;height:2rem}.drill-in{color:var(--luzmo-font-color-extra-dimmed)}.header{align-items:center;gap:var(--luzmo-spacing-2);display:flex}.header-title{font-weight:var(--luzmo-font-weight-bold);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.empty{align-items:center;gap:var(--luzmo-spacing-3);padding:var(--luzmo-spacing-4);text-align:center;flex-direction:column;display:flex}.loading{padding:var(--luzmo-spacing-3);justify-content:center;display:flex}.screen-modes{gap:var(--luzmo-spacing-2);flex-direction:column;display:flex}.screen-mode{align-items:center;gap:var(--luzmo-spacing-2);display:flex}.screen-mode-size{color:var(--luzmo-font-color-extra-dimmed)}.footer{justify-content:flex-end;display:flex}.status{justify-content:flex-end;width:0;min-width:100%;display:flex}.status:empty{display:none}.alert{flex:none;inline-size:max-content}.alert-body{align-items:center;gap:var(--luzmo-spacing-3);block-size:1lh;min-inline-size:0;display:flex}.alert-text{min-inline-size:0;font-weight:var(--luzmo-font-weight-semibold);white-space:pre;display:flex}.alert[variant=negative] .alert-text{white-space:normal}.alert-name{min-inline-size:0;font-weight:var(--luzmo-font-weight-bold);text-overflow:ellipsis;white-space:nowrap;unicode-bidi:plaintext;overflow:hidden}.alert-open{flex:none}:host{--add-to-dashboard-picker-width:18rem;--add-to-dashboard-list-max-height:16rem}`,f=`0.1.107`,p=`0.1.0`,m=[`id`,`name`,`contents`,`modified_at`,`is_variant`,`original_id`],h=new Set([`designer`,`owner`]),g=`flag_dashboard_variants`,_=[`desktop`,`tablet`,`mobile`];async function v(e,t,n){let r=[],i=t,a=0;for(let t of e){let e=n-r.length,o=await t(i,Math.max(e,1));e>0&&r.push(...o.rows.slice(0,e)),i=Math.max(0,i-o.count),a+=o.count}return{rows:r,total:a}}async function y(e){let t=await e.fetchApi(`/user`,{action:`get`,version:p,find:{where:{id:`me`},attributes:[`id`,`flags`]}});return{id:t.rows?.[0]?.id??``,flags:t.rows?.[0]?.flags??[]}}async function b(e,t){return(await e.fetchApi(`/authorization`,{action:`get`,version:p,find:{where:{id:t}}})).rows?.[0]}async function x(e,t,n){let r={...t,where:{...t.where,type:`dashboard`}},i=await e.fetchApi(`/securable`,{action:`get`,version:p,find:r},{signal:n});return{rows:i.rows??[],count:i.count??i.rows?.length??0}}function S(e){let t={modifyIds:new Set,useOnlyIds:new Set};for(let n of e?.access?.dashboards??[])n.rights?.Modify?t.modifyIds.add(n.id):n.rights?.Use&&t.useOnlyIds.add(n.id);return t}function C(){return{version:f,syncScreenModes:!0,views:_.map(e=>({screenModus:e,options:{theme:{id:`default`}},filterGroups:[],items:[]})),timezone:{type:`fixed`,id:`UTC`}}}function w(e){return e?{search:{match_types:[`name`,`description`],keyphrase:e,securable_types:[`dashboard`]}}:{}}function T(e,t){return{include:[{model:`User`,as:`allUsers`,attributes:[],required:!0,where:{id:e,...Object.fromEntries(Object.entries(t).map(([e,t])=>[`securableAccessRight.${e}`,t]))}}]}}async function E(e){let t=new r.t({apiUrl:e.apiUrl,authKey:e.authKey,authToken:e.authToken,skipNetworkListeners:!0}),[n,a]=await Promise.all([y(t),b(t,e.authKey)]),o=S(a),s=a?.type!==`embed`||h.has(a.role??``),c=!!n.id&&n.flags.includes(g),u=[...o.modifyIds,...c?o.useOnlyIds:[]],d=u.length>0?{id:{notIn:u}}:{},f=(t,n=!1)=>{let r=[...new Set((t.contents?.views??[]).map(e=>e.screenModus))];return{id:t.id,name:i.t(t.name??{},e.language),syncScreenModes:t.contents?.syncScreenModes!==!1,screenModes:r.length>0?r:[`desktop`],...n?{requiresVariant:n}:{}}},_,E=(e,n)=>async(r,i)=>{if(u.length===0)return{count:0,rows:[]};let a=r>0&&_?.search===e?_.rows:void 0;return a||(a=(await x(t,{where:{is_variant:!1,archived_at:null,id:{in:u}},attributes:m,...w(e)},n)).rows.map(e=>f(e,!o.modifyIds.has(e.id))).sort((e,t)=>e.name.localeCompare(t.name)),_={search:e,rows:a}),{count:a.length,rows:a.slice(r,r+i)}},D=(e,r,i,a)=>async(o,s)=>{let c=await x(t,{where:{is_variant:!1,archived_at:null,...d},attributes:m,...T(n.id,i),...w(e),limit:s,offset:o,order:[[`modified_at`,`desc`]]},r);return{count:c.count,rows:c.rows.map(e=>f(e,a))}},O=async(e,n,r,i)=>{await t.fetchApi(`/securable`,{action:`update`,version:p,id:e,properties:{append_item:{item:n,...r?.length?{screenModes:r}:{}}}},{signal:i})},k=async(e,n,r)=>{try{await O(e.id,n,r)}catch(n){throw await t.fetchApi(`/securable`,{action:`delete`,version:p,id:e.id}).catch(()=>void 0),n}},A=async(e,n)=>await t.fetchApi(`/securable`,{action:`create`,version:p,properties:{...e,type:`dashboard`},associations:n});return{async list(e,t){return n.id?await v([E(e.search,t.signal),...c?[D(e.search,t.signal,{flagUse:!0,flagModify:!1},!0)]:[],D(e.search,t.signal,{flagModify:!0},!1)],e.offset,e.limit):{rows:[],total:0}},async add(e,t,n,r){await O(e.id,t,n.screenModes,r.signal)},...s?{async create(t,n){let r=await A({name:n.name?{[e.language]:n.name}:{},contents:C()});return await k(r,t,void 0),f(r)}}:{},...c?{async listVariants(e,r){return(await x(t,{where:{is_variant:!0,original_id:e.id,archived_at:null},attributes:m,...T(n.id,{flagModify:!0}),order:[[`modified_at`,`desc`]]},r.signal)).rows.map(e=>f(e))}}:{},...c&&s?{async addToVariant(n,r,i){let a=(await x(t,{where:{id:n.id},attributes:[`id`,`name`,`contents`]})).rows[0];if(!a?.contents)throw Error((0,l.msg)(`The dashboard was not found.`,{desc:`Adding the chart to a variant failed because the original dashboard could not be loaded`}));let o=a.name??{},s=await A({name:i.name?{...o,[e.language]:i.name}:o,contents:a.contents},[{role:`original`,id:n.id}]);return await k(s,r,i.screenModes),f({...s,contents:s.contents??a.contents})}}:{}}}function D(e){let{theme:t,...n}=e.options??{};return{...a.o(e),options:n}}function O(e,t){let n=new Set(e),r=e.length+1;for(;n.has(t(r));)r+=1;return r}var k=20,A=300,j=8,M=48,N=`__luzmo-new-dashboard`,P=`__luzmo-new-variant`,F=new Map,I=0,L=class extends n.t(e.n(e.i,{validSizes:Object.values(e.t)})){constructor(...e){super(...e),this.chart=null,this.dashboardActions=null,this.authKey=``,this.authToken=``,this.apiUrl=`https://api.luzmo.com`,this.placement=`bottom-end`,this.disabled=!1,this._open=!1,this._actions=null,this._step=`list`,this._rows=[],this._hasMore=!1,this._loading=!1,this._listFailed=!1,this._original=null,this._variants=[],this._variantsLoading=!1,this._variantsFailed=!1,this._pending=null,this._screenModes=[],this._saving=!1,this._status=null,this._triggerId=`add-to-dashboard-trigger-${++I}`,this._search=``,this._actionsGeneration=0,this._reloadOnUpdate=!1}static get styles(){let e=super.styles??[];return[...Array.isArray(e)?e:[e],(0,s.unsafeCSS)(d)]}get _hasSource(){return!!this.dashboardActions||!!(this.authKey&&this.authToken)}connectedCallback(){super.connectedCallback(),this._status&&this._startFittingAlert()}disconnectedCallback(){super.disconnectedCallback(),this._handleClosed(),this._actionsGeneration+=1,this._saveAbort?.abort(),this._stopFittingAlert()}willUpdate(e){super.willUpdate(e),(e.has(`dashboardActions`)||e.has(`authKey`)||e.has(`authToken`)||e.has(`apiUrl`)||e.has(`language`))&&(this._actions=null,this._actionsGeneration+=1,this._open&&(this._listAbort?.abort(),this._variantsAbort?.abort(),this._step=`list`,this._original=null,this._pending=null,this._rows=[],this._open=this._hasSource,this._reloadOnUpdate=this._hasSource)),e.has(`disabled`)&&this.disabled&&(this._open=!1),e.has(`chart`)&&!this.chart&&this._handleClosed()}updated(e){super.updated(e),this._reloadOnUpdate&&(this._reloadOnUpdate=!1,this._loadList()),e.has(`_step`)&&this._open&&this._focusStep(),e.has(`_status`)&&(this._status?this._startFittingAlert():this._stopFittingAlert())}get _alertContainer(){let e=this.getRootNode();return this.parentElement??(e instanceof ShadowRoot?e.host:null)}_startFittingAlert(){this._fitAlert();let e=this._alertContainer;!this._alertResizeObserver&&e&&(this._alertResizeObserver=new ResizeObserver(()=>this._fitAlert()),this._alertResizeObserver.observe(this),this._alertResizeObserver.observe(e))}_stopFittingAlert(){this._alertResizeObserver?.disconnect(),this._alertResizeObserver=void 0}_fitAlert(){let e=this._noticeElement,t=this._alertContainer;if(!e||!t)return;let n=this.getBoundingClientRect(),r=t.getBoundingClientRect(),i=Number.parseFloat(getComputedStyle(t).paddingInlineStart)||0,a=(this.isLTR?n.right-r.left:r.right-n.left)-i;e.style.setProperty(`--luzmo-notice-max-inline-size`,`${Math.max(0,a)}px`)}async _resolveActions(){if(this.dashboardActions)return this.dashboardActions;let e={apiUrl:this.apiUrl,authKey:this.authKey,authToken:this.authToken,language:this.language},t=JSON.stringify(e),n=F.get(t);return n||(F.clear(),n=E(e),F.set(t,n),n.catch(()=>F.delete(t))),await n}_dispatch(e,t){let n=new CustomEvent(e,{detail:t,bubbles:!0,composed:!0});this.dispatchEvent(n)}_displayName(e){return e.name.trim()||(0,l.msg)(`Untitled dashboard`,{desc:`Fallback name of a dashboard without a name`})}_variantName(e,t){let n=this._displayName(e);return(0,l.msg)(l.str`${n} (variant ${t})`,{desc:`Name of a new dashboard variant`})}_screenModeChoices(){return[{name:`mobile`,label:(0,l.msg)(`Smartphone`,{desc:`Screen mode name`}),size:`< 768px`,icon:o.luzmoMobile},{name:`tablet`,label:(0,l.msg)(`Tablet`,{desc:`Screen mode name`}),size:`≥ 768px`,icon:o.luzmoTablet},{name:`desktop`,label:(0,l.msg)(`Desktop`,{desc:`Screen mode name`}),size:`≥ 1200px`,icon:o.luzmoLaptop},{name:`largeScreen`,label:(0,l.msg)(`Large screen`,{desc:`Screen mode name`}),size:`≥ 1600px`,icon:o.luzmoDesktop},{name:`fixed`,label:(0,l.msg)(`Fixed width`,{desc:`Screen mode name`}),icon:o.luzmoArrowsHorizontal}]}async _handleOpened(e){e.target===e.currentTarget&&(this._open=!0,this._step=`list`,this._search=``,this._original=null,this._pending=null,this._rows=[],await this.updateComplete,this._searchElement?.focus(),await this._loadList())}async _loadList(){let e=this._actionsGeneration;this._loading=!0,this._listFailed=!1;try{let t=this._actions??await this._resolveActions();if(e!==this._actionsGeneration)return;this._actions=t}catch(t){if(!this.isConnected||e!==this._actionsGeneration)return;console.error(`Failed to resolve the add to dashboard actions:`,t),this._loading=!1,this._listFailed=!0;return}this.isConnected&&this._open&&await this._loadPage(!1)}_handleClosed(e){e&&e.target!==e.currentTarget||(this._open=!1,clearTimeout(this._searchTimer),this._listAbort?.abort(),this._variantsAbort?.abort())}async _loadPage(e){let t=this._actions;if(!t)return;this._listAbort?.abort();let n=new AbortController;this._listAbort=n,this._loading=!0,this._listFailed=!1,e||(this._rows=[]);try{let e=await t.list({search:this._search,offset:this._rows.length,limit:k},{signal:n.signal});if(n.signal.aborted)return;this._rows=[...this._rows,...e.rows],this._hasMore=e.total===void 0?e.rows.length===k:this._rows.length<e.total}catch(e){if(n.signal.aborted)return;console.error(`Failed to load dashboards:`,e),this._listFailed=!0}finally{n.signal.aborted||(this._loading=!1)}}_handleSearchInput(e){this._search=String(e.target?.value??``),clearTimeout(this._searchTimer),this._searchTimer=setTimeout(()=>void this._loadPage(!1),A)}_handleListScroll(e){let t=e.target;this._hasMore&&!this._loading&&t.scrollHeight-t.scrollTop-t.clientHeight<=M&&this._loadPage(!0)}_menuValue(e){return e.stopPropagation(),e.target.value??``}_handleListChange(e){let t=this._menuValue(e);if(t===N){this._actions?.create&&this._save({kind:`create`});return}let n=this._rows.find(e=>e.id===t);n&&(n.requiresVariant?(this._original=n,this._step=`variants`,this._loadVariants()):this._selectTarget({kind:`add`,dashboard:n,isVariant:!1},n))}_handleVariantChange(e){let t=this._menuValue(e),n=this._original;if(!n)return;if(t===P){if(!this._actions?.addToVariant)return;let e=this._variants.map(e=>this._displayName(e)),t=this._variantName(n,O(e,e=>this._variantName(n,e)));this._selectTarget({kind:`variant`,original:n,name:t},n);return}let r=this._variants.find(e=>e.id===t);r&&this._selectTarget({kind:`add`,dashboard:r,isVariant:!0},r)}_selectTarget(e,t){t.syncScreenModes!==!1||!t.screenModes?.length?this._save(e):(this._pending=e,this._screenModes=[...t.screenModes??[]],this._step=`screenModes`)}async _loadVariants(){let e=this._actions,t=this._original;if(this._variantsAbort?.abort(),this._variants=[],this._variantsLoading=!1,this._variantsFailed=!1,!e?.listVariants||!t)return;let n=new AbortController;this._variantsAbort=n,this._variantsLoading=!0;try{let r=await e.listVariants(t,{signal:n.signal});n.signal.aborted||(this._variants=r)}catch(e){n.signal.aborted||(console.error(`Failed to load dashboard variants:`,e),this._variantsFailed=!0)}finally{n.signal.aborted||(this._variantsLoading=!1)}}_handleBack(){this._step===`screenModes`&&this._original?this._step=`variants`:(this._step=`list`,this._original=null),this._pending=null}_toggleScreenMode(e){this._screenModes=this._screenModes.includes(e)?this._screenModes.filter(t=>t!==e):[...this._screenModes,e]}_handleConfirmScreenModes(){this._pending&&this._screenModes.length>0&&this._save(this._pending,{screenModes:[...this._screenModes]})}async _save(e,t={}){let n=this._actions;if(!n||!this.chart||this._saving)return;this._open=!1,this._saving=!0,this._setStatus(null),this._saveAbort=new AbortController;let r=D(this.chart),i={signal:this._saveAbort.signal};try{let a;if(e.kind===`create`&&n.create)a=await n.create(r,t,i);else if(e.kind===`variant`&&n.addToVariant)a=await n.addToVariant(e.original,r,{...t,name:e.name},i);else if(e.kind===`add`)a=await n.add(e.dashboard,r,t,i)||e.dashboard;else return;if(i.signal.aborted)return;this._setStatus({kind:`success`,dashboard:a,isVariant:e.kind===`variant`||e.kind===`add`&&e.isVariant,openDashboard:n.openDashboard?.bind(n)}),this._dispatch(`luzmo-chart-added`,{dashboard:a})}catch(e){if(i.signal.aborted)return;console.error(`Failed to add the chart to a dashboard:`,e),this._setStatus({kind:`error`,message:e instanceof Error&&e.message?e.message:void 0}),this._dispatch(`luzmo-chart-add-failed`,{error:e})}finally{this._saving=!1}await this.updateComplete,this.isConnected&&this._isFocusLost()&&this._focusTrigger()}_setStatus(e){this._status=e}_focusTrigger(){this._triggerElement?.focus()}_isFocusLost(){return!document.activeElement||document.activeElement===document.body}async _handleNoticeClose(e){e.stopPropagation();let t=e.currentTarget.matches(`:focus-within`);this._setStatus(null),await this.updateComplete,t&&this._isFocusLost()&&this._focusTrigger()}async _focusStep(){let e=this._step===`list`?this._searchElement:this._backElement;await e?.updateComplete,e?.focus()}_renderRow(e){return s.html`
+require("./tokens-BWMfo_w4.cjs");const e=require("./base-CGDNY_7v.cjs"),t=require("./decorate-DCJt-2rt.cjs"),n=require("./localized-mixin-EoNvtTBG.cjs"),r=require("./data-broker-DCghLjhq.cjs"),i=require("./localize-D3i4Epy_.cjs"),a=require("./chart-helpers-BHxQbLBw.cjs");let o=require("@luzmo/icons");require("@luzmo/lucero/action-button"),require("@luzmo/lucero/button"),require("@luzmo/lucero/icon"),require("@luzmo/lucero/overlay"),require("@luzmo/lucero/popover"),require("@luzmo/lucero/tooltip");let s=require("lit"),c=require("lit/decorators.js"),l=require("@lit/localize");require("@luzmo/lucero/progress-circle"),require("@luzmo/lucero/checkbox"),require("@luzmo/lucero/divider"),require("@luzmo/lucero/field-group"),require("@luzmo/lucero/menu"),require("@luzmo/lucero/notice"),require("@luzmo/lucero/search");let u=require("lit/directives/if-defined.js");var d=`:host{align-items:flex-end;gap:var(--luzmo-spacing-2);font-family:var(--luzmo-font-family);flex-direction:column;display:inline-flex}.trigger-spinner{--luzmo-progress-circle-size:var(--luzmo-icon-size-xs)}.trigger-chevron{margin-inline-start:var(--luzmo-spacing-1)}.picker{gap:var(--luzmo-spacing-3);width:var(--luzmo-add-to-dashboard-picker-width,var(--add-to-dashboard-picker-width));max-width:90vw;padding:var(--luzmo-spacing-2);color:var(--luzmo-font-color);font-size:var(--luzmo-font-size-s);flex-direction:column;display:flex}luzmo-search{width:100%}.list{max-height:var(--luzmo-add-to-dashboard-list-max-height,var(--add-to-dashboard-list-max-height));flex-direction:column;display:flex;overflow-y:auto}.menu{--luzmo-menu-max-height:none;flex:none;width:100%;overflow:visible}.create-row{--luzmo-menu-item-label-icon-color-default:var(--luzmo-primary)}.thumbnail{object-fit:cover;border:var(--luzmo-border-width) solid var(--luzmo-border-color);border-radius:var(--luzmo-border-radius);width:2.75rem;height:2rem}.drill-in{color:var(--luzmo-font-color-extra-dimmed)}.header{align-items:center;gap:var(--luzmo-spacing-2);display:flex}.header-title{font-weight:var(--luzmo-font-weight-bold);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.empty{align-items:center;gap:var(--luzmo-spacing-3);padding:var(--luzmo-spacing-4);text-align:center;flex-direction:column;display:flex}.loading{padding:var(--luzmo-spacing-3);justify-content:center;display:flex}.screen-modes{gap:var(--luzmo-spacing-2);flex-direction:column;display:flex}.screen-mode{align-items:center;gap:var(--luzmo-spacing-2);display:flex}.screen-mode-size{color:var(--luzmo-font-color-extra-dimmed)}.footer{justify-content:flex-end;display:flex}.status{justify-content:flex-end;width:0;min-width:100%;display:flex}.status:empty{display:none}.alert{flex:none;inline-size:max-content}.alert-body{align-items:center;gap:var(--luzmo-spacing-3);block-size:1lh;min-inline-size:0;display:flex}.alert-text{min-inline-size:0;font-weight:var(--luzmo-font-weight-semibold);white-space:pre;display:flex}.alert[variant=negative] .alert-text{white-space:normal}.alert-name{min-inline-size:0;font-weight:var(--luzmo-font-weight-bold);text-overflow:ellipsis;white-space:nowrap;unicode-bidi:plaintext;overflow:hidden}.alert-open{flex:none}:host{--add-to-dashboard-picker-width:18rem;--add-to-dashboard-list-max-height:16rem}`,f=`0.1.107`,p=`0.1.0`,m=[`id`,`name`,`contents`,`modified_at`,`is_variant`,`original_id`],h=new Set([`designer`,`owner`]),g=`flag_dashboard_variants`,_=[`desktop`,`tablet`,`mobile`];async function v(e,t,n){let r=[],i=t,a=0;for(let t of e){let e=n-r.length,o=await t(i,Math.max(e,1));e>0&&r.push(...o.rows.slice(0,e)),i=Math.max(0,i-o.count),a+=o.count}return{rows:r,total:a}}async function y(e,t){let n=(await e.fetchApi(`/user`,{action:`get`,version:p,find:{where:{id:`me`},attributes:[`id`,`flags`],...t?{include:[{model:`Organization`,attributes:[`id`]}]}:{}}})).rows?.[0];return{id:n?.id??``,flags:n?.flags??[],organizations:n?.organizations}}async function b(e,t){return(await e.fetchApi(`/authorization`,{action:`get`,version:p,find:{where:{id:t}}})).rows?.[0]}async function x(e,t,n){let r={...t,where:{...t.where,type:`dashboard`}},i=await e.fetchApi(`/securable`,{action:`get`,version:p,find:r},{signal:n});return{rows:i.rows??[],count:i.count??i.rows?.length??0}}function S(e){let t={modifyIds:new Set,useOnlyIds:new Set};for(let n of e?.access?.dashboards??[])n.rights?.Modify?t.modifyIds.add(n.id):n.rights?.Use&&t.useOnlyIds.add(n.id);return t}function C(){return{version:f,syncScreenModes:!0,views:_.map(e=>({screenModus:e,options:{theme:{id:`default`}},filterGroups:[],items:[]})),timezone:{type:`fixed`,id:`UTC`}}}function w(e){return e?{search:{match_types:[`name`,`description`],keyphrase:e,securable_types:[`dashboard`]}}:{}}function T(e,t){return{include:[{model:`User`,as:`allUsers`,attributes:[],required:!0,where:{id:e,...Object.fromEntries(Object.entries(t).map(([e,t])=>[`securableAccessRight.${e}`,t]))}}]}}async function E(e){let t=new r.t({apiUrl:e.apiUrl,authKey:e.authKey,authToken:e.authToken,skipNetworkListeners:!0}),n=await b(t,e.authKey),a=n?.type===`embed`,o=await y(t,!a),s=S(n),c=a?h.has(n.role??``):o.organizations?.[0]?.organizationRole?.flagEditor!==!1,u=!!o.id&&o.flags.includes(g),d=[...s.modifyIds,...u?s.useOnlyIds:[]],f=d.length>0?{id:{notIn:d}}:{},_=(t,n=!1)=>{let r=[...new Set((t.contents?.views??[]).map(e=>e.screenModus))];return{id:t.id,name:i.t(t.name??{},e.language),syncScreenModes:t.contents?.syncScreenModes!==!1,screenModes:r.length>0?r:[`desktop`],...n?{requiresVariant:n}:{}}},E,D=(e,n)=>async(r,i)=>{if(d.length===0)return{count:0,rows:[]};let a=r>0&&E?.search===e?E.rows:void 0;return a||(a=(await x(t,{where:{is_variant:!1,archived_at:null,id:{in:d}},attributes:m,...w(e)},n)).rows.map(e=>_(e,!s.modifyIds.has(e.id))).sort((e,t)=>e.name.localeCompare(t.name)),E={search:e,rows:a}),{count:a.length,rows:a.slice(r,r+i)}},O=(e,n,r,i)=>async(a,s)=>{let c=await x(t,{where:{is_variant:!1,archived_at:null,...f},attributes:m,...T(o.id,r),...w(e),limit:s,offset:a,order:[[`modified_at`,`desc`]]},n);return{count:c.count,rows:c.rows.map(e=>_(e,i))}},k=async(e,n,r,i)=>{await t.fetchApi(`/securable`,{action:`update`,version:p,id:e,properties:{append_item:{item:n,...r?.length?{screenModes:r}:{}}}},{signal:i})},A=async(e,n,r)=>{try{await k(e.id,n,r)}catch(n){throw await t.fetchApi(`/securable`,{action:`delete`,version:p,id:e.id}).catch(()=>void 0),n}},j=async(e,n)=>await t.fetchApi(`/securable`,{action:`create`,version:p,properties:{...e,type:`dashboard`},associations:n});return{async list(e,t){return o.id?await v([D(e.search,t.signal),...u?[O(e.search,t.signal,{flagUse:!0,flagModify:!1},!0)]:[],O(e.search,t.signal,{flagModify:!0},!1)],e.offset,e.limit):{rows:[],total:0}},async add(e,t,n,r){await k(e.id,t,n.screenModes,r.signal)},...c?{async create(t,n){let r=await j({name:n.name?{[e.language]:n.name}:{},contents:C()});return await A(r,t,void 0),_(r)}}:{},...u?{async listVariants(e,n){return(await x(t,{where:{is_variant:!0,original_id:e.id,archived_at:null},attributes:m,...T(o.id,{flagModify:!0}),order:[[`modified_at`,`desc`]]},n.signal)).rows.map(e=>_(e))}}:{},...u&&c?{async addToVariant(n,r,i){let a=(await x(t,{where:{id:n.id},attributes:[`id`,`name`,`contents`]})).rows[0];if(!a?.contents)throw Error((0,l.msg)(`The dashboard was not found.`,{desc:`Adding the chart to a variant failed because the original dashboard could not be loaded`}));let o=a.name??{},s=await j({name:i.name?{...o,[e.language]:i.name}:o,contents:a.contents},[{role:`original`,id:n.id}]);return await A(s,r,i.screenModes),_({...s,contents:s.contents??a.contents})}}:{}}}function D(e){let{theme:t,...n}=e.options??{};return{...a.s(e),options:n}}function O(e,t){let n=new Set(e),r=e.length+1;for(;n.has(t(r));)r+=1;return r}var k=20,A=300,j=8,M=48,N=`__luzmo-new-dashboard`,P=`__luzmo-new-variant`,F=new Map,I=0,L=class extends n.t(e.n(e.i,{validSizes:Object.values(e.t)})){constructor(...e){super(...e),this.chart=null,this.dashboardActions=null,this.authKey=``,this.authToken=``,this.apiUrl=`https://api.luzmo.com`,this.placement=`bottom-end`,this.disabled=!1,this._open=!1,this._actions=null,this._step=`list`,this._rows=[],this._hasMore=!1,this._loading=!1,this._listFailed=!1,this._original=null,this._variants=[],this._variantsLoading=!1,this._variantsFailed=!1,this._pending=null,this._screenModes=[],this._saving=!1,this._status=null,this._triggerId=`add-to-dashboard-trigger-${++I}`,this._search=``,this._actionsGeneration=0,this._reloadOnUpdate=!1}static get styles(){let e=super.styles??[];return[...Array.isArray(e)?e:[e],(0,s.unsafeCSS)(d)]}get _hasSource(){return!!this.dashboardActions||!!(this.authKey&&this.authToken)}connectedCallback(){super.connectedCallback(),this._status&&this._startFittingAlert()}disconnectedCallback(){super.disconnectedCallback(),this._handleClosed(),this._actionsGeneration+=1,this._saveAbort?.abort(),this._stopFittingAlert()}willUpdate(e){super.willUpdate(e),(e.has(`dashboardActions`)||e.has(`authKey`)||e.has(`authToken`)||e.has(`apiUrl`)||e.has(`language`))&&(this._actions=null,this._actionsGeneration+=1,this._open&&(this._listAbort?.abort(),this._variantsAbort?.abort(),this._step=`list`,this._original=null,this._pending=null,this._rows=[],this._open=this._hasSource,this._reloadOnUpdate=this._hasSource)),e.has(`disabled`)&&this.disabled&&(this._open=!1),e.has(`chart`)&&!this.chart&&this._handleClosed()}updated(e){super.updated(e),this._reloadOnUpdate&&(this._reloadOnUpdate=!1,this._loadList()),e.has(`_step`)&&this._open&&this._focusStep(),e.has(`_status`)&&(this._status?this._startFittingAlert():this._stopFittingAlert())}get _alertContainer(){let e=this.getRootNode();return this.parentElement??(e instanceof ShadowRoot?e.host:null)}_startFittingAlert(){this._fitAlert();let e=this._alertContainer;!this._alertResizeObserver&&e&&(this._alertResizeObserver=new ResizeObserver(()=>this._fitAlert()),this._alertResizeObserver.observe(this),this._alertResizeObserver.observe(e))}_stopFittingAlert(){this._alertResizeObserver?.disconnect(),this._alertResizeObserver=void 0}_fitAlert(){let e=this._noticeElement,t=this._alertContainer;if(!e||!t)return;let n=this.getBoundingClientRect(),r=t.getBoundingClientRect(),i=Number.parseFloat(getComputedStyle(t).paddingInlineStart)||0,a=(this.isLTR?n.right-r.left:r.right-n.left)-i;e.style.setProperty(`--luzmo-notice-max-inline-size`,`${Math.max(0,a)}px`)}async _resolveActions(){if(this.dashboardActions)return this.dashboardActions;let e={apiUrl:this.apiUrl,authKey:this.authKey,authToken:this.authToken,language:this.language},t=JSON.stringify(e),n=F.get(t);return n||(F.clear(),n=E(e),F.set(t,n),n.catch(()=>F.delete(t))),await n}_dispatch(e,t){let n=new CustomEvent(e,{detail:t,bubbles:!0,composed:!0});this.dispatchEvent(n)}_displayName(e){return e.name.trim()||(0,l.msg)(`Untitled dashboard`,{desc:`Fallback name of a dashboard without a name`})}_variantName(e,t){let n=this._displayName(e);return(0,l.msg)(l.str`${n} (variant ${t})`,{desc:`Name of a new dashboard variant`})}_screenModeChoices(){return[{name:`mobile`,label:(0,l.msg)(`Smartphone`,{desc:`Screen mode name`}),size:`< 768px`,icon:o.luzmoMobile},{name:`tablet`,label:(0,l.msg)(`Tablet`,{desc:`Screen mode name`}),size:`≥ 768px`,icon:o.luzmoTablet},{name:`desktop`,label:(0,l.msg)(`Desktop`,{desc:`Screen mode name`}),size:`≥ 1200px`,icon:o.luzmoLaptop},{name:`largeScreen`,label:(0,l.msg)(`Large screen`,{desc:`Screen mode name`}),size:`≥ 1600px`,icon:o.luzmoDesktop},{name:`fixed`,label:(0,l.msg)(`Fixed width`,{desc:`Screen mode name`}),icon:o.luzmoArrowsHorizontal}]}async _handleOpened(e){e.target===e.currentTarget&&(this._open=!0,this._step=`list`,this._search=``,this._original=null,this._pending=null,this._rows=[],await this.updateComplete,this._searchElement?.focus(),await this._loadList())}async _loadList(){let e=this._actionsGeneration;this._loading=!0,this._listFailed=!1;try{let t=this._actions??await this._resolveActions();if(e!==this._actionsGeneration)return;this._actions=t}catch(t){if(!this.isConnected||e!==this._actionsGeneration)return;console.error(`Failed to resolve the add to dashboard actions:`,t),this._loading=!1,this._listFailed=!0;return}this.isConnected&&this._open&&await this._loadPage(!1)}_handleClosed(e){e&&e.target!==e.currentTarget||(this._open=!1,clearTimeout(this._searchTimer),this._listAbort?.abort(),this._variantsAbort?.abort())}async _loadPage(e){let t=this._actions;if(!t)return;this._listAbort?.abort();let n=new AbortController;this._listAbort=n,this._loading=!0,this._listFailed=!1,e||(this._rows=[]);try{let e=await t.list({search:this._search,offset:this._rows.length,limit:k},{signal:n.signal});if(n.signal.aborted)return;this._rows=[...this._rows,...e.rows],this._hasMore=e.total===void 0?e.rows.length===k:this._rows.length<e.total}catch(e){if(n.signal.aborted)return;console.error(`Failed to load dashboards:`,e),this._listFailed=!0}finally{n.signal.aborted||(this._loading=!1)}}_handleSearchInput(e){this._search=String(e.target?.value??``),clearTimeout(this._searchTimer),this._searchTimer=setTimeout(()=>void this._loadPage(!1),A)}_handleListScroll(e){let t=e.target;this._hasMore&&!this._loading&&t.scrollHeight-t.scrollTop-t.clientHeight<=M&&this._loadPage(!0)}_menuValue(e){return e.stopPropagation(),e.target.value??``}_handleListChange(e){let t=this._menuValue(e);if(t===N){this._actions?.create&&this._save({kind:`create`});return}let n=this._rows.find(e=>e.id===t);n&&(n.requiresVariant?(this._original=n,this._step=`variants`,this._loadVariants()):this._selectTarget({kind:`add`,dashboard:n,isVariant:!1},n))}_handleVariantChange(e){let t=this._menuValue(e),n=this._original;if(!n)return;if(t===P){if(!this._actions?.addToVariant)return;let e=this._variants.map(e=>this._displayName(e)),t=this._variantName(n,O(e,e=>this._variantName(n,e)));this._selectTarget({kind:`variant`,original:n,name:t},n);return}let r=this._variants.find(e=>e.id===t);r&&this._selectTarget({kind:`add`,dashboard:r,isVariant:!0},r)}_selectTarget(e,t){t.syncScreenModes!==!1||!t.screenModes?.length?this._save(e):(this._pending=e,this._screenModes=[...t.screenModes??[]],this._step=`screenModes`)}async _loadVariants(){let e=this._actions,t=this._original;if(this._variantsAbort?.abort(),this._variants=[],this._variantsLoading=!1,this._variantsFailed=!1,!e?.listVariants||!t)return;let n=new AbortController;this._variantsAbort=n,this._variantsLoading=!0;try{let r=await e.listVariants(t,{signal:n.signal});n.signal.aborted||(this._variants=r)}catch(e){n.signal.aborted||(console.error(`Failed to load dashboard variants:`,e),this._variantsFailed=!0)}finally{n.signal.aborted||(this._variantsLoading=!1)}}_handleBack(){this._step===`screenModes`&&this._original?this._step=`variants`:(this._step=`list`,this._original=null),this._pending=null}_toggleScreenMode(e){this._screenModes=this._screenModes.includes(e)?this._screenModes.filter(t=>t!==e):[...this._screenModes,e]}_handleConfirmScreenModes(){this._pending&&this._screenModes.length>0&&this._save(this._pending,{screenModes:[...this._screenModes]})}async _save(e,t={}){let n=this._actions;if(!n||!this.chart||this._saving)return;this._open=!1,this._saving=!0,this._setStatus(null),this._saveAbort=new AbortController;let r=D(this.chart),i={signal:this._saveAbort.signal};try{let a;if(e.kind===`create`&&n.create)a=await n.create(r,t,i);else if(e.kind===`variant`&&n.addToVariant)a=await n.addToVariant(e.original,r,{...t,name:e.name},i);else if(e.kind===`add`)a=await n.add(e.dashboard,r,t,i)||e.dashboard;else return;if(i.signal.aborted)return;this._setStatus({kind:`success`,dashboard:a,isVariant:e.kind===`variant`||e.kind===`add`&&e.isVariant,openDashboard:n.openDashboard?.bind(n)}),this._dispatch(`luzmo-chart-added`,{dashboard:a})}catch(e){if(i.signal.aborted)return;console.error(`Failed to add the chart to a dashboard:`,e),this._setStatus({kind:`error`,message:e instanceof Error&&e.message?e.message:void 0}),this._dispatch(`luzmo-chart-add-failed`,{error:e})}finally{this._saving=!1}await this.updateComplete,this.isConnected&&this._isFocusLost()&&this._focusTrigger()}_setStatus(e){this._status=e}_focusTrigger(){this._triggerElement?.focus()}_isFocusLost(){return!document.activeElement||document.activeElement===document.body}async _handleNoticeClose(e){e.stopPropagation();let t=e.currentTarget.matches(`:focus-within`);this._setStatus(null),await this.updateComplete,t&&this._isFocusLost()&&this._focusTrigger()}async _focusStep(){let e=this._step===`list`?this._searchElement:this._backElement;await e?.updateComplete,e?.focus()}_renderRow(e){return s.html`
       <luzmo-menu-item value=${e.id} no-wrap ?disabled=${this._saving}>
         ${e.thumbnailUrl?s.html`<img slot="icon" class="thumbnail" alt="" src=${e.thumbnailUrl} />`:s.nothing}
         ${this._displayName(e)}