@sellmate/design-system 1.26.0 → 1.27.0

package/dist/esm/sd-date-picker_7.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, a as getElement, h } from './index-BZ5lcC25.js';
+import { r as registerInstance, c as createEvent, a as getElement, h } from './index-BwIs2-fm.js';
 import { n as nanoid } from './index-CCwNgVmC.js';
 import { D as DATEPICKER_COLORS, a as DATEPICKER_SIZE_MAP } from './sd-date-picker.config-6dvDZPGx.js';
 import { i as inputTokens } from './component.textinput-e0ABNkP6.js';
@@ -127,9 +127,9 @@ const SdDatePicker = class {
             '--sd-system-color-field-border-focus': DATEPICKER_COLORS.border.focus,
             '--sd-system-color-field-bg-default': DATEPICKER_COLORS.bg.default,
         };
-        return (h("sd-field", { key: 'ffb39c09ac88e10d083eea775c1bc01532c625bc', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, size: this.size, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, h("div", { key: 'c9501fc3a0b2f0df85b78887c23d41737f95dff1', class: "sd-date-picker", ref: el => {
+        return (h("sd-field", { key: '4359c9ce80bfc919088774a4458c730c427aa3f5', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, size: this.size, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, h("div", { key: '638f4e59c9a7c5c841428c424181b3d2320857eb', class: "sd-date-picker", ref: el => {
                 this.triggerRef = el;
-            } }, h("sd-date-picker-trigger", { key: 'b09f91b2c5433913d85116498d582cfa631a8534', displayText: this.value ?? '', placeholder: this.placeholder, disabled: this.disabled, size: this.size, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (h("sd-portal", { key: '8f15c254eef196212499746da68d7cdd52bfc338', open: this.isOpen, parentRef: this.triggerRef, onSdClose: () => this.closeDropdown() }, h("sd-calendar", { key: '3939d9444c6674b0aaa54aaec186ba6fbd988bf4', elevated: true, value: this.value, selectable: this.selectable, onSdUpdate: this.handleSelect, onSdViewChange: this.handleViewChange })))));
+            } }, h("sd-date-picker-trigger", { key: 'cbfe2bee0fdea1f089860cf3a7da9b7e35327c87', displayText: this.value ?? '', placeholder: this.placeholder, disabled: this.disabled, size: this.size, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (h("sd-portal", { key: 'a348437c5f9f53180cc7f74d5b275e4f3fbedea6', open: this.isOpen, parentRef: this.triggerRef, onSdClose: () => this.closeDropdown() }, h("sd-calendar", { key: '7dd08053b3a24d25e6149d4bc751c75eff94f752', elevated: true, value: this.value, selectable: this.selectable, onSdUpdate: this.handleSelect, onSdViewChange: this.handleViewChange })))));
     }
     static get watchers() { return {
         "isOpen": [{
@@ -766,12 +766,12 @@ const SdInput = class {
             '--sd-system-size-field-sm-height': `${sizeTokens.height}px`,
             '--sd-system-radius-field-sm': `${sizeTokens.radius}px`,
         };
-        return (h("sd-field", { key: 'c160e40525cd64a14964363ce8da30ba4e327378', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, readonly: this.readonly, focused: this.focused, hovered: this.hovered, status: this.status, size: this.size, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, h("label", { key: '8c9c4048bdb1e919d12949db0568ac8419ee1724', class: "sd-input__content" }, h("slot", { key: '87ad6a20a39b0328bb70e8beee1439cd7dd11c45', name: "prefix" }), h("input", { key: '651123773cc7c525eb3c9951db260796b1f3ccc9', name: this.name, ref: el => (this.nativeEl = el), class: `sd-input__native ${this.inputClass}`, type: this.type === 'password' && this.passwordVisible ? 'text' : (this.type ?? 'text'), value: this.internalValue || '', placeholder: this.placeholder ?? '입력해 주세요.', disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, autocomplete: this.autocomplete || undefined, maxlength: this.maxlength, minlength: this.minlength, inputmode: this.inputmode, enterkeyhint: this.enterkeyhint, spellcheck: this.spellcheck, onInput: this.handleInput, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event), style: this.inputStyle }), h("slot", { key: '6565cc41b71fbe07724b10aba6bdac9f478cd8e9', name: "suffix" }), this.clearable && this.internalValue && !this.disabled && !this.readonly && (h("sd-ghost-button", { key: '2fb785d07ab27fb4de6f6d7179bd8d66e6041fe7', icon: "close", ariaLabel: "clear", size: "xxs", disabled: this.disabled, class: "sd-input__clear-icon", onClick: async () => {
+        return (h("sd-field", { key: 'b29a9d582bd8993bd5c31c70bab02ff553f2e167', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, readonly: this.readonly, focused: this.focused, hovered: this.hovered, status: this.status, size: this.size, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, h("label", { key: '1a6ad118628ab8cb9282953c618ca61898cf241a', class: "sd-input__content" }, h("slot", { key: '4de06d36b71ce2cad70a735e7620c2d320973962', name: "prefix" }), h("input", { key: '11c448201927a769c56fd1500ba8dd164d1b695a', name: this.name, ref: el => (this.nativeEl = el), class: `sd-input__native ${this.inputClass}`, type: this.type === 'password' && this.passwordVisible ? 'text' : (this.type ?? 'text'), value: this.internalValue || '', placeholder: this.placeholder ?? '입력해 주세요.', disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, autocomplete: this.autocomplete || undefined, maxlength: this.maxlength, minlength: this.minlength, inputmode: this.inputmode, enterkeyhint: this.enterkeyhint, spellcheck: this.spellcheck, onInput: this.handleInput, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event), style: this.inputStyle }), h("slot", { key: '4ac88a21df8e2feaa67a68cab9fca4e24985d17d', name: "suffix" }), this.clearable && this.internalValue && !this.disabled && !this.readonly && (h("sd-ghost-button", { key: '0985e2ed631ee746793563a22d766545a34d1562', icon: "close", ariaLabel: "clear", size: "xxs", disabled: this.disabled, class: "sd-input__clear-icon", onClick: async () => {
                 if (this.disabled || this.readonly)
                     return;
                 this.internalValue = '';
                 await this.formField?.sdValidate();
-            } })), this.type === 'password' && (h("sd-ghost-button", { key: 'f447711ee4082283e8cd130c4bfe3d0ff22e3970', icon: this.passwordVisible ? 'visibilityOn' : 'visibilityOff', ariaLabel: "visibility", size: "xxs", disabled: this.disabled || this.readonly, class: "sd-input__password-icon", onClick: () => {
+            } })), this.type === 'password' && (h("sd-ghost-button", { key: '16300e673a9c93209c403ec788217ba301c1d2e6', icon: this.passwordVisible ? 'visibilityOn' : 'visibilityOff', ariaLabel: "visibility", size: "xxs", disabled: this.disabled || this.readonly, class: "sd-input__password-icon", onClick: () => {
                 if (this.disabled || this.readonly)
                     return;
                 this.passwordVisible = !this.passwordVisible;
@@ -1196,15 +1196,15 @@ const SdNumberInput = class {
             '--sd-textinput-input-hint-typography-line-height': `${NUMBER_INPUT_HINT.typography.lineHeight}px`,
             '--sd-textinput-input-contents-gap': `${NUMBER_INPUT_CONTENTS_GAP}px`,
         };
-        return (h("sd-field", { key: 'c2047618e4efff7023d390f95efa349af0eb52af', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, readonly: this.readonly, focused: this.focused, hovered: this.hovered, status: this.status, size: this.size, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, h("div", { key: '2e4dc263460e89763a5794499aef1cd7c9dbc267', class: {
+        return (h("sd-field", { key: '581504f245674e1644f672aa77dd22f710a3c766', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, readonly: this.readonly, focused: this.focused, hovered: this.hovered, status: this.status, size: this.size, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, h("div", { key: 'f17872e37d0b0369061deb508d44ce7ae4943c5b', class: {
                 'sd-number-input__content': true,
                 'sd-number-input__content--no-stepper': !this.useButton,
-            } }, this.useButton && (h("button", { key: 'ce1e5d01421763c4ba77887ad823ddc63578b462', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--decrement", disabled: this.isDecrementDisabled(), onClick: this.handleDecrement, tabindex: -1 }, h("sd-icon", { key: '819664ac86d1813c3850e863412c9334195786f2', name: "minus", size: iconSize, color: this.isDecrementDisabled()
+            } }, this.useButton && (h("button", { key: 'b513ee5c44e2475ab751dae3a333e95405c9a319', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--decrement", disabled: this.isDecrementDisabled(), onClick: this.handleDecrement, tabindex: -1 }, h("sd-icon", { key: '172dcff1a3559008183bed32c30ec02d98c12664', name: "minus", size: iconSize, color: this.isDecrementDisabled()
                 ? NUMBER_INPUT_STEPPER.icon.disabled
-                : NUMBER_INPUT_STEPPER.icon.default }))), this.inputPrefix && h("span", { key: 'bb7355f2ace27bbd93cf506c2d973651d74d6d88', class: "sd-number-input__prefix" }, this.inputPrefix), h("input", { key: '8c8ee1d3e4b9ef5b89b00189bd138c32a7bcbe48', name: this.name, ref: el => (this.nativeEl = el), class: `sd-number-input__native ${this.inputClass}`, type: "text", inputMode: "numeric", value: this.displayValue, placeholder: this.placeholder ?? '입력해 주세요.', disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, onInput: this.handleInput, onKeyDown: this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur, style: {
+                : NUMBER_INPUT_STEPPER.icon.default }))), this.inputPrefix && h("span", { key: '24d631ea8330ed6e90f2aa77e46707867ff57539', class: "sd-number-input__prefix" }, this.inputPrefix), h("input", { key: 'ed0c70a534f1f6e246a407073aee9efa3a222b01', name: this.name, ref: el => (this.nativeEl = el), class: `sd-number-input__native ${this.inputClass}`, type: "text", inputMode: "numeric", value: this.displayValue, placeholder: this.placeholder ?? '입력해 주세요.', disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, onInput: this.handleInput, onKeyDown: this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur, style: {
                 textAlign: this.useButton ? 'center' : 'right',
                 ...this.inputStyle,
-            } }), this.inputSuffix && h("span", { key: '8da77f4901166b778544d51b9a88a7990aa15ba1', class: "sd-number-input__suffix" }, this.inputSuffix), this.useButton && (h("button", { key: '251cce12749955262b112d80ebd15298944bd079', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--increment", disabled: this.isIncrementDisabled(), onClick: this.handleIncrement, tabindex: -1 }, h("sd-icon", { key: '5ef30dba0f14baadca36fd651ca09e780ff9be7c', name: "add", size: iconSize, color: this.isIncrementDisabled()
+            } }), this.inputSuffix && h("span", { key: '7129df3b5cf544301cadaf5111e98ddcf3e7a340', class: "sd-number-input__suffix" }, this.inputSuffix), this.useButton && (h("button", { key: 'd5cb9acd77be94e494fb4af3b78001cd22dbfe3c', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--increment", disabled: this.isIncrementDisabled(), onClick: this.handleIncrement, tabindex: -1 }, h("sd-icon", { key: 'dba88711bda7f5522425d96187bce402c8516fff', name: "add", size: iconSize, color: this.isIncrementDisabled()
                 ? NUMBER_INPUT_STEPPER.icon.disabled
                 : NUMBER_INPUT_STEPPER.icon.default }))))));
     }
@@ -1426,7 +1426,7 @@ const SdTextarea = class {
             '--sd-system-size-field-sm-height': 'auto',
             '--sd-system-radius-field-sm': `${TEXTAREA_TOKENS.radius}px`,
         };
-        return (h("sd-field", { key: '007bdda5f38f94997c65f3542b4075a62c11a391', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, readonly: this.readonly, focused: this.focused, hovered: this.hovered, status: this.status, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, h("div", { key: '536185bb53815baae7807a5d4708d9f0100c07c1', class: "sd-textarea__content" }, h("textarea", { key: '144ae3ca78f8c3953bfef9951cb79952186b856c', name: this.name, ref: el => (this.nativeEl = el), class: `sd-textarea__native ${this.textareaClass}`, value: this.internalValue || '', placeholder: this.placeholder ?? '입력해 주세요.', disabled: this.disabled, readOnly: this.readonly, autofocus: this.autoFocus, maxLength: this.maxLength, rows: this.rows, spellcheck: this.spellcheck, onInput: this.handleInput, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event), style: this.textareaStyle }))));
+        return (h("sd-field", { key: 'dfa331524cbbac728c961c7a27d6c8dbd83853f4', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, readonly: this.readonly, focused: this.focused, hovered: this.hovered, status: this.status, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, h("div", { key: 'bd2d6d4b537364e28992971279d3278021b1ab5a', class: "sd-textarea__content" }, h("textarea", { key: '270d55c84255a43153ed5f5cfdeed586c38d0cf1', name: this.name, ref: el => (this.nativeEl = el), class: `sd-textarea__native ${this.textareaClass}`, value: this.internalValue || '', placeholder: this.placeholder ?? '입력해 주세요.', disabled: this.disabled, readOnly: this.readonly, autofocus: this.autoFocus, maxLength: this.maxLength, rows: this.rows, spellcheck: this.spellcheck, onInput: this.handleInput, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event), style: this.textareaStyle }))));
     }
     static get watchers() { return {
         "value": [{

package/dist/esm/sd-date-range-picker-calendar.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, F as Fragment } from './index-BZ5lcC25.js';
+import { r as registerInstance, c as createEvent, h, F as Fragment } from './index-BwIs2-fm.js';
 import { u as useDatePicker, t as today, W as WEEK_LABELS, C as CALENDAR_LAYOUT } from './useDatePicker-DoUg--aq.js';
 import { d as datepickerTokens } from './component.datepicker-laVsm9VM.js';
 
@@ -270,7 +270,7 @@ const SdDateRangePickerCalendar = class {
             '--range-panel-gap': `${RANGE_LAYOUT.panelGap}px`,
             '--range-divider': RANGE_LAYOUT.divider,
         };
-        return (h(Fragment, { key: '9f94444bf58cdf5e1f25b377b1cb7bfac7fde4e9' }, h("div", { key: '1a516f6effa60cc84f22441dbc705fd06508002a', class: "sd-date-range-picker-calendar", style: cssVars }, this.renderYearNav(), h("div", { key: '7318074e2146d3b7be635a3e80ee62ec956ff200', class: "sd-date-range-picker-calendar__panels" }, this.renderPanel(this.currentYear, this.currentMonth, true), h("span", { key: 'dc40b470c2ece3cad43bac1e3446d6fe0d139966', class: "sd-date-range-picker-calendar__divider", "aria-hidden": "true" }), this.renderPanel(this.rightYear, this.rightMonth, false)))));
+        return (h(Fragment, { key: '4502cc08eb9df7c24cdc9f22564fb2a4a0b2736e' }, h("div", { key: '9da4356920cbce83c548a4c5f40cb2af9e36a257', class: "sd-date-range-picker-calendar", style: cssVars }, this.renderYearNav(), h("div", { key: 'a8117206cd3d9368a86f4cc307037461c1314aad', class: "sd-date-range-picker-calendar__panels" }, this.renderPanel(this.currentYear, this.currentMonth, true), h("span", { key: '0f6cbaf53781429b3de08aa992a45f2c26444625', class: "sd-date-range-picker-calendar__divider", "aria-hidden": "true" }), this.renderPanel(this.rightYear, this.rightMonth, false)))));
     }
     static get watchers() { return {
         "value": [{

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-BZ5lcC25.js';
+import { r as registerInstance, h, H as Host } from './index-BwIs2-fm.js';
 import { s as systemTokens } from './system-BJfiMC9H.js';
 
 const DIVIDER_COLORS = {
@@ -17,7 +17,7 @@ const SdDivider = class {
         const hostStyle = {
             '--sd-divider-color': DIVIDER_COLORS.default,
         };
-        return (h(Host, { key: 'db5c3c41114485dc464c548d4a9f62a07092b448', style: hostStyle }, h("hr", { key: 'dbc8aed5991da3e99573997d8a1de7d227baefd8', "aria-orientation": this.vertical ? 'vertical' : 'horizontal' })));
+        return (h(Host, { key: '73be9d4cc38b230e4cff7f8ebcdc81bd2d56e0e7', style: hostStyle }, h("hr", { key: 'a4da09faca453df8cb6ea3ed00609d4e0c238a7a', "aria-orientation": this.vertical ? 'vertical' : 'horizontal' })));
     }
 };
 SdDivider.style = sdDividerCss();

package/dist/esm/sd-dropdown-button.entry.js

@@ -1,6 +1,6 @@
-import { r as registerInstance, c as createEvent, a as getElement, h } from './index-BZ5lcC25.js';
+import { r as registerInstance, c as createEvent, a as getElement, h } from './index-BwIs2-fm.js';
 import { s as sanitizeInlineHtml } from './sanitize-inline-html-BE4tnQ2Z.js';
-import { B as BUTTON_CONFIG, g as getPresetName, f as buttonTokens, d as PRESET_BORDER_COLORS$1, P as PRESET_ICON_COLORS$1, c as PRESET_TEXT_COLORS$1, e as PRESET_HOVER_BACKGROUNDS$1, b as BUTTON_FOCUS_RING_COLOR } from './sd-button.config-DjcjlPt7.js';
+import { B as BUTTON_CONFIG, g as getPresetName, f as buttonTokens, d as PRESET_BORDER_COLORS$1, P as PRESET_ICON_COLORS$1, c as PRESET_TEXT_COLORS$1, e as PRESET_HOVER_BACKGROUNDS$1, b as BUTTON_FOCUS_RING_COLOR } from './sd-button.config-ClMlDGkX.js';
 import { s as systemTokens } from './system-BJfiMC9H.js';
 
 class DropdownManager {

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

@@ -1,6 +1,6 @@
-import { r as registerInstance, a as getElement, h, c as createEvent, F as Fragment } from './index-BZ5lcC25.js';
+import { r as registerInstance, a as getElement, h, c as createEvent, F as Fragment } from './index-BwIs2-fm.js';
 import { f as fieldTokens } from './component.field-BOJJ_sQS.js';
-import { T as TooltipArrow } from './tooltipArrow-ByHjyr3Z.js';
+import { T as TooltipArrow } from './tooltipArrow-CJxhdfqT.js';
 
 const FIELD_ADDON_ALIGN_MAP = {
     start: 'flex-start',
@@ -237,18 +237,18 @@ const SdField = class {
                     : {}),
             }
             : {};
-        return (h("div", { key: '3f7d253e821031efe998686ba750b5d79f093dfb', class: {
+        return (h("div", { key: '7673ab0d94a03bcfa42381c961e749cd083d7af0', class: {
                 'sd-field': true,
                 'sd-field--has-label': this.label !== '',
                 'sd-field--has-addon': addon !== '',
                 [this.fieldStatus]: this.fieldStatus !== '',
-            }, style: { ...sizeCssVars, ...labelCssVars, ...addonCssVars, ...messageCssVars } }, h("div", { key: '2dcfb4712b65514ee05f4d3f769d3395916a0bbe', class: "sd-field__wrapper" }, this.renderLabel(this.label), h("div", { key: '2e6279e9a977a1afe7417f87a7947e60f6a057c0', class: "sd-field__main" }, h("div", { key: 'abf3959ccabdd36b8e57f925bc7ef288dde0dbf0', class: {
+            }, style: { ...sizeCssVars, ...labelCssVars, ...addonCssVars, ...messageCssVars } }, h("div", { key: '00c5056105b72f143a8c4249b8cd3b6a60fb6d1d', class: "sd-field__wrapper" }, this.renderLabel(this.label), h("div", { key: 'e99461246fa8ceadaf7a43f1c62c474caa160972', class: "sd-field__main" }, h("div", { key: '6bf754d3a167b1ca4f23d2e1d260643e278e85f6', class: {
                 'sd-field__control': true,
                 'sd-field__control--has-addon': addon !== '',
             }, style: this.width !== '' && this.width !== 0
                 ? { width: typeof this.width === 'number' ? `${this.width}px` : this.width }
-                : {} }, addon && (h("div", { key: '1f338c8324a0a8a49fed5a7f8a6a3496b99d1eca', class: "sd-field__addon" }, this.icon && (h("sd-icon", { key: '7c1d23f99ea181642fba65678b5fdb26ba4721b4', name: this.icon.name, size: this.icon.size ??
-                Number(FIELD_LABEL_SIZE_MAP[(this.size in FIELD_LABEL_SIZE_MAP ? this.size : 'sm')].icon), color: this.icon.color, rotate: this.icon.rotate })), addon)), h("slot", { key: 'dab3ba9002d7c9ff9726b1a242b11473eccc99dc' })), this.errorMsg !== '' || this.errorMessage !== '' ? (h("div", { class: "sd-field__error-message" }, this.errorMsg !== '' ? this.errorMsg : this.errorMessage)) : (this.hint !== '' && h("div", { class: "sd-field__hint" }, this.hint))))));
+                : {} }, addon && (h("div", { key: '2d9acde5ecaeb32a94e1ba33c408160a2f2da46f', class: "sd-field__addon" }, this.icon && (h("sd-icon", { key: 'a0916124710c29478feffef96efdaffe599d4bc7', name: this.icon.name, size: this.icon.size ??
+                Number(FIELD_LABEL_SIZE_MAP[(this.size in FIELD_LABEL_SIZE_MAP ? this.size : 'sm')].icon), color: this.icon.color, rotate: this.icon.rotate })), addon)), h("slot", { key: '2e4690a4678ca40deb9e023baae24a44fd4da959' })), this.errorMsg !== '' || this.errorMessage !== '' ? (h("div", { class: "sd-field__error-message" }, this.errorMsg !== '' ? this.errorMsg : this.errorMessage)) : (this.hint !== '' && h("div", { class: "sd-field__hint" }, this.hint))))));
     }
     renderLabel(label) {
         if (label == null || label === '')
@@ -439,7 +439,7 @@ const SdFloatingPopover = class {
         }
     }
     render() {
-        return h("slot", { key: 'cadee10f344de11650330995b0de9a342babe1e3' });
+        return h("slot", { key: '56deedcae378d170d9debca4cf1a07599f31dfc5' });
     }
 };
 SdFloatingPopover.style = sdFloatingPortalCss();
@@ -615,7 +615,7 @@ const SdTooltip = class {
         const bodyHTML = this.message && this.message.length > 0
             ? this.message.map(line => `<div>${line}</div>`).join('')
             : this.slotContentHTML;
-        return (h(Fragment, { key: 'f50cb9c1397c479dd994edeb044cb95764976344' }, h("div", { key: '0b6f62051b47015a1e0bb7e9f6ee66750b74c4e0', ref: el => (this.triggerEl = el), class: triggerClasses, ...divTrigger }, anchorMode ? (h("slot", { name: "anchor" })) : hasLabel ? (h("sd-button", { ref: el => (this.buttonEl = el), name: this.name ?? 'primary_sm', label: this.label, icon: icon, rightIcon: this.rightIcon, ariaLabel: this.ariaLabel, disabled: this.disabled, type: this.type ?? 'button', class: "sd-tooltip", ...buttonClickTrigger })) : (h("sd-icon", { ref: el => (this.buttonEl = el), name: icon, size: this.iconSize ?? 12, color: color, class: "sd-tooltip" }))), this.showTooltip && (h("sd-floating-portal", { key: '4e750b20c8ee4649f3474de06e12c7008f8796c3', parentRef: anchorMode ? this.triggerEl : this.buttonEl, onSdClose: this.handleClose, placement: placement, offset: this.tooltipOffset }, h("div", { key: 'd9f86aa8e074d516350ffc621d28b3d70ed08713', ref: el => (this.menuEl = el), class: {
+        return (h(Fragment, { key: 'cd0c166191a9f83a11891786cd246a268d50b349' }, h("div", { key: '9e2872936629b886b779852c51f57874466edfb5', ref: el => (this.triggerEl = el), class: triggerClasses, ...divTrigger }, anchorMode ? (h("slot", { name: "anchor" })) : hasLabel ? (h("sd-button", { ref: el => (this.buttonEl = el), name: this.name ?? 'primary_sm', label: this.label, icon: icon, rightIcon: this.rightIcon, ariaLabel: this.ariaLabel, disabled: this.disabled, type: this.type ?? 'button', class: "sd-tooltip", ...buttonClickTrigger })) : (h("sd-icon", { ref: el => (this.buttonEl = el), name: icon, size: this.iconSize ?? 12, color: color, class: "sd-tooltip" }))), this.showTooltip && (h("sd-floating-portal", { key: '2db92e0d56a1a6cee04ab5f23f6bbe00fc279351', parentRef: anchorMode ? this.triggerEl : this.buttonEl, onSdClose: this.handleClose, placement: placement, offset: this.tooltipOffset }, h("div", { key: 'a4635141d3e9aa630be80b2b6071a5ba16de257d', ref: el => (this.menuEl = el), class: {
                 'sd-floating-menu': true,
                 [`sd-floating-menu--${tooltipType}`]: true,
                 [`sd-floating-menu--${placement}`]: true,
@@ -623,7 +623,7 @@ const SdTooltip = class {
             }, style: {
                 '--sd-floating-bg': typeConfig.bg,
                 '--sd-floating-content': typeConfig.content,
-            }, onMouseEnter: () => this.openTooltip(), onMouseLeave: () => !this.useClose && this.startHideTimer() }, h("i", { key: '91080790a99c0aaad815c8deddce5fc6a9ff405d', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, h(TooltipArrow, { key: 'db89405989bfb909e6f86050de407cbc5f821717' })), h("div", { key: '24cc5aa569cbf316aaaf23e5cc7e85144d51ab9b', class: "sd-floating-menu__content", innerHTML: bodyHTML }), this.useClose && (h("sd-ghost-button", { key: '32b62d9c48d72428783375b68bcf4807154b6bb1', class: "sd-floating-menu__close-button", icon: "close", ariaLabel: "close", size: "xxs", onClick: () => this.closeTooltip() })))))));
+            }, onMouseEnter: () => this.openTooltip(), onMouseLeave: () => !this.useClose && this.startHideTimer() }, h("i", { key: 'cf7f3186dd7c9cbf001700bd29de05480e807533', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, h(TooltipArrow, { key: '4aca7fbbc159bf61c9488a38431e0bcc40172446' })), h("div", { key: 'ffa09626b16742e6d774944bf8536def2b250519', class: "sd-floating-menu__content", innerHTML: bodyHTML }), this.useClose && (h("sd-ghost-button", { key: '934529cc6c8c4a46a09b7dd03baec6666029f169', class: "sd-floating-menu__close-button", icon: "close", ariaLabel: "close", size: "xxs", onClick: () => this.closeTooltip() })))))));
     }
 };
 SdTooltip.style = sdTooltipCss();

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h } from './index-BZ5lcC25.js';
+import { r as registerInstance, c as createEvent, h } from './index-BwIs2-fm.js';
 
 const SdForm = class {
     constructor(hostRef) {

package/dist/esm/sd-ghost-button_3.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, a as getElement, h, H as Host } from './index-BZ5lcC25.js';
+import { r as registerInstance, c as createEvent, a as getElement, h, H as Host } from './index-BwIs2-fm.js';
 
 const ghostButton = {
 	xxs: {
@@ -55,8 +55,7 @@ const ghostButton = {
 		hover: {
 			bg: "#FFFFFF"
 		}
-	}
-};
+	}};
 var ghostButtonTokens = {
 	ghostButton: ghostButton
 };
@@ -471,7 +470,7 @@ const SdPortal = class {
         this.close.emit();
     }
     render() {
-        return h("slot", { key: '0b01050e7c1ab2b648bf1118aec27140ff1aed4c' });
+        return h("slot", { key: '623ee5423b145701ba9dd801d44874214f7a76e3' });
     }
     static get watchers() { return {
         "open": [{
@@ -699,7 +698,7 @@ const SdTag = class {
         const config = this.resolvedConfig;
         const iconNode = this.renderIcon(config.icon, config.iconSize);
         const width = this.resolvedWidth;
-        return (h(Host, { key: '77b65a35be3456f1bf821a0b276fd1e5820f5b90', style: width != null ? { '--sd-tag-width': width } : undefined }, h("span", { key: '806c855067690cedefa8d867d3535fd83aab4d73', class: "sd-tag", style: {
+        return (h(Host, { key: '37bb1fefd51f583b0a9dde9fe46cf843a48e8e13', style: width != null ? { '--sd-tag-width': width } : undefined }, h("span", { key: 'e996471849834802eaeff02abaadee1a2addac4f', class: "sd-tag", style: {
                 '--sd-tag-background': config.background,
                 '--sd-tag-content': config.content,
                 '--sd-tag-height': config.height,
@@ -709,7 +708,7 @@ const SdTag = class {
                 '--sd-tag-font-weight': config.fontWeight,
                 '--sd-tag-line-height': config.lineHeight,
                 '--sd-tag-radius': config.radius,
-            }, "aria-label": this.label || 'tag' }, this.icon && this.isLeft && iconNode, h("span", { key: '88891681230cc9b916428d60814b4d90c1614c20', class: "sd-tag__label" }, this.label), this.icon && !this.isLeft && iconNode)));
+            }, "aria-label": this.label || 'tag' }, this.icon && this.isLeft && iconNode, h("span", { key: '2e63073d1950046747521071ba5db5f9a404acef', class: "sd-tag__label" }, this.label), this.icon && !this.isLeft && iconNode)));
     }
 };
 SdTag.style = sdTagCss();

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, a as getElement, h } from './index-BZ5lcC25.js';
+import { r as registerInstance, a as getElement, h } from './index-BwIs2-fm.js';
 import { s as systemTokens } from './system-BJfiMC9H.js';
 import { s as sanitizeInlineHtml } from './sanitize-inline-html-BE4tnQ2Z.js';
 

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

@@ -1,6 +1,6 @@
-import { r as registerInstance, c as createEvent, h } from './index-BZ5lcC25.js';
+import { r as registerInstance, c as createEvent, h } from './index-BwIs2-fm.js';
 import { s as systemTokens } from './system-BJfiMC9H.js';
-import { t as tableTokens } from './component.table-D6GUzecR.js';
+import { t as tableTokens } from './component.table-D9tQwTWy.js';
 
 const t = tableTokens.table;
 const KEY_VALUE_TABLE_LAYOUT = {
@@ -8,7 +8,7 @@ const KEY_VALUE_TABLE_LAYOUT = {
     thWidth: 120,
     borderRadius: Number(t.radius),
     thPaddingX: Number(t.header.paddingX),
-    padding: Number(t.keyValue.body.padding),
+    padding: Number(t.keyValue.body.paddingY),
     helpIconSize: 16,
     requiredIconSize: 12,
     gap: Number(t.header.gap),

package/dist/esm/sd-linear-progress.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, h, H as Host } from './index-BZ5lcC25.js';
-import { p as progressTokens } from './component.progress-D1vaasIp.js';
+import { r as registerInstance, h, H as Host } from './index-BwIs2-fm.js';
+import { p as progressTokens } from './component.progress-BG5nGnBi.js';
 import { s as systemTokens } from './system-BJfiMC9H.js';
 
 const LINEAR_PROGRESS_COLORS = {
@@ -50,7 +50,7 @@ const SdLinearProgress = class {
             clipPath: `inset(0 ${100 - this.clampedValue}% 0 0)`,
         };
         const valueText = `${Math.round(this.clampedValue)}%`;
-        return (h(Host, { key: 'cb460a4f0b5716eb067b7c5ddedb93bc2d3ba0b3', style: hostStyle }, h("div", { key: 'e135bed6a1ee332a60f9d56fe472922df0235189', class: "sd-linear-progress__track" }, h("div", { key: 'd4639603633b2b5a47ef907c136ca6b48a023524', class: "sd-linear-progress__fill", style: fillStyle }), !this.indeterminate && (h("span", { key: 'ec6864d38e770504e6112a86e088e95c0d6dc9dc', class: "sd-linear-progress__value sd-linear-progress__value--on-track" }, valueText)), !this.indeterminate && (h("span", { key: 'd7657671095fa0d5b88e1723656ac6e2eab1dfff', class: "sd-linear-progress__value sd-linear-progress__value--on-fill", style: valueOnFillStyle }, valueText))), this.label && h("span", { key: 'b7780eb3e698c42313d63083f733354404357429', class: "sd-linear-progress__label" }, this.label)));
+        return (h(Host, { key: '2c2024fc61418c73913dc0333ddef93e667fa6f0', style: hostStyle }, h("div", { key: '44fac7a5a5795451ab8fc7c5538161cb974c3b4f', class: "sd-linear-progress__track" }, h("div", { key: '050f19c7c2ae6f14f744a1a33f933b97d9d5d448', class: "sd-linear-progress__fill", style: fillStyle }), !this.indeterminate && (h("span", { key: '70233788c6f8b5d89ec1123e40cc97c89a9d20c4', class: "sd-linear-progress__value sd-linear-progress__value--on-track" }, valueText)), !this.indeterminate && (h("span", { key: 'f2df0a4d96ca1224b902a360f4f1ef4856405ed6', class: "sd-linear-progress__value sd-linear-progress__value--on-fill", style: valueOnFillStyle }, valueText))), this.label && h("span", { key: '00d72060f073ad6e046d7c68f248df6622f87088', class: "sd-linear-progress__label" }, this.label)));
     }
 };
 SdLinearProgress.style = sdLinearProgressCss();

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, h } from './index-BZ5lcC25.js';
+import { r as registerInstance, h } from './index-BwIs2-fm.js';
 
 const sdLoadingContainerCss = () => `sd-loading-container .sd-loading-container{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:var(--sd-loading-container-z-index, 999);opacity:0;visibility:hidden;transition:opacity 0.2s ease, visibility 0s linear 0.2s;pointer-events:none}sd-loading-container .sd-loading-container--visible{opacity:1;visibility:visible;transition:opacity 0.2s ease, visibility 0s linear 0s;pointer-events:auto}sd-loading-container .sd-loading-container__backdrop{position:absolute;inset:0;background:rgba(0, 0, 0, 0.4)}sd-loading-container .sd-loading-container__content{position:relative;display:flex;flex-direction:column;align-items:center;gap:16px}sd-loading-container .sd-loading-container__message{margin:0;color:#ffffff;font-size:14px;font-weight:500;line-height:22px;text-align:center;max-width:400px;word-break:keep-all}`;
 
@@ -18,10 +18,10 @@ const SdLoadingContainer = class {
         this.visible = false;
     }
     render() {
-        return (h("div", { key: 'e5ed85a0b5467ce92d3b31324752285f3d6a40f9', class: {
+        return (h("div", { key: 'be8150fa2321621b2761f886fe96dc4a9177de64', class: {
                 'sd-loading-container': true,
                 'sd-loading-container--visible': this.visible,
-            }, "aria-hidden": this.visible ? 'false' : 'true' }, h("div", { key: '80f6425043b106aedfc8110fbd1511fbf32eb283', class: "sd-loading-container__backdrop" }), h("div", { key: 'e8a24b8a9eb4986a08d903fa3ed54d1a4048d4d6', class: "sd-loading-container__content" }, h("sd-circle-progress", { key: '9b37b330ef551f75c78974ccae1d8fd3edfbb898', indeterminate: true, type: "inverse" }), this.message && h("p", { key: '1be0b6565528d0415b5e43c2b16729ac707ed9e8', class: "sd-loading-container__message" }, this.message))));
+            }, "aria-hidden": this.visible ? 'false' : 'true' }, h("div", { key: '268f97c036ab8a15c465469ee467aa6a962e9bf0', class: "sd-loading-container__backdrop" }), h("div", { key: 'e7f8fcbffdfe462890706e896a476de7f734166e', class: "sd-loading-container__content" }, h("sd-circle-progress", { key: '60e52996e7ba895a0375f344431e721c8bd34753', indeterminate: true, type: "inverse" }), this.message && h("p", { key: 'c7cbf5b183a22a3b9f693bb427057d3fa9611724', class: "sd-loading-container__message" }, this.message))));
     }
 };
 SdLoadingContainer.style = sdLoadingContainerCss();

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, a as getElement, h } from './index-BZ5lcC25.js';
+import { r as registerInstance, a as getElement, h } from './index-BwIs2-fm.js';
 import { u as unregisterModal, r as registerModal, s as setModalInteractive, i as isTopInteractiveModal, a as requestCloseForModal } from './modal-stack-DRVnqiWc.js';
 
 const sdModalContainerCss = () => `sd-modal-container{display:block}sd-modal-container .sd-modal-container{position:fixed;inset:0;z-index:var(--sd-modal-container-z-index, 997);pointer-events:none}sd-modal-container .sd-modal-container__layer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}sd-modal-container .sd-modal-container__backdrop{position:absolute;inset:0;background:rgba(0, 0, 0, 0.4);opacity:0;transition:opacity 0.3s ease-out;pointer-events:none}sd-modal-container .sd-modal-container__backdrop--visible{opacity:1;pointer-events:auto}sd-modal-container .sd-modal-container__modal{position:relative;z-index:1;opacity:0;transform:scale(0);pointer-events:auto;transition:opacity 0.3s ease-out, transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1)}sd-modal-container .sd-modal-container__modal--visible{opacity:1;transform:scale(1)}sd-modal-container .sd-modal-container__modal--shake{animation:modal-shake 0.3s ease-out}@keyframes modal-shake{0%,100%{transform:scale(1)}25%{transform:scale(1.03)}50%{transform:scale(0.97)}75%{transform:scale(1.01)}}`;

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

@@ -1,7 +1,7 @@
-import { r as registerInstance, c as createEvent, h, F as Fragment, a as getElement, H as Host } from './index-BZ5lcC25.js';
+import { r as registerInstance, c as createEvent, h, F as Fragment, a as getElement, H as Host } from './index-BwIs2-fm.js';
 import { T as TABLE_ID_ATTR } from './constants-sZMi_32I.js';
-import { a as TABLE_SELECTABLE_COLUMN_WIDTH, r as resolveTableIconColor, e as resolveSortIconName, c as TABLE_BORDER, f as TABLE_HEADER_RESIZING_BAR, g as TABLE_HEADER_TYPOGRAPHY, h as TABLE_HEADER_COLORS, i as TABLE_HEADER_LAYOUT, T as TABLE_BODY_LAYOUT, j as TABLE_SEPARATOR, b as TABLE_BODY_TYPOGRAPHY } from './sd-table.config-B3wuA5wX.js';
-import './component.table-D6GUzecR.js';
+import { a as TABLE_SELECTABLE_COLUMN_WIDTH, r as resolveTableIconColor, e as resolveSortIconName, c as TABLE_BORDER, f as TABLE_HEADER_RESIZING_BAR, g as TABLE_HEADER_TYPOGRAPHY, h as TABLE_HEADER_COLORS, i as TABLE_HEADER_LAYOUT, T as TABLE_BODY_LAYOUT, j as TABLE_SEPARATOR, b as TABLE_BODY_TYPOGRAPHY } from './sd-table.config-BbIWNUE2.js';
+import './component.table-D9tQwTWy.js';
 import './system-BJfiMC9H.js';
 
 const pagination = {
@@ -156,13 +156,13 @@ const SdPagination = class {
             '--sd-pagination-bg-selected': PAGINATION_COLORS.bgSelected,
             '--sd-pagination-item-width': `${this.buttonWidth}px`,
         };
-        return (h("div", { key: '8cdda030c6ffa1a4f3358a5877da3b76293bae39', class: {
+        return (h("div", { key: '1ab90aa479a2ec1985a79efbcb48f0453ce670a9', class: {
                 'sd-pagination': true,
                 'sd-pagination--simple': this.simple,
-            }, style: cssVars }, h("div", { key: '34569687e67dec4b218ef6d3da01e21b19176284', class: "sd-pagination__group sd-pagination__group--prev" }, this.renderPrevButtons()), this.simple ? (h("div", { class: "sd-pagination__info" }, h("span", { class: "sd-pagination__current" }, this.currentPage), h("span", { class: "sd-pagination__divider" }, "/"), h("span", { class: "sd-pagination__last" }, this.lastPage))) : (h("div", { class: "sd-pagination__numbers" }, this.pageNumbers.map(n => (h("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
+            }, style: cssVars }, h("div", { key: 'd5e9fdd9f221536f5eb404095b2b6d052aaa6a9e', class: "sd-pagination__group sd-pagination__group--prev" }, this.renderPrevButtons()), this.simple ? (h("div", { class: "sd-pagination__info" }, h("span", { class: "sd-pagination__current" }, this.currentPage), h("span", { class: "sd-pagination__divider" }, "/"), h("span", { class: "sd-pagination__last" }, this.lastPage))) : (h("div", { class: "sd-pagination__numbers" }, this.pageNumbers.map(n => (h("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
                 'sd-pagination__item': true,
                 'sd-pagination__item--selected': this.currentPage === n,
-            }, onClick: () => this.handlePageChange(n) }, n))))), h("div", { key: 'a222ff48f10bce574ad9ef928d66d99696f6923b', class: "sd-pagination__group sd-pagination__group--next" }, this.renderNextButtons())));
+            }, onClick: () => this.handlePageChange(n) }, n))))), h("div", { key: 'a48d39b7db769a39f58e4b399aa7bb1d15748934', class: "sd-pagination__group sd-pagination__group--next" }, this.renderNextButtons())));
     }
 };
 SdPagination.style = sdPaginationCss();
@@ -218,9 +218,9 @@ const SdTbody = class {
         }
     }
     render() {
-        return (h(Host, { key: '3c3b748b436dc9db4054a5528fc205da7d21c8e8', slot: `${this.tableId}-body` }, h("tbody", { key: '7cd092ce9b54bed7e4aaaf4b9b3df788d13e382c', class: { tbody: true } }, [
+        return (h(Host, { key: 'e8d3873248658b9899e4daf1d6ffb1c60ad658e4', slot: `${this.tableId}-body` }, h("tbody", { key: 'ae9617a588e45bce5ffaa50bc300fdd038b1db1e', class: { tbody: true } }, [
             this.topSpacerHeight > 0 && (h("tr", { key: "spacer-top", class: "tbody__spacer", style: { height: `${this.topSpacerHeight}px`, display: 'block' } })),
-            h("slot", { key: '0a8c271acdd45802cb036c58303bd08037067c7d' }),
+            h("slot", { key: '1bd8ca3179ad36584813c14e1df1c1c175fcf77b' }),
             this.bottomSpacerHeight > 0 && (h("tr", { key: "spacer-bottom", class: "tbody__spacer", style: { height: `${this.bottomSpacerHeight}px`, display: 'block' } })),
         ])));
     }
@@ -478,16 +478,16 @@ const SdThead = class {
             '--table-border-color': TABLE_BORDER.color,
             '--table-border-width': `${TABLE_BORDER.width}px`,
         };
-        return (h(Host, { key: '0f9c6f9eb3c1afbd2af6c729152e3767b9637886', slot: `${this.tableId}-head`, style: headStyle }, h("thead", { key: '35a3d8864c5801058e810b6c0b7b281bf7943b85', class: {
+        return (h(Host, { key: '89bb8a5873c480544cc6a298ca9738577469ae43', slot: `${this.tableId}-head`, style: headStyle }, h("thead", { key: '390aad02b5e42bc39c9eb72091b1bcb54eae8098', class: {
                 'thead': true,
                 'thead--sticky': this._stickyHeader,
-            } }, h("tr", { key: '04827a6c5148f1be3de475e4e0a9ead839aab89e', class: "tr" }, this._selectable && (h("th", { key: '169e3b47c9710851ee6dbe58765a1b9da5ac6f75', class: {
+            } }, h("tr", { key: 'a5889ed5b9fe810590f1c1d869aa6b72dabe195b', class: "tr" }, this._selectable && (h("th", { key: '8cf6b81cd5b02cf08597b1b4f8d1b858f10d9403', class: {
                 'th': true,
                 'th--selected': true,
                 'sticky-left': true,
                 'sticky-left-edge': stickyLeftCount === 0,
                 'is-scrolled-left': stickyLeftCount === 0 && this._scrolledLeft,
-            }, style: { '--sticky-left-offset': '0px' } }, h("sd-checkbox", { key: '85f1dc11ae78307cd814813736e9e3097fdd4a47', value: this.getIsAllChecked(), disabled: safeRows.length === 0, onSdUpdate: (e) => this.handleSelectAll(e.detail) }), h("div", { key: 'adc4e163b5161fe7e6adf41c4b48284654a223b9', class: "th__bar" }))), stickyLeftCols.map((col, idx) => (h("th", { key: col.name, class: {
+            }, style: { '--sticky-left-offset': '0px' } }, h("sd-checkbox", { key: '94b92d786fde6d5382e7955f97e54915597c04ad', value: this.getIsAllChecked(), disabled: safeRows.length === 0, onSdUpdate: (e) => this.handleSelectAll(e.detail) }), h("div", { key: 'fefd1a1de41b524e0525e60684bec2fb85ac9db6', class: "th__bar" }))), stickyLeftCols.map((col, idx) => (h("th", { key: col.name, class: {
                 'th': true,
                 [`${col.thClass}`]: Boolean(col.thClass),
                 'sticky-left': true,

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

@@ -1,5 +1,5 @@
-import { r as registerInstance, c as createEvent, a as getElement, h, F as Fragment } from './index-BZ5lcC25.js';
-import { T as TooltipArrow } from './tooltipArrow-ByHjyr3Z.js';
+import { r as registerInstance, c as createEvent, a as getElement, h, F as Fragment } from './index-BwIs2-fm.js';
+import { T as TooltipArrow } from './tooltipArrow-CJxhdfqT.js';
 
 const popover = {
 	"default": {

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

@@ -1,4 +1,5 @@
-import { r as registerInstance, c as createEvent, h } from './index-BZ5lcC25.js';
+import { r as registerInstance, c as createEvent, h } from './index-BwIs2-fm.js';
+import { o as overlayTokens } from './component.overlay-De0OtxK5.js';
 import { s as systemTokens } from './system-BJfiMC9H.js';
 
 const popup$1 = {
@@ -15,14 +16,7 @@ const popup$1 = {
 			fontFamily: "Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif",
 			fontWeight: "700",
 			fontSize: "18",
-			lineHeight: "30"}
-	},
-	footer: {
-		bg: "#FFFFFF",
-		paddingX: "20",
-		paddingY: "8",
-		gap: "16"
-	},
+			lineHeight: "30"}},
 	bg: "#EEEEEE"
 };
 var popupTokens = {
@@ -30,6 +24,7 @@ var popupTokens = {
 };
 
 const { popup } = popupTokens;
+const { overlay } = overlayTokens;
 const shadowSpreadMd = systemTokens.shadow.spread.md;
 const POPUP_LAYOUT = {
     bodyBg: popup.bg,
@@ -52,10 +47,10 @@ const POPUP_HEADER = {
     paddingY: 10,
 };
 const POPUP_FOOTER = {
-    bg: popup.footer.bg,
-    paddingX: Number(popup.footer.paddingX),
-    paddingY: Number(popup.footer.paddingY),
-    gap: Number(popup.footer.gap),
+    bg: overlay.footer.bg.default,
+    paddingX: Number(overlay.footer.paddingX),
+    paddingY: Number(overlay.footer.paddingY),
+    gap: Number(overlay.footer.gap),
     height: 52,
     slotHeight: 36,
     shadow: `${shadowSpreadMd.x}px ${shadowSpreadMd.y}px ${shadowSpreadMd.blur}px ${shadowSpreadMd.spread}px ${shadowSpreadMd.color}`,
@@ -107,7 +102,7 @@ const SdPopup = class {
             ...DEFAULT_SUBMIT_BUTTON_PROPS,
             ...this.submitButtonProps,
         };
-        return (h("div", { key: 'bc5ca3d1f4bc9c340245262f891612cb3cebcbca', class: `sd-popup sd-popup--${this.type}`, style: cssVars }, h("header", { key: 'd061ed390b7ee14c70f7f1515a1ca240090f51b1', class: "sd-popup__header" }, h("h2", { key: '9fcc3683714d5160d77df1d099de3f7152ce0a8d', class: "sd-popup__title" }, this.popupTitle)), h("div", { key: 'e2943e318cc283d27d385fab001e673740c0c5bd', class: "sd-popup__body" }, h("slot", { key: '9b846412c09cae14f1f93364606cf6db91a11112' })), this.useFooter && (h("footer", { key: '9ad29d21e6d63d628474551a3000615690436937', class: "sd-popup__footer" }, h("div", { key: '039359244691aa35d0589f6d842398b88715fdd8', class: "sd-popup__footer-slot sd-popup__footer-slot--left" }, h("slot", { key: '0c29f4aba59e40b7435eb9693d2d47fa7d4ea7da', name: "footer-left" })), h("sd-button", { key: '5c79526dfdde154fb50deab79730376e17445831', ...submitButtonProps, class: "sd-popup__submit", onSdClick: () => this.submit.emit() })))));
+        return (h("div", { key: '5593e53ba5d8c098c3a3fea4a4ca20769457e322', class: `sd-popup sd-popup--${this.type}`, style: cssVars }, h("header", { key: 'e940d310e28c6b5ec34cc46b1a0aa3c8d7c37aed', class: "sd-popup__header" }, h("h2", { key: '367b21377987bb85ff453d05f314ac2cd76ac6be', class: "sd-popup__title" }, this.popupTitle)), h("div", { key: '58c31c4d783cf957a6e84bc17f63a2ccb188c1e0', class: "sd-popup__body" }, h("slot", { key: '712ccc5b1e2e3ba24757e8a0d258b8af40a1dcc8' })), this.useFooter && (h("footer", { key: 'ff34ebe19afaceb1594726296245ec2a12ce2eec', class: "sd-popup__footer" }, h("div", { key: 'cfefab877abd29701e17ed7381ace27db0198ab6', class: "sd-popup__footer-slot sd-popup__footer-slot--left" }, h("slot", { key: '2947626fed14fba3778ddede7e1c8a868b7aba4a', name: "footer-left" })), h("sd-button", { key: 'ed0b0d43812d5d2ca28993b0f8ff2363684a9016', ...submitButtonProps, class: "sd-popup__submit", onSdClick: () => this.submit.emit() })))));
     }
 };
 SdPopup.style = sdPopupCss();

package/dist/esm/sd-radio-button.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h } from './index-BZ5lcC25.js';
+import { r as registerInstance, c as createEvent, h } from './index-BwIs2-fm.js';
 
 const radioButton = {
 	xs: {

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h } from './index-BZ5lcC25.js';
+import { r as registerInstance, c as createEvent, h } from './index-BwIs2-fm.js';
 
 const radio = {
 	size: "16",

package/dist/esm/sd-select-list-item_2.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h } from './index-BZ5lcC25.js';
+import { r as registerInstance, c as createEvent, h } from './index-BwIs2-fm.js';
 import { g as LIST_ITEM_LAYOUT, i as isHtmlLabel, h as LIST_ITEM_TYPOGRAPHY, j as LIST_ITEM_COLORS, k as SEARCH_DEBOUNCE_MS } from './sd-select.config-D6ktrl7E.js';
 import { s as sanitizeInlineHtml } from './sanitize-inline-html-BE4tnQ2Z.js';
 import './component.listItem-U8VaRj9c.js';
@@ -86,7 +86,7 @@ const SdSelectListItem = class {
         return (
         // 키보드 네비게이션은 부모 listbox 의 ArrowUp/Down + Enter 가 담당. 항목 자체는 role=option, tabindex=-1 으로 표시.
         // eslint-disable-next-line jsx-a11y/click-events-have-key-events
-        h("div", { key: '42f9e69d39035fedce11095a2d5be95795831241', role: "option", tabindex: -1, "aria-selected": this.isSelected === true ? 'true' : 'false', class: {
+        h("div", { key: 'ffd420e1d1a6ff395ed3fff94cbaba66f71644ac', role: "option", tabindex: -1, "aria-selected": this.isSelected === true ? 'true' : 'false', class: {
                 'sd-select-list-item': true,
                 'sd-select-list-item--group': isGroup,
                 'sd-select-list-item--depth1-group': isDepth1Group,
@@ -96,7 +96,7 @@ const SdSelectListItem = class {
                 'sd-select-list-item--focused': this.isFocused,
                 'sd-select-list-item--selectable': this.isSelectable && !this.option.disabled,
                 'sd-select-list-item--disabled': !!this.option.disabled,
-            }, style: cssVars, onClick: this.handleClick }, this.useCheckbox && (h("sd-checkbox", { key: '655cf931840a15545c1afdd4aeb2044c7ae24c0a', value: this.isSelected === null ? null : !!this.isSelected, disabled: this.option.disabled, inverse: this.isFocused && this.isSelected !== false, class: "sd-select-list-item__checkbox", onClick: this.handleCheckboxClick, onSdUpdate: this.handleCheckboxUpdate })), isHtmlLabel(this.option.label) ? (h("span", { class: "sd-select-list-item__label", ref: el => el && (el.innerHTML = sanitizeInlineHtml(this.option.label)) })) : (h("span", { class: "sd-select-list-item__label" }, this.option.label)), this.countInfo && (h("span", { key: '5461f3861a093d25e866cd94e603a4b6017fd701', class: "sd-select-list-item__count" }, "(", this.countInfo.selected, "/", this.countInfo.total, ")"))));
+            }, style: cssVars, onClick: this.handleClick }, this.useCheckbox && (h("sd-checkbox", { key: '4bc492e2021f255cb87344bd0498023b50d89c8a', value: this.isSelected === null ? null : !!this.isSelected, disabled: this.option.disabled, inverse: this.isFocused && this.isSelected !== false, class: "sd-select-list-item__checkbox", onClick: this.handleCheckboxClick, onSdUpdate: this.handleCheckboxUpdate })), isHtmlLabel(this.option.label) ? (h("span", { class: "sd-select-list-item__label", ref: el => el && (el.innerHTML = sanitizeInlineHtml(this.option.label)) })) : (h("span", { class: "sd-select-list-item__label" }, this.option.label)), this.countInfo && (h("span", { key: '34a7671fa3f6ec1bff7c302f02bb4bfd7a113ce5', class: "sd-select-list-item__count" }, "(", this.countInfo.selected, "/", this.countInfo.total, ")"))));
     }
 };
 SdSelectListItem.style = sdSelectListItemCss();
@@ -153,15 +153,15 @@ const SdSelectListItemSearch = class {
             clearTimeout(this.debounceTimer);
     }
     render() {
-        return (h("div", { key: 'eeeabfcd97514124434c4c6c61d219d2230e7a1e', class: {
+        return (h("div", { key: 'e18205c606d8a47de3cd98be6ddad0c9a1ed4f5a', class: {
                 'sd-select-list-item-search': true,
                 'sd-select-list-item-search--scrolled': this.isScrolled,
-            } }, h("div", { key: 'a378a2745db91faf00a5fa00105fb152f8b6f59e', class: "sd-select-list-item-search__inner" }, h("sd-icon", { key: '08681aab44c7a30a5f4a36cdf7a8ec58fdbb6cf4', name: "search", size: 16, color: "grey_70", class: "sd-select-list-item-search__icon" }), h("input", { key: '0e75fdbfdab69b3f0bd9146d97915926200ba2c0', ref: el => {
+            } }, h("div", { key: '220a830db70628b4a240d19791db5090c6112cbf', class: "sd-select-list-item-search__inner" }, h("sd-icon", { key: 'f7680be3c49045f318887a2cd955e84ee4ea6646', name: "search", size: 16, color: "grey_70", class: "sd-select-list-item-search__icon" }), h("input", { key: '94face3b593e33db6230ede587de77e5cb158774', ref: el => {
                 this.inputEl = el;
-            }, type: "text", class: "sd-select-list-item-search__input", placeholder: "\uAC80\uC0C9\uC5B4 \uC785\uB825", value: this.searchText, onInput: this.handleInput, onFocus: () => this.searchFocus.emit() }), h("button", { key: 'a45bba91cce1700bab677e4528ab6df79e08547f', type: "button", class: {
+            }, type: "text", class: "sd-select-list-item-search__input", placeholder: "\uAC80\uC0C9\uC5B4 \uC785\uB825", value: this.searchText, onInput: this.handleInput, onFocus: () => this.searchFocus.emit() }), h("button", { key: '38f9de8c7ebf98aea2ef03ce9ddbb03cb9f29f81', type: "button", class: {
                 'sd-select-list-item-search__clear': true,
                 'sd-select-list-item-search__clear--hidden': this.searchText === '',
-            }, onClick: this.handleClear, tabindex: this.searchText !== '' ? 0 : -1, "aria-hidden": this.searchText !== '' ? 'false' : 'true' }, h("sd-icon", { key: 'e5c01644bf8b6651d6ec312b18f77d79cc61f455', name: "close", size: 12, color: "#888888" })))));
+            }, onClick: this.handleClear, tabindex: this.searchText !== '' ? 0 : -1, "aria-hidden": this.searchText !== '' ? 'false' : 'true' }, h("sd-icon", { key: 'fe32e9e44afbaa0f7ad07db665022839facbaf83', name: "close", size: 12, color: "#888888" })))));
     }
 };
 SdSelectListItemSearch.style = sdSelectListItemSearchCss();