@sellmate/design-system-react 0.0.10 → 0.0.12

package/dist/components/sd-popover.js

@@ -0,0 +1,17 @@
+'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 { SdPopover as SdPopoverElement, defineCustomElement as defineSdPopover } from "@sellmate/design-system/dist/components/sd-popover.js";
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+export const SdPopover = /*@__PURE__*/ createComponent({
+    tagName: 'sd-popover',
+    elementClass: SdPopoverElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineSdPopover
+});

package/dist/components/sd-portal.d.ts

@@ -0,0 +1,10 @@
+/**
+ * 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.
+ */
+import { SdPortal as SdPortalElement } from "@sellmate/design-system/dist/components/sd-portal.js";
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+export type SdPortalEvents = {
+    onSdClose: EventName<CustomEvent<void>>;
+};
+export declare const SdPortal: StencilReactComponent<SdPortalElement, SdPortalEvents>;

package/dist/components/sd-portal.js

@@ -0,0 +1,17 @@
+'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 { SdPortal as SdPortalElement, defineCustomElement as defineSdPortal } from "@sellmate/design-system/dist/components/sd-portal.js";
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+export const SdPortal = /*@__PURE__*/ createComponent({
+    tagName: 'sd-portal',
+    elementClass: SdPortalElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onSdClose: 'sdClose' },
+    defineCustomElement: defineSdPortal
+});

package/dist/components/sd-select-option.d.ts

@@ -0,0 +1,15 @@
+/**
+ * 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.
+ */
+import { type SdSelectOptionCustomEvent, type SelectOption } from "@sellmate/design-system";
+import { SdSelectOption as SdSelectOptionElement } from "@sellmate/design-system/dist/components/sd-select-option.js";
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+export type SdSelectOptionEvents = {
+    onOptionClick: EventName<SdSelectOptionCustomEvent<{
+        option: SelectOption;
+        index: number;
+        event: MouseEvent;
+    }>>;
+};
+export declare const SdSelectOption: StencilReactComponent<SdSelectOptionElement, SdSelectOptionEvents>;

package/dist/components/sd-select-option.js

@@ -0,0 +1,12 @@
+'use client';
+import { SdSelectOption as SdSelectOptionElement, defineCustomElement as defineSdSelectOption } from "@sellmate/design-system/dist/components/sd-select-option.js";
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+export const SdSelectOption = /*@__PURE__*/ createComponent({
+    tagName: 'sd-select-option',
+    elementClass: SdSelectOptionElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onOptionClick: 'optionClick' },
+    defineCustomElement: defineSdSelectOption
+});

package/dist/components/sd-select.d.ts

@@ -0,0 +1,12 @@
+/**
+ * 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.
+ */
+import { type SdSelectCustomEvent, type SelectEvents } from "@sellmate/design-system";
+import { SdSelect as SdSelectElement } from "@sellmate/design-system/dist/components/sd-select.js";
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+export type SdSelectEvents = {
+    onSdChange: EventName<SdSelectCustomEvent<SelectEvents['sdChange']>>;
+    onDropDownShow: EventName<SdSelectCustomEvent<SelectEvents['dropDownShow']>>;
+};
+export declare const SdSelect: StencilReactComponent<SdSelectElement, SdSelectEvents>;

package/dist/components/sd-select.js

@@ -0,0 +1,15 @@
+'use client';
+import { SdSelect as SdSelectElement, defineCustomElement as defineSdSelect } from "@sellmate/design-system/dist/components/sd-select.js";
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+export const SdSelect = /*@__PURE__*/ createComponent({
+    tagName: 'sd-select',
+    elementClass: SdSelectElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onSdChange: 'sdChange',
+        onDropDownShow: 'dropDownShow'
+    },
+    defineCustomElement: defineSdSelect
+});

package/dist/components/sd-table.d.ts

@@ -0,0 +1,12 @@
+/**
+ * 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.
+ */
+import { type Row, type SdTableCustomEvent } from "@sellmate/design-system";
+import { SdTable as SdTableElement } from "@sellmate/design-system/dist/components/sd-table.js";
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+export type SdTableEvents = {
+    onSdSelectChange: EventName<SdTableCustomEvent<Row[]>>;
+    onSdPageChange: EventName<CustomEvent<number>>;
+};
+export declare const SdTable: StencilReactComponent<SdTableElement, SdTableEvents>;

package/dist/components/sd-table.js

@@ -0,0 +1,15 @@
+'use client';
+import { SdTable as SdTableElement, defineCustomElement as defineSdTable } from "@sellmate/design-system/dist/components/sd-table.js";
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+export const SdTable = /*@__PURE__*/ createComponent({
+    tagName: 'sd-table',
+    elementClass: SdTableElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onSdSelectChange: 'sdSelectChange',
+        onSdPageChange: 'sdPageChange'
+    },
+    defineCustomElement: defineSdTable
+});

package/dist/components/sd-tag.d.ts

@@ -0,0 +1,8 @@
+/**
+ * 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.
+ */
+import { SdTag as SdTagElement } from "@sellmate/design-system/dist/components/sd-tag.js";
+import type { StencilReactComponent } from '@stencil/react-output-target/runtime';
+export type SdTagEvents = NonNullable<unknown>;
+export declare const SdTag: StencilReactComponent<SdTagElement, SdTagEvents>;

package/dist/components/sd-tag.js

@@ -0,0 +1,17 @@
+'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 { SdTag as SdTagElement, defineCustomElement as defineSdTag } from "@sellmate/design-system/dist/components/sd-tag.js";
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+export const SdTag = /*@__PURE__*/ createComponent({
+    tagName: 'sd-tag',
+    elementClass: SdTagElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineSdTag
+});

package/dist/components/sd-tooltip-portal.d.ts

@@ -0,0 +1,10 @@
+/**
+ * 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.
+ */
+import { SdTooltipPortal as SdTooltipPortalElement } from "@sellmate/design-system/dist/components/sd-tooltip-portal.js";
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+export type SdTooltipPortalEvents = {
+    onSdClose: EventName<CustomEvent<void>>;
+};
+export declare const SdTooltipPortal: StencilReactComponent<SdTooltipPortalElement, SdTooltipPortalEvents>;

package/dist/components/sd-tooltip-portal.js

@@ -0,0 +1,17 @@
+'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 { SdTooltipPortal as SdTooltipPortalElement, defineCustomElement as defineSdTooltipPortal } from "@sellmate/design-system/dist/components/sd-tooltip-portal.js";
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+export const SdTooltipPortal = /*@__PURE__*/ createComponent({
+    tagName: 'sd-tooltip-portal',
+    elementClass: SdTooltipPortalElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onSdClose: 'sdClose' },
+    defineCustomElement: defineSdTooltipPortal
+});

package/dist/components/sd-tooltip.d.ts

@@ -0,0 +1,8 @@
+/**
+ * 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.
+ */
+import { SdTooltip as SdTooltipElement } from "@sellmate/design-system/dist/components/sd-tooltip.js";
+import type { StencilReactComponent } from '@stencil/react-output-target/runtime';
+export type SdTooltipEvents = NonNullable<unknown>;
+export declare const SdTooltip: StencilReactComponent<SdTooltipElement, SdTooltipEvents>;

package/dist/components/sd-tooltip.js

@@ -0,0 +1,17 @@
+'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 { SdTooltip as SdTooltipElement, defineCustomElement as defineSdTooltip } from "@sellmate/design-system/dist/components/sd-tooltip.js";
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+export const SdTooltip = /*@__PURE__*/ createComponent({
+    tagName: 'sd-tooltip',
+    elementClass: SdTooltipElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineSdTooltip
+});

package/dist/hydrate.d.ts

@@ -0,0 +1,2 @@
+export declare function renderStencilToString(html: string): Promise<string>;
+export declare function registerStencilForNextjs(): void;

package/dist/hydrate.js

@@ -0,0 +1,45 @@
+import { hydrateDocument, } from '@sellmate/design-system/hydrate';
+// -------------------------------
+// SSR용 서버사이드 렌더링 함수
+// -------------------------------
+export async function renderStencilToString(html) {
+    try {
+        const results = await hydrateDocument(html, {
+            staticComponents: [
+                'sd-badge',
+                'sd-button',
+                'sd-input',
+                'sd-select',
+                'sd-table',
+                'sd-icon',
+                'sd-checkbox',
+                'sd-tag',
+                'sd-pagination',
+                'sd-tooltip',
+                'sd-popover',
+                'sd-guide',
+                'sd-date-picker',
+                'sd-date-range-picker',
+                'sd-date-box',
+                'sd-portal',
+                'sd-tooltip-portal',
+            ],
+        });
+        return results.html;
+    }
+    catch (error) {
+        console.warn('Stencil SSR failed, falling back to client-side rendering:', error);
+        return html;
+    }
+}
+// ----------------------------------------------
+//  클라이언트 사이드 등록 함수
+// ----------------------------------------------
+export function registerStencilForNextjs() {
+    if (typeof window === 'undefined')
+        return;
+    // router 변경 시에도 재등록
+    import('@sellmate/design-system/loader').then(({ defineCustomElements }) => {
+        defineCustomElements(window);
+    });
+}

package/dist/index.d.ts

@@ -1,2 +1,3 @@
 export * from './components/components';
+export { registerStencil } from './registerStencil';
 export type { SdTableSortDir, SdTableColumn, Row as SdTableRow, } from '@sellmate/design-system';

package/dist/index.js

@@ -1,4 +1,4 @@
 'use strict';
 export * from './components/components';
-import { registerStencil } from './registerStencil';
-registerStencil();
+// Optional manual registration (not automatically called)
+export { registerStencil } from './registerStencil';

package/lib/components/components.ts

@@ -1,253 +1,24 @@
-'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 Event, type Row, type SdButtonCustomEvent, type SdInputCustomEvent, type SdSelectCustomEvent, type SdSelectOptionCustomEvent, type SdTableCustomEvent, type SelectEvents, type SelectOption } from "@sellmate/design-system";
-import { SdButton as SdButtonElement, defineCustomElement as defineSdButton } from "@sellmate/design-system/dist/components/sd-button.js";
-import { SdCheckbox as SdCheckboxElement, defineCustomElement as defineSdCheckbox } from "@sellmate/design-system/dist/components/sd-checkbox.js";
-import { SdDateBox as SdDateBoxElement, defineCustomElement as defineSdDateBox } from "@sellmate/design-system/dist/components/sd-date-box.js";
-import { SdDatePicker as SdDatePickerElement, defineCustomElement as defineSdDatePicker } from "@sellmate/design-system/dist/components/sd-date-picker.js";
-import { SdDateRangePicker as SdDateRangePickerElement, defineCustomElement as defineSdDateRangePicker } from "@sellmate/design-system/dist/components/sd-date-range-picker.js";
-import { SdGuide as SdGuideElement, defineCustomElement as defineSdGuide } from "@sellmate/design-system/dist/components/sd-guide.js";
-import { SdIcon as SdIconElement, defineCustomElement as defineSdIcon } from "@sellmate/design-system/dist/components/sd-icon.js";
-import { SdInput as SdInputElement, defineCustomElement as defineSdInput } from "@sellmate/design-system/dist/components/sd-input.js";
-import { SdPagination as SdPaginationElement, defineCustomElement as defineSdPagination } from "@sellmate/design-system/dist/components/sd-pagination.js";
-import { SdPopover as SdPopoverElement, defineCustomElement as defineSdPopover } from "@sellmate/design-system/dist/components/sd-popover.js";
-import { SdPortal as SdPortalElement, defineCustomElement as defineSdPortal } from "@sellmate/design-system/dist/components/sd-portal.js";
-import { SdSelectOption as SdSelectOptionElement, defineCustomElement as defineSdSelectOption } from "@sellmate/design-system/dist/components/sd-select-option.js";
-import { SdSelect as SdSelectElement, defineCustomElement as defineSdSelect } from "@sellmate/design-system/dist/components/sd-select.js";
-import { SdTable as SdTableElement, defineCustomElement as defineSdTable } from "@sellmate/design-system/dist/components/sd-table.js";
-import { SdTag as SdTagElement, defineCustomElement as defineSdTag } from "@sellmate/design-system/dist/components/sd-tag.js";
-import { SdTooltipPortal as SdTooltipPortalElement, defineCustomElement as defineSdTooltipPortal } from "@sellmate/design-system/dist/components/sd-tooltip-portal.js";
-import { SdTooltip as SdTooltipElement, defineCustomElement as defineSdTooltip } from "@sellmate/design-system/dist/components/sd-tooltip.js";
-import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
-import { createComponent } from '@stencil/react-output-target/runtime';
-import React from 'react';
-
-export type SdButtonEvents = { onSdClick: EventName<SdButtonCustomEvent<MouseEvent>> };
-
-export const SdButton: StencilReactComponent<SdButtonElement, SdButtonEvents> = /*@__PURE__*/ createComponent<SdButtonElement, SdButtonEvents>({
-    tagName: 'sd-button',
-    elementClass: SdButtonElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: { onSdClick: 'sdClick' } as SdButtonEvents,
-    defineCustomElement: defineSdButton
-});
-
-export type SdCheckboxEvents = { onSdChange: EventName<CustomEvent<any | any[]>> };
-
-export const SdCheckbox: StencilReactComponent<SdCheckboxElement, SdCheckboxEvents> = /*@__PURE__*/ createComponent<SdCheckboxElement, SdCheckboxEvents>({
-    tagName: 'sd-checkbox',
-    elementClass: SdCheckboxElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: { onSdChange: 'sdChange' } as SdCheckboxEvents,
-    defineCustomElement: defineSdCheckbox
-});
-
-export type SdDateBoxEvents = {
-    onSdClick: EventName<CustomEvent<number | string | null>>,
-    onSdMouseOver: EventName<CustomEvent<number | string | null>>
-};
-
-export const SdDateBox: StencilReactComponent<SdDateBoxElement, SdDateBoxEvents> = /*@__PURE__*/ createComponent<SdDateBoxElement, SdDateBoxEvents>({
-    tagName: 'sd-date-box',
-    elementClass: SdDateBoxElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: {
-        onSdClick: 'sdClick',
-        onSdMouseOver: 'sdMouseOver'
-    } as SdDateBoxEvents,
-    defineCustomElement: defineSdDateBox
-});
-
-export type SdDatePickerEvents = { onSdChange: EventName<CustomEvent<string | null>> };
-
-export const SdDatePicker: StencilReactComponent<SdDatePickerElement, SdDatePickerEvents> = /*@__PURE__*/ createComponent<SdDatePickerElement, SdDatePickerEvents>({
-    tagName: 'sd-date-picker',
-    elementClass: SdDatePickerElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: { onSdChange: 'sdChange' } as SdDatePickerEvents,
-    defineCustomElement: defineSdDatePicker
-});
-
-export type SdDateRangePickerEvents = { onSdChange: EventName<CustomEvent<[string, string]>> };
-
-export const SdDateRangePicker: StencilReactComponent<SdDateRangePickerElement, SdDateRangePickerEvents> = /*@__PURE__*/ createComponent<SdDateRangePickerElement, SdDateRangePickerEvents>({
-    tagName: 'sd-date-range-picker',
-    elementClass: SdDateRangePickerElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: { onSdChange: 'sdChange' } as SdDateRangePickerEvents,
-    defineCustomElement: defineSdDateRangePicker
-});
-
-export type SdGuideEvents = NonNullable<unknown>;
-
-export const SdGuide: StencilReactComponent<SdGuideElement, SdGuideEvents> = /*@__PURE__*/ createComponent<SdGuideElement, SdGuideEvents>({
-    tagName: 'sd-guide',
-    elementClass: SdGuideElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: {} as SdGuideEvents,
-    defineCustomElement: defineSdGuide
-});
-
-export type SdIconEvents = NonNullable<unknown>;
-
-export const SdIcon: StencilReactComponent<SdIconElement, SdIconEvents> = /*@__PURE__*/ createComponent<SdIconElement, SdIconEvents>({
-    tagName: 'sd-icon',
-    elementClass: SdIconElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: {} as SdIconEvents,
-    defineCustomElement: defineSdIcon
-});
-
-export type SdInputEvents = {
-    onSdClick: EventName<CustomEvent<string | number | null>>,
-    onSdInput: EventName<CustomEvent<string | number | null>>,
-    onSdChange: EventName<CustomEvent<string | number | null>>,
-    onSdFocus: EventName<SdInputCustomEvent<Event>>,
-    onSdBlur: EventName<SdInputCustomEvent<Event>>
-};
-
-export const SdInput: StencilReactComponent<SdInputElement, SdInputEvents> = /*@__PURE__*/ createComponent<SdInputElement, SdInputEvents>({
-    tagName: 'sd-input',
-    elementClass: SdInputElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: {
-        onSdClick: 'sdClick',
-        onSdInput: 'sdInput',
-        onSdChange: 'sdChange',
-        onSdFocus: 'sdFocus',
-        onSdBlur: 'sdBlur'
-    } as SdInputEvents,
-    defineCustomElement: defineSdInput
-});
-
-export type SdPaginationEvents = { onPageChange: EventName<CustomEvent<number>> };
-
-export const SdPagination: StencilReactComponent<SdPaginationElement, SdPaginationEvents> = /*@__PURE__*/ createComponent<SdPaginationElement, SdPaginationEvents>({
-    tagName: 'sd-pagination',
-    elementClass: SdPaginationElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: { onPageChange: 'pageChange' } as SdPaginationEvents,
-    defineCustomElement: defineSdPagination
-});
-
-export type SdPopoverEvents = NonNullable<unknown>;
-
-export const SdPopover: StencilReactComponent<SdPopoverElement, SdPopoverEvents> = /*@__PURE__*/ createComponent<SdPopoverElement, SdPopoverEvents>({
-    tagName: 'sd-popover',
-    elementClass: SdPopoverElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: {} as SdPopoverEvents,
-    defineCustomElement: defineSdPopover
-});
-
-export type SdPortalEvents = { onSdClose: EventName<CustomEvent<void>> };
-
-export const SdPortal: StencilReactComponent<SdPortalElement, SdPortalEvents> = /*@__PURE__*/ createComponent<SdPortalElement, SdPortalEvents>({
-    tagName: 'sd-portal',
-    elementClass: SdPortalElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: { onSdClose: 'sdClose' } as SdPortalEvents,
-    defineCustomElement: defineSdPortal
-});
-
-export type SdSelectEvents = {
-    onSdChange: EventName<SdSelectCustomEvent<SelectEvents['sdChange']>>,
-    onDropDownShow: EventName<SdSelectCustomEvent<SelectEvents['dropDownShow']>>
-};
-
-export const SdSelect: StencilReactComponent<SdSelectElement, SdSelectEvents> = /*@__PURE__*/ createComponent<SdSelectElement, SdSelectEvents>({
-    tagName: 'sd-select',
-    elementClass: SdSelectElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: {
-        onSdChange: 'sdChange',
-        onDropDownShow: 'dropDownShow'
-    } as SdSelectEvents,
-    defineCustomElement: defineSdSelect
-});
-
-export type SdSelectOptionEvents = {
-    onOptionClick: EventName<SdSelectOptionCustomEvent<{
-        option: SelectOption;
-        index: number;
-        event: MouseEvent;
-    }>>
-};
-
-export const SdSelectOption: StencilReactComponent<SdSelectOptionElement, SdSelectOptionEvents> = /*@__PURE__*/ createComponent<SdSelectOptionElement, SdSelectOptionEvents>({
-    tagName: 'sd-select-option',
-    elementClass: SdSelectOptionElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: { onOptionClick: 'optionClick' } as SdSelectOptionEvents,
-    defineCustomElement: defineSdSelectOption
-});
-
-export type SdTableEvents = {
-    onSdSelectChange: EventName<SdTableCustomEvent<Row[]>>,
-    onSdPageChange: EventName<CustomEvent<number>>
-};
-
-export const SdTable: StencilReactComponent<SdTableElement, SdTableEvents> = /*@__PURE__*/ createComponent<SdTableElement, SdTableEvents>({
-    tagName: 'sd-table',
-    elementClass: SdTableElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: {
-        onSdSelectChange: 'sdSelectChange',
-        onSdPageChange: 'sdPageChange'
-    } as SdTableEvents,
-    defineCustomElement: defineSdTable
-});
-
-export type SdTagEvents = NonNullable<unknown>;
-
-export const SdTag: StencilReactComponent<SdTagElement, SdTagEvents> = /*@__PURE__*/ createComponent<SdTagElement, SdTagEvents>({
-    tagName: 'sd-tag',
-    elementClass: SdTagElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: {} as SdTagEvents,
-    defineCustomElement: defineSdTag
-});
-
-export type SdTooltipEvents = NonNullable<unknown>;
-
-export const SdTooltip: StencilReactComponent<SdTooltipElement, SdTooltipEvents> = /*@__PURE__*/ createComponent<SdTooltipElement, SdTooltipEvents>({
-    tagName: 'sd-tooltip',
-    elementClass: SdTooltipElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: {} as SdTooltipEvents,
-    defineCustomElement: defineSdTooltip
-});
-
-export type SdTooltipPortalEvents = { onSdClose: EventName<CustomEvent<void>> };
-
-export const SdTooltipPortal: StencilReactComponent<SdTooltipPortalElement, SdTooltipPortalEvents> = /*@__PURE__*/ createComponent<SdTooltipPortalElement, SdTooltipPortalEvents>({
-    tagName: 'sd-tooltip-portal',
-    elementClass: SdTooltipPortalElement,
-    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
-    react: React,
-    events: { onSdClose: 'sdClose' } as SdTooltipPortalEvents,
-    defineCustomElement: defineSdTooltipPortal
-});
+export { SdBadge } from "./sd-badge.js";
+export { SdButton } from "./sd-button.js";
+export { SdCheckbox } from "./sd-checkbox.js";
+export { SdDateBox } from "./sd-date-box.js";
+export { SdDatePicker } from "./sd-date-picker.js";
+export { SdDateRangePicker } from "./sd-date-range-picker.js";
+export { SdGuide } from "./sd-guide.js";
+export { SdIcon } from "./sd-icon.js";
+export { SdInput } from "./sd-input.js";
+export { SdPagination } from "./sd-pagination.js";
+export { SdPopover } from "./sd-popover.js";
+export { SdPortal } from "./sd-portal.js";
+export { SdSelectOption } from "./sd-select-option.js";
+export { SdSelect } from "./sd-select.js";
+export { SdTable } from "./sd-table.js";
+export { SdTag } from "./sd-tag.js";
+export { SdTooltipPortal } from "./sd-tooltip-portal.js";
+export { SdTooltip } from "./sd-tooltip.js";

package/lib/components/sd-badge.ts

@@ -0,0 +1,24 @@
+'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 { SdBadge as SdBadgeElement, defineCustomElement as defineSdBadge } from "@sellmate/design-system/dist/components/sd-badge.js";
+import type { StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+export type SdBadgeEvents = NonNullable<unknown>;
+
+export const SdBadge: StencilReactComponent<SdBadgeElement, SdBadgeEvents> = /*@__PURE__*/ createComponent<SdBadgeElement, SdBadgeEvents>({
+    tagName: 'sd-badge',
+    elementClass: SdBadgeElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {} as SdBadgeEvents,
+    defineCustomElement: defineSdBadge
+});

package/lib/components/sd-button.ts

@@ -0,0 +1,25 @@
+'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 SdButtonCustomEvent } from "@sellmate/design-system";
+import { SdButton as SdButtonElement, defineCustomElement as defineSdButton } from "@sellmate/design-system/dist/components/sd-button.js";
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+export type SdButtonEvents = { onSdClick: EventName<SdButtonCustomEvent<MouseEvent>> };
+
+export const SdButton: StencilReactComponent<SdButtonElement, SdButtonEvents> = /*@__PURE__*/ createComponent<SdButtonElement, SdButtonEvents>({
+    tagName: 'sd-button',
+    elementClass: SdButtonElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onSdClick: 'sdClick' } as SdButtonEvents,
+    defineCustomElement: defineSdButton
+});

package/lib/components/sd-checkbox.ts

@@ -0,0 +1,24 @@
+'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 { SdCheckbox as SdCheckboxElement, defineCustomElement as defineSdCheckbox } from "@sellmate/design-system/dist/components/sd-checkbox.js";
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+export type SdCheckboxEvents = { onSdChange: EventName<CustomEvent<any | any[]>> };
+
+export const SdCheckbox: StencilReactComponent<SdCheckboxElement, SdCheckboxEvents> = /*@__PURE__*/ createComponent<SdCheckboxElement, SdCheckboxEvents>({
+    tagName: 'sd-checkbox',
+    elementClass: SdCheckboxElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onSdChange: 'sdChange' } as SdCheckboxEvents,
+    defineCustomElement: defineSdCheckbox
+});