@luzmo/analytics-components-kit 1.0.8-beta.1 → 1.0.8-beta.2

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

@@ -1,299 +0,0 @@
-import { booleanAttribute, ChangeDetectionStrategy, Component, DestroyRef, ElementRef, inject, Input, OnChanges, output, Renderer2, SimpleChanges } from '@angular/core';
-import '@luzmo/analytics-components-kit/item-slot-picker-panel';
-import type { LuzmoItemSlotPickerPanel as LuzmoItemSlotPickerPanelHostElement, DatasetChangedEventDetail, DatasetConstraintTriggeredEventDetail, SlotConstraintTriggeredEventDetail, SlotsContentsChangedEventDetail } from '@luzmo/analytics-components-kit/item-slot-picker-panel';
-export type { DatasetChangedEventDetail, DatasetConstraintTriggeredEventDetail, SlotConstraintTriggeredEventDetail, SlotsContentsChangedEventDetail } from '@luzmo/analytics-components-kit/item-slot-picker-panel';
-import type { Placement } from '@floating-ui/dom';
-import type { DatasetMetadata, DatasetsDataFields } from '@luzmo/analytics-components-kit/types';
-import type { SlotConfig, VizItemSlot, VizItemType } from '@luzmo/dashboard-contents-types';
-
-@Component({
-  selector: 'luzmo-item-slot-picker-panel',
-  exportAs: 'luzmoItemSlotPickerPanel',
-  standalone: true,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  template: '<ng-content />'
-})
-/**
- * Angular wrapper component for <luzmo-item-slot-picker-panel>
- */
-export class LuzmoItemSlotPickerPanel implements OnChanges {
-  private readonly elementRef = inject<ElementRef<LuzmoItemSlotPickerPanelHostElement>>(ElementRef);
-  private readonly renderer = inject<Renderer2>(Renderer2);
-  private readonly destroyRef = inject<DestroyRef>(DestroyRef);
-  private readonly host = this.elementRef.nativeElement;
-  private readonly listenerCleanup: Array<() => void> = [];
-
-  /** The underlying custom element instance. Use to call imperative methods. */
-  get nativeElement(): LuzmoItemSlotPickerPanelHostElement {
-    return this.host;
-  }
-
-  /** The type of the item (e.g., 'bar-chart', 'line-chart', 'area-chart') */
-  @Input({ alias: 'itemType' })
-  itemType?: VizItemType | string;
-
-  /** The language to use for locale-aware formatting and labels */
-  @Input({ alias: 'contentLanguage' })
-  contentLanguage?: string;
-
-  /** Optional custom slots configuration (overrides loaded config) */
-  @Input({ alias: 'slotsConfiguration' })
-  slotsConfiguration?: SlotConfig[];
-
-  /** The contents of all slots */
-  @Input({ alias: 'slotsContents' })
-  slotsContents?: VizItemSlot[];
-
-  /** Whether the picker allows single or multiple selections per slot */
-  @Input({ alias: 'selects' })
-  selects?: 'single' | 'multiple';
-
-  /** Whether the search input is visible in data field pickers */
-  @Input({ alias: 'dataFieldsSearch' })
-  dataFieldsSearch?: 'on' | 'off' | 'auto';
-
-  /** Whether the search input is visible in the dataset picker */
-  @Input({ alias: 'datasetSearch' })
-  datasetSearch?: 'on' | 'off' | 'auto';
-
-  /** Where to show icons in pickers */
-  @Input({ alias: 'icons' })
-  icons?: 'none' | 'menu-only' | 'all';
-
-  /** The datasets and their dataFields to display in pickers. Takes preference over datasetIds when provided. */
-  @Input({ alias: 'datasetsDataFields' })
-  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. */
-  @Input({ alias: 'datasetIds' })
-  datasetIds?: string[];
-
-  /** The currently selected dataset ID. If not provided, defaults to the first available dataset. */
-  @Input({ alias: 'selectedDatasetId' })
-  selectedDatasetId?: string;
-
-  /** Whether to show the dataset picker dropdown. */
-  @Input({ alias: 'datasetPicker', transform: booleanAttribute })
-  datasetPicker?: boolean;
-
-  /** Custom label for the dataset picker field. Overrides the default "Dataset" label. */
-  @Input({ alias: 'datasetPickerLabel' })
-  datasetPickerLabel?: string;
-
-  /** The Luzmo API URL. Required when using datasetIds. */
-  @Input({ alias: 'apiUrl' })
-  apiUrl?: string;
-
-  /** Authentication key for the Luzmo API. Required when using datasetIds. */
-  @Input({ alias: 'authKey' })
-  authKey?: string;
-
-  /** Authentication token for the Luzmo API. Required when using datasetIds. */
-  @Input({ alias: 'authToken' })
-  authToken?: string;
-
-  /** Placement of the dataset picker and item slot picker popovers */
-  @Input({ alias: 'placement' })
-  placement?: Placement;
-
-  /** Placement of the slot menu popover */
-  @Input({ alias: 'slotMenuPlacement' })
-  slotMenuPlacement?: Placement;
-
-  /** Controls how slot constraints are handled - 'auto': Constraints are applied immediately (default) - 'event-only': Emit event with constraint details, let consumer decide */
-  @Input({ alias: 'constraintMode' })
-  constraintMode?: 'auto' | 'event-only';
-
-  /** Whether the pickers grow to full width */
-  @Input({ alias: 'grows', transform: booleanAttribute })
-  grows?: boolean;
-
-  /** The main container element */
-  @Input({ alias: 'container' })
-  container?: string;
-
-  /** The field label element above the dataset picker */
-  @Input({ alias: 'datasetFieldLabel' })
-  datasetfieldlabel?: string;
-
-  /** The main container for all slots */
-  @Input({ alias: 'slotsPanel' })
-  slotspanel?: string;
-
-  /** The container for each individual slot (label + picker) */
-  @Input({ alias: 'slotContainer' })
-  slotcontainer?: string;
-
-  /** The field label element above each slot */
-  @Input({ alias: 'fieldLabel' })
-  fieldlabel?: string;
-
-  /** The item slot picker element */
-  @Input({ alias: 'itemSlotPicker' })
-  itemslotpicker?: string;
-
-  /** The language for UI labels. Supported values: 'en', 'nl', 'fr', 'de', 'es' */
-  @Input({ alias: 'language' })
-  language?: string;
-
-  /** The size of the element */
-  @Input({ alias: 'size' })
-  size?: 's' | 'm' | 'l' | 'xl';
-
-  /** Emitted when constraint-mode is 'event-only' and dataset change would clear slots */
-  readonly luzmoDatasetConstraintTriggered = output<CustomEvent<DatasetConstraintTriggeredEventDetail>>({ alias: 'luzmoDatasetConstraintTriggered' });
-
-  /** Announces that the slots contents have changed */
-  readonly luzmoSlotsContentsChanged = output<CustomEvent<SlotsContentsChangedEventDetail>>({ alias: 'luzmoSlotsContentsChanged' });
-
-  /** Announces that the selected dataset has changed */
-  readonly luzmoDatasetChanged = output<CustomEvent<DatasetChangedEventDetail>>({ alias: 'luzmoDatasetChanged' });
-
-  /** Emitted when constraint-mode is 'event-only' and a change would trigger constraints */
-  readonly luzmoSlotConstraintTriggered = output<CustomEvent<SlotConstraintTriggeredEventDetail>>({ alias: 'luzmoSlotConstraintTriggered' });
-
-  constructor() {
-    this.bindEvents();
-    this.destroyRef.onDestroy(() => {
-      for (const cleanup of this.listenerCleanup) {
-        cleanup();
-      }
-    });
-  }
-
-  ngOnChanges(changes: SimpleChanges): void {
-    for (const key of Object.keys(changes)) {
-      switch (key) {
-        case 'itemType':
-          this.setHostProperty('itemType', changes['itemType'].currentValue);
-          break;
-        case 'contentLanguage':
-          this.setHostProperty('contentLanguage', changes['contentLanguage'].currentValue);
-          break;
-        case 'slotsConfiguration':
-          this.setHostProperty('slotsConfiguration', changes['slotsConfiguration'].currentValue);
-          break;
-        case 'slotsContents':
-          this.setHostProperty('slotsContents', changes['slotsContents'].currentValue);
-          break;
-        case 'selects':
-          this.setHostProperty('selects', changes['selects'].currentValue);
-          break;
-        case 'dataFieldsSearch':
-          this.setHostProperty('dataFieldsSearch', changes['dataFieldsSearch'].currentValue);
-          break;
-        case 'datasetSearch':
-          this.setHostProperty('datasetSearch', changes['datasetSearch'].currentValue);
-          break;
-        case 'icons':
-          this.setHostProperty('icons', changes['icons'].currentValue);
-          break;
-        case 'datasetsDataFields':
-          this.setHostProperty('datasetsDataFields', changes['datasetsDataFields'].currentValue);
-          break;
-        case 'datasetIds':
-          this.setHostProperty('datasetIds', changes['datasetIds'].currentValue);
-          break;
-        case 'selectedDatasetId':
-          this.setHostProperty('selectedDatasetId', changes['selectedDatasetId'].currentValue);
-          break;
-        case 'datasetPicker':
-          this.setHostProperty('datasetPicker', changes['datasetPicker'].currentValue);
-          break;
-        case 'datasetPickerLabel':
-          this.setHostProperty('datasetPickerLabel', changes['datasetPickerLabel'].currentValue);
-          break;
-        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 'placement':
-          this.setHostProperty('placement', changes['placement'].currentValue);
-          break;
-        case 'slotMenuPlacement':
-          this.setHostProperty('slotMenuPlacement', changes['slotMenuPlacement'].currentValue);
-          break;
-        case 'constraintMode':
-          this.setHostProperty('constraintMode', changes['constraintMode'].currentValue);
-          break;
-        case 'grows':
-          this.setHostProperty('grows', changes['grows'].currentValue);
-          break;
-        case 'container':
-          this.setHostProperty('container', changes['container'].currentValue);
-          break;
-        case 'datasetfieldlabel':
-          this.setHostProperty('dataset-field-label', changes['datasetfieldlabel'].currentValue);
-          break;
-        case 'slotspanel':
-          this.setHostProperty('slots-panel', changes['slotspanel'].currentValue);
-          break;
-        case 'slotcontainer':
-          this.setHostProperty('slot-container', changes['slotcontainer'].currentValue);
-          break;
-        case 'fieldlabel':
-          this.setHostProperty('field-label', changes['fieldlabel'].currentValue);
-          break;
-        case 'itemslotpicker':
-          this.setHostProperty('item-slot-picker', changes['itemslotpicker'].currentValue);
-          break;
-        case 'language':
-          this.setHostProperty('language', changes['language'].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.
-   */
-  private setHostProperty(key: string, value: unknown): void {
-    this.renderer.setProperty(this.host, key, value);
-  }
-
-  private bindEvents(): void {
-    this.listenerCleanup.push(
-      this.renderer.listen(this.host, 'luzmo-dataset-constraint-triggered', (event: Event) => {
-        const typed = event as CustomEvent<DatasetConstraintTriggeredEventDetail>;
-        this.luzmoDatasetConstraintTriggered.emit(typed);
-      })
-    );
-
-    this.listenerCleanup.push(
-      this.renderer.listen(this.host, 'luzmo-slots-contents-changed', (event: Event) => {
-        const typed = event as CustomEvent<SlotsContentsChangedEventDetail>;
-        this.luzmoSlotsContentsChanged.emit(typed);
-      })
-    );
-
-    this.listenerCleanup.push(
-      this.renderer.listen(this.host, 'luzmo-dataset-changed', (event: Event) => {
-        const typed = event as CustomEvent<DatasetChangedEventDetail>;
-        this.luzmoDatasetChanged.emit(typed);
-      })
-    );
-
-    this.listenerCleanup.push(
-      this.renderer.listen(this.host, 'luzmo-slot-constraint-triggered', (event: Event) => {
-        const typed = event as CustomEvent<SlotConstraintTriggeredEventDetail>;
-        this.luzmoSlotConstraintTriggered.emit(typed);
-      })
-    );
-  }
-}
-
-/** The underlying custom element type for LuzmoItemSlotPickerPanel */
-export type LuzmoItemSlotPickerPanelElement = LuzmoItemSlotPickerPanelHostElement;

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

@@ -1,241 +0,0 @@
-import { booleanAttribute, ChangeDetectionStrategy, Component, DestroyRef, ElementRef, inject, Input, OnChanges, output, Renderer2, 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';
-export type { 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';
-
-@Component({
-  selector: 'luzmo-item-slot-picker',
-  exportAs: 'luzmoItemSlotPicker',
-  standalone: true,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  template: '<ng-content />'
-})
-/**
- * Angular wrapper component for <luzmo-item-slot-picker>
- */
-export class LuzmoItemSlotPicker implements OnChanges {
-  private readonly elementRef = inject<ElementRef<LuzmoItemSlotPickerHostElement>>(ElementRef);
-  private readonly renderer = inject<Renderer2>(Renderer2);
-  private readonly destroyRef = inject<DestroyRef>(DestroyRef);
-  private readonly host = this.elementRef.nativeElement;
-  private readonly listenerCleanup: Array<() => void> = [];
-
-  /** The underlying custom element instance. Use to call imperative methods. */
-  get nativeElement(): LuzmoItemSlotPickerHostElement {
-    return this.host;
-  }
-
-  /** The API URL for the databroker */
-  @Input({ alias: 'apiUrl' })
-  apiUrl?: string;
-
-  /** The API key to fetch the columns */
-  @Input({ alias: 'authKey' })
-  authKey?: string;
-
-  /** The API token to fetch the columns */
-  @Input({ alias: 'authToken' })
-  authToken?: string;
-
-  /** The type of the item */
-  @Input({ alias: 'itemType' })
-  itemType?: VizItemType | string;
-
-  /** The name of the slot */
-  @Input({ alias: 'slotName' })
-  slotName?: SlotName;
-
-  /** (Optional) The configuration of the slot, overrides the slot configuration loaded from the item type & slot name. */
-  @Input({ alias: 'slotConfiguration' })
-  slotConfiguration?: SlotConfig;
-
-  /** The contents of the slot */
-  @Input({ alias: 'slotContents' })
-  slotContents?: SlotContent[];
-
-  /** The language to use for locale-aware formatting and labels of data fields */
-  @Input({ alias: 'contentLanguage' })
-  contentLanguage?: string;
-
-  /** Whether the picker is disabled */
-  @Input({ alias: 'disabled', transform: booleanAttribute })
-  disabled?: boolean;
-
-  /** Whether the picker grows to full width */
-  @Input({ alias: 'grows', transform: booleanAttribute })
-  grows?: boolean;
-
-  /** The type of config interaction */
-  @Input({ alias: 'menu' })
-  menu?: 'default' | 'draggable' | 'event-only';
-
-  /** Whether the picker has a label */
-  @Input({ alias: 'hasLabel', transform: booleanAttribute })
-  hasLabel?: boolean;
-
-  /** The label for the picker, if hasLabel is true */
-  @Input({ alias: 'label' })
-  label?: string;
-
-  /** Whether the picker allows single or multiple selections. Only relevant if the slot configuration allows multiple data fields. */
-  @Input({ alias: 'selects' })
-  selects?: 'single' | 'multiple';
-
-  /** Where to show icons */
-  @Input({ alias: 'icons' })
-  icons?: 'none' | 'menu-only' | 'all';
-
-  /** The placeholder text for the picker is no value selected. */
-  @Input({ alias: 'placeholder' })
-  placeholder?: string;
-
-  /** The datasets and their dataFields to display */
-  @Input({ alias: 'datasetsDataFields' })
-  datasetsDataFields?: DatasetsDataFields[];
-
-  /** Placement of the data-fields-select dropdown */
-  @Input({ alias: 'placement' })
-  placement?: Placement;
-
-  /** Placement of the slot menu popover. Only relevant for 'popup' and 'draggable' menu type */
-  @Input({ alias: 'slotMenuPlacement' })
-  slotMenuPlacement?: Placement;
-
-  /** Whether to hide the configuration button */
-  @Input({ alias: 'hideConfiguration', transform: booleanAttribute })
-  hideConfiguration?: boolean;
-
-  /** Whether to hide the clear button op a select */
-  @Input({ alias: 'hideClear', transform: booleanAttribute })
-  hideClear?: boolean;
-
-  /** The language for UI labels. Supported values: 'en', 'nl', 'fr', 'de', 'es' */
-  @Input({ alias: 'language' })
-  language?: string;
-
-  /** Whether the search input is visible: `on`, `off`, or `auto`. */
-  @Input({ alias: 'search' })
-  search?: 'on' | 'off' | 'auto';
-
-  /** The size of the element */
-  @Input({ alias: 'size' })
-  size?: 's' | 'm' | 'l' | 'xl';
-
-  /** Announces that the slot contents has changed */
-  readonly luzmoSlotContentsChanged = output<CustomEvent<SlotContentsChangedEventDetail>>({ alias: 'luzmoSlotContentsChanged' });
-
-  constructor() {
-    this.bindEvents();
-    this.destroyRef.onDestroy(() => {
-      for (const cleanup of this.listenerCleanup) {
-        cleanup();
-      }
-    });
-  }
-
-  ngOnChanges(changes: SimpleChanges): void {
-    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.
-   */
-  private setHostProperty(key: string, value: unknown): void {
-    this.renderer.setProperty(this.host, key, value);
-  }
-
-  private bindEvents(): void {
-    this.listenerCleanup.push(
-      this.renderer.listen(this.host, 'luzmo-slot-contents-changed', (event: Event) => {
-        const typed = event as CustomEvent<SlotContentsChangedEventDetail>;
-        this.luzmoSlotContentsChanged.emit(typed);
-      })
-    );
-  }
-}
-
-/** The underlying custom element type for LuzmoItemSlotPicker */
-export type LuzmoItemSlotPickerElement = LuzmoItemSlotPickerHostElement;

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

@@ -1,121 +0,0 @@
-import { ChangeDetectionStrategy, Component, DestroyRef, ElementRef, inject, Input, OnChanges, output, Renderer2, 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';
-export type { 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';
-
-@Component({
-  selector: 'luzmo-slot-menu-list',
-  exportAs: 'luzmoSlotMenuList',
-  standalone: true,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  template: '<ng-content />'
-})
-/**
- * Angular wrapper component for <luzmo-slot-menu-list>
- */
-export class LuzmoSlotMenuList implements OnChanges {
-  private readonly elementRef = inject<ElementRef<LuzmoSlotMenuListHostElement>>(ElementRef);
-  private readonly renderer = inject<Renderer2>(Renderer2);
-  private readonly destroyRef = inject<DestroyRef>(DestroyRef);
-  private readonly host = this.elementRef.nativeElement;
-  private readonly listenerCleanup: Array<() => void> = [];
-
-  /** The underlying custom element instance. Use to call imperative methods. */
-  get nativeElement(): LuzmoSlotMenuListHostElement {
-    return this.host;
-  }
-
-  /** The language of the settings interface */
-  @Input({ alias: 'language' })
-  language?: string;
-
-  /** The language to use for locale-aware formatting and labels */
-  @Input({ alias: 'contentLanguage' })
-  contentLanguage?: string;
-
-  /** The list of slot contents (columns/formulas) shown in the reorderable list. */
-  @Input({ alias: 'slotContents' })
-  slotContents?: SlotContent[];
-
-  /** The containing slot name used to identify measure calculations. */
-  @Input({ alias: 'slotName' })
-  slotName?: SlotName;
-
-  /** The containing slot type used to identify measure calculations. */
-  @Input({ alias: 'slotType' })
-  slotType?: string;
-
-  /** Index of the currently active/selected slot content. */
-  @Input({ alias: 'activeIndex' })
-  activeIndex?: number;
-
-  /** The size of the element */
-  @Input({ alias: 'size' })
-  size?: 's' | 'm' | 'l' | 'xl';
-
-  /** Emitted when the slot list changes */
-  readonly luzmoSlotListChanged = output<CustomEvent<SlotListChangedEventDetail>>({ alias: 'luzmoSlotListChanged' });
-
-  constructor() {
-    this.bindEvents();
-    this.destroyRef.onDestroy(() => {
-      for (const cleanup of this.listenerCleanup) {
-        cleanup();
-      }
-    });
-  }
-
-  ngOnChanges(changes: SimpleChanges): void {
-    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.
-   */
-  private setHostProperty(key: string, value: unknown): void {
-    this.renderer.setProperty(this.host, key, value);
-  }
-
-  private bindEvents(): void {
-    this.listenerCleanup.push(
-      this.renderer.listen(this.host, 'luzmo-slot-list-changed', (event: Event) => {
-        const typed = event as CustomEvent<SlotListChangedEventDetail>;
-        this.luzmoSlotListChanged.emit(typed);
-      })
-    );
-  }
-}
-
-/** The underlying custom element type for LuzmoSlotMenuList */
-export type LuzmoSlotMenuListElement = LuzmoSlotMenuListHostElement;