@sellmate/design-system 0.0.23 → 0.0.25
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 +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/{esm/color-CgyTlXBV.js → cjs/resolveColor-DxvExwgo.js} +17 -4
- package/dist/cjs/{resolveColor-CauSLF0s.js.map → resolveColor-DxvExwgo.js.map} +1 -1
- package/dist/cjs/sd-badge.cjs.entry.js +2 -3
- 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-pagination.sd-portal.sd-select.sd-select-option.sd-table.sd-tooltip.sd-tooltip-portal.entry.cjs.js.map +1 -0
- package/dist/cjs/{sd-checkbox_9.cjs.entry.js → sd-button_12.cjs.entry.js} +738 -816
- 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-popover.cjs.entry.js +2 -2
- package/dist/cjs/sd-select-multiple-group.cjs.entry.js +380 -0
- package/dist/cjs/sd-select-multiple-group.entry.cjs.js.map +1 -0
- package/dist/cjs/sd-select-multiple.cjs.entry.js +263 -0
- package/dist/cjs/sd-select-multiple.entry.cjs.js.map +1 -0
- package/dist/cjs/sd-select-option-group.cjs.entry.js +69 -0
- package/dist/cjs/sd-select-option-group.entry.cjs.js.map +1 -0
- package/dist/cjs/sd-tag.cjs.entry.js +1 -1
- package/dist/cjs/select-keyboard-navigation-6fO_V4En.js +119 -0
- package/dist/cjs/select-keyboard-navigation-6fO_V4En.js.map +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 +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.css +6 -1
- package/dist/collection/components/sd-guide/sd-guide.js +4 -4
- package/dist/collection/components/sd-guide/sd-guide.js.map +1 -1
- 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-pagination/sd-pagination.js +2 -3
- package/dist/collection/components/sd-pagination/sd-pagination.js.map +1 -1
- package/dist/collection/components/sd-popover/sd-popover.js +2 -2
- package/dist/collection/components/sd-portal/sd-portal.js +25 -4
- package/dist/collection/components/sd-portal/sd-portal.js.map +1 -1
- package/dist/collection/components/sd-select/sd-select-option/sd-select-option.js +1 -1
- package/dist/collection/components/sd-select/sd-select.css +0 -6
- package/dist/collection/components/sd-select-multiple/sd-select-multiple.css +0 -6
- package/dist/collection/components/sd-select-multiple/sd-select-multiple.js +2 -2
- package/dist/collection/components/sd-select-multiple-group/sd-select-multiple-group.css +0 -6
- 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-table.css +7 -1316
- package/dist/collection/components/sd-table/sd-table.js +99 -8
- package/dist/collection/components/sd-table/sd-table.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/{p-QBJzxOWs.js → p-B0qn2Tb-.js} +3 -3
- package/dist/components/{p-QBJzxOWs.js.map → p-B0qn2Tb-.js.map} +1 -1
- package/dist/components/{p-DNUN6dGL.js → p-BHl-WJWF.js} +6 -7
- package/dist/components/p-BHl-WJWF.js.map +1 -0
- package/dist/components/{p-BqIcTSCQ.js → p-BRrY7yTi.js} +3 -3
- package/dist/components/{p-BqIcTSCQ.js.map → p-BRrY7yTi.js.map} +1 -1
- package/dist/components/{p-CbTvFUCY.js → p-B_lWW-k_.js} +27 -6
- package/dist/components/p-B_lWW-k_.js.map +1 -0
- package/dist/components/{p-CZG8wDBH.js → p-CpfDowFL.js} +3 -3
- package/dist/components/{p-CZG8wDBH.js.map → p-CpfDowFL.js.map} +1 -1
- package/dist/components/{p-aU8C4Pcb.js → p-D9gy3nk_.js} +7 -7
- package/dist/components/{p-aU8C4Pcb.js.map → p-D9gy3nk_.js.map} +1 -1
- package/dist/components/p-Dar88QJr.js +323 -0
- package/dist/components/p-Dar88QJr.js.map +1 -0
- package/dist/components/{p-Bl-wgv-z.js → p-Db_plCmk.js} +5 -5
- package/dist/components/{p-Bl-wgv-z.js.map → p-Db_plCmk.js.map} +1 -1
- package/dist/components/{p-nehvpX7w.js → p-DzIffEfK.js} +3 -3
- package/dist/components/{p-nehvpX7w.js.map → p-DzIffEfK.js.map} +1 -1
- package/dist/components/{p-DpiRZxT1.js → p-Ed1-kFCj.js} +5 -5
- package/dist/components/{p-DpiRZxT1.js.map → p-Ed1-kFCj.js.map} +1 -1
- package/dist/components/{p-Cxrr7vOk.js → p-_8cdZlN5.js} +9 -9
- package/dist/components/{p-Cxrr7vOk.js.map → p-_8cdZlN5.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 +8 -8
- package/dist/components/sd-guide.js.map +1 -1
- package/dist/components/sd-icon.js +1 -1
- package/dist/components/sd-input.js +1 -1
- package/dist/components/sd-pagination.js +1 -1
- package/dist/components/sd-popover.js +5 -5
- package/dist/components/sd-portal.js +1 -1
- package/dist/components/sd-select-multiple-group.js +6 -6
- package/dist/components/sd-select-multiple-group.js.map +1 -1
- package/dist/components/sd-select-multiple.js +8 -8
- package/dist/components/sd-select-multiple.js.map +1 -1
- 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 -318
- package/dist/components/sd-select.js.map +1 -1
- package/dist/components/sd-table.js +73 -19
- package/dist/components/sd-table.js.map +1 -1
- package/dist/components/sd-tag.js +1 -1
- package/dist/components/sd-tooltip-portal.js +1 -1
- package/dist/components/sd-tooltip.js +1 -1
- package/dist/design-system/design-system.esm.js +1 -1
- package/dist/design-system/p-33ce46fa.entry.js +2 -0
- package/dist/design-system/p-33ce46fa.entry.js.map +1 -0
- package/dist/design-system/p-52365554.entry.js +2 -0
- package/dist/design-system/{p-2aef624e.entry.js → p-58257c45.entry.js} +2 -2
- package/dist/design-system/p-7a71b770.entry.js +2 -0
- package/dist/design-system/p-7a71b770.entry.js.map +1 -0
- 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-C2JaR3A6.js +2 -0
- package/dist/design-system/p-C2JaR3A6.js.map +1 -0
- package/dist/design-system/p-b6bb891c.entry.js +2 -0
- package/dist/design-system/{p-c4f5ed94.entry.js → p-c96e287b.entry.js} +2 -2
- package/dist/design-system/p-dc35d827.entry.js +2 -0
- package/dist/design-system/p-dc35d827.entry.js.map +1 -0
- package/dist/design-system/p-f00fc7be.entry.js +2 -0
- package/dist/design-system/p-f00fc7be.entry.js.map +1 -0
- package/dist/design-system/{p-b537f724.entry.js → p-fcbeccb8.entry.js} +2 -2
- package/dist/design-system/p-ffe8c43b.entry.js +2 -0
- package/dist/design-system/p-ffe8c43b.entry.js.map +1 -0
- 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-pagination.sd-portal.sd-select.sd-select-option.sd-table.sd-tooltip.sd-tooltip-portal.entry.esm.js.map +1 -0
- package/dist/design-system/sd-select-multiple-group.entry.esm.js.map +1 -0
- package/dist/design-system/sd-select-multiple.entry.esm.js.map +1 -0
- package/dist/design-system/sd-select-option-group.entry.esm.js.map +1 -0
- package/dist/esm/design-system.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/{cjs/color-Oz29vj7L.js → esm/resolveColor-BYf-ybt2.js} +14 -6
- package/dist/esm/{resolveColor-CswQ9y2Q.js.map → resolveColor-BYf-ybt2.js.map} +1 -1
- package/dist/esm/sd-badge.entry.js +2 -3
- package/dist/esm/sd-badge.entry.js.map +1 -1
- package/dist/esm/sd-button.sd-checkbox.sd-guide.sd-icon.sd-input.sd-pagination.sd-portal.sd-select.sd-select-option.sd-table.sd-tooltip.sd-tooltip-portal.entry.js.map +1 -0
- package/dist/esm/{sd-checkbox_9.entry.js → sd-button_12.entry.js} +732 -813
- 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-popover.entry.js +2 -2
- package/dist/esm/sd-select-multiple-group.entry.js +378 -0
- package/dist/esm/sd-select-multiple-group.entry.js.map +1 -0
- package/dist/esm/sd-select-multiple.entry.js +261 -0
- package/dist/esm/sd-select-multiple.entry.js.map +1 -0
- package/dist/esm/sd-select-option-group.entry.js +67 -0
- package/dist/esm/sd-select-option-group.entry.js.map +1 -0
- package/dist/esm/sd-tag.entry.js +1 -1
- package/dist/esm/select-keyboard-navigation-C2JaR3A6.js +116 -0
- package/dist/esm/select-keyboard-navigation-C2JaR3A6.js.map +1 -0
- package/dist/types/components/sd-table/sd-table.d.ts +4 -0
- package/dist/types/components.d.ts +24 -0
- package/hydrate/index.js +98 -47
- package/hydrate/index.mjs +98 -47
- package/package.json +2 -2
- package/dist/cjs/color-Oz29vj7L.js.map +0 -1
- package/dist/cjs/resolveColor-CauSLF0s.js +0 -18
- package/dist/cjs/sd-button.sd-tooltip-portal.entry.cjs.js.map +0 -1
- package/dist/cjs/sd-button_2.cjs.entry.js +0 -221
- package/dist/cjs/sd-checkbox.sd-icon.sd-input.sd-portal.sd-select.sd-select-multiple.sd-select-multiple-group.sd-select-option.sd-select-option-group.entry.cjs.js.map +0 -1
- package/dist/cjs/sd-guide.cjs.entry.js +0 -84
- package/dist/cjs/sd-guide.entry.cjs.js.map +0 -1
- package/dist/cjs/sd-pagination.sd-tooltip.entry.cjs.js.map +0 -1
- package/dist/cjs/sd-pagination_2.cjs.entry.js +0 -168
- package/dist/cjs/sd-table.cjs.entry.js +0 -231
- package/dist/cjs/sd-table.entry.cjs.js.map +0 -1
- package/dist/components/p-CbTvFUCY.js.map +0 -1
- package/dist/components/p-DNUN6dGL.js.map +0 -1
- package/dist/design-system/p-158f9392.entry.js +0 -2
- package/dist/design-system/p-158f9392.entry.js.map +0 -1
- package/dist/design-system/p-37042d15.entry.js +0 -2
- package/dist/design-system/p-37042d15.entry.js.map +0 -1
- package/dist/design-system/p-949de8eb.entry.js +0 -2
- package/dist/design-system/p-949de8eb.entry.js.map +0 -1
- package/dist/design-system/p-9f5eed30.entry.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-abfa217b.entry.js +0 -2
- package/dist/design-system/p-abfa217b.entry.js.map +0 -1
- package/dist/design-system/p-adee3154.entry.js +0 -2
- package/dist/design-system/p-adee3154.entry.js.map +0 -1
- package/dist/design-system/p-bda05b6f.entry.js +0 -2
- package/dist/design-system/p-bda05b6f.entry.js.map +0 -1
- package/dist/design-system/p-f015c024.entry.js +0 -2
- package/dist/design-system/sd-button.sd-tooltip-portal.entry.esm.js.map +0 -1
- package/dist/design-system/sd-checkbox.sd-icon.sd-input.sd-portal.sd-select.sd-select-multiple.sd-select-multiple-group.sd-select-option.sd-select-option-group.entry.esm.js.map +0 -1
- package/dist/design-system/sd-guide.entry.esm.js.map +0 -1
- package/dist/design-system/sd-pagination.sd-tooltip.entry.esm.js.map +0 -1
- package/dist/design-system/sd-table.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-tooltip-portal.entry.js.map +0 -1
- package/dist/esm/sd-button_2.entry.js +0 -218
- package/dist/esm/sd-checkbox.sd-icon.sd-input.sd-portal.sd-select.sd-select-multiple.sd-select-multiple-group.sd-select-option.sd-select-option-group.entry.js.map +0 -1
- package/dist/esm/sd-guide.entry.js +0 -82
- package/dist/esm/sd-guide.entry.js.map +0 -1
- package/dist/esm/sd-pagination.sd-tooltip.entry.js.map +0 -1
- package/dist/esm/sd-pagination_2.entry.js +0 -165
- package/dist/esm/sd-table.entry.js +0 -229
- package/dist/esm/sd-table.entry.js.map +0 -1
- /package/dist/design-system/{p-9f5eed30.entry.js.map → p-52365554.entry.js.map} +0 -0
- /package/dist/design-system/{p-2aef624e.entry.js.map → p-58257c45.entry.js.map} +0 -0
- /package/dist/design-system/{p-f015c024.entry.js.map → p-b6bb891c.entry.js.map} +0 -0
- /package/dist/design-system/{p-c4f5ed94.entry.js.map → p-c96e287b.entry.js.map} +0 -0
- /package/dist/design-system/{p-b537f724.entry.js.map → p-fcbeccb8.entry.js.map} +0 -0
|
@@ -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: 'bb5d75c00c43e981de3df9497d03510baf547b10' }, index.h("div", { key: '7b9724fd95fef0e4c374b6f3d8ba0586abed5045', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.class}` }, index.h("slot", { key: '047683541469ee0490e296813cb7e303127ad200' }))));
|
|
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: 'f445a752123f1a1a7f8d28ca7472a8ffabda9441', class: "sd-date-picker" }, index.h("sd-input", { key: '85662ea61b192562311af23f67c1a1ad05636813', 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: '41634f9170073fbde5e44c55b5985da90763f819', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (index.h("sd-portal", { key: 'ce630583ef81cd72ad1b8fdaab7cab2d1df278cb', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, index.h("div", { key: '55d4c73a3e17991ebf68495d7bed96399857de1e', class: "sd-date-picker__menu" }, index.h("div", { key: '0800e3a37eec27bb8a8c59a2ebd8ffdbf4e813a7', class: "sd-date-picker__header" }, index.h("div", { key: '1518b578ad87a0f5875d980d1c974492f32714e3', class: "year-nav" }, index.h("button", { key: 'e70f1d4e73650c7bccb1629b679ca366717e5506', type: "button", name: "prev-year", title: "Previous Year", onClick: () => this.setCurrentYear(this.currentYear - 1) }, index.h("sd-icon", { key: 'f679a54b76e304d08c132d6784575831a5d5d61b', name: "arrowLeft", size: "12", color: "#CCCCCC" })), index.h("span", { key: '634dcbfe81d328cbc0460958208dc17aaf218158', class: "year-nav__current" }, this.currentYear), index.h("button", { key: '7e7cef51d7b47b7280cfff4234b88394708ea01a', type: "button", name: "next-year", title: "Next Year", onClick: () => this.setCurrentYear(this.currentYear + 1) }, index.h("sd-icon", { key: '8a6fc4a40f567d2d1ffef5dbc08de5148203970c', name: "arrowRight", size: "12", color: "#CCCCCC" }))), index.h("div", { key: '8fad6e92b899a0cb38398ec2f4036b959377d99b', class: "month-nav" }, index.h("button", { key: '3180c35ad42239a6a97480a4db860182b98724f3', type: "button", name: "prev-month", title: "Previous ", onClick: () => this.handleUpdateMonth('prev') }, index.h("sd-icon", { key: '6ccef0b13fde4124e0e14959687f60dab753ae51', name: "arrowLeft", size: "12", color: "#CCCCCC" })), index.h("span", { key: 'db7db67a1a77f02451bc0a7c97e87e3cd6c9d453', class: "month-nav__current" }, this.currentMonth, "\uC6D4"), index.h("button", { key: '5df06269331e9f7ee1cb4801bfd713d433f00af4', type: "button", name: "next-month", title: "Next Month", onClick: () => this.handleUpdateMonth('next') }, index.h("sd-icon", { key: '65b0f49b205e9aa38a46cbe672665b31c9ffe542', name: "arrowRight", size: "12", color: "#CCCCCC" })))), index.h("div", { key: '68f3c05f2ffb57b7fc032209dd709e5eaa6fcbdd', class: "sd-date-picker__days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (index.h("div", { key: day, class: "day" }, day)))), index.h("div", { key: '452c22746ace6b3923acf4912edba2509a56b369', 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: '3d95128a2a654e38ceae60e6b89482a454488286', class: "sd-date-range-picker" }, index.h("sd-input", { key: '4f170abfe6214ffa1044020b2cd59a9219f3ef09', 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: '7c12c7e3331638f333efdea4bcd3d452eb032561', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (index.h("sd-portal", { key: '7312ab4a79877de6d6be3edaa404e0b9c52e28d8', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, index.h("div", { key: '20a485d128de2b2d0a8043cb5fe0de990364bbd8', class: "sd-date-range-picker__menu" }, index.h("div", { key: '19a0489246b5dccc183f3d3a040086a6a2c565f3', class: "sd-date-range-picker__header mb-16pxr flex flex-nowrap items-center justify-center" }, index.h("button", { key: '1f9c5f1188234e2306c033e8e67f9a106b3b39bc', type: "button", name: "prev", title: "Previous", onClick: () => this.setPrevYear(this.prevYear - 1) }, index.h("sd-icon", { key: '52805839d2092886fe4f07c9f95a2e948b00c917', name: "arrowLeft", size: "12", color: "#CCCCCC" })), index.h("div", { key: 'e9f323504223ccfbc4b5703346a310e58d1621c3', class: "header-label" }, this.prevYear), index.h("button", { key: '810c6fb9eaa16291550455ac1099c15da7b80ed6', type: "button", name: "next", title: "Next", onClick: () => this.setPrevYear(this.prevYear + 1) }, index.h("sd-icon", { key: '44cf361ed854292f90c954522c356e17d5a45d29', name: "arrowRight", size: "12", color: "#CCCCCC" }))), index.h("div", { key: '4cc859482a2c010261b64b8ce15f5c754a2234fd', 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 ===
|
|
@@ -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: 'fb877e8d016d13fb33b49a1a4dbfed9fc01b1336' }, 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: '02208721da61cb84086a57c823f8e31775fdbd5e', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement }, index.h("div", { key: '3f3c4fc690dac5061bda08af37121e2b98374979', 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: '6f0df95bafc2cbf564fd0e5a133c89f03c3a924b', class: `sd-popover-menu__arrow sd-popover-menu__arrow--${this.placement}` }, index.h(tooltipArrow.TooltipArrow, { key: '535acee0be86db4ed58d6cc1631732541f1e475e' })), index.h("div", { key: 'd4366800a8cbd5a1f9630344a5ca4241b0eaa8dd', class: "sd-popover-menu__content" }, this.menuTitle && index.h("div", { key: '1cd9de3129988c5d26be0ded5b03520ab591cb9a', class: "sd-popover-menu__title" }, this.menuTitle), this.messages.length > 0 && (index.h("div", { key: '5aae57948bd5e0fd98e73a8ae504b77ce6cdbe07', class: "sd-popover-menu__messages" }, this.messages.map(message => (index.h("div", null, message))))), this.buttons.length > 0 && (index.h("div", { key: '814ac9ba0b2cf4367bb4cd5e688fa5433fee7126', 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: 'a21ad0a5e28f8609b2f9d9accd0be5d81ed9de5b', class: "sd-popover-menu__close-button", onClick: () => this.handleClose() }, index.h("sd-icon", { key: '10738ec0926ea5fbc0b30b5c8c08b6cc37bf47d3', name: "close", size: "12", color: "#AAAAAA" }))))))));
|
|
47
47
|
}
|
|
48
48
|
static get watchers() { return {
|
|
49
49
|
"show": ["watchShowHandler"]
|
|
@@ -0,0 +1,380 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var index = require('./index-BjPOPvqs.js');
|
|
4
|
+
var selectKeyboardNavigation = require('./select-keyboard-navigation-6fO_V4En.js');
|
|
5
|
+
|
|
6
|
+
const sdSelectMultipleGroupCss = ".sd-select-multiple-group__dropdown{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-select-multiple-group__dropdown::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-select-multiple-group__dropdown::-webkit-scrollbar:horizontal{height:8px}.sd-select-multiple-group__dropdown::-webkit-scrollbar:vertical{width:8px}.sd-select-multiple-group__dropdown::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-select-multiple-group__dropdown::-webkit-scrollbar-track{background-color:transparent}sd-select-multiple-group{display:inline-block;height:fit-content}sd-select-multiple-group .sd-select-multiple-group{display:flex;flex-wrap:nowrap;width:var(--select-width, 200px);cursor:pointer;user-select:none;border:1px solid #aaaaaa;border-radius:4px;background-color:white;color:#333333}sd-select-multiple-group .sd-select-multiple-group:hover:not(.sd-select-multiple-group--disabled){background:#f6f6f6}sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled{cursor:not-allowed;background-color:#eeeeee;border-color:#cccccc}sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__label{border-right:1px solid #cccccc}sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger{color:#888888}sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger:focus,sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger:focus-visible,sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger:focus-within{outline:none !important}sd-select-multiple-group .sd-select-multiple-group__label{font-size:12px;font-weight:500;color:#333333;padding:4px 12px;border-right:1px solid #cccccc;border-radius:4px 0 0 4px;background-color:#f6f6f6}sd-select-multiple-group .sd-select-multiple-group__container{position:relative;width:100%;display:flex}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__trigger{padding:4px 20px 4px 12px;display:flex;width:100%;align-items:center}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__trigger .sd-select-multiple-group__value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:20px;font-size:12px;font-weight:400}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__trigger .sd-select-multiple-group__clear{margin:0 4px;width:8px;height:8px;background-color:transparent;outline:none;border:none}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__arrow{position:absolute;top:8px;right:8px;width:12px;height:12px;color:#888888;transition:transform 0.3s ease}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__arrow--open{transform:rotate(180deg)}.sd-select-multiple-group__dropdown{width:var(--select-width, 200px);max-height:var(--select-dropdown-height, 260px);padding-bottom:2px;background-color:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);border-radius:4px;overflow-y:auto;color:#333333}.sd-select-multiple-group__dropdown .sd-select-multiple-group__search-container{position:sticky;top:0;display:flex;width:100%;background-color:white;align-items:center;padding:4px 8px}.sd-select-multiple-group__dropdown .sd-select-multiple-group__search-container sd-input{width:100%}.sd-select-multiple-group__dropdown .sd-select-multiple-group__search-container--scrolled{box-shadow:2px 2px 8px 2px rgba(0, 0, 0, 0.2)}.sd-select-multiple-group__dropdown .sd-select-multiple-group__option-placeholder{padding:4px 12px;font-size:12px;line-height:20px}";
|
|
7
|
+
|
|
8
|
+
const SdSelectMultipleGroup = class extends selectKeyboardNavigation.BaseDropdownEvent {
|
|
9
|
+
constructor(hostRef) {
|
|
10
|
+
super();
|
|
11
|
+
index.registerInstance(this, hostRef);
|
|
12
|
+
this.sdChange = index.createEvent(this, "sdChange");
|
|
13
|
+
this.dropDownShow = index.createEvent(this, "dropDownShow");
|
|
14
|
+
}
|
|
15
|
+
get el() { return index.getElement(this); }
|
|
16
|
+
// props
|
|
17
|
+
value = null;
|
|
18
|
+
label = '';
|
|
19
|
+
options = [];
|
|
20
|
+
placeholder = '선택';
|
|
21
|
+
optionPlaceholder = '옵션이 없습니다.';
|
|
22
|
+
width = '200px';
|
|
23
|
+
dropdownHeight = '260px';
|
|
24
|
+
disabled = false;
|
|
25
|
+
clearable = false;
|
|
26
|
+
searchable = false;
|
|
27
|
+
useCheckbox = false;
|
|
28
|
+
// props - custom styles
|
|
29
|
+
containerStyle = {};
|
|
30
|
+
triggerStyle = {};
|
|
31
|
+
dropdownStyle = {};
|
|
32
|
+
optionStyle = {};
|
|
33
|
+
labelStyle = {};
|
|
34
|
+
// props - custom slots
|
|
35
|
+
optionRenderer;
|
|
36
|
+
// states
|
|
37
|
+
filteredOptions = this.options;
|
|
38
|
+
isOpen = false;
|
|
39
|
+
searchText = null;
|
|
40
|
+
itemIndex = -1;
|
|
41
|
+
isScrolled = false;
|
|
42
|
+
// events
|
|
43
|
+
sdChange;
|
|
44
|
+
dropDownShow;
|
|
45
|
+
selectRef;
|
|
46
|
+
searchRef;
|
|
47
|
+
optionRef;
|
|
48
|
+
dropdownRef;
|
|
49
|
+
valueChanged() {
|
|
50
|
+
this.sdChange?.emit(this.value);
|
|
51
|
+
}
|
|
52
|
+
optionsChanged() {
|
|
53
|
+
this.filteredOptions = this.options;
|
|
54
|
+
this.filterOptions();
|
|
55
|
+
}
|
|
56
|
+
searchTextChanged() {
|
|
57
|
+
this.filterOptions();
|
|
58
|
+
}
|
|
59
|
+
async itemIndexChanged(newIndex, oldIndex) {
|
|
60
|
+
if (this.searchable) {
|
|
61
|
+
const searchInput = await this.getNativeInputElement();
|
|
62
|
+
if (this.itemIndex === -1) {
|
|
63
|
+
searchInput?.focus();
|
|
64
|
+
return;
|
|
65
|
+
}
|
|
66
|
+
else if (searchInput?.matches(':focus')) {
|
|
67
|
+
searchInput?.blur();
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
const optionElements = Array.from(this.dropdownRef?.querySelectorAll('.sd-select-multiple-group__dropdown sd-select-option-group') || []);
|
|
71
|
+
const currentItem = optionElements?.[this.itemIndex];
|
|
72
|
+
if (!currentItem || !this.isOpen)
|
|
73
|
+
return;
|
|
74
|
+
this.optionRef = currentItem;
|
|
75
|
+
const isOptionDisabled = await this.optionRef.isDisabled();
|
|
76
|
+
if (isOptionDisabled) {
|
|
77
|
+
newIndex > oldIndex ? this.itemIndex++ : this.itemIndex--;
|
|
78
|
+
return;
|
|
79
|
+
}
|
|
80
|
+
this.scrollToOption(currentItem);
|
|
81
|
+
}
|
|
82
|
+
async isOpenChanged() {
|
|
83
|
+
// Base class의 이벤트 관리 호출 - 다른 select와의 이벤트 충돌 방지
|
|
84
|
+
this.onDropdownToggle(this.isOpen);
|
|
85
|
+
const selectedOption = this.getSelectedOption();
|
|
86
|
+
if (!selectedOption) {
|
|
87
|
+
this.itemIndex = -1;
|
|
88
|
+
}
|
|
89
|
+
else {
|
|
90
|
+
this.itemIndex = this.options.indexOf(selectedOption[0]);
|
|
91
|
+
}
|
|
92
|
+
this.dropDownShow?.emit({ isOpen: this.isOpen });
|
|
93
|
+
if (this.isOpen === false)
|
|
94
|
+
return;
|
|
95
|
+
await new Promise(resolve => setTimeout(resolve, 10));
|
|
96
|
+
const optionElements = Array.from(this.dropdownRef?.querySelectorAll('.sd-select-multiple__dropdown sd-select-item') || []);
|
|
97
|
+
const currentItem = optionElements?.[this.itemIndex];
|
|
98
|
+
// 드롭다운이 열릴 때 검색 입력에 포커스
|
|
99
|
+
if (this.searchable) {
|
|
100
|
+
const searchInput = await this.getNativeInputElement();
|
|
101
|
+
searchInput?.focus();
|
|
102
|
+
}
|
|
103
|
+
if (!currentItem)
|
|
104
|
+
return;
|
|
105
|
+
await new Promise(resolve => setTimeout(resolve, 10)); // 추가 딜레이
|
|
106
|
+
this.scrollToOption(currentItem);
|
|
107
|
+
}
|
|
108
|
+
componentWillLoad() {
|
|
109
|
+
// props가 모두 설정된 후에 실행되므로 올바른 options 값을 가져올 수 있음
|
|
110
|
+
this.filteredOptions = this.options;
|
|
111
|
+
this.initializeEvent(); // global dropdown Manager에 등록 + 이벤트 핸들러 초기화
|
|
112
|
+
}
|
|
113
|
+
disconnectedCallback() {
|
|
114
|
+
this.cleanupEvent(); // global dropdown Manager에서 제거 + 이벤트 정리
|
|
115
|
+
}
|
|
116
|
+
handleDocumentClick(event) {
|
|
117
|
+
if (!this.selectRef?.contains(event.target)) {
|
|
118
|
+
this.isOpen = false;
|
|
119
|
+
}
|
|
120
|
+
}
|
|
121
|
+
handleDocumentKeydown(keyboardEvent) {
|
|
122
|
+
keyboardEvent.stopPropagation();
|
|
123
|
+
const targetKey = ['ArrowDown', 'ArrowUp', 'Enter', 'Escape'];
|
|
124
|
+
if (!targetKey.includes(keyboardEvent.key))
|
|
125
|
+
return;
|
|
126
|
+
keyboardEvent.preventDefault();
|
|
127
|
+
switch (keyboardEvent.key) {
|
|
128
|
+
case 'ArrowDown':
|
|
129
|
+
case 'ArrowUp':
|
|
130
|
+
const keyboardNavigation = new selectKeyboardNavigation.SelectKeyboardNavigation(this.searchable, this.filteredOptions);
|
|
131
|
+
const nextIndex = keyboardNavigation.getNextIndex(this.itemIndex, keyboardEvent.key);
|
|
132
|
+
this.itemIndex = nextIndex;
|
|
133
|
+
break;
|
|
134
|
+
case 'Enter':
|
|
135
|
+
const selectedOption = this.filteredOptions[this.itemIndex];
|
|
136
|
+
if (selectedOption && !selectedOption.disabled) {
|
|
137
|
+
this.handleOptionSelection(selectedOption);
|
|
138
|
+
}
|
|
139
|
+
break;
|
|
140
|
+
case 'Escape':
|
|
141
|
+
this.isOpen = false;
|
|
142
|
+
break;
|
|
143
|
+
}
|
|
144
|
+
}
|
|
145
|
+
// event handlers
|
|
146
|
+
handleTriggerClick = (event) => {
|
|
147
|
+
event.stopPropagation();
|
|
148
|
+
if (!this.disabled) {
|
|
149
|
+
this.isOpen = !this.isOpen;
|
|
150
|
+
this.dropDownShow?.emit({ isOpen: this.isOpen });
|
|
151
|
+
}
|
|
152
|
+
};
|
|
153
|
+
handleOptionClick = (detail) => {
|
|
154
|
+
const { option, event } = detail;
|
|
155
|
+
event.stopPropagation();
|
|
156
|
+
if (option.type === 'group')
|
|
157
|
+
this.handleGroupOptionClick(detail);
|
|
158
|
+
if (option.type === 'subgroup')
|
|
159
|
+
this.handleSubGroupOptionClick(detail);
|
|
160
|
+
if (option.type === 'item')
|
|
161
|
+
this.handleOptionSelection(option);
|
|
162
|
+
};
|
|
163
|
+
handleGroupOptionClick = (detail) => {
|
|
164
|
+
const { option, isSelected } = detail;
|
|
165
|
+
const childOptions = this.filteredOptions.filter(opt => opt.parent === option.value && !opt.disabled);
|
|
166
|
+
childOptions.forEach(subgroup => {
|
|
167
|
+
this.handleSubGroupOptionClick({
|
|
168
|
+
option: subgroup,
|
|
169
|
+
isSelected: isSelected || isSelected === null,
|
|
170
|
+
});
|
|
171
|
+
});
|
|
172
|
+
};
|
|
173
|
+
handleSubGroupOptionClick = (detail) => {
|
|
174
|
+
const { option, isSelected } = detail;
|
|
175
|
+
const childOptions = this.filteredOptions.filter(opt => opt.parent === option.value && !opt.disabled);
|
|
176
|
+
if (isSelected || isSelected === null) {
|
|
177
|
+
// 모든 자식 옵션이 선택된 경우, 모두 선택 해제
|
|
178
|
+
this.value =
|
|
179
|
+
this.value?.filter(selected => !childOptions.some(child => child.value === selected.value)) ||
|
|
180
|
+
null;
|
|
181
|
+
}
|
|
182
|
+
else {
|
|
183
|
+
// 일부 또는 전체 자식 옵션이 선택되지 않은 경우, 모두 선택
|
|
184
|
+
const newSelections = childOptions.filter(child => !this.value?.some(selected => selected.value === child.value));
|
|
185
|
+
this.value = [...(this.value || []), ...newSelections];
|
|
186
|
+
}
|
|
187
|
+
};
|
|
188
|
+
filterOptions() {
|
|
189
|
+
if (!this.searchText || this.searchText.trim() === '') {
|
|
190
|
+
// 검색어가 없으면 전체 옵션 표시
|
|
191
|
+
this.filteredOptions = this.options;
|
|
192
|
+
return;
|
|
193
|
+
}
|
|
194
|
+
const searchTerm = this.searchText.toLowerCase();
|
|
195
|
+
const matchedOptions = new Set();
|
|
196
|
+
// 1. 직접 매칭되는 옵션들 찾기
|
|
197
|
+
this.options.forEach(option => {
|
|
198
|
+
if (option.label.toLowerCase().includes(searchTerm)) {
|
|
199
|
+
matchedOptions.add(option);
|
|
200
|
+
// 매칭된 옵션의 상위 그룹들도 포함
|
|
201
|
+
this.addParentGroups(option, matchedOptions);
|
|
202
|
+
}
|
|
203
|
+
});
|
|
204
|
+
// 2. Set을 배열로 변환하고 원본 순서 유지
|
|
205
|
+
this.filteredOptions = this.options.filter(option => matchedOptions.has(option));
|
|
206
|
+
}
|
|
207
|
+
addParentGroups(option, matchedSet) {
|
|
208
|
+
if (!option.parent)
|
|
209
|
+
return;
|
|
210
|
+
const parentOption = this.options.find(opt => opt.value === option.parent);
|
|
211
|
+
if (parentOption && !matchedSet.has(parentOption)) {
|
|
212
|
+
matchedSet.add(parentOption);
|
|
213
|
+
// 재귀적으로 상위 그룹들도 추가
|
|
214
|
+
this.addParentGroups(parentOption, matchedSet);
|
|
215
|
+
}
|
|
216
|
+
}
|
|
217
|
+
getSelectedOption() {
|
|
218
|
+
return this.options.filter(option => this.value?.includes(option));
|
|
219
|
+
}
|
|
220
|
+
handleDropdownScroll = (event) => {
|
|
221
|
+
const target = event.target;
|
|
222
|
+
const scrollTop = target.scrollTop;
|
|
223
|
+
// 스크롤이 조금이라도 되면 그림자 표시
|
|
224
|
+
this.isScrolled = scrollTop > 0;
|
|
225
|
+
};
|
|
226
|
+
async getNativeInputElement() {
|
|
227
|
+
if (this.searchRef) {
|
|
228
|
+
return this.searchRef.getNativeElement();
|
|
229
|
+
}
|
|
230
|
+
return null;
|
|
231
|
+
}
|
|
232
|
+
handleOptionSelection = (option) => {
|
|
233
|
+
if (!option || option.disabled)
|
|
234
|
+
return;
|
|
235
|
+
const isAlreadySelected = this.value?.some(opt => opt.value === option.value);
|
|
236
|
+
if (isAlreadySelected) {
|
|
237
|
+
// 이미 선택된 옵션인 경우, 선택 해제
|
|
238
|
+
this.value = this.value?.filter(opt => opt.value !== option.value) || null;
|
|
239
|
+
}
|
|
240
|
+
else {
|
|
241
|
+
// 새로운 옵션 선택
|
|
242
|
+
this.value = [...(this.value || []), option];
|
|
243
|
+
}
|
|
244
|
+
};
|
|
245
|
+
getAllItemsUnderOption(parentOption) {
|
|
246
|
+
const childOptions = this.filteredOptions.filter(option => option.parent === parentOption.value && !option.disabled);
|
|
247
|
+
if (parentOption.type === 'group') {
|
|
248
|
+
// Group - 모든 하위 item들을 수집
|
|
249
|
+
const subgroupOptions = childOptions.filter(option => option.type === 'subgroup');
|
|
250
|
+
const allItemsUnderGroup = [];
|
|
251
|
+
// subgroup 하위의 모든 item
|
|
252
|
+
subgroupOptions.forEach(subgroup => {
|
|
253
|
+
const itemsUnderSubgroup = this.filteredOptions.filter(option => option.parent === subgroup.value && option.type === 'item' && !option.disabled);
|
|
254
|
+
allItemsUnderGroup.push(...itemsUnderSubgroup);
|
|
255
|
+
});
|
|
256
|
+
// Group 바로 하위 item
|
|
257
|
+
const directItems = childOptions.filter(option => option.type === 'item');
|
|
258
|
+
allItemsUnderGroup.push(...directItems);
|
|
259
|
+
return allItemsUnderGroup;
|
|
260
|
+
}
|
|
261
|
+
return childOptions.filter(option => option.type === 'item');
|
|
262
|
+
}
|
|
263
|
+
isAllChildrenSelected(groupOption) {
|
|
264
|
+
const allItems = this.getAllItemsUnderOption(groupOption);
|
|
265
|
+
if (allItems.length === 0)
|
|
266
|
+
return false;
|
|
267
|
+
const selectedItems = allItems.filter(item => this.value?.some(selected => selected.value === item.value));
|
|
268
|
+
if (selectedItems.length === allItems.length)
|
|
269
|
+
return true;
|
|
270
|
+
if (selectedItems.length > 0)
|
|
271
|
+
return null;
|
|
272
|
+
return false;
|
|
273
|
+
}
|
|
274
|
+
getChildrenOptions(parentOption) {
|
|
275
|
+
if (parentOption.type === 'group') {
|
|
276
|
+
const allItems = this.getAllItemsUnderOption(parentOption);
|
|
277
|
+
const selectedItems = allItems.filter(item => this.value?.some(selected => selected.value === item.value));
|
|
278
|
+
return {
|
|
279
|
+
selectedCount: selectedItems.length,
|
|
280
|
+
totalCount: allItems.length,
|
|
281
|
+
};
|
|
282
|
+
}
|
|
283
|
+
// Subgroup의 경우
|
|
284
|
+
const children = this.filteredOptions.filter(option => option.parent === parentOption.value);
|
|
285
|
+
return {
|
|
286
|
+
selectedCount: children.filter(child => this.value?.some(val => val.value === child.value))
|
|
287
|
+
.length,
|
|
288
|
+
totalCount: children.length,
|
|
289
|
+
};
|
|
290
|
+
}
|
|
291
|
+
closeDropdown() {
|
|
292
|
+
this.isOpen = false;
|
|
293
|
+
}
|
|
294
|
+
scrollToOption(optionElement) {
|
|
295
|
+
if (!this.dropdownRef || !optionElement)
|
|
296
|
+
return;
|
|
297
|
+
const dropdown = this.dropdownRef;
|
|
298
|
+
const optionTop = optionElement.offsetTop;
|
|
299
|
+
const optionHeight = optionElement.offsetHeight;
|
|
300
|
+
const dropdownScrollTop = dropdown.scrollTop;
|
|
301
|
+
const dropdownHeight = dropdown.clientHeight;
|
|
302
|
+
const searchContainer = dropdown.querySelector('.sd-select__search-container');
|
|
303
|
+
const searchOffset = searchContainer ? searchContainer.offsetHeight : 0;
|
|
304
|
+
const visibleTop = dropdownScrollTop + searchOffset;
|
|
305
|
+
const visibleBottom = dropdownScrollTop + dropdownHeight;
|
|
306
|
+
if (optionTop < visibleTop) {
|
|
307
|
+
dropdown.scrollTop = optionTop - searchOffset;
|
|
308
|
+
}
|
|
309
|
+
else if (optionTop + optionHeight > visibleBottom) {
|
|
310
|
+
dropdown.scrollTop = optionTop + optionHeight - dropdownHeight + searchOffset;
|
|
311
|
+
}
|
|
312
|
+
}
|
|
313
|
+
render() {
|
|
314
|
+
const style = {
|
|
315
|
+
'--select-width': this.width || '200px',
|
|
316
|
+
'--select-dropdown-height': this.dropdownHeight || '260px',
|
|
317
|
+
};
|
|
318
|
+
return (index.h(index.Host, { key: 'bb06ec5405f0d97d3f970c49370249f7a05e1996', style: style }, index.h("div", { key: '325998f7e153d28ecce995f836d4192dc4adfe65', class: {
|
|
319
|
+
'sd-select-multiple-group': true,
|
|
320
|
+
'sd-select-multiple-group--open': this.isOpen,
|
|
321
|
+
'sd-select-multiple-group--disabled': this.disabled,
|
|
322
|
+
}, style: this.containerStyle, ref: el => (this.selectRef = el) }, this.renderLabel(this.label, this.labelStyle), index.h("div", { key: 'c228f012628ffb7dd4346789c356eff8f256c2da', class: "sd-select-multiple-group__container" }, this.renderTrigger(), this.renderDropdown()))));
|
|
323
|
+
}
|
|
324
|
+
renderLabel(label, labelStyle) {
|
|
325
|
+
if (!label)
|
|
326
|
+
return null;
|
|
327
|
+
return (index.h("label", { class: "sd-select-multiple-group__label", style: labelStyle }, label));
|
|
328
|
+
}
|
|
329
|
+
renderTrigger() {
|
|
330
|
+
const selectedOption = this.getSelectedOption();
|
|
331
|
+
return (index.h("div", { class: "sd-select-multiple-group__trigger", tabindex: this.disabled ? -1 : 0, onClick: this.handleTriggerClick, style: this.triggerStyle }, index.h("span", { class: "sd-select-multiple-group__value" }, !selectedOption
|
|
332
|
+
? '선택'
|
|
333
|
+
: selectedOption.length
|
|
334
|
+
? selectedOption.map(option => option.label).join(', ')
|
|
335
|
+
: this.placeholder), this.clearable && selectedOption?.length > 0 && !this.disabled && (index.h("sd-icon", { key: "close-icon", name: "close", size: 10, color: "#888", class: "sd-select-multiple-group__clear", onClick: event => {
|
|
336
|
+
event.stopPropagation();
|
|
337
|
+
this.value = null;
|
|
338
|
+
} })), index.h("sd-icon", { key: "arrow-icon", name: "arrowDown", color: "#888", class: {
|
|
339
|
+
'sd-select-multiple-group__arrow': true,
|
|
340
|
+
'sd-select-multiple-group__arrow--open': this.isOpen,
|
|
341
|
+
} })));
|
|
342
|
+
}
|
|
343
|
+
renderDropdown() {
|
|
344
|
+
const style = {
|
|
345
|
+
'--select-width': this.width || '200px',
|
|
346
|
+
'--select-dropdown-height': this.dropdownHeight || '260px',
|
|
347
|
+
};
|
|
348
|
+
if (this.isOpen === false)
|
|
349
|
+
return null;
|
|
350
|
+
return (index.h("sd-portal", { open: this.isOpen, parentRef: this.selectRef, onSdClose: this.closeDropdown }, index.h("div", { class: "sd-select-multiple-group__dropdown", style: { ...style, ...this.dropdownStyle }, onScroll: this.handleDropdownScroll, ref: el => (this.dropdownRef = el) }, this.searchable && (index.h("div", { class: {
|
|
351
|
+
'sd-select-multiple-group__search-container': true,
|
|
352
|
+
'sd-select-multiple-group__search-container--scrolled': this.isScrolled,
|
|
353
|
+
}, onClick: event => event.stopPropagation() }, index.h("sd-input", { ref: el => (this.searchRef = el), value: this.searchText, placeholder: "\uAC80\uC0C9", clearable: true, inputStyle: { 'padding-left': '8px' }, autofocus: true, onSdInput: event => {
|
|
354
|
+
this.searchText = String(event?.detail);
|
|
355
|
+
}, onSdFocus: () => {
|
|
356
|
+
this.itemIndex = -1;
|
|
357
|
+
}, onKeyDown: e => {
|
|
358
|
+
if (e.code === 'Enter')
|
|
359
|
+
e.stopPropagation();
|
|
360
|
+
} }, index.h("sd-icon", { name: "search", size: 16, color: "#737373", slot: "prefix" })))), this.filteredOptions.length > 0 ? (this.filteredOptions.map((option, index$1) => (index.h("slot", { name: `option-${option.value}` }, index.h("sd-select-option-group", { option: option, index: index$1, isSelected: option.type === 'item'
|
|
361
|
+
? this.value?.some(selected => selected.value === option.value)
|
|
362
|
+
: this.isAllChildrenSelected(option), isFocused: index$1 === this.itemIndex, optionStyle: this.optionStyle, onOptionClick: ({ detail, }) => {
|
|
363
|
+
if (option.type !== 'item' && !this.useCheckbox) {
|
|
364
|
+
return;
|
|
365
|
+
}
|
|
366
|
+
this.handleOptionClick(detail);
|
|
367
|
+
}, useCheckbox: this.useCheckbox, ...(option.type !== 'item' && { countInfo: this.getChildrenOptions(option) }) }))))) : (index.h("slot", { name: "option-placeholder" }, index.h("div", { class: 'sd-select-multiple-group__option-placeholder', style: this.optionStyle }, this.optionPlaceholder))))));
|
|
368
|
+
}
|
|
369
|
+
static get watchers() { return {
|
|
370
|
+
"value": ["valueChanged"],
|
|
371
|
+
"options": ["optionsChanged"],
|
|
372
|
+
"searchText": ["searchTextChanged"],
|
|
373
|
+
"itemIndex": ["itemIndexChanged"],
|
|
374
|
+
"isOpen": ["isOpenChanged"]
|
|
375
|
+
}; }
|
|
376
|
+
};
|
|
377
|
+
SdSelectMultipleGroup.style = sdSelectMultipleGroupCss;
|
|
378
|
+
|
|
379
|
+
exports.sd_select_multiple_group = SdSelectMultipleGroup;
|
|
380
|
+
//# sourceMappingURL=sd-select-multiple-group.entry.cjs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sd-select-multiple-group.entry.cjs.js","sources":["src/components/sd-select-multiple-group/sd-select-multiple-group.scss?tag=sd-select-multiple-group","src/components/sd-select-multiple-group/sd-select-multiple-group.tsx"],"sourcesContent":["@import 'variables';\r\n@import 'extend';\r\n\r\nsd-select-multiple-group {\r\n display: inline-block;\r\n height: fit-content;\r\n .sd-select-multiple-group {\r\n display: flex;\r\n flex-wrap: nowrap;\r\n width: var(--select-width, 200px);\r\n cursor: pointer;\r\n user-select: none;\r\n border: 1px solid $grey_55;\r\n border-radius: 4px;\r\n background-color: white;\r\n color: $grey_90;\r\n\r\n &:hover:not(.sd-select-multiple-group--disabled) {\r\n background: $grey_10;\r\n }\r\n\r\n &.sd-select-multiple-group--disabled {\r\n cursor: not-allowed;\r\n background-color: $grey_20;\r\n border-color: $grey_45;\r\n\r\n .sd-select-multiple-group__label {\r\n border-right: 1px solid $grey_45;\r\n }\r\n\r\n .sd-select-multiple-group__trigger {\r\n color: $grey_65;\r\n &:focus,\r\n &:focus-visible,\r\n &:focus-within {\r\n outline: none !important;\r\n }\r\n }\r\n }\r\n\r\n &__label {\r\n font-size: 12px;\r\n font-weight: 500;\r\n color: $grey_90;\r\n padding: 4px 12px;\r\n border-right: 1px solid $grey_45;\r\n border-radius: 4px 0 0 4px;\r\n background-color: $grey_10;\r\n }\r\n\r\n &__container {\r\n position: relative;\r\n width: 100%;\r\n display: flex;\r\n\r\n .sd-select-multiple-group__trigger {\r\n padding: 4px 20px 4px 12px;\r\n display: flex;\r\n width: 100%;\r\n align-items: center;\r\n\r\n .sd-select-multiple-group__value {\r\n flex: 1;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n line-height: 20px;\r\n font-size: 12px;\r\n font-weight: 400;\r\n }\r\n\r\n .sd-select-multiple-group__clear {\r\n margin: 0 4px;\r\n width: 8px;\r\n height: 8px;\r\n background-color: transparent;\r\n outline: none;\r\n border: none;\r\n }\r\n }\r\n\r\n .sd-select-multiple-group__arrow {\r\n position: absolute;\r\n top: 8px;\r\n right: 8px;\r\n width: 12px;\r\n height: 12px;\r\n color: $grey_65;\r\n transition: transform 0.3s ease;\r\n\r\n &--open {\r\n transform: rotate(180deg);\r\n }\r\n }\r\n }\r\n }\r\n}\r\n\r\n.sd-select-multiple-group__dropdown {\r\n @extend %scrollBar;\r\n width: var(--select-width, 200px);\r\n max-height: var(--select-dropdown-height, 260px);\r\n padding-bottom: 2px;\r\n background-color: white;\r\n box-shadow: 2px 2px 12px 2px rgba(0, 0, 0, 0.1);\r\n border-radius: 4px;\r\n overflow-y: auto;\r\n color: $grey_90;\r\n\r\n .sd-select-multiple-group__search-container {\r\n position: sticky;\r\n top: 0;\r\n display: flex;\r\n width: 100%;\r\n background-color: white;\r\n align-items: center;\r\n padding: 4px 8px;\r\n\r\n sd-input {\r\n width: 100%;\r\n }\r\n\r\n &--scrolled {\r\n box-shadow: 2px 2px 8px 2px rgba(0, 0, 0, 0.2);\r\n }\r\n }\r\n\r\n .sd-select-multiple-group__option-placeholder {\r\n padding: 4px 12px;\r\n font-size: 12px;\r\n line-height: 20px;\r\n }\r\n}\r\n","import {\r\n Component,\r\n Element,\r\n Event,\r\n EventEmitter,\r\n Host,\r\n Prop,\r\n State,\r\n Watch,\r\n h,\r\n} from '@stencil/core';\r\nimport { BaseDropdownEvent } from '../../utils/base-dropdown-event';\r\nimport { SelectMultipleEvents, SelectOption, SelectStyleProps } from '../sd-select/sd-select';\r\nimport { SelectKeyboardNavigation } from '../../utils/select-keyboard-navigation';\r\n\r\nexport interface SelectOptionGroup extends SelectOption {\r\n type: 'group' | 'subgroup' | 'item';\r\n parent?: string;\r\n}\r\n\r\n@Component({\r\n tag: 'sd-select-multiple-group',\r\n styleUrl: 'sd-select-multiple-group.scss',\r\n})\r\nexport class SdSelectMultipleGroup extends BaseDropdownEvent {\r\n @Element() el!: HTMLElement;\r\n\r\n // props\r\n @Prop({ mutable: true }) value: SelectOptionGroup[] | null = null;\r\n @Prop() label: string = '';\r\n @Prop({ mutable: true }) options: SelectOptionGroup[] = [];\r\n @Prop() placeholder: string = '선택';\r\n @Prop() optionPlaceholder: string = '옵션이 없습니다.';\r\n @Prop() width: string = '200px';\r\n @Prop() dropdownHeight: string = '260px';\r\n @Prop() disabled: boolean = false;\r\n @Prop() clearable: boolean = false;\r\n @Prop() searchable: boolean = false;\r\n @Prop() useCheckbox: boolean = false;\r\n\r\n // props - custom styles\r\n @Prop() containerStyle: SelectStyleProps['containerStyle'] = {};\r\n @Prop() triggerStyle: SelectStyleProps['triggerStyle'] = {};\r\n @Prop() dropdownStyle: SelectStyleProps['dropdownStyle'] = {};\r\n @Prop() optionStyle: SelectStyleProps['optionStyle'] = {};\r\n @Prop() labelStyle: SelectStyleProps['labelStyle'] = {};\r\n\r\n // props - custom slots\r\n @Prop() optionRenderer?: (option: SelectOption, index: number, isSelected: boolean) => any;\r\n\r\n // states\r\n @State() filteredOptions = this.options;\r\n @State() isOpen: boolean = false;\r\n @State() searchText: string | null = null;\r\n @State() itemIndex: number = -1;\r\n @State() isScrolled: boolean = false;\r\n\r\n // events\r\n @Event() sdChange?: EventEmitter<SelectMultipleEvents['sdChange']>;\r\n @Event() dropDownShow?: EventEmitter<SelectMultipleEvents['dropDownShow']>;\r\n\r\n private selectRef?: HTMLElement;\r\n private searchRef?: HTMLSdInputElement;\r\n private optionRef?: HTMLSdSelectOptionGroupElement;\r\n private dropdownRef?: HTMLElement;\r\n\r\n @Watch('value')\r\n valueChanged() {\r\n this.sdChange?.emit(this.value);\r\n }\r\n\r\n @Watch('options')\r\n optionsChanged() {\r\n this.filteredOptions = this.options;\r\n this.filterOptions();\r\n }\r\n\r\n @Watch('searchText')\r\n searchTextChanged() {\r\n this.filterOptions();\r\n }\r\n\r\n @Watch('itemIndex')\r\n async itemIndexChanged(newIndex: number, oldIndex: number) {\r\n if (this.searchable) {\r\n const searchInput = await this.getNativeInputElement();\r\n if (this.itemIndex === -1) {\r\n searchInput?.focus();\r\n return;\r\n } else if (searchInput?.matches(':focus')) {\r\n searchInput?.blur();\r\n }\r\n }\r\n\r\n const optionElements = Array.from(\r\n this.dropdownRef?.querySelectorAll(\r\n '.sd-select-multiple-group__dropdown sd-select-option-group',\r\n ) || [],\r\n );\r\n const currentItem = optionElements?.[this.itemIndex];\r\n\r\n if (!currentItem || !this.isOpen) return;\r\n\r\n this.optionRef = currentItem as HTMLSdSelectOptionGroupElement;\r\n const isOptionDisabled = await this.optionRef.isDisabled();\r\n\r\n if (isOptionDisabled) {\r\n newIndex > oldIndex ? this.itemIndex++ : this.itemIndex--;\r\n return;\r\n }\r\n\r\n this.scrollToOption(currentItem as HTMLElement);\r\n }\r\n\r\n @Watch('isOpen')\r\n async isOpenChanged() {\r\n // Base class의 이벤트 관리 호출 - 다른 select와의 이벤트 충돌 방지\r\n this.onDropdownToggle(this.isOpen);\r\n\r\n const selectedOption = this.getSelectedOption();\r\n if (!selectedOption) {\r\n this.itemIndex = -1;\r\n } else {\r\n this.itemIndex = this.options.indexOf(selectedOption[0]);\r\n }\r\n\r\n this.dropDownShow?.emit({ isOpen: this.isOpen });\r\n\r\n if (this.isOpen === false) return;\r\n\r\n await new Promise(resolve => setTimeout(resolve, 10));\r\n\r\n const optionElements = Array.from(\r\n this.dropdownRef?.querySelectorAll('.sd-select-multiple__dropdown sd-select-item') || [],\r\n );\r\n const currentItem = optionElements?.[this.itemIndex];\r\n\r\n // 드롭다운이 열릴 때 검색 입력에 포커스\r\n if (this.searchable) {\r\n const searchInput = await this.getNativeInputElement();\r\n searchInput?.focus();\r\n }\r\n\r\n if (!currentItem) return;\r\n\r\n await new Promise(resolve => setTimeout(resolve, 10)); // 추가 딜레이\r\n this.scrollToOption(currentItem as HTMLElement);\r\n }\r\n\r\n componentWillLoad() {\r\n // props가 모두 설정된 후에 실행되므로 올바른 options 값을 가져올 수 있음\r\n this.filteredOptions = this.options;\r\n this.initializeEvent(); // global dropdown Manager에 등록 + 이벤트 핸들러 초기화\r\n }\r\n\r\n disconnectedCallback() {\r\n this.cleanupEvent(); // global dropdown Manager에서 제거 + 이벤트 정리\r\n }\r\n\r\n protected handleDocumentClick(event: Event): void {\r\n if (!this.selectRef?.contains(event.target as Node)) {\r\n this.isOpen = false;\r\n }\r\n }\r\n\r\n protected handleDocumentKeydown(keyboardEvent: KeyboardEvent): void {\r\n keyboardEvent.stopPropagation();\r\n const targetKey = ['ArrowDown', 'ArrowUp', 'Enter', 'Escape'];\r\n if (!targetKey.includes(keyboardEvent.key)) return;\r\n\r\n keyboardEvent.preventDefault();\r\n switch (keyboardEvent.key) {\r\n case 'ArrowDown':\r\n case 'ArrowUp':\r\n const keyboardNavigation = new SelectKeyboardNavigation(this.searchable, this.filteredOptions);\r\n const nextIndex = keyboardNavigation.getNextIndex(this.itemIndex, keyboardEvent.key);\r\n this.itemIndex = nextIndex;\r\n break;\r\n case 'Enter':\r\n const selectedOption = this.filteredOptions[this.itemIndex];\r\n if (selectedOption && !selectedOption.disabled) {\r\n this.handleOptionSelection(selectedOption);\r\n }\r\n break;\r\n case 'Escape':\r\n this.isOpen = false;\r\n break;\r\n }\r\n }\r\n\r\n // event handlers\r\n handleTriggerClick = (event: Event) => {\r\n event.stopPropagation();\r\n\r\n if (!this.disabled) {\r\n this.isOpen = !this.isOpen;\r\n this.dropDownShow?.emit({ isOpen: this.isOpen });\r\n }\r\n };\r\n\r\n handleOptionClick = (detail: {\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n index: number;\r\n event: MouseEvent;\r\n }) => {\r\n const { option, event } = detail;\r\n event.stopPropagation();\r\n\r\n if (option.type === 'group') this.handleGroupOptionClick(detail);\r\n if (option.type === 'subgroup') this.handleSubGroupOptionClick(detail);\r\n if (option.type === 'item') this.handleOptionSelection(option);\r\n };\r\n\r\n handleGroupOptionClick = (detail: {\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n index: number;\r\n }) => {\r\n const { option, isSelected } = detail;\r\n const childOptions = this.filteredOptions.filter(\r\n opt => opt.parent === option.value && !opt.disabled,\r\n );\r\n\r\n childOptions.forEach(subgroup => {\r\n this.handleSubGroupOptionClick({\r\n option: subgroup,\r\n isSelected: isSelected || isSelected === null,\r\n });\r\n });\r\n };\r\n\r\n handleSubGroupOptionClick = (detail: {\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n }) => {\r\n const { option, isSelected } = detail;\r\n\r\n const childOptions = this.filteredOptions.filter(\r\n opt => opt.parent === option.value && !opt.disabled,\r\n );\r\n\r\n if (isSelected || isSelected === null) {\r\n // 모든 자식 옵션이 선택된 경우, 모두 선택 해제\r\n this.value =\r\n this.value?.filter(selected => !childOptions.some(child => child.value === selected.value)) ||\r\n null;\r\n } else {\r\n // 일부 또는 전체 자식 옵션이 선택되지 않은 경우, 모두 선택\r\n const newSelections = childOptions.filter(\r\n child => !this.value?.some(selected => selected.value === child.value),\r\n );\r\n this.value = [...(this.value || []), ...newSelections];\r\n }\r\n };\r\n\r\n private filterOptions() {\r\n if (!this.searchText || this.searchText.trim() === '') {\r\n // 검색어가 없으면 전체 옵션 표시\r\n this.filteredOptions = this.options;\r\n return;\r\n }\r\n\r\n const searchTerm = this.searchText.toLowerCase();\r\n const matchedOptions = new Set<SelectOptionGroup>();\r\n\r\n // 1. 직접 매칭되는 옵션들 찾기\r\n this.options.forEach(option => {\r\n if (option.label.toLowerCase().includes(searchTerm)) {\r\n matchedOptions.add(option);\r\n\r\n // 매칭된 옵션의 상위 그룹들도 포함\r\n this.addParentGroups(option, matchedOptions);\r\n }\r\n });\r\n\r\n // 2. Set을 배열로 변환하고 원본 순서 유지\r\n this.filteredOptions = this.options.filter(option => matchedOptions.has(option));\r\n }\r\n\r\n private addParentGroups(option: SelectOptionGroup, matchedSet: Set<SelectOptionGroup>) {\r\n if (!option.parent) return;\r\n\r\n const parentOption = this.options.find(opt => opt.value === option.parent);\r\n if (parentOption && !matchedSet.has(parentOption)) {\r\n matchedSet.add(parentOption);\r\n // 재귀적으로 상위 그룹들도 추가\r\n this.addParentGroups(parentOption, matchedSet);\r\n }\r\n }\r\n\r\n private getSelectedOption(): SelectOptionGroup[] {\r\n return this.options.filter(option => this.value?.includes(option));\r\n }\r\n\r\n private handleDropdownScroll = (event: Event) => {\r\n const target = event.target as HTMLElement;\r\n const scrollTop = target.scrollTop;\r\n\r\n // 스크롤이 조금이라도 되면 그림자 표시\r\n this.isScrolled = scrollTop > 0;\r\n };\r\n\r\n private async getNativeInputElement(): Promise<HTMLInputElement | null> {\r\n if (this.searchRef) {\r\n return this.searchRef.getNativeElement();\r\n }\r\n return null;\r\n }\r\n\r\n private handleOptionSelection = (option: SelectOptionGroup) => {\r\n if (!option || option.disabled) return;\r\n\r\n const isAlreadySelected = this.value?.some(opt => opt.value === option.value);\r\n if (isAlreadySelected) {\r\n // 이미 선택된 옵션인 경우, 선택 해제\r\n this.value = this.value?.filter(opt => opt.value !== option.value) || null;\r\n } else {\r\n // 새로운 옵션 선택\r\n this.value = [...(this.value || []), option];\r\n }\r\n };\r\n\r\n private getAllItemsUnderOption(parentOption: SelectOptionGroup): SelectOptionGroup[] {\r\n const childOptions = this.filteredOptions.filter(\r\n option => option.parent === parentOption.value && !option.disabled,\r\n );\r\n\r\n if (parentOption.type === 'group') {\r\n // Group - 모든 하위 item들을 수집\r\n const subgroupOptions = childOptions.filter(option => option.type === 'subgroup');\r\n const allItemsUnderGroup: SelectOptionGroup[] = [];\r\n\r\n // subgroup 하위의 모든 item\r\n subgroupOptions.forEach(subgroup => {\r\n const itemsUnderSubgroup = this.filteredOptions.filter(\r\n option => option.parent === subgroup.value && option.type === 'item' && !option.disabled,\r\n );\r\n allItemsUnderGroup.push(...itemsUnderSubgroup);\r\n });\r\n\r\n // Group 바로 하위 item\r\n const directItems = childOptions.filter(option => option.type === 'item');\r\n allItemsUnderGroup.push(...directItems);\r\n\r\n return allItemsUnderGroup;\r\n }\r\n\r\n return childOptions.filter(option => option.type === 'item');\r\n }\r\n\r\n private isAllChildrenSelected(groupOption: SelectOptionGroup): boolean | null {\r\n const allItems = this.getAllItemsUnderOption(groupOption);\r\n\r\n if (allItems.length === 0) return false;\r\n\r\n const selectedItems = allItems.filter(item =>\r\n this.value?.some(selected => selected.value === item.value),\r\n );\r\n\r\n if (selectedItems.length === allItems.length) return true;\r\n if (selectedItems.length > 0) return null;\r\n return false;\r\n }\r\n\r\n private getChildrenOptions(parentOption: SelectOptionGroup) {\r\n if (parentOption.type === 'group') {\r\n const allItems = this.getAllItemsUnderOption(parentOption);\r\n const selectedItems = allItems.filter(item =>\r\n this.value?.some(selected => selected.value === item.value),\r\n );\r\n\r\n return {\r\n selectedCount: selectedItems.length,\r\n totalCount: allItems.length,\r\n };\r\n }\r\n\r\n // Subgroup의 경우\r\n const children = this.filteredOptions.filter(option => option.parent === parentOption.value);\r\n return {\r\n selectedCount: children.filter(child => this.value?.some(val => val.value === child.value))\r\n .length,\r\n totalCount: children.length,\r\n };\r\n }\r\n\r\n closeDropdown() {\r\n this.isOpen = false;\r\n }\r\n\r\n private scrollToOption(optionElement: HTMLElement) {\r\n if (!this.dropdownRef || !optionElement) return;\r\n\r\n const dropdown = this.dropdownRef;\r\n const optionTop = optionElement.offsetTop;\r\n const optionHeight = optionElement.offsetHeight;\r\n const dropdownScrollTop = dropdown.scrollTop;\r\n const dropdownHeight = dropdown.clientHeight;\r\n\r\n const searchContainer = dropdown.querySelector('.sd-select__search-container');\r\n const searchOffset = searchContainer ? (searchContainer as HTMLElement).offsetHeight : 0;\r\n\r\n const visibleTop = dropdownScrollTop + searchOffset;\r\n const visibleBottom = dropdownScrollTop + dropdownHeight;\r\n\r\n if (optionTop < visibleTop) {\r\n dropdown.scrollTop = optionTop - searchOffset;\r\n } else if (optionTop + optionHeight > visibleBottom) {\r\n dropdown.scrollTop = optionTop + optionHeight - dropdownHeight + searchOffset;\r\n }\r\n }\r\n\r\n render() {\r\n const style = {\r\n '--select-width': this.width || '200px',\r\n '--select-dropdown-height': this.dropdownHeight || '260px',\r\n };\r\n\r\n return (\r\n <Host style={style}>\r\n <div\r\n class={{\r\n 'sd-select-multiple-group': true,\r\n 'sd-select-multiple-group--open': this.isOpen,\r\n 'sd-select-multiple-group--disabled': this.disabled,\r\n }}\r\n style={this.containerStyle}\r\n ref={el => (this.selectRef = el)}\r\n >\r\n {this.renderLabel(this.label, this.labelStyle)}\r\n <div class=\"sd-select-multiple-group__container\">\r\n {this.renderTrigger()}\r\n {this.renderDropdown()}\r\n </div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n\r\n private renderLabel(label?: string, labelStyle?: { [key: string]: string }) {\r\n if (!label) return null;\r\n\r\n return (\r\n <label class=\"sd-select-multiple-group__label\" style={labelStyle}>\r\n {label}\r\n </label>\r\n );\r\n }\r\n\r\n private renderTrigger() {\r\n const selectedOption = this.getSelectedOption();\r\n return (\r\n <div\r\n class=\"sd-select-multiple-group__trigger\"\r\n tabindex={this.disabled ? -1 : 0}\r\n onClick={this.handleTriggerClick}\r\n style={this.triggerStyle}\r\n >\r\n <span class=\"sd-select-multiple-group__value\">\r\n {!selectedOption\r\n ? '선택'\r\n : selectedOption.length\r\n ? selectedOption.map(option => option.label).join(', ')\r\n : this.placeholder}\r\n </span>\r\n {this.clearable && selectedOption?.length > 0 && !this.disabled && (\r\n <sd-icon\r\n key=\"close-icon\"\r\n name=\"close\"\r\n size={10}\r\n color=\"#888\"\r\n class=\"sd-select-multiple-group__clear\"\r\n onClick={event => {\r\n event.stopPropagation();\r\n this.value = null;\r\n }}\r\n ></sd-icon>\r\n )}\r\n\r\n <sd-icon\r\n key=\"arrow-icon\"\r\n name=\"arrowDown\"\r\n color=\"#888\"\r\n class={{\r\n 'sd-select-multiple-group__arrow': true,\r\n 'sd-select-multiple-group__arrow--open': this.isOpen,\r\n }}\r\n ></sd-icon>\r\n </div>\r\n );\r\n }\r\n\r\n private renderDropdown() {\r\n const style = {\r\n '--select-width': this.width || '200px',\r\n '--select-dropdown-height': this.dropdownHeight || '260px',\r\n };\r\n\r\n if (this.isOpen === false) return null;\r\n\r\n return (\r\n <sd-portal open={this.isOpen} parentRef={this.selectRef} onSdClose={this.closeDropdown}>\r\n <div\r\n class=\"sd-select-multiple-group__dropdown\"\r\n style={{ ...style, ...this.dropdownStyle }}\r\n onScroll={this.handleDropdownScroll}\r\n ref={el => (this.dropdownRef = el)}\r\n >\r\n {this.searchable && (\r\n <div\r\n class={{\r\n 'sd-select-multiple-group__search-container': true,\r\n 'sd-select-multiple-group__search-container--scrolled': this.isScrolled,\r\n }}\r\n onClick={event => event.stopPropagation()}\r\n >\r\n <sd-input\r\n ref={el => (this.searchRef = el)}\r\n value={this.searchText}\r\n placeholder=\"검색\"\r\n clearable\r\n inputStyle={{ 'padding-left': '8px' }}\r\n autofocus\r\n onSdInput={event => {\r\n this.searchText = String(event?.detail);\r\n }}\r\n onSdFocus={() => {\r\n this.itemIndex = -1;\r\n }}\r\n onKeyDown={e => {\r\n if (e.code === 'Enter') e.stopPropagation();\r\n }}\r\n >\r\n <sd-icon name=\"search\" size={16} color=\"#737373\" slot=\"prefix\"></sd-icon>\r\n </sd-input>\r\n </div>\r\n )}\r\n {this.filteredOptions.length > 0 ? (\r\n this.filteredOptions.map((option, index) => (\r\n <slot name={`option-${option.value}`}>\r\n <sd-select-option-group\r\n option={option}\r\n index={index}\r\n isSelected={\r\n option.type === 'item'\r\n ? this.value?.some(selected => selected.value === option.value)\r\n : this.isAllChildrenSelected(option)\r\n }\r\n isFocused={index === this.itemIndex}\r\n optionStyle={this.optionStyle}\r\n onOptionClick={({\r\n detail,\r\n }: {\r\n detail: {\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n index: number;\r\n event: MouseEvent;\r\n };\r\n }) => {\r\n if (option.type !== 'item' && !this.useCheckbox) {\r\n return;\r\n }\r\n\r\n this.handleOptionClick(detail);\r\n }}\r\n useCheckbox={this.useCheckbox}\r\n {...(option.type !== 'item' && { countInfo: this.getChildrenOptions(option) })}\r\n ></sd-select-option-group>\r\n </slot>\r\n ))\r\n ) : (\r\n <slot name=\"option-placeholder\">\r\n <div class={'sd-select-multiple-group__option-placeholder'} style={this.optionStyle}>\r\n {this.optionPlaceholder}\r\n </div>\r\n </slot>\r\n )}\r\n </div>\r\n </sd-portal>\r\n );\r\n }\r\n}\r\n"],"names":["BaseDropdownEvent","SelectKeyboardNavigation","h","Host","index"],"mappings":"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"}
|