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

package/react/components/display-settings-numeric.component.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { createComponent, EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoDisplaySettingsNumeric as LuzmoDisplaySettingsNumericClass, DisplaySettingsSlotContentChangedEventDetail } from '@luzmo/analytics-components-kit/display-settings-numeric';
+
+const LuzmoDisplaySettingsNumericComponent = createComponent({
+  tagName: 'luzmo-display-settings-numeric',
+  elementClass: LuzmoDisplaySettingsNumericClass,
+  react: React,
+  events: {
+    onLuzmoSlotContentChanged: 'luzmo-slot-content-changed' as EventName<CustomEvent<DisplaySettingsSlotContentChangedEventDetail>>
+  }
+});
+
+/**
+ * React wrapper for <luzmo-display-settings-numeric>
+ *
+ * @event onLuzmoSlotContentChanged - Event that is fired when the slot content is changed
+ */
+export const LuzmoDisplaySettingsNumeric = LuzmoDisplaySettingsNumericComponent as ReactWebComponent<
+  LuzmoDisplaySettingsNumericClass,
+  {
+    onLuzmoSlotContentChanged: EventName<CustomEvent<DisplaySettingsSlotContentChangedEventDetail>>;
+  }
+>;
+
+/** The underlying custom element type for LuzmoDisplaySettingsNumeric */
+export type LuzmoDisplaySettingsNumericElement = LuzmoDisplaySettingsNumericClass;

package/react/components/display-settings-period-over-period.component.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { createComponent, EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoDisplaySettingsPeriodOverPeriod as LuzmoDisplaySettingsPeriodOverPeriodClass, DisplaySettingsSlotContentChangedEventDetail } from '@luzmo/analytics-components-kit/display-settings-period-over-period';
+
+const LuzmoDisplaySettingsPeriodOverPeriodComponent = createComponent({
+  tagName: 'luzmo-display-settings-period-over-period',
+  elementClass: LuzmoDisplaySettingsPeriodOverPeriodClass,
+  react: React,
+  events: {
+    onLuzmoSlotContentChanged: 'luzmo-slot-content-changed' as EventName<CustomEvent<DisplaySettingsSlotContentChangedEventDetail>>
+  }
+});
+
+/**
+ * React wrapper for <luzmo-display-settings-period-over-period>
+ *
+ * @event onLuzmoSlotContentChanged - Event that is fired when the slot content is changed
+ */
+export const LuzmoDisplaySettingsPeriodOverPeriod = LuzmoDisplaySettingsPeriodOverPeriodComponent as ReactWebComponent<
+  LuzmoDisplaySettingsPeriodOverPeriodClass,
+  {
+    onLuzmoSlotContentChanged: EventName<CustomEvent<DisplaySettingsSlotContentChangedEventDetail>>;
+  }
+>;
+
+/** The underlying custom element type for LuzmoDisplaySettingsPeriodOverPeriod */
+export type LuzmoDisplaySettingsPeriodOverPeriodElement = LuzmoDisplaySettingsPeriodOverPeriodClass;

package/react/components/display-settings.component.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { createComponent, EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoDisplaySettings as LuzmoDisplaySettingsClass, DisplaySettingsRemoveSlotContentEventDetail, DisplaySettingsSlotContentChangedEventDetail, InfoVisibilityChangedEventDetail } from '@luzmo/analytics-components-kit/display-settings';
+
+const LuzmoDisplaySettingsComponent = createComponent({
+  tagName: 'luzmo-display-settings',
+  elementClass: LuzmoDisplaySettingsClass,
+  react: React,
+  events: {
+    onLuzmoSlotContentChanged: 'luzmo-slot-content-changed' as EventName<CustomEvent<DisplaySettingsSlotContentChangedEventDetail>>,
+    onLuzmoRemoveSlotContent: 'luzmo-remove-slot-content' as EventName<CustomEvent<DisplaySettingsRemoveSlotContentEventDetail>>,
+    onLuzmoInfoVisibilityChanged: 'luzmo-info-visibility-changed' as EventName<CustomEvent<InfoVisibilityChangedEventDetail>>
+  }
+});
+
+/**
+ * React wrapper for <luzmo-display-settings>
+ *
+ * @event onLuzmoSlotContentChanged - Event that is fired when the slot content is changed
+ * @event onLuzmoRemoveSlotContent - Event that is fired when the remove button is clicked
+ * @event onLuzmoInfoVisibilityChanged - Event that is fired when the info button is clicked, includes the visibility state and ID values
+ */
+export const LuzmoDisplaySettings = LuzmoDisplaySettingsComponent as ReactWebComponent<
+  LuzmoDisplaySettingsClass,
+  {
+    onLuzmoSlotContentChanged: EventName<CustomEvent<DisplaySettingsSlotContentChangedEventDetail>>;
+    onLuzmoRemoveSlotContent: EventName<CustomEvent<DisplaySettingsRemoveSlotContentEventDetail>>;
+    onLuzmoInfoVisibilityChanged: EventName<CustomEvent<InfoVisibilityChangedEventDetail>>;
+  }
+>;
+
+/** The underlying custom element type for LuzmoDisplaySettings */
+export type LuzmoDisplaySettingsElement = LuzmoDisplaySettingsClass;

package/react/components/filter-expression-picker.component.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { createComponent, EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoFilterExpressionPicker as LuzmoFilterExpressionPickerClass } from '@luzmo/analytics-components-kit/filter-expression-picker';
+
+const LuzmoFilterExpressionPickerComponent = createComponent({
+  tagName: 'luzmo-filter-expression-picker',
+  elementClass: LuzmoFilterExpressionPickerClass,
+  react: React,
+  events: {
+    onLuzmoExpressionSelected: 'luzmo-expression-selected' as EventName<CustomEvent>
+  }
+});
+
+/**
+ * React wrapper for <luzmo-filter-expression-picker>
+ *
+ * @event onLuzmoExpressionSelected - Fired when the user selects a filter expression (operator); `detail.expression` holds the chosen expression.
+ */
+export const LuzmoFilterExpressionPicker = LuzmoFilterExpressionPickerComponent as ReactWebComponent<
+  LuzmoFilterExpressionPickerClass,
+  {
+    onLuzmoExpressionSelected: EventName<CustomEvent>;
+  }
+>;
+
+/** The underlying custom element type for LuzmoFilterExpressionPicker */
+export type LuzmoFilterExpressionPickerElement = LuzmoFilterExpressionPickerClass;

package/react/components/filter-item.component.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { createComponent, EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoFilterItem as LuzmoFilterItemClass } from '@luzmo/analytics-components-kit/filter-item';
+
+const LuzmoFilterItemComponent = createComponent({
+  tagName: 'luzmo-filter-item',
+  elementClass: LuzmoFilterItemClass,
+  react: React,
+  events: {
+    onLuzmoFilterChanged: 'luzmo-filter-changed' as EventName<CustomEvent>
+  }
+});
+
+/**
+ * React wrapper for <luzmo-filter-item>
+ *
+ * @event onLuzmoFilterChanged - Fired when any part of the filter changes; `detail.filter` holds the updated filter.
+ */
+export const LuzmoFilterItem = LuzmoFilterItemComponent as ReactWebComponent<
+  LuzmoFilterItemClass,
+  {
+    onLuzmoFilterChanged: EventName<CustomEvent>;
+  }
+>;
+
+/** The underlying custom element type for LuzmoFilterItem */
+export type LuzmoFilterItemElement = LuzmoFilterItemClass;

package/react/components/filter-parameter-picker.component.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { createComponent, EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoFilterParameterPicker as LuzmoFilterParameterPickerClass, FilterParameterPickerEventDetail } from '@luzmo/analytics-components-kit/filter-parameter-picker';
+
+const LuzmoFilterParameterPickerComponent = createComponent({
+  tagName: 'luzmo-filter-parameter-picker',
+  elementClass: LuzmoFilterParameterPickerClass,
+  react: React,
+  events: {
+    onLuzmoParameterSelected: 'luzmo-parameter-selected' as EventName<CustomEvent<FilterParameterPickerEventDetail>>,
+    onLuzmoParameterCreated: 'luzmo-parameter-created' as EventName<CustomEvent<FilterParameterPickerEventDetail>>,
+    onLuzmoParameterRemoved: 'luzmo-parameter-removed' as EventName<CustomEvent<FilterParameterPickerEventDetail>>
+  }
+});
+
+/**
+ * React wrapper for <luzmo-filter-parameter-picker>
+ *
+ * @event onLuzmoParameterSelected - Fired when a parameter is selected.
+ * @event onLuzmoParameterCreated - Fired when a parameter is created.
+ * @event onLuzmoParameterRemoved - Fired when a parameter is detached from the filter.
+ */
+export const LuzmoFilterParameterPicker = LuzmoFilterParameterPickerComponent as ReactWebComponent<
+  LuzmoFilterParameterPickerClass,
+  {
+    onLuzmoParameterSelected: EventName<CustomEvent<FilterParameterPickerEventDetail>>;
+    onLuzmoParameterCreated: EventName<CustomEvent<FilterParameterPickerEventDetail>>;
+    onLuzmoParameterRemoved: EventName<CustomEvent<FilterParameterPickerEventDetail>>;
+  }
+>;
+
+/** The underlying custom element type for LuzmoFilterParameterPicker */
+export type LuzmoFilterParameterPickerElement = LuzmoFilterParameterPickerClass;

package/react/components/filter-value-picker-datetime.component.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { createComponent, EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoFilterValuePickerDatetime as LuzmoFilterValuePickerDatetimeClass } from '@luzmo/analytics-components-kit/filter-value-picker-datetime';
+
+const LuzmoFilterValuePickerDatetimeComponent = createComponent({
+  tagName: 'luzmo-filter-value-picker-datetime',
+  elementClass: LuzmoFilterValuePickerDatetimeClass,
+  react: React,
+  events: {
+    onLuzmoFilterValueChanged: 'luzmo-filter-value-changed' as EventName<CustomEvent>
+  }
+});
+
+/**
+ * React wrapper for <luzmo-filter-value-picker-datetime>
+ *
+ * @event onLuzmoFilterValueChanged - Fired when the datetime filter value changes; `detail.value` holds the new value (ISO date or relative range).
+ */
+export const LuzmoFilterValuePickerDatetime = LuzmoFilterValuePickerDatetimeComponent as ReactWebComponent<
+  LuzmoFilterValuePickerDatetimeClass,
+  {
+    onLuzmoFilterValueChanged: EventName<CustomEvent>;
+  }
+>;
+
+/** The underlying custom element type for LuzmoFilterValuePickerDatetime */
+export type LuzmoFilterValuePickerDatetimeElement = LuzmoFilterValuePickerDatetimeClass;

package/react/components/filter-value-picker-hierarchy.component.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { createComponent, EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoFilterValuePickerHierarchy as LuzmoFilterValuePickerHierarchyClass } from '@luzmo/analytics-components-kit/filter-value-picker-hierarchy';
+
+const LuzmoFilterValuePickerHierarchyComponent = createComponent({
+  tagName: 'luzmo-filter-value-picker-hierarchy',
+  elementClass: LuzmoFilterValuePickerHierarchyClass,
+  react: React,
+  events: {
+    onLuzmoFilterValueChanged: 'luzmo-filter-value-changed' as EventName<CustomEvent>
+  }
+});
+
+/**
+ * React wrapper for <luzmo-filter-value-picker-hierarchy>
+ *
+ * @event onLuzmoFilterValueChanged - Fired when the hierarchy filter value changes; `detail.value` holds the selected value(s).
+ */
+export const LuzmoFilterValuePickerHierarchy = LuzmoFilterValuePickerHierarchyComponent as ReactWebComponent<
+  LuzmoFilterValuePickerHierarchyClass,
+  {
+    onLuzmoFilterValueChanged: EventName<CustomEvent>;
+  }
+>;
+
+/** The underlying custom element type for LuzmoFilterValuePickerHierarchy */
+export type LuzmoFilterValuePickerHierarchyElement = LuzmoFilterValuePickerHierarchyClass;

package/react/components/filter-value-picker-numeric.component.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { createComponent, EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoFilterValuePickerNumeric as LuzmoFilterValuePickerNumericClass } from '@luzmo/analytics-components-kit/filter-value-picker-numeric';
+
+const LuzmoFilterValuePickerNumericComponent = createComponent({
+  tagName: 'luzmo-filter-value-picker-numeric',
+  elementClass: LuzmoFilterValuePickerNumericClass,
+  react: React,
+  events: {
+    onLuzmoFilterValueChanged: 'luzmo-filter-value-changed' as EventName<CustomEvent>
+  }
+});
+
+/**
+ * React wrapper for <luzmo-filter-value-picker-numeric>
+ *
+ * @event onLuzmoFilterValueChanged - Fired when the numeric filter value changes; `detail.value` holds the new number or range.
+ */
+export const LuzmoFilterValuePickerNumeric = LuzmoFilterValuePickerNumericComponent as ReactWebComponent<
+  LuzmoFilterValuePickerNumericClass,
+  {
+    onLuzmoFilterValueChanged: EventName<CustomEvent>;
+  }
+>;
+
+/** The underlying custom element type for LuzmoFilterValuePickerNumeric */
+export type LuzmoFilterValuePickerNumericElement = LuzmoFilterValuePickerNumericClass;

package/react/components/filter-value-picker.component.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { createComponent, EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoFilterValuePicker as LuzmoFilterValuePickerClass } from '@luzmo/analytics-components-kit/filter-value-picker';
+
+const LuzmoFilterValuePickerComponent = createComponent({
+  tagName: 'luzmo-filter-value-picker',
+  elementClass: LuzmoFilterValuePickerClass,
+  react: React,
+  events: {
+    onLuzmoFilterValueChanged: 'luzmo-filter-value-changed' as EventName<CustomEvent>
+  }
+});
+
+/**
+ * React wrapper for <luzmo-filter-value-picker>
+ *
+ * @event onLuzmoFilterValueChanged - Fired when the filter value changes; `detail.value` holds the new value.
+ */
+export const LuzmoFilterValuePicker = LuzmoFilterValuePickerComponent as ReactWebComponent<
+  LuzmoFilterValuePickerClass,
+  {
+    onLuzmoFilterValueChanged: EventName<CustomEvent>;
+  }
+>;
+
+/** The underlying custom element type for LuzmoFilterValuePicker */
+export type LuzmoFilterValuePickerElement = LuzmoFilterValuePickerClass;

package/react/components/filters.component.ts

@@ -1,25 +1,31 @@
 import React from 'react';
 import { createComponent, EventName, ReactWebComponent } from '@lit/react';
-import { LuzmoFilters as LuzmoFiltersClass, FiltersChangedEventDetail } from '@luzmo/analytics-components-kit/filters';
+import { LuzmoFilters as LuzmoFiltersClass, FilterParameter, FiltersChangedEventDetail } from '@luzmo/analytics-components-kit/filters';
 
 const LuzmoFiltersComponent = createComponent({
   tagName: 'luzmo-filters',
   elementClass: LuzmoFiltersClass,
   react: React,
   events: {
-    onLuzmoFiltersChanged: 'luzmo-filters-changed' as EventName<CustomEvent<FiltersChangedEventDetail>>
+    onLuzmoFiltersChanged: 'luzmo-filters-changed' as EventName<CustomEvent<FiltersChangedEventDetail>>,
+    onLuzmoParameterCreated: 'luzmo-parameter-created' as EventName<CustomEvent<{ parameter: FilterParameter }>>,
+    onLuzmoParameterRemoved: 'luzmo-parameter-removed' as EventName<CustomEvent<{ parameter: FilterParameter }>>
   }
 });
 
 /**
  * React wrapper for <luzmo-filters>
  *
- * @event onLuzmoFiltersChanged - Announces that the filters have changed
+ * @event onLuzmoFiltersChanged - Announces that the filters have changed, carrying the emitted groups and the format they are in
+ * @event onLuzmoParameterCreated - Announces that a parameter was created and added to `parameters`.
+ * @event onLuzmoParameterRemoved - Announces that a parameter was detached from a filter.
  */
 export const LuzmoFilters = LuzmoFiltersComponent as ReactWebComponent<
   LuzmoFiltersClass,
   {
     onLuzmoFiltersChanged: EventName<CustomEvent<FiltersChangedEventDetail>>;
+    onLuzmoParameterCreated: EventName<CustomEvent<{ parameter: FilterParameter }>>;
+    onLuzmoParameterRemoved: EventName<CustomEvent<{ parameter: FilterParameter }>>;
   }
 >;
 

package/react/components/formula-field.component.ts

@@ -0,0 +1,30 @@
+import React from 'react';
+import { createComponent, EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoFormulaField as LuzmoFormulaFieldClass } from '@luzmo/analytics-components-kit/formula-field';
+
+const LuzmoFormulaFieldComponent = createComponent({
+  tagName: 'luzmo-formula-field',
+  elementClass: LuzmoFormulaFieldClass,
+  react: React,
+  events: {
+    onLuzmoExpressionChanged: 'luzmo-expression-changed' as EventName<CustomEvent>,
+    onLuzmoDatasetsError: 'luzmo-datasets-error' as EventName<CustomEvent>
+  }
+});
+
+/**
+ * React wrapper for <luzmo-formula-field>
+ *
+ * @event onLuzmoExpressionChanged - Fired (debounced) when the expression changes (only when not readonly).
+ * @event onLuzmoDatasetsError - Fired when fetching datasets by id fails.
+ */
+export const LuzmoFormulaField = LuzmoFormulaFieldComponent as ReactWebComponent<
+  LuzmoFormulaFieldClass,
+  {
+    onLuzmoExpressionChanged: EventName<CustomEvent>;
+    onLuzmoDatasetsError: EventName<CustomEvent>;
+  }
+>;
+
+/** The underlying custom element type for LuzmoFormulaField */
+export type LuzmoFormulaFieldElement = LuzmoFormulaFieldClass;

package/react/components/interactive-viz-item.component.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { createComponent, EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoInteractiveVizItem as LuzmoInteractiveVizItemClass, InteractiveVizItemChartChangedEventDetail, InteractiveVizItemChartOptionsChangedEventDetail, InteractiveVizItemFeedbackChangedEventDetail } from '@luzmo/analytics-components-kit/interactive-viz-item';
+
+const LuzmoInteractiveVizItemComponent = createComponent({
+  tagName: 'luzmo-interactive-viz-item',
+  elementClass: LuzmoInteractiveVizItemClass,
+  react: React,
+  events: {
+    onLuzmoChartOptionsChanged: 'luzmo-chart-options-changed' as EventName<CustomEvent<InteractiveVizItemChartOptionsChangedEventDetail>>,
+    onLuzmoChartChanged: 'luzmo-chart-changed' as EventName<CustomEvent<InteractiveVizItemChartChangedEventDetail>>,
+    onLuzmoFeedbackChanged: 'luzmo-feedback-changed' as EventName<CustomEvent<InteractiveVizItemFeedbackChangedEventDetail>>
+  }
+});
+
+/**
+ * React wrapper for <luzmo-interactive-viz-item>
+ *
+ * @event onLuzmoChartOptionsChanged - Fired when the inline actions (ranking, sort, display mode) change the chart options.
+ * @event onLuzmoChartChanged - Fired when the config panel changes slots, filters, or options (full chart).
+ * @event onLuzmoFeedbackChanged - Fired when the user changes the thumbs up/down rating.
+ */
+export const LuzmoInteractiveVizItem = LuzmoInteractiveVizItemComponent as ReactWebComponent<
+  LuzmoInteractiveVizItemClass,
+  {
+    onLuzmoChartOptionsChanged: EventName<CustomEvent<InteractiveVizItemChartOptionsChangedEventDetail>>;
+    onLuzmoChartChanged: EventName<CustomEvent<InteractiveVizItemChartChangedEventDetail>>;
+    onLuzmoFeedbackChanged: EventName<CustomEvent<InteractiveVizItemFeedbackChangedEventDetail>>;
+  }
+>;
+
+/** The underlying custom element type for LuzmoInteractiveVizItem */
+export type LuzmoInteractiveVizItemElement = LuzmoInteractiveVizItemClass;

package/react/components/item-option-guidelines.component.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { createComponent, EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoItemOptionGuidelines as LuzmoItemOptionGuidelinesClass, ItemOptionChangedEventDetail } from '@luzmo/analytics-components-kit/item-option-guidelines';
+
+const LuzmoItemOptionGuidelinesComponent = createComponent({
+  tagName: 'luzmo-item-option-guidelines',
+  elementClass: LuzmoItemOptionGuidelinesClass,
+  react: React,
+  events: {
+    onLuzmoOptionChanged: 'luzmo-option-changed' as EventName<CustomEvent<ItemOptionChangedEventDetail>>
+  }
+});
+
+/**
+ * React wrapper for <luzmo-item-option-guidelines>
+ *
+ * @event onLuzmoOptionChanged - Emitted when the guidelines value changes.
+ */
+export const LuzmoItemOptionGuidelines = LuzmoItemOptionGuidelinesComponent as ReactWebComponent<
+  LuzmoItemOptionGuidelinesClass,
+  {
+    onLuzmoOptionChanged: EventName<CustomEvent<ItemOptionChangedEventDetail>>;
+  }
+>;
+
+/** The underlying custom element type for LuzmoItemOptionGuidelines */
+export type LuzmoItemOptionGuidelinesElement = LuzmoItemOptionGuidelinesClass;

package/react/components/slot-menu-list.component.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { createComponent, EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoSlotMenuList as LuzmoSlotMenuListClass, SlotListChangedEventDetail } from '@luzmo/analytics-components-kit/slot-menu-list';
+
+const LuzmoSlotMenuListComponent = createComponent({
+  tagName: 'luzmo-slot-menu-list',
+  elementClass: LuzmoSlotMenuListClass,
+  react: React,
+  events: {
+    onLuzmoSlotListChanged: 'luzmo-slot-list-changed' as EventName<CustomEvent<SlotListChangedEventDetail>>
+  }
+});
+
+/**
+ * React wrapper for <luzmo-slot-menu-list>
+ *
+ * @event onLuzmoSlotListChanged - Emitted when the slot list changes
+ */
+export const LuzmoSlotMenuList = LuzmoSlotMenuListComponent as ReactWebComponent<
+  LuzmoSlotMenuListClass,
+  {
+    onLuzmoSlotListChanged: EventName<CustomEvent<SlotListChangedEventDetail>>;
+  }
+>;
+
+/** The underlying custom element type for LuzmoSlotMenuList */
+export type LuzmoSlotMenuListElement = LuzmoSlotMenuListClass;

package/react/components/slot-menu.component.ts

@@ -0,0 +1,42 @@
+import React from 'react';
+import { createComponent, EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoSlotMenu as LuzmoSlotMenuClass, InfoVisibilityChangedEventDetail, SlotContentsChangedEventDetail, SlotMenuActiveEventDetail, SlotMenuHighlightEventDetail } from '@luzmo/analytics-components-kit/slot-menu';
+
+const LuzmoSlotMenuComponent = createComponent({
+  tagName: 'luzmo-slot-menu',
+  elementClass: LuzmoSlotMenuClass,
+  react: React,
+  events: {
+    onLuzmoSlotContentsChanged: 'luzmo-slot-contents-changed' as EventName<CustomEvent<SlotContentsChangedEventDetail>>,
+    onLuzmoClose: 'luzmo-close' as EventName<CustomEvent<void>>,
+    onLuzmoSlotMenuActive: 'luzmo-slot-menu-active' as EventName<CustomEvent<SlotMenuActiveEventDetail>>,
+    onLuzmoSlotMenuHighlight: 'luzmo-slot-menu-highlight' as EventName<CustomEvent<SlotMenuHighlightEventDetail>>,
+    onLuzmoSlotMenuInactive: 'luzmo-slot-menu-inactive' as EventName<CustomEvent>,
+    onLuzmoInfoVisibilityChanged: 'luzmo-info-visibility-changed' as EventName<CustomEvent<InfoVisibilityChangedEventDetail>>
+  }
+});
+
+/**
+ * React wrapper for <luzmo-slot-menu>
+ *
+ * @event onLuzmoSlotContentsChanged - Emitted when the slot contents change
+ * @event onLuzmoClose - Emitted when the slot menu is closed
+ * @event onLuzmoSlotMenuActive - Emitted when the slot menu becomes active for a dataset
+ * @event onLuzmoSlotMenuHighlight - Emitted to highlight a column or formula in the slot menu
+ * @event onLuzmoSlotMenuInactive - Emitted when the menu becomes inactive.
+ * @event onLuzmoInfoVisibilityChanged - Event that is fired when the info button is clicked in display-settings, includes the visibility state and ID values
+ */
+export const LuzmoSlotMenu = LuzmoSlotMenuComponent as ReactWebComponent<
+  LuzmoSlotMenuClass,
+  {
+    onLuzmoSlotContentsChanged: EventName<CustomEvent<SlotContentsChangedEventDetail>>;
+    onLuzmoClose: EventName<CustomEvent<void>>;
+    onLuzmoSlotMenuActive: EventName<CustomEvent<SlotMenuActiveEventDetail>>;
+    onLuzmoSlotMenuHighlight: EventName<CustomEvent<SlotMenuHighlightEventDetail>>;
+    onLuzmoSlotMenuInactive: EventName<CustomEvent>;
+    onLuzmoInfoVisibilityChanged: EventName<CustomEvent<InfoVisibilityChangedEventDetail>>;
+  }
+>;
+
+/** The underlying custom element type for LuzmoSlotMenu */
+export type LuzmoSlotMenuElement = LuzmoSlotMenuClass;

package/react/components/viz-item-menu.component.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { createComponent, EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoVizItemMenu as LuzmoVizItemMenuClass, VizItemMenuButtonClickedEventDetail, VizItemMenuSelectedChangedEventDetail } from '@luzmo/analytics-components-kit/viz-item-menu';
+
+const LuzmoVizItemMenuComponent = createComponent({
+  tagName: 'luzmo-viz-item-menu',
+  elementClass: LuzmoVizItemMenuClass,
+  react: React,
+  events: {
+    onSelectedChanged: 'selected-changed' as EventName<CustomEvent<VizItemMenuSelectedChangedEventDetail>>,
+    onButtonClicked: 'button-clicked' as EventName<CustomEvent<VizItemMenuButtonClickedEventDetail>>,
+    onEditButtonHovered: 'edit-button-hovered' as EventName<CustomEvent<void>>
+  }
+});
+
+/**
+ * React wrapper for <luzmo-viz-item-menu>
+ *
+ * @event onSelectedChanged - Emitted when the selected button changes
+ * @event onButtonClicked - Emitted when any menu item is clicked
+ * @event onEditButtonHovered - Emitted when hovering over the edit button
+ */
+export const LuzmoVizItemMenu = LuzmoVizItemMenuComponent as ReactWebComponent<
+  LuzmoVizItemMenuClass,
+  {
+    onSelectedChanged: EventName<CustomEvent<VizItemMenuSelectedChangedEventDetail>>;
+    onButtonClicked: EventName<CustomEvent<VizItemMenuButtonClickedEventDetail>>;
+    onEditButtonHovered: EventName<CustomEvent<void>>;
+  }
+>;
+
+/** The underlying custom element type for LuzmoVizItemMenu */
+export type LuzmoVizItemMenuElement = LuzmoVizItemMenuClass;

package/react/esm/components/ai-chat.component.d.ts

@@ -0,0 +1,24 @@
+import { EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoAiChat as LuzmoAiChatClass, AiChatCompleteEvent, AiChatConversationIdChangedEventDetail, AiChatDatasetsChangedEventDetail, AiChatMessageSentEventDetail, AiChatStepEvent, AssistantMessageActionEventDetail } from '@luzmo/analytics-components-kit/ai-chat';
+/**
+ * React wrapper for <luzmo-ai-chat>
+ *
+ * @event onLuzmoMessageSent - Fired when a user sends a message
+ * @event onLuzmoDatasetsChanged - Fired when the selected datasets change
+ * @event onLuzmoStep - Fired for every incremental, kit-assembled event during a streamed response (decision, text, progress, dashboard-title/layout/item, chart, interrupt, plus forward-by-default unrecognized chunks). Use `isRecognizedStep` to narrow.
+ * @event onLuzmoComplete - Fired exactly once per response with the authoritative final result (dashboard/chart/name) or an `error`.
+ * @event onLuzmoStop - Fired when an in-flight prompt is stopped Custom actions beyond built-in `ChatMessage.actions` buttons can be projected via the `assistant-message-actions` light-DOM slot on the latest assistant message.
+ * @event onLuzmoConversationIdChanged - Fired when the conversation ID is updated from the API
+ * @event onLuzmoAssistantMessageAction - Fired when a built-in assistant message action is activated (after confirmation when `confirm` is set)
+ */
+export declare const LuzmoAiChat: ReactWebComponent<LuzmoAiChatClass, {
+    onLuzmoMessageSent: EventName<CustomEvent<AiChatMessageSentEventDetail>>;
+    onLuzmoDatasetsChanged: EventName<CustomEvent<AiChatDatasetsChangedEventDetail>>;
+    onLuzmoStep: EventName<CustomEvent<AiChatStepEvent>>;
+    onLuzmoComplete: EventName<CustomEvent<AiChatCompleteEvent>>;
+    onLuzmoStop: EventName<CustomEvent<void>>;
+    onLuzmoConversationIdChanged: EventName<CustomEvent<AiChatConversationIdChangedEventDetail>>;
+    onLuzmoAssistantMessageAction: EventName<CustomEvent<AssistantMessageActionEventDetail>>;
+}>;
+/** The underlying custom element type for LuzmoAiChat */
+export type LuzmoAiChatElement = LuzmoAiChatClass;

package/react/esm/components/ai-chat.component.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import { createComponent } from '@lit/react';
+import { LuzmoAiChat as LuzmoAiChatClass } from '@luzmo/analytics-components-kit/ai-chat';
+const LuzmoAiChatComponent = createComponent({
+    tagName: 'luzmo-ai-chat',
+    elementClass: LuzmoAiChatClass,
+    react: React,
+    events: {
+        onLuzmoMessageSent: 'luzmo-message-sent',
+        onLuzmoDatasetsChanged: 'luzmo-datasets-changed',
+        onLuzmoStep: 'luzmo-step',
+        onLuzmoComplete: 'luzmo-complete',
+        onLuzmoStop: 'luzmo-stop',
+        onLuzmoConversationIdChanged: 'luzmo-conversation-id-changed',
+        onLuzmoAssistantMessageAction: 'luzmo-assistant-message-action'
+    }
+});
+/**
+ * React wrapper for <luzmo-ai-chat>
+ *
+ * @event onLuzmoMessageSent - Fired when a user sends a message
+ * @event onLuzmoDatasetsChanged - Fired when the selected datasets change
+ * @event onLuzmoStep - Fired for every incremental, kit-assembled event during a streamed response (decision, text, progress, dashboard-title/layout/item, chart, interrupt, plus forward-by-default unrecognized chunks). Use `isRecognizedStep` to narrow.
+ * @event onLuzmoComplete - Fired exactly once per response with the authoritative final result (dashboard/chart/name) or an `error`.
+ * @event onLuzmoStop - Fired when an in-flight prompt is stopped Custom actions beyond built-in `ChatMessage.actions` buttons can be projected via the `assistant-message-actions` light-DOM slot on the latest assistant message.
+ * @event onLuzmoConversationIdChanged - Fired when the conversation ID is updated from the API
+ * @event onLuzmoAssistantMessageAction - Fired when a built-in assistant message action is activated (after confirmation when `confirm` is set)
+ */
+export const LuzmoAiChat = LuzmoAiChatComponent;

package/react/esm/components/ai-interaction-textarea.component.d.ts

@@ -0,0 +1,14 @@
+import { EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoAiInteractionTextarea as LuzmoAiInteractionTextareaClass, PromptSubmittedEventDetail } from '@luzmo/analytics-components-kit/ai-interaction-textarea';
+/**
+ * React wrapper for <luzmo-ai-interaction-textarea>
+ *
+ * @event onPromptSubmitted - Fired when a prompt is submitted with selected datasets
+ * @event onPromptStopped - Fired when a running prompt is stopped
+ */
+export declare const LuzmoAiInteractionTextarea: ReactWebComponent<LuzmoAiInteractionTextareaClass, {
+    onPromptSubmitted: EventName<CustomEvent<PromptSubmittedEventDetail>>;
+    onPromptStopped: EventName<CustomEvent<void>>;
+}>;
+/** The underlying custom element type for LuzmoAiInteractionTextarea */
+export type LuzmoAiInteractionTextareaElement = LuzmoAiInteractionTextareaClass;

package/react/esm/components/ai-interaction-textarea.component.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import { createComponent } from '@lit/react';
+import { LuzmoAiInteractionTextarea as LuzmoAiInteractionTextareaClass } from '@luzmo/analytics-components-kit/ai-interaction-textarea';
+const LuzmoAiInteractionTextareaComponent = createComponent({
+    tagName: 'luzmo-ai-interaction-textarea',
+    elementClass: LuzmoAiInteractionTextareaClass,
+    react: React,
+    events: {
+        onPromptSubmitted: 'prompt-submitted',
+        onPromptStopped: 'prompt-stopped'
+    }
+});
+/**
+ * React wrapper for <luzmo-ai-interaction-textarea>
+ *
+ * @event onPromptSubmitted - Fired when a prompt is submitted with selected datasets
+ * @event onPromptStopped - Fired when a running prompt is stopped
+ */
+export const LuzmoAiInteractionTextarea = LuzmoAiInteractionTextareaComponent;

package/react/esm/components/data-field-level.component.d.ts

@@ -0,0 +1,14 @@
+import { EventName, ReactWebComponent } from '@lit/react';
+import { LuzmoDataFieldLevel as LuzmoDataFieldLevelClass, DataFieldDragStartedEventDetail, DataFieldDroppedEventDetail } from '@luzmo/analytics-components-kit/data-field-level';
+/**
+ * React wrapper for <luzmo-data-field-level>
+ *
+ * @event onLuzmoDataFieldDropped - Announces that the data field has been dropped
+ * @event onLuzmoDataFieldDragStarted - Announces that the drag is started on the data field
+ */
+export declare const LuzmoDataFieldLevel: ReactWebComponent<LuzmoDataFieldLevelClass, {
+    onLuzmoDataFieldDropped: EventName<CustomEvent<DataFieldDroppedEventDetail>>;
+    onLuzmoDataFieldDragStarted: EventName<CustomEvent<DataFieldDragStartedEventDetail>>;
+}>;
+/** The underlying custom element type for LuzmoDataFieldLevel */
+export type LuzmoDataFieldLevelElement = LuzmoDataFieldLevelClass;