@sellmate/design-system-react 0.0.62 → 1.0.1

package/lib/components/components.server.ts

@@ -8,7 +8,7 @@
 // @ts-ignore - ignore potential type issues as the project is importing itself
 import * as clientComponents from '@sellmate/design-system-react';
 
-import { type CheckedType, type Event, type RadioValue, type Row, type SdButtonCustomEvent, type SdCheckboxCustomEvent, type SdFilePickerCustomEvent, type SdInputCustomEvent, type SdModalCardCustomEvent, type SdNumberInputCustomEvent, type SdRadioButtonGroupCustomEvent, type SdRadioGroupCustomEvent, type SdSelectCustomEvent, type SdSelectMultipleCustomEvent, type SdSelectMultipleGroupCustomEvent, type SdSelectOptionCustomEvent, type SdSelectOptionGroupCustomEvent, type SdTableBackupCustomEvent, type SdTableCustomEvent, type SelectEvents, type SelectMultipleEvents, type SelectOption, type SelectOptionGroup } from "@sellmate/design-system";
+import { type CheckedType, type Event, type RadioValue, type Row, type SdCheckboxCustomEvent, type SdFilePickerCustomEvent, type SdInputCustomEvent, type SdModalCardCustomEvent, type SdNumberInputCustomEvent, type SdRadioButtonGroupCustomEvent, type SdRadioGroupCustomEvent, type SdSelectCustomEvent, type SdSelectDropdownCustomEvent, type SdSelectMultipleCustomEvent, type SdSelectMultipleGroupCustomEvent, type SdSelectOptionCustomEvent, type SdSelectOptionGroupCustomEvent, type SdTableCustomEvent, type SdTextareaCustomEvent, type SelectEvents, type SelectMultipleEvents, type SelectOption, type SelectOptionGroup } from "@sellmate/design-system";
 import { SdBadge as SdBadgeElement } from "@sellmate/design-system/dist/components/sd-badge.js";
 import { SdButton as SdButtonElement } from "@sellmate/design-system/dist/components/sd-button.js";
 import { SdCard as SdCardElement } from "@sellmate/design-system/dist/components/sd-card.js";
@@ -16,7 +16,10 @@ import { SdCheckbox as SdCheckboxElement } from "@sellmate/design-system/dist/co
 import { SdDateBox as SdDateBoxElement } from "@sellmate/design-system/dist/components/sd-date-box.js";
 import { SdDatePicker as SdDatePickerElement } from "@sellmate/design-system/dist/components/sd-date-picker.js";
 import { SdDateRangePicker as SdDateRangePickerElement } from "@sellmate/design-system/dist/components/sd-date-range-picker.js";
+import { SdField as SdFieldElement } from "@sellmate/design-system/dist/components/sd-field.js";
 import { SdFilePicker as SdFilePickerElement } from "@sellmate/design-system/dist/components/sd-file-picker.js";
+import { SdFloatingPortal as SdFloatingPortalElement } from "@sellmate/design-system/dist/components/sd-floating-portal.js";
+import { SdForm as SdFormElement } from "@sellmate/design-system/dist/components/sd-form.js";
 import { SdGuide as SdGuideElement } from "@sellmate/design-system/dist/components/sd-guide.js";
 import { SdIcon as SdIconElement } from "@sellmate/design-system/dist/components/sd-icon.js";
 import { SdInput as SdInputElement } from "@sellmate/design-system/dist/components/sd-input.js";
@@ -29,25 +32,21 @@ import { SdPortal as SdPortalElement } from "@sellmate/design-system/dist/compon
 import { SdProgress as SdProgressElement } from "@sellmate/design-system/dist/components/sd-progress.js";
 import { SdRadioButtonGroup as SdRadioButtonGroupElement } from "@sellmate/design-system/dist/components/sd-radio-button-group.js";
 import { SdRadioGroup as SdRadioGroupElement } from "@sellmate/design-system/dist/components/sd-radio-group.js";
+import { SdSelectDropdown as SdSelectDropdownElement } from "@sellmate/design-system/dist/components/sd-select-dropdown.js";
 import { SdSelectMultipleGroup as SdSelectMultipleGroupElement } from "@sellmate/design-system/dist/components/sd-select-multiple-group.js";
 import { SdSelectMultiple as SdSelectMultipleElement } from "@sellmate/design-system/dist/components/sd-select-multiple.js";
 import { SdSelectOptionGroup as SdSelectOptionGroupElement } from "@sellmate/design-system/dist/components/sd-select-option-group.js";
 import { SdSelectOption as SdSelectOptionElement } from "@sellmate/design-system/dist/components/sd-select-option.js";
 import { SdSelectSearchInput as SdSelectSearchInputElement } from "@sellmate/design-system/dist/components/sd-select-search-input.js";
 import { SdSelect as SdSelectElement } from "@sellmate/design-system/dist/components/sd-select.js";
-import { SdTableBackup as SdTableBackupElement } from "@sellmate/design-system/dist/components/sd-table-backup.js";
 import { SdTable as SdTableElement } from "@sellmate/design-system/dist/components/sd-table.js";
 import { SdTabs as SdTabsElement } from "@sellmate/design-system/dist/components/sd-tabs.js";
 import { SdTag as SdTagElement } from "@sellmate/design-system/dist/components/sd-tag.js";
-import { SdTbody as SdTbodyElement } from "@sellmate/design-system/dist/components/sd-tbody.js";
-import { SdTd as SdTdElement } from "@sellmate/design-system/dist/components/sd-td.js";
-import { SdTh as SdThElement } from "@sellmate/design-system/dist/components/sd-th.js";
+import { SdTextarea as SdTextareaElement } from "@sellmate/design-system/dist/components/sd-textarea.js";
 import { SdToastMessage as SdToastMessageElement } from "@sellmate/design-system/dist/components/sd-toast-message.js";
 import { SdToggleButton as SdToggleButtonElement } from "@sellmate/design-system/dist/components/sd-toggle-button.js";
 import { SdToggle as SdToggleElement } from "@sellmate/design-system/dist/components/sd-toggle.js";
-import { SdTooltipPortal as SdTooltipPortalElement } from "@sellmate/design-system/dist/components/sd-tooltip-portal.js";
 import { SdTooltip as SdTooltipElement } from "@sellmate/design-system/dist/components/sd-tooltip.js";
-import { SdTr as SdTrElement } from "@sellmate/design-system/dist/components/sd-tr.js";
 import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
 import { createComponent, type HydrateModule, type ReactWebComponent, type SerializeShadowRootOptions } from '@stencil/react-output-target/ssr';
 
@@ -67,7 +66,7 @@ export const SdBadge: StencilReactComponent<SdBadgeElement, SdBadgeEvents> = /*@
     serializeShadowRoot,
 });
 
-export type SdButtonEvents = { onSdClick: EventName<SdButtonCustomEvent<MouseEvent>> };
+export type SdButtonEvents = NonNullable<unknown>;
 
 export const SdButton: StencilReactComponent<SdButtonElement, SdButtonEvents> = /*@__PURE__*/ createComponent<SdButtonElement, SdButtonEvents>({
     tagName: 'sd-button',
@@ -103,12 +102,12 @@ export const SdCard: StencilReactComponent<SdCardElement, SdCardEvents> = /*@__P
     serializeShadowRoot,
 });
 
-export type SdCheckboxEvents = { onSdChange: EventName<SdCheckboxCustomEvent<CheckedType>> };
+export type SdCheckboxEvents = { onSdUpdate: EventName<SdCheckboxCustomEvent<CheckedType>> };
 
 export const SdCheckbox: StencilReactComponent<SdCheckboxElement, SdCheckboxEvents> = /*@__PURE__*/ createComponent<SdCheckboxElement, SdCheckboxEvents>({
     tagName: 'sd-checkbox',
     properties: {
-        checked: 'checked',
+        value: 'value',
         val: 'val',
         disabled: 'disabled',
         label: 'label'
@@ -140,7 +139,7 @@ export const SdDateBox: StencilReactComponent<SdDateBoxElement, SdDateBoxEvents>
     serializeShadowRoot,
 });
 
-export type SdDatePickerEvents = { onSdChange: EventName<CustomEvent<string | null>> };
+export type SdDatePickerEvents = { onSdUpdate: EventName<CustomEvent<string | null>> };
 
 export const SdDatePicker: StencilReactComponent<SdDatePickerElement, SdDatePickerEvents> = /*@__PURE__*/ createComponent<SdDatePickerElement, SdDatePickerEvents>({
     tagName: 'sd-date-picker',
@@ -155,7 +154,7 @@ export const SdDatePicker: StencilReactComponent<SdDatePickerElement, SdDatePick
     serializeShadowRoot,
 });
 
-export type SdDateRangePickerEvents = { onSdChange: EventName<CustomEvent<[string, string]>> };
+export type SdDateRangePickerEvents = { onSdUpdate: EventName<CustomEvent<[string, string]>> };
 
 export const SdDateRangePicker: StencilReactComponent<SdDateRangePickerElement, SdDateRangePickerEvents> = /*@__PURE__*/ createComponent<SdDateRangePickerElement, SdDateRangePickerEvents>({
     tagName: 'sd-date-range-picker',
@@ -170,7 +169,28 @@ export const SdDateRangePicker: StencilReactComponent<SdDateRangePickerElement,
     serializeShadowRoot,
 });
 
-export type SdFilePickerEvents = { onSdChange: EventName<SdFilePickerCustomEvent<File[] | File | null>> };
+export type SdFieldEvents = NonNullable<unknown>;
+
+export const SdField: StencilReactComponent<SdFieldElement, SdFieldEvents> = /*@__PURE__*/ createComponent<SdFieldElement, SdFieldEvents>({
+    tagName: 'sd-field',
+    properties: {
+        name: 'name',
+        error: 'error',
+        disabled: 'disabled',
+        hovered: 'hovered',
+        focused: 'focused',
+        status: 'status',
+        label: 'label',
+        insideLabel: 'inside-label',
+        useLabelRequired: 'use-label-required',
+        labelTooltip: 'label-tooltip'
+    },
+    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
+    clientModule: clientComponents.SdField as ReactWebComponent<SdFieldElement, SdFieldEvents>,
+    serializeShadowRoot,
+});
+
+export type SdFilePickerEvents = { onSdUpdate: EventName<SdFilePickerCustomEvent<File[] | File | null>> };
 
 export const SdFilePicker: StencilReactComponent<SdFilePickerElement, SdFilePickerEvents> = /*@__PURE__*/ createComponent<SdFilePickerElement, SdFilePickerEvents>({
     tagName: 'sd-file-picker',
@@ -187,6 +207,34 @@ export const SdFilePicker: StencilReactComponent<SdFilePickerElement, SdFilePick
     serializeShadowRoot,
 });
 
+export type SdFloatingPortalEvents = { onSdClose: EventName<CustomEvent<void>> };
+
+export const SdFloatingPortal: StencilReactComponent<SdFloatingPortalElement, SdFloatingPortalEvents> = /*@__PURE__*/ createComponent<SdFloatingPortalElement, SdFloatingPortalEvents>({
+    tagName: 'sd-floating-portal',
+    properties: {
+        to: 'to',
+        zIndex: 'z-index',
+        placement: 'placement',
+        open: 'open'
+    },
+    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
+    clientModule: clientComponents.SdFloatingPortal as ReactWebComponent<SdFloatingPortalElement, SdFloatingPortalEvents>,
+    serializeShadowRoot,
+});
+
+export type SdFormEvents = {
+    onSdSubmit: EventName<CustomEvent<void>>,
+    onSdValidationError: EventName<CustomEvent<void>>
+};
+
+export const SdForm: StencilReactComponent<SdFormElement, SdFormEvents> = /*@__PURE__*/ createComponent<SdFormElement, SdFormEvents>({
+    tagName: 'sd-form',
+    properties: {},
+    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
+    clientModule: clientComponents.SdForm as ReactWebComponent<SdFormElement, SdFormEvents>,
+    serializeShadowRoot,
+});
+
 export type SdGuideEvents = NonNullable<unknown>;
 
 export const SdGuide: StencilReactComponent<SdGuideElement, SdGuideEvents> = /*@__PURE__*/ createComponent<SdGuideElement, SdGuideEvents>({
@@ -221,9 +269,7 @@ export const SdIcon: StencilReactComponent<SdIconElement, SdIconEvents> = /*@__P
 });
 
 export type SdInputEvents = {
-    onSdClick: EventName<CustomEvent<string | number | null>>,
-    onSdInput: EventName<CustomEvent<string | number | null>>,
-    onSdChange: EventName<CustomEvent<string | number | null>>,
+    onSdUpdate: EventName<CustomEvent<string | number | null>>,
     onSdFocus: EventName<SdInputCustomEvent<Event>>,
     onSdBlur: EventName<SdInputCustomEvent<Event>>
 };
@@ -232,7 +278,7 @@ export const SdInput: StencilReactComponent<SdInputElement, SdInputEvents> = /*@
     tagName: 'sd-input',
     properties: {
         value: 'value',
-        label: 'label',
+        type: 'type',
         insideLabel: 'inside-label',
         placeholder: 'placeholder',
         disabled: 'disabled',
@@ -242,7 +288,13 @@ export const SdInput: StencilReactComponent<SdInputElement, SdInputEvents> = /*@
         autoFocus: 'auto-focus',
         status: 'status',
         inputClass: 'input-class',
-        readonly: 'readonly'
+        readonly: 'readonly',
+        error: 'error',
+        focused: 'focused',
+        hovered: 'hovered',
+        label: 'label',
+        useLabelRequired: 'use-label-required',
+        labelTooltip: 'label-tooltip'
     },
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdInput as ReactWebComponent<SdInputElement, SdInputEvents>,
@@ -280,10 +332,7 @@ export const SdModalCard: StencilReactComponent<SdModalCardElement, SdModalCardE
 });
 
 export type SdNumberInputEvents = {
-    onSdIncrement: EventName<CustomEvent<{ currentVal: number; prevVal: number }>>,
-    onSdDecrement: EventName<CustomEvent<{ currentVal: number; prevVal: number }>>,
-    onSdInput: EventName<CustomEvent<number | null>>,
-    onSdChange: EventName<CustomEvent<number | null>>,
+    onSdUpdate: EventName<CustomEvent<number | null>>,
     onSdFocus: EventName<SdNumberInputCustomEvent<Event>>,
     onSdBlur: EventName<SdNumberInputCustomEvent<Event>>
 };
@@ -311,7 +360,7 @@ export const SdNumberInput: StencilReactComponent<SdNumberInputElement, SdNumber
     serializeShadowRoot,
 });
 
-export type SdPaginationEvents = { onPageChange: EventName<CustomEvent<number>> };
+export type SdPaginationEvents = { onSdPageChange: EventName<CustomEvent<number>> };
 
 export const SdPagination: StencilReactComponent<SdPaginationElement, SdPaginationEvents> = /*@__PURE__*/ createComponent<SdPaginationElement, SdPaginationEvents>({
     tagName: 'sd-pagination',
@@ -379,7 +428,7 @@ export const SdProgress: StencilReactComponent<SdProgressElement, SdProgressEven
     serializeShadowRoot,
 });
 
-export type SdRadioButtonGroupEvents = { onSdChange: EventName<SdRadioButtonGroupCustomEvent<RadioValue>> };
+export type SdRadioButtonGroupEvents = { onSdUpdate: EventName<SdRadioButtonGroupCustomEvent<RadioValue>> };
 
 export const SdRadioButtonGroup: StencilReactComponent<SdRadioButtonGroupElement, SdRadioButtonGroupEvents> = /*@__PURE__*/ createComponent<SdRadioButtonGroupElement, SdRadioButtonGroupEvents>({
     tagName: 'sd-radio-button-group',
@@ -394,7 +443,7 @@ export const SdRadioButtonGroup: StencilReactComponent<SdRadioButtonGroupElement
     serializeShadowRoot,
 });
 
-export type SdRadioGroupEvents = { onSdChange: EventName<SdRadioGroupCustomEvent<RadioValue>> };
+export type SdRadioGroupEvents = { onSdUpdate: EventName<SdRadioGroupCustomEvent<RadioValue>> };
 
 export const SdRadioGroup: StencilReactComponent<SdRadioGroupElement, SdRadioGroupEvents> = /*@__PURE__*/ createComponent<SdRadioGroupElement, SdRadioGroupEvents>({
     tagName: 'sd-radio-group',
@@ -410,45 +459,84 @@ export const SdRadioGroup: StencilReactComponent<SdRadioGroupElement, SdRadioGro
 });
 
 export type SdSelectEvents = {
-    onSdChange: EventName<SdSelectCustomEvent<SelectEvents['sdChange']>>,
-    onDropDownShow: EventName<SdSelectCustomEvent<SelectEvents['dropDownShow']>>
+    onSdUpdate: EventName<SdSelectCustomEvent<SelectEvents['sdUpdate']>>,
+    onSdDropDownShow: EventName<SdSelectCustomEvent<SelectEvents['dropDownShow']>>
 };
 
 export const SdSelect: StencilReactComponent<SdSelectElement, SdSelectEvents> = /*@__PURE__*/ createComponent<SdSelectElement, SdSelectEvents>({
     tagName: 'sd-select',
     properties: {
         value: 'value',
-        label: 'label',
         placeholder: 'placeholder',
         optionPlaceholder: 'option-placeholder',
         width: 'width',
         dropdownHeight: 'dropdown-height',
+        autoFocus: 'auto-focus',
         disabled: 'disabled',
         clearable: 'clearable',
-        searchable: 'searchable'
+        searchable: 'searchable',
+        label: 'label',
+        insideLabel: 'inside-label',
+        useLabelRequired: 'use-label-required',
+        labelTooltip: 'label-tooltip',
+        name: 'name',
+        error: 'error'
     },
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdSelect as ReactWebComponent<SdSelectElement, SdSelectEvents>,
     serializeShadowRoot,
 });
 
+export type SdSelectDropdownEvents = {
+    onSdOptionClick: EventName<SdSelectDropdownCustomEvent<{
+        option: SelectOption;
+        index: number;
+        event: MouseEvent;
+    }>>,
+    onSdOptionFiltered: EventName<SdSelectDropdownCustomEvent<SelectOption[]>>,
+    onSdScroll: EventName<SdSelectDropdownCustomEvent<Event>>
+};
+
+export const SdSelectDropdown: StencilReactComponent<SdSelectDropdownElement, SdSelectDropdownEvents> = /*@__PURE__*/ createComponent<SdSelectDropdownElement, SdSelectDropdownEvents>({
+    tagName: 'sd-select-dropdown',
+    properties: {
+        itemIndex: 'item-index',
+        value: 'value',
+        width: 'width',
+        dropdownHeight: 'dropdown-height',
+        searchable: 'searchable',
+        optionPlaceholder: 'option-placeholder',
+        useCheckbox: 'use-checkbox',
+        useAll: 'use-all'
+    },
+    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
+    clientModule: clientComponents.SdSelectDropdown as ReactWebComponent<SdSelectDropdownElement, SdSelectDropdownEvents>,
+    serializeShadowRoot,
+});
+
 export type SdSelectMultipleEvents = {
-    onSdChange: EventName<SdSelectMultipleCustomEvent<SelectMultipleEvents['sdChange']>>,
-    onDropDownShow: EventName<SdSelectMultipleCustomEvent<SelectMultipleEvents['dropDownShow']>>
+    onSdUpdate: EventName<SdSelectMultipleCustomEvent<SelectMultipleEvents['sdUpdate']>>,
+    onSdDropDownShow: EventName<SdSelectMultipleCustomEvent<SelectMultipleEvents['dropDownShow']>>
 };
 
 export const SdSelectMultiple: StencilReactComponent<SdSelectMultipleElement, SdSelectMultipleEvents> = /*@__PURE__*/ createComponent<SdSelectMultipleElement, SdSelectMultipleEvents>({
     tagName: 'sd-select-multiple',
     properties: {
-        label: 'label',
         placeholder: 'placeholder',
         optionPlaceholder: 'option-placeholder',
         width: 'width',
         dropdownHeight: 'dropdown-height',
+        autoFocus: 'auto-focus',
         disabled: 'disabled',
         clearable: 'clearable',
         searchable: 'searchable',
-        useCheckbox: 'use-checkbox'
+        useAll: 'use-all',
+        useCheckbox: 'use-checkbox',
+        label: 'label',
+        useLabelRequired: 'use-label-required',
+        labelTooltip: 'label-tooltip',
+        name: 'name',
+        error: 'error'
     },
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdSelectMultiple as ReactWebComponent<SdSelectMultipleElement, SdSelectMultipleEvents>,
@@ -456,14 +544,13 @@ export const SdSelectMultiple: StencilReactComponent<SdSelectMultipleElement, Sd
 });
 
 export type SdSelectMultipleGroupEvents = {
-    onSdChange: EventName<SdSelectMultipleGroupCustomEvent<SelectMultipleEvents['sdChange']>>,
-    onDropDownShow: EventName<SdSelectMultipleGroupCustomEvent<SelectMultipleEvents['dropDownShow']>>
+    onSdUpdate: EventName<SdSelectMultipleGroupCustomEvent<SelectMultipleEvents['sdUpdate']>>,
+    onSdDropDownShow: EventName<SdSelectMultipleGroupCustomEvent<SelectMultipleEvents['dropDownShow']>>
 };
 
 export const SdSelectMultipleGroup: StencilReactComponent<SdSelectMultipleGroupElement, SdSelectMultipleGroupEvents> = /*@__PURE__*/ createComponent<SdSelectMultipleGroupElement, SdSelectMultipleGroupEvents>({
     tagName: 'sd-select-multiple-group',
     properties: {
-        label: 'label',
         placeholder: 'placeholder',
         optionPlaceholder: 'option-placeholder',
         width: 'width',
@@ -474,7 +561,12 @@ export const SdSelectMultipleGroup: StencilReactComponent<SdSelectMultipleGroupE
         useCheckbox: 'use-checkbox',
         useAll: 'use-all',
         allCheckedLabel: 'all-checked-label',
-        allCheckOptionLabel: 'all-check-option-label'
+        allCheckOptionLabel: 'all-check-option-label',
+        label: 'label',
+        useLabelRequired: 'use-label-required',
+        labelTooltip: 'label-tooltip',
+        name: 'name',
+        error: 'error'
     },
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdSelectMultipleGroup as ReactWebComponent<SdSelectMultipleGroupElement, SdSelectMultipleGroupEvents>,
@@ -551,31 +643,6 @@ export type SdTableEvents = {
 
 export const SdTable: StencilReactComponent<SdTableElement, SdTableEvents> = /*@__PURE__*/ createComponent<SdTableElement, SdTableEvents>({
     tagName: 'sd-table',
-    properties: {
-        rowKey: 'row-key',
-        selectable: 'selectable',
-        resizable: 'resizable',
-        width: 'width',
-        height: 'height',
-        stickyHeader: 'sticky-header',
-        noDataLabel: 'no-data-label',
-        isLoading: 'is-loading',
-        useInternalPagination: 'use-internal-pagination',
-        useRowsPerPageSelect: 'use-rows-per-page-select'
-    },
-    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
-    clientModule: clientComponents.SdTable as ReactWebComponent<SdTableElement, SdTableEvents>,
-    serializeShadowRoot,
-});
-
-export type SdTableBackupEvents = {
-    onSdSelectChange: EventName<SdTableBackupCustomEvent<Row[]>>,
-    onSdPageChange: EventName<CustomEvent<number>>,
-    onSdRowsPerPageChange: EventName<CustomEvent<number>>
-};
-
-export const SdTableBackup: StencilReactComponent<SdTableBackupElement, SdTableBackupEvents> = /*@__PURE__*/ createComponent<SdTableBackupElement, SdTableBackupEvents>({
-    tagName: 'sd-table-backup',
     properties: {
         rowKey: 'row-key',
         selectable: 'selectable',
@@ -591,11 +658,11 @@ export const SdTableBackup: StencilReactComponent<SdTableBackupElement, SdTableB
         virtualColumnWidth: 'virtual-column-width'
     },
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
-    clientModule: clientComponents.SdTableBackup as ReactWebComponent<SdTableBackupElement, SdTableBackupEvents>,
+    clientModule: clientComponents.SdTable as ReactWebComponent<SdTableElement, SdTableEvents>,
     serializeShadowRoot,
 });
 
-export type SdTabsEvents = { onSdChange: EventName<CustomEvent<string>> };
+export type SdTabsEvents = { onSdUpdate: EventName<CustomEvent<string>> };
 
 export const SdTabs: StencilReactComponent<SdTabsElement, SdTabsEvents> = /*@__PURE__*/ createComponent<SdTabsElement, SdTabsEvents>({
     tagName: 'sd-tabs',
@@ -626,37 +693,27 @@ export const SdTag: StencilReactComponent<SdTagElement, SdTagEvents> = /*@__PURE
     serializeShadowRoot,
 });
 
-export type SdTbodyEvents = NonNullable<unknown>;
-
-export const SdTbody: StencilReactComponent<SdTbodyElement, SdTbodyEvents> = /*@__PURE__*/ createComponent<SdTbodyElement, SdTbodyEvents>({
-    tagName: 'sd-tbody',
-    properties: {},
-    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
-    clientModule: clientComponents.SdTbody as ReactWebComponent<SdTbodyElement, SdTbodyEvents>,
-    serializeShadowRoot,
-});
-
-export type SdTdEvents = NonNullable<unknown>;
+export type SdTextareaEvents = {
+    onSdUpdate: EventName<CustomEvent<string | null>>,
+    onSdFocus: EventName<SdTextareaCustomEvent<Event>>,
+    onSdBlur: EventName<SdTextareaCustomEvent<Event>>
+};
 
-export const SdTd: StencilReactComponent<SdTdElement, SdTdEvents> = /*@__PURE__*/ createComponent<SdTdElement, SdTdEvents>({
-    tagName: 'sd-td',
+export const SdTextarea: StencilReactComponent<SdTextareaElement, SdTextareaEvents> = /*@__PURE__*/ createComponent<SdTextareaElement, SdTextareaEvents>({
+    tagName: 'sd-textarea',
     properties: {
+        value: 'value',
         name: 'name',
-        align: 'align',
-        tdClass: 'td-class'
+        disabled: 'disabled',
+        width: 'width',
+        autoFocus: 'auto-focus',
+        textareaClass: 'textarea-class',
+        helpText: 'help-text',
+        maxLength: 'max-length',
+        placeholder: 'placeholder'
     },
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
-    clientModule: clientComponents.SdTd as ReactWebComponent<SdTdElement, SdTdEvents>,
-    serializeShadowRoot,
-});
-
-export type SdThEvents = NonNullable<unknown>;
-
-export const SdTh: StencilReactComponent<SdThElement, SdThEvents> = /*@__PURE__*/ createComponent<SdThElement, SdThEvents>({
-    tagName: 'sd-th',
-    properties: {},
-    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
-    clientModule: clientComponents.SdTh as ReactWebComponent<SdThElement, SdThEvents>,
+    clientModule: clientComponents.SdTextarea as ReactWebComponent<SdTextareaElement, SdTextareaEvents>,
     serializeShadowRoot,
 });
 
@@ -673,7 +730,7 @@ export const SdToastMessage: StencilReactComponent<SdToastMessageElement, SdToas
         link: 'link',
         linkLabel: 'link-label',
         buttonLabel: 'button-label',
-        close: 'close',
+        useClose: 'use-close',
         type: 'type'
     },
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
@@ -681,7 +738,7 @@ export const SdToastMessage: StencilReactComponent<SdToastMessageElement, SdToas
     serializeShadowRoot,
 });
 
-export type SdToggleEvents = { onSdChange: EventName<CustomEvent<boolean>> };
+export type SdToggleEvents = { onSdUpdate: EventName<CustomEvent<boolean>> };
 
 export const SdToggle: StencilReactComponent<SdToggleElement, SdToggleEvents> = /*@__PURE__*/ createComponent<SdToggleElement, SdToggleEvents>({
     tagName: 'sd-toggle',
@@ -695,7 +752,7 @@ export const SdToggle: StencilReactComponent<SdToggleElement, SdToggleEvents> =
     serializeShadowRoot,
 });
 
-export type SdToggleButtonEvents = { onSdChange: EventName<CustomEvent<boolean>> };
+export type SdToggleButtonEvents = { onSdUpdate: EventName<CustomEvent<boolean>> };
 
 export const SdToggleButton: StencilReactComponent<SdToggleButtonElement, SdToggleButtonEvents> = /*@__PURE__*/ createComponent<SdToggleButtonElement, SdToggleButtonEvents>({
     tagName: 'sd-toggle-button',
@@ -730,28 +787,3 @@ export const SdTooltip: StencilReactComponent<SdTooltipElement, SdTooltipEvents>
     clientModule: clientComponents.SdTooltip as ReactWebComponent<SdTooltipElement, SdTooltipEvents>,
     serializeShadowRoot,
 });
-
-export type SdTooltipPortalEvents = { onSdClose: EventName<CustomEvent<void>> };
-
-export const SdTooltipPortal: StencilReactComponent<SdTooltipPortalElement, SdTooltipPortalEvents> = /*@__PURE__*/ createComponent<SdTooltipPortalElement, SdTooltipPortalEvents>({
-    tagName: 'sd-tooltip-portal',
-    properties: {
-        to: 'to',
-        zIndex: 'z-index',
-        placement: 'placement',
-        open: 'open'
-    },
-    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
-    clientModule: clientComponents.SdTooltipPortal as ReactWebComponent<SdTooltipPortalElement, SdTooltipPortalEvents>,
-    serializeShadowRoot,
-});
-
-export type SdTrEvents = NonNullable<unknown>;
-
-export const SdTr: StencilReactComponent<SdTrElement, SdTrEvents> = /*@__PURE__*/ createComponent<SdTrElement, SdTrEvents>({
-    tagName: 'sd-tr',
-    properties: {},
-    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
-    clientModule: clientComponents.SdTr as ReactWebComponent<SdTrElement, SdTrEvents>,
-    serializeShadowRoot,
-});