@sellmate/design-system 1.17.0 → 1.18.0

package/dist/esm/sd-switch.entry.js

@@ -103,7 +103,7 @@ const SdSwitch = class {
             '--sd-switch-line-height': `${SWITCH_TYPOGRAPHY.lineHeight}px`,
             '--sd-switch-text-decoration': SWITCH_TYPOGRAPHY.textDecoration,
         };
-        return (h("label", { key: '70b779b6d8fc42e94110d7fb9d88aba22290af3a', "aria-label": this.label || 'switch', class: this.switchClasses, style: cssVars }, h("input", { key: '41281a03161608ce507dd14c8a2a5a47063556ca', type: "checkbox", checked: this.value, disabled: this.disabled, onInput: this.handleChange }), h("div", { key: '0c712f35c9594380b666a03387f0563cfcb1257d', class: "sd-switch__track" }, h("div", { key: 'a96915c01e3a33017d9024e1aea9cd8f50fdd933', class: "sd-switch__knob" })), this.label && h("span", { key: '51d9d2f4a7072cb288ce4257df825ad2d9053f35', class: "sd-switch__label" }, this.label)));
+        return (h("label", { key: '8038810bfcf78ddea9ef73706689e19fdfe0b57f', "aria-label": this.label || 'switch', class: this.switchClasses, style: cssVars }, h("input", { key: 'ee4c60f379f20f56af01bafb0533e6b64bb3054a', type: "checkbox", checked: this.value, disabled: this.disabled, onInput: this.handleChange }), h("div", { key: '8ce56df6d631b742331466ded340298a888576c7', class: "sd-switch__track" }, h("div", { key: 'e02c48a7af9e005524b5d3ba8689e99dd42555f2', class: "sd-switch__knob" })), this.label && h("span", { key: 'c1533c489ef8d0a2b8374d2eaeeb0ac743a9c507', class: "sd-switch__label" }, this.label)));
     }
 };
 SdSwitch.style = sdSwitchCss();

package/dist/esm/{sd-table.config-D9meRqTx.js → sd-table.config-B3wuA5wX.js}

@@ -1,5 +1,5 @@
 import { t as tableTokens } from './component.table-D6GUzecR.js';
-import { s as systemTokens } from './system-j2khhcHY.js';
+import { s as systemTokens } from './system-BJfiMC9H.js';
 
 // ── Header Tokens ──
 const TABLE_HEADER_LAYOUT = {

package/dist/esm/sd-table.entry.js

@@ -1,8 +1,8 @@
 import { r as registerInstance, c as createEvent, a as getElement, d as readTask, f as forceUpdate, h, H as Host } from './index-CAxodB5I.js';
 import { T as TABLE_ID_ATTR } from './constants-sZMi_32I.js';
-import { T as TABLE_BODY_LAYOUT, a as TABLE_SELECTABLE_COLUMN_WIDTH, b as TABLE_BODY_TYPOGRAPHY, c as TABLE_BORDER, d as TABLE_RADIUS } from './sd-table.config-D9meRqTx.js';
+import { T as TABLE_BODY_LAYOUT, a as TABLE_SELECTABLE_COLUMN_WIDTH, b as TABLE_BODY_TYPOGRAPHY, c as TABLE_BORDER, d as TABLE_RADIUS } from './sd-table.config-B3wuA5wX.js';
 import './component.table-D6GUzecR.js';
-import './system-j2khhcHY.js';
+import './system-BJfiMC9H.js';
 
 let urlAlphabet =
   'useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict';
@@ -843,24 +843,24 @@ const SdTable = class {
             '--table-selectable-width': `${TABLE_SELECTABLE_COLUMN_WIDTH}px`,
             '--table-host-height': hostHeight,
         };
-        return (h(Host, { key: '164ba96033be0195fa50e3d4d684059b9c471479', style: hostStyle }, h("div", { key: '2f1a1be73f86c72e7caa46981ee691d29bb237c7', class: "sd-table__container", style: {
+        return (h(Host, { key: '337909d6279baf60effec188eb60422ce47c0585', style: hostStyle }, h("div", { key: '46d53ced85e1700da3c6ca082d5752c0bb4a155b', class: "sd-table__container", style: {
                 '--table-width': this.width,
                 '--pagination-height': `${paginationHeight}px`,
-            } }, h("div", { key: '16976d24d4c21714183f9691b06c503b86388c54', class: {
+            } }, h("div", { key: '159fad6dec16b3328d0da4ce22ae6bca537046e9', class: {
                 'sd-table__wrapper': true,
                 'sd-table__wrapper--use-top': this.useTop,
-            } }, h("div", { key: 'fdd0dcfbff4c3a5e441d720d2e1a39a69c51f9cf', class: {
+            } }, h("div", { key: '22acbc7de61e11807b1a8919090286bb04a98bed', class: {
                 'sd-table__scroll-container': true,
                 'sd-table__scroll-container--loading': this.isLoading,
                 'sd-table__scroll-container--no-data': isNoData,
-            } }, this.isLoading && (h("div", { key: 'facb26c0d1651d4a2a6e0dee5c1b8ca73586de89', class: "sd-table__loading", style: { top: `${this.loadingScrollTop}px` } }, h("sd-circle-progress", { key: '844b92fc9fc38f95d51092b698b67b685bcba076', indeterminate: true }))), isNoData && (h(h.Fragment, null, h("div", { key: '458c8e24b85c0e7c99afe940c3d5856e63bc582a', class: "sd-table__no-data-header-overlay" }), h("div", { key: 'bd29a77ac11da7e5d513955a4c4baa0dd89a623d', class: "sd-table__no-data" }, h("div", { key: '7db0e8e3888e97638f3c78d560e844cc0f8b2944', class: "sd-table__no-data-content", ref: el => {
+            } }, this.isLoading && (h("div", { key: '040736d35428396068d5237a17f23f8f70ba2541', class: "sd-table__loading", style: { top: `${this.loadingScrollTop}px` } }, h("sd-circle-progress", { key: 'eae076a71161e315951692f051522b8b5f094271', indeterminate: true }))), isNoData && (h(h.Fragment, null, h("div", { key: 'e8bdf5ae38a77988fce0a60ae9309f5d03b34928', class: "sd-table__no-data-header-overlay" }), h("div", { key: 'd6ce4d4479eb927137b1afd5494a91494568b274', class: "sd-table__no-data" }, h("div", { key: 'cfccc6382e7d0cc76d7f50515cd157ccd56cbac8', class: "sd-table__no-data-content", ref: el => {
                 this.noDataContentEl = el;
                 if (el)
                     this.syncNoDataContentObserver();
-            } }, h("slot", { key: 'fa175041907d4af7e5e0db7cad6e9a3e16e96901', name: "no-data" }, h("span", { key: '3fae3a23d86dc543502f74574a4b5c3f026b9992' }, this.resolvedNoDataLabel)))))), h("table", { key: '9ae98e0697e045b308f7e584fb496692acade8ba', class: this.tableClasses }, this.autoThead ? (h("slot", { name: `${resolvedTableId}-head`, onSlotchange: this.handleStructureSlotChange }, h("sd-thead", { rows: this.rows ?? [] }))) : (h("slot", { name: `${resolvedTableId}-head`, onSlotchange: this.handleStructureSlotChange })), this.autoTbody ? (h("slot", { name: `${resolvedTableId}-body`, onSlotchange: this.handleStructureSlotChange }, h("sd-tbody", { rows: this.rows ?? [] }, this.renderAutoRows()))) : (h("slot", { name: `${resolvedTableId}-body`, onSlotchange: this.handleStructureSlotChange }))))), this.pagination &&
+            } }, h("slot", { key: '45a2df0c0fa234408ca5a5fb76b5a74729cad482', name: "no-data" }, h("span", { key: 'a126d8ce4149ac87e55f5a6acc67bbb3a650cdf4' }, this.resolvedNoDataLabel)))))), h("table", { key: 'aa4b94ed02700edd1846ca51235f47fe7de570be', class: this.tableClasses }, this.autoThead ? (h("slot", { name: `${resolvedTableId}-head`, onSlotchange: this.handleStructureSlotChange }, h("sd-thead", { rows: this.rows ?? [] }))) : (h("slot", { name: `${resolvedTableId}-head`, onSlotchange: this.handleStructureSlotChange })), this.autoTbody ? (h("slot", { name: `${resolvedTableId}-body`, onSlotchange: this.handleStructureSlotChange }, h("sd-tbody", { rows: this.rows ?? [] }, this.renderAutoRows()))) : (h("slot", { name: `${resolvedTableId}-body`, onSlotchange: this.handleStructureSlotChange }))))), this.pagination &&
             this.pagination.rowsPerPage > 0 &&
             this.rowCount > 0 &&
-            !this.useVirtualScroll && (h("div", { key: 'a0da779351490332035ec784bc301ea2cb017afd', class: "sd-table__pagination" }, h("sd-pagination", { key: '8c3bcd06e1644afaebabd3762cdb03900f727142', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onSdPageChange: (e) => this.changePage(e.detail) }), this.useRowsPerPageSelect && (h("sd-select", { key: '4bff157ac6e0fb5efe03663d4bbf58d67f8308b6', value: this.useInternalPagination
+            !this.useVirtualScroll && (h("div", { key: 'f4d357d62af40e3ea8f35c799b4409c7deb2606f', class: "sd-table__pagination" }, h("sd-pagination", { key: '6aad139f1f06d1851f30b5c8331899fe9d23ba37', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onSdPageChange: (e) => this.changePage(e.detail) }), this.useRowsPerPageSelect && (h("sd-select", { key: '85aa19726fca6dce007d8ffcc5550de8115546cb', value: this.useInternalPagination
                 ? this.innerRowsPerPage
                 : this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", emitValue: true, onSdUpdate: e => {
                 if (!this.isRowsPerPageValue(e.detail))

package/dist/esm/sd-tabs.entry.js

@@ -199,7 +199,7 @@ const SdTabs = class {
         };
     }
     render() {
-        return (h("div", { key: '1c670c50ff7f5489a77043bc030fe3a65eb894ab', class: this.getContainerClasses(), style: this.buildCssVars() }, this.tabs.map((tab, index) => {
+        return (h("div", { key: 'fd65e555621e8b9f9c8e93578f41f1c24a8cbeda', class: this.getContainerClasses(), style: this.buildCssVars() }, this.tabs.map((tab, index) => {
             const badgeName = this.getBadgeName(tab);
             return (h("div", { key: `tab-${index}`, role: "tab", tabindex: 0, "aria-selected": tab.value === this.value ? 'true' : 'false', class: this.getTabClasses(tab), "aria-label": tab.label || 'tab', onClick: () => this.handleTabClick(tab), onKeyDown: e => {
                     if (e.key === 'Enter' || e.key === ' ') {

package/dist/esm/sd-td.entry.js

@@ -156,7 +156,7 @@ const SdTd = class {
         }
     }
     render() {
-        return (h(Host, { key: '95f97474c4d00a35085c558bf43593322a9f69e7', class: { [`align-${this.align}`]: Boolean(this.align) } }, h("slot", { key: 'f67d1e8b125c10446dac3abdfa0da01bfb83f470' })));
+        return (h(Host, { key: '02464050ab6179a4d19bc5885aff8c2690cc3dd6', class: { [`align-${this.align}`]: Boolean(this.align) } }, h("slot", { key: 'a4cde26644aea2e1a99690c407b7020b20bd3981' })));
     }
     static get watchers() { return {
         "field": [{

package/dist/esm/sd-text-link.entry.js

@@ -131,7 +131,7 @@ const SdTextLink = class {
         this.click.emit();
     };
     render() {
-        const sizeConfig = TEXT_LINK_SIZE_CONFIG[this.size];
+        const sizeConfig = TEXT_LINK_SIZE_CONFIG[this.size] ?? TEXT_LINK_SIZE_CONFIG.sm;
         const typo = this.underline ? sizeConfig.typography.underline : sizeConfig.typography.default;
         const labelClassName = ['sd-text-link__label', this.labelClass].filter(Boolean).join(' ');
         const iconColor = this.disabled
@@ -145,7 +145,7 @@ const SdTextLink = class {
             '--sd-text-link-text-decoration': typo.textDecoration,
             ...(this.disabled ? { '--sd-text-link-color': TEXT_LINK_COLORS.content.disabled } : {}),
         };
-        return (h("span", { key: '89b8117d19d149faf70d026ef560acdfa0096daa', role: "button", tabindex: this.disabled ? -1 : 0, class: {
+        return (h("span", { key: '74e9dd05f3efa3ecfec4edca1b74c29bb7207894', role: "button", tabindex: this.disabled ? -1 : 0, class: {
                 'sd-text-link': true,
                 'sd-text-link--disabled': this.disabled,
             }, style: cssVars, onClick: this.handleClick, onKeyDown: e => {
@@ -153,13 +153,13 @@ const SdTextLink = class {
                     e.preventDefault();
                     this.handleClick();
                 }
-            } }, this.icon && (h("sd-icon", { key: '684c7b31abc6cb806944c03a016c4520c4721a7c', name: this.icon, size: sizeConfig.iconSize, color: iconColor, class: "sd-text-link__icon" })), h("span", { key: '272f5b4c889b099ede7b5146ea4828648d89ad69', class: labelClassName }, this.label), this.rightArrow && this.rightArrow !== 'none' && (h("span", { key: '142d37f856df2e5858df5d976e4d8ac4ee2f2607', class: "sd-text-link__arrow", style: {
+            } }, this.icon && (h("sd-icon", { key: 'e60be0764adf889af988fd887582776d44239e07', name: this.icon, size: sizeConfig.iconSize, color: iconColor, class: "sd-text-link__icon" })), h("span", { key: '17996ef0620948fe1660945e68c9bb55e62fc982', class: labelClassName }, this.label), this.rightArrow && this.rightArrow !== 'none' && (h("span", { key: 'b9cfc03d4295beb9956f661032ea3fd1d9acfbe9', class: "sd-text-link__arrow", style: {
                 width: `${TEXT_LINK_ARROW.arrowFrame}px`,
                 height: `${TEXT_LINK_ARROW.arrowFrame}px`,
                 display: 'inline-flex',
                 alignItems: 'center',
                 justifyContent: 'center',
-            } }, h("sd-icon", { key: '5da12b6077fb33912260b353cb6fe7d533eab937', name: this.rightArrow === 'chevron' ? 'chevronRight' : 'caretRight', size: TEXT_LINK_ARROW.arrowIconSize, color: arrowColor })))));
+            } }, h("sd-icon", { key: '6c2e4640a767acd5e66089e7e78f27c0fb8a0955', name: this.rightArrow === 'chevron' ? 'chevronRight' : 'caretRight', size: TEXT_LINK_ARROW.arrowIconSize, color: arrowColor })))));
     }
 };
 SdTextLink.style = sdTextLinkCss();

package/dist/esm/sd-toast-container.entry.js

@@ -232,7 +232,7 @@ const SdToastContainer = class {
         const activeToasts = toasts.filter(t => t.state !== 'exiting').reverse();
         const indexMap = new Map();
         activeToasts.forEach((t, i) => indexMap.set(t.id, i));
-        return (h("div", { key: '2b0bc86b7e2ea19a44f3c0b870ce5dec1de3a140', class: "sd-toast-container", style: this.getContainerStyles(), onMouseEnter: () => {
+        return (h("div", { key: '44b4f34b231186fd00ef9c1a65bd68a83fced6da', class: "sd-toast-container", style: this.getContainerStyles(), onMouseEnter: () => {
                 this.expanded = true;
                 this.pauseTimers();
             }, onMouseLeave: () => {

package/dist/esm/sd-toast.entry.js

@@ -82,12 +82,12 @@ const SdToast = class {
         const linkColor = typeConfig.linkColor ?? typeConfig.content;
         const useDefaultCloseIntent = ['default', 'caution', 'info'].includes(this.type);
         const buttonName = TOAST_BUTTON_NAME_BY_TYPE[this.type] ?? TOAST_BUTTON_NAME_BY_TYPE.default;
-        return (h("div", { key: '82c8063406a534e60c985d3c8321612077f75623', style: {
+        return (h("div", { key: '656bf6231262cc7d974adbe5f0ce0053d03aca84', style: {
                 '--sd-toast-bg': typeConfig.bg,
                 '--sd-toast-text': typeConfig.content,
                 '--sd-toast-icon': iconColor,
                 '--sd-toast-link': linkColor,
-            } }, h("div", { key: 'e83c5b7ddc0edec3fb9e29325dcb52e3295fad4d', class: "sd-toast", role: "status", "aria-live": "polite", "aria-atomic": "true" }, this.icon && (h("div", { key: 'd249e5915f0c92a0a2cff43dee5c61d809ffc7f0', class: "sd-toast__icon" }, h("sd-icon", { key: '088da81d0083cc0ca72f2bf59392a72d3f2ed4de', name: this.icon, size: iconSize, color: iconColor }))), h("div", { key: '5cad9a3a81b00d8926d92d9895c4cca1389dc63b', class: "sd-toast__content" }, h("span", { key: '1fbc72aac70fbb3bb630ad10343ea2c8f76f924c', class: "sd-toast__message" }, this.message)), this.link && (h("a", { key: '769a85fa539bab8b478ef999cab615285a842085', href: this.link, class: "sd-toast__link", target: "_blank", rel: "noopener noreferrer" }, this.linkLabel || this.link)), this.buttonLabel && (h("sd-button", { key: '77612614898b6abdade4b4599987cbb90bc09c4e', class: "sd-toast__button", name: buttonName, label: this.buttonLabel, onSdClick: (event) => this.buttonClick.emit(event.detail) })), this.useClose && (h("sd-ghost-button", { key: '3bef6c0e7f3dec3f2b1f493f9c979a121bc897e9', class: "sd-toast__close", icon: "close", intent: useDefaultCloseIntent ? 'default' : 'inverse', ariaLabel: "close", size: "xs", onClick: () => this.close.emit() })))));
+            } }, h("div", { key: '1e15e50c926ce65cea86db069dd1e79a642da01c', class: "sd-toast", role: "status", "aria-live": "polite", "aria-atomic": "true" }, this.icon && (h("div", { key: '692277c23c4530d9fa0c5e26ea9d3b9759024dea', class: "sd-toast__icon" }, h("sd-icon", { key: '0a15993313f3a9d1f27d6ae727c2c248c3390701', name: this.icon, size: iconSize, color: iconColor }))), h("div", { key: '9c1af0c9cedbb772b9b59ae80a0ff861066aa0de', class: "sd-toast__content" }, h("span", { key: '2aacd89fe1cf31f271da027459a6cfaece3dbdbf', class: "sd-toast__message" }, this.message)), this.link && (h("a", { key: '094a68e843d9ab50cea46a506d6ccdc1ebf375d7', href: this.link, class: "sd-toast__link", target: "_blank", rel: "noopener noreferrer" }, this.linkLabel || this.link)), this.buttonLabel && (h("sd-button", { key: '7dabe182870a01cf285ee7441dfe39b07e943751', class: "sd-toast__button", name: buttonName, label: this.buttonLabel, onSdClick: (event) => this.buttonClick.emit(event.detail) })), this.useClose && (h("sd-ghost-button", { key: '2a893c6ace888d8f21ce16c9dbf2a35b23bc9372', class: "sd-toast__close", icon: "close", intent: useDefaultCloseIntent ? 'default' : 'inverse', ariaLabel: "close", size: "xs", onClick: () => this.close.emit() })))));
     }
 };
 SdToast.style = sdToastCss();

package/dist/esm/sd-toggle.entry.js

@@ -118,7 +118,7 @@ const SdToggle = class {
             '--sd-toggle-content-select': TOGGLE_COLORS.content.select,
             '--sd-toggle-content-disabled': TOGGLE_COLORS.content.disabled,
         };
-        return (h("label", { key: 'f61e80701bc85205794aec0c960965d29b94a247', class: this.toggleClasses, style: cssVars, "aria-label": this.label || 'toggle' }, this.label, h("input", { key: '26a31febfdae6bebe55291d3454a177366dc3db0', style: { display: 'none' }, type: "checkbox", onInput: this.handleChange })));
+        return (h("label", { key: '5657698c379c71e770b18006b5f5c69c122a06a7', class: this.toggleClasses, style: cssVars, "aria-label": this.label || 'toggle' }, this.label, h("input", { key: '8f72307d4efd029df200243cf670377aea2cff02', style: { display: 'none' }, type: "checkbox", onInput: this.handleChange })));
     }
 };
 SdToggle.style = sdToggleCss();

package/dist/esm/{system-j2khhcHY.js → system-BJfiMC9H.js}

@@ -1,3 +1,9 @@
+const typography = {
+	feedback: {
+		sm: {
+			regular: {
+				fontSize: "12",
+				fontWeight: "400"}}}};
 const color = {
 	bg: {
 		frame: "#FFFFFF",
@@ -30,6 +36,7 @@ const shadow = {
 			color: "rgba(34,34,34,0.2)"}
 	}};
 var systemTokens = {
+	typography: typography,
 	color: color,
 	shadow: shadow
 };

package/dist/types/components/assets/Bill.d.ts

@@ -0,0 +1 @@
+export declare const Bill: (props: any) => any;

package/dist/types/components/assets/Coupon.d.ts

@@ -0,0 +1 @@
+export declare const Coupon: (props: any) => any;

package/dist/types/components/assets/Delete.d.ts

@@ -0,0 +1 @@
+export declare const Delete: (props: any) => any;

package/dist/types/components/assets/Dot.d.ts

@@ -0,0 +1 @@
+export declare const Dot: (props: any) => any;

package/dist/types/components/assets/Launcher.d.ts

@@ -0,0 +1 @@
+export declare const Launcher: (props: any) => any;

package/dist/types/components/assets/Monitor.d.ts

@@ -0,0 +1 @@
+export declare const Monitor: (props: any) => any;

package/dist/types/components/assets/Shield.d.ts

@@ -0,0 +1 @@
+export declare const Shield: (props: any) => any;

package/dist/types/components/assets/Sidebar.d.ts

@@ -0,0 +1 @@
+export declare const Sidebar: (props: any) => any;

package/dist/types/components/assets/Store.d.ts

@@ -0,0 +1 @@
+export declare const Store: (props: any) => any;

package/dist/types/components/assets/index.d.ts

@@ -10,6 +10,7 @@ export declare const Icons: {
     readonly attachFile: (props: any) => any;
     readonly barcode: (props: any) => any;
     readonly bell: (props: any) => any;
+    readonly bill: (props: any) => any;
     readonly board: (props: any) => any;
     readonly box: (props: any) => any;
     readonly camera: (props: any) => any;
@@ -34,8 +35,11 @@ export declare const Icons: {
     readonly clockOutline: (props: any) => any;
     readonly close: (props: any) => any;
     readonly copy: (props: any) => any;
+    readonly coupon: (props: any) => any;
     readonly dashboard: (props: any) => any;
     readonly date: (props: any) => any;
+    readonly delete: (props: any) => any;
+    readonly dot: (props: any) => any;
     readonly download: (props: any) => any;
     readonly drag: (props: any) => any;
     readonly edit: (props: any) => any;
@@ -48,10 +52,12 @@ export declare const Icons: {
     readonly imageFill: (props: any) => any;
     readonly imageOutline: (props: any) => any;
     readonly inline: (props: any) => any;
+    readonly launcher: (props: any) => any;
     readonly line: (props: any) => any;
     readonly location: (props: any) => any;
     readonly logout: (props: any) => any;
     readonly minus: (props: any) => any;
+    readonly monitor: (props: any) => any;
     readonly new: (props: any) => any;
     readonly notificationFill: (props: any) => any;
     readonly notificationOutline: (props: any) => any;
@@ -68,7 +74,10 @@ export declare const Icons: {
     readonly save: (props: any) => any;
     readonly search: (props: any) => any;
     readonly setting: (props: any) => any;
+    readonly shield: (props: any) => any;
+    readonly sidebar: (props: any) => any;
     readonly star: (props: any) => any;
+    readonly store: (props: any) => any;
     readonly synchronize: (props: any) => any;
     readonly updown: (props: any) => any;
     readonly user: (props: any) => any;

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

@@ -32,3 +32,27 @@ export declare const CHIP_INPUT_RESET: {
     iconColor: string;
     labelColor: string;
 };
+export declare const CHIP_INPUT_MAX_COUNT: {
+    fontSize: string;
+    fontWeight: string;
+    color: string;
+};
+export declare const CHIP_INPUT_SUGGESTIONS: {
+    radius: string;
+    maxHeight: string;
+    itemPaddingY: string;
+    itemPaddingX: string;
+    itemPaddingRight: string;
+    itemGap: string;
+    itemFontSize: string;
+    itemFontWeight: string;
+    itemFontWeightSelected: string;
+    itemLineHeight: string;
+    itemFontFamily: string;
+    itemColor: string;
+    itemColorHover: string;
+    itemBgHover: string;
+    emptyColor: string;
+    emptyFontSize: string;
+    emptyLineHeight: string;
+};

package/dist/types/components/sd-chip-input/sd-chip-input.d.ts

@@ -3,6 +3,7 @@ import { Rule } from '../../types/form';
 import { SdTooltipProps } from '../sd-tooltip/sd-tooltip.config';
 import { type ChipInputSize } from './sd-chip-input.config';
 export declare class SdChipInput {
+    private static readonly SUGGESTIONS_VIEWPORT_PADDING;
     host: HTMLElement;
     values: string[];
     errors: boolean[] | ((value: string) => boolean);
@@ -14,6 +15,11 @@ export declare class SdChipInput {
     rules?: Rule[];
     error: boolean;
     useReset: boolean;
+    maxCount?: number;
+    suggestions: string[];
+    loadingSuggestions: boolean;
+    recommendedItems: string[];
+    loadingRecommendedItems: boolean;
     label?: string;
     labelWidth: string | number;
     hint: string;
@@ -28,26 +34,35 @@ export declare class SdChipInput {
     private focused;
     private hovered;
     private inputValue;
+    private activeSuggestionIndex;
+    private suppressSuggestions;
+    private suppressRecommendations;
     private inputEl?;
     private formField?;
+    private chipInputRef?;
     get value(): string[];
     valuesChanged(newValues: string[]): void;
     errorsChanged(newErrors: boolean[] | ((value: string) => boolean)): void;
+    suggestionsChanged(newVal: string[] | undefined): void;
+    recommendedItemsChanged(newVal: string[] | undefined): void;
     componentWillLoad(): void;
     private getChipError;
     private getChipDisabled;
     update: EventEmitter<string[]>;
     focusEvent: EventEmitter<void>;
     blurEvent: EventEmitter<void>;
+    inputEvent: EventEmitter<string>;
     sdValidate(): Promise<boolean | undefined>;
     sdReset(): Promise<void | undefined>;
     sdResetValidate(): Promise<void | undefined>;
     sdFocus(): Promise<void | undefined>;
+    private addChip;
     private handleChipRemove;
     private handleKeyDown;
     private handleInput;
     private handleFocus;
     private handleBlur;
+    private closeSuggestions;
     private handleContainerClick;
     private handleResetInput;
     render(): any;

package/dist/types/components/sd-dropdown-button/sd-dropdown-button.config.d.ts

@@ -53,6 +53,10 @@ export declare const PRESET_MENU_ITEM_COLORS: Record<DropdownButtonPreset, strin
 export declare const PRESET_MENU_ITEM_ACTIVE_BACKGROUNDS: Record<DropdownButtonPreset, string>;
 export declare const PRESET_MENU_ITEM_ACTIVE_COLORS: Record<DropdownButtonPreset, string>;
 export declare const DROPDOWN_CHEVRON_ICON_SIZE: Record<DropdownButtonSize, number>;
+export declare const DROPDOWN_BUTTON_MIN_WIDTH: Record<DropdownButtonSize, {
+    default: number;
+    split: number;
+}>;
 export declare const DROPDOWN_DISABLED_BACKGROUND: string;
 export declare const DROPDOWN_DISABLED_TEXT: string;
 export declare const DROPDOWN_DISABLED_ICON: string;

package/dist/types/components/sd-dropdown-button/sd-dropdown-button.d.ts

@@ -13,6 +13,7 @@ export declare class SdDropdownButton extends BaseDropdownEvent {
     isAnimatingOut: boolean;
     itemIndex: number;
     private triggerRef?;
+    private splitContainerRef?;
     private menuRef?;
     private closeAnimationTimer?;
     click: EventEmitter<DropdownButtonValue>;

package/dist/types/components/sd-key-value-table/sd-key-value-table.config.d.ts

@@ -3,8 +3,7 @@ export declare const KEY_VALUE_TABLE_LAYOUT: {
     rowHeight: number;
     thWidth: number;
     borderRadius: number;
-    paddingX: number;
-    paddingY: number;
+    padding: number;
     helpIconSize: number;
     requiredIconSize: number;
     gap: number;

package/dist/types/components/sd-key-value-table/sd-key-value-table.d.ts

@@ -31,6 +31,11 @@ export declare class SdKeyValueTable {
      * th/td 자체와 thColSpan/tdColSpan, hideTh, thRowSpan(autoSkip)을 모두 반영.
      */
     private computeMaxCols;
+    /**
+     * thStyle의 CSS 속성 값을 해당 CSS 변수로도 반영.
+     * label span이 var()로 스타일을 참조하기 때문에, 인라인 스타일만으로는 상속이 되지 않음.
+     */
+    private buildThStyle;
     private renderTh;
     private renderTd;
     private warnDuplicateNames;

package/dist/types/components/sd-modal-container/sd-modal-container.config.d.ts

@@ -54,6 +54,8 @@ export interface ModalDialogRefLike {
     _triggerClose(): void;
     _triggerDismissed(): void;
     _triggerClick?(): void;
+    _hasSubmit?(): boolean;
+    _triggerSubmit?(): void;
 }
 export interface SdModalGlobalOptions {
     zIndex?: number;

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

@@ -33,6 +33,7 @@ export declare class SdPortal {
     private observeScrollParents;
     private unobserveScrollParents;
     private getScrollParents;
+    private isInsideTarget;
     handleMouseDown(e: MouseEvent): void;
     handleWindowClick(e: MouseEvent): void;
     render(): any;

package/dist/types/components.d.ts

@@ -369,6 +369,15 @@ export namespace Components {
           * @default ''
          */
         "labelWidth": string | number;
+        /**
+          * @default false
+         */
+        "loadingRecommendedItems": boolean;
+        /**
+          * @default false
+         */
+        "loadingSuggestions": boolean;
+        "maxCount"?: number;
         /**
           * @default nanoid()
          */
@@ -377,6 +386,10 @@ export namespace Components {
           * @default '입력해 주세요.'
          */
         "placeholder": string;
+        /**
+          * @default []
+         */
+        "recommendedItems": string[];
         /**
           * @default []
          */
@@ -390,6 +403,10 @@ export namespace Components {
          */
         "size": ChipInputSize;
         "status"?: 'default' | 'pass' | 'error';
+        /**
+          * @default []
+         */
+        "suggestions": string[];
         /**
           * @default false
          */
@@ -2393,6 +2410,7 @@ declare global {
         "sdUpdate": string[];
         "sdFocus": void;
         "sdBlur": void;
+        "sdInput": string;
     }
     interface HTMLSdChipInputElement extends Components.SdChipInput, HTMLStencilElement {
         addEventListener<K extends keyof HTMLSdChipInputElementEventMap>(type: K, listener: (this: HTMLSdChipInputElement, ev: SdChipInputCustomEvent<HTMLSdChipInputElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -3487,17 +3505,31 @@ declare namespace LocalJSX {
           * @default ''
          */
         "labelWidth"?: string | number;
+        /**
+          * @default false
+         */
+        "loadingRecommendedItems"?: boolean;
+        /**
+          * @default false
+         */
+        "loadingSuggestions"?: boolean;
+        "maxCount"?: number;
         /**
           * @default nanoid()
          */
         "name"?: string;
         "onSdBlur"?: (event: SdChipInputCustomEvent<void>) => void;
         "onSdFocus"?: (event: SdChipInputCustomEvent<void>) => void;
+        "onSdInput"?: (event: SdChipInputCustomEvent<string>) => void;
         "onSdUpdate"?: (event: SdChipInputCustomEvent<string[]>) => void;
         /**
           * @default '입력해 주세요.'
          */
         "placeholder"?: string;
+        /**
+          * @default []
+         */
+        "recommendedItems"?: string[];
         /**
           * @default []
          */
@@ -3507,6 +3539,10 @@ declare namespace LocalJSX {
          */
         "size"?: ChipInputSize;
         "status"?: 'default' | 'pass' | 'error';
+        /**
+          * @default []
+         */
+        "suggestions"?: string[];
         /**
           * @default false
          */
@@ -5281,6 +5317,9 @@ declare namespace LocalJSX {
         "name": string;
         "error": boolean;
         "useReset": boolean;
+        "maxCount": number;
+        "loadingSuggestions": boolean;
+        "loadingRecommendedItems": boolean;
         "label": string;
         "labelWidth": string;
         "hint": string;

package/dist/types/utils/modal.d.ts

@@ -12,6 +12,12 @@ export interface ModalDialogRef {
      * 후속 동작을 결정합니다.
      */
     onClick(fn: () => void): ModalDialogRef;
+    /**
+     * OK 버튼 클릭 시 자동 dismiss 없이 fn 만 호출합니다. API 응답 결과에 따라
+     * consumer 가 직접 `ok()` / `close()` / `update()` 로 후속 동작을 결정할 때
+     * 사용합니다. `onOk` 와 함께 등록하면 `onSubmit` 이 우선합니다.
+     */
+    onSubmit(fn: () => void): ModalDialogRef;
     update(props: Partial<ConfirmModalOptions> | Partial<LoadingModalOptions>): ModalDialogRef;
     /**
      * 컴포넌트가 직접 닫기를 명시적으로 요청할 때 사용합니다. 커스텀 모달