@sellmate/design-system 0.0.56 → 1.0.0

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 (494) hide show
  1. package/dist/cjs/{select-keyboard-navigation-6fO_V4En.js → base-dropdown-event-Dc6AuxR4.js} +26 -26
  2. package/dist/cjs/base-dropdown-event-Dc6AuxR4.js.map +1 -0
  3. package/dist/cjs/design-system.cjs.js +2 -2
  4. package/dist/cjs/{index-B7tkxTye.js → index-D_J8ScR5.js} +3 -3
  5. package/dist/cjs/index-D_J8ScR5.js.map +1 -0
  6. package/dist/cjs/loader.cjs.js +2 -2
  7. package/dist/cjs/{resolveColor-DxvExwgo.js → resolveColor-B7Ku3IGq.js} +4 -5
  8. package/dist/{esm/resolveColor-BYf-ybt2.js.map → cjs/resolveColor-B7Ku3IGq.js.map} +1 -1
  9. package/dist/cjs/sd-badge.cjs.entry.js +4 -4
  10. package/dist/cjs/{sd-button_24.cjs.entry.js → sd-button_6.cjs.entry.js} +292 -2842
  11. package/dist/cjs/sd-card.cjs.entry.js +3 -3
  12. package/dist/cjs/sd-checkbox.cjs.entry.js +89 -0
  13. package/dist/cjs/sd-date-box.cjs.entry.js +10 -10
  14. package/dist/cjs/sd-date-picker.cjs.entry.js +5 -5
  15. package/dist/cjs/sd-date-range-picker.cjs.entry.js +8 -8
  16. package/dist/cjs/sd-field_3.cjs.entry.js +422 -0
  17. package/dist/cjs/sd-file-picker.cjs.entry.js +121 -0
  18. package/dist/cjs/sd-form.cjs.entry.js +74 -0
  19. package/dist/cjs/sd-guide.cjs.entry.js +81 -0
  20. package/dist/cjs/sd-loading-spinner_2.cjs.entry.js +195 -0
  21. package/dist/cjs/sd-modal-card.cjs.entry.js +8 -8
  22. package/dist/cjs/sd-number-input.cjs.entry.js +261 -0
  23. package/dist/cjs/sd-popover.cjs.entry.js +7 -7
  24. package/dist/cjs/sd-progress.cjs.entry.js +3 -3
  25. package/dist/cjs/sd-radio-button-group.cjs.entry.js +8 -21
  26. package/dist/cjs/sd-radio-group.cjs.entry.js +71 -0
  27. package/dist/cjs/sd-select-dropdown_3.cjs.entry.js +266 -0
  28. package/dist/cjs/sd-select-multiple-group.cjs.entry.js +446 -0
  29. package/dist/cjs/sd-select-multiple.cjs.entry.js +74 -152
  30. package/dist/cjs/sd-select-option-group.cjs.entry.js +69 -0
  31. package/dist/cjs/sd-table.cjs.entry.js +515 -85
  32. package/dist/cjs/sd-tabs.cjs.entry.js +66 -0
  33. package/dist/cjs/sd-tag.cjs.entry.js +57 -0
  34. package/dist/cjs/sd-toast-message.cjs.entry.js +61 -0
  35. package/dist/cjs/sd-toggle-button.cjs.entry.js +50 -0
  36. package/dist/cjs/sd-toggle.cjs.entry.js +46 -0
  37. package/dist/cjs/{tooltipArrow-8I9A3AOE.js → tooltipArrow-DU2DB2AD.js} +3 -3
  38. package/dist/cjs/{tooltipArrow-8I9A3AOE.js.map → tooltipArrow-DU2DB2AD.js.map} +1 -1
  39. package/dist/collection/collection-manifest.json +7 -8
  40. package/dist/collection/components/sd-badge/sd-badge.css +8 -9
  41. package/dist/collection/components/sd-badge/sd-badge.js +1 -2
  42. package/dist/collection/components/sd-badge/sd-badge.js.map +1 -1
  43. package/dist/collection/components/sd-button/sd-button.css +2 -1
  44. package/dist/collection/components/sd-button/sd-button.js +2 -34
  45. package/dist/collection/components/sd-button/sd-button.js.map +1 -1
  46. package/dist/collection/components/sd-card/sd-card.css +1 -0
  47. package/dist/collection/components/sd-card/sd-card.js +1 -1
  48. package/dist/collection/components/sd-checkbox/sd-checkbox.js +16 -16
  49. package/dist/collection/components/sd-checkbox/sd-checkbox.js.map +1 -1
  50. package/dist/collection/components/sd-date-box/sd-date-box.css +1 -0
  51. package/dist/collection/components/sd-date-box/sd-date-box.js +8 -8
  52. package/dist/collection/components/sd-date-box/sd-date-box.js.map +1 -1
  53. package/dist/collection/components/sd-date-picker/sd-date-picker.js +5 -5
  54. package/dist/collection/components/sd-date-picker/sd-date-picker.js.map +1 -1
  55. package/dist/collection/components/sd-date-range-picker/sd-date-range-picker.css +9 -6
  56. package/dist/collection/components/sd-date-range-picker/sd-date-range-picker.js +8 -8
  57. package/dist/collection/components/sd-date-range-picker/sd-date-range-picker.js.map +1 -1
  58. package/dist/collection/components/sd-field/sd-field.css +100 -0
  59. package/dist/collection/components/sd-field/sd-field.js +472 -0
  60. package/dist/collection/components/sd-field/sd-field.js.map +1 -0
  61. package/dist/collection/components/sd-file-picker/sd-file-picker.css +6 -0
  62. package/dist/collection/components/sd-file-picker/sd-file-picker.js +8 -8
  63. package/dist/collection/components/sd-file-picker/sd-file-picker.js.map +1 -1
  64. package/dist/collection/components/sd-floating-portal/sd-floating-portal.css +103 -0
  65. package/dist/collection/components/{sd-tooltip-portal/sd-tooltip-portal.js → sd-floating-portal/sd-floating-portal.js} +18 -9
  66. package/dist/collection/components/sd-floating-portal/sd-floating-portal.js.map +1 -0
  67. package/dist/collection/components/sd-form/sd-form.js +200 -0
  68. package/dist/collection/components/sd-form/sd-form.js.map +1 -0
  69. package/dist/collection/components/sd-guide/sd-guide.css +3 -2
  70. package/dist/collection/components/sd-guide/sd-guide.js +7 -8
  71. package/dist/collection/components/sd-guide/sd-guide.js.map +1 -1
  72. package/dist/collection/components/sd-icon/sd-icon.js +1 -1
  73. package/dist/collection/components/sd-input/sd-input.css +43 -100
  74. package/dist/collection/components/sd-input/sd-input.js +285 -114
  75. package/dist/collection/components/sd-input/sd-input.js.map +1 -1
  76. package/dist/collection/components/sd-loading-spinner/sd-loading-spinner.js +1 -1
  77. package/dist/collection/components/sd-modal-card/sd-modal-card.css +1 -0
  78. package/dist/collection/components/sd-modal-card/sd-modal-card.js +5 -5
  79. package/dist/collection/components/sd-modal-card/sd-modal-card.js.map +1 -1
  80. package/dist/collection/components/sd-number-input/sd-number-input.js +18 -84
  81. package/dist/collection/components/sd-number-input/sd-number-input.js.map +1 -1
  82. package/dist/collection/components/sd-pagination/sd-pagination.js +4 -3
  83. package/dist/collection/components/sd-pagination/sd-pagination.js.map +1 -1
  84. package/dist/collection/components/sd-popover/sd-popover.css +2 -2
  85. package/dist/collection/components/sd-popover/sd-popover.js +4 -5
  86. package/dist/collection/components/sd-popover/sd-popover.js.map +1 -1
  87. package/dist/collection/components/sd-portal/sd-portal.js +4 -4
  88. package/dist/collection/components/sd-portal/sd-portal.js.map +1 -1
  89. package/dist/collection/components/sd-progress/sd-progress.js +2 -2
  90. package/dist/collection/components/sd-radio-button-group/sd-radio-button-group.js +9 -30
  91. package/dist/collection/components/sd-radio-button-group/sd-radio-button-group.js.map +1 -1
  92. package/dist/collection/components/sd-radio-group/sd-radio-group.js +5 -5
  93. package/dist/collection/components/sd-radio-group/sd-radio-group.js.map +1 -1
  94. package/dist/collection/components/sd-select/sd-select-dropdown/sd-select-dropdown.css +52 -0
  95. package/dist/collection/components/sd-select/sd-select-dropdown/sd-select-dropdown.js +441 -0
  96. package/dist/collection/components/sd-select/sd-select-dropdown/sd-select-dropdown.js.map +1 -0
  97. package/dist/collection/components/sd-select/sd-select-option/sd-select-option.js +4 -4
  98. package/dist/collection/components/sd-select/sd-select-option/sd-select-option.js.map +1 -1
  99. package/dist/collection/components/sd-select/sd-select-search-input/sd-select-search-input.css +11 -3
  100. package/dist/collection/components/sd-select/sd-select-search-input/sd-select-search-input.js +15 -15
  101. package/dist/collection/components/sd-select/sd-select-search-input/sd-select-search-input.js.map +1 -1
  102. package/dist/collection/components/sd-select/sd-select.css +9 -97
  103. package/dist/collection/components/sd-select/sd-select.js +320 -219
  104. package/dist/collection/components/sd-select/sd-select.js.map +1 -1
  105. package/dist/collection/components/sd-select-multiple/sd-select-multiple.css +16 -102
  106. package/dist/collection/components/sd-select-multiple/sd-select-multiple.js +328 -179
  107. package/dist/collection/components/sd-select-multiple/sd-select-multiple.js.map +1 -1
  108. package/dist/collection/components/sd-select-multiple-group/sd-select-multiple-group.css +8 -45
  109. package/dist/collection/components/sd-select-multiple-group/sd-select-multiple-group.js +265 -47
  110. package/dist/collection/components/sd-select-multiple-group/sd-select-multiple-group.js.map +1 -1
  111. package/dist/collection/components/sd-select-multiple-group/sd-select-option-group/sd-select-option-group.js +3 -3
  112. package/dist/collection/components/sd-select-multiple-group/sd-select-option-group/sd-select-option-group.js.map +1 -1
  113. package/dist/collection/components/sd-table/sd-table.css +121 -30
  114. package/dist/collection/components/sd-table/sd-table.js +629 -92
  115. package/dist/collection/components/sd-table/sd-table.js.map +1 -1
  116. package/dist/collection/components/sd-tabs/sd-tabs.css +10 -7
  117. package/dist/collection/components/sd-tabs/sd-tabs.js +10 -17
  118. package/dist/collection/components/sd-tabs/sd-tabs.js.map +1 -1
  119. package/dist/collection/components/sd-tag/sd-tag.js +1 -1
  120. package/dist/collection/components/sd-textarea/sd-textarea.css +66 -0
  121. package/dist/collection/components/sd-textarea/sd-textarea.js +400 -0
  122. package/dist/collection/components/sd-textarea/sd-textarea.js.map +1 -0
  123. package/dist/collection/components/sd-toast-message/sd-toast-message.js +11 -11
  124. package/dist/collection/components/sd-toast-message/sd-toast-message.js.map +1 -1
  125. package/dist/collection/components/sd-toggle/sd-toggle.js +8 -14
  126. package/dist/collection/components/sd-toggle/sd-toggle.js.map +1 -1
  127. package/dist/collection/components/sd-toggle-button/sd-toggle-button.js +5 -5
  128. package/dist/collection/components/sd-toggle-button/sd-toggle-button.js.map +1 -1
  129. package/dist/collection/components/sd-tooltip/sd-tooltip.css +6 -65
  130. package/dist/collection/components/sd-tooltip/sd-tooltip.js +12 -29
  131. package/dist/collection/components/sd-tooltip/sd-tooltip.js.map +1 -1
  132. package/dist/collection/types/select.js.map +1 -1
  133. package/dist/components/index.js +1 -1
  134. package/dist/components/p-7xekTQRB.js +104 -0
  135. package/dist/components/p-7xekTQRB.js.map +1 -0
  136. package/dist/components/{p-BDkKpeVz.js → p-BKSlQGJv.js} +3 -3
  137. package/dist/components/{p-BDkKpeVz.js.map → p-BKSlQGJv.js.map} +1 -1
  138. package/dist/components/{p-C5U6Otnl.js → p-CVMprLsE.js} +17 -15
  139. package/dist/components/p-CVMprLsE.js.map +1 -0
  140. package/dist/components/p-CdGD6AqM.js +92 -0
  141. package/dist/components/p-CdGD6AqM.js.map +1 -0
  142. package/dist/components/p-CpRkV7pg.js +201 -0
  143. package/dist/components/p-CpRkV7pg.js.map +1 -0
  144. package/dist/components/p-D2movWkD.js +289 -0
  145. package/dist/components/p-D2movWkD.js.map +1 -0
  146. package/dist/components/p-D54IEoI6.js +238 -0
  147. package/dist/components/p-D54IEoI6.js.map +1 -0
  148. package/dist/components/{p-B8yBkdjE.js → p-DbebUQwg.js} +7 -7
  149. package/dist/components/{p-B8yBkdjE.js.map → p-DbebUQwg.js.map} +1 -1
  150. package/dist/components/{p-BYf-ybt2.js → p-DcGvp3RM.js} +5 -5
  151. package/dist/components/p-DcGvp3RM.js.map +1 -0
  152. package/dist/components/{p-CfivfPAO.js → p-DdKGhMHk.js} +5 -5
  153. package/dist/components/{p-CfivfPAO.js.map → p-DdKGhMHk.js.map} +1 -1
  154. package/dist/components/{p-BxPT3VKO.js → p-DlJtPR_C.js} +12 -12
  155. package/dist/components/p-DlJtPR_C.js.map +1 -0
  156. package/dist/components/{p-BHHbLFXg.js → p-DnQF6htq.js} +5 -5
  157. package/dist/components/{p-BHHbLFXg.js.map → p-DnQF6htq.js.map} +1 -1
  158. package/dist/components/{p-BA38jFi5.js → p-DssRJcAn.js} +4 -4
  159. package/dist/components/{p-BA38jFi5.js.map → p-DssRJcAn.js.map} +1 -1
  160. package/dist/components/{p-B3H_uLbl.js → p-Dt-KAeBx.js} +3 -3
  161. package/dist/components/{p-B3H_uLbl.js.map → p-Dt-KAeBx.js.map} +1 -1
  162. package/dist/components/{p-BREduhZA.js → p-DxSmO6Tr.js} +8 -7
  163. package/dist/components/p-DxSmO6Tr.js.map +1 -0
  164. package/dist/components/{p-O3tgQfvT.js → p-JF61vPAh.js} +9 -9
  165. package/dist/components/p-JF61vPAh.js.map +1 -0
  166. package/dist/components/p-RhBqdixM.js +102 -0
  167. package/dist/components/p-RhBqdixM.js.map +1 -0
  168. package/dist/components/{p-Bj4u0G5b.js → p-UZEmuyIR.js} +19 -19
  169. package/dist/components/p-UZEmuyIR.js.map +1 -0
  170. package/dist/components/{p-CQBrru3e.js → p-YLoygqPr.js} +3 -3
  171. package/dist/components/p-YLoygqPr.js.map +1 -0
  172. package/dist/components/p-s4Mg_xSz.js +260 -0
  173. package/dist/components/p-s4Mg_xSz.js.map +1 -0
  174. package/dist/components/{p-w5tohH2H.js → p-zvZtN3nR.js} +8 -8
  175. package/dist/components/{p-w5tohH2H.js.map → p-zvZtN3nR.js.map} +1 -1
  176. package/dist/components/sd-badge.js +5 -5
  177. package/dist/components/sd-badge.js.map +1 -1
  178. package/dist/components/sd-button.js +1 -1
  179. package/dist/components/sd-card.js +3 -3
  180. package/dist/components/sd-card.js.map +1 -1
  181. package/dist/components/sd-checkbox.js +1 -1
  182. package/dist/components/sd-date-box.js +1 -1
  183. package/dist/components/sd-date-picker.js +37 -13
  184. package/dist/components/sd-date-picker.js.map +1 -1
  185. package/dist/components/sd-date-range-picker.js +41 -17
  186. package/dist/components/sd-date-range-picker.js.map +1 -1
  187. package/dist/components/{sd-td.d.ts → sd-field.d.ts} +4 -4
  188. package/dist/components/sd-field.js +9 -0
  189. package/dist/components/sd-field.js.map +1 -0
  190. package/dist/components/sd-file-picker.js +10 -10
  191. package/dist/components/sd-file-picker.js.map +1 -1
  192. package/dist/components/{sd-table-backup.d.ts → sd-floating-portal.d.ts} +4 -4
  193. package/dist/components/sd-floating-portal.js +9 -0
  194. package/dist/components/sd-floating-portal.js.map +1 -0
  195. package/dist/components/{sd-th.d.ts → sd-form.d.ts} +4 -4
  196. package/dist/components/sd-form.js +99 -0
  197. package/dist/components/sd-form.js.map +1 -0
  198. package/dist/components/sd-guide.js +12 -13
  199. package/dist/components/sd-guide.js.map +1 -1
  200. package/dist/components/sd-icon.js +1 -1
  201. package/dist/components/sd-input.js +1 -1
  202. package/dist/components/sd-loading-spinner.js +1 -1
  203. package/dist/components/sd-modal-card.js +10 -10
  204. package/dist/components/sd-modal-card.js.map +1 -1
  205. package/dist/components/sd-number-input.js +19 -43
  206. package/dist/components/sd-number-input.js.map +1 -1
  207. package/dist/components/sd-pagination.js +1 -1
  208. package/dist/components/sd-popover.js +14 -15
  209. package/dist/components/sd-popover.js.map +1 -1
  210. package/dist/components/sd-portal.js +1 -1
  211. package/dist/components/sd-progress.js +3 -3
  212. package/dist/components/sd-radio-button-group.js +10 -26
  213. package/dist/components/sd-radio-button-group.js.map +1 -1
  214. package/dist/components/sd-radio-group.js +5 -5
  215. package/dist/components/sd-radio-group.js.map +1 -1
  216. package/dist/components/{sd-tbody.d.ts → sd-select-dropdown.d.ts} +4 -4
  217. package/dist/components/sd-select-dropdown.js +9 -0
  218. package/dist/components/sd-select-dropdown.js.map +1 -0
  219. package/dist/components/sd-select-multiple-group.js +97 -40
  220. package/dist/components/sd-select-multiple-group.js.map +1 -1
  221. package/dist/components/sd-select-multiple.js +133 -168
  222. package/dist/components/sd-select-multiple.js.map +1 -1
  223. package/dist/components/sd-select-option-group.js +1 -1
  224. package/dist/components/sd-select-option.js +1 -1
  225. package/dist/components/sd-select-search-input.js +1 -1
  226. package/dist/components/sd-select.js +1 -1
  227. package/dist/components/sd-table.js +555 -113
  228. package/dist/components/sd-table.js.map +1 -1
  229. package/dist/components/sd-tabs.js +13 -16
  230. package/dist/components/sd-tabs.js.map +1 -1
  231. package/dist/components/sd-tag.js +1 -1
  232. package/dist/components/{sd-tr.d.ts → sd-textarea.d.ts} +4 -4
  233. package/dist/components/sd-textarea.js +145 -0
  234. package/dist/components/sd-textarea.js.map +1 -0
  235. package/dist/components/sd-toast-message.js +14 -14
  236. package/dist/components/sd-toast-message.js.map +1 -1
  237. package/dist/components/sd-toggle-button.js +5 -5
  238. package/dist/components/sd-toggle-button.js.map +1 -1
  239. package/dist/components/sd-toggle.js +9 -11
  240. package/dist/components/sd-toggle.js.map +1 -1
  241. package/dist/components/sd-tooltip.js +1 -1
  242. package/dist/design-system/design-system.css +1 -1
  243. package/dist/design-system/design-system.esm.js +1 -1
  244. package/dist/design-system/p-02e23509.entry.js +2 -0
  245. package/dist/design-system/p-02e23509.entry.js.map +1 -0
  246. package/dist/design-system/p-0a2f733d.entry.js +2 -0
  247. package/dist/design-system/p-0a2f733d.entry.js.map +1 -0
  248. package/dist/design-system/p-0d3f019d.entry.js +2 -0
  249. package/dist/design-system/p-0d3f019d.entry.js.map +1 -0
  250. package/dist/design-system/p-15dd1289.entry.js +2 -0
  251. package/dist/design-system/p-15dd1289.entry.js.map +1 -0
  252. package/dist/design-system/p-216c6543.entry.js +2 -0
  253. package/dist/design-system/p-216c6543.entry.js.map +1 -0
  254. package/dist/design-system/p-2400d67b.entry.js +2 -0
  255. package/dist/design-system/p-2400d67b.entry.js.map +1 -0
  256. package/dist/design-system/p-282f4087.entry.js +2 -0
  257. package/dist/design-system/{p-ddfe63b8.entry.js.map → p-282f4087.entry.js.map} +1 -1
  258. package/dist/design-system/{p-b5720c60.entry.js → p-388d5b9f.entry.js} +2 -2
  259. package/dist/design-system/p-4d7bb5b6.entry.js +2 -0
  260. package/dist/design-system/p-4d7bb5b6.entry.js.map +1 -0
  261. package/dist/design-system/p-53972259.entry.js +2 -0
  262. package/dist/design-system/p-53972259.entry.js.map +1 -0
  263. package/dist/design-system/p-6277b220.entry.js +2 -0
  264. package/dist/design-system/p-6277b220.entry.js.map +1 -0
  265. package/dist/design-system/p-652c4d37.entry.js +2 -0
  266. package/dist/design-system/p-652c4d37.entry.js.map +1 -0
  267. package/dist/design-system/p-661c4553.entry.js +2 -0
  268. package/dist/design-system/p-661c4553.entry.js.map +1 -0
  269. package/dist/design-system/p-686958c5.entry.js +2 -0
  270. package/dist/design-system/p-686958c5.entry.js.map +1 -0
  271. package/dist/design-system/p-811c5aa4.entry.js +2 -0
  272. package/dist/design-system/p-811c5aa4.entry.js.map +1 -0
  273. package/dist/design-system/p-827ca975.entry.js +2 -0
  274. package/dist/design-system/p-827ca975.entry.js.map +1 -0
  275. package/dist/design-system/p-8df72aa2.entry.js +2 -0
  276. package/dist/design-system/p-8df72aa2.entry.js.map +1 -0
  277. package/dist/design-system/p-9d2459ed.entry.js +2 -0
  278. package/dist/design-system/p-9d2459ed.entry.js.map +1 -0
  279. package/dist/design-system/p-BShXSO5x.js +2 -0
  280. package/dist/design-system/p-BShXSO5x.js.map +1 -0
  281. package/dist/design-system/{p-7X2nzJWz.js → p-C3qNZ7Qh.js} +3 -3
  282. package/dist/design-system/p-C3qNZ7Qh.js.map +1 -0
  283. package/dist/design-system/{p-CdbtuKYR.js → p-DPxE68eG.js} +2 -2
  284. package/dist/design-system/{p-CdbtuKYR.js.map → p-DPxE68eG.js.map} +1 -1
  285. package/dist/design-system/{p-BYf-ybt2.js → p-DcGvp3RM.js} +2 -2
  286. package/dist/design-system/{p-BYf-ybt2.js.map → p-DcGvp3RM.js.map} +1 -1
  287. package/dist/design-system/p-a7d4c6bd.entry.js +2 -0
  288. package/dist/design-system/p-a7d4c6bd.entry.js.map +1 -0
  289. package/dist/design-system/p-ac29c52c.entry.js +2 -0
  290. package/dist/design-system/p-ac29c52c.entry.js.map +1 -0
  291. package/dist/design-system/{p-7a424f6b.entry.js → p-b0277422.entry.js} +2 -2
  292. package/dist/design-system/p-b0277422.entry.js.map +1 -0
  293. package/dist/design-system/p-c25c4bd6.entry.js +2 -0
  294. package/dist/design-system/p-c25c4bd6.entry.js.map +1 -0
  295. package/dist/design-system/p-c3061828.entry.js +2 -0
  296. package/dist/design-system/p-c3061828.entry.js.map +1 -0
  297. package/dist/design-system/p-cde56c79.entry.js +2 -0
  298. package/dist/design-system/{p-5576f0f0.entry.js.map → p-cde56c79.entry.js.map} +1 -1
  299. package/dist/design-system/p-d77422e4.entry.js +2 -0
  300. package/dist/design-system/p-d77422e4.entry.js.map +1 -0
  301. package/dist/design-system/p-dc410414.entry.js +2 -0
  302. package/dist/design-system/p-dc410414.entry.js.map +1 -0
  303. package/dist/design-system/p-f254b09a.entry.js +2 -0
  304. package/dist/design-system/p-f254b09a.entry.js.map +1 -0
  305. package/dist/design-system/p-f3287206.entry.js +2 -0
  306. package/dist/design-system/p-f3287206.entry.js.map +1 -0
  307. package/dist/esm/{select-keyboard-navigation-C2JaR3A6.js → base-dropdown-event-BShXSO5x.js} +26 -26
  308. package/dist/esm/base-dropdown-event-BShXSO5x.js.map +1 -0
  309. package/dist/esm/design-system.js +3 -3
  310. package/dist/esm/{index-7X2nzJWz.js → index-C3qNZ7Qh.js} +3 -3
  311. package/dist/esm/index-C3qNZ7Qh.js.map +1 -0
  312. package/dist/esm/loader.js +3 -3
  313. package/dist/esm/{resolveColor-BYf-ybt2.js → resolveColor-DcGvp3RM.js} +5 -5
  314. package/dist/{cjs/resolveColor-DxvExwgo.js.map → esm/resolveColor-DcGvp3RM.js.map} +1 -1
  315. package/dist/esm/sd-badge.entry.js +4 -4
  316. package/dist/esm/sd-badge.entry.js.map +1 -1
  317. package/dist/esm/{sd-button_24.entry.js → sd-button_6.entry.js} +291 -2823
  318. package/dist/esm/sd-card.entry.js +3 -3
  319. package/dist/esm/sd-card.entry.js.map +1 -1
  320. package/dist/esm/sd-checkbox.entry.js +87 -0
  321. package/dist/esm/sd-checkbox.entry.js.map +1 -0
  322. package/dist/esm/sd-date-box.entry.js +10 -10
  323. package/dist/esm/sd-date-box.entry.js.map +1 -1
  324. package/dist/esm/sd-date-picker.entry.js +5 -5
  325. package/dist/esm/sd-date-picker.entry.js.map +1 -1
  326. package/dist/esm/sd-date-range-picker.entry.js +8 -8
  327. package/dist/esm/sd-date-range-picker.entry.js.map +1 -1
  328. package/dist/esm/sd-field_3.entry.js +418 -0
  329. package/dist/esm/sd-file-picker.entry.js +119 -0
  330. package/dist/esm/sd-file-picker.entry.js.map +1 -0
  331. package/dist/esm/sd-form.entry.js +72 -0
  332. package/dist/esm/sd-form.entry.js.map +1 -0
  333. package/dist/esm/sd-guide.entry.js +79 -0
  334. package/dist/esm/sd-guide.entry.js.map +1 -0
  335. package/dist/esm/sd-loading-spinner_2.entry.js +192 -0
  336. package/dist/esm/sd-modal-card.entry.js +8 -8
  337. package/dist/esm/sd-modal-card.entry.js.map +1 -1
  338. package/dist/esm/sd-number-input.entry.js +259 -0
  339. package/dist/esm/sd-number-input.entry.js.map +1 -0
  340. package/dist/esm/sd-popover.entry.js +7 -7
  341. package/dist/esm/sd-popover.entry.js.map +1 -1
  342. package/dist/esm/sd-progress.entry.js +3 -3
  343. package/dist/esm/sd-radio-button-group.entry.js +8 -21
  344. package/dist/esm/sd-radio-button-group.entry.js.map +1 -1
  345. package/dist/esm/sd-radio-group.entry.js +69 -0
  346. package/dist/esm/sd-radio-group.entry.js.map +1 -0
  347. package/dist/esm/sd-select-dropdown_3.entry.js +262 -0
  348. package/dist/esm/sd-select-multiple-group.entry.js +444 -0
  349. package/dist/esm/sd-select-multiple-group.entry.js.map +1 -0
  350. package/dist/esm/sd-select-multiple.entry.js +72 -150
  351. package/dist/esm/sd-select-multiple.entry.js.map +1 -1
  352. package/dist/esm/sd-select-option-group.entry.js +67 -0
  353. package/dist/esm/sd-select-option-group.entry.js.map +1 -0
  354. package/dist/esm/sd-table.entry.js +515 -85
  355. package/dist/esm/sd-table.entry.js.map +1 -1
  356. package/dist/esm/sd-tabs.entry.js +64 -0
  357. package/dist/esm/sd-tabs.entry.js.map +1 -0
  358. package/dist/esm/sd-tag.entry.js +55 -0
  359. package/dist/esm/sd-tag.entry.js.map +1 -0
  360. package/dist/esm/sd-toast-message.entry.js +59 -0
  361. package/dist/esm/sd-toast-message.entry.js.map +1 -0
  362. package/dist/esm/sd-toggle-button.entry.js +48 -0
  363. package/dist/esm/sd-toggle-button.entry.js.map +1 -0
  364. package/dist/esm/sd-toggle.entry.js +44 -0
  365. package/dist/esm/sd-toggle.entry.js.map +1 -0
  366. package/dist/esm/{tooltipArrow-DFRZWz6D.js → tooltipArrow-Ck_14rXC.js} +3 -3
  367. package/dist/esm/{tooltipArrow-DFRZWz6D.js.map → tooltipArrow-Ck_14rXC.js.map} +1 -1
  368. package/dist/types/components/sd-button/sd-button.d.ts +0 -3
  369. package/dist/types/components/sd-checkbox/sd-checkbox.d.ts +2 -2
  370. package/dist/types/components/sd-date-box/sd-date-box.d.ts +2 -2
  371. package/dist/types/components/sd-date-picker/sd-date-picker.d.ts +1 -1
  372. package/dist/types/components/sd-date-range-picker/sd-date-range-picker.d.ts +1 -1
  373. package/dist/types/components/sd-field/sd-field.d.ts +34 -0
  374. package/dist/types/components/sd-file-picker/sd-file-picker.d.ts +1 -1
  375. package/dist/types/components/{sd-tooltip-portal/sd-tooltip-portal.d.ts → sd-floating-portal/sd-floating-portal.d.ts} +2 -2
  376. package/dist/types/components/sd-form/sd-form.d.ts +23 -0
  377. package/dist/types/components/sd-input/sd-input.d.ts +23 -14
  378. package/dist/types/components/sd-modal-card/sd-modal-card.d.ts +2 -2
  379. package/dist/types/components/sd-number-input/sd-number-input.d.ts +4 -14
  380. package/dist/types/components/sd-portal/sd-portal.d.ts +1 -1
  381. package/dist/types/components/sd-radio-button-group/sd-radio-button-group.d.ts +2 -4
  382. package/dist/types/components/sd-radio-group/sd-radio-group.d.ts +1 -1
  383. package/dist/types/components/sd-select/sd-select-dropdown/sd-select-dropdown.d.ts +41 -0
  384. package/dist/types/components/sd-select/sd-select-option/sd-select-option.d.ts +1 -1
  385. package/dist/types/components/sd-select/sd-select-search-input/sd-select-search-input.d.ts +4 -4
  386. package/dist/types/components/sd-select/sd-select.d.ts +28 -21
  387. package/dist/types/components/sd-select-multiple/sd-select-multiple.d.ts +26 -20
  388. package/dist/types/components/sd-select-multiple-group/sd-select-multiple-group.d.ts +19 -4
  389. package/dist/types/components/sd-table/sd-table.d.ts +62 -3
  390. package/dist/types/components/sd-tabs/sd-tabs.d.ts +1 -2
  391. package/dist/types/components/sd-textarea/sd-textarea.d.ts +32 -0
  392. package/dist/types/components/sd-toast-message/sd-toast-message.d.ts +3 -3
  393. package/dist/types/components/sd-toggle/sd-toggle.d.ts +1 -2
  394. package/dist/types/components/sd-toggle-button/sd-toggle-button.d.ts +1 -1
  395. package/dist/types/components/sd-tooltip/sd-tooltip.d.ts +14 -2
  396. package/dist/types/components.d.ts +703 -397
  397. package/dist/types/types/form.d.ts +1 -0
  398. package/dist/types/types/select.d.ts +1 -1
  399. package/hydrate/index.js +1397 -1325
  400. package/hydrate/index.mjs +1397 -1325
  401. package/package.json +4 -3
  402. package/dist/cjs/index-B7tkxTye.js.map +0 -1
  403. package/dist/cjs/sd-tbody_3.cjs.entry.js +0 -44
  404. package/dist/cjs/sd-td.cjs.entry.js +0 -26
  405. package/dist/cjs/select-keyboard-navigation-6fO_V4En.js.map +0 -1
  406. package/dist/collection/components/sd-table/sd-tbody/sd-tbody.css +0 -3
  407. package/dist/collection/components/sd-table/sd-tbody/sd-tbody.js +0 -18
  408. package/dist/collection/components/sd-table/sd-tbody/sd-tbody.js.map +0 -1
  409. package/dist/collection/components/sd-table/sd-td/sd-td.css +0 -9
  410. package/dist/collection/components/sd-table/sd-td/sd-td.js +0 -111
  411. package/dist/collection/components/sd-table/sd-td/sd-td.js.map +0 -1
  412. package/dist/collection/components/sd-table/sd-th/sd-th.css +0 -8
  413. package/dist/collection/components/sd-table/sd-th/sd-th.js +0 -18
  414. package/dist/collection/components/sd-table/sd-th/sd-th.js.map +0 -1
  415. package/dist/collection/components/sd-table/sd-tr/sd-tr.css +0 -3
  416. package/dist/collection/components/sd-table/sd-tr/sd-tr.js +0 -18
  417. package/dist/collection/components/sd-table/sd-tr/sd-tr.js.map +0 -1
  418. package/dist/collection/components/sd-table-backup/sd-table-backup.css +0 -309
  419. package/dist/collection/components/sd-table-backup/sd-table-backup.js +0 -1219
  420. package/dist/collection/components/sd-table-backup/sd-table-backup.js.map +0 -1
  421. package/dist/collection/components/sd-tooltip-portal/sd-tooltip-portal.js.map +0 -1
  422. package/dist/components/p-6qJVnQg4.js +0 -34
  423. package/dist/components/p-6qJVnQg4.js.map +0 -1
  424. package/dist/components/p-BREduhZA.js.map +0 -1
  425. package/dist/components/p-BYf-ybt2.js.map +0 -1
  426. package/dist/components/p-Bj4u0G5b.js.map +0 -1
  427. package/dist/components/p-BxPT3VKO.js.map +0 -1
  428. package/dist/components/p-C4kdHNdl.js +0 -175
  429. package/dist/components/p-C4kdHNdl.js.map +0 -1
  430. package/dist/components/p-C5U6Otnl.js.map +0 -1
  431. package/dist/components/p-CNrsaSqW.js +0 -34
  432. package/dist/components/p-CNrsaSqW.js.map +0 -1
  433. package/dist/components/p-CQBrru3e.js.map +0 -1
  434. package/dist/components/p-D8KGixEs.js +0 -326
  435. package/dist/components/p-D8KGixEs.js.map +0 -1
  436. package/dist/components/p-DLrb7Zq3.js +0 -102
  437. package/dist/components/p-DLrb7Zq3.js.map +0 -1
  438. package/dist/components/p-K42WRBPA.js +0 -121
  439. package/dist/components/p-K42WRBPA.js.map +0 -1
  440. package/dist/components/p-O3tgQfvT.js.map +0 -1
  441. package/dist/components/p-QpwY2yqY.js +0 -78
  442. package/dist/components/p-QpwY2yqY.js.map +0 -1
  443. package/dist/components/p-xme-KFvK.js +0 -34
  444. package/dist/components/p-xme-KFvK.js.map +0 -1
  445. package/dist/components/sd-table-backup.js +0 -802
  446. package/dist/components/sd-table-backup.js.map +0 -1
  447. package/dist/components/sd-tbody.js +0 -9
  448. package/dist/components/sd-tbody.js.map +0 -1
  449. package/dist/components/sd-td.js +0 -50
  450. package/dist/components/sd-td.js.map +0 -1
  451. package/dist/components/sd-th.js +0 -9
  452. package/dist/components/sd-th.js.map +0 -1
  453. package/dist/components/sd-tooltip-portal.d.ts +0 -11
  454. package/dist/components/sd-tooltip-portal.js +0 -9
  455. package/dist/components/sd-tooltip-portal.js.map +0 -1
  456. package/dist/components/sd-tr.js +0 -9
  457. package/dist/components/sd-tr.js.map +0 -1
  458. package/dist/design-system/p-0893dbd0.entry.js +0 -2
  459. package/dist/design-system/p-0893dbd0.entry.js.map +0 -1
  460. package/dist/design-system/p-2633690f.entry.js +0 -2
  461. package/dist/design-system/p-2633690f.entry.js.map +0 -1
  462. package/dist/design-system/p-27985b84.entry.js +0 -2
  463. package/dist/design-system/p-27985b84.entry.js.map +0 -1
  464. package/dist/design-system/p-5576f0f0.entry.js +0 -2
  465. package/dist/design-system/p-7X2nzJWz.js.map +0 -1
  466. package/dist/design-system/p-7a424f6b.entry.js.map +0 -1
  467. package/dist/design-system/p-7ca988ab.entry.js +0 -2
  468. package/dist/design-system/p-7ca988ab.entry.js.map +0 -1
  469. package/dist/design-system/p-9ade8cd7.entry.js +0 -2
  470. package/dist/design-system/p-9ade8cd7.entry.js.map +0 -1
  471. package/dist/design-system/p-C2JaR3A6.js +0 -2
  472. package/dist/design-system/p-C2JaR3A6.js.map +0 -1
  473. package/dist/design-system/p-a7bdb6ba.entry.js +0 -2
  474. package/dist/design-system/p-a7bdb6ba.entry.js.map +0 -1
  475. package/dist/design-system/p-b1b828e6.entry.js +0 -2
  476. package/dist/design-system/p-b1b828e6.entry.js.map +0 -1
  477. package/dist/design-system/p-bdd9afaf.entry.js +0 -2
  478. package/dist/design-system/p-bdd9afaf.entry.js.map +0 -1
  479. package/dist/design-system/p-ddfe63b8.entry.js +0 -2
  480. package/dist/design-system/p-de826a92.entry.js +0 -2
  481. package/dist/design-system/p-de826a92.entry.js.map +0 -1
  482. package/dist/design-system/p-e180c69c.entry.js +0 -2
  483. package/dist/design-system/p-e180c69c.entry.js.map +0 -1
  484. package/dist/esm/index-7X2nzJWz.js.map +0 -1
  485. package/dist/esm/sd-tbody_3.entry.js +0 -40
  486. package/dist/esm/sd-td.entry.js +0 -24
  487. package/dist/esm/sd-td.entry.js.map +0 -1
  488. package/dist/esm/select-keyboard-navigation-C2JaR3A6.js.map +0 -1
  489. package/dist/types/components/sd-table/sd-tbody/sd-tbody.d.ts +0 -3
  490. package/dist/types/components/sd-table/sd-td/sd-td.d.ts +0 -7
  491. package/dist/types/components/sd-table/sd-th/sd-th.d.ts +0 -3
  492. package/dist/types/components/sd-table/sd-tr/sd-tr.d.ts +0 -3
  493. package/dist/types/components/sd-table-backup/sd-table-backup.d.ts +0 -135
  494. /package/dist/design-system/{p-b5720c60.entry.js.map → p-388d5b9f.entry.js.map} +0 -0
@@ -1,802 +0,0 @@
1
- import { p as proxyCustomElement, H, d as createEvent, e as readTask, h, c as Host, t as transformTag } from './p-CQBrru3e.js';
2
- import { d as defineCustomElement$d } from './p-DLrb7Zq3.js';
3
- import { d as defineCustomElement$c } from './p-Bj4u0G5b.js';
4
- import { d as defineCustomElement$b } from './p-BHHbLFXg.js';
5
- import { d as defineCustomElement$a } from './p-C4kdHNdl.js';
6
- import { d as defineCustomElement$9 } from './p-CfivfPAO.js';
7
- import { d as defineCustomElement$8 } from './p-BREduhZA.js';
8
- import { d as defineCustomElement$7 } from './p-B8yBkdjE.js';
9
- import { d as defineCustomElement$6 } from './p-D8KGixEs.js';
10
- import { d as defineCustomElement$5 } from './p-O3tgQfvT.js';
11
- import { d as defineCustomElement$4 } from './p-QpwY2yqY.js';
12
- import { d as defineCustomElement$3 } from './p-K42WRBPA.js';
13
- import { d as defineCustomElement$2 } from './p-C5U6Otnl.js';
14
-
15
- const sdTableBackupCss = () => `.sd-table__wrapper .sd-table__container .sd-table__middle{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar:horizontal{height:8px}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar:vertical{width:8px}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar-track{background-color:transparent}.sd-table__wrapper{height:var(--table-height, auto);width:var(--table-width, 100%);color:#222222}.sd-table__wrapper .sd-table__container{width:100%;height:var(--table-container-height, auto);position:relative;border:1px solid #e1e1e1;border-radius:8px;font-size:12px;overflow:hidden;background:#ffffff}.sd-table__wrapper .sd-table__container .sd-table__middle{overflow:auto;will-change:scroll-position;min-height:var(--table-container-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle--scrollable{height:var(--table-container-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle--loading{overflow:hidden !important;pointer-events:none}.sd-table__wrapper .sd-table__container .sd-table__middle--loading__spinner{position:absolute;top:0;left:0;width:100%;height:var(--table-container-height, 100%);min-height:var(--table-container-height, 100%);background:rgba(255, 255, 255, 0.6);z-index:200;display:flex;align-items:center;justify-content:center}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table{background-color:white;display:table;width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll{position:relative;height:var(--total-virtual-height, --table-container-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll tr:not([aria-hidden=true]){width:100%}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll tr[aria-hidden=true]{padding:0;border:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll tr[aria-hidden=true]:not(.sd-table__virtual-row-spacer) td{display:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--selectable td.sd-td--selected,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--selectable th.sd-th--selected{width:52px !important;max-width:52px !important;min-width:52px !important;padding:0 10px 0 24px;text-align:left}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-header thead{position:sticky;top:0;z-index:120}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column th.sticky-left,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column th.sticky-right{position:sticky;background-color:#f5faff;z-index:110 !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column td.sticky-left,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column td.sticky-right{position:sticky;background-color:white;z-index:100 !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column .sticky-left{left:var(--sticky-left-offset, 0)}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column .sticky-right{right:var(--sticky-right-offset, 0)}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column th.sticky-cell{position:sticky;z-index:102;background-color:#f5faff}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column td.sticky-cell{position:sticky;z-index:101;background-color:white}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left th.sticky-left-edge,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left td.sticky-left-edge{overflow:visible}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left th.sticky-left-edge:after,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left td.sticky-left-edge:after{content:"";position:absolute;top:0;left:100%;right:-20px;width:20px;height:100%;z-index:101 !important;box-shadow:inset 12px 0 20px -25px;opacity:1;pointer-events:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right th.sticky-right-edge,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right td.sticky-right-edge{overflow:visible}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right th.sticky-right-edge:after,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right td.sticky-right-edge:after{content:"";position:absolute;top:0;left:-20px;width:20px;height:100%;z-index:101 !important;box-shadow:inset -12px 0 20px -25px;opacity:1;pointer-events:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--no-data thead{opacity:0.4}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--no-data thead tr th.sd-th{border-bottom:1px solid rgba(225, 225, 225, 0.4) !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table sd-td,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table sd-th,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table .sd-th__content--label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead{height:36px}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr{width:100%}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th{background:#f5faff;height:36px;padding:0 16px;font-weight:500;vertical-align:middle;border-bottom:1px solid #e1e1e1;-webkit-user-select:none;user-select:none;position:relative}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__content{display:flex;flex-flow:row nowrap;align-items:center;gap:4px}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__content--left{justify-content:flex-start}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__content--center{justify-content:center}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__content--right{justify-content:flex-end}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__resizer{position:absolute;top:50%;right:0;transform:translateY(-50%);width:4px;height:16px;cursor:col-resize;z-index:3;border-left:1px solid #cccccc;border-right:1px solid #cccccc}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr td{height:44px;padding:0 16px;border-bottom:1px solid #e1e1e1;background:white;vertical-align:middle}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr td.sd-td--left{text-align:left}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr td.sd-td--center{text-align:center}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr td.sd-td--right{text-align:right}.sd-table__wrapper .sd-table__container .sd-table__bottom{background:white;text-align:center}.sd-table__wrapper .sd-table__container .sd-table__bottom .sd-table__no-data{padding-top:15%;color:#888888}.sd-table__wrapper .sd-table__pagination{position:relative;background:#f9f9f9;height:48px;display:flex;align-items:center;justify-content:center;border:1px solid #e1e1e1;border-top:none;border-radius:8px}.sd-table__wrapper .sd-table__pagination sd-select{position:absolute;right:10px;top:50%;transform:translateY(-50%)}.sd-table__wrapper .sd-table__virtual-spacer,.sd-table__wrapper .sd-table__virtual-row-spacer{padding:0 !important}.sd-table__wrapper .sd-table__virtual-spacer td,.sd-table__wrapper .sd-table__virtual-row-spacer td{padding:0 !important;border:none}.sd-table__wrapper .sd-table__virtual-spacer .sd-table__skeleton,.sd-table__wrapper .sd-table__virtual-row-spacer .sd-table__skeleton{width:100%;height:100%;background-image:repeating-linear-gradient(0deg, rgba(246, 246, 246, 0.3) 0px, rgba(225, 225, 225, 0.5) calc(var(--row-height, 44px) / 2), rgba(246, 246, 246, 0.3) var(--row-height, 44px));background-size:100% 200%;animation:skeleton-loading 1.5s ease-in-out infinite;position:relative}.sd-table__wrapper .sd-table__virtual-spacer .sd-table__skeleton::before,.sd-table__wrapper .sd-table__virtual-row-spacer .sd-table__skeleton::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--row-height, 44px) - 1px), #e1e1e1 calc(var(--row-height, 44px) - 1px), #e1e1e1 var(--row-height, 44px));pointer-events:none}.sd-table__wrapper .sd-table__skeleton-cell{width:100%;height:20px;background:linear-gradient(90deg, rgba(246, 246, 246, 0.3) 0%, rgba(225, 225, 225, 0.5) 50%, rgba(246, 246, 246, 0.3) 100%);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite;border-radius:4px}@keyframes skeleton-loading{0%{background-position:0% 0%}50%{background-position:100% 100%}100%{background-position:0% 0%}}`;
16
-
17
- const SdTable = /*@__PURE__*/ proxyCustomElement(class SdTable extends H {
18
- constructor(registerHost) {
19
- super();
20
- if (registerHost !== false) {
21
- this.__registerHost();
22
- }
23
- this.sdSelectChange = createEvent(this, "sdSelectChange");
24
- this.sdPageChange = createEvent(this, "sdPageChange");
25
- this.sdRowsPerPageChange = createEvent(this, "sdRowsPerPageChange");
26
- }
27
- get el() { return this; }
28
- columns;
29
- rows;
30
- selected = new Set();
31
- rowKey = 'id';
32
- selectable = false;
33
- resizable = false;
34
- width;
35
- height;
36
- stickyHeader = false;
37
- stickyColumn = { left: 0, right: 0 };
38
- noDataLabel = '데이터가 없습니다.';
39
- isLoading = false;
40
- pagination;
41
- headerCellRenderer;
42
- bodyCellRenderer;
43
- useInternalPagination = false;
44
- useRowsPerPageSelect = false;
45
- rowsPerPageOption = [
46
- { label: '10개씩 보기', value: 10 },
47
- { label: '25개씩 보기', value: 25 },
48
- { label: '50개씩 보기', value: 50 },
49
- { label: '100개씩 보기', value: 100 },
50
- ];
51
- useVirtualScroll = {}; // 가상 스크롤 사용 여부
52
- virtualRowHeight = 44; // 가상 스크롤 사용시 각 행의 높이 - 세로 가상 스크롤 사용시 필수값
53
- // 가상 스크롤 사용시 각 열의 너비 - 가로 가상 스크롤 사용시 필수값
54
- // 가상화하려는 컬럼의 넓이는 무조건 고정(resizable의 경우 넓이가 변동되는데 이때에는 고려 x)
55
- virtualColumnWidth = 120;
56
- virtualBufferSize = {
57
- vertical: 5,
58
- horizontal: 5,
59
- }; // 가상 스크롤 위아래 버퍼 크기
60
- sdSelectChange;
61
- sdPageChange;
62
- sdRowsPerPageChange;
63
- currentPage = this.pagination?.page || 1;
64
- innerRows = [];
65
- innerSelected = new Set();
66
- columnWidths = [];
67
- scrolledLeft = false;
68
- scrolledRight = false;
69
- // 세로 가상 스크롤 상태값
70
- virtualStartIndex = 0;
71
- virtualEndIndex = 0;
72
- scrollTopPosition = 0;
73
- // 가로 가상 스크롤 상태값
74
- virtualStartColIdx = 0;
75
- virtualEndColIdx = 0;
76
- scrollLeftPosition = 0;
77
- // 가상 스크롤 Raf(Request Animation Frame) 관리
78
- scrollRequestAnimationFrame = null;
79
- scrollContainer = null;
80
- rafScheduled = false;
81
- pendingUpdates = {
82
- vertical: false,
83
- horizontal: false,
84
- };
85
- // 상태 캐시값
86
- cachedVisibleColumns = null;
87
- lastColumnsRef = null;
88
- cachedVirtualRows = null;
89
- cachedVirtualIndexKey = '';
90
- cachedColumnOrder = null;
91
- lastColumnOrderKey = '';
92
- // DOM 측정 캐시값
93
- cachedContainerHeight = 0;
94
- cachedContainerWidth = 0;
95
- // 스타일 캐시
96
- stickyStyleCache = new Map();
97
- // isAllChecked 캐시
98
- cachedIsAllChecked;
99
- lastSelectionKey = '';
100
- onScroll;
101
- handleColumnsChange(newCols) {
102
- this.columnWidths = newCols.map(c => parseInt(c.width || '120', 10));
103
- this.cleanUpVirtualCache();
104
- this.stickyStyleCache.clear();
105
- if (this.useVirtualScroll.horizontal) {
106
- this.scheduleUpdate('horizontal');
107
- }
108
- }
109
- handleColumnWidthsChange() {
110
- this.stickyStyleCache.clear();
111
- if (this.useVirtualScroll.horizontal) {
112
- this.scheduleUpdate('horizontal');
113
- }
114
- }
115
- handleRowsChange(newRows) {
116
- this.innerRows = [...newRows];
117
- this.cleanUpVirtualCache();
118
- if (this.useVirtualScroll.vertical) {
119
- this.scheduleUpdate('vertical');
120
- }
121
- }
122
- handleSelectedChange(newSelected) {
123
- this.innerSelected = new Set(newSelected);
124
- }
125
- cleanUpVirtualCache() {
126
- this.cachedVisibleColumns = null;
127
- this.lastColumnsRef = null;
128
- this.cachedVirtualRows = null;
129
- this.cachedVirtualIndexKey = '';
130
- this.cachedColumnOrder = null;
131
- this.lastColumnOrderKey = '';
132
- }
133
- handlePaginationChange(newVal) {
134
- if (newVal?.page && newVal.page !== this.currentPage) {
135
- this.currentPage = newVal.page;
136
- if (this.useVirtualScroll.vertical && this.scrollContainer) {
137
- this.scrollContainer.scrollTo({ top: 0, behavior: 'instant' });
138
- this.scrollTopPosition = 0;
139
- this.calculateVisibleRange();
140
- }
141
- }
142
- }
143
- componentWillLoad() {
144
- this.innerRows = [...(this.rows || [])];
145
- this.innerSelected = new Set(this.selected);
146
- this.columnWidths = (this.columns || []).map(c => parseInt(c.width || '120', 10));
147
- if (this.pagination?.page) {
148
- this.currentPage = this.pagination.page;
149
- }
150
- }
151
- componentDidLoad() {
152
- readTask(() => {
153
- const middle = this.el.querySelector('.sd-table__middle');
154
- if (!middle)
155
- return;
156
- this.onScroll = () => {
157
- const scrollLeft = middle.scrollLeft;
158
- const scrollWidth = middle.scrollWidth;
159
- const clientWidth = middle.clientWidth;
160
- const scrollTop = middle.scrollTop;
161
- const verticalChanged = this.useVirtualScroll.vertical && this.scrollTopPosition !== scrollTop;
162
- const horizontalChanged = this.useVirtualScroll.horizontal && this.scrollLeftPosition !== scrollLeft;
163
- const newScrolledLeft = scrollLeft > 0;
164
- const newScrolledRight = scrollLeft + clientWidth < scrollWidth;
165
- if (this.scrolledLeft !== newScrolledLeft || this.scrolledRight !== newScrolledRight) {
166
- this.scrolledLeft = newScrolledLeft;
167
- this.scrolledRight = newScrolledRight;
168
- }
169
- if (verticalChanged || horizontalChanged) {
170
- if (this.scrollRequestAnimationFrame !== null) {
171
- cancelAnimationFrame(this.scrollRequestAnimationFrame);
172
- }
173
- this.scrollRequestAnimationFrame = requestAnimationFrame(() => {
174
- if (verticalChanged) {
175
- this.scrollTopPosition = scrollTop;
176
- this.calculateVisibleRange();
177
- }
178
- if (horizontalChanged) {
179
- this.scrollLeftPosition = scrollLeft;
180
- this.calculateVisibleColumnRange();
181
- }
182
- this.scrollRequestAnimationFrame = null;
183
- });
184
- }
185
- };
186
- this.scrollContainer = middle;
187
- requestAnimationFrame(() => {
188
- if (this.scrollContainer && this.onScroll) {
189
- this.cachedContainerHeight = this.scrollContainer.clientHeight;
190
- this.cachedContainerWidth = this.scrollContainer.clientWidth;
191
- middle.addEventListener('scroll', this.onScroll, { passive: true });
192
- if (this.useVirtualScroll.vertical) {
193
- this.calculateVisibleRange();
194
- }
195
- if (this.useVirtualScroll.horizontal) {
196
- this.calculateVisibleColumnRange();
197
- }
198
- this.onScroll();
199
- }
200
- });
201
- });
202
- }
203
- changePage(page) {
204
- if (!this.useInternalPagination) {
205
- this.sdPageChange.emit(page);
206
- return;
207
- }
208
- this.currentPage = page;
209
- this.sdPageChange.emit(this.currentPage);
210
- }
211
- changeRowsPerPage(perPage) {
212
- const changedRowsPerPage = perPage ? Number(perPage) : 0;
213
- if (!this.useInternalPagination) {
214
- this.sdRowsPerPageChange.emit(changedRowsPerPage);
215
- return;
216
- }
217
- const newRowsPerPage = Number(perPage || 0);
218
- let newLastPage = Math.max(1, Math.ceil(this.innerRows.length / newRowsPerPage));
219
- let newCurrentPage = this.currentPage;
220
- if (newCurrentPage > newLastPage) {
221
- newCurrentPage = newLastPage;
222
- }
223
- this.pagination = {
224
- page: newCurrentPage,
225
- rowsPerPage: newRowsPerPage,
226
- lastPage: newLastPage,
227
- };
228
- this.currentPage = newCurrentPage;
229
- this.sdRowsPerPageChange.emit(changedRowsPerPage);
230
- }
231
- disconnectedCallback() {
232
- if (this.scrollContainer && this.onScroll) {
233
- this.scrollContainer.removeEventListener('scroll', this.onScroll);
234
- }
235
- if (this.scrollRequestAnimationFrame !== null) {
236
- cancelAnimationFrame(this.scrollRequestAnimationFrame);
237
- }
238
- }
239
- // ----- Derived getters -----
240
- get visibleColumns() {
241
- if (this.cachedVisibleColumns && this.lastColumnsRef === this.columns) {
242
- return this.cachedVisibleColumns;
243
- }
244
- this.lastColumnsRef = this.columns;
245
- this.cachedVisibleColumns = this.columns.filter(col => col.visible !== false);
246
- return this.cachedVisibleColumns;
247
- }
248
- get paginatedRows() {
249
- if (!this.pagination || !this.useInternalPagination)
250
- return this.innerRows;
251
- const { rowsPerPage = this.rows.length } = this.pagination || {};
252
- return this.innerRows.slice((this.currentPage - 1) * rowsPerPage, this.currentPage * rowsPerPage);
253
- }
254
- get virtualRows() {
255
- const newVirtualIndexKey = `${this.virtualStartIndex}-${this.virtualEndIndex}`;
256
- if (this.cachedVirtualRows && this.cachedVirtualIndexKey === newVirtualIndexKey) {
257
- return this.cachedVirtualRows;
258
- }
259
- this.cachedVirtualIndexKey = newVirtualIndexKey;
260
- if (!this.useVirtualScroll.vertical) {
261
- this.cachedVirtualRows = this.paginatedRows.map((row, idx) => ({ row, actualIndex: idx }));
262
- }
263
- else {
264
- this.cachedVirtualRows = this.paginatedRows
265
- .slice(this.virtualStartIndex, this.virtualEndIndex + 1)
266
- .map((row, relativeIdx) => ({
267
- row,
268
- actualIndex: this.virtualStartIndex + relativeIdx,
269
- }));
270
- }
271
- return this.cachedVirtualRows;
272
- }
273
- get topSpacerHeight() {
274
- if (!this.useVirtualScroll.vertical || this.virtualStartIndex === 0)
275
- return 0;
276
- return this.virtualStartIndex * this.virtualRowHeight;
277
- }
278
- get bottomSpacerHeight() {
279
- if (!this.useVirtualScroll.vertical)
280
- return 0;
281
- const remainingRows = this.paginatedRows.length - this.virtualEndIndex - 1;
282
- return remainingRows > 0 ? remainingRows * this.virtualRowHeight : 0;
283
- }
284
- getHorizontalSpacerWidth(position) {
285
- const stickyLeftCount = this.stickyColumn.left || 0;
286
- const stickyRightCount = this.stickyColumn.right || 0;
287
- const virtualColumnWidths = this.columnWidths.slice(stickyLeftCount, this.visibleColumns.length - stickyRightCount);
288
- const remainingCols = virtualColumnWidths.length - this.virtualEndColIdx - 1;
289
- if (position === 'right' && remainingCols <= 0)
290
- return 0;
291
- const targetIndex = position === 'left' ? [0, this.virtualStartColIdx] : [this.virtualEndColIdx + 1];
292
- return virtualColumnWidths.slice(...targetIndex).reduce((sum, width) => sum + width, 0);
293
- }
294
- get leftSpacerWidth() {
295
- if (!this.useVirtualScroll.horizontal || this.virtualStartColIdx === 0) {
296
- return 0;
297
- }
298
- return this.getHorizontalSpacerWidth('left');
299
- }
300
- get rightSpacerWidth() {
301
- if (!this.useVirtualScroll.horizontal) {
302
- return 0;
303
- }
304
- return this.getHorizontalSpacerWidth('right');
305
- }
306
- get totalVirtualHeight() {
307
- if (!this.useVirtualScroll.vertical)
308
- return 0;
309
- return this.paginatedRows.length * this.virtualRowHeight;
310
- }
311
- get lastPageNumber() {
312
- const { lastPage, rowsPerPage = this.rows.length } = this.pagination || {};
313
- return lastPage ?? Math.max(1, Math.ceil(this.rows.length / rowsPerPage));
314
- }
315
- get sdTableClasses() {
316
- return [
317
- 'sd-table',
318
- this.stickyHeader && 'sd-table--sticky-header',
319
- this.selectable && 'sd-table--selectable',
320
- this.resizable && 'sd-table--resizable',
321
- !this.innerRows.length && 'sd-table--no-data',
322
- ((this.stickyColumn?.left ?? 0) > 0 || (this.stickyColumn?.right ?? 0) > 0) &&
323
- 'sd-table--sticky-column',
324
- this.scrolledLeft && 'sd-table--scrolled-left',
325
- this.scrolledRight && 'sd-table--scrolled-right',
326
- ]
327
- .filter(Boolean)
328
- .join(' ');
329
- }
330
- // ----- Selection -----
331
- isRowSelected(row) {
332
- return Array.from(this.innerSelected).some(r => r[this.rowKey] === row[this.rowKey]);
333
- }
334
- updateRowSelect(row) {
335
- const selectedArray = Array.from(this.innerSelected);
336
- const exists = this.isRowSelected(row);
337
- const newSelected = exists
338
- ? selectedArray.filter(r => r[this.rowKey] !== row[this.rowKey])
339
- : [...selectedArray, row];
340
- // 동일 상태면 set하지 않음 → 불필요 렌더 방지
341
- if (newSelected.length === selectedArray.length)
342
- return;
343
- this.innerSelected = new Set(newSelected);
344
- this.cachedIsAllChecked = undefined;
345
- this.sdSelectChange.emit(Array.from(this.innerSelected));
346
- }
347
- toggleSelectAll(checked) {
348
- if (checked) {
349
- const pageRows = new Set([...this.paginatedRows]);
350
- this.innerSelected = new Set([...this.innerSelected, ...pageRows]);
351
- }
352
- else {
353
- const currentPageKeys = this.paginatedRows.map(r => r[this.rowKey]);
354
- this.innerSelected = new Set([...this.innerSelected].filter(r => !currentPageKeys.includes(r[this.rowKey])));
355
- }
356
- this.cachedIsAllChecked = undefined;
357
- this.sdSelectChange.emit(Array.from(this.innerSelected));
358
- }
359
- get isAllChecked() {
360
- const selectionKey = `${this.paginatedRows.length}-${this.innerSelected.size}`;
361
- if (this.cachedIsAllChecked !== undefined && this.lastSelectionKey === selectionKey) {
362
- return this.cachedIsAllChecked;
363
- }
364
- const total = this.paginatedRows.length;
365
- const selectedCount = this.paginatedRows.filter(row => Array.from(this.innerSelected).some(selectedRow => selectedRow[this.rowKey] === row[this.rowKey])).length;
366
- let result;
367
- if (selectedCount === 0) {
368
- result = false; // 아무것도 안 선택됨
369
- }
370
- else if (selectedCount === total) {
371
- result = true; // 전부 선택됨
372
- }
373
- else {
374
- result = null; // 일부만 선택됨
375
- }
376
- this.cachedIsAllChecked = result;
377
- this.lastSelectionKey = selectionKey;
378
- return result;
379
- }
380
- // RAF 통합 관리
381
- scheduleUpdate(type) {
382
- this.pendingUpdates[type] = true;
383
- if (!this.rafScheduled) {
384
- this.rafScheduled = true;
385
- this.scrollRequestAnimationFrame = requestAnimationFrame(() => {
386
- if (this.pendingUpdates.vertical)
387
- this.calculateVisibleRange();
388
- if (this.pendingUpdates.horizontal)
389
- this.calculateVisibleColumnRange();
390
- this.pendingUpdates = { vertical: false, horizontal: false };
391
- this.rafScheduled = false;
392
- this.scrollRequestAnimationFrame = null;
393
- });
394
- }
395
- }
396
- // 세로 가상 스크롤 렌더링 계산
397
- calculateVisibleRange() {
398
- if (!this.useVirtualScroll.vertical) {
399
- this.virtualStartIndex = 0;
400
- this.virtualEndIndex = this.paginatedRows.length - 1;
401
- return;
402
- }
403
- const scrollTop = this.scrollTopPosition;
404
- let containerHeight = this.cachedContainerHeight;
405
- if (containerHeight === 0 && this.scrollContainer) {
406
- containerHeight = this.scrollContainer.clientHeight;
407
- this.cachedContainerHeight = containerHeight;
408
- }
409
- const bufferSize = this.virtualBufferSize.vertical || 5;
410
- const startIndex = Math.floor(scrollTop / this.virtualRowHeight);
411
- const visibleCount = Math.ceil(containerHeight / this.virtualRowHeight);
412
- const endIndex = startIndex + visibleCount - 1;
413
- const newStartIndex = Math.max(0, startIndex - bufferSize);
414
- const newEndIndex = Math.min(this.paginatedRows.length - 1, endIndex + bufferSize);
415
- // 실제로 변경된 경우에만 상태 업데이트
416
- if (this.virtualStartIndex !== newStartIndex || this.virtualEndIndex !== newEndIndex) {
417
- this.virtualStartIndex = newStartIndex;
418
- this.virtualEndIndex = newEndIndex;
419
- }
420
- }
421
- // 가로 가상 스크롤 렌더링 계산
422
- calculateVisibleColumnRange() {
423
- if (!this.useVirtualScroll.horizontal) {
424
- this.virtualStartColIdx = 0;
425
- this.virtualEndColIdx = this.visibleColumns.length - 1;
426
- return;
427
- }
428
- const scrollLeft = this.scrollLeftPosition;
429
- // 캐시된 값 사용, 없으면 측정 후 캐시
430
- let containerWidth = this.cachedContainerWidth;
431
- if (containerWidth === 0 && this.scrollContainer) {
432
- containerWidth = this.scrollContainer.clientWidth;
433
- this.cachedContainerWidth = containerWidth;
434
- }
435
- const stickyLeftCount = this.stickyColumn.left || 0;
436
- const stickyRightCount = this.stickyColumn.right || 0;
437
- // 가상 스크롤 컬럼 - sticky column 제외
438
- const virtualColumns = this.visibleColumns.slice(stickyLeftCount, this.visibleColumns.length - stickyRightCount);
439
- if (virtualColumns.length === 0) {
440
- this.virtualStartColIdx = 0;
441
- this.virtualEndColIdx = 0;
442
- return;
443
- }
444
- const stickyLeftWidth = this.columnWidths.slice(0, stickyLeftCount).reduce((sum, width) => sum + width, 0) +
445
- (this.selectable ? 52 : 0);
446
- const stickyRightWidth = this.columnWidths
447
- .slice(this.visibleColumns.length - stickyRightCount)
448
- .reduce((sum, width) => sum + width, 0);
449
- // 가상 스크롤 영역의 너비 계산
450
- const virtualScrollableWidth = containerWidth - stickyLeftWidth - stickyRightWidth;
451
- const virtualColumnWidths = this.columnWidths.slice(stickyLeftCount, this.visibleColumns.length - stickyRightCount);
452
- const virtualScrollLeft = Math.max(0, scrollLeft - stickyLeftWidth);
453
- const reducedVirtualWidth = virtualColumnWidths.reduce((acc, width, idx) => {
454
- acc.push((acc[idx - 1] || 0) + width);
455
- return acc;
456
- }, []);
457
- let startIdx = 0; // 가상 스크롤 시작 인덱스
458
- let endIdx = virtualColumns.length - 1; // 가상 스크롤 종료 인덱스
459
- // sticky left 영역 제외한 스크롤 위치
460
- for (let i = 0; i < reducedVirtualWidth.length; i++) {
461
- if (reducedVirtualWidth[i] > virtualScrollLeft) {
462
- startIdx = Math.max(0, i);
463
- break;
464
- }
465
- }
466
- const scrollRight = virtualScrollLeft + virtualScrollableWidth;
467
- for (let i = startIdx; i < reducedVirtualWidth.length; i++) {
468
- if (reducedVirtualWidth[i] >= scrollRight) {
469
- endIdx = Math.min(virtualColumns.length - 1, i);
470
- break;
471
- }
472
- }
473
- const bufferSize = this.virtualBufferSize.horizontal || 5;
474
- const newStartColIdx = Math.max(0, startIdx - bufferSize);
475
- const newEndColIdx = Math.min(virtualColumns.length - 1, endIdx + bufferSize);
476
- // 실제로 변경된 경우에만 상태 업데이트
477
- if (this.virtualStartColIdx !== newStartColIdx || this.virtualEndColIdx !== newEndColIdx) {
478
- this.virtualStartColIdx = newStartColIdx;
479
- this.virtualEndColIdx = newEndColIdx;
480
- }
481
- }
482
- // ----- Helpers -----
483
- getStickyStyle(colIdx) {
484
- // 캐시된 스타일이 있으면 반환
485
- if (this.stickyStyleCache.has(colIdx)) {
486
- return this.stickyStyleCache.get(colIdx);
487
- }
488
- const leftOffset = this.columnWidths.slice(0, colIdx).reduce((a, b) => a + b, 0) + (this.selectable ? 52 : 0);
489
- const rightOffset = this.columnWidths
490
- .filter((_, i) => i >= this.visibleColumns.length - (this.stickyColumn.right || 0) && i > colIdx)
491
- .reduce((a, b) => a + b, 0);
492
- const style = {
493
- '--sticky-left-offset': `${leftOffset}px`,
494
- '--sticky-right-offset': `${rightOffset}px`,
495
- 'width': `${this.columnWidths[colIdx]}px`,
496
- 'minWidth': `${this.columnWidths[colIdx]}px`,
497
- 'maxWidth': `${this.columnWidths[colIdx]}px`,
498
- };
499
- // 스타일 캐시에 저장
500
- this.stickyStyleCache.set(colIdx, style);
501
- return style;
502
- }
503
- handleResize(index, event) {
504
- // SSR 환경 체크
505
- if (typeof document === 'undefined')
506
- return;
507
- const startX = event.clientX;
508
- const startWidth = this.columnWidths[index];
509
- const handleMouseMove = (moveEvent) => {
510
- const targetColumn = this.columnWidths[index];
511
- if (!targetColumn)
512
- return;
513
- const minWidth = this.columns[index]?.minWidth || 50;
514
- const maxWidth = this.columns[index]?.maxWidth || 9999;
515
- const newWidth = Math.min(Math.max(startWidth + moveEvent.clientX - startX, minWidth), maxWidth);
516
- this.columnWidths = this.columnWidths.map((width, idx) => (idx === index ? newWidth : width));
517
- };
518
- const handleMouseUp = () => {
519
- document.removeEventListener('mousemove', handleMouseMove);
520
- document.removeEventListener('mouseup', handleMouseUp);
521
- };
522
- document.addEventListener('mousemove', handleMouseMove);
523
- document.addEventListener('mouseup', handleMouseUp);
524
- }
525
- getCellValue(column, row) {
526
- const { field, format, name } = column;
527
- const value = typeof field === 'function' ? field(row) : field ? row[field] : row[name];
528
- return format ? format(value, row) : value;
529
- }
530
- getColumnRenderedInOrder() {
531
- const orderKey = `${this.visibleColumns.length}-${this.virtualStartColIdx}-${this.virtualEndColIdx}`;
532
- if (this.cachedColumnOrder && this.lastColumnOrderKey === orderKey) {
533
- return this.cachedColumnOrder;
534
- }
535
- const stickyLeftCount = this.stickyColumn.left || 0;
536
- const stickyRightCount = this.stickyColumn.right || 0;
537
- // Sticky left 컬럼들
538
- const stickyLeftCols = this.visibleColumns.slice(0, stickyLeftCount);
539
- const stickyRightCols = this.visibleColumns.slice(this.visibleColumns.length - stickyRightCount);
540
- const middleCols = this.useVirtualScroll.horizontal
541
- ? this.visibleColumns
542
- .slice(stickyLeftCount, this.visibleColumns.length - stickyRightCount)
543
- .slice(this.virtualStartColIdx, this.virtualEndColIdx + 1)
544
- : this.visibleColumns.slice(stickyLeftCount, this.visibleColumns.length - stickyRightCount);
545
- this.cachedColumnOrder = {
546
- stickyLeftCount,
547
- stickyRightCount,
548
- stickyLeftCols,
549
- middleCols,
550
- stickyRightCols,
551
- };
552
- this.lastColumnOrderKey = orderKey;
553
- return this.cachedColumnOrder;
554
- }
555
- // ----- Render -----
556
- renderHead() {
557
- const { stickyLeftCount, stickyRightCount, stickyLeftCols, middleCols, stickyRightCols } = this.getColumnRenderedInOrder();
558
- return (h("thead", null, h("tr", null, this.selectable && (h("th", { class: {
559
- 'sd-th': true,
560
- 'sd-th--selected': true,
561
- 'sticky-left': Boolean(this.stickyColumn.left && this.stickyColumn.left > 0),
562
- }, style: {
563
- '--sticky-left-offset': '0px',
564
- } }, h("sd-checkbox", { checked: this.isAllChecked, disabled: !this.paginatedRows.length, onSdChange: (e) => this.toggleSelectAll(e.detail) }))), stickyLeftCols.map((col, idx) => {
565
- const rendered = this.headerCellRenderer?.(col);
566
- return (h("th", { key: col.name, class: {
567
- 'sd-th': true,
568
- [`${col.thClass}`]: Boolean(col.thClass),
569
- 'sticky-left': true,
570
- 'sticky-left-edge': idx === stickyLeftCount - 1,
571
- }, style: { ...col.thStyle, ...this.getStickyStyle(idx) } }, h("div", { class: `sd-th__content sd-th__content--${col.align || 'left'}` }, h("slot", { name: `header-cell-${col.name}` }, h("div", { class: "sd-th__content--label" }, rendered ? (typeof rendered === 'string' ? (h("span", { innerHTML: rendered })) : (rendered)) : (col.label))), col.usePageMoveIcon && h("sd-icon", { name: "pageMove", size: "12", color: "#006AC1" }), col.tooltip && (h("sd-tooltip", { ...col.tooltipOptions }, h("div", { slot: "content" }, col.tooltip.map(text => (h("p", null, text))))))), this.resizable && typeof window !== 'undefined' && (h("div", { class: "sd-th__resizer", onMouseDown: (evt) => this.handleResize(idx, evt) }))));
572
- }), this.renderSpacerTd('left', -1), middleCols.map((col, relativeIdx) => {
573
- const actualColIdx = stickyLeftCount + this.virtualStartColIdx + relativeIdx;
574
- const rendered = this.headerCellRenderer?.(col);
575
- return (h("th", { key: col.name, class: {
576
- 'sd-th': true,
577
- [`${col.thClass}`]: Boolean(col.thClass),
578
- }, style: { ...col.thStyle, ...this.getStickyStyle(actualColIdx) } }, h("div", { class: `sd-th__content sd-th__content--${col.align || 'left'}` }, h("slot", { name: `header-cell-${col.name}` }, h("div", { class: "sd-th__content--label" }, rendered ? (typeof rendered === 'string' ? (h("span", { innerHTML: rendered })) : (rendered)) : (col.label))), col.usePageMoveIcon && h("sd-icon", { name: "pageMove", size: "12", color: "#006AC1" }), col.tooltip && (h("sd-tooltip", { ...col.tooltipOptions }, h("div", { slot: "content" }, col.tooltip.map(text => (h("p", null, text))))))), this.resizable && typeof window !== 'undefined' && (h("div", { class: "sd-th__resizer", onMouseDown: (evt) => this.handleResize(actualColIdx, evt) }))));
579
- }), this.renderSpacerTd('right', -1), stickyRightCols.map((col, relativeIdx) => {
580
- const actualColIdx = this.visibleColumns.length - stickyRightCount + relativeIdx;
581
- const rendered = this.headerCellRenderer?.(col);
582
- return (h("th", { key: col.name, class: {
583
- 'sd-th': true,
584
- [`${col.thClass}`]: Boolean(col.thClass),
585
- 'sticky-right': true,
586
- 'sticky-right-edge': relativeIdx === 0,
587
- }, style: { ...col.thStyle, ...this.getStickyStyle(actualColIdx) } }, h("div", { class: `sd-th__content sd-th__content--${col.align || 'left'}` }, h("slot", { name: `header-cell-${col.name}` }, h("div", { class: "sd-th__content--label" }, rendered ? (typeof rendered === 'string' ? (h("span", { innerHTML: rendered })) : (rendered)) : (col.label))), col.usePageMoveIcon && h("sd-icon", { name: "pageMove", size: "12", color: "#006AC1" }), col.tooltip && (h("sd-tooltip", { ...col.tooltipOptions }, h("div", { slot: "content" }, col.tooltip.map(text => (h("p", null, text))))))), this.resizable && typeof window !== 'undefined' && (h("div", { class: "sd-th__resizer", onMouseDown: (evt) => this.handleResize(actualColIdx, evt) }))));
588
- }))));
589
- }
590
- renderBody() {
591
- return (h("tbody", { ...(!this.paginatedRows.length && { part: 'tbody-empty' }), class: `sd-table-tbody ${this.useVirtualScroll.vertical ? 'sd-table-tbody--virtual-scroll' : ''}`, style: { '--total-virtual-height': `${this.totalVirtualHeight}px` } }, this.useVirtualScroll.vertical && this.topSpacerHeight > 0 && this.renderSpacerRow('top'), this.paginatedRows.length > 0 &&
592
- this.virtualRows.map(({ row, actualIndex }) => this.renderRow(row, actualIndex)), this.useVirtualScroll.vertical &&
593
- this.bottomSpacerHeight > 0 &&
594
- this.renderSpacerRow('bottom')));
595
- }
596
- renderRow(row, rowIdx) {
597
- const { stickyLeftCount, stickyRightCount, stickyLeftCols, middleCols, stickyRightCols } = this.getColumnRenderedInOrder();
598
- return (h("tr", { key: row[this.rowKey], class: "hover:bg-Grey_Lighten-6", style: this.useVirtualScroll.vertical
599
- ? {
600
- height: `${this.virtualRowHeight}px`,
601
- }
602
- : {} }, this.selectable && (h("td", { class: {
603
- 'sd-td': true,
604
- 'sd-td--selected': true,
605
- 'sticky-left': Boolean(this.stickyColumn.left && this.stickyColumn.left > 0),
606
- }, style: {
607
- '--sticky-left-offset': '0px',
608
- } }, h("sd-checkbox", { checked: this.isRowSelected(row), disabled: !this.paginatedRows.length, onSdChange: () => this.updateRowSelect(row) }))), stickyLeftCols.map((column, idx) => {
609
- const rendered = this.bodyCellRenderer?.(column, row);
610
- return (h("td", { key: column.name, part: `td-${column.name}`, class: {
611
- 'sd-td': true,
612
- [`sd-td--${column.align || 'left'}`]: true,
613
- 'sticky-left': true,
614
- 'sticky-left-edge': idx === stickyLeftCount - 1,
615
- [`${column.tdClass}`]: Boolean(column.tdClass),
616
- }, style: this.getStickyStyle(idx) }, h("slot", { name: `body-cell-${column.name}-${rowIdx}` }, rendered ? (typeof rendered === 'string' ? (h("span", { innerHTML: rendered })) : (rendered)) : (this.getCellValue(column, row)))));
617
- }), this.renderSpacerTd('left', rowIdx), middleCols.map((column, relativeIdx) => {
618
- const actualColIdx = stickyLeftCount + this.virtualStartColIdx + relativeIdx;
619
- const rendered = this.bodyCellRenderer?.(column, row);
620
- return (h("td", { key: column.name, part: `td-${column.name}`, class: {
621
- 'sd-td': true,
622
- [`sd-td--${column.align || 'left'}`]: true,
623
- [`${column.tdClass}`]: Boolean(column.tdClass),
624
- }, style: this.getStickyStyle(actualColIdx) }, h("slot", { name: `body-cell-${column.name}-${rowIdx}` }, rendered ? (typeof rendered === 'string' ? (h("span", { innerHTML: rendered })) : (rendered)) : (this.getCellValue(column, row)))));
625
- }), this.renderSpacerTd('right', rowIdx), stickyRightCols.map((column, relativeIdx) => {
626
- const actualColIdx = this.visibleColumns.length - stickyRightCount + relativeIdx;
627
- const rendered = this.bodyCellRenderer?.(column, row);
628
- return (h("td", { key: column.name, part: `td-${column.name}`, class: {
629
- 'sd-td': true,
630
- [`sd-td--${column.align || 'left'}`]: true,
631
- 'sticky-right': true,
632
- 'sticky-right-edge': relativeIdx === 0,
633
- [`${column.tdClass}`]: Boolean(column.tdClass),
634
- }, style: this.getStickyStyle(actualColIdx) }, h("slot", { name: `body-cell-${column.name}-${rowIdx}` }, rendered ? (typeof rendered === 'string' ? (h("span", { innerHTML: rendered })) : (rendered)) : (this.getCellValue(column, row)))));
635
- })));
636
- }
637
- renderSpacerRow(position) {
638
- const spacerHeight = position === 'top' ? this.topSpacerHeight : this.bottomSpacerHeight;
639
- return (h("tr", { key: `virtual-${position}-spacer`, class: "sd-table__virtual-row-spacer", style: {
640
- height: `${spacerHeight}px`,
641
- }, "aria-hidden": "true" }, h("td", { colSpan: this.visibleColumns.length + (this.selectable ? 1 : 0) }, h("div", { class: "sd-table__skeleton", style: {
642
- '--row-height': `${this.virtualRowHeight}px`,
643
- } }))));
644
- }
645
- renderSpacerTd(position, rowIdx) {
646
- const spacerWidth = position === 'left' ? this.leftSpacerWidth : this.rightSpacerWidth;
647
- const showSpacer = position === 'left'
648
- ? this.useVirtualScroll.horizontal && this.leftSpacerWidth > 0
649
- : this.useVirtualScroll.horizontal && this.rightSpacerWidth > 0;
650
- if (!showSpacer)
651
- return null;
652
- return (h("td", { key: `virtual-${position}-spacer-${rowIdx}`, class: "sd-table__virtual-spacer", style: {
653
- width: `${spacerWidth}px`,
654
- minWidth: `${spacerWidth}px`,
655
- maxWidth: `${spacerWidth}px`,
656
- padding: '0',
657
- border: 'none',
658
- }, "aria-hidden": "true" }, h("div", { class: "sd-table__skeleton-cell" })));
659
- }
660
- render() {
661
- return (h(Host, { key: 'efc61eba99d3b97fe5b102374b94f1f1eaadd7eb' }, h("div", { key: '71e7c6d7b7bd4fdd53e1c95a821600e11735ec76', class: "sd-table__wrapper", style: {
662
- '--table-width': this.width,
663
- '--table-height': this.height,
664
- } }, h("div", { key: 'e77acaaefdd2948540fcadec624944b66140556e', class: "sd-table__container", style: {
665
- '--table-container-height': `calc(${this.height} - ${this.pagination && this.innerRows.length > 0 ? 48 : 0}px)`,
666
- } }, h("div", { key: 'd4c6a8fadd18abc1f6020ae9f5e7cf60afc79d7f', class: {
667
- 'sd-table__middle': true,
668
- 'sd-table__middle--scrollable': this.paginatedRows.length > 0,
669
- 'sd-table__middle--loading': this.isLoading,
670
- } }, this.isLoading && (h("div", { key: 'ed768c01fe4a3f6fb85c25061ff6f7789571d149', class: "sd-table__middle--loading__spinner" }, h("sd-loading-spinner", { key: 'a563c071edee17150d728f233d2700224e96c09b' }))), h("table", { key: 'fbdab865f8fd3c83fb6e778324fb56239c1790f3', part: "table", class: this.sdTableClasses }, this.renderHead(), this.renderBody())), h("div", { key: '04e385b3ace1983ce0bb2b29db44ee1d1d8e147d', class: "sd-table__bottom" }, !this.paginatedRows.length && (h("div", { key: 'b1a964204f68fc2058a6ff8c833e65567442f9ee', class: "sd-table__no-data" }, h("slot", { key: '8d078f856e54f4be105b1c60c137b28f51a21bb4', name: "no-data" }, this.noDataLabel))))), this.pagination && this.innerRows.length > 0 && (h("div", { key: '718ff6d9be7f909e20673ab2af7a0d357fe8a6a2', class: "sd-table__pagination" }, h("sd-pagination", { key: '23a117bc9f93fb68162c9c18ff309a110a0992a2', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onPageChange: (e) => this.changePage(e.detail) }), this.useRowsPerPageSelect && (h("sd-select", { key: 'd233637ddd86f1abc63701443601bddc1439957d', value: this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", onSdChange: (e) => this.changeRowsPerPage(e.detail.value) })))))));
671
- }
672
- static get watchers() { return {
673
- "columns": ["handleColumnsChange"],
674
- "columnWidths": ["handleColumnWidthsChange"],
675
- "rows": ["handleRowsChange"],
676
- "selected": ["handleSelectedChange"],
677
- "pagination": ["handlePaginationChange"]
678
- }; }
679
- static get style() { return sdTableBackupCss(); }
680
- }, [772, "sd-table-backup", {
681
- "columns": [16],
682
- "rows": [1040],
683
- "selected": [1040],
684
- "rowKey": [1, "row-key"],
685
- "selectable": [4],
686
- "resizable": [4],
687
- "width": [1],
688
- "height": [1],
689
- "stickyHeader": [4, "sticky-header"],
690
- "stickyColumn": [16],
691
- "noDataLabel": [1, "no-data-label"],
692
- "isLoading": [4, "is-loading"],
693
- "pagination": [16],
694
- "headerCellRenderer": [16],
695
- "bodyCellRenderer": [16],
696
- "useInternalPagination": [4, "use-internal-pagination"],
697
- "useRowsPerPageSelect": [4, "use-rows-per-page-select"],
698
- "rowsPerPageOption": [16],
699
- "useVirtualScroll": [16],
700
- "virtualRowHeight": [2, "virtual-row-height"],
701
- "virtualColumnWidth": [2, "virtual-column-width"],
702
- "virtualBufferSize": [16],
703
- "currentPage": [32],
704
- "innerRows": [32],
705
- "innerSelected": [32],
706
- "columnWidths": [32],
707
- "scrolledLeft": [32],
708
- "scrolledRight": [32],
709
- "virtualStartIndex": [32],
710
- "virtualEndIndex": [32],
711
- "scrollTopPosition": [32],
712
- "virtualStartColIdx": [32],
713
- "virtualEndColIdx": [32],
714
- "scrollLeftPosition": [32]
715
- }, undefined, {
716
- "columns": ["handleColumnsChange"],
717
- "columnWidths": ["handleColumnWidthsChange"],
718
- "rows": ["handleRowsChange"],
719
- "selected": ["handleSelectedChange"],
720
- "pagination": ["handlePaginationChange"]
721
- }]);
722
- function defineCustomElement$1() {
723
- if (typeof customElements === "undefined") {
724
- return;
725
- }
726
- const components = ["sd-table-backup", "sd-button", "sd-checkbox", "sd-icon", "sd-input", "sd-loading-spinner", "sd-pagination", "sd-portal", "sd-select", "sd-select-option", "sd-select-search-input", "sd-tooltip", "sd-tooltip-portal"];
727
- components.forEach(tagName => { switch (tagName) {
728
- case "sd-table-backup":
729
- if (!customElements.get(transformTag(tagName))) {
730
- customElements.define(transformTag(tagName), SdTable);
731
- }
732
- break;
733
- case "sd-button":
734
- if (!customElements.get(transformTag(tagName))) {
735
- defineCustomElement$d();
736
- }
737
- break;
738
- case "sd-checkbox":
739
- if (!customElements.get(transformTag(tagName))) {
740
- defineCustomElement$c();
741
- }
742
- break;
743
- case "sd-icon":
744
- if (!customElements.get(transformTag(tagName))) {
745
- defineCustomElement$b();
746
- }
747
- break;
748
- case "sd-input":
749
- if (!customElements.get(transformTag(tagName))) {
750
- defineCustomElement$a();
751
- }
752
- break;
753
- case "sd-loading-spinner":
754
- if (!customElements.get(transformTag(tagName))) {
755
- defineCustomElement$9();
756
- }
757
- break;
758
- case "sd-pagination":
759
- if (!customElements.get(transformTag(tagName))) {
760
- defineCustomElement$8();
761
- }
762
- break;
763
- case "sd-portal":
764
- if (!customElements.get(transformTag(tagName))) {
765
- defineCustomElement$7();
766
- }
767
- break;
768
- case "sd-select":
769
- if (!customElements.get(transformTag(tagName))) {
770
- defineCustomElement$6();
771
- }
772
- break;
773
- case "sd-select-option":
774
- if (!customElements.get(transformTag(tagName))) {
775
- defineCustomElement$5();
776
- }
777
- break;
778
- case "sd-select-search-input":
779
- if (!customElements.get(transformTag(tagName))) {
780
- defineCustomElement$4();
781
- }
782
- break;
783
- case "sd-tooltip":
784
- if (!customElements.get(transformTag(tagName))) {
785
- defineCustomElement$3();
786
- }
787
- break;
788
- case "sd-tooltip-portal":
789
- if (!customElements.get(transformTag(tagName))) {
790
- defineCustomElement$2();
791
- }
792
- break;
793
- } });
794
- }
795
-
796
- const SdTableBackup = SdTable;
797
- const defineCustomElement = defineCustomElement$1;
798
-
799
- export { SdTableBackup, defineCustomElement };
800
- //# sourceMappingURL=sd-table-backup.js.map
801
-
802
- //# sourceMappingURL=sd-table-backup.js.map