@sellmate/design-system 0.0.48 → 0.0.50
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/design-system.cjs.js +2 -2
- package/dist/cjs/{index-DXo1Fhkn.js → index-Bxead0A0.js} +4 -2
- package/dist/cjs/{index-DXo1Fhkn.js.map → index-Bxead0A0.js.map} +1 -1
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/{esm/color-CgyTlXBV.js → cjs/resolveColor-DxvExwgo.js} +17 -4
- package/dist/{esm/resolveColor-CswQ9y2Q.js.map → cjs/resolveColor-DxvExwgo.js.map} +1 -1
- package/dist/cjs/sd-badge.cjs.entry.js +3 -4
- package/dist/cjs/sd-badge.entry.cjs.js.map +1 -1
- package/dist/cjs/sd-button.sd-checkbox.sd-guide.sd-icon.sd-input.sd-loading-spinner.sd-pagination.sd-portal.sd-radio-group.sd-select.sd-select-option.sd-table-backup.sd-tooltip.sd-tooltip-portal.entry.cjs.js.map +1 -0
- package/dist/cjs/{sd-button_12.cjs.entry.js → sd-button_14.cjs.entry.js} +356 -105
- package/dist/cjs/sd-card.cjs.entry.js +2 -2
- package/dist/cjs/sd-date-box.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 +3 -3
- package/dist/cjs/sd-modal-card.cjs.entry.js +2 -3
- package/dist/cjs/sd-modal-card.entry.cjs.js.map +1 -1
- package/dist/cjs/sd-popover.cjs.entry.js +4 -4
- package/dist/cjs/sd-progress.cjs.entry.js +3 -3
- package/dist/cjs/sd-select-multiple-group.cjs.entry.js +1 -1
- package/dist/cjs/sd-select-multiple.cjs.entry.js +3 -3
- package/dist/cjs/sd-select-option-group.cjs.entry.js +4 -4
- package/dist/cjs/sd-table.cjs.entry.js +1 -1
- package/dist/cjs/sd-tag.cjs.entry.js +2 -2
- package/dist/cjs/sd-tbody_3.cjs.entry.js +4 -4
- package/dist/cjs/sd-td.cjs.entry.js +3 -3
- package/dist/cjs/{tooltipArrow-DNiGFQNW.js → tooltipArrow-C7cIAuTo.js} +3 -3
- package/dist/cjs/{tooltipArrow-DNiGFQNW.js.map → tooltipArrow-C7cIAuTo.js.map} +1 -1
- package/dist/collection/collection-manifest.json +1 -0
- 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 +1 -1
- 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-radio-group/sd-radio-group.css +76 -0
- package/dist/collection/components/sd-radio-group/sd-radio-group.js +214 -0
- package/dist/collection/components/sd-radio-group/sd-radio-group.js.map +1 -0
- 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 +17 -15
- package/dist/collection/components/sd-table-backup/sd-table-backup.js +194 -87
- package/dist/collection/components/sd-table-backup/sd-table-backup.js.map +1 -1
- package/dist/collection/components/sd-tag/sd-tag.js +1 -1
- package/dist/collection/components/sd-tooltip/sd-tooltip.js +4 -4
- package/dist/collection/components/sd-tooltip-portal/sd-tooltip-portal.js +1 -1
- package/dist/components/index.js +1 -1
- package/dist/components/{p-lS2AF6uZ.js → p-BIw-hGVo.js} +6 -6
- package/dist/components/{p-lS2AF6uZ.js.map → p-BIw-hGVo.js.map} +1 -1
- package/dist/components/{p-DsXAGqf9.js → p-BSUHSOXX.js} +4 -4
- package/dist/components/{p-DsXAGqf9.js.map → p-BSUHSOXX.js.map} +1 -1
- package/dist/components/{p-C9qV_qzP.js → p-BozMKCTh.js} +6 -6
- package/dist/components/{p-C9qV_qzP.js.map → p-BozMKCTh.js.map} +1 -1
- package/dist/components/{p-BvuTaRpn.js → p-BpNH68jy.js} +3 -3
- package/dist/components/{p-BvuTaRpn.js.map → p-BpNH68jy.js.map} +1 -1
- package/dist/components/{p-Cb33bhDR.js → p-C0CLTo3o.js} +4 -4
- package/dist/components/{p-Cb33bhDR.js.map → p-C0CLTo3o.js.map} +1 -1
- package/dist/components/{p-BlDZogGu.js → p-C171iavd.js} +4 -4
- package/dist/components/{p-BlDZogGu.js.map → p-C171iavd.js.map} +1 -1
- package/dist/components/{p-CIkSynaQ.js → p-C930Kn80.js} +4 -4
- package/dist/components/{p-CIkSynaQ.js.map → p-C930Kn80.js.map} +1 -1
- package/dist/components/{p-DWfls6IE.js → p-Cq-Qitdj.js} +11 -11
- package/dist/components/{p-DWfls6IE.js.map → p-Cq-Qitdj.js.map} +1 -1
- package/dist/components/{p-D2rvzY8X.js → p-D2YMmHfl.js} +4 -4
- package/dist/components/{p-D2rvzY8X.js.map → p-D2YMmHfl.js.map} +1 -1
- package/dist/components/{p-B6GiEilD.js → p-D2aGA3BX.js} +4 -4
- package/dist/components/{p-B6GiEilD.js.map → p-D2aGA3BX.js.map} +1 -1
- package/dist/components/{p-t7JZlmXM.js → p-D8f0ASS6.js} +4 -4
- package/dist/components/{p-t7JZlmXM.js.map → p-D8f0ASS6.js.map} +1 -1
- package/dist/components/{p-CMcI4ZlP.js → p-DC5fpNnQ.js} +4 -4
- package/dist/components/{p-CMcI4ZlP.js.map → p-DC5fpNnQ.js.map} +1 -1
- package/dist/components/{p-Cafw-qR4.js → p-DY6t0qQj.js} +3 -3
- package/dist/components/{p-Cafw-qR4.js.map → p-DY6t0qQj.js.map} +1 -1
- package/dist/components/{p-DCDoqfn8.js → p-LziGti_p.js} +4 -4
- package/dist/components/{p-DCDoqfn8.js.map → p-LziGti_p.js.map} +1 -1
- package/dist/components/{p-WhZES_rm.js → p-RZm_wGW3.js} +6 -6
- package/dist/components/{p-WhZES_rm.js.map → p-RZm_wGW3.js.map} +1 -1
- package/dist/components/{p-CbnL1UUF.js → p-TFWJruz2.js} +4 -3
- package/dist/components/p-TFWJruz2.js.map +1 -0
- package/dist/components/{p-Bn_wuPsh.js → p-X8rQBuZk.js} +8 -8
- package/dist/components/{p-Bn_wuPsh.js.map → p-X8rQBuZk.js.map} +1 -1
- package/dist/components/{p-BBhUxTuK.js → p-_spt_8fG.js} +9 -9
- package/dist/components/{p-BBhUxTuK.js.map → p-_spt_8fG.js.map} +1 -1
- package/dist/components/{p-wA4KCOG0.js → p-gnOKrd57.js} +3 -3
- package/dist/components/{p-wA4KCOG0.js.map → p-gnOKrd57.js.map} +1 -1
- package/dist/components/sd-badge.js +2 -2
- package/dist/components/sd-button.js +1 -1
- package/dist/components/sd-card.js +2 -2
- package/dist/components/sd-checkbox.js +1 -1
- package/dist/components/sd-date-box.js +1 -1
- package/dist/components/sd-date-picker.js +6 -6
- package/dist/components/sd-date-range-picker.js +7 -7
- package/dist/components/sd-guide.js +7 -7
- 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-modal-card.js +3 -3
- package/dist/components/sd-pagination.js +1 -1
- package/dist/components/sd-popover.js +7 -7
- package/dist/components/sd-portal.js +1 -1
- package/dist/components/sd-progress.js +3 -3
- package/dist/components/sd-radio-group.d.ts +11 -0
- package/dist/components/sd-radio-group.js +99 -0
- package/dist/components/sd-radio-group.js.map +1 -0
- package/dist/components/sd-select-multiple-group.js +7 -7
- package/dist/components/sd-select-multiple.js +9 -9
- 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 +206 -99
- package/dist/components/sd-table-backup.js.map +1 -1
- package/dist/components/sd-table.js +14 -14
- package/dist/components/sd-tag.js +2 -2
- package/dist/components/sd-tbody.js +1 -1
- package/dist/components/sd-td.js +3 -3
- package/dist/components/sd-th.js +1 -1
- package/dist/components/sd-tooltip-portal.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-390283f7.entry.js → p-037de6ce.entry.js} +2 -2
- package/dist/design-system/p-154958ba.entry.js +2 -0
- package/dist/design-system/p-1b6aec43.entry.js +2 -0
- package/dist/design-system/{p-ce8fe1fd.entry.js → p-1e175d35.entry.js} +2 -2
- package/dist/design-system/{p-826c6517.entry.js → p-2285c061.entry.js} +2 -2
- package/dist/design-system/p-24ef1055.entry.js +2 -0
- package/dist/design-system/p-24ef1055.entry.js.map +1 -0
- package/dist/design-system/{p-d4b5575e.entry.js → p-267985b3.entry.js} +2 -2
- package/dist/design-system/p-328d7e6c.entry.js +2 -0
- package/dist/design-system/p-4828e65b.entry.js +2 -0
- package/dist/design-system/{p-871c8d66.entry.js → p-6d81e6f8.entry.js} +2 -2
- package/dist/design-system/p-6f16399e.entry.js +2 -0
- package/dist/design-system/{p-6320b9c6.entry.js.map → p-6f16399e.entry.js.map} +1 -1
- package/dist/design-system/{p-3574f319.entry.js → p-8d1a2a13.entry.js} +2 -2
- package/dist/design-system/{p-CgyTlXBV.js → p-BYf-ybt2.js} +2 -2
- package/dist/design-system/{p-BoLmB6pG.js.map → p-BYf-ybt2.js.map} +1 -1
- package/dist/design-system/p-ClyGLKUd.js +3 -0
- package/dist/design-system/{p-B2T3tS5r.js.map → p-ClyGLKUd.js.map} +1 -1
- package/dist/design-system/p-DXZjHQmQ.js +2 -0
- package/dist/design-system/{p-BE6EMCXm.js.map → p-DXZjHQmQ.js.map} +1 -1
- package/dist/design-system/p-a73bb448.entry.js +2 -0
- package/dist/design-system/p-a73bb448.entry.js.map +1 -0
- package/dist/design-system/p-b892a722.entry.js +2 -0
- package/dist/design-system/p-b892a722.entry.js.map +1 -0
- package/dist/design-system/{p-8734ded6.entry.js → p-c7e8a2c0.entry.js} +2 -2
- package/dist/design-system/p-ecb38b6a.entry.js +2 -0
- package/dist/design-system/{p-db0f705b.entry.js.map → p-ecb38b6a.entry.js.map} +1 -1
- package/dist/design-system/sd-badge.entry.esm.js.map +1 -1
- package/dist/design-system/sd-button.sd-checkbox.sd-guide.sd-icon.sd-input.sd-loading-spinner.sd-pagination.sd-portal.sd-radio-group.sd-select.sd-select-option.sd-table-backup.sd-tooltip.sd-tooltip-portal.entry.esm.js.map +1 -0
- package/dist/design-system/sd-modal-card.entry.esm.js.map +1 -1
- package/dist/esm/design-system.js +3 -3
- package/dist/esm/{index-B2T3tS5r.js → index-ClyGLKUd.js} +4 -3
- package/dist/esm/{index-B2T3tS5r.js.map → index-ClyGLKUd.js.map} +1 -1
- package/dist/esm/loader.js +3 -3
- package/dist/{cjs/color-Oz29vj7L.js → esm/resolveColor-BYf-ybt2.js} +14 -6
- package/dist/{cjs/resolveColor-CauSLF0s.js.map → esm/resolveColor-BYf-ybt2.js.map} +1 -1
- package/dist/esm/sd-badge.entry.js +3 -4
- package/dist/esm/sd-badge.entry.js.map +1 -1
- package/dist/esm/sd-button.sd-checkbox.sd-guide.sd-icon.sd-input.sd-loading-spinner.sd-pagination.sd-portal.sd-radio-group.sd-select.sd-select-option.sd-table-backup.sd-tooltip.sd-tooltip-portal.entry.js.map +1 -0
- package/dist/esm/{sd-button_12.entry.js → sd-button_14.entry.js} +355 -106
- package/dist/esm/sd-card.entry.js +2 -2
- package/dist/esm/sd-date-box.entry.js +1 -1
- package/dist/esm/sd-date-picker.entry.js +2 -2
- package/dist/esm/sd-date-range-picker.entry.js +3 -3
- package/dist/esm/sd-modal-card.entry.js +2 -3
- package/dist/esm/sd-modal-card.entry.js.map +1 -1
- package/dist/esm/sd-popover.entry.js +4 -4
- package/dist/esm/sd-progress.entry.js +3 -3
- package/dist/esm/sd-select-multiple-group.entry.js +1 -1
- package/dist/esm/sd-select-multiple.entry.js +3 -3
- package/dist/esm/sd-select-option-group.entry.js +4 -4
- package/dist/esm/sd-table.entry.js +1 -1
- package/dist/esm/sd-tag.entry.js +2 -2
- package/dist/esm/sd-tbody_3.entry.js +4 -4
- package/dist/esm/sd-td.entry.js +3 -3
- package/dist/esm/{tooltipArrow-Pa2XQhpp.js → tooltipArrow-BwO7_hdW.js} +3 -3
- package/dist/esm/{tooltipArrow-Pa2XQhpp.js.map → tooltipArrow-BwO7_hdW.js.map} +1 -1
- package/dist/types/components/sd-radio-group/sd-radio-group.d.ts +24 -0
- package/dist/types/components/sd-table-backup/sd-table-backup.d.ts +15 -0
- package/dist/types/components.d.ts +59 -0
- package/hydrate/index.js +320 -123
- package/hydrate/index.mjs +320 -123
- package/package.json +95 -95
- package/dist/cjs/color-Oz29vj7L.js.map +0 -1
- package/dist/cjs/resolveColor-CauSLF0s.js +0 -18
- package/dist/cjs/sd-button.sd-checkbox.sd-icon.sd-input.sd-loading-spinner.sd-pagination.sd-portal.sd-select.sd-select-option.sd-table-backup.sd-tooltip.sd-tooltip-portal.entry.cjs.js.map +0 -1
- package/dist/cjs/sd-guide.cjs.entry.js +0 -85
- package/dist/cjs/sd-guide.entry.cjs.js.map +0 -1
- package/dist/components/p-CbnL1UUF.js.map +0 -1
- package/dist/design-system/p-043b7fd1.entry.js +0 -2
- package/dist/design-system/p-043b7fd1.entry.js.map +0 -1
- package/dist/design-system/p-059ca6cb.entry.js +0 -2
- package/dist/design-system/p-0d776157.entry.js +0 -2
- package/dist/design-system/p-0d776157.entry.js.map +0 -1
- package/dist/design-system/p-4386db36.entry.js +0 -2
- package/dist/design-system/p-4386db36.entry.js.map +0 -1
- package/dist/design-system/p-6320b9c6.entry.js +0 -2
- package/dist/design-system/p-7b4fe5bf.entry.js +0 -2
- package/dist/design-system/p-7e8db11c.entry.js +0 -2
- package/dist/design-system/p-B2T3tS5r.js +0 -3
- package/dist/design-system/p-BE6EMCXm.js +0 -2
- package/dist/design-system/p-BoLmB6pG.js +0 -2
- package/dist/design-system/p-CgyTlXBV.js.map +0 -1
- package/dist/design-system/p-d4e043c5.entry.js +0 -2
- package/dist/design-system/p-db0f705b.entry.js +0 -2
- package/dist/design-system/p-f9d01bdb.entry.js +0 -2
- package/dist/design-system/p-f9d01bdb.entry.js.map +0 -1
- package/dist/design-system/sd-button.sd-checkbox.sd-icon.sd-input.sd-loading-spinner.sd-pagination.sd-portal.sd-select.sd-select-option.sd-table-backup.sd-tooltip.sd-tooltip-portal.entry.esm.js.map +0 -1
- package/dist/design-system/sd-guide.entry.esm.js.map +0 -1
- package/dist/esm/color-CgyTlXBV.js.map +0 -1
- package/dist/esm/resolveColor-CswQ9y2Q.js +0 -16
- package/dist/esm/sd-button.sd-checkbox.sd-icon.sd-input.sd-loading-spinner.sd-pagination.sd-portal.sd-select.sd-select-option.sd-table-backup.sd-tooltip.sd-tooltip-portal.entry.js.map +0 -1
- package/dist/esm/sd-guide.entry.js +0 -83
- package/dist/esm/sd-guide.entry.js.map +0 -1
- /package/dist/design-system/{p-390283f7.entry.js.map → p-037de6ce.entry.js.map} +0 -0
- /package/dist/design-system/{p-059ca6cb.entry.js.map → p-154958ba.entry.js.map} +0 -0
- /package/dist/design-system/{p-7b4fe5bf.entry.js.map → p-1b6aec43.entry.js.map} +0 -0
- /package/dist/design-system/{p-ce8fe1fd.entry.js.map → p-1e175d35.entry.js.map} +0 -0
- /package/dist/design-system/{p-826c6517.entry.js.map → p-2285c061.entry.js.map} +0 -0
- /package/dist/design-system/{p-d4b5575e.entry.js.map → p-267985b3.entry.js.map} +0 -0
- /package/dist/design-system/{p-7e8db11c.entry.js.map → p-328d7e6c.entry.js.map} +0 -0
- /package/dist/design-system/{p-d4e043c5.entry.js.map → p-4828e65b.entry.js.map} +0 -0
- /package/dist/design-system/{p-871c8d66.entry.js.map → p-6d81e6f8.entry.js.map} +0 -0
- /package/dist/design-system/{p-3574f319.entry.js.map → p-8d1a2a13.entry.js.map} +0 -0
- /package/dist/design-system/{p-8734ded6.entry.js.map → p-c7e8a2c0.entry.js.map} +0 -0
package/hydrate/index.js
CHANGED
|
@@ -3341,6 +3341,15 @@ var registerComponents = (Cstrs) => {
|
|
|
3341
3341
|
}
|
|
3342
3342
|
};
|
|
3343
3343
|
var win = window;
|
|
3344
|
+
var readTask = (cb) => {
|
|
3345
|
+
nextTick(() => {
|
|
3346
|
+
try {
|
|
3347
|
+
cb();
|
|
3348
|
+
} catch (e) {
|
|
3349
|
+
consoleError(e);
|
|
3350
|
+
}
|
|
3351
|
+
});
|
|
3352
|
+
};
|
|
3344
3353
|
var writeTask = (cb) => {
|
|
3345
3354
|
nextTick(() => {
|
|
3346
3355
|
try {
|
|
@@ -3682,7 +3691,7 @@ class SdBadge {
|
|
|
3682
3691
|
label = '';
|
|
3683
3692
|
render() {
|
|
3684
3693
|
const resolvedColor = resolveColor(this.color);
|
|
3685
|
-
return (hAsync(Host, { key: '
|
|
3694
|
+
return (hAsync(Host, { key: '88cb068e4c73a9abb0c4b7c4321ec7d861ec1395' }, hAsync("div", { key: '09371f2e449a0f1db15fe08d7045313a86555f70', class: `sd-badge sd-badge--${this.size}`, style: { '--sd-badge-color': resolvedColor } }, hAsync("div", { key: '4e7bb2717bc999d06dfa861474a833448f497431', class: "sd-badge__dot" }), hAsync("div", { key: '0711cac45b6535cd67279785dfe6a89cbbd6739a', class: "sd-badge__label" }, this.label))));
|
|
3686
3695
|
}
|
|
3687
3696
|
static get style() { return sdBadgeCss; }
|
|
3688
3697
|
static get cmpMeta() { return {
|
|
@@ -3789,7 +3798,7 @@ class SdCard {
|
|
|
3789
3798
|
bordered = true;
|
|
3790
3799
|
class = '';
|
|
3791
3800
|
render() {
|
|
3792
|
-
return (hAsync(Host, { key: '
|
|
3801
|
+
return (hAsync(Host, { key: 'e9653557b36889a75002c32bde005c7b480b2f4b' }, hAsync("div", { key: 'e34f53b49bdc412eaf82dbe21918cd6599d1d2c6', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.class}` }, hAsync("slot", { key: 'b5d06b44a1a960fe12424f43a39647a4646610d6' }))));
|
|
3793
3802
|
}
|
|
3794
3803
|
static get style() { return sdCardCss; }
|
|
3795
3804
|
static get cmpMeta() { return {
|
|
@@ -4100,7 +4109,7 @@ class SdDatePicker {
|
|
|
4100
4109
|
this.isOpen = false;
|
|
4101
4110
|
};
|
|
4102
4111
|
render() {
|
|
4103
|
-
return (hAsync(Host, { key: '
|
|
4112
|
+
return (hAsync(Host, { key: '3fe32fb440e95d43a7ba5ae40eebfec5b1f292f7', class: "sd-date-picker" }, hAsync("sd-input", { key: '8aa313f14bd0305c0d28ba8e388c5c7d2ae2d3ec', ref: el => (this.inputEl = el), value: this.date, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", onClick: () => this.openMenu() }, hAsync("sd-icon", { key: '350af44747b5f87c0e25dc01fc8aa25590363d5b', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (hAsync("sd-portal", { key: '1c05d0d0b9cd54bd67b1d4411bd3ad2aded758ba', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, hAsync("div", { key: '273c93d7b9635ebfab1350568f30da3f62996003', class: "sd-date-picker__menu" }, hAsync("div", { key: '9da1cf5d0dc35f00018a2718787007749a84ca99', class: "sd-date-picker__header" }, hAsync("div", { key: 'c2afcc7006276eca26d4f0d0c91350a0dee070cf', class: "year-nav" }, hAsync("button", { key: '1b53d6e96c6f9ab93d67440450b35be096e9607b', type: "button", name: "prev-year", title: "Previous Year", onClick: () => this.setCurrentYear(this.currentYear - 1) }, hAsync("sd-icon", { key: '7acd8f69406a83bcc9fef1745523d997d1b3f219', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("span", { key: 'ad5f412960af38938d6efea1f0909293c3c6682c', class: "year-nav__current" }, this.currentYear), hAsync("button", { key: 'fe2480d51d8a8a3b09d3d0d5e5c5c53982ebd20d', type: "button", name: "next-year", title: "Next Year", onClick: () => this.setCurrentYear(this.currentYear + 1) }, hAsync("sd-icon", { key: 'e7175f73e5efcef04a2b33a2ee7a57d2b025c3d8', name: "arrowRight", size: "12", color: "#CCCCCC" }))), hAsync("div", { key: '76dcf13a864dffcb6a49683b590c19efb05c7367', class: "month-nav" }, hAsync("button", { key: '2d300218750da2716e2558ff3145337ee6bcfa80', type: "button", name: "prev-month", title: "Previous ", onClick: () => this.handleUpdateMonth('prev') }, hAsync("sd-icon", { key: '1972506ecb42922b6c742bd34186bdbf23f8d6b5', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("span", { key: '3037310072a6dcb71f2e662fb1dcfa07d44f2a70', class: "month-nav__current" }, this.currentMonth, "\uC6D4"), hAsync("button", { key: '7cd60a470fd27f2028935748047f76945fc4fe99', type: "button", name: "next-month", title: "Next Month", onClick: () => this.handleUpdateMonth('next') }, hAsync("sd-icon", { key: 'd656f3dd638cab72e94f12036e77f46b9ab31c7f', name: "arrowRight", size: "12", color: "#CCCCCC" })))), hAsync("div", { key: '1710f916652929515916a122affda7cbdd311153', class: "sd-date-picker__days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (hAsync("div", { key: day, class: "day" }, day)))), hAsync("div", { key: '201f7499819e88f291a3889fcbe854d2e2145fde', class: "sd-date-picker__body" }, [
|
|
4104
4113
|
...this.calendar.prevMonthDays,
|
|
4105
4114
|
...this.calendar.days,
|
|
4106
4115
|
...this.calendar.afterMonthDays,
|
|
@@ -4273,9 +4282,9 @@ class SdDateRangePicker {
|
|
|
4273
4282
|
this.isOpen = false;
|
|
4274
4283
|
};
|
|
4275
4284
|
render() {
|
|
4276
|
-
return (hAsync(Host, { key: '
|
|
4285
|
+
return (hAsync(Host, { key: 'b5f7be556686c3bb50147ed0b28cd47698d90e5c', class: "sd-date-range-picker" }, hAsync("sd-input", { key: 'a457ab2b61354fe100fa31e1ab357649ceef63aa', 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: {
|
|
4277
4286
|
margin: '0 0 0 8px',
|
|
4278
|
-
}, onClick: () => this.openMenu() }, hAsync("sd-icon", { key: '
|
|
4287
|
+
}, onClick: () => this.openMenu() }, hAsync("sd-icon", { key: 'cc068925914495e21172020763c18627d3c8e8a2', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (hAsync("sd-portal", { key: '0486ab86c422d98aa2e86bd4d327cc42f0e72ae9', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, hAsync("div", { key: '8b86d95d279d6f3036f2aacc0421ec4f715d91e7', class: "sd-date-range-picker__menu" }, hAsync("div", { key: '0fa223b5fdc0a8195e1fbd433c235dc4473ad146', class: "sd-date-range-picker__header mb-16pxr flex flex-nowrap items-center justify-center" }, hAsync("button", { key: '2d512e7ffa9461f18ca67236a0539cdabcb384ac', type: "button", name: "prev", title: "Previous", onClick: () => this.setPrevYear(this.prevYear - 1) }, hAsync("sd-icon", { key: 'aa23e83e33bfaaaee02f771e9aa3e7f84fe7ceae', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("div", { key: '5c6e6ea57120081b466faa827e7bb014b5d20905', class: "header-label" }, this.prevYear), hAsync("button", { key: '51f89a92ca77a98283a883316981b7df08e1fcef', type: "button", name: "next", title: "Next", onClick: () => this.setPrevYear(this.prevYear + 1) }, hAsync("sd-icon", { key: '19a594a16b65668db23f5e77e61db7182591ac57', name: "arrowRight", size: "12", color: "#CCCCCC" }))), hAsync("div", { key: '21073a5c2d4dd68aa4dce7be48eab0339dd3791d', class: "sd-date-range-picker__body" }, [this.prevCalendar, this.nextCalendar].map((calendar, index) => (hAsync(Fragment, null, index === 1 && hAsync("div", { class: "separator" }), hAsync("div", { key: index, class: "calendar-container" }, hAsync("div", { class: "calendar-header" }, hAsync("button", { type: "button", name: "month", title: "Month", class: index === 0 ? 'header-button-prev' : 'header-button-next', onClick: () => this.updateYearMonth(index === 0 ? 'prev' : 'next') }, hAsync("sd-icon", { name: index === 0 ? 'arrowLeft' : 'arrowRight', size: "12", color: "#CCCCCC" })), index === 0
|
|
4279
4288
|
? `${this.prevYear}.${String(this.prevMonth).padStart(2, '0')}`
|
|
4280
4289
|
: `${this.nextYear}.${String(this.nextMonth).padStart(2, '0')}`), hAsync("div", { class: "calendar-days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (hAsync("sd-date-box", { key: day, date: day, disabled: true, class: "day" })))), hAsync("div", { class: "calendar-body mt-12pxr grid grid-cols-7 gap-y-8pxr" }, [...calendar.prevMonthDays, ...calendar.days, ...calendar.afterMonthDays].map((day, idx) => (hAsync("sd-date-box", { key: `prev${day}_${idx}`, date: !day ? '' : Number(day), selected: this.dateRange.some(date => date ===
|
|
4281
4290
|
this.dateUtil.formatDate(index === 0 ? this.prevYear : this.nextYear, index === 0 ? this.prevMonth : this.nextMonth, Number(day))), type: this.getDateBoxType(this.dateUtil.formatDate(index === 0 ? this.prevYear : this.nextYear, index === 0 ? this.prevMonth : this.nextMonth, Number(day))), isToday: today ===
|
|
@@ -4358,11 +4367,11 @@ class SdGuide {
|
|
|
4358
4367
|
};
|
|
4359
4368
|
render() {
|
|
4360
4369
|
const { name: iconName, size: iconSize, color: iconColor } = GUIDE_ICON[this.type];
|
|
4361
|
-
return (hAsync(Host, { key: '
|
|
4370
|
+
return (hAsync(Host, { key: 'd9bf823d000e8181c61798d9656c428c4a3cd6b6', style: {
|
|
4362
4371
|
'--sd-guide-color': GUIDE_ICON[this.type].color,
|
|
4363
|
-
} }, hAsync("sd-button", { key: '
|
|
4372
|
+
} }, hAsync("sd-button", { key: 'fd25039c644bdd6e802624f2cbef3bfb4d797220', ref: el => (this.guideRef = el), class: this.guideClass, variant: this.popupShow ? 'primary' : 'outline', label: this.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 && (hAsync("sd-portal", { key: '3bb296fa9a9419534af30fe3d2e2dd1bffe2aa53', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, hAsync("div", { key: '2aacb47b2acedceb9114737da8d061022fea27a8', class: "sd-guide__popup", style: { width: this.popupWidth ? this.popupWidth + 'px' : '426px' } }, hAsync("sd-button", { key: 'd4e3a1b49d15782a2b4cc50d6ebfc62ca19da555', class: "sd-guide__popup__close", icon: "close", color: colors$1.grey_65, size: "md", variant: "ghost", noHover: true,
|
|
4364
4373
|
// buttonStyle={{ padding: '0px', minHeight: '0px' }}
|
|
4365
|
-
onSdClick: this.closeDropdown }), hAsync("div", { key: '
|
|
4374
|
+
onSdClick: this.closeDropdown }), hAsync("div", { key: 'ca5d8332066af0bac3083443488c3ebe5c064931', class: "sd-guide__popup__header" }, hAsync("sd-icon", { key: '752a3ea8dde595e459b0681b317486c3896aa71f', name: "helpOutline", size: 24, color: colors$1.green_65 }), hAsync("h3", { key: '52d5bdae6b82d9aabbf8dc98c2f05379fb8ffe7d', class: "sd-guide__popup__title" }, this.popupTitle || GUIDE_LABEL[this.type])), hAsync("ul", { key: '07fe0fe4f2b9831721e95f318dfcd818ee11a415', class: "sd-guide__popup__list" }, this.renderListItem(this.message)))))));
|
|
4366
4375
|
}
|
|
4367
4376
|
// 현재 2depth까지만 스타일 적용
|
|
4368
4377
|
renderListItem(message, depth = 0) {
|
|
@@ -6408,7 +6417,7 @@ class SdIcon {
|
|
|
6408
6417
|
}
|
|
6409
6418
|
render() {
|
|
6410
6419
|
const IconComponent = Icons[this.name]?.[this.size];
|
|
6411
|
-
return (hAsync("i", { key: '
|
|
6420
|
+
return (hAsync("i", { key: '856cad8bb2373b0d86734443144f79770c0715ec', class: this.getIconClasses(), style: this.iconStyle }, hAsync(IconComponent, { key: 'd2a06ebbda1317cb72fec996b3bf3008ba171070', color: this.resolvedColor })));
|
|
6412
6421
|
}
|
|
6413
6422
|
static get style() { return sdIconCss; }
|
|
6414
6423
|
static get cmpMeta() { return {
|
|
@@ -6528,11 +6537,11 @@ class SdInput {
|
|
|
6528
6537
|
'--input-width': typeof this.width === 'number' ? `${this.width}px` : this.width,
|
|
6529
6538
|
}
|
|
6530
6539
|
: {};
|
|
6531
|
-
return (hAsync(Host, { key: '
|
|
6540
|
+
return (hAsync(Host, { key: '0fc9bec4559137ede7daa7f2da5df00595991d5a', style: inputWidth }, this.label && hAsync("div", { key: '3fd4e7d08aca431d7743ec4249a221c77f2fefd1', class: "sd-input__label" }, this.label), hAsync("label", { key: 'bc80c41ffcb1312261b1139dcd0c390db32932df', class: {
|
|
6532
6541
|
'sd-input': true,
|
|
6533
6542
|
[this.getInputStatus()]: true,
|
|
6534
6543
|
'sd-input--barcode': !!this.barcode,
|
|
6535
|
-
}, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: this.inputStyle }, hAsync("slot", { key: '
|
|
6544
|
+
}, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: this.inputStyle }, hAsync("slot", { key: 'b1df6c52c2dc92adde26cd535b008d35bc1c73d2', name: "prefix" }), hAsync("input", { key: '5c02cca10b415521d569151c3b05cd9b2ae4b9b7', 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) }), hAsync("slot", { key: 'f85912a8f17712d0a4950a68d10d885556a1de44', name: "suffix" }), this.clearable && this.internalValue && (hAsync("sd-icon", { key: '3087e7d22f06e2b29d17b37d2e95bdcbcc511bd4', name: "close", color: "#888", class: "sd-input__clear-icon", onClick: () => {
|
|
6536
6545
|
this.internalValue = '';
|
|
6537
6546
|
this.sdChange?.emit(this.internalValue);
|
|
6538
6547
|
this.sdInput?.emit(this.internalValue);
|
|
@@ -6579,7 +6588,7 @@ class SdLoadingSpinner {
|
|
|
6579
6588
|
registerInstance(this, hostRef);
|
|
6580
6589
|
}
|
|
6581
6590
|
render() {
|
|
6582
|
-
return (hAsync(Host, { key: '
|
|
6591
|
+
return (hAsync(Host, { key: 'd064701b25e190fc5b7feefb542cbc7d30afc3f3' }, hAsync("svg", { key: 'ec37a9ebea3e5b48817c687fae543186bb3cf29a', class: "sd-loading-spinner text-positive", width: "72px", height: "72px", viewBox: "25 25 50 50" }, hAsync("circle", { key: '0b61caa65955019ddb08ed52a51718cf3f55a6e3', class: "path", cx: "50", cy: "50", r: "20", fill: "none", stroke: "currentColor", "stroke-width": "5", "stroke-miterlimit": "10" }))));
|
|
6583
6592
|
}
|
|
6584
6593
|
static get style() { return sdLoadingSpinnerCss; }
|
|
6585
6594
|
static get cmpMeta() { return {
|
|
@@ -6731,12 +6740,12 @@ class SdPagination {
|
|
|
6731
6740
|
}
|
|
6732
6741
|
}
|
|
6733
6742
|
render() {
|
|
6734
|
-
return (hAsync("div", { key: '
|
|
6743
|
+
return (hAsync("div", { key: 'c8c241301297c8281d02643f5a31c97f77706fff', class: this.paginationClasses }, hAsync("div", { key: '12ca5b852a648b168928934729d2215f6648bcc1', class: "prepend-btns" }, this.renderPrevButtons()), this.simple ? (hAsync("div", { class: "pagination-info" }, hAsync("span", { class: "current-page" }, this.currentPage), hAsync("span", null, "/"), hAsync("span", { class: "last-page" }, this.lastPage))) : (this.pageNumbers.map(n => (hAsync("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
|
|
6735
6744
|
'pagination-btn': true,
|
|
6736
6745
|
'pagination-btn--selected': this.currentPage === n,
|
|
6737
6746
|
}, disabled: this.currentPage === n, style: {
|
|
6738
6747
|
'--pagination-btn-width': `${this.buttonWidth}px`,
|
|
6739
|
-
}, onClick: () => this.handlePageChange(n) }, n)))), hAsync("div", { key: '
|
|
6748
|
+
}, onClick: () => this.handlePageChange(n) }, n)))), hAsync("div", { key: '0ff537ba6e5985be1e055f5b9eab5dd86dd11624', class: "append-btns" }, this.renderNextButtons())));
|
|
6740
6749
|
}
|
|
6741
6750
|
static get style() { return sdPaginationCss; }
|
|
6742
6751
|
static get cmpMeta() { return {
|
|
@@ -6790,11 +6799,11 @@ class SdPopover {
|
|
|
6790
6799
|
this.showPopover = false;
|
|
6791
6800
|
};
|
|
6792
6801
|
render() {
|
|
6793
|
-
return (hAsync(Fragment, { key: '
|
|
6802
|
+
return (hAsync(Fragment, { key: '596dfc584e73c7d7093e15a91046e14b7801138a' }, this.label ? (hAsync("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: () => (this.showPopover = !this.showPopover) })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-popover", onClick: () => (this.showPopover = !this.showPopover) })), this.showPopover && (hAsync("sd-tooltip-portal", { key: '9bf784d6946cd5fd8b6ecfd3a6e9d976f44a2a90', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement }, hAsync("div", { key: '409afdeee8e96ce019594cd2aaa16034e4339a35', class: {
|
|
6794
6803
|
'sd-popover-menu': true,
|
|
6795
6804
|
[`sd-popover-menu--${this.placement}`]: true,
|
|
6796
6805
|
[this.menuClass]: !!this.menuClass,
|
|
6797
|
-
} }, hAsync("i", { key: '
|
|
6806
|
+
} }, hAsync("i", { key: '2ff3545fb7b13c11d4f128616a68f0a230087447', class: `sd-popover-menu__arrow sd-popover-menu__arrow--${this.placement}` }, hAsync(TooltipArrow, { key: '3da84311b01c95d92b91327ce66e49e1d0243b37' })), hAsync("div", { key: 'aa861155d8c9194dffafd8b834e58108995f33ed', class: "sd-popover-menu__content" }, this.menuTitle && hAsync("div", { key: '534c0871ff6b909c87eba179be23c7e2fa4ce0e9', class: "sd-popover-menu__title" }, this.menuTitle), this.messages.length > 0 && (hAsync("div", { key: 'a601e50189ca95fa007e68edf64c1a0aa1e990d0', class: "sd-popover-menu__messages" }, this.messages.map(message => (hAsync("div", null, message))))), this.buttons.length > 0 && (hAsync("div", { key: '63ee5c3dcdf167e0b35b5ed96a516b91ff007355', class: `sd-popover-menu__buttons sd-popover-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (hAsync("sd-button", { ...button })))))), this.useClose && (hAsync("button", { key: '6f8f0a6dfd113603105652686b5426e3a0313d4e', class: "sd-popover-menu__close-button", onClick: () => this.handleClose() }, hAsync("sd-icon", { key: '9f1aedb7e6e9e519fa890856ea9c185e393f5f43', name: "close", size: "12", color: "#AAAAAA" }))))))));
|
|
6798
6807
|
}
|
|
6799
6808
|
static get watchers() { return {
|
|
6800
6809
|
"show": ["watchShowHandler"]
|
|
@@ -6945,7 +6954,7 @@ class SdPortal {
|
|
|
6945
6954
|
this.sdClose.emit();
|
|
6946
6955
|
}
|
|
6947
6956
|
render() {
|
|
6948
|
-
return hAsync("slot", { key: '
|
|
6957
|
+
return hAsync("slot", { key: '2f6a1908864a2b5bbe86127fbf41b6b44a599666' });
|
|
6949
6958
|
}
|
|
6950
6959
|
static get cmpMeta() { return {
|
|
6951
6960
|
"$flags$": 772,
|
|
@@ -6982,10 +6991,10 @@ class SdProgress {
|
|
|
6982
6991
|
error: '#FB4444',
|
|
6983
6992
|
};
|
|
6984
6993
|
render() {
|
|
6985
|
-
return (hAsync(Host, { key: '
|
|
6994
|
+
return (hAsync(Host, { key: 'fa4a0bdd1e76231bc3ff349c5e94a18f1d747bf4', style: {
|
|
6986
6995
|
'--progress-color': this.statusColor[this.status],
|
|
6987
6996
|
'--progress-percentage': `${this.percentage}%`,
|
|
6988
|
-
} }, this.type === 'bar' ? this.renderBarProgress() : this.renderSpinnerProgress(), this.label && hAsync("div", { key: '
|
|
6997
|
+
} }, this.type === 'bar' ? this.renderBarProgress() : this.renderSpinnerProgress(), this.label && hAsync("div", { key: '2c356835e29ec88765f0be0efbe9ee416f1e27ea', class: "sd-progress__label" }, this.label)));
|
|
6989
6998
|
}
|
|
6990
6999
|
renderBarProgress() {
|
|
6991
7000
|
return (hAsync("div", { class: `sd-progress__bar sd-progress__bar--${this.status}` }, hAsync("div", { class: ['sd-progress__bar__percent', this.percentage < 100 ? 'proceed' : ''].join(' ') }), hAsync("div", { class: "sd-progress__bar__indicator sd-progress__bar__indicator--left" }, this.percentage, "%"), hAsync("div", { class: "sd-progress__bar__indicator sd-progress__bar__indicator--right" }, this.percentage, "%")));
|
|
@@ -7016,6 +7025,86 @@ class SdProgress {
|
|
|
7016
7025
|
}; }
|
|
7017
7026
|
}
|
|
7018
7027
|
|
|
7028
|
+
const sdRadioGroupCss = "sd-radio-group{display:inline-block}sd-radio-group .sd-radio-group{display:flex}sd-radio-group .sd-radio-group--vertical{flex-direction:column;gap:8px}sd-radio-group .sd-radio-group--horizontal{flex-direction:row;align-items:center;gap:20px}sd-radio-group .sd-radio-group__option{width:fit-content;display:flex;align-items:center;gap:8px;font-weight:400;font-size:12px;line-height:20px;cursor:pointer}sd-radio-group .sd-radio-group__option:has(input:disabled){cursor:default}sd-radio-group .sd-radio-group__option input{position:relative;appearance:none;margin:0;width:16px;height:16px;border:1px solid #888888;border-radius:50%;cursor:pointer;accent-color:#0075ff;background-color:white}sd-radio-group .sd-radio-group__option input:checked{border-color:#0075ff;background-color:white}sd-radio-group .sd-radio-group__option input:checked::before{content:\"\";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:10px;height:10px;border-radius:50%;background-color:#0075ff}sd-radio-group .sd-radio-group__option input:disabled{cursor:default;border-color:#cccccc;background-color:#eeeeee}sd-radio-group .sd-radio-group__option input:disabled:checked::before{background-color:#cccccc}sd-radio-group .sd-radio-group__option input:not(:disabled):hover{border-color:#0075ff;background-color:#d9eaff}sd-radio-group .sd-radio-group__label{font-size:12px;color:#333333;line-height:20px;user-select:none}sd-radio-group .sd-radio-group__option--disabled .sd-radio-group__label{color:#888888}";
|
|
7029
|
+
|
|
7030
|
+
class SdRadioGroup {
|
|
7031
|
+
constructor(hostRef) {
|
|
7032
|
+
registerInstance(this, hostRef);
|
|
7033
|
+
this.sdChange = createEvent(this, "sdChange");
|
|
7034
|
+
}
|
|
7035
|
+
value;
|
|
7036
|
+
radioOptions = [];
|
|
7037
|
+
direction = 'vertical';
|
|
7038
|
+
disabled = false;
|
|
7039
|
+
name;
|
|
7040
|
+
selectedValue;
|
|
7041
|
+
sdChange;
|
|
7042
|
+
componentWillLoad() {
|
|
7043
|
+
if (this.value) {
|
|
7044
|
+
this.selectedValue = this.value;
|
|
7045
|
+
}
|
|
7046
|
+
}
|
|
7047
|
+
valueChanged(newValue) {
|
|
7048
|
+
this.selectedValue = newValue;
|
|
7049
|
+
}
|
|
7050
|
+
handleRadioChange = (optionValue, optionDisabled) => {
|
|
7051
|
+
if (this.disabled || optionDisabled)
|
|
7052
|
+
return;
|
|
7053
|
+
this.selectedValue = optionValue;
|
|
7054
|
+
this.value = optionValue;
|
|
7055
|
+
this.sdChange.emit(optionValue);
|
|
7056
|
+
};
|
|
7057
|
+
isOptionSelected(option) {
|
|
7058
|
+
return this.selectedValue === option.value;
|
|
7059
|
+
}
|
|
7060
|
+
isOptionDisabled(option) {
|
|
7061
|
+
return this.disabled || !!option.disabled;
|
|
7062
|
+
}
|
|
7063
|
+
getRadioClasses(option) {
|
|
7064
|
+
const classes = [
|
|
7065
|
+
'sd-radio-group__option',
|
|
7066
|
+
this.isOptionSelected(option)
|
|
7067
|
+
? 'sd-radio-group__option--selected'
|
|
7068
|
+
: 'sd-radio-group__option--unselected',
|
|
7069
|
+
];
|
|
7070
|
+
if (this.isOptionDisabled(option)) {
|
|
7071
|
+
classes.push('sd-radio-group__option--disabled');
|
|
7072
|
+
}
|
|
7073
|
+
return classes.join(' ');
|
|
7074
|
+
}
|
|
7075
|
+
getGroupClasses() {
|
|
7076
|
+
const classes = ['sd-radio-group', `sd-radio-group--${this.direction}`];
|
|
7077
|
+
return classes.join(' ');
|
|
7078
|
+
}
|
|
7079
|
+
render() {
|
|
7080
|
+
const groupName = this.name || `sd-radio-group-${Math.random().toString(36).substring(2, 11)}`;
|
|
7081
|
+
return (hAsync("div", { key: 'd8f9d161395e7125bb65411ee6831e7e290900ba', class: this.getGroupClasses(), role: "radiogroup", "aria-disabled": this.disabled.toString() }, this.radioOptions.map((option, index) => {
|
|
7082
|
+
const isSelected = this.isOptionSelected(option);
|
|
7083
|
+
const isDisabled = this.isOptionDisabled(option);
|
|
7084
|
+
return (hAsync("label", { key: `radio-${index}`, class: this.getRadioClasses(option), role: "radio", "aria-checked": isSelected.toString(), "aria-disabled": isDisabled.toString(), "aria-label": option.label || 'radio option' }, hAsync("input", { type: "radio", name: groupName, value: option.value.toString(), checked: isSelected, disabled: isDisabled, onInput: () => this.handleRadioChange(option.value, option.disabled) }), option.label && hAsync("span", { class: "sd-radio-group__label" }, option.label)));
|
|
7085
|
+
})));
|
|
7086
|
+
}
|
|
7087
|
+
static get watchers() { return {
|
|
7088
|
+
"value": ["valueChanged"]
|
|
7089
|
+
}; }
|
|
7090
|
+
static get style() { return sdRadioGroupCss; }
|
|
7091
|
+
static get cmpMeta() { return {
|
|
7092
|
+
"$flags$": 768,
|
|
7093
|
+
"$tagName$": "sd-radio-group",
|
|
7094
|
+
"$members$": {
|
|
7095
|
+
"value": [1544],
|
|
7096
|
+
"radioOptions": [1040],
|
|
7097
|
+
"direction": [1],
|
|
7098
|
+
"disabled": [4],
|
|
7099
|
+
"name": [1],
|
|
7100
|
+
"selectedValue": [32]
|
|
7101
|
+
},
|
|
7102
|
+
"$listeners$": undefined,
|
|
7103
|
+
"$lazyBundleId$": "-",
|
|
7104
|
+
"$attrsToReflect$": [["value", "value"]]
|
|
7105
|
+
}; }
|
|
7106
|
+
}
|
|
7107
|
+
|
|
7019
7108
|
class DropdownManager {
|
|
7020
7109
|
static instance;
|
|
7021
7110
|
activeDropdowns = new Set();
|
|
@@ -7613,11 +7702,11 @@ class SdSelectMultiple extends BaseDropdownEvent {
|
|
|
7613
7702
|
'--select-width': this.width || '200px',
|
|
7614
7703
|
'--select-dropdown-height': this.dropdownHeight || '260px',
|
|
7615
7704
|
};
|
|
7616
|
-
return (hAsync(Host, { key: '
|
|
7705
|
+
return (hAsync(Host, { key: '356e513b8d7e856ed22d5358027b163463d55c1d', style: style }, hAsync("div", { key: '3a75650badea618ed89899de57fbd25c020df6d0', class: {
|
|
7617
7706
|
'sd-select-multiple': true,
|
|
7618
7707
|
'sd-select-multiple--open': this.isOpen,
|
|
7619
7708
|
'sd-select-multiple--disabled': this.disabled,
|
|
7620
|
-
}, ref: el => (this.selectRef = el) }, this.renderLabel(this.label), hAsync("div", { key: '
|
|
7709
|
+
}, ref: el => (this.selectRef = el) }, this.renderLabel(this.label), hAsync("div", { key: 'e42235a132e3c13e9a996206ab7f58698ab97fe1', class: "sd-select-multiple__container" }, this.renderTrigger(), this.renderDropdown()))));
|
|
7621
7710
|
}
|
|
7622
7711
|
renderLabel(label) {
|
|
7623
7712
|
if (!label)
|
|
@@ -8147,7 +8236,7 @@ class SdSelectOption {
|
|
|
8147
8236
|
}
|
|
8148
8237
|
};
|
|
8149
8238
|
render() {
|
|
8150
|
-
return (hAsync(Host, { key: '
|
|
8239
|
+
return (hAsync(Host, { key: '7cf5b51057f8eb7ad7cf7143225bcd842e5fa231' }, hAsync("div", { key: 'ab9e02db38a0717b9aeb85890b150a6e59a9f7ee', class: {
|
|
8151
8240
|
'sd-select__option': true,
|
|
8152
8241
|
'sd-select__option--selected': this.isSelected,
|
|
8153
8242
|
'sd-select__option--disabled': !!this.option.disabled,
|
|
@@ -8233,7 +8322,7 @@ class SdSelectOptionGroup {
|
|
|
8233
8322
|
}
|
|
8234
8323
|
};
|
|
8235
8324
|
render() {
|
|
8236
|
-
return (hAsync("div", { key: '
|
|
8325
|
+
return (hAsync("div", { key: '2d1e55e35c77246a2df6856b2e7053cc21aabfc5', class: {
|
|
8237
8326
|
'sd-select__option-group': true,
|
|
8238
8327
|
'sd-select__option-group--selected': !!this.isSelected,
|
|
8239
8328
|
'sd-select__option-group--disabled': !!this.option.disabled,
|
|
@@ -8242,10 +8331,10 @@ class SdSelectOptionGroup {
|
|
|
8242
8331
|
'sd-select__option-group--group': this.option.type === 'group',
|
|
8243
8332
|
'sd-select__option-group--subgroup': this.option.type === 'subgroup',
|
|
8244
8333
|
'sd-select__option-group--item': this.option.type === 'item',
|
|
8245
|
-
}, onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), style: this.optionStyle, "data-index": this.index, onClick: event => this.handleClick(this.option, this.isSelected, event) }, hAsync("div", { key: '
|
|
8334
|
+
}, onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), style: this.optionStyle, "data-index": this.index, onClick: event => this.handleClick(this.option, this.isSelected, event) }, hAsync("div", { key: '33ce9985f9c94502d103d81b3678abdb732dfadb', class: "sd-select__option-group__label-wrapper" }, this.useCheckbox && (hAsync("sd-checkbox", { key: '262ec7ac68b981b5a69c21a5785c2c4ff5db7966', checked: this.isSelected, disabled: this.option.disabled, onClick: e => {
|
|
8246
8335
|
e.preventDefault();
|
|
8247
8336
|
this.handleClick(this.option, this.isSelected, e);
|
|
8248
|
-
} })), hAsync("span", { key: '
|
|
8337
|
+
} })), hAsync("span", { key: 'f9c89b082413da5914e166d53e1fd9bc269395ce', class: "sd-select__option-group-label" }, this.option.label), this.useIndicator && this.option.type !== 'item' && (hAsync("span", { key: 'eaec735454f0b3c102397352d7863662fa933b24', class: "sd-select__option-group__count-indicator" }, `(${this.countInfo?.selectedCount}/${this.countInfo?.totalCount})`)))));
|
|
8249
8338
|
}
|
|
8250
8339
|
static get style() { return sdSelectOptionGroupCss; }
|
|
8251
8340
|
static get cmpMeta() { return {
|
|
@@ -8538,7 +8627,7 @@ let SdTable$1 = class SdTable {
|
|
|
8538
8627
|
}; }
|
|
8539
8628
|
};
|
|
8540
8629
|
|
|
8541
|
-
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:var(--table-container-height, auto);position:relative;border:1px solid #e1e1e1;border-radius:8px;font-size:12px;overflow:hidden;background:#ffffff}.sd-table__wrapper .sd-table__container .sd-table__middle{overflow:auto;will-change:scroll-position}.sd-table__wrapper .sd-table__container .sd-table__middle--scrollable{height:var(--table-container-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%;border-collapse:separate;border-spacing:0;table-layout:fixed}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll{position:relative;height:var(--total-virtual-height, --table-container-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll tr:not([aria-hidden=true]){width:100%}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll tr[aria-hidden=true]{padding:0;border:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll tr[aria-hidden=true]:not(.sd-table__virtual-row-spacer) td{display:none}.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
|
|
8630
|
+
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:var(--table-container-height, auto);position:relative;border:1px solid #e1e1e1;border-radius:8px;font-size:12px;overflow:hidden;background:#ffffff}.sd-table__wrapper .sd-table__container .sd-table__middle{overflow:auto;will-change:scroll-position;min-height:var(--table-container-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle--scrollable{height:var(--table-container-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle--loading{overflow:hidden !important;pointer-events:none}.sd-table__wrapper .sd-table__container .sd-table__middle--loading__spinner{position:absolute;top:0;left:0;width:100%;height:var(--table-container-height, 100%);min-height:var(--table-container-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{background-color:white;display:table;width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll{position:relative;height:var(--total-virtual-height, --table-container-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll tr:not([aria-hidden=true]){width:100%}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll tr[aria-hidden=true]{padding:0;border:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll tr[aria-hidden=true]:not(.sd-table__virtual-row-spacer) td{display:none}.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 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__container .sd-table__bottom .sd-table__no-data{padding-top:15%;color:#888888}.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%)}.sd-table__wrapper .sd-table__virtual-spacer,.sd-table__wrapper .sd-table__virtual-row-spacer{padding:0 !important}.sd-table__wrapper .sd-table__virtual-spacer td,.sd-table__wrapper .sd-table__virtual-row-spacer td{padding:0 !important;border:none}.sd-table__wrapper .sd-table__virtual-spacer .sd-table__skeleton,.sd-table__wrapper .sd-table__virtual-row-spacer .sd-table__skeleton{width:100%;height:100%;background-image:repeating-linear-gradient(0deg, rgba(246, 246, 246, 0.3) 0px, rgba(225, 225, 225, 0.5) calc(var(--row-height, 44px) / 2), rgba(246, 246, 246, 0.3) var(--row-height, 44px));background-size:100% 200%;animation:skeleton-loading 1.5s ease-in-out infinite;position:relative}.sd-table__wrapper .sd-table__virtual-spacer .sd-table__skeleton::before,.sd-table__wrapper .sd-table__virtual-row-spacer .sd-table__skeleton::before{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;background-image:repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--row-height, 44px) - 1px), #e1e1e1 calc(var(--row-height, 44px) - 1px), #e1e1e1 var(--row-height, 44px));pointer-events:none}.sd-table__wrapper .sd-table__skeleton-cell{width:100%;height:20px;background:linear-gradient(90deg, rgba(246, 246, 246, 0.3) 0%, rgba(225, 225, 225, 0.5) 50%, rgba(246, 246, 246, 0.3) 100%);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite;border-radius:4px}@keyframes skeleton-loading{0%{background-position:0% 0%}50%{background-position:100% 100%}100%{background-position:0% 0%}}";
|
|
8542
8631
|
|
|
8543
8632
|
class SdTable {
|
|
8544
8633
|
constructor(hostRef) {
|
|
@@ -8597,6 +8686,7 @@ class SdTable {
|
|
|
8597
8686
|
virtualStartColIdx = 0;
|
|
8598
8687
|
virtualEndColIdx = 0;
|
|
8599
8688
|
scrollLeftPosition = 0;
|
|
8689
|
+
// 가상 스크롤 Raf(Request Animation Frame) 관리
|
|
8600
8690
|
scrollRequestAnimationFrame = null;
|
|
8601
8691
|
scrollContainer = null;
|
|
8602
8692
|
rafScheduled = false;
|
|
@@ -8604,19 +8694,39 @@ class SdTable {
|
|
|
8604
8694
|
vertical: false,
|
|
8605
8695
|
horizontal: false,
|
|
8606
8696
|
};
|
|
8697
|
+
// 상태 캐시값
|
|
8698
|
+
cachedVisibleColumns = null;
|
|
8699
|
+
lastColumnsRef = null;
|
|
8700
|
+
cachedVirtualRows = null;
|
|
8701
|
+
cachedVirtualIndexKey = '';
|
|
8702
|
+
cachedColumnOrder = null;
|
|
8703
|
+
lastColumnOrderKey = '';
|
|
8704
|
+
// DOM 측정 캐시값
|
|
8705
|
+
cachedContainerHeight = 0;
|
|
8706
|
+
cachedContainerWidth = 0;
|
|
8707
|
+
// 스타일 캐시
|
|
8708
|
+
stickyStyleCache = new Map();
|
|
8709
|
+
// isAllChecked 캐시
|
|
8710
|
+
cachedIsAllChecked;
|
|
8711
|
+
lastSelectionKey = '';
|
|
8712
|
+
onScroll;
|
|
8607
8713
|
handleColumnsChange(newCols) {
|
|
8608
8714
|
this.columnWidths = newCols.map(c => parseInt(c.width || '120', 10));
|
|
8715
|
+
this.cleanUpVirtualCache();
|
|
8716
|
+
this.stickyStyleCache.clear();
|
|
8609
8717
|
if (this.useVirtualScroll.horizontal) {
|
|
8610
8718
|
this.scheduleUpdate('horizontal');
|
|
8611
8719
|
}
|
|
8612
8720
|
}
|
|
8613
8721
|
handleColumnWidthsChange() {
|
|
8722
|
+
this.stickyStyleCache.clear();
|
|
8614
8723
|
if (this.useVirtualScroll.horizontal) {
|
|
8615
8724
|
this.scheduleUpdate('horizontal');
|
|
8616
8725
|
}
|
|
8617
8726
|
}
|
|
8618
8727
|
handleRowsChange(newRows) {
|
|
8619
8728
|
this.innerRows = [...newRows];
|
|
8729
|
+
this.cleanUpVirtualCache();
|
|
8620
8730
|
if (this.useVirtualScroll.vertical) {
|
|
8621
8731
|
this.scheduleUpdate('vertical');
|
|
8622
8732
|
}
|
|
@@ -8624,11 +8734,19 @@ class SdTable {
|
|
|
8624
8734
|
handleSelectedChange(newSelected) {
|
|
8625
8735
|
this.innerSelected = new Set(newSelected);
|
|
8626
8736
|
}
|
|
8737
|
+
cleanUpVirtualCache() {
|
|
8738
|
+
this.cachedVisibleColumns = null;
|
|
8739
|
+
this.lastColumnsRef = null;
|
|
8740
|
+
this.cachedVirtualRows = null;
|
|
8741
|
+
this.cachedVirtualIndexKey = '';
|
|
8742
|
+
this.cachedColumnOrder = null;
|
|
8743
|
+
this.lastColumnOrderKey = '';
|
|
8744
|
+
}
|
|
8627
8745
|
handlePaginationChange(newVal) {
|
|
8628
8746
|
if (newVal?.page && newVal.page !== this.currentPage) {
|
|
8629
8747
|
this.currentPage = newVal.page;
|
|
8630
8748
|
if (this.useVirtualScroll.vertical && this.scrollContainer) {
|
|
8631
|
-
this.scrollContainer.
|
|
8749
|
+
this.scrollContainer.scrollTo({ top: 0, behavior: 'instant' });
|
|
8632
8750
|
this.scrollTopPosition = 0;
|
|
8633
8751
|
this.calculateVisibleRange();
|
|
8634
8752
|
}
|
|
@@ -8643,66 +8761,126 @@ class SdTable {
|
|
|
8643
8761
|
}
|
|
8644
8762
|
}
|
|
8645
8763
|
componentDidLoad() {
|
|
8646
|
-
|
|
8647
|
-
|
|
8648
|
-
|
|
8649
|
-
|
|
8650
|
-
|
|
8651
|
-
|
|
8652
|
-
|
|
8653
|
-
|
|
8654
|
-
|
|
8655
|
-
|
|
8656
|
-
|
|
8657
|
-
|
|
8658
|
-
|
|
8659
|
-
|
|
8660
|
-
|
|
8661
|
-
|
|
8662
|
-
cancelAnimationFrame(this.scrollRequestAnimationFrame);
|
|
8764
|
+
readTask(() => {
|
|
8765
|
+
const middle = this.el.querySelector('.sd-table__middle');
|
|
8766
|
+
if (!middle)
|
|
8767
|
+
return;
|
|
8768
|
+
this.onScroll = () => {
|
|
8769
|
+
const scrollLeft = middle.scrollLeft;
|
|
8770
|
+
const scrollWidth = middle.scrollWidth;
|
|
8771
|
+
const clientWidth = middle.clientWidth;
|
|
8772
|
+
const scrollTop = middle.scrollTop;
|
|
8773
|
+
const verticalChanged = this.useVirtualScroll.vertical && this.scrollTopPosition !== scrollTop;
|
|
8774
|
+
const horizontalChanged = this.useVirtualScroll.horizontal && this.scrollLeftPosition !== scrollLeft;
|
|
8775
|
+
const newScrolledLeft = scrollLeft > 0;
|
|
8776
|
+
const newScrolledRight = scrollLeft + clientWidth < scrollWidth;
|
|
8777
|
+
if (this.scrolledLeft !== newScrolledLeft || this.scrolledRight !== newScrolledRight) {
|
|
8778
|
+
this.scrolledLeft = newScrolledLeft;
|
|
8779
|
+
this.scrolledRight = newScrolledRight;
|
|
8663
8780
|
}
|
|
8664
|
-
|
|
8665
|
-
if (
|
|
8666
|
-
this.
|
|
8781
|
+
if (verticalChanged || horizontalChanged) {
|
|
8782
|
+
if (this.scrollRequestAnimationFrame !== null) {
|
|
8783
|
+
cancelAnimationFrame(this.scrollRequestAnimationFrame);
|
|
8784
|
+
}
|
|
8785
|
+
this.scrollRequestAnimationFrame = requestAnimationFrame(() => {
|
|
8786
|
+
if (verticalChanged) {
|
|
8787
|
+
this.scrollTopPosition = scrollTop;
|
|
8788
|
+
this.calculateVisibleRange();
|
|
8789
|
+
}
|
|
8790
|
+
if (horizontalChanged) {
|
|
8791
|
+
this.scrollLeftPosition = scrollLeft;
|
|
8792
|
+
this.calculateVisibleColumnRange();
|
|
8793
|
+
}
|
|
8794
|
+
this.scrollRequestAnimationFrame = null;
|
|
8795
|
+
});
|
|
8796
|
+
}
|
|
8797
|
+
};
|
|
8798
|
+
this.scrollContainer = middle;
|
|
8799
|
+
requestAnimationFrame(() => {
|
|
8800
|
+
if (this.scrollContainer && this.onScroll) {
|
|
8801
|
+
this.cachedContainerHeight = this.scrollContainer.clientHeight;
|
|
8802
|
+
this.cachedContainerWidth = this.scrollContainer.clientWidth;
|
|
8803
|
+
middle.addEventListener('scroll', this.onScroll, { passive: true });
|
|
8804
|
+
if (this.useVirtualScroll.vertical) {
|
|
8667
8805
|
this.calculateVisibleRange();
|
|
8668
8806
|
}
|
|
8669
|
-
if (
|
|
8670
|
-
this.scrollLeftPosition = scrollLeft;
|
|
8807
|
+
if (this.useVirtualScroll.horizontal) {
|
|
8671
8808
|
this.calculateVisibleColumnRange();
|
|
8672
8809
|
}
|
|
8673
|
-
this.
|
|
8674
|
-
}
|
|
8675
|
-
}
|
|
8810
|
+
this.onScroll();
|
|
8811
|
+
}
|
|
8812
|
+
});
|
|
8813
|
+
});
|
|
8814
|
+
}
|
|
8815
|
+
changePage(page) {
|
|
8816
|
+
if (!this.useInternalPagination) {
|
|
8817
|
+
this.sdPageChange.emit(page);
|
|
8818
|
+
return;
|
|
8819
|
+
}
|
|
8820
|
+
this.currentPage = page;
|
|
8821
|
+
this.sdPageChange.emit(this.currentPage);
|
|
8822
|
+
}
|
|
8823
|
+
changeRowsPerPage(perPage) {
|
|
8824
|
+
const changedRowsPerPage = perPage ? Number(perPage) : 0;
|
|
8825
|
+
if (!this.useInternalPagination) {
|
|
8826
|
+
this.sdRowsPerPageChange.emit(changedRowsPerPage);
|
|
8827
|
+
return;
|
|
8828
|
+
}
|
|
8829
|
+
const newRowsPerPage = Number(perPage || 0);
|
|
8830
|
+
let newLastPage = Math.max(1, Math.ceil(this.innerRows.length / newRowsPerPage));
|
|
8831
|
+
let newCurrentPage = this.currentPage;
|
|
8832
|
+
if (newCurrentPage > newLastPage) {
|
|
8833
|
+
newCurrentPage = newLastPage;
|
|
8834
|
+
}
|
|
8835
|
+
this.pagination = {
|
|
8836
|
+
page: newCurrentPage,
|
|
8837
|
+
rowsPerPage: newRowsPerPage,
|
|
8838
|
+
lastPage: newLastPage,
|
|
8676
8839
|
};
|
|
8677
|
-
|
|
8678
|
-
|
|
8840
|
+
this.currentPage = newCurrentPage;
|
|
8841
|
+
this.sdRowsPerPageChange.emit(changedRowsPerPage);
|
|
8679
8842
|
}
|
|
8680
8843
|
disconnectedCallback() {
|
|
8844
|
+
if (this.scrollContainer && this.onScroll) {
|
|
8845
|
+
this.scrollContainer.removeEventListener('scroll', this.onScroll);
|
|
8846
|
+
}
|
|
8681
8847
|
if (this.scrollRequestAnimationFrame !== null) {
|
|
8682
8848
|
cancelAnimationFrame(this.scrollRequestAnimationFrame);
|
|
8683
8849
|
}
|
|
8684
8850
|
}
|
|
8685
8851
|
// ----- Derived getters -----
|
|
8686
8852
|
get visibleColumns() {
|
|
8687
|
-
|
|
8853
|
+
if (this.cachedVisibleColumns && this.lastColumnsRef === this.columns) {
|
|
8854
|
+
return this.cachedVisibleColumns;
|
|
8855
|
+
}
|
|
8856
|
+
this.lastColumnsRef = this.columns;
|
|
8857
|
+
this.cachedVisibleColumns = this.columns.filter(col => col.visible !== false);
|
|
8858
|
+
return this.cachedVisibleColumns;
|
|
8688
8859
|
}
|
|
8689
8860
|
get paginatedRows() {
|
|
8690
8861
|
if (!this.pagination || !this.useInternalPagination)
|
|
8691
8862
|
return this.innerRows;
|
|
8692
8863
|
const { rowsPerPage = this.rows.length } = this.pagination || {};
|
|
8693
|
-
|
|
8694
|
-
return result;
|
|
8864
|
+
return this.innerRows.slice((this.currentPage - 1) * rowsPerPage, this.currentPage * rowsPerPage);
|
|
8695
8865
|
}
|
|
8696
8866
|
get virtualRows() {
|
|
8867
|
+
const newVirtualIndexKey = `${this.virtualStartIndex}-${this.virtualEndIndex}`;
|
|
8868
|
+
if (this.cachedVirtualRows && this.cachedVirtualIndexKey === newVirtualIndexKey) {
|
|
8869
|
+
return this.cachedVirtualRows;
|
|
8870
|
+
}
|
|
8871
|
+
this.cachedVirtualIndexKey = newVirtualIndexKey;
|
|
8697
8872
|
if (!this.useVirtualScroll.vertical) {
|
|
8698
|
-
|
|
8873
|
+
this.cachedVirtualRows = this.paginatedRows.map((row, idx) => ({ row, actualIndex: idx }));
|
|
8699
8874
|
}
|
|
8700
|
-
|
|
8701
|
-
|
|
8702
|
-
|
|
8703
|
-
|
|
8704
|
-
|
|
8705
|
-
|
|
8875
|
+
else {
|
|
8876
|
+
this.cachedVirtualRows = this.paginatedRows
|
|
8877
|
+
.slice(this.virtualStartIndex, this.virtualEndIndex + 1)
|
|
8878
|
+
.map((row, relativeIdx) => ({
|
|
8879
|
+
row,
|
|
8880
|
+
actualIndex: this.virtualStartIndex + relativeIdx,
|
|
8881
|
+
}));
|
|
8882
|
+
}
|
|
8883
|
+
return this.cachedVirtualRows;
|
|
8706
8884
|
}
|
|
8707
8885
|
get topSpacerHeight() {
|
|
8708
8886
|
if (!this.useVirtualScroll.vertical || this.virtualStartIndex === 0)
|
|
@@ -8775,6 +8953,7 @@ class SdTable {
|
|
|
8775
8953
|
if (newSelected.length === selectedArray.length)
|
|
8776
8954
|
return;
|
|
8777
8955
|
this.innerSelected = new Set(newSelected);
|
|
8956
|
+
this.cachedIsAllChecked = undefined;
|
|
8778
8957
|
this.sdSelectChange.emit(Array.from(this.innerSelected));
|
|
8779
8958
|
}
|
|
8780
8959
|
toggleSelectAll(checked) {
|
|
@@ -8786,16 +8965,29 @@ class SdTable {
|
|
|
8786
8965
|
const currentPageKeys = this.paginatedRows.map(r => r[this.rowKey]);
|
|
8787
8966
|
this.innerSelected = new Set([...this.innerSelected].filter(r => !currentPageKeys.includes(r[this.rowKey])));
|
|
8788
8967
|
}
|
|
8968
|
+
this.cachedIsAllChecked = undefined;
|
|
8789
8969
|
this.sdSelectChange.emit(Array.from(this.innerSelected));
|
|
8790
8970
|
}
|
|
8791
8971
|
get isAllChecked() {
|
|
8972
|
+
const selectionKey = `${this.paginatedRows.length}-${this.innerSelected.size}`;
|
|
8973
|
+
if (this.cachedIsAllChecked !== undefined && this.lastSelectionKey === selectionKey) {
|
|
8974
|
+
return this.cachedIsAllChecked;
|
|
8975
|
+
}
|
|
8792
8976
|
const total = this.paginatedRows.length;
|
|
8793
8977
|
const selectedCount = this.paginatedRows.filter(row => Array.from(this.innerSelected).some(selectedRow => selectedRow[this.rowKey] === row[this.rowKey])).length;
|
|
8794
|
-
|
|
8795
|
-
|
|
8796
|
-
|
|
8797
|
-
|
|
8798
|
-
|
|
8978
|
+
let result;
|
|
8979
|
+
if (selectedCount === 0) {
|
|
8980
|
+
result = false; // 아무것도 안 선택됨
|
|
8981
|
+
}
|
|
8982
|
+
else if (selectedCount === total) {
|
|
8983
|
+
result = true; // 전부 선택됨
|
|
8984
|
+
}
|
|
8985
|
+
else {
|
|
8986
|
+
result = null; // 일부만 선택됨
|
|
8987
|
+
}
|
|
8988
|
+
this.cachedIsAllChecked = result;
|
|
8989
|
+
this.lastSelectionKey = selectionKey;
|
|
8990
|
+
return result;
|
|
8799
8991
|
}
|
|
8800
8992
|
// RAF 통합 관리
|
|
8801
8993
|
scheduleUpdate(type) {
|
|
@@ -8821,13 +9013,22 @@ class SdTable {
|
|
|
8821
9013
|
return;
|
|
8822
9014
|
}
|
|
8823
9015
|
const scrollTop = this.scrollTopPosition;
|
|
8824
|
-
|
|
9016
|
+
let containerHeight = this.cachedContainerHeight;
|
|
9017
|
+
if (containerHeight === 0 && this.scrollContainer) {
|
|
9018
|
+
containerHeight = this.scrollContainer.clientHeight;
|
|
9019
|
+
this.cachedContainerHeight = containerHeight;
|
|
9020
|
+
}
|
|
9021
|
+
const bufferSize = this.virtualBufferSize.vertical || 5;
|
|
8825
9022
|
const startIndex = Math.floor(scrollTop / this.virtualRowHeight);
|
|
8826
9023
|
const visibleCount = Math.ceil(containerHeight / this.virtualRowHeight);
|
|
8827
|
-
const endIndex = startIndex + visibleCount;
|
|
8828
|
-
const
|
|
8829
|
-
|
|
8830
|
-
|
|
9024
|
+
const endIndex = startIndex + visibleCount - 1;
|
|
9025
|
+
const newStartIndex = Math.max(0, startIndex - bufferSize);
|
|
9026
|
+
const newEndIndex = Math.min(this.paginatedRows.length - 1, endIndex + bufferSize);
|
|
9027
|
+
// 실제로 변경된 경우에만 상태 업데이트
|
|
9028
|
+
if (this.virtualStartIndex !== newStartIndex || this.virtualEndIndex !== newEndIndex) {
|
|
9029
|
+
this.virtualStartIndex = newStartIndex;
|
|
9030
|
+
this.virtualEndIndex = newEndIndex;
|
|
9031
|
+
}
|
|
8831
9032
|
}
|
|
8832
9033
|
// 가로 가상 스크롤 렌더링 계산
|
|
8833
9034
|
calculateVisibleColumnRange() {
|
|
@@ -8837,7 +9038,12 @@ class SdTable {
|
|
|
8837
9038
|
return;
|
|
8838
9039
|
}
|
|
8839
9040
|
const scrollLeft = this.scrollLeftPosition;
|
|
8840
|
-
|
|
9041
|
+
// 캐시된 값 사용, 없으면 측정 후 캐시
|
|
9042
|
+
let containerWidth = this.cachedContainerWidth;
|
|
9043
|
+
if (containerWidth === 0 && this.scrollContainer) {
|
|
9044
|
+
containerWidth = this.scrollContainer.clientWidth;
|
|
9045
|
+
this.cachedContainerWidth = containerWidth;
|
|
9046
|
+
}
|
|
8841
9047
|
const stickyLeftCount = this.stickyColumn.left || 0;
|
|
8842
9048
|
const stickyRightCount = this.stickyColumn.right || 0;
|
|
8843
9049
|
// 가상 스크롤 컬럼 - sticky column 제외
|
|
@@ -8877,22 +9083,34 @@ class SdTable {
|
|
|
8877
9083
|
}
|
|
8878
9084
|
}
|
|
8879
9085
|
const bufferSize = this.virtualBufferSize.horizontal || 5;
|
|
8880
|
-
|
|
8881
|
-
|
|
9086
|
+
const newStartColIdx = Math.max(0, startIdx - bufferSize);
|
|
9087
|
+
const newEndColIdx = Math.min(virtualColumns.length - 1, endIdx + bufferSize);
|
|
9088
|
+
// 실제로 변경된 경우에만 상태 업데이트
|
|
9089
|
+
if (this.virtualStartColIdx !== newStartColIdx || this.virtualEndColIdx !== newEndColIdx) {
|
|
9090
|
+
this.virtualStartColIdx = newStartColIdx;
|
|
9091
|
+
this.virtualEndColIdx = newEndColIdx;
|
|
9092
|
+
}
|
|
8882
9093
|
}
|
|
8883
9094
|
// ----- Helpers -----
|
|
8884
9095
|
getStickyStyle(colIdx) {
|
|
9096
|
+
// 캐시된 스타일이 있으면 반환
|
|
9097
|
+
if (this.stickyStyleCache.has(colIdx)) {
|
|
9098
|
+
return this.stickyStyleCache.get(colIdx);
|
|
9099
|
+
}
|
|
8885
9100
|
const leftOffset = this.columnWidths.slice(0, colIdx).reduce((a, b) => a + b, 0) + (this.selectable ? 52 : 0);
|
|
8886
9101
|
const rightOffset = this.columnWidths
|
|
8887
9102
|
.filter((_, i) => i >= this.visibleColumns.length - (this.stickyColumn.right || 0) && i > colIdx)
|
|
8888
9103
|
.reduce((a, b) => a + b, 0);
|
|
8889
|
-
|
|
9104
|
+
const style = {
|
|
8890
9105
|
'--sticky-left-offset': `${leftOffset}px`,
|
|
8891
9106
|
'--sticky-right-offset': `${rightOffset}px`,
|
|
8892
9107
|
'width': `${this.columnWidths[colIdx]}px`,
|
|
8893
9108
|
'minWidth': `${this.columnWidths[colIdx]}px`,
|
|
8894
9109
|
'maxWidth': `${this.columnWidths[colIdx]}px`,
|
|
8895
9110
|
};
|
|
9111
|
+
// 스타일 캐시에 저장
|
|
9112
|
+
this.stickyStyleCache.set(colIdx, style);
|
|
9113
|
+
return style;
|
|
8896
9114
|
}
|
|
8897
9115
|
handleResize(index, event) {
|
|
8898
9116
|
// SSR 환경 체크
|
|
@@ -8922,6 +9140,10 @@ class SdTable {
|
|
|
8922
9140
|
return format ? format(value, row) : value;
|
|
8923
9141
|
}
|
|
8924
9142
|
getColumnRenderedInOrder() {
|
|
9143
|
+
const orderKey = `${this.visibleColumns.length}-${this.virtualStartColIdx}-${this.virtualEndColIdx}`;
|
|
9144
|
+
if (this.cachedColumnOrder && this.lastColumnOrderKey === orderKey) {
|
|
9145
|
+
return this.cachedColumnOrder;
|
|
9146
|
+
}
|
|
8925
9147
|
const stickyLeftCount = this.stickyColumn.left || 0;
|
|
8926
9148
|
const stickyRightCount = this.stickyColumn.right || 0;
|
|
8927
9149
|
// Sticky left 컬럼들
|
|
@@ -8932,13 +9154,15 @@ class SdTable {
|
|
|
8932
9154
|
.slice(stickyLeftCount, this.visibleColumns.length - stickyRightCount)
|
|
8933
9155
|
.slice(this.virtualStartColIdx, this.virtualEndColIdx + 1)
|
|
8934
9156
|
: this.visibleColumns.slice(stickyLeftCount, this.visibleColumns.length - stickyRightCount);
|
|
8935
|
-
|
|
9157
|
+
this.cachedColumnOrder = {
|
|
8936
9158
|
stickyLeftCount,
|
|
8937
9159
|
stickyRightCount,
|
|
8938
9160
|
stickyLeftCols,
|
|
8939
9161
|
middleCols,
|
|
8940
9162
|
stickyRightCols,
|
|
8941
9163
|
};
|
|
9164
|
+
this.lastColumnOrderKey = orderKey;
|
|
9165
|
+
return this.cachedColumnOrder;
|
|
8942
9166
|
}
|
|
8943
9167
|
// ----- Render -----
|
|
8944
9168
|
renderHead() {
|
|
@@ -8976,7 +9200,7 @@ class SdTable {
|
|
|
8976
9200
|
}))));
|
|
8977
9201
|
}
|
|
8978
9202
|
renderBody() {
|
|
8979
|
-
return (hAsync("tbody", { ...(!this.paginatedRows.length && { part: 'tbody-empty' }), class: `sd-table-tbody ${this.useVirtualScroll.vertical ? 'sd-table-tbody--virtual-scroll' : ''}`, style: { '--total-virtual-height': `${this.totalVirtualHeight}px` } }, this.
|
|
9203
|
+
return (hAsync("tbody", { ...(!this.paginatedRows.length && { part: 'tbody-empty' }), class: `sd-table-tbody ${this.useVirtualScroll.vertical ? 'sd-table-tbody--virtual-scroll' : ''}`, style: { '--total-virtual-height': `${this.totalVirtualHeight}px` } }, this.useVirtualScroll.vertical && this.topSpacerHeight > 0 && this.renderSpacerRow('top'), this.paginatedRows.length > 0 &&
|
|
8980
9204
|
this.virtualRows.map(({ row, actualIndex }) => this.renderRow(row, actualIndex)), this.useVirtualScroll.vertical &&
|
|
8981
9205
|
this.bottomSpacerHeight > 0 &&
|
|
8982
9206
|
this.renderSpacerRow('bottom')));
|
|
@@ -9046,44 +9270,16 @@ class SdTable {
|
|
|
9046
9270
|
}, "aria-hidden": "true" }, hAsync("div", { class: "sd-table__skeleton-cell" })));
|
|
9047
9271
|
}
|
|
9048
9272
|
render() {
|
|
9049
|
-
return (hAsync(Host, { key: '
|
|
9273
|
+
return (hAsync(Host, { key: '85b4655b2ee298d535add2e43c2ef73b8c816716' }, hAsync("div", { key: '9fc71a34045a725db9fa19fec9954d1edb90f1e4', class: "sd-table__wrapper", style: {
|
|
9050
9274
|
'--table-width': this.width,
|
|
9051
9275
|
'--table-height': this.height,
|
|
9052
|
-
} }, hAsync("div", { key: '
|
|
9276
|
+
} }, hAsync("div", { key: 'dcb78c1bac32c68bc5ac81beece5ee8ca74025ba', class: "sd-table__container", style: {
|
|
9053
9277
|
'--table-container-height': `calc(${this.height} - ${this.pagination && this.innerRows.length > 0 ? 48 : 0}px)`,
|
|
9054
|
-
} }, hAsync("div", { key: '
|
|
9278
|
+
} }, hAsync("div", { key: 'e0bb087930f0cf07c06c6f5684a5b26fa5e25a02', class: {
|
|
9055
9279
|
'sd-table__middle': true,
|
|
9056
9280
|
'sd-table__middle--scrollable': this.paginatedRows.length > 0,
|
|
9057
9281
|
'sd-table__middle--loading': this.isLoading,
|
|
9058
|
-
} }, hAsync("table", { key: '
|
|
9059
|
-
if (!this.useInternalPagination) {
|
|
9060
|
-
this.sdPageChange.emit(e.detail);
|
|
9061
|
-
}
|
|
9062
|
-
else {
|
|
9063
|
-
this.currentPage = e.detail;
|
|
9064
|
-
this.sdPageChange.emit(this.currentPage);
|
|
9065
|
-
}
|
|
9066
|
-
} }), this.useRowsPerPageSelect && (hAsync("sd-select", { key: '3f65639b064a27993dc62a8e4a5dc86b16aec4f8', value: this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", onSdChange: (e) => {
|
|
9067
|
-
const changedRowsPerPage = e.detail.value ? Number(e.detail.value) : 0;
|
|
9068
|
-
if (!this.useInternalPagination) {
|
|
9069
|
-
this.sdRowsPerPageChange.emit(changedRowsPerPage);
|
|
9070
|
-
}
|
|
9071
|
-
else {
|
|
9072
|
-
const newRowsPerPage = Number(e.detail.value || 0);
|
|
9073
|
-
let newLastPage = Math.max(1, Math.ceil(this.innerRows.length / newRowsPerPage));
|
|
9074
|
-
let newCurrentPage = this.currentPage;
|
|
9075
|
-
if (newCurrentPage > newLastPage) {
|
|
9076
|
-
newCurrentPage = newLastPage;
|
|
9077
|
-
}
|
|
9078
|
-
this.pagination = {
|
|
9079
|
-
page: newCurrentPage,
|
|
9080
|
-
rowsPerPage: newRowsPerPage,
|
|
9081
|
-
lastPage: newLastPage,
|
|
9082
|
-
};
|
|
9083
|
-
this.currentPage = newCurrentPage;
|
|
9084
|
-
this.sdRowsPerPageChange.emit(changedRowsPerPage);
|
|
9085
|
-
}
|
|
9086
|
-
} })))))));
|
|
9282
|
+
} }, this.isLoading && (hAsync("div", { key: '4f36b5fc670aa98774e565b000cc1623a6cae0af', class: "sd-table__middle--loading__spinner" }, hAsync("sd-loading-spinner", { key: '2e794ac56824bfad1f9f42482b75498e7f2ca70c' }))), hAsync("table", { key: 'a4017ae90c8f932c22b26d7f81c9fc13785e52d0', part: "table", class: this.sdTableClasses }, this.renderHead(), this.renderBody())), hAsync("div", { key: 'c7b008d66c47442d25a977d76b7b6dd266d7f008', class: "sd-table__bottom" }, !this.paginatedRows.length && (hAsync("div", { key: '20235f4747c2396710b44d46ea1da659156bb9ca', class: "sd-table__no-data" }, hAsync("slot", { key: '432a8669c4942eb92c4bce7f0b08cb9cb1f9f6e3', name: "no-data" }, this.noDataLabel))))), this.pagination && this.innerRows.length > 0 && (hAsync("div", { key: 'f9f6dc05c1004b03e10ece4c091d67ca564b1633', class: "sd-table__pagination" }, hAsync("sd-pagination", { key: 'd7efd361091fe9725e8c79289501506a779e1111', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onPageChange: (e) => this.changePage(e.detail) }), this.useRowsPerPageSelect && (hAsync("sd-select", { key: '401d35d85c2fc78094c267f27d74055108179f9e', value: this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", onSdChange: (e) => this.changeRowsPerPage(e.detail.value) })))))));
|
|
9087
9283
|
}
|
|
9088
9284
|
static get watchers() { return {
|
|
9089
9285
|
"columns": ["handleColumnsChange"],
|
|
@@ -9181,7 +9377,7 @@ class SdTag {
|
|
|
9181
9377
|
}
|
|
9182
9378
|
render() {
|
|
9183
9379
|
const tagClasses = this.getTagClasses();
|
|
9184
|
-
return (hAsync("span", { key: '
|
|
9380
|
+
return (hAsync("span", { key: '982a1d00b05ea1978c001d0898b8d95a57f92ff5', class: tagClasses, style: {
|
|
9185
9381
|
'--tag-bg-color': this.bgColor,
|
|
9186
9382
|
'--tag-text-color': this.textColor,
|
|
9187
9383
|
}, "aria-label": this.label || 'tag' }, this.renderContent()));
|
|
@@ -9211,7 +9407,7 @@ class SdTbody {
|
|
|
9211
9407
|
registerInstance(this, hostRef);
|
|
9212
9408
|
}
|
|
9213
9409
|
render() {
|
|
9214
|
-
return (hAsync(Host, { key: '
|
|
9410
|
+
return (hAsync(Host, { key: 'aa5030bb9713c355685de66e15db8b702744c0bc' }, hAsync("slot", { key: '2bfed556b78fc92f8f6b4c574f976a7f0a3c36a8' })));
|
|
9215
9411
|
}
|
|
9216
9412
|
static get style() { return sdTbodyCss; }
|
|
9217
9413
|
static get cmpMeta() { return {
|
|
@@ -9235,11 +9431,11 @@ class SdTd {
|
|
|
9235
9431
|
tdStyle;
|
|
9236
9432
|
tdClass;
|
|
9237
9433
|
render() {
|
|
9238
|
-
return (hAsync(Host, { key: '
|
|
9434
|
+
return (hAsync(Host, { key: '6459518995f28a8138b3f669876c90dd24e610c2', role: "cell", class: {
|
|
9239
9435
|
'sd-td': true,
|
|
9240
9436
|
[`sd-td--${this.align}`]: true,
|
|
9241
9437
|
[this.tdClass || '']: Boolean(this.tdClass),
|
|
9242
|
-
}, style: this.tdStyle }, hAsync("slot", { key: '
|
|
9438
|
+
}, style: this.tdStyle }, hAsync("slot", { key: 'bf51d35dee9adb6a88b29a6c51be9f73ae1ab3b5' })));
|
|
9243
9439
|
}
|
|
9244
9440
|
static get style() { return sdTdCss; }
|
|
9245
9441
|
static get cmpMeta() { return {
|
|
@@ -9264,7 +9460,7 @@ class SdTh {
|
|
|
9264
9460
|
registerInstance(this, hostRef);
|
|
9265
9461
|
}
|
|
9266
9462
|
render() {
|
|
9267
|
-
return (hAsync(Host, { key: '
|
|
9463
|
+
return (hAsync(Host, { key: 'a9adef2bdfd7dd0a52a55fffb40db6511db5747e', role: "columnheader" }, hAsync("slot", { key: 'd4af30df5d6a4a9140a9d10e0f3948de088f8c18' })));
|
|
9268
9464
|
}
|
|
9269
9465
|
static get style() { return sdThCss; }
|
|
9270
9466
|
static get cmpMeta() { return {
|
|
@@ -9325,20 +9521,20 @@ class SdTooltip {
|
|
|
9325
9521
|
: {
|
|
9326
9522
|
onClick: () => (this.showTooltip = !this.showTooltip),
|
|
9327
9523
|
};
|
|
9328
|
-
return (hAsync(Fragment, { key: '
|
|
9524
|
+
return (hAsync(Fragment, { key: 'ca1fc3ffdb493ee2aeb0ef9ef874a164d50a1d34' }, this.label ? (hAsync("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: this.icon, size: this.buttonSize, color: this.color, variant: this.buttonVariant, class: "sd-tooltip", ...handleTrigger })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-tooltip", ...handleTrigger })), this.showTooltip && (hAsync("sd-tooltip-portal", { key: '840728261961211b5d12e6bf6c97aa044f97f133', parentRef: this.buttonEl, onSdClose: () => this.handleClose(), placement: this.placement }, hAsync("div", { key: '80933fad7b61af35ba41f171848c431ee4b0ff0e', class: {
|
|
9329
9525
|
'sd-tooltip-menu': true,
|
|
9330
9526
|
[`sd-tooltip-menu--${this.type}`]: true,
|
|
9331
9527
|
[`sd-tooltip-menu--${this.placement}`]: true,
|
|
9332
9528
|
'sd-tooltip-menu--with-close': this.useClose,
|
|
9333
9529
|
[`bg-${SdTooltip.COLOR_OF_TYPE[this.type].background}`]: true,
|
|
9334
9530
|
[`text-${SdTooltip.COLOR_OF_TYPE[this.type].text}`]: true,
|
|
9335
|
-
} }, hAsync("i", { key: '
|
|
9531
|
+
} }, hAsync("i", { key: 'c166fc91a2f49840dfea98c4ca1010892e571b48', class: `sd-tooltip-menu__arrow sd-tooltip-menu__arrow--${this.placement}` }, hAsync(TooltipArrow, { key: '58a04b43a4f3333aa9e34d2c1dda7f03e9493e21', class: {
|
|
9336
9532
|
[`text-${SdTooltip.COLOR_OF_TYPE[this.type].background}`]: true,
|
|
9337
|
-
} })), hAsync("div", { key: '
|
|
9533
|
+
} })), hAsync("div", { key: 'd49d44d196c266482974beef4da124f32ec39825', class: "sd-tooltip-menu__content", ref: el => {
|
|
9338
9534
|
if (el && this.slotContent && !el.hasChildNodes()) {
|
|
9339
9535
|
el.appendChild(this.slotContent.cloneNode(true));
|
|
9340
9536
|
}
|
|
9341
|
-
} }, !this.slotContent && hAsync("span", { key: '
|
|
9537
|
+
} }, !this.slotContent && hAsync("span", { key: '5543dd3bc313e033379da9b3e0c4b4f929ec899c' }, this.el.textContent)), this.useClose && (hAsync("div", { key: 'e32069afe16667a1bbfcc2e57ef6f2888fd9a5d6', class: "sd-tooltip-menu__close-button" }, hAsync("button", { key: '913909f8479496c9344df5d64ba3eb9e5a073658', type: "button", "aria-label": "Close tooltip", title: "Close tooltip", onClick: () => this.handleClose() }, hAsync("sd-icon", { key: 'ebde71b66b5b805d8ca99911ecfe9e6319a1f9be', name: "close", size: "12", color: "#AAAAAA" })))))))));
|
|
9342
9538
|
}
|
|
9343
9539
|
static get style() { return sdTooltipCss; }
|
|
9344
9540
|
static get cmpMeta() { return {
|
|
@@ -9514,7 +9710,7 @@ class SdTooltipPortal {
|
|
|
9514
9710
|
this.sdClose.emit();
|
|
9515
9711
|
}
|
|
9516
9712
|
render() {
|
|
9517
|
-
return hAsync("slot", { key: '
|
|
9713
|
+
return hAsync("slot", { key: 'b8652906919bc46c2f36710de6e65b33276bf31a' });
|
|
9518
9714
|
}
|
|
9519
9715
|
static get cmpMeta() { return {
|
|
9520
9716
|
"$flags$": 777,
|
|
@@ -9540,7 +9736,7 @@ class SdTr {
|
|
|
9540
9736
|
registerInstance(this, hostRef);
|
|
9541
9737
|
}
|
|
9542
9738
|
render() {
|
|
9543
|
-
return (hAsync(Host, { key: '
|
|
9739
|
+
return (hAsync(Host, { key: '18a0e95b7264b495bd15aeb7c3a704dac938e140', role: "row" }, hAsync("slot", { key: '83ac4ded200f5e7b18a01d2055859e1093e34d6c' })));
|
|
9544
9740
|
}
|
|
9545
9741
|
static get style() { return sdTrCss; }
|
|
9546
9742
|
static get cmpMeta() { return {
|
|
@@ -9570,6 +9766,7 @@ registerComponents([
|
|
|
9570
9766
|
SdPopover,
|
|
9571
9767
|
SdPortal,
|
|
9572
9768
|
SdProgress,
|
|
9769
|
+
SdRadioGroup,
|
|
9573
9770
|
SdSelect,
|
|
9574
9771
|
SdSelectMultiple,
|
|
9575
9772
|
SdSelectMultipleGroup,
|