@sellmate/design-system 0.0.53 → 0.0.54

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (118) hide show
  1. package/dist/cjs/design-system.cjs.js +1 -1
  2. package/dist/cjs/loader.cjs.js +1 -1
  3. package/dist/cjs/{sd-button_21.cjs.entry.js → sd-button_23.cjs.entry.js} +591 -80
  4. package/dist/cjs/sd-popover.cjs.entry.js +2 -2
  5. package/dist/cjs/sd-progress.cjs.entry.js +2 -2
  6. package/dist/cjs/sd-select-multiple.cjs.entry.js +266 -0
  7. package/dist/cjs/sd-tbody_3.cjs.entry.js +3 -3
  8. package/dist/cjs/sd-td.cjs.entry.js +2 -2
  9. package/dist/collection/collection-manifest.json +1 -0
  10. package/dist/collection/components/sd-number-input/sd-number-input.css +128 -0
  11. package/dist/collection/components/sd-number-input/sd-number-input.js +744 -0
  12. package/dist/collection/components/sd-number-input/sd-number-input.js.map +1 -0
  13. package/dist/collection/components/sd-pagination/sd-pagination.js +2 -2
  14. package/dist/collection/components/sd-popover/sd-popover.js +2 -2
  15. package/dist/collection/components/sd-portal/sd-portal.js +1 -1
  16. package/dist/collection/components/sd-progress/sd-progress.js +2 -2
  17. package/dist/collection/components/sd-select/sd-select-option/sd-select-option.js +1 -1
  18. package/dist/collection/components/sd-select-multiple/sd-select-multiple.js +2 -2
  19. package/dist/collection/components/sd-select-multiple-group/sd-select-multiple-group.css +5 -0
  20. package/dist/collection/components/sd-select-multiple-group/sd-select-multiple-group.js +91 -42
  21. package/dist/collection/components/sd-select-multiple-group/sd-select-multiple-group.js.map +1 -1
  22. package/dist/collection/components/sd-select-multiple-group/sd-select-option-group/sd-select-option-group.js +3 -3
  23. package/dist/collection/components/sd-table/sd-tbody/sd-tbody.js +1 -1
  24. package/dist/collection/components/sd-table/sd-td/sd-td.js +2 -2
  25. package/dist/collection/components/sd-table/sd-th/sd-th.js +1 -1
  26. package/dist/collection/components/sd-table/sd-tr/sd-tr.js +1 -1
  27. package/dist/collection/components/sd-toggle/sd-toggle.js +1 -1
  28. package/dist/collection/components/sd-toggle-button/sd-toggle-button.js +1 -1
  29. package/dist/collection/components/sd-tooltip/sd-tooltip.js +4 -4
  30. package/dist/collection/components/sd-tooltip-portal/sd-tooltip-portal.js +1 -1
  31. package/dist/components/{p-CYadUxId.js → p-BBNolp5g.js} +3 -3
  32. package/dist/components/{p-CYadUxId.js.map → p-BBNolp5g.js.map} +1 -1
  33. package/dist/components/{p-71Aop19u.js → p-BH3t01Im.js} +5 -5
  34. package/dist/components/{p-71Aop19u.js.map → p-BH3t01Im.js.map} +1 -1
  35. package/dist/components/{p-Be8w5kOo.js → p-BqxmCDlz.js} +7 -7
  36. package/dist/components/{p-Be8w5kOo.js.map → p-BqxmCDlz.js.map} +1 -1
  37. package/dist/components/{p-B13lOU0D.js → p-C5T02a4h.js} +4 -4
  38. package/dist/components/{p-B13lOU0D.js.map → p-C5T02a4h.js.map} +1 -1
  39. package/dist/components/{p-Cf-LyLYk.js → p-CEDtmtIo.js} +3 -3
  40. package/dist/components/{p-Cf-LyLYk.js.map → p-CEDtmtIo.js.map} +1 -1
  41. package/dist/components/{p-DP33nj_I.js → p-Cx3euWvk.js} +3 -3
  42. package/dist/components/{p-DP33nj_I.js.map → p-Cx3euWvk.js.map} +1 -1
  43. package/dist/components/{p-ChQIkICO.js → p-DdeknsBE.js} +3 -3
  44. package/dist/components/{p-ChQIkICO.js.map → p-DdeknsBE.js.map} +1 -1
  45. package/dist/components/{p-j-ZEdgz4.js → p-GHGGjwP3.js} +3 -3
  46. package/dist/components/{p-j-ZEdgz4.js.map → p-GHGGjwP3.js.map} +1 -1
  47. package/dist/components/{p-B4wWf5r8.js → p-XAhTfI7Q.js} +4 -4
  48. package/dist/components/{p-B4wWf5r8.js.map → p-XAhTfI7Q.js.map} +1 -1
  49. package/dist/components/{p-CVtij2QI.js → p-at_j60O8.js} +3 -3
  50. package/dist/components/{p-CVtij2QI.js.map → p-at_j60O8.js.map} +1 -1
  51. package/dist/components/sd-date-picker.js +1 -1
  52. package/dist/components/sd-date-range-picker.js +1 -1
  53. package/dist/components/sd-guide.js +1 -1
  54. package/dist/components/sd-number-input.d.ts +11 -0
  55. package/dist/components/sd-number-input.js +335 -0
  56. package/dist/components/sd-number-input.js.map +1 -0
  57. package/dist/components/sd-pagination.js +1 -1
  58. package/dist/components/sd-popover.js +3 -3
  59. package/dist/components/sd-portal.js +1 -1
  60. package/dist/components/sd-progress.js +2 -2
  61. package/dist/components/sd-select-multiple-group.js +74 -45
  62. package/dist/components/sd-select-multiple-group.js.map +1 -1
  63. package/dist/components/sd-select-multiple.js +4 -4
  64. package/dist/components/sd-select-option-group.js +1 -1
  65. package/dist/components/sd-select-option.js +1 -1
  66. package/dist/components/sd-select.js +1 -1
  67. package/dist/components/sd-table-backup.js +6 -6
  68. package/dist/components/sd-table.js +9 -9
  69. package/dist/components/sd-tbody.js +1 -1
  70. package/dist/components/sd-td.js +2 -2
  71. package/dist/components/sd-th.js +1 -1
  72. package/dist/components/sd-toggle-button.js +1 -1
  73. package/dist/components/sd-toggle.js +1 -1
  74. package/dist/components/sd-tooltip-portal.js +1 -1
  75. package/dist/components/sd-tooltip.js +1 -1
  76. package/dist/components/sd-tr.js +1 -1
  77. package/dist/design-system/design-system.esm.js +1 -1
  78. package/dist/design-system/p-26266f8c.entry.js +2 -0
  79. package/dist/design-system/p-2df41cc3.entry.js +2 -0
  80. package/dist/design-system/p-2df41cc3.entry.js.map +1 -0
  81. package/dist/design-system/p-3cc7957d.entry.js +2 -0
  82. package/dist/design-system/p-a18c202d.entry.js +2 -0
  83. package/dist/design-system/{p-0cbdb34f.entry.js → p-b0668ce9.entry.js} +2 -2
  84. package/dist/design-system/{p-d02b3369.entry.js → p-f9e04bf9.entry.js} +2 -2
  85. package/dist/design-system/p-f9e04bf9.entry.js.map +1 -0
  86. package/dist/esm/design-system.js +1 -1
  87. package/dist/esm/loader.js +1 -1
  88. package/dist/esm/{sd-button_21.entry.js → sd-button_23.entry.js} +589 -80
  89. package/dist/esm/sd-popover.entry.js +2 -2
  90. package/dist/esm/sd-progress.entry.js +2 -2
  91. package/dist/esm/sd-select-multiple.entry.js +264 -0
  92. package/dist/esm/sd-select-multiple.entry.js.map +1 -0
  93. package/dist/esm/sd-tbody_3.entry.js +3 -3
  94. package/dist/esm/sd-td.entry.js +2 -2
  95. package/dist/types/components/sd-number-input/sd-number-input.d.ts +58 -0
  96. package/dist/types/components/sd-select-multiple-group/sd-select-multiple-group.d.ts +2 -0
  97. package/dist/types/components.d.ts +145 -0
  98. package/hydrate/index.js +407 -68
  99. package/hydrate/index.mjs +407 -68
  100. package/package.json +1 -1
  101. package/dist/cjs/sd-select-multiple-group.cjs.entry.js +0 -406
  102. package/dist/cjs/sd-select-option-group.cjs.entry.js +0 -69
  103. package/dist/design-system/p-1e7a06ef.entry.js +0 -2
  104. package/dist/design-system/p-761882f5.entry.js +0 -2
  105. package/dist/design-system/p-790ae9ce.entry.js +0 -2
  106. package/dist/design-system/p-790ae9ce.entry.js.map +0 -1
  107. package/dist/design-system/p-a8e8fc17.entry.js +0 -2
  108. package/dist/design-system/p-d02b3369.entry.js.map +0 -1
  109. package/dist/design-system/p-e492d625.entry.js +0 -2
  110. package/dist/design-system/p-e492d625.entry.js.map +0 -1
  111. package/dist/esm/sd-select-multiple-group.entry.js +0 -404
  112. package/dist/esm/sd-select-multiple-group.entry.js.map +0 -1
  113. package/dist/esm/sd-select-option-group.entry.js +0 -67
  114. package/dist/esm/sd-select-option-group.entry.js.map +0 -1
  115. /package/dist/design-system/{p-1e7a06ef.entry.js.map → p-26266f8c.entry.js.map} +0 -0
  116. /package/dist/design-system/{p-761882f5.entry.js.map → p-3cc7957d.entry.js.map} +0 -0
  117. /package/dist/design-system/{p-a8e8fc17.entry.js.map → p-a18c202d.entry.js.map} +0 -0
  118. /package/dist/design-system/{p-0cbdb34f.entry.js.map → p-b0668ce9.entry.js.map} +0 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sellmate/design-system",
3
- "version": "0.0.53",
3
+ "version": "0.0.54",
4
4
  "description": "Sellmate Design System - Web Components Library built with Stencil",
5
5
  "keywords": [
6
6
  "web-components",
@@ -1,406 +0,0 @@
1
- 'use strict';
2
-
3
- var index = require('./index-B7tkxTye.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
- useAll = false;
29
- allCheckedLabel = '전체';
30
- allCheckOptionLabel = '전체';
31
- // props - custom styles
32
- containerStyle = {};
33
- triggerStyle = {};
34
- dropdownStyle = {};
35
- optionStyle = {};
36
- labelStyle = {};
37
- // props - custom slots
38
- optionRenderer;
39
- // states
40
- filteredOptions = this.options;
41
- isOpen = false;
42
- searchText = null;
43
- itemIndex = -1;
44
- isScrolled = false;
45
- // events
46
- sdChange;
47
- dropDownShow;
48
- selectRef;
49
- searchRef;
50
- optionRef;
51
- dropdownRef;
52
- valueChanged() {
53
- this.sdChange?.emit(this.value);
54
- }
55
- optionsChanged() {
56
- this.filteredOptions = this.options;
57
- this.filterOptions();
58
- }
59
- searchTextChanged() {
60
- this.filterOptions();
61
- }
62
- async itemIndexChanged(newIndex, oldIndex) {
63
- if (this.searchable) {
64
- const searchInput = await this.getNativeInputElement();
65
- if (this.itemIndex === -1) {
66
- searchInput?.focus({ preventScroll: true });
67
- return;
68
- }
69
- else if (searchInput?.matches(':focus')) {
70
- searchInput?.blur();
71
- }
72
- }
73
- const optionElements = Array.from(this.dropdownRef?.querySelectorAll('.sd-select-multiple-group__dropdown sd-select-option-group') || []);
74
- const currentItem = optionElements?.[this.itemIndex];
75
- if (!currentItem || !this.isOpen)
76
- return;
77
- this.optionRef = currentItem;
78
- const isOptionDisabled = await this.optionRef.isDisabled();
79
- if (isOptionDisabled) {
80
- newIndex > oldIndex ? this.itemIndex++ : this.itemIndex--;
81
- return;
82
- }
83
- this.scrollToOption(currentItem);
84
- }
85
- async isOpenChanged() {
86
- // Base class의 이벤트 관리 호출 - 다른 select와의 이벤트 충돌 방지
87
- this.onDropdownToggle(this.isOpen);
88
- const selectedOption = this.getSelectedOption();
89
- if (!selectedOption) {
90
- this.itemIndex = -1;
91
- }
92
- else {
93
- this.itemIndex = this.options.indexOf(selectedOption[0]);
94
- }
95
- this.dropDownShow?.emit({ isOpen: this.isOpen });
96
- if (this.isOpen === false)
97
- return;
98
- await new Promise(resolve => setTimeout(resolve, 10));
99
- const optionElements = Array.from(this.dropdownRef?.querySelectorAll('.sd-select-multiple__dropdown sd-select-item') || []);
100
- const currentItem = optionElements?.[this.itemIndex];
101
- // 드롭다운이 열릴 때 검색 입력에 포커스
102
- if (this.searchable) {
103
- const searchInput = await this.getNativeInputElement();
104
- searchInput?.focus({ preventScroll: true });
105
- }
106
- if (!currentItem)
107
- return;
108
- await new Promise(resolve => setTimeout(resolve, 10)); // 추가 딜레이
109
- this.scrollToOption(currentItem);
110
- }
111
- componentWillLoad() {
112
- // props가 모두 설정된 후에 실행되므로 올바른 options 값을 가져올 수 있음
113
- this.filteredOptions = this.options;
114
- this.initializeEvent(); // global dropdown Manager에 등록 + 이벤트 핸들러 초기화
115
- }
116
- disconnectedCallback() {
117
- this.cleanupEvent(); // global dropdown Manager에서 제거 + 이벤트 정리
118
- }
119
- handleDocumentClick(event) {
120
- if (!this.selectRef?.contains(event.target)) {
121
- this.isOpen = false;
122
- }
123
- }
124
- handleDocumentKeydown(keyboardEvent) {
125
- keyboardEvent.stopPropagation();
126
- const targetKey = ['ArrowDown', 'ArrowUp', 'Enter', 'Escape'];
127
- if (!targetKey.includes(keyboardEvent.key))
128
- return;
129
- keyboardEvent.preventDefault();
130
- switch (keyboardEvent.key) {
131
- case 'ArrowDown':
132
- case 'ArrowUp':
133
- const keyboardNavigation = new selectKeyboardNavigation.SelectKeyboardNavigation(this.searchable, this.filteredOptions);
134
- const nextIndex = keyboardNavigation.getNextIndex(this.itemIndex, keyboardEvent.key);
135
- this.itemIndex = nextIndex;
136
- break;
137
- case 'Enter':
138
- const selectedOption = this.filteredOptions[this.itemIndex];
139
- if (selectedOption && !selectedOption.disabled) {
140
- this.handleOptionSelection(selectedOption);
141
- }
142
- break;
143
- case 'Escape':
144
- this.isOpen = false;
145
- break;
146
- }
147
- }
148
- // event handlers
149
- handleTriggerClick = (event) => {
150
- event.stopPropagation();
151
- if (!this.disabled) {
152
- this.isOpen = !this.isOpen;
153
- this.dropDownShow?.emit({ isOpen: this.isOpen });
154
- }
155
- };
156
- handleAllOptionClick = (detail) => {
157
- if (detail.isSelected) {
158
- // 이미 선택된 옵션인 경우, 선택 해제
159
- const filterDisabledOptions = this.filteredOptions.filter(opt => opt.type === 'item' && !opt.disabled);
160
- this.value =
161
- this.value?.filter(selected => !filterDisabledOptions.some(opt => opt.value === selected.value)) || this.value;
162
- }
163
- else {
164
- // 새로운 옵션 선택
165
- const valueSet = new Set([
166
- ...(this.value || []),
167
- ...this.filteredOptions.filter(opt => opt.type === 'item' && !opt.disabled),
168
- ]);
169
- this.value = Array.from(valueSet);
170
- }
171
- };
172
- handleOptionClick = (detail) => {
173
- const { option, event } = detail;
174
- event.stopPropagation();
175
- if (option.type === 'group')
176
- this.handleGroupOptionClick(detail);
177
- if (option.type === 'subgroup')
178
- this.handleSubGroupOptionClick(detail);
179
- if (option.type === 'item')
180
- this.handleOptionSelection(option);
181
- };
182
- handleGroupOptionClick = (detail) => {
183
- const { option, isSelected } = detail;
184
- const childOptions = this.filteredOptions.filter(opt => opt.parent === option.value && !opt.disabled);
185
- childOptions.forEach(subgroup => {
186
- this.handleSubGroupOptionClick({
187
- option: subgroup,
188
- isSelected: isSelected || isSelected === null,
189
- });
190
- });
191
- };
192
- handleSubGroupOptionClick = (detail) => {
193
- const { option, isSelected } = detail;
194
- const childOptions = this.filteredOptions.filter(opt => opt.parent === option.value && !opt.disabled);
195
- if (isSelected || isSelected === null) {
196
- // 모든 자식 옵션이 선택된 경우, 모두 선택 해제
197
- this.value =
198
- this.value?.filter(selected => !childOptions.some(child => child.value === selected.value)) ||
199
- null;
200
- }
201
- else {
202
- // 일부 또는 전체 자식 옵션이 선택되지 않은 경우, 모두 선택
203
- const newSelections = childOptions.filter(child => !this.value?.some(selected => selected.value === child.value));
204
- this.value = [...(this.value || []), ...newSelections];
205
- }
206
- };
207
- filterOptions() {
208
- if (!this.searchText || this.searchText.trim() === '') {
209
- // 검색어가 없으면 전체 옵션 표시
210
- this.filteredOptions = this.options;
211
- return;
212
- }
213
- const searchTerm = this.searchText.toLowerCase();
214
- const matchedOptions = new Set();
215
- // 1. 직접 매칭되는 옵션들 찾기
216
- this.options.forEach(option => {
217
- if (option.label.toLowerCase().includes(searchTerm)) {
218
- matchedOptions.add(option);
219
- // 매칭된 옵션의 상위 그룹들도 포함
220
- this.addParentGroups(option, matchedOptions);
221
- }
222
- });
223
- // 2. Set을 배열로 변환하고 원본 순서 유지
224
- this.filteredOptions = this.options.filter(option => matchedOptions.has(option));
225
- }
226
- addParentGroups(option, matchedSet) {
227
- if (!option.parent)
228
- return;
229
- const parentOption = this.options.find(opt => opt.value === option.parent);
230
- if (parentOption && !matchedSet.has(parentOption)) {
231
- matchedSet.add(parentOption);
232
- // 재귀적으로 상위 그룹들도 추가
233
- this.addParentGroups(parentOption, matchedSet);
234
- }
235
- }
236
- getSelectedOption() {
237
- return this.options.filter(option => this.value?.includes(option));
238
- }
239
- handleDropdownScroll = (event) => {
240
- const target = event.target;
241
- const scrollTop = target.scrollTop;
242
- // 스크롤이 조금이라도 되면 그림자 표시
243
- this.isScrolled = scrollTop > 0;
244
- };
245
- async getNativeInputElement() {
246
- if (this.searchRef) {
247
- return this.searchRef.getNativeElement();
248
- }
249
- return null;
250
- }
251
- handleOptionSelection = (option) => {
252
- if (!option || option.disabled)
253
- return;
254
- const isAlreadySelected = this.value?.some(opt => opt.value === option.value);
255
- if (isAlreadySelected) {
256
- // 이미 선택된 옵션인 경우, 선택 해제
257
- this.value = this.value?.filter(opt => opt.value !== option.value) || null;
258
- }
259
- else {
260
- // 새로운 옵션 선택
261
- this.value = [...(this.value || []), option];
262
- }
263
- };
264
- getAllItemsUnderOption(parentOption, includeDisabled = false) {
265
- const filterChildrenWithParent = (option) => option.parent === parentOption.value && (includeDisabled || !option.disabled);
266
- if (parentOption.type === 'subgroup') {
267
- return this.filteredOptions.filter(option => filterChildrenWithParent(option) && option.type === 'item');
268
- }
269
- const allItems = [];
270
- const childOptions = this.filteredOptions.filter(filterChildrenWithParent);
271
- const subgroupOptions = childOptions.filter(option => option.type === 'subgroup');
272
- subgroupOptions.forEach(subgroup => {
273
- const itemsUnderSubgroup = this.filteredOptions.filter(option => option.parent === subgroup.value &&
274
- option.type === 'item' &&
275
- (includeDisabled ? true : !option.disabled));
276
- allItems.push(...itemsUnderSubgroup);
277
- });
278
- const directItems = childOptions.filter(option => option.type === 'item');
279
- allItems.push(...directItems);
280
- return allItems;
281
- }
282
- isAllChildrenSelected(groupOption) {
283
- const allItems = this.getAllItemsUnderOption(groupOption);
284
- if (allItems.length === 0)
285
- return false;
286
- const selectedItems = allItems.filter(item => this.value?.some(selected => selected.value === item.value));
287
- if (selectedItems.length === allItems.length)
288
- return true;
289
- if (selectedItems.length > 0)
290
- return null;
291
- return false;
292
- }
293
- getChildrenOptions(parentOption) {
294
- const allItems = this.getAllItemsUnderOption(parentOption, true);
295
- const selectedCount = allItems.filter(item => this.value?.some(val => val.value === item.value)).length;
296
- return {
297
- selectedCount,
298
- totalCount: allItems.length,
299
- };
300
- }
301
- isAllOptionsSelected() {
302
- if (!this.value || this.value.length === 0)
303
- return false;
304
- const selectableItems = this.options.filter(opt => opt.type === 'item' && !opt.disabled);
305
- if (selectableItems.length === 0)
306
- return false;
307
- const selectedValues = new Set(this.value.map(v => v.value));
308
- return selectableItems.every(option => selectedValues.has(option.value));
309
- }
310
- getTriggerLabel() {
311
- const selectedOption = this.getSelectedOption();
312
- if (!selectedOption)
313
- return '선택';
314
- if (selectedOption.length === 0)
315
- return this.placeholder;
316
- const isAllChecked = this.isAllOptionsSelected();
317
- return isAllChecked
318
- ? this.allCheckedLabel
319
- : selectedOption.map(option => option.label).join(', ');
320
- }
321
- closeDropdown() {
322
- this.isOpen = false;
323
- }
324
- scrollToOption(optionElement) {
325
- if (!this.dropdownRef || !optionElement)
326
- return;
327
- const dropdown = this.dropdownRef;
328
- const optionTop = optionElement.offsetTop;
329
- const optionHeight = optionElement.offsetHeight;
330
- const dropdownScrollTop = dropdown.scrollTop;
331
- const dropdownHeight = dropdown.clientHeight;
332
- const searchContainer = dropdown.querySelector('.sd-select__search-container');
333
- const searchOffset = searchContainer ? searchContainer.offsetHeight : 0;
334
- const visibleTop = dropdownScrollTop + searchOffset;
335
- const visibleBottom = dropdownScrollTop + dropdownHeight;
336
- if (optionTop < visibleTop) {
337
- dropdown.scrollTop = optionTop - searchOffset;
338
- }
339
- else if (optionTop + optionHeight > visibleBottom) {
340
- dropdown.scrollTop = optionTop + optionHeight - dropdownHeight + searchOffset;
341
- }
342
- }
343
- render() {
344
- const style = {
345
- '--select-width': this.width || '200px',
346
- '--select-dropdown-height': this.dropdownHeight || '260px',
347
- };
348
- return (index.h(index.Host, { key: 'efc8661d6cd2e043b5e43e0872de3a9bff6d57a6', style: style }, index.h("div", { key: 'e9f7615f75cb28974dececc8e847e868aef8210c', class: {
349
- 'sd-select-multiple-group': true,
350
- 'sd-select-multiple-group--open': this.isOpen,
351
- 'sd-select-multiple-group--disabled': this.disabled,
352
- }, style: this.containerStyle, ref: el => (this.selectRef = el) }, this.renderLabel(this.label, this.labelStyle), index.h("div", { key: '37ea4df1408eebde9e9e6d6d42579a3c40da325a', class: "sd-select-multiple-group__container" }, this.renderTrigger(), this.renderDropdown()))));
353
- }
354
- renderLabel(label, labelStyle) {
355
- if (!label)
356
- return null;
357
- return (index.h("label", { class: "sd-select-multiple-group__label", style: labelStyle }, label));
358
- }
359
- renderTrigger() {
360
- const selectedOption = this.getSelectedOption();
361
- 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" }, this.getTriggerLabel()), 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 => {
362
- event.stopPropagation();
363
- this.value = null;
364
- } })), index.h("sd-icon", { key: "arrow-icon", name: "arrowDown", color: "#888", class: {
365
- 'sd-select-multiple-group__arrow': true,
366
- 'sd-select-multiple-group__arrow--open': this.isOpen,
367
- } })));
368
- }
369
- renderDropdown() {
370
- const style = {
371
- '--select-width': this.width || '200px',
372
- '--select-dropdown-height': this.dropdownHeight || '260px',
373
- };
374
- if (this.isOpen === false)
375
- return null;
376
- 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: {
377
- 'sd-select-multiple-group__search-container': true,
378
- 'sd-select-multiple-group__search-container--scrolled': this.isScrolled,
379
- }, 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 => {
380
- this.searchText = String(event?.detail);
381
- }, onSdFocus: () => {
382
- this.itemIndex = -1;
383
- }, onKeyDown: e => {
384
- if (e.code === 'Enter')
385
- e.stopPropagation();
386
- } }, index.h("sd-icon", { name: "search", size: 16, color: "#737373", slot: "prefix" })))), this.filteredOptions.length > 0 ? (index.h(index.Fragment, null, this.useAll && (index.h("sd-select-option-group", { option: { label: this.allCheckOptionLabel, value: '', type: 'all' }, index: 0, isSelected: this.isAllOptionsSelected(), isFocused: this.itemIndex === 0, optionStyle: this.optionStyle, onOptionClick: ({ detail, }) => this.handleAllOptionClick(detail), useCheckbox: this.useCheckbox, useIndicator: false })), 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'
387
- ? this.value?.some(selected => selected.value === option.value)
388
- : this.isAllChildrenSelected(option), isFocused: index$1 === this.itemIndex, optionStyle: this.optionStyle, onOptionClick: ({ detail, }) => {
389
- if (option.type !== 'item' && !this.useCheckbox) {
390
- return;
391
- }
392
- this.handleOptionClick(detail);
393
- }, 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))))));
394
- }
395
- static get watchers() { return {
396
- "value": ["valueChanged"],
397
- "options": ["optionsChanged"],
398
- "searchText": ["searchTextChanged"],
399
- "itemIndex": ["itemIndexChanged"],
400
- "isOpen": ["isOpenChanged"]
401
- }; }
402
- };
403
- SdSelectMultipleGroup.style = sdSelectMultipleGroupCss();
404
-
405
- exports.sd_select_multiple_group = SdSelectMultipleGroup;
406
- //# sourceMappingURL=sd-select-multiple-group.entry.cjs.js.map
@@ -1,69 +0,0 @@
1
- 'use strict';
2
-
3
- var index = require('./index-B7tkxTye.js');
4
-
5
- const sdSelectOptionGroupCss = () => `sd-select-option-group{display:block;height:fit-content}sd-select-option-group .sd-select__option-group{display:flex;padding:4px 12px;padding-left:12px;font-size:12px;line-height:20px;cursor:pointer}sd-select-option-group .sd-select__option-group.sd-select__option-group--group:not(.sd-select__option-group--use-checkbox),sd-select-option-group .sd-select__option-group.sd-select__option-group--subgroup:not(.sd-select__option-group--use-checkbox){cursor:default !important}sd-select-option-group .sd-select__option-group.sd-select__option-group--group{background-color:#f5faff !important;color:#333333 !important;font-weight:700}sd-select-option-group .sd-select__option-group.sd-select__option-group--subgroup{padding-left:20px;background-color:#f9f9f9 !important;color:#333333 !important;font-weight:500}sd-select-option-group .sd-select__option-group.sd-select__option-group--item{padding-left:28px}sd-select-option-group .sd-select__option-group sd-checkbox__bg{border-color:#888888}sd-select-option-group .sd-select__option-group__label-wrapper{display:flex;width:100%;column-gap:8px;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}sd-select-option-group .sd-select__option-group__label-wrapper sd-checkbox{flex-shrink:0}sd-select-option-group .sd-select__option-group__label-wrapper .sd-select__option-group-label{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}sd-select-option-group .sd-select__option-group__label-wrapper .sd-select__option-group__count-indicator{width:fit-content;flex-shrink:0;font-size:12px;font-weight:500;color:#888888}sd-select-option-group .sd-select__option-group--focused{background-color:#e6f1ff}sd-select-option-group .sd-select__option-group--selected.sd-select__option-group--item:not(:hover):not(.sd-select__option-group--use-checkbox),sd-select-option-group .sd-select__option-group--focused.sd-select__option-group--item:not(:hover):not(.sd-select__option-group--use-checkbox){color:#0075ff;font-weight:700}sd-select-option-group .sd-select__option-group--disabled{color:#aaaaaa;cursor:not-allowed}sd-select-option-group .sd-select__option-group:hover:not(.sd-select__option-group--disabled){background-color:#0075ff;color:white}sd-select-option-group .sd-select__option-group:hover.sd-select__option-group--selected:not(.sd-select__option-group--group):not(.sd-select__option-group--subgroup) sd-checkbox .sd-checkbox__bg{border-color:white !important}`;
6
-
7
- const SdSelectOptionGroup = class {
8
- constructor(hostRef) {
9
- index.registerInstance(this, hostRef);
10
- this.optionClick = index.createEvent(this, "optionClick");
11
- }
12
- get el() { return index.getElement(this); }
13
- option;
14
- index;
15
- isSelected = false;
16
- isFocused = false;
17
- optionStyle;
18
- disabled = false;
19
- useCheckbox = false;
20
- useIndicator = true;
21
- countInfo = {
22
- selectedCount: 0,
23
- totalCount: 0,
24
- };
25
- isHovered = false;
26
- async isDisabled() {
27
- return !!this.option.disabled || this.option.type === 'group' || this.option.type === 'subgroup';
28
- }
29
- optionClick;
30
- handleClick = (option, isSelected, event) => {
31
- event.stopPropagation();
32
- if (option.type === 'group' || option.type === 'subgroup') {
33
- this.optionClick.emit({
34
- option: this.option,
35
- isSelected,
36
- index: this.index,
37
- event,
38
- });
39
- return;
40
- }
41
- if (!this.option.disabled && !this.disabled) {
42
- this.optionClick.emit({
43
- option: this.option,
44
- isSelected,
45
- index: this.index,
46
- event,
47
- });
48
- }
49
- };
50
- render() {
51
- return (index.h("div", { key: 'db08c9cdb5179cccfa040fa03e06f286231bc83f', class: {
52
- 'sd-select__option-group': true,
53
- 'sd-select__option-group--selected': !!this.isSelected,
54
- 'sd-select__option-group--disabled': !!this.option.disabled,
55
- 'sd-select__option-group--focused': this.isFocused,
56
- 'sd-select__option-group--use-checkbox': this.useCheckbox,
57
- 'sd-select__option-group--group': this.option.type === 'group',
58
- 'sd-select__option-group--subgroup': this.option.type === 'subgroup',
59
- 'sd-select__option-group--item': this.option.type === 'item',
60
- }, onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), style: this.optionStyle, "data-index": this.index, onClick: event => this.handleClick(this.option, this.isSelected, event) }, index.h("div", { key: 'b723d71ef120c5d51f0ab859177d67814411ceaa', class: "sd-select__option-group__label-wrapper" }, this.useCheckbox && (index.h("sd-checkbox", { key: '1630dfc22fb2ec65c186282f499ec4e6f93a228d', checked: this.isSelected, disabled: this.option.disabled, onClick: e => {
61
- e.preventDefault();
62
- this.handleClick(this.option, this.isSelected, e);
63
- } })), index.h("span", { key: '97802250891eca095172dae897bb957e49f9b5e3', class: "sd-select__option-group-label" }, this.option.label), this.useIndicator && this.option.type !== 'item' && (index.h("span", { key: '96fe449b31bce677693f2ad325a6529fc4b264e3', class: "sd-select__option-group__count-indicator" }, `(${this.countInfo?.selectedCount}/${this.countInfo?.totalCount})`)))));
64
- }
65
- };
66
- SdSelectOptionGroup.style = sdSelectOptionGroupCss();
67
-
68
- exports.sd_select_option_group = SdSelectOptionGroup;
69
- //# sourceMappingURL=sd-select-option-group.entry.cjs.js.map
@@ -1,2 +0,0 @@
1
- import{r as e,h as t,H as s}from"./p-7X2nzJWz.js";const l=()=>`sd-td{display:table-cell;padding:12px 16px;vertical-align:middle;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}`;const d=class{constructor(t){e(this,t)}name="";align="left";tdStyle;tdClass;render(){return t(s,{key:"182bd00cbbb22b4f3613e973d2999421a3f5f2cd",role:"cell",class:{"sd-td":true,[`sd-td--${this.align}`]:true,[this.tdClass||""]:Boolean(this.tdClass)},style:this.tdStyle},t("slot",{key:"fff1a74106822c8092fa57ba785f6ab5be96edcd"}))}};d.style=l();export{d as sd_td};
2
- //# sourceMappingURL=p-1e7a06ef.entry.js.map
@@ -1,2 +0,0 @@
1
- import{r as d,h as t,H as c}from"./p-7X2nzJWz.js";const s=()=>`sd-tbody{display:table-row-group}`;const e=class{constructor(t){d(this,t)}render(){return t(c,{key:"96bedf612efa56d790df7070e2641f6769da81a9"},t("slot",{key:"9980c55cf76b1600034d8dcd60249b392c0c50f2"}))}};e.style=s();const o=()=>`sd-th{display:table-cell;padding:12px;font-weight:bold;text-align:left;border-bottom:2px solid #ddd;background-color:#f1f1f1}`;const r=class{constructor(t){d(this,t)}render(){return t(c,{key:"cbd2372809ca102893f62b3b4e2d51342cc4c52f",role:"columnheader"},t("slot",{key:"c51c2635013c8d405bf3d95d46d2b99bc52c3326"}))}};r.style=o();const b=()=>`sd-tr{display:table-row}`;const a=class{constructor(t){d(this,t)}render(){return t(c,{key:"228bb6d6b5225bd035cce96cd817beb9e2734ab4",role:"row"},t("slot",{key:"8906dfdeb89afb1028a30a5b16b034f6c2ba67b9"}))}};a.style=b();export{e as sd_tbody,r as sd_th,a as sd_tr};
2
- //# sourceMappingURL=p-761882f5.entry.js.map
@@ -1,2 +0,0 @@
1
- import{r as o,c as e,a as t,h as s}from"./p-7X2nzJWz.js";const p=()=>`sd-select-option-group{display:block;height:fit-content}sd-select-option-group .sd-select__option-group{display:flex;padding:4px 12px;padding-left:12px;font-size:12px;line-height:20px;cursor:pointer}sd-select-option-group .sd-select__option-group.sd-select__option-group--group:not(.sd-select__option-group--use-checkbox),sd-select-option-group .sd-select__option-group.sd-select__option-group--subgroup:not(.sd-select__option-group--use-checkbox){cursor:default !important}sd-select-option-group .sd-select__option-group.sd-select__option-group--group{background-color:#f5faff !important;color:#333333 !important;font-weight:700}sd-select-option-group .sd-select__option-group.sd-select__option-group--subgroup{padding-left:20px;background-color:#f9f9f9 !important;color:#333333 !important;font-weight:500}sd-select-option-group .sd-select__option-group.sd-select__option-group--item{padding-left:28px}sd-select-option-group .sd-select__option-group sd-checkbox__bg{border-color:#888888}sd-select-option-group .sd-select__option-group__label-wrapper{display:flex;width:100%;column-gap:8px;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}sd-select-option-group .sd-select__option-group__label-wrapper sd-checkbox{flex-shrink:0}sd-select-option-group .sd-select__option-group__label-wrapper .sd-select__option-group-label{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}sd-select-option-group .sd-select__option-group__label-wrapper .sd-select__option-group__count-indicator{width:fit-content;flex-shrink:0;font-size:12px;font-weight:500;color:#888888}sd-select-option-group .sd-select__option-group--focused{background-color:#e6f1ff}sd-select-option-group .sd-select__option-group--selected.sd-select__option-group--item:not(:hover):not(.sd-select__option-group--use-checkbox),sd-select-option-group .sd-select__option-group--focused.sd-select__option-group--item:not(:hover):not(.sd-select__option-group--use-checkbox){color:#0075ff;font-weight:700}sd-select-option-group .sd-select__option-group--disabled{color:#aaaaaa;cursor:not-allowed}sd-select-option-group .sd-select__option-group:hover:not(.sd-select__option-group--disabled){background-color:#0075ff;color:white}sd-select-option-group .sd-select__option-group:hover.sd-select__option-group--selected:not(.sd-select__option-group--group):not(.sd-select__option-group--subgroup) sd-checkbox .sd-checkbox__bg{border-color:white !important}`;const i=class{constructor(t){o(this,t);this.optionClick=e(this,"optionClick")}get el(){return t(this)}option;index;isSelected=false;isFocused=false;optionStyle;disabled=false;useCheckbox=false;useIndicator=true;countInfo={selectedCount:0,totalCount:0};isHovered=false;async isDisabled(){return!!this.option.disabled||this.option.type==="group"||this.option.type==="subgroup"}optionClick;handleClick=(o,e,t)=>{t.stopPropagation();if(o.type==="group"||o.type==="subgroup"){this.optionClick.emit({option:this.option,isSelected:e,index:this.index,event:t});return}if(!this.option.disabled&&!this.disabled){this.optionClick.emit({option:this.option,isSelected:e,index:this.index,event:t})}};render(){return s("div",{key:"db08c9cdb5179cccfa040fa03e06f286231bc83f",class:{"sd-select__option-group":true,"sd-select__option-group--selected":!!this.isSelected,"sd-select__option-group--disabled":!!this.option.disabled,"sd-select__option-group--focused":this.isFocused,"sd-select__option-group--use-checkbox":this.useCheckbox,"sd-select__option-group--group":this.option.type==="group","sd-select__option-group--subgroup":this.option.type==="subgroup","sd-select__option-group--item":this.option.type==="item"},onMouseEnter:()=>this.isHovered=true,onMouseLeave:()=>this.isHovered=false,style:this.optionStyle,"data-index":this.index,onClick:o=>this.handleClick(this.option,this.isSelected,o)},s("div",{key:"b723d71ef120c5d51f0ab859177d67814411ceaa",class:"sd-select__option-group__label-wrapper"},this.useCheckbox&&s("sd-checkbox",{key:"1630dfc22fb2ec65c186282f499ec4e6f93a228d",checked:this.isSelected,disabled:this.option.disabled,onClick:o=>{o.preventDefault();this.handleClick(this.option,this.isSelected,o)}}),s("span",{key:"97802250891eca095172dae897bb957e49f9b5e3",class:"sd-select__option-group-label"},this.option.label),this.useIndicator&&this.option.type!=="item"&&s("span",{key:"96fe449b31bce677693f2ad325a6529fc4b264e3",class:"sd-select__option-group__count-indicator"},`(${this.countInfo?.selectedCount}/${this.countInfo?.totalCount})`)))}};i.style=p();export{i as sd_select_option_group};
2
- //# sourceMappingURL=p-790ae9ce.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["registerInstance","createEvent","getElement","h","sdSelectOptionGroupCss","SdSelectOptionGroup","constructor","hostRef","this","optionClick","el","option","index","isSelected","isFocused","optionStyle","disabled","useCheckbox","useIndicator","countInfo","selectedCount","totalCount","isHovered","isDisabled","type","handleClick","event","stopPropagation","emit","render","key","class","onMouseEnter","onMouseLeave","style","onClick","checked","e","preventDefault","label"],"sources":["0"],"mappings":"YAAcA,OAAuBC,OAAkBC,OAAYC,MAAS,kBAE5E,MAAMC,EAAyB,IAAM,o5EAErC,MAAMC,EAAsB,MACxB,WAAAC,CAAYC,GACRP,EAAiBQ,KAAMD,GACvBC,KAAKC,YAAcR,EAAYO,KAAM,cACzC,CACA,MAAIE,GAAO,OAAOR,EAAWM,KAAO,CACpCG,OACAC,MACAC,WAAa,MACbC,UAAY,MACZC,YACAC,SAAW,MACXC,YAAc,MACdC,aAAe,KACfC,UAAY,CACRC,cAAe,EACfC,WAAY,GAEhBC,UAAY,MACZ,gBAAMC,GACF,QAASf,KAAKG,OAAOK,UAAYR,KAAKG,OAAOa,OAAS,SAAWhB,KAAKG,OAAOa,OAAS,UAC1F,CACAf,YACAgB,YAAc,CAACd,EAAQE,EAAYa,KAC/BA,EAAMC,kBACN,GAAIhB,EAAOa,OAAS,SAAWb,EAAOa,OAAS,WAAY,CACvDhB,KAAKC,YAAYmB,KAAK,CAClBjB,OAAQH,KAAKG,OACbE,aACAD,MAAOJ,KAAKI,MACZc,UAEJ,MACJ,CACA,IAAKlB,KAAKG,OAAOK,WAAaR,KAAKQ,SAAU,CACzCR,KAAKC,YAAYmB,KAAK,CAClBjB,OAAQH,KAAKG,OACbE,aACAD,MAAOJ,KAAKI,MACZc,SAER,GAEJ,MAAAG,GACI,OAAQ1B,EAAE,MAAO,CAAE2B,IAAK,2CAA4CC,MAAO,CACnE,0BAA2B,KAC3B,sCAAuCvB,KAAKK,WAC5C,sCAAuCL,KAAKG,OAAOK,SACnD,mCAAoCR,KAAKM,UACzC,wCAAyCN,KAAKS,YAC9C,iCAAkCT,KAAKG,OAAOa,OAAS,QACvD,oCAAqChB,KAAKG,OAAOa,OAAS,WAC1D,gCAAiChB,KAAKG,OAAOa,OAAS,QACvDQ,aAAc,IAAOxB,KAAKc,UAAY,KAAOW,aAAc,IAAOzB,KAAKc,UAAY,MAAQY,MAAO1B,KAAKO,YAAa,aAAcP,KAAKI,MAAOuB,QAAST,GAASlB,KAAKiB,YAAYjB,KAAKG,OAAQH,KAAKK,WAAYa,IAAUvB,EAAE,MAAO,CAAE2B,IAAK,2CAA4CC,MAAO,0CAA4CvB,KAAKS,aAAgBd,EAAE,cAAe,CAAE2B,IAAK,2CAA4CM,QAAS5B,KAAKK,WAAYG,SAAUR,KAAKG,OAAOK,SAAUmB,QAASE,IACneA,EAAEC,iBACF9B,KAAKiB,YAAYjB,KAAKG,OAAQH,KAAKK,WAAYwB,EAAE,IAC9ClC,EAAE,OAAQ,CAAE2B,IAAK,2CAA4CC,MAAO,iCAAmCvB,KAAKG,OAAO4B,OAAQ/B,KAAKU,cAAgBV,KAAKG,OAAOa,OAAS,QAAWrB,EAAE,OAAQ,CAAE2B,IAAK,2CAA4CC,MAAO,4CAA8C,IAAIvB,KAAKW,WAAWC,iBAAiBZ,KAAKW,WAAWE,gBACtW,GAEJhB,EAAoB6B,MAAQ9B,WAEnBC","ignoreList":[]}
@@ -1,2 +0,0 @@
1
- import{r as e,a as s,h as t,F as o}from"./p-7X2nzJWz.js";import{T as a}from"./p-CdbtuKYR.js";const i=()=>`.sd-popover{position:relative;cursor:pointer;display:inline-block}`;const c=class{constructor(s){e(this,s)}get el(){return s(this)}show=false;placement="bottom";color="#01BB4B";icon="helpOutline";iconSize=12;label="";buttonSize="sm";buttonVariant="primary";menuTitle;messages=[];buttons=[];menuClass="";noHover=true;useClose=false;showPopover=false;slotContent="";watchShowHandler(e){this.showPopover=e}componentWillLoad(){this.showPopover=this.show;this.slotContent=this.el.innerHTML}buttonEl;handleClose=()=>{this.showPopover=false};render(){return t(o,{key:"fa06f3ff6641006a75c3ed0912f8f2dc6ca2da56"},this.label?t("sd-button",{ref:e=>this.buttonEl=e,label:this.label,icon:this.icon,size:this.buttonSize,color:this.color,variant:this.buttonVariant,class:"sd-popover",onClick:()=>this.showPopover=!this.showPopover}):t("sd-icon",{ref:e=>this.buttonEl=e,name:this.icon,size:this.iconSize,color:this.color,class:"sd-popover",onClick:()=>this.showPopover=!this.showPopover}),this.showPopover&&t("sd-tooltip-portal",{key:"f433e3bc5e325bf9d70fae10b6777fe77e52061f",parentRef:this.buttonEl,onSdClose:this.handleClose,placement:this.placement},t("div",{key:"7fa463878475d3c2ce86d006912c35b585d7bed0",class:{"sd-popover-menu":true,[`sd-popover-menu--${this.placement}`]:true,[this.menuClass]:!!this.menuClass}},t("i",{key:"90a23aea2730ec9dbc2b9ca77ef0a4ef13777006",class:`sd-popover-menu__arrow sd-popover-menu__arrow--${this.placement}`},t(a,{key:"9246c25e04ea2dd6716e20ac01060ff7acc23fa9"})),t("div",{key:"dd6f350fbb5f5a49302593b3c24faf6bf59bb9ec",class:"sd-popover-menu__content"},this.menuTitle&&t("div",{key:"c9aae4e0eaa0e1ab4f1447907f2dbe0e6e988bbf",class:"sd-popover-menu__title"},this.menuTitle),this.messages.length>0&&t("div",{key:"2ed497a7d543f4638756524b4062c9df57b20aa0",class:"sd-popover-menu__messages"},this.messages.map((e=>t("div",null,e)))),this.buttons.length>0&&t("div",{key:"5ddf4ec18128bc58c77a3017fc1a621591adb67b",class:`sd-popover-menu__buttons sd-popover-menu__buttons--${this.buttons.length}`},this.buttons.map((e=>t("sd-button",{...e}))))),this.useClose&&t("button",{key:"e7bbb527601bda49a4d4e5c28a555acb5714bd5b",class:"sd-popover-menu__close-button",onClick:()=>this.handleClose()},t("sd-icon",{key:"0e0ec3542195f3eb6955ef68ab82d947460271d3",name:"close",size:"12",color:"#AAAAAA"})))))}static get watchers(){return{show:["watchShowHandler"]}}};c.style=i();export{c as sd_popover};
2
- //# sourceMappingURL=p-a8e8fc17.entry.js.map