@sellmate/design-system 1.9.0 → 1.11.0

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

@@ -818,24 +818,24 @@ export class SdTable {
             '--table-selectable-width': `${TABLE_SELECTABLE_COLUMN_WIDTH}px`,
             '--table-host-height': hostHeight,
         };
-        return (h(Host, { key: '4ff57911317dc62deffef856f33388973fa4daa7', style: hostStyle }, h("div", { key: '10ace7494c9c7af101c8409b0c2156b3cc2a289f', class: "sd-table__container", style: {
+        return (h(Host, { key: '164ba96033be0195fa50e3d4d684059b9c471479', style: hostStyle }, h("div", { key: '2f1a1be73f86c72e7caa46981ee691d29bb237c7', class: "sd-table__container", style: {
                 '--table-width': this.width,
                 '--pagination-height': `${paginationHeight}px`,
-            } }, h("div", { key: '97d0d9e3ad3184fcd10eb2850c66570ac0f2d3cf', class: {
+            } }, h("div", { key: '16976d24d4c21714183f9691b06c503b86388c54', class: {
                 'sd-table__wrapper': true,
                 'sd-table__wrapper--use-top': this.useTop,
-            } }, h("div", { key: '5317351ccca4e10af0ed6ecb5b077b4f22b95f27', class: {
+            } }, h("div", { key: 'fdd0dcfbff4c3a5e441d720d2e1a39a69c51f9cf', class: {
                 'sd-table__scroll-container': true,
                 'sd-table__scroll-container--loading': this.isLoading,
                 'sd-table__scroll-container--no-data': isNoData,
-            } }, this.isLoading && (h("div", { key: 'bb34b1fce3210ea7245bb282818dee6d35be0dac', class: "sd-table__loading", style: { top: `${this.loadingScrollTop}px` } }, h("sd-circle-progress", { key: '5a6103e03854583ef16ab45f442c2b0e9ea635f3', indeterminate: true }))), isNoData && (h(h.Fragment, null, h("div", { key: 'f2c3836bd2c69980603f93a4b241533a18a10d2c', class: "sd-table__no-data-header-overlay" }), h("div", { key: '7b44240dcd92522bd5b02da01a8868c5ba91f3bc', class: "sd-table__no-data" }, h("div", { key: '3ea50fc748f6ace4941d6d28f80acb458b07d206', class: "sd-table__no-data-content", ref: el => {
+            } }, this.isLoading && (h("div", { key: 'facb26c0d1651d4a2a6e0dee5c1b8ca73586de89', class: "sd-table__loading", style: { top: `${this.loadingScrollTop}px` } }, h("sd-circle-progress", { key: '844b92fc9fc38f95d51092b698b67b685bcba076', indeterminate: true }))), isNoData && (h(h.Fragment, null, h("div", { key: '458c8e24b85c0e7c99afe940c3d5856e63bc582a', class: "sd-table__no-data-header-overlay" }), h("div", { key: 'bd29a77ac11da7e5d513955a4c4baa0dd89a623d', class: "sd-table__no-data" }, h("div", { key: '7db0e8e3888e97638f3c78d560e844cc0f8b2944', class: "sd-table__no-data-content", ref: el => {
                 this.noDataContentEl = el;
                 if (el)
                     this.syncNoDataContentObserver();
-            } }, h("slot", { key: 'f3d20d973c6e4e416bfbecefd55e373425949602', name: "no-data" }, h("span", { key: '5fe8b1fe2a358a393e18587a3bf2a5c37294ff6b' }, this.resolvedNoDataLabel)))))), h("table", { key: 'c8b5304b4ae1828f7a3c0aaedb5b37d40c071378', class: this.tableClasses }, this.autoThead ? (h("slot", { name: `${resolvedTableId}-head`, onSlotchange: this.handleStructureSlotChange }, h("sd-thead", { rows: this.rows ?? [] }))) : (h("slot", { name: `${resolvedTableId}-head`, onSlotchange: this.handleStructureSlotChange })), this.autoTbody ? (h("slot", { name: `${resolvedTableId}-body`, onSlotchange: this.handleStructureSlotChange }, h("sd-tbody", { rows: this.rows ?? [] }, this.renderAutoRows()))) : (h("slot", { name: `${resolvedTableId}-body`, onSlotchange: this.handleStructureSlotChange }))))), this.pagination &&
+            } }, h("slot", { key: 'fa175041907d4af7e5e0db7cad6e9a3e16e96901', name: "no-data" }, h("span", { key: '3fae3a23d86dc543502f74574a4b5c3f026b9992' }, this.resolvedNoDataLabel)))))), h("table", { key: '9ae98e0697e045b308f7e584fb496692acade8ba', class: this.tableClasses }, this.autoThead ? (h("slot", { name: `${resolvedTableId}-head`, onSlotchange: this.handleStructureSlotChange }, h("sd-thead", { rows: this.rows ?? [] }))) : (h("slot", { name: `${resolvedTableId}-head`, onSlotchange: this.handleStructureSlotChange })), this.autoTbody ? (h("slot", { name: `${resolvedTableId}-body`, onSlotchange: this.handleStructureSlotChange }, h("sd-tbody", { rows: this.rows ?? [] }, this.renderAutoRows()))) : (h("slot", { name: `${resolvedTableId}-body`, onSlotchange: this.handleStructureSlotChange }))))), this.pagination &&
             this.pagination.rowsPerPage > 0 &&
             this.rowCount > 0 &&
-            !this.useVirtualScroll && (h("div", { key: '462bd9e4eab9ea45ec6ebf1c510c652c47659b1a', class: "sd-table__pagination" }, h("sd-pagination", { key: 'b934539ab253b1ca7ec2ffd7dfccc576762e0455', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onSdPageChange: (e) => this.changePage(e.detail) }), this.useRowsPerPageSelect && (h("sd-select", { key: '4c636cbf4f04c189018ae32dff24444aab0d480a', value: this.useInternalPagination
+            !this.useVirtualScroll && (h("div", { key: 'a0da779351490332035ec784bc301ea2cb017afd', class: "sd-table__pagination" }, h("sd-pagination", { key: '8c3bcd06e1644afaebabd3762cdb03900f727142', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onSdPageChange: (e) => this.changePage(e.detail) }), this.useRowsPerPageSelect && (h("sd-select", { key: '4bff157ac6e0fb5efe03663d4bbf58d67f8308b6', value: this.useInternalPagination
                 ? this.innerRowsPerPage
                 : this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", emitValue: true, onSdUpdate: e => {
                 if (!this.isRowsPerPageValue(e.detail))

package/dist/collection/components/sd-table/sd-tbody/sd-tbody.js

@@ -45,9 +45,9 @@ export class SdTbody {
         }
     }
     render() {
-        return (h(Host, { key: '835dc8ccba601a916fdd8466176a8ad8896c2bf7', slot: `${this.tableId}-body` }, h("tbody", { key: 'e2013dde727695abc366e4e3a1660c8a5835fe67', class: { tbody: true } }, [
+        return (h(Host, { key: 'bc05db24c914d72f0480e0d6d9b594e21cf03153', slot: `${this.tableId}-body` }, h("tbody", { key: 'ba4eb8fcbc184bcd245f47093ca5acfacc3aebf3', class: { tbody: true } }, [
             this.topSpacerHeight > 0 && (h("tr", { key: "spacer-top", class: "tbody__spacer", style: { height: `${this.topSpacerHeight}px`, display: 'block' } })),
-            h("slot", { key: '1d75d1880a9b8e0c646b93443cf708c7d4e399c7' }),
+            h("slot", { key: '3c9d25b226dfb20b044a718416d3cdda13eff798' }),
             this.bottomSpacerHeight > 0 && (h("tr", { key: "spacer-bottom", class: "tbody__spacer", style: { height: `${this.bottomSpacerHeight}px`, display: 'block' } })),
         ])));
     }

package/dist/collection/components/sd-table/sd-td/sd-td.js

@@ -150,7 +150,7 @@ export class SdTd {
         }
     }
     render() {
-        return (h(Host, { key: 'e033a5018da4dd82db1707d339fb0c78e86b017e', class: { [`align-${this.align}`]: Boolean(this.align) } }, h("slot", { key: 'd9a303a00702f867d621f142d61ded542bb1d34f' })));
+        return (h(Host, { key: '95f97474c4d00a35085c558bf43593322a9f69e7', class: { [`align-${this.align}`]: Boolean(this.align) } }, h("slot", { key: 'f67d1e8b125c10446dac3abdfa0da01bfb83f470' })));
     }
     static get is() { return "sd-td"; }
     static get originalStyleUrls() {

package/dist/collection/components/sd-table/sd-thead/sd-thead.js

@@ -158,16 +158,16 @@ export class SdThead {
             '--table-border-color': TABLE_BORDER.color,
             '--table-border-width': `${TABLE_BORDER.width}px`,
         };
-        return (h(Host, { key: '6984dbdc0ac520bda1aff4dcb3468d88ba4f5f47', slot: `${this.tableId}-head`, style: headStyle }, h("thead", { key: 'e2c83c062219727f33ae8b7d67c54910a2d907a0', class: {
+        return (h(Host, { key: '822abd0e5ff71d9e55b6478d56c9277009983deb', slot: `${this.tableId}-head`, style: headStyle }, h("thead", { key: '7c690c49eb0d9be48637b8a6e92287fac22bf377', class: {
                 'thead': true,
                 'thead--sticky': this._stickyHeader,
-            } }, h("tr", { key: '43ff9b8c3c7c6c2941a87defcc296936300664c8', class: "tr" }, this._selectable && (h("th", { key: '5126c20814657af0731b18359ac160717439a388', class: {
+            } }, h("tr", { key: '81c64bb5b06d7e8525ebceaf6a229034e90f7a48', class: "tr" }, this._selectable && (h("th", { key: 'fe00535fb5cd54d053c17b3d3a6fa8869d483b8b', class: {
                 'th': true,
                 'th--selected': true,
                 'sticky-left': true,
                 'sticky-left-edge': stickyLeftCount === 0,
                 'is-scrolled-left': stickyLeftCount === 0 && this._scrolledLeft,
-            }, style: { '--sticky-left-offset': '0px' } }, h("sd-checkbox", { key: '39777a1e26376d9ed4c59ae3fcf1d6190b9007eb', value: this.getIsAllChecked(), disabled: safeRows.length === 0, onSdUpdate: (e) => this.handleSelectAll(e.detail) }), h("div", { key: 'd4212b9d4e2905cd5dfd57046e4455d12d09988d', class: "th__bar" }))), stickyLeftCols.map((col, idx) => (h("th", { key: col.name, class: {
+            }, style: { '--sticky-left-offset': '0px' } }, h("sd-checkbox", { key: 'de1a3ddf9b3df06d8cc9b85431c31ff84b7b8218', value: this.getIsAllChecked(), disabled: safeRows.length === 0, onSdUpdate: (e) => this.handleSelectAll(e.detail) }), h("div", { key: 'afe516ce212b24abcb075b6e6eb661ffcb6ce297', class: "th__bar" }))), stickyLeftCols.map((col, idx) => (h("th", { key: col.name, class: {
                 'th': true,
                 [`${col.thClass}`]: Boolean(col.thClass),
                 'sticky-left': true,

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

@@ -30,9 +30,11 @@ export const TAB_MAIN_TYPOGRAPHY = {
     default: tabTokens.tab.main.default.typography,
 };
 export const TAB_SUB_LAYOUT = {
-    gap: Number(tabTokens.tab.sub.gap),
+    gapHorizontal: Number(tabTokens.tab.sub.gap.horizontal),
+    gapVertical: Number(tabTokens.tab.sub.gap.vertical),
     contentGap: Number(tabTokens.tab.sub.content.gap),
     borderWidth: Number(tabTokens.tab.sub.border.width),
+    itemHeight: Number(tabTokens.tab.sub.item.height),
 };
 export const TAB_SUB_COLORS = {
     selected: {

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

@@ -71,12 +71,12 @@ sd-tabs .sd-tabs__label::before {
   transition: font-weight 0.2s ease;
 }
 sd-tabs .sd-tabs--sub {
-  gap: var(--sd-tabs-sub-gap);
+  gap: var(--sd-tabs-sub-gap-horizontal);
   border-bottom: none;
   font-family: var(--sd-tabs-sub-font-family);
 }
 sd-tabs .sd-tabs--sub .sd-tabs__tab {
-  height: auto;
+  height: var(--sd-tabs-sub-item-height);
   padding: 0 0 var(--sd-tabs-sub-content-gap) 0;
   border: none;
   border-radius: 0;
@@ -115,4 +115,31 @@ sd-tabs .sd-tabs--sub .sd-tabs__label {
 }
 sd-tabs .sd-tabs--sub .sd-tabs__label::before {
   font-weight: var(--sd-tabs-sub-font-weight-default);
+}
+sd-tabs .sd-tabs--vertical {
+  flex-direction: column;
+  align-items: stretch;
+  width: fit-content;
+  border-bottom: none;
+  border-right: var(--sd-tabs-main-border-width) solid var(--sd-tabs-main-selected-border);
+}
+sd-tabs .sd-tabs--vertical .sd-tabs__tab {
+  justify-content: flex-start;
+  border-bottom: var(--sd-tabs-main-border-width) solid var(--sd-tabs-main-default-border);
+  border-right: none;
+  border-top-right-radius: 0;
+  border-bottom-left-radius: var(--sd-tabs-main-radius);
+}
+sd-tabs .sd-tabs--vertical .sd-tabs__tab--selected {
+  border-color: var(--sd-tabs-main-selected-border);
+}
+sd-tabs .sd-tabs--vertical.sd-tabs--sub {
+  gap: var(--sd-tabs-sub-gap-vertical);
+  border-right: none;
+}
+sd-tabs .sd-tabs--vertical.sd-tabs--sub .sd-tabs__tab {
+  justify-content: center;
+  width: 100%;
+  border: none;
+  border-radius: 0;
 }

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

@@ -5,6 +5,7 @@ export class SdTabs {
     tabs = [];
     size = 'md';
     isSub = false;
+    vertical = false;
     update;
     valueChanged(newValue) {
         this.value = newValue;
@@ -27,6 +28,8 @@ export class SdTabs {
         const classes = ['sd-tabs', `sd-tabs--${this.size ?? 'md'}`];
         if (this.isSub)
             classes.push('sd-tabs--sub');
+        if (this.vertical)
+            classes.push('sd-tabs--vertical');
         return classes.join(' ');
     }
     getBadgeName(tab) {
@@ -53,7 +56,9 @@ export class SdTabs {
             '--sd-tabs-main-line-height': `${TAB_MAIN_TYPOGRAPHY.default.lineHeight}px`,
             '--sd-tabs-main-font-weight-default': TAB_MAIN_TYPOGRAPHY.default.fontWeight,
             '--sd-tabs-main-font-weight-selected': TAB_MAIN_TYPOGRAPHY.selected.fontWeight,
-            '--sd-tabs-sub-gap': `${TAB_SUB_LAYOUT.gap}px`,
+            '--sd-tabs-sub-gap-horizontal': `${TAB_SUB_LAYOUT.gapHorizontal}px`,
+            '--sd-tabs-sub-gap-vertical': `${TAB_SUB_LAYOUT.gapVertical}px`,
+            '--sd-tabs-sub-item-height': `${TAB_SUB_LAYOUT.itemHeight}px`,
             '--sd-tabs-sub-content-gap': `${TAB_SUB_LAYOUT.contentGap}px`,
             '--sd-tabs-sub-border-width': `${TAB_SUB_LAYOUT.borderWidth}px`,
             '--sd-tabs-sub-selected-text': TAB_SUB_COLORS.selected.text,
@@ -67,7 +72,7 @@ export class SdTabs {
         };
     }
     render() {
-        return (h("div", { key: '543ca85d1e1edf809688da0636094478966f4fff', class: this.getContainerClasses(), style: this.buildCssVars() }, this.tabs.map((tab, index) => {
+        return (h("div", { key: '1c670c50ff7f5489a77043bc030fe3a65eb894ab', class: this.getContainerClasses(), style: this.buildCssVars() }, this.tabs.map((tab, index) => {
             const badgeName = this.getBadgeName(tab);
             return (h("div", { key: `tab-${index}`, role: "tab", tabindex: 0, "aria-selected": tab.value === this.value ? 'true' : 'false', class: this.getTabClasses(tab), "aria-label": tab.label || 'tab', onClick: () => this.handleTabClick(tab), onKeyDown: e => {
                     if (e.key === 'Enter' || e.key === ' ') {
@@ -180,6 +185,26 @@ export class SdTabs {
                 "reflect": true,
                 "attribute": "is-sub",
                 "defaultValue": "false"
+            },
+            "vertical": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "vertical",
+                "defaultValue": "false"
             }
         };
     }

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

@@ -27,7 +27,7 @@ export class SdTag {
     render() {
         const config = this.resolvedConfig;
         const iconNode = this.renderIcon(config.icon, config.iconSize);
-        return (h("span", { key: '945a8a13f4891b5174e48e262b2a108674da7198', class: "sd-tag", style: {
+        return (h("span", { key: 'f5dd5e267ffdde104f36ec7f19390357dbf03610', class: "sd-tag", style: {
                 '--sd-tag-background': config.background,
                 '--sd-tag-content': config.content,
                 '--sd-tag-height': config.height,
@@ -37,7 +37,7 @@ export class SdTag {
                 '--sd-tag-font-weight': config.fontWeight,
                 '--sd-tag-line-height': config.lineHeight,
                 '--sd-tag-radius': config.radius,
-            }, "aria-label": this.label || 'tag' }, this.icon && this.isLeft && iconNode, h("span", { key: '441932c2eb85eea471838db541fb95302527df23', class: "sd-tag__label" }, this.label), this.icon && !this.isLeft && iconNode));
+            }, "aria-label": this.label || 'tag' }, this.icon && this.isLeft && iconNode, h("span", { key: '53c649171b1bba53bf71bbf8f382c0678f1a3a6f', class: "sd-tag__label" }, this.label), this.icon && !this.isLeft && iconNode));
     }
     static get is() { return "sd-tag"; }
     static get originalStyleUrls() {

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: '040a857ec7eed2400e115d7a48a3497fc0ce9c95', 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: '465f284ad513125b43632c0ab883482149b4aab5', class: "sd-textarea__content" }, h("textarea", { key: '45afdfbffcf80a99c0b6fa611c7b9c84aeaa3ec6', 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: '2a1cd03e4f0fa5457b3164f1b6b71d808633414c', 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: 'b4e25ced8e583ed3d6e8a6026db0d3a2f198acb4', class: "sd-textarea__content" }, h("textarea", { key: '4faeceee380a7ab9a4ff337d16f46c4d7f42fa50', 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() {

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

@@ -17,12 +17,12 @@ export class SdToast {
         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: '0073ea37731ad1d8a54cb45f0eee8103159cbd65', style: {
+        return (h("div", { key: '82c8063406a534e60c985d3c8321612077f75623', style: {
                 '--sd-toast-bg': typeConfig.bg,
                 '--sd-toast-text': typeConfig.content,
                 '--sd-toast-icon': iconColor,
                 '--sd-toast-link': linkColor,
-            } }, h("div", { key: 'e14f7d2d5e15630989c4cb19ed375a704a8a783a', class: "sd-toast", role: "status", "aria-live": "polite", "aria-atomic": "true" }, this.icon && (h("div", { key: '72b20a3e5920cd173ea2fa05393d991d477e948b', class: "sd-toast__icon" }, h("sd-icon", { key: 'ac2c30b63ae84da53066ba0ddc2fb211ef6b8bbf', name: this.icon, size: iconSize, color: iconColor }))), h("div", { key: '605dca0bcf05059e325f0c05800c11adc55d5da5', class: "sd-toast__content" }, h("span", { key: 'ba8d91256c01bd897b177a69372f813131bd4b03', class: "sd-toast__message" }, this.message)), this.link && (h("a", { key: 'a9283bacb928dc5d92ddc2e554967928035a5fab', href: this.link, class: "sd-toast__link", target: "_blank", rel: "noopener noreferrer" }, this.linkLabel || this.link)), this.buttonLabel && (h("sd-button", { key: '87b7d6bae7f0321e9557967f856e1b5e17697d17', class: "sd-toast__button", name: buttonName, label: this.buttonLabel, onSdClick: (event) => this.buttonClick.emit(event.detail) })), this.useClose && (h("sd-ghost-button", { key: 'e89b2cdd29115e366bb5665a483433393eb1b420', class: "sd-toast__close", icon: "close", intent: useDefaultCloseIntent ? 'default' : 'inverse', ariaLabel: "close", size: "xs", onClick: () => this.close.emit() })))));
+            } }, h("div", { key: 'e83c5b7ddc0edec3fb9e29325dcb52e3295fad4d', class: "sd-toast", role: "status", "aria-live": "polite", "aria-atomic": "true" }, this.icon && (h("div", { key: 'd249e5915f0c92a0a2cff43dee5c61d809ffc7f0', class: "sd-toast__icon" }, h("sd-icon", { key: '088da81d0083cc0ca72f2bf59392a72d3f2ed4de', name: this.icon, size: iconSize, color: iconColor }))), h("div", { key: '5cad9a3a81b00d8926d92d9895c4cca1389dc63b', class: "sd-toast__content" }, h("span", { key: '1fbc72aac70fbb3bb630ad10343ea2c8f76f924c', class: "sd-toast__message" }, this.message)), this.link && (h("a", { key: '769a85fa539bab8b478ef999cab615285a842085', href: this.link, class: "sd-toast__link", target: "_blank", rel: "noopener noreferrer" }, this.linkLabel || this.link)), this.buttonLabel && (h("sd-button", { key: '77612614898b6abdade4b4599987cbb90bc09c4e', class: "sd-toast__button", name: buttonName, label: this.buttonLabel, onSdClick: (event) => this.buttonClick.emit(event.detail) })), this.useClose && (h("sd-ghost-button", { key: '3bef6c0e7f3dec3f2b1f493f9c979a121bc897e9', 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() {

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

@@ -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: 'b5847f65c728fb5f31bda0f6756118fa975e4987', class: "sd-toast-container", style: this.getContainerStyles(), onMouseEnter: () => {
+        return (h("div", { key: '2b0bc86b7e2ea19a44f3c0b870ce5dec1de3a140', class: "sd-toast-container", style: this.getContainerStyles(), onMouseEnter: () => {
                 this.expanded = true;
                 this.pauseTimers();
             }, onMouseLeave: () => {

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: '83b94f28bd8364edefcbfbadccb258b10d01df92', class: this.toggleClasses, style: cssVars, "aria-label": this.label || 'toggle' }, this.label, h("input", { key: '9becc0c6a5337c6d16301e998a9a5bbd92b198a6', style: { display: 'none' }, type: "checkbox", onInput: this.handleChange })));
+        return (h("label", { key: 'f61e80701bc85205794aec0c960965d29b94a247', class: this.toggleClasses, style: cssVars, "aria-label": this.label || 'toggle' }, this.label, h("input", { key: '26a31febfdae6bebe55291d3454a177366dc3db0', 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

@@ -84,14 +84,14 @@ export class SdTooltip {
         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: '01a51171ec82765f97d0d93733266ccddb5f3ce5' }, h("div", { key: 'fa1629b94e21a9906c5e9af3fa33e5c4b5dc5d9a', 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: '081120a9eaf030f5ffe2d677be1ab8ca6142f041', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: placement, offset: this.tooltipOffset }, h("div", { key: '1645e29961ef0a5f11a66966dc3a9c384b2a3217', ref: el => (this.menuEl = el), class: {
+        return (h(Fragment, { key: 'dab010e285f9cf77097b2d18115d1c8dbb462933' }, h("div", { key: 'c49d1f8d55898cedc462fd321ab47d8a82360ae8', 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: '53dbdd7df43e2eacf23c2e1b97bf901b225eab1e', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: placement, offset: this.tooltipOffset }, h("div", { key: '3130ace8e25b783d49fde3b682249a8cf1783cde', 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: '8be5ae308d3c90cd9e2f4b066a880be903cc27da', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, h(TooltipArrow, { key: '2417f58db36c4c9f92114a6849e7dd71e39a64f5' })), h("div", { key: '2232a1d4f0ac1cb7466daf14a7eec6ca967cee22', class: "sd-floating-menu__content", innerHTML: this.slotContentHTML }))))));
+            }, onMouseEnter: () => this.show(), onMouseLeave: () => this.startHideTimer() }, h("i", { key: '2120f9056ef18218b2ba55d5c921fef9c9a04d67', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, h(TooltipArrow, { key: '557f9ae13f101416d962a84438690078fa7bd16f' })), h("div", { key: '54fb0f3cf0f228184f2eca54a5f3364084b6f834', class: "sd-floating-menu__content", innerHTML: this.slotContentHTML }))))));
     }
     static get is() { return "sd-tooltip"; }
     static get originalStyleUrls() {

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-siTDlOb6.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 i(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 o(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=i(s);return await o(c),c.create({message:t,type:n,...r})},async dismiss(t){if(null!=n)return await o(n),n.dismiss(t)},async dismissAll(){if(null!=n)return await o(n),n.dismissAll()},configure(t){i(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||null==this.containerRef?this.pendingActions.push(t):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,i=h(),o={persistent:s};t._setContainer(i),w(i).then((async()=>{const n=await i.createCustom(e,o,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-BFjxNqDj.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||null==this.containerRef?this.pendingActions.push(t):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 F={show(t={}){A((n=>{n.show?.(t)}))},hide(){k&&A((t=>{t.hide?.()}))}};export{y as _attachSdModalWithRef,p as _createSdModalRef,F as sdLoading,E as sdModal,c as sdToast}

package/dist/components/{p-PDLDFsH7.js → p-9S3tUKro.js}

@@ -1 +1 @@
-import{p as t,H as e,h as s,F as i,t as o}from"./p-siTDlOb6.js";import{T as n}from"./p-DjS-dtF5.js";import{d as a}from"./p-DqXt80Qn.js";import{d as l}from"./p-BS1cT5dG.js";import{d as c}from"./p-BNkExhYB.js";var r={bg:"#07284A",content:"#FFFFFF"},d={bg:"#FCEFEF",content:"#FB4444"},h={bg:"#FEF1EA",content:"#FF6B00"},p={bg:"#E6F1FF",content:"#0075FF"};const m={default:{bg:r.bg,content:r.content},danger:{bg:d.bg,content:d.content},warning:{bg:h.bg,content:h.content},accent:{bg:p.bg,content:p.content}},f=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",a=this.icon??"helpOutline",l=this.color??"#01BB4B",c=m[o]??m.default,r=()=>this.showTooltip=!this.showTooltip,d=void 0!==this.label&&""!==this.label;return s(i,{key:"01a51171ec82765f97d0d93733266ccddb5f3ce5"},s("div",{key:"fa1629b94e21a9906c5e9af3fa33e5c4b5dc5d9a",class:`sd-tooltip-trigger ${void 0!==this.sdClass&&""!==this.sdClass?this.sdClass:""}`,..."hover"===t?{onMouseEnter:()=>this.show(),onMouseLeave:()=>this.startHideTimer()}:d?{}:{onClick:r}},d?s("sd-button",{ref:t=>this.buttonEl=t,name:this.name??"primary_sm",label:this.label,icon:a,rightIcon:this.rightIcon,ariaLabel:this.ariaLabel,disabled:this.disabled,type:this.type??"button",class:"sd-tooltip",..."click"===t&&d?{onSdClick:r}:{}}):s("sd-icon",{ref:t=>this.buttonEl=t,name:a,size:this.iconSize??12,color:l,class:"sd-tooltip"})),this.showTooltip&&s("sd-floating-portal",{key:"081120a9eaf030f5ffe2d677be1ab8ca6142f041",parentRef:this.buttonEl,onSdClose:this.handleClose,placement:e,offset:this.tooltipOffset},s("div",{key:"1645e29961ef0a5f11a66966dc3a9c384b2a3217",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:"8be5ae308d3c90cd9e2f4b066a880be903cc27da",class:`sd-floating-menu__arrow sd-floating-menu__arrow--${e}`},s(n,{key:"2417f58db36c4c9f92114a6849e7dd71e39a64f5"})),s("div",{key:"2232a1d4f0ac1cb7466daf14a7eec6ca967cee22",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),f);break;case"sd-button":customElements.get(o(t))||a();break;case"sd-floating-portal":customElements.get(o(t))||l();break;case"sd-icon":customElements.get(o(t))||c()}}))}export{f as S,u as d}
+import{p as t,H as e,h as s,F as i,t as o}from"./p-BFjxNqDj.js";import{T as n}from"./p-D9fTZjTl.js";import{d as a}from"./p-BklUnzX5.js";import{d as l}from"./p-D8F2mTyh.js";import{d as c}from"./p-BoXTUvyq.js";var d={bg:"#07284A",content:"#FFFFFF"},r={bg:"#FCEFEF",content:"#FB4444"},h={bg:"#FEF1EA",content:"#FF6B00"},f={bg:"#E6F1FF",content:"#0075FF"};const p={default:{bg:d.bg,content:d.content},danger:{bg:r.bg,content:r.content},warning:{bg:h.bg,content:h.content},accent:{bg:f.bg,content:f.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",a=this.icon??"helpOutline",l=this.color??"#01BB4B",c=p[o]??p.default,d=()=>this.showTooltip=!this.showTooltip,r=void 0!==this.label&&""!==this.label;return s(i,{key:"dab010e285f9cf77097b2d18115d1c8dbb462933"},s("div",{key:"c49d1f8d55898cedc462fd321ab47d8a82360ae8",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:a,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:a,size:this.iconSize??12,color:l,class:"sd-tooltip"})),this.showTooltip&&s("sd-floating-portal",{key:"53dbdd7df43e2eacf23c2e1b97bf901b225eab1e",parentRef:this.buttonEl,onSdClose:this.handleClose,placement:e,offset:this.tooltipOffset},s("div",{key:"3130ace8e25b783d49fde3b682249a8cf1783cde",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:"2120f9056ef18218b2ba55d5c921fef9c9a04d67",class:`sd-floating-menu__arrow sd-floating-menu__arrow--${e}`},s(n,{key:"557f9ae13f101416d962a84438690078fa7bd16f"})),s("div",{key:"54fb0f3cf0f228184f2eca54a5f3364084b6f834",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 b(){"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))||a();break;case"sd-floating-portal":customElements.get(o(t))||l();break;case"sd-icon":customElements.get(o(t))||c()}}))}export{m as S,b as d}

package/dist/components/{p-C8MKSPNX.js → p-B-pYYTgJ.js}

@@ -1 +1 @@
-import{p as t,H as e,c as s,h as i,d as o,t as l}from"./p-siTDlOb6.js";import{T as r}from"./p-sZMi_32I.js";import{a,r as h,e as n,c,f as d,g as p,h as b,i as f}from"./p-DGyTYauz.js";import{d as g}from"./p-DqXt80Qn.js";import{d as y}from"./p-CFL9Rfh8.js";import{d as u}from"./p-BS1cT5dG.js";import{d as m}from"./p-BNkExhYB.js";import{d as x}from"./p-PDLDFsH7.js";const k=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.sdColumnSort=s(this,"sdColumnSort",7)}get el(){return this}columns;selectable;resizable;stickyColumn;stickyHeader;scrolledLeft;scrolledRight;rows=[];columnWidths=[];sdColumnSort;tableId="";_columns=[];_selectable=!1;_resizable=!1;_stickyColumn={left:0,right:0};_stickyHeader=!1;_scrolledLeft=!1;_scrolledRight=!1;tableEl=null;handleColumnsChange(t){Array.isArray(t)&&0===(this.columnWidths??[]).length&&(this.columnWidths=t.map((t=>t.autoWidth?0:parseInt(t.width||"120",10))))}componentWillLoad(){this.syncTableContext(),this.columnWidths=Array.isArray(this.columnWidths)?this.columnWidths:[],this.resolveConfig(),0===(this.columnWidths??[]).length&&(this.columnWidths=this._columns.map((t=>t.autoWidth?0:parseInt(t.width||"120",10))))}componentDidLoad(){this.syncTableContext(),this.resolveConfig()}syncTableContext(){const t=this.el.closest("sd-table"),e=this.el.getRootNode(),s=e instanceof ShadowRoot?e.host:null,i=t??s;this.tableEl=i;const o=i?.getTableIdSync?.(),l=i?.getAttribute(r),a=(null!=o&&""!==o&&"undefined"!==o?o:null)??(null!=l&&""!==l&&"undefined"!==l?l:null)??"";""!==a&&a!==this.tableId&&(this.tableId=a)}resolveConfig(){const t=this.tableEl?.getConfigSync?.(),e=Array.isArray(this.columns)?this.columns:Array.isArray(t?.columns)?t.columns:[];this._columns=e,this._selectable=this.selectable??t?.selectable??!1,this._resizable=this.resizable??t?.resizable??!1,this._stickyColumn=this.stickyColumn??t?.stickyColumn??{left:0,right:0},this._stickyHeader=this.stickyHeader??t?.stickyHeader??!1,this._scrolledLeft=this.scrolledLeft??t?.scrolledLeft??!1,this._scrolledRight=this.scrolledRight??t?.scrolledRight??!1,Array.isArray(t?.columnWidths)&&0===(this.columnWidths??[]).length&&(this.columnWidths=[...t.columnWidths]),Array.isArray(this.columnWidths)||(this.columnWidths=[])}async refreshConfig(){this.resolveConfig()}async setColumnWidths(t){this.columnWidths=Array.isArray(t)?t:[]}async refreshSelection(){const t=this.el.querySelector("sd-checkbox");t&&(t.value=this.getIsAllChecked())}get visibleColumns(){return this._columns.filter((t=>!1!==t.visible))}getStickyStyle(t){if(this.tableEl?.getStickyStyleSync)return this.tableEl.getStickyStyleSync(t);const e=this.columnWidths.slice(0,t).reduce(((t,e)=>t+e),0)+(this._selectable?a:0),s=this.columnWidths.filter(((e,s)=>s>=this.visibleColumns.length-(this._stickyColumn.right||0)&&s>t)).reduce(((t,e)=>t+e),0),i=this.visibleColumns[t],o={"--sticky-left-offset":`${e}px`,"--sticky-right-offset":`${s}px`};return i?.autoWidth||(o.width=`${this.columnWidths[t]}px`,o.minWidth=`${this.columnWidths[t]}px`,o.maxWidth=`${this.columnWidths[t]}px`),o}handleResize(t,e,s=!1){this.tableEl?.handleResize&&this.tableEl.handleResize(t,e,s)}handleColumnSort=t=>{this.sdColumnSort.emit({column:t})};handleSelectAll(t){const e=!!t,s=Array.isArray(this.rows)?this.rows:[];this.tableEl?.toggleSelectAllSync&&this.tableEl.toggleSelectAllSync(e,s)}getIsAllChecked(){const t=Array.isArray(this.rows)?this.rows:[];return!!(this.tableEl?.getIsAllCheckedSync&&t.length>0)&&this.tableEl.getIsAllCheckedSync(t)}render(){const t=Array.isArray(this.rows)?this.rows:[],e=this._stickyColumn.left||0,s=this._stickyColumn.right||0,l=this.visibleColumns.slice(0,e),r=this.visibleColumns.slice(e,this.visibleColumns.length-s),a=this.visibleColumns.slice(this.visibleColumns.length-s),g=this.visibleColumns.length-1;return i(o,{key:"6984dbdc0ac520bda1aff4dcb3468d88ba4f5f47",slot:`${this.tableId}-head`,style:{"--table-header-height":`${f.height}px`,"--table-header-padding-x":`${f.paddingX}px`,"--table-header-gap":`${f.gap}px`,"--table-header-bg":b.bg,"--table-header-font-family":p.fontFamily,"--table-header-font-weight":p.fontWeight,"--table-header-font-size":`${p.fontSize}px`,"--table-header-line-height":`${p.lineHeight}px`,"--table-header-text-decoration":p.textDecoration,"--table-header-resizer-color":d.color,"--table-header-resizer-height":`${d.height}px`,"--table-border-color":c.color,"--table-border-width":`${c.width}px`}},i("thead",{key:"e2c83c062219727f33ae8b7d67c54910a2d907a0",class:{thead:!0,"thead--sticky":this._stickyHeader}},i("tr",{key:"43ff9b8c3c7c6c2941a87defcc296936300664c8",class:"tr"},this._selectable&&i("th",{key:"5126c20814657af0731b18359ac160717439a388",class:{th:!0,"th--selected":!0,"sticky-left":!0,"sticky-left-edge":0===e,"is-scrolled-left":0===e&&this._scrolledLeft},style:{"--sticky-left-offset":"0px"}},i("sd-checkbox",{key:"39777a1e26376d9ed4c59ae3fcf1d6190b9007eb",value:this.getIsAllChecked(),disabled:0===t.length,onSdUpdate:t=>this.handleSelectAll(t.detail)}),i("div",{key:"d4212b9d4e2905cd5dfd57046e4455d12d09988d",class:"th__bar"})),l.map(((t,s)=>i("th",{key:t.name,class:{th:!0,[`${t.thClass}`]:Boolean(t.thClass),"sticky-left":!0,"sticky-left-edge":s===e-1,"is-scrolled-left":s===e-1&&this._scrolledLeft},style:{...t.thStyle,...this.getStickyStyle(s)}},i("div",{class:`th__content th__content--${t.align||"left"}`},i("div",{class:"th__content--label"},t.label),t.icon&&i("sd-icon",{name:t.icon,size:"12",color:h(t.icon,t.iconColor)}),t.sort&&i("sd-icon",{name:n(t.sort),size:"12",color:h(n(t.sort),t.iconColor),onClick:()=>this.handleColumnSort(t),style:{cursor:"pointer"}}),t.tooltip&&i("sd-tooltip",{...t.tooltipOptions},i("div",{slot:"content"},t.tooltip.map((t=>i("p",null,t)))))),this._resizable&&s!==g&&i("div",{class:"th__resizer",onMouseDown:t=>this.handleResize(s,t)})))),r.map(((t,s)=>{const o=e+s;return i("th",{key:t.name,class:{th:!0,[`${t.thClass}`]:Boolean(t.thClass)},style:{...t.thStyle,...this.getStickyStyle(o)}},i("div",{class:`th__content th__content--${t.align||"left"}`},i("div",{class:"th__content--label"},t.label),t.icon&&i("sd-icon",{name:t.icon,size:"12",color:h(t.icon,t.iconColor)}),t.sort&&i("sd-icon",{name:n(t.sort),size:"12",color:h(n(t.sort),t.iconColor),onClick:()=>this.handleColumnSort(t),style:{cursor:"pointer"}}),t.tooltip&&i("sd-tooltip",{...t.tooltipOptions},i("div",{slot:"content"},t.tooltip.map((t=>i("p",null,t)))))),this._resizable&&o!==g&&i("div",{class:"th__resizer",onMouseDown:t=>this.handleResize(o,t)}))})),a.map(((t,e)=>{const o=this.visibleColumns.length-s+e;return i("th",{key:t.name,class:{th:!0,[`${t.thClass}`]:Boolean(t.thClass),"sticky-right":!0,"sticky-right-edge":0===e,"is-scrolled-right":0===e&&this._scrolledRight},style:{...t.thStyle,...this.getStickyStyle(o)}},i("div",{class:`th__content th__content--${t.align||"left"}`},i("div",{class:"th__content--label"},t.label),t.icon&&i("sd-icon",{name:t.icon,size:"12",color:h(t.icon,t.iconColor)}),t.sort&&i("sd-icon",{name:n(t.sort),size:"12",color:h(n(t.sort),t.iconColor),onClick:()=>this.handleColumnSort(t),style:{cursor:"pointer"}}),t.tooltip&&i("sd-tooltip",{...t.tooltipOptions},i("div",{slot:"content"},t.tooltip.map((t=>i("p",null,t)))))),this._resizable&&i("div",{class:"th__resizer th__resizer--left",onMouseDown:t=>this.handleResize(o,t,!0)}))})))))}static get watchers(){return{columns:[{handleColumnsChange:0}]}}static get style(){return'sd-thead{display:contents}sd-thead *{box-sizing:border-box}.thead{display:table-header-group;height:var(--table-header-height, 36px)}.thead--sticky{position:sticky;top:0;z-index:120}.tr{display:table-row;width:100%}.th{display:table-cell;background:var(--table-header-bg, #F5FAFF);height:var(--table-header-height, 36px);padding:0 var(--table-header-padding-x, 16px);font-family:var(--table-header-font-family, inherit);font-weight:var(--table-header-font-weight, 500);font-size:var(--table-header-font-size, 12px);line-height:var(--table-header-line-height, 20px);text-decoration:var(--table-header-text-decoration, none);vertical-align:middle;border-bottom:var(--table-border-width, 1px) solid var(--table-border-color, #E1E1E1);-webkit-user-select:none;user-select:none;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}.th--selected{position:relative;width:var(--table-selectable-width, 48px) !important;max-width:var(--table-selectable-width, 48px) !important;min-width:var(--table-selectable-width, 48px) !important;text-align:center}.th--selected sd-checkbox label{position:relative}.th--selected sd-checkbox label:before{content:"";position:absolute;inset:-6px}.th.sticky-left{position:sticky;background-color:var(--table-header-bg, #F5FAFF);z-index:110 !important;left:var(--sticky-left-offset, 0)}.th.sticky-right{position:sticky;background-color:var(--table-header-bg, #F5FAFF);z-index:110 !important;right:var(--sticky-right-offset, 0)}.th.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}.th.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}.th.sticky-left-edge.is-scrolled-left{overflow:visible}.th.sticky-left-edge.is-scrolled-left:after{opacity:1}.th.sticky-right-edge.is-scrolled-right{overflow:visible}.th.sticky-right-edge.is-scrolled-right:after{opacity:1}.th__content{display:flex;flex-flow:row nowrap;align-items:center;gap:var(--table-header-gap, 4px)}.th__content--left{justify-content:flex-start}.th__content--center{justify-content:center}.th__content--right{justify-content:flex-end}.th__content--label{white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}.th__bar{position:absolute;top:50%;right:0;transform:translateY(-50%);width:var(--table-border-width, 1px);height:var(--table-header-resizer-height, 16px);z-index:3;background-color:var(--table-header-resizer-color, #CCCCCC)}.th__resizer{position:absolute;top:50%;right:0;transform:translateY(-50%);width:4px;height:var(--table-header-resizer-height, 16px);cursor:col-resize;z-index:3;border-left:var(--table-border-width, 1px) solid var(--table-header-resizer-color, #CCCCCC);border-right:var(--table-border-width, 1px) solid var(--table-header-resizer-color, #CCCCCC)}.th__resizer--left{right:auto;left:0}'}},[512,"sd-thead",{columns:[16],selectable:[4],resizable:[4],stickyColumn:[16],stickyHeader:[4,"sticky-header"],scrolledLeft:[4,"scrolled-left"],scrolledRight:[4,"scrolled-right"],rows:[16],columnWidths:[1040],tableId:[32],_columns:[32],_selectable:[32],_resizable:[32],_stickyColumn:[32],_stickyHeader:[32],_scrolledLeft:[32],_scrolledRight:[32],refreshConfig:[64],setColumnWidths:[64],refreshSelection:[64]},void 0,{columns:[{handleColumnsChange:0}]}]);function _(){"undefined"!=typeof customElements&&["sd-thead","sd-button","sd-checkbox","sd-floating-portal","sd-icon","sd-tooltip"].forEach((t=>{switch(t){case"sd-thead":customElements.get(l(t))||customElements.define(l(t),k);break;case"sd-button":customElements.get(l(t))||g();break;case"sd-checkbox":customElements.get(l(t))||y();break;case"sd-floating-portal":customElements.get(l(t))||u();break;case"sd-icon":customElements.get(l(t))||m();break;case"sd-tooltip":customElements.get(l(t))||x()}}))}export{k as S,_ as d}
+import{p as t,H as e,c as s,h as i,d as o,t as l}from"./p-BFjxNqDj.js";import{T as r}from"./p-sZMi_32I.js";import{a,r as h,e as n,c,f as d,g as b,h as p,i as f}from"./p-DGyTYauz.js";import{d as y}from"./p-BklUnzX5.js";import{d as g}from"./p-DG5mmAZR.js";import{d as m}from"./p-D8F2mTyh.js";import{d as u}from"./p-BoXTUvyq.js";import{d as x}from"./p-9S3tUKro.js";const k=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.sdColumnSort=s(this,"sdColumnSort",7)}get el(){return this}columns;selectable;resizable;stickyColumn;stickyHeader;scrolledLeft;scrolledRight;rows=[];columnWidths=[];sdColumnSort;tableId="";_columns=[];_selectable=!1;_resizable=!1;_stickyColumn={left:0,right:0};_stickyHeader=!1;_scrolledLeft=!1;_scrolledRight=!1;tableEl=null;handleColumnsChange(t){Array.isArray(t)&&0===(this.columnWidths??[]).length&&(this.columnWidths=t.map((t=>t.autoWidth?0:parseInt(t.width||"120",10))))}componentWillLoad(){this.syncTableContext(),this.columnWidths=Array.isArray(this.columnWidths)?this.columnWidths:[],this.resolveConfig(),0===(this.columnWidths??[]).length&&(this.columnWidths=this._columns.map((t=>t.autoWidth?0:parseInt(t.width||"120",10))))}componentDidLoad(){this.syncTableContext(),this.resolveConfig()}syncTableContext(){const t=this.el.closest("sd-table"),e=this.el.getRootNode(),s=e instanceof ShadowRoot?e.host:null,i=t??s;this.tableEl=i;const o=i?.getTableIdSync?.(),l=i?.getAttribute(r),a=(null!=o&&""!==o&&"undefined"!==o?o:null)??(null!=l&&""!==l&&"undefined"!==l?l:null)??"";""!==a&&a!==this.tableId&&(this.tableId=a)}resolveConfig(){const t=this.tableEl?.getConfigSync?.(),e=Array.isArray(this.columns)?this.columns:Array.isArray(t?.columns)?t.columns:[];this._columns=e,this._selectable=this.selectable??t?.selectable??!1,this._resizable=this.resizable??t?.resizable??!1,this._stickyColumn=this.stickyColumn??t?.stickyColumn??{left:0,right:0},this._stickyHeader=this.stickyHeader??t?.stickyHeader??!1,this._scrolledLeft=this.scrolledLeft??t?.scrolledLeft??!1,this._scrolledRight=this.scrolledRight??t?.scrolledRight??!1,Array.isArray(t?.columnWidths)&&0===(this.columnWidths??[]).length&&(this.columnWidths=[...t.columnWidths]),Array.isArray(this.columnWidths)||(this.columnWidths=[])}async refreshConfig(){this.resolveConfig()}async setColumnWidths(t){this.columnWidths=Array.isArray(t)?t:[]}async refreshSelection(){const t=this.el.querySelector("sd-checkbox");t&&(t.value=this.getIsAllChecked())}get visibleColumns(){return this._columns.filter((t=>!1!==t.visible))}getStickyStyle(t){if(this.tableEl?.getStickyStyleSync)return this.tableEl.getStickyStyleSync(t);const e=this.columnWidths.slice(0,t).reduce(((t,e)=>t+e),0)+(this._selectable?a:0),s=this.columnWidths.filter(((e,s)=>s>=this.visibleColumns.length-(this._stickyColumn.right||0)&&s>t)).reduce(((t,e)=>t+e),0),i=this.visibleColumns[t],o={"--sticky-left-offset":`${e}px`,"--sticky-right-offset":`${s}px`};return i?.autoWidth||(o.width=`${this.columnWidths[t]}px`,o.minWidth=`${this.columnWidths[t]}px`,o.maxWidth=`${this.columnWidths[t]}px`),o}handleResize(t,e,s=!1){this.tableEl?.handleResize&&this.tableEl.handleResize(t,e,s)}handleColumnSort=t=>{this.sdColumnSort.emit({column:t})};handleSelectAll(t){const e=!!t,s=Array.isArray(this.rows)?this.rows:[];this.tableEl?.toggleSelectAllSync&&this.tableEl.toggleSelectAllSync(e,s)}getIsAllChecked(){const t=Array.isArray(this.rows)?this.rows:[];return!!(this.tableEl?.getIsAllCheckedSync&&t.length>0)&&this.tableEl.getIsAllCheckedSync(t)}render(){const t=Array.isArray(this.rows)?this.rows:[],e=this._stickyColumn.left||0,s=this._stickyColumn.right||0,l=this.visibleColumns.slice(0,e),r=this.visibleColumns.slice(e,this.visibleColumns.length-s),a=this.visibleColumns.slice(this.visibleColumns.length-s),y=this.visibleColumns.length-1;return i(o,{key:"822abd0e5ff71d9e55b6478d56c9277009983deb",slot:`${this.tableId}-head`,style:{"--table-header-height":`${f.height}px`,"--table-header-padding-x":`${f.paddingX}px`,"--table-header-gap":`${f.gap}px`,"--table-header-bg":p.bg,"--table-header-font-family":b.fontFamily,"--table-header-font-weight":b.fontWeight,"--table-header-font-size":`${b.fontSize}px`,"--table-header-line-height":`${b.lineHeight}px`,"--table-header-text-decoration":b.textDecoration,"--table-header-resizer-color":d.color,"--table-header-resizer-height":`${d.height}px`,"--table-border-color":c.color,"--table-border-width":`${c.width}px`}},i("thead",{key:"7c690c49eb0d9be48637b8a6e92287fac22bf377",class:{thead:!0,"thead--sticky":this._stickyHeader}},i("tr",{key:"81c64bb5b06d7e8525ebceaf6a229034e90f7a48",class:"tr"},this._selectable&&i("th",{key:"fe00535fb5cd54d053c17b3d3a6fa8869d483b8b",class:{th:!0,"th--selected":!0,"sticky-left":!0,"sticky-left-edge":0===e,"is-scrolled-left":0===e&&this._scrolledLeft},style:{"--sticky-left-offset":"0px"}},i("sd-checkbox",{key:"de1a3ddf9b3df06d8cc9b85431c31ff84b7b8218",value:this.getIsAllChecked(),disabled:0===t.length,onSdUpdate:t=>this.handleSelectAll(t.detail)}),i("div",{key:"afe516ce212b24abcb075b6e6eb661ffcb6ce297",class:"th__bar"})),l.map(((t,s)=>i("th",{key:t.name,class:{th:!0,[`${t.thClass}`]:Boolean(t.thClass),"sticky-left":!0,"sticky-left-edge":s===e-1,"is-scrolled-left":s===e-1&&this._scrolledLeft},style:{...t.thStyle,...this.getStickyStyle(s)}},i("div",{class:`th__content th__content--${t.align||"left"}`},i("div",{class:"th__content--label"},t.label),t.icon&&i("sd-icon",{name:t.icon,size:"12",color:h(t.icon,t.iconColor)}),t.sort&&i("sd-icon",{name:n(t.sort),size:"12",color:h(n(t.sort),t.iconColor),onClick:()=>this.handleColumnSort(t),style:{cursor:"pointer"}}),t.tooltip&&i("sd-tooltip",{...t.tooltipOptions},i("div",{slot:"content"},t.tooltip.map((t=>i("p",null,t)))))),this._resizable&&s!==y&&i("div",{class:"th__resizer",onMouseDown:t=>this.handleResize(s,t)})))),r.map(((t,s)=>{const o=e+s;return i("th",{key:t.name,class:{th:!0,[`${t.thClass}`]:Boolean(t.thClass)},style:{...t.thStyle,...this.getStickyStyle(o)}},i("div",{class:`th__content th__content--${t.align||"left"}`},i("div",{class:"th__content--label"},t.label),t.icon&&i("sd-icon",{name:t.icon,size:"12",color:h(t.icon,t.iconColor)}),t.sort&&i("sd-icon",{name:n(t.sort),size:"12",color:h(n(t.sort),t.iconColor),onClick:()=>this.handleColumnSort(t),style:{cursor:"pointer"}}),t.tooltip&&i("sd-tooltip",{...t.tooltipOptions},i("div",{slot:"content"},t.tooltip.map((t=>i("p",null,t)))))),this._resizable&&o!==y&&i("div",{class:"th__resizer",onMouseDown:t=>this.handleResize(o,t)}))})),a.map(((t,e)=>{const o=this.visibleColumns.length-s+e;return i("th",{key:t.name,class:{th:!0,[`${t.thClass}`]:Boolean(t.thClass),"sticky-right":!0,"sticky-right-edge":0===e,"is-scrolled-right":0===e&&this._scrolledRight},style:{...t.thStyle,...this.getStickyStyle(o)}},i("div",{class:`th__content th__content--${t.align||"left"}`},i("div",{class:"th__content--label"},t.label),t.icon&&i("sd-icon",{name:t.icon,size:"12",color:h(t.icon,t.iconColor)}),t.sort&&i("sd-icon",{name:n(t.sort),size:"12",color:h(n(t.sort),t.iconColor),onClick:()=>this.handleColumnSort(t),style:{cursor:"pointer"}}),t.tooltip&&i("sd-tooltip",{...t.tooltipOptions},i("div",{slot:"content"},t.tooltip.map((t=>i("p",null,t)))))),this._resizable&&i("div",{class:"th__resizer th__resizer--left",onMouseDown:t=>this.handleResize(o,t,!0)}))})))))}static get watchers(){return{columns:[{handleColumnsChange:0}]}}static get style(){return'sd-thead{display:contents}sd-thead *{box-sizing:border-box}.thead{display:table-header-group;height:var(--table-header-height, 36px)}.thead--sticky{position:sticky;top:0;z-index:120}.tr{display:table-row;width:100%}.th{display:table-cell;background:var(--table-header-bg, #F5FAFF);height:var(--table-header-height, 36px);padding:0 var(--table-header-padding-x, 16px);font-family:var(--table-header-font-family, inherit);font-weight:var(--table-header-font-weight, 500);font-size:var(--table-header-font-size, 12px);line-height:var(--table-header-line-height, 20px);text-decoration:var(--table-header-text-decoration, none);vertical-align:middle;border-bottom:var(--table-border-width, 1px) solid var(--table-border-color, #E1E1E1);-webkit-user-select:none;user-select:none;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}.th--selected{position:relative;width:var(--table-selectable-width, 48px) !important;max-width:var(--table-selectable-width, 48px) !important;min-width:var(--table-selectable-width, 48px) !important;text-align:center}.th--selected sd-checkbox label{position:relative}.th--selected sd-checkbox label:before{content:"";position:absolute;inset:-6px}.th.sticky-left{position:sticky;background-color:var(--table-header-bg, #F5FAFF);z-index:110 !important;left:var(--sticky-left-offset, 0)}.th.sticky-right{position:sticky;background-color:var(--table-header-bg, #F5FAFF);z-index:110 !important;right:var(--sticky-right-offset, 0)}.th.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}.th.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}.th.sticky-left-edge.is-scrolled-left{overflow:visible}.th.sticky-left-edge.is-scrolled-left:after{opacity:1}.th.sticky-right-edge.is-scrolled-right{overflow:visible}.th.sticky-right-edge.is-scrolled-right:after{opacity:1}.th__content{display:flex;flex-flow:row nowrap;align-items:center;gap:var(--table-header-gap, 4px)}.th__content--left{justify-content:flex-start}.th__content--center{justify-content:center}.th__content--right{justify-content:flex-end}.th__content--label{white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}.th__bar{position:absolute;top:50%;right:0;transform:translateY(-50%);width:var(--table-border-width, 1px);height:var(--table-header-resizer-height, 16px);z-index:3;background-color:var(--table-header-resizer-color, #CCCCCC)}.th__resizer{position:absolute;top:50%;right:0;transform:translateY(-50%);width:4px;height:var(--table-header-resizer-height, 16px);cursor:col-resize;z-index:3;border-left:var(--table-border-width, 1px) solid var(--table-header-resizer-color, #CCCCCC);border-right:var(--table-border-width, 1px) solid var(--table-header-resizer-color, #CCCCCC)}.th__resizer--left{right:auto;left:0}'}},[512,"sd-thead",{columns:[16],selectable:[4],resizable:[4],stickyColumn:[16],stickyHeader:[4,"sticky-header"],scrolledLeft:[4,"scrolled-left"],scrolledRight:[4,"scrolled-right"],rows:[16],columnWidths:[1040],tableId:[32],_columns:[32],_selectable:[32],_resizable:[32],_stickyColumn:[32],_stickyHeader:[32],_scrolledLeft:[32],_scrolledRight:[32],refreshConfig:[64],setColumnWidths:[64],refreshSelection:[64]},void 0,{columns:[{handleColumnsChange:0}]}]);function _(){"undefined"!=typeof customElements&&["sd-thead","sd-button","sd-checkbox","sd-floating-portal","sd-icon","sd-tooltip"].forEach((t=>{switch(t){case"sd-thead":customElements.get(l(t))||customElements.define(l(t),k);break;case"sd-button":customElements.get(l(t))||y();break;case"sd-checkbox":customElements.get(l(t))||g();break;case"sd-floating-portal":customElements.get(l(t))||m();break;case"sd-icon":customElements.get(l(t))||u();break;case"sd-tooltip":customElements.get(l(t))||x()}}))}export{k as S,_ as d}

package/dist/components/p-B0Aqa3rl.js

@@ -0,0 +1 @@
+import{p as t,H as i,c as s,h as e,t as h}from"./p-BFjxNqDj.js";import{d as n}from"./p-CuuPUA52.js";import{d as o}from"./p-BoXTUvyq.js";import{d as a}from"./p-CMVIH_LA.js";var d={default:{fontFamily:"Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif",fontSize:"12",fontWeight:"500",lineHeight:"20"},focus:{fontFamily:"Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif",fontSize:"12",fontWeight:"400",lineHeight:"20"}},r={default:"#F6F6F6",error:"#FCEFEF"},c={default:"#555555",error:"#E30000",focus:"#222222"};const l={height:`${"24"}px`,paddingX:`${"8"}px`,gap:`${"4"}px`,radius:`${"9999"}px`,borderWidth:`${{width:"1"}.width}px`},p={bg:{default:r.default,error:r.error},content:{default:c.default,error:c.error,focus:c.focus}},u={default:{fontFamily:d.default.fontFamily,fontSize:`${d.default.fontSize}px`,fontWeight:d.default.fontWeight,lineHeight:`${d.default.lineHeight}px`},focus:{fontFamily:d.focus.fontFamily,fontSize:`${d.focus.fontSize}px`,fontWeight:d.focus.fontWeight,lineHeight:`${d.focus.lineHeight}px`}},f=t(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.update=s(this,"sdUpdate",7),this.delete=s(this,"sdRemove",7),this.focus=s(this,"sdFocus",7),this.blur=s(this,"sdBlur",7)}get el(){return this}name="";value="";error=!1;disabled=!1;placeholder="";rules=[];internalValue="";isEditing=!1;update;delete;focus;blur;inputEl;draftValue="";shouldInitInput=!1;valueChanged(t){const i=t??"",s=this.isEditing;this.internalValue=i,this.draftValue=i,s&&(this.isEditing=!1,this.shouldInitInput=!1,this.inputEl?.blur(),this.blur.emit())}componentWillLoad(){this.internalValue=this.value??""}componentDidLoad(){this.registerToForm()}disconnectedCallback(){this.unregisterFromForm()}async sdValidate(){if(!this.rules||0===this.rules.length)return this.error=!1,!0;for(const t of this.rules)if(!0!==t(this.internalValue??""))return this.error=!0,!1;return this.error=!1,!0}async sdReset(){this.internalValue="",this.value="",this.error=!1,this.draftValue="",this.isEditing=!1,this.shouldInitInput=!1}async sdResetValidate(){this.error=!1}async sdResetValidation(){this.error=!1}async sdFocus(){this.disabled||this.enterEditMode()}async sdGetNativeElement(){return this.inputEl??null}enterEditMode=()=>{this.disabled||this.isEditing||(this.draftValue=this.internalValue,this.shouldInitInput=!0,this.isEditing=!0,this.focus.emit())};commitEdit=async()=>{if(!this.isEditing)return;const t=(this.inputEl?.textContent??this.draftValue).trim(),i=t!==this.draftValue;this.internalValue=t,this.isEditing=!1,this.shouldInitInput=!1,this.value=t,i&&this.update.emit(t),await this.sdValidate(),this.blur.emit()};cancelEdit=()=>{this.isEditing&&(this.internalValue=this.draftValue,this.isEditing=!1,this.shouldInitInput=!1,this.blur.emit())};handleChipClick=()=>{this.disabled||this.isEditing||this.enterEditMode()};handleChipKeyDown=t=>{this.disabled||this.isEditing||"Enter"!==t.key&&" "!==t.key||(t.preventDefault(),this.enterEditMode())};handleInputChange=t=>{this.internalValue=t.target.textContent??""};handleInputKeyDown=t=>{"Enter"===t.key?(t.preventDefault(),t.stopPropagation(),this.commitEdit()):"Escape"===t.key&&(t.preventDefault(),t.stopPropagation(),this.cancelEdit())};handleInputBlur=()=>{this.commitEdit()};handlePaste=t=>{t.preventDefault();const i=t.clipboardData?.getData("text/plain")??"";document.execCommand("insertText",!1,i)};handleRemoveClick=t=>{t.stopPropagation(),this.disabled||this.delete.emit()};syncInputValue(t){if(!this.inputEl)return;this.inputEl.textContent=t;const i=document.createRange();i.selectNodeContents(this.inputEl),i.collapse(!1);const s=window.getSelection();s?.removeAllRanges(),s?.addRange(i)}registerToForm(){const t=this.el.closest("sd-form");t&&"function"==typeof t.componentOnReady&&t.componentOnReady().then((t=>{t.sdRegisterField(this)}))}unregisterFromForm(){if(""===this.name)return;const t=this.el.closest("sd-form");t?.componentOnReady().then((t=>{t.sdUnregisterField(this)}))}componentDidUpdate(){this.isEditing&&this.inputEl&&this.shouldInitInput&&(this.inputEl.focus(),this.syncInputValue(this.internalValue),this.shouldInitInput=!1)}resolveState(){return this.isEditing?"focus":this.error?"error":"default"}render(){const t=this.resolveState(),i=u.default,s={"--sd-chip-height":l.height,"--sd-chip-padding-x":l.paddingX,"--sd-chip-gap":l.gap,"--sd-chip-radius":l.radius,"--sd-chip-border-width":l.borderWidth,"--sd-chip-bg":"error"===t?p.bg.error:p.bg.default,"--sd-chip-content":"error"===t?p.content.error:p.content.default,"--sd-chip-border-color":"transparent","--sd-chip-font-family":i.fontFamily,"--sd-chip-font-size":i.fontSize,"--sd-chip-font-weight":i.fontWeight,"--sd-chip-line-height":i.lineHeight};return e("span",{key:"e1c1386f3143f4830256784853c1d931706a6beb",class:{"sd-chip":!0,[`sd-chip--${t}`]:!0,"sd-chip--disabled":this.disabled,"sd-chip--editable":!this.disabled},role:this.disabled?void 0:"button",tabIndex:this.disabled||this.isEditing?-1:0,"aria-disabled":this.disabled?"true":void 0,style:s,onClick:this.handleChipClick,onKeyDown:this.handleChipKeyDown},this.isEditing?e("span",{key:"chip-input",ref:t=>this.inputEl=t,class:"sd-chip__input",role:"textbox",tabindex:this.disabled?-1:0,contentEditable:!this.disabled,"data-placeholder":this.placeholder,spellcheck:!1,onInput:this.handleInputChange,onKeyDown:this.handleInputKeyDown,onBlur:this.handleInputBlur,onPaste:this.handlePaste,onClick:t=>t.stopPropagation()}):[e("span",{key:"chip-label",class:"sd-chip__label"},this.internalValue),!this.disabled&&e("sd-ghost-button",{key:"chip-remove",class:"sd-chip__remove",icon:"close",size:"xxs",ariaLabel:"remove",onClick:this.handleRemoveClick})])}static get watchers(){return{value:[{valueChanged:0}]}}static get style(){return"sd-chip{display:inline-flex;width:fit-content;max-width:100%;height:fit-content}sd-chip .sd-chip{display:inline-flex;align-items:center;justify-content:center;gap:var(--sd-chip-gap);max-width:100%;height:var(--sd-chip-height);padding:0 var(--sd-chip-padding-x);border-radius:var(--sd-chip-radius);background:var(--sd-chip-bg);color:var(--sd-chip-content);border:var(--sd-chip-border-width) solid var(--sd-chip-border-color);font-family:var(--sd-chip-font-family);font-size:var(--sd-chip-font-size);font-weight:var(--sd-chip-font-weight);line-height:var(--sd-chip-line-height);box-sizing:border-box;white-space:nowrap;overflow:hidden;-webkit-user-select:none;user-select:none}sd-chip .sd-chip--editable:not(.sd-chip--focus){cursor:text}sd-chip .sd-chip--disabled{cursor:not-allowed;opacity:0.6}sd-chip .sd-chip__label{display:inline-flex;align-items:center;min-width:0;overflow:hidden;text-overflow:ellipsis}sd-chip .sd-chip__input{display:inline-block;min-width:1ch;outline:none;background:transparent;color:inherit;font:inherit;white-space:nowrap;cursor:text}sd-chip .sd-chip__input:empty::before{content:attr(data-placeholder);color:inherit;opacity:0.6;pointer-events:none}sd-chip .sd-chip__remove{flex-shrink:0}"}},[512,"sd-chip",{name:[1],value:[1025],error:[1028],disabled:[4],placeholder:[1],rules:[16],internalValue:[32],isEditing:[32],sdValidate:[64],sdReset:[64],sdResetValidate:[64],sdResetValidation:[64],sdFocus:[64],sdGetNativeElement:[64]},void 0,{value:[{valueChanged:0}]}]);function m(){"undefined"!=typeof customElements&&["sd-chip","sd-ghost-button","sd-icon","sd-tag"].forEach((t=>{switch(t){case"sd-chip":customElements.get(h(t))||customElements.define(h(t),f);break;case"sd-ghost-button":customElements.get(h(t))||n();break;case"sd-icon":customElements.get(h(t))||o();break;case"sd-tag":customElements.get(h(t))||a()}}))}export{u as C,f as S,p as a,l as b,m as d}