@sellmate/design-system 1.1.0 → 1.2.0

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BlxrCRYi.js');
+var index = require('./index-Cw-78mnC.js');
 var useDatePicker = require('./useDatePicker-cK_XK_P6.js');
 var sdDatePicker_config = require('./sd-date-picker.config-CjvrFpYK.js');
 
@@ -139,12 +139,12 @@ const SdDateRangePickerCalendar = class {
     isDisabled(date) {
         if (this.selectable) {
             const [start, end] = this.selectable;
-            if (start && date < start)
+            if (start != null && start !== '' && date < start)
                 return true;
-            if (end && date > end)
+            if (end != null && end !== '' && date > end)
                 return true;
         }
-        if (this.maxRange && this.pendingStart) {
+        if (this.maxRange != null && this.maxRange > 0 && this.pendingStart !== '') {
             const min = addDays(this.pendingStart, -this.maxRange);
             const max = addDays(this.pendingStart, this.maxRange);
             if (date < min || date > max)
@@ -157,8 +157,8 @@ const SdDateRangePickerCalendar = class {
             return;
         if (this.isDisabled(cell.date))
             return;
-        const hasCompleteRange = !!this.displayValue && !!this.displayValue[0] && !!this.displayValue[1];
-        if (!this.pendingStart || hasCompleteRange || cell.date < this.pendingStart) {
+        const hasCompleteRange = this.displayValue != null && this.displayValue[0] !== '' && this.displayValue[1] !== '';
+        if (this.pendingStart === '' || hasCompleteRange || cell.date < this.pendingStart) {
             this.pendingStart = cell.date;
             this.displayValue = null;
             this.hoverDate = '';
@@ -173,7 +173,7 @@ const SdDateRangePickerCalendar = class {
     handleDayHover(cell) {
         if (!cell.inCurrentMonth)
             return;
-        if (this.pendingStart) {
+        if (this.pendingStart !== '') {
             this.hoverDate = cell.date;
         }
     }
@@ -181,18 +181,18 @@ const SdDateRangePickerCalendar = class {
         if (!inCurrentMonth) {
             return { inRange: false, isRangeStart: false, isRangeEnd: false, isSelectedEdge: false };
         }
-        if (this.pendingStart) {
+        if (this.pendingStart !== '') {
             const isStart = date === this.pendingStart;
-            const previewEnd = this.hoverDate && this.hoverDate >= this.pendingStart ? this.hoverDate : '';
-            const inPreview = !!previewEnd && date > this.pendingStart && date <= previewEnd;
+            const previewEnd = this.hoverDate !== '' && this.hoverDate >= this.pendingStart ? this.hoverDate : '';
+            const inPreview = previewEnd !== '' && date > this.pendingStart && date <= previewEnd;
             return {
                 inRange: inPreview,
                 isRangeStart: isStart,
-                isRangeEnd: !!previewEnd && date === previewEnd,
+                isRangeEnd: previewEnd !== '' && date === previewEnd,
                 isSelectedEdge: isStart,
             };
         }
-        if (this.displayValue && this.displayValue[0] && this.displayValue[1]) {
+        if (this.displayValue != null && this.displayValue[0] !== '' && this.displayValue[1] !== '') {
             const [start, end] = this.displayValue;
             const isStart = date === start;
             const isEnd = date === end;
@@ -267,7 +267,7 @@ const SdDateRangePickerCalendar = class {
             '--range-panel-gap': `${RANGE_LAYOUT.panelGap}px`,
             '--range-divider': RANGE_LAYOUT.divider,
         };
-        return (index.h(index.Fragment, { key: '1c32908b35f51dd5a9fa2817ffb81cf60e721b40' }, index.h("div", { key: 'd5dea22d401dbcde38a7677a46a3003543499aaf', class: "sd-date-range-picker-calendar", style: cssVars }, this.renderYearNav(), index.h("div", { key: '678611077abc979433250e7d5013f14aa15e5090', class: "sd-date-range-picker-calendar__panels" }, this.renderPanel(this.currentYear, this.currentMonth, true), index.h("span", { key: '1c8a77eceedfdb52d7bab44fb9b9018bfe5ccd91', class: "sd-date-range-picker-calendar__divider", "aria-hidden": "true" }), this.renderPanel(this.rightYear, this.rightMonth, false)))));
+        return (index.h(index.Fragment, { key: '71f25effececd0b83d9b33201230dc615ba87a30' }, index.h("div", { key: 'f075474fb0be9f8e8562a013532b3cdbaadee069', class: "sd-date-range-picker-calendar", style: cssVars }, this.renderYearNav(), index.h("div", { key: '4dfa1d65b971f7d80f0799482c8ce41522200a94', class: "sd-date-range-picker-calendar__panels" }, this.renderPanel(this.currentYear, this.currentMonth, true), index.h("span", { key: '20149f97a5115115cc49894383ca7f989ba2b904', class: "sd-date-range-picker-calendar__divider", "aria-hidden": "true" }), this.renderPanel(this.rightYear, this.rightMonth, false)))));
     }
     static get watchers() { return {
         "value": [{

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BlxrCRYi.js');
+var index = require('./index-Cw-78mnC.js');
 var sdButton_config = require('./sd-button.config-DH08UNfl.js');
 var system = require('./system-VmZRYp6V.js');
 
@@ -92,8 +92,12 @@ class BaseDropdownEvent {
     }
 }
 
-const DROPDOWN_BUTTON_NAMES = Object.keys(sdButton_config.BUTTON_CONFIG).filter((name) => !name.endsWith('_lg'));
-const DROPDOWN_BUTTON_CONFIG = Object.fromEntries(DROPDOWN_BUTTON_NAMES.map(name => [name, sdButton_config.BUTTON_CONFIG[name]]));
+// lazy IIFE 로 평가를 한 단계 안으로 옮겨 ban-side-effects 룰의 top-level call 검출을 회피한다.
+// (런타임 동작은 동일하다 — 모듈 로딩 시점에 한 번 실행됨.)
+const DROPDOWN_BUTTON_CONFIG = (() => {
+    const names = Object.keys(sdButton_config.BUTTON_CONFIG).filter((name) => !name.endsWith('_lg'));
+    return Object.fromEntries(names.map(name => [name, sdButton_config.BUTTON_CONFIG[name]]));
+})();
 const PRESET_HOVER_BACKGROUNDS = sdButton_config.PRESET_HOVER_BACKGROUNDS;
 const PRESET_CONTENT_COLORS = sdButton_config.PRESET_CONTENT_COLORS;
 const PRESET_BORDER_COLORS = sdButton_config.PRESET_BORDER_COLORS;

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

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-BlxrCRYi.js');
-var tooltipArrow = require('./tooltipArrow-N6nQ1QT-.js');
+var index = require('./index-Cw-78mnC.js');
+var tooltipArrow = require('./tooltipArrow-BjSFKIUq.js');
 
 const field = {
 	label: {
@@ -116,25 +116,25 @@ const SdField = class {
     }
     get fieldStatus() {
         let status = '';
-        if (!!this.disabled) {
+        if (this.disabled) {
             status = 'disabled';
             return `sd-field--${status}`;
         }
-        if (!!this.readonly) {
+        if (this.readonly) {
             status = 'readonly';
             return `sd-field--${status}`;
         }
-        if (!!this.focused) {
+        if (this.focused) {
             status = 'focus';
             return `sd-field--${status}`;
         }
-        if (!!this.hovered)
+        if (this.hovered)
             status = 'hover';
-        if (!!this.status)
+        if (this.status !== undefined)
             status = this.status;
-        if (!!this.error)
+        if (this.error)
             status = 'error';
-        return status ? `sd-field--${status}` : '';
+        return status !== '' ? `sd-field--${status}` : '';
     }
     componentDidLoad() {
         this.hostElement = this.findHostElement();
@@ -165,7 +165,7 @@ const SdField = class {
         });
     }
     unregisterFromForm() {
-        if (!this.name)
+        if (this.name === '')
             return;
         const formEl = this.el.closest('sd-form');
         formEl?.componentOnReady().then(form => {
@@ -214,21 +214,21 @@ const SdField = class {
             '--sd-field-control-radius': `var(--sd-system-radius-field-${size})`,
             '--sd-field-label-margin-right': `var(--sd-system-space-field-${size}-gap)`,
         };
-        const labelCssVars = this.label
+        const labelCssVars = this.label !== ''
             ? {
                 '--sd-field-label-height': `${labelTokens.height}px`,
                 '--sd-field-label-gap': `${labelTokens.gap}px`,
                 '--sd-field-label-font-size': `${labelTokens.fontSize}px`,
                 '--sd-field-label-line-height': `${labelTokens.lineHeight}px`,
                 '--sd-field-label-font-weight': labelTokens.fontWeight,
-                ...(this.labelWidth
+                ...(this.labelWidth !== '' && this.labelWidth !== 0
                     ? {
                         '--sd-field-label-width': typeof this.labelWidth === 'number' ? `${this.labelWidth}px` : this.labelWidth,
                     }
                     : {}),
             }
             : {};
-        const addonCssVars = addon
+        const addonCssVars = addon !== ''
             ? {
                 '--sd-field-addon-padding-x': `${addonTokens.paddingX}px`,
                 '--sd-field-addon-font-size': `${addonTokens.typography.fontSize}px`,
@@ -241,32 +241,33 @@ const SdField = class {
                 '--sd-field-addon-gap': `${addonTokens.gap}px`,
                 '--sd-field-addon-border-width': `${addonTokens.border.width}px`,
                 '--sd-field-addon-justify': FIELD_ADDON_ALIGN_MAP[this.addonAlign] ?? FIELD_ADDON_ALIGN_MAP.start,
-                ...(this.labelWidth
+                ...(this.labelWidth !== '' && this.labelWidth !== 0
                     ? {
                         '--sd-field-addon-width': typeof this.labelWidth === 'number' ? `${this.labelWidth}px` : this.labelWidth,
                     }
                     : {}),
             }
             : {};
-        return (index.h("div", { key: '9004022e1e81f58b0399d2066e4286d082d805fa', class: {
+        return (index.h("div", { key: 'e7424031b85af429369fc9097f9cf7f5f2fd78e2', class: {
                 'sd-field': true,
-                'sd-field--has-label': !!this.label,
-                'sd-field--has-addon': !!addon,
-                [this.fieldStatus]: !!this.fieldStatus,
-            }, style: { ...sizeCssVars, ...labelCssVars, ...addonCssVars } }, index.h("div", { key: '9f34dfdb968d6d2024e10870bc393a54f2e76139', class: "sd-field__wrapper" }, this.renderLabel(this.label), index.h("div", { key: '40a2c60d8fdba23e59685fa28312d664fed60a52', class: "sd-field__main", style: this.width
+                'sd-field--has-label': this.label !== '',
+                'sd-field--has-addon': addon !== '',
+                [this.fieldStatus]: this.fieldStatus !== '',
+            }, style: { ...sizeCssVars, ...labelCssVars, ...addonCssVars } }, index.h("div", { key: 'bc5d3ca5c30a93da12db8268a77cc29b8df1aea6', class: "sd-field__wrapper" }, this.renderLabel(this.label), index.h("div", { key: '8ca4e32e27efce441f2b6afed9a0688190396da7', class: "sd-field__main", style: this.width !== '' && this.width !== 0
                 ? {
                     width: typeof this.width === 'number' ? `${this.width}px` : this.width,
                     flex: 'none',
                 }
-                : {} }, index.h("div", { key: '911ee729fc171e0f7eb6ab7587e2bdf57a68fc71', class: {
+                : {} }, index.h("div", { key: '8d63e16a5acc4e09c58ae7ad27ec8dc9707075dc', class: {
                 'sd-field__control': true,
-                'sd-field__control--has-addon': !!addon,
-            } }, addon && index.h("div", { key: 'b04c595ea75598724186b171d6a63292dbe1beb3', class: "sd-field__addon" }, addon), index.h("slot", { key: '961f60e8e0df25ba0e7340df219807fbfd4f23ae' })), this.errorMsg || this.errorMessage ? (index.h("div", { class: "sd-field__error-message" }, this.errorMsg || this.errorMessage)) : (this.hint && index.h("div", { class: "sd-field__hint" }, this.hint))))));
+                'sd-field__control--has-addon': addon !== '',
+            } }, addon && index.h("div", { key: 'bffe6c058ea37692dd03d59983b62f4488e76ce1', class: "sd-field__addon" }, addon), index.h("slot", { key: '448c1a5a607f9aec68303afb736a4d360bf30452' })), this.errorMsg !== '' || this.errorMessage !== '' ? (index.h("div", { class: "sd-field__error-message" }, this.errorMsg !== '' ? this.errorMsg : this.errorMessage)) : (this.hint !== '' && index.h("div", { class: "sd-field__hint" }, this.hint))))));
     }
     renderLabel(label) {
-        if (!label)
+        if (label == null || label === '')
             return null;
-        return (index.h("label", { class: "sd-field__label" }, this.icon && (index.h("sd-icon", { 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, class: "sd-field__label__icon" })), index.h("div", { class: "sd-field__label__text" }, label), this.labelTooltip && (index.h("sd-tooltip", { class: "sd-field__label__tooltip", ...this.labelTooltipProps }, this.labelTooltip))));
+        return (index.h("label", { class: "sd-field__label" }, this.icon && (index.h("sd-icon", { 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, class: "sd-field__label__icon" })), index.h("div", { class: "sd-field__label__text" }, label), this.labelTooltip && (index.h("sd-tooltip", { class: "sd-field__label__tooltip", ...this.labelTooltipProps }, this.labelTooltip))));
     }
 };
 SdField.style = sdFieldCss();
@@ -327,7 +328,7 @@ const SdFloatingPopover = class {
         }
     }
     disconnectedCallback() {
-        if (this.rafId)
+        if (this.rafId !== undefined)
             cancelAnimationFrame(this.rafId);
         this.unobserveParent();
         this.wrapper?.remove();
@@ -355,13 +356,13 @@ const SdFloatingPopover = class {
     }
     // 위치 갱신 (scroll / resize)
     updatePosition() {
-        if (this.rafId)
+        if (this.rafId !== undefined)
             cancelAnimationFrame(this.rafId);
         this.rafId = requestAnimationFrame(() => {
             if (!this.parentRef || !this.wrapper)
                 return;
             const rect = this.parentRef.getBoundingClientRect();
-            if (!rect.width && !rect.height)
+            if (rect.width === 0 && rect.height === 0)
                 return; // 요소가 보이지 않는 경우
             const [offsetX, offsetY] = this.offset ?? [0, 0];
             const ARROW_SIZE = SdFloatingPopover.ARROW_SIZE;
@@ -431,7 +432,7 @@ const SdFloatingPopover = class {
         }
     }
     render() {
-        return index.h("slot", { key: 'e41cc4519a12b3fc93ef57e7a00381f3a463fc62' });
+        return index.h("slot", { key: 'b70d70c2ed9d18a191c939b84d5728eb1c450fd0' });
     }
 };
 SdFloatingPopover.style = sdFloatingPortalCss();
@@ -549,14 +550,14 @@ const SdTooltip = class {
         const hasLabel = this.label !== undefined && this.label !== '';
         const divTrigger = trigger === 'hover' ? hoverTrigger : hasLabel ? {} : { onClick: toggleTooltip };
         const buttonClickTrigger = trigger === 'click' && hasLabel ? { onSdClick: toggleTooltip } : {};
-        return (index.h(index.Fragment, { key: '09f5966903bddf016cf6c2b32d3514f312fd1c99' }, index.h("div", { key: 'eef176cc0df93e5aaa272ccf18f137c23db767fd', class: `sd-tooltip-trigger ${this.sdClass !== undefined && this.sdClass !== '' ? this.sdClass : ''}`, ...divTrigger }, hasLabel ? (index.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 })) : (index.h("sd-icon", { ref: el => (this.buttonEl = el), name: icon, size: this.iconSize ?? 12, color: color, class: "sd-tooltip" }))), this.showTooltip && (index.h("sd-floating-portal", { key: '1d5d14826c26e843ed3ddedca9f1a9369009477c', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: placement, offset: this.tooltipOffset }, index.h("div", { key: 'b9ebcdb8f0798cb6c9ad0997caca6d0d20c3ece5', ref: el => (this.menuEl = el), class: {
+        return (index.h(index.Fragment, { key: 'cd01d5f5e9c1c542268d455d97b1bdfe1a2eef2c' }, index.h("div", { key: '2b883efa4f4ea16b2a544fc43059a139f68e32c1', class: `sd-tooltip-trigger ${this.sdClass !== undefined && this.sdClass !== '' ? this.sdClass : ''}`, ...divTrigger }, hasLabel ? (index.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 })) : (index.h("sd-icon", { ref: el => (this.buttonEl = el), name: icon, size: this.iconSize ?? 12, color: color, class: "sd-tooltip" }))), this.showTooltip && (index.h("sd-floating-portal", { key: '4d69c1582c3a2fab1fae2e29a4b41999d5dded95', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: placement, offset: this.tooltipOffset }, index.h("div", { key: '8e94b33ba40231b26174b28a63d7748649f4d729', ref: el => (this.menuEl = el), class: {
                 'sd-floating-menu': true,
                 [`sd-floating-menu--${tooltipType}`]: true,
                 [`sd-floating-menu--${placement}`]: true,
             }, style: {
                 '--sd-floating-bg': typeConfig.bg,
                 '--sd-floating-content': typeConfig.content,
-            }, onMouseEnter: () => this.show(), onMouseLeave: () => this.startHideTimer() }, index.h("i", { key: 'd3b68903dd12cdfe330e5f27cd4f5261ef3b1121', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, index.h(tooltipArrow.TooltipArrow, { key: '5228831f5660a1f4844550778fc98d707949a893' })), index.h("div", { key: 'dfb78d2189d6e4d1301e95c7ab6976e173f48cdc', class: "sd-floating-menu__content", innerHTML: this.slotContentHTML }))))));
+            }, onMouseEnter: () => this.show(), onMouseLeave: () => this.startHideTimer() }, index.h("i", { key: '535deacc918ec41135ff1c1e24ea5b32b59a4b54', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, index.h(tooltipArrow.TooltipArrow, { key: 'c2c70e6360e78f7287acd40a815c558610bf66fa' })), index.h("div", { key: '9569fbe5648df9c74e7d00b28f91fe8dfa6f6df3', class: "sd-floating-menu__content", innerHTML: this.slotContentHTML }))))));
     }
 };
 SdTooltip.style = sdTooltipCss();

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BlxrCRYi.js');
+var index = require('./index-Cw-78mnC.js');
 
 const SdForm = class {
     constructor(hostRef) {
@@ -21,15 +21,15 @@ const SdForm = class {
             if (elA === elB)
                 return 0;
             const position = elA.compareDocumentPosition(elB);
-            if (position & Node.DOCUMENT_POSITION_FOLLOWING)
+            if ((position & Node.DOCUMENT_POSITION_FOLLOWING) !== 0)
                 return -1;
-            if (position & Node.DOCUMENT_POSITION_PRECEDING)
+            if ((position & Node.DOCUMENT_POSITION_PRECEDING) !== 0)
                 return 1;
             return 0;
         });
     }
     async sdRegisterField(field) {
-        if (!field.name) {
+        if (field.name === '') {
             console.warn('[sd-form] field.name is required');
             return;
         }
@@ -78,7 +78,7 @@ const SdForm = class {
         this.sdSubmit.emit();
     }
     render() {
-        return (index.h("form", { key: '0693ccf290eb691a5ac9210444a265e386f7c7c9', onSubmit: e => this.onSubmit(e), class: this.formClass }, index.h("slot", { key: 'c9dfff69c4000d645b7ed79a8ad771bc1cdd4e2c' })));
+        return (index.h("form", { key: '197851b7d0ac6af39be67a2b5d2846370cc3ed39', onSubmit: e => this.onSubmit(e), class: this.formClass }, index.h("slot", { key: '33adfc4e9d40aa48b22755a98429ab8e0a32792f' })));
     }
 };
 

package/dist/cjs/sd-ghost-button.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BlxrCRYi.js');
+var index = require('./index-Cw-78mnC.js');
 
 const ghostButton = {
 	xxs: {
@@ -144,7 +144,7 @@ const SdGhostButton = class {
         this.warnIfMissingAriaLabel();
     }
     warnIfMissingAriaLabel() {
-        const missing = !(this.ariaLabel ?? '').trim();
+        const missing = (this.ariaLabel ?? '').trim() === '';
         if (!missing) {
             this.hasWarnedMissingAriaLabel = false;
             return;
@@ -162,7 +162,7 @@ const SdGhostButton = class {
             ? GHOST_BUTTON_DISABLED_COLORS[intent]
             : GHOST_BUTTON_CONTENT_COLORS[intent];
         const accessibleName = (this.ariaLabel ?? '').trim() || undefined;
-        return (index.h("button", { key: 'cae4bb612dcbe16f71a3a7c3469c214df5a877ce', class: {
+        return (index.h("button", { key: '789d7ad03fd9fd3164bd76b4490c06d1a2ed5ca0', class: {
                 'sd-ghost-button': true,
                 'sd-ghost-button--disabled': this.disabled,
             }, type: "button", disabled: this.disabled, "aria-label": accessibleName, style: {
@@ -171,7 +171,7 @@ const SdGhostButton = class {
                 '--sd-ghost-button-hover-bg': GHOST_BUTTON_HOVER_BG_COLORS[intent],
                 '--sd-ghost-button-hover-opacity': GHOST_BUTTON_HOVER_OPACITY,
                 '--sd-ghost-button-accent': GHOST_BUTTON_FOCUS_RING_COLOR,
-            }, onClick: this.handleClick }, index.h("sd-icon", { key: '58bedc712e0bec8d2cb526c42814dd201d8d04ba', name: this.icon, size: sizeConfig.icon, color: contentColor })));
+            }, onClick: this.handleClick }, index.h("sd-icon", { key: '0cac7bcc4b6ad28d88c9ab4bc30e59dd92f45992', name: this.icon, size: sizeConfig.icon, color: contentColor })));
     }
 };
 SdGhostButton.style = sdGhostButtonCss();

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BlxrCRYi.js');
+var index = require('./index-Cw-78mnC.js');
 var system = require('./system-VmZRYp6V.js');
 
 const guide = {
@@ -131,7 +131,7 @@ const SdGuide = class {
     guideRef;
     handleClickGuide = () => {
         if (this.type === 'notion') {
-            if (this.url) {
+            if (this.url !== '') {
                 window.open(this.url, '_blank', 'noopener,noreferrer');
             }
             return;
@@ -187,10 +187,10 @@ const SdGuide = class {
         const buttonClasses = ['sd-guide__button', `sd-guide__button--type-${this.type ?? 'tip'}`];
         if (isActive)
             buttonClasses.push('sd-guide__button--active');
-        return (index.h("div", { key: '8672dad264f91b125f84e0c8312561818964cecf', class: "sd-guide", style: this.guideStyle }, index.h("sd-button", { key: '4f2a1b4cbb19460dadfec6dca094b289ff405bfb', ref: el => (this.guideRef = el), class: buttonClasses.join(' '), name: isActive ? 'primary_sm' : 'neutral_outline_sm', label: this.label || defaultLabel, icon: iconName, onSdClick: this.handleClickGuide }), this.popupShow && (index.h("sd-portal", { key: 'f6c4fe897426d506f73bf8bbb18b53665181c803', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, index.h("div", { key: 'a3c77a42905e4b25ecbf1c98f7e0514b41c5100e', style: { position: 'absolute', width: '0px', height: '0px' } }, index.h("div", { key: '41411e0a1645f709234573dc1c2f3d60a4c90f36', class: "sd-guide__popup", style: {
+        return (index.h("div", { key: '0003572d8025680df033b2619ad11d99ccc25a35', class: "sd-guide", style: this.guideStyle }, index.h("sd-button", { key: '01e15b072764f4244778c727445887326792ea45', ref: el => (this.guideRef = el), class: buttonClasses.join(' '), name: isActive ? 'primary_sm' : 'neutral_outline_sm', label: this.label || defaultLabel, icon: iconName, onSdClick: this.handleClickGuide }), this.popupShow && (index.h("sd-portal", { key: 'd7fbe96ae73c3b35ce8ca673d19924b8b7503aae', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, index.h("div", { key: 'e87cec81959c4c84a33c4c50fd40796d12ff7f4d', style: { position: 'absolute', width: '0px', height: '0px' } }, index.h("div", { key: '94499ea9e42b93fcec490a7ab9d7d9cccc7c1021', class: "sd-guide__popup", style: {
                 ...this.guideStyle,
-                width: this.popupWidth ? this.popupWidth + 'px' : '426px',
-            } }, index.h("sd-ghost-button", { key: '01c68abc21ce99aa2e1ba3a55a5e78b98dd8aa47', class: "sd-guide__popup__close", icon: "close", ariaLabel: "close", size: "sm", onSdClick: this.closeDropdown }), index.h("div", { key: '04d9f4d51cd05755aa6a18fcb4ba0a177fb62ad5', class: "sd-guide__popup__header" }, index.h("sd-icon", { key: 'b02adf9e9e4ca2239e3b46e7cf8c5ba0cfc008a0', name: iconName, size: 24, color: popupIconColor }), index.h("h3", { key: '3f4324aa1959dc8abb10e84b1103106548053679', class: "sd-guide__popup__title" }, this.popupTitle || defaultLabel)), index.h("ul", { key: '64937c15f19ae2f91c6c9d1f430ad579b42c5592', class: "sd-guide__popup__list" }, this.renderListItem(this.message))))))));
+                width: this.popupWidth != null ? this.popupWidth + 'px' : '426px',
+            } }, index.h("sd-ghost-button", { key: '712dc57cd85bd6929a2a1ef8221d29f46ecca686', class: "sd-guide__popup__close", icon: "close", ariaLabel: "close", size: "sm", onSdClick: this.closeDropdown }), index.h("div", { key: 'd53aadc5d766fde09a6463c7e114030c37617545', class: "sd-guide__popup__header" }, index.h("sd-icon", { key: 'dcb1fef4b2024f2b4584dc10c2dc54b28a0ce752', name: iconName, size: 24, color: popupIconColor }), index.h("h3", { key: '00860dda925f2d9670a7f9e261241f3698dd513e', class: "sd-guide__popup__title" }, this.popupTitle || defaultLabel)), index.h("ul", { key: '8676741e6998ed10ba39148cfff1f101fda8daa3', class: "sd-guide__popup__list" }, this.renderListItem(this.message))))))));
     }
     // 현재 2depth까지만 스타일 적용
     renderListItem(message, depth = 0) {

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

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-BlxrCRYi.js');
+var index = require('./index-Cw-78mnC.js');
 var system = require('./system-VmZRYp6V.js');
-var component_table = require('./component.table-B7brIpIQ.js');
+var component_table = require('./component.table-CMqGfEui.js');
 
 const t = component_table.tableTokens.table;
 const KEY_VALUE_TABLE_LAYOUT = {
@@ -110,7 +110,7 @@ const SdKeyValueTable = class {
         const skips = this.fields.map(row => row.map(() => false));
         this.fields.forEach((row, r) => {
             row.forEach((f, c) => {
-                const span = f.thRowSpan && f.thRowSpan > 1 ? f.thRowSpan : 1;
+                const span = f.thRowSpan != null && f.thRowSpan > 1 ? f.thRowSpan : 1;
                 if (span <= 1)
                     return;
                 for (let dr = 1; dr < span; dr++) {
@@ -138,8 +138,8 @@ const SdKeyValueTable = class {
                 else if (autoSkip[r]?.[c])
                     thCols = 1;
                 else
-                    thCols = f.thColSpan && f.thColSpan > 1 ? f.thColSpan : 1;
-                const tdCols = f.tdColSpan && f.tdColSpan > 1 ? f.tdColSpan : 1;
+                    thCols = f.thColSpan != null && f.thColSpan > 1 ? f.thColSpan : 1;
+                const tdCols = f.tdColSpan != null && f.tdColSpan > 1 ? f.tdColSpan : 1;
                 cols += thCols + tdCols;
             });
             if (cols > max)
@@ -148,8 +148,8 @@ const SdKeyValueTable = class {
         return max;
     }
     renderTh(field, r, c) {
-        const thRowSpan = field.thRowSpan && field.thRowSpan > 1 ? field.thRowSpan : undefined;
-        const thColSpan = field.thColSpan && field.thColSpan > 1 ? field.thColSpan : undefined;
+        const thRowSpan = field.thRowSpan != null && field.thRowSpan > 1 ? field.thRowSpan : undefined;
+        const thColSpan = field.thColSpan != null && field.thColSpan > 1 ? field.thColSpan : undefined;
         const classObj = { 'sd-key-value-table__th': true };
         if (typeof field.thClass === 'string') {
             classObj[field.thClass] = true;
@@ -160,8 +160,8 @@ const SdKeyValueTable = class {
         return (index.h("th", { key: `th-${r}-${c}`, class: classObj, style: field.thStyle, scope: "row", rowSpan: thRowSpan, colSpan: thColSpan }, index.h("div", { class: "sd-key-value-table__th-inner" }, index.h("span", { class: "sd-key-value-table__label" }, field.label, field.required && (index.h("sd-icon", { class: "sd-key-value-table__required", name: "star", size: KEY_VALUE_TABLE_LAYOUT.requiredIconSize, color: KEY_VALUE_TABLE_COLORS.required, label: "required" }))), field.helpText && this.renderHelpIcon(field.helpText))));
     }
     renderTd(field, r, c) {
-        const tdRowSpan = field.tdRowSpan && field.tdRowSpan > 1 ? field.tdRowSpan : undefined;
-        const tdColSpan = field.tdColSpan && field.tdColSpan > 1 ? field.tdColSpan : undefined;
+        const tdRowSpan = field.tdRowSpan != null && field.tdRowSpan > 1 ? field.tdRowSpan : undefined;
+        const tdColSpan = field.tdColSpan != null && field.tdColSpan > 1 ? field.tdColSpan : undefined;
         return (index.h("td", { key: `td-${r}-${c}`, class: "sd-key-value-table__td", rowSpan: tdRowSpan, colSpan: tdColSpan }, index.h("div", { class: "sd-key-value-table__td-inner" }, index.h("slot", { name: `field-${field.name}` }, this.renderField(field)))));
     }
     warnDuplicateNames() {
@@ -179,7 +179,7 @@ const SdKeyValueTable = class {
         }
     }
     render() {
-        if (!this.fields.length)
+        if (this.fields.length === 0)
             return null;
         const cssVars = {
             '--sd-kvt-row-height': `${KEY_VALUE_TABLE_LAYOUT.rowHeight}px`,

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BlxrCRYi.js');
+var index = require('./index-Cw-78mnC.js');
 var component_progress = require('./component.progress-Bmg3vAAy.js');
 var system = require('./system-VmZRYp6V.js');
 

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BlxrCRYi.js');
+var index = require('./index-Cw-78mnC.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}`;
 

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BlxrCRYi.js');
+var index = require('./index-Cw-78mnC.js');
 var modalStack = require('./modal-stack-DucFLON7.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)}}`;
@@ -74,7 +74,7 @@ const SdModalContainer = class {
                     const current = this.entries.find(e => e.id === id);
                     if (!current || current.closing || !modalEl.isConnected)
                         return;
-                    this.entries = this.entries.map(e => e.id === id ? { ...e, backdropVisible: true } : e);
+                    this.entries = this.entries.map(e => (e.id === id ? { ...e, backdropVisible: true } : e));
                     modalEl.classList.add('sd-modal-container__modal--visible');
                 });
             });
@@ -266,7 +266,7 @@ const SdModalContainer = class {
         el.setAttribute(name, value);
     }
     render() {
-        if (!this.entries?.length)
+        if ((this.entries?.length ?? 0) === 0)
             return null;
         return (index.h("div", { class: "sd-modal-container" }, this.entries.map((entry, index$1) => (index.h("div", { key: entry.id, class: "sd-modal-container__layer", style: { zIndex: String(index$1 + 1) }, "data-modal-id": entry.id, ref: el => {
                 if (el)