@sellmate/design-system 0.0.35 → 0.0.36
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.
- package/dist/cjs/sd-badge.cjs.entry.js +1 -1
- package/dist/cjs/sd-button_15.cjs.entry.js +13 -13
- package/dist/cjs/sd-card.cjs.entry.js +1 -1
- package/dist/cjs/sd-date-picker.cjs.entry.js +2 -2
- package/dist/cjs/sd-date-range-picker.cjs.entry.js +2 -2
- package/dist/cjs/sd-loading-spinner.cjs.entry.js +1 -1
- package/dist/cjs/sd-popover.cjs.entry.js +2 -2
- package/dist/cjs/sd-progress.cjs.entry.js +2 -2
- package/dist/cjs/sd-select-multiple.cjs.entry.js +2 -2
- package/dist/cjs/sd-select-option-group.cjs.entry.js +3 -3
- package/dist/cjs/sd-table-backup.cjs.entry.js +12 -6
- package/dist/cjs/sd-table-backup.entry.cjs.js.map +1 -1
- package/dist/cjs/sd-tag.cjs.entry.js +1 -1
- package/dist/cjs/sd-td.cjs.entry.js +2 -2
- package/dist/collection/collection-manifest.json +1 -1
- package/dist/collection/components/sd-badge/sd-badge.js +1 -1
- package/dist/collection/components/sd-card/sd-card.js +1 -1
- package/dist/collection/components/sd-date-picker/sd-date-picker.js +2 -2
- package/dist/collection/components/sd-date-range-picker/sd-date-range-picker.js +2 -2
- package/dist/collection/components/sd-guide/sd-guide.js +3 -3
- package/dist/collection/components/sd-icon/sd-icon.js +1 -1
- package/dist/collection/components/sd-input/sd-input.js +2 -2
- package/dist/collection/components/sd-loading-spinner/sd-loading-spinner.js +1 -1
- package/dist/collection/components/sd-pagination/sd-pagination.js +2 -2
- package/dist/collection/components/sd-popover/sd-popover.js +2 -2
- package/dist/collection/components/sd-portal/sd-portal.js +1 -1
- package/dist/collection/components/sd-progress/sd-progress.js +2 -2
- package/dist/collection/components/sd-select/sd-select-option/sd-select-option.js +1 -1
- package/dist/collection/components/sd-select-multiple/sd-select-multiple.js +2 -2
- package/dist/collection/components/sd-select-multiple-group/sd-select-option-group/sd-select-option-group.js +3 -3
- package/dist/collection/components/sd-table/sd-tbody/sd-tbody.js +1 -1
- package/dist/collection/components/sd-table/sd-td/sd-td.js +2 -2
- package/dist/collection/components/sd-table/sd-th/sd-th.js +1 -1
- package/dist/collection/components/sd-table/sd-tr/sd-tr.js +1 -1
- package/dist/collection/components/sd-table-backup/sd-table-backup.css +249 -0
- package/dist/collection/components/sd-table-backup/sd-table-backup.js +709 -0
- package/dist/collection/components/sd-table-backup/sd-table-backup.js.map +1 -0
- package/dist/collection/components/sd-tag/sd-tag.js +1 -1
- package/dist/components/{p-CSnKPDQz.js → p-0B7EuAJt.js} +5 -5
- package/dist/components/{p-CSnKPDQz.js.map → p-0B7EuAJt.js.map} +1 -1
- package/dist/components/{p-BeBw4eSm.js → p-18thvuHk.js} +3 -3
- package/dist/components/{p-BeBw4eSm.js.map → p-18thvuHk.js.map} +1 -1
- package/dist/components/{p-BEq3cGoC.js → p-C075_t2h.js} +3 -3
- package/dist/components/{p-BEq3cGoC.js.map → p-C075_t2h.js.map} +1 -1
- package/dist/components/{p-CrmdI2cD.js → p-C79lmNgp.js} +3 -3
- package/dist/components/{p-CrmdI2cD.js.map → p-C79lmNgp.js.map} +1 -1
- package/dist/components/{p-ybbnPl4X.js → p-Ce6LhsfH.js} +7 -7
- package/dist/components/{p-ybbnPl4X.js.map → p-Ce6LhsfH.js.map} +1 -1
- package/dist/components/{p-B8lMIjWB.js → p-CzYhjjIE.js} +7 -7
- package/dist/components/{p-B8lMIjWB.js.map → p-CzYhjjIE.js.map} +1 -1
- package/dist/components/{p-5yzkkdZ2.js → p-D2x4IHr5.js} +3 -3
- package/dist/components/{p-5yzkkdZ2.js.map → p-D2x4IHr5.js.map} +1 -1
- package/dist/components/{p-ntW8MKYi.js → p-D7IsBL9J.js} +5 -5
- package/dist/components/{p-ntW8MKYi.js.map → p-D7IsBL9J.js.map} +1 -1
- package/dist/components/{p-D-s8kK6P.js → p-DHI6oZcr.js} +3 -3
- package/dist/components/{p-D-s8kK6P.js.map → p-DHI6oZcr.js.map} +1 -1
- package/dist/components/{p-CqpahWAy.js → p-DNEKh1qk.js} +3 -3
- package/dist/components/{p-CqpahWAy.js.map → p-DNEKh1qk.js.map} +1 -1
- package/dist/components/{p-BEDQ2CIp.js → p-DTUSoHK4.js} +5 -5
- package/dist/components/{p-BEDQ2CIp.js.map → p-DTUSoHK4.js.map} +1 -1
- package/dist/components/{p-Du8-vyL0.js → p-DpcL5xdv.js} +3 -3
- package/dist/components/{p-Du8-vyL0.js.map → p-DpcL5xdv.js.map} +1 -1
- package/dist/components/{p-GNK9vrin.js → p-InrZhOLL.js} +3 -3
- package/dist/components/{p-GNK9vrin.js.map → p-InrZhOLL.js.map} +1 -1
- package/dist/components/{p-BzdIpn5T.js → p-kLlPK7H2.js} +4 -4
- package/dist/components/{p-BzdIpn5T.js.map → p-kLlPK7H2.js.map} +1 -1
- package/dist/components/sd-badge.js +1 -1
- package/dist/components/sd-button.js +1 -1
- package/dist/components/sd-card.js +1 -1
- package/dist/components/sd-checkbox.js +1 -1
- package/dist/components/sd-date-picker.js +5 -5
- package/dist/components/sd-date-range-picker.js +5 -5
- package/dist/components/sd-guide.js +6 -6
- package/dist/components/sd-icon.js +1 -1
- package/dist/components/sd-input.js +1 -1
- package/dist/components/sd-loading-spinner.js +1 -1
- package/dist/components/sd-pagination.js +1 -1
- package/dist/components/sd-popover.js +4 -4
- package/dist/components/sd-portal.js +1 -1
- package/dist/components/sd-progress.js +2 -2
- package/dist/components/sd-select-multiple-group.js +5 -5
- package/dist/components/sd-select-multiple.js +7 -7
- package/dist/components/sd-select-option-group.js +1 -1
- package/dist/components/sd-select-option.js +1 -1
- package/dist/components/sd-select.js +1 -1
- package/dist/components/sd-table-backup.js +22 -16
- package/dist/components/sd-table-backup.js.map +1 -1
- package/dist/components/sd-table.js +12 -12
- package/dist/components/sd-tag.js +1 -1
- package/dist/components/sd-tbody.js +1 -1
- package/dist/components/sd-td.js +2 -2
- package/dist/components/sd-th.js +1 -1
- package/dist/components/sd-tooltip.js +1 -1
- package/dist/components/sd-tr.js +1 -1
- package/dist/design-system/design-system.esm.js +1 -1
- package/dist/design-system/{p-8b60af66.entry.js → p-0e24195b.entry.js} +2 -2
- package/dist/design-system/{p-01f44c51.entry.js → p-360dd6ab.entry.js} +2 -2
- package/dist/design-system/{p-88745dfe.entry.js → p-3e46bf2b.entry.js} +2 -2
- package/dist/design-system/p-51c4ae08.entry.js +2 -0
- package/dist/design-system/{p-d74bfbe4.entry.js → p-531260cb.entry.js} +2 -2
- package/dist/design-system/{p-7e18d4cf.entry.js → p-675d1b1c.entry.js} +2 -2
- package/dist/design-system/{p-78f90517.entry.js → p-9099eb05.entry.js} +2 -2
- package/dist/design-system/{p-a72c4b0c.entry.js → p-a83759ba.entry.js} +2 -2
- package/dist/design-system/p-c0461df6.entry.js +2 -0
- package/dist/design-system/p-c0461df6.entry.js.map +1 -0
- package/dist/design-system/p-c9109ae0.entry.js +2 -0
- package/dist/design-system/p-d8c1ce0a.entry.js +2 -0
- package/dist/design-system/{p-985be35d.entry.js.map → p-d8c1ce0a.entry.js.map} +1 -1
- package/dist/design-system/p-f4a737de.entry.js +2 -0
- package/dist/design-system/{p-d003ee3d.entry.js → p-ff7b8ecf.entry.js} +2 -2
- package/dist/design-system/sd-table-backup.entry.esm.js.map +1 -1
- package/dist/esm/sd-badge.entry.js +1 -1
- package/dist/esm/sd-button_15.entry.js +13 -13
- package/dist/esm/sd-card.entry.js +1 -1
- package/dist/esm/sd-date-picker.entry.js +2 -2
- package/dist/esm/sd-date-range-picker.entry.js +2 -2
- package/dist/esm/sd-loading-spinner.entry.js +1 -1
- package/dist/esm/sd-popover.entry.js +2 -2
- package/dist/esm/sd-progress.entry.js +2 -2
- package/dist/esm/sd-select-multiple.entry.js +2 -2
- package/dist/esm/sd-select-option-group.entry.js +3 -3
- package/dist/esm/sd-table-backup.entry.js +12 -6
- package/dist/esm/sd-table-backup.entry.js.map +1 -1
- package/dist/esm/sd-tag.entry.js +1 -1
- package/dist/esm/sd-td.entry.js +2 -2
- package/dist/types/components.d.ts +2 -2
- package/hydrate/index.js +46 -40
- package/hydrate/index.mjs +46 -40
- package/package.json +5 -3
- package/dist/collection/components/sd-table/sd-table-backup.js +0 -2743
- package/dist/collection/components/sd-table/sd-table-backup.js.map +0 -1
- package/dist/design-system/p-49f98f09.entry.js +0 -2
- package/dist/design-system/p-671a08a6.entry.js +0 -2
- package/dist/design-system/p-671a08a6.entry.js.map +0 -1
- package/dist/design-system/p-6a624672.entry.js +0 -2
- package/dist/design-system/p-985be35d.entry.js +0 -2
- package/dist/design-system/p-ef5ffaa2.entry.js +0 -2
- /package/dist/design-system/{p-8b60af66.entry.js.map → p-0e24195b.entry.js.map} +0 -0
- /package/dist/design-system/{p-01f44c51.entry.js.map → p-360dd6ab.entry.js.map} +0 -0
- /package/dist/design-system/{p-88745dfe.entry.js.map → p-3e46bf2b.entry.js.map} +0 -0
- /package/dist/design-system/{p-ef5ffaa2.entry.js.map → p-51c4ae08.entry.js.map} +0 -0
- /package/dist/design-system/{p-d74bfbe4.entry.js.map → p-531260cb.entry.js.map} +0 -0
- /package/dist/design-system/{p-7e18d4cf.entry.js.map → p-675d1b1c.entry.js.map} +0 -0
- /package/dist/design-system/{p-78f90517.entry.js.map → p-9099eb05.entry.js.map} +0 -0
- /package/dist/design-system/{p-a72c4b0c.entry.js.map → p-a83759ba.entry.js.map} +0 -0
- /package/dist/design-system/{p-49f98f09.entry.js.map → p-c9109ae0.entry.js.map} +0 -0
- /package/dist/design-system/{p-6a624672.entry.js.map → p-f4a737de.entry.js.map} +0 -0
- /package/dist/design-system/{p-d003ee3d.entry.js.map → p-ff7b8ecf.entry.js.map} +0 -0
- /package/dist/types/components/{sd-table → sd-table-backup}/sd-table-backup.d.ts +0 -0
|
@@ -14,7 +14,7 @@ const SdBadge = class {
|
|
|
14
14
|
label = '';
|
|
15
15
|
render() {
|
|
16
16
|
const resolvedColor = resolveColor.resolveColor(this.color);
|
|
17
|
-
return (index.h(index.Host, { key: '
|
|
17
|
+
return (index.h(index.Host, { key: '6fc1c113b707f4419fa48c8b4b78be6a7bbf6b83' }, index.h("div", { key: 'ab3297321ee0e6e742acd408901dce1b5894d200', class: `sd-badge sd-badge--${this.size}`, style: { '--sd-badge-color': resolvedColor } }, index.h("div", { key: '02f42d0ba064db273d83671e9c271c543787daf8', class: "sd-badge__dot" }), index.h("div", { key: 'f6a175282ab77e9a8ac2098029ac1aab5cb66190', class: "sd-badge__label" }, this.label))));
|
|
18
18
|
}
|
|
19
19
|
};
|
|
20
20
|
SdBadge.style = sdBadgeCss;
|
|
@@ -199,11 +199,11 @@ const SdGuide = class {
|
|
|
199
199
|
};
|
|
200
200
|
render() {
|
|
201
201
|
const { name: iconName, size: iconSize, color: iconColor } = GUIDE_ICON[this.type];
|
|
202
|
-
return (index.h(index.Host, { key: '
|
|
202
|
+
return (index.h(index.Host, { key: 'cc560b500dc857dd2fb9817d5f870e702cfe6420', style: {
|
|
203
203
|
'--sd-guide-color': GUIDE_ICON[this.type].color,
|
|
204
|
-
} }, index.h("sd-button", { key: '
|
|
204
|
+
} }, index.h("sd-button", { key: '4abbeb9eb5a021b790516ad6356ca61a8c81e30d', ref: el => (this.guideRef = el), class: this.guideClass, variant: this.popupShow ? 'primary' : 'outline', label: GUIDE_LABEL[this.type], size: "sm", color: this.popupShow ? GUIDE_ICON[this.type].color : 'grey_45', icon: iconName, iconColor: this.popupShow ? 'white' : iconColor, iconSize: iconSize, noHover: this.popupShow, onSdClick: this.handleClickGuide }), this.type === 'help' && this.popupShow && (index.h("sd-portal", { key: 'acdee17ca7be22d52bbb7309430d3ce27bab8784', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, index.h("div", { key: '8e7402bcf9308e9c3890a4ad55a54efe5f440c95', class: "sd-guide__popup", style: { width: this.popupWidth ? this.popupWidth + 'px' : '426px' } }, index.h("sd-button", { key: '05eb16594e9a2b16974e957988149114ac2bc0f9', class: "sd-guide__popup__close", icon: "close", color: resolveColor.colors.grey_65, size: "md", variant: "ghost", noHover: true,
|
|
205
205
|
// buttonStyle={{ padding: '0px', minHeight: '0px' }}
|
|
206
|
-
onSdClick: this.closeDropdown }), index.h("div", { key: '
|
|
206
|
+
onSdClick: this.closeDropdown }), index.h("div", { key: 'fc36f51b032fd41e63d53024f0714fbf974b37a3', class: "sd-guide__popup__header" }, index.h("sd-icon", { key: 'bb6a8005b45704029d7c8fdde7908d52c7fb2bd1', name: "helpOutline", size: 24, color: resolveColor.colors.green_65 }), index.h("h3", { key: 'bafff977e7a4c36515c035fc05074d5445a111bb', class: "sd-guide__popup__title" }, this.label || GUIDE_LABEL[this.type])), index.h("ul", { key: '1adafdaf539257ba4b61b958ef3a21362d5e44bf', class: "sd-guide__popup__list" }, this.renderListItem(this.message)))))));
|
|
207
207
|
}
|
|
208
208
|
// 현재 2depth까지만 스타일 적용
|
|
209
209
|
renderListItem(message, depth = 0) {
|
|
@@ -2233,7 +2233,7 @@ const SdIcon = class {
|
|
|
2233
2233
|
}
|
|
2234
2234
|
render() {
|
|
2235
2235
|
const IconComponent = Icons[this.name]?.[this.size];
|
|
2236
|
-
return (index.h("i", { key: '
|
|
2236
|
+
return (index.h("i", { key: '1b3f72da8307068cb0723bbc66723bfcf15a4644', class: this.getIconClasses(), style: this.iconStyle }, index.h(IconComponent, { key: 'a2526ffca360d28daf0f265822072e294ed27155', color: this.resolvedColor })));
|
|
2237
2237
|
}
|
|
2238
2238
|
};
|
|
2239
2239
|
SdIcon.style = sdIconCss;
|
|
@@ -2338,11 +2338,11 @@ const SdInput = class {
|
|
|
2338
2338
|
'--input-width': typeof this.width === 'number' ? `${this.width}px` : this.width,
|
|
2339
2339
|
}
|
|
2340
2340
|
: {};
|
|
2341
|
-
return (index.h(index.Host, { key: '
|
|
2341
|
+
return (index.h(index.Host, { key: 'bb677f1411303375222c7eadf7738d97de04c4ad', style: inputWidth }, this.label && index.h("div", { key: '0d05e92148e90645bf8c61d94693eb74d0e37154', class: "sd-input__label" }, this.label), index.h("label", { key: 'a6a9a4912b4e0e9fb44d9d273f73b88db804bd97', class: {
|
|
2342
2342
|
'sd-input': true,
|
|
2343
2343
|
[this.getInputStatus()]: true,
|
|
2344
2344
|
'sd-input--barcode': !!this.barcode,
|
|
2345
|
-
}, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: this.inputStyle }, index.h("slot", { key: '
|
|
2345
|
+
}, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: this.inputStyle }, index.h("slot", { key: 'df634eb250fc1dff27e1db4372b3c90c14f9cd79', name: "prefix" }), index.h("input", { key: '0d2e5619efef215cd7c9552a015422bf9c036d35', ref: el => (this.nativeEl = el), class: `sd-input__native_element ${this.inputClass}`, type: "text", value: this.internalValue || '', placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, onInput: this.handleInput, onChange: this.handleChange, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event) }), index.h("slot", { key: 'c139e8cb7691263e1f4ab2e1e0eadc8284303a39', name: "suffix" }), this.clearable && this.internalValue && (index.h("sd-icon", { key: 'b4e2a13aabf0257ff72d982197b8eab99ad6d441', name: "close", color: "#888", class: "sd-input__clear-icon", onClick: () => {
|
|
2346
2346
|
this.internalValue = '';
|
|
2347
2347
|
this.sdChange?.emit(this.internalValue);
|
|
2348
2348
|
this.sdInput?.emit(this.internalValue);
|
|
@@ -2435,12 +2435,12 @@ const SdPagination = class {
|
|
|
2435
2435
|
}
|
|
2436
2436
|
}
|
|
2437
2437
|
render() {
|
|
2438
|
-
return (index.h("div", { key: '
|
|
2438
|
+
return (index.h("div", { key: 'ee07e420809eca9641ab325d38c48a054b9e04de', class: this.paginationClasses }, index.h("div", { key: 'a7b7f129832a465fd4426cf142385f37461a65b7', class: "prepend-btns" }, this.renderPrevButtons()), this.simple ? (index.h("div", { class: "pagination-info" }, index.h("span", { class: "current-page" }, this.currentPage), index.h("span", null, "/"), index.h("span", { class: "last-page" }, this.lastPage))) : (this.pageNumbers.map(n => (index.h("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
|
|
2439
2439
|
'pagination-btn': true,
|
|
2440
2440
|
'pagination-btn--selected': this.currentPage === n,
|
|
2441
2441
|
}, disabled: this.currentPage === n, style: {
|
|
2442
2442
|
'--pagination-btn-width': `${this.buttonWidth}px`,
|
|
2443
|
-
}, onClick: () => this.handlePageChange(n) }, n)))), index.h("div", { key: '
|
|
2443
|
+
}, onClick: () => this.handlePageChange(n) }, n)))), index.h("div", { key: 'c1a8fd3d61d24652a17ec30ed436c90c77a19144', class: "append-btns" }, this.renderNextButtons())));
|
|
2444
2444
|
}
|
|
2445
2445
|
static get watchers() { return {
|
|
2446
2446
|
"currentPage": ["onPropChange"],
|
|
@@ -2567,7 +2567,7 @@ const SdPortal = class {
|
|
|
2567
2567
|
this.sdClose.emit();
|
|
2568
2568
|
}
|
|
2569
2569
|
render() {
|
|
2570
|
-
return index.h("slot", { key: '
|
|
2570
|
+
return index.h("slot", { key: 'f1445e7060928e48032fbed8f3b7604e626850c2' });
|
|
2571
2571
|
}
|
|
2572
2572
|
};
|
|
2573
2573
|
|
|
@@ -2850,7 +2850,7 @@ const SdSelectOption = class {
|
|
|
2850
2850
|
}
|
|
2851
2851
|
};
|
|
2852
2852
|
render() {
|
|
2853
|
-
return (index.h(index.Host, { key: '
|
|
2853
|
+
return (index.h(index.Host, { key: '56d2ed3525521a59eb3f0d8231a53259ebd22424' }, index.h("div", { key: '200849af32a94d4c9aeb35760ce3d8396da45836', class: {
|
|
2854
2854
|
'sd-select__option': true,
|
|
2855
2855
|
'sd-select__option--selected': this.isSelected,
|
|
2856
2856
|
'sd-select__option--disabled': !!this.option.disabled,
|
|
@@ -3115,7 +3115,7 @@ const SdTbody = class {
|
|
|
3115
3115
|
index.registerInstance(this, hostRef);
|
|
3116
3116
|
}
|
|
3117
3117
|
render() {
|
|
3118
|
-
return (index.h(index.Host, { key: '
|
|
3118
|
+
return (index.h(index.Host, { key: 'fb4f565321e2f5308bdb5c318e385c4704730d16' }, index.h("slot", { key: '3ba442c1026ebbce4960031ed3113ebd16d949ec' })));
|
|
3119
3119
|
}
|
|
3120
3120
|
};
|
|
3121
3121
|
SdTbody.style = sdTbodyCss;
|
|
@@ -3127,7 +3127,7 @@ const SdTh = class {
|
|
|
3127
3127
|
index.registerInstance(this, hostRef);
|
|
3128
3128
|
}
|
|
3129
3129
|
render() {
|
|
3130
|
-
return (index.h(index.Host, { key: '
|
|
3130
|
+
return (index.h(index.Host, { key: '98d5096b0d03db947da3ea0129b43a5d291d0ddd', role: "columnheader" }, index.h("slot", { key: '4ccaa018abd5915d2069adc01b802bb9392cc186' })));
|
|
3131
3131
|
}
|
|
3132
3132
|
};
|
|
3133
3133
|
SdTh.style = sdThCss;
|
|
@@ -3357,7 +3357,7 @@ const SdTr = class {
|
|
|
3357
3357
|
index.registerInstance(this, hostRef);
|
|
3358
3358
|
}
|
|
3359
3359
|
render() {
|
|
3360
|
-
return (index.h(index.Host, { key: '
|
|
3360
|
+
return (index.h(index.Host, { key: 'f20a0bbaf94ce37ef8cbf4d59c24159549294ff2', role: "row" }, index.h("slot", { key: '8b5d3685c916a4ad8422c03e35f9b699961a1415' })));
|
|
3361
3361
|
}
|
|
3362
3362
|
};
|
|
3363
3363
|
SdTr.style = sdTrCss;
|
|
@@ -11,7 +11,7 @@ const SdCard = class {
|
|
|
11
11
|
bordered = true;
|
|
12
12
|
class = '';
|
|
13
13
|
render() {
|
|
14
|
-
return (index.h(index.Host, { key: '
|
|
14
|
+
return (index.h(index.Host, { key: 'f00cdc166da4589d81d732fb4bc84d0258efaccb' }, index.h("div", { key: 'c640a9db7ef09eee390ca0c0e8484a5802d17cbd', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.class}` }, index.h("slot", { key: '07421b4249bf7a94aa1a574011b33f7082fa984a' }))));
|
|
15
15
|
}
|
|
16
16
|
};
|
|
17
17
|
SdCard.style = sdCardCss;
|
|
@@ -82,9 +82,9 @@ const SdDatePicker = class {
|
|
|
82
82
|
this.isOpen = false;
|
|
83
83
|
};
|
|
84
84
|
render() {
|
|
85
|
-
return (index.h(index.Host, { key: '
|
|
85
|
+
return (index.h(index.Host, { key: '056414534f658c5e77fedf40d94e578299b437cc', class: "sd-date-picker" }, index.h("sd-input", { key: 'eb65e6bb246b604287088a3857681f2a18c06464', ref: el => (this.inputEl = el), value: this.date, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", inputStyle: {
|
|
86
86
|
margin: '0 0 0 8px',
|
|
87
|
-
}, onClick: () => this.openMenu() }, index.h("sd-icon", { key: '
|
|
87
|
+
}, onClick: () => this.openMenu() }, index.h("sd-icon", { key: 'd71e7a84bef6b956e77fb7f718568e8d1df59562', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (index.h("sd-portal", { key: '0cb4ff03893ddf4a095760f326104d91bdb6265b', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, index.h("div", { key: '7a3bbe3f4cd379d94832005653aacc166e6b66cf', class: "sd-date-picker__menu" }, index.h("div", { key: '6b33cab1222e71e3004425b07afbdffef0ec0a6b', class: "sd-date-picker__header" }, index.h("div", { key: 'acc16c94cfea8399ce5d210de7286760238c0963', class: "year-nav" }, index.h("button", { key: '6f577329b27057306e163c0c92ae16eff29a15b4', type: "button", name: "prev-year", title: "Previous Year", onClick: () => this.setCurrentYear(this.currentYear - 1) }, index.h("sd-icon", { key: 'c8174f406a3ba95d98ae31c6f4004f4178f6ac5f', name: "arrowLeft", size: "12", color: "#CCCCCC" })), index.h("span", { key: 'cdcb96cd0fbf6abedcaaa7b5cca8a56c90b62284', class: "year-nav__current" }, this.currentYear), index.h("button", { key: '9aba8e6ebde34b7a29e52525cff8fbe8a243ae6a', type: "button", name: "next-year", title: "Next Year", onClick: () => this.setCurrentYear(this.currentYear + 1) }, index.h("sd-icon", { key: '423d3b35b56f32006edfd0bdf6f457dd46a591b5', name: "arrowRight", size: "12", color: "#CCCCCC" }))), index.h("div", { key: 'c5dd3a1b495e48c2c980207591f161486042c361', class: "month-nav" }, index.h("button", { key: '48265eec87bdb40c3189d07ef1711bf95bb55381', type: "button", name: "prev-month", title: "Previous ", onClick: () => this.handleUpdateMonth('prev') }, index.h("sd-icon", { key: '7274e698f9c7a06369c8fe6064ec0acd9fce62c8', name: "arrowLeft", size: "12", color: "#CCCCCC" })), index.h("span", { key: '54e15aaad9ac9563f66a6bb4dc7b19f7dc01d7c0', class: "month-nav__current" }, this.currentMonth, "\uC6D4"), index.h("button", { key: '32da2302da74ef7bc8805138ce414b903d247878', type: "button", name: "next-month", title: "Next Month", onClick: () => this.handleUpdateMonth('next') }, index.h("sd-icon", { key: '041809657b4288519ca476953be773403912c858', name: "arrowRight", size: "12", color: "#CCCCCC" })))), index.h("div", { key: 'd32cd40e6df89c95f4b2639c6bc98f7156a09bc2', class: "sd-date-picker__days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (index.h("div", { key: day, class: "day" }, day)))), index.h("div", { key: 'e6fafbf9ec82a8f3abe9d67c61279598498a7396', class: "sd-date-picker__body" }, [
|
|
88
88
|
...this.calendar.prevMonthDays,
|
|
89
89
|
...this.calendar.days,
|
|
90
90
|
...this.calendar.afterMonthDays,
|
|
@@ -157,9 +157,9 @@ const SdDateRangePicker = class {
|
|
|
157
157
|
this.isOpen = false;
|
|
158
158
|
};
|
|
159
159
|
render() {
|
|
160
|
-
return (index.h(index.Host, { key: '
|
|
160
|
+
return (index.h(index.Host, { key: '9c7457b54e433a167193eeaafa8a0e7755ca24db', class: "sd-date-range-picker" }, index.h("sd-input", { key: '85b4c4fca2e6157ae7f6291593a20329086fe372', ref: el => (this.inputEl = el), value: `${this.dateRange[0]} ~ ${this.dateRange[1]}`, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", inputStyle: {
|
|
161
161
|
margin: '0 0 0 8px',
|
|
162
|
-
}, onClick: () => this.openMenu() }, index.h("sd-icon", { key: '
|
|
162
|
+
}, onClick: () => this.openMenu() }, index.h("sd-icon", { key: 'e38b9dde8571369ff85bf10baff71437b0cf48f4', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (index.h("sd-portal", { key: '2f85011e2a47bb0717239da419fcd27c8410db81', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, index.h("div", { key: '21f147563f6ab7c9a1a2b08cf1951bb11a8a0302', class: "sd-date-range-picker__menu" }, index.h("div", { key: '2dad8cef33d07db263a73cd3760dbf44e33dd7ab', class: "sd-date-range-picker__header mb-16pxr flex flex-nowrap items-center justify-center" }, index.h("button", { key: '53ccd475c6ebec5999158b2669878b0426e505d1', type: "button", name: "prev", title: "Previous", onClick: () => this.setPrevYear(this.prevYear - 1) }, index.h("sd-icon", { key: 'aba2465aae092388568006a7a968c27446476470', name: "arrowLeft", size: "12", color: "#CCCCCC" })), index.h("div", { key: 'd4384c1901a5e5221d55a18e014c0955af561660', class: "header-label" }, this.prevYear), index.h("button", { key: '26f2e7f9da0f4571d4ca2cf0a668ceb4784af9c6', type: "button", name: "next", title: "Next", onClick: () => this.setPrevYear(this.prevYear + 1) }, index.h("sd-icon", { key: 'fc670a78e443dc7de8fbb05fe3233ae5bd6544d4', name: "arrowRight", size: "12", color: "#CCCCCC" }))), index.h("div", { key: 'fb2157002f772dee6c4ff4b76cd3c942d4bb9965', class: "sd-date-range-picker__body" }, [this.prevCalendar, this.nextCalendar].map((calendar, index$1) => (index.h(index.Fragment, null, index$1 === 1 && index.h("div", { class: "separator" }), index.h("div", { key: index$1, class: "calendar-container" }, index.h("div", { class: "calendar-header" }, index.h("button", { type: "button", name: "month", title: "Month", class: index$1 === 0 ? 'header-button-prev' : 'header-button-next', onClick: () => this.updateYearMonth(index$1 === 0 ? 'prev' : 'next') }, index.h("sd-icon", { name: index$1 === 0 ? 'arrowLeft' : 'arrowRight', size: "12", color: "#CCCCCC" })), index$1 === 0
|
|
163
163
|
? `${this.prevYear}.${String(this.prevMonth).padStart(2, '0')}`
|
|
164
164
|
: `${this.nextYear}.${String(this.nextMonth).padStart(2, '0')}`), index.h("div", { class: "calendar-days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (index.h("sd-date-box", { key: day, date: day, disabled: true, class: "day" })))), index.h("div", { class: "calendar-body mt-12pxr grid grid-cols-7 gap-y-8pxr" }, [...calendar.prevMonthDays, ...calendar.days, ...calendar.afterMonthDays].map((day, idx) => (index.h("sd-date-box", { key: `prev${day}_${idx}`, date: !day ? '' : Number(day), selected: this.dateRange.some(date => date ===
|
|
165
165
|
this.dateUtil.formatDate(index$1 === 0 ? this.prevYear : this.nextYear, index$1 === 0 ? this.prevMonth : this.nextMonth, Number(day))), type: this.getDateBoxType(this.dateUtil.formatDate(index$1 === 0 ? this.prevYear : this.nextYear, index$1 === 0 ? this.prevMonth : this.nextMonth, Number(day))), isToday: useDatePicker.today ===
|
|
@@ -9,7 +9,7 @@ const SdLoadingSpinner = class {
|
|
|
9
9
|
index.registerInstance(this, hostRef);
|
|
10
10
|
}
|
|
11
11
|
render() {
|
|
12
|
-
return (index.h(index.Host, { key: '
|
|
12
|
+
return (index.h(index.Host, { key: '8ab87f8cf1e002856b6721de5ca5313ccafb3265' }, index.h("svg", { key: 'da44064be6ab5c19d8517eb4da37c4849997715b', class: "sd-loading-spinner text-positive", width: "72px", height: "72px", viewBox: "25 25 50 50" }, index.h("circle", { key: 'f446e24aabaf694e4158ec7e91ad4c39e33b4f91', class: "path", cx: "50", cy: "50", r: "20", fill: "none", stroke: "currentColor", "stroke-width": "5", "stroke-miterlimit": "10" }))));
|
|
13
13
|
}
|
|
14
14
|
};
|
|
15
15
|
SdLoadingSpinner.style = sdLoadingSpinnerCss;
|
|
@@ -39,11 +39,11 @@ const SdPopover = class {
|
|
|
39
39
|
this.showPopover = false;
|
|
40
40
|
};
|
|
41
41
|
render() {
|
|
42
|
-
return (index.h(index.Fragment, { key: '
|
|
42
|
+
return (index.h(index.Fragment, { key: 'a58d208a0a9ba1e954568512f1dbe0df88922623' }, this.label ? (index.h("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: this.icon, size: this.buttonSize, color: this.color, variant: this.buttonVariant, class: "sd-popover", onClick: () => (console.log('click popover'), (this.showPopover = !this.showPopover)) })) : (index.h("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-popover", onClick: () => (console.log('click popover'), (this.showPopover = !this.showPopover)) })), this.showPopover && (index.h("sd-tooltip-portal", { key: '7ffbc49de8f33edbc05beec6cb554820bdbde2b6', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement }, index.h("div", { key: 'fcf1b9069831494c3c2ee5e274037c211f342993', class: {
|
|
43
43
|
'sd-popover-menu': true,
|
|
44
44
|
[`sd-popover-menu--${this.placement}`]: true,
|
|
45
45
|
[this.menuClass]: !!this.menuClass,
|
|
46
|
-
} }, index.h("i", { key: '
|
|
46
|
+
} }, index.h("i", { key: 'e1bd244e2c8c2e1c8a4759f96ce44e5cdda41bcc', class: `sd-popover-menu__arrow sd-popover-menu__arrow--${this.placement}` }, index.h(tooltipArrow.TooltipArrow, { key: '36cf86a871f7454f2916ce8157e7d9234d808666' })), index.h("div", { key: '8fcd872f31d3dfcad2b8b7d26c7956368289d8cf', class: "sd-popover-menu__content" }, this.menuTitle && index.h("div", { key: '435f956e668910900948999a2ae23a7ffbdf67cd', class: "sd-popover-menu__title" }, this.menuTitle), this.messages.length > 0 && (index.h("div", { key: '80eaa27446106e6380712fb00ad9df4752ebb70b', class: "sd-popover-menu__messages" }, this.messages.map(message => (index.h("div", null, message))))), this.buttons.length > 0 && (index.h("div", { key: 'b4845d8ac339559c2b612a219517a6addb47aaca', class: `sd-popover-menu__buttons sd-popover-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (index.h("sd-button", { ...button })))))), this.useClose && (index.h("button", { key: '56ab62d73d4e71d871165d28adf7ecd4efd92870', class: "sd-popover-menu__close-button", onClick: () => this.handleClose() }, index.h("sd-icon", { key: 'ea93c1a46baef7cb4b7a849b8744043afc11de79', name: "close", size: "12", color: "#AAAAAA" }))))))));
|
|
47
47
|
}
|
|
48
48
|
static get watchers() { return {
|
|
49
49
|
"show": ["watchShowHandler"]
|
|
@@ -21,10 +21,10 @@ const SdProgress = class {
|
|
|
21
21
|
error: '#FB4444',
|
|
22
22
|
};
|
|
23
23
|
render() {
|
|
24
|
-
return (index.h(index.Host, { key: '
|
|
24
|
+
return (index.h(index.Host, { key: '5ac52da4809e45fc5bc69991aea3bd423b72ffdc', style: {
|
|
25
25
|
'--progress-color': this.statusColor[this.status],
|
|
26
26
|
'--progress-percentage': `${this.percentage}%`,
|
|
27
|
-
} }, this.type === 'bar' ? this.renderBarProgress() : this.renderSpinnerProgress(), this.label && index.h("div", { key: '
|
|
27
|
+
} }, this.type === 'bar' ? this.renderBarProgress() : this.renderSpinnerProgress(), this.label && index.h("div", { key: '7758a60580ab05cd2dd396b16cc4483d890e0498', class: "sd-progress__label" }, this.label)));
|
|
28
28
|
}
|
|
29
29
|
renderBarProgress() {
|
|
30
30
|
return (index.h("div", { class: `sd-progress__bar sd-progress__bar--${this.status}` }, index.h("div", { class: ['sd-progress__bar__percent', this.percentage < 100 ? 'proceed' : ''].join(' ') }), index.h("div", { class: "sd-progress__bar__indicator sd-progress__bar__indicator--left" }, this.percentage, "%"), index.h("div", { class: "sd-progress__bar__indicator sd-progress__bar__indicator--right" }, this.percentage, "%")));
|
|
@@ -215,11 +215,11 @@ const SdSelectMultiple = class extends selectKeyboardNavigation.BaseDropdownEven
|
|
|
215
215
|
'--select-width': this.width || '200px',
|
|
216
216
|
'--select-dropdown-height': this.dropdownHeight || '260px',
|
|
217
217
|
};
|
|
218
|
-
return (index.h(index.Host, { key: '
|
|
218
|
+
return (index.h(index.Host, { key: '5dd79017c9796e6412984675fcd3ec2d03e32012', style: style }, index.h("div", { key: '777e5c8c777fb421c06ccc99ad114077918d3091', class: {
|
|
219
219
|
'sd-select-multiple': true,
|
|
220
220
|
'sd-select-multiple--open': this.isOpen,
|
|
221
221
|
'sd-select-multiple--disabled': this.disabled,
|
|
222
|
-
}, ref: el => (this.selectRef = el) }, this.renderLabel(this.label), index.h("div", { key: '
|
|
222
|
+
}, ref: el => (this.selectRef = el) }, this.renderLabel(this.label), index.h("div", { key: '897dbc13dddd89e3bf3be9b77efe5aa04600ea1f', class: "sd-select-multiple__container" }, this.renderTrigger(), this.renderDropdown()))));
|
|
223
223
|
}
|
|
224
224
|
renderLabel(label) {
|
|
225
225
|
if (!label)
|
|
@@ -48,7 +48,7 @@ const SdSelectOptionGroup = class {
|
|
|
48
48
|
}
|
|
49
49
|
};
|
|
50
50
|
render() {
|
|
51
|
-
return (index.h("div", { key: '
|
|
51
|
+
return (index.h("div", { key: 'e873486c47436a1cb2e3797dfe06b89874429e18', class: {
|
|
52
52
|
'sd-select__option-group': true,
|
|
53
53
|
'sd-select__option-group--selected': !!this.isSelected,
|
|
54
54
|
'sd-select__option-group--disabled': !!this.option.disabled,
|
|
@@ -57,10 +57,10 @@ const SdSelectOptionGroup = class {
|
|
|
57
57
|
'sd-select__option-group--group': this.option.type === 'group',
|
|
58
58
|
'sd-select__option-group--subgroup': this.option.type === 'subgroup',
|
|
59
59
|
'sd-select__option-group--item': this.option.type === 'item',
|
|
60
|
-
}, onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), style: this.optionStyle, "data-index": this.index, onClick: event => this.handleClick(this.option, this.isSelected, event) }, index.h("div", { key: '
|
|
60
|
+
}, onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), style: this.optionStyle, "data-index": this.index, onClick: event => this.handleClick(this.option, this.isSelected, event) }, index.h("div", { key: '7a54f43c2f654f26ff44cb039136488b17492336', class: "sd-select__option-group__label-wrapper" }, this.useCheckbox && (index.h("sd-checkbox", { key: 'ffe73a278e2e4869b3389b15268ab3c6d1117d47', checked: this.isSelected, disabled: this.option.disabled, onClick: e => {
|
|
61
61
|
e.preventDefault();
|
|
62
62
|
this.handleClick(this.option, this.isSelected, e);
|
|
63
|
-
} })), index.h("span", { key: '
|
|
63
|
+
} })), index.h("span", { key: '7c05471592fd30b12b94d158b11c76e98f4634ef', class: "sd-select__option-group-label" }, this.option.label), this.useIndicator && this.option.type !== 'item' && (index.h("span", { key: 'd395b359af93878867f61990741d174bb81cd959', class: "sd-select__option-group__count-indicator" }, `(${this.countInfo?.selectedCount}/${this.countInfo?.totalCount})`)))));
|
|
64
64
|
}
|
|
65
65
|
};
|
|
66
66
|
SdSelectOptionGroup.style = sdSelectOptionGroupCss;
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
var index = require('./index-DXo1Fhkn.js');
|
|
4
4
|
|
|
5
|
-
const
|
|
5
|
+
const sdTableBackupCss = ".sd-table__wrapper .sd-table__container .sd-table__middle{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar:horizontal{height:8px}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar:vertical{width:8px}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar-track{background-color:transparent}.sd-table__wrapper{height:var(--table-height, auto);width:var(--table-width, 100%);color:#222222}.sd-table__wrapper .sd-table__container{width:100%;height:auto;border:1px solid #e1e1e1;border-radius:8px;font-size:12px;overflow:hidden}.sd-table__wrapper .sd-table__container .sd-table__middle{overflow:auto;position:relative;will-change:scroll-position;height:var(--table-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle--loading{overflow:hidden !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table{background-color:white;display:table;width:100%;height:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--selectable td.sd-td--selected,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--selectable th.sd-th--selected{width:52px !important;max-width:52px !important;min-width:52px !important;padding:0 10px 0 24px;text-align:left}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-header thead{position:sticky;top:0;z-index:120}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column th.sticky-left,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column th.sticky-right{position:sticky;background-color:#f5faff;z-index:110 !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column td.sticky-left,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column td.sticky-right{position:sticky;background-color:white;z-index:100 !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column .sticky-left{left:var(--sticky-left-offset, 0)}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column .sticky-right{right:var(--sticky-right-offset, 0)}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column th.sticky-cell{position:sticky;z-index:102;background-color:#f5faff}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column td.sticky-cell{position:sticky;z-index:101;background-color:white}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left th.sticky-left-edge,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left td.sticky-left-edge{overflow:visible}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left th.sticky-left-edge:after,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left td.sticky-left-edge:after{content:\"\";position:absolute;top:0;left:100%;right:-20px;width:20px;height:100%;z-index:101 !important;box-shadow:inset 12px 0 20px -25px;opacity:1;pointer-events:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right th.sticky-right-edge,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right td.sticky-right-edge{overflow:visible}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right th.sticky-right-edge:after,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right td.sticky-right-edge:after{content:\"\";position:absolute;top:0;left:-20px;width:20px;height:100%;z-index:101 !important;box-shadow:inset -12px 0 20px -25px;opacity:1;pointer-events:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--no-data thead{opacity:0.4}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--no-data thead tr th.sd-th{border-bottom:1px solid rgba(225, 225, 225, 0.4) !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table sd-td,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table sd-th,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table .sd-th__content--label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead{height:36px}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr{width:100%}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th{background:#f5faff;height:36px;padding:0 16px;font-weight:500;vertical-align:middle;border-bottom:1px solid #e1e1e1;-webkit-user-select:none;user-select:none;position:relative}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__content{display:flex;flex-flow:row nowrap;align-items:center;gap:4px}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__content--left{justify-content:flex-start}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__content--center{justify-content:center}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__content--right{justify-content:flex-end}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__resizer{position:absolute;top:50%;right:0;transform:translateY(-50%);width:4px;height:16px;cursor:col-resize;z-index:3;border-left:1px solid #cccccc;border-right:1px solid #cccccc}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody{flex-grow:1}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody .sd-table__loading{position:absolute;top:0;left:0;width:100%;height:100%;min-height:100%;background:rgba(255, 255, 255, 0.6);z-index:200;display:flex;align-items:center;justify-content:center}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody .sd-table__no-data-row td{text-align:center;color:#888888}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr:last-of-type td{border-bottom:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr td{height:44px;padding:0 16px;border-bottom:1px solid #e1e1e1;background:white;vertical-align:middle}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr td.sd-td--left{text-align:left}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr td.sd-td--center{text-align:center}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr td.sd-td--right{text-align:right}.sd-table__wrapper .sd-table__container .sd-table__bottom{background:white;text-align:center}.sd-table__wrapper .sd-table__pagination{position:relative;background:#f9f9f9;height:48px;display:flex;align-items:center;justify-content:center;border:1px solid #e1e1e1;border-top:none;border-radius:8px}.sd-table__wrapper .sd-table__pagination sd-select{position:absolute;right:10px;top:50%;transform:translateY(-50%)}";
|
|
6
6
|
|
|
7
7
|
const SdTable = class {
|
|
8
8
|
constructor(hostRef) {
|
|
@@ -60,6 +60,9 @@ const SdTable = class {
|
|
|
60
60
|
this.innerRows = [...(this.rows || [])];
|
|
61
61
|
this.innerSelected = new Set(this.selected);
|
|
62
62
|
this.columnWidths = (this.columns || []).map(c => parseInt(c.width || '120', 10));
|
|
63
|
+
if (this.pagination?.page) {
|
|
64
|
+
this.currentPage = this.pagination.page;
|
|
65
|
+
}
|
|
63
66
|
}
|
|
64
67
|
componentDidLoad() {
|
|
65
68
|
// SSR 환경 체크
|
|
@@ -197,7 +200,7 @@ const SdTable = class {
|
|
|
197
200
|
}, style: this.getStickyStyle(colIdx) }, index.h("div", { class: `sd-th__content sd-th__content--${col.align || 'left'}` }, index.h("slot", { name: `header-cell-${col.name}` }, index.h("div", { class: "sd-th__content--label" }, col.label)), col.usePageMoveIcon && index.h("sd-icon", { name: "pageMove", size: "12", color: "#006AC1" }), col.tooltip && (index.h("sd-tooltip", { ...col.tooltipOptions }, index.h("div", { slot: "content" }, col.tooltip.map(text => (index.h("p", null, text))))))), this.resizable && typeof window !== 'undefined' && (index.h("div", { class: "sd-th__resizer", onMouseDown: (evt) => this.handleResize(colIdx, evt) }))))))));
|
|
198
201
|
}
|
|
199
202
|
renderBody() {
|
|
200
|
-
return (index.h("tbody", { ...(!this.paginatedRows.length && { part: 'tbody-empty' }) }, this.isLoading && (index.h("div", { class: "sd-table__loading" }, index.h("sd-loading-spinner", null))), !this.paginatedRows.length ? (index.h("tr",
|
|
203
|
+
return (index.h("tbody", { ...(!this.paginatedRows.length && { part: 'tbody-empty' }) }, this.isLoading && (index.h("div", { class: "sd-table__loading" }, index.h("sd-loading-spinner", null))), !this.paginatedRows.length ? (index.h("tr", { class: "sd-table__no-data-row" }, index.h("td", { colSpan: this.visibleColumns.length + (this.selectable ? 1 : 0) }, index.h("slot", { name: "no-data" }, this.noDataLabel)))) : (this.paginatedRows.map((row, rowIdx) => (index.h("tr", { key: row[this.rowKey], class: "hover:bg-Grey_Lighten-6" }, this.selectable && (index.h("td", { class: {
|
|
201
204
|
'sd-td': true,
|
|
202
205
|
'sd-td--selected': true,
|
|
203
206
|
'sticky-left': Boolean(this.stickyColumn.left && this.stickyColumn.left > 0),
|
|
@@ -219,10 +222,13 @@ const SdTable = class {
|
|
|
219
222
|
})))))));
|
|
220
223
|
}
|
|
221
224
|
render() {
|
|
222
|
-
return (index.h(index.Host, { key: '
|
|
225
|
+
return (index.h(index.Host, { key: '06f553b40a89351df1054a07191d3fe9d92dd1a4' }, index.h("div", { key: 'cfd19ef986b2a839791dfc6dbe0998fa4268bcc8', class: "sd-table__wrapper", style: {
|
|
223
226
|
'--table-width': this.width,
|
|
224
227
|
'--table-height': this.height,
|
|
225
|
-
} }, index.h("div", { key: '
|
|
228
|
+
} }, index.h("div", { key: 'ee2eb7c178fd4df207c096640f12061994340058', class: "sd-table__container" }, index.h("div", { key: 'fa2ca46bba403928152d9d087b3ec990615507d4', class: {
|
|
229
|
+
'sd-table__middle': true,
|
|
230
|
+
'sd-table__middle--loading': this.isLoading,
|
|
231
|
+
} }, index.h("table", { key: 'c5248468da6f986da45233ca86dcf68a53001cd6', part: "table", class: this.sdTableClasses }, this.renderHeader(), this.renderBody())), index.h("div", { key: 'd959e9785b3eab0a9e9864761c6377d561e6987c', class: "sd-table__bottom" })), this.pagination && this.innerRows.length > 0 && (index.h("div", { key: 'b592fee0e0747a34b3970e4ff7286afe37e79621', class: "sd-table__pagination" }, index.h("sd-pagination", { key: '05e7ed73d7beba2c14a4bcf07e8686a4d2cf664e', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onPageChange: (e) => {
|
|
226
232
|
if (!this.useInternalPagination) {
|
|
227
233
|
this.sdPageChange.emit(e.detail);
|
|
228
234
|
}
|
|
@@ -230,7 +236,7 @@ const SdTable = class {
|
|
|
230
236
|
this.currentPage = e.detail;
|
|
231
237
|
this.sdPageChange.emit(this.currentPage);
|
|
232
238
|
}
|
|
233
|
-
} }), this.useRowsPerPageSelect && (index.h("sd-select", { key: '
|
|
239
|
+
} }), this.useRowsPerPageSelect && (index.h("sd-select", { key: 'f0e4ad4e7ec0f857feac4fc669f5a523401120d6', value: this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", onSdChange: (e) => {
|
|
234
240
|
const changedRowsPerPage = e.detail.value ? Number(e.detail.value) : 0;
|
|
235
241
|
if (!this.useInternalPagination) {
|
|
236
242
|
this.sdRowsPerPageChange.emit(changedRowsPerPage);
|
|
@@ -259,7 +265,7 @@ const SdTable = class {
|
|
|
259
265
|
"pagination": ["handlePaginationChange"]
|
|
260
266
|
}; }
|
|
261
267
|
};
|
|
262
|
-
SdTable.style =
|
|
268
|
+
SdTable.style = sdTableBackupCss;
|
|
263
269
|
|
|
264
270
|
exports.sd_table_backup = SdTable;
|
|
265
271
|
//# sourceMappingURL=sd-table-backup.entry.cjs.js.map
|