@sellmate/design-system 1.31.0 → 1.33.0

package/dist/types/components/sd-expansion-item/sd-expansion-item.d.ts

@@ -0,0 +1,21 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class SdExpansionItem {
+    /** 헤더에 표시할 텍스트 */
+    title: string;
+    /** 펼침 상태 */
+    expanded: boolean;
+    /** compact 높이 사용 여부 */
+    dense: boolean;
+    /** 중첩 단계 (1~3) */
+    depth: 1 | 2 | 3;
+    private hasBody;
+    /** body 내부 패딩 사용 여부 */
+    bodyPadding: boolean;
+    /** 토글 비활성화 여부 */
+    disabled: boolean;
+    /** 펼침 상태 변경 시 발생합니다. */
+    toggle: EventEmitter<boolean>;
+    private handleToggle;
+    private handleSlotChange;
+    render(): any;
+}

package/dist/types/components/sd-field/sd-field.d.ts

@@ -24,7 +24,11 @@ export declare class SdField implements ValidatableField {
     hint: string;
     /** 에러 메시지 */
     errorMessage: string;
-    /** 필드 너비 (숫자면 px, 문자열이면 그대로 적용) */
+    /**
+     * 필드 너비 (숫자면 px, 문자열이면 그대로 적용).
+     * 지정하면 필드가 부모 폭을 다 먹지 않고 (레이블 + width) 만큼만 차지한다.
+     * 다른 요소와 나란히 놓으려면 부모를 flex 로 두면 된다.
+     */
     width: string | number;
     /** 필드 크기 */
     size: FieldSize;

package/dist/types/components/sd-number-input/sd-number-input.config.d.ts

@@ -47,8 +47,8 @@ export declare const NUMBER_INPUT_HINT: {
         fontFamily: string;
         fontWeight: string;
         fontSize: string;
-        lineHeight: string;
         textDecoration: string;
+        lineHeight: string;
     };
     color: string;
 };
@@ -57,8 +57,8 @@ export declare const NUMBER_INPUT_ERROR_MESSAGE: {
         fontFamily: string;
         fontWeight: string;
         fontSize: string;
-        lineHeight: string;
         textDecoration: string;
+        lineHeight: string;
     };
     color: string;
 };

package/dist/types/components/sd-scroll-area/sd-scroll-area.config.d.ts

@@ -0,0 +1,5 @@
+export declare const SCROLL_AREA_AXES: readonly ["vertical", "horizontal", "both"];
+export type ScrollAreaAxis = (typeof SCROLL_AREA_AXES)[number];
+export declare const SCROLL_AREA_COLORS: {
+    border: string;
+};

package/dist/types/components/sd-scroll-area/sd-scroll-area.d.ts

@@ -0,0 +1,14 @@
+import { type ScrollAreaAxis } from './sd-scroll-area.config';
+export declare class SdScrollArea {
+    /** 스크롤 방향. vertical=세로만, horizontal=가로만, both=양방향 */
+    axis: ScrollAreaAxis;
+    /** true면 스크롤바 트랙 배경을 채운다. 콘텐츠 영역 배경은 바뀌지 않는다. */
+    background: boolean;
+    /** true면 스크롤바와 콘텐츠 사이에 1px 구분선을 그린다. 컨테이너 테두리가 아니다. */
+    bordered: boolean;
+    /** viewport 최대 높이 (예: '400px'). 비우면 호스트 크기를 따른다. */
+    maxHeight: string;
+    /** viewport 최대 너비 (예: '480px'). 비우면 호스트 크기를 따른다. */
+    maxWidth: string;
+    render(): any;
+}

package/dist/types/components/sd-stepper/sd-stepper.config.d.ts

@@ -0,0 +1,43 @@
+export type StepperSize = 'sm' | 'lg';
+export type StepperItem = {
+    label: string;
+    value?: string;
+};
+export declare const STEPPER_SIZES: Record<StepperSize, {
+    sequenceSize: string;
+    fontFamily: string;
+    fontSize: string;
+    lineHeight: string;
+    fontWeightActive: string;
+    fontWeightDefault: string;
+}>;
+export declare const STEPPER_LAYOUT: {
+    containerGap: string;
+    itemGap: string;
+    dashWidth: string;
+    radius: string;
+    borderWidth: string;
+    iconSize: string;
+};
+export declare const STEPPER_COLORS: {
+    dash: string;
+    sequenceBorder: {
+        active: string;
+        default: string;
+        completed: string;
+        witdh: string;
+    };
+    sequenceBg: {
+        active: string;
+        default: string;
+        completed: string;
+    };
+    sequenceText: {
+        active: string;
+        default: string;
+    };
+    text: {
+        active: string;
+        default: string;
+    };
+};

package/dist/types/components/sd-stepper/sd-stepper.d.ts

@@ -0,0 +1,18 @@
+import { type StepperItem, type StepperSize } from './sd-stepper.config';
+export declare class SdStepper {
+    /** 단계 목록 */
+    items: StepperItem[];
+    /** 현재 활성 단계 value */
+    value: string;
+    /** 크기 */
+    size: StepperSize;
+    /** 접근성 레이블 */
+    ariaLabel: string;
+    valueChanged(newValue: string): void;
+    private getItemValue;
+    private getActiveIndex;
+    private getState;
+    private buildCssVars;
+    private getStateVars;
+    render(): any;
+}

package/dist/types/components/sd-time-picker/sd-time-picker.config.d.ts

@@ -15,10 +15,10 @@ export interface TimePickerSizeTokens {
 export declare const TIMEPICKER_SIZE_MAP: Record<TimePickerSize, TimePickerSizeTokens>;
 export declare const TIMEPICKER_COLORS: {
     border: {
+        width: string;
         default: string;
         focus: string;
         disabled: string;
-        width: string;
     };
     bg: {
         default: string;
@@ -50,12 +50,19 @@ export declare const TIMEPICKER_SELECTOR: {
     inputWidth: string;
     colonSize: string;
     range: {
+        paddingXY: string;
+        panelGap: string;
         heading: {
             color: string;
+            typography: {
+                fontFamily: string;
+                fontSize: string;
+                textDecoration: string;
+                lineHeight: string;
+                fontWeight: string;
+            };
             gap: string;
         };
-        paddingXY: string;
-        panelGap: string;
         section: {
             gap: string;
         };

package/dist/types/components.d.ts

@@ -39,7 +39,9 @@ import { RadioValue } from "./components/sd-radio/sd-radio";
 import { RadioValue as RadioValue1 } from "./components/sd-radio/sd-radio";
 import { RadioOption } from "./components/sd-radio-button/sd-radio-button";
 import { RadioOption as RadioOption1 } from "./components/sd-radio-group/sd-radio-group";
+import { ScrollAreaAxis } from "./components/sd-scroll-area/sd-scroll-area.config";
 import { SelectOption, SelectOptionSelectDetail, SelectType, SelectValue } from "./components/sd-select/sd-select.config";
+import { StepperItem, StepperSize } from "./components/sd-stepper/sd-stepper.config";
 import { TabOption, TabSize } from "./components/sd-tabs/sd-tabs.config";
 import { TagName as TagName1 } from "./components/sd-tag/sd-tag.config";
 import { TextLinkSize } from "./components/sd-text-link/sd-text-link.config";
@@ -81,7 +83,9 @@ export { RadioValue } from "./components/sd-radio/sd-radio";
 export { RadioValue as RadioValue1 } from "./components/sd-radio/sd-radio";
 export { RadioOption } from "./components/sd-radio-button/sd-radio-button";
 export { RadioOption as RadioOption1 } from "./components/sd-radio-group/sd-radio-group";
+export { ScrollAreaAxis } from "./components/sd-scroll-area/sd-scroll-area.config";
 export { SelectOption, SelectOptionSelectDetail, SelectType, SelectValue } from "./components/sd-select/sd-select.config";
+export { StepperItem, StepperSize } from "./components/sd-stepper/sd-stepper.config";
 export { TabOption, TabSize } from "./components/sd-tabs/sd-tabs.config";
 export { TagName as TagName1 } from "./components/sd-tag/sd-tag.config";
 export { TextLinkSize } from "./components/sd-text-link/sd-text-link.config";
@@ -1013,6 +1017,38 @@ export namespace Components {
          */
         "split": boolean;
     }
+    interface SdExpansionItem {
+        /**
+          * body 내부 패딩 사용 여부
+          * @default true
+         */
+        "bodyPadding": boolean;
+        /**
+          * compact 높이 사용 여부
+          * @default false
+         */
+        "dense": boolean;
+        /**
+          * 중첩 단계 (1~3)
+          * @default 1
+         */
+        "depth": 1 | 2 | 3;
+        /**
+          * 토글 비활성화 여부
+          * @default false
+         */
+        "disabled": boolean;
+        /**
+          * 펼침 상태
+          * @default false
+         */
+        "expanded": boolean;
+        /**
+          * 헤더에 표시할 텍스트
+          * @default ''
+         */
+        "title": string;
+    }
     interface SdField {
         /**
           * 어드온 정렬 방향
@@ -1134,7 +1170,7 @@ export namespace Components {
          */
         "status"?: 'default' | 'pass' | 'error';
         /**
-          * 필드 너비 (숫자면 px, 문자열이면 그대로 적용)
+          * 필드 너비 (숫자면 px, 문자열이면 그대로 적용). 지정하면 필드가 부모 폭을 다 먹지 않고 (레이블 + width) 만큼만 차지한다. 다른 요소와 나란히 놓으려면 부모를 flex 로 두면 된다.
           * @default ''
          */
         "width": string | number;
@@ -2113,6 +2149,33 @@ export namespace Components {
          */
         "value"?: RadioValue1;
     }
+    interface SdScrollArea {
+        /**
+          * 스크롤 방향. vertical=세로만, horizontal=가로만, both=양방향
+          * @default 'both'
+         */
+        "axis": ScrollAreaAxis;
+        /**
+          * true면 스크롤바 트랙 배경을 채운다. 콘텐츠 영역 배경은 바뀌지 않는다.
+          * @default false
+         */
+        "background": boolean;
+        /**
+          * true면 스크롤바와 콘텐츠 사이에 1px 구분선을 그린다. 컨테이너 테두리가 아니다.
+          * @default false
+         */
+        "bordered": boolean;
+        /**
+          * viewport 최대 높이 (예: '400px'). 비우면 호스트 크기를 따른다.
+          * @default ''
+         */
+        "maxHeight": string;
+        /**
+          * viewport 최대 너비 (예: '480px'). 비우면 호스트 크기를 따른다.
+          * @default ''
+         */
+        "maxWidth": string;
+    }
     interface SdSelect {
         /**
           * 어드온 정렬 방향
@@ -2362,6 +2425,28 @@ export namespace Components {
          */
         "sdFocus": () => Promise<void>;
     }
+    interface SdStepper {
+        /**
+          * 접근성 레이블
+          * @default '진행 단계'
+         */
+        "ariaLabel": string;
+        /**
+          * 단계 목록
+          * @default []
+         */
+        "items": StepperItem[];
+        /**
+          * 크기
+          * @default 'sm'
+         */
+        "size": StepperSize;
+        /**
+          * 현재 활성 단계 value
+          * @default ''
+         */
+        "value": string;
+    }
     interface SdSwitch {
         /**
           * 비활성 상태 여부
@@ -3163,6 +3248,10 @@ export interface SdDropdownButtonCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLSdDropdownButtonElement;
 }
+export interface SdExpansionItemCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLSdExpansionItemElement;
+}
 export interface SdFilePickerCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLSdFilePickerElement;
@@ -3578,6 +3667,23 @@ declare global {
         prototype: HTMLSdDropdownButtonElement;
         new (): HTMLSdDropdownButtonElement;
     };
+    interface HTMLSdExpansionItemElementEventMap {
+        "sdToggle": boolean;
+    }
+    interface HTMLSdExpansionItemElement extends Components.SdExpansionItem, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSdExpansionItemElementEventMap>(type: K, listener: (this: HTMLSdExpansionItemElement, ev: SdExpansionItemCustomEvent<HTMLSdExpansionItemElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLSdExpansionItemElementEventMap>(type: K, listener: (this: HTMLSdExpansionItemElement, ev: SdExpansionItemCustomEvent<HTMLSdExpansionItemElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLSdExpansionItemElement: {
+        prototype: HTMLSdExpansionItemElement;
+        new (): HTMLSdExpansionItemElement;
+    };
     interface HTMLSdFieldElement extends Components.SdField, HTMLStencilElement {
     }
     var HTMLSdFieldElement: {
@@ -3882,6 +3988,12 @@ declare global {
         prototype: HTMLSdRadioGroupElement;
         new (): HTMLSdRadioGroupElement;
     };
+    interface HTMLSdScrollAreaElement extends Components.SdScrollArea, HTMLStencilElement {
+    }
+    var HTMLSdScrollAreaElement: {
+        prototype: HTMLSdScrollAreaElement;
+        new (): HTMLSdScrollAreaElement;
+    };
     interface HTMLSdSelectElementEventMap {
         "sdUpdate": SelectValue;
         "sdDropDownShow": { isOpen: boolean };
@@ -3971,6 +4083,12 @@ declare global {
         prototype: HTMLSdSelectTriggerElement;
         new (): HTMLSdSelectTriggerElement;
     };
+    interface HTMLSdStepperElement extends Components.SdStepper, HTMLStencilElement {
+    }
+    var HTMLSdStepperElement: {
+        prototype: HTMLSdStepperElement;
+        new (): HTMLSdStepperElement;
+    };
     interface HTMLSdSwitchElementEventMap {
         "sdUpdate": boolean;
     }
@@ -4214,6 +4332,7 @@ declare global {
         "sd-date-range-picker-calendar": HTMLSdDateRangePickerCalendarElement;
         "sd-divider": HTMLSdDividerElement;
         "sd-dropdown-button": HTMLSdDropdownButtonElement;
+        "sd-expansion-item": HTMLSdExpansionItemElement;
         "sd-field": HTMLSdFieldElement;
         "sd-file-picker": HTMLSdFilePickerElement;
         "sd-floating-portal": HTMLSdFloatingPortalElement;
@@ -4235,11 +4354,13 @@ declare global {
         "sd-radio": HTMLSdRadioElement;
         "sd-radio-button": HTMLSdRadioButtonElement;
         "sd-radio-group": HTMLSdRadioGroupElement;
+        "sd-scroll-area": HTMLSdScrollAreaElement;
         "sd-select": HTMLSdSelectElement;
         "sd-select-list-item": HTMLSdSelectListItemElement;
         "sd-select-list-item-search": HTMLSdSelectListItemSearchElement;
         "sd-select-listbox": HTMLSdSelectListboxElement;
         "sd-select-trigger": HTMLSdSelectTriggerElement;
+        "sd-stepper": HTMLSdStepperElement;
         "sd-switch": HTMLSdSwitchElement;
         "sd-tabs": HTMLSdTabsElement;
         "sd-tag": HTMLSdTagElement;
@@ -5218,6 +5339,42 @@ declare namespace LocalJSX {
          */
         "split"?: boolean;
     }
+    interface SdExpansionItem {
+        /**
+          * body 내부 패딩 사용 여부
+          * @default true
+         */
+        "bodyPadding"?: boolean;
+        /**
+          * compact 높이 사용 여부
+          * @default false
+         */
+        "dense"?: boolean;
+        /**
+          * 중첩 단계 (1~3)
+          * @default 1
+         */
+        "depth"?: 1 | 2 | 3;
+        /**
+          * 토글 비활성화 여부
+          * @default false
+         */
+        "disabled"?: boolean;
+        /**
+          * 펼침 상태
+          * @default false
+         */
+        "expanded"?: boolean;
+        /**
+          * 펼침 상태 변경 시 발생합니다.
+         */
+        "onSdToggle"?: (event: SdExpansionItemCustomEvent<boolean>) => void;
+        /**
+          * 헤더에 표시할 텍스트
+          * @default ''
+         */
+        "title"?: string;
+    }
     interface SdField {
         /**
           * 어드온 정렬 방향
@@ -5323,7 +5480,7 @@ declare namespace LocalJSX {
          */
         "status"?: 'default' | 'pass' | 'error';
         /**
-          * 필드 너비 (숫자면 px, 문자열이면 그대로 적용)
+          * 필드 너비 (숫자면 px, 문자열이면 그대로 적용). 지정하면 필드가 부모 폭을 다 먹지 않고 (레이블 + width) 만큼만 차지한다. 다른 요소와 나란히 놓으려면 부모를 flex 로 두면 된다.
           * @default ''
          */
         "width"?: string | number;
@@ -6305,6 +6462,33 @@ declare namespace LocalJSX {
          */
         "value"?: RadioValue1;
     }
+    interface SdScrollArea {
+        /**
+          * 스크롤 방향. vertical=세로만, horizontal=가로만, both=양방향
+          * @default 'both'
+         */
+        "axis"?: ScrollAreaAxis;
+        /**
+          * true면 스크롤바 트랙 배경을 채운다. 콘텐츠 영역 배경은 바뀌지 않는다.
+          * @default false
+         */
+        "background"?: boolean;
+        /**
+          * true면 스크롤바와 콘텐츠 사이에 1px 구분선을 그린다. 컨테이너 테두리가 아니다.
+          * @default false
+         */
+        "bordered"?: boolean;
+        /**
+          * viewport 최대 높이 (예: '400px'). 비우면 호스트 크기를 따른다.
+          * @default ''
+         */
+        "maxHeight"?: string;
+        /**
+          * viewport 최대 너비 (예: '480px'). 비우면 호스트 크기를 따른다.
+          * @default ''
+         */
+        "maxWidth"?: string;
+    }
     interface SdSelect {
         /**
           * 어드온 정렬 방향
@@ -6574,6 +6758,28 @@ declare namespace LocalJSX {
          */
         "placeholder"?: string;
     }
+    interface SdStepper {
+        /**
+          * 접근성 레이블
+          * @default '진행 단계'
+         */
+        "ariaLabel"?: string;
+        /**
+          * 단계 목록
+          * @default []
+         */
+        "items"?: StepperItem[];
+        /**
+          * 크기
+          * @default 'sm'
+         */
+        "size"?: StepperSize;
+        /**
+          * 현재 활성 단계 value
+          * @default ''
+         */
+        "value"?: string;
+    }
     interface SdSwitch {
         /**
           * 비활성 상태 여부
@@ -7493,6 +7699,14 @@ declare namespace LocalJSX {
         "disabled": boolean;
         "split": boolean;
     }
+    interface SdExpansionItemAttributes {
+        "title": string;
+        "expanded": boolean;
+        "dense": boolean;
+        "depth": 1 | 2 | 3;
+        "bodyPadding": boolean;
+        "disabled": boolean;
+    }
     interface SdFieldAttributes {
         "name": string;
         "error": boolean;
@@ -7705,6 +7919,13 @@ declare namespace LocalJSX {
         "disabled": boolean;
         "groupName": string;
     }
+    interface SdScrollAreaAttributes {
+        "axis": ScrollAreaAxis;
+        "background": boolean;
+        "bordered": boolean;
+        "maxHeight": string;
+        "maxWidth": string;
+    }
     interface SdSelectAttributes {
         "type": SelectType;
         "value": string;
@@ -7753,6 +7974,11 @@ declare namespace LocalJSX {
         "disabled": boolean;
         "isOpen": boolean;
     }
+    interface SdStepperAttributes {
+        "value": string;
+        "size": StepperSize;
+        "ariaLabel": string;
+    }
     interface SdSwitchAttributes {
         "value": boolean;
         "leftLabel": string;
@@ -7920,6 +8146,7 @@ declare namespace LocalJSX {
         "sd-date-range-picker-calendar": Omit<SdDateRangePickerCalendar, keyof SdDateRangePickerCalendarAttributes> & { [K in keyof SdDateRangePickerCalendar & keyof SdDateRangePickerCalendarAttributes]?: SdDateRangePickerCalendar[K] } & { [K in keyof SdDateRangePickerCalendar & keyof SdDateRangePickerCalendarAttributes as `attr:${K}`]?: SdDateRangePickerCalendarAttributes[K] } & { [K in keyof SdDateRangePickerCalendar & keyof SdDateRangePickerCalendarAttributes as `prop:${K}`]?: SdDateRangePickerCalendar[K] };
         "sd-divider": Omit<SdDivider, keyof SdDividerAttributes> & { [K in keyof SdDivider & keyof SdDividerAttributes]?: SdDivider[K] } & { [K in keyof SdDivider & keyof SdDividerAttributes as `attr:${K}`]?: SdDividerAttributes[K] } & { [K in keyof SdDivider & keyof SdDividerAttributes as `prop:${K}`]?: SdDivider[K] };
         "sd-dropdown-button": Omit<SdDropdownButton, keyof SdDropdownButtonAttributes> & { [K in keyof SdDropdownButton & keyof SdDropdownButtonAttributes]?: SdDropdownButton[K] } & { [K in keyof SdDropdownButton & keyof SdDropdownButtonAttributes as `attr:${K}`]?: SdDropdownButtonAttributes[K] } & { [K in keyof SdDropdownButton & keyof SdDropdownButtonAttributes as `prop:${K}`]?: SdDropdownButton[K] };
+        "sd-expansion-item": Omit<SdExpansionItem, keyof SdExpansionItemAttributes> & { [K in keyof SdExpansionItem & keyof SdExpansionItemAttributes]?: SdExpansionItem[K] } & { [K in keyof SdExpansionItem & keyof SdExpansionItemAttributes as `attr:${K}`]?: SdExpansionItemAttributes[K] } & { [K in keyof SdExpansionItem & keyof SdExpansionItemAttributes as `prop:${K}`]?: SdExpansionItem[K] };
         "sd-field": Omit<SdField, keyof SdFieldAttributes> & { [K in keyof SdField & keyof SdFieldAttributes]?: SdField[K] } & { [K in keyof SdField & keyof SdFieldAttributes as `attr:${K}`]?: SdFieldAttributes[K] } & { [K in keyof SdField & keyof SdFieldAttributes as `prop:${K}`]?: SdField[K] };
         "sd-file-picker": Omit<SdFilePicker, keyof SdFilePickerAttributes> & { [K in keyof SdFilePicker & keyof SdFilePickerAttributes]?: SdFilePicker[K] } & { [K in keyof SdFilePicker & keyof SdFilePickerAttributes as `attr:${K}`]?: SdFilePickerAttributes[K] } & { [K in keyof SdFilePicker & keyof SdFilePickerAttributes as `prop:${K}`]?: SdFilePicker[K] };
         "sd-floating-portal": Omit<SdFloatingPortal, keyof SdFloatingPortalAttributes> & { [K in keyof SdFloatingPortal & keyof SdFloatingPortalAttributes]?: SdFloatingPortal[K] } & { [K in keyof SdFloatingPortal & keyof SdFloatingPortalAttributes as `attr:${K}`]?: SdFloatingPortalAttributes[K] } & { [K in keyof SdFloatingPortal & keyof SdFloatingPortalAttributes as `prop:${K}`]?: SdFloatingPortal[K] };
@@ -7941,11 +8168,13 @@ declare namespace LocalJSX {
         "sd-radio": Omit<SdRadio, keyof SdRadioAttributes> & { [K in keyof SdRadio & keyof SdRadioAttributes]?: SdRadio[K] } & { [K in keyof SdRadio & keyof SdRadioAttributes as `attr:${K}`]?: SdRadioAttributes[K] } & { [K in keyof SdRadio & keyof SdRadioAttributes as `prop:${K}`]?: SdRadio[K] } & OneOf<"val", SdRadio["val"], SdRadioAttributes["val"]>;
         "sd-radio-button": Omit<SdRadioButton, keyof SdRadioButtonAttributes> & { [K in keyof SdRadioButton & keyof SdRadioButtonAttributes]?: SdRadioButton[K] } & { [K in keyof SdRadioButton & keyof SdRadioButtonAttributes as `attr:${K}`]?: SdRadioButtonAttributes[K] } & { [K in keyof SdRadioButton & keyof SdRadioButtonAttributes as `prop:${K}`]?: SdRadioButton[K] };
         "sd-radio-group": Omit<SdRadioGroup, keyof SdRadioGroupAttributes> & { [K in keyof SdRadioGroup & keyof SdRadioGroupAttributes]?: SdRadioGroup[K] } & { [K in keyof SdRadioGroup & keyof SdRadioGroupAttributes as `attr:${K}`]?: SdRadioGroupAttributes[K] } & { [K in keyof SdRadioGroup & keyof SdRadioGroupAttributes as `prop:${K}`]?: SdRadioGroup[K] };
+        "sd-scroll-area": Omit<SdScrollArea, keyof SdScrollAreaAttributes> & { [K in keyof SdScrollArea & keyof SdScrollAreaAttributes]?: SdScrollArea[K] } & { [K in keyof SdScrollArea & keyof SdScrollAreaAttributes as `attr:${K}`]?: SdScrollAreaAttributes[K] } & { [K in keyof SdScrollArea & keyof SdScrollAreaAttributes as `prop:${K}`]?: SdScrollArea[K] };
         "sd-select": Omit<SdSelect, keyof SdSelectAttributes> & { [K in keyof SdSelect & keyof SdSelectAttributes]?: SdSelect[K] } & { [K in keyof SdSelect & keyof SdSelectAttributes as `attr:${K}`]?: SdSelectAttributes[K] } & { [K in keyof SdSelect & keyof SdSelectAttributes as `prop:${K}`]?: SdSelect[K] };
         "sd-select-list-item": Omit<SdSelectListItem, keyof SdSelectListItemAttributes> & { [K in keyof SdSelectListItem & keyof SdSelectListItemAttributes]?: SdSelectListItem[K] } & { [K in keyof SdSelectListItem & keyof SdSelectListItemAttributes as `attr:${K}`]?: SdSelectListItemAttributes[K] } & { [K in keyof SdSelectListItem & keyof SdSelectListItemAttributes as `prop:${K}`]?: SdSelectListItem[K] };
         "sd-select-list-item-search": Omit<SdSelectListItemSearch, keyof SdSelectListItemSearchAttributes> & { [K in keyof SdSelectListItemSearch & keyof SdSelectListItemSearchAttributes]?: SdSelectListItemSearch[K] } & { [K in keyof SdSelectListItemSearch & keyof SdSelectListItemSearchAttributes as `attr:${K}`]?: SdSelectListItemSearchAttributes[K] } & { [K in keyof SdSelectListItemSearch & keyof SdSelectListItemSearchAttributes as `prop:${K}`]?: SdSelectListItemSearch[K] };
         "sd-select-listbox": Omit<SdSelectListbox, keyof SdSelectListboxAttributes> & { [K in keyof SdSelectListbox & keyof SdSelectListboxAttributes]?: SdSelectListbox[K] } & { [K in keyof SdSelectListbox & keyof SdSelectListboxAttributes as `attr:${K}`]?: SdSelectListboxAttributes[K] } & { [K in keyof SdSelectListbox & keyof SdSelectListboxAttributes as `prop:${K}`]?: SdSelectListbox[K] };
         "sd-select-trigger": Omit<SdSelectTrigger, keyof SdSelectTriggerAttributes> & { [K in keyof SdSelectTrigger & keyof SdSelectTriggerAttributes]?: SdSelectTrigger[K] } & { [K in keyof SdSelectTrigger & keyof SdSelectTriggerAttributes as `attr:${K}`]?: SdSelectTriggerAttributes[K] } & { [K in keyof SdSelectTrigger & keyof SdSelectTriggerAttributes as `prop:${K}`]?: SdSelectTrigger[K] };
+        "sd-stepper": Omit<SdStepper, keyof SdStepperAttributes> & { [K in keyof SdStepper & keyof SdStepperAttributes]?: SdStepper[K] } & { [K in keyof SdStepper & keyof SdStepperAttributes as `attr:${K}`]?: SdStepperAttributes[K] } & { [K in keyof SdStepper & keyof SdStepperAttributes as `prop:${K}`]?: SdStepper[K] };
         "sd-switch": Omit<SdSwitch, keyof SdSwitchAttributes> & { [K in keyof SdSwitch & keyof SdSwitchAttributes]?: SdSwitch[K] } & { [K in keyof SdSwitch & keyof SdSwitchAttributes as `attr:${K}`]?: SdSwitchAttributes[K] } & { [K in keyof SdSwitch & keyof SdSwitchAttributes as `prop:${K}`]?: SdSwitch[K] };
         "sd-tabs": Omit<SdTabs, keyof SdTabsAttributes> & { [K in keyof SdTabs & keyof SdTabsAttributes]?: SdTabs[K] } & { [K in keyof SdTabs & keyof SdTabsAttributes as `attr:${K}`]?: SdTabsAttributes[K] } & { [K in keyof SdTabs & keyof SdTabsAttributes as `prop:${K}`]?: SdTabs[K] } & OneOf<"value", SdTabs["value"], SdTabsAttributes["value"]>;
         "sd-tag": Omit<SdTag, keyof SdTagAttributes> & { [K in keyof SdTag & keyof SdTagAttributes]?: SdTag[K] } & { [K in keyof SdTag & keyof SdTagAttributes as `attr:${K}`]?: SdTagAttributes[K] } & { [K in keyof SdTag & keyof SdTagAttributes as `prop:${K}`]?: SdTag[K] };
@@ -7985,6 +8214,7 @@ declare module "@stencil/core" {
             "sd-date-range-picker-calendar": LocalJSX.IntrinsicElements["sd-date-range-picker-calendar"] & JSXBase.HTMLAttributes<HTMLSdDateRangePickerCalendarElement>;
             "sd-divider": LocalJSX.IntrinsicElements["sd-divider"] & JSXBase.HTMLAttributes<HTMLSdDividerElement>;
             "sd-dropdown-button": LocalJSX.IntrinsicElements["sd-dropdown-button"] & JSXBase.HTMLAttributes<HTMLSdDropdownButtonElement>;
+            "sd-expansion-item": LocalJSX.IntrinsicElements["sd-expansion-item"] & JSXBase.HTMLAttributes<HTMLSdExpansionItemElement>;
             "sd-field": LocalJSX.IntrinsicElements["sd-field"] & JSXBase.HTMLAttributes<HTMLSdFieldElement>;
             "sd-file-picker": LocalJSX.IntrinsicElements["sd-file-picker"] & JSXBase.HTMLAttributes<HTMLSdFilePickerElement>;
             "sd-floating-portal": LocalJSX.IntrinsicElements["sd-floating-portal"] & JSXBase.HTMLAttributes<HTMLSdFloatingPortalElement>;
@@ -8006,11 +8236,13 @@ declare module "@stencil/core" {
             "sd-radio": LocalJSX.IntrinsicElements["sd-radio"] & JSXBase.HTMLAttributes<HTMLSdRadioElement>;
             "sd-radio-button": LocalJSX.IntrinsicElements["sd-radio-button"] & JSXBase.HTMLAttributes<HTMLSdRadioButtonElement>;
             "sd-radio-group": LocalJSX.IntrinsicElements["sd-radio-group"] & JSXBase.HTMLAttributes<HTMLSdRadioGroupElement>;
+            "sd-scroll-area": LocalJSX.IntrinsicElements["sd-scroll-area"] & JSXBase.HTMLAttributes<HTMLSdScrollAreaElement>;
             "sd-select": LocalJSX.IntrinsicElements["sd-select"] & JSXBase.HTMLAttributes<HTMLSdSelectElement>;
             "sd-select-list-item": LocalJSX.IntrinsicElements["sd-select-list-item"] & JSXBase.HTMLAttributes<HTMLSdSelectListItemElement>;
             "sd-select-list-item-search": LocalJSX.IntrinsicElements["sd-select-list-item-search"] & JSXBase.HTMLAttributes<HTMLSdSelectListItemSearchElement>;
             "sd-select-listbox": LocalJSX.IntrinsicElements["sd-select-listbox"] & JSXBase.HTMLAttributes<HTMLSdSelectListboxElement>;
             "sd-select-trigger": LocalJSX.IntrinsicElements["sd-select-trigger"] & JSXBase.HTMLAttributes<HTMLSdSelectTriggerElement>;
+            "sd-stepper": LocalJSX.IntrinsicElements["sd-stepper"] & JSXBase.HTMLAttributes<HTMLSdStepperElement>;
             "sd-switch": LocalJSX.IntrinsicElements["sd-switch"] & JSXBase.HTMLAttributes<HTMLSdSwitchElement>;
             "sd-tabs": LocalJSX.IntrinsicElements["sd-tabs"] & JSXBase.HTMLAttributes<HTMLSdTabsElement>;
             "sd-tag": LocalJSX.IntrinsicElements["sd-tag"] & JSXBase.HTMLAttributes<HTMLSdTagElement>;