@ds-mo/ui 1.0.1 → 1.1.0

package/src/react/ds-empty-state.ts

@@ -0,0 +1,26 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsEmptyState as DsEmptyStateElement, defineCustomElement as defineDsEmptyState } from "@ds-mo/ui/dist/components/ds-empty-state.js";
+
+export type DsEmptyStateEvents = NonNullable<unknown>;
+
+export const DsEmptyState: StencilReactComponent<DsEmptyStateElement, DsEmptyStateEvents, Components.DsEmptyState> = /*@__PURE__*/ createComponent<DsEmptyStateElement, DsEmptyStateEvents, Components.DsEmptyState>({
+    tagName: 'ds-empty-state',
+    elementClass: DsEmptyStateElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {} as DsEmptyStateEvents,
+    defineCustomElement: defineDsEmptyState
+});

package/src/react/ds-fade.ts

@@ -0,0 +1,26 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsFade as DsFadeElement, defineCustomElement as defineDsFade } from "@ds-mo/ui/dist/components/ds-fade.js";
+
+export type DsFadeEvents = NonNullable<unknown>;
+
+export const DsFade: StencilReactComponent<DsFadeElement, DsFadeEvents, Components.DsFade> = /*@__PURE__*/ createComponent<DsFadeElement, DsFadeEvents, Components.DsFade>({
+    tagName: 'ds-fade',
+    elementClass: DsFadeElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {} as DsFadeEvents,
+    defineCustomElement: defineDsFade
+});

package/src/react/ds-field.ts

@@ -0,0 +1,26 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsField as DsFieldElement, defineCustomElement as defineDsField } from "@ds-mo/ui/dist/components/ds-field.js";
+
+export type DsFieldEvents = NonNullable<unknown>;
+
+export const DsField: StencilReactComponent<DsFieldElement, DsFieldEvents, Components.DsField> = /*@__PURE__*/ createComponent<DsFieldElement, DsFieldEvents, Components.DsField>({
+    tagName: 'ds-field',
+    elementClass: DsFieldElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {} as DsFieldEvents,
+    defineCustomElement: defineDsField
+});

package/src/react/ds-header.ts

@@ -0,0 +1,26 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsHeader as DsHeaderElement, defineCustomElement as defineDsHeader } from "@ds-mo/ui/dist/components/ds-header.js";
+
+export type DsHeaderEvents = NonNullable<unknown>;
+
+export const DsHeader: StencilReactComponent<DsHeaderElement, DsHeaderEvents, Components.DsHeader> = /*@__PURE__*/ createComponent<DsHeaderElement, DsHeaderEvents, Components.DsHeader>({
+    tagName: 'ds-header',
+    elementClass: DsHeaderElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {} as DsHeaderEvents,
+    defineCustomElement: defineDsHeader
+});

package/src/react/ds-icon.ts

@@ -0,0 +1,26 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsIcon as DsIconElement, defineCustomElement as defineDsIcon } from "@ds-mo/ui/dist/components/ds-icon.js";
+
+export type DsIconEvents = NonNullable<unknown>;
+
+export const DsIcon: StencilReactComponent<DsIconElement, DsIconEvents, Components.DsIcon> = /*@__PURE__*/ createComponent<DsIconElement, DsIconEvents, Components.DsIcon>({
+    tagName: 'ds-icon',
+    elementClass: DsIconElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {} as DsIconEvents,
+    defineCustomElement: defineDsIcon
+});

package/src/react/ds-input.ts

@@ -0,0 +1,33 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import { type DsInputCustomEvent } from "@ds-mo/ui";
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsInput as DsInputElement, defineCustomElement as defineDsInput } from "@ds-mo/ui/dist/components/ds-input.js";
+
+export type DsInputEvents = {
+    onDsChange: EventName<DsInputCustomEvent<string>>,
+    onDsClear: EventName<DsInputCustomEvent<void>>
+};
+
+export const DsInput: StencilReactComponent<DsInputElement, DsInputEvents, Components.DsInput> = /*@__PURE__*/ createComponent<DsInputElement, DsInputEvents, Components.DsInput>({
+    tagName: 'ds-input',
+    elementClass: DsInputElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onDsChange: 'dsChange',
+        onDsClear: 'dsClear'
+    } as DsInputEvents,
+    defineCustomElement: defineDsInput
+});

package/src/react/ds-label-wrap.ts

@@ -0,0 +1,26 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsLabelWrap as DsLabelWrapElement, defineCustomElement as defineDsLabelWrap } from "@ds-mo/ui/dist/components/ds-label-wrap.js";
+
+export type DsLabelWrapEvents = NonNullable<unknown>;
+
+export const DsLabelWrap: StencilReactComponent<DsLabelWrapElement, DsLabelWrapEvents, Components.DsLabelWrap> = /*@__PURE__*/ createComponent<DsLabelWrapElement, DsLabelWrapEvents, Components.DsLabelWrap>({
+    tagName: 'ds-label-wrap',
+    elementClass: DsLabelWrapElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {} as DsLabelWrapEvents,
+    defineCustomElement: defineDsLabelWrap
+});

package/src/react/ds-loader.ts

@@ -0,0 +1,26 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsLoader as DsLoaderElement, defineCustomElement as defineDsLoader } from "@ds-mo/ui/dist/components/ds-loader.js";
+
+export type DsLoaderEvents = NonNullable<unknown>;
+
+export const DsLoader: StencilReactComponent<DsLoaderElement, DsLoaderEvents, Components.DsLoader> = /*@__PURE__*/ createComponent<DsLoaderElement, DsLoaderEvents, Components.DsLoader>({
+    tagName: 'ds-loader',
+    elementClass: DsLoaderElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {} as DsLoaderEvents,
+    defineCustomElement: defineDsLoader
+});

package/src/react/ds-menu.ts

@@ -0,0 +1,33 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import { type DsMenuCustomEvent, type MenuItemData } from "@ds-mo/ui";
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsMenu as DsMenuElement, defineCustomElement as defineDsMenu } from "@ds-mo/ui/dist/components/ds-menu.js";
+
+export type DsMenuEvents = {
+    onDsClose: EventName<DsMenuCustomEvent<void>>,
+    onDsSelect: EventName<DsMenuCustomEvent<MenuItemData>>
+};
+
+export const DsMenu: StencilReactComponent<DsMenuElement, DsMenuEvents, Components.DsMenu> = /*@__PURE__*/ createComponent<DsMenuElement, DsMenuEvents, Components.DsMenu>({
+    tagName: 'ds-menu',
+    elementClass: DsMenuElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onDsClose: 'dsClose',
+        onDsSelect: 'dsSelect'
+    } as DsMenuEvents,
+    defineCustomElement: defineDsMenu
+});

package/src/react/ds-modal.ts

@@ -0,0 +1,27 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import { type DsModalCustomEvent } from "@ds-mo/ui";
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsModal as DsModalElement, defineCustomElement as defineDsModal } from "@ds-mo/ui/dist/components/ds-modal.js";
+
+export type DsModalEvents = { onDsClose: EventName<DsModalCustomEvent<void>> };
+
+export const DsModal: StencilReactComponent<DsModalElement, DsModalEvents, Components.DsModal> = /*@__PURE__*/ createComponent<DsModalElement, DsModalEvents, Components.DsModal>({
+    tagName: 'ds-modal',
+    elementClass: DsModalElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onDsClose: 'dsClose' } as DsModalEvents,
+    defineCustomElement: defineDsModal
+});

package/src/react/ds-pagination.ts

@@ -0,0 +1,27 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import { type DsPaginationCustomEvent } from "@ds-mo/ui";
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsPagination as DsPaginationElement, defineCustomElement as defineDsPagination } from "@ds-mo/ui/dist/components/ds-pagination.js";
+
+export type DsPaginationEvents = { onDsPageChange: EventName<DsPaginationCustomEvent<number>> };
+
+export const DsPagination: StencilReactComponent<DsPaginationElement, DsPaginationEvents, Components.DsPagination> = /*@__PURE__*/ createComponent<DsPaginationElement, DsPaginationEvents, Components.DsPagination>({
+    tagName: 'ds-pagination',
+    elementClass: DsPaginationElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onDsPageChange: 'dsPageChange' } as DsPaginationEvents,
+    defineCustomElement: defineDsPagination
+});

package/src/react/ds-panel-nav.ts

@@ -0,0 +1,37 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import { type DsPanelNavCustomEvent } from "@ds-mo/ui";
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsPanelNav as DsPanelNavElement, defineCustomElement as defineDsPanelNav } from "@ds-mo/ui/dist/components/ds-panel-nav.js";
+
+export type DsPanelNavEvents = {
+    onDsNavSelect: EventName<DsPanelNavCustomEvent<string>>,
+    onDsNavToggle: EventName<DsPanelNavCustomEvent<boolean>>,
+    onDsNavFooterAction: EventName<DsPanelNavCustomEvent<void>>,
+    onDsNavUserAction: EventName<DsPanelNavCustomEvent<void>>
+};
+
+export const DsPanelNav: StencilReactComponent<DsPanelNavElement, DsPanelNavEvents, Components.DsPanelNav> = /*@__PURE__*/ createComponent<DsPanelNavElement, DsPanelNavEvents, Components.DsPanelNav>({
+    tagName: 'ds-panel-nav',
+    elementClass: DsPanelNavElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onDsNavSelect: 'dsNavSelect',
+        onDsNavToggle: 'dsNavToggle',
+        onDsNavFooterAction: 'dsNavFooterAction',
+        onDsNavUserAction: 'dsNavUserAction'
+    } as DsPanelNavEvents,
+    defineCustomElement: defineDsPanelNav
+});

package/src/react/ds-radio-group.ts

@@ -0,0 +1,27 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import { type DsRadioGroupCustomEvent } from "@ds-mo/ui";
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsRadioGroup as DsRadioGroupElement, defineCustomElement as defineDsRadioGroup } from "@ds-mo/ui/dist/components/ds-radio-group.js";
+
+export type DsRadioGroupEvents = { onDsChange: EventName<DsRadioGroupCustomEvent<string>> };
+
+export const DsRadioGroup: StencilReactComponent<DsRadioGroupElement, DsRadioGroupEvents, Components.DsRadioGroup> = /*@__PURE__*/ createComponent<DsRadioGroupElement, DsRadioGroupEvents, Components.DsRadioGroup>({
+    tagName: 'ds-radio-group',
+    elementClass: DsRadioGroupElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onDsChange: 'dsChange' } as DsRadioGroupEvents,
+    defineCustomElement: defineDsRadioGroup
+});

package/src/react/ds-scrollbar.ts

@@ -0,0 +1,26 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsScrollbar as DsScrollbarElement, defineCustomElement as defineDsScrollbar } from "@ds-mo/ui/dist/components/ds-scrollbar.js";
+
+export type DsScrollbarEvents = NonNullable<unknown>;
+
+export const DsScrollbar: StencilReactComponent<DsScrollbarElement, DsScrollbarEvents, Components.DsScrollbar> = /*@__PURE__*/ createComponent<DsScrollbarElement, DsScrollbarEvents, Components.DsScrollbar>({
+    tagName: 'ds-scrollbar',
+    elementClass: DsScrollbarElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {} as DsScrollbarEvents,
+    defineCustomElement: defineDsScrollbar
+});

package/src/react/ds-select.ts

@@ -0,0 +1,27 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import { type DsSelectCustomEvent } from "@ds-mo/ui";
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsSelect as DsSelectElement, defineCustomElement as defineDsSelect } from "@ds-mo/ui/dist/components/ds-select.js";
+
+export type DsSelectEvents = { onDsChange: EventName<DsSelectCustomEvent<string>> };
+
+export const DsSelect: StencilReactComponent<DsSelectElement, DsSelectEvents, Components.DsSelect> = /*@__PURE__*/ createComponent<DsSelectElement, DsSelectEvents, Components.DsSelect>({
+    tagName: 'ds-select',
+    elementClass: DsSelectElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onDsChange: 'dsChange' } as DsSelectEvents,
+    defineCustomElement: defineDsSelect
+});

package/src/react/ds-sidebar.ts

@@ -0,0 +1,33 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import { type DsSidebarCustomEvent, type SidebarWidth } from "@ds-mo/ui";
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsSidebar as DsSidebarElement, defineCustomElement as defineDsSidebar } from "@ds-mo/ui/dist/components/ds-sidebar.js";
+
+export type DsSidebarEvents = {
+    onDsToggle: EventName<DsSidebarCustomEvent<void>>,
+    onDsWidthChange: EventName<DsSidebarCustomEvent<SidebarWidth>>
+};
+
+export const DsSidebar: StencilReactComponent<DsSidebarElement, DsSidebarEvents, Components.DsSidebar> = /*@__PURE__*/ createComponent<DsSidebarElement, DsSidebarEvents, Components.DsSidebar>({
+    tagName: 'ds-sidebar',
+    elementClass: DsSidebarElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onDsToggle: 'dsToggle',
+        onDsWidthChange: 'dsWidthChange'
+    } as DsSidebarEvents,
+    defineCustomElement: defineDsSidebar
+});

package/src/react/ds-skeleton.ts

@@ -0,0 +1,26 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsSkeleton as DsSkeletonElement, defineCustomElement as defineDsSkeleton } from "@ds-mo/ui/dist/components/ds-skeleton.js";
+
+export type DsSkeletonEvents = NonNullable<unknown>;
+
+export const DsSkeleton: StencilReactComponent<DsSkeletonElement, DsSkeletonEvents, Components.DsSkeleton> = /*@__PURE__*/ createComponent<DsSkeletonElement, DsSkeletonEvents, Components.DsSkeleton>({
+    tagName: 'ds-skeleton',
+    elementClass: DsSkeletonElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {} as DsSkeletonEvents,
+    defineCustomElement: defineDsSkeleton
+});

package/src/react/ds-slider.ts

@@ -0,0 +1,27 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import { type DsSliderCustomEvent } from "@ds-mo/ui";
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsSlider as DsSliderElement, defineCustomElement as defineDsSlider } from "@ds-mo/ui/dist/components/ds-slider.js";
+
+export type DsSliderEvents = { onDsChange: EventName<DsSliderCustomEvent<number>> };
+
+export const DsSlider: StencilReactComponent<DsSliderElement, DsSliderEvents, Components.DsSlider> = /*@__PURE__*/ createComponent<DsSliderElement, DsSliderEvents, Components.DsSlider>({
+    tagName: 'ds-slider',
+    elementClass: DsSliderElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onDsChange: 'dsChange' } as DsSliderEvents,
+    defineCustomElement: defineDsSlider
+});

package/src/react/ds-surface.ts

@@ -0,0 +1,26 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsSurface as DsSurfaceElement, defineCustomElement as defineDsSurface } from "@ds-mo/ui/dist/components/ds-surface.js";
+
+export type DsSurfaceEvents = NonNullable<unknown>;
+
+export const DsSurface: StencilReactComponent<DsSurfaceElement, DsSurfaceEvents, Components.DsSurface> = /*@__PURE__*/ createComponent<DsSurfaceElement, DsSurfaceEvents, Components.DsSurface>({
+    tagName: 'ds-surface',
+    elementClass: DsSurfaceElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {} as DsSurfaceEvents,
+    defineCustomElement: defineDsSurface
+});

package/src/react/ds-tab-group-nav.ts

@@ -0,0 +1,27 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import { type DsTabGroupNavCustomEvent } from "@ds-mo/ui";
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsTabGroupNav as DsTabGroupNavElement, defineCustomElement as defineDsTabGroupNav } from "@ds-mo/ui/dist/components/ds-tab-group-nav.js";
+
+export type DsTabGroupNavEvents = { onDsChange: EventName<DsTabGroupNavCustomEvent<string>> };
+
+export const DsTabGroupNav: StencilReactComponent<DsTabGroupNavElement, DsTabGroupNavEvents, Components.DsTabGroupNav> = /*@__PURE__*/ createComponent<DsTabGroupNavElement, DsTabGroupNavEvents, Components.DsTabGroupNav>({
+    tagName: 'ds-tab-group-nav',
+    elementClass: DsTabGroupNavElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onDsChange: 'dsChange' } as DsTabGroupNavEvents,
+    defineCustomElement: defineDsTabGroupNav
+});

package/src/react/ds-tab-group.ts

@@ -0,0 +1,27 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import { type DsTabGroupCustomEvent } from "@ds-mo/ui";
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsTabGroup as DsTabGroupElement, defineCustomElement as defineDsTabGroup } from "@ds-mo/ui/dist/components/ds-tab-group.js";
+
+export type DsTabGroupEvents = { onDsChange: EventName<DsTabGroupCustomEvent<string>> };
+
+export const DsTabGroup: StencilReactComponent<DsTabGroupElement, DsTabGroupEvents, Components.DsTabGroup> = /*@__PURE__*/ createComponent<DsTabGroupElement, DsTabGroupEvents, Components.DsTabGroup>({
+    tagName: 'ds-tab-group',
+    elementClass: DsTabGroupElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onDsChange: 'dsChange' } as DsTabGroupEvents,
+    defineCustomElement: defineDsTabGroup
+});

package/src/react/ds-table.ts

@@ -0,0 +1,35 @@
+'use client';
+
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+
+/* eslint-disable */
+
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+import { type DsTableCustomEvent } from "@ds-mo/ui";
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsTable as DsTableElement, defineCustomElement as defineDsTable } from "@ds-mo/ui/dist/components/ds-table.js";
+
+export type DsTableEvents = {
+    onDsSort: EventName<DsTableCustomEvent<{ columnId: string }>>,
+    onDsRowClick: EventName<DsTableCustomEvent<{ row: unknown; rowIndex: number }>>,
+    onDsPageChange: EventName<DsTableCustomEvent<{ pageIndex: number }>>
+};
+
+export const DsTable: StencilReactComponent<DsTableElement, DsTableEvents, Components.DsTable> = /*@__PURE__*/ createComponent<DsTableElement, DsTableEvents, Components.DsTable>({
+    tagName: 'ds-table',
+    elementClass: DsTableElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onDsSort: 'dsSort',
+        onDsRowClick: 'dsRowClick',
+        onDsPageChange: 'dsPageChange'
+    } as DsTableEvents,
+    defineCustomElement: defineDsTable
+});