@sellmate/design-system 1.1.0 → 1.3.0

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

@@ -1,7 +1,8 @@
-import { r as registerInstance, c as createEvent, a as getElement, h } from './index-CLCoul8o.js';
+import { r as registerInstance, c as createEvent, a as getElement, h } from './index-0U6dRjlq.js';
 import { n as nanoid } from './index-CCwNgVmC.js';
-import { D as DATEPICKER_COLORS, a as DATEPICKER_SIZE_MAP } from './sd-date-picker.config-B6cqMQaM.js';
+import { D as DATEPICKER_COLORS, a as DATEPICKER_SIZE_MAP } from './sd-date-picker.config-CGEE3DkI.js';
 import { i as inputTokens } from './component.textinput-ByhWX2NK.js';
+import './component.datepicker-BQn6le_Y.js';
 
 const sdDatePickerCss = () => `sd-date-picker{display:inline-flex}sd-date-picker sd-portal{display:none}sd-date-picker .sd-date-picker{position:relative;width:100%;height:100%}`;
 
@@ -78,6 +79,7 @@ const SdDatePicker = class {
         }
     };
     handleSelect = (e) => {
+        e.stopPropagation();
         this.closeDropdown();
         this.value = e.detail;
         const nextValue = this.value;
@@ -101,9 +103,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: '7678d58f741276e9848e05759f5c41f576e7fe66', 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: '8b3d615b241860ec1fb314fa0eeef5f51ea32f43', class: "sd-date-picker", ref: el => {
+        return (h("sd-field", { key: '825c845ea1ada63a9f21cfc43aad04a598325c13', 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: 'b9dd1a8df29f340ad67331dbebd3ec71b79d128a', class: "sd-date-picker", ref: el => {
                 this.triggerRef = el;
-            } }, h("sd-date-picker-trigger", { key: '43185c67462cf0cb559c918e5f709723bf4d5aee', displayText: this.value ?? '', placeholder: this.placeholder, disabled: this.disabled, size: this.size, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (h("sd-portal", { key: '2cf151b52b3117de9c4d55bbc3c045b0a7b614e9', open: this.isOpen, parentRef: this.triggerRef, onSdClose: () => this.closeDropdown() }, h("sd-date-picker-calendar", { key: '9f77742d034dcb462eb1c4546b2c2a367544f97e', value: this.value, selectable: this.selectable, onSdSelect: this.handleSelect, onSdViewChange: this.handleViewChange })))));
+            } }, h("sd-date-picker-trigger", { key: 'b9bed57fa4a2b06b004ec5a1b723ed5af25fda19', displayText: this.value ?? '', placeholder: this.placeholder, disabled: this.disabled, size: this.size, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (h("sd-portal", { key: '776e0ce183edd9c7903ce1a75208addc47c20408', open: this.isOpen, parentRef: this.triggerRef, onSdClose: () => this.closeDropdown() }, h("sd-calendar", { key: 'f86b502f6b17ee9ff262c1a64e1b0e24defc1660', value: this.value, selectable: this.selectable, onSdUpdate: this.handleSelect, onSdViewChange: this.handleViewChange })))));
     }
     static get watchers() { return {
         "isOpen": [{
@@ -200,7 +202,7 @@ const SdDateRangePicker = class {
         this.viewChange.emit(e.detail);
     };
     get displayText() {
-        if (!this.value || !this.value[0] || !this.value[1])
+        if (this.value == null || this.value[0] === '' || this.value[1] === '')
             return '';
         return `${this.value[0]} ~ ${this.value[1]}`;
     }
@@ -217,9 +219,9 @@ const SdDateRangePicker = 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: 'e44e9a2cf5c610c20c419215bd3b14494cea2980', 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: '29951ae2a98d2a44c2b01a735291dd2ec6d7e5a2', class: "sd-date-range-picker", ref: el => {
+        return (h("sd-field", { key: '89eaeb8978796508650aec5f3ccdeb7df16fb6f4', 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: 'f3ce583e53edbc451ab6c0592c0ab2ed87e07a06', class: "sd-date-range-picker", ref: el => {
                 this.triggerRef = el;
-            } }, h("sd-date-picker-trigger", { key: '37d379cf054838e5005b00812401a8d7c6d4daa9', displayText: this.displayText, placeholder: this.placeholder, disabled: this.disabled, size: this.size, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (h("sd-portal", { key: '1fbc3c2a16c845486e942b0a71ff799a9d1a98c6', open: this.isOpen, parentRef: this.triggerRef, onSdClose: () => this.closeDropdown() }, h("sd-date-range-picker-calendar", { key: '6e53bfaa550c93e6b2c08a2311bc415f359bc2da', value: this.value, selectable: this.selectable, maxRange: this.maxRange, onSdSelect: this.handleSelect, onSdViewChange: this.handleViewChange })))));
+            } }, h("sd-date-picker-trigger", { key: '53086fd3d15dc2c05364a66fdf767e09c6c19fac', displayText: this.displayText, placeholder: this.placeholder, disabled: this.disabled, size: this.size, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (h("sd-portal", { key: '5ee1499ee9a224a9c653095e9914ed20cbaca2a1', open: this.isOpen, parentRef: this.triggerRef, onSdClose: () => this.closeDropdown() }, h("sd-date-range-picker-calendar", { key: '7c7479dacf57c996a708435857d2b5f7900509fd', value: this.value, selectable: this.selectable, maxRange: this.maxRange, onSdSelect: this.handleSelect, onSdViewChange: this.handleViewChange })))));
     }
     static get watchers() { return {
         "isOpen": [{
@@ -372,7 +374,7 @@ const SdFilePicker = class {
         }
         const fileArray = Array.from(files);
         const { accepted, rejected, reason } = this.validateFiles(fileArray);
-        if (reason) {
+        if (reason != null) {
             this.reject?.emit({ files: rejected, reason });
             if (this.fileInputRef) {
                 this.fileInputRef.value = '';
@@ -446,7 +448,12 @@ const SdFilePicker = class {
             '--sd-system-size-field-sm-height': `${FILE_PICKER_LAYOUT.height}px`,
             '--sd-system-radius-field-sm': `${FILE_PICKER_LAYOUT.radius}px`,
         };
-        const content = (h("div", { class: "sd-file-picker__content", onClick: this.handleClick }, h("input", { ref: el => (this.fileInputRef = el), type: "file", class: "sd-file-picker__input", disabled: this.disabled, multiple: this.multiple, accept: this.accept, onInput: this.handleFileChange, "aria-label": this.placeholder ?? 'Click to upload' }), h("sd-icon", { name: "attachFile", size: Number(FILE_PICKER_LAYOUT.iconSize), color: this.getIconColor(), class: "sd-file-picker__icon" }), h("div", { ref: el => (this.fileNamesRef = el), class: {
+        const content = (h("div", { role: "button", tabindex: this.disabled ? -1 : 0, class: "sd-file-picker__content", onClick: this.handleClick, onKeyDown: e => {
+                if (e.key === 'Enter' || e.key === ' ') {
+                    e.preventDefault();
+                    this.handleClick();
+                }
+            } }, h("input", { ref: el => (this.fileInputRef = el), type: "file", class: "sd-file-picker__input", disabled: this.disabled, multiple: this.multiple, accept: this.accept, onInput: this.handleFileChange, "aria-label": this.placeholder ?? 'Click to upload' }), h("sd-icon", { name: "attachFile", size: Number(FILE_PICKER_LAYOUT.iconSize), color: this.getIconColor(), class: "sd-file-picker__icon" }), h("div", { ref: el => (this.fileNamesRef = el), class: {
                 'sd-file-picker__text': true,
                 'sd-file-picker__text--placeholder': !hasFiles,
                 'sd-file-picker__text--active': hasFiles,
@@ -570,7 +577,7 @@ const SdInput = class {
         this.formField?.sdFocus();
     }
     componentWillLoad() {
-        if (this.value) {
+        if (this.value != null && this.value !== '') {
             this.internalValue = this.value;
         }
     }
@@ -613,12 +620,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: 'a94dfffaad91682d63a4c0f8e2428aee0f2dc909', 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: '44a55878936edbe36726b0cd607b607ee2921155', class: "sd-input__content" }, h("slot", { key: 'c3566240fc270059c4a7b4ccd7907a27141fd57e', name: "prefix" }), h("input", { key: '0df6f4eea75f1d5c0ed174902eb2c072dc81c23f', 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: '685051959a063e6c2465a01aaa77b0f84c4bb570', name: "suffix" }), this.clearable && this.internalValue && !this.disabled && !this.readonly && (h("sd-ghost-button", { key: '382c86fe50a702b84a7dbc82b2e19d9e534af36a', icon: "close", ariaLabel: "clear", size: "xxs", disabled: this.disabled, class: "sd-input__clear-icon", onClick: async () => {
+        return (h("sd-field", { key: 'c24b885ef9ca21fb69c1b67f2619896d4bd56155', 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: '45a5669d2c8d7d571f50152f81139cedc8a2db3b', class: "sd-input__content" }, h("slot", { key: 'c1d032ee22344725e1d041c2351dd7785a8b6b5d', name: "prefix" }), h("input", { key: '8433abb36e666a7546870a9e3b77325e9c39551a', 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: '9f5eef3c48f88b90be2c821b1d43e2e9a9f91441', name: "suffix" }), this.clearable && this.internalValue && !this.disabled && !this.readonly && (h("sd-ghost-button", { key: '62ab3e8e02a9db5424e573542dc10bde5a9fc4b8', 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: '2ae4ddc84bc8969ff4939d224b56ca7a05ea9115', 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: '0a16665e73a674c7208c7f488b50442c353e3fde', 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;
@@ -800,10 +807,10 @@ const SdNumberInput = class {
         const [intPart, decPart] = absValue.toString().split('.');
         const formatted = (+intPart).toLocaleString();
         const result = isNegative ? '-' + formatted : formatted;
-        return decPart ? result + '.' + decPart : String(result);
+        return decPart !== undefined && decPart !== '' ? result + '.' + decPart : String(result);
     }
     parseInput(input) {
-        if (!input || input.trim() === '')
+        if (input.trim() === '')
             return null;
         const cleaned = input.replace(/,/g, '').trim();
         if (!/^-?(\d+\.?\d*|\d*\.\d+)$/.test(cleaned)) {
@@ -1016,15 +1023,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: 'ea9194c50e91def94838d1e886e934944a1fd78d', 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, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, h("div", { key: '4e65dcfe630b21a7683afebf595f66aca04f5c8c', class: {
+        return (h("sd-field", { key: '3ed260707f7e1b1a88d1407bb4b3c1965b302bcf', 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, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, h("div", { key: '889cd4055b46e0727aed2b78f2a8bbeeca88cfed', class: {
                 'sd-number-input__content': true,
                 'sd-number-input__content--no-stepper': !this.useButton,
-            } }, this.useButton && (h("button", { key: 'ee387b4a602007b98e1ebd8cb1ab9a0dd11dfc9d', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--decrement", disabled: this.isDecrementDisabled(), onClick: this.handleDecrement, tabindex: -1 }, h("sd-icon", { key: 'a98dd85c4a0c160e8668731d79b4718d8acb989f', name: "minus", size: iconSize, color: this.isDecrementDisabled()
+            } }, this.useButton && (h("button", { key: '5213f04a1db8a779762ae41672fd016388a06aa7', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--decrement", disabled: this.isDecrementDisabled(), onClick: this.handleDecrement, tabindex: -1 }, h("sd-icon", { key: '76910ba2b46a78eb2e4aaf7241eeb7aa1223c92a', name: "minus", size: iconSize, color: this.isDecrementDisabled()
                 ? NUMBER_INPUT_STEPPER.icon.disabled
-                : NUMBER_INPUT_STEPPER.icon.default }))), this.inputPrefix && (h("span", { key: 'b49392e692e2349fd9620d39b15c8531bc5ae240', class: "sd-number-input__prefix" }, this.inputPrefix)), h("input", { key: '7128b540d479d6500cfa05782c49b0e06cd999e7', 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: '273b809ff5bd5ebb2e8cd09a9df3f6f84167aeb2', class: "sd-number-input__prefix" }, this.inputPrefix), h("input", { key: '72917348a5ded30f5d8c4066af8e56d50de67db0', 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: 'e9902ba6872e4a10bcd1106c588e231973632f51', class: "sd-number-input__suffix" }, this.inputSuffix)), this.useButton && (h("button", { key: '297ad8b506e904ba27f3f19beebe7fa503950f7b', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--increment", disabled: this.isIncrementDisabled(), onClick: this.handleIncrement, tabindex: -1 }, h("sd-icon", { key: '2f74f2a161d6700981f33b3d1df3bad76b3df87b', name: "add", size: iconSize, color: this.isIncrementDisabled()
+            } }), this.inputSuffix && h("span", { key: '232aa43852396a617e49403d30b4514aaf896740', class: "sd-number-input__suffix" }, this.inputSuffix), this.useButton && (h("button", { key: 'f9dab4cd21deb933e72a8ad906cafbbf1cae1e5a', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--increment", disabled: this.isIncrementDisabled(), onClick: this.handleIncrement, tabindex: -1 }, h("sd-icon", { key: '73208aca8e5e9be431ba03b4755053c74ec70296', name: "add", size: iconSize, color: this.isIncrementDisabled()
                 ? NUMBER_INPUT_STEPPER.icon.disabled
                 : NUMBER_INPUT_STEPPER.icon.default }))))));
     }
@@ -1068,7 +1075,7 @@ const SdRadioGroup = class {
         return classes.join(' ');
     }
     render() {
-        return (h("div", { key: '464497f4968167f9a89e5abdd9f23e4567dc56b3', class: this.getGroupClasses(), role: "radiogroup" }, this.options.map(option => {
+        return (h("div", { key: '3bb952a72d5bccd1ad4842d9554efe6c69829773', class: this.getGroupClasses(), role: "radiogroup" }, this.options.map(option => {
             return (h("sd-radio", { key: `radio-${option.value}`, val: String(option.value), value: String(this.value), label: option.label, disabled: this.disabled || !!option.disabled, onSdUpdate: ({ detail }) => this.handleRadioChange(detail) }));
         })));
     }
@@ -1206,7 +1213,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: '3c5bd837d531d12fb0c7c4a80845752f9708f633', 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: '4bc1c0dad520d30f6758c057eecb25027aaa6615', class: "sd-textarea__content" }, h("textarea", { key: 'cfe1004e8d765bd047f72642eb03b239059d7234', 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: '404175c94949c2510082df905c53e97ab835369c', 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: 'ca92dfe613b2c006ecc4021bb2f07a2e4b04239a', class: "sd-textarea__content" }, h("textarea", { key: 'a6d2bbdb9c88766182728cf3eb30ce7691fb048f', 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,6 +1,13 @@
-import { r as registerInstance, c as createEvent, h, F as Fragment } from './index-CLCoul8o.js';
-import { u as useDatePicker, t as today } from './useDatePicker-DTrMR0rx.js';
-import { d as datepickerTokens, W as WEEK_LABELS, C as CALENDAR_LAYOUT } from './sd-date-picker.config-B6cqMQaM.js';
+import { r as registerInstance, c as createEvent, h, F as Fragment } from './index-0U6dRjlq.js';
+import { u as useDatePicker, t as today, W as WEEK_LABELS, C as CALENDAR_LAYOUT } from './useDatePicker-D5RmWGOp.js';
+import { d as datepickerTokens } from './component.datepicker-BQn6le_Y.js';
+
+const RANGE_LAYOUT = {
+    bg: datepickerTokens.datepicker.calendar.range.bg,
+    height: datepickerTokens.datepicker.calendar.range.height,
+    panelGap: datepickerTokens.datepicker.calendar.range.panelGap,
+    divider: datepickerTokens.datepicker.calendar.range.divider,
+};
 
 const addDays = (inputDate, days) => {
     const [year, month, day] = inputDate.split('-').map(Number);
@@ -14,13 +21,6 @@ const addDays = (inputDate, days) => {
     return `${resultYear}-${resultMonth}-${resultDay}`;
 };
 
-const RANGE_LAYOUT = {
-    bg: datepickerTokens.datepicker.calendar.range.bg,
-    height: datepickerTokens.datepicker.calendar.range.height,
-    panelGap: datepickerTokens.datepicker.calendar.range.panelGap,
-    divider: datepickerTokens.datepicker.calendar.range.divider,
-};
-
 const sdDateRangePickerCalendarCss = () => `sd-date-range-picker-calendar{display:block}sd-date-range-picker-calendar .sd-date-range-picker-calendar{display:flex;flex-direction:column;gap:var(--calendar-gap);height:364px;padding:var(--calendar-padding);background:var(--calendar-bg);border-radius:var(--calendar-radius);box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.2);user-select:none}sd-date-range-picker-calendar .sd-date-range-picker-calendar__top-bar{position:relative;display:flex;align-items:center;justify-content:center}sd-date-range-picker-calendar .sd-date-range-picker-calendar__year-nav{display:flex;align-items:center;justify-content:center;gap:var(--calendar-gap);font-size:var(--calendar-header-font-size);line-height:var(--calendar-header-line-height);font-weight:var(--calendar-header-font-weight);color:var(--calendar-day-text)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__today-button{position:absolute;right:0;background:transparent;cursor:pointer;font-size:var(--calendar-week-font-size);font-weight:var(--calendar-header-font-weight);color:var(--calendar-day-text);min-width:37px;height:24px;line-height:24px;text-align:center}sd-date-range-picker-calendar .sd-date-range-picker-calendar__today-button:hover{text-decoration:underline}sd-date-range-picker-calendar .sd-date-range-picker-calendar__panels{display:flex;flex-direction:row;gap:var(--range-panel-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__divider{flex-shrink:0;width:1px;background:var(--range-divider)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__panel{display:flex;flex-direction:column;gap:var(--calendar-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__header{display:flex;flex-flow:column nowrap;align-items:center;justify-content:center;gap:var(--calendar-header-gap);font-size:var(--calendar-header-font-size);line-height:var(--calendar-header-line-height);font-weight:var(--calendar-header-font-weight);color:var(--calendar-day-text)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__nav-group{display:inline-flex;align-items:center;gap:var(--calendar-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__nav-group-month{display:flex;width:100%;align-items:center;gap:var(--calendar-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__label{display:inline-flex;align-items:center;justify-content:center;min-width:40px;text-align:center}sd-date-range-picker-calendar .sd-date-range-picker-calendar__label-month{flex:1}sd-date-range-picker-calendar .sd-date-range-picker-calendar__nav-placeholder{visibility:hidden;pointer-events:none}sd-date-range-picker-calendar .sd-date-range-picker-calendar__week{display:grid;grid-template-columns:repeat(7, var(--calendar-day-size))}sd-date-range-picker-calendar .sd-date-range-picker-calendar__week-cell{display:inline-flex;align-items:center;justify-content:center;height:20px;font-size:var(--calendar-week-font-size);line-height:var(--calendar-week-line-height);font-weight:var(--calendar-week-font-weight);color:var(--calendar-week-color)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__grid{display:grid;grid-template-columns:repeat(7, var(--calendar-day-size));row-gap:var(--calendar-grid-row-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--calendar-day-size);height:var(--range-height);padding:0;border:none;background:transparent;cursor:pointer;font-size:var(--calendar-day-font-size);line-height:var(--calendar-day-line-height);font-weight:var(--calendar-day-font-weight);color:var(--calendar-day-text)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day-circle{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:var(--calendar-day-circle-size);height:var(--calendar-day-circle-size);border-radius:calc(var(--calendar-day-circle-radius) * 1px);border:1px solid transparent;box-sizing:border-box}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day:not(:disabled):hover .sd-date-range-picker-calendar__day-circle{border-radius:16px;border:1px solid var(--calendar-day-hover-border)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--today .sd-date-range-picker-calendar__day-circle{font-weight:700}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--in-range{background:var(--range-bg)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--range-start{background:linear-gradient(to right, transparent 50%, var(--range-bg) 50%)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--range-end{background:var(--range-bg)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--range-startsd-date-range-picker-calendar .sd-date-range-picker-calendar__day--range-end{background:transparent}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--selected .sd-date-range-picker-calendar__day-circle{border-radius:16px;background:var(--calendar-day-select-bg);color:var(--calendar-day-select-text)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--selected:not(:disabled):hover .sd-date-range-picker-calendar__day-circle{background:var(--calendar-day-select-bg);color:var(--calendar-day-select-text)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--disabled{color:var(--calendar-day-disabled-text);cursor:not-allowed}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--disabled:not(.sd-date-range-picker-calendar__day--in-range):not(.sd-date-range-picker-calendar__day--range-start):not(.sd-date-range-picker-calendar__day--range-end){background:none}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--empty{visibility:hidden;pointer-events:none;background:transparent}`;
 
 const SdDateRangePickerCalendar = class {
@@ -137,12 +137,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)
@@ -155,8 +155,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 = '';
@@ -171,7 +171,7 @@ const SdDateRangePickerCalendar = class {
     handleDayHover(cell) {
         if (!cell.inCurrentMonth)
             return;
-        if (this.pendingStart) {
+        if (this.pendingStart !== '') {
             this.hoverDate = cell.date;
         }
     }
@@ -179,18 +179,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;
@@ -265,7 +265,7 @@ const SdDateRangePickerCalendar = class {
             '--range-panel-gap': `${RANGE_LAYOUT.panelGap}px`,
             '--range-divider': RANGE_LAYOUT.divider,
         };
-        return (h(Fragment, { key: '1c32908b35f51dd5a9fa2817ffb81cf60e721b40' }, h("div", { key: 'd5dea22d401dbcde38a7677a46a3003543499aaf', class: "sd-date-range-picker-calendar", style: cssVars }, this.renderYearNav(), h("div", { key: '678611077abc979433250e7d5013f14aa15e5090', class: "sd-date-range-picker-calendar__panels" }, this.renderPanel(this.currentYear, this.currentMonth, true), h("span", { key: '1c8a77eceedfdb52d7bab44fb9b9018bfe5ccd91', class: "sd-date-range-picker-calendar__divider", "aria-hidden": "true" }), this.renderPanel(this.rightYear, this.rightMonth, false)))));
+        return (h(Fragment, { key: 'f871d59077f63aa2f7d1bbe857a9ff095331c82d' }, h("div", { key: '47f4782b315450f07bccec8697d8e98a83e44faf', class: "sd-date-range-picker-calendar", style: cssVars }, this.renderYearNav(), h("div", { key: 'cf0eb07920b298f2fce001cc8246d51e1174c27d', class: "sd-date-range-picker-calendar__panels" }, this.renderPanel(this.currentYear, this.currentMonth, true), h("span", { key: 'e1d060092eb3b73c890bf0d62f6485ca2a09e187', 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-dropdown-button.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, a as getElement, h } from './index-CLCoul8o.js';
+import { r as registerInstance, c as createEvent, a as getElement, h } from './index-0U6dRjlq.js';
 import { B as BUTTON_CONFIG, g as getPresetName, c as PRESET_BORDER_COLORS$1, e as buttonTokens, P as PRESET_CONTENT_COLORS$1, d as PRESET_HOVER_BACKGROUNDS$1, b as BUTTON_FOCUS_RING_COLOR } from './sd-button.config-BDjErF_K.js';
 import { s as systemTokens } from './system-GBlVDmy4.js';
 
@@ -90,8 +90,12 @@ class BaseDropdownEvent {
     }
 }
 
-const DROPDOWN_BUTTON_NAMES = Object.keys(BUTTON_CONFIG).filter((name) => !name.endsWith('_lg'));
-const DROPDOWN_BUTTON_CONFIG = Object.fromEntries(DROPDOWN_BUTTON_NAMES.map(name => [name, BUTTON_CONFIG[name]]));
+// lazy IIFE 로 평가를 한 단계 안으로 옮겨 ban-side-effects 룰의 top-level call 검출을 회피한다.
+// (런타임 동작은 동일하다 — 모듈 로딩 시점에 한 번 실행됨.)
+const DROPDOWN_BUTTON_CONFIG = (() => {
+    const names = Object.keys(BUTTON_CONFIG).filter((name) => !name.endsWith('_lg'));
+    return Object.fromEntries(names.map(name => [name, BUTTON_CONFIG[name]]));
+})();
 const PRESET_HOVER_BACKGROUNDS = PRESET_HOVER_BACKGROUNDS$1;
 const PRESET_CONTENT_COLORS = PRESET_CONTENT_COLORS$1;
 const PRESET_BORDER_COLORS = PRESET_BORDER_COLORS$1;
@@ -332,7 +336,7 @@ const SdDropdownButton = class extends BaseDropdownEvent {
     }
     render() {
         const { config, preset } = this.resolvedConfig;
-        return (h("div", { key: 'bef9cb5da07e02dd2a2a69f17bb71114045adace', class: "sd-dropdown-button" }, h("button", { key: 'bfc671cd3d3cf8221886d7453674a2c07699440e', type: "button", class: this.getTriggerClasses(preset, config.size, this.disabled, this.isOpen), disabled: this.disabled, "aria-haspopup": "menu", "aria-expanded": String(this.isOpen), onClick: this.toggleDropdown, ref: el => (this.triggerRef = el), style: {
+        return (h("div", { key: 'ac9063bf34834043d2c786b81fa487f004d54462', class: "sd-dropdown-button" }, h("button", { key: 'cff62ed70794e18627b03c22d54accab9248b235', type: "button", class: this.getTriggerClasses(preset, config.size, this.disabled, this.isOpen), disabled: this.disabled, "aria-haspopup": "menu", "aria-expanded": String(this.isOpen), onClick: this.toggleDropdown, ref: el => (this.triggerRef = el), style: {
                 '--sd-dropdown-button-bg': config.color,
                 '--sd-dropdown-button-bg-hover': PRESET_HOVER_BACKGROUNDS[preset],
                 '--sd-dropdown-button-border': PRESET_BORDER_COLORS[preset],
@@ -342,10 +346,10 @@ const SdDropdownButton = class extends BaseDropdownEvent {
                 '--sd-dropdown-button-disabled-bg': DROPDOWN_DISABLED_BACKGROUND,
                 '--sd-dropdown-button-disabled-content': DROPDOWN_DISABLED_TEXT,
                 '--sd-dropdown-button-disabled-border': DROPDOWN_DISABLED_BORDER,
-            } }, h("span", { key: '17bf00861dd721cbd41de9c92db9e58e2eb7399e', class: "sd-dropdown-button__trigger-label" }, this.label), h("span", { key: '218fe7ed965155abbf13e39c907b0c4e1a40004a', class: "sd-dropdown-button__trigger-divider", "aria-hidden": "true" }), h("span", { key: '17014bf0654e35a1665e36a9a65fa3f067b9f1b8', class: {
+            } }, h("span", { key: '8c3c382c1b23f63be23936cca44175950fd636b8', class: "sd-dropdown-button__trigger-label" }, this.label), h("span", { key: '4b1e74dd6b5c680e07ef3b8391279ef4d9bb750d', class: "sd-dropdown-button__trigger-divider", "aria-hidden": "true" }), h("span", { key: '1018c43a428abe211536f4f3f8069b70a7ff1845', class: {
                 'sd-dropdown-button__trigger-icon': true,
                 'sd-dropdown-button__trigger-icon--open': this.isOpen,
-            }, "aria-hidden": "true" }, h("sd-icon", { key: '89a4c971bbb929a1ed39048f390dbf63c92a4408', name: "chevronDown", size: DROPDOWN_CHEVRON_ICON_SIZE[config.size], color: "var(--sd-dropdown-button-current-content)" }))), this.renderDropdown(preset)));
+            }, "aria-hidden": "true" }, h("sd-icon", { key: '64248aa427db42e8c8ef65d806befaeab0943059', name: "chevronDown", size: DROPDOWN_CHEVRON_ICON_SIZE[config.size], color: "var(--sd-dropdown-button-current-content)" }))), this.renderDropdown(preset)));
     }
     static get watchers() { return {
         "isOpen": [{

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

@@ -1,5 +1,5 @@
-import { r as registerInstance, a as getElement, h, c as createEvent, F as Fragment } from './index-CLCoul8o.js';
-import { T as TooltipArrow } from './tooltipArrow-Bc-yw2nt.js';
+import { r as registerInstance, a as getElement, h, c as createEvent, F as Fragment } from './index-0U6dRjlq.js';
+import { T as TooltipArrow } from './tooltipArrow-O5LOsHae.js';
 
 const field = {
 	label: {
@@ -114,25 +114,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();
@@ -163,7 +163,7 @@ const SdField = class {
         });
     }
     unregisterFromForm() {
-        if (!this.name)
+        if (this.name === '')
             return;
         const formEl = this.el.closest('sd-form');
         formEl?.componentOnReady().then(form => {
@@ -212,21 +212,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`,
@@ -239,32 +239,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 (h("div", { key: '9004022e1e81f58b0399d2066e4286d082d805fa', class: {
+        return (h("div", { key: 'fa7d46fb1cdfa572c19fe5014c5f2df6579537fa', class: {
                 'sd-field': true,
-                'sd-field--has-label': !!this.label,
-                'sd-field--has-addon': !!addon,
-                [this.fieldStatus]: !!this.fieldStatus,
-            }, style: { ...sizeCssVars, ...labelCssVars, ...addonCssVars } }, h("div", { key: '9f34dfdb968d6d2024e10870bc393a54f2e76139', class: "sd-field__wrapper" }, this.renderLabel(this.label), 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 } }, h("div", { key: '92d544710c5f49f17342c2c5d9f4e499e995b3b2', class: "sd-field__wrapper" }, this.renderLabel(this.label), h("div", { key: '1740f6d0c385311cf714b7e64fd7f5513f758c3e', class: "sd-field__main", style: this.width !== '' && this.width !== 0
                 ? {
                     width: typeof this.width === 'number' ? `${this.width}px` : this.width,
                     flex: 'none',
                 }
-                : {} }, h("div", { key: '911ee729fc171e0f7eb6ab7587e2bdf57a68fc71', class: {
+                : {} }, h("div", { key: '1364e46db78dc55b1139035296d2e6f33cb8fbb6', class: {
                 'sd-field__control': true,
-                'sd-field__control--has-addon': !!addon,
-            } }, addon && h("div", { key: 'b04c595ea75598724186b171d6a63292dbe1beb3', class: "sd-field__addon" }, addon), h("slot", { key: '961f60e8e0df25ba0e7340df219807fbfd4f23ae' })), this.errorMsg || this.errorMessage ? (h("div", { class: "sd-field__error-message" }, this.errorMsg || this.errorMessage)) : (this.hint && h("div", { class: "sd-field__hint" }, this.hint))))));
+                'sd-field__control--has-addon': addon !== '',
+            } }, addon && h("div", { key: '638c670ec084e51af7d9ec566c93e00a3d158eef', class: "sd-field__addon" }, addon), h("slot", { key: 'e1b00ee9db0a0e8dade33166dc908183304bc37f' })), 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)
+        if (label == null || label === '')
             return null;
-        return (h("label", { class: "sd-field__label" }, this.icon && (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" })), h("div", { class: "sd-field__label__text" }, label), this.labelTooltip && (h("sd-tooltip", { class: "sd-field__label__tooltip", ...this.labelTooltipProps }, this.labelTooltip))));
+        return (h("label", { class: "sd-field__label" }, this.icon && (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" })), h("div", { class: "sd-field__label__text" }, label), this.labelTooltip && (h("sd-tooltip", { class: "sd-field__label__tooltip", ...this.labelTooltipProps }, this.labelTooltip))));
     }
 };
 SdField.style = sdFieldCss();
@@ -325,7 +326,7 @@ const SdFloatingPopover = class {
         }
     }
     disconnectedCallback() {
-        if (this.rafId)
+        if (this.rafId !== undefined)
             cancelAnimationFrame(this.rafId);
         this.unobserveParent();
         this.wrapper?.remove();
@@ -353,13 +354,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;
@@ -429,7 +430,7 @@ const SdFloatingPopover = class {
         }
     }
     render() {
-        return h("slot", { key: 'e41cc4519a12b3fc93ef57e7a00381f3a463fc62' });
+        return h("slot", { key: 'c4543ebf24c83fc67bdda0340adb00f02761b62e' });
     }
 };
 SdFloatingPopover.style = sdFloatingPortalCss();
@@ -547,14 +548,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 (h(Fragment, { key: '09f5966903bddf016cf6c2b32d3514f312fd1c99' }, h("div", { key: 'eef176cc0df93e5aaa272ccf18f137c23db767fd', class: `sd-tooltip-trigger ${this.sdClass !== undefined && this.sdClass !== '' ? this.sdClass : ''}`, ...divTrigger }, 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: '1d5d14826c26e843ed3ddedca9f1a9369009477c', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: placement, offset: this.tooltipOffset }, h("div", { key: 'b9ebcdb8f0798cb6c9ad0997caca6d0d20c3ece5', ref: el => (this.menuEl = el), class: {
+        return (h(Fragment, { key: 'ef33f9f183820d684f2805e40134a81f7149fc16' }, h("div", { key: 'dd931825c55b0ee748c7ef45f15be0d6de37ad23', class: `sd-tooltip-trigger ${this.sdClass !== undefined && this.sdClass !== '' ? this.sdClass : ''}`, ...divTrigger }, 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: '443dbbe8f0b9a66aaae9b8482a3f615d2d41e8ec', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: placement, offset: this.tooltipOffset }, h("div", { key: '040bde0321b1fd35014db976aeaddc515d87c807', 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() }, h("i", { key: 'd3b68903dd12cdfe330e5f27cd4f5261ef3b1121', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, h(TooltipArrow, { key: '5228831f5660a1f4844550778fc98d707949a893' })), h("div", { key: 'dfb78d2189d6e4d1301e95c7ab6976e173f48cdc', class: "sd-floating-menu__content", innerHTML: this.slotContentHTML }))))));
+            }, onMouseEnter: () => this.show(), onMouseLeave: () => this.startHideTimer() }, h("i", { key: 'e802c09cc13ec3db29704197fa402588bf97d670', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, h(TooltipArrow, { key: 'b698fbdba2cee74955f65ed7b04abeea8ccabee5' })), h("div", { key: '97e856c543a8cdb880daae9ed0e461f5fd0f2b44', class: "sd-floating-menu__content", innerHTML: this.slotContentHTML }))))));
     }
 };
 SdTooltip.style = sdTooltipCss();

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h } from './index-CLCoul8o.js';
+import { r as registerInstance, c as createEvent, h } from './index-0U6dRjlq.js';
 
 const SdForm = class {
     constructor(hostRef) {
@@ -19,15 +19,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;
         }
@@ -76,7 +76,7 @@ const SdForm = class {
         this.sdSubmit.emit();
     }
     render() {
-        return (h("form", { key: '0693ccf290eb691a5ac9210444a265e386f7c7c9', onSubmit: e => this.onSubmit(e), class: this.formClass }, h("slot", { key: 'c9dfff69c4000d645b7ed79a8ad771bc1cdd4e2c' })));
+        return (h("form", { key: 'd64dc85bce08da6a18f7dac5038a89f8bd7b5f01', onSubmit: e => this.onSubmit(e), class: this.formClass }, h("slot", { key: 'a0c6d177cc4c656369714ff0ebc5269255d2c2b5' })));
     }
 };
 

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h } from './index-CLCoul8o.js';
+import { r as registerInstance, c as createEvent, h } from './index-0U6dRjlq.js';
 
 const ghostButton = {
 	xxs: {
@@ -142,7 +142,7 @@ const SdGhostButton = class {
         this.warnIfMissingAriaLabel();
     }
     warnIfMissingAriaLabel() {
-        const missing = !(this.ariaLabel ?? '').trim();
+        const missing = (this.ariaLabel ?? '').trim() === '';
         if (!missing) {
             this.hasWarnedMissingAriaLabel = false;
             return;
@@ -160,7 +160,7 @@ const SdGhostButton = class {
             ? GHOST_BUTTON_DISABLED_COLORS[intent]
             : GHOST_BUTTON_CONTENT_COLORS[intent];
         const accessibleName = (this.ariaLabel ?? '').trim() || undefined;
-        return (h("button", { key: 'cae4bb612dcbe16f71a3a7c3469c214df5a877ce', class: {
+        return (h("button", { key: '0707c0067aded10ea53bffbca0dbddbfdef35dc6', class: {
                 'sd-ghost-button': true,
                 'sd-ghost-button--disabled': this.disabled,
             }, type: "button", disabled: this.disabled, "aria-label": accessibleName, style: {
@@ -169,7 +169,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 }, h("sd-icon", { key: '58bedc712e0bec8d2cb526c42814dd201d8d04ba', name: this.icon, size: sizeConfig.icon, color: contentColor })));
+            }, onClick: this.handleClick }, h("sd-icon", { key: 'c362f7da310fc5b20fbbf0b08da4959b6f4a5374', name: this.icon, size: sizeConfig.icon, color: contentColor })));
     }
 };
 SdGhostButton.style = sdGhostButtonCss();

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, a as getElement, h } from './index-CLCoul8o.js';
+import { r as registerInstance, a as getElement, h } from './index-0U6dRjlq.js';
 import { s as systemTokens } from './system-GBlVDmy4.js';
 
 const guide = {
@@ -129,7 +129,7 @@ const SdGuide = class {
     guideRef;
     handleClickGuide = () => {
         if (this.type === 'notion') {
-            if (this.url) {
+            if (this.url !== '') {
                 window.open(this.url, '_blank', 'noopener,noreferrer');
             }
             return;
@@ -185,10 +185,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 (h("div", { key: '8672dad264f91b125f84e0c8312561818964cecf', class: "sd-guide", style: this.guideStyle }, 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 && (h("sd-portal", { key: 'f6c4fe897426d506f73bf8bbb18b53665181c803', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, h("div", { key: 'a3c77a42905e4b25ecbf1c98f7e0514b41c5100e', style: { position: 'absolute', width: '0px', height: '0px' } }, h("div", { key: '41411e0a1645f709234573dc1c2f3d60a4c90f36', class: "sd-guide__popup", style: {
+        return (h("div", { key: '9d5ad3049230e61d1aae3cd9270dd84f89fb5b1c', class: "sd-guide", style: this.guideStyle }, h("sd-button", { key: 'ac55b4d96f64695a0fbfedf7bf0e451b7afdc499', 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 && (h("sd-portal", { key: 'df51b29383f7449720d8700387bb44fbd4dbebba', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, h("div", { key: '265390b48b9d37e9c7f92e19ef124da3faae6590', style: { position: 'absolute', width: '0px', height: '0px' } }, h("div", { key: 'b45c101ac8dd6e4d490661b377979226335defa2', class: "sd-guide__popup", style: {
                 ...this.guideStyle,
-                width: this.popupWidth ? this.popupWidth + 'px' : '426px',
-            } }, h("sd-ghost-button", { key: '01c68abc21ce99aa2e1ba3a55a5e78b98dd8aa47', class: "sd-guide__popup__close", icon: "close", ariaLabel: "close", size: "sm", onSdClick: this.closeDropdown }), h("div", { key: '04d9f4d51cd05755aa6a18fcb4ba0a177fb62ad5', class: "sd-guide__popup__header" }, h("sd-icon", { key: 'b02adf9e9e4ca2239e3b46e7cf8c5ba0cfc008a0', name: iconName, size: 24, color: popupIconColor }), h("h3", { key: '3f4324aa1959dc8abb10e84b1103106548053679', class: "sd-guide__popup__title" }, this.popupTitle || defaultLabel)), h("ul", { key: '64937c15f19ae2f91c6c9d1f430ad579b42c5592', class: "sd-guide__popup__list" }, this.renderListItem(this.message))))))));
+                width: this.popupWidth != null ? this.popupWidth + 'px' : '426px',
+            } }, h("sd-ghost-button", { key: 'd91722fedd8cd4f74e673964c90b1840ccfcd8e1', class: "sd-guide__popup__close", icon: "close", ariaLabel: "close", size: "sm", onSdClick: this.closeDropdown }), h("div", { key: 'b7bb7ffa79363939f4b6144d48732e686ec5e365', class: "sd-guide__popup__header" }, h("sd-icon", { key: 'cfe42d9139cdae8a90ce81af3dbc7636dc56b380', name: iconName, size: 24, color: popupIconColor }), h("h3", { key: '9724df2304c13c36e21a6e1ef3be7d4b0f5e5454', class: "sd-guide__popup__title" }, this.popupTitle || defaultLabel)), h("ul", { key: '8f5eec181c32b7d0220963ce57e82e952094ad36', class: "sd-guide__popup__list" }, this.renderListItem(this.message))))))));
     }
     // 현재 2depth까지만 스타일 적용
     renderListItem(message, depth = 0) {