@sellmate/design-system 1.0.78 → 1.1.0

package/dist/collection/components/sd-text-link/sd-text-link.js

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
-import { TEXT_LINK_LAYOUT, TEXT_LINK_TYPOGRAPHY, TEXT_LINK_COLORS } from "./sd-text-link.config";
+import { TEXT_LINK_COLORS, TEXT_LINK_LAYOUT, TEXT_LINK_TYPOGRAPHY } from "./sd-text-link.config";
 export class SdTextLink {
     label = '';
     icon = '';
@@ -23,19 +23,20 @@ export class SdTextLink {
         const arrowColor = this.disabled ? TEXT_LINK_COLORS.icon.disabled : TEXT_LINK_LAYOUT.arrowColor;
         const cssVars = {
             '--sd-text-link-gap': `${TEXT_LINK_LAYOUT.gap}px`,
+            '--sd-text-link-font-size': `${typo.fontSize}px`,
             '--sd-text-link-text-decoration': typo.textDecoration,
             ...(this.disabled ? { '--sd-text-link-color': TEXT_LINK_COLORS.content.disabled } : {}),
         };
-        return (h("span", { key: '9bd62ac603764a5938f3c72bac3a8bf893dfb233', class: {
+        return (h("span", { key: '8b02293383e914a0d2c9ac4c9fa2bf4d6bd56d97', class: {
                 'sd-text-link': true,
                 'sd-text-link--disabled': this.disabled,
-            }, style: cssVars, onClick: this.handleClick }, this.icon && (h("sd-icon", { key: '9d63aea3c45c4962e5766e7059a166a85e7a357f', name: this.icon, size: TEXT_LINK_LAYOUT.iconSize, color: iconColor, class: "sd-text-link__icon" })), h("span", { key: 'dc73d60dd1e593c597a6b5dd977db380c21ff680', class: labelClassName }, this.label), this.useArrow && (h("span", { key: '2b25dfb6ae2f857b674341427f93ee34e4691893', class: "sd-text-link__arrow", style: {
+            }, style: cssVars, onClick: this.handleClick }, this.icon && (h("sd-icon", { key: '1f10b5c49d53009a68550e22167b0ce58c29d555', name: this.icon, size: TEXT_LINK_LAYOUT.iconSize, color: iconColor, class: "sd-text-link__icon" })), h("span", { key: 'a5b528b595d036c079818fab432171e39a4c1a4e', class: labelClassName }, this.label), this.useArrow && (h("span", { key: 'fd1559e836bc3a6089043e5f4d9de12d364ab61f', class: "sd-text-link__arrow", style: {
                 width: `${TEXT_LINK_LAYOUT.arrowFrame}px`,
                 height: `${TEXT_LINK_LAYOUT.arrowFrame}px`,
                 display: 'inline-flex',
                 alignItems: 'center',
                 justifyContent: 'center',
-            } }, h("sd-icon", { key: 'a5c8fb48e66f4a6820da1a54cedd7b1a13c5dcec', name: "chevronRight", size: TEXT_LINK_LAYOUT.arrowIconSize, color: arrowColor })))));
+            } }, h("sd-icon", { key: '3af56ca5845d6d544c786142ae5842aca0720808', name: "chevronRight", size: TEXT_LINK_LAYOUT.arrowIconSize, color: arrowColor })))));
     }
     static get is() { return "sd-text-link"; }
     static get originalStyleUrls() {

package/dist/collection/components/sd-textarea/sd-textarea.css

@@ -25,4 +25,7 @@ sd-textarea .sd-textarea__content .sd-textarea__native::placeholder {
 sd-textarea .sd-textarea__content .sd-textarea__native:disabled {
   cursor: not-allowed;
   color: var(--sd-textarea-disabled-color);
+}
+sd-textarea .sd-textarea__content .sd-textarea__native[readonly] {
+  color: var(--sd-system-color-field-text-read-only);
 }

package/dist/collection/components/sd-textarea/sd-textarea.js

@@ -105,7 +105,7 @@ export class SdTextarea {
             '--sd-system-size-field-sm-height': 'auto',
             '--sd-system-radius-field-sm': `${TEXTAREA_TOKENS.radius}px`,
         };
-        return (h("sd-field", { key: 'ca7dc6c13d22ba43cd99ee1e976599d7efb1eceb', 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, 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: 'a36ffabff714596bf780f2a63ccfde3e02eadda7', class: "sd-textarea__content" }, h("textarea", { key: 'b7f8a55b7ee4dfc394c380a97e21c6cc34d12b9b', 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: '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 }))));
     }
     static get is() { return "sd-textarea"; }
     static get originalStyleUrls() {
@@ -511,7 +511,7 @@ export class SdTextarea {
                 "mutable": false,
                 "complexType": {
                     "original": "SdTooltipProps | null",
-                    "resolved": "SdTooltipProps | null",
+                    "resolved": "SdTooltip | null",
                     "references": {
                         "SdTooltipProps": {
                             "location": "import",

package/dist/collection/components/sd-toast/sd-toast.config.js

@@ -1,10 +1,24 @@
 import toastTokens from "../../tokens/generated/component.toast.json";
+export const TOAST_BUTTON_NAME_BY_TYPE = {
+    default: 'secondary_sm',
+    danger: 'danger_outline_sm',
+    caution: 'neutral_outline_sm',
+    complete: 'neutral_outline_sm',
+    accent: 'neutral_outline_sm',
+    info: 'secondary_sm',
+};
 export const TOAST_TYPE_CONFIG = {
     default: { bg: toastTokens.toast.default.bg, content: toastTokens.toast.default.content },
     danger: { bg: toastTokens.toast.danger.bg, content: toastTokens.toast.danger.content },
     caution: { bg: toastTokens.toast.caution.bg, content: toastTokens.toast.caution.content },
     complete: { bg: toastTokens.toast.complete.bg, content: toastTokens.toast.complete.content },
     accent: { bg: toastTokens.toast.accent.bg, content: toastTokens.toast.accent.content },
+    info: {
+        bg: toastTokens.toast.info.bg,
+        content: toastTokens.toast.info.text,
+        icon: toastTokens.toast.info.icon,
+        linkColor: toastTokens.toast.info.textLink,
+    },
 };
 export const TOAST_LAYOUT = {
     radius: toastTokens.toast.radius,

package/dist/collection/components/sd-toast/sd-toast.css

@@ -26,18 +26,19 @@ sd-toast .sd-toast__content {
 sd-toast .sd-toast__message {
   font-size: 14px;
   line-height: 24px;
-  font-weight: 700;
+  font-weight: 500;
   white-space: nowrap;
 }
 sd-toast .sd-toast__link {
   font-size: 14px;
   line-height: 24px;
   font-weight: 700;
-  color: var(--sd-toast-text);
+  color: var(--sd-toast-link, var(--sd-toast-text));
   text-decoration: underline;
   cursor: pointer;
   transition: opacity 0.2s ease;
   margin-left: 4px;
+  white-space: nowrap;
 }
 sd-toast .sd-toast__link:hover {
   opacity: 0.8;
@@ -45,9 +46,6 @@ sd-toast .sd-toast__link:hover {
 sd-toast .sd-toast__button {
   flex-shrink: 0;
 }
-sd-toast .sd-toast__button button {
-  color: var(--button-text-color, inherit) !important;
-}
 sd-toast .sd-toast__close {
   flex-shrink: 0;
 }

package/dist/collection/components/sd-toast/sd-toast.js

@@ -1,20 +1,28 @@
 import { h } from "@stencil/core";
-import { TOAST_TYPE_CONFIG, TOAST_LAYOUT } from "./sd-toast.config";
+import { TOAST_TYPE_CONFIG, TOAST_LAYOUT, TOAST_BUTTON_NAME_BY_TYPE, } from "./sd-toast.config";
 export class SdToast {
     icon;
     message;
     link;
     linkLabel;
+    buttonLabel;
     useClose = false;
     type = 'default';
     close;
+    buttonClick;
     render() {
         const typeConfig = TOAST_TYPE_CONFIG[this.type] ?? TOAST_TYPE_CONFIG.default;
         const iconSize = Number(TOAST_LAYOUT.iconSize);
-        return (h("div", { key: 'f5db941adee41c3d2c57c2c7a12d94d03dcdebb6', style: {
+        const iconColor = typeConfig.icon ?? typeConfig.content;
+        const linkColor = typeConfig.linkColor ?? typeConfig.content;
+        const useDefaultCloseIntent = ['default', 'caution', 'info'].includes(this.type);
+        const buttonName = TOAST_BUTTON_NAME_BY_TYPE[this.type] ?? TOAST_BUTTON_NAME_BY_TYPE.default;
+        return (h("div", { key: '26f82a1da683136f605ddcc5c6c6a45266ae3158', style: {
                 '--sd-toast-bg': typeConfig.bg,
                 '--sd-toast-text': typeConfig.content,
-            } }, h("div", { key: '68362fac26744fc7e805a18c589f4aff5845edc1', class: "sd-toast", role: "status", "aria-live": "polite", "aria-atomic": "true" }, this.icon && (h("div", { key: '8ec7941b469b6d0242ab68b7928a9dbf6e75bb5f', class: "sd-toast__icon" }, h("sd-icon", { key: 'c057a100de91cecc3435bfa6a95c928727eb1836', name: this.icon, size: iconSize, color: typeConfig.content }))), h("div", { key: '21e84dd6cdf7efa52611da532a0983268c7c2cb2', class: "sd-toast__content" }, h("span", { key: '99c370fe3d4a54103fbccef395afadf2923f3613', class: "sd-toast__message" }, this.message)), this.link && (h("a", { key: '3ce7109c2d1f5cd03f4fcc6bb01ede14c6400734', href: this.link, class: "sd-toast__link", target: "_blank", rel: "noopener noreferrer" }, this.linkLabel || this.link)), this.useClose && (h("sd-ghost-button", { key: '2cf982fd1fe538533ceff61bbdecdacd2d69e51c', class: "sd-toast__close", icon: "close", intent: this.type === 'caution' ? 'default' : 'inverse', ariaLabel: "close", size: "xs", onClick: () => this.close.emit() })))));
+                '--sd-toast-icon': iconColor,
+                '--sd-toast-link': linkColor,
+            } }, h("div", { key: 'd2ed3c831b86e2ddee804f8ce770642ea698f7ce', class: "sd-toast", role: "status", "aria-live": "polite", "aria-atomic": "true" }, this.icon && (h("div", { key: 'a6dba347a064420c2747963da35ad0d50406f426', class: "sd-toast__icon" }, h("sd-icon", { key: 'a05871f3711ae89050f11bdeb92d27b6c06354ba', name: this.icon, size: iconSize, color: iconColor }))), h("div", { key: '11901cf0531ac2b658d2278ba27021f9714340d7', class: "sd-toast__content" }, h("span", { key: '5edf234270283818732a5dbfaf581a27c8c084e6', class: "sd-toast__message" }, this.message)), this.link && (h("a", { key: '518207a380b2d30c160a2a76649222655ec821cf', href: this.link, class: "sd-toast__link", target: "_blank", rel: "noopener noreferrer" }, this.linkLabel || this.link)), this.buttonLabel && (h("sd-button", { key: 'ed4847317cc9e0765a5964ab7ed245a37dce45ee', class: "sd-toast__button", name: buttonName, label: this.buttonLabel, onSdClick: (event) => this.buttonClick.emit(event.detail) })), this.useClose && (h("sd-ghost-button", { key: '74a8f5d6c2392bdb7c59d754d72ed591fa68bf62', class: "sd-toast__close", icon: "close", intent: useDefaultCloseIntent ? 'default' : 'inverse', ariaLabel: "close", size: "xs", onClick: () => this.close.emit() })))));
     }
     static get is() { return "sd-toast"; }
     static get originalStyleUrls() {
@@ -34,7 +42,7 @@ export class SdToast {
                 "mutable": false,
                 "complexType": {
                     "original": "IconName",
-                    "resolved": "\"add\" | \"alert\" | \"alignKorean\" | \"archive\" | \"arrowDown\" | \"arrowLeft\" | \"arrowRight\" | \"arrowUp\" | \"attachFile\" | \"barcode\" | \"bell\" | \"board\" | \"box\" | \"camera\" | \"cancelFill\" | \"cancelOutline\" | \"caretDown\" | \"caretLeft\" | \"caretRight\" | \"caretUp\" | \"check\" | \"checkFill\" | \"checkOutline\" | \"chevronDown\" | \"chevronLeft\" | \"chevronLeftEnd\" | \"chevronRight\" | \"chevronRightEnd\" | \"chevronUp\" | \"clockFill\" | \"clockOutline\" | \"close\" | \"copy\" | \"dashboard\" | \"date\" | \"download\" | \"drag\" | \"edit\" | \"etc\" | \"event\" | \"global\" | \"helpFill\" | \"helpOutline\" | \"history\" | \"imageFill\" | \"imageOutline\" | \"inline\" | \"line\" | \"location\" | \"logout\" | \"minus\" | \"new\" | \"notificationFill\" | \"notificationOutline\" | \"notion\" | \"outline\" | \"pageEdit\" | \"pageMove\" | \"pdf\" | \"print\" | \"remove\" | \"reset\" | \"robot\" | \"row\" | \"save\" | \"search\" | \"setting\" | \"star\" | \"synchronize\" | \"updown\" | \"user\" | \"visibilityOff\" | \"visibilityOn\" | \"warehouseFill\" | \"warehouseOutline\" | \"warningFill\" | \"warningOutline\" | \"youtube\" | undefined",
+                    "resolved": "\"add\" | \"alert\" | \"alignKorean\" | \"archive\" | \"arrowDown\" | \"arrowLeft\" | \"arrowRight\" | \"arrowUp\" | \"attachFile\" | \"barcode\" | \"bell\" | \"board\" | \"box\" | \"camera\" | \"cancelFill\" | \"cancelOutline\" | \"caretDown\" | \"caretLeft\" | \"caretRight\" | \"caretUp\" | \"check\" | \"checkFill\" | \"checkOutline\" | \"checkboxCheck\" | \"checkboxIndeterminate\" | \"chevronDown\" | \"chevronLeft\" | \"chevronLeftEnd\" | \"chevronRight\" | \"chevronRightEnd\" | \"chevronUp\" | \"clockFill\" | \"clockOutline\" | \"close\" | \"copy\" | \"dashboard\" | \"date\" | \"download\" | \"drag\" | \"edit\" | \"etc\" | \"event\" | \"global\" | \"helpFill\" | \"helpOutline\" | \"history\" | \"imageFill\" | \"imageOutline\" | \"inline\" | \"line\" | \"location\" | \"logout\" | \"minus\" | \"new\" | \"notificationFill\" | \"notificationOutline\" | \"notion\" | \"outline\" | \"pageEdit\" | \"pageMove\" | \"pdf\" | \"print\" | \"remove\" | \"reset\" | \"robot\" | \"row\" | \"save\" | \"search\" | \"setting\" | \"star\" | \"synchronize\" | \"updown\" | \"user\" | \"visibilityOff\" | \"visibilityOn\" | \"warehouseFill\" | \"warehouseOutline\" | \"warningFill\" | \"warningOutline\" | \"youtube\" | undefined",
                     "references": {
                         "IconName": {
                             "location": "global",
@@ -110,6 +118,25 @@ export class SdToast {
                 "reflect": false,
                 "attribute": "link-label"
             },
+            "buttonLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "button-label"
+            },
             "useClose": {
                 "type": "boolean",
                 "mutable": false,
@@ -135,7 +162,7 @@ export class SdToast {
                 "mutable": false,
                 "complexType": {
                     "original": "ToastType",
-                    "resolved": "\"accent\" | \"caution\" | \"complete\" | \"danger\" | \"default\"",
+                    "resolved": "\"accent\" | \"caution\" | \"complete\" | \"danger\" | \"default\" | \"info\"",
                     "references": {
                         "ToastType": {
                             "location": "import",
@@ -175,6 +202,26 @@ export class SdToast {
                     "resolved": "void",
                     "references": {}
                 }
+            }, {
+                "method": "buttonClick",
+                "name": "sdButtonClick",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "MouseEvent",
+                    "resolved": "MouseEvent",
+                    "references": {
+                        "MouseEvent": {
+                            "location": "global",
+                            "id": "global::MouseEvent"
+                        }
+                    }
+                }
             }];
     }
 }

package/dist/collection/components/sd-toast-container/sd-toast-container.js

@@ -85,12 +85,12 @@ export class SdToastContainer {
         }
     }
     componentDidRender() {
-        if (!this.toasts?.length)
+        if (this.toasts === undefined || this.toasts.length === 0)
             return;
         const hasEntering = this.toasts.some(t => t.state === 'entering');
         if (hasEntering) {
             requestAnimationFrame(() => {
-                this.toasts = (this.toasts || []).map(t => (t.state === 'entering' ? { ...t, state: 'visible' } : t));
+                this.toasts = (this.toasts || []).map(t => t.state === 'entering' ? { ...t, state: 'visible' } : t);
             });
         }
         this.measureHeights();
@@ -216,7 +216,7 @@ export class SdToastContainer {
         const activeToasts = toasts.filter(t => t.state !== 'exiting').reverse();
         const indexMap = new Map();
         activeToasts.forEach((t, i) => indexMap.set(t.id, i));
-        return (h("div", { key: '925f4bf56626e8c722051afa65aa64f2a50007db', class: "sd-toast-container", style: this.getContainerStyles(), onMouseEnter: () => {
+        return (h("div", { key: 'b734ca5768953e095f98a7f8312f6fdd7a24ae30', class: "sd-toast-container", style: this.getContainerStyles(), onMouseEnter: () => {
                 this.expanded = true;
                 this.pauseTimers();
             }, onMouseLeave: () => {
@@ -232,7 +232,7 @@ export class SdToastContainer {
                 }, style: this.getToastItemStyle(entry, frontIndex, activeToasts), ref: el => {
                     if (el)
                         this.toastRefs.set(entry.id, el);
-                }, onTransitionEnd: () => this.handleTransitionEnd(entry.id) }, h("sd-toast", { message: entry.options.message, type: entry.options.type || 'default', icon: entry.options.icon, link: entry.options.link, linkLabel: entry.options.linkLabel, useClose: entry.options.useClose, onSdClose: () => this.startDismiss(entry.id) })));
+                }, onTransitionEnd: () => this.handleTransitionEnd(entry.id) }, h("sd-toast", { message: entry.options.message, type: entry.options.type || 'default', icon: entry.options.icon, link: entry.options.link, linkLabel: entry.options.linkLabel, buttonLabel: entry.options.buttonLabel, useClose: entry.options.useClose, onSdClose: () => this.startDismiss(entry.id), onSdButtonClick: (event) => entry.options.onButtonClick?.(event.detail) })));
         })));
     }
     static get is() { return "sd-toast-container"; }

package/dist/collection/components/sd-toggle/sd-toggle.js

@@ -45,7 +45,7 @@ export class SdToggle {
             '--sd-toggle-content-select': TOGGLE_COLORS.content.select,
             '--sd-toggle-content-disabled': TOGGLE_COLORS.content.disabled,
         };
-        return (h("label", { key: '9ef981165b998f43ec23f3bb1cf0ef385962d7fb', class: this.toggleClasses, style: cssVars, "aria-label": this.label || 'toggle' }, this.label, h("input", { key: '6b6d2a89f43036f624c7bc291b2c5aa7a93c8f0a', style: { display: 'none' }, type: "checkbox", onInput: this.handleChange })));
+        return (h("label", { key: '958d824b5c502a578e1bb7a8fb0d30d59c2d8eda', class: this.toggleClasses, style: cssVars, "aria-label": this.label || 'toggle' }, this.label, h("input", { key: '81d5dc8ff0f9ca7e8a219f3c0e7bcce3a4ffc875', style: { display: 'none' }, type: "checkbox", onInput: this.handleChange })));
     }
     static get is() { return "sd-toggle"; }
     static get originalStyleUrls() {

package/dist/collection/components/sd-tooltip/sd-tooltip.js

@@ -10,9 +10,11 @@ export class SdTooltip {
     icon = 'helpOutline';
     iconSize = 12;
     label = '';
-    buttonSize = 'sm';
-    buttonVariant = 'primary';
-    noHover = true;
+    name = 'primary_sm';
+    rightIcon;
+    ariaLabel = '';
+    disabled = false;
+    type = 'button';
     sdClass = '';
     showTooltip = false;
     slotContentHTML = '';
@@ -79,16 +81,17 @@ export class SdTooltip {
             onMouseLeave: () => this.startHideTimer(),
         };
         const toggleTooltip = () => (this.showTooltip = !this.showTooltip);
-        const divTrigger = trigger === 'hover' ? hoverTrigger : this.label ? {} : { onClick: toggleTooltip };
-        const buttonClickTrigger = trigger === 'click' && this.label ? { onSdClick: toggleTooltip } : {};
-        return (h(Fragment, { key: '9e14a4013ea6d04a37529cf7afdb10fe4b3d98eb' }, h("div", { key: 'd98396d4440a795e59b0d2fede7381f8e0da7280', class: `sd-tooltip-trigger ${this.sdClass || ''}`, ...divTrigger }, this.label ? (h("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: icon, size: this.buttonSize ?? 'sm', color: color, variant: this.buttonVariant ?? 'primary', 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: '59d42ad7aafd94fbe89fc5af3bddf5a305e13a4c', parentRef: this.buttonEl, onSdClose: this.handleClose.bind(this), placement: placement, offset: this.tooltipOffset }, h("div", { key: '88a927d2c3461c7c68865262e8565d0d1385e9af', ref: el => (this.menuEl = el), 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: {
                 '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: 'eb2bcb4e6faa2066e309b662f372fbf8bef42a3e', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, h(TooltipArrow, { key: 'f13005f88ef3194d43de72a87ee78f2c0858682e' })), h("div", { key: '726aff3af3603593d0b994ee17ba88cec071868a', class: "sd-floating-menu__content", innerHTML: this.slotContentHTML }))))));
+            }, 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 }))))));
     }
     static get is() { return "sd-tooltip"; }
     static get originalStyleUrls() {
@@ -195,7 +198,7 @@ export class SdTooltip {
                 "mutable": false,
                 "complexType": {
                     "original": "IconName",
-                    "resolved": "\"add\" | \"alert\" | \"alignKorean\" | \"archive\" | \"arrowDown\" | \"arrowLeft\" | \"arrowRight\" | \"arrowUp\" | \"attachFile\" | \"barcode\" | \"bell\" | \"board\" | \"box\" | \"camera\" | \"cancelFill\" | \"cancelOutline\" | \"caretDown\" | \"caretLeft\" | \"caretRight\" | \"caretUp\" | \"check\" | \"checkFill\" | \"checkOutline\" | \"chevronDown\" | \"chevronLeft\" | \"chevronLeftEnd\" | \"chevronRight\" | \"chevronRightEnd\" | \"chevronUp\" | \"clockFill\" | \"clockOutline\" | \"close\" | \"copy\" | \"dashboard\" | \"date\" | \"download\" | \"drag\" | \"edit\" | \"etc\" | \"event\" | \"global\" | \"helpFill\" | \"helpOutline\" | \"history\" | \"imageFill\" | \"imageOutline\" | \"inline\" | \"line\" | \"location\" | \"logout\" | \"minus\" | \"new\" | \"notificationFill\" | \"notificationOutline\" | \"notion\" | \"outline\" | \"pageEdit\" | \"pageMove\" | \"pdf\" | \"print\" | \"remove\" | \"reset\" | \"robot\" | \"row\" | \"save\" | \"search\" | \"setting\" | \"star\" | \"synchronize\" | \"updown\" | \"user\" | \"visibilityOff\" | \"visibilityOn\" | \"warehouseFill\" | \"warehouseOutline\" | \"warningFill\" | \"warningOutline\" | \"youtube\"",
+                    "resolved": "\"add\" | \"alert\" | \"alignKorean\" | \"archive\" | \"arrowDown\" | \"arrowLeft\" | \"arrowRight\" | \"arrowUp\" | \"attachFile\" | \"barcode\" | \"bell\" | \"board\" | \"box\" | \"camera\" | \"cancelFill\" | \"cancelOutline\" | \"caretDown\" | \"caretLeft\" | \"caretRight\" | \"caretUp\" | \"check\" | \"checkFill\" | \"checkOutline\" | \"checkboxCheck\" | \"checkboxIndeterminate\" | \"chevronDown\" | \"chevronLeft\" | \"chevronLeftEnd\" | \"chevronRight\" | \"chevronRightEnd\" | \"chevronUp\" | \"clockFill\" | \"clockOutline\" | \"close\" | \"copy\" | \"dashboard\" | \"date\" | \"download\" | \"drag\" | \"edit\" | \"etc\" | \"event\" | \"global\" | \"helpFill\" | \"helpOutline\" | \"history\" | \"imageFill\" | \"imageOutline\" | \"inline\" | \"line\" | \"location\" | \"logout\" | \"minus\" | \"new\" | \"notificationFill\" | \"notificationOutline\" | \"notion\" | \"outline\" | \"pageEdit\" | \"pageMove\" | \"pdf\" | \"print\" | \"remove\" | \"reset\" | \"robot\" | \"row\" | \"save\" | \"search\" | \"setting\" | \"star\" | \"synchronize\" | \"updown\" | \"user\" | \"visibilityOff\" | \"visibilityOn\" | \"warehouseFill\" | \"warehouseOutline\" | \"warningFill\" | \"warningOutline\" | \"youtube\"",
                     "references": {
                         "IconName": {
                             "location": "global",
@@ -255,18 +258,18 @@ export class SdTooltip {
                 "attribute": "label",
                 "defaultValue": "''"
             },
-            "buttonSize": {
+            "name": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "ButtonSize",
-                    "resolved": "\"lg\" | \"md\" | \"sm\" | \"xs\"",
+                    "original": "ButtonName",
+                    "resolved": "\"danger_lg\" | \"danger_md\" | \"danger_outline_lg\" | \"danger_outline_md\" | \"danger_outline_sm\" | \"danger_outline_xs\" | \"danger_sm\" | \"danger_xs\" | \"neutral_outline_lg\" | \"neutral_outline_md\" | \"neutral_outline_sm\" | \"neutral_outline_xs\" | \"primary_lg\" | \"primary_md\" | \"primary_outline_lg\" | \"primary_outline_md\" | \"primary_outline_sm\" | \"primary_outline_xs\" | \"primary_sm\" | \"primary_xs\" | \"secondary_lg\" | \"secondary_md\" | \"secondary_sm\" | \"secondary_xs\"",
                     "references": {
-                        "ButtonSize": {
+                        "ButtonName": {
                             "location": "import",
-                            "path": "../sd-button/sd-button",
-                            "id": "src/components/sd-button/sd-button.tsx::ButtonSize",
-                            "referenceLocation": "ButtonSize"
+                            "path": "../sd-button/sd-button.config",
+                            "id": "src/components/sd-button/sd-button.config.ts::ButtonName",
+                            "referenceLocation": "ButtonName"
                         }
                     }
                 },
@@ -279,25 +282,42 @@ export class SdTooltip {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
-                "attribute": "button-size",
-                "defaultValue": "'sm'"
+                "attribute": "name",
+                "defaultValue": "'primary_sm'"
             },
-            "buttonVariant": {
+            "rightIcon": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "ButtonVariant",
-                    "resolved": "\"ghost\" | \"outline\" | \"primary\"",
+                    "original": "IconName",
+                    "resolved": "\"add\" | \"alert\" | \"alignKorean\" | \"archive\" | \"arrowDown\" | \"arrowLeft\" | \"arrowRight\" | \"arrowUp\" | \"attachFile\" | \"barcode\" | \"bell\" | \"board\" | \"box\" | \"camera\" | \"cancelFill\" | \"cancelOutline\" | \"caretDown\" | \"caretLeft\" | \"caretRight\" | \"caretUp\" | \"check\" | \"checkFill\" | \"checkOutline\" | \"checkboxCheck\" | \"checkboxIndeterminate\" | \"chevronDown\" | \"chevronLeft\" | \"chevronLeftEnd\" | \"chevronRight\" | \"chevronRightEnd\" | \"chevronUp\" | \"clockFill\" | \"clockOutline\" | \"close\" | \"copy\" | \"dashboard\" | \"date\" | \"download\" | \"drag\" | \"edit\" | \"etc\" | \"event\" | \"global\" | \"helpFill\" | \"helpOutline\" | \"history\" | \"imageFill\" | \"imageOutline\" | \"inline\" | \"line\" | \"location\" | \"logout\" | \"minus\" | \"new\" | \"notificationFill\" | \"notificationOutline\" | \"notion\" | \"outline\" | \"pageEdit\" | \"pageMove\" | \"pdf\" | \"print\" | \"remove\" | \"reset\" | \"robot\" | \"row\" | \"save\" | \"search\" | \"setting\" | \"star\" | \"synchronize\" | \"updown\" | \"user\" | \"visibilityOff\" | \"visibilityOn\" | \"warehouseFill\" | \"warehouseOutline\" | \"warningFill\" | \"warningOutline\" | \"youtube\" | undefined",
                     "references": {
-                        "ButtonVariant": {
-                            "location": "import",
-                            "path": "../sd-button/sd-button",
-                            "id": "src/components/sd-button/sd-button.tsx::ButtonVariant",
-                            "referenceLocation": "ButtonVariant"
+                        "IconName": {
+                            "location": "global",
+                            "id": "global::IconName"
                         }
                     }
                 },
                 "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "right-icon"
+            },
+            "ariaLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
                 "optional": false,
                 "docs": {
                     "tags": [],
@@ -306,10 +326,10 @@ export class SdTooltip {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
-                "attribute": "button-variant",
-                "defaultValue": "'primary'"
+                "attribute": "aria-label",
+                "defaultValue": "''"
             },
-            "noHover": {
+            "disabled": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -326,8 +346,35 @@ export class SdTooltip {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
-                "attribute": "no-hover",
-                "defaultValue": "true"
+                "attribute": "disabled",
+                "defaultValue": "false"
+            },
+            "type": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "ButtonType",
+                    "resolved": "\"button\" | \"reset\" | \"submit\"",
+                    "references": {
+                        "ButtonType": {
+                            "location": "import",
+                            "path": "../sd-button/sd-button.config",
+                            "id": "src/components/sd-button/sd-button.config.ts::ButtonType",
+                            "referenceLocation": "ButtonType"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "type",
+                "defaultValue": "'button'"
             },
             "sdClass": {
                 "type": "string",

package/dist/collection/utils/color/resolveColor.js

@@ -3,8 +3,8 @@ const colors = rawColors;
 // 주어진 문자열이 color.json의 키이면 매핑된 HEX를 반환하고,
 // 아닐 경우 원문 그대로를 반환합니다. 값이 falsy면 기본 색상으로 대체합니다.
 export function resolveColor(input, fallback = '#025497') {
-    if (!input)
+    if (input === null || input === undefined || input === '')
         return fallback;
     const mapped = colors[input];
-    return mapped || input;
+    return mapped !== undefined && mapped !== '' ? mapped : input;
 }

package/dist/collection/utils/dropdown-manager.js

@@ -2,7 +2,7 @@ class DropdownManager {
     static instance;
     activeDropdowns = new Set();
     static getInstance() {
-        if (!DropdownManager.instance) {
+        if (DropdownManager.instance === undefined) {
             DropdownManager.instance = new DropdownManager();
         }
         return DropdownManager.instance;

package/dist/collection/utils/toast.js

@@ -1,8 +1,8 @@
 let containerEl = null;
 function applyGlobalOptions(container, options) {
-    if (!options)
+    if (options === undefined)
         return;
-    if (options.position)
+    if (options.position !== undefined)
         container.setAttribute('position', options.position);
     if (options.maxVisible != null)
         container.setAttribute('max-visible', String(options.maxVisible));
@@ -44,13 +44,13 @@ export const sdToast = {
         return container.create({ message, type, ...restOptions });
     },
     async dismiss(id) {
-        if (!containerEl)
+        if (containerEl == null)
             return;
         await whenReady(containerEl);
         return containerEl.dismiss(id);
     },
     async dismissAll() {
-        if (!containerEl)
+        if (containerEl == null)
             return;
         await whenReady(containerEl);
         return containerEl.dismissAll();

package/dist/components/index.js

@@ -1 +1 @@
-export{g as getAssetPath,r as render,s as setAssetPath,a as setNonce,b as setPlatformOptions}from"./p-D3gjBBCU.js";import{c as t}from"./p-DRVnqiWc.js";let n=null;function e(t,n){n&&(n.position&&t.setAttribute("position",n.position),null!=n.maxVisible&&t.setAttribute("max-visible",n.maxVisible+""),null!=n.defaultDuration&&t.setAttribute("default-duration",n.defaultDuration+""),null!=n.zIndex&&t.setAttribute("z-index",n.zIndex+""))}function o(t){return n&&document.body.contains(n)?(e(n,t),n):(n=document.createElement("sd-toast-container"),e(n,t),document.body.appendChild(n),n)}function i(t){return"function"==typeof t.create?Promise.resolve():new Promise((n=>{const e=()=>{"function"==typeof t.create?n():requestAnimationFrame(e)};requestAnimationFrame(e)}))}const c={async create(t,n,e){const{globalOptions:s,...r}=e??{},c=o(s);return await i(c),c.create({message:t,type:n,...r})},async dismiss(t){if(n)return await i(n),n.dismiss(t)},async dismissAll(){if(n)return await i(n),n.dismissAll()},configure(t){o(t)}},u="sd-modal-container";let d=null;const l={ok:"confirm",cancel:"cancel",close:"close"};class m{modalId;okFn;cancelFn;closeFn;clickFn;dismissedFn;containerRef;pendingActions=[];dismissRequested=!1;constructor(t,n){this.modalId=t,this.containerRef=n}onOk(t){return this.okFn=t,this}onCancel(t){return this.cancelFn=t,this}onClose(t){return this.closeFn=t,this}onClick(t){return this.clickFn=t,this}onDismissed(t){return this.dismissedFn=t,this}update(t){return this.runOrQueue((()=>{this.containerRef.update?.(this.modalId,t)})),this}ok(){return this.dismiss("ok")}cancel(){return this.dismiss("cancel")}close(){return this.dismiss("close")}dismiss(t="close"){if(this.dismissRequested)return this;this.dismissRequested=!0;const n=l[t];return this.runOrQueue((()=>{this.containerRef.dismissById?.(this.modalId,n)})),this}_triggerOk(){this.okFn?.()}_triggerCancel(){this.cancelFn?.()}_triggerClose(){this.closeFn?.()}_triggerClick(){this.clickFn?.()}_triggerDismissed(){this.dismissedFn?.()}_setId(t){this.modalId=t;const n=[...this.pendingActions];this.pendingActions=[],n.forEach((t=>t()))}_setContainer(t){this.containerRef=t}runOrQueue(t){this.modalId&&this.containerRef?t():this.pendingActions.push(t)}}function f(){if("undefined"==typeof window||"undefined"==typeof document||"undefined"==typeof customElements)throw Error("[sdModal] Browser APIs are unavailable. Use `sdModal` only on the client.")}function h(){if(f(),function(){if(!customElements.get(u))throw Error("[sdModal] `sd-modal-container` is not registered. Call `defineCustomElements(window)` before using `sdModal`.")}(),d&&d.isConnected)return d;const t=document.createElement(u);return t.setAttribute("auto-remove",""),document.body.appendChild(t),d=t,t}async function w(t){if(await customElements.whenDefined(u),"function"==typeof t.open)return Promise.resolve();throw Error("[sdModal] `sd-modal-container` is registered but not ready to open dialogs.")}function p(){return new m("")}function y(t,n){const{component:e,persistent:s}=n,o=h(),i={persistent:s};t._setContainer(o),w(o).then((async()=>{const n=await o.createCustom(e,i,t);t._setId(n)}))}const E={confirm(t){const n=h(),e=new m("",n);return w(n).then((async()=>{const s=await n.open(t,e);e._setId(s)})),e},loading(t={}){const n=h(),e=new m("",n);return w(n).then((async()=>{const s=await n.openLoading(t,e);e._setId(s)})),e},create(t){const n=p();return y(n,t),n},configure(n){f(),t(n)}},C="sd-loading-container";let k=null;async function A(t){const n=(function(){if("undefined"==typeof window||"undefined"==typeof document||"undefined"==typeof customElements)throw Error("[sdLoading] Browser APIs are unavailable. Use `sdLoading` only on the client.")}(),function(){if(!customElements.get(C))throw Error("[sdLoading] `sd-loading-container` is not registered. Call `defineCustomElements(window)` before using `sdLoading`.")}(),k&&document.body.contains(k)||(k=document.createElement(C),document.body.appendChild(k)),k);await customElements.whenDefined(C),t(n)}const P={show(t={}){A((n=>{n.show?.(t)}))},hide(){k&&A((t=>{t.hide?.()}))}};export{y as _attachSdModalWithRef,p as _createSdModalRef,P as sdLoading,E as sdModal,c as sdToast}
+export{g as getAssetPath,r as render,s as setAssetPath,a as setNonce,b as setPlatformOptions}from"./p-lyB7zSp-.js";import{c as t}from"./p-DRVnqiWc.js";let n=null;function e(t,n){void 0!==n&&(void 0!==n.position&&t.setAttribute("position",n.position),null!=n.maxVisible&&t.setAttribute("max-visible",n.maxVisible+""),null!=n.defaultDuration&&t.setAttribute("default-duration",n.defaultDuration+""),null!=n.zIndex&&t.setAttribute("z-index",n.zIndex+""))}function o(t){return n&&document.body.contains(n)?(e(n,t),n):(n=document.createElement("sd-toast-container"),e(n,t),document.body.appendChild(n),n)}function i(t){return"function"==typeof t.create?Promise.resolve():new Promise((n=>{const e=()=>{"function"==typeof t.create?n():requestAnimationFrame(e)};requestAnimationFrame(e)}))}const c={async create(t,n,e){const{globalOptions:s,...r}=e??{},c=o(s);return await i(c),c.create({message:t,type:n,...r})},async dismiss(t){if(null!=n)return await i(n),n.dismiss(t)},async dismissAll(){if(null!=n)return await i(n),n.dismissAll()},configure(t){o(t)}},u="sd-modal-container";let d=null;const l={ok:"confirm",cancel:"cancel",close:"close"};class m{modalId;okFn;cancelFn;closeFn;clickFn;dismissedFn;containerRef;pendingActions=[];dismissRequested=!1;constructor(t,n){this.modalId=t,this.containerRef=n}onOk(t){return this.okFn=t,this}onCancel(t){return this.cancelFn=t,this}onClose(t){return this.closeFn=t,this}onClick(t){return this.clickFn=t,this}onDismissed(t){return this.dismissedFn=t,this}update(t){return this.runOrQueue((()=>{this.containerRef.update?.(this.modalId,t)})),this}ok(){return this.dismiss("ok")}cancel(){return this.dismiss("cancel")}close(){return this.dismiss("close")}dismiss(t="close"){if(this.dismissRequested)return this;this.dismissRequested=!0;const n=l[t];return this.runOrQueue((()=>{this.containerRef.dismissById?.(this.modalId,n)})),this}_triggerOk(){this.okFn?.()}_triggerCancel(){this.cancelFn?.()}_triggerClose(){this.closeFn?.()}_triggerClick(){this.clickFn?.()}_triggerDismissed(){this.dismissedFn?.()}_setId(t){this.modalId=t;const n=[...this.pendingActions];this.pendingActions=[],n.forEach((t=>t()))}_setContainer(t){this.containerRef=t}runOrQueue(t){this.modalId&&this.containerRef?t():this.pendingActions.push(t)}}function f(){if("undefined"==typeof window||"undefined"==typeof document||"undefined"==typeof customElements)throw Error("[sdModal] Browser APIs are unavailable. Use `sdModal` only on the client.")}function h(){if(f(),function(){if(!customElements.get(u))throw Error("[sdModal] `sd-modal-container` is not registered. Call `defineCustomElements(window)` before using `sdModal`.")}(),d&&d.isConnected)return d;const t=document.createElement(u);return t.setAttribute("auto-remove",""),document.body.appendChild(t),d=t,t}async function w(t){if(await customElements.whenDefined(u),"function"==typeof t.open)return Promise.resolve();throw Error("[sdModal] `sd-modal-container` is registered but not ready to open dialogs.")}function p(){return new m("")}function y(t,n){const{component:e,persistent:s}=n,o=h(),i={persistent:s};t._setContainer(o),w(o).then((async()=>{const n=await o.createCustom(e,i,t);t._setId(n)}))}const E={confirm(t){const n=h(),e=new m("",n);return w(n).then((async()=>{const s=await n.open(t,e);e._setId(s)})),e},loading(t={}){const n=h(),e=new m("",n);return w(n).then((async()=>{const s=await n.openLoading(t,e);e._setId(s)})),e},create(t){const n=p();return y(n,t),n},configure(n){f(),t(n)}},C="sd-loading-container";let k=null;async function A(t){const n=(function(){if("undefined"==typeof window||"undefined"==typeof document||"undefined"==typeof customElements)throw Error("[sdLoading] Browser APIs are unavailable. Use `sdLoading` only on the client.")}(),function(){if(!customElements.get(C))throw Error("[sdLoading] `sd-loading-container` is not registered. Call `defineCustomElements(window)` before using `sdLoading`.")}(),k&&document.body.contains(k)||(k=document.createElement(C),document.body.appendChild(k)),k);await customElements.whenDefined(C),t(n)}const P={show(t={}){A((n=>{n.show?.(t)}))},hide(){k&&A((t=>{t.hide?.()}))}};export{y as _attachSdModalWithRef,p as _createSdModalRef,P as sdLoading,E as sdModal,c as sdToast}

package/dist/components/p--t9jBTYS.js

@@ -0,0 +1 @@
+import{p as e,H as s,c as t,h as i,t as a}from"./p-lyB7zSp-.js";import{n as d}from"./p-CCwNgVmC.js";import{D as r,a as o}from"./p-B6cqMQaM.js";import{d as l}from"./p-Cx3jXw9J.js";import{d as n}from"./p-B73VhbYi.js";import{d as c}from"./p-CZmKBmKx.js";import{d as h}from"./p-MMkRcTBd.js";import{d as p}from"./p-h7eBUL4i.js";import{d as m}from"./p-C4PmGpW8.js";import{d as b}from"./p-D8WAP9T3.js";import{d as f}from"./p-BqkJ0rZv.js";import{d as u}from"./p-B1MabGRR.js";const g=e(class e extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.update=t(this,"sdUpdate",7),this.viewChange=t(this,"sdViewChange",7)}static CLOSE_ANIMATION_DURATION=150;get el(){return this}value=null;size="sm";placeholder="YYYY-MM-DD";selectable;disabled=!1;width="";label="";labelWidth="";addonLabel="";addonAlign="start";hint="";errorMessage="";rules=[];error=!1;icon=void 0;labelTooltip="";labelTooltipProps=null;isOpen=!1;isAnimatingOut=!1;focused=!1;hovered=!1;update;viewChange;triggerRef;formField;closeAnimationTimer;name=d();watchIsOpen(e){this.focused=e}async sdValidate(){return this.formField?.sdValidate()}async sdReset(){return this.formField?.sdReset()}async sdResetValidate(){return this.formField?.sdResetValidation()}closeDropdown(){this.isOpen&&(this.isOpen=!1,this.isAnimatingOut=!0,this.closeAnimationTimer&&clearTimeout(this.closeAnimationTimer),this.closeAnimationTimer=setTimeout((()=>{this.isAnimatingOut=!1}),e.CLOSE_ANIMATION_DURATION))}handleTriggerClick=()=>{this.disabled||(this.isOpen?this.closeDropdown():(this.closeAnimationTimer&&clearTimeout(this.closeAnimationTimer),this.isAnimatingOut=!1,this.isOpen=!0))};handleSelect=e=>{this.closeDropdown(),this.value=e.detail;const s=this.value;requestAnimationFrame((()=>{this.update.emit(s)}))};handleViewChange=e=>{this.viewChange.emit(e.detail)};disconnectedCallback(){this.closeAnimationTimer&&clearTimeout(this.closeAnimationTimer)}render(){const e=o[this.size]??o.sm;return i("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:e=>this.formField=e,onMouseEnter:()=>this.hovered=!0,onMouseLeave:()=>this.hovered=!1,style:{"--sd-system-size-field-sm-height":`${e.height}px`,"--sd-system-radius-field-sm":`${e.radius}px`,"--sd-system-color-field-border-default":r.border.default,"--sd-system-color-field-border-focus":r.border.focus,"--sd-system-color-field-bg-default":r.bg.default}},i("div",{key:"8b3d615b241860ec1fb314fa0eeef5f51ea32f43",class:"sd-date-picker",ref:e=>{this.triggerRef=e}},i("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)&&i("sd-portal",{key:"2cf151b52b3117de9c4d55bbc3c045b0a7b614e9",open:this.isOpen,parentRef:this.triggerRef,onSdClose:()=>this.closeDropdown()},i("sd-date-picker-calendar",{key:"9f77742d034dcb462eb1c4546b2c2a367544f97e",value:this.value,selectable:this.selectable,onSdSelect:this.handleSelect,onSdViewChange:this.handleViewChange})))}static get watchers(){return{isOpen:[{watchIsOpen:0}]}}static get style(){return"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%}"}},[512,"sd-date-picker",{value:[1025],size:[513],placeholder:[513],selectable:[16],disabled:[516],width:[8],label:[1],labelWidth:[8,"label-width"],addonLabel:[1,"addon-label"],addonAlign:[1,"addon-align"],hint:[1],errorMessage:[1,"error-message"],rules:[16],error:[1028],icon:[16],labelTooltip:[1,"label-tooltip"],labelTooltipProps:[16],name:[1],isOpen:[32],isAnimatingOut:[32],focused:[32],hovered:[32],sdValidate:[64],sdReset:[64],sdResetValidate:[64]},void 0,{isOpen:[{watchIsOpen:0}]}]);function k(){"undefined"!=typeof customElements&&["sd-date-picker","sd-button","sd-date-picker-calendar","sd-date-picker-trigger","sd-field","sd-floating-portal","sd-ghost-button","sd-icon","sd-portal","sd-tooltip"].forEach((e=>{switch(e){case"sd-date-picker":customElements.get(a(e))||customElements.define(a(e),g);break;case"sd-button":customElements.get(a(e))||l();break;case"sd-date-picker-calendar":customElements.get(a(e))||n();break;case"sd-date-picker-trigger":customElements.get(a(e))||c();break;case"sd-field":customElements.get(a(e))||h();break;case"sd-floating-portal":customElements.get(a(e))||p();break;case"sd-ghost-button":customElements.get(a(e))||m();break;case"sd-icon":customElements.get(a(e))||b();break;case"sd-portal":customElements.get(a(e))||f();break;case"sd-tooltip":customElements.get(a(e))||u()}}))}export{g as S,k as d}

package/dist/components/p-At6nBeyO.js

@@ -0,0 +1 @@
+import{p as t,H as s,h as e,d as i,t as o}from"./p-lyB7zSp-.js";import{T as l}from"./p-sZMi_32I.js";import{a as r,T as n,h}from"./p-CGQWERwE.js";import{d}from"./p-Dr1AMbBj.js";import{d as a}from"./p-D8WAP9T3.js";const c=t(class extends s{constructor(t){super(),!1!==t&&this.__registerHost()}get el(){return this}columns;selectable;stickyColumn;rowKey="";row={};tableId="";columnWidths=[];isVisible=!0;spansVersion=0;_columns=[];_selectable=!1;_stickyColumn={left:0,right:0};_scrolledLeft=!1;_scrolledRight=!1;tableEl=null;componentWillLoad(){this.syncTableContext(),this.columnWidths=this.columnWidths??[],this.resolveConfig(),this.columnWidths=this._columns.map((t=>parseInt(t.width||"120",10))),this.updateVisibilitySync()}componentDidLoad(){this.syncTableContext()}syncTableContext(){const t=this.el.closest("sd-table"),s=this.el.getRootNode(),e=s instanceof ShadowRoot?s.host:null,i=t??e;this.tableEl=i;const o=i?.getTableIdSync?.(),r=i?.getAttribute(l),n=(o&&"undefined"!==o?o:null)??(r&&"undefined"!==r?r:null)??"";n&&n!==this.tableId&&(this.tableId=n)}resolveConfig(){const t=this.tableEl?.getConfigSync?.();this._columns=this.columns??t?.columns??[],this._selectable=this.selectable??t?.selectable??!1,this._stickyColumn=this.stickyColumn??t?.stickyColumn??{left:0,right:0},this._scrolledLeft=t?.scrolledLeft??!1,this._scrolledRight=t?.scrolledRight??!1,t?.columnWidths&&0===(this.columnWidths??[]).length&&(this.columnWidths=[...t.columnWidths])}async refreshConfig(){this.resolveConfig()}async bumpSpansVersion(){this.spansVersion=this.spansVersion+1}async updateVisibility(){this.updateVisibilitySync()}updateVisibilitySync(){const t=parseInt(this.rowKey,10),s=this.tableEl?.getPaginationInfoSync?.();this.isVisible=!s||t>=s.startIndex&&t<s.endIndex}async setColumnWidths(t){this.columnWidths=t}async refreshSelection(){const t=this.el.querySelector("sd-checkbox");t&&(t.value=this.isSelected())}get visibleColumns(){return this._columns.filter((t=>!1!==t.visible))}formatValue(t){return null==t?"":"number"==typeof t?t.toLocaleString():String(t)}getCellValue(t){const{field:s,format:e,name:i}=t,o="function"==typeof s?s(this.row):s?this.row[s]:this.row[i];return e?e(o,this.row):this.formatValue(o)}getStickyStyle(t){return this.tableEl?.getStickyStyleSync?this.tableEl.getStickyStyleSync(t):{"--sticky-left-offset":`${this.columnWidths.slice(0,t).reduce(((t,s)=>t+s),0)+(this._selectable?52:0)}px`,"--sticky-right-offset":`${this.columnWidths.filter(((s,e)=>e>=this.visibleColumns.length-(this._stickyColumn.right||0)&&e>t)).reduce(((t,s)=>t+s),0)}px`,width:`${this.columnWidths[t]}px`,minWidth:`${this.columnWidths[t]}px`,maxWidth:`${this.columnWidths[t]}px`}}isSelected(){return!!this.tableEl?.isRowSelectedSync&&this.tableEl.isRowSelectedSync(this.row)}handleSelect(){this.tableEl?.updateRowSelectSync&&this.tableEl.updateRowSelectSync(this.row)}getSpanFor(t){if(this.tableEl?.getSpanSync)return this.tableEl.getSpanSync(this.rowKey,"string"==typeof t.field?t.field:t.name)}isCovered(t){return!!this.tableEl?.isCoveredSync&&this.tableEl.isCoveredSync(this.rowKey,t,this._columns)}getCellClassFor(t){if(this.tableEl?.getCellClassSync)return this.tableEl.getCellClassSync(this.rowKey,"string"==typeof t.field?t.field:t.name)}isVisualLastRow(t){return!!this.tableEl?.isVisualLastRowSync&&this.tableEl.isVisualLastRowSync(this.rowKey,"string"==typeof t.field?t.field:t.name)}isVisualLastRowForSelfRow(){return!!this.tableEl?.isVisualLastRowSync&&this.tableEl.isVisualLastRowSync(this.rowKey,"")}render(){const t=this._stickyColumn.left||0,s=this._stickyColumn.right||0,o=this.visibleColumns.slice(0,t),l=this.visibleColumns.slice(t,this.visibleColumns.length-s),d=this.visibleColumns.slice(this.visibleColumns.length-s),a=this.tableEl?.hasRowspanSync?.()??!1;return e(i,{key:"30e4127b281770d12fab9e9cfd2cdf667eff8790",style:{display:this.isVisible?"":"none","--table-body-height":`${h.default.height}px`,"--table-body-padding-x":`${h.paddingX}px`,"--table-body-font-family":n.fontFamily,"--table-body-font-weight":n.fontWeight,"--table-body-font-size":`${n.fontSize}px`,"--table-body-line-height":`${n.lineHeight}px`,"--table-body-text-decoration":n.textDecoration,"--table-border-color":r.color,"--table-border-width":`${r.width}px`}},e("tr",{key:"1072ce3f1b296e2278b7fc92a44d32da223ef119",class:{tr:!0,"tr--no-hover":a}},this._selectable&&e("td",{key:"4e3a37a320df97378a1ed311c0a7b8f744bd26bc",class:{td:!0,"td--selected":!0,"td--last-row":this.isVisualLastRowForSelfRow(),"sticky-left":!0,"sticky-left-edge":0===t,"is-scrolled-left":0===t&&this._scrolledLeft},style:{"--sticky-left-offset":"0px"}},e("sd-checkbox",{key:"b1a775462c4869f75480908bccd428714c63c257",value:this.isSelected(),onSdUpdate:()=>this.handleSelect()})),o.map(((s,i)=>{if(this.isCovered(i))return null;const o=this.getSpanFor(s),l=this.getCellClassFor(s);return e("td",{key:s.name,rowSpan:o?.rowspan,colSpan:o?.colspan,class:{td:!0,[`td--${s.align||"left"}`]:!0,"td--last-row":this.isVisualLastRow(s),"sticky-left":!0,"sticky-left-edge":i===t-1,"is-scrolled-left":i===t-1&&this._scrolledLeft,[`${s.tdClass}`]:Boolean(s.tdClass),[`${l}`]:Boolean(l)},style:this.getStickyStyle(i)},e("slot",{name:`${this.tableId}-${"string"==typeof s.field?s.field:s.name}-${this.rowKey}`},e("span",null,this.getCellValue(s))))})),l.map(((s,i)=>{const o=t+i;if(this.isCovered(o))return null;const l="string"==typeof s.field?s.field:s.name,r=this.getSpanFor(s),n=this.getCellClassFor(s);return e("td",{key:s.name,rowSpan:r?.rowspan,colSpan:r?.colspan,class:{td:!0,[`td--${s.align||"left"}`]:!0,"td--last-row":this.isVisualLastRow(s),[`${s.tdClass}`]:Boolean(s.tdClass),[`${n}`]:Boolean(n)},style:this.getStickyStyle(o)},e("slot",{name:`${this.tableId}-${l}-${this.rowKey}`},e("span",null,this.getCellValue(s))))})),d.map(((t,i)=>{const o=this.visibleColumns.length-s+i;if(this.isCovered(o))return null;const l="string"==typeof t.field?t.field:t.name,r=this.getSpanFor(t),n=this.getCellClassFor(t);return e("td",{key:t.name,rowSpan:r?.rowspan,colSpan:r?.colspan,class:{td:!0,[`td--${t.align||"left"}`]:!0,"td--last-row":this.isVisualLastRow(t),"sticky-right":!0,"sticky-right-edge":0===i,"is-scrolled-right":0===i&&this._scrolledRight,[`${t.tdClass}`]:Boolean(t.tdClass),[`${n}`]:Boolean(n)},style:this.getStickyStyle(o)},e("slot",{name:`${this.tableId}-${l}-${this.rowKey}`},e("span",null,this.getCellValue(t))))}))))}static get style(){return'sd-tr{display:contents}sd-tr *{box-sizing:border-box}.tr{display:table-row}.tr:hover .td{background-color:#F9F9F9}.tr--no-hover:hover .td{background-color:white}.td{display:table-cell;height:var(--table-body-height, 44px);padding:0 var(--table-body-padding-x, 16px);border-bottom:var(--table-border-width, 1px) solid var(--table-border-color, #E1E1E1);background:white;vertical-align:middle;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}.td--left{text-align:left}.td--center{text-align:center}.td--right{text-align:right}.td--selected{position:relative;width:52px !important;max-width:52px !important;min-width:52px !important;padding:0 10px 0 24px;text-align:left}.td--selected sd-checkbox label{position:relative}.td--selected sd-checkbox label:before{content:"";position:absolute;inset:-6px}.td.sticky-left{position:sticky;background-color:white;z-index:100 !important;left:var(--sticky-left-offset, 0)}.td.sticky-right{position:sticky;background-color:white;z-index:100 !important;right:var(--sticky-right-offset, 0)}.td.sticky-left-edge:after{content:"";position:absolute;top:0;left:100%;right:-20px;width:20px;height:100%;z-index:101 !important;box-shadow:inset 12px 0 20px -25px;opacity:0;pointer-events:none;transition:opacity 0.2s}.td.sticky-right-edge:after{content:"";position:absolute;top:0;left:-20px;width:20px;height:100%;z-index:101 !important;box-shadow:inset -12px 0 20px -25px;opacity:0;pointer-events:none;transition:opacity 0.2s}.td.sticky-left-edge.is-scrolled-left{overflow:visible}.td.sticky-left-edge.is-scrolled-left:after{opacity:1}.td.sticky-right-edge.is-scrolled-right{overflow:visible}.td.sticky-right-edge.is-scrolled-right:after{opacity:1}.tr:hover .td.sticky-left,.tr:hover .td.sticky-right{background-color:#F9F9F9}.tr--no-hover:hover .td.sticky-left,.tr--no-hover:hover .td.sticky-right{background-color:white}.td.td--last-row{border-bottom:none}'}},[772,"sd-tr",{columns:[16],selectable:[4],stickyColumn:[16],rowKey:[1,"row-key"],row:[16],tableId:[32],columnWidths:[32],isVisible:[32],spansVersion:[32],_columns:[32],_selectable:[32],_stickyColumn:[32],_scrolledLeft:[32],_scrolledRight:[32],refreshConfig:[64],bumpSpansVersion:[64],updateVisibility:[64],setColumnWidths:[64],refreshSelection:[64]}]);function p(){"undefined"!=typeof customElements&&["sd-tr","sd-checkbox","sd-icon"].forEach((t=>{switch(t){case"sd-tr":customElements.get(o(t))||customElements.define(o(t),c);break;case"sd-checkbox":customElements.get(o(t))||d();break;case"sd-icon":customElements.get(o(t))||a()}}))}export{c as S,p as d}

package/dist/components/p-B1MabGRR.js

@@ -0,0 +1 @@
+import{p as t,H as e,h as s,F as i,t as o}from"./p-lyB7zSp-.js";import{T as n}from"./p-CT3dfy3K.js";import{d as l}from"./p-Cx3jXw9J.js";import{d as a}from"./p-h7eBUL4i.js";import{d as c}from"./p-D8WAP9T3.js";var d={bg:"#07284A",content:"#FFFFFF"},r={bg:"#FCEFEF",content:"#FB4444"},h={bg:"#FEF1EA",content:"#FF6B00"},p={bg:"#E6F1FF",content:"#0075FF"};const f={default:{bg:d.bg,content:d.content},danger:{bg:r.bg,content:r.content},warning:{bg:h.bg,content:h.content},accent:{bg:p.bg,content:p.content}},m=t(class t extends e{constructor(t){super(),!1!==t&&this.__registerHost()}get el(){return this}trigger="hover";placement="top";color="#01BB4B";tooltipType="default";icon="helpOutline";iconSize=12;label="";name="primary_sm";rightIcon;ariaLabel="";disabled=!1;type="button";sdClass="";showTooltip=!1;slotContentHTML="";buttonEl;menuEl;hideTimeout;closeTimeout;static CLOSE_ANIM_MS=150;show=()=>{this.cancelHideTimer(),this.showTooltip=!0,this.menuEl&&this.menuEl.classList.remove("sd-floating-menu--closing")};hide=()=>{this.menuEl&&this.menuEl.classList.add("sd-floating-menu--closing"),this.closeTimeout=setTimeout((()=>{this.showTooltip=!1}),t.CLOSE_ANIM_MS)};startHideTimer=()=>{this.hideTimeout=setTimeout((()=>this.hide()),100)};cancelHideTimer=()=>{this.hideTimeout&&(clearTimeout(this.hideTimeout),this.hideTimeout=void 0),this.closeTimeout&&(clearTimeout(this.closeTimeout),this.closeTimeout=void 0)};get tooltipOffset(){switch(this.placement??"top"){case"top":return[0,-4];case"bottom":return[0,4];case"left":case"right":return[4,0]}}handleClose=()=>this.hide();componentWillLoad(){this.slotContentHTML=this.el.innerHTML,this.el.replaceChildren(),this.el.classList.toggle("visible",!0)}render(){const t=this.trigger??"hover",e=this.placement??"top",o=this.tooltipType??"default",l=this.icon??"helpOutline",a=this.color??"#01BB4B",c=f[o]??f.default,d=()=>this.showTooltip=!this.showTooltip,r=void 0!==this.label&&""!==this.label;return s(i,{key:"09f5966903bddf016cf6c2b32d3514f312fd1c99"},s("div",{key:"eef176cc0df93e5aaa272ccf18f137c23db767fd",class:`sd-tooltip-trigger ${void 0!==this.sdClass&&""!==this.sdClass?this.sdClass:""}`,..."hover"===t?{onMouseEnter:()=>this.show(),onMouseLeave:()=>this.startHideTimer()}:r?{}:{onClick:d}},r?s("sd-button",{ref:t=>this.buttonEl=t,name:this.name??"primary_sm",label:this.label,icon:l,rightIcon:this.rightIcon,ariaLabel:this.ariaLabel,disabled:this.disabled,type:this.type??"button",class:"sd-tooltip",..."click"===t&&r?{onSdClick:d}:{}}):s("sd-icon",{ref:t=>this.buttonEl=t,name:l,size:this.iconSize??12,color:a,class:"sd-tooltip"})),this.showTooltip&&s("sd-floating-portal",{key:"1d5d14826c26e843ed3ddedca9f1a9369009477c",parentRef:this.buttonEl,onSdClose:this.handleClose,placement:e,offset:this.tooltipOffset},s("div",{key:"b9ebcdb8f0798cb6c9ad0997caca6d0d20c3ece5",ref:t=>this.menuEl=t,class:{"sd-floating-menu":!0,[`sd-floating-menu--${o}`]:!0,[`sd-floating-menu--${e}`]:!0},style:{"--sd-floating-bg":c.bg,"--sd-floating-content":c.content},onMouseEnter:()=>this.show(),onMouseLeave:()=>this.startHideTimer()},s("i",{key:"d3b68903dd12cdfe330e5f27cd4f5261ef3b1121",class:`sd-floating-menu__arrow sd-floating-menu__arrow--${e}`},s(n,{key:"5228831f5660a1f4844550778fc98d707949a893"})),s("div",{key:"dfb78d2189d6e4d1301e95c7ab6976e173f48cdc",class:"sd-floating-menu__content",innerHTML:this.slotContentHTML}))))}static get style(){return"sd-tooltip{visibility:hidden !important;display:inline-flex}sd-tooltip.visible{visibility:visible !important}sd-tooltip .sd-tooltip-trigger{display:inline-flex;position:relative;cursor:pointer;align-items:center;justify-content:center}"}},[512,"sd-tooltip",{trigger:[1],placement:[1],color:[1],tooltipType:[1,"tooltip-type"],icon:[1],iconSize:[2,"icon-size"],label:[1],name:[1],rightIcon:[1,"right-icon"],ariaLabel:[1,"aria-label"],disabled:[4],type:[1],sdClass:[1,"sd-class"],showTooltip:[32],slotContentHTML:[32]}]);function u(){"undefined"!=typeof customElements&&["sd-tooltip","sd-button","sd-floating-portal","sd-icon"].forEach((t=>{switch(t){case"sd-tooltip":customElements.get(o(t))||customElements.define(o(t),m);break;case"sd-button":customElements.get(o(t))||l();break;case"sd-floating-portal":customElements.get(o(t))||a();break;case"sd-icon":customElements.get(o(t))||c()}}))}export{m as S,u as d}