@luzmo/analytics-components-kit 1.0.6 → 1.0.7

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

@@ -0,0 +1,86 @@
+import { OnChanges, SimpleChanges } from '@angular/core';
+import '@luzmo/analytics-components-kit/item-slot-picker';
+import type { LuzmoItemSlotPicker as LuzmoItemSlotPickerHostElement, SlotContentsChangedEventDetail } from '@luzmo/analytics-components-kit/item-slot-picker';
+import type { Placement } from '@floating-ui/dom';
+import type { DatasetsDataFields, SlotContent } from '@luzmo/analytics-components-kit/types';
+import type { SlotConfig, SlotName, VizItemType } from '@luzmo/dashboard-contents-types';
+import * as i0 from "@angular/core";
+export type { SlotContentsChangedEventDetail } from '@luzmo/analytics-components-kit/item-slot-picker';
+export declare class LuzmoItemSlotPicker implements OnChanges {
+    private readonly elementRef;
+    private readonly renderer;
+    private readonly destroyRef;
+    private readonly host;
+    private readonly listenerCleanup;
+    /** The underlying custom element instance. Use to call imperative methods. */
+    get nativeElement(): LuzmoItemSlotPickerHostElement;
+    /** The API URL for the databroker */
+    apiUrl?: string;
+    /** The API key to fetch the columns */
+    authKey?: string;
+    /** The API token to fetch the columns */
+    authToken?: string;
+    /** The type of the item */
+    itemType?: VizItemType | string;
+    /** The name of the slot */
+    slotName?: SlotName;
+    /** (Optional) The configuration of the slot, overrides the slot configuration loaded from the item type & slot name. */
+    slotConfiguration?: SlotConfig;
+    /** The contents of the slot */
+    slotContents?: SlotContent[];
+    /** The language to use for locale-aware formatting and labels of data fields */
+    contentLanguage?: string;
+    /** Whether the picker is disabled */
+    disabled?: boolean;
+    /** Whether the picker grows to full width */
+    grows?: boolean;
+    /** The type of config interaction */
+    menu?: 'default' | 'draggable' | 'event-only';
+    /** Whether the picker has a label */
+    hasLabel?: boolean;
+    /** The label for the picker, if hasLabel is true */
+    label?: string;
+    /** Whether the picker allows single or multiple selections. Only relevant if the slot configuration allows multiple data fields. */
+    selects?: 'single' | 'multiple';
+    /** Where to show icons */
+    icons?: 'none' | 'menu-only' | 'all';
+    /** The placeholder text for the picker is no value selected. */
+    placeholder?: string;
+    /** The datasets and their dataFields to display */
+    datasetsDataFields?: DatasetsDataFields[];
+    /** Placement of the data-fields-select dropdown */
+    placement?: Placement;
+    /** Placement of the slot menu popover. Only relevant for 'popup' and 'draggable' menu type */
+    slotMenuPlacement?: Placement;
+    /** Whether to hide the configuration button */
+    hideConfiguration?: boolean;
+    /** Whether to hide the clear button op a select */
+    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 */
+    readonly luzmoSlotContentsChanged: import("@angular/core").OutputEmitterRef<CustomEvent<SlotContentsChangedEventDetail>>;
+    constructor();
+    ngOnChanges(changes: SimpleChanges): void;
+    /**
+     * Forward a wrapper @Input to the underlying host element via Renderer2 so
+     * the wrapper stays compatible with non-DOM Angular platforms (SSR, tests).
+     * Unlike a "skip undefined" guard, this lets consumers reset values back to
+     * undefined / null by clearing their bindings.
+     */
+    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; }; "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 ngAcceptInputType_disabled: unknown;
+    static ngAcceptInputType_grows: unknown;
+    static ngAcceptInputType_hasLabel: unknown;
+    static ngAcceptInputType_hideConfiguration: unknown;
+    static ngAcceptInputType_hideClear: unknown;
+}
+/** The underlying custom element type for LuzmoItemSlotPicker */
+export type LuzmoItemSlotPickerElement = LuzmoItemSlotPickerHostElement;

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

@@ -0,0 +1,259 @@
+import { booleanAttribute, ChangeDetectionStrategy, Component, DestroyRef, ElementRef, inject, Input, output, Renderer2 } from '@angular/core';
+import '@luzmo/analytics-components-kit/item-slot-picker';
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+/**
+ * Angular wrapper component for <luzmo-item-slot-picker>
+ */
+export class LuzmoItemSlotPicker {
+    elementRef = inject(ElementRef);
+    renderer = inject(Renderer2);
+    destroyRef = inject(DestroyRef);
+    host = this.elementRef.nativeElement;
+    listenerCleanup = [];
+    /** The underlying custom element instance. Use to call imperative methods. */
+    get nativeElement() {
+        return this.host;
+    }
+    /** The API URL for the databroker */
+    apiUrl;
+    /** The API key to fetch the columns */
+    authKey;
+    /** The API token to fetch the columns */
+    authToken;
+    /** The type of the item */
+    itemType;
+    /** The name of the slot */
+    slotName;
+    /** (Optional) The configuration of the slot, overrides the slot configuration loaded from the item type & slot name. */
+    slotConfiguration;
+    /** The contents of the slot */
+    slotContents;
+    /** The language to use for locale-aware formatting and labels of data fields */
+    contentLanguage;
+    /** Whether the picker is disabled */
+    disabled;
+    /** Whether the picker grows to full width */
+    grows;
+    /** The type of config interaction */
+    menu;
+    /** Whether the picker has a label */
+    hasLabel;
+    /** The label for the picker, if hasLabel is true */
+    label;
+    /** Whether the picker allows single or multiple selections. Only relevant if the slot configuration allows multiple data fields. */
+    selects;
+    /** Where to show icons */
+    icons;
+    /** The placeholder text for the picker is no value selected. */
+    placeholder;
+    /** The datasets and their dataFields to display */
+    datasetsDataFields;
+    /** Placement of the data-fields-select dropdown */
+    placement;
+    /** Placement of the slot menu popover. Only relevant for 'popup' and 'draggable' menu type */
+    slotMenuPlacement;
+    /** Whether to hide the configuration button */
+    hideConfiguration;
+    /** Whether to hide the clear button op a select */
+    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 */
+    luzmoSlotContentsChanged = output({ alias: 'luzmoSlotContentsChanged' });
+    constructor() {
+        this.bindEvents();
+        this.destroyRef.onDestroy(() => {
+            for (const cleanup of this.listenerCleanup) {
+                cleanup();
+            }
+        });
+    }
+    ngOnChanges(changes) {
+        for (const key of Object.keys(changes)) {
+            switch (key) {
+                case 'apiUrl':
+                    this.setHostProperty('apiUrl', changes['apiUrl'].currentValue);
+                    break;
+                case 'authKey':
+                    this.setHostProperty('authKey', changes['authKey'].currentValue);
+                    break;
+                case 'authToken':
+                    this.setHostProperty('authToken', changes['authToken'].currentValue);
+                    break;
+                case 'itemType':
+                    this.setHostProperty('itemType', changes['itemType'].currentValue);
+                    break;
+                case 'slotName':
+                    this.setHostProperty('slotName', changes['slotName'].currentValue);
+                    break;
+                case 'slotConfiguration':
+                    this.setHostProperty('slotConfiguration', changes['slotConfiguration'].currentValue);
+                    break;
+                case 'slotContents':
+                    this.setHostProperty('slotContents', changes['slotContents'].currentValue);
+                    break;
+                case 'contentLanguage':
+                    this.setHostProperty('contentLanguage', changes['contentLanguage'].currentValue);
+                    break;
+                case 'disabled':
+                    this.setHostProperty('disabled', changes['disabled'].currentValue);
+                    break;
+                case 'grows':
+                    this.setHostProperty('grows', changes['grows'].currentValue);
+                    break;
+                case 'menu':
+                    this.setHostProperty('menu', changes['menu'].currentValue);
+                    break;
+                case 'hasLabel':
+                    this.setHostProperty('hasLabel', changes['hasLabel'].currentValue);
+                    break;
+                case 'label':
+                    this.setHostProperty('label', changes['label'].currentValue);
+                    break;
+                case 'selects':
+                    this.setHostProperty('selects', changes['selects'].currentValue);
+                    break;
+                case 'icons':
+                    this.setHostProperty('icons', changes['icons'].currentValue);
+                    break;
+                case 'placeholder':
+                    this.setHostProperty('placeholder', changes['placeholder'].currentValue);
+                    break;
+                case 'datasetsDataFields':
+                    this.setHostProperty('datasetsDataFields', changes['datasetsDataFields'].currentValue);
+                    break;
+                case 'placement':
+                    this.setHostProperty('placement', changes['placement'].currentValue);
+                    break;
+                case 'slotMenuPlacement':
+                    this.setHostProperty('slotMenuPlacement', changes['slotMenuPlacement'].currentValue);
+                    break;
+                case 'hideConfiguration':
+                    this.setHostProperty('hideConfiguration', changes['hideConfiguration'].currentValue);
+                    break;
+                case 'hideClear':
+                    this.setHostProperty('hideClear', changes['hideClear'].currentValue);
+                    break;
+                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;
+                default:
+                    break;
+            }
+        }
+    }
+    /**
+     * Forward a wrapper @Input to the underlying host element via Renderer2 so
+     * the wrapper stays compatible with non-DOM Angular platforms (SSR, tests).
+     * Unlike a "skip undefined" guard, this lets consumers reset values back to
+     * undefined / null by clearing their bindings.
+     */
+    setHostProperty(key, value) {
+        this.renderer.setProperty(this.host, key, value);
+    }
+    bindEvents() {
+        this.listenerCleanup.push(this.renderer.listen(this.host, 'luzmo-slot-contents-changed', (event) => {
+            const typed = event;
+            this.luzmoSlotContentsChanged.emit(typed);
+        }));
+    }
+    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", 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) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵprojection(0);
+        } }, encapsulation: 2 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LuzmoItemSlotPicker, [{
+        type: Component,
+        args: [{
+                selector: 'luzmo-item-slot-picker',
+                exportAs: 'luzmoItemSlotPicker',
+                standalone: true,
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                template: '<ng-content />'
+            }]
+    }], () => [], { apiUrl: [{
+            type: Input,
+            args: [{ alias: 'apiUrl' }]
+        }], authKey: [{
+            type: Input,
+            args: [{ alias: 'authKey' }]
+        }], authToken: [{
+            type: Input,
+            args: [{ alias: 'authToken' }]
+        }], itemType: [{
+            type: Input,
+            args: [{ alias: 'itemType' }]
+        }], slotName: [{
+            type: Input,
+            args: [{ alias: 'slotName' }]
+        }], slotConfiguration: [{
+            type: Input,
+            args: [{ alias: 'slotConfiguration' }]
+        }], slotContents: [{
+            type: Input,
+            args: [{ alias: 'slotContents' }]
+        }], contentLanguage: [{
+            type: Input,
+            args: [{ alias: 'contentLanguage' }]
+        }], disabled: [{
+            type: Input,
+            args: [{ alias: 'disabled', transform: booleanAttribute }]
+        }], grows: [{
+            type: Input,
+            args: [{ alias: 'grows', transform: booleanAttribute }]
+        }], menu: [{
+            type: Input,
+            args: [{ alias: 'menu' }]
+        }], hasLabel: [{
+            type: Input,
+            args: [{ alias: 'hasLabel', transform: booleanAttribute }]
+        }], label: [{
+            type: Input,
+            args: [{ alias: 'label' }]
+        }], selects: [{
+            type: Input,
+            args: [{ alias: 'selects' }]
+        }], icons: [{
+            type: Input,
+            args: [{ alias: 'icons' }]
+        }], placeholder: [{
+            type: Input,
+            args: [{ alias: 'placeholder' }]
+        }], datasetsDataFields: [{
+            type: Input,
+            args: [{ alias: 'datasetsDataFields' }]
+        }], placement: [{
+            type: Input,
+            args: [{ alias: 'placement' }]
+        }], slotMenuPlacement: [{
+            type: Input,
+            args: [{ alias: 'slotMenuPlacement' }]
+        }], hideConfiguration: [{
+            type: Input,
+            args: [{ alias: 'hideConfiguration', transform: booleanAttribute }]
+        }], hideClear: [{
+            type: Input,
+            args: [{ alias: 'hideClear', transform: booleanAttribute }]
+        }], language: [{
+            type: Input,
+            args: [{ alias: 'language' }]
+        }], search: [{
+            type: Input,
+            args: [{ alias: 'search' }]
+        }], size: [{
+            type: Input,
+            args: [{ alias: 'size' }]
+        }], luzmoSlotContentsChanged: [{ type: i0.Output, args: ["luzmoSlotContentsChanged"] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoItemSlotPicker, { className: "LuzmoItemSlotPicker", filePath: "components/item-slot-picker.ts", lineNumber: 19 }); })();

package/angular/esm/components/slot-menu-list.d.ts

@@ -0,0 +1,46 @@
+import { OnChanges, SimpleChanges } from '@angular/core';
+import '@luzmo/analytics-components-kit/slot-menu-list';
+import type { LuzmoSlotMenuList as LuzmoSlotMenuListHostElement, SlotListChangedEventDetail } from '@luzmo/analytics-components-kit/slot-menu-list';
+import type { SlotContent } from '@luzmo/analytics-components-kit/types';
+import type { SlotName } from '@luzmo/dashboard-contents-types';
+import * as i0 from "@angular/core";
+export type { SlotListChangedEventDetail } from '@luzmo/analytics-components-kit/slot-menu-list';
+export declare class LuzmoSlotMenuList implements OnChanges {
+    private readonly elementRef;
+    private readonly renderer;
+    private readonly destroyRef;
+    private readonly host;
+    private readonly listenerCleanup;
+    /** The underlying custom element instance. Use to call imperative methods. */
+    get nativeElement(): LuzmoSlotMenuListHostElement;
+    /** The language of the settings interface */
+    language?: string;
+    /** The language to use for locale-aware formatting and labels */
+    contentLanguage?: string;
+    /** The list of slot contents (columns/formulas) shown in the reorderable list. */
+    slotContents?: SlotContent[];
+    /** The containing slot name used to identify measure calculations. */
+    slotName?: SlotName;
+    /** The containing slot type used to identify measure calculations. */
+    slotType?: string;
+    /** Index of the currently active/selected slot content. */
+    activeIndex?: number;
+    /** The size of the element */
+    size?: 's' | 'm' | 'l' | 'xl';
+    /** Emitted when the slot list changes */
+    readonly luzmoSlotListChanged: import("@angular/core").OutputEmitterRef<CustomEvent<SlotListChangedEventDetail>>;
+    constructor();
+    ngOnChanges(changes: SimpleChanges): void;
+    /**
+     * Forward a wrapper @Input to the underlying host element via Renderer2 so
+     * the wrapper stays compatible with non-DOM Angular platforms (SSR, tests).
+     * Unlike a "skip undefined" guard, this lets consumers reset values back to
+     * undefined / null by clearing their bindings.
+     */
+    private setHostProperty;
+    private bindEvents;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LuzmoSlotMenuList, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoSlotMenuList, "luzmo-slot-menu-list", ["luzmoSlotMenuList"], { "language": { "alias": "language"; "required": false; }; "contentLanguage": { "alias": "contentLanguage"; "required": false; }; "slotContents": { "alias": "slotContents"; "required": false; }; "slotName": { "alias": "slotName"; "required": false; }; "slotType": { "alias": "slotType"; "required": false; }; "activeIndex": { "alias": "activeIndex"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, { "luzmoSlotListChanged": "luzmoSlotListChanged"; }, never, ["*"], true, never>;
+}
+/** The underlying custom element type for LuzmoSlotMenuList */
+export type LuzmoSlotMenuListElement = LuzmoSlotMenuListHostElement;

package/angular/esm/components/slot-menu-list.js

@@ -0,0 +1,123 @@
+import { ChangeDetectionStrategy, Component, DestroyRef, ElementRef, inject, Input, output, Renderer2 } from '@angular/core';
+import '@luzmo/analytics-components-kit/slot-menu-list';
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+/**
+ * Angular wrapper component for <luzmo-slot-menu-list>
+ */
+export class LuzmoSlotMenuList {
+    elementRef = inject(ElementRef);
+    renderer = inject(Renderer2);
+    destroyRef = inject(DestroyRef);
+    host = this.elementRef.nativeElement;
+    listenerCleanup = [];
+    /** The underlying custom element instance. Use to call imperative methods. */
+    get nativeElement() {
+        return this.host;
+    }
+    /** The language of the settings interface */
+    language;
+    /** The language to use for locale-aware formatting and labels */
+    contentLanguage;
+    /** The list of slot contents (columns/formulas) shown in the reorderable list. */
+    slotContents;
+    /** The containing slot name used to identify measure calculations. */
+    slotName;
+    /** The containing slot type used to identify measure calculations. */
+    slotType;
+    /** Index of the currently active/selected slot content. */
+    activeIndex;
+    /** The size of the element */
+    size;
+    /** Emitted when the slot list changes */
+    luzmoSlotListChanged = output({ alias: 'luzmoSlotListChanged' });
+    constructor() {
+        this.bindEvents();
+        this.destroyRef.onDestroy(() => {
+            for (const cleanup of this.listenerCleanup) {
+                cleanup();
+            }
+        });
+    }
+    ngOnChanges(changes) {
+        for (const key of Object.keys(changes)) {
+            switch (key) {
+                case 'language':
+                    this.setHostProperty('language', changes['language'].currentValue);
+                    break;
+                case 'contentLanguage':
+                    this.setHostProperty('contentLanguage', changes['contentLanguage'].currentValue);
+                    break;
+                case 'slotContents':
+                    this.setHostProperty('slotContents', changes['slotContents'].currentValue);
+                    break;
+                case 'slotName':
+                    this.setHostProperty('slotName', changes['slotName'].currentValue);
+                    break;
+                case 'slotType':
+                    this.setHostProperty('slotType', changes['slotType'].currentValue);
+                    break;
+                case 'activeIndex':
+                    this.setHostProperty('activeIndex', changes['activeIndex'].currentValue);
+                    break;
+                case 'size':
+                    this.setHostProperty('size', changes['size'].currentValue);
+                    break;
+                default:
+                    break;
+            }
+        }
+    }
+    /**
+     * Forward a wrapper @Input to the underlying host element via Renderer2 so
+     * the wrapper stays compatible with non-DOM Angular platforms (SSR, tests).
+     * Unlike a "skip undefined" guard, this lets consumers reset values back to
+     * undefined / null by clearing their bindings.
+     */
+    setHostProperty(key, value) {
+        this.renderer.setProperty(this.host, key, value);
+    }
+    bindEvents() {
+        this.listenerCleanup.push(this.renderer.listen(this.host, 'luzmo-slot-list-changed', (event) => {
+            const typed = event;
+            this.luzmoSlotListChanged.emit(typed);
+        }));
+    }
+    static ɵfac = function LuzmoSlotMenuList_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoSlotMenuList)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoSlotMenuList, selectors: [["luzmo-slot-menu-list"]], inputs: { language: "language", contentLanguage: "contentLanguage", slotContents: "slotContents", slotName: "slotName", slotType: "slotType", activeIndex: "activeIndex", size: "size" }, outputs: { luzmoSlotListChanged: "luzmoSlotListChanged" }, exportAs: ["luzmoSlotMenuList"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoSlotMenuList_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵprojection(0);
+        } }, encapsulation: 2 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LuzmoSlotMenuList, [{
+        type: Component,
+        args: [{
+                selector: 'luzmo-slot-menu-list',
+                exportAs: 'luzmoSlotMenuList',
+                standalone: true,
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                template: '<ng-content />'
+            }]
+    }], () => [], { language: [{
+            type: Input,
+            args: [{ alias: 'language' }]
+        }], contentLanguage: [{
+            type: Input,
+            args: [{ alias: 'contentLanguage' }]
+        }], slotContents: [{
+            type: Input,
+            args: [{ alias: 'slotContents' }]
+        }], slotName: [{
+            type: Input,
+            args: [{ alias: 'slotName' }]
+        }], slotType: [{
+            type: Input,
+            args: [{ alias: 'slotType' }]
+        }], activeIndex: [{
+            type: Input,
+            args: [{ alias: 'activeIndex' }]
+        }], size: [{
+            type: Input,
+            args: [{ alias: 'size' }]
+        }], luzmoSlotListChanged: [{ type: i0.Output, args: ["luzmoSlotListChanged"] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoSlotMenuList, { className: "LuzmoSlotMenuList", filePath: "components/slot-menu-list.ts", lineNumber: 18 }); })();

package/angular/esm/components/slot-menu.d.ts

@@ -0,0 +1,104 @@
+import { OnChanges, SimpleChanges } from '@angular/core';
+import '@luzmo/analytics-components-kit/slot-menu';
+import type { LuzmoSlotMenu as LuzmoSlotMenuHostElement, InfoVisibilityChangedEventDetail, MeasureColumnsItem, SlotContentsChangedEventDetail, SlotMenuActiveEventDetail, SlotMenuHighlightEventDetail } from '@luzmo/analytics-components-kit/slot-menu';
+import type { DatasetDataFields } from '@luzmo/analytics-components-kit/data-field-panel';
+import type { LuzmoDisplaySettings } from '@luzmo/analytics-components-kit/display-settings';
+import type { LuzmoSlotMenuList } from '@luzmo/analytics-components-kit/slot-menu-list';
+import type { SlotContent } from '@luzmo/analytics-components-kit/types';
+import type { SlotName, VizItemType } from '@luzmo/dashboard-contents-types';
+import * as i0 from "@angular/core";
+export type { InfoVisibilityChangedEventDetail, MeasureColumnsItem, SlotContentChangedEventDetail, SlotContentsChangedEventDetail, SlotListChangedEventDetail, SlotMenuActiveEventDetail, SlotMenuHighlightEventDetail } from '@luzmo/analytics-components-kit/slot-menu';
+export declare class LuzmoSlotMenu implements OnChanges {
+    private readonly elementRef;
+    private readonly renderer;
+    private readonly destroyRef;
+    private readonly host;
+    private readonly listenerCleanup;
+    /** The underlying custom element instance. Use to call imperative methods. */
+    get nativeElement(): LuzmoSlotMenuHostElement;
+    /** The language of the settings interface */
+    language?: string;
+    /** The language to use for locale-aware formatting and labels */
+    contentLanguage?: string;
+    /** The slot type */
+    slotType?: 'numeric' | 'categorical' | 'mixed';
+    /** The name of the slot being edited. */
+    slotName?: SlotName;
+    /** The visualization item type that provides slot and option configuration. */
+    itemType?: VizItemType;
+    /** Whether to show the drag handle and allow dragging */
+    noDrag?: boolean;
+    /** Whether to show the close button */
+    noClose?: boolean;
+    /** The variant to show */
+    variant?: 'popup' | 'draggable' | 'default';
+    /** Whether to show the top menu label & delete button */
+    noTopMenuLabel?: boolean;
+    /** CSS selector for the boundary element that constrains dragging of the menu. */
+    dragBoundary?: string;
+    /** Whether grand-totals options are available for this slot. */
+    areGrandTotalsEnabled?: boolean;
+    /** Whether datetime display options are available for this slot. */
+    areDatetimeOptionsEnabled?: boolean;
+    /** Whether numeric binning options are hidden for this slot. */
+    isBinningDisabled?: boolean;
+    /** Whether aggregation options are hidden for this slot. */
+    isAggregationDisabled?: boolean;
+    /** Whether cumulative-sum options are available for this slot. */
+    isCumulativeSumEnabled?: boolean;
+    /** The contents (columns/formulas) assigned to this slot. */
+    slotContents?: SlotContent[];
+    /** Measure columns available for rate aggregation. */
+    measureColumns?: MeasureColumnsItem[];
+    /** (Optional) If you only want to display a specific content of a slot, you can set the slotIndex to the index of the content you want to display. */
+    slotIndex?: number;
+    /** Reference to the rendered display-settings element. */
+    displaySettingsElement?: LuzmoDisplaySettings;
+    /** Reference to the rendered slot-menu-list element. */
+    slotMenuListElement?: LuzmoSlotMenuList;
+    /** The API URL of the databroker */
+    apiUrl?: string;
+    /** The auth key of the databroker */
+    authKey?: string;
+    /** The auth token of the databroker */
+    authToken?: string;
+    /** Datasets used to resolve column names in ad-hoc calculation previews. */
+    datasetsDataFields?: DatasetDataFields[];
+    /** The size of the element */
+    size?: 's' | 'm' | 'l' | 'xl';
+    /** Emitted when the slot contents change */
+    readonly luzmoSlotContentsChanged: import("@angular/core").OutputEmitterRef<CustomEvent<SlotContentsChangedEventDetail>>;
+    /** Emitted when the slot menu is closed */
+    readonly luzmoClose: import("@angular/core").OutputEmitterRef<CustomEvent<void>>;
+    /** Emitted when the slot menu becomes active for a dataset */
+    readonly luzmoSlotMenuActive: import("@angular/core").OutputEmitterRef<CustomEvent<SlotMenuActiveEventDetail>>;
+    /** Emitted to highlight a column or formula in the slot menu */
+    readonly luzmoSlotMenuHighlight: import("@angular/core").OutputEmitterRef<CustomEvent<SlotMenuHighlightEventDetail>>;
+    /** Emitted when the menu becomes inactive. */
+    readonly luzmoSlotMenuInactive: import("@angular/core").OutputEmitterRef<CustomEvent<unknown>>;
+    /** Event that is fired when the info button is clicked in display-settings, includes the visibility state and ID values */
+    readonly luzmoInfoVisibilityChanged: import("@angular/core").OutputEmitterRef<CustomEvent<InfoVisibilityChangedEventDetail>>;
+    constructor();
+    ngOnChanges(changes: SimpleChanges): void;
+    /**
+     * Forward a wrapper @Input to the underlying host element via Renderer2 so
+     * the wrapper stays compatible with non-DOM Angular platforms (SSR, tests).
+     * Unlike a "skip undefined" guard, this lets consumers reset values back to
+     * undefined / null by clearing their bindings.
+     */
+    private setHostProperty;
+    private bindEvents;
+    close(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LuzmoSlotMenu, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoSlotMenu, "luzmo-slot-menu", ["luzmoSlotMenu"], { "language": { "alias": "language"; "required": false; }; "contentLanguage": { "alias": "contentLanguage"; "required": false; }; "slotType": { "alias": "slotType"; "required": false; }; "slotName": { "alias": "slotName"; "required": false; }; "itemType": { "alias": "itemType"; "required": false; }; "noDrag": { "alias": "noDrag"; "required": false; }; "noClose": { "alias": "noClose"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "noTopMenuLabel": { "alias": "noTopMenuLabel"; "required": false; }; "dragBoundary": { "alias": "dragBoundary"; "required": false; }; "areGrandTotalsEnabled": { "alias": "areGrandTotalsEnabled"; "required": false; }; "areDatetimeOptionsEnabled": { "alias": "areDatetimeOptionsEnabled"; "required": false; }; "isBinningDisabled": { "alias": "isBinningDisabled"; "required": false; }; "isAggregationDisabled": { "alias": "isAggregationDisabled"; "required": false; }; "isCumulativeSumEnabled": { "alias": "isCumulativeSumEnabled"; "required": false; }; "slotContents": { "alias": "slotContents"; "required": false; }; "measureColumns": { "alias": "measureColumns"; "required": false; }; "slotIndex": { "alias": "slotIndex"; "required": false; }; "displaySettingsElement": { "alias": "displaySettingsElement"; "required": false; }; "slotMenuListElement": { "alias": "slotMenuListElement"; "required": false; }; "apiUrl": { "alias": "apiUrl"; "required": false; }; "authKey": { "alias": "authKey"; "required": false; }; "authToken": { "alias": "authToken"; "required": false; }; "datasetsDataFields": { "alias": "datasetsDataFields"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, { "luzmoSlotContentsChanged": "luzmoSlotContentsChanged"; "luzmoClose": "luzmoClose"; "luzmoSlotMenuActive": "luzmoSlotMenuActive"; "luzmoSlotMenuHighlight": "luzmoSlotMenuHighlight"; "luzmoSlotMenuInactive": "luzmoSlotMenuInactive"; "luzmoInfoVisibilityChanged": "luzmoInfoVisibilityChanged"; }, never, ["*"], true, never>;
+    static ngAcceptInputType_noDrag: unknown;
+    static ngAcceptInputType_noClose: unknown;
+    static ngAcceptInputType_noTopMenuLabel: unknown;
+    static ngAcceptInputType_areGrandTotalsEnabled: unknown;
+    static ngAcceptInputType_areDatetimeOptionsEnabled: unknown;
+    static ngAcceptInputType_isBinningDisabled: unknown;
+    static ngAcceptInputType_isAggregationDisabled: unknown;
+    static ngAcceptInputType_isCumulativeSumEnabled: unknown;
+}
+/** The underlying custom element type for LuzmoSlotMenu */
+export type LuzmoSlotMenuElement = LuzmoSlotMenuHostElement;