@sellmate/design-system-react 1.0.62 → 1.0.64

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 DateRangeValue, type DropdownButtonValue, type Event, type RadioValue, type SdBarcodeInputCustomEvent, type SdButtonCustomEvent, type SdButtonV2CustomEvent, type SdCheckboxCustomEvent, type SdDateRangePickerCustomEvent, type SdDropdownButtonCustomEvent, type SdFilePickerCustomEvent, type SdGhostButtonCustomEvent, type SdInputCustomEvent, type SdNumberInputCustomEvent, type SdRadioButtonGroupCustomEvent, type SdRadioCustomEvent, type SdRadioGroupCustomEvent, type SdSelectCustomEvent, type SdSelectDropdownCustomEvent, type SdSelectGroupCustomEvent, type SdSelectMultipleCustomEvent, type SdSelectMultipleGroupCustomEvent, type SdSelectOptionCustomEvent, type SdSelectOptionGroupCustomEvent, type SdSelectV2CustomEvent, type SdSelectV2ListItemCustomEvent, type SdSelectV2ListboxCustomEvent, type SdTextareaCustomEvent, type SelectEvents, type SelectMultipleEvents, type SelectOption, type SelectOptionGroup, type SelectV2Option, type SelectV2OptionSelectDetail, type SelectV2Value } from "@sellmate/design-system";
+import { type CheckedType, type DateRangeValue, type DropdownButtonValue, type Event, type RadioValue, type Row, type SdBarcodeInputCustomEvent, type SdButtonCustomEvent, type SdButtonV2CustomEvent, type SdCheckboxCustomEvent, type SdDateRangePickerCustomEvent, type SdDropdownButtonCustomEvent, type SdFilePickerCustomEvent, type SdGhostButtonCustomEvent, type SdInputCustomEvent, type SdNumberInputCustomEvent, type SdRadioButtonCustomEvent, type SdRadioCustomEvent, type SdRadioGroupCustomEvent, type SdSelectCustomEvent, type SdSelectDropdownCustomEvent, type SdSelectGroupCustomEvent, type SdSelectMultipleCustomEvent, type SdSelectMultipleGroupCustomEvent, type SdSelectOptionCustomEvent, type SdSelectOptionGroupCustomEvent, type SdSelectV2CustomEvent, type SdSelectV2ListItemCustomEvent, type SdSelectV2ListboxCustomEvent, type SdTableCustomEvent, type SdTextareaCustomEvent, type SelectEvents, type SelectMultipleEvents, type SelectOption, type SelectOptionGroup, type SelectV2Option, type SelectV2OptionSelectDetail, type SelectV2Value } from "@sellmate/design-system";
 import { SdActionModal as SdActionModalElement } from "@sellmate/design-system/dist/components/sd-action-modal.js";
 import { SdBadge as SdBadgeElement } from "@sellmate/design-system/dist/components/sd-badge.js";
 import { SdBarcodeInput as SdBarcodeInputElement } from "@sellmate/design-system/dist/components/sd-barcode-input.js";
@@ -17,6 +17,7 @@ import { SdButton as SdButtonElement } from "@sellmate/design-system/dist/compon
 import { SdCalendar as SdCalendarElement } from "@sellmate/design-system/dist/components/sd-calendar.js";
 import { SdCard as SdCardElement } from "@sellmate/design-system/dist/components/sd-card.js";
 import { SdCheckbox as SdCheckboxElement } from "@sellmate/design-system/dist/components/sd-checkbox.js";
+import { SdCircleProgress as SdCircleProgressElement } from "@sellmate/design-system/dist/components/sd-circle-progress.js";
 import { SdConfirmModal as SdConfirmModalElement } from "@sellmate/design-system/dist/components/sd-confirm-modal.js";
 import { SdDateBox as SdDateBoxElement } from "@sellmate/design-system/dist/components/sd-date-box.js";
 import { SdDatePickerCalendar as SdDatePickerCalendarElement } from "@sellmate/design-system/dist/components/sd-date-picker-calendar.js";
@@ -33,14 +34,15 @@ import { SdGhostButton as SdGhostButtonElement } from "@sellmate/design-system/d
 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";
-import { SdLoadingSpinner as SdLoadingSpinnerElement } from "@sellmate/design-system/dist/components/sd-loading-spinner.js";
+import { SdLoadingContainer as SdLoadingContainerElement } from "@sellmate/design-system/dist/components/sd-loading-container.js";
+import { SdLoadingModal as SdLoadingModalElement } from "@sellmate/design-system/dist/components/sd-loading-modal.js";
 import { SdModalContainer as SdModalContainerElement } from "@sellmate/design-system/dist/components/sd-modal-container.js";
 import { SdNumberInput as SdNumberInputElement } from "@sellmate/design-system/dist/components/sd-number-input.js";
 import { SdPagination as SdPaginationElement } from "@sellmate/design-system/dist/components/sd-pagination.js";
 import { SdPopover as SdPopoverElement } from "@sellmate/design-system/dist/components/sd-popover.js";
 import { SdPortal as SdPortalElement } from "@sellmate/design-system/dist/components/sd-portal.js";
 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 { SdRadioButton as SdRadioButtonElement } from "@sellmate/design-system/dist/components/sd-radio-button.js";
 import { SdRadioGroup as SdRadioGroupElement } from "@sellmate/design-system/dist/components/sd-radio-group.js";
 import { SdRadio as SdRadioElement } from "@sellmate/design-system/dist/components/sd-radio.js";
 import { SdSelectDropdown as SdSelectDropdownElement } from "@sellmate/design-system/dist/components/sd-select-dropdown.js";
@@ -56,15 +58,21 @@ import { SdSelectV2Listbox as SdSelectV2ListboxElement } from "@sellmate/design-
 import { SdSelectV2Trigger as SdSelectV2TriggerElement } from "@sellmate/design-system/dist/components/sd-select-v2-trigger.js";
 import { SdSelectV2 as SdSelectV2Element } from "@sellmate/design-system/dist/components/sd-select-v2.js";
 import { SdSelect as SdSelectElement } from "@sellmate/design-system/dist/components/sd-select.js";
+import { SdSwitch as SdSwitchElement } from "@sellmate/design-system/dist/components/sd-switch.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 { SdTextLink as SdTextLinkElement } from "@sellmate/design-system/dist/components/sd-text-link.js";
 import { SdTextarea as SdTextareaElement } from "@sellmate/design-system/dist/components/sd-textarea.js";
+import { SdThead as SdTheadElement } from "@sellmate/design-system/dist/components/sd-thead.js";
 import { SdToastContainer as SdToastContainerElement } from "@sellmate/design-system/dist/components/sd-toast-container.js";
 import { SdToast as SdToastElement } from "@sellmate/design-system/dist/components/sd-toast.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 { 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 { TableTest as TableTestElement } from "@sellmate/design-system/dist/components/table-test.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';
 
@@ -122,9 +130,9 @@ export const SdBarcodeInput: StencilReactComponent<SdBarcodeInputElement, SdBarc
         focused: 'focused',
         hovered: 'hovered',
         label: 'label',
+        labelWidth: 'label-width',
         labelTooltip: 'label-tooltip',
-        rules: 'rules'
-    },
+        rules: 'rules'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdBarcodeInput as ReactWebComponent<SdBarcodeInputElement, SdBarcodeInputEvents>,
     serializeShadowRoot,
@@ -161,6 +169,7 @@ export const SdButtonV2: StencilReactComponent<SdButtonV2Element, SdButtonV2Even
         name: 'name',
         label: 'label',
         icon: 'icon',
+        rightIcon: 'right-icon',
         ariaLabel: 'aria-label',
         disabled: 'disabled',
         type: 'type'
@@ -204,6 +213,7 @@ export const SdCheckbox: StencilReactComponent<SdCheckboxElement, SdCheckboxEven
         value: 'value',
         val: 'val',
         disabled: 'disabled',
+        inverse: 'inverse',
         label: 'label'
     },
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
@@ -211,6 +221,20 @@ export const SdCheckbox: StencilReactComponent<SdCheckboxElement, SdCheckboxEven
     serializeShadowRoot,
 });
 
+export type SdCircleProgressEvents = NonNullable<unknown>;
+
+export const SdCircleProgress: StencilReactComponent<SdCircleProgressElement, SdCircleProgressEvents> = /*@__PURE__*/ createComponent<SdCircleProgressElement, SdCircleProgressEvents>({
+    tagName: 'sd-circle-progress',
+    properties: {
+        indeterminate: 'indeterminate',
+        value: 'value',
+        type: 'type'
+    },
+    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
+    clientModule: clientComponents.SdCircleProgress as ReactWebComponent<SdCircleProgressElement, SdCircleProgressEvents>,
+    serializeShadowRoot,
+});
+
 export type SdConfirmModalEvents = {
     onSdClose: EventName<CustomEvent<void>>,
     onSdCancel: EventName<CustomEvent<void>>,
@@ -230,8 +254,7 @@ export const SdConfirmModal: StencilReactComponent<SdConfirmModalElement, SdConf
         tagLabel: 'tag-label',
         slotLabel: 'slot-label',
         topMessage: 'topMessage',
-        bottomMessage: 'bottomMessage'
-    },
+        bottomMessage: 'bottomMessage'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdConfirmModal as ReactWebComponent<SdConfirmModalElement, SdConfirmModalEvents>,
     serializeShadowRoot,
@@ -273,14 +296,14 @@ export const SdDatePicker: StencilReactComponent<SdDatePickerElement, SdDatePick
         disabled: 'disabled',
         width: 'width',
         label: 'label',
+        labelWidth: 'label-width',
         addonLabel: 'addon-label',
         hint: 'hint',
         errorMessage: 'error-message',
         fieldName: 'field-name',
         error: 'error',
         labelTooltip: 'label-tooltip',
-        rules: 'rules'
-    },
+        rules: 'rules'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdDatePicker as ReactWebComponent<SdDatePickerElement, SdDatePickerEvents>,
     serializeShadowRoot,
@@ -328,14 +351,14 @@ export const SdDateRangePicker: StencilReactComponent<SdDateRangePickerElement,
         disabled: 'disabled',
         width: 'width',
         label: 'label',
+        labelWidth: 'label-width',
         addonLabel: 'addon-label',
         hint: 'hint',
         errorMessage: 'error-message',
         fieldName: 'field-name',
         error: 'error',
         labelTooltip: 'label-tooltip',
-        rules: 'rules'
-    },
+        rules: 'rules'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdDateRangePicker as ReactWebComponent<SdDateRangePickerElement, SdDateRangePickerEvents>,
     serializeShadowRoot,
@@ -365,8 +388,7 @@ export const SdDropdownButton: StencilReactComponent<SdDropdownButtonElement, Sd
         name: 'name',
         label: 'label',
         disabled: 'disabled',
-        items: 'items'
-    },
+        items: 'items'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdDropdownButton as ReactWebComponent<SdDropdownButtonElement, SdDropdownButtonEvents>,
     serializeShadowRoot,
@@ -386,11 +408,12 @@ export const SdField: StencilReactComponent<SdFieldElement, SdFieldEvents> = /*@
         hint: 'hint',
         errorMessage: 'error-message',
         width: 'width',
+        size: 'size',
         label: 'label',
+        labelWidth: 'label-width',
         addonLabel: 'addon-label',
         labelTooltip: 'label-tooltip',
-        rules: 'rules'
-    },
+        rules: 'rules'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdField as ReactWebComponent<SdFieldElement, SdFieldEvents>,
     serializeShadowRoot,
@@ -398,7 +421,10 @@ export const SdField: StencilReactComponent<SdFieldElement, SdFieldEvents> = /*@
 
 export type SdFilePickerEvents = {
     onSdUpdate: EventName<SdFilePickerCustomEvent<File[] | File | null>>,
-    onSdReject: EventName<SdFilePickerCustomEvent<{ files: File[]; reason: 'max-file-size' | 'max-total-size' | 'max-files' }>>
+    onSdReject: EventName<SdFilePickerCustomEvent<{
+        files: File[];
+        reason: 'max-file-size' | 'max-total-size' | 'max-files';
+    }>>
 };
 
 export const SdFilePicker: StencilReactComponent<SdFilePickerElement, SdFilePickerEvents> = /*@__PURE__*/ createComponent<SdFilePickerElement, SdFilePickerEvents>({
@@ -414,6 +440,7 @@ export const SdFilePicker: StencilReactComponent<SdFilePickerElement, SdFilePick
         maxFiles: 'max-files',
         name: 'name',
         label: 'label',
+        labelWidth: 'label-width',
         addonLabel: 'addon-label',
         hint: 'hint',
         errorMessage: 'error-message',
@@ -424,8 +451,7 @@ export const SdFilePicker: StencilReactComponent<SdFilePickerElement, SdFilePick
         focused: 'focused',
         hovered: 'hovered',
         value: 'value',
-        rules: 'rules'
-    },
+        rules: 'rules'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdFilePicker as ReactWebComponent<SdFilePickerElement, SdFilePickerEvents>,
     serializeShadowRoot,
@@ -485,8 +511,7 @@ export const SdGuide: StencilReactComponent<SdGuideElement, SdGuideEvents> = /*@
         message: 'message',
         guideUrl: 'guide-url',
         popupTitle: 'popup-title',
-        popupWidth: 'popup-width'
-    },
+        popupWidth: 'popup-width'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdGuide as ReactWebComponent<SdGuideElement, SdGuideEvents>,
     serializeShadowRoot,
@@ -541,21 +566,37 @@ export const SdInput: StencilReactComponent<SdInputElement, SdInputEvents> = /*@
         focused: 'focused',
         hovered: 'hovered',
         label: 'label',
+        labelWidth: 'label-width',
         labelTooltip: 'label-tooltip',
-        rules: 'rules'
-    },
+        rules: 'rules'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdInput as ReactWebComponent<SdInputElement, SdInputEvents>,
     serializeShadowRoot,
 });
 
-export type SdLoadingSpinnerEvents = NonNullable<unknown>;
+export type SdLoadingContainerEvents = NonNullable<unknown>;
 
-export const SdLoadingSpinner: StencilReactComponent<SdLoadingSpinnerElement, SdLoadingSpinnerEvents> = /*@__PURE__*/ createComponent<SdLoadingSpinnerElement, SdLoadingSpinnerEvents>({
-    tagName: 'sd-loading-spinner',
-    properties: { color: 'color' },
+export const SdLoadingContainer: StencilReactComponent<SdLoadingContainerElement, SdLoadingContainerEvents> = /*@__PURE__*/ createComponent<SdLoadingContainerElement, SdLoadingContainerEvents>({
+    tagName: 'sd-loading-container',
+    properties: {},
+    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
+    clientModule: clientComponents.SdLoadingContainer as ReactWebComponent<SdLoadingContainerElement, SdLoadingContainerEvents>,
+    serializeShadowRoot,
+});
+
+export type SdLoadingModalEvents = { onSdClick: EventName<CustomEvent<void>> };
+
+export const SdLoadingModal: StencilReactComponent<SdLoadingModalElement, SdLoadingModalEvents> = /*@__PURE__*/ createComponent<SdLoadingModalElement, SdLoadingModalEvents>({
+    tagName: 'sd-loading-modal',
+    properties: {
+        state: 'state',
+        message: 'message',
+        buttonLabel: 'button-label',
+        width: 'width',
+        height: 'height'
+    },
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
-    clientModule: clientComponents.SdLoadingSpinner as ReactWebComponent<SdLoadingSpinnerElement, SdLoadingSpinnerEvents>,
+    clientModule: clientComponents.SdLoadingModal as ReactWebComponent<SdLoadingModalElement, SdLoadingModalEvents>,
     serializeShadowRoot,
 });
 
@@ -586,6 +627,7 @@ export const SdNumberInput: StencilReactComponent<SdNumberInputElement, SdNumber
         useDecimal: 'use-decimal',
         value: 'value',
         label: 'label',
+        labelWidth: 'label-width',
         addonLabel: 'addon-label',
         placeholder: 'placeholder',
         disabled: 'disabled',
@@ -601,8 +643,7 @@ export const SdNumberInput: StencilReactComponent<SdNumberInputElement, SdNumber
         error: 'error',
         focused: 'focused',
         hovered: 'hovered',
-        rules: 'rules'
-    },
+        rules: 'rules'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdNumberInput as ReactWebComponent<SdNumberInputElement, SdNumberInputEvents>,
     serializeShadowRoot,
@@ -639,8 +680,7 @@ export const SdPopover: StencilReactComponent<SdPopoverElement, SdPopoverEvents>
         menuClass: 'menu-class',
         noHover: 'no-hover',
         useClose: 'use-close',
-        messages: 'messages'
-    },
+        messages: 'messages'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdPopover as ReactWebComponent<SdPopoverElement, SdPopoverEvents>,
     serializeShadowRoot,
@@ -693,19 +733,18 @@ export const SdRadio: StencilReactComponent<SdRadioElement, SdRadioEvents> = /*@
     serializeShadowRoot,
 });
 
-export type SdRadioButtonGroupEvents = { onSdUpdate: EventName<SdRadioButtonGroupCustomEvent<RadioValue>> };
+export type SdRadioButtonEvents = { onSdUpdate: EventName<SdRadioButtonCustomEvent<RadioValue>> };
 
-export const SdRadioButtonGroup: StencilReactComponent<SdRadioButtonGroupElement, SdRadioButtonGroupEvents> = /*@__PURE__*/ createComponent<SdRadioButtonGroupElement, SdRadioButtonGroupEvents>({
-    tagName: 'sd-radio-button-group',
+export const SdRadioButton: StencilReactComponent<SdRadioButtonElement, SdRadioButtonEvents> = /*@__PURE__*/ createComponent<SdRadioButtonElement, SdRadioButtonEvents>({
+    tagName: 'sd-radio-button',
     properties: {
         value: 'value',
         size: 'size',
         disabled: 'disabled',
         name: 'name',
-        options: 'options'
-    },
+        options: 'options'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
-    clientModule: clientComponents.SdRadioButtonGroup as ReactWebComponent<SdRadioButtonGroupElement, SdRadioButtonGroupEvents>,
+    clientModule: clientComponents.SdRadioButton as ReactWebComponent<SdRadioButtonElement, SdRadioButtonEvents>,
     serializeShadowRoot,
 });
 
@@ -718,8 +757,7 @@ export const SdRadioGroup: StencilReactComponent<SdRadioGroupElement, SdRadioGro
         direction: 'direction',
         disabled: 'disabled',
         groupName: 'group-name',
-        options: 'options'
-    },
+        options: 'options'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdRadioGroup as ReactWebComponent<SdRadioGroupElement, SdRadioGroupEvents>,
     serializeShadowRoot,
@@ -743,12 +781,12 @@ export const SdSelect: StencilReactComponent<SdSelectElement, SdSelectEvents> =
         clearable: 'clearable',
         searchable: 'searchable',
         label: 'label',
+        labelWidth: 'label-width',
         addonLabel: 'addon-label',
         labelTooltip: 'label-tooltip',
         error: 'error',
         options: 'options',
-        rules: 'rules'
-    },
+        rules: 'rules'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdSelect as ReactWebComponent<SdSelectElement, SdSelectEvents>,
     serializeShadowRoot,
@@ -775,8 +813,7 @@ export const SdSelectDropdown: StencilReactComponent<SdSelectDropdownElement, Sd
         optionPlaceholder: 'option-placeholder',
         useCheckbox: 'use-checkbox',
         useAll: 'use-all',
-        options: 'options'
-    },
+        options: 'options'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdSelectDropdown as ReactWebComponent<SdSelectDropdownElement, SdSelectDropdownEvents>,
     serializeShadowRoot,
@@ -800,12 +837,12 @@ export const SdSelectGroup: StencilReactComponent<SdSelectGroupElement, SdSelect
         clearable: 'clearable',
         searchable: 'searchable',
         label: 'label',
+        labelWidth: 'label-width',
         addonLabel: 'addon-label',
         labelTooltip: 'label-tooltip',
         error: 'error',
         options: 'options',
-        rules: 'rules'
-    },
+        rules: 'rules'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdSelectGroup as ReactWebComponent<SdSelectGroupElement, SdSelectGroupEvents>,
     serializeShadowRoot,
@@ -830,12 +867,12 @@ export const SdSelectMultiple: StencilReactComponent<SdSelectMultipleElement, Sd
         useAll: 'use-all',
         useCheckbox: 'use-checkbox',
         label: 'label',
+        labelWidth: 'label-width',
         labelTooltip: 'label-tooltip',
         error: 'error',
         value: 'value',
         options: 'options',
-        rules: 'rules'
-    },
+        rules: 'rules'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdSelectMultiple as ReactWebComponent<SdSelectMultipleElement, SdSelectMultipleEvents>,
     serializeShadowRoot,
@@ -861,12 +898,12 @@ export const SdSelectMultipleGroup: StencilReactComponent<SdSelectMultipleGroupE
         allCheckedLabel: 'all-checked-label',
         allCheckOptionLabel: 'all-check-option-label',
         label: 'label',
+        labelWidth: 'label-width',
         labelTooltip: 'label-tooltip',
         error: 'error',
         value: 'value',
         options: 'options',
-        rules: 'rules'
-    },
+        rules: 'rules'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdSelectMultipleGroup as ReactWebComponent<SdSelectMultipleGroupElement, SdSelectMultipleGroupEvents>,
     serializeShadowRoot,
@@ -949,6 +986,7 @@ export const SdSelectV2: StencilReactComponent<SdSelectV2Element, SdSelectV2Even
         dropdownHeight: 'dropdown-height',
         disabled: 'disabled',
         label: 'label',
+        labelWidth: 'label-width',
         addonLabel: 'addon-label',
         error: 'error',
         hint: 'hint',
@@ -958,8 +996,7 @@ export const SdSelectV2: StencilReactComponent<SdSelectV2Element, SdSelectV2Even
         emitValue: 'emit-value',
         width: 'width',
         options: 'options',
-        rules: 'rules'
-    },
+        rules: 'rules'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdSelectV2 as ReactWebComponent<SdSelectV2Element, SdSelectV2Events>,
     serializeShadowRoot,
@@ -1004,8 +1041,7 @@ export const SdSelectV2Listbox: StencilReactComponent<SdSelectV2ListboxElement,
         triggerWidth: 'trigger-width',
         maxWidth: 'max-width',
         maxHeight: 'max-height',
-        options: 'options'
-    },
+        options: 'options'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdSelectV2Listbox as ReactWebComponent<SdSelectV2ListboxElement, SdSelectV2ListboxEvents>,
     serializeShadowRoot,
@@ -1026,6 +1062,63 @@ export const SdSelectV2Trigger: StencilReactComponent<SdSelectV2TriggerElement,
     serializeShadowRoot,
 });
 
+export type SdSwitchEvents = { onSdUpdate: EventName<CustomEvent<boolean>> };
+
+export const SdSwitch: StencilReactComponent<SdSwitchElement, SdSwitchEvents> = /*@__PURE__*/ createComponent<SdSwitchElement, SdSwitchEvents>({
+    tagName: 'sd-switch',
+    properties: {
+        value: 'value',
+        label: 'label',
+        disabled: 'disabled'
+    },
+    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
+    clientModule: clientComponents.SdSwitch as ReactWebComponent<SdSwitchElement, SdSwitchEvents>,
+    serializeShadowRoot,
+});
+
+export type SdTableEvents = {
+    onSdSelectChange: EventName<SdTableCustomEvent<Row[]>>,
+    onSdPageChange: EventName<CustomEvent<number>>,
+    onSdRowsPerPageChange: EventName<CustomEvent<number>>,
+    onSdVirtualUpdate: EventName<CustomEvent<{
+        from: number;
+        to: number;
+    }>>,
+    onSdVirtualReachEnd: EventName<CustomEvent<{
+        from: number;
+        to: number;
+        rowCount: number;
+        threshold: number;
+    }>>
+};
+
+export const SdTable: StencilReactComponent<SdTableElement, SdTableEvents> = /*@__PURE__*/ createComponent<SdTableElement, SdTableEvents>({
+    tagName: 'sd-table',
+    properties: {
+        tableId: 'table-id',
+        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',
+        useVirtualScroll: 'use-virtual-scroll',
+        rowHeight: 'row-height',
+        virtualBuffer: 'virtual-buffer',
+        virtualEndThreshold: 'virtual-end-threshold',
+        columns: 'columns',
+        rows: 'rows',
+        selected: 'selected',
+        rowsPerPageOption: 'rowsPerPageOption'},
+    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
+    clientModule: clientComponents.SdTable as ReactWebComponent<SdTableElement, SdTableEvents>,
+    serializeShadowRoot,
+});
+
 export type SdTabsEvents = { onSdUpdate: EventName<CustomEvent<string>> };
 
 export const SdTabs: StencilReactComponent<SdTabsElement, SdTabsEvents> = /*@__PURE__*/ createComponent<SdTabsElement, SdTabsEvents>({
@@ -1034,8 +1127,7 @@ export const SdTabs: StencilReactComponent<SdTabsElement, SdTabsEvents> = /*@__P
         value: 'value',
         size: 'size',
         isSub: 'is-sub',
-        tabs: 'tabs'
-    },
+        tabs: 'tabs'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdTabs as ReactWebComponent<SdTabsElement, SdTabsEvents>,
     serializeShadowRoot,
@@ -1056,6 +1148,31 @@ 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: {
+        rows: 'rows'},
+    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
+    clientModule: clientComponents.SdTbody as ReactWebComponent<SdTbodyElement, SdTbodyEvents>,
+    serializeShadowRoot,
+});
+
+export type SdTdEvents = NonNullable<unknown>;
+
+export const SdTd: StencilReactComponent<SdTdElement, SdTdEvents> = /*@__PURE__*/ createComponent<SdTdElement, SdTdEvents>({
+    tagName: 'sd-td',
+    properties: {
+        field: 'field',
+        rowKey: 'row-key',
+        align: 'align'
+    },
+    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
+    clientModule: clientComponents.SdTd as ReactWebComponent<SdTdElement, SdTdEvents>,
+    serializeShadowRoot,
+});
+
 export type SdTextLinkEvents = { onSdClick: EventName<CustomEvent<void>> };
 
 export const SdTextLink: StencilReactComponent<SdTextLinkElement, SdTextLinkEvents> = /*@__PURE__*/ createComponent<SdTextLinkElement, SdTextLinkEvents>({
@@ -1094,6 +1211,7 @@ export const SdTextarea: StencilReactComponent<SdTextareaElement, SdTextareaEven
         spellcheck: 'spellcheck',
         width: 'width',
         label: 'label',
+        labelWidth: 'label-width',
         addonLabel: 'addon-label',
         hint: 'hint',
         errorMessage: 'error-message',
@@ -1102,13 +1220,30 @@ export const SdTextarea: StencilReactComponent<SdTextareaElement, SdTextareaEven
         status: 'status',
         focused: 'focused',
         hovered: 'hovered',
-        rules: 'rules'
-    },
+        rules: 'rules'},
     hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
     clientModule: clientComponents.SdTextarea as ReactWebComponent<SdTextareaElement, SdTextareaEvents>,
     serializeShadowRoot,
 });
 
+export type SdTheadEvents = NonNullable<unknown>;
+
+export const SdThead: StencilReactComponent<SdTheadElement, SdTheadEvents> = /*@__PURE__*/ createComponent<SdTheadElement, SdTheadEvents>({
+    tagName: 'sd-thead',
+    properties: {
+        selectable: 'selectable',
+        resizable: 'resizable',
+        stickyHeader: 'sticky-header',
+        scrolledLeft: 'scrolled-left',
+        scrolledRight: 'scrolled-right',
+        columns: 'columns',
+        rows: 'rows',
+        columnWidths: 'columnWidths'},
+    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
+    clientModule: clientComponents.SdThead as ReactWebComponent<SdTheadElement, SdTheadEvents>,
+    serializeShadowRoot,
+});
+
 export type SdToastEvents = { onSdClose: EventName<CustomEvent<void>> };
 
 export const SdToast: StencilReactComponent<SdToastElement, SdToastEvents> = /*@__PURE__*/ createComponent<SdToastElement, SdToastEvents>({
@@ -1158,20 +1293,6 @@ export const SdToggle: StencilReactComponent<SdToggleElement, SdToggleEvents> =
     serializeShadowRoot,
 });
 
-export type SdToggleButtonEvents = { onSdUpdate: EventName<CustomEvent<boolean>> };
-
-export const SdToggleButton: StencilReactComponent<SdToggleButtonElement, SdToggleButtonEvents> = /*@__PURE__*/ createComponent<SdToggleButtonElement, SdToggleButtonEvents>({
-    tagName: 'sd-toggle-button',
-    properties: {
-        value: 'value',
-        label: 'label',
-        disabled: 'disabled'
-    },
-    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
-    clientModule: clientComponents.SdToggleButton as ReactWebComponent<SdToggleButtonElement, SdToggleButtonEvents>,
-    serializeShadowRoot,
-});
-
 export type SdTooltipEvents = NonNullable<unknown>;
 
 export const SdTooltip: StencilReactComponent<SdTooltipElement, SdTooltipEvents> = /*@__PURE__*/ createComponent<SdTooltipElement, SdTooltipEvents>({
@@ -1193,3 +1314,30 @@ export const SdTooltip: StencilReactComponent<SdTooltipElement, SdTooltipEvents>
     clientModule: clientComponents.SdTooltip as ReactWebComponent<SdTooltipElement, SdTooltipEvents>,
     serializeShadowRoot,
 });
+
+export type SdTrEvents = NonNullable<unknown>;
+
+export const SdTr: StencilReactComponent<SdTrElement, SdTrEvents> = /*@__PURE__*/ createComponent<SdTrElement, SdTrEvents>({
+    tagName: 'sd-tr',
+    properties: {
+        selectable: 'selectable',
+        rowKey: 'row-key',
+        columns: 'columns'},
+    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
+    clientModule: clientComponents.SdTr as ReactWebComponent<SdTrElement, SdTrEvents>,
+    serializeShadowRoot,
+});
+
+export type TableTestEvents = { onTableReady: EventName<CustomEvent<void>> };
+
+export const TableTest: StencilReactComponent<TableTestElement, TableTestEvents> = /*@__PURE__*/ createComponent<TableTestElement, TableTestEvents>({
+    tagName: 'table-test',
+    properties: {
+        bordered: 'bordered',
+        striped: 'striped',
+        columns: 'columns',
+        rows: 'rows'},
+    hydrateModule: import('@sellmate/design-system/hydrate') as Promise<HydrateModule>,
+    clientModule: clientComponents.TableTest as ReactWebComponent<TableTestElement, TableTestEvents>,
+    serializeShadowRoot,
+});