npm - @sellmate/design-system - Versions diffs - 1.1.0 → 1.3.0 - Mend

@sellmate/design-system 1.1.0 → 1.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (402) hide show

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

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

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

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

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

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

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

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

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

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-BlxrCRYi.js');
+var index = require('./index-Cw-78mnC.js');
 var component_progress = require('./component.progress-Bmg3vAAy.js');
 var system = require('./system-VmZRYp6V.js');
@@ -49,7 +49,7 @@ const SdLinearProgress = class {
             clipPath: `inset(0 ${100 - this.clampedValue}% 0 0)`,
         };
         const valueText = `${Math.round(this.clampedValue)}%`;
-        return (index.h(index.Host, { key: '58849d88024bc69ab0260bdf32f461fdfb87c93c', style: hostStyle }, index.h("div", { key: 'a4370fbc94bdf7b51d4a27f85ca86606c3770cdb', class: 'sd-linear-progress__track' }, index.h("div", { key: 'e270357433247981f8374a0345cb2d3ba8d4cfca', class: 'sd-linear-progress__fill', style: fillStyle }), !this.indeterminate && (index.h("span", { key: 'baa77fe44a7129330e8fe70b8aa2e8bc6fd4b703', class: 'sd-linear-progress__value sd-linear-progress__value--on-track' }, valueText)), !this.indeterminate && (index.h("span", { key: '46a73b233ea34c1d9ac242140abe3b1e5831d484', class: 'sd-linear-progress__value sd-linear-progress__value--on-fill', style: valueOnFillStyle }, valueText))), this.label && index.h("span", { key: '91d5c9cc27960c7448706e641028bcc8f893b805', class: 'sd-linear-progress__label' }, this.label)));
+        return (index.h(index.Host, { key: '6fb48662dc2c921237a387c748bbc529ba5ea77f', style: hostStyle }, index.h("div", { key: 'e8fa0fdf4ac3ceeaae74fff6194c1f66b9138bc7', class: 'sd-linear-progress__track' }, index.h("div", { key: '7016850214e73fc6a9079e8f54674976d0320adf', class: 'sd-linear-progress__fill', style: fillStyle }), !this.indeterminate && (index.h("span", { key: '154b18f54d79ddbacf720370dc9ace94508c6667', class: 'sd-linear-progress__value sd-linear-progress__value--on-track' }, valueText)), !this.indeterminate && (index.h("span", { key: '555e41d961ad7d061ac71347e998641d104f499d', class: 'sd-linear-progress__value sd-linear-progress__value--on-fill', style: valueOnFillStyle }, valueText))), this.label && index.h("span", { key: 'f90f3df3b959aee549fab33a62a85d6df6ba8410', class: 'sd-linear-progress__label' }, this.label)));
     }
 };
 SdLinearProgress.style = sdLinearProgressCss();

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

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-BlxrCRYi.js');
+var index = require('./index-Cw-78mnC.js');
 const sdLoadingContainerCss = () => `sd-loading-container .sd-loading-container{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:var(--sd-loading-container-z-index, 999);opacity:0;visibility:hidden;transition:opacity 0.2s ease, visibility 0s linear 0.2s;pointer-events:none}sd-loading-container .sd-loading-container--visible{opacity:1;visibility:visible;transition:opacity 0.2s ease, visibility 0s linear 0s;pointer-events:auto}sd-loading-container .sd-loading-container__backdrop{position:absolute;inset:0;background:rgba(0, 0, 0, 0.4)}sd-loading-container .sd-loading-container__content{position:relative;display:flex;flex-direction:column;align-items:center;gap:16px}sd-loading-container .sd-loading-container__message{margin:0;color:#ffffff;font-size:14px;font-weight:500;line-height:22px;text-align:center;max-width:400px;word-break:keep-all}`;
@@ -18,10 +18,10 @@ const SdLoadingContainer = class {
         this.visible = false;
     }
     render() {
-        return (index.h("div", { key: '1c684984ec7203edb4206690026cf8085bfadcfb', class: {
+        return (index.h("div", { key: '08675a9dc0b1c11c42fb65a414f0fed88d03f1b0', class: {
                 'sd-loading-container': true,
                 'sd-loading-container--visible': this.visible,
-            }, "aria-hidden": this.visible ? 'false' : 'true' }, index.h("div", { key: '42a7d3b6c0f562cbfd1a0928a3df4df3cc962299', class: "sd-loading-container__backdrop" }), index.h("div", { key: 'ce11d0950e5047eb47ae87f41bf7c049a2e18cbc', class: "sd-loading-container__content" }, index.h("sd-circle-progress", { key: 'e6f63c78da63cf660942137e73cef389789e83b0', indeterminate: true, type: "inverse" }), this.message && (index.h("p", { key: '139b648a8a8007a050f6e81374930f92d676707c', class: "sd-loading-container__message" }, this.message)))));
+            }, "aria-hidden": this.visible ? 'false' : 'true' }, index.h("div", { key: '4a10e9009d824bef1bf2f9930941931dc1fef43a', class: "sd-loading-container__backdrop" }), index.h("div", { key: '88edd1c19f5d22057e1e14f1e6bd10e23f45ec7b', class: "sd-loading-container__content" }, index.h("sd-circle-progress", { key: 'b9c67678d799e429ec6cb2d3094da7bcc4cea150', indeterminate: true, type: "inverse" }), this.message && (index.h("p", { key: 'ce016465e9d8b20f2121e8846bff75bbad5d7d94', class: "sd-loading-container__message" }, this.message)))));
     }
 };
 SdLoadingContainer.style = sdLoadingContainerCss();

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

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-BlxrCRYi.js');
+var index = require('./index-Cw-78mnC.js');
 var modalStack = require('./modal-stack-DucFLON7.js');
 const sdModalContainerCss = () => `sd-modal-container{display:block}sd-modal-container .sd-modal-container{position:fixed;inset:0;z-index:var(--sd-modal-container-z-index, 997);pointer-events:none}sd-modal-container .sd-modal-container__layer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}sd-modal-container .sd-modal-container__backdrop{position:absolute;inset:0;background:rgba(0, 0, 0, 0.4);opacity:0;transition:opacity 0.3s ease-out;pointer-events:none}sd-modal-container .sd-modal-container__backdrop--visible{opacity:1;pointer-events:auto}sd-modal-container .sd-modal-container__modal{position:relative;z-index:1;opacity:0;transform:scale(0);pointer-events:auto;transition:opacity 0.3s ease-out, transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1)}sd-modal-container .sd-modal-container__modal--visible{opacity:1;transform:scale(1)}sd-modal-container .sd-modal-container__modal--shake{animation:modal-shake 0.3s ease-out}@keyframes modal-shake{0%,100%{transform:scale(1)}25%{transform:scale(1.03)}50%{transform:scale(0.97)}75%{transform:scale(1.01)}}`;
@@ -74,7 +74,7 @@ const SdModalContainer = class {
                     const current = this.entries.find(e => e.id === id);
                     if (!current || current.closing || !modalEl.isConnected)
                         return;
-                    this.entries = this.entries.map(e => e.id === id ? { ...e, backdropVisible: true } : e);
+                    this.entries = this.entries.map(e => (e.id === id ? { ...e, backdropVisible: true } : e));
                     modalEl.classList.add('sd-modal-container__modal--visible');
                 });
             });
@@ -266,7 +266,7 @@ const SdModalContainer = class {
         el.setAttribute(name, value);
     }
     render() {
-        if (!this.entries?.length)
+        if ((this.entries?.length ?? 0) === 0)
             return null;
         return (index.h("div", { class: "sd-modal-container" }, this.entries.map((entry, index$1) => (index.h("div", { key: entry.id, class: "sd-modal-container__layer", style: { zIndex: String(index$1 + 1) }, "data-modal-id": entry.id, ref: el => {
                 if (el)