@sellmate/design-system 1.0.66 → 1.0.68

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 (408) hide show
  1. package/dist/cjs/{component.textinput-C4SsDjA1.js → component.textinput-BpXDeZPD.js} +3 -2
  2. package/dist/cjs/design-system.cjs.js +2 -2
  3. package/dist/cjs/{index-nsQP24mV.js → index-B2QvhbC3.js} +1 -1
  4. package/dist/cjs/index.cjs.js +36 -41
  5. package/dist/cjs/loader.cjs.js +2 -2
  6. package/dist/cjs/modal-stack-DucFLON7.js +112 -0
  7. package/dist/cjs/sd-action-modal.cjs.entry.js +2 -2
  8. package/dist/cjs/sd-badge.cjs.entry.js +2 -2
  9. package/dist/cjs/sd-barcode-input.cjs.entry.js +3 -3
  10. package/dist/cjs/sd-button-v2_2.cjs.entry.js +3 -3
  11. package/dist/cjs/sd-button_4.cjs.entry.js +22 -17
  12. package/dist/cjs/sd-calendar.cjs.entry.js +1 -1
  13. package/dist/cjs/sd-card.cjs.entry.js +2 -2
  14. package/dist/cjs/sd-checkbox.cjs.entry.js +1 -1
  15. package/dist/cjs/sd-chip.cjs.entry.js +312 -0
  16. package/dist/cjs/sd-circle-progress.cjs.entry.js +2 -2
  17. package/dist/cjs/sd-confirm-modal_2.cjs.entry.js +5 -4
  18. package/dist/cjs/sd-date-box.cjs.entry.js +1 -1
  19. package/dist/cjs/sd-date-picker-calendar.cjs.entry.js +2 -2
  20. package/dist/cjs/sd-date-picker-trigger.cjs.entry.js +3 -3
  21. package/dist/cjs/sd-date-picker.cjs.entry.js +3 -3
  22. package/dist/cjs/sd-date-range-picker-calendar.cjs.entry.js +2 -2
  23. package/dist/cjs/sd-date-range-picker.cjs.entry.js +1 -1
  24. package/dist/cjs/sd-dropdown-button.cjs.entry.js +8 -19
  25. package/dist/cjs/sd-file-picker.cjs.entry.js +3 -3
  26. package/dist/cjs/sd-form.cjs.entry.js +1 -1
  27. package/dist/cjs/sd-ghost-button.cjs.entry.js +6 -6
  28. package/dist/cjs/sd-guide.cjs.entry.js +167 -34
  29. package/dist/cjs/sd-input_2.cjs.entry.js +7 -7
  30. package/dist/cjs/sd-loading-container.cjs.entry.js +4 -4
  31. package/dist/cjs/sd-modal-container.cjs.entry.js +130 -151
  32. package/dist/cjs/sd-number-input.cjs.entry.js +4 -4
  33. package/dist/cjs/sd-pagination_2.cjs.entry.js +116 -42
  34. package/dist/cjs/sd-popover.cjs.entry.js +4 -4
  35. package/dist/cjs/sd-portal.cjs.entry.js +4 -4
  36. package/dist/cjs/sd-progress.cjs.entry.js +3 -3
  37. package/dist/cjs/sd-radio-button.cjs.entry.js +2 -2
  38. package/dist/cjs/sd-radio-group.cjs.entry.js +3 -3
  39. package/dist/cjs/sd-radio.cjs.entry.js +18 -27
  40. package/dist/cjs/sd-select-dropdown_2.cjs.entry.js +4 -4
  41. package/dist/cjs/sd-select-group.cjs.entry.js +2 -2
  42. package/dist/cjs/sd-select-multiple-group.cjs.entry.js +2 -2
  43. package/dist/cjs/sd-select-multiple.cjs.entry.js +2 -2
  44. package/dist/cjs/sd-select-option-group.cjs.entry.js +4 -4
  45. package/dist/cjs/sd-select-v2-list-item_4.cjs.entry.js +29 -24
  46. package/dist/cjs/sd-select.cjs.entry.js +2 -2
  47. package/dist/cjs/sd-switch.cjs.entry.js +2 -2
  48. package/dist/cjs/sd-table.cjs.entry.js +6 -6
  49. package/dist/cjs/sd-tabs.cjs.entry.js +2 -2
  50. package/dist/cjs/sd-tag.cjs.entry.js +3 -3
  51. package/dist/cjs/sd-tbody.cjs.entry.js +2 -2
  52. package/dist/cjs/sd-td.cjs.entry.js +2 -2
  53. package/dist/cjs/sd-text-link.cjs.entry.js +4 -4
  54. package/dist/cjs/sd-textarea.cjs.entry.js +3 -3
  55. package/dist/cjs/sd-thead.cjs.entry.js +4 -4
  56. package/dist/cjs/sd-toast-container.cjs.entry.js +3 -3
  57. package/dist/cjs/sd-toast.cjs.entry.js +3 -3
  58. package/dist/cjs/sd-toggle.cjs.entry.js +2 -2
  59. package/dist/cjs/sd-tr.cjs.entry.js +3 -3
  60. package/dist/cjs/system-C89o3A9Z.js +16 -0
  61. package/dist/cjs/table-test.cjs.entry.js +2 -2
  62. package/dist/cjs/{tooltipArrow-DhevfDPX.js → tooltipArrow-Xkv-p1bY.js} +1 -1
  63. package/dist/collection/collection-manifest.json +2 -1
  64. package/dist/collection/components/sd-action-modal/sd-action-modal.js +1 -1
  65. package/dist/collection/components/sd-badge/sd-badge.js +1 -1
  66. package/dist/collection/components/sd-barcode-input/sd-barcode-input.js +1 -1
  67. package/dist/collection/components/sd-button-v2/sd-button-v2.js +2 -2
  68. package/dist/collection/components/sd-card/sd-card.js +1 -1
  69. package/dist/collection/components/sd-chip/sd-chip.config.js +37 -0
  70. package/dist/collection/components/sd-chip/sd-chip.css +56 -0
  71. package/dist/collection/components/sd-chip/sd-chip.js +544 -0
  72. package/dist/collection/components/sd-circle-progress/sd-circle-progress.js +1 -1
  73. package/dist/collection/components/sd-confirm-modal/sd-confirm-modal.js +2 -2
  74. package/dist/collection/components/sd-date-picker/sd-date-picker-calendar/sd-date-picker-calendar.js +1 -1
  75. package/dist/collection/components/sd-date-picker/sd-date-picker-trigger/sd-date-picker-trigger.js +2 -2
  76. package/dist/collection/components/sd-date-picker/sd-date-picker.js +2 -2
  77. package/dist/collection/components/sd-date-range-picker/sd-date-range-picker-calendar/sd-date-range-picker-calendar.js +1 -1
  78. package/dist/collection/components/sd-dropdown-button/sd-dropdown-button.js +3 -3
  79. package/dist/collection/components/sd-field/sd-field.js +4 -4
  80. package/dist/collection/components/sd-file-picker/sd-file-picker.css +1 -1
  81. package/dist/collection/components/sd-file-picker/sd-file-picker.js +1 -1
  82. package/dist/collection/components/sd-floating-portal/sd-floating-portal.js +12 -8
  83. package/dist/collection/components/sd-ghost-button/sd-ghost-button.js +5 -5
  84. package/dist/collection/components/sd-guide/sd-guide.config.js +48 -0
  85. package/dist/collection/components/sd-guide/sd-guide.css +58 -29
  86. package/dist/collection/components/sd-guide/sd-guide.js +69 -40
  87. package/dist/collection/components/sd-input/sd-input.js +2 -2
  88. package/dist/collection/components/sd-loading-container/sd-loading-container.config.js +1 -1
  89. package/dist/collection/components/sd-loading-container/sd-loading-container.css +1 -1
  90. package/dist/collection/components/sd-loading-container/sd-loading-container.js +2 -2
  91. package/dist/collection/components/sd-loading-modal/sd-loading-modal.js +22 -1
  92. package/dist/collection/components/sd-modal-container/sd-modal-container.css +11 -10
  93. package/dist/collection/components/sd-modal-container/sd-modal-container.js +154 -160
  94. package/dist/collection/components/sd-number-input/sd-number-input.js +3 -3
  95. package/dist/collection/components/sd-pagination/sd-pagination.config.js +25 -0
  96. package/dist/collection/components/sd-pagination/sd-pagination.css +69 -53
  97. package/dist/collection/components/sd-pagination/sd-pagination.js +53 -37
  98. package/dist/collection/components/sd-popover/sd-popover.js +2 -2
  99. package/dist/collection/components/sd-portal/sd-portal.js +4 -4
  100. package/dist/collection/components/sd-progress/sd-progress.js +2 -2
  101. package/dist/collection/components/sd-radio/sd-radio.config.js +6 -5
  102. package/dist/collection/components/sd-radio/sd-radio.css +2 -2
  103. package/dist/collection/components/sd-radio/sd-radio.js +2 -1
  104. package/dist/collection/components/sd-radio-button/sd-radio-button.js +1 -1
  105. package/dist/collection/components/sd-radio-group/sd-radio-group.css +2 -2
  106. package/dist/collection/components/sd-radio-group/sd-radio-group.js +1 -1
  107. package/dist/collection/components/sd-select/sd-select-dropdown/sd-select-dropdown.js +2 -2
  108. package/dist/collection/components/sd-select/sd-select-option/sd-select-option.js +1 -1
  109. package/dist/collection/components/sd-select/sd-select-search-input/sd-select-search-input.js +3 -3
  110. package/dist/collection/components/sd-select/sd-select.js +1 -1
  111. package/dist/collection/components/sd-select-group/sd-select-group.js +1 -1
  112. package/dist/collection/components/sd-select-multiple/sd-select-multiple.js +1 -1
  113. package/dist/collection/components/sd-select-multiple-group/sd-select-multiple-group.js +1 -1
  114. package/dist/collection/components/sd-select-multiple-group/sd-select-option-group/sd-select-option-group.js +3 -3
  115. package/dist/collection/components/sd-select-v2/sd-select-v2-list-item/sd-select-v2-list-item.css +2 -2
  116. package/dist/collection/components/sd-select-v2/sd-select-v2-list-item/sd-select-v2-list-item.js +4 -2
  117. package/dist/collection/components/sd-select-v2/sd-select-v2-list-item-search/sd-select-v2-list-item-search.js +4 -4
  118. package/dist/collection/components/sd-select-v2/sd-select-v2-listbox/sd-select-v2-listbox.css +5 -5
  119. package/dist/collection/components/sd-select-v2/sd-select-v2-listbox/sd-select-v2-listbox.js +2 -2
  120. package/dist/collection/components/sd-select-v2/sd-select-v2-trigger/sd-select-v2-trigger.js +2 -2
  121. package/dist/collection/components/sd-select-v2/sd-select-v2.config.js +5 -4
  122. package/dist/collection/components/sd-select-v2/sd-select-v2.js +3 -3
  123. package/dist/collection/components/sd-switch/sd-switch.js +1 -1
  124. package/dist/collection/components/sd-table/sd-table.js +5 -5
  125. package/dist/collection/components/sd-table/sd-table.stories.helpers.js +146 -0
  126. package/dist/collection/components/sd-table/sd-tbody/sd-tbody.js +1 -1
  127. package/dist/collection/components/sd-table/sd-td/sd-td.js +1 -1
  128. package/dist/collection/components/sd-table/sd-thead/sd-thead.js +3 -3
  129. package/dist/collection/components/sd-table/sd-tr/sd-tr.js +2 -2
  130. package/dist/collection/components/sd-tabs/sd-tabs.js +1 -1
  131. package/dist/collection/components/sd-tag/sd-tag.js +2 -2
  132. package/dist/collection/components/sd-text-link/sd-text-link.js +3 -3
  133. package/dist/collection/components/sd-textarea/sd-textarea.js +1 -1
  134. package/dist/collection/components/sd-toast/sd-toast.js +2 -2
  135. package/dist/collection/components/sd-toast-container/sd-toast-container.config.js +1 -1
  136. package/dist/collection/components/sd-toast-container/sd-toast-container.js +1 -1
  137. package/dist/collection/components/sd-toggle/sd-toggle.js +1 -1
  138. package/dist/collection/components/sd-tooltip/sd-tooltip.js +2 -2
  139. package/dist/collection/components/table-test/table-test.js +1 -1
  140. package/dist/collection/utils/modal-stack.js +109 -0
  141. package/dist/collection/utils/modal.js +17 -23
  142. package/dist/components/index.js +1 -1
  143. package/dist/components/p-B1j9ZWLJ.js +1 -0
  144. package/dist/components/p-BBluw-CU.js +1 -0
  145. package/dist/components/{p-D9FDutsj.js → p-BFd54Imz.js} +1 -1
  146. package/dist/components/{p-BH3z_vB9.js → p-BPXQ6DXz.js} +1 -1
  147. package/dist/components/p-BaHpEtbz.js +1 -0
  148. package/dist/components/{p-B6RvTdqt.js → p-BlqLear7.js} +1 -1
  149. package/dist/components/{p-CJwbBrt5.js → p-ByhWX2NK.js} +1 -1
  150. package/dist/components/{p-puZ1xlrr.js → p-BylHC3lv.js} +1 -1
  151. package/dist/components/p-C-txBx-h.js +1 -0
  152. package/dist/components/p-C0VkfKIA.js +1 -0
  153. package/dist/components/p-C4uWhzoG.js +1 -0
  154. package/dist/components/{p-CAeSM6Ov.js → p-CEeNVTzW.js} +1 -1
  155. package/dist/components/{p-6cueWz-l.js → p-CLZ8NObl.js} +1 -1
  156. package/dist/components/{p-DRY8HJ-T.js → p-COM91Bya.js} +1 -1
  157. package/dist/components/p-CS62OEXf.js +1 -0
  158. package/dist/components/{p-CGXwtYAv.js → p-CX0V7awA.js} +1 -1
  159. package/dist/components/{p-C2r48NLP.js → p-Cb1M05mf.js} +1 -1
  160. package/dist/components/{p-Cpu_hXwN.js → p-Cj4NAUzE.js} +1 -1
  161. package/dist/components/{p-B6OgnOKC.js → p-CsPyZohK.js} +1 -1
  162. package/dist/components/{p-Bh548Ckv.js → p-CsVPC3FD.js} +1 -1
  163. package/dist/components/{p-BLC3AWW8.js → p-Csfk-CtX.js} +1 -1
  164. package/dist/components/{p-CRl8Anfr.js → p-CtrDZYN5.js} +1 -1
  165. package/dist/components/p-D21iKAp7.js +1 -0
  166. package/dist/components/{p-TMuoVuhE.js → p-D6C4-apu.js} +1 -1
  167. package/dist/components/{p-Cr_74QR7.js → p-DGPGMB_Z.js} +1 -1
  168. package/dist/components/{p-h6zSUtA2.js → p-DIro-Wat.js} +1 -1
  169. package/dist/components/{p-AKpbKrkW.js → p-DPCj-bFr.js} +1 -1
  170. package/dist/components/{p-fcZvjHk_.js → p-DQLyH3dr.js} +1 -1
  171. package/dist/components/p-DRVnqiWc.js +1 -0
  172. package/dist/components/{p-HsTw_qYU.js → p-DWW5xr6r.js} +1 -1
  173. package/dist/components/p-D_lyw4rN.js +1 -0
  174. package/dist/components/{p-DXtyg5eK.js → p-Diis5oCN.js} +1 -1
  175. package/dist/components/{p-BdsI1E5l.js → p-DlkxQ9Jn.js} +1 -1
  176. package/dist/components/{p-Cpg2hVm3.js → p-N_EbEY8s.js} +1 -1
  177. package/dist/components/{p-CpclstHV.js → p-T5BGXHZg.js} +1 -1
  178. package/dist/components/{p-CGssy8eb.js → p-YgnF5oje.js} +1 -1
  179. package/dist/components/{p-Cc7ZBscb.js → p-z9MoRjYX.js} +1 -1
  180. package/dist/components/sd-action-modal.js +1 -1
  181. package/dist/components/sd-badge.js +1 -1
  182. package/dist/components/sd-barcode-input.js +1 -1
  183. package/dist/components/sd-button-v2.js +1 -1
  184. package/dist/components/sd-button.js +1 -1
  185. package/dist/components/sd-calendar.js +1 -1
  186. package/dist/components/sd-card.js +1 -1
  187. package/dist/components/sd-checkbox.js +1 -1
  188. package/dist/components/sd-chip.d.ts +11 -0
  189. package/dist/components/sd-chip.js +1 -0
  190. package/dist/components/sd-circle-progress.js +1 -1
  191. package/dist/components/sd-confirm-modal.js +1 -1
  192. package/dist/components/sd-date-box.js +1 -1
  193. package/dist/components/sd-date-picker-calendar.js +1 -1
  194. package/dist/components/sd-date-picker-trigger.js +1 -1
  195. package/dist/components/sd-date-picker.js +1 -1
  196. package/dist/components/sd-date-range-picker-calendar.js +1 -1
  197. package/dist/components/sd-date-range-picker.js +1 -1
  198. package/dist/components/sd-dropdown-button.js +1 -1
  199. package/dist/components/sd-field.js +1 -1
  200. package/dist/components/sd-file-picker.js +1 -1
  201. package/dist/components/sd-floating-portal.js +1 -1
  202. package/dist/components/sd-form.js +1 -1
  203. package/dist/components/sd-ghost-button.js +1 -1
  204. package/dist/components/sd-guide.js +1 -1
  205. package/dist/components/sd-icon.js +1 -1
  206. package/dist/components/sd-input.js +1 -1
  207. package/dist/components/sd-loading-container.js +1 -1
  208. package/dist/components/sd-loading-modal.js +1 -1
  209. package/dist/components/sd-modal-container.js +1 -1
  210. package/dist/components/sd-number-input.js +1 -1
  211. package/dist/components/sd-pagination.js +1 -1
  212. package/dist/components/sd-popover.js +1 -1
  213. package/dist/components/sd-portal.js +1 -1
  214. package/dist/components/sd-progress.js +1 -1
  215. package/dist/components/sd-radio-button.js +1 -1
  216. package/dist/components/sd-radio-group.js +1 -1
  217. package/dist/components/sd-radio.js +1 -1
  218. package/dist/components/sd-select-dropdown.js +1 -1
  219. package/dist/components/sd-select-group.js +1 -1
  220. package/dist/components/sd-select-multiple-group.js +1 -1
  221. package/dist/components/sd-select-multiple.js +1 -1
  222. package/dist/components/sd-select-option-group.js +1 -1
  223. package/dist/components/sd-select-option.js +1 -1
  224. package/dist/components/sd-select-search-input.js +1 -1
  225. package/dist/components/sd-select-v2-list-item-search.js +1 -1
  226. package/dist/components/sd-select-v2-list-item.js +1 -1
  227. package/dist/components/sd-select-v2-listbox.js +1 -1
  228. package/dist/components/sd-select-v2-trigger.js +1 -1
  229. package/dist/components/sd-select-v2.js +1 -1
  230. package/dist/components/sd-select.js +1 -1
  231. package/dist/components/sd-switch.js +1 -1
  232. package/dist/components/sd-table.js +1 -1
  233. package/dist/components/sd-tabs.js +1 -1
  234. package/dist/components/sd-tag.js +1 -1
  235. package/dist/components/sd-tbody.js +1 -1
  236. package/dist/components/sd-td.js +1 -1
  237. package/dist/components/sd-text-link.js +1 -1
  238. package/dist/components/sd-textarea.js +1 -1
  239. package/dist/components/sd-thead.js +1 -1
  240. package/dist/components/sd-toast-container.js +1 -1
  241. package/dist/components/sd-toast.js +1 -1
  242. package/dist/components/sd-toggle.js +1 -1
  243. package/dist/components/sd-tooltip.js +1 -1
  244. package/dist/components/sd-tr.js +1 -1
  245. package/dist/components/table-test.js +1 -1
  246. package/dist/design-system/design-system.css +1 -1
  247. package/dist/design-system/design-system.esm.js +1 -1
  248. package/dist/design-system/index.esm.js +1 -1
  249. package/dist/design-system/{p-e5f71ec0.entry.js → p-002e10ac.entry.js} +1 -1
  250. package/dist/design-system/p-01ac7743.entry.js +1 -0
  251. package/dist/design-system/{p-f3d082c8.entry.js → p-07736d67.entry.js} +1 -1
  252. package/dist/design-system/p-0929f910.entry.js +1 -0
  253. package/dist/design-system/{p-867ec4ee.entry.js → p-0b216b11.entry.js} +1 -1
  254. package/dist/design-system/{p-4dcadde3.entry.js → p-0bffdbf4.entry.js} +1 -1
  255. package/dist/design-system/{p-05ce3449.entry.js → p-0c98676e.entry.js} +1 -1
  256. package/dist/design-system/{p-9dd3c6a7.entry.js → p-0d485537.entry.js} +1 -1
  257. package/dist/design-system/{p-ed61fe19.entry.js → p-16eae7ae.entry.js} +1 -1
  258. package/dist/design-system/{p-03099a57.entry.js → p-1a455448.entry.js} +1 -1
  259. package/dist/design-system/{p-3d341993.entry.js → p-1b8e63a6.entry.js} +1 -1
  260. package/dist/design-system/p-23c31074.entry.js +1 -0
  261. package/dist/design-system/{p-96b14db1.entry.js → p-23ff6bee.entry.js} +1 -1
  262. package/dist/design-system/{p-8d2328ae.entry.js → p-2a4b6bc7.entry.js} +1 -1
  263. package/dist/design-system/{p-b81e0493.entry.js → p-2a663b3b.entry.js} +1 -1
  264. package/dist/design-system/{p-53bc77f8.entry.js → p-308c2a72.entry.js} +1 -1
  265. package/dist/design-system/{p-010e4f47.entry.js → p-33713805.entry.js} +1 -1
  266. package/dist/design-system/p-35b29182.entry.js +1 -0
  267. package/dist/design-system/{p-2ae97b1c.entry.js → p-449e58ee.entry.js} +1 -1
  268. package/dist/design-system/{p-5a63febd.entry.js → p-48f1f9ff.entry.js} +1 -1
  269. package/dist/design-system/{p-a27718c1.entry.js → p-4d434794.entry.js} +1 -1
  270. package/dist/design-system/p-4de3b6b1.entry.js +1 -0
  271. package/dist/design-system/p-4f9f25a1.entry.js +1 -0
  272. package/dist/design-system/{p-84a329fb.entry.js → p-59aa62ff.entry.js} +1 -1
  273. package/dist/design-system/{p-363da5ff.entry.js → p-5a0b0a1b.entry.js} +1 -1
  274. package/dist/design-system/p-60ece09d.entry.js +1 -0
  275. package/dist/design-system/{p-b1fe12f8.entry.js → p-641c2f3d.entry.js} +1 -1
  276. package/dist/design-system/{p-04be87a4.entry.js → p-64a56a4e.entry.js} +1 -1
  277. package/dist/design-system/{p-b60ae063.entry.js → p-6b2f6efb.entry.js} +1 -1
  278. package/dist/design-system/{p-fd296c73.entry.js → p-6b478f5c.entry.js} +1 -1
  279. package/dist/design-system/{p-d8eb17a8.entry.js → p-6ca6dfaf.entry.js} +1 -1
  280. package/dist/design-system/{p-d04551be.entry.js → p-6ef2d08f.entry.js} +1 -1
  281. package/dist/design-system/{p-c4e68815.entry.js → p-703eee55.entry.js} +1 -1
  282. package/dist/design-system/p-75c5e31b.entry.js +1 -0
  283. package/dist/design-system/p-7dd8beba.entry.js +1 -0
  284. package/dist/design-system/{p-73acee07.entry.js → p-7ef0c428.entry.js} +1 -1
  285. package/dist/design-system/{p-6644c4a0.entry.js → p-8281dc36.entry.js} +1 -1
  286. package/dist/design-system/p-87222184.entry.js +1 -0
  287. package/dist/design-system/{p-a129711d.entry.js → p-8cd1b533.entry.js} +1 -1
  288. package/dist/design-system/{p-40495e05.entry.js → p-92a52f89.entry.js} +1 -1
  289. package/dist/design-system/{p-4a53d7b0.entry.js → p-95d96917.entry.js} +1 -1
  290. package/dist/design-system/{p-e33389b8.entry.js → p-9ecde011.entry.js} +1 -1
  291. package/dist/design-system/{p-e78faea6.entry.js → p-9f0fe1f6.entry.js} +1 -1
  292. package/dist/design-system/p-BGyJgVXm.js +2 -0
  293. package/dist/design-system/{p-CJwbBrt5.js → p-ByhWX2NK.js} +1 -1
  294. package/dist/design-system/p-C-txBx-h.js +1 -0
  295. package/dist/design-system/{p-COK6PVLC.js → p-C4tHYnB4.js} +1 -1
  296. package/dist/design-system/p-DRVnqiWc.js +1 -0
  297. package/dist/design-system/{p-3f79f1d1.entry.js → p-ade9319d.entry.js} +1 -1
  298. package/dist/design-system/{p-4128c17f.entry.js → p-aeadfb9c.entry.js} +1 -1
  299. package/dist/design-system/{p-b3279f07.entry.js → p-ca6b4d4a.entry.js} +1 -1
  300. package/dist/design-system/{p-0fbb6d92.entry.js → p-cdedac3c.entry.js} +1 -1
  301. package/dist/design-system/{p-09ba9dbc.entry.js → p-d43772c0.entry.js} +1 -1
  302. package/dist/design-system/{p-e0f9e5b5.entry.js → p-dfa716e0.entry.js} +1 -1
  303. package/dist/design-system/{p-d040ec6f.entry.js → p-e1288299.entry.js} +1 -1
  304. package/dist/design-system/{p-a983560d.entry.js → p-e1b307ee.entry.js} +1 -1
  305. package/dist/design-system/p-e3a1e677.entry.js +1 -0
  306. package/dist/design-system/p-ebc72b3f.entry.js +1 -0
  307. package/dist/design-system/{p-6c71d7b7.entry.js → p-fa888a37.entry.js} +1 -1
  308. package/dist/esm/{component.textinput-CJwbBrt5.js → component.textinput-ByhWX2NK.js} +3 -2
  309. package/dist/esm/design-system.js +3 -3
  310. package/dist/esm/{index-BqHL8W3c.js → index-BGyJgVXm.js} +1 -1
  311. package/dist/esm/index.js +36 -41
  312. package/dist/esm/loader.js +3 -3
  313. package/dist/esm/modal-stack-DRVnqiWc.js +105 -0
  314. package/dist/esm/sd-action-modal.entry.js +2 -2
  315. package/dist/esm/sd-badge.entry.js +2 -2
  316. package/dist/esm/sd-barcode-input.entry.js +3 -3
  317. package/dist/esm/sd-button-v2_2.entry.js +3 -3
  318. package/dist/esm/sd-button_4.entry.js +22 -17
  319. package/dist/esm/sd-calendar.entry.js +1 -1
  320. package/dist/esm/sd-card.entry.js +2 -2
  321. package/dist/esm/sd-checkbox.entry.js +1 -1
  322. package/dist/esm/sd-chip.entry.js +310 -0
  323. package/dist/esm/sd-circle-progress.entry.js +2 -2
  324. package/dist/esm/sd-confirm-modal_2.entry.js +5 -4
  325. package/dist/esm/sd-date-box.entry.js +1 -1
  326. package/dist/esm/sd-date-picker-calendar.entry.js +2 -2
  327. package/dist/esm/sd-date-picker-trigger.entry.js +3 -3
  328. package/dist/esm/sd-date-picker.entry.js +3 -3
  329. package/dist/esm/sd-date-range-picker-calendar.entry.js +2 -2
  330. package/dist/esm/sd-date-range-picker.entry.js +1 -1
  331. package/dist/esm/sd-dropdown-button.entry.js +5 -16
  332. package/dist/esm/sd-file-picker.entry.js +3 -3
  333. package/dist/esm/sd-form.entry.js +1 -1
  334. package/dist/esm/sd-ghost-button.entry.js +6 -6
  335. package/dist/esm/sd-guide.entry.js +167 -34
  336. package/dist/esm/sd-input_2.entry.js +7 -7
  337. package/dist/esm/sd-loading-container.entry.js +4 -4
  338. package/dist/esm/sd-modal-container.entry.js +130 -151
  339. package/dist/esm/sd-number-input.entry.js +4 -4
  340. package/dist/esm/sd-pagination_2.entry.js +116 -42
  341. package/dist/esm/sd-popover.entry.js +4 -4
  342. package/dist/esm/sd-portal.entry.js +4 -4
  343. package/dist/esm/sd-progress.entry.js +3 -3
  344. package/dist/esm/sd-radio-button.entry.js +2 -2
  345. package/dist/esm/sd-radio-group.entry.js +3 -3
  346. package/dist/esm/sd-radio.entry.js +18 -27
  347. package/dist/esm/sd-select-dropdown_2.entry.js +4 -4
  348. package/dist/esm/sd-select-group.entry.js +2 -2
  349. package/dist/esm/sd-select-multiple-group.entry.js +2 -2
  350. package/dist/esm/sd-select-multiple.entry.js +2 -2
  351. package/dist/esm/sd-select-option-group.entry.js +4 -4
  352. package/dist/esm/sd-select-v2-list-item_4.entry.js +29 -24
  353. package/dist/esm/sd-select.entry.js +2 -2
  354. package/dist/esm/sd-switch.entry.js +2 -2
  355. package/dist/esm/sd-table.entry.js +6 -6
  356. package/dist/esm/sd-tabs.entry.js +2 -2
  357. package/dist/esm/sd-tag.entry.js +3 -3
  358. package/dist/esm/sd-tbody.entry.js +2 -2
  359. package/dist/esm/sd-td.entry.js +2 -2
  360. package/dist/esm/sd-text-link.entry.js +4 -4
  361. package/dist/esm/sd-textarea.entry.js +3 -3
  362. package/dist/esm/sd-thead.entry.js +4 -4
  363. package/dist/esm/sd-toast-container.entry.js +3 -3
  364. package/dist/esm/sd-toast.entry.js +3 -3
  365. package/dist/esm/sd-toggle.entry.js +2 -2
  366. package/dist/esm/sd-tr.entry.js +3 -3
  367. package/dist/esm/system-C-txBx-h.js +14 -0
  368. package/dist/esm/table-test.entry.js +2 -2
  369. package/dist/esm/{tooltipArrow-BcsrQx1U.js → tooltipArrow-BAjP9_Hx.js} +1 -1
  370. package/dist/types/components/sd-chip/sd-chip.config.d.ts +36 -0
  371. package/dist/types/components/sd-chip/sd-chip.d.ts +47 -0
  372. package/dist/types/components/sd-guide/sd-guide.config.d.ts +44 -0
  373. package/dist/types/components/sd-guide/sd-guide.d.ts +3 -4
  374. package/dist/types/components/sd-loading-container/sd-loading-container.config.d.ts +1 -1
  375. package/dist/types/components/sd-loading-modal/sd-loading-modal.d.ts +1 -0
  376. package/dist/types/components/sd-modal-container/sd-modal-container.config.d.ts +1 -0
  377. package/dist/types/components/sd-modal-container/sd-modal-container.d.ts +12 -16
  378. package/dist/types/components/sd-pagination/sd-pagination.config.d.ts +23 -0
  379. package/dist/types/components/sd-pagination/sd-pagination.d.ts +3 -3
  380. package/dist/types/components/sd-radio/sd-radio.config.d.ts +1 -0
  381. package/dist/types/components/sd-select-v2/sd-select-v2.config.d.ts +2 -1
  382. package/dist/types/components/sd-table/sd-table.stories.helpers.d.ts +29 -0
  383. package/dist/types/components/sd-toast-container/sd-toast-container.config.d.ts +1 -1
  384. package/dist/types/components.d.ts +134 -16
  385. package/dist/types/utils/modal-stack.d.ts +17 -0
  386. package/hydrate/index.js +1004 -385
  387. package/hydrate/index.mjs +1004 -385
  388. package/package.json +1 -1
  389. package/dist/components/p-6LkBUj0w.js +0 -1
  390. package/dist/components/p-B1S4ybd6.js +0 -1
  391. package/dist/components/p-CU095QAR.js +0 -1
  392. package/dist/components/p-DBnszF5F.js +0 -1
  393. package/dist/components/p-DpsDTjcN.js +0 -1
  394. package/dist/components/p-DuYi4aqj.js +0 -1
  395. package/dist/components/p-VXLJLI30.js +0 -1
  396. package/dist/components/p-kZ5N_lFC.js +0 -1
  397. package/dist/design-system/p-12a03c88.entry.js +0 -1
  398. package/dist/design-system/p-15cda79c.entry.js +0 -1
  399. package/dist/design-system/p-2f64dd95.entry.js +0 -1
  400. package/dist/design-system/p-33e4ce64.entry.js +0 -1
  401. package/dist/design-system/p-7e09fdd5.entry.js +0 -1
  402. package/dist/design-system/p-8acf3b67.entry.js +0 -1
  403. package/dist/design-system/p-BqHL8W3c.js +0 -2
  404. package/dist/design-system/p-ae1800c0.entry.js +0 -1
  405. package/dist/design-system/p-b6e02544.entry.js +0 -1
  406. package/dist/design-system/p-cf1156cb.entry.js +0 -1
  407. package/dist/design-system/p-e1fdd540.entry.js +0 -1
  408. package/dist/design-system/p-f9b9204d.entry.js +0 -1
package/hydrate/index.js CHANGED
@@ -136,7 +136,7 @@ var node_crypto = require('node:crypto');
136
136
  const NAMESPACE = 'design-system';
137
137
  const BUILD = /* design-system */ { hotModuleReplacement: false, hydratedSelectorName: "hydrated", slotRelocation: true, state: true, updatable: true};
138
138
 
139
- const globalStyles = ":root{--color-primary:#051D36;--sd-primary:#051D36;--color-secondary:#555555;--sd-secondary:#555555;--color-accent:#9C27B0;--sd-accent:#9C27B0;--color-positive:#0075FF;--sd-positive:#0075FF;--color-negative:#E30000;--sd-negative:#E30000;--color-info:#00CD52;--sd-info:#00CD52;--color-warning:#F2C037;--sd-warning:#F2C037;--color-caution_bg:#FEF1F1;--sd-caution_bg:#FEF1F1;--color-caution_icon:#FD9595;--sd-caution_icon:#FD9595;--color-header_alert:#FF7A00;--sd-header_alert:#FF7A00;--color-white:#FFFFFF;--sd-white:#FFFFFF;--color-black:#000000;--sd-black:#000000;--color-grey_10:#F6F6F6;--sd-grey_10:#F6F6F6;--color-grey_20:#EEEEEE;--sd-grey_20:#EEEEEE;--color-grey_25:#E5E5E5;--sd-grey_25:#E5E5E5;--color-grey_30:#E1E1E1;--sd-grey_30:#E1E1E1;--color-grey_35:#D8D8D8;--sd-grey_35:#D8D8D8;--color-grey_45:#CCCCCC;--sd-grey_45:#CCCCCC;--color-grey_50:#BBBBBB;--sd-grey_50:#BBBBBB;--color-grey_55:#AAAAAA;--sd-grey_55:#AAAAAA;--color-grey_60:#999999;--sd-grey_60:#999999;--color-grey_65:#888888;--sd-grey_65:#888888;--color-grey_70:#737373;--sd-grey_70:#737373;--color-grey_80:#555555;--sd-grey_80:#555555;--color-grey_85:#444444;--sd-grey_85:#444444;--color-grey_90:#333333;--sd-grey_90:#333333;--color-grey_95:#222222;--sd-grey_95:#222222;--color-grey_05:#F9F9F9;--sd-grey_05:#F9F9F9;--color-red_15:#FCEFEF;--sd-red_15:#FCEFEF;--color-red_20:#FCE6E6;--sd-red_20:#FCE6E6;--color-red_30:#FFD3D3;--sd-red_30:#FFD3D3;--color-red_45:#FFB5B5;--sd-red_45:#FFB5B5;--color-red_60:#FF7C7C;--sd-red_60:#FF7C7C;--color-red_70:#FB4444;--sd-red_70:#FB4444;--color-red_75:#E30000;--sd-red_75:#E30000;--color-red_75_006:#E30000;--sd-red_75_006:#E30000;--color-red_80:#AD0000;--sd-red_80:#AD0000;--color-red_85:#820000;--sd-red_85:#820000;--color-red_90:#5E0000;--sd-red_90:#5E0000;--color-red_95:#440000;--sd-red_95:#440000;--color-red_99:#220000;--sd-red_99:#220000;--color-orange_10:#FEF1EA;--sd-orange_10:#FEF1EA;--color-orange_20:#FFEAD7;--sd-orange_20:#FFEAD7;--color-orange_35:#FFD5AF;--sd-orange_35:#FFD5AF;--color-orange_45:#FFBC81;--sd-orange_45:#FFBC81;--color-orange_55:#FFA452;--sd-orange_55:#FFA452;--color-orange_60:#FF7F22;--sd-orange_60:#FF7F22;--color-orange_65:#FF6B00;--sd-orange_65:#FF6B00;--color-orange_75:#CE4900;--sd-orange_75:#CE4900;--color-orange_85:#9B3700;--sd-orange_85:#9B3700;--color-orange_90:#752A00;--sd-orange_90:#752A00;--color-orange_95:#4D1B00;--sd-orange_95:#4D1B00;--color-orange_99:#2F1100;--sd-orange_99:#2F1100;--color-yellow_10:#FFF7DD;--sd-yellow_10:#FFF7DD;--color-yellow_20:#FEF1C4;--sd-yellow_20:#FEF1C4;--color-yellow_25:#FFE99E;--sd-yellow_25:#FFE99E;--color-yellow_30:#FEE17C;--sd-yellow_30:#FEE17C;--color-yellow_40:#FFD643;--sd-yellow_40:#FFD643;--color-yellow_45:#FFC700;--sd-yellow_45:#FFC700;--color-yellow_50:#EBB110;--sd-yellow_50:#EBB110;--color-yellow_60:#CA9612;--sd-yellow_60:#CA9612;--color-yellow_70:#916C0D;--sd-yellow_70:#916C0D;--color-yellow_80:#6C5002;--sd-yellow_80:#6C5002;--color-yellow_90:#453602;--sd-yellow_90:#453602;--color-yellow_95:#322700;--sd-yellow_95:#322700;--color-olive_10:#FBFBBF;--sd-olive_10:#FBFBBF;--color-olive_15:#FAFAA1;--sd-olive_15:#FAFAA1;--color-olive_20:#F6F65F;--sd-olive_20:#F6F65F;--color-olive_30:#EEEE37;--sd-olive_30:#EEEE37;--color-olive_45:#DDDD12;--sd-olive_45:#DDDD12;--color-olive_55:#C7C700;--sd-olive_55:#C7C700;--color-olive_65:#A5A500;--sd-olive_65:#A5A500;--color-olive_70:#838300;--sd-olive_70:#838300;--color-olive_80:#636300;--sd-olive_80:#636300;--color-olive_90:#454500;--sd-olive_90:#454500;--color-olive_95:#2C2C00;--sd-olive_95:#2C2C00;--color-olive_05:#FEFED9;--sd-olive_05:#FEFED9;--color-green_15:#E8F9EF;--sd-green_15:#E8F9EF;--color-green_25:#D4FAE3;--sd-green_25:#D4FAE3;--color-green_45:#ACF4C9;--sd-green_45:#ACF4C9;--color-green_55:#6DE39C;--sd-green_55:#6DE39C;--color-green_65:#2BCE6C;--sd-green_65:#2BCE6C;--color-green_70:#12B553;--sd-green_70:#12B553;--color-green_75:#00973C;--sd-green_75:#00973C;--color-green_80:#007B31;--sd-green_80:#007B31;--color-green_85:#006629;--sd-green_85:#006629;--color-green_90:#00461C;--sd-green_90:#00461C;--color-green_95:#003013;--sd-green_95:#003013;--color-green_99:#001D0B;--sd-green_99:#001D0B;--color-steelblue_10:#ECF8FD;--sd-steelblue_10:#ECF8FD;--color-steelblue_25:#D9F2FD;--sd-steelblue_25:#D9F2FD;--color-steelblue_45:#A4E2FD;--sd-steelblue_45:#A4E2FD;--color-steelblue_60:#50BFF0;--sd-steelblue_60:#50BFF0;--color-steelblue_65:#229FD7;--sd-steelblue_65:#229FD7;--color-steelblue_70:#128FC7;--sd-steelblue_70:#128FC7;--color-steelblue_75:#066D9B;--sd-steelblue_75:#066D9B;--color-steelblue_80:#06587D;--sd-steelblue_80:#06587D;--color-steelblue_85:#033F59;--sd-steelblue_85:#033F59;--color-steelblue_90:#032D40;--sd-steelblue_90:#032D40;--color-steelblue_95:#02212F;--sd-steelblue_95:#02212F;--color-steelblue_99:#021A25;--sd-steelblue_99:#021A25;--color-oceanblue_15:#EAF5FE;--sd-oceanblue_15:#EAF5FE;--color-oceanblue_25:#D5EBFE;--sd-oceanblue_25:#D5EBFE;--color-oceanblue_50:#9CD1FC;--sd-oceanblue_50:#9CD1FC;--color-oceanblue_60:#5CB0F3;--sd-oceanblue_60:#5CB0F3;--color-oceanblue_65:#1F8AE1;--sd-oceanblue_65:#1F8AE1;--color-oceanblue_70:#006AC1;--sd-oceanblue_70:#006AC1;--color-oceanblue_75:#025497;--sd-oceanblue_75:#025497;--color-oceanblue_80:#004177;--sd-oceanblue_80:#004177;--color-oceanblue_85:#07284A;--sd-oceanblue_85:#07284A;--color-oceanblue_90:#051D36;--sd-oceanblue_90:#051D36;--color-oceanblue_95:#03172D;--sd-oceanblue_95:#03172D;--color-oceanblue_99:#011428;--sd-oceanblue_99:#011428;--color-brilliantblue_10:#EFF6FF;--sd-brilliantblue_10:#EFF6FF;--color-brilliantblue_20:#E6F1FF;--sd-brilliantblue_20:#E6F1FF;--color-brilliantblue_25:#D9EAFF;--sd-brilliantblue_25:#D9EAFF;--color-brilliantblue_40:#BBDAFF;--sd-brilliantblue_40:#BBDAFF;--color-brilliantblue_50:#93C4FF;--sd-brilliantblue_50:#93C4FF;--color-brilliantblue_60:#64ABFF;--sd-brilliantblue_60:#64ABFF;--color-brilliantblue_70:#2D8DFF;--sd-brilliantblue_70:#2D8DFF;--color-brilliantblue_75:#0075FF;--sd-brilliantblue_75:#0075FF;--color-brilliantblue_80:#005CC9;--sd-brilliantblue_80:#005CC9;--color-brilliantblue_85:#004290;--sd-brilliantblue_85:#004290;--color-brilliantblue_90:#002B5E;--sd-brilliantblue_90:#002B5E;--color-brilliantblue_95:#001B39;--sd-brilliantblue_95:#001B39;--color-brilliantblue_99:#001226;--sd-brilliantblue_99:#001226;--color-brilliantblue_05:#F5FAFF;--sd-brilliantblue_05:#F5FAFF;--sd-system-typography-control-xs-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-xs-font-size:12px;--sd-system-typography-control-xs-font-weight:500;--sd-system-typography-control-xs-text-decoration:none;--sd-system-typography-control-xs-line-height:20px;--sd-system-typography-control-sm-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-sm-default-font-size:12px;--sd-system-typography-control-sm-default-font-weight:500;--sd-system-typography-control-sm-default-text-decoration:none;--sd-system-typography-control-sm-default-line-height:20px;--sd-system-typography-control-sm-underline-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-sm-underline-font-size:12px;--sd-system-typography-control-sm-underline-font-weight:500;--sd-system-typography-control-sm-underline-text-decoration:underline;--sd-system-typography-control-sm-underline-line-height:22px;--sd-system-typography-control-md-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-md-font-size:16px;--sd-system-typography-control-md-font-weight:500;--sd-system-typography-control-md-text-decoration:none;--sd-system-typography-control-md-line-height:26px;--sd-system-typography-control-lg-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-lg-font-size:18px;--sd-system-typography-control-lg-font-weight:500;--sd-system-typography-control-lg-text-decoration:none;--sd-system-typography-control-lg-line-height:30px;--sd-system-typography-feedback-xs-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-xs-font-size:11px;--sd-system-typography-feedback-xs-font-weight:500;--sd-system-typography-feedback-xs-line-height:18px;--sd-system-typography-feedback-xs-text-decoration:none;--sd-system-typography-feedback-sm-regular-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-sm-regular-font-size:12px;--sd-system-typography-feedback-sm-regular-font-weight:400;--sd-system-typography-feedback-sm-regular-line-height:20px;--sd-system-typography-feedback-sm-regular-text-decoration:none;--sd-system-typography-feedback-sm-medium-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-sm-medium-font-size:12px;--sd-system-typography-feedback-sm-medium-font-weight:500;--sd-system-typography-feedback-sm-medium-line-height:20px;--sd-system-typography-feedback-sm-medium-text-decoration:none;--sd-system-typography-feedback-sm-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-sm-bold-font-size:12px;--sd-system-typography-feedback-sm-bold-font-weight:700;--sd-system-typography-feedback-sm-bold-text-decoration:none;--sd-system-typography-feedback-sm-bold-line-height:20px;--sd-system-typography-feedback-sm-underline-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-sm-underline-font-size:12px;--sd-system-typography-feedback-sm-underline-font-weight:500;--sd-system-typography-feedback-sm-underline-line-height:20px;--sd-system-typography-feedback-sm-underline-text-decoration:underline;--sd-system-typography-feedback-md-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-md-bold-font-size:14px;--sd-system-typography-feedback-md-bold-font-weight:700;--sd-system-typography-feedback-md-bold-line-height:24px;--sd-system-typography-feedback-md-bold-text-decoration:none;--sd-system-typography-feedback-md-underline-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-md-underline-font-size:14px;--sd-system-typography-feedback-md-underline-font-weight:700;--sd-system-typography-feedback-md-underline-line-height:24px;--sd-system-typography-feedback-md-underline-text-decoration:underline;--sd-system-typography-heading-sm-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-heading-sm-font-weight:700;--sd-system-typography-heading-sm-font-size:14px;--sd-system-typography-heading-sm-line-height:24px;--sd-system-typography-heading-sm-text-decoration:none;--sd-system-typography-heading-md-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-heading-md-font-weight:700;--sd-system-typography-heading-md-font-size:16px;--sd-system-typography-heading-md-text-decoration:none;--sd-system-typography-heading-md-line-height:26px;--sd-system-typography-heading-lg-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-heading-lg-font-weight:700;--sd-system-typography-heading-lg-font-size:18px;--sd-system-typography-heading-lg-line-height:30px;--sd-system-typography-heading-lg-text-decoration:none;--sd-system-typography-field-sm-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-sm-default-font-weight:400;--sd-system-typography-field-sm-default-font-size:12px;--sd-system-typography-field-sm-default-line-height:20px;--sd-system-typography-field-sm-default-text-decoration:none;--sd-system-typography-field-sm-medium-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-sm-medium-font-weight:500;--sd-system-typography-field-sm-medium-font-size:12px;--sd-system-typography-field-sm-medium-text-decoration:none;--sd-system-typography-field-sm-medium-line-height:20px;--sd-system-typography-field-sm-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-sm-bold-font-weight:700;--sd-system-typography-field-sm-bold-font-size:12px;--sd-system-typography-field-sm-bold-text-decoration:none;--sd-system-typography-field-sm-bold-line-height:20px;--sd-system-typography-field-md-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-md-default-font-weight:400;--sd-system-typography-field-md-default-font-size:14px;--sd-system-typography-field-md-default-text-decoration:none;--sd-system-typography-field-md-default-line-height:24px;--sd-system-typography-field-md-medium-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-md-medium-font-weight:500;--sd-system-typography-field-md-medium-font-size:14px;--sd-system-typography-field-md-medium-text-decoration:none;--sd-system-typography-field-md-medium-line-height:24px;--sd-system-typography-field-md-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-md-bold-font-weight:700;--sd-system-typography-field-md-bold-font-size:14px;--sd-system-typography-field-md-bold-text-decoration:none;--sd-system-typography-field-md-bold-line-height:24px;--sd-system-typography-field-lg-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-lg-default-font-weight:400;--sd-system-typography-field-lg-default-font-size:16px;--sd-system-typography-field-lg-default-line-height:26px;--sd-system-typography-field-lg-default-text-decoration:none;--sd-system-typography-field-lg-medium-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-lg-medium-font-weight:500;--sd-system-typography-field-lg-medium-font-size:16px;--sd-system-typography-field-lg-medium-line-height:26px;--sd-system-typography-field-lg-medium-text-decoration:none;--sd-system-typography-field-lg-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-lg-bold-font-weight:700;--sd-system-typography-field-lg-bold-font-size:16px;--sd-system-typography-field-lg-bold-line-height:26px;--sd-system-typography-field-lg-bold-text-decoration:none;--sd-system-size-control-xs-height:24px;--sd-system-size-control-sm-height:28px;--sd-system-size-control-md-height:36px;--sd-system-size-control-lg-height:62px;--sd-system-size-icon-xxxs:8px;--sd-system-size-icon-xxs:10px;--sd-system-size-icon-xs:12px;--sd-system-size-icon-sm:16px;--sd-system-size-icon-md:20px;--sd-system-size-icon-lg:24px;--sd-system-size-icon-xl:32px;--sd-system-size-feedback-arrow-width:16px;--sd-system-size-feedback-arrow-height:12px;--sd-system-size-feedback-xs-height:20px;--sd-system-size-feedback-sm-height:24px;--sd-system-size-feedback-md-height:28px;--sd-system-size-field-control:16px;--sd-system-size-field-icon:12px;--sd-system-size-field-sm-height:28px;--sd-system-size-field-md-height:36px;--sd-system-space-control-xs-padding-x:8px;--sd-system-space-control-xs-gap:4px;--sd-system-space-control-sm-padding-x:12px;--sd-system-space-control-sm-gap:6px;--sd-system-space-control-md-padding-x:20px;--sd-system-space-control-md-gap:8px;--sd-system-space-control-lg-padding-x:28px;--sd-system-space-control-lg-gap:12px;--sd-system-space-feedback-xs-padding-x:6px;--sd-system-space-feedback-xs-gap:4px;--sd-system-space-feedback-sm-padding-x:8px;--sd-system-space-feedback-sm-gap:6px;--sd-system-space-feedback-md-padding-x:12px;--sd-system-space-feedback-md-gap:8px;--sd-system-space-stack-gap-tight:2px;--sd-system-space-stack-gap-normal:4px;--sd-system-space-field-sm-padding-x:12px;--sd-system-space-field-sm-padding-y:4px;--sd-system-space-field-sm-container-gap:8px;--sd-system-space-field-sm-gap:12px;--sd-system-space-field-md-padding-x:16px;--sd-system-space-field-md-container-gap:12px;--sd-system-space-field-md-gap:16px;--sd-system-radius-control-sm:4px;--sd-system-radius-control-md:6px;--sd-system-radius-feedback-xs-square:6px;--sd-system-radius-feedback-sm-square:8px;--sd-system-radius-feedback-pill:9999px;--sd-system-radius-field-sm:4px;--sd-system-radius-field-md:6px;--sd-system-border-width-control-default:1px;--sd-system-border-width-field-default:1px;--sd-system-color-bg-screen:#EEEEEE;--sd-system-color-bg-frame:#FFFFFF;--sd-system-color-bg-brand:#025497;--sd-system-color-bg-subtle:#1F8AE1;--sd-system-color-bg-accent-default:#0075FF;--sd-system-color-bg-accent-light:#F5FAFF;--sd-system-color-bg-accent-light-default:#D9EAFF;--sd-system-color-bg-accent-light-light:#F5FAFF;--sd-system-color-bg-deep:#07284A;--sd-system-color-bg-danger-default:#E30000;--sd-system-color-bg-danger-light:#FCEFEF;--sd-system-color-bg-danger-light-default:#FB4444;--sd-system-color-bg-danger-light-light:#FCEFEF;--sd-system-color-bg-warning:#FF6B00;--sd-system-color-bg-caution:#FFC700;--sd-system-color-bg-progress:#0075FF;--sd-system-color-bg-success-default:#00973C;--sd-system-color-bg-success-light:#12B553;--sd-system-color-bg-disabled:#E1E1E1;--sd-system-color-content-primary:#222222;--sd-system-color-content-secondary:#555555;--sd-system-color-content-tertiary:#888888;--sd-system-color-content-quaternary:#AAAAAA;--sd-system-color-content-brand:#005CC9;--sd-system-color-content-subtle:#066D9B;--sd-system-color-content-accent:#0075FF;--sd-system-color-content-danger-default:#E30000;--sd-system-color-content-danger-light:#FB4444;--sd-system-color-content-warning:#FF6B00;--sd-system-color-content-inverse:#FFFFFF;--sd-system-color-text-disabled:#888888;--sd-system-color-link-accent:#006AC1;--sd-system-color-icon-brand:#025497;--sd-system-color-icon-accent:#0075FF;--sd-system-color-icon-danger:#E30000;--sd-system-color-icon-warning:#FF6B00;--sd-system-color-icon-success:#00973C;--sd-system-color-icon-inverse:#FFFFFF;--sd-system-color-icon-disabled:#BBBBBB;--sd-system-color-border-default:#E1E1E1;--sd-system-color-border-accent:#0075FF;--sd-system-color-border-danger:#FB4444;--sd-system-color-border-success:#12B553;--sd-system-color-border-disabled:#CCCCCC;--sd-system-color-red-strong:#FB4444;--sd-system-color-red-subtle:#FCEFEF;--sd-system-color-orange-strong:#FF6B00;--sd-system-color-orange-subtle:#FEF1EA;--sd-system-color-yellow-strong:#916C0D;--sd-system-color-yellow-moderate:#FFC700;--sd-system-color-yellow-subtle:#FFF7DD;--sd-system-color-green-strong:#00973C;--sd-system-color-green-subtle:#E8F9EF;--sd-system-color-blue-strong:#0075FF;--sd-system-color-blue-subtle:#E6F1FF;--sd-system-color-darkblue-strong:#006AC1;--sd-system-color-darkblue-subtle:#EAF5FE;--sd-system-color-indigo-strong:#004290;--sd-system-color-indigo-subtle:#EFF6FF;--sd-system-color-grey-strong:#737373;--sd-system-color-grey-subtle:#EEEEEE;--sd-system-color-field-bg-default:#FFFFFF;--sd-system-color-field-bg-hover:#0075FF;--sd-system-color-field-border-default:#AAAAAA;--sd-system-color-field-border-focus:#0075FF;--sd-system-color-field-border-hover:#0075FF;--sd-system-color-field-border-danger:#FB4444;--sd-system-color-field-border-success:#12B553;--sd-system-color-field-text-default:#222222;--sd-system-color-field-text-placeholder:#AAAAAA;--sd-system-color-field-icon-default:#888888;--sd-system-color-divider-default:#E1E1E1;--sd-system-color-control-bg-inverse-hover:#0075FF;--sd-button-button-xs-height:24px;--sd-button-button-xs-padding-x:8px;--sd-button-button-xs-gap:4px;--sd-button-button-xs-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-button-button-xs-typography-font-size:12px;--sd-button-button-xs-typography-font-weight:500;--sd-button-button-xs-typography-text-decoration:none;--sd-button-button-xs-typography-line-height:20px;--sd-button-button-xs-icon:12px;--sd-button-button-sm-height:28px;--sd-button-button-sm-padding-x:12px;--sd-button-button-sm-gap:6px;--sd-button-button-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-button-button-sm-typography-font-size:12px;--sd-button-button-sm-typography-font-weight:500;--sd-button-button-sm-typography-text-decoration:none;--sd-button-button-sm-typography-line-height:20px;--sd-button-button-sm-icon:16px;--sd-button-button-md-height:36px;--sd-button-button-md-padding-x:20px;--sd-button-button-md-gap:8px;--sd-button-button-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-button-button-md-typography-font-size:16px;--sd-button-button-md-typography-font-weight:500;--sd-button-button-md-typography-text-decoration:none;--sd-button-button-md-typography-line-height:26px;--sd-button-button-md-icon:20px;--sd-button-button-lg-height:62px;--sd-button-button-lg-padding-x:28px;--sd-button-button-lg-gap:12px;--sd-button-button-lg-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-button-button-lg-typography-font-size:18px;--sd-button-button-lg-typography-font-weight:500;--sd-button-button-lg-typography-text-decoration:none;--sd-button-button-lg-typography-line-height:30px;--sd-button-button-lg-icon:24px;--sd-button-button-radius-sm:4px;--sd-button-button-radius-md:6px;--sd-button-button-border-width-default:1px;--sd-button-button-border-disabled:#CCCCCC;--sd-button-button-icon-only-xs-width:24px;--sd-button-button-icon-only-sm-width:28px;--sd-button-button-icon-only-md-width:36px;--sd-button-button-icon-only-lg-width:62px;--sd-button-button-bg-disabled:#E1E1E1;--sd-button-button-text-disabled:#888888;--sd-button-button-icon-disabled:#BBBBBB;--sd-button-button-brand-strong-bg-default:#025497;--sd-button-button-brand-strong-bg-hover:#004177;--sd-button-button-brand-strong-content:#FFFFFF;--sd-button-button-brand-strong-dropdown-divider:#006AC1;--sd-button-button-brand-subtle-bg-default:#1F8AE1;--sd-button-button-brand-subtle-bg-hover:#006AC1;--sd-button-button-brand-subtle-content:#FFFFFF;--sd-button-button-brand-subtle-dropdown-divider:#5CB0F3;--sd-button-button-brand-outline-bg-default:#FFFFFF;--sd-button-button-brand-outline-bg-hover:#EAF5FE;--sd-button-button-brand-outline-border:#025497;--sd-button-button-brand-outline-content:#025497;--sd-button-button-neutral-outline-bg-default:#FFFFFF;--sd-button-button-neutral-outline-bg-hover:#EEEEEE;--sd-button-button-neutral-outline-border:#888888;--sd-button-button-neutral-outline-content:#222222;--sd-button-button-danger-strong-bg-default:#E30000;--sd-button-button-danger-strong-bg-hover:#AD0000;--sd-button-button-danger-strong-content:#FFFFFF;--sd-button-button-danger-strong-dropdown-divider:#FF7C7C;--sd-button-button-danger-outline-bg-default:#FFFFFF;--sd-button-button-danger-outline-bg-hover:#FCEFEF;--sd-button-button-danger-outline-border:#E30000;--sd-button-button-danger-outline-content:#E30000;--sd-ghost-button-ghost-button-xxs-size:16px;--sd-ghost-button-ghost-button-xxs-icon:12px;--sd-ghost-button-ghost-button-xs-size:24px;--sd-ghost-button-ghost-button-xs-icon:16px;--sd-ghost-button-ghost-button-sm-size:28px;--sd-ghost-button-ghost-button-sm-icon:20px;--sd-ghost-button-ghost-button-md-size:36px;--sd-ghost-button-ghost-button-md-icon:24px;--sd-ghost-button-ghost-button-lg-size:62px;--sd-ghost-button-ghost-button-lg-icon:32px;--sd-ghost-button-ghost-button-radius-sm:4px;--sd-ghost-button-ghost-button-radius-md:6px;--sd-ghost-button-ghost-button-hover-opacity:5%;--sd-ghost-button-ghost-button-icon-disabled:#BBBBBB;--sd-ghost-button-ghost-button-default-content:#888888;--sd-ghost-button-ghost-button-default-hover-bg:#222222;--sd-ghost-button-ghost-button-danger-content:#E30000;--sd-ghost-button-ghost-button-danger-hover-bg:#E30000;--sd-ghost-button-ghost-button-action-content:#025497;--sd-ghost-button-ghost-button-action-hover-bg:#0075FF;--sd-ghost-button-ghost-button-inverse-content:#FFFFFF;--sd-ghost-button-ghost-button-inverse-disabled:#E1E1E1;--sd-ghost-button-ghost-button-inverse-hover-bg:#FFFFFF;--sd-text-link-text-link-gap:4px;--sd-text-link-text-link-size-icon:16px;--sd-text-link-text-link-typography-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-text-link-text-link-typography-default-font-size:12px;--sd-text-link-text-link-typography-default-font-weight:500;--sd-text-link-text-link-typography-default-text-decoration:none;--sd-text-link-text-link-typography-default-line-height:20px;--sd-text-link-text-link-typography-underline-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-text-link-text-link-typography-underline-font-size:12px;--sd-text-link-text-link-typography-underline-font-weight:500;--sd-text-link-text-link-typography-underline-text-decoration:underline;--sd-text-link-text-link-typography-underline-line-height:22px;--sd-text-link-text-link-content-default:#222222;--sd-text-link-text-link-content-disabled:#888888;--sd-text-link-text-link-icon-default:#006AC1;--sd-text-link-text-link-icon-disabled:#BBBBBB;--sd-checkbox-checkbox-size:16px;--sd-checkbox-checkbox-radius:2px;--sd-checkbox-checkbox-border-width:1px;--sd-checkbox-checkbox-gap:8px;--sd-checkbox-checkbox-icon:12px;--sd-checkbox-checkbox-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-checkbox-checkbox-typography-font-weight:400;--sd-checkbox-checkbox-typography-font-size:12px;--sd-checkbox-checkbox-typography-line-height:20px;--sd-checkbox-checkbox-typography-text-decoration:none;--sd-checkbox-checkbox-unchecked-bg-default:#FFFFFF;--sd-checkbox-checkbox-unchecked-bg-hover:#D9EAFF;--sd-checkbox-checkbox-unchecked-border-default:#AAAAAA;--sd-checkbox-checkbox-unchecked-border-hover:#0075FF;--sd-checkbox-checkbox-checked-bg-default:#0075FF;--sd-checkbox-checkbox-checked-icon-default:#FFFFFF;--sd-checkbox-checkbox-checked-icon-disabled:#BBBBBB;--sd-checkbox-checkbox-checked-icon-inverse:#FFFFFF;--sd-checkbox-checkbox-checked-border-inverse:#FFFFFF;--sd-checkbox-checkbox-label-default:#222222;--sd-checkbox-checkbox-label-inverse:#FFFFFF;--sd-checkbox-checkbox-bg-disabled:#E1E1E1;--sd-checkbox-checkbox-border-disabled:#CCCCCC;--sd-radio-radio-size:16px;--sd-radio-radio-radius:9999px;--sd-radio-radio-border-width:1px;--sd-radio-radio-gap:8px;--sd-radio-radio-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-radio-radio-typography-font-weight:400;--sd-radio-radio-typography-font-size:12px;--sd-radio-radio-typography-line-height:20px;--sd-radio-radio-typography-text-decoration:none;--sd-radio-radio-bg-default:#FFFFFF;--sd-radio-radio-bg-disabled:#E1E1E1;--sd-radio-radio-unchecked-bg-hover:#D9EAFF;--sd-radio-radio-unchecked-border-default:#AAAAAA;--sd-radio-radio-unchecked-border-hover:#0075FF;--sd-radio-radio-checked-border-default:#0075FF;--sd-radio-radio-checked-dot-default:#0075FF;--sd-radio-radio-border-disabled:#CCCCCC;--sd-radio-radio-dot-disabled:#CCCCCC;--sd-radio-radio-label-default:#222222;--sd-list-item-list-item-padding-y:4px;--sd-list-item-list-item-padding-right:12px;--sd-list-item-list-item-gap:8px;--sd-list-item-list-item-padding-left-depth1:12px;--sd-list-item-list-item-padding-left-depth2:20px;--sd-list-item-list-item-padding-left-depth3:28px;--sd-list-item-list-item-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-typography-font-weight:400;--sd-list-item-list-item-typography-font-size:12px;--sd-list-item-list-item-typography-line-height:20px;--sd-list-item-list-item-typography-text-decoration:none;--sd-list-item-list-item-bg-default:#FFFFFF;--sd-list-item-list-item-bg-hover:#0075FF;--sd-list-item-list-item-content-default:#222222;--sd-list-item-list-item-content-hover:#FFFFFF;--sd-list-item-list-item-content-disabled:#888888;--sd-list-item-list-item-indeterminate-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-indeterminate-typography-font-weight:700;--sd-list-item-list-item-indeterminate-typography-font-size:12px;--sd-list-item-list-item-indeterminate-typography-text-decoration:none;--sd-list-item-list-item-indeterminate-typography-line-height:20px;--sd-list-item-list-item-depth1-bg-default:#EFF6FF;--sd-list-item-list-item-depth1-bg-disabled:#EEEEEE;--sd-list-item-list-item-depth1-border-color:#E1E1E1;--sd-list-item-list-item-depth1-border-width:1px;--sd-list-item-list-item-depth1-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-depth1-title-typography-font-weight:700;--sd-list-item-list-item-depth1-title-typography-font-size:12px;--sd-list-item-list-item-depth1-title-typography-text-decoration:none;--sd-list-item-list-item-depth1-title-typography-line-height:20px;--sd-list-item-list-item-depth2-middle-bg:#F6F6F6;--sd-list-item-list-item-depth2-middle-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-depth2-middle-title-typography-font-weight:500;--sd-list-item-list-item-depth2-middle-title-typography-font-size:12px;--sd-list-item-list-item-depth2-middle-title-typography-text-decoration:none;--sd-list-item-list-item-depth2-middle-title-typography-line-height:20px;--sd-list-item-list-item-count-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-count-typography-font-weight:500;--sd-list-item-list-item-count-typography-font-size:12px;--sd-list-item-list-item-count-typography-text-decoration:none;--sd-list-item-list-item-count-typography-line-height:20px;--sd-list-item-list-item-count-color:#888888;--sd-list-box-list-box-radius:4px;--sd-list-box-list-box-bg:#FFFFFF;--sd-list-box-list-box-padding-bottom:4px;--sd-select-select-height:28px;--sd-select-select-radius:4px;--sd-select-select-border-width:1px;--sd-select-select-padding-x:12px;--sd-select-select-icon-default:#888888;--sd-select-select-icon-disabled:#BBBBBB;--sd-select-select-gap:8px;--sd-select-select-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-select-select-typography-font-weight:400;--sd-select-select-typography-font-size:12px;--sd-select-select-typography-line-height:20px;--sd-select-select-typography-text-decoration:none;--sd-select-select-border-default:#AAAAAA;--sd-select-select-border-hover:#0075FF;--sd-select-select-border-danger:#FB4444;--sd-select-select-border-disabled:#CCCCCC;--sd-select-select-bg-default:#FFFFFF;--sd-select-select-bg-disabled:#E1E1E1;--sd-select-select-text-default:#222222;--sd-select-select-text-disabled:#888888;--sd-select-select-size-icon:16px;--sd-field-field-label-sm-height:28px;--sd-field-field-label-sm-gap:6px;--sd-field-field-label-sm-icon:12px;--sd-field-field-label-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-field-field-label-sm-typography-font-weight:700;--sd-field-field-label-sm-typography-font-size:12px;--sd-field-field-label-sm-typography-text-decoration:none;--sd-field-field-label-sm-typography-line-height:20px;--sd-field-field-label-md-height:36px;--sd-field-field-label-md-gap:8px;--sd-field-field-label-md-icon:16px;--sd-field-field-label-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-field-field-label-md-typography-font-weight:700;--sd-field-field-label-md-typography-font-size:16px;--sd-field-field-label-md-typography-line-height:26px;--sd-field-field-label-md-typography-text-decoration:none;--sd-field-field-addon-label-height:28px;--sd-field-field-addon-label-gap:6px;--sd-field-field-addon-label-padding-x:12px;--sd-field-field-addon-label-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-field-field-addon-label-typography-font-weight:500;--sd-field-field-addon-label-typography-font-size:12px;--sd-field-field-addon-label-typography-text-decoration:none;--sd-field-field-addon-label-typography-line-height:20px;--sd-field-field-addon-label-bg:#F6F6F6;--sd-field-field-addon-label-border-default:#AAAAAA;--sd-field-field-addon-label-border-disabled:#CCCCCC;--sd-field-field-addon-label-border-width:1px;--sd-textinput-textinput-sm-height:28px;--sd-textinput-textinput-sm-padding-x:12px;--sd-textinput-textinput-sm-padding-y:4px;--sd-textinput-textinput-sm-gap:8px;--sd-textinput-textinput-sm-radius:4px;--sd-textinput-textinput-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-textinput-textinput-sm-typography-font-weight:400;--sd-textinput-textinput-sm-typography-font-size:12px;--sd-textinput-textinput-sm-typography-line-height:20px;--sd-textinput-textinput-sm-typography-text-decoration:none;--sd-textinput-textinput-md-height:36px;--sd-textinput-textinput-md-padding-x:16px;--sd-textinput-textinput-md-gap:12px;--sd-textinput-textinput-md-radius:6px;--sd-textinput-textinput-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-textinput-textinput-md-typography-font-weight:400;--sd-textinput-textinput-md-typography-font-size:16px;--sd-textinput-textinput-md-typography-line-height:26px;--sd-textinput-textinput-md-typography-text-decoration:none;--sd-textinput-textinput-border-width:1px;--sd-textinput-textinput-border-default:#AAAAAA;--sd-textinput-textinput-border-focus:#0075FF;--sd-textinput-textinput-border-danger:#FB4444;--sd-textinput-textinput-border-success:#12B553;--sd-textinput-textinput-border-disabled:#CCCCCC;--sd-textinput-textinput-bg-default:#FFFFFF;--sd-textinput-textinput-bg-disabled:#E1E1E1;--sd-textinput-textinput-bg-barcode:#FAFAA1;--sd-textinput-textinput-text-default:#222222;--sd-textinput-textinput-text-placeholder:#AAAAAA;--sd-textinput-textinput-text-disabled:#888888;--sd-textinput-textinput-text-hint:#555555;--sd-textinput-textinput-text-error-message:#E30000;--sd-textinput-textinput-size-icon:16px;--sd-textinput-textinput-icon-default:#888888;--sd-textinput-textinput-unit-color:#888888;--sd-textinput-textinput-hint-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-textinput-textinput-hint-typography-font-weight:400;--sd-textinput-textinput-hint-typography-font-size:12px;--sd-textinput-textinput-hint-typography-line-height:20px;--sd-textinput-textinput-hint-typography-text-decoration:none;--sd-textinput-textinput-error-message-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-textinput-textinput-error-message-typography-font-weight:400;--sd-textinput-textinput-error-message-typography-font-size:12px;--sd-textinput-textinput-error-message-typography-line-height:20px;--sd-textinput-textinput-error-message-typography-text-decoration:none;--sd-textinput-textinput-contents-gap:4px;--sd-textinput-textinput-resizer-size:12px;--sd-textinput-textinput-resizer-color:#AAAAAA;--sd-number-input-number-input-sm-height:28px;--sd-number-input-number-input-sm-padding-x:6px;--sd-number-input-number-input-sm-radius:4px;--sd-number-input-number-input-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-number-input-number-input-sm-typography-font-weight:400;--sd-number-input-number-input-sm-typography-font-size:12px;--sd-number-input-number-input-sm-typography-line-height:20px;--sd-number-input-number-input-sm-typography-text-decoration:none;--sd-number-input-number-input-md-height:36px;--sd-number-input-number-input-md-padding-x:8px;--sd-number-input-number-input-md-radius:6px;--sd-number-input-number-input-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-number-input-number-input-md-typography-font-weight:400;--sd-number-input-number-input-md-typography-font-size:16px;--sd-number-input-number-input-md-typography-line-height:26px;--sd-number-input-number-input-md-typography-text-decoration:none;--sd-number-input-number-input-border-width:1px;--sd-number-input-number-input-contents-gap:4px;--sd-number-input-number-input-border-default:#AAAAAA;--sd-number-input-number-input-border-focus:#0075FF;--sd-number-input-number-input-border-danger:#FB4444;--sd-number-input-number-input-border-success:#12B553;--sd-number-input-number-input-border-disabled:#CCCCCC;--sd-number-input-number-input-bg-default:#FFFFFF;--sd-number-input-number-input-bg-disabled:#E1E1E1;--sd-number-input-number-input-text-default:#222222;--sd-number-input-number-input-text-placeholder:#AAAAAA;--sd-number-input-number-input-text-disabled:#888888;--sd-number-input-number-input-hint-color:#555555;--sd-number-input-number-input-hint-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-number-input-number-input-hint-typography-font-weight:400;--sd-number-input-number-input-hint-typography-font-size:12px;--sd-number-input-number-input-hint-typography-line-height:20px;--sd-number-input-number-input-hint-typography-text-decoration:none;--sd-number-input-number-input-error-message-color:#E30000;--sd-number-input-number-input-error-message-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-number-input-number-input-error-message-typography-font-weight:400;--sd-number-input-number-input-error-message-typography-font-size:12px;--sd-number-input-number-input-error-message-typography-line-height:20px;--sd-number-input-number-input-error-message-typography-text-decoration:none;--sd-number-input-number-input-stepper-sm-size:20px;--sd-number-input-number-input-stepper-md-size:24px;--sd-number-input-number-input-stepper-radius:4px;--sd-number-input-number-input-stepper-bg-default:#EFF6FF;--sd-number-input-number-input-stepper-bg-disabled:#EEEEEE;--sd-number-input-number-input-stepper-icon-default:#0075FF;--sd-number-input-number-input-stepper-icon-disabled:#BBBBBB;--sd-filepicker-filepicker-height:28px;--sd-filepicker-filepicker-padding-x:12px;--sd-filepicker-filepicker-gap:8px;--sd-filepicker-filepicker-radius:4px;--sd-filepicker-filepicker-border-width:1px;--sd-filepicker-filepicker-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-filepicker-filepicker-typography-font-weight:400;--sd-filepicker-filepicker-typography-font-size:12px;--sd-filepicker-filepicker-typography-line-height:20px;--sd-filepicker-filepicker-typography-text-decoration:none;--sd-filepicker-filepicker-size-icon:16px;--sd-filepicker-filepicker-contents-gap:4px;--sd-filepicker-filepicker-border-default:#AAAAAA;--sd-filepicker-filepicker-border-disabled:#CCCCCC;--sd-filepicker-filepicker-bg-default:#FFFFFF;--sd-filepicker-filepicker-bg-disabled:#E1E1E1;--sd-filepicker-filepicker-text-default:#222222;--sd-filepicker-filepicker-text-placeholder:#AAAAAA;--sd-filepicker-filepicker-text-disabled:#888888;--sd-filepicker-filepicker-icon-disabled:#BBBBBB;--sd-datepicker-datepicker-sm-height:28px;--sd-datepicker-datepicker-sm-padding-x:12px;--sd-datepicker-datepicker-sm-gap:8px;--sd-datepicker-datepicker-sm-icon:16px;--sd-datepicker-datepicker-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-sm-typography-font-weight:400;--sd-datepicker-datepicker-sm-typography-font-size:12px;--sd-datepicker-datepicker-sm-typography-line-height:20px;--sd-datepicker-datepicker-sm-typography-text-decoration:none;--sd-datepicker-datepicker-sm-radius:4px;--sd-datepicker-datepicker-sm-date-gap:4px;--sd-datepicker-datepicker-md-height:36px;--sd-datepicker-datepicker-md-padding-x:16px;--sd-datepicker-datepicker-md-gap:12px;--sd-datepicker-datepicker-md-icon:20px;--sd-datepicker-datepicker-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-md-typography-font-weight:400;--sd-datepicker-datepicker-md-typography-font-size:16px;--sd-datepicker-datepicker-md-typography-line-height:26px;--sd-datepicker-datepicker-md-typography-text-decoration:none;--sd-datepicker-datepicker-md-radius:6px;--sd-datepicker-datepicker-md-date-gap:6px;--sd-datepicker-datepicker-border-width:1px;--sd-datepicker-datepicker-border-default:#AAAAAA;--sd-datepicker-datepicker-border-focus:#0075FF;--sd-datepicker-datepicker-border-disabled:#CCCCCC;--sd-datepicker-datepicker-bg-default:#FFFFFF;--sd-datepicker-datepicker-bg-disabled:#E1E1E1;--sd-datepicker-datepicker-icon-default:#888888;--sd-datepicker-datepicker-icon-disabled:#BBBBBB;--sd-datepicker-datepicker-text-default:#222222;--sd-datepicker-datepicker-text-hint:#555555;--sd-datepicker-datepicker-text-disabled:#888888;--sd-datepicker-datepicker-contents-gap:4px;--sd-datepicker-datepicker-hint-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-hint-typography-font-weight:400;--sd-datepicker-datepicker-hint-typography-font-size:12px;--sd-datepicker-datepicker-hint-typography-line-height:20px;--sd-datepicker-datepicker-hint-typography-text-decoration:none;--sd-datepicker-datepicker-calendar-bg:#FFFFFF;--sd-datepicker-datepicker-calendar-padding-x-y:24px;--sd-datepicker-datepicker-calendar-gap:12px;--sd-datepicker-datepicker-calendar-radius:8px;--sd-datepicker-datepicker-calendar-header-gap:8px;--sd-datepicker-datepicker-calendar-header-divider:#E1E1E1;--sd-datepicker-datepicker-calendar-header-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-calendar-header-typography-font-weight:500;--sd-datepicker-datepicker-calendar-header-typography-font-size:14px;--sd-datepicker-datepicker-calendar-header-typography-text-decoration:none;--sd-datepicker-datepicker-calendar-header-typography-line-height:24px;--sd-datepicker-datepicker-calendar-week-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-calendar-week-typography-font-weight:400;--sd-datepicker-datepicker-calendar-week-typography-font-size:12px;--sd-datepicker-datepicker-calendar-week-typography-line-height:20px;--sd-datepicker-datepicker-calendar-week-typography-text-decoration:none;--sd-datepicker-datepicker-calendar-week-color:#888888;--sd-datepicker-datepicker-calendar-grid-row-gap:4px;--sd-datepicker-datepicker-calendar-day-width:40px;--sd-datepicker-datepicker-calendar-day-circle-size:32px;--sd-datepicker-datepicker-calendar-day-circle-radius:9999px;--sd-datepicker-datepicker-calendar-day-default-text:#222222;--sd-datepicker-datepicker-calendar-day-hover-text:#222222;--sd-datepicker-datepicker-calendar-day-hover-border:#0075FF;--sd-datepicker-datepicker-calendar-day-select-bg:#0075FF;--sd-datepicker-datepicker-calendar-day-select-text:#FFFFFF;--sd-datepicker-datepicker-calendar-day-disabled-text:#BBBBBB;--sd-datepicker-datepicker-calendar-day-typography-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-calendar-day-typography-default-font-weight:400;--sd-datepicker-datepicker-calendar-day-typography-default-font-size:14px;--sd-datepicker-datepicker-calendar-day-typography-default-text-decoration:none;--sd-datepicker-datepicker-calendar-day-typography-default-line-height:24px;--sd-datepicker-datepicker-calendar-day-typography-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-calendar-day-typography-bold-font-weight:700;--sd-datepicker-datepicker-calendar-day-typography-bold-font-size:14px;--sd-datepicker-datepicker-calendar-day-typography-bold-text-decoration:none;--sd-datepicker-datepicker-calendar-day-typography-bold-line-height:24px;--sd-datepicker-datepicker-calendar-day-dot-size:6px;--sd-datepicker-datepicker-calendar-day-dot-gap:2px;--sd-datepicker-datepicker-calendar-day-dot-padding-y:4px;--sd-datepicker-datepicker-calendar-range-bg:#D9EAFF;--sd-datepicker-datepicker-calendar-range-height:32px;--sd-datepicker-datepicker-calendar-range-panel-gap:24px;--sd-datepicker-datepicker-calendar-range-divider:#E1E1E1;--sd-datepicker-datepicker-calendar-range-width:20px;--sd-tag-tag-xs-height:20px;--sd-tag-tag-xs-padding-x:8px;--sd-tag-tag-xs-gap:4px;--sd-tag-tag-xs-icon:12px;--sd-tag-tag-xs-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tag-tag-xs-typography-font-size:11px;--sd-tag-tag-xs-typography-font-weight:500;--sd-tag-tag-xs-typography-line-height:18px;--sd-tag-tag-xs-typography-text-decoration:none;--sd-tag-tag-xs-radius:6px;--sd-tag-tag-sm-height:24px;--sd-tag-tag-sm-padding-x:8px;--sd-tag-tag-sm-gap:4px;--sd-tag-tag-sm-icon:16px;--sd-tag-tag-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tag-tag-sm-typography-font-size:12px;--sd-tag-tag-sm-typography-font-weight:700;--sd-tag-tag-sm-typography-text-decoration:none;--sd-tag-tag-sm-typography-line-height:20px;--sd-tag-tag-sm-radius:6px;--sd-tag-tag-md-height:28px;--sd-tag-tag-md-padding-x:12px;--sd-tag-tag-md-gap:6px;--sd-tag-tag-md-icon:16px;--sd-tag-tag-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tag-tag-md-typography-font-size:14px;--sd-tag-tag-md-typography-font-weight:700;--sd-tag-tag-md-typography-line-height:24px;--sd-tag-tag-md-typography-text-decoration:none;--sd-tag-tag-md-radius:8px;--sd-tag-tag-red-content:#FB4444;--sd-tag-tag-red-bg:#FCEFEF;--sd-tag-tag-orange-content:#FF6B00;--sd-tag-tag-orange-bg:#FEF1EA;--sd-tag-tag-yellow-content:#916C0D;--sd-tag-tag-yellow-bg:#FFF7DD;--sd-tag-tag-green-content:#00973C;--sd-tag-tag-green-bg:#E8F9EF;--sd-tag-tag-blue-content:#0075FF;--sd-tag-tag-blue-bg:#E6F1FF;--sd-tag-tag-darkblue-content:#006AC1;--sd-tag-tag-darkblue-bg:#EAF5FE;--sd-tag-tag-indigo-content:#004290;--sd-tag-tag-indigo-bg:#EFF6FF;--sd-tag-tag-grey-content:#737373;--sd-tag-tag-grey-bg:#EEEEEE;--sd-badge-badge-size:6px;--sd-badge-badge-radius:9999px;--sd-badge-badge-red:#FB4444;--sd-badge-badge-orange:#FF6B00;--sd-badge-badge-yellow:#FFC700;--sd-badge-badge-green:#00973C;--sd-badge-badge-blue:#0075FF;--sd-badge-badge-darkblue:#006AC1;--sd-badge-badge-indigo:#004290;--sd-badge-badge-grey:#737373;--sd-tooltip-tooltip-radius:6px;--sd-tooltip-tooltip-padding-y:12px;--sd-tooltip-tooltip-padding-x:16px;--sd-tooltip-tooltip-gap:12px;--sd-tooltip-tooltip-arrow-width:16px;--sd-tooltip-tooltip-arrow-height:12px;--sd-tooltip-tooltip-default-bg:#07284A;--sd-tooltip-tooltip-default-content:#FFFFFF;--sd-tooltip-tooltip-default-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tooltip-tooltip-default-typography-font-size:12px;--sd-tooltip-tooltip-default-typography-font-weight:500;--sd-tooltip-tooltip-default-typography-line-height:20px;--sd-tooltip-tooltip-default-typography-text-decoration:none;--sd-tooltip-tooltip-danger-bg:#FCEFEF;--sd-tooltip-tooltip-danger-content:#FB4444;--sd-tooltip-tooltip-danger-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tooltip-tooltip-danger-typography-font-size:12px;--sd-tooltip-tooltip-danger-typography-font-weight:700;--sd-tooltip-tooltip-danger-typography-text-decoration:none;--sd-tooltip-tooltip-danger-typography-line-height:20px;--sd-tooltip-tooltip-warning-bg:#FEF1EA;--sd-tooltip-tooltip-warning-content:#FF6B00;--sd-tooltip-tooltip-warning-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tooltip-tooltip-warning-typography-font-size:12px;--sd-tooltip-tooltip-warning-typography-font-weight:700;--sd-tooltip-tooltip-warning-typography-text-decoration:none;--sd-tooltip-tooltip-warning-typography-line-height:20px;--sd-tooltip-tooltip-accent-bg:#E6F1FF;--sd-tooltip-tooltip-accent-content:#0075FF;--sd-tooltip-tooltip-accent-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tooltip-tooltip-accent-typography-font-size:12px;--sd-tooltip-tooltip-accent-typography-font-weight:700;--sd-tooltip-tooltip-accent-typography-text-decoration:none;--sd-tooltip-tooltip-accent-typography-line-height:20px;--sd-popover-popover-radius:6px;--sd-popover-popover-padding-y:16px;--sd-popover-popover-padding-x:20px;--sd-popover-popover-gap:12px;--sd-popover-popover-body-gap:12px;--sd-popover-popover-contents-gap:4px;--sd-popover-popover-arrow-width:16px;--sd-popover-popover-arrow-height:12px;--sd-popover-popover-bg:#07284A;--sd-popover-popover-title-color:#FFFFFF;--sd-popover-popover-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-popover-popover-title-typography-font-size:14px;--sd-popover-popover-title-typography-font-weight:700;--sd-popover-popover-title-typography-line-height:24px;--sd-popover-popover-title-typography-text-decoration:none;--sd-popover-popover-description-color:#FFFFFF;--sd-popover-popover-description-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-popover-popover-description-typography-font-size:12px;--sd-popover-popover-description-typography-font-weight:500;--sd-popover-popover-description-typography-line-height:20px;--sd-popover-popover-description-typography-text-decoration:none;--sd-popover-popover-sub-action-color:#D8D8D8;--sd-popover-popover-sub-action-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-popover-popover-sub-action-typography-font-size:12px;--sd-popover-popover-sub-action-typography-font-weight:700;--sd-popover-popover-sub-action-typography-text-decoration:none;--sd-popover-popover-sub-action-typography-line-height:20px;--sd-toast-toast-radius:8px;--sd-toast-toast-padding-y:12px;--sd-toast-toast-padding-x:24px;--sd-toast-toast-gap:16px;--sd-toast-toast-icon:16px;--sd-toast-toast-typography-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-toast-toast-typography-default-font-size:14px;--sd-toast-toast-typography-default-font-weight:700;--sd-toast-toast-typography-default-line-height:24px;--sd-toast-toast-typography-default-text-decoration:none;--sd-toast-toast-typography-link-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-toast-toast-typography-link-font-size:14px;--sd-toast-toast-typography-link-font-weight:700;--sd-toast-toast-typography-link-line-height:24px;--sd-toast-toast-typography-link-text-decoration:underline;--sd-toast-toast-default-bg:#07284A;--sd-toast-toast-default-content:#FFFFFF;--sd-toast-toast-danger-bg:#FB4444;--sd-toast-toast-danger-content:#FFFFFF;--sd-toast-toast-caution-bg:#FFC700;--sd-toast-toast-caution-content:#222222;--sd-toast-toast-complete-bg:#00973C;--sd-toast-toast-complete-content:#FFFFFF;--sd-toast-toast-accent-bg:#005CC9;--sd-toast-toast-accent-content:#FFFFFF;--sd-modal-modal-radius:8px;--sd-modal-modal-confirm-padding-x:32px;--sd-modal-modal-confirm-padding-y:40px;--sd-modal-modal-confirm-gap:40px;--sd-modal-modal-confirm-body-gap:20px;--sd-modal-modal-confirm-title-gap:12px;--sd-modal-modal-confirm-title-color:#222222;--sd-modal-modal-confirm-title-icon:32px;--sd-modal-modal-confirm-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-modal-modal-confirm-title-typography-font-weight:700;--sd-modal-modal-confirm-title-typography-font-size:18px;--sd-modal-modal-confirm-title-typography-line-height:30px;--sd-modal-modal-confirm-title-typography-text-decoration:none;--sd-modal-modal-confirm-button-gap:8px;--sd-modal-modal-confirm-message-color:#222222;--sd-modal-modal-confirm-positive-icon:#0075FF;--sd-modal-modal-confirm-negative-icon:#E30000;--sd-modal-modal-bg:#FFFFFF;--sd-modal-modal-action-header-padding-x:24px;--sd-modal-modal-action-header-padding-y:20px;--sd-modal-modal-action-header-gap:12px;--sd-modal-modal-action-title-color:#033F59;--sd-modal-modal-action-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-modal-modal-action-title-typography-font-weight:700;--sd-modal-modal-action-title-typography-font-size:16px;--sd-modal-modal-action-title-typography-text-decoration:none;--sd-modal-modal-action-title-typography-line-height:26px;--sd-modal-modal-action-body-padding-x:20px;--sd-modal-modal-action-body-padding-bottom:20px;--sd-modal-modal-action-footer-padding-x:20px;--sd-modal-modal-action-footer-padding-y:8px;--sd-modal-modal-action-footer-gap:16px;--sd-modal-modal-action-footer-bg:#F6F6F6;--sd-modal-modal-action-footer-border:#E1E1E1;--sd-modal-modal-loading-width:520px;--sd-modal-modal-loading-height:320px;--sd-modal-modal-loading-gap:20px;--sd-modal-modal-loading-content:80px;--sd-modal-modal-loading-message-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-modal-modal-loading-message-typography-font-size:12px;--sd-modal-modal-loading-message-typography-font-weight:400;--sd-modal-modal-loading-message-typography-line-height:20px;--sd-modal-modal-loading-message-typography-text-decoration:none;--sd-modal-modal-loading-message-color:#888888;--sd-spinner-spinner-size:80px;--sd-spinner-spinner-color-track:#EEEEEE;--sd-spinner-spinner-color-arc:#2D8DFF;--sd-radio-button-radio-button-xs-height:24px;--sd-radio-button-radio-button-xs-padding-x:8px;--sd-radio-button-radio-button-xs-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-radio-button-radio-button-xs-typography-font-size:12px;--sd-radio-button-radio-button-xs-typography-font-weight:500;--sd-radio-button-radio-button-xs-typography-text-decoration:none;--sd-radio-button-radio-button-xs-typography-line-height:20px;--sd-radio-button-radio-button-sm-height:28px;--sd-radio-button-radio-button-sm-padding-x:12px;--sd-radio-button-radio-button-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-radio-button-radio-button-sm-typography-font-size:12px;--sd-radio-button-radio-button-sm-typography-font-weight:500;--sd-radio-button-radio-button-sm-typography-text-decoration:none;--sd-radio-button-radio-button-sm-typography-line-height:20px;--sd-radio-button-radio-button-radius:4px;--sd-radio-button-radio-button-border-width:1px;--sd-radio-button-radio-button-border-default:#CCCCCC;--sd-radio-button-radio-button-border-select:#0075FF;--sd-radio-button-radio-button-border-disabled:#CCCCCC;--sd-radio-button-radio-button-bg-default:#FFFFFF;--sd-radio-button-radio-button-bg-hover:#0075FF;--sd-radio-button-radio-button-bg-select:#FFFFFF;--sd-radio-button-radio-button-bg-disabled:#E1E1E1;--sd-radio-button-radio-button-content-default:#555555;--sd-radio-button-radio-button-content-hover:#FFFFFF;--sd-radio-button-radio-button-content-select:#0075FF;--sd-radio-button-radio-button-content-disabled:#888888;--sd-radio-button-radio-button-group-gap:-1px;--sd-toggle-toggle-height:28px;--sd-toggle-toggle-padding-x:12px;--sd-toggle-toggle-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-toggle-toggle-typography-font-size:12px;--sd-toggle-toggle-typography-font-weight:500;--sd-toggle-toggle-typography-text-decoration:none;--sd-toggle-toggle-typography-line-height:20px;--sd-toggle-toggle-radius:9999px;--sd-toggle-toggle-border-width:1px;--sd-toggle-toggle-border-default:#CCCCCC;--sd-toggle-toggle-border-select:#0075FF;--sd-toggle-toggle-border-disabled:#CCCCCC;--sd-toggle-toggle-bg-default:#FFFFFF;--sd-toggle-toggle-bg-hover:#0075FF;--sd-toggle-toggle-bg-select:#FFFFFF;--sd-toggle-toggle-bg-disabled:#E1E1E1;--sd-toggle-toggle-content-default:#555555;--sd-toggle-toggle-content-hover:#FFFFFF;--sd-toggle-toggle-content-select:#0075FF;--sd-toggle-toggle-content-disabled:#888888;--sd-switch-switch-width:32px;--sd-switch-switch-height:20px;--sd-switch-switch-padding-x-y:2px;--sd-switch-switch-radius:9999px;--sd-switch-switch-knob-size:16px;--sd-switch-switch-knob-bg:#FFFFFF;--sd-switch-switch-bg-on:#0075FF;--sd-switch-switch-bg-off:#CCCCCC;--sd-switch-switch-bg-disabled-on:#BBDAFF;--sd-switch-switch-bg-disabled-off:#E1E1E1;--sd-switch-switch-label-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-switch-switch-label-typography-font-weight:500;--sd-switch-switch-label-typography-font-size:12px;--sd-switch-switch-label-typography-text-decoration:none;--sd-switch-switch-label-typography-line-height:20px;--sd-switch-switch-gap:6px}.bg-primary{background-color:var(--color-primary, #051d36)}.bg-secondary{background-color:var(--color-secondary, #555555)}.bg-accent{background-color:var(--color-accent, #9c27b0)}.bg-positive{background-color:var(--color-positive, #0075ff)}.bg-negative{background-color:var(--color-negative, #e30000)}.bg-info{background-color:var(--color-info, #00cd52)}.bg-warning{background-color:var(--color-warning, #f2c037)}.bg-red_99{background-color:var(--color-red_99, #220000)}.bg-red_95{background-color:var(--color-red_95, #440000)}.bg-red_90{background-color:var(--color-red_90, #5E0000)}.bg-red_85{background-color:var(--color-red_85, #820000)}.bg-red_80{background-color:var(--color-red_80, #AD0000)}.bg-red_75{background-color:var(--color-red_75, #E30000)}.bg-red_70{background-color:var(--color-red_70, #FB4444)}.bg-red_60{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90{background-color:var(--color-orange_90, #752A00)}.bg-orange_85{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90{background-color:var(--color-olive_90, #454500)}.bg-olive_80{background-color:var(--color-olive_80, #636300)}.bg-olive_70{background-color:var(--color-olive_70, #838300)}.bg-olive_65{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99{background-color:var(--color-green_99, #001D0B)}.bg-green_95{background-color:var(--color-green_95, #003013)}.bg-green_90{background-color:var(--color-green_90, #00461C)}.bg-green_85{background-color:var(--color-green_85, #006629)}.bg-green_80{background-color:var(--color-green_80, #007B31)}.bg-green_75{background-color:var(--color-green_75, #00973C)}.bg-green_70{background-color:var(--color-green_70, #12B553)}.bg-green_65{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55{background-color:var(--color-green_55, #6DE39C)}.bg-green_45{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95{background-color:var(--color-grey_95, #222222)}.bg-grey_90{background-color:var(--color-grey_90, #333333)}.bg-grey_85{background-color:var(--color-grey_85, #444444)}.bg-grey_80{background-color:var(--color-grey_80, #555555)}.bg-grey_70{background-color:var(--color-grey_70, #737373)}.bg-grey_65{background-color:var(--color-grey_65, #888888)}.bg-grey_60{background-color:var(--color-grey_60, #999999)}.bg-grey_55{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05{background-color:var(--color-grey_05, #f9f9f9)}.bg-white{background-color:var(--color-white, #ffffff)}.bg-black{background-color:var(--color-black, #000000)}.text-primary{color:var(--color-primary, #051d36)}.text-secondary{color:var(--color-secondary, #555555)}.text-accent{color:var(--color-accent, #9c27b0)}.text-positive{color:var(--color-positive, #0075ff)}.text-negative{color:var(--color-negative, #e30000)}.text-info{color:var(--color-info, #00cd52)}.text-warning{color:var(--color-warning, #f2c037)}.text-red_99{color:var(--color-red_99, #220000)}.text-red_95{color:var(--color-red_95, #440000)}.text-red_90{color:var(--color-red_90, #5E0000)}.text-red_85{color:var(--color-red_85, #820000)}.text-red_80{color:var(--color-red_80, #AD0000)}.text-red_75{color:var(--color-red_75, #E30000)}.text-red_70{color:var(--color-red_70, #FB4444)}.text-red_60{color:var(--color-red_60, #FF7C7C)}.text-red_45{color:var(--color-red_45, #FFB5B5)}.text-red_30{color:var(--color-red_30, #FFD3D3)}.text-red_20{color:var(--color-red_20, #FCE6E6)}.text-red_15{color:var(--color-red_15, #FCEFEF)}.text-caution_bg{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon{color:var(--color-caution_icon, #fd9595)}.text-orange_99{color:var(--color-orange_99, #2F1100)}.text-orange_95{color:var(--color-orange_95, #4D1B00)}.text-orange_90{color:var(--color-orange_90, #752A00)}.text-orange_85{color:var(--color-orange_85, #9B3700)}.text-orange_75{color:var(--color-orange_75, #CE4900)}.text-orange_65{color:var(--color-orange_65, #FF6B00)}.text-orange_60{color:var(--color-orange_60, #FF7F22)}.text-orange_55{color:var(--color-orange_55, #FFA452)}.text-orange_45{color:var(--color-orange_45, #FFBC81)}.text-orange_35{color:var(--color-orange_35, #FFD5AF)}.text-orange_20{color:var(--color-orange_20, #FFEAD7)}.text-orange_10{color:var(--color-orange_10, #FEF1EA)}.text-header_alert{color:var(--color-header_alert, #FF7A00)}.text-yellow_95{color:var(--color-yellow_95, #322700)}.text-yellow_90{color:var(--color-yellow_90, #453702)}.text-yellow_80{color:var(--color-yellow_80, #6C5602)}.text-yellow_70{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60{color:var(--color-yellow_60, #C49900)}.text-yellow_50{color:var(--color-yellow_50, #EBB800)}.text-yellow_45{color:var(--color-yellow_45, #FFC700)}.text-yellow_40{color:var(--color-yellow_40, #FFD643)}.text-yellow_30{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95{color:var(--color-olive_95, #2C2C00)}.text-olive_90{color:var(--color-olive_90, #454500)}.text-olive_80{color:var(--color-olive_80, #636300)}.text-olive_70{color:var(--color-olive_70, #838300)}.text-olive_65{color:var(--color-olive_65, #A5A500)}.text-olive_55{color:var(--color-olive_55, #C7C700)}.text-olive_45{color:var(--color-olive_45, #DDDD12)}.text-olive_30{color:var(--color-olive_30, #EEEE37)}.text-olive_20{color:var(--color-olive_20, #F6F65F)}.text-olive_15{color:var(--color-olive_15, #FAFAA1)}.text-olive_10{color:var(--color-olive_10, #FBFBBF)}.text-olive_05{color:var(--color-olive_05, #FEFED9)}.text-green_99{color:var(--color-green_99, #001D0B)}.text-green_95{color:var(--color-green_95, #003013)}.text-green_90{color:var(--color-green_90, #00461C)}.text-green_85{color:var(--color-green_85, #006629)}.text-green_80{color:var(--color-green_80, #007B31)}.text-green_75{color:var(--color-green_75, #00973C)}.text-green_70{color:var(--color-green_70, #12B553)}.text-green_65{color:var(--color-green_65, #2BCE6C)}.text-green_55{color:var(--color-green_55, #6DE39C)}.text-green_45{color:var(--color-green_45, #ACF4C9)}.text-green_25{color:var(--color-green_25, #D4FAE3)}.text-green_15{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95{color:var(--color-grey_95, #222222)}.text-grey_90{color:var(--color-grey_90, #333333)}.text-grey_85{color:var(--color-grey_85, #444444)}.text-grey_80{color:var(--color-grey_80, #555555)}.text-grey_70{color:var(--color-grey_70, #737373)}.text-grey_65{color:var(--color-grey_65, #888888)}.text-grey_60{color:var(--color-grey_60, #999999)}.text-grey_55{color:var(--color-grey_55, #aaaaaa)}.text-grey_50{color:var(--color-grey_50, #bbbbbb)}.text-grey_45{color:var(--color-grey_45, #cccccc)}.text-grey_35{color:var(--color-grey_35, #D8D8D8)}.text-grey_30{color:var(--color-grey_30, #e1e1e1)}.text-grey_25{color:var(--color-grey_25, #E5E5E5)}.text-grey_20{color:var(--color-grey_20, #eeeeee)}.text-grey_10{color:var(--color-grey_10, #f6f6f6)}.text-grey_05{color:var(--color-grey_05, #f9f9f9)}.text-white{color:var(--color-white, #ffffff)}.text-black{color:var(--color-black, #000000)}*,*::before,*::after{box-sizing:border-box}*{scroll-behavior:smooth}*::-webkit-scrollbar{opacity:0;width:8px;background:#E5E5E5}*::-webkit-scrollbar:horizontal{height:8px}*::-webkit-scrollbar-thumb{height:80px;background-color:#CCCCCC;border-radius:4px}*::-webkit-scrollbar-track{background-color:#E5E5E5}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0}ul[role=list],ol[role=list]{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font-size:inherit}:target{scroll-margin-block:5ex}button{background:none;border:none;cursor:pointer;padding:0;outline:0}button:focus{outline:0 !important}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{-webkit-text-fill-color:#000;-webkit-box-shadow:0 0 0px 1000px #fff inset;box-shadow:0 0 0px 1000px #fff inset;transition:background-color 5000s ease-in-out 0s}input:autofill,input:autofill:hover,input:autofill:focus,input:autofill:active{-webkit-text-fill-color:#000;-webkit-box-shadow:0 0 0px 1000px #fff inset;box-shadow:0 0 0px 1000px #fff inset;transition:background-color 5000s ease-in-out 0s}:host{display:inline-block;height:fit-content;line-height:0}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}input[type=text],input[type=number],input[type=password],input[type=email],input[type=tel],textarea{padding-block:0px;padding-inline:0px}.sd-hoverable:hover>.sd-focus-helper{background:currentColor;opacity:0.15}.sd-hoverable:hover>.sd-focus-helper:before{opacity:0.1}.sd-hoverable:hover>.sd-focus-helper:after{opacity:0.4}.sd-focus-helper{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before,.sd-focus-helper:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before{background:#000000}.sd-focus-helper:after{background:#ffffff}";
139
+ const globalStyles = ":root{--color-primary:#051D36;--sd-primary:#051D36;--color-secondary:#555555;--sd-secondary:#555555;--color-accent:#9C27B0;--sd-accent:#9C27B0;--color-positive:#0075FF;--sd-positive:#0075FF;--color-negative:#E30000;--sd-negative:#E30000;--color-info:#00CD52;--sd-info:#00CD52;--color-warning:#F2C037;--sd-warning:#F2C037;--color-caution_bg:#FEF1F1;--sd-caution_bg:#FEF1F1;--color-caution_icon:#FD9595;--sd-caution_icon:#FD9595;--color-header_alert:#FF7A00;--sd-header_alert:#FF7A00;--color-white:#FFFFFF;--sd-white:#FFFFFF;--color-black:#000000;--sd-black:#000000;--color-grey_10:#F6F6F6;--sd-grey_10:#F6F6F6;--color-grey_20:#EEEEEE;--sd-grey_20:#EEEEEE;--color-grey_25:#E5E5E5;--sd-grey_25:#E5E5E5;--color-grey_30:#E1E1E1;--sd-grey_30:#E1E1E1;--color-grey_35:#D8D8D8;--sd-grey_35:#D8D8D8;--color-grey_45:#CCCCCC;--sd-grey_45:#CCCCCC;--color-grey_50:#BBBBBB;--sd-grey_50:#BBBBBB;--color-grey_55:#AAAAAA;--sd-grey_55:#AAAAAA;--color-grey_60:#999999;--sd-grey_60:#999999;--color-grey_65:#888888;--sd-grey_65:#888888;--color-grey_70:#737373;--sd-grey_70:#737373;--color-grey_80:#555555;--sd-grey_80:#555555;--color-grey_85:#444444;--sd-grey_85:#444444;--color-grey_90:#333333;--sd-grey_90:#333333;--color-grey_95:#222222;--sd-grey_95:#222222;--color-grey_05:#F9F9F9;--sd-grey_05:#F9F9F9;--color-red_15:#FCEFEF;--sd-red_15:#FCEFEF;--color-red_20:#FCE6E6;--sd-red_20:#FCE6E6;--color-red_30:#FFD3D3;--sd-red_30:#FFD3D3;--color-red_45:#FFB5B5;--sd-red_45:#FFB5B5;--color-red_60:#FF7C7C;--sd-red_60:#FF7C7C;--color-red_70:#FB4444;--sd-red_70:#FB4444;--color-red_75:#E30000;--sd-red_75:#E30000;--color-red_75_006:#E30000;--sd-red_75_006:#E30000;--color-red_80:#AD0000;--sd-red_80:#AD0000;--color-red_85:#820000;--sd-red_85:#820000;--color-red_90:#5E0000;--sd-red_90:#5E0000;--color-red_95:#440000;--sd-red_95:#440000;--color-red_99:#220000;--sd-red_99:#220000;--color-orange_10:#FEF1EA;--sd-orange_10:#FEF1EA;--color-orange_20:#FFEAD7;--sd-orange_20:#FFEAD7;--color-orange_35:#FFD5AF;--sd-orange_35:#FFD5AF;--color-orange_45:#FFBC81;--sd-orange_45:#FFBC81;--color-orange_55:#FFA452;--sd-orange_55:#FFA452;--color-orange_60:#FF7F22;--sd-orange_60:#FF7F22;--color-orange_65:#FF6B00;--sd-orange_65:#FF6B00;--color-orange_75:#CE4900;--sd-orange_75:#CE4900;--color-orange_85:#9B3700;--sd-orange_85:#9B3700;--color-orange_90:#752A00;--sd-orange_90:#752A00;--color-orange_95:#4D1B00;--sd-orange_95:#4D1B00;--color-orange_99:#2F1100;--sd-orange_99:#2F1100;--color-yellow_10:#FFF7DD;--sd-yellow_10:#FFF7DD;--color-yellow_20:#FEF1C4;--sd-yellow_20:#FEF1C4;--color-yellow_25:#FFE99E;--sd-yellow_25:#FFE99E;--color-yellow_30:#FEE17C;--sd-yellow_30:#FEE17C;--color-yellow_40:#FFD643;--sd-yellow_40:#FFD643;--color-yellow_45:#FFC700;--sd-yellow_45:#FFC700;--color-yellow_50:#EBB110;--sd-yellow_50:#EBB110;--color-yellow_60:#CA9612;--sd-yellow_60:#CA9612;--color-yellow_70:#916C0D;--sd-yellow_70:#916C0D;--color-yellow_80:#6C5002;--sd-yellow_80:#6C5002;--color-yellow_90:#453602;--sd-yellow_90:#453602;--color-yellow_95:#322700;--sd-yellow_95:#322700;--color-olive_10:#FBFBBF;--sd-olive_10:#FBFBBF;--color-olive_15:#FAFAA1;--sd-olive_15:#FAFAA1;--color-olive_20:#F6F65F;--sd-olive_20:#F6F65F;--color-olive_30:#EEEE37;--sd-olive_30:#EEEE37;--color-olive_45:#DDDD12;--sd-olive_45:#DDDD12;--color-olive_55:#C7C700;--sd-olive_55:#C7C700;--color-olive_65:#A5A500;--sd-olive_65:#A5A500;--color-olive_70:#838300;--sd-olive_70:#838300;--color-olive_80:#636300;--sd-olive_80:#636300;--color-olive_90:#454500;--sd-olive_90:#454500;--color-olive_95:#2C2C00;--sd-olive_95:#2C2C00;--color-olive_05:#FEFED9;--sd-olive_05:#FEFED9;--color-green_15:#E8F9EF;--sd-green_15:#E8F9EF;--color-green_25:#D4FAE3;--sd-green_25:#D4FAE3;--color-green_45:#ACF4C9;--sd-green_45:#ACF4C9;--color-green_55:#6DE39C;--sd-green_55:#6DE39C;--color-green_65:#2BCE6C;--sd-green_65:#2BCE6C;--color-green_70:#12B553;--sd-green_70:#12B553;--color-green_75:#00973C;--sd-green_75:#00973C;--color-green_80:#007B31;--sd-green_80:#007B31;--color-green_85:#006629;--sd-green_85:#006629;--color-green_90:#00461C;--sd-green_90:#00461C;--color-green_95:#003013;--sd-green_95:#003013;--color-green_99:#001D0B;--sd-green_99:#001D0B;--color-steelblue_10:#ECF8FD;--sd-steelblue_10:#ECF8FD;--color-steelblue_25:#D9F2FD;--sd-steelblue_25:#D9F2FD;--color-steelblue_45:#A4E2FD;--sd-steelblue_45:#A4E2FD;--color-steelblue_60:#50BFF0;--sd-steelblue_60:#50BFF0;--color-steelblue_65:#229FD7;--sd-steelblue_65:#229FD7;--color-steelblue_70:#128FC7;--sd-steelblue_70:#128FC7;--color-steelblue_75:#066D9B;--sd-steelblue_75:#066D9B;--color-steelblue_80:#06587D;--sd-steelblue_80:#06587D;--color-steelblue_85:#033F59;--sd-steelblue_85:#033F59;--color-steelblue_90:#032D40;--sd-steelblue_90:#032D40;--color-steelblue_95:#02212F;--sd-steelblue_95:#02212F;--color-steelblue_99:#021A25;--sd-steelblue_99:#021A25;--color-oceanblue_15:#EAF5FE;--sd-oceanblue_15:#EAF5FE;--color-oceanblue_25:#D5EBFE;--sd-oceanblue_25:#D5EBFE;--color-oceanblue_50:#9CD1FC;--sd-oceanblue_50:#9CD1FC;--color-oceanblue_60:#5CB0F3;--sd-oceanblue_60:#5CB0F3;--color-oceanblue_65:#1F8AE1;--sd-oceanblue_65:#1F8AE1;--color-oceanblue_70:#006AC1;--sd-oceanblue_70:#006AC1;--color-oceanblue_75:#025497;--sd-oceanblue_75:#025497;--color-oceanblue_80:#004177;--sd-oceanblue_80:#004177;--color-oceanblue_85:#07284A;--sd-oceanblue_85:#07284A;--color-oceanblue_90:#051D36;--sd-oceanblue_90:#051D36;--color-oceanblue_95:#03172D;--sd-oceanblue_95:#03172D;--color-oceanblue_99:#011428;--sd-oceanblue_99:#011428;--color-brilliantblue_10:#EFF6FF;--sd-brilliantblue_10:#EFF6FF;--color-brilliantblue_20:#E6F1FF;--sd-brilliantblue_20:#E6F1FF;--color-brilliantblue_25:#D9EAFF;--sd-brilliantblue_25:#D9EAFF;--color-brilliantblue_40:#BBDAFF;--sd-brilliantblue_40:#BBDAFF;--color-brilliantblue_50:#93C4FF;--sd-brilliantblue_50:#93C4FF;--color-brilliantblue_60:#64ABFF;--sd-brilliantblue_60:#64ABFF;--color-brilliantblue_70:#2D8DFF;--sd-brilliantblue_70:#2D8DFF;--color-brilliantblue_75:#0075FF;--sd-brilliantblue_75:#0075FF;--color-brilliantblue_80:#005CC9;--sd-brilliantblue_80:#005CC9;--color-brilliantblue_85:#004290;--sd-brilliantblue_85:#004290;--color-brilliantblue_90:#002B5E;--sd-brilliantblue_90:#002B5E;--color-brilliantblue_95:#001B39;--sd-brilliantblue_95:#001B39;--color-brilliantblue_99:#001226;--sd-brilliantblue_99:#001226;--color-brilliantblue_05:#F5FAFF;--sd-brilliantblue_05:#F5FAFF;--sd-system-typography-control-xs-regular-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-xs-regular-font-size:12px;--sd-system-typography-control-xs-regular-font-weight:400;--sd-system-typography-control-xs-regular-text-decoration:none;--sd-system-typography-control-xs-regular-line-height:20px;--sd-system-typography-control-xs-medium-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-xs-medium-font-size:12px;--sd-system-typography-control-xs-medium-font-weight:500;--sd-system-typography-control-xs-medium-text-decoration:none;--sd-system-typography-control-xs-medium-line-height:20px;--sd-system-typography-control-xs-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-xs-bold-font-weight:700;--sd-system-typography-control-xs-bold-font-size:12px;--sd-system-typography-control-xs-bold-line-height:20px;--sd-system-typography-control-xs-bold-text-decoration:none;--sd-system-typography-control-sm-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-sm-default-font-size:12px;--sd-system-typography-control-sm-default-font-weight:500;--sd-system-typography-control-sm-default-text-decoration:none;--sd-system-typography-control-sm-default-line-height:20px;--sd-system-typography-control-sm-underline-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-sm-underline-font-size:12px;--sd-system-typography-control-sm-underline-font-weight:500;--sd-system-typography-control-sm-underline-text-decoration:underline;--sd-system-typography-control-sm-underline-line-height:22px;--sd-system-typography-control-md-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-md-font-size:16px;--sd-system-typography-control-md-font-weight:500;--sd-system-typography-control-md-text-decoration:none;--sd-system-typography-control-md-line-height:26px;--sd-system-typography-control-lg-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-lg-font-size:18px;--sd-system-typography-control-lg-font-weight:500;--sd-system-typography-control-lg-text-decoration:none;--sd-system-typography-control-lg-line-height:30px;--sd-system-typography-feedback-xs-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-xs-font-size:11px;--sd-system-typography-feedback-xs-font-weight:500;--sd-system-typography-feedback-xs-line-height:18px;--sd-system-typography-feedback-xs-text-decoration:none;--sd-system-typography-feedback-sm-regular-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-sm-regular-font-size:12px;--sd-system-typography-feedback-sm-regular-font-weight:400;--sd-system-typography-feedback-sm-regular-line-height:20px;--sd-system-typography-feedback-sm-regular-text-decoration:none;--sd-system-typography-feedback-sm-medium-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-sm-medium-font-size:12px;--sd-system-typography-feedback-sm-medium-font-weight:500;--sd-system-typography-feedback-sm-medium-line-height:20px;--sd-system-typography-feedback-sm-medium-text-decoration:none;--sd-system-typography-feedback-sm-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-sm-bold-font-size:12px;--sd-system-typography-feedback-sm-bold-font-weight:700;--sd-system-typography-feedback-sm-bold-text-decoration:none;--sd-system-typography-feedback-sm-bold-line-height:20px;--sd-system-typography-feedback-sm-underline-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-sm-underline-font-size:12px;--sd-system-typography-feedback-sm-underline-font-weight:500;--sd-system-typography-feedback-sm-underline-line-height:20px;--sd-system-typography-feedback-sm-underline-text-decoration:underline;--sd-system-typography-feedback-md-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-md-bold-font-size:14px;--sd-system-typography-feedback-md-bold-font-weight:700;--sd-system-typography-feedback-md-bold-line-height:24px;--sd-system-typography-feedback-md-bold-text-decoration:none;--sd-system-typography-feedback-md-underline-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-md-underline-font-size:14px;--sd-system-typography-feedback-md-underline-font-weight:700;--sd-system-typography-feedback-md-underline-line-height:24px;--sd-system-typography-feedback-md-underline-text-decoration:underline;--sd-system-typography-heading-sm-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-heading-sm-font-weight:700;--sd-system-typography-heading-sm-font-size:14px;--sd-system-typography-heading-sm-line-height:24px;--sd-system-typography-heading-sm-text-decoration:none;--sd-system-typography-heading-md-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-heading-md-font-weight:700;--sd-system-typography-heading-md-font-size:16px;--sd-system-typography-heading-md-text-decoration:none;--sd-system-typography-heading-md-line-height:26px;--sd-system-typography-heading-lg-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-heading-lg-font-weight:700;--sd-system-typography-heading-lg-font-size:18px;--sd-system-typography-heading-lg-line-height:30px;--sd-system-typography-heading-lg-text-decoration:none;--sd-system-typography-field-sm-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-sm-default-font-weight:400;--sd-system-typography-field-sm-default-font-size:12px;--sd-system-typography-field-sm-default-line-height:20px;--sd-system-typography-field-sm-default-text-decoration:none;--sd-system-typography-field-sm-medium-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-sm-medium-font-weight:500;--sd-system-typography-field-sm-medium-font-size:12px;--sd-system-typography-field-sm-medium-text-decoration:none;--sd-system-typography-field-sm-medium-line-height:20px;--sd-system-typography-field-sm-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-sm-bold-font-weight:700;--sd-system-typography-field-sm-bold-font-size:12px;--sd-system-typography-field-sm-bold-text-decoration:none;--sd-system-typography-field-sm-bold-line-height:20px;--sd-system-typography-field-md-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-md-default-font-weight:400;--sd-system-typography-field-md-default-font-size:14px;--sd-system-typography-field-md-default-text-decoration:none;--sd-system-typography-field-md-default-line-height:24px;--sd-system-typography-field-md-medium-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-md-medium-font-weight:500;--sd-system-typography-field-md-medium-font-size:14px;--sd-system-typography-field-md-medium-text-decoration:none;--sd-system-typography-field-md-medium-line-height:24px;--sd-system-typography-field-md-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-md-bold-font-weight:700;--sd-system-typography-field-md-bold-font-size:14px;--sd-system-typography-field-md-bold-text-decoration:none;--sd-system-typography-field-md-bold-line-height:24px;--sd-system-typography-field-lg-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-lg-default-font-weight:400;--sd-system-typography-field-lg-default-font-size:16px;--sd-system-typography-field-lg-default-line-height:26px;--sd-system-typography-field-lg-default-text-decoration:none;--sd-system-typography-field-lg-medium-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-lg-medium-font-weight:500;--sd-system-typography-field-lg-medium-font-size:16px;--sd-system-typography-field-lg-medium-line-height:26px;--sd-system-typography-field-lg-medium-text-decoration:none;--sd-system-typography-field-lg-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-lg-bold-font-weight:700;--sd-system-typography-field-lg-bold-font-size:16px;--sd-system-typography-field-lg-bold-line-height:26px;--sd-system-typography-field-lg-bold-text-decoration:none;--sd-system-size-control-xs-height:24px;--sd-system-size-control-sm-height:28px;--sd-system-size-control-md-height:36px;--sd-system-size-control-lg-height:62px;--sd-system-size-icon-xxxs:8px;--sd-system-size-icon-xxs:10px;--sd-system-size-icon-xs:12px;--sd-system-size-icon-sm:16px;--sd-system-size-icon-md:20px;--sd-system-size-icon-lg:24px;--sd-system-size-icon-xl:32px;--sd-system-size-feedback-arrow-width:16px;--sd-system-size-feedback-arrow-height:12px;--sd-system-size-feedback-xs-height:20px;--sd-system-size-feedback-sm-height:24px;--sd-system-size-feedback-md-height:28px;--sd-system-size-field-control:16px;--sd-system-size-field-icon:12px;--sd-system-size-field-sm-height:28px;--sd-system-size-field-md-height:36px;--sd-system-space-control-xs-padding-x:8px;--sd-system-space-control-xs-gap:4px;--sd-system-space-control-sm-padding-x:12px;--sd-system-space-control-sm-gap:6px;--sd-system-space-control-md-padding-x:20px;--sd-system-space-control-md-gap:8px;--sd-system-space-control-lg-padding-x:28px;--sd-system-space-control-lg-gap:12px;--sd-system-space-feedback-xs-padding-x:6px;--sd-system-space-feedback-xs-gap:4px;--sd-system-space-feedback-sm-padding-x:8px;--sd-system-space-feedback-sm-gap:6px;--sd-system-space-feedback-md-padding-x:12px;--sd-system-space-feedback-md-gap:8px;--sd-system-space-stack-gap-tight:2px;--sd-system-space-stack-gap-normal:4px;--sd-system-space-stack-gap-relaxed:8px;--sd-system-space-field-sm-padding-x:12px;--sd-system-space-field-sm-padding-y:4px;--sd-system-space-field-sm-container-gap:8px;--sd-system-space-field-sm-gap:12px;--sd-system-space-field-md-padding-x:16px;--sd-system-space-field-md-container-gap:12px;--sd-system-space-field-md-gap:16px;--sd-system-radius-control-sm:4px;--sd-system-radius-control-md:6px;--sd-system-radius-feedback-xs-square:6px;--sd-system-radius-feedback-sm-square:8px;--sd-system-radius-feedback-pill:9999px;--sd-system-radius-field-sm:4px;--sd-system-radius-field-md:6px;--sd-system-border-width-control-default:1px;--sd-system-border-width-field-default:1px;--sd-system-color-bg-screen:#EEEEEE;--sd-system-color-bg-frame:#FFFFFF;--sd-system-color-bg-brand:#025497;--sd-system-color-bg-subtle:#1F8AE1;--sd-system-color-bg-accent-default:#0075FF;--sd-system-color-bg-accent-light:#F5FAFF;--sd-system-color-bg-accent-light-default:#D9EAFF;--sd-system-color-bg-accent-light-light:#F5FAFF;--sd-system-color-bg-deep:#07284A;--sd-system-color-bg-danger-default:#E30000;--sd-system-color-bg-danger-light:#FCEFEF;--sd-system-color-bg-danger-light-default:#FB4444;--sd-system-color-bg-danger-light-light:#FCEFEF;--sd-system-color-bg-warning:#FF6B00;--sd-system-color-bg-caution:#FFC700;--sd-system-color-bg-progress:#0075FF;--sd-system-color-bg-success-default:#00973C;--sd-system-color-bg-success-light:#12B553;--sd-system-color-bg-success-light:#12B553;--sd-system-color-bg-disabled:#E1E1E1;--sd-system-color-bg-neutral-light:#F6F6F6;--sd-system-color-content-primary:#222222;--sd-system-color-content-secondary:#555555;--sd-system-color-content-tertiary:#888888;--sd-system-color-content-quaternary:#AAAAAA;--sd-system-color-content-brand:#005CC9;--sd-system-color-content-subtle:#066D9B;--sd-system-color-content-accent:#0075FF;--sd-system-color-content-danger-default:#E30000;--sd-system-color-content-danger-light:#FB4444;--sd-system-color-content-danger-light:#FB4444;--sd-system-color-content-warning:#FF6B00;--sd-system-color-content-inverse:#FFFFFF;--sd-system-color-text-disabled:#888888;--sd-system-color-link-accent:#006AC1;--sd-system-color-icon-brand:#025497;--sd-system-color-icon-accent:#0075FF;--sd-system-color-icon-danger:#E30000;--sd-system-color-icon-warning:#FF6B00;--sd-system-color-icon-success:#00973C;--sd-system-color-icon-inverse:#FFFFFF;--sd-system-color-icon-disabled:#BBBBBB;--sd-system-color-border-default:#E1E1E1;--sd-system-color-border-accent:#0075FF;--sd-system-color-border-danger:#FB4444;--sd-system-color-border-success:#12B553;--sd-system-color-border-disabled:#CCCCCC;--sd-system-color-red-strong:#FB4444;--sd-system-color-red-subtle:#FCEFEF;--sd-system-color-orange-strong:#FF6B00;--sd-system-color-orange-subtle:#FEF1EA;--sd-system-color-yellow-strong:#916C0D;--sd-system-color-yellow-moderate:#FFC700;--sd-system-color-yellow-subtle:#FFF7DD;--sd-system-color-green-strong:#00973C;--sd-system-color-green-subtle:#E8F9EF;--sd-system-color-blue-strong:#0075FF;--sd-system-color-blue-subtle:#E6F1FF;--sd-system-color-darkblue-strong:#006AC1;--sd-system-color-darkblue-subtle:#EAF5FE;--sd-system-color-indigo-strong:#004290;--sd-system-color-indigo-subtle:#EFF6FF;--sd-system-color-grey-strong:#737373;--sd-system-color-grey-subtle:#EEEEEE;--sd-system-color-field-bg-default:#FFFFFF;--sd-system-color-field-bg-hover:#0075FF;--sd-system-color-field-border-default:#AAAAAA;--sd-system-color-field-border-focus:#0075FF;--sd-system-color-field-border-hover:#0075FF;--sd-system-color-field-border-danger:#FB4444;--sd-system-color-field-border-success:#12B553;--sd-system-color-field-text-default:#222222;--sd-system-color-field-text-placeholder:#AAAAAA;--sd-system-color-field-icon-default:#888888;--sd-system-color-divider-default:#E1E1E1;--sd-system-color-control-bg-inverse-hover:#0075FF;--sd-button-button-xs-height:24px;--sd-button-button-xs-padding-x:8px;--sd-button-button-xs-gap:4px;--sd-button-button-xs-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-button-button-xs-typography-font-size:12px;--sd-button-button-xs-typography-font-weight:500;--sd-button-button-xs-typography-text-decoration:none;--sd-button-button-xs-typography-line-height:20px;--sd-button-button-xs-icon:12px;--sd-button-button-sm-height:28px;--sd-button-button-sm-padding-x:12px;--sd-button-button-sm-gap:6px;--sd-button-button-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-button-button-sm-typography-font-size:12px;--sd-button-button-sm-typography-font-weight:500;--sd-button-button-sm-typography-text-decoration:none;--sd-button-button-sm-typography-line-height:20px;--sd-button-button-sm-icon:16px;--sd-button-button-md-height:36px;--sd-button-button-md-padding-x:20px;--sd-button-button-md-gap:8px;--sd-button-button-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-button-button-md-typography-font-size:16px;--sd-button-button-md-typography-font-weight:500;--sd-button-button-md-typography-text-decoration:none;--sd-button-button-md-typography-line-height:26px;--sd-button-button-md-icon:20px;--sd-button-button-lg-height:62px;--sd-button-button-lg-padding-x:28px;--sd-button-button-lg-gap:12px;--sd-button-button-lg-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-button-button-lg-typography-font-size:18px;--sd-button-button-lg-typography-font-weight:500;--sd-button-button-lg-typography-text-decoration:none;--sd-button-button-lg-typography-line-height:30px;--sd-button-button-lg-icon:24px;--sd-button-button-radius-sm:4px;--sd-button-button-radius-md:6px;--sd-button-button-border-width-default:1px;--sd-button-button-border-disabled:#CCCCCC;--sd-button-button-icon-only-xs-width:24px;--sd-button-button-icon-only-sm-width:28px;--sd-button-button-icon-only-md-width:36px;--sd-button-button-icon-only-lg-width:62px;--sd-button-button-bg-disabled:#E1E1E1;--sd-button-button-text-disabled:#888888;--sd-button-button-icon-disabled:#BBBBBB;--sd-button-button-brand-strong-bg-default:#025497;--sd-button-button-brand-strong-bg-hover:#004177;--sd-button-button-brand-strong-content:#FFFFFF;--sd-button-button-brand-strong-dropdown-divider:#006AC1;--sd-button-button-brand-subtle-bg-default:#1F8AE1;--sd-button-button-brand-subtle-bg-hover:#006AC1;--sd-button-button-brand-subtle-content:#FFFFFF;--sd-button-button-brand-subtle-dropdown-divider:#5CB0F3;--sd-button-button-brand-outline-bg-default:#FFFFFF;--sd-button-button-brand-outline-bg-hover:#EAF5FE;--sd-button-button-brand-outline-border:#025497;--sd-button-button-brand-outline-content:#025497;--sd-button-button-neutral-outline-bg-default:#FFFFFF;--sd-button-button-neutral-outline-bg-hover:#EEEEEE;--sd-button-button-neutral-outline-border:#888888;--sd-button-button-neutral-outline-content:#222222;--sd-button-button-danger-strong-bg-default:#E30000;--sd-button-button-danger-strong-bg-hover:#AD0000;--sd-button-button-danger-strong-content:#FFFFFF;--sd-button-button-danger-strong-dropdown-divider:#FF7C7C;--sd-button-button-danger-outline-bg-default:#FFFFFF;--sd-button-button-danger-outline-bg-hover:#FCEFEF;--sd-button-button-danger-outline-border:#E30000;--sd-button-button-danger-outline-content:#E30000;--sd-ghost-button-ghost-button-xxs-size:16px;--sd-ghost-button-ghost-button-xxs-icon:12px;--sd-ghost-button-ghost-button-xs-size:24px;--sd-ghost-button-ghost-button-xs-icon:16px;--sd-ghost-button-ghost-button-sm-size:28px;--sd-ghost-button-ghost-button-sm-icon:20px;--sd-ghost-button-ghost-button-md-size:36px;--sd-ghost-button-ghost-button-md-icon:24px;--sd-ghost-button-ghost-button-lg-size:62px;--sd-ghost-button-ghost-button-lg-icon:32px;--sd-ghost-button-ghost-button-radius-sm:4px;--sd-ghost-button-ghost-button-radius-md:6px;--sd-ghost-button-ghost-button-hover-opacity:5%;--sd-ghost-button-ghost-button-icon-disabled:#BBBBBB;--sd-ghost-button-ghost-button-default-content:#888888;--sd-ghost-button-ghost-button-default-hover-bg:#222222;--sd-ghost-button-ghost-button-danger-content:#E30000;--sd-ghost-button-ghost-button-danger-hover-bg:#E30000;--sd-ghost-button-ghost-button-action-content:#025497;--sd-ghost-button-ghost-button-action-hover-bg:#0075FF;--sd-ghost-button-ghost-button-inverse-content:#FFFFFF;--sd-ghost-button-ghost-button-inverse-disabled:#E1E1E1;--sd-ghost-button-ghost-button-inverse-hover-bg:#FFFFFF;--sd-text-link-text-link-gap:4px;--sd-text-link-text-link-size-icon:16px;--sd-text-link-text-link-typography-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-text-link-text-link-typography-default-font-size:12px;--sd-text-link-text-link-typography-default-font-weight:500;--sd-text-link-text-link-typography-default-text-decoration:none;--sd-text-link-text-link-typography-default-line-height:20px;--sd-text-link-text-link-typography-underline-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-text-link-text-link-typography-underline-font-size:12px;--sd-text-link-text-link-typography-underline-font-weight:500;--sd-text-link-text-link-typography-underline-text-decoration:underline;--sd-text-link-text-link-typography-underline-line-height:22px;--sd-text-link-text-link-content-default:#222222;--sd-text-link-text-link-content-disabled:#888888;--sd-text-link-text-link-icon-default:#006AC1;--sd-text-link-text-link-icon-disabled:#BBBBBB;--sd-switch-switch-width:32px;--sd-switch-switch-height:20px;--sd-switch-switch-padding-x-y:2px;--sd-switch-switch-radius:9999px;--sd-switch-switch-knob-size:16px;--sd-switch-switch-knob-bg:#FFFFFF;--sd-switch-switch-bg-on:#0075FF;--sd-switch-switch-bg-off:#CCCCCC;--sd-switch-switch-bg-disabled-on:#BBDAFF;--sd-switch-switch-bg-disabled-off:#E1E1E1;--sd-switch-switch-label-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-switch-switch-label-typography-font-weight:500;--sd-switch-switch-label-typography-font-size:12px;--sd-switch-switch-label-typography-text-decoration:none;--sd-switch-switch-label-typography-line-height:20px;--sd-switch-switch-gap:6px;--sd-toggle-toggle-height:28px;--sd-toggle-toggle-padding-x:12px;--sd-toggle-toggle-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-toggle-toggle-typography-font-size:12px;--sd-toggle-toggle-typography-font-weight:500;--sd-toggle-toggle-typography-text-decoration:none;--sd-toggle-toggle-typography-line-height:20px;--sd-toggle-toggle-radius:9999px;--sd-toggle-toggle-border-width:1px;--sd-toggle-toggle-border-default:#CCCCCC;--sd-toggle-toggle-border-select:#0075FF;--sd-toggle-toggle-border-disabled:#CCCCCC;--sd-toggle-toggle-bg-default:#FFFFFF;--sd-toggle-toggle-bg-hover:#0075FF;--sd-toggle-toggle-bg-select:#FFFFFF;--sd-toggle-toggle-bg-disabled:#E1E1E1;--sd-toggle-toggle-content-default:#555555;--sd-toggle-toggle-content-hover:#FFFFFF;--sd-toggle-toggle-content-select:#0075FF;--sd-toggle-toggle-content-disabled:#888888;--sd-checkbox-checkbox-size:16px;--sd-checkbox-checkbox-radius:2px;--sd-checkbox-checkbox-border-width:1px;--sd-checkbox-checkbox-gap:8px;--sd-checkbox-checkbox-icon:12px;--sd-checkbox-checkbox-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-checkbox-checkbox-typography-font-weight:400;--sd-checkbox-checkbox-typography-font-size:12px;--sd-checkbox-checkbox-typography-line-height:20px;--sd-checkbox-checkbox-typography-text-decoration:none;--sd-checkbox-checkbox-unchecked-bg-default:#FFFFFF;--sd-checkbox-checkbox-unchecked-bg-hover:#D9EAFF;--sd-checkbox-checkbox-unchecked-border-default:#AAAAAA;--sd-checkbox-checkbox-unchecked-border-hover:#0075FF;--sd-checkbox-checkbox-checked-bg-default:#0075FF;--sd-checkbox-checkbox-checked-icon-default:#FFFFFF;--sd-checkbox-checkbox-checked-icon-disabled:#BBBBBB;--sd-checkbox-checkbox-checked-icon-inverse:#FFFFFF;--sd-checkbox-checkbox-checked-border-inverse:#FFFFFF;--sd-checkbox-checkbox-label-default:#222222;--sd-checkbox-checkbox-label-inverse:#FFFFFF;--sd-checkbox-checkbox-bg-disabled:#E1E1E1;--sd-checkbox-checkbox-border-disabled:#CCCCCC;--sd-radio-radio-size:16px;--sd-radio-radio-radius:9999px;--sd-radio-radio-border-width:1px;--sd-radio-radio-gap:8px;--sd-radio-radio-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-radio-radio-typography-font-weight:400;--sd-radio-radio-typography-font-size:12px;--sd-radio-radio-typography-line-height:20px;--sd-radio-radio-typography-text-decoration:none;--sd-radio-radio-bg-default:#FFFFFF;--sd-radio-radio-bg-disabled:#E1E1E1;--sd-radio-radio-bg-hover:#D9EAFF;--sd-radio-radio-border-default:#AAAAAA;--sd-radio-radio-border-hover:#0075FF;--sd-radio-radio-border-active:#0075FF;--sd-radio-radio-border-disabled:#CCCCCC;--sd-radio-radio-dot-default:#0075FF;--sd-radio-radio-dot-disabled:#CCCCCC;--sd-radio-radio-dot-size:10px;--sd-radio-radio-label-default:#222222;--sd-radio-button-radio-button-xs-height:24px;--sd-radio-button-radio-button-xs-padding-x:8px;--sd-radio-button-radio-button-xs-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-radio-button-radio-button-xs-typography-font-size:12px;--sd-radio-button-radio-button-xs-typography-font-weight:500;--sd-radio-button-radio-button-xs-typography-text-decoration:none;--sd-radio-button-radio-button-xs-typography-line-height:20px;--sd-radio-button-radio-button-sm-height:28px;--sd-radio-button-radio-button-sm-padding-x:12px;--sd-radio-button-radio-button-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-radio-button-radio-button-sm-typography-font-size:12px;--sd-radio-button-radio-button-sm-typography-font-weight:500;--sd-radio-button-radio-button-sm-typography-text-decoration:none;--sd-radio-button-radio-button-sm-typography-line-height:20px;--sd-radio-button-radio-button-radius:4px;--sd-radio-button-radio-button-border-width:1px;--sd-radio-button-radio-button-border-default:#CCCCCC;--sd-radio-button-radio-button-border-select:#0075FF;--sd-radio-button-radio-button-border-disabled:#CCCCCC;--sd-radio-button-radio-button-bg-default:#FFFFFF;--sd-radio-button-radio-button-bg-hover:#0075FF;--sd-radio-button-radio-button-bg-select:#FFFFFF;--sd-radio-button-radio-button-bg-disabled:#E1E1E1;--sd-radio-button-radio-button-content-default:#555555;--sd-radio-button-radio-button-content-hover:#FFFFFF;--sd-radio-button-radio-button-content-select:#0075FF;--sd-radio-button-radio-button-content-disabled:#888888;--sd-radio-button-radio-button-group-gap:-1px;--sd-list-item-list-item-padding-y:4px;--sd-list-item-list-item-padding-right:12px;--sd-list-item-list-item-gap:8px;--sd-list-item-list-item-padding-left-depth1:12px;--sd-list-item-list-item-padding-left-depth2:20px;--sd-list-item-list-item-padding-left-depth3:28px;--sd-list-item-list-item-typography-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-typography-default-font-weight:400;--sd-list-item-list-item-typography-default-font-size:12px;--sd-list-item-list-item-typography-default-line-height:20px;--sd-list-item-list-item-typography-default-text-decoration:none;--sd-list-item-list-item-typography-selected-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-typography-selected-font-weight:700;--sd-list-item-list-item-typography-selected-font-size:12px;--sd-list-item-list-item-typography-selected-text-decoration:none;--sd-list-item-list-item-typography-selected-line-height:20px;--sd-list-item-list-item-bg-default:#FFFFFF;--sd-list-item-list-item-bg-hover:#0075FF;--sd-list-item-list-item-content-default:#222222;--sd-list-item-list-item-content-hover:#FFFFFF;--sd-list-item-list-item-content-disabled:#888888;--sd-list-item-list-item-content-selected:#0075FF;--sd-list-item-list-item-indeterminate-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-indeterminate-typography-font-weight:700;--sd-list-item-list-item-indeterminate-typography-font-size:12px;--sd-list-item-list-item-indeterminate-typography-text-decoration:none;--sd-list-item-list-item-indeterminate-typography-line-height:20px;--sd-list-item-list-item-depth1-bg-default:#EFF6FF;--sd-list-item-list-item-depth1-bg-disabled:#EEEEEE;--sd-list-item-list-item-depth1-border-color:#E1E1E1;--sd-list-item-list-item-depth1-border-width:1px;--sd-list-item-list-item-depth1-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-depth1-title-typography-font-weight:700;--sd-list-item-list-item-depth1-title-typography-font-size:12px;--sd-list-item-list-item-depth1-title-typography-text-decoration:none;--sd-list-item-list-item-depth1-title-typography-line-height:20px;--sd-list-item-list-item-depth2-middle-bg:#F6F6F6;--sd-list-item-list-item-depth2-middle-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-depth2-middle-title-typography-font-weight:500;--sd-list-item-list-item-depth2-middle-title-typography-font-size:12px;--sd-list-item-list-item-depth2-middle-title-typography-text-decoration:none;--sd-list-item-list-item-depth2-middle-title-typography-line-height:20px;--sd-list-item-list-item-count-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-count-typography-font-weight:500;--sd-list-item-list-item-count-typography-font-size:12px;--sd-list-item-list-item-count-typography-text-decoration:none;--sd-list-item-list-item-count-typography-line-height:20px;--sd-list-item-list-item-count-color:#888888;--sd-list-box-list-box-radius:4px;--sd-list-box-list-box-bg:#FFFFFF;--sd-list-box-list-box-chip-padding-x-y:8px;--sd-list-box-list-box-chip-gap:8px;--sd-select-select-height:28px;--sd-select-select-radius:4px;--sd-select-select-border-width:1px;--sd-select-select-padding-x:12px;--sd-select-select-icon-default:#888888;--sd-select-select-icon-disabled:#BBBBBB;--sd-select-select-gap:8px;--sd-select-select-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-select-select-typography-font-weight:400;--sd-select-select-typography-font-size:12px;--sd-select-select-typography-line-height:20px;--sd-select-select-typography-text-decoration:none;--sd-select-select-border-default:#AAAAAA;--sd-select-select-border-hover:#0075FF;--sd-select-select-border-danger:#FB4444;--sd-select-select-border-disabled:#CCCCCC;--sd-select-select-bg-default:#FFFFFF;--sd-select-select-bg-disabled:#E1E1E1;--sd-select-select-text-default:#222222;--sd-select-select-text-disabled:#888888;--sd-select-select-size-icon:16px;--sd-field-field-label-sm-height:28px;--sd-field-field-label-sm-gap:6px;--sd-field-field-label-sm-icon:12px;--sd-field-field-label-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-field-field-label-sm-typography-font-weight:700;--sd-field-field-label-sm-typography-font-size:12px;--sd-field-field-label-sm-typography-text-decoration:none;--sd-field-field-label-sm-typography-line-height:20px;--sd-field-field-label-md-height:36px;--sd-field-field-label-md-gap:8px;--sd-field-field-label-md-icon:16px;--sd-field-field-label-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-field-field-label-md-typography-font-weight:700;--sd-field-field-label-md-typography-font-size:14px;--sd-field-field-label-md-typography-text-decoration:none;--sd-field-field-label-md-typography-line-height:24px;--sd-field-field-addon-label-height:28px;--sd-field-field-addon-label-gap:6px;--sd-field-field-addon-label-padding-x:12px;--sd-field-field-addon-label-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-field-field-addon-label-typography-font-weight:500;--sd-field-field-addon-label-typography-font-size:12px;--sd-field-field-addon-label-typography-text-decoration:none;--sd-field-field-addon-label-typography-line-height:20px;--sd-field-field-addon-label-bg:#F6F6F6;--sd-field-field-addon-label-border-default:#AAAAAA;--sd-field-field-addon-label-border-disabled:#CCCCCC;--sd-field-field-addon-label-border-width:1px;--sd-textinput-textinput-sm-height:28px;--sd-textinput-textinput-sm-padding-x:12px;--sd-textinput-textinput-sm-padding-y:4px;--sd-textinput-textinput-sm-gap:8px;--sd-textinput-textinput-sm-radius:4px;--sd-textinput-textinput-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-textinput-textinput-sm-typography-font-weight:400;--sd-textinput-textinput-sm-typography-font-size:12px;--sd-textinput-textinput-sm-typography-line-height:20px;--sd-textinput-textinput-sm-typography-text-decoration:none;--sd-textinput-textinput-md-height:36px;--sd-textinput-textinput-md-padding-x:16px;--sd-textinput-textinput-md-gap:12px;--sd-textinput-textinput-md-radius:6px;--sd-textinput-textinput-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-textinput-textinput-md-typography-font-weight:400;--sd-textinput-textinput-md-typography-font-size:14px;--sd-textinput-textinput-md-typography-text-decoration:none;--sd-textinput-textinput-md-typography-line-height:24px;--sd-textinput-textinput-border-width:1px;--sd-textinput-textinput-border-default:#AAAAAA;--sd-textinput-textinput-border-focus:#0075FF;--sd-textinput-textinput-border-danger:#FB4444;--sd-textinput-textinput-border-success:#12B553;--sd-textinput-textinput-border-disabled:#CCCCCC;--sd-textinput-textinput-bg-default:#FFFFFF;--sd-textinput-textinput-bg-disabled:#E1E1E1;--sd-textinput-textinput-bg-barcode:#FAFAA1;--sd-textinput-textinput-text-default:#222222;--sd-textinput-textinput-text-placeholder:#AAAAAA;--sd-textinput-textinput-text-disabled:#888888;--sd-textinput-textinput-text-hint:#555555;--sd-textinput-textinput-text-error-message:#E30000;--sd-textinput-textinput-size-icon:16px;--sd-textinput-textinput-icon-default:#888888;--sd-textinput-textinput-unit-color:#888888;--sd-textinput-textinput-hint-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-textinput-textinput-hint-typography-font-weight:400;--sd-textinput-textinput-hint-typography-font-size:12px;--sd-textinput-textinput-hint-typography-line-height:20px;--sd-textinput-textinput-hint-typography-text-decoration:none;--sd-textinput-textinput-error-message-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-textinput-textinput-error-message-typography-font-weight:400;--sd-textinput-textinput-error-message-typography-font-size:12px;--sd-textinput-textinput-error-message-typography-line-height:20px;--sd-textinput-textinput-error-message-typography-text-decoration:none;--sd-textinput-textinput-contents-gap:4px;--sd-textinput-textinput-resizer-size:12px;--sd-textinput-textinput-resizer-color:#AAAAAA;--sd-number-input-number-input-sm-height:28px;--sd-number-input-number-input-sm-padding-x:6px;--sd-number-input-number-input-sm-radius:4px;--sd-number-input-number-input-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-number-input-number-input-sm-typography-font-weight:400;--sd-number-input-number-input-sm-typography-font-size:12px;--sd-number-input-number-input-sm-typography-line-height:20px;--sd-number-input-number-input-sm-typography-text-decoration:none;--sd-number-input-number-input-md-height:36px;--sd-number-input-number-input-md-padding-x:8px;--sd-number-input-number-input-md-radius:6px;--sd-number-input-number-input-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-number-input-number-input-md-typography-font-weight:400;--sd-number-input-number-input-md-typography-font-size:16px;--sd-number-input-number-input-md-typography-line-height:26px;--sd-number-input-number-input-md-typography-text-decoration:none;--sd-number-input-number-input-border-width:1px;--sd-number-input-number-input-contents-gap:4px;--sd-number-input-number-input-border-default:#AAAAAA;--sd-number-input-number-input-border-focus:#0075FF;--sd-number-input-number-input-border-danger:#FB4444;--sd-number-input-number-input-border-success:#12B553;--sd-number-input-number-input-border-disabled:#CCCCCC;--sd-number-input-number-input-bg-default:#FFFFFF;--sd-number-input-number-input-bg-disabled:#E1E1E1;--sd-number-input-number-input-text-default:#222222;--sd-number-input-number-input-text-placeholder:#AAAAAA;--sd-number-input-number-input-text-disabled:#888888;--sd-number-input-number-input-hint-color:#555555;--sd-number-input-number-input-hint-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-number-input-number-input-hint-typography-font-weight:400;--sd-number-input-number-input-hint-typography-font-size:12px;--sd-number-input-number-input-hint-typography-line-height:20px;--sd-number-input-number-input-hint-typography-text-decoration:none;--sd-number-input-number-input-error-message-color:#E30000;--sd-number-input-number-input-error-message-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-number-input-number-input-error-message-typography-font-weight:400;--sd-number-input-number-input-error-message-typography-font-size:12px;--sd-number-input-number-input-error-message-typography-line-height:20px;--sd-number-input-number-input-error-message-typography-text-decoration:none;--sd-number-input-number-input-stepper-sm-size:20px;--sd-number-input-number-input-stepper-md-size:24px;--sd-number-input-number-input-stepper-radius:4px;--sd-number-input-number-input-stepper-bg-default:#EFF6FF;--sd-number-input-number-input-stepper-bg-disabled:#EEEEEE;--sd-number-input-number-input-stepper-icon-default:#0075FF;--sd-number-input-number-input-stepper-icon-disabled:#BBBBBB;--sd-filepicker-filepicker-height:28px;--sd-filepicker-filepicker-padding-x:12px;--sd-filepicker-filepicker-gap:8px;--sd-filepicker-filepicker-radius:4px;--sd-filepicker-filepicker-border-width:1px;--sd-filepicker-filepicker-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-filepicker-filepicker-typography-font-weight:400;--sd-filepicker-filepicker-typography-font-size:12px;--sd-filepicker-filepicker-typography-line-height:20px;--sd-filepicker-filepicker-typography-text-decoration:none;--sd-filepicker-filepicker-size-icon:16px;--sd-filepicker-filepicker-contents-gap:4px;--sd-filepicker-filepicker-border-default:#AAAAAA;--sd-filepicker-filepicker-border-disabled:#CCCCCC;--sd-filepicker-filepicker-bg-default:#FFFFFF;--sd-filepicker-filepicker-bg-disabled:#E1E1E1;--sd-filepicker-filepicker-text-default:#222222;--sd-filepicker-filepicker-text-placeholder:#AAAAAA;--sd-filepicker-filepicker-text-disabled:#888888;--sd-filepicker-filepicker-icon-disabled:#BBBBBB;--sd-datepicker-datepicker-sm-height:28px;--sd-datepicker-datepicker-sm-padding-x:12px;--sd-datepicker-datepicker-sm-gap:8px;--sd-datepicker-datepicker-sm-icon:16px;--sd-datepicker-datepicker-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-sm-typography-font-weight:400;--sd-datepicker-datepicker-sm-typography-font-size:12px;--sd-datepicker-datepicker-sm-typography-line-height:20px;--sd-datepicker-datepicker-sm-typography-text-decoration:none;--sd-datepicker-datepicker-sm-radius:4px;--sd-datepicker-datepicker-sm-date-gap:4px;--sd-datepicker-datepicker-md-height:36px;--sd-datepicker-datepicker-md-padding-x:16px;--sd-datepicker-datepicker-md-gap:12px;--sd-datepicker-datepicker-md-icon:20px;--sd-datepicker-datepicker-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-md-typography-font-weight:400;--sd-datepicker-datepicker-md-typography-font-size:16px;--sd-datepicker-datepicker-md-typography-line-height:26px;--sd-datepicker-datepicker-md-typography-text-decoration:none;--sd-datepicker-datepicker-md-radius:6px;--sd-datepicker-datepicker-md-date-gap:6px;--sd-datepicker-datepicker-border-width:1px;--sd-datepicker-datepicker-border-default:#AAAAAA;--sd-datepicker-datepicker-border-focus:#0075FF;--sd-datepicker-datepicker-border-disabled:#CCCCCC;--sd-datepicker-datepicker-bg-default:#FFFFFF;--sd-datepicker-datepicker-bg-disabled:#E1E1E1;--sd-datepicker-datepicker-icon-default:#888888;--sd-datepicker-datepicker-icon-disabled:#BBBBBB;--sd-datepicker-datepicker-text-default:#222222;--sd-datepicker-datepicker-text-hint:#555555;--sd-datepicker-datepicker-text-disabled:#888888;--sd-datepicker-datepicker-contents-gap:4px;--sd-datepicker-datepicker-hint-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-hint-typography-font-weight:400;--sd-datepicker-datepicker-hint-typography-font-size:12px;--sd-datepicker-datepicker-hint-typography-line-height:20px;--sd-datepicker-datepicker-hint-typography-text-decoration:none;--sd-datepicker-datepicker-calendar-bg:#FFFFFF;--sd-datepicker-datepicker-calendar-padding-x-y:24px;--sd-datepicker-datepicker-calendar-gap:12px;--sd-datepicker-datepicker-calendar-radius:8px;--sd-datepicker-datepicker-calendar-header-gap:8px;--sd-datepicker-datepicker-calendar-header-divider:#E1E1E1;--sd-datepicker-datepicker-calendar-header-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-calendar-header-typography-font-weight:500;--sd-datepicker-datepicker-calendar-header-typography-font-size:14px;--sd-datepicker-datepicker-calendar-header-typography-text-decoration:none;--sd-datepicker-datepicker-calendar-header-typography-line-height:24px;--sd-datepicker-datepicker-calendar-week-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-calendar-week-typography-font-weight:400;--sd-datepicker-datepicker-calendar-week-typography-font-size:12px;--sd-datepicker-datepicker-calendar-week-typography-line-height:20px;--sd-datepicker-datepicker-calendar-week-typography-text-decoration:none;--sd-datepicker-datepicker-calendar-week-color:#888888;--sd-datepicker-datepicker-calendar-grid-row-gap:4px;--sd-datepicker-datepicker-calendar-day-width:40px;--sd-datepicker-datepicker-calendar-day-circle-size:32px;--sd-datepicker-datepicker-calendar-day-circle-radius:9999px;--sd-datepicker-datepicker-calendar-day-default-text:#222222;--sd-datepicker-datepicker-calendar-day-hover-text:#222222;--sd-datepicker-datepicker-calendar-day-hover-border:#0075FF;--sd-datepicker-datepicker-calendar-day-select-bg:#0075FF;--sd-datepicker-datepicker-calendar-day-select-text:#FFFFFF;--sd-datepicker-datepicker-calendar-day-disabled-text:#BBBBBB;--sd-datepicker-datepicker-calendar-day-typography-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-calendar-day-typography-default-font-weight:400;--sd-datepicker-datepicker-calendar-day-typography-default-font-size:14px;--sd-datepicker-datepicker-calendar-day-typography-default-text-decoration:none;--sd-datepicker-datepicker-calendar-day-typography-default-line-height:24px;--sd-datepicker-datepicker-calendar-day-typography-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-calendar-day-typography-bold-font-weight:700;--sd-datepicker-datepicker-calendar-day-typography-bold-font-size:14px;--sd-datepicker-datepicker-calendar-day-typography-bold-text-decoration:none;--sd-datepicker-datepicker-calendar-day-typography-bold-line-height:24px;--sd-datepicker-datepicker-calendar-day-dot-size:6px;--sd-datepicker-datepicker-calendar-day-dot-gap:2px;--sd-datepicker-datepicker-calendar-day-dot-padding-y:4px;--sd-datepicker-datepicker-calendar-range-bg:#D9EAFF;--sd-datepicker-datepicker-calendar-range-height:32px;--sd-datepicker-datepicker-calendar-range-panel-gap:24px;--sd-datepicker-datepicker-calendar-range-divider:#E1E1E1;--sd-datepicker-datepicker-calendar-range-width:20px;--sd-chip-chip-height:24px;--sd-chip-chip-padding-x:8px;--sd-chip-chip-gap:4px;--sd-chip-chip-radius:9999px;--sd-chip-chip-typography-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-chip-chip-typography-default-font-size:12px;--sd-chip-chip-typography-default-font-weight:500;--sd-chip-chip-typography-default-text-decoration:none;--sd-chip-chip-typography-default-line-height:20px;--sd-chip-chip-typography-focus-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-chip-chip-typography-focus-font-size:12px;--sd-chip-chip-typography-focus-font-weight:400;--sd-chip-chip-typography-focus-text-decoration:none;--sd-chip-chip-typography-focus-line-height:20px;--sd-chip-chip-bg-default:#F6F6F6;--sd-chip-chip-bg-error:#FCEFEF;--sd-chip-chip-bg-focus:#FFFFFF;--sd-chip-chip-content-default:#888888;--sd-chip-chip-content-error:#E30000;--sd-chip-chip-content-focus:#555555;--sd-chip-chip-border-focus:#E1E1E1;--sd-chip-chip-border-width:1px;--sd-tag-tag-xs-height:20px;--sd-tag-tag-xs-padding-x:8px;--sd-tag-tag-xs-gap:4px;--sd-tag-tag-xs-icon:12px;--sd-tag-tag-xs-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tag-tag-xs-typography-font-size:11px;--sd-tag-tag-xs-typography-font-weight:500;--sd-tag-tag-xs-typography-line-height:18px;--sd-tag-tag-xs-typography-text-decoration:none;--sd-tag-tag-xs-radius:6px;--sd-tag-tag-sm-height:24px;--sd-tag-tag-sm-padding-x:8px;--sd-tag-tag-sm-gap:4px;--sd-tag-tag-sm-icon:16px;--sd-tag-tag-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tag-tag-sm-typography-font-size:12px;--sd-tag-tag-sm-typography-font-weight:700;--sd-tag-tag-sm-typography-text-decoration:none;--sd-tag-tag-sm-typography-line-height:20px;--sd-tag-tag-sm-radius:6px;--sd-tag-tag-md-height:28px;--sd-tag-tag-md-padding-x:12px;--sd-tag-tag-md-gap:6px;--sd-tag-tag-md-icon:16px;--sd-tag-tag-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tag-tag-md-typography-font-size:14px;--sd-tag-tag-md-typography-font-weight:700;--sd-tag-tag-md-typography-line-height:24px;--sd-tag-tag-md-typography-text-decoration:none;--sd-tag-tag-md-radius:8px;--sd-tag-tag-red-content:#FB4444;--sd-tag-tag-red-bg:#FCEFEF;--sd-tag-tag-orange-content:#FF6B00;--sd-tag-tag-orange-bg:#FEF1EA;--sd-tag-tag-yellow-content:#916C0D;--sd-tag-tag-yellow-bg:#FFF7DD;--sd-tag-tag-green-content:#00973C;--sd-tag-tag-green-bg:#E8F9EF;--sd-tag-tag-blue-content:#0075FF;--sd-tag-tag-blue-bg:#E6F1FF;--sd-tag-tag-darkblue-content:#006AC1;--sd-tag-tag-darkblue-bg:#EAF5FE;--sd-tag-tag-indigo-content:#004290;--sd-tag-tag-indigo-bg:#EFF6FF;--sd-tag-tag-grey-content:#737373;--sd-tag-tag-grey-bg:#EEEEEE;--sd-badge-badge-size:6px;--sd-badge-badge-radius:9999px;--sd-badge-badge-red:#FB4444;--sd-badge-badge-orange:#FF6B00;--sd-badge-badge-yellow:#FFC700;--sd-badge-badge-green:#00973C;--sd-badge-badge-blue:#0075FF;--sd-badge-badge-darkblue:#006AC1;--sd-badge-badge-indigo:#004290;--sd-badge-badge-grey:#737373;--sd-tooltip-tooltip-radius:6px;--sd-tooltip-tooltip-padding-y:12px;--sd-tooltip-tooltip-padding-x:16px;--sd-tooltip-tooltip-gap:12px;--sd-tooltip-tooltip-arrow-width:16px;--sd-tooltip-tooltip-arrow-height:12px;--sd-tooltip-tooltip-default-bg:#07284A;--sd-tooltip-tooltip-default-content:#FFFFFF;--sd-tooltip-tooltip-default-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tooltip-tooltip-default-typography-font-size:12px;--sd-tooltip-tooltip-default-typography-font-weight:500;--sd-tooltip-tooltip-default-typography-line-height:20px;--sd-tooltip-tooltip-default-typography-text-decoration:none;--sd-tooltip-tooltip-danger-bg:#FCEFEF;--sd-tooltip-tooltip-danger-content:#FB4444;--sd-tooltip-tooltip-danger-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tooltip-tooltip-danger-typography-font-size:12px;--sd-tooltip-tooltip-danger-typography-font-weight:700;--sd-tooltip-tooltip-danger-typography-text-decoration:none;--sd-tooltip-tooltip-danger-typography-line-height:20px;--sd-tooltip-tooltip-warning-bg:#FEF1EA;--sd-tooltip-tooltip-warning-content:#FF6B00;--sd-tooltip-tooltip-warning-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tooltip-tooltip-warning-typography-font-size:12px;--sd-tooltip-tooltip-warning-typography-font-weight:700;--sd-tooltip-tooltip-warning-typography-text-decoration:none;--sd-tooltip-tooltip-warning-typography-line-height:20px;--sd-tooltip-tooltip-accent-bg:#E6F1FF;--sd-tooltip-tooltip-accent-content:#0075FF;--sd-tooltip-tooltip-accent-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tooltip-tooltip-accent-typography-font-size:12px;--sd-tooltip-tooltip-accent-typography-font-weight:700;--sd-tooltip-tooltip-accent-typography-text-decoration:none;--sd-tooltip-tooltip-accent-typography-line-height:20px;--sd-popover-popover-radius:6px;--sd-popover-popover-padding-y:16px;--sd-popover-popover-padding-x:20px;--sd-popover-popover-gap:12px;--sd-popover-popover-body-gap:12px;--sd-popover-popover-contents-gap:4px;--sd-popover-popover-arrow-width:16px;--sd-popover-popover-arrow-height:12px;--sd-popover-popover-bg:#07284A;--sd-popover-popover-title-color:#FFFFFF;--sd-popover-popover-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-popover-popover-title-typography-font-size:14px;--sd-popover-popover-title-typography-font-weight:700;--sd-popover-popover-title-typography-line-height:24px;--sd-popover-popover-title-typography-text-decoration:none;--sd-popover-popover-description-color:#FFFFFF;--sd-popover-popover-description-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-popover-popover-description-typography-font-size:12px;--sd-popover-popover-description-typography-font-weight:500;--sd-popover-popover-description-typography-line-height:20px;--sd-popover-popover-description-typography-text-decoration:none;--sd-popover-popover-sub-action-color:#D8D8D8;--sd-popover-popover-sub-action-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-popover-popover-sub-action-typography-font-size:12px;--sd-popover-popover-sub-action-typography-font-weight:700;--sd-popover-popover-sub-action-typography-text-decoration:none;--sd-popover-popover-sub-action-typography-line-height:20px;--sd-toast-toast-radius:8px;--sd-toast-toast-padding-y:12px;--sd-toast-toast-padding-x:24px;--sd-toast-toast-gap:16px;--sd-toast-toast-icon:16px;--sd-toast-toast-typography-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-toast-toast-typography-default-font-size:14px;--sd-toast-toast-typography-default-font-weight:700;--sd-toast-toast-typography-default-line-height:24px;--sd-toast-toast-typography-default-text-decoration:none;--sd-toast-toast-typography-link-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-toast-toast-typography-link-font-size:14px;--sd-toast-toast-typography-link-font-weight:700;--sd-toast-toast-typography-link-line-height:24px;--sd-toast-toast-typography-link-text-decoration:underline;--sd-toast-toast-default-bg:#07284A;--sd-toast-toast-default-content:#FFFFFF;--sd-toast-toast-danger-bg:#FB4444;--sd-toast-toast-danger-content:#FFFFFF;--sd-toast-toast-caution-bg:#FFC700;--sd-toast-toast-caution-content:#222222;--sd-toast-toast-complete-bg:#00973C;--sd-toast-toast-complete-content:#FFFFFF;--sd-toast-toast-accent-bg:#005CC9;--sd-toast-toast-accent-content:#FFFFFF;--sd-modal-modal-radius:8px;--sd-modal-modal-confirm-padding-x:32px;--sd-modal-modal-confirm-padding-y:40px;--sd-modal-modal-confirm-gap:40px;--sd-modal-modal-confirm-body-gap:20px;--sd-modal-modal-confirm-title-gap:12px;--sd-modal-modal-confirm-title-color:#222222;--sd-modal-modal-confirm-title-icon:32px;--sd-modal-modal-confirm-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-modal-modal-confirm-title-typography-font-weight:700;--sd-modal-modal-confirm-title-typography-font-size:18px;--sd-modal-modal-confirm-title-typography-line-height:30px;--sd-modal-modal-confirm-title-typography-text-decoration:none;--sd-modal-modal-confirm-button-gap:8px;--sd-modal-modal-confirm-message-color:#222222;--sd-modal-modal-confirm-message-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-modal-modal-confirm-message-typography-font-size:12px;--sd-modal-modal-confirm-message-typography-font-weight:400;--sd-modal-modal-confirm-message-typography-line-height:20px;--sd-modal-modal-confirm-message-typography-text-decoration:none;--sd-modal-modal-confirm-positive-icon:#0075FF;--sd-modal-modal-confirm-negative-icon:#E30000;--sd-modal-modal-bg:#FFFFFF;--sd-modal-modal-action-header-padding-x:24px;--sd-modal-modal-action-header-padding-y:20px;--sd-modal-modal-action-header-gap:12px;--sd-modal-modal-action-title-color:#033F59;--sd-modal-modal-action-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-modal-modal-action-title-typography-font-weight:700;--sd-modal-modal-action-title-typography-font-size:16px;--sd-modal-modal-action-title-typography-text-decoration:none;--sd-modal-modal-action-title-typography-line-height:26px;--sd-modal-modal-action-body-padding-x:20px;--sd-modal-modal-action-body-padding-bottom:20px;--sd-modal-modal-action-footer-padding-x:20px;--sd-modal-modal-action-footer-padding-y:8px;--sd-modal-modal-action-footer-gap:16px;--sd-modal-modal-action-footer-bg:#F6F6F6;--sd-modal-modal-action-footer-border:#E1E1E1;--sd-modal-modal-loading-width:520px;--sd-modal-modal-loading-height:320px;--sd-modal-modal-loading-gap:20px;--sd-modal-modal-loading-content:80px;--sd-modal-modal-loading-message-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-modal-modal-loading-message-typography-font-size:12px;--sd-modal-modal-loading-message-typography-font-weight:400;--sd-modal-modal-loading-message-typography-line-height:20px;--sd-modal-modal-loading-message-typography-text-decoration:none;--sd-modal-modal-loading-message-color:#888888;--sd-spinner-spinner-size:80px;--sd-spinner-spinner-color-track:#EEEEEE;--sd-spinner-spinner-color-arc:#2D8DFF;--sd-guide-guide-gap:4px;--sd-guide-guide-button-height:28px;--sd-guide-guide-button-padding-x:12px;--sd-guide-guide-button-radius:9999px;--sd-guide-guide-button-gap:6px;--sd-guide-guide-button-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-guide-guide-button-typography-font-size:12px;--sd-guide-guide-button-typography-font-weight:500;--sd-guide-guide-button-typography-text-decoration:none;--sd-guide-guide-button-typography-line-height:20px;--sd-guide-guide-button-icon-size:16px;--sd-guide-guide-button-icon-default:#00973C;--sd-guide-guide-button-icon-active:#FFFFFF;--sd-guide-guide-button-border-width:1px;--sd-guide-guide-button-border-default:#E1E1E1;--sd-guide-guide-button-bg-default:#FFFFFF;--sd-guide-guide-button-bg-tip:#00973C;--sd-guide-guide-button-bg-notion:#1F8AE1;--sd-guide-guide-button-text-default:#222222;--sd-guide-guide-button-text-active:#FFFFFF;--sd-guide-guide-contents-padding-x:24px;--sd-guide-guide-contents-padding-y:20px;--sd-guide-guide-contents-gap:12px;--sd-guide-guide-contents-title-gap:8px;--sd-guide-guide-contents-row-gap:8px;--sd-guide-guide-contents-body-gap:2px;--sd-guide-guide-contents-typography-title-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-guide-guide-contents-typography-title-font-weight:700;--sd-guide-guide-contents-typography-title-font-size:16px;--sd-guide-guide-contents-typography-title-text-decoration:none;--sd-guide-guide-contents-typography-title-line-height:26px;--sd-guide-guide-contents-typography-body-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-guide-guide-contents-typography-body-font-weight:400;--sd-guide-guide-contents-typography-body-font-size:12px;--sd-guide-guide-contents-typography-body-line-height:20px;--sd-guide-guide-contents-typography-body-text-decoration:none;--sd-guide-guide-contents-typography-color:#222222;--sd-guide-guide-contents-icon:#00973C;--sd-guide-guide-contents-radius:8px;--sd-guide-guide-contents-depth-padding-left:32px;--sd-pagination-pagination-height:24px;--sd-pagination-pagination-padding-x:6px;--sd-pagination-pagination-radius:6px;--sd-pagination-pagination-gap:12px;--sd-pagination-pagination-move-gap:4px;--sd-pagination-pagination-icon:12px;--sd-pagination-pagination-typography-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-pagination-pagination-typography-default-font-size:12px;--sd-pagination-pagination-typography-default-font-weight:500;--sd-pagination-pagination-typography-default-text-decoration:none;--sd-pagination-pagination-typography-default-line-height:20px;--sd-pagination-pagination-typography-default-selected-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-pagination-pagination-typography-default-selected-font-weight:700;--sd-pagination-pagination-typography-default-selected-font-size:12px;--sd-pagination-pagination-typography-default-selected-line-height:20px;--sd-pagination-pagination-typography-default-selected-text-decoration:none;--sd-pagination-pagination-typography-selected-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-pagination-pagination-typography-selected-font-weight:700;--sd-pagination-pagination-typography-selected-font-size:12px;--sd-pagination-pagination-typography-selected-line-height:20px;--sd-pagination-pagination-typography-selected-text-decoration:none;--sd-pagination-pagination-typography-selected-selected-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-pagination-pagination-typography-selected-selected-font-weight:700;--sd-pagination-pagination-typography-selected-selected-font-size:12px;--sd-pagination-pagination-typography-selected-selected-line-height:20px;--sd-pagination-pagination-typography-selected-selected-text-decoration:none;--sd-pagination-pagination-item-bg-hover:#EEEEEE;--sd-pagination-pagination-item-bg-selected:#E6F1FF;--sd-pagination-pagination-item-content-default:#555555;--sd-pagination-pagination-item-content-hover:#004290;--sd-pagination-pagination-item-content-selected:#004290}.bg-primary{background-color:var(--color-primary, #051d36)}.bg-secondary{background-color:var(--color-secondary, #555555)}.bg-accent{background-color:var(--color-accent, #9c27b0)}.bg-positive{background-color:var(--color-positive, #0075ff)}.bg-negative{background-color:var(--color-negative, #e30000)}.bg-info{background-color:var(--color-info, #00cd52)}.bg-warning{background-color:var(--color-warning, #f2c037)}.bg-red_99{background-color:var(--color-red_99, #220000)}.bg-red_95{background-color:var(--color-red_95, #440000)}.bg-red_90{background-color:var(--color-red_90, #5E0000)}.bg-red_85{background-color:var(--color-red_85, #820000)}.bg-red_80{background-color:var(--color-red_80, #AD0000)}.bg-red_75{background-color:var(--color-red_75, #E30000)}.bg-red_70{background-color:var(--color-red_70, #FB4444)}.bg-red_60{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90{background-color:var(--color-orange_90, #752A00)}.bg-orange_85{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90{background-color:var(--color-olive_90, #454500)}.bg-olive_80{background-color:var(--color-olive_80, #636300)}.bg-olive_70{background-color:var(--color-olive_70, #838300)}.bg-olive_65{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99{background-color:var(--color-green_99, #001D0B)}.bg-green_95{background-color:var(--color-green_95, #003013)}.bg-green_90{background-color:var(--color-green_90, #00461C)}.bg-green_85{background-color:var(--color-green_85, #006629)}.bg-green_80{background-color:var(--color-green_80, #007B31)}.bg-green_75{background-color:var(--color-green_75, #00973C)}.bg-green_70{background-color:var(--color-green_70, #12B553)}.bg-green_65{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55{background-color:var(--color-green_55, #6DE39C)}.bg-green_45{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95{background-color:var(--color-grey_95, #222222)}.bg-grey_90{background-color:var(--color-grey_90, #333333)}.bg-grey_85{background-color:var(--color-grey_85, #444444)}.bg-grey_80{background-color:var(--color-grey_80, #555555)}.bg-grey_70{background-color:var(--color-grey_70, #737373)}.bg-grey_65{background-color:var(--color-grey_65, #888888)}.bg-grey_60{background-color:var(--color-grey_60, #999999)}.bg-grey_55{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05{background-color:var(--color-grey_05, #f9f9f9)}.bg-white{background-color:var(--color-white, #ffffff)}.bg-black{background-color:var(--color-black, #000000)}.text-primary{color:var(--color-primary, #051d36)}.text-secondary{color:var(--color-secondary, #555555)}.text-accent{color:var(--color-accent, #9c27b0)}.text-positive{color:var(--color-positive, #0075ff)}.text-negative{color:var(--color-negative, #e30000)}.text-info{color:var(--color-info, #00cd52)}.text-warning{color:var(--color-warning, #f2c037)}.text-red_99{color:var(--color-red_99, #220000)}.text-red_95{color:var(--color-red_95, #440000)}.text-red_90{color:var(--color-red_90, #5E0000)}.text-red_85{color:var(--color-red_85, #820000)}.text-red_80{color:var(--color-red_80, #AD0000)}.text-red_75{color:var(--color-red_75, #E30000)}.text-red_70{color:var(--color-red_70, #FB4444)}.text-red_60{color:var(--color-red_60, #FF7C7C)}.text-red_45{color:var(--color-red_45, #FFB5B5)}.text-red_30{color:var(--color-red_30, #FFD3D3)}.text-red_20{color:var(--color-red_20, #FCE6E6)}.text-red_15{color:var(--color-red_15, #FCEFEF)}.text-caution_bg{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon{color:var(--color-caution_icon, #fd9595)}.text-orange_99{color:var(--color-orange_99, #2F1100)}.text-orange_95{color:var(--color-orange_95, #4D1B00)}.text-orange_90{color:var(--color-orange_90, #752A00)}.text-orange_85{color:var(--color-orange_85, #9B3700)}.text-orange_75{color:var(--color-orange_75, #CE4900)}.text-orange_65{color:var(--color-orange_65, #FF6B00)}.text-orange_60{color:var(--color-orange_60, #FF7F22)}.text-orange_55{color:var(--color-orange_55, #FFA452)}.text-orange_45{color:var(--color-orange_45, #FFBC81)}.text-orange_35{color:var(--color-orange_35, #FFD5AF)}.text-orange_20{color:var(--color-orange_20, #FFEAD7)}.text-orange_10{color:var(--color-orange_10, #FEF1EA)}.text-header_alert{color:var(--color-header_alert, #FF7A00)}.text-yellow_95{color:var(--color-yellow_95, #322700)}.text-yellow_90{color:var(--color-yellow_90, #453702)}.text-yellow_80{color:var(--color-yellow_80, #6C5602)}.text-yellow_70{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60{color:var(--color-yellow_60, #C49900)}.text-yellow_50{color:var(--color-yellow_50, #EBB800)}.text-yellow_45{color:var(--color-yellow_45, #FFC700)}.text-yellow_40{color:var(--color-yellow_40, #FFD643)}.text-yellow_30{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95{color:var(--color-olive_95, #2C2C00)}.text-olive_90{color:var(--color-olive_90, #454500)}.text-olive_80{color:var(--color-olive_80, #636300)}.text-olive_70{color:var(--color-olive_70, #838300)}.text-olive_65{color:var(--color-olive_65, #A5A500)}.text-olive_55{color:var(--color-olive_55, #C7C700)}.text-olive_45{color:var(--color-olive_45, #DDDD12)}.text-olive_30{color:var(--color-olive_30, #EEEE37)}.text-olive_20{color:var(--color-olive_20, #F6F65F)}.text-olive_15{color:var(--color-olive_15, #FAFAA1)}.text-olive_10{color:var(--color-olive_10, #FBFBBF)}.text-olive_05{color:var(--color-olive_05, #FEFED9)}.text-green_99{color:var(--color-green_99, #001D0B)}.text-green_95{color:var(--color-green_95, #003013)}.text-green_90{color:var(--color-green_90, #00461C)}.text-green_85{color:var(--color-green_85, #006629)}.text-green_80{color:var(--color-green_80, #007B31)}.text-green_75{color:var(--color-green_75, #00973C)}.text-green_70{color:var(--color-green_70, #12B553)}.text-green_65{color:var(--color-green_65, #2BCE6C)}.text-green_55{color:var(--color-green_55, #6DE39C)}.text-green_45{color:var(--color-green_45, #ACF4C9)}.text-green_25{color:var(--color-green_25, #D4FAE3)}.text-green_15{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95{color:var(--color-grey_95, #222222)}.text-grey_90{color:var(--color-grey_90, #333333)}.text-grey_85{color:var(--color-grey_85, #444444)}.text-grey_80{color:var(--color-grey_80, #555555)}.text-grey_70{color:var(--color-grey_70, #737373)}.text-grey_65{color:var(--color-grey_65, #888888)}.text-grey_60{color:var(--color-grey_60, #999999)}.text-grey_55{color:var(--color-grey_55, #aaaaaa)}.text-grey_50{color:var(--color-grey_50, #bbbbbb)}.text-grey_45{color:var(--color-grey_45, #cccccc)}.text-grey_35{color:var(--color-grey_35, #D8D8D8)}.text-grey_30{color:var(--color-grey_30, #e1e1e1)}.text-grey_25{color:var(--color-grey_25, #E5E5E5)}.text-grey_20{color:var(--color-grey_20, #eeeeee)}.text-grey_10{color:var(--color-grey_10, #f6f6f6)}.text-grey_05{color:var(--color-grey_05, #f9f9f9)}.text-white{color:var(--color-white, #ffffff)}.text-black{color:var(--color-black, #000000)}*,*::before,*::after{box-sizing:border-box}*{scroll-behavior:smooth}*::-webkit-scrollbar{opacity:0;width:8px;background:#E5E5E5}*::-webkit-scrollbar:horizontal{height:8px}*::-webkit-scrollbar-thumb{height:80px;background-color:#CCCCCC;border-radius:4px}*::-webkit-scrollbar-track{background-color:#E5E5E5}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0}ul[role=list],ol[role=list]{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font-size:inherit}:target{scroll-margin-block:5ex}button{background:none;border:none;cursor:pointer;padding:0;outline:0}button:focus{outline:0 !important}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{-webkit-text-fill-color:#000;-webkit-box-shadow:0 0 0px 1000px #fff inset;box-shadow:0 0 0px 1000px #fff inset;transition:background-color 5000s ease-in-out 0s}input:autofill,input:autofill:hover,input:autofill:focus,input:autofill:active{-webkit-text-fill-color:#000;-webkit-box-shadow:0 0 0px 1000px #fff inset;box-shadow:0 0 0px 1000px #fff inset;transition:background-color 5000s ease-in-out 0s}:host{display:inline-block;height:fit-content;line-height:0}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}input[type=text],input[type=number],input[type=password],input[type=email],input[type=tel],textarea{padding-block:0px;padding-inline:0px}.sd-hoverable:hover>.sd-focus-helper{background:currentColor;opacity:0.15}.sd-hoverable:hover>.sd-focus-helper:before{opacity:0.1}.sd-hoverable:hover>.sd-focus-helper:after{opacity:0.4}.sd-focus-helper{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before,.sd-focus-helper:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before{background:#000000}.sd-focus-helper:after{background:#ffffff}";
140
140
 
141
141
  /*
142
142
  Stencil Hydrate Platform v4.43.2 | MIT Licensed | https://stenciljs.com
@@ -5287,7 +5287,7 @@ class DataTable {
5287
5287
  return el.innerHTML;
5288
5288
  }
5289
5289
  render() {
5290
- return (hAsync("div", { key: '6d2ff3676d082540cc70939363b0f07ff7252e8c', class: "table-wrapper" }, hAsync("table", { key: '3995aead06dfce42ea4e918486b1473c1740b96e', class: { 'data-table': true, 'bordered': this.bordered, 'striped': this.striped } }, hAsync("thead", { key: '9cbe03cbe1f69d7546ba5037489d20d85bd4a534' }, hAsync("tr", { key: '7ab64e3e3ef214a19a010501d3ec9778c5594990' }, this.columns.map(column => (hAsync("th", { key: column.field, style: { width: column.width } }, this.renderHeaderContent(column)))))), hAsync("tbody", { key: '660707fb4d5075b98698718e8cfa8ed903f3d1e2' }, this.rows.map((row, rowIndex) => (hAsync("tr", { key: rowIndex }, this.columns.map(column => (hAsync("td", { key: `${rowIndex}-${column.field}` }, this.renderCellContent(column, row, rowIndex))))))))), hAsync("div", { key: '9aabf030b814c340b2f4a1d66644516ed320f31b', class: "templates-slot", hidden: true }, hAsync("slot", { key: '532e40bf658706a99b57dc89c056d977db3e4d83' }))));
5290
+ return (hAsync("div", { key: 'eb6246d49bb46a1c2b2b9d93cff90e7c0d6788b4', class: "table-wrapper" }, hAsync("table", { key: '584d752e51f252f2dd7a29868ae4300b55c47065', class: { 'data-table': true, 'bordered': this.bordered, 'striped': this.striped } }, hAsync("thead", { key: 'fd35de9ad1cb79cf77ab9f7a806d2d7258d8b11b' }, hAsync("tr", { key: '39a42d9fc76571aa5ef6073ec554471d5fd1b4c1' }, this.columns.map(column => (hAsync("th", { key: column.field, style: { width: column.width } }, this.renderHeaderContent(column)))))), hAsync("tbody", { key: '5c3a2b5853f619666b20145e0f7a221c75969071' }, this.rows.map((row, rowIndex) => (hAsync("tr", { key: rowIndex }, this.columns.map(column => (hAsync("td", { key: `${rowIndex}-${column.field}` }, this.renderCellContent(column, row, rowIndex))))))))), hAsync("div", { key: 'bbbd15c2d1b517774340dbcdfb59338f260df21b', class: "templates-slot", hidden: true }, hAsync("slot", { key: '28733f09dd4a90976d9bb60102039981c736cf87' }))));
5291
5291
  }
5292
5292
  static get watchers() { return {
5293
5293
  "columns": [{
@@ -5448,7 +5448,7 @@ class SdActionModal {
5448
5448
  if (this.height != null && this.height !== '') {
5449
5449
  sizeStyle.height = typeof this.height === 'number' ? `${this.height}px` : this.height;
5450
5450
  }
5451
- return (hAsync("div", { key: 'e741d601fd1c079ebee5b0c527bdf9ec62c43e65', class: "sd-action-modal", style: { ...cssVars, ...sizeStyle } }, hAsync("header", { key: '9a083fe0d0f8d2b9509cb80af2e8091f4cb23c26', class: "sd-action-modal__header" }, hAsync("h2", { key: '1c91eecc04e5c70267ab571a5a7e8dab8fc97fa4', class: "sd-action-modal__title" }, this.modalTitle), hAsync("div", { key: '67eba3fbada5580c5741387248d803d0299612e2', class: "sd-action-modal__header-sub" }, hAsync("slot", { key: '769583cdfdb8c5d1e2eb2bd1c240c9956f1530e3', name: "header-sub-title" })), hAsync("sd-ghost-button", { key: '05cb596931da687dd2fbf961bdbe116b0a83ee87', class: "sd-action-modal__close", icon: "close", ariaLabel: "close", onClick: () => this.close.emit() })), hAsync("div", { key: 'ecf3346b28bdf29d13fedb1d58f2119af73932a2', class: "sd-action-modal__body" }, hAsync("slot", { key: '276aa6ced63b887cda3b8a9790b4d5064763f556', name: "body" })), (this.buttonProps != null || this.buttonProps != undefined) && (hAsync("footer", { key: 'fcf62d04efe0cfa46c3ceadda2314606a1e3588c', class: "sd-action-modal__footer" }, hAsync("div", { key: '61948bdf02737aed99420533f5fb9ab4e28be676', class: "sd-action-modal__footer-sub" }, hAsync("slot", { key: '761a6a38ba2a86f932564a7d1e03e3277f9f917b', name: "bottom-sub-content" })), hAsync("sd-button-v2", { key: '242531f04700bea06c93c25a7eaf3e0b03dd628d', ...DEFAULT_BUTTON_PROPS, ...this.buttonProps, onSdClick: () => this.ok.emit() })))));
5451
+ return (hAsync("div", { key: '85e107137d01ef0a8fd8a839d7223c5163cb1a30', class: "sd-action-modal", style: { ...cssVars, ...sizeStyle } }, hAsync("header", { key: '00d31be3a53866ecb5b72e76550c9501cdf6a106', class: "sd-action-modal__header" }, hAsync("h2", { key: '4e4d000f6261ee2147a3d943d5aedc41afe1b30c', class: "sd-action-modal__title" }, this.modalTitle), hAsync("div", { key: 'f6df02450472e1969f5a96822058d2384af78a8a', class: "sd-action-modal__header-sub" }, hAsync("slot", { key: 'ffb45a725e9e3c8ee56534ba3286897eaf33b844', name: "header-sub-title" })), hAsync("sd-ghost-button", { key: '26f68005c1b1ae18991a4da802cbfbd027af8536', class: "sd-action-modal__close", icon: "close", ariaLabel: "close", onClick: () => this.close.emit() })), hAsync("div", { key: 'ebc57d5a90530acf465fef3866d63d95e8bf8311', class: "sd-action-modal__body" }, hAsync("slot", { key: 'a55744951a9812373adabbb7d3db8c06b25f5c72', name: "body" })), (this.buttonProps != null || this.buttonProps != undefined) && (hAsync("footer", { key: '1aef0ac810ba08682c9b8cea47a48e4679a17ee0', class: "sd-action-modal__footer" }, hAsync("div", { key: 'eeeec98e930aa71fcfdd28a1d76a842083c6a185', class: "sd-action-modal__footer-sub" }, hAsync("slot", { key: '7015d9593c5567824f40ab4c60ca2be8ac5f5989', name: "bottom-sub-content" })), hAsync("sd-button-v2", { key: 'c35ea44b195fd7725cb914cf3f04db9389abdfe3', ...DEFAULT_BUTTON_PROPS, ...this.buttonProps, onSdClick: () => this.ok.emit() })))));
5452
5452
  }
5453
5453
  static get style() { return sdActionModalCss(); }
5454
5454
  static get cmpMeta() { return {
@@ -5501,7 +5501,7 @@ class SdBadge {
5501
5501
  label = '';
5502
5502
  render() {
5503
5503
  const resolvedColor = BADGE_COLOR_MAP[this.color] ?? BADGE_COLOR_MAP.blue;
5504
- return (hAsync("div", { key: '7535760a065f5b0afa35d58c6f3017cacb31f507', class: "sd-badge", style: { '--sd-badge-color': resolvedColor } }, hAsync("div", { key: '1a42bf60039e469b0676b0266f9cbde168e8c27e', class: "sd-badge__dot" }), hAsync("div", { key: '2296c4187b5222849dbe0472d19669376b53350f', class: "sd-badge__label" }, this.label)));
5504
+ return (hAsync("div", { key: 'a4b84e172a57763fbef2feedaf52c1e8c219250d', class: "sd-badge", style: { '--sd-badge-color': resolvedColor } }, hAsync("div", { key: '723edda0c397241af91ccfc62d14cbfc131456cf', class: "sd-badge__dot" }), hAsync("div", { key: '80415403bea863a62ad5d8139cfcf8951bedee49', class: "sd-badge__label" }, this.label)));
5505
5505
  }
5506
5506
  static get style() { return sdBadgeCss(); }
5507
5507
  static get cmpMeta() { return {
@@ -5548,8 +5548,9 @@ const textinput = {
5548
5548
  radius: "6",
5549
5549
  typography: {
5550
5550
  fontWeight: "400",
5551
- fontSize: "16",
5552
- lineHeight: "26"}
5551
+ fontSize: "14",
5552
+ lineHeight: "24"
5553
+ }
5553
5554
  },
5554
5555
  border: {
5555
5556
  "default": "#AAAAAA"},
@@ -5709,7 +5710,7 @@ class SdBarcodeInput {
5709
5710
  '--sd-system-radius-field-sm': `${sizeTokens.radius}px`,
5710
5711
  '--sd-system-color-field-bg-default': BARCODE_INPUT_COLORS.bg.barcode,
5711
5712
  };
5712
- return (hAsync("sd-field", { key: 'bba439856e0cbaedc7b54411dac904f9c845b50c', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, size: this.size, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("label", { key: '8553cfb4b5ef9535608abc1f2987ce08970c318a', class: "sd-barcode-input__content" }, hAsync("slot", { key: '93db2b38e8d674230f48e3b9496a7221d8477da6', name: "prefix" }), hAsync("input", { key: '30997bea593052322a2d29fc1e517b00cf19b1fb', name: this.name, ref: el => (this.nativeEl = el), class: `sd-barcode-input__native ${this.inputClass}`, type: "text", value: this.internalValue || '', placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, onInput: this.handleInput, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event), style: this.inputStyle }), hAsync("slot", { key: '690daa6c1daa6058713ee09b0efe976557cde3ab', name: "suffix" }), this.clearable && this.internalValue && (hAsync("sd-ghost-button", { key: '8ab4e45a23d1b06dc415d969e25ed5ea59540643', icon: "close", ariaLabel: "close", size: "xxs", disabled: this.disabled, class: "sd-barcode-input__clear-icon", onClick: async () => {
5713
+ return (hAsync("sd-field", { key: '11079233784a85ec20bae4653155a9820d878681', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, size: this.size, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("label", { key: '592fcb675607d57d7372abac967eb1c1a1e27212', class: "sd-barcode-input__content" }, hAsync("slot", { key: 'a035ed3825360f81e669c3ef9099a479bbb69fd0', name: "prefix" }), hAsync("input", { key: '7ffffa2b085050d05d1439cac1c90901144da410', name: this.name, ref: el => (this.nativeEl = el), class: `sd-barcode-input__native ${this.inputClass}`, type: "text", value: this.internalValue || '', placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, onInput: this.handleInput, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event), style: this.inputStyle }), hAsync("slot", { key: 'cc9a0e5b0b367c5c443bfe132408d834d74c16b3', name: "suffix" }), this.clearable && this.internalValue && (hAsync("sd-ghost-button", { key: 'a5a06ef58a7f38ffbafb56038ff8321e66184da5', icon: "close", ariaLabel: "clear", size: "xxs", disabled: this.disabled, class: "sd-barcode-input__clear-icon", onClick: async () => {
5713
5714
  if (this.disabled)
5714
5715
  return;
5715
5716
  this.internalValue = '';
@@ -5765,7 +5766,7 @@ class SdBarcodeInput {
5765
5766
  }; }
5766
5767
  }
5767
5768
 
5768
- const button = {
5769
+ const button$1 = {
5769
5770
  xs: {
5770
5771
  icon: "12"
5771
5772
  },
@@ -5849,7 +5850,7 @@ const button = {
5849
5850
  }
5850
5851
  };
5851
5852
  var buttonTokens = {
5852
- button: button
5853
+ button: button$1
5853
5854
  };
5854
5855
 
5855
5856
  const primary = "#051D36";
@@ -6434,13 +6435,13 @@ class SdButtonV2 {
6434
6435
  const hasLabel = Boolean(this.label);
6435
6436
  const iconOnly = !this.label && (Boolean(this.icon) !== Boolean(this.rightIcon));
6436
6437
  const accessibleName = iconOnly && this.ariaLabel.trim() ? this.ariaLabel : undefined;
6437
- return (hAsync("button", { key: '50bb61cfbf36d2f002b6937603640ea585d42a0e', class: this.getButtonClasses(preset, config.size, hasLabel, iconOnly), type: this.type, disabled: this.disabled, "aria-label": accessibleName, style: {
6438
+ return (hAsync("button", { key: '61dde2ec51ac5099909d38a7420568bfd4fcde0b', class: this.getButtonClasses(preset, config.size, hasLabel, iconOnly), type: this.type, disabled: this.disabled, "aria-label": accessibleName, style: {
6438
6439
  '--sd-button-v2-bg': config.color,
6439
6440
  '--sd-button-v2-bg-hover': PRESET_HOVER_BACKGROUNDS$1[preset],
6440
6441
  '--sd-button-v2-border': PRESET_BORDER_COLORS$1[preset],
6441
6442
  '--sd-button-v2-content': PRESET_CONTENT_COLORS$1[preset],
6442
6443
  '--sd-button-v2-accent': BUTTON_FOCUS_RING_COLOR,
6443
- }, onClick: this.handleClick }, hAsync("span", { key: 'a1f34337cc33a6eba29547ff7df39109739bb06c', class: "sd-button-v2__content" }, this.icon && (hAsync("sd-icon", { key: 'fb4b8c87c57979f3c39eaa893626e6c3f5e56b08', class: "sd-button-v2__icon", name: this.icon, size: BUTTON_ICON_SIZES[config.size], color: "var(--sd-button-v2-current-icon)" })), this.label && hAsync("span", { key: '00e78a17818e7c286b33ca45e37eac78102cf590', class: "sd-button-v2__label" }, this.label), this.rightIcon && (hAsync("sd-icon", { key: '9e146585df41a6784a09e8239b28c8e8b4f30516', class: "sd-button-v2__icon sd-button-v2__icon--right", name: this.rightIcon, size: BUTTON_ICON_SIZES[config.size], color: "var(--sd-button-v2-current-icon)" })))));
6444
+ }, onClick: this.handleClick }, hAsync("span", { key: 'dc433a47ace0d074503a2c0e5c47c4c8bfa6cb8c', class: "sd-button-v2__content" }, this.icon && (hAsync("sd-icon", { key: '95e941490d78f1950f9f7759112fb714f191a504', class: "sd-button-v2__icon", name: this.icon, size: BUTTON_ICON_SIZES[config.size], color: "var(--sd-button-v2-current-icon)" })), this.label && hAsync("span", { key: 'c13f3fb5bec105d7737ef1f9db7dcd4ca93ce5be', class: "sd-button-v2__label" }, this.label), this.rightIcon && (hAsync("sd-icon", { key: 'fb20dde72eaab014ae0e658477db228c23eddea3', class: "sd-button-v2__icon sd-button-v2__icon--right", name: this.rightIcon, size: BUTTON_ICON_SIZES[config.size], color: "var(--sd-button-v2-current-icon)" })))));
6444
6445
  }
6445
6446
  static get style() { return sdButtonV2Css(); }
6446
6447
  static get cmpMeta() { return {
@@ -6678,7 +6679,7 @@ class SdCard {
6678
6679
  bordered = false;
6679
6680
  sdClass = '';
6680
6681
  render() {
6681
- return (hAsync(Fragment, { key: 'dd37653555ffeab3b249575c8a1cbe9aa70498b1' }, hAsync("div", { key: 'eb0cea509b62fe1942d8ddfb955fee920b5c51a5', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.sdClass}` }, hAsync("slot", { key: 'a792a49e58b1b1756f11d0bb6e7441674c63455e' }))));
6682
+ return (hAsync(Fragment, { key: 'ce09898d7396b093f0f292700d5d6bd8b6249ad3' }, hAsync("div", { key: 'df584d42ecf16b8ea3618238fb58e77cb7e80d9e', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.sdClass}` }, hAsync("slot", { key: 'e031effb829371ca8c001bcc5596b4c9d01c8951' }))));
6682
6683
  }
6683
6684
  static get style() { return sdCardCss(); }
6684
6685
  static get cmpMeta() { return {
@@ -6910,6 +6911,336 @@ class SdCheckbox {
6910
6911
  }; }
6911
6912
  }
6912
6913
 
6914
+ const chip = {
6915
+ height: "24",
6916
+ paddingX: "8",
6917
+ gap: "4",
6918
+ radius: "9999",
6919
+ typography: {
6920
+ "default": {
6921
+ fontFamily: "Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif",
6922
+ fontSize: "12",
6923
+ fontWeight: "500",
6924
+ lineHeight: "20"
6925
+ },
6926
+ focus: {
6927
+ fontFamily: "Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif",
6928
+ fontSize: "12",
6929
+ fontWeight: "400",
6930
+ lineHeight: "20"
6931
+ }
6932
+ },
6933
+ bg: {
6934
+ "default": "#F6F6F6",
6935
+ error: "#FCEFEF",
6936
+ focus: "#FFFFFF"
6937
+ },
6938
+ content: {
6939
+ "default": "#888888",
6940
+ error: "#E30000",
6941
+ focus: "#555555"
6942
+ },
6943
+ border: {
6944
+ focus: "#E1E1E1",
6945
+ width: "1"
6946
+ }
6947
+ };
6948
+ var chipTokens = {
6949
+ chip: chip
6950
+ };
6951
+
6952
+ const CHIP_LAYOUT = {
6953
+ height: `${chipTokens.chip.height}px`,
6954
+ paddingX: `${chipTokens.chip.paddingX}px`,
6955
+ gap: `${chipTokens.chip.gap}px`,
6956
+ radius: `${chipTokens.chip.radius}px`,
6957
+ borderWidth: `${chipTokens.chip.border.width}px`,
6958
+ };
6959
+ const CHIP_COLORS = {
6960
+ bg: {
6961
+ default: chipTokens.chip.bg.default,
6962
+ error: chipTokens.chip.bg.error,
6963
+ focus: chipTokens.chip.bg.focus,
6964
+ },
6965
+ content: {
6966
+ default: chipTokens.chip.content.default,
6967
+ error: chipTokens.chip.content.error,
6968
+ focus: chipTokens.chip.content.focus,
6969
+ },
6970
+ border: {
6971
+ focus: chipTokens.chip.border.focus,
6972
+ },
6973
+ };
6974
+ const CHIP_TYPOGRAPHY = {
6975
+ default: {
6976
+ fontFamily: chipTokens.chip.typography.default.fontFamily,
6977
+ fontSize: `${chipTokens.chip.typography.default.fontSize}px`,
6978
+ fontWeight: chipTokens.chip.typography.default.fontWeight,
6979
+ lineHeight: `${chipTokens.chip.typography.default.lineHeight}px`,
6980
+ },
6981
+ focus: {
6982
+ fontFamily: chipTokens.chip.typography.focus.fontFamily,
6983
+ fontSize: `${chipTokens.chip.typography.focus.fontSize}px`,
6984
+ fontWeight: chipTokens.chip.typography.focus.fontWeight,
6985
+ lineHeight: `${chipTokens.chip.typography.focus.lineHeight}px`,
6986
+ },
6987
+ };
6988
+
6989
+ const sdChipCss = () => `sd-chip{display:inline-flex;width:fit-content;height:fit-content}sd-chip .sd-chip{display:inline-flex;align-items:center;justify-content:center;gap:var(--sd-chip-gap);height:var(--sd-chip-height);padding:0 var(--sd-chip-padding-x);border-radius:var(--sd-chip-radius);background:var(--sd-chip-bg);color:var(--sd-chip-content);border:var(--sd-chip-border-width) solid var(--sd-chip-border-color);font-family:var(--sd-chip-font-family);font-size:var(--sd-chip-font-size);font-weight:var(--sd-chip-font-weight);line-height:var(--sd-chip-line-height);box-sizing:border-box;white-space:nowrap;-webkit-user-select:none;user-select:none}sd-chip .sd-chip--editable:not(.sd-chip--focus){cursor:text}sd-chip .sd-chip--disabled{cursor:not-allowed;opacity:0.6}sd-chip .sd-chip__label{display:inline-flex;align-items:center;min-width:0}sd-chip .sd-chip__input{display:inline-block;min-width:1ch;outline:none;background:transparent;color:inherit;font:inherit;white-space:nowrap;cursor:text}sd-chip .sd-chip__input:empty::before{content:attr(data-placeholder);color:inherit;opacity:0.6;pointer-events:none}sd-chip .sd-chip__remove{flex-shrink:0}`;
6990
+
6991
+ class SdChip {
6992
+ constructor(hostRef) {
6993
+ registerInstance(this, hostRef);
6994
+ this.update = createEvent(this, "sdUpdate", 7);
6995
+ this.remove = createEvent(this, "sdRemove", 7);
6996
+ this.focus = createEvent(this, "sdFocus", 7);
6997
+ this.blur = createEvent(this, "sdBlur", 7);
6998
+ }
6999
+ get el() { return getElement(this); }
7000
+ name = '';
7001
+ value = '';
7002
+ error = false;
7003
+ disabled = false;
7004
+ placeholder = '';
7005
+ rules = [];
7006
+ internalValue = '';
7007
+ isEditing = false;
7008
+ update;
7009
+ remove;
7010
+ focus;
7011
+ blur;
7012
+ inputEl;
7013
+ draftValue = '';
7014
+ shouldInitInput = false;
7015
+ valueChanged(newValue) {
7016
+ const nextValue = newValue ?? '';
7017
+ const wasEditing = this.isEditing;
7018
+ this.internalValue = nextValue;
7019
+ this.draftValue = nextValue;
7020
+ if (wasEditing) {
7021
+ this.isEditing = false;
7022
+ this.shouldInitInput = false;
7023
+ this.inputEl?.blur();
7024
+ this.blur.emit();
7025
+ }
7026
+ }
7027
+ componentWillLoad() {
7028
+ this.internalValue = this.value ?? '';
7029
+ }
7030
+ componentDidLoad() {
7031
+ this.registerToForm();
7032
+ }
7033
+ disconnectedCallback() {
7034
+ this.unregisterFromForm();
7035
+ }
7036
+ async sdValidate() {
7037
+ if (!this.rules || this.rules.length === 0) {
7038
+ this.error = false;
7039
+ return true;
7040
+ }
7041
+ for (const rule of this.rules) {
7042
+ const result = rule(this.internalValue ?? '');
7043
+ if (result !== true) {
7044
+ this.error = true;
7045
+ return false;
7046
+ }
7047
+ }
7048
+ this.error = false;
7049
+ return true;
7050
+ }
7051
+ async sdReset() {
7052
+ this.internalValue = '';
7053
+ this.value = '';
7054
+ this.error = false;
7055
+ this.draftValue = '';
7056
+ this.isEditing = false;
7057
+ this.shouldInitInput = false;
7058
+ }
7059
+ async sdResetValidate() {
7060
+ this.error = false;
7061
+ }
7062
+ async sdResetValidation() {
7063
+ this.error = false;
7064
+ }
7065
+ async sdFocus() {
7066
+ if (this.disabled)
7067
+ return;
7068
+ this.enterEditMode();
7069
+ }
7070
+ async sdGetNativeElement() {
7071
+ return this.inputEl ?? null;
7072
+ }
7073
+ enterEditMode = () => {
7074
+ if (this.disabled || this.isEditing)
7075
+ return;
7076
+ this.draftValue = this.internalValue;
7077
+ this.shouldInitInput = true;
7078
+ this.isEditing = true;
7079
+ this.focus.emit();
7080
+ };
7081
+ commitEdit = async () => {
7082
+ if (!this.isEditing)
7083
+ return;
7084
+ const next = (this.inputEl?.textContent ?? this.draftValue).trim();
7085
+ const changed = next !== this.draftValue;
7086
+ this.internalValue = next;
7087
+ this.isEditing = false;
7088
+ this.shouldInitInput = false;
7089
+ this.value = next;
7090
+ if (changed) {
7091
+ this.update.emit(next);
7092
+ }
7093
+ await this.sdValidate();
7094
+ this.blur.emit();
7095
+ };
7096
+ cancelEdit = () => {
7097
+ if (!this.isEditing)
7098
+ return;
7099
+ this.internalValue = this.draftValue;
7100
+ this.isEditing = false;
7101
+ this.shouldInitInput = false;
7102
+ this.blur.emit();
7103
+ };
7104
+ handleChipClick = () => {
7105
+ if (this.disabled || this.isEditing)
7106
+ return;
7107
+ this.enterEditMode();
7108
+ };
7109
+ handleChipKeyDown = (event) => {
7110
+ if (this.disabled || this.isEditing)
7111
+ return;
7112
+ if (event.key === 'Enter' || event.key === ' ') {
7113
+ event.preventDefault();
7114
+ this.enterEditMode();
7115
+ }
7116
+ };
7117
+ handleInputChange = (event) => {
7118
+ const target = event.target;
7119
+ this.internalValue = target.textContent ?? '';
7120
+ };
7121
+ handleInputKeyDown = (event) => {
7122
+ if (event.key === 'Enter') {
7123
+ event.preventDefault();
7124
+ this.commitEdit();
7125
+ }
7126
+ else if (event.key === 'Escape') {
7127
+ event.preventDefault();
7128
+ this.cancelEdit();
7129
+ }
7130
+ };
7131
+ handleInputBlur = () => {
7132
+ this.commitEdit();
7133
+ };
7134
+ handlePaste = (event) => {
7135
+ event.preventDefault();
7136
+ const text = event.clipboardData?.getData('text/plain') ?? '';
7137
+ document.execCommand('insertText', false, text);
7138
+ };
7139
+ handleRemoveClick = (event) => {
7140
+ event.stopPropagation();
7141
+ if (this.disabled)
7142
+ return;
7143
+ this.remove.emit();
7144
+ };
7145
+ syncInputValue(value) {
7146
+ if (!this.inputEl)
7147
+ return;
7148
+ this.inputEl.textContent = value;
7149
+ const range = document.createRange();
7150
+ range.selectNodeContents(this.inputEl);
7151
+ range.collapse(false);
7152
+ const selection = window.getSelection();
7153
+ selection?.removeAllRanges();
7154
+ selection?.addRange(range);
7155
+ }
7156
+ registerToForm() {
7157
+ const formEl = this.el.closest('sd-form');
7158
+ if (!formEl || typeof formEl.componentOnReady !== 'function')
7159
+ return;
7160
+ formEl.componentOnReady().then(form => {
7161
+ form.sdRegisterField(this);
7162
+ });
7163
+ }
7164
+ unregisterFromForm() {
7165
+ if (!this.name)
7166
+ return;
7167
+ const formEl = this.el.closest('sd-form');
7168
+ formEl?.componentOnReady().then(form => {
7169
+ form.sdUnregisterField(this.name);
7170
+ });
7171
+ }
7172
+ componentDidUpdate() {
7173
+ if (this.isEditing && this.inputEl && this.shouldInitInput) {
7174
+ this.inputEl.focus();
7175
+ this.syncInputValue(this.internalValue);
7176
+ this.shouldInitInput = false;
7177
+ }
7178
+ }
7179
+ resolveState() {
7180
+ if (this.isEditing)
7181
+ return 'focus';
7182
+ if (this.error)
7183
+ return 'error';
7184
+ return 'default';
7185
+ }
7186
+ render() {
7187
+ const state = this.resolveState();
7188
+ const typography = state === 'focus' ? CHIP_TYPOGRAPHY.focus : CHIP_TYPOGRAPHY.default;
7189
+ const cssVars = {
7190
+ '--sd-chip-height': CHIP_LAYOUT.height,
7191
+ '--sd-chip-padding-x': CHIP_LAYOUT.paddingX,
7192
+ '--sd-chip-gap': CHIP_LAYOUT.gap,
7193
+ '--sd-chip-radius': CHIP_LAYOUT.radius,
7194
+ '--sd-chip-border-width': CHIP_LAYOUT.borderWidth,
7195
+ '--sd-chip-bg': CHIP_COLORS.bg[state],
7196
+ '--sd-chip-content': CHIP_COLORS.content[state],
7197
+ '--sd-chip-border-color': state === 'focus' ? CHIP_COLORS.border.focus : 'transparent',
7198
+ '--sd-chip-font-family': typography.fontFamily,
7199
+ '--sd-chip-font-size': typography.fontSize,
7200
+ '--sd-chip-font-weight': typography.fontWeight,
7201
+ '--sd-chip-line-height': typography.lineHeight,
7202
+ };
7203
+ return (hAsync("span", { key: 'ec814d57fb4032de1370e56d61cd51b6e831312a', class: {
7204
+ 'sd-chip': true,
7205
+ [`sd-chip--${state}`]: true,
7206
+ 'sd-chip--disabled': this.disabled,
7207
+ 'sd-chip--editable': !this.disabled,
7208
+ }, role: this.disabled ? undefined : 'button', tabIndex: this.disabled || this.isEditing ? -1 : 0, "aria-disabled": this.disabled ? 'true' : undefined, style: cssVars, onClick: this.handleChipClick, onKeyDown: this.handleChipKeyDown }, this.isEditing ? (hAsync("span", { key: "chip-input", ref: el => (this.inputEl = el), class: "sd-chip__input", contentEditable: !this.disabled, "data-placeholder": this.placeholder, spellcheck: false, onInput: this.handleInputChange, onKeyDown: this.handleInputKeyDown, onBlur: this.handleInputBlur, onPaste: this.handlePaste, onClick: event => event.stopPropagation() })) : ([
7209
+ hAsync("span", { key: "chip-label", class: "sd-chip__label" }, this.internalValue),
7210
+ !this.disabled && (hAsync("sd-ghost-button", { key: "chip-remove", class: "sd-chip__remove", icon: "close", size: "xxs", ariaLabel: "remove", onClick: this.handleRemoveClick })),
7211
+ ])));
7212
+ }
7213
+ static get watchers() { return {
7214
+ "value": [{
7215
+ "valueChanged": 0
7216
+ }]
7217
+ }; }
7218
+ static get style() { return sdChipCss(); }
7219
+ static get cmpMeta() { return {
7220
+ "$flags$": 512,
7221
+ "$tagName$": "sd-chip",
7222
+ "$members$": {
7223
+ "name": [1],
7224
+ "value": [1025],
7225
+ "error": [1028],
7226
+ "disabled": [4],
7227
+ "placeholder": [1],
7228
+ "rules": [16],
7229
+ "internalValue": [32],
7230
+ "isEditing": [32],
7231
+ "sdValidate": [64],
7232
+ "sdReset": [64],
7233
+ "sdResetValidate": [64],
7234
+ "sdResetValidation": [64],
7235
+ "sdFocus": [64],
7236
+ "sdGetNativeElement": [64]
7237
+ },
7238
+ "$listeners$": undefined,
7239
+ "$lazyBundleId$": "-",
7240
+ "$attrsToReflect$": []
7241
+ }; }
7242
+ }
7243
+
6913
7244
  const spinner = {
6914
7245
  color: {
6915
7246
  track: "#EEEEEE",
@@ -6971,7 +7302,7 @@ class SdCircleProgress {
6971
7302
  arcStyle.strokeDashoffset = '0';
6972
7303
  }
6973
7304
  const c = CIRCLE_PROGRESS_VIEWBOX_SIZE / 2;
6974
- return (hAsync(Host, { key: 'fb876909febfc95bb69c58031ac37419baa07137', style: hostStyle }, hAsync("svg", { key: '3bb8130bab317a74c1553dd2ceb52b8c0f65f69f', class: "sd-circle-progress", viewBox: `0 0 ${CIRCLE_PROGRESS_VIEWBOX_SIZE} ${CIRCLE_PROGRESS_VIEWBOX_SIZE}`, xmlns: "http://www.w3.org/2000/svg" }, hAsync("circle", { key: '5904f93a6b1c333dbcbd805140d5e65b5af20080', class: "sd-circle-progress__track", cx: c, cy: c, r: CIRCLE_PROGRESS_RADIUS, fill: "none", "stroke-width": CIRCLE_PROGRESS_STROKE_WIDTH }), hAsync("circle", { key: '4d8a1d352e4003a75dd63f67a66a05f595ae5700', class: "sd-circle-progress__arc", cx: c, cy: c, r: CIRCLE_PROGRESS_RADIUS, fill: "none", "stroke-width": CIRCLE_PROGRESS_STROKE_WIDTH, "stroke-linecap": "round", style: arcStyle }))));
7305
+ return (hAsync(Host, { key: '50b598305810f4f91c5afb7ede87c60178e4e6df', style: hostStyle }, hAsync("svg", { key: '7edcf8a57bf5589910d08a47b64179222ce9c03b', class: "sd-circle-progress", viewBox: `0 0 ${CIRCLE_PROGRESS_VIEWBOX_SIZE} ${CIRCLE_PROGRESS_VIEWBOX_SIZE}`, xmlns: "http://www.w3.org/2000/svg" }, hAsync("circle", { key: '43810b096bdd644e4b09bfd770de6b0194afe3c8', class: "sd-circle-progress__track", cx: c, cy: c, r: CIRCLE_PROGRESS_RADIUS, fill: "none", "stroke-width": CIRCLE_PROGRESS_STROKE_WIDTH }), hAsync("circle", { key: '701cfdd0eadabea530d3a9deada993a568f3fb19', class: "sd-circle-progress__arc", cx: c, cy: c, r: CIRCLE_PROGRESS_RADIUS, fill: "none", "stroke-width": CIRCLE_PROGRESS_STROKE_WIDTH, "stroke-linecap": "round", style: arcStyle }))));
6975
7306
  }
6976
7307
  static get style() { return sdCircleProgressCss(); }
6977
7308
  static get cmpMeta() { return {
@@ -7081,9 +7412,9 @@ class SdConfirmModal {
7081
7412
  render() {
7082
7413
  const iconName = CONFIRM_MODAL_ICON_MAP[this.type];
7083
7414
  const iconColor = CONFIRM_MODAL_ICON_COLOR[this.type];
7084
- return (hAsync("div", { key: 'c95e6e3992e9d63c19f27624e92c00b5046503e0', class: "sd-confirm-modal" }, hAsync("sd-ghost-button", { key: 'edab233c28ebcfc181062d78cb80ec27a3ace8b4', class: "sd-confirm-modal__close-button", icon: "close", ariaLabel: "close", onClick: () => this.close.emit() }), iconName && (hAsync("sd-icon", { key: '4ea2ef8ac6027a6455367b39b6d3cc6cf073f0a8', class: "sd-confirm-modal__icon", name: iconName, size: TITLE_ICON_SIZE, color: iconColor })), hAsync("h2", { key: '5a25a6f0812a6932949a2667db2af1b69d772293', class: `sd-confirm-modal__title ${this.titleClass}` }, this.modalTitle), hAsync("div", { key: 'b431572003c129a0d44095a317532b535753abd3', class: "sd-confirm-modal__body" }, (this.topMessage ?? []).length > 0 && (hAsync("div", { key: 'cd425d24bde982323a0156ff18f4dcdc81660dd5', class: "sd-confirm-modal__message" }, (this.topMessage ?? []).map(msg => (hAsync("p", { class: "sd-confirm-modal__message-text", innerHTML: msg }))))), this.showContentBox && (hAsync("div", { key: '9486cf19dc6692228f615112b0777b6167c1a8de', class: "sd-confirm-modal__content-box" }, this.tagContents ? (hAsync("div", { class: "sd-confirm-modal__custom-content", ref: el => {
7415
+ return (hAsync("div", { key: '0ec5edeaef4920bb9193c225e5b39465e138eb25', class: "sd-confirm-modal" }, hAsync("sd-ghost-button", { key: '78db09f415f399302048280a2d3eb6eb737c1d47', class: "sd-confirm-modal__close-button", icon: "close", ariaLabel: "close", onClick: () => this.close.emit() }), iconName && (hAsync("sd-icon", { key: '30921f2c1fc59b7baa608c5b270f45cced3b4a69', class: "sd-confirm-modal__icon", name: iconName, size: TITLE_ICON_SIZE, color: iconColor })), hAsync("h2", { key: 'fdb1fa855a980ccad41101de0b1b0fc87a8a503b', class: `sd-confirm-modal__title ${this.titleClass}` }, this.modalTitle), hAsync("div", { key: 'e3539c1d7e82c957ba65e3d63e18e74108ed4ccc', class: "sd-confirm-modal__body" }, (this.topMessage ?? []).length > 0 && (hAsync("div", { key: '010bb3a2918672714a664cc9afa561d82ea2af30', class: "sd-confirm-modal__message" }, (this.topMessage ?? []).map(msg => (hAsync("p", { class: "sd-confirm-modal__message-text", innerHTML: msg }))))), this.showContentBox && (hAsync("div", { key: '6501c456b1cac2fc14e62e8094c5996472eb10cc', class: "sd-confirm-modal__content-box" }, this.tagContents ? (hAsync("div", { class: "sd-confirm-modal__custom-content", ref: el => {
7085
7416
  this.customContentRef = el;
7086
- } })) : (hAsync("slot", { onSlotchange: () => this.syncHasSlottedContent() }, this.tagLabel && hAsync("sd-tag", { name: this.tagPreset, label: this.tagLabel }), this.slotLabel && (hAsync("span", { class: "sd-confirm-modal__slot-label" }, this.slotLabel)))))), (this.bottomMessage ?? []).length > 0 && (hAsync("div", { key: '7218d8bf72e26f36f88db68f57818911bb09056d', class: "sd-confirm-modal__message" }, (this.bottomMessage ?? []).map(msg => (hAsync("p", { class: "sd-confirm-modal__message-text", innerHTML: msg })))))), hAsync("div", { key: 'e16de1bb3c851988050b12ac07c7adcedab560da', class: "sd-confirm-modal__button" }, this.subButtonLabel && (hAsync("sd-button-v2", { key: '8c14b099e6b8a93673ff3eb2f0931a45c98d620a', name: SUB_BUTTON_PRESET, label: this.subButtonLabel, onSdClick: () => this.cancel.emit() })), hAsync("sd-button-v2", { key: 'fb9a3984f0476d2fceca98bac186d0a52a0ab206', name: this.resolvedMainButton, label: this.mainButtonLabel, onSdClick: () => this.ok.emit() }))));
7417
+ } })) : (hAsync("slot", { onSlotchange: () => this.syncHasSlottedContent() }, this.tagLabel && hAsync("sd-tag", { name: this.tagPreset, label: this.tagLabel }), this.slotLabel && (hAsync("span", { class: "sd-confirm-modal__slot-label" }, this.slotLabel)))))), (this.bottomMessage ?? []).length > 0 && (hAsync("div", { key: 'fb38b92bc7ee05ede36eab14d65062a0b6289762', class: "sd-confirm-modal__message" }, (this.bottomMessage ?? []).map(msg => (hAsync("p", { class: "sd-confirm-modal__message-text", innerHTML: msg })))))), hAsync("div", { key: '7834c5baf84a1537e511f77f1d2bb2c018b2e5df', class: "sd-confirm-modal__button" }, this.subButtonLabel && (hAsync("sd-button-v2", { key: 'ca7a8fa074bde0339052adbacb52a60459e3da23', name: SUB_BUTTON_PRESET, label: this.subButtonLabel, onSdClick: () => this.cancel.emit() })), hAsync("sd-button-v2", { key: '5e3238161e753a8ea2a0266d099ff03a89b63871', name: this.resolvedMainButton, label: this.mainButtonLabel, onSdClick: () => this.ok.emit() }))));
7087
7418
  }
7088
7419
  static get style() { return sdConfirmModalCss(); }
7089
7420
  static get cmpMeta() { return {
@@ -7440,9 +7771,9 @@ class SdDatePicker {
7440
7771
  '--sd-system-color-field-border-focus': DATEPICKER_COLORS.border.focus,
7441
7772
  '--sd-system-color-field-bg-default': DATEPICKER_COLORS.bg.default,
7442
7773
  };
7443
- return (hAsync("sd-field", { key: '693c0c75e6b0a9ee8323f4be7ec101592e586372', name: this.fieldName || this.internalName, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, size: this.size, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("div", { key: 'ea7f506f0163119fac0c660ef1bef5781780a118', class: "sd-date-picker", ref: el => {
7774
+ return (hAsync("sd-field", { key: '1a84754cdc67bd6603e1fb48479f9d3ac6424d6a', name: this.fieldName || this.internalName, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, size: this.size, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("div", { key: 'e4d8e05b04ac7bd4f2f96809b33d67125fe7c6d8', class: "sd-date-picker", ref: el => {
7444
7775
  this.triggerRef = el;
7445
- } }, hAsync("sd-date-picker-trigger", { key: '0109eb0326655018bc02cc373e766ffdada85ff0', displayText: this.value ?? '', placeholder: this.placeholder, disabled: this.disabled, size: this.size, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (hAsync("sd-portal", { key: '65a628af43ae036a752f3511341fd8c9c82303a1', open: this.isOpen, parentRef: this.triggerRef, onSdClose: () => this.closeDropdown() }, hAsync("sd-date-picker-calendar", { key: '21f574fc9551f9aaccfcb5d49a81952dbba72d7a', value: this.value, selectable: this.selectable, onSdSelect: this.handleSelect, onSdViewChange: this.handleViewChange })))));
7776
+ } }, hAsync("sd-date-picker-trigger", { key: '244924af2c3ea207b2a90c5aef5064755da3ae52', displayText: this.value ?? '', placeholder: this.placeholder, disabled: this.disabled, size: this.size, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (hAsync("sd-portal", { key: 'f3d882d3450f629b6ed501b984d89ffd9633531f', open: this.isOpen, parentRef: this.triggerRef, onSdClose: () => this.closeDropdown() }, hAsync("sd-date-picker-calendar", { key: 'a0f47851a27dd777f77da40f3258638a0fbc37a5', value: this.value, selectable: this.selectable, onSdSelect: this.handleSelect, onSdViewChange: this.handleViewChange })))));
7446
7777
  }
7447
7778
  static get watchers() { return {
7448
7779
  "isOpen": [{
@@ -7623,7 +7954,7 @@ class SdDatePickerCalendar {
7623
7954
  '--calendar-day-font-weight': CALENDAR_LAYOUT.day.fontWeight,
7624
7955
  '--calendar-day-bold-font-weight': CALENDAR_LAYOUT.day.boldFontWeight,
7625
7956
  };
7626
- return (hAsync("div", { key: '9e47bf6790f947639b1868a653c9d451905d4a49', class: "sd-date-picker-calendar", style: cssVars }, hAsync("div", { key: '641a9726b22aff0e465347bf3363fdd6f3110919', class: "sd-date-picker-calendar__header" }, hAsync("div", { key: '71e4838be05148f989af7ccb692482db425c38d7', class: "sd-date-picker-calendar__nav-group" }, hAsync("sd-ghost-button", { key: '060795c43807ee50b13448ac559fb7945a48d8be', ariaLabel: "prevYear", size: "xxs", icon: "chevronLeft", onClick: this.goPrevYear }), hAsync("span", { key: '5cf2c070134aa04dc5f9d506b91bdff759d9453b', class: "sd-date-picker-calendar__label" }, this.currentYear), hAsync("sd-ghost-button", { key: 'dd3c9d26bc4b79673e12b90d2a7d563e4adda707', ariaLabel: "nextYear", size: "xxs", icon: "chevronRight", onClick: this.goNextYear })), hAsync("span", { key: '962ee5b8adbcbf988bc94b81b3dd0fe4e388a588', class: "sd-date-picker-calendar__divider", "aria-hidden": "true" }), hAsync("div", { key: '54d1fcfbcbe1e232cbea5cdd9a948045207771c7', class: "sd-date-picker-calendar__nav-group sd-date-picker-calendar__nav-group-month" }, hAsync("sd-ghost-button", { key: 'ff8011dbf88a257ba4b47dbcd1a3b8c414b4e7b5', ariaLabel: "prevMonth", size: "xxs", icon: "chevronLeft", onClick: this.goPrevMonth }), hAsync("span", { key: '2594eed1efacc8b3bdf648ab7527a81608e2321d', class: "sd-date-picker-calendar__label sd-date-picker-calendar__label-month" }, this.currentMonth, "\uC6D4"), hAsync("sd-ghost-button", { key: 'a83692da9caeaef4c02c777d43f769026182d5a2', ariaLabel: "nextMonth", size: "xxs", icon: "chevronRight", onClick: this.goNextMonth }))), hAsync("div", { key: 'bc131a11ed98ac84dee775090ca24be794fece55', class: "sd-date-picker-calendar__week" }, WEEK_LABELS.map(label => (hAsync("span", { key: label, class: "sd-date-picker-calendar__week-cell" }, label)))), hAsync("div", { key: 'bc4deb734c9c01806ae7e75640f97d76c9e79f64', class: "sd-date-picker-calendar__grid" }, this.cells.map(cell => {
7957
+ return (hAsync("div", { key: 'd23c08b38605dad1e5b3266a7e1ad72e0aeb7eb9', class: "sd-date-picker-calendar", style: cssVars }, hAsync("div", { key: '1c25bd19272e1e7f4e81601a0ffa13d7b882e4e4', class: "sd-date-picker-calendar__header" }, hAsync("div", { key: 'aed9a7ff3282d363c61b49dde6b6e9d6131a456c', class: "sd-date-picker-calendar__nav-group" }, hAsync("sd-ghost-button", { key: '68ae361b1cc4bfd9351b093aee6d4193f2ac5549', ariaLabel: "prevYear", size: "xxs", icon: "chevronLeft", onClick: this.goPrevYear }), hAsync("span", { key: 'e17d9a962faf96e8b70b0890e59e4c2e5ca515b0', class: "sd-date-picker-calendar__label" }, this.currentYear), hAsync("sd-ghost-button", { key: 'ab65ce4f9f64fcc9f4084c073a0a0625ceeb9f2d', ariaLabel: "nextYear", size: "xxs", icon: "chevronRight", onClick: this.goNextYear })), hAsync("span", { key: 'a01cb1691e9f112efdd6fd632c7594aa082d7f9f', class: "sd-date-picker-calendar__divider", "aria-hidden": "true" }), hAsync("div", { key: '577085a6007e5e2c6b291bbe0a27c0ff4ec4ca78', class: "sd-date-picker-calendar__nav-group sd-date-picker-calendar__nav-group-month" }, hAsync("sd-ghost-button", { key: 'c6b51b60d1bcc06e537800c10946ac49639fcb2c', ariaLabel: "prevMonth", size: "xxs", icon: "chevronLeft", onClick: this.goPrevMonth }), hAsync("span", { key: '836008030a0d66533ffba9392fee0234a9b0b425', class: "sd-date-picker-calendar__label sd-date-picker-calendar__label-month" }, this.currentMonth, "\uC6D4"), hAsync("sd-ghost-button", { key: 'a602cb65934157c171201f01699aacf1eeee8a57', ariaLabel: "nextMonth", size: "xxs", icon: "chevronRight", onClick: this.goNextMonth }))), hAsync("div", { key: '0c1a368d4e878b2942f2b37ddff47ac13262c580', class: "sd-date-picker-calendar__week" }, WEEK_LABELS.map(label => (hAsync("span", { key: label, class: "sd-date-picker-calendar__week-cell" }, label)))), hAsync("div", { key: '31cfa57cd8890a7cd70209c771598d6350009cc6', class: "sd-date-picker-calendar__grid" }, this.cells.map(cell => {
7627
7958
  const isSelected = cell.inCurrentMonth && !!this.value && this.value === cell.date;
7628
7959
  const isToday = cell.inCurrentMonth && today === cell.date;
7629
7960
  const isDisabled = cell.inCurrentMonth && this.isDisabled(cell.date);
@@ -7694,10 +8025,10 @@ class SdDatePickerTrigger {
7694
8025
  ? DATEPICKER_COLORS.icon.disabled
7695
8026
  : DATEPICKER_COLORS.icon.default,
7696
8027
  };
7697
- return (hAsync("div", { key: '5d8508069232bba144bfb9480b0befe420a3392b', class: {
8028
+ return (hAsync("div", { key: 'ebe886b3df3b50c53d31081f6ad7e251721b5cb1', class: {
7698
8029
  'sd-date-picker-trigger': true,
7699
8030
  'sd-date-picker-trigger--disabled': this.disabled,
7700
- }, style: cssVars, onClick: this.handleClick }, hAsync("sd-icon", { key: '71131e34dd1225e9633395041f7a768c020343bd', name: "date", size: Number(sizeTokens.iconSize), color: "var(--trigger-icon-color)", class: "sd-date-picker-trigger__icon" }), hAsync("span", { key: '192520646e181add5f87f6ce1d3a5caf8556b163', class: "sd-date-picker-trigger__text" }, hasValue ? this.displayText : this.placeholder)));
8031
+ }, style: cssVars, onClick: this.handleClick }, hAsync("sd-icon", { key: '563d3bb0221d5ba17788e1fa1e970fd2d702a4fd', name: "date", size: Number(sizeTokens.iconSize), color: "var(--trigger-icon-color)", class: "sd-date-picker-trigger__icon" }), hAsync("span", { key: '3bfc4c6671e70571a4b71a62cf0fd78f0297027f', class: "sd-date-picker-trigger__text" }, hasValue ? this.displayText : this.placeholder)));
7701
8032
  }
7702
8033
  static get style() { return sdDatePickerTriggerCss(); }
7703
8034
  static get cmpMeta() { return {
@@ -8116,7 +8447,7 @@ class SdDateRangePickerCalendar {
8116
8447
  '--range-panel-gap': `${RANGE_LAYOUT.panelGap}px`,
8117
8448
  '--range-divider': RANGE_LAYOUT.divider,
8118
8449
  };
8119
- return (hAsync(Fragment, { key: '99b9de5fce7e4d039b40ed95b3451c28e7799dc8' }, hAsync("div", { key: 'b55374e977f79e6dd7cd5d4af9df30bf41e40fba', class: "sd-date-range-picker-calendar", style: cssVars }, this.renderYearNav(), hAsync("div", { key: '6bd94cde83d82efc270148434dfb6410dc5f9634', class: "sd-date-range-picker-calendar__panels" }, this.renderPanel(this.currentYear, this.currentMonth, true), hAsync("span", { key: '9e179166ebad4cf295e831ef2e63fc9677f65b82', class: "sd-date-range-picker-calendar__divider", "aria-hidden": "true" }), this.renderPanel(this.rightYear, this.rightMonth, false)))));
8450
+ return (hAsync(Fragment, { key: '595c17bc338f96117d87c5ac3c2b26895b9e5283' }, hAsync("div", { key: '39ce76545cc612422ab5024a2838fbc9faabb9a8', class: "sd-date-range-picker-calendar", style: cssVars }, this.renderYearNav(), hAsync("div", { key: '21764e31a3fbcfa8de22d1f243f5739fc02c38fd', class: "sd-date-range-picker-calendar__panels" }, this.renderPanel(this.currentYear, this.currentMonth, true), hAsync("span", { key: '402ea75f3bf8b58d30c34238285eef7099118e28', class: "sd-date-range-picker-calendar__divider", "aria-hidden": "true" }), this.renderPanel(this.rightYear, this.rightMonth, false)))));
8120
8451
  }
8121
8452
  static get watchers() { return {
8122
8453
  "value": [{
@@ -8236,6 +8567,7 @@ const color = {
8236
8567
  accent: {
8237
8568
  "default": "#0075FF"}},
8238
8569
  content: {
8570
+ primary: "#222222",
8239
8571
  secondary: "#555555",
8240
8572
  inverse: "#FFFFFF"
8241
8573
  }};
@@ -8483,7 +8815,7 @@ class SdDropdownButton extends BaseDropdownEvent {
8483
8815
  }
8484
8816
  render() {
8485
8817
  const { config, preset } = this.resolvedConfig;
8486
- return (hAsync("div", { key: '1a6fa00329392de05526a50de55dcd620a43a2db', class: "sd-dropdown-button" }, hAsync("button", { key: 'd73139863c8decca29079a8111e26ea5a2d21614', type: "button", class: this.getTriggerClasses(preset, config.size, this.disabled, this.isOpen), disabled: this.disabled, "aria-haspopup": "menu", "aria-expanded": String(this.isOpen), onClick: this.toggleDropdown, ref: el => (this.triggerRef = el), style: {
8818
+ return (hAsync("div", { key: '5493b94262ecdd20a5fbb7ad2993dd473b1ae9e3', class: "sd-dropdown-button" }, hAsync("button", { key: 'a64187dec0d84dce3532f8b3d7112ed6d6ae8e0d', type: "button", class: this.getTriggerClasses(preset, config.size, this.disabled, this.isOpen), disabled: this.disabled, "aria-haspopup": "menu", "aria-expanded": String(this.isOpen), onClick: this.toggleDropdown, ref: el => (this.triggerRef = el), style: {
8487
8819
  '--sd-dropdown-button-bg': config.color,
8488
8820
  '--sd-dropdown-button-bg-hover': PRESET_HOVER_BACKGROUNDS[preset],
8489
8821
  '--sd-dropdown-button-border': PRESET_BORDER_COLORS[preset],
@@ -8493,10 +8825,10 @@ class SdDropdownButton extends BaseDropdownEvent {
8493
8825
  '--sd-dropdown-button-disabled-bg': DROPDOWN_DISABLED_BACKGROUND,
8494
8826
  '--sd-dropdown-button-disabled-content': DROPDOWN_DISABLED_TEXT,
8495
8827
  '--sd-dropdown-button-disabled-border': DROPDOWN_DISABLED_BORDER,
8496
- } }, hAsync("span", { key: '52e30c7d5f55b2ed974944b23880a42fdf941e31', class: "sd-dropdown-button__trigger-label" }, this.label), hAsync("span", { key: '8d693a472783e552613b0c0503b85dc9b5ce0343', class: "sd-dropdown-button__trigger-divider", "aria-hidden": "true" }), hAsync("span", { key: 'e9f0fc3980400150c8808e569904bee6c4629dc7', class: {
8828
+ } }, hAsync("span", { key: '71ed27650dcb1beb1cfa4864a6449ab190f04829', class: "sd-dropdown-button__trigger-label" }, this.label), hAsync("span", { key: '6c34575c0587fb288165cf0e15db52ed6b3f50db', class: "sd-dropdown-button__trigger-divider", "aria-hidden": "true" }), hAsync("span", { key: '0544b9d36657a80b5f51b9c1849d55ab7a7dbdc2', class: {
8497
8829
  'sd-dropdown-button__trigger-icon': true,
8498
8830
  'sd-dropdown-button__trigger-icon--open': this.isOpen,
8499
- }, "aria-hidden": "true" }, hAsync("sd-icon", { key: '13fda88989885a9096ed6ecf211b3aadad3f128a', name: "chevronDown", size: DROPDOWN_CHEVRON_ICON_SIZE[config.size], color: "var(--sd-dropdown-button-current-content)" }))), this.renderDropdown(preset)));
8831
+ }, "aria-hidden": "true" }, hAsync("sd-icon", { key: 'cd73a4dffbe1fc31c76fea221cd080b455bb3131', name: "chevronDown", size: DROPDOWN_CHEVRON_ICON_SIZE[config.size], color: "var(--sd-dropdown-button-current-content)" }))), this.renderDropdown(preset)));
8500
8832
  }
8501
8833
  static get watchers() { return {
8502
8834
  "isOpen": [{
@@ -8542,8 +8874,9 @@ const field = {
8542
8874
  icon: "16",
8543
8875
  typography: {
8544
8876
  fontWeight: "700",
8545
- fontSize: "16",
8546
- lineHeight: "26"}
8877
+ fontSize: "14",
8878
+ lineHeight: "24"
8879
+ }
8547
8880
  }
8548
8881
  },
8549
8882
  addonLabel: {
@@ -8754,20 +9087,20 @@ class SdField {
8754
9087
  '--sd-field-addon-border-width': `${addonTokens.border.width}px`,
8755
9088
  }
8756
9089
  : {};
8757
- return (hAsync("div", { key: 'f12b2e13ac8152d1e688f903a60a8fa670e99065', class: {
9090
+ return (hAsync("div", { key: 'af5531a8bad5b8685f56748ce55044927f061903', class: {
8758
9091
  'sd-field': true,
8759
9092
  'sd-field--has-label': !!this.label,
8760
9093
  'sd-field--has-addon': !!addon,
8761
9094
  [this.fieldStatus]: !!this.fieldStatus,
8762
- }, style: { ...sizeCssVars, ...labelCssVars, ...addonCssVars } }, hAsync("div", { key: '79f7a40b5e1ee95bb9075b0855e22261cd8adc6a', class: "sd-field__wrapper" }, this.renderLabel(this.label), hAsync("div", { key: '54b5bbfbe18df48c40cc30ec3d6761ccd8e446cc', class: "sd-field__main", style: this.width
9095
+ }, style: { ...sizeCssVars, ...labelCssVars, ...addonCssVars } }, hAsync("div", { key: '82f2472c0ccc778a982bbf6164edfdc1629a9eb1', class: "sd-field__wrapper" }, this.renderLabel(this.label), hAsync("div", { key: '42dd86d80718b245402b42376d28810745cf2154', class: "sd-field__main", style: this.width
8763
9096
  ? {
8764
9097
  width: typeof this.width === 'number' ? `${this.width}px` : this.width,
8765
9098
  flex: 'none',
8766
9099
  }
8767
- : {} }, hAsync("div", { key: '39542908287175ade4d6e0f1acd2cb1f03c9e2a1', class: {
9100
+ : {} }, hAsync("div", { key: '0c80a69019f7b14c5f19eeb21f751c885df4c82b', class: {
8768
9101
  'sd-field__control': true,
8769
9102
  'sd-field__control--has-addon': !!addon,
8770
- } }, addon && hAsync("div", { key: '236650de53d1d1951f26586aa0d22f0f267fc411', class: "sd-field__addon" }, addon), hAsync("slot", { key: '41df3dca21aa68d3324617891f2555f1c488a61b' })), this.errorMsg || this.errorMessage ? (hAsync("div", { class: "sd-field__error-message" }, this.errorMsg || this.errorMessage)) : (this.hint && hAsync("div", { class: "sd-field__hint" }, this.hint))))));
9103
+ } }, addon && hAsync("div", { key: 'c3b9fac0b4586ba5697af8a7cfe7a6aec01b0e52', class: "sd-field__addon" }, addon), hAsync("slot", { key: 'f7e087e3b3927708fd28919dba9e6edf4e1d317b' })), this.errorMsg || this.errorMessage ? (hAsync("div", { class: "sd-field__error-message" }, this.errorMsg || this.errorMessage)) : (this.hint && hAsync("div", { class: "sd-field__hint" }, this.hint))))));
8771
9104
  }
8772
9105
  renderLabel(label) {
8773
9106
  if (!label)
@@ -8851,7 +9184,7 @@ const FILE_PICKER_COLORS = {
8851
9184
  },
8852
9185
  };
8853
9186
 
8854
- const sdFilePickerCss = () => `sd-file-picker{display:inline-flex;width:100%}.sd-file-picker__content{width:100%;height:100%;display:flex;align-items:center;padding:0 var(--sd-file-picker-padding-x);gap:var(--sd-file-picker-gap);cursor:pointer;-webkit-user-select:none;user-select:none;position:relative;vertical-align:middle}.sd-file-picker__text{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:var(--sd-file-picker-font-weight);font-size:var(--sd-file-picker-font-size);line-height:var(--sd-file-picker-line-height);color:var(--sd-file-picker-placeholder-color)}.sd-file-picker__text--active{color:var(--sd-file-picker-text-color)}.sd-file-picker__text--placeholder{color:var(--sd-file-picker-placeholder-color)}.sd-file-picker__icon{flex-shrink:0}.sd-file-picker__clear-icon{flex-shrink:0;cursor:pointer;transition:opacity 0.2s ease}.sd-file-picker__clear-icon:hover{opacity:0.7}.sd-file-picker__input{display:none}.sd-file-picker__tooltip{position:absolute;top:calc(100% - 4px);left:50%;transform:translate(-50%);z-index:1000;white-space:nowrap;padding:8px 12px;background:rgba(0, 0, 0, 0.8);color:white;font-size:12px;line-height:18px;border-radius:4px;pointer-events:none}.sd-field--disabled .sd-file-picker__content{cursor:not-allowed}.sd-field--disabled .sd-file-picker__text{color:var(--sd-file-picker-disabled-color)}.sd-file-picker--inline .sd-file-picker__content{border:none;background-color:transparent;padding:0;height:auto}.sd-file-picker--inline .sd-file-picker__text{color:var(--sd-file-picker-placeholder-color)}.sd-file-picker--inline:hover:not(.sd-file-picker--inline-disabled) .sd-file-picker__text{color:var(--sd-file-picker-text-color)}.sd-file-picker--inline .sd-file-picker__text--active{color:var(--sd-file-picker-text-color)}.sd-file-picker--inline.sd-file-picker--inline-disabled .sd-file-picker__content{cursor:not-allowed}.sd-file-picker--inline.sd-file-picker--inline-disabled .sd-file-picker__text{color:var(--sd-file-picker-disabled-color)}`;
9187
+ const sdFilePickerCss = () => `sd-file-picker{display:inline-flex;width:100%}.sd-file-picker__content{width:100%;height:100%;display:flex;align-items:center;padding:0 var(--sd-file-picker-padding-x);gap:var(--sd-file-picker-gap);cursor:pointer;-webkit-user-select:none;user-select:none;position:relative;vertical-align:middle}.sd-file-picker__text{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:var(--sd-file-picker-font-weight);font-size:var(--sd-file-picker-font-size);line-height:var(--sd-file-picker-line-height);color:var(--sd-file-picker-placeholder-color)}.sd-file-picker__text--active{color:var(--sd-file-picker-text-color)}.sd-file-picker__text--placeholder{color:var(--sd-file-picker-placeholder-color)}.sd-file-picker__icon{flex-shrink:0}.sd-file-picker__clear-icon{flex-shrink:0;cursor:pointer;transition:opacity 0.2s ease}.sd-file-picker__clear-icon:hover{opacity:0.7}.sd-file-picker__input{display:none}.sd-file-picker__tooltip{position:absolute;top:calc(100% - 4px);left:50%;transform:translate(-50%);z-index:998;white-space:nowrap;padding:8px 12px;background:rgba(0, 0, 0, 0.8);color:white;font-size:12px;line-height:18px;border-radius:4px;pointer-events:none}.sd-field--disabled .sd-file-picker__content{cursor:not-allowed}.sd-field--disabled .sd-file-picker__text{color:var(--sd-file-picker-disabled-color)}.sd-file-picker--inline .sd-file-picker__content{border:none;background-color:transparent;padding:0;height:auto}.sd-file-picker--inline .sd-file-picker__text{color:var(--sd-file-picker-placeholder-color)}.sd-file-picker--inline:hover:not(.sd-file-picker--inline-disabled) .sd-file-picker__text{color:var(--sd-file-picker-text-color)}.sd-file-picker--inline .sd-file-picker__text--active{color:var(--sd-file-picker-text-color)}.sd-file-picker--inline.sd-file-picker--inline-disabled .sd-file-picker__content{cursor:not-allowed}.sd-file-picker--inline.sd-file-picker--inline-disabled .sd-file-picker__text{color:var(--sd-file-picker-disabled-color)}`;
8855
9188
 
8856
9189
  class SdFilePicker {
8857
9190
  constructor(hostRef) {
@@ -9028,7 +9361,7 @@ class SdFilePicker {
9028
9361
  'sd-file-picker__text': true,
9029
9362
  'sd-file-picker__text--placeholder': !hasFiles,
9030
9363
  'sd-file-picker__text--active': hasFiles,
9031
- } }, displayText), !this.disabled && hasFiles && (hAsync("sd-ghost-button", { icon: "close", size: "xxs", disabled: this.disabled, class: "sd-file-picker__clear-icon", onClick: this.handleClear })), this.showTooltip && hasFiles && this.hovered && (hAsync("div", { class: "sd-file-picker__tooltip" }, displayText))));
9364
+ } }, displayText), !this.disabled && hasFiles && (hAsync("sd-ghost-button", { icon: "close", size: "xxs", ariaLabel: "clear", disabled: this.disabled, class: "sd-file-picker__clear-icon", onClick: this.handleClear })), this.showTooltip && hasFiles && this.hovered && (hAsync("div", { class: "sd-file-picker__tooltip" }, displayText))));
9032
9365
  if (this.inline) {
9033
9366
  return (hAsync("div", { class: {
9034
9367
  'sd-file-picker--inline': true,
@@ -9094,7 +9427,7 @@ class SdFloatingPopover {
9094
9427
  to = 'body';
9095
9428
  parentRef = null;
9096
9429
  offset = [0, 0];
9097
- zIndex = 10000;
9430
+ zIndex = 998;
9098
9431
  placement = 'bottom';
9099
9432
  open = false;
9100
9433
  close;
@@ -9152,7 +9485,7 @@ class SdFloatingPopover {
9152
9485
  this.wrapper = document.createElement('div');
9153
9486
  Object.assign(this.wrapper.style, {
9154
9487
  position: 'absolute',
9155
- zIndex: (this.zIndex ?? 10000).toString(),
9488
+ zIndex: (this.zIndex ?? 998).toString(),
9156
9489
  transition: 'opacity 0.4s',
9157
9490
  top: '-9999px',
9158
9491
  left: '-9999px',
@@ -9182,18 +9515,22 @@ class SdFloatingPopover {
9182
9515
  switch (this.placement) {
9183
9516
  case 'top':
9184
9517
  top = rect.top + window.scrollY - this.wrapper.offsetHeight + offsetY - ARROW_SIZE;
9185
- left = rect.left + window.scrollX + rect.width / 2 - this.wrapper.offsetWidth / 2 + offsetX;
9518
+ left =
9519
+ rect.left + window.scrollX + rect.width / 2 - this.wrapper.offsetWidth / 2 + offsetX;
9186
9520
  break;
9187
9521
  case 'bottom':
9188
9522
  top = rect.bottom + window.scrollY + offsetY + ARROW_SIZE;
9189
- left = rect.left + window.scrollX + rect.width / 2 - this.wrapper.offsetWidth / 2 + offsetX;
9523
+ left =
9524
+ rect.left + window.scrollX + rect.width / 2 - this.wrapper.offsetWidth / 2 + offsetX;
9190
9525
  break;
9191
9526
  case 'left':
9192
- top = rect.top + window.scrollY + rect.height / 2 - this.wrapper.offsetHeight / 2 + offsetY;
9527
+ top =
9528
+ rect.top + window.scrollY + rect.height / 2 - this.wrapper.offsetHeight / 2 + offsetY;
9193
9529
  left = rect.left + window.scrollX - this.wrapper.offsetWidth - offsetX - ARROW_SIZE;
9194
9530
  break;
9195
9531
  case 'right':
9196
- top = rect.top + window.scrollY + rect.height / 2 - this.wrapper.offsetHeight / 2 + offsetY;
9532
+ top =
9533
+ rect.top + window.scrollY + rect.height / 2 - this.wrapper.offsetHeight / 2 + offsetY;
9197
9534
  left = rect.right + window.scrollX + offsetX + ARROW_SIZE;
9198
9535
  break;
9199
9536
  }
@@ -9234,7 +9571,7 @@ class SdFloatingPopover {
9234
9571
  this.close.emit();
9235
9572
  }
9236
9573
  render() {
9237
- return hAsync("slot", { key: '4dafb853b2a82e541f59056d2fedf08a6fa040ba' });
9574
+ return hAsync("slot", { key: 'f463fadca5060ebc995d8115575404611b94fb11' });
9238
9575
  }
9239
9576
  static get style() { return sdFloatingPortalCss(); }
9240
9577
  static get cmpMeta() { return {
@@ -9488,19 +9825,19 @@ class SdGhostButton {
9488
9825
  render() {
9489
9826
  const sizeConfig = GHOST_BUTTON_SIZES[this.size];
9490
9827
  const contentColor = this.disabled
9491
- ? GHOST_BUTTON_DISABLED_COLORS[this.intent]
9492
- : GHOST_BUTTON_CONTENT_COLORS[this.intent];
9828
+ ? GHOST_BUTTON_DISABLED_COLORS[this.intent ?? 'default']
9829
+ : GHOST_BUTTON_CONTENT_COLORS[this.intent ?? 'default'];
9493
9830
  const accessibleName = this.ariaLabel.trim() || undefined;
9494
- return (hAsync("button", { key: 'eccb34969779d75bcd77dd6ae12cb99a419af121', class: {
9831
+ return (hAsync("button", { key: '690151271d15b4a3e07b47021f368647cc9daf62', class: {
9495
9832
  'sd-ghost-button': true,
9496
9833
  'sd-ghost-button--disabled': this.disabled,
9497
9834
  }, type: "button", disabled: this.disabled, "aria-label": accessibleName, style: {
9498
9835
  '--sd-ghost-button-size': `${sizeConfig.size}px`,
9499
9836
  '--sd-ghost-button-radius': `${GHOST_BUTTON_RADIUS[this.size]}px`,
9500
- '--sd-ghost-button-hover-bg': GHOST_BUTTON_HOVER_BG_COLORS[this.intent],
9837
+ '--sd-ghost-button-hover-bg': GHOST_BUTTON_HOVER_BG_COLORS[this.intent ?? 'default'],
9501
9838
  '--sd-ghost-button-hover-opacity': GHOST_BUTTON_HOVER_OPACITY,
9502
9839
  '--sd-ghost-button-accent': GHOST_BUTTON_FOCUS_RING_COLOR,
9503
- }, onClick: this.handleClick }, hAsync("sd-icon", { key: '4ae160e73b72b0b4aa40947c126419b1016c81d3', name: this.icon, size: sizeConfig.icon, color: contentColor })));
9840
+ }, onClick: this.handleClick }, hAsync("sd-icon", { key: '9769fff9f694e7d1fa2cba94fa8e80498d0afe2e', name: this.icon, size: sizeConfig.icon, color: contentColor })));
9504
9841
  }
9505
9842
  static get style() { return sdGhostButtonCss(); }
9506
9843
  static get cmpMeta() { return {
@@ -9519,62 +9856,194 @@ class SdGhostButton {
9519
9856
  }; }
9520
9857
  }
9521
9858
 
9522
- const sdGuideCss = () => `@charset "UTF-8";sd-button{display:inline-flex;width:fit-content;height:fit-content}.sd-button{--sd-button-height:34px;--sd-button-padding-x:20px;--sd-button-gap:8px;--sd-button-font-family:inherit;--sd-button-font-size:16px;--sd-button-font-weight:500;--sd-button-text-decoration:none;--sd-button-label-min-width:auto;--sd-button-icon-only-size:var(--sd-button-height);text-decoration:none;cursor:pointer;border-radius:var(--sd-button-button-radius-sm, 4px);transition:all 0.2s ease-in-out;position:relative;overflow:hidden;white-space:nowrap;-webkit-user-select:none;user-select:none;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;border:none;padding:0 var(--sd-button-padding-x);min-width:var(--sd-button-min-width, auto);min-height:var(--sd-button-height);font-family:var(--sd-button-font-family);font-size:var(--sd-button-font-size);font-weight:var(--sd-button-font-weight);text-decoration:var(--sd-button-text-decoration)}.sd-button--xs{--sd-button-height:var(--sd-button-button-xs-height, 24px);--sd-button-padding-x:var(--sd-button-button-xs-padding-x, 8px);--sd-button-gap:var(--sd-button-button-xs-gap, 4px);--sd-button-font-family:var(--sd-button-button-xs-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-button-xs-typography-font-size, 12px);--sd-button-font-weight:var(--sd-button-button-xs-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-button-xs-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-xs-min-width, auto);--sd-button-icon-only-size:var(--sd-button-button-icon-only-xs-width, var(--sd-button-height));line-height:20px}.sd-button--sm{--sd-button-height:var(--sd-button-button-sm-height, 28px);--sd-button-padding-x:var(--sd-button-button-sm-padding-x, 12px);--sd-button-gap:var(--sd-button-button-sm-gap, 6px);--sd-button-font-family:var(--sd-button-button-sm-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-button-sm-typography-font-size, 12px);--sd-button-font-weight:var(--sd-button-button-sm-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-button-sm-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-sm-min-width, auto);--sd-button-icon-only-size:var(--sd-button-button-icon-only-sm-width, var(--sd-button-height));line-height:20px}.sd-button--md{--sd-button-height:var(--sd-button-button-md-height, 34px);--sd-button-padding-x:var(--sd-button-button-md-padding-x, 20px);--sd-button-gap:var(--sd-button-button-md-gap, 8px);--sd-button-font-family:var(--sd-button-button-md-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-button-md-typography-font-size, 16px);--sd-button-font-weight:var(--sd-button-button-md-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-button-md-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-md-min-width, auto);--sd-button-icon-only-size:var(--sd-button-button-icon-only-md-width, var(--sd-button-height));line-height:26px}.sd-button--lg{--sd-button-height:var(--sd-button-button-lg-height, 62px);--sd-button-padding-x:var(--sd-button-button-lg-padding-x, 28px);--sd-button-gap:var(--sd-button-button-lg-gap, 12px);--sd-button-font-family:var(--sd-button-button-lg-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-button-lg-typography-font-size, 18px);--sd-button-font-weight:var(--sd-button-button-lg-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-button-lg-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-lg-min-width, auto);--sd-button-icon-only-size:var(--sd-button-button-icon-only-lg-width, var(--sd-button-height));line-height:30px}.sd-button--has-label{--sd-button-min-width:var(--sd-button-label-min-width, auto)}.sd-button--primary{background-color:var(--button-color);color:white;transition:filter 0.2s ease}.sd-button--primary::before{content:"";position:absolute;inset:0;background:#000000;opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--primary:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.25}.sd-button--outline{background:white;border:var(--sd-button-button-border-width-default, 1px) solid var(--button-color);color:var(--button-color)}.sd-button--outline::before{content:"";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--outline:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--outline .sd-button__content{position:relative;z-index:1}.sd-button--ghost{background-color:transparent;color:var(--button-color);border-color:transparent}.sd-button--ghost::before{content:"";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--ghost:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--ghost .sd-button__content{position:relative;z-index:1}.sd-button--disabled{border:var(--sd-button-button-border-width-default, 1px) solid var(--sd-button-button-border-disabled, #CCCCCC);background:var(--sd-button-button-bg-disabled, #E1E1E1);color:var(--sd-button-button-text-disabled, #888888);cursor:not-allowed !important}.sd-button--icon-only{padding:0;width:var(--sd-button-icon-only-size, var(--sd-button-height));min-width:var(--sd-button-icon-only-size, var(--sd-button-height));height:var(--sd-button-icon-only-size, var(--sd-button-height))}.sd-button--no-hover:hover::before{opacity:0 !important}.sd-button .sd-button__content{display:inline-flex;align-items:center;justify-content:center;gap:var(--sd-button-gap);z-index:1;font-weight:inherit}sd-guide{display:inline-flex;align-items:center;height:fit-content;width:fit-content}sd-guide .sd-guide{display:inline-flex;align-items:center;height:fit-content;width:fit-content}sd-guide .sd-guide .sd-button{padding:0 16px 0 12px;border-radius:16px;color:#333333 !important;display:flex;align-items:center;transition:none}sd-guide .sd-guide .sd-button .sd-button__content{color:#333333 !important}sd-guide .sd-guide .sd-button .sd-button__content .sd-button__label{color:#333333 !important;margin-left:4px}sd-guide .sd-guide--active .sd-button{border:1px solid #00973C}sd-guide .sd-guide--active .sd-button .sd-button__content .sd-button__label{color:white !important}.sd-guide__popup{position:relative;padding:20px 32px;border-radius:8px;box-shadow:4px 4px 24px 4px rgba(0, 0, 0, 0.1);background:white}.sd-guide__popup>.sd-guide__popup__close{position:absolute;top:12px;right:12px}.sd-guide__popup__header{display:flex;align-items:center;gap:8px;margin-bottom:12px}.sd-guide__popup__header .sd-guide__popup__title{margin-top:0;font-size:16px;font-weight:700;line-height:26px;color:#333333}.sd-guide__popup__list{width:100%;padding:0;margin:0}.sd-guide__popup__list__item{display:flex;width:100%;align-items:start;list-style:none;color:#333333;font-size:12px;font-weight:400}.sd-guide__popup__list__item p{width:100%;padding:0;margin:0;word-wrap:break-word;word-break:break-word;white-space:normal;overflow-wrap:break-word;min-width:0}.sd-guide__popup__list__item::before{display:block;content:"-";width:6px;color:#333333;font-size:12px;font-weight:400;margin-left:10px;margin-right:12px;flex-shrink:0}.sd-guide__popup__list__item--depth-2::before{content:"•"}.sd-guide__popup__list__item--depth-2{padding-left:26px}`;
9859
+ const guide = {
9860
+ button: {
9861
+ height: "28",
9862
+ paddingX: "12",
9863
+ radius: "9999",
9864
+ gap: "6",
9865
+ typography: {
9866
+ fontSize: "12",
9867
+ fontWeight: "500",
9868
+ lineHeight: "20"
9869
+ },
9870
+ icon: {
9871
+ size: "16",
9872
+ "default": "#00973C",
9873
+ active: "#FFFFFF"
9874
+ },
9875
+ border: {
9876
+ width: "1",
9877
+ "default": "#E1E1E1"
9878
+ },
9879
+ bg: {
9880
+ "default": "#FFFFFF",
9881
+ tip: "#00973C",
9882
+ notion: "#1F8AE1"
9883
+ },
9884
+ text: {
9885
+ "default": "#222222",
9886
+ active: "#FFFFFF"
9887
+ }
9888
+ },
9889
+ contents: {
9890
+ paddingX: "24",
9891
+ paddingY: "20",
9892
+ gap: "12",
9893
+ title: {
9894
+ gap: "8"
9895
+ },
9896
+ row: {
9897
+ gap: "8"
9898
+ },
9899
+ body: {
9900
+ gap: "2"
9901
+ },
9902
+ typography: {
9903
+ title: {
9904
+ fontWeight: "700",
9905
+ fontSize: "16",
9906
+ lineHeight: "26"
9907
+ },
9908
+ body: {
9909
+ fontWeight: "400",
9910
+ fontSize: "12",
9911
+ lineHeight: "20"},
9912
+ color: "#222222"
9913
+ },
9914
+ icon: "#00973C",
9915
+ radius: "8"}
9916
+ };
9917
+ var guideTokens = {
9918
+ guide: guide
9919
+ };
9920
+
9921
+ const { button, contents} = guideTokens.guide;
9922
+ const NOTION_ICON_COLOR = systemTokens.color.content.primary;
9923
+ const GUIDE_CONFIG = {
9924
+ button: {
9925
+ height: `${button.height}px`,
9926
+ paddingX: `${button.paddingX}px`,
9927
+ radius: `${button.radius}px`,
9928
+ gap: `${button.gap}px`,
9929
+ fontSize: `${button.typography.fontSize}px`,
9930
+ fontWeight: button.typography.fontWeight,
9931
+ lineHeight: `${button.typography.lineHeight}px`,
9932
+ iconSize: Number(button.icon.size),
9933
+ iconColorDefault: button.icon.default,
9934
+ iconColorActive: button.icon.active,
9935
+ iconColorNotion: NOTION_ICON_COLOR,
9936
+ borderWidth: `${button.border.width}px`,
9937
+ borderColor: button.border.default,
9938
+ bgDefault: button.bg.default,
9939
+ bgTip: button.bg.tip,
9940
+ bgNotion: button.bg.notion,
9941
+ textDefault: button.text.default,
9942
+ textActive: button.text.active,
9943
+ },
9944
+ contents: {
9945
+ paddingX: `${contents.paddingX}px`,
9946
+ paddingY: `${contents.paddingY}px`,
9947
+ gap: `${contents.gap}px`,
9948
+ rowGap: `${contents.row.gap}px`,
9949
+ bodyGap: `${contents.body.gap}px`,
9950
+ titleGap: `${contents.title.gap}px`,
9951
+ radius: `${contents.radius}px`,
9952
+ iconColor: contents.icon,
9953
+ iconColorNotion: NOTION_ICON_COLOR,
9954
+ titleFontSize: `${contents.typography.title.fontSize}px`,
9955
+ titleFontWeight: contents.typography.title.fontWeight,
9956
+ titleLineHeight: `${contents.typography.title.lineHeight}px`,
9957
+ bodyFontSize: `${contents.typography.body.fontSize}px`,
9958
+ bodyFontWeight: contents.typography.body.fontWeight,
9959
+ bodyLineHeight: `${contents.typography.body.lineHeight}px`,
9960
+ textColor: contents.typography.color,
9961
+ },
9962
+ };
9523
9963
 
9524
- const GUIDE_LABEL = {
9525
- help: '활용 TIP',
9526
- pdf: 'PDF Guide',
9527
- youtube: 'Video Guide',
9964
+ const sdGuideCss = () => `@charset "UTF-8";sd-button{display:inline-flex;width:fit-content;height:fit-content}.sd-button{--sd-button-height:34px;--sd-button-padding-x:20px;--sd-button-gap:8px;--sd-button-font-family:inherit;--sd-button-font-size:16px;--sd-button-font-weight:500;--sd-button-text-decoration:none;--sd-button-label-min-width:auto;--sd-button-icon-only-size:var(--sd-button-height);text-decoration:none;cursor:pointer;border-radius:var(--sd-button-button-radius-sm, 4px);transition:all 0.2s ease-in-out;position:relative;overflow:hidden;white-space:nowrap;-webkit-user-select:none;user-select:none;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;border:none;padding:0 var(--sd-button-padding-x);min-width:var(--sd-button-min-width, auto);min-height:var(--sd-button-height);font-family:var(--sd-button-font-family);font-size:var(--sd-button-font-size);font-weight:var(--sd-button-font-weight);text-decoration:var(--sd-button-text-decoration)}.sd-button--xs{--sd-button-height:var(--sd-button-button-xs-height, 24px);--sd-button-padding-x:var(--sd-button-button-xs-padding-x, 8px);--sd-button-gap:var(--sd-button-button-xs-gap, 4px);--sd-button-font-family:var(--sd-button-button-xs-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-button-xs-typography-font-size, 12px);--sd-button-font-weight:var(--sd-button-button-xs-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-button-xs-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-xs-min-width, auto);--sd-button-icon-only-size:var(--sd-button-button-icon-only-xs-width, var(--sd-button-height));line-height:20px}.sd-button--sm{--sd-button-height:var(--sd-button-button-sm-height, 28px);--sd-button-padding-x:var(--sd-button-button-sm-padding-x, 12px);--sd-button-gap:var(--sd-button-button-sm-gap, 6px);--sd-button-font-family:var(--sd-button-button-sm-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-button-sm-typography-font-size, 12px);--sd-button-font-weight:var(--sd-button-button-sm-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-button-sm-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-sm-min-width, auto);--sd-button-icon-only-size:var(--sd-button-button-icon-only-sm-width, var(--sd-button-height));line-height:20px}.sd-button--md{--sd-button-height:var(--sd-button-button-md-height, 34px);--sd-button-padding-x:var(--sd-button-button-md-padding-x, 20px);--sd-button-gap:var(--sd-button-button-md-gap, 8px);--sd-button-font-family:var(--sd-button-button-md-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-button-md-typography-font-size, 16px);--sd-button-font-weight:var(--sd-button-button-md-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-button-md-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-md-min-width, auto);--sd-button-icon-only-size:var(--sd-button-button-icon-only-md-width, var(--sd-button-height));line-height:26px}.sd-button--lg{--sd-button-height:var(--sd-button-button-lg-height, 62px);--sd-button-padding-x:var(--sd-button-button-lg-padding-x, 28px);--sd-button-gap:var(--sd-button-button-lg-gap, 12px);--sd-button-font-family:var(--sd-button-button-lg-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-button-lg-typography-font-size, 18px);--sd-button-font-weight:var(--sd-button-button-lg-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-button-lg-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-lg-min-width, auto);--sd-button-icon-only-size:var(--sd-button-button-icon-only-lg-width, var(--sd-button-height));line-height:30px}.sd-button--has-label{--sd-button-min-width:var(--sd-button-label-min-width, auto)}.sd-button--primary{background-color:var(--button-color);color:white;transition:filter 0.2s ease}.sd-button--primary::before{content:"";position:absolute;inset:0;background:#000000;opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--primary:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.25}.sd-button--outline{background:white;border:var(--sd-button-button-border-width-default, 1px) solid var(--button-color);color:var(--button-color)}.sd-button--outline::before{content:"";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--outline:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--outline .sd-button__content{position:relative;z-index:1}.sd-button--ghost{background-color:transparent;color:var(--button-color);border-color:transparent}.sd-button--ghost::before{content:"";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--ghost:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--ghost .sd-button__content{position:relative;z-index:1}.sd-button--disabled{border:var(--sd-button-button-border-width-default, 1px) solid var(--sd-button-button-border-disabled, #CCCCCC);background:var(--sd-button-button-bg-disabled, #E1E1E1);color:var(--sd-button-button-text-disabled, #888888);cursor:not-allowed !important}.sd-button--icon-only{padding:0;width:var(--sd-button-icon-only-size, var(--sd-button-height));min-width:var(--sd-button-icon-only-size, var(--sd-button-height));height:var(--sd-button-icon-only-size, var(--sd-button-height))}.sd-button--no-hover:hover::before{opacity:0 !important}.sd-button .sd-button__content{display:inline-flex;align-items:center;justify-content:center;gap:var(--sd-button-gap);z-index:1;font-weight:inherit}sd-guide{display:inline-flex;align-items:center;height:fit-content;width:fit-content}.sd-guide{display:inline-flex;align-items:center;height:fit-content;width:fit-content}.sd-guide .sd-guide__button .sd-button{min-height:var(--sd-guide-button-height);padding:0 var(--sd-guide-button-padding-x);border-radius:var(--sd-guide-button-radius);border:var(--sd-guide-button-border-width) solid var(--sd-guide-button-border-color);background:var(--sd-guide-button-bg-default);color:var(--sd-guide-button-text-default) !important;transition:none;display:flex;align-items:center;gap:var(--sd-guide-button-gap)}.sd-guide .sd-guide__button .sd-button .sd-button__content{color:var(--sd-guide-button-text-default) !important;gap:var(--sd-guide-button-gap)}.sd-guide .sd-guide__button .sd-button .sd-button__content .sd-button__label{margin-left:0;color:var(--sd-guide-button-text-default) !important;font-size:var(--sd-guide-button-font-size);font-weight:var(--sd-guide-button-font-weight);line-height:var(--sd-guide-button-line-height)}.sd-guide .sd-guide__button--active .sd-button{color:var(--sd-guide-button-text-active) !important}.sd-guide .sd-guide__button--active .sd-button .sd-button__content{color:var(--sd-guide-button-text-active) !important}.sd-guide .sd-guide__button--active .sd-button .sd-button__content .sd-button__label{color:var(--sd-guide-button-text-active) !important}.sd-guide .sd-guide__button--type-tip.sd-guide__button--active .sd-button{background:var(--sd-guide-button-bg-tip);border-color:var(--sd-guide-button-bg-tip)}.sd-guide .sd-guide__button--type-notion.sd-guide__button--active .sd-button{background:var(--sd-guide-button-bg-notion);border-color:var(--sd-guide-button-bg-notion)}.sd-guide__popup{position:relative;padding:var(--sd-guide-contents-padding-y) var(--sd-guide-contents-padding-x);border-radius:var(--sd-guide-contents-radius);box-shadow:4px 4px 24px 4px rgba(0, 0, 0, 0.1);background:white}.sd-guide__popup>.sd-guide__popup__close{position:absolute;top:12px;right:12px}.sd-guide__popup__header{display:flex;align-items:center;gap:var(--sd-guide-contents-title-gap);margin-bottom:var(--sd-guide-contents-gap)}.sd-guide__popup__header .sd-guide__popup__title{margin-top:0;margin-bottom:0;font-size:var(--sd-guide-contents-title-font-size);font-weight:var(--sd-guide-contents-title-font-weight);line-height:var(--sd-guide-contents-title-line-height);color:var(--sd-guide-contents-text-color)}.sd-guide__popup__list{width:100%;padding:0;margin:0}.sd-guide__popup__list__item{display:flex;width:100%;align-items:start;list-style:none;color:var(--sd-guide-contents-text-color);font-size:var(--sd-guide-contents-body-font-size);font-weight:var(--sd-guide-contents-body-font-weight);line-height:var(--sd-guide-contents-body-line-height)}.sd-guide__popup__list__item p{width:100%;padding:0;margin:0;word-wrap:break-word;word-break:break-word;white-space:normal;overflow-wrap:break-word;min-width:0}.sd-guide__popup__list__item::before{display:block;content:"-";width:6px;color:var(--sd-guide-contents-text-color);font-size:var(--sd-guide-contents-body-font-size);font-weight:var(--sd-guide-contents-body-font-weight);line-height:var(--sd-guide-contents-body-line-height);margin-left:10px;margin-right:12px;flex-shrink:0}.sd-guide__popup__list__item--depth-1:not(:first-child){margin-top:var(--sd-guide-contents-row-gap)}.sd-guide__popup__list__item--depth-2{margin-top:var(--sd-guide-contents-body-gap)}.sd-guide__popup__list__item--depth-2::before{content:"•"}.sd-guide__popup__list__item--depth-2{padding-left:26px}`;
9965
+
9966
+ const DEFAULT_LABEL_BY_TYPE = {
9967
+ tip: '활용 TIP',
9528
9968
  notion: '사용법 안내',
9529
- event: 'Event Button',
9530
9969
  };
9531
- const GUIDE_ICON = {
9532
- help: {
9533
- name: 'helpOutline',
9534
- size: 20,
9535
- color: 'green_75',
9536
- },
9537
- pdf: { name: 'pdf', size: 20, color: 'red_75' },
9538
- youtube: { name: 'youtube', size: 20, color: 'red_75' },
9539
- notion: { name: 'notion', size: 16, color: 'black' },
9540
- event: { name: 'event', size: 16, color: 'brilliantblue_70' },
9970
+ const ICON_BY_TYPE = {
9971
+ tip: 'helpOutline',
9972
+ notion: 'notion',
9541
9973
  };
9542
9974
  class SdGuide {
9543
9975
  constructor(hostRef) {
9544
9976
  registerInstance(this, hostRef);
9545
9977
  }
9546
9978
  get el() { return getElement(this); }
9547
- type = 'help';
9979
+ type = 'tip';
9548
9980
  label = '';
9549
9981
  message = '';
9550
- guideUrl = '';
9982
+ url = '';
9551
9983
  popupTitle = '';
9552
9984
  popupWidth;
9553
9985
  popupShow = false;
9554
9986
  guideRef;
9555
9987
  handleClickGuide = () => {
9556
- if (this.type === 'help') {
9557
- this.popupShow = !this.popupShow;
9988
+ if (this.type === 'notion') {
9989
+ if (this.url) {
9990
+ window.open(this.url, '_blank', 'noopener,noreferrer');
9991
+ }
9558
9992
  return;
9559
9993
  }
9560
- if (this.guideUrl) {
9561
- window.open(this.guideUrl, '_blank');
9562
- }
9994
+ this.popupShow = !this.popupShow;
9563
9995
  };
9564
- get guideClass() {
9565
- const classes = ['sd-guide', `sd-guide--${this.type}`];
9566
- if (this.popupShow)
9567
- classes.push('sd-guide--active');
9568
- return classes.join(' ');
9569
- }
9570
9996
  closeDropdown = () => {
9571
9997
  this.popupShow = false;
9572
9998
  };
9999
+ get guideStyle() {
10000
+ const { button, contents } = GUIDE_CONFIG;
10001
+ return {
10002
+ '--sd-guide-button-height': button.height,
10003
+ '--sd-guide-button-padding-x': button.paddingX,
10004
+ '--sd-guide-button-radius': button.radius,
10005
+ '--sd-guide-button-gap': button.gap,
10006
+ '--sd-guide-button-font-size': button.fontSize,
10007
+ '--sd-guide-button-font-weight': button.fontWeight,
10008
+ '--sd-guide-button-line-height': button.lineHeight,
10009
+ '--sd-guide-button-border-width': button.borderWidth,
10010
+ '--sd-guide-button-border-color': button.borderColor,
10011
+ '--sd-guide-button-bg-default': button.bgDefault,
10012
+ '--sd-guide-button-bg-tip': button.bgTip,
10013
+ '--sd-guide-button-bg-notion': button.bgNotion,
10014
+ '--sd-guide-button-text-default': button.textDefault,
10015
+ '--sd-guide-button-text-active': button.textActive,
10016
+ '--sd-guide-contents-padding-x': contents.paddingX,
10017
+ '--sd-guide-contents-padding-y': contents.paddingY,
10018
+ '--sd-guide-contents-gap': contents.gap,
10019
+ '--sd-guide-contents-row-gap': contents.rowGap,
10020
+ '--sd-guide-contents-body-gap': contents.bodyGap,
10021
+ '--sd-guide-contents-title-gap': contents.titleGap,
10022
+ '--sd-guide-contents-radius': contents.radius,
10023
+ '--sd-guide-contents-title-font-size': contents.titleFontSize,
10024
+ '--sd-guide-contents-title-font-weight': contents.titleFontWeight,
10025
+ '--sd-guide-contents-title-line-height': contents.titleLineHeight,
10026
+ '--sd-guide-contents-body-font-size': contents.bodyFontSize,
10027
+ '--sd-guide-contents-body-font-weight': contents.bodyFontWeight,
10028
+ '--sd-guide-contents-body-line-height': contents.bodyLineHeight,
10029
+ '--sd-guide-contents-text-color': contents.textColor,
10030
+ };
10031
+ }
9573
10032
  render() {
9574
- const { name: iconName, size: iconSize, color: iconColor } = GUIDE_ICON[this.type];
9575
- return (hAsync("div", { key: '0f70d3686c37c029635c93a8ad8f937fb2ca73c2', class: "sd-guide", style: {
9576
- '--sd-guide-color': GUIDE_ICON[this.type].color,
9577
- } }, hAsync("sd-button", { key: 'f07235cc53a908237af2f13a98f325340c83fd0e', ref: el => (this.guideRef = el), class: this.guideClass, variant: this.popupShow ? 'primary' : 'outline', label: this.label || GUIDE_LABEL[this.type], size: "sm", color: this.popupShow ? GUIDE_ICON[this.type].color : 'grey_45', icon: iconName, iconColor: this.popupShow ? 'white' : iconColor, iconSize: iconSize, noHover: this.popupShow, onSdClick: this.handleClickGuide }), this.type === 'help' && this.popupShow && (hAsync("sd-portal", { key: '9c5ade0db41a02a343bb77bc1dcb44d12dba6c04', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, hAsync("div", { key: 'd59caf4107b678ce132accfe9f392c3cfa6b35f4', style: { position: 'absolute', width: '0px', height: '0px' } }, hAsync("div", { key: '22aa97a939e27454dec067effc6911aea6ace2a4', class: "sd-guide__popup", style: { width: this.popupWidth ? this.popupWidth + 'px' : '426px' } }, hAsync("sd-button", { key: '6bf404b6718bbd036acff51101538d967a2cd642', class: "sd-guide__popup__close", icon: "close", color: "grey_65", size: "md", variant: "ghost", noHover: true, onSdClick: this.closeDropdown }), hAsync("div", { key: 'a63aa9263715f57f2e8bf977c4849f868803a704', class: "sd-guide__popup__header" }, hAsync("sd-icon", { key: '8ba1969ada651d3226058bb9095ae8b794be1759', name: "helpOutline", size: 24, color: "green_65" }), hAsync("h3", { key: '41dd2533e146eae12ee7367a243e819362597761', class: "sd-guide__popup__title" }, this.popupTitle || GUIDE_LABEL[this.type])), hAsync("ul", { key: 'b45bfd9ff793f0c0860789d16c1c17fef2ad01d5', class: "sd-guide__popup__list" }, this.renderListItem(this.message))))))));
10033
+ const { button, contents } = GUIDE_CONFIG;
10034
+ const isActive = this.popupShow;
10035
+ const isNotion = (this.type ?? 'tip') === 'notion';
10036
+ const defaultLabel = DEFAULT_LABEL_BY_TYPE[this.type ?? 'tip'];
10037
+ const iconName = ICON_BY_TYPE[this.type ?? 'tip'];
10038
+ const buttonIconDefault = isNotion ? button.iconColorNotion : button.iconColorDefault;
10039
+ const popupIconColor = isNotion ? contents.iconColorNotion : contents.iconColor;
10040
+ const buttonClasses = ['sd-guide__button', `sd-guide__button--type-${this.type ?? 'tip'}`];
10041
+ if (isActive)
10042
+ buttonClasses.push('sd-guide__button--active');
10043
+ return (hAsync("div", { key: '4b9aa8bafd13828a4ec29d726f7276fab3042f2d', class: "sd-guide", style: this.guideStyle }, hAsync("sd-button", { key: 'e3a17c594d111e95d0cb42dd8315174ccf4dd908', ref: el => (this.guideRef = el), class: buttonClasses.join(' '), variant: isActive ? 'primary' : 'outline', label: this.label || defaultLabel, size: "sm", icon: iconName, iconColor: isActive ? button.iconColorActive : buttonIconDefault, iconSize: button.iconSize, noHover: isActive, onSdClick: this.handleClickGuide }), this.popupShow && (hAsync("sd-portal", { key: 'b57b09779ec23220eb466f710d55e678c913fe24', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, hAsync("div", { key: 'e62ca3a49a4976861a3e485166c8376a71286aba', style: { position: 'absolute', width: '0px', height: '0px' } }, hAsync("div", { key: '837625b5ab61bd9383cf5329bea66ceb97ef3bac', class: "sd-guide__popup", style: {
10044
+ ...this.guideStyle,
10045
+ width: this.popupWidth ? this.popupWidth + 'px' : '426px',
10046
+ } }, hAsync("sd-ghost-button", { key: '0e3057af64b47e20234269c0e2bf07664b8b3b13', class: "sd-guide__popup__close", icon: "close", ariaLabel: "close", size: "sm", onSdClick: this.closeDropdown }), hAsync("div", { key: '544e3508d232229b4d1edd82fdefa58457cc595a', class: "sd-guide__popup__header" }, hAsync("sd-icon", { key: '234fb04df972a50fa8deb1cacc6e34fab678d27b', name: iconName, size: 24, color: popupIconColor }), hAsync("h3", { key: '454d5ee4cdfc2a343d64e79dc642a2aee07ed448', class: "sd-guide__popup__title" }, this.popupTitle || defaultLabel)), hAsync("ul", { key: '875d5f5587808e5189e77ca02e55e8d7be1125da', class: "sd-guide__popup__list" }, this.renderListItem(this.message))))))));
9578
10047
  }
9579
10048
  // 현재 2depth까지만 스타일 적용
9580
10049
  renderListItem(message, depth = 0) {
@@ -9596,17 +10065,17 @@ class SdGuide {
9596
10065
  "$flags$": 512,
9597
10066
  "$tagName$": "sd-guide",
9598
10067
  "$members$": {
9599
- "type": [1],
9600
- "label": [1],
10068
+ "type": [513],
10069
+ "label": [513],
9601
10070
  "message": [1],
9602
- "guideUrl": [1, "guide-url"],
10071
+ "url": [1],
9603
10072
  "popupTitle": [1, "popup-title"],
9604
10073
  "popupWidth": [2, "popup-width"],
9605
10074
  "popupShow": [32]
9606
10075
  },
9607
10076
  "$listeners$": undefined,
9608
10077
  "$lazyBundleId$": "-",
9609
- "$attrsToReflect$": []
10078
+ "$attrsToReflect$": [["type", "type"], ["label", "label"]]
9610
10079
  }; }
9611
10080
  }
9612
10081
 
@@ -10278,12 +10747,12 @@ class SdInput {
10278
10747
  '--sd-system-size-field-sm-height': `${sizeTokens.height}px`,
10279
10748
  '--sd-system-radius-field-sm': `${sizeTokens.radius}px`,
10280
10749
  };
10281
- return (hAsync("sd-field", { key: 'a72ce8674fb761de7cd188e99cc19d5f3731a899', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, size: this.size, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("label", { key: 'e5cbdbc2b233bda57488ead19401d277891301ae', class: "sd-input__content" }, hAsync("slot", { key: 'a327005770df94ef61f2e08071e77407a24b7b5c', name: "prefix" }), hAsync("input", { key: '36301cd586151b8c607e14715b26fca467f68c13', name: this.name, ref: el => (this.nativeEl = el), class: `sd-input__native ${this.inputClass}`, type: this.type === 'password' && this.passwordVisible ? 'text' : this.type, value: this.internalValue || '', placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, autocomplete: this.autocomplete || undefined, maxlength: this.maxlength, minlength: this.minlength, inputmode: this.inputmode, enterkeyhint: this.enterkeyhint, spellcheck: this.spellcheck, onInput: this.handleInput, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event), style: this.inputStyle }), hAsync("slot", { key: '532e201860db0709572502aa4275fc9251e1aeb1', name: "suffix" }), this.clearable && this.internalValue && !this.disabled && (hAsync("sd-ghost-button", { key: 'cc6132852c65f0597cbe25751c7246b1cdad3096', icon: "close", ariaLabel: "close", size: "xxs", disabled: this.disabled, class: "sd-input__clear-icon", onClick: async () => {
10750
+ return (hAsync("sd-field", { key: 'ed32da716dabccac9c67061086a3eb821f49afd5', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, size: this.size, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("label", { key: 'c8297e261baee31b8508e0912004edd7fe85f115', class: "sd-input__content" }, hAsync("slot", { key: '615b28bb1f239a1ead1cad888edde9b59358837b', name: "prefix" }), hAsync("input", { key: 'd1231386b264dbb8b38bf920c48c59474417a492', name: this.name, ref: el => (this.nativeEl = el), class: `sd-input__native ${this.inputClass}`, type: this.type === 'password' && this.passwordVisible ? 'text' : this.type, value: this.internalValue || '', placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, autocomplete: this.autocomplete || undefined, maxlength: this.maxlength, minlength: this.minlength, inputmode: this.inputmode, enterkeyhint: this.enterkeyhint, spellcheck: this.spellcheck, onInput: this.handleInput, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event), style: this.inputStyle }), hAsync("slot", { key: '97f7c084a17674d52c43255b334ddeb61cf743ad', name: "suffix" }), this.clearable && this.internalValue && !this.disabled && (hAsync("sd-ghost-button", { key: 'f35a0872ac6f44e41716b0bf9f93f7a000445bf6', icon: "close", ariaLabel: "clear", size: "xxs", disabled: this.disabled, class: "sd-input__clear-icon", onClick: async () => {
10282
10751
  if (this.disabled)
10283
10752
  return;
10284
10753
  this.internalValue = '';
10285
10754
  await this.formField?.sdValidate();
10286
- } })), this.type === 'password' && (hAsync("sd-ghost-button", { key: 'fd3d567346cf5771ec28c73f15cdf0db15835766', icon: this.passwordVisible ? 'visibilityOn' : 'visibilityOff', ariaLabel: "visibility", size: "xxs", disabled: this.disabled, class: "sd-input__password-icon", onClick: () => {
10755
+ } })), this.type === 'password' && (hAsync("sd-ghost-button", { key: '0fdf74595057997c7d2f5f0f3ba6b75c340c2965', icon: this.passwordVisible ? 'visibilityOn' : 'visibilityOff', ariaLabel: "visibility", size: "xxs", disabled: this.disabled, class: "sd-input__password-icon", onClick: () => {
10287
10756
  if (this.disabled)
10288
10757
  return;
10289
10758
  this.passwordVisible = !this.passwordVisible;
@@ -10346,7 +10815,7 @@ class SdInput {
10346
10815
  }; }
10347
10816
  }
10348
10817
 
10349
- const sdLoadingContainerCss = () => `sd-loading-container .sd-loading-container{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:var(--sd-loading-container-z-index, 10000);opacity:0;visibility:hidden;transition:opacity 0.2s ease, visibility 0s linear 0.2s;pointer-events:none}sd-loading-container .sd-loading-container--visible{opacity:1;visibility:visible;transition:opacity 0.2s ease, visibility 0s linear 0s;pointer-events:auto}sd-loading-container .sd-loading-container__backdrop{position:absolute;inset:0;background:rgba(0, 0, 0, 0.4)}sd-loading-container .sd-loading-container__content{position:relative;display:flex;flex-direction:column;align-items:center;gap:16px}sd-loading-container .sd-loading-container__message{margin:0;color:#ffffff;font-size:14px;font-weight:500;line-height:22px;text-align:center;max-width:400px;word-break:keep-all}`;
10818
+ const sdLoadingContainerCss = () => `sd-loading-container .sd-loading-container{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:var(--sd-loading-container-z-index, 999);opacity:0;visibility:hidden;transition:opacity 0.2s ease, visibility 0s linear 0.2s;pointer-events:none}sd-loading-container .sd-loading-container--visible{opacity:1;visibility:visible;transition:opacity 0.2s ease, visibility 0s linear 0s;pointer-events:auto}sd-loading-container .sd-loading-container__backdrop{position:absolute;inset:0;background:rgba(0, 0, 0, 0.4)}sd-loading-container .sd-loading-container__content{position:relative;display:flex;flex-direction:column;align-items:center;gap:16px}sd-loading-container .sd-loading-container__message{margin:0;color:#ffffff;font-size:14px;font-weight:500;line-height:22px;text-align:center;max-width:400px;word-break:keep-all}`;
10350
10819
 
10351
10820
  class SdLoadingContainer {
10352
10821
  constructor(hostRef) {
@@ -10362,10 +10831,10 @@ class SdLoadingContainer {
10362
10831
  this.visible = false;
10363
10832
  }
10364
10833
  render() {
10365
- return (hAsync("div", { key: 'e4578e196ebd4ee69d424fe85c9bf651bc3382f7', class: {
10834
+ return (hAsync("div", { key: '8236579ed01f703fb105576c2fd575b157b3aa76', class: {
10366
10835
  'sd-loading-container': true,
10367
10836
  'sd-loading-container--visible': this.visible,
10368
- }, "aria-hidden": this.visible ? 'false' : 'true' }, hAsync("div", { key: 'ae9fae9408f9b69591554ca105abb2ece362db00', class: "sd-loading-container__backdrop" }), hAsync("div", { key: '27d0c6518dacbb664cebb2fc76c9ceb14b2b3aac', class: "sd-loading-container__content" }, hAsync("sd-circle-progress", { key: 'ace74d2550a2ddb579c61e6f8daaaf64915e8666', indeterminate: true, type: "inverse" }), this.message && (hAsync("p", { key: 'af059ecdadf7b3b3c0a0437cbc4264ff550fa3c6', class: "sd-loading-container__message" }, this.message)))));
10837
+ }, "aria-hidden": this.visible ? 'false' : 'true' }, hAsync("div", { key: '176473a839add91a86d207544e9cc5862b13d04f', class: "sd-loading-container__backdrop" }), hAsync("div", { key: '2776ed326caa6870a79b94079ff6e778ee560b02', class: "sd-loading-container__content" }, hAsync("sd-circle-progress", { key: '6977bfd46e06e9c13492a15b5081c98446770de5', indeterminate: true, type: "inverse" }), this.message && (hAsync("p", { key: '7cea458c498a4682b1d4d5f07e059ed8e4905df0', class: "sd-loading-container__message" }, this.message)))));
10369
10838
  }
10370
10839
  static get style() { return sdLoadingContainerCss(); }
10371
10840
  static get cmpMeta() { return {
@@ -10419,6 +10888,7 @@ class SdLoadingModal {
10419
10888
  }
10420
10889
  state = 'loading';
10421
10890
  message = '';
10891
+ useButton = false;
10422
10892
  buttonLabel = '';
10423
10893
  width;
10424
10894
  height;
@@ -10457,7 +10927,7 @@ class SdLoadingModal {
10457
10927
  '--sd-loading-modal-width': this.toCssSize(this.width) ?? `${LOADING_MODAL_LAYOUT.minWidth}px`,
10458
10928
  '--sd-loading-modal-height': this.toCssSize(this.height) ?? `${LOADING_MODAL_LAYOUT.minHeight}px`,
10459
10929
  };
10460
- return (hAsync(Host, { key: 'dcc53b3421a88970ce4ad8258285a896da0e400c', style: hostStyle }, hAsync("div", { key: 'bb2319b861392c8a88587b7654f2c6227b226cc7', class: "sd-loading-modal" }, hAsync("div", { key: 'f3064846c06d2cd1e9d2474dc16fe80773c4a8f7', class: "sd-loading-modal__content" }, this.state === 'loading' ? (hAsync("sd-circle-progress", { indeterminate: true })) : (hAsync("sd-icon", { class: "sd-loading-modal__icon", name: "warningOutline", size: LOADING_MODAL_LAYOUT.contentSize, color: LOADING_MODAL_COLORS.errorIcon }))), hAsync("p", { key: '932c71930b4484d652266f85556e7eb2195a81c9', class: "sd-loading-modal__message" }, this.resolvedMessage), hAsync("div", { key: 'e06cfa7729b72f881789d573f38116ac5086e062', class: "sd-loading-modal__button" }, hAsync("sd-button-v2", { key: '63684aa367e552df0e020ce4766d6c34c1361427', name: LOADING_MODAL_BUTTON_PRESET, label: this.resolvedButtonLabel, onSdClick: this.handleClick })))));
10930
+ return (hAsync(Host, { key: '8ecd5db2ffde201dd0c7d3c58b1da6b85b5a4116', style: hostStyle }, hAsync("div", { key: '61f79b16b22d5ab4bb4dca03f88568174cfcfb1f', class: "sd-loading-modal" }, hAsync("div", { key: 'bc373cfebab5949bee9c024bd86ca92d8294ff7b', class: "sd-loading-modal__content" }, this.state === 'loading' ? (hAsync("sd-circle-progress", { indeterminate: true })) : (hAsync("sd-icon", { class: "sd-loading-modal__icon", name: "warningOutline", size: LOADING_MODAL_LAYOUT.contentSize, color: LOADING_MODAL_COLORS.errorIcon }))), hAsync("p", { key: 'e9015b9c9813b1968c8ca7991d654761eb3ee9b3', class: "sd-loading-modal__message" }, this.resolvedMessage), this.useButton && (hAsync("div", { key: '4ed941961611fe9533bd2b989c9b68ef6c7ca741', class: "sd-loading-modal__button" }, hAsync("sd-button-v2", { key: '13f4c5ef5ad5285d846716e5dd72d9f2565c08f9', name: LOADING_MODAL_BUTTON_PRESET, label: this.resolvedButtonLabel, onSdClick: this.handleClick }))))));
10461
10931
  }
10462
10932
  static get style() { return sdLoadingModalCss(); }
10463
10933
  static get cmpMeta() { return {
@@ -10466,17 +10936,116 @@ class SdLoadingModal {
10466
10936
  "$members$": {
10467
10937
  "state": [513],
10468
10938
  "message": [1],
10939
+ "useButton": [516, "use-button"],
10469
10940
  "buttonLabel": [1, "button-label"],
10470
10941
  "width": [8],
10471
10942
  "height": [8]
10472
10943
  },
10473
10944
  "$listeners$": undefined,
10474
10945
  "$lazyBundleId$": "-",
10475
- "$attrsToReflect$": [["state", "state"]]
10946
+ "$attrsToReflect$": [["state", "state"], ["useButton", "use-button"]]
10476
10947
  }; }
10477
10948
  }
10478
10949
 
10479
- const sdModalContainerCss = () => `sd-modal-container{display:block}sd-modal-container .sd-modal-container{position:fixed;inset:0;z-index:var(--sd-modal-container-z-index, 9999);display:flex;align-items:center;justify-content:center}sd-modal-container .sd-modal-container__backdrop{position:absolute;inset:0;background:rgba(0, 0, 0, 0.4);opacity:0;transition:opacity 0.3s ease-out}sd-modal-container .sd-modal-container__backdrop--visible{opacity:1}sd-modal-container .sd-modal-container__content{position:relative;z-index:1;display:grid;place-items:center}sd-modal-container .sd-modal-container__content>*{grid-row:1;grid-column:1}sd-modal-container .sd-modal-container__modal{opacity:0;transform:scale(0);transition:opacity 0.3s ease-out, transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1)}sd-modal-container .sd-modal-container__modal--visible{opacity:1;transform:scale(1)}sd-modal-container .sd-modal-container__modal--shake{animation:modal-shake 0.3s ease-out}@keyframes modal-shake{0%,100%{transform:scale(1)}25%{transform:scale(1.03)}50%{transform:scale(0.97)}75%{transform:scale(1.01)}}`;
10950
+ const DEFAULT_BASE_Z_INDEX = 997;
10951
+ let baseZIndex = DEFAULT_BASE_Z_INDEX;
10952
+ let entries = [];
10953
+ let bodyScrollLocked = false;
10954
+ let previousBodyOverflow = null;
10955
+ let isKeydownAttached = false;
10956
+ function isBrowserEnvironment() {
10957
+ return typeof window !== 'undefined' && typeof document !== 'undefined';
10958
+ }
10959
+ function getTopInteractiveEntry() {
10960
+ return [...entries].reverse().find(entry => entry.interactive);
10961
+ }
10962
+ function syncBodyScrollLock() {
10963
+ if (!isBrowserEnvironment())
10964
+ return;
10965
+ const shouldLock = entries.length > 0;
10966
+ if (shouldLock === bodyScrollLocked)
10967
+ return;
10968
+ if (shouldLock) {
10969
+ previousBodyOverflow = document.body.style.overflow || '';
10970
+ document.body.style.overflow = 'hidden';
10971
+ }
10972
+ else {
10973
+ document.body.style.overflow = previousBodyOverflow ?? '';
10974
+ previousBodyOverflow = null;
10975
+ }
10976
+ bodyScrollLocked = shouldLock;
10977
+ }
10978
+ function updateEntryZIndices() {
10979
+ entries.forEach(entry => {
10980
+ entry.setZIndex(baseZIndex);
10981
+ });
10982
+ }
10983
+ function detachKeydownListener() {
10984
+ if (!isBrowserEnvironment() || !isKeydownAttached)
10985
+ return;
10986
+ window.removeEventListener('keydown', handleWindowKeydown);
10987
+ isKeydownAttached = false;
10988
+ }
10989
+ function attachKeydownListener() {
10990
+ if (!isBrowserEnvironment() || isKeydownAttached)
10991
+ return;
10992
+ window.addEventListener('keydown', handleWindowKeydown);
10993
+ isKeydownAttached = true;
10994
+ }
10995
+ function syncGlobalState() {
10996
+ updateEntryZIndices();
10997
+ syncBodyScrollLock();
10998
+ if (entries.length > 0)
10999
+ attachKeydownListener();
11000
+ else
11001
+ detachKeydownListener();
11002
+ }
11003
+ function handleWindowKeydown(e) {
11004
+ if (e.key !== 'Escape')
11005
+ return;
11006
+ const topEntry = getTopInteractiveEntry();
11007
+ if (!topEntry)
11008
+ return;
11009
+ if (topEntry.persistent) {
11010
+ topEntry.shake();
11011
+ return;
11012
+ }
11013
+ topEntry.requestClose('close');
11014
+ }
11015
+ function registerModal(entry) {
11016
+ entries = [
11017
+ ...entries.filter(item => item.id !== entry.id),
11018
+ {
11019
+ ...entry,
11020
+ interactive: true,
11021
+ },
11022
+ ];
11023
+ syncGlobalState();
11024
+ }
11025
+ function unregisterModal(id) {
11026
+ entries = entries.filter(entry => entry.id !== id);
11027
+ syncGlobalState();
11028
+ }
11029
+ function setModalInteractive(id, interactive) {
11030
+ entries = entries.map(entry => (entry.id === id ? { ...entry, interactive } : entry));
11031
+ syncGlobalState();
11032
+ }
11033
+ function isTopInteractiveModal(id) {
11034
+ return getTopInteractiveEntry()?.id === id;
11035
+ }
11036
+ function requestCloseForModal(id) {
11037
+ const topEntry = getTopInteractiveEntry();
11038
+ if (!topEntry || topEntry.id !== id)
11039
+ return false;
11040
+ if (topEntry.persistent) {
11041
+ topEntry.shake();
11042
+ return true;
11043
+ }
11044
+ topEntry.requestClose('close');
11045
+ return true;
11046
+ }
11047
+
11048
+ const sdModalContainerCss = () => `sd-modal-container{display:block}sd-modal-container .sd-modal-container{position:fixed;inset:0;z-index:var(--sd-modal-container-z-index, 997);pointer-events:none}sd-modal-container .sd-modal-container__layer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}sd-modal-container .sd-modal-container__backdrop{position:absolute;inset:0;background:rgba(0, 0, 0, 0.4);opacity:0;transition:opacity 0.3s ease-out;pointer-events:none}sd-modal-container .sd-modal-container__backdrop--visible{opacity:1;pointer-events:auto}sd-modal-container .sd-modal-container__modal{position:relative;z-index:1;opacity:0;transform:scale(0);pointer-events:auto;transition:opacity 0.3s ease-out, transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1)}sd-modal-container .sd-modal-container__modal--visible{opacity:1;transform:scale(1)}sd-modal-container .sd-modal-container__modal--shake{animation:modal-shake 0.3s ease-out}@keyframes modal-shake{0%,100%{transform:scale(1)}25%{transform:scale(1.03)}50%{transform:scale(0.97)}75%{transform:scale(1.01)}}`;
10480
11049
 
10481
11050
  let modalIdCounter = 0;
10482
11051
  const ANIMATION_DURATION = 350;
@@ -10485,31 +11054,21 @@ class SdModalContainer {
10485
11054
  registerInstance(this, hostRef);
10486
11055
  }
10487
11056
  get el() { return getElement(this); }
10488
- entries = [];
11057
+ autoRemove = false;
11058
+ entry;
10489
11059
  isVisible = false;
10490
- isBackdropVisible = false;
10491
- contentRef;
10492
- containerDismissTimerId;
10493
- previousBodyOverflow = null;
10494
- bodyScrollLocked = false;
10495
- handleKeydown(e) {
10496
- if (e.key === 'Escape') {
10497
- const top = this.getTopEntry();
10498
- if (!top)
10499
- return;
10500
- if (top.persistent) {
10501
- this.shakeModal(top.modalEl);
10502
- return;
10503
- }
10504
- this.dispatchClose(top.modalEl);
10505
- }
10506
- }
11060
+ backdropVisible = false;
11061
+ layerRef;
10507
11062
  async open(options, modalRef) {
10508
11063
  const id = `modal-${++modalIdCounter}`;
10509
11064
  const modalEl = this.createConfirmModal(id, options);
10510
11065
  this.attachModalEventListeners(id, modalEl);
10511
- this.registerEntry(id, modalEl, modalRef, {
11066
+ this.mountEntry({
11067
+ id,
11068
+ modalEl,
11069
+ modalRef,
10512
11070
  persistent: !!options.persistent,
11071
+ closing: false,
10513
11072
  });
10514
11073
  return id;
10515
11074
  }
@@ -10517,8 +11076,12 @@ class SdModalContainer {
10517
11076
  const id = `modal-${++modalIdCounter}`;
10518
11077
  const modalEl = this.createLoadingModal(id, options);
10519
11078
  this.attachLoadingModalEventListeners(id, modalEl);
10520
- this.registerEntry(id, modalEl, modalRef, {
11079
+ this.mountEntry({
11080
+ id,
11081
+ modalEl,
11082
+ modalRef,
10521
11083
  persistent: !!options.persistent,
11084
+ closing: false,
10522
11085
  });
10523
11086
  return id;
10524
11087
  }
@@ -10527,70 +11090,118 @@ class SdModalContainer {
10527
11090
  element.setAttribute('data-modal-id', id);
10528
11091
  element.classList.add('sd-modal-container__modal');
10529
11092
  this.attachModalEventListeners(id, element);
10530
- this.registerEntry(id, element, modalRef, {
11093
+ this.mountEntry({
11094
+ id,
11095
+ modalEl: element,
11096
+ modalRef,
10531
11097
  persistent: !!options.persistent,
11098
+ closing: false,
10532
11099
  });
10533
11100
  return id;
10534
11101
  }
10535
- attachModalEventListeners(id, modalEl) {
10536
- modalEl.addEventListener('sdOk', () => this.requestDismiss(id, 'confirm'));
10537
- modalEl.addEventListener('sdCancel', () => this.requestDismiss(id, 'cancel'));
10538
- modalEl.addEventListener('sdClose', () => this.requestDismiss(id, 'close'));
10539
- }
10540
- attachLoadingModalEventListeners(id, modalEl) {
10541
- modalEl.addEventListener('sdClick', () => {
10542
- const entry = (this.entries ?? []).find(item => item.id === id);
10543
- entry?.modalRef._triggerClick?.();
10544
- });
10545
- }
10546
- dispatchClose(modalEl) {
10547
- modalEl.dispatchEvent(new CustomEvent('sdClose'));
10548
- }
10549
- registerEntry(id, modalEl, modalRef, meta) {
10550
- if (this.containerDismissTimerId) {
10551
- clearTimeout(this.containerDismissTimerId);
10552
- this.containerDismissTimerId = undefined;
10553
- }
10554
- this.entries = [
10555
- ...(this.entries ?? []),
10556
- {
10557
- id,
10558
- modalEl,
10559
- modalRef,
10560
- persistent: meta.persistent,
10561
- closing: false,
10562
- },
10563
- ];
10564
- this.isVisible = true;
10565
- this.setBodyScrollLock(true);
10566
- requestAnimationFrame(() => {
10567
- if (!this.contentRef)
10568
- return;
10569
- this.contentRef.appendChild(modalEl);
10570
- this.waitForModalReady(modalEl).then(() => {
10571
- requestAnimationFrame(() => {
10572
- const currentEntry = (this.entries ?? []).find(item => item.id === id);
10573
- if (!currentEntry || currentEntry.closing || !modalEl.isConnected)
10574
- return;
10575
- this.isBackdropVisible = true;
10576
- modalEl.classList.add('sd-modal-container__modal--visible');
10577
- });
11102
+ componentDidRender() {
11103
+ if (!this.entry || this.entry.closing || !this.layerRef)
11104
+ return;
11105
+ if (this.entry.modalEl.isConnected)
11106
+ return;
11107
+ const { id, modalEl } = this.entry;
11108
+ this.layerRef.appendChild(modalEl);
11109
+ this.waitForModalReady(modalEl).then(() => {
11110
+ requestAnimationFrame(() => {
11111
+ if (!this.entry || this.entry.id !== id || this.entry.closing || !modalEl.isConnected)
11112
+ return;
11113
+ this.backdropVisible = true;
11114
+ modalEl.classList.add('sd-modal-container__modal--visible');
10578
11115
  });
10579
11116
  });
10580
11117
  }
11118
+ disconnectedCallback() {
11119
+ if (this.entry?.dismissTimerId)
11120
+ clearTimeout(this.entry.dismissTimerId);
11121
+ if (this.entry)
11122
+ unregisterModal(this.entry.id);
11123
+ }
10581
11124
  async dismissById(id, reason) {
10582
- this.requestDismiss(id, reason);
11125
+ if (this.entry?.id !== id)
11126
+ return;
11127
+ this.requestDismiss(reason);
10583
11128
  }
10584
11129
  async update(id, props) {
10585
- const entry = (this.entries ?? []).find(e => e.id === id);
10586
- if (!entry || entry.closing)
11130
+ if (!this.entry || this.entry.id !== id || this.entry.closing)
10587
11131
  return;
10588
- const tag = entry.modalEl.tagName.toLowerCase();
11132
+ const tag = this.entry.modalEl.tagName.toLowerCase();
10589
11133
  if (tag === 'sd-loading-modal') {
10590
- this.applyLoadingProps(entry.modalEl, props);
11134
+ this.applyLoadingProps(this.entry.modalEl, props);
11135
+ return;
10591
11136
  }
10592
- else {
10593
- this.applyProps(entry.modalEl, props);
11137
+ this.applyProps(this.entry.modalEl, props);
11138
+ }
11139
+ mountEntry(entry) {
11140
+ if (this.entry) {
11141
+ throw new Error('[sd-modal-container] This instance already manages an active modal.');
11142
+ }
11143
+ this.entry = entry;
11144
+ this.backdropVisible = false;
11145
+ this.isVisible = true;
11146
+ registerModal({
11147
+ id: entry.id,
11148
+ persistent: entry.persistent,
11149
+ requestClose: () => this.dispatchClose(),
11150
+ shake: () => this.shakeModal(entry.modalEl),
11151
+ setZIndex: zIndex => {
11152
+ this.el.style.setProperty('--sd-modal-container-z-index', String(zIndex));
11153
+ },
11154
+ });
11155
+ }
11156
+ attachModalEventListeners(_id, modalEl) {
11157
+ modalEl.addEventListener('sdOk', () => this.requestDismiss('confirm'));
11158
+ modalEl.addEventListener('sdCancel', () => this.requestDismiss('cancel'));
11159
+ modalEl.addEventListener('sdClose', () => this.requestDismiss('close'));
11160
+ }
11161
+ attachLoadingModalEventListeners(_id, modalEl) {
11162
+ modalEl.addEventListener('sdClick', () => {
11163
+ this.entry?.modalRef._triggerClick?.();
11164
+ });
11165
+ }
11166
+ dispatchClose() {
11167
+ this.entry?.modalEl.dispatchEvent(new CustomEvent('sdClose'));
11168
+ }
11169
+ requestDismiss(reason) {
11170
+ const currentEntry = this.entry;
11171
+ if (!currentEntry || currentEntry.closing)
11172
+ return;
11173
+ currentEntry.modalEl.classList.remove('sd-modal-container__modal--visible');
11174
+ const dismissTimerId = setTimeout(() => {
11175
+ this.finalizeDismiss(currentEntry.id);
11176
+ }, ANIMATION_DURATION);
11177
+ setModalInteractive(currentEntry.id, false);
11178
+ this.entry = {
11179
+ ...currentEntry,
11180
+ closing: true,
11181
+ dismissTimerId,
11182
+ };
11183
+ this.backdropVisible = false;
11184
+ if (reason === 'confirm')
11185
+ currentEntry.modalRef._triggerOk();
11186
+ else if (reason === 'cancel')
11187
+ currentEntry.modalRef._triggerCancel();
11188
+ else if (reason === 'close')
11189
+ currentEntry.modalRef._triggerClose();
11190
+ }
11191
+ finalizeDismiss(id) {
11192
+ const currentEntry = this.entry;
11193
+ if (!currentEntry || currentEntry.id !== id)
11194
+ return;
11195
+ if (currentEntry.dismissTimerId)
11196
+ clearTimeout(currentEntry.dismissTimerId);
11197
+ currentEntry.modalEl.remove();
11198
+ unregisterModal(id);
11199
+ currentEntry.modalRef._triggerDismissed();
11200
+ this.entry = undefined;
11201
+ this.backdropVisible = false;
11202
+ this.isVisible = false;
11203
+ if (this.autoRemove) {
11204
+ this.el.remove();
10594
11205
  }
10595
11206
  }
10596
11207
  createConfirmModal(id, options) {
@@ -10612,6 +11223,12 @@ class SdModalContainer {
10612
11223
  this.setAttr(el, 'state', options.state);
10613
11224
  if (this.hasOwnProp(options, 'message'))
10614
11225
  this.setAttr(el, 'message', options.message);
11226
+ if (this.hasOwnProp(options, 'useButton')) {
11227
+ if (options.useButton)
11228
+ el.setAttribute('use-button', '');
11229
+ else
11230
+ el.removeAttribute('use-button');
11231
+ }
10615
11232
  if (this.hasOwnProp(options, 'buttonLabel')) {
10616
11233
  this.setAttr(el, 'button-label', options.buttonLabel);
10617
11234
  }
@@ -10652,14 +11269,9 @@ class SdModalContainer {
10652
11269
  el.tagContents = options.tagContents;
10653
11270
  }
10654
11271
  handleBackdropClick = () => {
10655
- const top = this.getTopEntry();
10656
- if (!top)
10657
- return;
10658
- if (top.persistent) {
10659
- this.shakeModal(top.modalEl);
11272
+ if (!this.entry || !isTopInteractiveModal(this.entry.id))
10660
11273
  return;
10661
- }
10662
- this.dispatchClose(top.modalEl);
11274
+ requestCloseForModal(this.entry.id);
10663
11275
  };
10664
11276
  shakeModal(modalEl) {
10665
11277
  const cls = 'sd-modal-container__modal--shake';
@@ -10669,73 +11281,6 @@ class SdModalContainer {
10669
11281
  modalEl.classList.add(cls);
10670
11282
  });
10671
11283
  }
10672
- disconnectedCallback() {
10673
- (this.entries ?? []).forEach(entry => {
10674
- if (entry.dismissTimerId)
10675
- clearTimeout(entry.dismissTimerId);
10676
- });
10677
- if (this.containerDismissTimerId)
10678
- clearTimeout(this.containerDismissTimerId);
10679
- this.setBodyScrollLock(false);
10680
- }
10681
- setBodyScrollLock(lock) {
10682
- if (typeof document === 'undefined')
10683
- return;
10684
- if (lock === this.bodyScrollLocked)
10685
- return;
10686
- if (lock) {
10687
- this.previousBodyOverflow = document.body.style.overflow || '';
10688
- document.body.style.overflow = 'hidden';
10689
- }
10690
- else {
10691
- document.body.style.overflow = this.previousBodyOverflow ?? '';
10692
- this.previousBodyOverflow = null;
10693
- }
10694
- this.bodyScrollLocked = lock;
10695
- }
10696
- getTopEntry() {
10697
- return [...(this.entries ?? [])].reverse().find(entry => !entry.closing);
10698
- }
10699
- requestDismiss(id, reason) {
10700
- const entry = (this.entries ?? []).find(item => item.id === id);
10701
- if (!entry || entry.closing)
10702
- return;
10703
- entry.modalEl.classList.remove('sd-modal-container__modal--visible');
10704
- const remainingActive = (this.entries ?? []).filter(item => item.id !== id && !item.closing);
10705
- if (remainingActive.length === 0) {
10706
- this.isBackdropVisible = false;
10707
- }
10708
- const dismissTimerId = setTimeout(() => {
10709
- this.finalizeDismiss(id);
10710
- }, ANIMATION_DURATION);
10711
- this.entries = (this.entries ?? []).map(item => item.id === id ? { ...item, closing: true, dismissTimerId } : item);
10712
- if (reason === 'confirm')
10713
- entry.modalRef._triggerOk();
10714
- else if (reason === 'cancel')
10715
- entry.modalRef._triggerCancel();
10716
- else if (reason === 'close')
10717
- entry.modalRef._triggerClose();
10718
- }
10719
- finalizeDismiss(id) {
10720
- const entry = (this.entries ?? []).find(item => item.id === id);
10721
- if (!entry)
10722
- return;
10723
- if (entry.dismissTimerId)
10724
- clearTimeout(entry.dismissTimerId);
10725
- entry.modalEl.remove();
10726
- const nextEntries = (this.entries ?? []).filter(item => item.id !== id);
10727
- this.entries = nextEntries;
10728
- if (nextEntries.length === 0) {
10729
- this.setBodyScrollLock(false);
10730
- this.containerDismissTimerId = setTimeout(() => {
10731
- if ((this.entries ?? []).length === 0) {
10732
- this.isVisible = false;
10733
- }
10734
- this.containerDismissTimerId = undefined;
10735
- }, ANIMATION_DURATION);
10736
- }
10737
- entry.modalRef._triggerDismissed();
10738
- }
10739
11284
  waitForModalReady(modalEl) {
10740
11285
  const componentOnReady = modalEl.componentOnReady;
10741
11286
  if (typeof componentOnReady === 'function') {
@@ -10756,28 +11301,31 @@ class SdModalContainer {
10756
11301
  el.setAttribute(name, value);
10757
11302
  }
10758
11303
  render() {
10759
- if (!this.isVisible)
11304
+ if (!this.isVisible || !this.entry)
10760
11305
  return null;
10761
- return (hAsync("div", { class: "sd-modal-container" }, hAsync("div", { class: {
11306
+ return (hAsync("div", { class: "sd-modal-container" }, hAsync("div", { class: "sd-modal-container__layer", "data-modal-id": this.entry.id, ref: el => {
11307
+ this.layerRef = el;
11308
+ } }, hAsync("div", { class: {
10762
11309
  'sd-modal-container__backdrop': true,
10763
- 'sd-modal-container__backdrop--visible': this.isBackdropVisible,
10764
- }, onClick: this.handleBackdropClick }), hAsync("div", { class: "sd-modal-container__content", ref: el => { this.contentRef = el; } })));
11310
+ 'sd-modal-container__backdrop--visible': this.backdropVisible,
11311
+ }, onClick: this.handleBackdropClick }))));
10765
11312
  }
10766
11313
  static get style() { return sdModalContainerCss(); }
10767
11314
  static get cmpMeta() { return {
10768
11315
  "$flags$": 512,
10769
11316
  "$tagName$": "sd-modal-container",
10770
11317
  "$members$": {
10771
- "entries": [32],
11318
+ "autoRemove": [4, "auto-remove"],
11319
+ "entry": [32],
10772
11320
  "isVisible": [32],
10773
- "isBackdropVisible": [32],
11321
+ "backdropVisible": [32],
10774
11322
  "open": [64],
10775
11323
  "openLoading": [64],
10776
11324
  "createCustom": [64],
10777
11325
  "dismissById": [64],
10778
11326
  "update": [64]
10779
11327
  },
10780
- "$listeners$": [[8, "keydown", "handleKeydown"]],
11328
+ "$listeners$": undefined,
10781
11329
  "$lazyBundleId$": "-",
10782
11330
  "$attrsToReflect$": []
10783
11331
  }; }
@@ -11164,12 +11712,12 @@ class SdNumberInput {
11164
11712
  '--sd-textinput-input-hint-typography-line-height': `${NUMBER_INPUT_HINT.typography.lineHeight}px`,
11165
11713
  '--sd-textinput-input-contents-gap': `${NUMBER_INPUT_CONTENTS_GAP}px`,
11166
11714
  };
11167
- return (hAsync("sd-field", { key: 'f81b01b27960130cbf6b37a29fc0ddc11750768e', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, size: this.size, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("div", { key: '0f9b5a0b966c7d51d5913c61a585ff789fa4973f', class: "sd-number-input__content" }, this.useButton && (hAsync("button", { key: 'b037ee3062253bf229f9639dd04c7475657fabb6', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--decrement", disabled: this.isDecrementDisabled(), onClick: this.handleDecrement, tabindex: -1 }, hAsync("sd-icon", { key: '39a9f73a15008a481e758e663e027cd4f6454146', name: "minus", size: iconSize, color: this.isDecrementDisabled()
11715
+ return (hAsync("sd-field", { key: 'edb2eaf473ba53fa340e39a350624e0a9e8b566e', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, size: this.size, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("div", { key: '408b984ca5c7f3edaf0afe4c56fab2901824b2de', class: "sd-number-input__content" }, this.useButton && (hAsync("button", { key: 'da29f621914cbb7cac4c83f55056f52ef918f7c7', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--decrement", disabled: this.isDecrementDisabled(), onClick: this.handleDecrement, tabindex: -1 }, hAsync("sd-icon", { key: 'a60c99bd949c2791608d269bc478b490dd4335e0', name: "minus", size: iconSize, color: this.isDecrementDisabled()
11168
11716
  ? NUMBER_INPUT_STEPPER.icon.disabled
11169
- : NUMBER_INPUT_STEPPER.icon.default }))), this.inputPrefix && (hAsync("span", { key: '050334ce25bb767e7f11dca886d4aeecaa1ed3dc', class: "sd-number-input__prefix" }, this.inputPrefix)), hAsync("input", { key: 'a72697d136eeee52ef23fee6ee2017b6dd37e54c', name: this.name, ref: el => (this.nativeEl = el), class: `sd-number-input__native ${this.inputClass}`, type: "text", inputMode: "numeric", value: this.displayValue, placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, onInput: this.handleInput, onKeyDown: this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur, style: {
11717
+ : NUMBER_INPUT_STEPPER.icon.default }))), this.inputPrefix && (hAsync("span", { key: '3eae6cb2d277f3f830f7cb122b72cdcdedf57e10', class: "sd-number-input__prefix" }, this.inputPrefix)), hAsync("input", { key: '19e42ab159a9df7721ca6ea5505d3a0aca2517c4', name: this.name, ref: el => (this.nativeEl = el), class: `sd-number-input__native ${this.inputClass}`, type: "text", inputMode: "numeric", value: this.displayValue, placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, onInput: this.handleInput, onKeyDown: this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur, style: {
11170
11718
  textAlign: this.useButton ? 'center' : 'right',
11171
11719
  ...this.inputStyle,
11172
- } }), this.inputSuffix && (hAsync("span", { key: '845202622b3377add18782d96d0af0c49caf95ec', class: "sd-number-input__suffix" }, this.inputSuffix)), this.useButton && (hAsync("button", { key: '208c976c1b755bec0cd7efb5ceacb3e07dce3a7d', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--increment", disabled: this.isIncrementDisabled(), onClick: this.handleIncrement, tabindex: -1 }, hAsync("sd-icon", { key: 'fe9848c8f044d01378dc183a80d3f81eb56a67f9', name: "add", size: iconSize, color: this.isIncrementDisabled()
11720
+ } }), this.inputSuffix && (hAsync("span", { key: '5f9dc1e294a081cede120d9466d70910a9b1d6bb', class: "sd-number-input__suffix" }, this.inputSuffix)), this.useButton && (hAsync("button", { key: '50d96dd2556071480b17210b8db307ab4082c92b', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--increment", disabled: this.isIncrementDisabled(), onClick: this.handleIncrement, tabindex: -1 }, hAsync("sd-icon", { key: '1821a77886ac9dc169c8e2697282e813a334df35', name: "add", size: iconSize, color: this.isIncrementDisabled()
11173
11721
  ? NUMBER_INPUT_STEPPER.icon.disabled
11174
11722
  : NUMBER_INPUT_STEPPER.icon.default }))))));
11175
11723
  }
@@ -11226,16 +11774,75 @@ class SdNumberInput {
11226
11774
  }; }
11227
11775
  }
11228
11776
 
11229
- const sdPaginationCss = () => `.sd-pagination{display:flex;flex-flow:row nowrap;align-items:center;justify-content:center;gap:8px;color:#555555;width:100%;font-size:12px}.sd-pagination .prepend-btns{display:flex;flex-flow:row nowrap;align-items:center;gap:8px;width:60px}.sd-pagination .prepend-btns button{width:26px;height:26px;border:0;background:none}.sd-pagination .prepend-btns button:hover{border:1px solid #006AC1;border-radius:14px}.sd-pagination .append-btns{display:flex;flex-flow:row nowrap;align-items:center;gap:8px;width:60px}.sd-pagination .append-btns button{width:26px;height:26px;border:0;background:none}.sd-pagination .append-btns button:hover{border:1px solid #006AC1;border-radius:14px}.sd-pagination .pagination-btn{display:flex;align-items:center;justify-content:center;border-radius:14px;outline:none;border:none;cursor:pointer;height:26px;color:#555555;width:var(--pagination-btn-width, 26px)}.sd-pagination .pagination-btn--selected{background-color:#006AC1;color:white}.sd-pagination .pagination-btn:hover{border:1px solid #006AC1}.sd-pagination--simple .pagination-info{line-height:26px;display:flex;flex-flow:row nowrap;align-items:center;gap:8px}.sd-pagination--simple .pagination-info .current-page,.sd-pagination--simple .pagination-info .last-page{padding:0 2px}`;
11777
+ const pagination = {
11778
+ height: "24",
11779
+ paddingX: "6",
11780
+ radius: "6",
11781
+ gap: "12",
11782
+ move: {
11783
+ gap: "4"
11784
+ },
11785
+ icon: "12",
11786
+ typography: {
11787
+ "default": {
11788
+ fontFamily: "Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif",
11789
+ fontSize: "12",
11790
+ fontWeight: "500",
11791
+ lineHeight: "20"},
11792
+ selected: {
11793
+ fontWeight: "700"}
11794
+ },
11795
+ item: {
11796
+ bg: {
11797
+ hover: "#EEEEEE",
11798
+ selected: "#E6F1FF"
11799
+ },
11800
+ content: {
11801
+ "default": "#555555",
11802
+ hover: "#004290",
11803
+ selected: "#004290"
11804
+ }
11805
+ }
11806
+ };
11807
+ var paginationTokens = {
11808
+ pagination: pagination
11809
+ };
11230
11810
 
11231
- const BUTTON_WIDTH = {
11232
- 1: 26,
11233
- 2: 36,
11234
- 3: 42,
11235
- 4: 50,
11236
- 5: 58,
11811
+ const PAGINATION_LAYOUT = {
11812
+ height: `${paginationTokens.pagination.height}px`,
11813
+ paddingX: `${paginationTokens.pagination.paddingX}px`,
11814
+ radius: `${paginationTokens.pagination.radius}px`,
11815
+ gap: `${paginationTokens.pagination.gap}px`,
11816
+ moveGap: `${paginationTokens.pagination.move.gap}px`,
11817
+ iconSize: Number(paginationTokens.pagination.icon),
11818
+ };
11819
+ const PAGINATION_TYPOGRAPHY = {
11820
+ fontFamily: paginationTokens.pagination.typography.default.fontFamily,
11821
+ fontSize: `${paginationTokens.pagination.typography.default.fontSize}px`,
11822
+ lineHeight: `${paginationTokens.pagination.typography.default.lineHeight}px`,
11823
+ fontWeightDefault: paginationTokens.pagination.typography.default.fontWeight,
11824
+ fontWeightSelected: paginationTokens.pagination.typography.selected.fontWeight,
11237
11825
  };
11826
+ const PAGINATION_COLORS = {
11827
+ contentDefault: paginationTokens.pagination.item.content.default,
11828
+ contentHover: paginationTokens.pagination.item.content.hover,
11829
+ contentSelected: paginationTokens.pagination.item.content.selected,
11830
+ bgHover: paginationTokens.pagination.item.bg.hover,
11831
+ bgSelected: paginationTokens.pagination.item.bg.selected,
11832
+ // TODO: 토큰 반영 후 교체 — nav 화살표 색상은 현재 토큰에 없음
11833
+ iconDefault: '#888888',
11834
+ };
11835
+
11836
+ const sdPaginationCss = () => `sd-pagination{display:inline-flex}.sd-pagination{display:inline-flex;align-items:center;gap:var(--sd-pagination-gap);font-family:var(--sd-pagination-font-family)}.sd-pagination__group{display:inline-flex;align-items:center;gap:var(--sd-pagination-move-gap);min-width:calc(var(--sd-pagination-height) * 2 + var(--sd-pagination-move-gap))}.sd-pagination__group--prev{justify-content:flex-end}.sd-pagination__group--next{justify-content:flex-start}.sd-pagination__numbers{display:inline-flex;align-items:center;gap:var(--sd-pagination-move-gap)}.sd-pagination__nav{display:inline-flex;align-items:center;justify-content:center;width:var(--sd-pagination-height);height:var(--sd-pagination-height);padding:0;background:transparent;border:0;border-radius:var(--sd-pagination-radius);cursor:pointer;outline:none}.sd-pagination__nav:hover{background-color:var(--sd-pagination-bg-hover)}.sd-pagination__item{display:inline-flex;align-items:center;justify-content:center;width:var(--sd-pagination-item-width);height:var(--sd-pagination-height);padding:0 var(--sd-pagination-padding-x);background:transparent;border:0;border-radius:var(--sd-pagination-radius);color:var(--sd-pagination-content);font-size:var(--sd-pagination-font-size);font-weight:var(--sd-pagination-font-weight-default);line-height:var(--sd-pagination-line-height);cursor:pointer;outline:none;box-sizing:border-box}.sd-pagination__item:hover{background-color:var(--sd-pagination-bg-hover);color:var(--sd-pagination-content-hover)}.sd-pagination__item--selected{background-color:var(--sd-pagination-bg-selected);color:var(--sd-pagination-content-selected);font-weight:var(--sd-pagination-font-weight-selected);cursor:default}.sd-pagination__item--selected:hover{background-color:var(--sd-pagination-bg-selected);color:var(--sd-pagination-content-selected)}.sd-pagination__info{display:inline-flex;align-items:center;gap:var(--sd-pagination-move-gap);height:var(--sd-pagination-height);padding:0 var(--sd-pagination-padding-x);color:var(--sd-pagination-content);font-size:var(--sd-pagination-font-size);font-weight:var(--sd-pagination-font-weight-default);line-height:var(--sd-pagination-line-height)}.sd-pagination__current{color:var(--sd-pagination-content-selected);font-weight:var(--sd-pagination-font-weight-selected)}`;
11837
+
11238
11838
  const PER_PAGE = 10;
11839
+ const BUTTON_WIDTH = {
11840
+ 1: 24,
11841
+ 2: 34,
11842
+ 3: 40,
11843
+ 4: 48,
11844
+ 5: 56,
11845
+ };
11239
11846
  class SdPagination {
11240
11847
  constructor(hostRef) {
11241
11848
  registerInstance(this, hostRef);
@@ -11245,13 +11852,6 @@ class SdPagination {
11245
11852
  lastPage = 1;
11246
11853
  simple = false;
11247
11854
  pageChange;
11248
- get paginationClasses() {
11249
- const classes = ['sd-pagination'];
11250
- if (this.simple) {
11251
- classes.push('sd-pagination--simple');
11252
- }
11253
- return classes.join(' ');
11254
- }
11255
11855
  get pageNumbers() {
11256
11856
  const start = Math.floor((this.currentPage - 1) / PER_PAGE) * PER_PAGE + 1;
11257
11857
  const end = Math.min(start + PER_PAGE - 1, this.lastPage);
@@ -11262,51 +11862,73 @@ class SdPagination {
11262
11862
  const maxPageLength = lastPageNum.toString().length;
11263
11863
  return BUTTON_WIDTH[maxPageLength] || BUTTON_WIDTH[1];
11264
11864
  }
11265
- handlePageChange(page) {
11865
+ get isFirstGroup() {
11866
+ return this.currentPage <= PER_PAGE;
11867
+ }
11868
+ get isLastGroup() {
11869
+ const startPageGroup = Math.floor((this.currentPage - 1) / PER_PAGE) * PER_PAGE + 1;
11870
+ return startPageGroup + PER_PAGE - 1 >= this.lastPage;
11871
+ }
11872
+ handlePageChange = (page) => {
11266
11873
  if (page < 1 || page > this.lastPage)
11267
11874
  return;
11268
11875
  this.currentPage = page;
11269
11876
  this.pageChange.emit(page);
11270
- }
11271
- handleGroupChange(direction) {
11877
+ };
11878
+ handleGroupChange = (direction) => {
11272
11879
  const delta = direction === 'forward' ? PER_PAGE : -PER_PAGE;
11273
11880
  const newPage = Math.min(Math.max(this.currentPage + delta, 1), this.lastPage);
11274
11881
  this.handlePageChange(newPage);
11275
- }
11276
- get isFirstGroup() {
11277
- return this.currentPage <= PER_PAGE;
11278
- }
11279
- get isLastGroup() {
11280
- const startPageGroup = Math.floor((this.currentPage - 1) / PER_PAGE) * PER_PAGE + 1;
11281
- return startPageGroup + PER_PAGE - 1 >= this.lastPage;
11882
+ };
11883
+ renderNavButton(iconName, ariaLabel, onClick) {
11884
+ return (hAsync("button", { type: "button", class: "sd-pagination__nav", "aria-label": ariaLabel, onClick: onClick }, hAsync("sd-icon", { name: iconName, size: PAGINATION_LAYOUT.iconSize, color: PAGINATION_COLORS.iconDefault })));
11282
11885
  }
11283
11886
  renderPrevButtons() {
11284
11887
  if (this.simple) {
11285
11888
  if (this.currentPage <= 1)
11286
11889
  return null;
11287
- return (hAsync(Fragment, null, hAsync("button", { "aria-label": "Go to first page", onClick: () => this.handlePageChange(1) }, hAsync("sd-icon", { name: "chevronLeftEnd", size: "12", color: "#222222" })), hAsync("button", { "aria-label": "Go to previous page", onClick: () => this.handlePageChange(this.currentPage - 1) }, hAsync("sd-icon", { name: "arrowLeft", size: "12", color: "#222222" }))));
11288
- }
11289
- if (!this.isFirstGroup) {
11290
- return (hAsync(Fragment, null, hAsync("button", { "aria-label": "Go to first page", onClick: () => this.handlePageChange(1) }, hAsync("sd-icon", { name: "chevronLeftEnd", size: "12", color: "#222222" })), hAsync("button", { "aria-label": "Go to previous page group", onClick: () => this.handleGroupChange('backward') }, hAsync("sd-icon", { name: "arrowLeft", size: "12", color: "#222222" }))));
11890
+ return (hAsync(Fragment, null, this.renderNavButton('chevronLeftEnd', 'Go to first page', () => this.handlePageChange(1)), this.renderNavButton('chevronLeft', 'Go to previous page', () => this.handlePageChange(this.currentPage - 1))));
11291
11891
  }
11892
+ if (this.isFirstGroup)
11893
+ return null;
11894
+ return (hAsync(Fragment, null, this.renderNavButton('chevronLeftEnd', 'Go to first page', () => this.handlePageChange(1)), this.renderNavButton('chevronLeft', 'Go to previous page group', () => this.handleGroupChange('backward'))));
11292
11895
  }
11293
11896
  renderNextButtons() {
11294
11897
  if (this.simple) {
11295
11898
  if (this.currentPage >= this.lastPage)
11296
11899
  return null;
11297
- return (hAsync(Fragment, null, hAsync("button", { "aria-label": "Go to next page", onClick: () => this.handlePageChange(this.currentPage + 1) }, hAsync("sd-icon", { name: "arrowRight", size: "12", color: "#222222" })), hAsync("button", { "aria-label": "Go to last page", onClick: () => this.handlePageChange(this.lastPage) }, hAsync("sd-icon", { name: "chevronRightEnd", size: "12", color: "#222222" }))));
11298
- }
11299
- if (!this.isLastGroup) {
11300
- return (hAsync(Fragment, null, hAsync("button", { "aria-label": "Go to next page group", onClick: () => this.handleGroupChange('forward') }, hAsync("sd-icon", { name: "arrowRight", size: "12", color: "#222222" })), hAsync("button", { "aria-label": "Go to last page", onClick: () => this.handlePageChange(this.lastPage) }, hAsync("sd-icon", { name: "chevronRightEnd", size: "12", color: "#222222" }))));
11900
+ return (hAsync(Fragment, null, this.renderNavButton('chevronRight', 'Go to next page', () => this.handlePageChange(this.currentPage + 1)), this.renderNavButton('chevronRightEnd', 'Go to last page', () => this.handlePageChange(this.lastPage))));
11301
11901
  }
11902
+ if (this.isLastGroup)
11903
+ return null;
11904
+ return (hAsync(Fragment, null, this.renderNavButton('chevronRight', 'Go to next page group', () => this.handleGroupChange('forward')), this.renderNavButton('chevronRightEnd', 'Go to last page', () => this.handlePageChange(this.lastPage))));
11302
11905
  }
11303
11906
  render() {
11304
- return (hAsync("div", { key: '5136947eb1aa1539d240af359eec8763d708906b', class: this.paginationClasses }, hAsync("div", { key: '3114f336a27b4f3bf6249fd82649b9d21831a57a', class: "prepend-btns" }, this.renderPrevButtons()), this.simple ? (hAsync("div", { class: "pagination-info" }, hAsync("span", { class: "current-page" }, this.currentPage), hAsync("span", null, "/"), hAsync("span", { class: "last-page" }, this.lastPage))) : (this.pageNumbers.map(n => (hAsync("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
11305
- 'pagination-btn': true,
11306
- 'pagination-btn--selected': this.currentPage === n,
11307
- }, disabled: this.currentPage === n, style: {
11308
- '--pagination-btn-width': `${this.buttonWidth}px`,
11309
- }, onClick: () => this.handlePageChange(n) }, n)))), hAsync("div", { key: 'a85d2e89389d2638e797873e18717d1079a8b156', class: "append-btns" }, this.renderNextButtons())));
11907
+ const cssVars = {
11908
+ '--sd-pagination-height': PAGINATION_LAYOUT.height,
11909
+ '--sd-pagination-padding-x': PAGINATION_LAYOUT.paddingX,
11910
+ '--sd-pagination-radius': PAGINATION_LAYOUT.radius,
11911
+ '--sd-pagination-gap': PAGINATION_LAYOUT.gap,
11912
+ '--sd-pagination-move-gap': PAGINATION_LAYOUT.moveGap,
11913
+ '--sd-pagination-font-family': PAGINATION_TYPOGRAPHY.fontFamily,
11914
+ '--sd-pagination-font-size': PAGINATION_TYPOGRAPHY.fontSize,
11915
+ '--sd-pagination-line-height': PAGINATION_TYPOGRAPHY.lineHeight,
11916
+ '--sd-pagination-font-weight-default': PAGINATION_TYPOGRAPHY.fontWeightDefault,
11917
+ '--sd-pagination-font-weight-selected': PAGINATION_TYPOGRAPHY.fontWeightSelected,
11918
+ '--sd-pagination-content': PAGINATION_COLORS.contentDefault,
11919
+ '--sd-pagination-content-hover': PAGINATION_COLORS.contentHover,
11920
+ '--sd-pagination-content-selected': PAGINATION_COLORS.contentSelected,
11921
+ '--sd-pagination-bg-hover': PAGINATION_COLORS.bgHover,
11922
+ '--sd-pagination-bg-selected': PAGINATION_COLORS.bgSelected,
11923
+ '--sd-pagination-item-width': `${this.buttonWidth}px`,
11924
+ };
11925
+ return (hAsync("div", { key: '1f6d3909c5c7f17701c405f058bf999020d9424e', class: {
11926
+ 'sd-pagination': true,
11927
+ 'sd-pagination--simple': this.simple,
11928
+ }, style: cssVars }, hAsync("div", { key: '9faaf4f1033e406ecaad7ed593a1610bb7002631', class: "sd-pagination__group sd-pagination__group--prev" }, this.renderPrevButtons()), this.simple ? (hAsync("div", { class: "sd-pagination__info" }, hAsync("span", { class: "sd-pagination__current" }, this.currentPage), hAsync("span", { class: "sd-pagination__divider" }, "/"), hAsync("span", { class: "sd-pagination__last" }, this.lastPage))) : (hAsync("div", { class: "sd-pagination__numbers" }, this.pageNumbers.map(n => (hAsync("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
11929
+ 'sd-pagination__item': true,
11930
+ 'sd-pagination__item--selected': this.currentPage === n,
11931
+ }, onClick: () => this.handlePageChange(n) }, n))))), hAsync("div", { key: 'c8d21679938032bee223f6dfefff3a87dc5badec', class: "sd-pagination__group sd-pagination__group--next" }, this.renderNextButtons())));
11310
11932
  }
11311
11933
  static get style() { return sdPaginationCss(); }
11312
11934
  static get cmpMeta() { return {
@@ -11378,14 +12000,14 @@ class SdPopover {
11378
12000
  this.showPopover = false;
11379
12001
  };
11380
12002
  render() {
11381
- return (hAsync(Fragment, { key: 'e953f3dfbc34a7e6b4eee3b90bd9344d4ef7d8a2' }, this.label ? (hAsync("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: this.icon, size: this.buttonSize, color: this.color, variant: this.buttonVariant, class: "sd-popover", onSdClick: () => (this.showPopover = !this.showPopover) })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-popover", onClick: () => (this.showPopover = !this.showPopover) })), this.showPopover && (hAsync("sd-floating-portal", { key: '23128c3d7b03a236026a1557c441ff1ddaae7033', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement, offset: this.popoverOffset }, hAsync("div", { key: '620f97e29104979fd203f943bb516ea31696d737', class: {
12003
+ return (hAsync(Fragment, { key: '32e3a11baabd4f4fc8c570311b99b2113e4ce3b0' }, this.label ? (hAsync("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: this.icon, size: this.buttonSize, color: this.color, variant: this.buttonVariant, class: "sd-popover", onSdClick: () => (this.showPopover = !this.showPopover) })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-popover", onClick: () => (this.showPopover = !this.showPopover) })), this.showPopover && (hAsync("sd-floating-portal", { key: '8139e72f293319e4d5ed3fe67d4f47a03743b437', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement, offset: this.popoverOffset }, hAsync("div", { key: 'fdb76f4a9a54be08fdf0d352ff389453840c4789', class: {
11382
12004
  'sd-floating-menu': true,
11383
12005
  'sd-floating-menu--popover': true,
11384
12006
  [`sd-floating-menu--${this.placement}`]: true,
11385
12007
  [this.menuClass]: !!this.menuClass,
11386
12008
  }, style: {
11387
12009
  '--sd-floating-bg': popoverTokens.popover.bg,
11388
- } }, hAsync("i", { key: '027cd73af66a6a5161361625502496f8c9183e9d', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${this.placement}` }, hAsync(TooltipArrow, { key: '0db7efc9eaaecd48af55f7b46fa1c90eb0027d86' })), hAsync("div", { key: 'd007d9041093593b155df32d1f6420f401baf1fa', class: "sd-floating-menu__content" }, this.menuTitle && hAsync("div", { key: '0746608da07343147896c59a9e8e27e15cd9fae2', class: "sd-floating-menu__title" }, this.menuTitle), this.messages.length > 0 && (hAsync("div", { key: '76a1c19fe4871a7a0d5bd6fc2ee5228453aab5f2', class: "sd-floating-menu__messages" }, this.messages.map(message => (hAsync("div", null, message))))), this.buttons.length > 0 && (hAsync("div", { key: 'ccfdc3a653b9a6fb0ea8ffb8dcb538638ae83e33', class: `sd-floating-menu__buttons sd-floating-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (hAsync("sd-button", { ...button })))))), this.useClose && (hAsync("sd-ghost-button", { key: '6b53a200fdab5175b8346e1b916677a02a4ac0ad', class: "sd-floating-menu__close-button", icon: "close", ariaLabel: "close", size: "xs", onClick: () => this.handleClose() })))))));
12010
+ } }, hAsync("i", { key: '94cb19bdf7182cd311800ac4d3fdf49c61db75fb', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${this.placement}` }, hAsync(TooltipArrow, { key: '67394b2b751c485fc7198a10d54df2659c6f222b' })), hAsync("div", { key: '1d6e143a931c24f28ef68afbfe7b84e73d3288db', class: "sd-floating-menu__content" }, this.menuTitle && hAsync("div", { key: '33d47a87e6cab23131f360f7ea07809cec942ec0', class: "sd-floating-menu__title" }, this.menuTitle), this.messages.length > 0 && (hAsync("div", { key: '28006b8958d1921eefa42c6282b8e735ae3e9367', class: "sd-floating-menu__messages" }, this.messages.map(message => (hAsync("div", null, message))))), this.buttons.length > 0 && (hAsync("div", { key: '574604775790aa49591848eb5f86ca0c6735558f', class: `sd-floating-menu__buttons sd-floating-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (hAsync("sd-button", { ...button })))))), this.useClose && (hAsync("sd-ghost-button", { key: '027260d65fc575f480ce23e081b8b80ac8a1daea', class: "sd-floating-menu__close-button", icon: "close", ariaLabel: "close", size: "xs", onClick: () => this.handleClose() })))))));
11389
12011
  }
11390
12012
  static get watchers() { return {
11391
12013
  "show": [{
@@ -11430,7 +12052,7 @@ class SdPortal {
11430
12052
  parentRef = null;
11431
12053
  offset = [0, 4];
11432
12054
  viewportPadding = 0;
11433
- zIndex = 10000;
12055
+ zIndex = 998;
11434
12056
  open = false;
11435
12057
  close;
11436
12058
  container;
@@ -11476,7 +12098,7 @@ class SdPortal {
11476
12098
  position: 'absolute',
11477
12099
  top: '0',
11478
12100
  left: '0',
11479
- zIndex: (this.zIndex ?? 10000).toString(),
12101
+ zIndex: (this.zIndex ?? 998).toString(),
11480
12102
  opacity: '0',
11481
12103
  transition: 'opacity 0.15s ease-out',
11482
12104
  boxSizing: 'border-box',
@@ -11645,7 +12267,7 @@ class SdPortal {
11645
12267
  this.close.emit();
11646
12268
  }
11647
12269
  render() {
11648
- return hAsync("slot", { key: '7213237baa73430dbf3d01aeb6f7a3e5fe173ecb' });
12270
+ return hAsync("slot", { key: '394cce939280a171c13e875eaead3fbdd0163d5b' });
11649
12271
  }
11650
12272
  static get watchers() { return {
11651
12273
  "open": [{
@@ -11708,10 +12330,10 @@ class SdProgress {
11708
12330
  return this.statusColor[this.progressStatus];
11709
12331
  }
11710
12332
  render() {
11711
- return (hAsync("div", { key: '3afe47c0dd65ddb5a03c15591430febaa8947417', style: {
12333
+ return (hAsync("div", { key: 'b1c93dc549893b5a3ccef1ab9cea54ca8c9d8d44', style: {
11712
12334
  '--progress-color': this.progressColor,
11713
12335
  '--progress-percentage': `${this.progressPercentage}%`,
11714
- } }, this.type === 'bar' ? this.renderBarProgress() : this.renderSpinnerProgress(), this.label && hAsync("div", { key: 'd5bf1e43002f7b16f5b609e9b3cb7cc9d417a246', class: "sd-progress__label" }, this.label)));
12336
+ } }, this.type === 'bar' ? this.renderBarProgress() : this.renderSpinnerProgress(), this.label && hAsync("div", { key: '843cb8d0994831da375d26f0421d98dddb068128', class: "sd-progress__label" }, this.label)));
11715
12337
  }
11716
12338
  renderBarProgress() {
11717
12339
  return (hAsync("div", { class: `sd-progress__bar sd-progress__bar--${this.progressStatus}` }, hAsync("div", { class: ['sd-progress__bar__percent', this.progressPercentage < 100 ? 'proceed' : ''].join(' ') }), hAsync("div", { class: "sd-progress__bar__indicator sd-progress__bar__indicator--left" }, this.progressPercentage, "%"), hAsync("div", { class: "sd-progress__bar__indicator sd-progress__bar__indicator--right" }, this.progressPercentage, "%")));
@@ -11752,30 +12374,19 @@ const radio = {
11752
12374
  lineHeight: "20"},
11753
12375
  bg: {
11754
12376
  "default": "#FFFFFF",
11755
- disabled: "#E1E1E1"
11756
- },
11757
- unchecked: {
11758
- bg: {
11759
- hover: "#D9EAFF"
11760
- },
11761
- border: {
11762
- "default": "#AAAAAA",
11763
- hover: "#0075FF"
11764
- }
11765
- },
11766
- checked: {
11767
- border: {
11768
- "default": "#0075FF"
11769
- },
11770
- dot: {
11771
- "default": "#0075FF"
11772
- }
12377
+ disabled: "#E1E1E1",
12378
+ hover: "#D9EAFF"
11773
12379
  },
11774
12380
  border: {
12381
+ "default": "#AAAAAA",
12382
+ hover: "#0075FF",
12383
+ active: "#0075FF",
11775
12384
  disabled: "#CCCCCC"
11776
12385
  },
11777
12386
  dot: {
11778
- disabled: "#CCCCCC"
12387
+ "default": "#0075FF",
12388
+ disabled: "#CCCCCC",
12389
+ size: "10"
11779
12390
  },
11780
12391
  label: {
11781
12392
  "default": "#222222"
@@ -11789,6 +12400,7 @@ const RADIO_LAYOUT = {
11789
12400
  size: radioTokens.radio.size,
11790
12401
  borderWidth: radioTokens.radio.borderWidth,
11791
12402
  gap: radioTokens.radio.gap,
12403
+ dotSize: radioTokens.radio.dot.size,
11792
12404
  };
11793
12405
  const RADIO_TYPOGRAPHY = {
11794
12406
  fontSize: radioTokens.radio.typography.fontSize,
@@ -11798,13 +12410,13 @@ const RADIO_TYPOGRAPHY = {
11798
12410
  const RADIO_COLORS = {
11799
12411
  unchecked: {
11800
12412
  bg: radioTokens.radio.bg.default,
11801
- bgHover: radioTokens.radio.unchecked.bg.hover,
11802
- border: radioTokens.radio.unchecked.border.default,
11803
- borderHover: radioTokens.radio.unchecked.border.hover,
12413
+ bgHover: radioTokens.radio.bg.hover,
12414
+ border: radioTokens.radio.border.default,
12415
+ borderHover: radioTokens.radio.border.hover,
11804
12416
  },
11805
12417
  checked: {
11806
- border: radioTokens.radio.checked.border.default,
11807
- dot: radioTokens.radio.checked.dot.default,
12418
+ border: radioTokens.radio.border.active,
12419
+ dot: radioTokens.radio.dot.default,
11808
12420
  },
11809
12421
  disabled: {
11810
12422
  bg: radioTokens.radio.bg.disabled,
@@ -11814,7 +12426,7 @@ const RADIO_COLORS = {
11814
12426
  label: radioTokens.radio.label.default,
11815
12427
  };
11816
12428
 
11817
- const sdRadioCss = () => `sd-radio{display:inline-flex;width:fit-content;height:var(--sd-radio-line-height);line-height:0}sd-radio .sd-radio{cursor:pointer;display:inline-flex;align-items:center;gap:var(--sd-radio-gap);height:var(--sd-radio-line-height);max-height:var(--sd-radio-line-height)}sd-radio .sd-radio>input{position:absolute;width:0;height:0;opacity:0;pointer-events:none}sd-radio .sd-radio>input:focus-visible+.sd-radio__circle{box-shadow:0 0 0 2px white, 0 0 0 4px var(--sd-radio-checked-border);outline:none}sd-radio .sd-radio__circle{position:relative;width:var(--sd-radio-size);height:var(--sd-radio-size);border-radius:50%;border:var(--sd-radio-border-width) solid var(--sd-radio-unchecked-border);box-sizing:border-box;background:var(--sd-radio-unchecked-bg);display:inline-flex;flex-shrink:0}sd-radio .sd-radio__label{font-size:var(--sd-radio-font-size);font-weight:var(--sd-radio-font-weight);color:var(--sd-radio-label-color);line-height:var(--sd-radio-line-height)}sd-radio .sd-radio:hover:not(.sd-radio--disabled) .sd-radio__circle{background:var(--sd-radio-unchecked-bg-hover);border-color:var(--sd-radio-unchecked-border-hover)}sd-radio .sd-radio--checked .sd-radio__circle{border-color:var(--sd-radio-checked-border)}sd-radio .sd-radio--checked .sd-radio__circle::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:10px;height:10px;border-radius:50%;background:var(--sd-radio-checked-dot)}sd-radio .sd-radio--disabled{cursor:not-allowed}sd-radio .sd-radio--disabled .sd-radio__circle{background:var(--sd-radio-disabled-bg);border-color:var(--sd-radio-disabled-border)}sd-radio .sd-radio--disabled.sd-radio--checked .sd-radio__circle::after{background:var(--sd-radio-disabled-dot)}`;
12429
+ const sdRadioCss = () => `sd-radio{display:inline-flex;width:fit-content;height:var(--sd-radio-line-height);line-height:0}sd-radio .sd-radio{cursor:pointer;display:inline-flex;align-items:center;gap:var(--sd-radio-gap);height:var(--sd-radio-line-height);max-height:var(--sd-radio-line-height)}sd-radio .sd-radio>input{position:absolute;width:0;height:0;opacity:0;pointer-events:none}sd-radio .sd-radio>input:focus-visible+.sd-radio__circle{box-shadow:0 0 0 2px white, 0 0 0 4px var(--sd-radio-checked-border);outline:none}sd-radio .sd-radio__circle{position:relative;width:var(--sd-radio-size);height:var(--sd-radio-size);border-radius:50%;border:var(--sd-radio-border-width) solid var(--sd-radio-unchecked-border);box-sizing:border-box;background:var(--sd-radio-unchecked-bg);display:inline-flex;flex-shrink:0}sd-radio .sd-radio__label{font-size:var(--sd-radio-font-size);font-weight:var(--sd-radio-font-weight);color:var(--sd-radio-label-color);line-height:var(--sd-radio-line-height)}sd-radio .sd-radio:hover:not(.sd-radio--disabled) .sd-radio__circle{background:var(--sd-radio-unchecked-bg-hover);border-color:var(--sd-radio-unchecked-border-hover)}sd-radio .sd-radio--checked .sd-radio__circle{border-color:var(--sd-radio-checked-border)}sd-radio .sd-radio--checked .sd-radio__circle::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:var(--sd-radio-dot-size);height:var(--sd-radio-dot-size);border-radius:50%;background:var(--sd-radio-checked-dot)}sd-radio .sd-radio--disabled{cursor:not-allowed}sd-radio .sd-radio--disabled .sd-radio__circle{background:var(--sd-radio-disabled-bg);border-color:var(--sd-radio-disabled-border)}sd-radio .sd-radio--disabled.sd-radio--checked .sd-radio__circle::after{background:var(--sd-radio-disabled-dot)}`;
11818
12430
 
11819
12431
  class SdRadio {
11820
12432
  constructor(hostRef) {
@@ -11853,6 +12465,7 @@ class SdRadio {
11853
12465
  '--sd-radio-size': `${RADIO_LAYOUT.size}px`,
11854
12466
  '--sd-radio-border-width': `${RADIO_LAYOUT.borderWidth}px`,
11855
12467
  '--sd-radio-gap': `${RADIO_LAYOUT.gap}px`,
12468
+ '--sd-radio-dot-size': `${RADIO_LAYOUT.dotSize}px`,
11856
12469
  '--sd-radio-font-size': `${RADIO_TYPOGRAPHY.fontSize}px`,
11857
12470
  '--sd-radio-line-height': `${RADIO_TYPOGRAPHY.lineHeight}px`,
11858
12471
  '--sd-radio-font-weight': RADIO_TYPOGRAPHY.fontWeight,
@@ -11867,7 +12480,7 @@ class SdRadio {
11867
12480
  '--sd-radio-disabled-dot': RADIO_COLORS.disabled.dot,
11868
12481
  '--sd-radio-label-color': RADIO_COLORS.label,
11869
12482
  };
11870
- return (hAsync("label", { key: '72b116f38c66acee8e68a839c3f062293d65129c', class: this.radioClasses, style: cssVars, "aria-checked": this.isSelected ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false' }, hAsync("input", { key: 'edcf50f09c198ae3fb993706dec757fd706fe0de', type: "radio", name: String(this.val), value: String(this.val), checked: this.isSelected, disabled: this.disabled, "aria-label": this.label || String(this.val), onInput: this.handleRadioChange }), hAsync("span", { key: '49ce92b075290f8aca715466456f4b7cdf3017e2', class: "sd-radio__circle" }), this.label && hAsync("span", { key: '99d2ce0d53daf5d8ef232f6984ef42e605a68541', class: "sd-radio__label" }, this.label)));
12483
+ return (hAsync("label", { key: '2b7819249e5070a22b626530011db4a8e56194f1', class: this.radioClasses, style: cssVars, "aria-checked": this.isSelected ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false' }, hAsync("input", { key: '233699a7c3bc13708d43ca3719f61edf53836c83', type: "radio", name: String(this.val), value: String(this.val), checked: this.isSelected, disabled: this.disabled, "aria-label": this.label || String(this.val), onInput: this.handleRadioChange }), hAsync("span", { key: 'eb665c5f8c6202b66b65b6b120f144970fba0a38', class: "sd-radio__circle" }), this.label && hAsync("span", { key: '3d0db13e083bacb4cb7ace9129fcfcd61f18dfc7', class: "sd-radio__label" }, this.label)));
11871
12484
  }
11872
12485
  static get watchers() { return {
11873
12486
  "value": [{
@@ -12058,7 +12671,7 @@ class SdRadioButton {
12058
12671
  '--sd-radio-button-content-select': RADIO_BUTTON_COLORS.content.select,
12059
12672
  '--sd-radio-button-content-disabled': RADIO_BUTTON_COLORS.content.disabled,
12060
12673
  };
12061
- return (hAsync("div", { key: '05bda776e2747aca3d7fca0286e3fa4062d7669b', class: this.getGroupClasses(), style: cssVars, role: "radiogroup", "aria-disabled": this.disabled.toString() }, this.options.map(option => {
12674
+ return (hAsync("div", { key: 'f4ac83797b2661b0c2a612674911cbb0e41350a6', class: this.getGroupClasses(), style: cssVars, role: "radiogroup", "aria-disabled": this.disabled.toString() }, this.options.map(option => {
12062
12675
  const isSelected = this.isOptionSelected(option);
12063
12676
  const isDisabled = this.isOptionDisabled(option);
12064
12677
  return (hAsync("label", { key: `radio-${option.value}`, class: this.getButtonClasses(option), "aria-label": option.label || 'radio option', "data-label": option.label }, hAsync("input", { type: "radio", name: this.groupName, value: option.value.toString(), checked: isSelected, disabled: isDisabled, onInput: () => this.handleRadioChange(option.value, option.disabled) }), option.label && hAsync("span", { class: "sd-radio-button__label" }, option.label)));
@@ -12081,7 +12694,7 @@ class SdRadioButton {
12081
12694
  }; }
12082
12695
  }
12083
12696
 
12084
- const sdRadioGroupCss = () => `sd-radio{display:inline-flex;width:fit-content;height:var(--sd-radio-line-height);line-height:0}sd-radio .sd-radio{cursor:pointer;display:inline-flex;align-items:center;gap:var(--sd-radio-gap);height:var(--sd-radio-line-height);max-height:var(--sd-radio-line-height)}sd-radio .sd-radio>input{position:absolute;width:0;height:0;opacity:0;pointer-events:none}sd-radio .sd-radio>input:focus-visible+.sd-radio__circle{box-shadow:0 0 0 2px white, 0 0 0 4px var(--sd-radio-checked-border);outline:none}sd-radio .sd-radio__circle{position:relative;width:var(--sd-radio-size);height:var(--sd-radio-size);border-radius:50%;border:var(--sd-radio-border-width) solid var(--sd-radio-unchecked-border);box-sizing:border-box;background:var(--sd-radio-unchecked-bg);display:inline-flex;flex-shrink:0}sd-radio .sd-radio__label{font-size:var(--sd-radio-font-size);font-weight:var(--sd-radio-font-weight);color:var(--sd-radio-label-color);line-height:var(--sd-radio-line-height)}sd-radio .sd-radio:hover:not(.sd-radio--disabled) .sd-radio__circle{background:var(--sd-radio-unchecked-bg-hover);border-color:var(--sd-radio-unchecked-border-hover)}sd-radio .sd-radio--checked .sd-radio__circle{border-color:var(--sd-radio-checked-border)}sd-radio .sd-radio--checked .sd-radio__circle::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:10px;height:10px;border-radius:50%;background:var(--sd-radio-checked-dot)}sd-radio .sd-radio--disabled{cursor:not-allowed}sd-radio .sd-radio--disabled .sd-radio__circle{background:var(--sd-radio-disabled-bg);border-color:var(--sd-radio-disabled-border)}sd-radio .sd-radio--disabled.sd-radio--checked .sd-radio__circle::after{background:var(--sd-radio-disabled-dot)}sd-radio-group{display:inline-block}sd-radio-group .sd-radio-group{display:flex}sd-radio-group .sd-radio-group--vertical{flex-direction:column;gap:8px}sd-radio-group .sd-radio-group--horizontal{flex-direction:row;align-items:center;gap:20px}`;
12697
+ const sdRadioGroupCss = () => `sd-radio{display:inline-flex;width:fit-content;height:var(--sd-radio-line-height);line-height:0}sd-radio .sd-radio{cursor:pointer;display:inline-flex;align-items:center;gap:var(--sd-radio-gap);height:var(--sd-radio-line-height);max-height:var(--sd-radio-line-height)}sd-radio .sd-radio>input{position:absolute;width:0;height:0;opacity:0;pointer-events:none}sd-radio .sd-radio>input:focus-visible+.sd-radio__circle{box-shadow:0 0 0 2px white, 0 0 0 4px var(--sd-radio-checked-border);outline:none}sd-radio .sd-radio__circle{position:relative;width:var(--sd-radio-size);height:var(--sd-radio-size);border-radius:50%;border:var(--sd-radio-border-width) solid var(--sd-radio-unchecked-border);box-sizing:border-box;background:var(--sd-radio-unchecked-bg);display:inline-flex;flex-shrink:0}sd-radio .sd-radio__label{font-size:var(--sd-radio-font-size);font-weight:var(--sd-radio-font-weight);color:var(--sd-radio-label-color);line-height:var(--sd-radio-line-height)}sd-radio .sd-radio:hover:not(.sd-radio--disabled) .sd-radio__circle{background:var(--sd-radio-unchecked-bg-hover);border-color:var(--sd-radio-unchecked-border-hover)}sd-radio .sd-radio--checked .sd-radio__circle{border-color:var(--sd-radio-checked-border)}sd-radio .sd-radio--checked .sd-radio__circle::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:var(--sd-radio-dot-size);height:var(--sd-radio-dot-size);border-radius:50%;background:var(--sd-radio-checked-dot)}sd-radio .sd-radio--disabled{cursor:not-allowed}sd-radio .sd-radio--disabled .sd-radio__circle{background:var(--sd-radio-disabled-bg);border-color:var(--sd-radio-disabled-border)}sd-radio .sd-radio--disabled.sd-radio--checked .sd-radio__circle::after{background:var(--sd-radio-disabled-dot)}sd-radio-group{display:inline-block}sd-radio-group .sd-radio-group{display:flex}sd-radio-group .sd-radio-group--vertical{flex-direction:column;gap:8px}sd-radio-group .sd-radio-group--horizontal{flex-direction:row;align-items:center;gap:20px}`;
12085
12698
 
12086
12699
  class SdRadioGroup {
12087
12700
  constructor(hostRef) {
@@ -12110,7 +12723,7 @@ class SdRadioGroup {
12110
12723
  return classes.join(' ');
12111
12724
  }
12112
12725
  render() {
12113
- return (hAsync("div", { key: '4c34a3ab6790818e17c8452fa3233e7c720b8246', class: this.getGroupClasses(), role: "radiogroup" }, this.options.map(option => {
12726
+ return (hAsync("div", { key: '8b01aca15ce9452921f37ba648d2d47728b84f41', class: this.getGroupClasses(), role: "radiogroup" }, this.options.map(option => {
12114
12727
  return (hAsync("sd-radio", { key: `radio-${option.value}`, val: String(option.value), value: String(this.value), label: option.label, disabled: this.disabled || !!option.disabled, onSdUpdate: ({ detail }) => this.handleRadioChange(detail) }));
12115
12728
  })));
12116
12729
  }
@@ -12305,7 +12918,7 @@ class SdSelect extends BaseDropdownEvent {
12305
12918
  }
12306
12919
  };
12307
12920
  render() {
12308
- return (hAsync("sd-field", { key: 'd96961fe4c425c3f0fcb1c2f438c8b70c510b632', label: this.label, labelWidth: this.labelWidth, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, icon: this.icon, addonLabel: this.addonLabel, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el) }, hAsync("div", { key: '0113ffb76ea79cbe3b77dff85d8186a5b994e7b6', class: {
12921
+ return (hAsync("sd-field", { key: '106b7af5473549884afba275dfa86f6b354e9983', label: this.label, labelWidth: this.labelWidth, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, icon: this.icon, addonLabel: this.addonLabel, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el) }, hAsync("div", { key: 'a200ea9e7409ed3f63e6ffa967c3171712598521', class: {
12309
12922
  'sd-select': true,
12310
12923
  'sd-select--disabled': this.disabled,
12311
12924
  'sd-select--error': !!this.error,
@@ -12524,10 +13137,10 @@ class SdSelectDropdown {
12524
13137
  this.isScrolled = scrollTop > 0;
12525
13138
  };
12526
13139
  render() {
12527
- return (hAsync("div", { key: 'fdfad8ab2f1f6a26da8ad0ca0dcd17bfed7dcf9d', class: {
13140
+ return (hAsync("div", { key: '4d593edbf6e4480e171963aad54ceb2f489f189b', class: {
12528
13141
  'sd-select-dropdown': true,
12529
13142
  'sd-select-dropdown--ready': this.isDropdownReady,
12530
- }, style: this.dropdownSize, onScroll: this.handleDropdownScroll, ref: el => (this.dropdownRef = el) }, this.searchable && (hAsync("sd-select-search-input", { key: '74cfba89d85a980c6c8074150bdba91387b9c115', ref: el => (this.searchRef = el), isScrolled: this.isScrolled, searchText: this.searchText, onSdSearchInput: (event) => (this.searchText = event.detail || ''), onSdSearchFocus: () => (this.itemIndex = -1) })), this.filteredOptions.length > 0 ? (this.filteredOptions.map((option, index) => (hAsync("slot", { name: `option-${option.value}` }, hAsync("sd-select-option", { option: option, index: index, isSelected: this.isOptionSelected(option.value), isFocused: index === this.itemIndex, onOptionClick: ({ detail }) => this.optionClick.emit(detail), useCheckbox: this.useCheckbox }))))) : (hAsync("slot", { name: "option-placeholder" }, hAsync("div", { class: 'sd-select-option-placeholder' }, this.optionPlaceholder)))));
13143
+ }, style: this.dropdownSize, onScroll: this.handleDropdownScroll, ref: el => (this.dropdownRef = el) }, this.searchable && (hAsync("sd-select-search-input", { key: 'ecea9b4ba816c6b0dcc8303f957f4b297251f65c', ref: el => (this.searchRef = el), isScrolled: this.isScrolled, searchText: this.searchText, onSdSearchInput: (event) => (this.searchText = event.detail || ''), onSdSearchFocus: () => (this.itemIndex = -1) })), this.filteredOptions.length > 0 ? (this.filteredOptions.map((option, index) => (hAsync("slot", { name: `option-${option.value}` }, hAsync("sd-select-option", { option: option, index: index, isSelected: this.isOptionSelected(option.value), isFocused: index === this.itemIndex, onOptionClick: ({ detail }) => this.optionClick.emit(detail), useCheckbox: this.useCheckbox }))))) : (hAsync("slot", { name: "option-placeholder" }, hAsync("div", { class: 'sd-select-option-placeholder' }, this.optionPlaceholder)))));
12531
13144
  }
12532
13145
  static get watchers() { return {
12533
13146
  "filteredOptions": [{
@@ -12839,7 +13452,7 @@ class SdSelectGroup extends BaseDropdownEvent {
12839
13452
  });
12840
13453
  }
12841
13454
  render() {
12842
- return (hAsync("sd-field", { key: '1e6a0f9947f5d137bb65844fe666c07b4eefb2f7', label: this.label, labelWidth: this.labelWidth, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, icon: this.icon, addonLabel: this.addonLabel, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), style: { '--field-width': this.width || '200px' } }, hAsync("div", { key: '62dcd2f37c2eda0e51f2e77de36ece6ab592c4ce', class: {
13455
+ return (hAsync("sd-field", { key: 'c3d2a4365ba2594d3e0dca138ff63a335171125c', label: this.label, labelWidth: this.labelWidth, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, icon: this.icon, addonLabel: this.addonLabel, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), style: { '--field-width': this.width || '200px' } }, hAsync("div", { key: 'b527250fecc69b8f5d4c88aa3f6090c2b291efc9', class: {
12843
13456
  'sd-select-group': true,
12844
13457
  'sd-select-group--open': this.isOpen,
12845
13458
  'sd-select-group--disabled': this.disabled,
@@ -13089,7 +13702,7 @@ class SdSelectMultiple extends BaseDropdownEvent {
13089
13702
  this.handleOptionSelection(option);
13090
13703
  };
13091
13704
  render() {
13092
- return (hAsync("sd-field", { key: 'f5dda40563661955aa194d841ca89628afd496cb', label: this.label, labelWidth: this.labelWidth, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el) }, hAsync("div", { key: '81541d9adabfea7c3af1c22ed419036f56e1a353', class: {
13705
+ return (hAsync("sd-field", { key: '92f9f1efeb25431700b376300ba8f21120456a68', label: this.label, labelWidth: this.labelWidth, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el) }, hAsync("div", { key: '48adb7f279b77d1637e6a1790d1448d7d7306a7a', class: {
13093
13706
  'sd-select-multiple': true,
13094
13707
  'sd-select-multiple--open': this.isOpen,
13095
13708
  'sd-select-multiple--disabled': this.disabled,
@@ -13554,7 +14167,7 @@ class SdSelectMultipleGroup extends BaseDropdownEvent {
13554
14167
  });
13555
14168
  }
13556
14169
  render() {
13557
- return (hAsync("sd-field", { key: 'e7d00571a19a83e8d243d0c4f7433d931d4a2304', label: this.label, labelWidth: this.labelWidth, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), style: { '--field-width': this.width || '200px' } }, hAsync("div", { key: '8c7288d853fed5bb829f1ef90af5e96a512c11b3', class: {
14170
+ return (hAsync("sd-field", { key: '8e0cfc89b55809d3c5b556fc5c59077c2c952ad5', label: this.label, labelWidth: this.labelWidth, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), style: { '--field-width': this.width || '200px' } }, hAsync("div", { key: '852a713b4c38c4845c407cb04801d9b0c33f0515', class: {
13558
14171
  'sd-select-multiple-group': true,
13559
14172
  'sd-select-multiple-group--open': this.isOpen,
13560
14173
  'sd-select-multiple-group--disabled': this.disabled,
@@ -13688,7 +14301,7 @@ class SdSelectOption {
13688
14301
  }
13689
14302
  };
13690
14303
  render() {
13691
- return (hAsync("div", { key: '1366665f3ca8c37b23e6b6e9cfc5293c48ed5ed3', class: {
14304
+ return (hAsync("div", { key: '02e314232067bfb8f9bd882c01ae1462fa492cbf', class: {
13692
14305
  'sd-select__option': true,
13693
14306
  'sd-select__option--selected': this.isSelected,
13694
14307
  'sd-select__option--disabled': !!this.option.disabled,
@@ -13774,7 +14387,7 @@ class SdSelectOptionGroup {
13774
14387
  }
13775
14388
  };
13776
14389
  render() {
13777
- return (hAsync("div", { key: 'c1dd7d0232fff281261792ecb2137a1f09bc364d', class: {
14390
+ return (hAsync("div", { key: '748c32883a0262612daf9bafc0617563c77254f8', class: {
13778
14391
  'sd-select__option-group': true,
13779
14392
  'sd-select__option-group--selected': !!this.isSelected,
13780
14393
  'sd-select__option-group--disabled': !!this.option.disabled,
@@ -13783,10 +14396,10 @@ class SdSelectOptionGroup {
13783
14396
  'sd-select__option-group--group': this.option.type === 'group',
13784
14397
  'sd-select__option-group--subgroup': this.option.type === 'subgroup',
13785
14398
  'sd-select__option-group--item': this.option.type === 'item',
13786
- }, onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), style: this.optionStyle, "data-index": this.index, onClick: event => this.handleClick(this.option, this.isSelected, event) }, hAsync("div", { key: 'a8ce6f2c13ea558413e61426dfbaa75e616f5687', class: "sd-select__option-group__label-wrapper" }, this.useCheckbox && (hAsync("sd-checkbox", { key: '3c53ea6005aa1288a4eae148bd9d6ed4573f0404', value: this.isSelected, disabled: this.option.disabled, onClick: e => {
14399
+ }, onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), style: this.optionStyle, "data-index": this.index, onClick: event => this.handleClick(this.option, this.isSelected, event) }, hAsync("div", { key: '5a8f15864a69887a7d2e2ec5b18b96b1f7bde809', class: "sd-select__option-group__label-wrapper" }, this.useCheckbox && (hAsync("sd-checkbox", { key: '202f92f4aac644802a58354d08b29451c9af863f', value: this.isSelected, disabled: this.option.disabled, onClick: e => {
13787
14400
  e.preventDefault();
13788
14401
  this.handleClick(this.option, this.isSelected, e);
13789
- } })), hAsync("span", { key: 'c28aea2bf78120a42d6884c322cc2cf77713a6cb', class: "sd-select__option-group-label" }, this.option.label), this.useIndicator && this.option.type !== 'item' && (hAsync("span", { key: '6a51641a8c9da9957f1428a721de9ce2a1a2a86b', class: "sd-select__option-group__count-indicator" }, `(${this.countInfo?.selectedCount}/${this.countInfo?.totalCount})`)))));
14402
+ } })), hAsync("span", { key: 'f9dc667e7d251a5efcf7391ec4f533a5e21276c9', class: "sd-select__option-group-label" }, this.option.label), this.useIndicator && this.option.type !== 'item' && (hAsync("span", { key: '2cd863d5bbdb1a9b5312c6eb7aa3be08a2093460', class: "sd-select__option-group__count-indicator" }, `(${this.countInfo?.selectedCount}/${this.countInfo?.totalCount})`)))));
13790
14403
  }
13791
14404
  static get style() { return sdSelectOptionGroupCss(); }
13792
14405
  static get cmpMeta() { return {
@@ -13835,17 +14448,17 @@ class SdSelectSearchInput {
13835
14448
  input?.focus({ preventScroll: true });
13836
14449
  }
13837
14450
  render() {
13838
- return (hAsync("div", { key: '36003b7e0e7d8a3df224b18257d4d6b1712d47da', class: {
14451
+ return (hAsync("div", { key: '2629fd8c13f67bc89c3b66f5f8aa14f2fb2e5fcd', class: {
13839
14452
  'sd-select-search-input': true,
13840
14453
  'sd-select-search-input--scrolled': !!this.isScrolled,
13841
- }, onClick: event => event.stopPropagation() }, hAsync("sd-input", { key: '3b6f80d033a7903cb8e3692a2eebe0ab991e8d68', ref: el => (this.searchRef = el), value: this.searchText, placeholder: "\uAC80\uC0C9", clearable: true, inputStyle: { 'padding-left': '8px' }, autofocus: true, onSdUpdate: event => {
14454
+ }, onClick: event => event.stopPropagation() }, hAsync("sd-input", { key: 'f49cccdb49d0b2b861b0836dd654b7ab353b48ce', ref: el => (this.searchRef = el), value: this.searchText, placeholder: "\uAC80\uC0C9", clearable: true, inputStyle: { 'padding-left': '8px' }, autofocus: true, onSdUpdate: event => {
13842
14455
  this.searchInput.emit(String(event?.detail));
13843
14456
  }, onSdFocus: () => {
13844
14457
  this.searchFocus.emit();
13845
14458
  }, onKeyDown: event => {
13846
14459
  if (event.code === 'Enter')
13847
14460
  event.stopPropagation();
13848
- } }, hAsync("sd-icon", { key: '7c453e87ba6b384c5be7bb142697ba43c0d1a20b', name: "search", size: 16, color: "#737373", style: { marginRight: '4px' }, slot: "prefix" }))));
14461
+ } }, hAsync("sd-icon", { key: '773f5638821c73c20435f747c3dea5b6684b89eb', name: "search", size: 16, color: "#737373", style: { marginRight: '4px' }, slot: "prefix" }))));
13849
14462
  }
13850
14463
  static get style() { return sdSelectSearchInputCss(); }
13851
14464
  static get cmpMeta() { return {
@@ -14077,13 +14690,13 @@ class SdSelectV2 {
14077
14690
  this.closeDropdown();
14078
14691
  },
14079
14692
  };
14080
- return (hAsync("sd-field", { key: 'c9f08598c8f9852ab4000f056621dfef238e16de', name: this.fieldName || this.internalName, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, onMouseEnter: () => {
14693
+ return (hAsync("sd-field", { key: 'ffca1287cefaeedf867a6b86a752942a1c8d1703', name: this.fieldName || this.internalName, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, onMouseEnter: () => {
14081
14694
  this.hovered = true;
14082
14695
  }, onMouseLeave: () => {
14083
14696
  this.hovered = false;
14084
- } }, hAsync("div", { key: '302103a425963e5d577b01ad179d5af82e6f30b1', class: "sd-select-v2", ref: el => {
14697
+ } }, hAsync("div", { key: 'f53f38543b165040eb48236e2a25e43b78444350', class: "sd-select-v2", ref: el => {
14085
14698
  this.triggerRef = el;
14086
- } }, hAsync("sd-select-v2-trigger", { key: 'a22bca400e5d10ee29e569da04d36b9291a1dade', displayText: this.displayText, placeholder: this.placeholder, disabled: this.disabled, isOpen: this.isOpen, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (hAsync("sd-portal", { key: '0df4ad35bb284298708a0c1e11ce0e3c28d16ed8', ...portalProps }, hAsync("sd-select-v2-listbox", { key: '90c18612d553342be091a30e05194bab91407c76', name: this.name, options: this.options, value: this.value, emitValue: this.emitValue, triggerWidth: this.triggerWidth, maxWidth: this.resolvedMaxDropdownWidth, maxHeight: this.resolvedDropdownHeight, onSdOptionSelect: event => this.handleOptionSelect(event.detail) })))));
14699
+ } }, hAsync("sd-select-v2-trigger", { key: 'afd60ef0b492d9179318a5187565b45a58ef1ed5', displayText: this.displayText, placeholder: this.placeholder, disabled: this.disabled, isOpen: this.isOpen, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (hAsync("sd-portal", { key: 'e482c1fffc24e893fe1c04f136a116bac6c1b2e9', ...portalProps }, hAsync("sd-select-v2-listbox", { key: 'c864fdef604eee7cea7c946de970e78b59e8b0da', name: this.name, options: this.options, value: this.value, emitValue: this.emitValue, triggerWidth: this.triggerWidth, maxWidth: this.resolvedMaxDropdownWidth, maxHeight: this.resolvedDropdownHeight, onSdOptionSelect: event => this.handleOptionSelect(event.detail) })))));
14087
14700
  }
14088
14701
  static get watchers() { return {
14089
14702
  "isOpen": [{
@@ -14158,9 +14771,13 @@ const listItem = {
14158
14771
  depth3: "28"
14159
14772
  },
14160
14773
  typography: {
14161
- fontWeight: "400",
14162
- fontSize: "12",
14163
- lineHeight: "20"},
14774
+ "default": {
14775
+ fontWeight: "400",
14776
+ fontSize: "12",
14777
+ lineHeight: "20"},
14778
+ selected: {
14779
+ fontWeight: "700"}
14780
+ },
14164
14781
  bg: {
14165
14782
  "default": "#FFFFFF",
14166
14783
  hover: "#0075FF"
@@ -14168,7 +14785,8 @@ const listItem = {
14168
14785
  content: {
14169
14786
  "default": "#222222",
14170
14787
  hover: "#FFFFFF",
14171
- disabled: "#888888"
14788
+ disabled: "#888888",
14789
+ selected: "#0075FF"
14172
14790
  },
14173
14791
  depth1: {
14174
14792
  bg: {
@@ -14186,9 +14804,7 @@ var listItemTokens = {
14186
14804
  };
14187
14805
 
14188
14806
  const listBox = {
14189
- radius: "4",
14190
- paddingBottom: "4"
14191
- };
14807
+ radius: "4"};
14192
14808
  var listBoxTokens = {
14193
14809
  listBox: listBox
14194
14810
  };
@@ -14224,9 +14840,10 @@ const LIST_ITEM_LAYOUT = {
14224
14840
  gap: listItemTokens.listItem.gap,
14225
14841
  };
14226
14842
  const LIST_ITEM_TYPOGRAPHY = {
14227
- fontSize: listItemTokens.listItem.typography.fontSize,
14228
- lineHeight: listItemTokens.listItem.typography.lineHeight,
14229
- fontWeight: listItemTokens.listItem.typography.fontWeight,
14843
+ fontSize: listItemTokens.listItem.typography.default.fontSize,
14844
+ lineHeight: listItemTokens.listItem.typography.default.lineHeight,
14845
+ fontWeight: listItemTokens.listItem.typography.default.fontWeight,
14846
+ selectedFontWeight: listItemTokens.listItem.typography.selected.fontWeight,
14230
14847
  };
14231
14848
  const LIST_ITEM_COLORS = {
14232
14849
  bg: {
@@ -14237,6 +14854,7 @@ const LIST_ITEM_COLORS = {
14237
14854
  default: listItemTokens.listItem.content.default,
14238
14855
  hover: listItemTokens.listItem.content.hover,
14239
14856
  disabled: listItemTokens.listItem.content.disabled,
14857
+ selected: listItemTokens.listItem.content.selected,
14240
14858
  },
14241
14859
  depth1: {
14242
14860
  bg: listItemTokens.listItem.depth1.bg.default,
@@ -14249,7 +14867,6 @@ const LIST_ITEM_COLORS = {
14249
14867
  // ── ListBox Tokens ──
14250
14868
  const LIST_BOX_LAYOUT = {
14251
14869
  radius: listBoxTokens.listBox.radius,
14252
- paddingBottom: listBoxTokens.listBox.paddingBottom,
14253
14870
  };
14254
14871
  // ── Constants ──
14255
14872
  const SEARCH_THRESHOLD = 11;
@@ -14289,7 +14906,7 @@ function filterTree(options, keyword) {
14289
14906
  }, []);
14290
14907
  }
14291
14908
 
14292
- const sdSelectV2ListItemCss = () => `sd-select-v2-list-item{display:block}sd-select-v2-list-item .sd-select-v2-list-item{display:flex;align-items:center;gap:var(--list-item-gap);padding:var(--list-item-padding-y) var(--list-item-padding-right) var(--list-item-padding-y) var(--list-item-padding-left);font-size:var(--list-item-font-size);line-height:var(--list-item-line-height);font-weight:var(--list-item-font-weight);background:var(--list-item-bg);color:var(--list-item-color);cursor:default;user-select:none}sd-select-v2-list-item .sd-select-v2-list-item--selectable{cursor:pointer}sd-select-v2-list-item .sd-select-v2-list-item--depth1-group{border-top:var(--list-item-border-top);font-weight:700}sd-select-v2-list-item .sd-select-v2-list-item--depth2-group{font-weight:500}sd-select-v2-list-item .sd-select-v2-list-item--focused.sd-select-v2-list-item--selectable:not(.sd-select-v2-list-item--disabled){background:var(--list-item-bg-hover);color:var(--list-item-color-hover)}sd-select-v2-list-item .sd-select-v2-list-item--selected:not(.sd-select-v2-list-item--group){font-weight:700;color:var(--list-item-bg-hover)}sd-select-v2-list-item .sd-select-v2-list-item--selected.sd-select-v2-list-item--focused{color:var(--list-item-color-hover)}sd-select-v2-list-item .sd-select-v2-list-item--disabled{color:var(--list-item-color-disabled);cursor:not-allowed}sd-select-v2-list-item .sd-select-v2-list-item__label{flex:0 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}sd-select-v2-list-item .sd-select-v2-list-item__count{flex-shrink:0;font-weight:500;color:var(--list-item-color-disabled)}sd-select-v2-list-item .sd-select-v2-list-item--group.sd-select-v2-list-item--focused .sd-select-v2-list-item__count{color:#ffffff}sd-select-v2-list-item .sd-select-v2-list-item__checkbox{flex-shrink:0}`;
14909
+ const sdSelectV2ListItemCss = () => `sd-select-v2-list-item{display:block}sd-select-v2-list-item .sd-select-v2-list-item{display:flex;align-items:center;gap:var(--list-item-gap);padding:var(--list-item-padding-y) var(--list-item-padding-right) var(--list-item-padding-y) var(--list-item-padding-left);font-size:var(--list-item-font-size);line-height:var(--list-item-line-height);font-weight:var(--list-item-font-weight);background:var(--list-item-bg);color:var(--list-item-color);cursor:default;user-select:none}sd-select-v2-list-item .sd-select-v2-list-item--selectable{cursor:pointer}sd-select-v2-list-item .sd-select-v2-list-item--depth1-group{border-top:var(--list-item-border-top);font-weight:700}sd-select-v2-list-item .sd-select-v2-list-item--depth2-group{font-weight:500}sd-select-v2-list-item .sd-select-v2-list-item--focused.sd-select-v2-list-item--selectable:not(.sd-select-v2-list-item--disabled){background:var(--list-item-bg-hover);color:var(--list-item-color-hover)}sd-select-v2-list-item .sd-select-v2-list-item--selected:not(.sd-select-v2-list-item--group){font-weight:var(--list-item-font-weight-selected);color:var(--list-item-color-selected)}sd-select-v2-list-item .sd-select-v2-list-item--selected.sd-select-v2-list-item--focused{color:var(--list-item-color-hover)}sd-select-v2-list-item .sd-select-v2-list-item--disabled{color:var(--list-item-color-disabled);cursor:not-allowed}sd-select-v2-list-item .sd-select-v2-list-item__label{flex:0 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}sd-select-v2-list-item .sd-select-v2-list-item__count{flex-shrink:0;font-weight:500;color:var(--list-item-color-disabled)}sd-select-v2-list-item .sd-select-v2-list-item--group.sd-select-v2-list-item--focused .sd-select-v2-list-item__count{color:#ffffff}sd-select-v2-list-item .sd-select-v2-list-item__checkbox{flex-shrink:0}`;
14293
14910
 
14294
14911
  class SdSelectV2ListItem {
14295
14912
  constructor(hostRef) {
@@ -14355,11 +14972,13 @@ class SdSelectV2ListItem {
14355
14972
  '--list-item-color': LIST_ITEM_COLORS.content.default,
14356
14973
  '--list-item-color-hover': LIST_ITEM_COLORS.content.hover,
14357
14974
  '--list-item-color-disabled': LIST_ITEM_COLORS.content.disabled,
14975
+ '--list-item-color-selected': LIST_ITEM_COLORS.content.selected,
14976
+ '--list-item-font-weight-selected': LIST_ITEM_TYPOGRAPHY.selectedFontWeight,
14358
14977
  };
14359
14978
  if (isDepth1Group) {
14360
14979
  cssVars['--list-item-border-top'] = `${LIST_ITEM_COLORS.depth1.borderWidth}px solid ${LIST_ITEM_COLORS.depth1.border}`;
14361
14980
  }
14362
- return (hAsync("div", { key: '2c6431785cccc79e4ce7eb0252877f18e799bb03', class: {
14981
+ return (hAsync("div", { key: 'ad8ea94f02d9e114915e4115237aed32d89e93d9', class: {
14363
14982
  'sd-select-v2-list-item': true,
14364
14983
  'sd-select-v2-list-item--group': isGroup,
14365
14984
  'sd-select-v2-list-item--depth1-group': isDepth1Group,
@@ -14369,7 +14988,7 @@ class SdSelectV2ListItem {
14369
14988
  'sd-select-v2-list-item--focused': this.isFocused,
14370
14989
  'sd-select-v2-list-item--selectable': this.isSelectable && !this.option.disabled,
14371
14990
  'sd-select-v2-list-item--disabled': !!this.option.disabled,
14372
- }, style: cssVars, onClick: this.handleClick }, this.useCheckbox && (hAsync("sd-checkbox", { key: '88751dff8393de63ff2762bf6a52f685b478cbe2', value: this.isSelected === null ? null : !!this.isSelected, disabled: this.option.disabled, inverse: this.isFocused && this.isSelected !== false, class: "sd-select-v2-list-item__checkbox", onClick: this.handleCheckboxClick, onSdUpdate: this.handleCheckboxUpdate })), hAsync("span", { key: '09d711dbd6181ac2da194813cd8d298061428c8e', class: "sd-select-v2-list-item__label" }, this.option.label), this.countInfo && (hAsync("span", { key: '8d0e113be506cfefa1994ee8a43efa7b6f09c707', class: "sd-select-v2-list-item__count" }, "(", this.countInfo.selected, "/", this.countInfo.total, ")"))));
14991
+ }, style: cssVars, onClick: this.handleClick }, this.useCheckbox && (hAsync("sd-checkbox", { key: 'c3c5be89457efbd465ebcb89e304aaefaa85e245', value: this.isSelected === null ? null : !!this.isSelected, disabled: this.option.disabled, inverse: this.isFocused && this.isSelected !== false, class: "sd-select-v2-list-item__checkbox", onClick: this.handleCheckboxClick, onSdUpdate: this.handleCheckboxUpdate })), hAsync("span", { key: 'ce5b528ec88cd6c862fe0df36cf1b46f054bcc0e', class: "sd-select-v2-list-item__label" }, this.option.label), this.countInfo && (hAsync("span", { key: 'e0120384115bb93819675335a574aeb072d0232c', class: "sd-select-v2-list-item__count" }, "(", this.countInfo.selected, "/", this.countInfo.total, ")"))));
14373
14992
  }
14374
14993
  static get style() { return sdSelectV2ListItemCss(); }
14375
14994
  static get cmpMeta() { return {
@@ -14437,15 +15056,15 @@ class SdSelectV2ListItemSearch {
14437
15056
  clearTimeout(this.debounceTimer);
14438
15057
  }
14439
15058
  render() {
14440
- return (hAsync("div", { key: '10f081acd51cad3b6632b2afcd5017c02fe2ed57', class: {
15059
+ return (hAsync("div", { key: '77b7f0742212b03108d5da3a1384766bc58da3ce', class: {
14441
15060
  'sd-select-v2-list-item-search': true,
14442
15061
  'sd-select-v2-list-item-search--scrolled': this.isScrolled,
14443
- } }, hAsync("div", { key: '585f29e2826841874e88ce01fa08306cffb39033', class: "sd-select-v2-list-item-search__inner" }, hAsync("sd-icon", { key: 'fe3d85e03b2e7302102babd3736e7aea0b08fcee', name: "search", size: 16, color: "grey_70", class: "sd-select-v2-list-item-search__icon" }), hAsync("input", { key: '62913d0721cf6171bc7dc52fb6548410fa87527e', ref: el => {
15062
+ } }, hAsync("div", { key: 'bf2086a00ca7924c3b13b28b056a1ee2351cce3d', class: "sd-select-v2-list-item-search__inner" }, hAsync("sd-icon", { key: '471c08d7b293003958e1e0be9c4521b8663c860b', name: "search", size: 16, color: "grey_70", class: "sd-select-v2-list-item-search__icon" }), hAsync("input", { key: 'b17d8610b73c3701711b5def9b34320156c5f554', ref: el => {
14444
15063
  this.inputEl = el;
14445
- }, type: "text", class: "sd-select-v2-list-item-search__input", placeholder: "\uAC80\uC0C9\uC5B4 \uC785\uB825", value: this.searchText, onInput: this.handleInput, onFocus: () => this.searchFocus.emit() }), hAsync("button", { key: '986ea74f6b02e65f138665f2afd19fa10f7f430a', type: "button", class: {
15064
+ }, type: "text", class: "sd-select-v2-list-item-search__input", placeholder: "\uAC80\uC0C9\uC5B4 \uC785\uB825", value: this.searchText, onInput: this.handleInput, onFocus: () => this.searchFocus.emit() }), hAsync("button", { key: '5b8c48df700862476b37b7c24741ee0f9b284c02', type: "button", class: {
14446
15065
  'sd-select-v2-list-item-search__clear': true,
14447
15066
  'sd-select-v2-list-item-search__clear--hidden': !this.searchText,
14448
- }, onClick: this.handleClear, tabindex: this.searchText ? 0 : -1, "aria-hidden": this.searchText ? 'false' : 'true' }, hAsync("sd-icon", { key: '344bbbb25eab6a6a3f4cce5cde8d9a10e9b13f25', name: "close", size: 12, color: "#888888" })))));
15067
+ }, onClick: this.handleClear, tabindex: this.searchText ? 0 : -1, "aria-hidden": this.searchText ? 'false' : 'true' }, hAsync("sd-icon", { key: 'cbcec76b7eb4e400e7154cc652512a36c0660d45', name: "close", size: 12, color: "#888888" })))));
14449
15068
  }
14450
15069
  static get style() { return sdSelectV2ListItemSearchCss(); }
14451
15070
  static get cmpMeta() { return {
@@ -14462,7 +15081,7 @@ class SdSelectV2ListItemSearch {
14462
15081
  }; }
14463
15082
  }
14464
15083
 
14465
- const sdSelectV2ListboxCss = () => `sd-select-v2-listbox{display:block}sd-select-v2-listbox .sd-select-v2-listbox{display:flex;flex-direction:column;width:var(--listbox-trigger-width);max-width:var(--listbox-max-width);max-height:var(--listbox-max-height);border-radius:var(--listbox-radius);background:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);overflow:hidden;outline:none}sd-select-v2-listbox .sd-select-v2-listbox__list{flex:1;min-height:0;overflow-y:auto;padding-bottom:var(--listbox-padding-bottom)}sd-select-v2-listbox .sd-select-v2-listbox__empty{padding:12px;text-align:center;font-size:12px;line-height:20px;color:#888888}`;
15084
+ const sdSelectV2ListboxCss = () => `:host{display:block}:host .sd-select-v2-listbox{display:flex;flex-direction:column;width:var(--listbox-trigger-width);max-width:var(--listbox-max-width);max-height:var(--listbox-max-height);border-radius:var(--listbox-radius);background:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);overflow:hidden;outline:none}:host .sd-select-v2-listbox__list{flex:1;min-height:0;overflow-y:auto;padding-bottom:0}:host .sd-select-v2-listbox__empty{padding:12px;text-align:center;font-size:12px;line-height:20px;color:#888888}`;
14466
15085
 
14467
15086
  class SdSelectV2Listbox {
14468
15087
  constructor(hostRef) {
@@ -14749,9 +15368,8 @@ class SdSelectV2Listbox {
14749
15368
  '--listbox-max-width': this.maxWidth,
14750
15369
  '--listbox-max-height': this.maxHeight,
14751
15370
  '--listbox-radius': `${LIST_BOX_LAYOUT.radius}px`,
14752
- '--listbox-padding-bottom': `${LIST_BOX_LAYOUT.paddingBottom}px`,
14753
15371
  };
14754
- return (hAsync("div", { key: 'd3f41c72aa6d013efff695f2435e72482f25a28f', class: "sd-select-v2-listbox", style: cssVars }, this.showSearch && (hAsync("sd-select-v2-list-item-search", { key: '6586d230d0eb3466cf30d644b3ebe94482e91847', isScrolled: this.isScrolled, onSdSearchFilter: this.handleSearchFilter })), hAsync("div", { key: '9de0cfc6d458f48a3770fa61dfc019411cfd96bb', class: "sd-select-v2-listbox__list", onScroll: this.handleScroll, ref: el => {
15372
+ return (hAsync("div", { key: 'ca3d529a4a20f394de1358cc0627c730843a8cf9', class: "sd-select-v2-listbox", style: cssVars }, this.showSearch && (hAsync("sd-select-v2-list-item-search", { key: 'e7c421d676c6a94cc31b0df69a489818b26563e3', isScrolled: this.isScrolled, onSdSearchFilter: this.handleSearchFilter })), hAsync("div", { key: 'f3f44e6df1fc8faf71c607cc0efb0d891dcbfb3d', class: "sd-select-v2-listbox__list", onScroll: this.handleScroll, ref: el => {
14755
15373
  this.listEl = el;
14756
15374
  } }, this.isEmpty ? (hAsync("div", { class: "sd-select-v2-listbox__empty" }, EMPTY_MESSAGE)) : this.isDepth ? (this.renderOptions(this.filteredOptions)) : (this.filteredOptions.map(option => (hAsync("sd-select-v2-list-item", { option: option, depth: 1, isSelected: this.isOptionSelected(option), isFocused: this.isOptionFocused(option), useCheckbox: this.isMulti, onSdListItemClick: this.handleOptionClick, onMouseEnter: () => this.handleOptionHover(option) })))))));
14757
15375
  }
@@ -14762,7 +15380,7 @@ class SdSelectV2Listbox {
14762
15380
  }; }
14763
15381
  static get style() { return sdSelectV2ListboxCss(); }
14764
15382
  static get cmpMeta() { return {
14765
- "$flags$": 512,
15383
+ "$flags$": 521,
14766
15384
  "$tagName$": "sd-select-v2-listbox",
14767
15385
  "$members$": {
14768
15386
  "name": [1],
@@ -14816,11 +15434,11 @@ class SdSelectV2Trigger {
14816
15434
  ? SELECT_COLORS.icon.disabled
14817
15435
  : SELECT_COLORS.icon.default,
14818
15436
  };
14819
- return (hAsync("div", { key: '906bfdacc9ec8028d61335dd8a6eb9fa887ccd2d', class: {
15437
+ return (hAsync("div", { key: '4b3f60a4bd00423337ebd472a628bc67f0a5d55c', class: {
14820
15438
  'sd-select-v2-trigger': true,
14821
15439
  'sd-select-v2-trigger--open': this.isOpen,
14822
15440
  'sd-select-v2-trigger--disabled': this.disabled,
14823
- }, style: cssVars, onClick: this.handleClick }, hAsync("div", { key: '3688fb32fbc996ce423a92007d1208b950f7baba', class: "sd-select-v2-trigger__content" }, hAsync("span", { key: '1c38cf28cb536aa93541e1bfd0b3736ba8b59782', class: "sd-select-v2-trigger__text" }, hasValue ? this.displayText : this.placeholder), hAsync("sd-icon", { key: '9bfc7681e142766eeaa42dd801c8ff88dec61861', name: "chevronDown", size: 12, color: "var(--trigger-icon-color)", class: {
15441
+ }, style: cssVars, onClick: this.handleClick }, hAsync("div", { key: '8a6f9aa132aa6db4ba9035b3b97f91b4f29fa475', class: "sd-select-v2-trigger__content" }, hAsync("span", { key: '3fb8fa054682eefc604623da9ecb906581cf1661', class: "sd-select-v2-trigger__text" }, hasValue ? this.displayText : this.placeholder), hAsync("sd-icon", { key: 'c6ae918c442452018513a144a6f14613a49dedd4', name: "chevronDown", size: 12, color: "var(--trigger-icon-color)", class: {
14824
15442
  'sd-select-v2-trigger__icon': true,
14825
15443
  'sd-select-v2-trigger__icon--open': this.isOpen,
14826
15444
  } }))));
@@ -14941,7 +15559,7 @@ class SdSwitch {
14941
15559
  '--sd-switch-line-height': `${SWITCH_TYPOGRAPHY.lineHeight}px`,
14942
15560
  '--sd-switch-text-decoration': SWITCH_TYPOGRAPHY.textDecoration,
14943
15561
  };
14944
- return (hAsync("label", { key: '44ff8ae899d3f1d7f20df43cab5ceb0987d0dab3', "aria-label": this.label || 'switch', class: this.switchClasses, style: cssVars }, hAsync("input", { key: 'c7bd9e8ab470c575a52c33b482f83e0113917fda', type: "checkbox", checked: this.value, disabled: this.disabled, onInput: this.handleChange }), hAsync("div", { key: '604c57baaea22b389e0d19b2c8a06421ab44063e', class: "sd-switch__track" }, hAsync("div", { key: 'a9329987d6c2295a90fe6b4904eeea98b075b30c', class: "sd-switch__knob" })), this.label && hAsync("span", { key: '77cab17a2dbab5245f26c218a8b60f956770e316', class: "sd-switch__label" }, this.label)));
15562
+ return (hAsync("label", { key: '730eacd9dbc035c76ff99396caf13b37ecc19c86', "aria-label": this.label || 'switch', class: this.switchClasses, style: cssVars }, hAsync("input", { key: '2cb2e4ba617d6f9f2d86a56ac6cc134a43cd1594', type: "checkbox", checked: this.value, disabled: this.disabled, onInput: this.handleChange }), hAsync("div", { key: 'b67a6243d2af4b89e433e44047da3336e87da9f9', class: "sd-switch__track" }, hAsync("div", { key: 'a99cf1e298cd3ed474cb7f94a48332475fe68641', class: "sd-switch__knob" })), this.label && hAsync("span", { key: '084960a8dce47c47b17f807aa46acea3a08aa53b', class: "sd-switch__label" }, this.label)));
14945
15563
  }
14946
15564
  static get style() { return sdSwitchCss(); }
14947
15565
  static get cmpMeta() { return {
@@ -15489,24 +16107,24 @@ class SdTable {
15489
16107
  }
15490
16108
  render() {
15491
16109
  const resolvedTableId = this.getResolvedTableId();
15492
- return (hAsync(Host, { key: 'dd25a84ce29a197a7e853d1812ce0f0fbdf043bd' }, hAsync("div", { key: '8b256e995d55c36ff9622148054911fcbe8aa89b', class: "sd-table__container", style: {
16110
+ return (hAsync(Host, { key: 'd2a43d075579bf4ffc53949fb074afaf9987113d' }, hAsync("div", { key: '3e6b69b3ab38281c1763ab779d66b0916b2cb295', class: "sd-table__container", style: {
15493
16111
  '--table-width': this.width,
15494
16112
  '--table-height': this.height,
15495
16113
  '--table-container-height': `calc(${this.height || '100%'} - ${this.pagination && this.rowCount > 0 && !this.useVirtualScroll ? 48 : 0}px)`,
15496
- } }, hAsync("div", { key: 'b4949fed8c50b93bcddace22978aff358ea7c210', class: {
16114
+ } }, hAsync("div", { key: '60ac7f5d53cdfbb0225dd3ed57be4788e6b7ff2b', class: {
15497
16115
  'sd-table__clip': true,
15498
16116
  'sd-table__clip--has-pagination': !!(this.pagination &&
15499
16117
  this.pagination.rowsPerPage > 0 &&
15500
16118
  this.rowCount > 0 &&
15501
16119
  !this.useVirtualScroll),
15502
- } }, hAsync("div", { key: '5fcceeb27568afdd367e7dbf2886fcbd107089c5', class: {
16120
+ } }, hAsync("div", { key: 'ea4144995650e283bf62de067fe792e1b7d90eb1', class: {
15503
16121
  'sd-table__wrapper': true,
15504
16122
  'sd-table__wrapper--loading': this.isLoading,
15505
16123
  'sd-table__wrapper--no-data': this.rowCount === 0 && !this.isLoading,
15506
- } }, this.isLoading && (hAsync("div", { key: 'edabfb6b601cfad985e3b8614d603f2df1da8f98', class: "sd-table__loading", style: { top: `${this.loadingScrollTop}px` } }, hAsync("sd-circle-progress", { key: '40de9b2b97407523d1b02b97f208682e4946be66', indeterminate: true }))), this.rowCount === 0 && !this.isLoading && (hAsync("div", { key: 'fe0d54f45a2a0a8ca1cc6552a42c7725ecd84c99', class: "sd-table__no-data" }, hAsync("slot", { key: 'f64d232d1b3bd69d7c43a5170d06e73cbc586226', name: "no-data" }, hAsync("span", { key: '71f5dcf2e5af2403032bdefd19a3cc4793a823e9' }, this.resolvedNoDataLabel)))), hAsync("table", { key: 'e32c9f96523db174a57efffa584237836a67214a', class: this.tableClasses }, hAsync("slot", { key: 'ce5e49454ac9044d6b3fcf3ac51809bb1e5465f8', name: `${resolvedTableId}-head`, onSlotchange: this.handleStructureSlotChange }), hAsync("slot", { key: '800b45ddc05aac02cf8827b31beca5d0f363b55f', name: `${resolvedTableId}-body`, onSlotchange: this.handleStructureSlotChange })))), this.pagination &&
16124
+ } }, this.isLoading && (hAsync("div", { key: '36fd919bbf313d4d5a62d657223ce7e68bd7678d', class: "sd-table__loading", style: { top: `${this.loadingScrollTop}px` } }, hAsync("sd-circle-progress", { key: '5854fbf9090072e1caf5d4a497fe35403c4c8c21', indeterminate: true }))), this.rowCount === 0 && !this.isLoading && (hAsync("div", { key: '210bc0045bacd05d4134f96716f74c5893c494dd', class: "sd-table__no-data" }, hAsync("slot", { key: 'a2aabac27057d00a6352230d23a9c776a99818b5', name: "no-data" }, hAsync("span", { key: 'd030f9abc7bc3afd8cb70433513a8875ae3eecb2' }, this.resolvedNoDataLabel)))), hAsync("table", { key: '731208435f8e018b74f2a0670e4c4f68f4c7fd58', class: this.tableClasses }, hAsync("slot", { key: 'd12bbe4ed17e9c0d781c50c6b4161c7bddec3480', name: `${resolvedTableId}-head`, onSlotchange: this.handleStructureSlotChange }), hAsync("slot", { key: '555d63d8f0ad56d49bcc09451b893e05cc7110cd', name: `${resolvedTableId}-body`, onSlotchange: this.handleStructureSlotChange })))), this.pagination &&
15507
16125
  this.pagination.rowsPerPage > 0 &&
15508
16126
  this.rowCount > 0 &&
15509
- !this.useVirtualScroll && (hAsync("div", { key: 'ea2afbe59f7b249d3f4e9d9763ab402438e47008', class: "sd-table__pagination" }, hAsync("sd-pagination", { key: 'a64223b9d2374142cbf12ec582e580f1b9f8f8dc', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onSdPageChange: (e) => this.changePage(e.detail) }), this.useRowsPerPageSelect && (hAsync("sd-select-v2", { key: '597cd596ac0ce2752ab6fc792887ce447c863eb8', value: this.useInternalPagination
16127
+ !this.useVirtualScroll && (hAsync("div", { key: '83b1c554f574013c8a93707f99d4224c581d485c', class: "sd-table__pagination" }, hAsync("sd-pagination", { key: '425c036f79001e4d7f012dc528d2c2ecec25ed9b', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onSdPageChange: (e) => this.changePage(e.detail) }), this.useRowsPerPageSelect && (hAsync("sd-select-v2", { key: '1c7c6ddacdd24cfa0cef627cd8ba06fe2466d415', value: this.useInternalPagination
15510
16128
  ? this.innerRowsPerPage
15511
16129
  : this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", emitValue: true, onSdUpdate: e => {
15512
16130
  if (!this.isRowsPerPageValue(e.detail))
@@ -15647,7 +16265,7 @@ class SdTabs {
15647
16265
  return `square_xs_${color}`;
15648
16266
  }
15649
16267
  render() {
15650
- return (hAsync("div", { key: '3ac46ee8a763ba5a4a566fb25d4e32366ff8288b', class: this.getContainerClasses() }, this.tabs.map((tab, index) => {
16268
+ return (hAsync("div", { key: '62ace36515932f8889fc35121b6a8cf98fd9a314', class: this.getContainerClasses() }, this.tabs.map((tab, index) => {
15651
16269
  const badgeName = this.getBadgeName(tab);
15652
16270
  return (hAsync("div", { key: `tab-${index}`, class: this.getTabClasses(tab), "aria-label": tab.label || 'tab', onClick: () => this.handleTabClick(tab.value) }, hAsync("span", { "data-label": tab.label, class: "sd-tabs__label" }, tab.label), tab.badge && hAsync("sd-tag", { name: badgeName, label: tab.badge.toString() })));
15653
16271
  })));
@@ -15843,7 +16461,7 @@ class SdTag {
15843
16461
  render() {
15844
16462
  const config = this.resolvedConfig;
15845
16463
  const iconNode = this.renderIcon(config.icon, config.iconSize);
15846
- return (hAsync("span", { key: '773056b7cd351f05ec4c4b9fed8db790a8ab83d0', class: "sd-tag", style: {
16464
+ return (hAsync("span", { key: '3e3bf735f8d832e75f1061eac69ccd8972b9f40f', class: "sd-tag", style: {
15847
16465
  '--sd-tag-background': config.background,
15848
16466
  '--sd-tag-content': config.content,
15849
16467
  '--sd-tag-height': config.height,
@@ -15853,7 +16471,7 @@ class SdTag {
15853
16471
  '--sd-tag-font-weight': config.fontWeight,
15854
16472
  '--sd-tag-line-height': config.lineHeight,
15855
16473
  '--sd-tag-radius': config.radius,
15856
- }, "aria-label": this.label || 'tag' }, this.icon && this.isLeft && iconNode, hAsync("span", { key: '6271ce5e0f6cda83e668119e846a18cee3db3a16', class: "sd-tag__label" }, this.label), this.icon && !this.isLeft && iconNode));
16474
+ }, "aria-label": this.label || 'tag' }, this.icon && this.isLeft && iconNode, hAsync("span", { key: 'a06237d1d29bb64b4b830294f5385a9b9b909624', class: "sd-tag__label" }, this.label), this.icon && !this.isLeft && iconNode));
15857
16475
  }
15858
16476
  static get style() { return sdTagCss(); }
15859
16477
  static get cmpMeta() { return {
@@ -15917,7 +16535,7 @@ class SdTbody {
15917
16535
  }
15918
16536
  render() {
15919
16537
  const hasRows = this.rows.length > 0;
15920
- return (hAsync(Host, { key: 'aaa6a5a3ae24728e004c769f8652c838f852aefc', slot: `${this.tableId}-body` }, hAsync("tbody", { key: 'de2909b4fe23293abd69778aed02abdab4ee8120', class: { 'tbody': true, 'tbody--empty': !hasRows } }, hasRows ? ([
16538
+ return (hAsync(Host, { key: '82a437ddf0cb3c34877b9dbcb47b5406c20a0c0e', slot: `${this.tableId}-body` }, hAsync("tbody", { key: '0f0257720491c781eda0479fb0c08d7dffc4f734', class: { 'tbody': true, 'tbody--empty': !hasRows } }, hasRows ? ([
15921
16539
  this.topSpacerHeight > 0 && (hAsync("tr", { key: "spacer-top", class: "tbody__spacer", style: { height: `${this.topSpacerHeight}px`, display: 'block' } })),
15922
16540
  hAsync("slot", null),
15923
16541
  this.bottomSpacerHeight > 0 && (hAsync("tr", { key: "spacer-bottom", class: "tbody__spacer", style: { height: `${this.bottomSpacerHeight}px`, display: 'block' } })),
@@ -15981,7 +16599,7 @@ class SdTd {
15981
16599
  }
15982
16600
  }
15983
16601
  render() {
15984
- return (hAsync(Host, { key: '9fdf1f552785399ec47244f1d534d49070dd6fa1', class: { [`align-${this.align}`]: Boolean(this.align) } }, hAsync("slot", { key: '845eddc0d15fd8bb2f2f93e146aa8fa1eb9d194f' })));
16602
+ return (hAsync(Host, { key: 'c6ddb546268b573694b827509ebdfe74fff8a15a', class: { [`align-${this.align}`]: Boolean(this.align) } }, hAsync("slot", { key: '0b59fb8a0cfa1ef628f50496af96aa2f39fdc89a' })));
15985
16603
  }
15986
16604
  static get watchers() { return {
15987
16605
  "field": [{
@@ -16077,16 +16695,16 @@ class SdTextLink {
16077
16695
  '--sd-text-link-text-decoration': typo.textDecoration,
16078
16696
  ...(this.disabled ? { '--sd-text-link-color': TEXT_LINK_COLORS.content.disabled } : {}),
16079
16697
  };
16080
- return (hAsync("span", { key: '348dc67e12982d74cd3f8b02d8e02071ad074c3f', class: {
16698
+ return (hAsync("span", { key: 'c485091d0a9d7f8aa946ac54d96baab50bcaa3c7', class: {
16081
16699
  'sd-text-link': true,
16082
16700
  'sd-text-link--disabled': this.disabled,
16083
- }, style: cssVars, onClick: this.handleClick }, this.icon && (hAsync("sd-icon", { key: '26c20691fd307e58b59339cf3b4fc1f3aab8c668', name: this.icon, size: TEXT_LINK_LAYOUT.iconSize, color: iconColor, class: "sd-text-link__icon" })), hAsync("span", { key: 'a767802a3df9fc15f7523d811d7dc69cc77404a1', class: labelClassName }, this.label), this.useArrow && (hAsync("span", { key: 'a831f73d04cdfb970dcb78740889b6c5b242b880', class: "sd-text-link__arrow", style: {
16701
+ }, style: cssVars, onClick: this.handleClick }, this.icon && (hAsync("sd-icon", { key: '98a2df9a2ba9b5d77eb73c0989cdf38383cfcd15', name: this.icon, size: TEXT_LINK_LAYOUT.iconSize, color: iconColor, class: "sd-text-link__icon" })), hAsync("span", { key: '3c6867611e0d970855897b06f7e9368a8588ff76', class: labelClassName }, this.label), this.useArrow && (hAsync("span", { key: '460bebf92782560d64e41b47ea9ef42b66cc08c0', class: "sd-text-link__arrow", style: {
16084
16702
  width: `${TEXT_LINK_LAYOUT.arrowFrame}px`,
16085
16703
  height: `${TEXT_LINK_LAYOUT.arrowFrame}px`,
16086
16704
  display: 'inline-flex',
16087
16705
  alignItems: 'center',
16088
16706
  justifyContent: 'center',
16089
- } }, hAsync("sd-icon", { key: 'a87e70e4977a2392de9876eb27904737c61b9e23', name: "chevronRight", size: TEXT_LINK_LAYOUT.arrowIconSize, color: arrowColor })))));
16707
+ } }, hAsync("sd-icon", { key: 'fee7c74359e683829ad3fa802191b651aa9e94da', name: "chevronRight", size: TEXT_LINK_LAYOUT.arrowIconSize, color: arrowColor })))));
16090
16708
  }
16091
16709
  static get style() { return sdTextLinkCss(); }
16092
16710
  static get cmpMeta() { return {
@@ -16232,7 +16850,7 @@ class SdTextarea {
16232
16850
  '--sd-system-size-field-sm-height': 'auto',
16233
16851
  '--sd-system-radius-field-sm': `${TEXTAREA_TOKENS.radius}px`,
16234
16852
  };
16235
- return (hAsync("sd-field", { key: '6b2360f01a356db14659e1ebc53d8c4d8c4f671f', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("div", { key: 'f43279ee861d3502c9130f1de0c47cba61ad0866', class: "sd-textarea__content" }, hAsync("textarea", { key: '0600b577417019ae36a0daba637168ebc5685220', name: this.name, ref: el => (this.nativeEl = el), class: `sd-textarea__native ${this.textareaClass}`, value: this.internalValue || '', placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, autofocus: this.autoFocus, maxLength: this.maxLength, rows: this.rows, spellcheck: this.spellcheck, onInput: this.handleInput, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event), style: this.textareaStyle }))));
16853
+ return (hAsync("sd-field", { key: '4c93d887429d6790d2d49c951be64e4be1496fd4', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("div", { key: 'b64aa1b2f02c1f68db57e5e36e0a7146257629e1', class: "sd-textarea__content" }, hAsync("textarea", { key: 'b2baff1d99b9c2347f0b0bb751fc51268d2c48c7', name: this.name, ref: el => (this.nativeEl = el), class: `sd-textarea__native ${this.textareaClass}`, value: this.internalValue || '', placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, autofocus: this.autoFocus, maxLength: this.maxLength, rows: this.rows, spellcheck: this.spellcheck, onInput: this.handleInput, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event), style: this.textareaStyle }))));
16236
16854
  }
16237
16855
  static get watchers() { return {
16238
16856
  "value": [{
@@ -16417,16 +17035,16 @@ class SdThead {
16417
17035
  const stickyLeftCols = this.visibleColumns.slice(0, stickyLeftCount);
16418
17036
  const middleCols = this.visibleColumns.slice(stickyLeftCount, this.visibleColumns.length - stickyRightCount);
16419
17037
  const stickyRightCols = this.visibleColumns.slice(this.visibleColumns.length - stickyRightCount);
16420
- return (hAsync(Host, { key: '5ccdb84a8876df2af0d73424be3f5a7fdb1979a5', slot: `${this.tableId}-head` }, hAsync("thead", { key: '6517b6f3baf56173f27b8194de7bd1de625ea304', class: {
17038
+ return (hAsync(Host, { key: '97badde9634e2e7363eace5a402fc49a587459c3', slot: `${this.tableId}-head` }, hAsync("thead", { key: 'd1ce731f6082679d8d61f4b74ac122f28f344909', class: {
16421
17039
  'thead': true,
16422
17040
  'thead--sticky': this._stickyHeader,
16423
- } }, hAsync("tr", { key: '8a9c268a3195376a8c9986411b29724896ff36d8', class: "tr" }, this._selectable && (hAsync("th", { key: 'f0fae86684bbef173019ddb1dd23a5f57956fb04', class: {
17041
+ } }, hAsync("tr", { key: 'd0f8b1e8b8a7174cc9b39fabf782eddf2e2accaa', class: "tr" }, this._selectable && (hAsync("th", { key: 'c422f5bd9f9a045785d2d91dd9e2dee6e8f91185', class: {
16424
17042
  'th': true,
16425
17043
  'th--selected': true,
16426
17044
  'sticky-left': true,
16427
17045
  'sticky-left-edge': stickyLeftCount === 0,
16428
17046
  'is-scrolled-left': stickyLeftCount === 0 && this._scrolledLeft,
16429
- }, style: { '--sticky-left-offset': '0px' } }, hAsync("sd-checkbox", { key: 'cde120ec02f8bf03fa869eadbc0d91b4fde8e1ba', value: this.getIsAllChecked(), disabled: !safeRows.length, onSdUpdate: (e) => this.handleSelectAll(e.detail) }))), stickyLeftCols.map((col, idx) => (hAsync("th", { key: col.name, class: {
17047
+ }, style: { '--sticky-left-offset': '0px' } }, hAsync("sd-checkbox", { key: '32cea740457b21d4d6fd53a8f1c10b505a24a481', value: this.getIsAllChecked(), disabled: !safeRows.length, onSdUpdate: (e) => this.handleSelectAll(e.detail) }))), stickyLeftCols.map((col, idx) => (hAsync("th", { key: col.name, class: {
16430
17048
  'th': true,
16431
17049
  [`${col.thClass}`]: Boolean(col.thClass),
16432
17050
  'sticky-left': true,
@@ -16541,10 +17159,10 @@ class SdToast {
16541
17159
  render() {
16542
17160
  const typeConfig = TOAST_TYPE_CONFIG[this.type] ?? TOAST_TYPE_CONFIG.default;
16543
17161
  const iconSize = Number(TOAST_LAYOUT.iconSize);
16544
- return (hAsync("div", { key: '0ae35299510680fdb91dcb7c6ef841cba1287c1a', style: {
17162
+ return (hAsync("div", { key: 'a041d5561d09ef56f4afd722e141b0a2e3a9453f', style: {
16545
17163
  '--sd-toast-bg': typeConfig.bg,
16546
17164
  '--sd-toast-text': typeConfig.content,
16547
- } }, hAsync("div", { key: 'c0b4fb4e820e7e2435ce5516cebab1c3132dfe75', class: "sd-toast", role: "status", "aria-live": "polite", "aria-atomic": "true" }, this.icon && (hAsync("div", { key: '7c0b531a069b6fde7895b886603ceaf54f0a0a50', class: "sd-toast__icon" }, hAsync("sd-icon", { key: '059de7e478b66a7e12c3e0560341311333e83b90', name: this.icon, size: iconSize, color: typeConfig.content }))), hAsync("div", { key: '46911d81bc1cd24b541b6da71ec45a90237ea5a9', class: "sd-toast__content" }, hAsync("span", { key: 'e5e80c82cda36042ad078bf35d2fdcf1d8556497', class: "sd-toast__message" }, this.message)), this.link && (hAsync("a", { key: '95882e33b93d391fc00a92540c5f85d1235c0b8a', href: this.link, class: "sd-toast__link", target: "_blank", rel: "noopener noreferrer" }, this.linkLabel || this.link)), this.useClose && (hAsync("sd-ghost-button", { key: 'e65eede91a5160ec3a0f4cab9f1f4bb02dc695f3', class: "sd-toast__close", icon: "close", intent: this.type === 'caution' ? 'default' : 'inverse', ariaLabel: "close", size: "xs", onClick: () => this.close.emit() })))));
17165
+ } }, hAsync("div", { key: 'bf2a397484ec5938c0442ee0ee98f0ce00ad1ec0', class: "sd-toast", role: "status", "aria-live": "polite", "aria-atomic": "true" }, this.icon && (hAsync("div", { key: '4ea8468b31909e3aea1a293c393621e1815dea5c', class: "sd-toast__icon" }, hAsync("sd-icon", { key: '407a0be71e36a6dca30f5cfb300f2c9ebf6b32c2', name: this.icon, size: iconSize, color: typeConfig.content }))), hAsync("div", { key: '756ca54899ec4d6c3543f8fb1f681d09181674c9', class: "sd-toast__content" }, hAsync("span", { key: 'f0e66dbd5e99bc3921a354ac51294a3c29fe9ea0', class: "sd-toast__message" }, this.message)), this.link && (hAsync("a", { key: '9f4a1a938b7559b03d7dd824c7f2fdbcb093e6fe', href: this.link, class: "sd-toast__link", target: "_blank", rel: "noopener noreferrer" }, this.linkLabel || this.link)), this.useClose && (hAsync("sd-ghost-button", { key: '03d64765901bc8a93f09642b09ae733fa9da0db4', class: "sd-toast__close", icon: "close", intent: this.type === 'caution' ? 'default' : 'inverse', ariaLabel: "close", size: "xs", onClick: () => this.close.emit() })))));
16548
17166
  }
16549
17167
  static get style() { return sdToastCss(); }
16550
17168
  static get cmpMeta() { return {
@@ -16567,7 +17185,7 @@ class SdToast {
16567
17185
  const DEFAULT_DURATION = 4000;
16568
17186
  const DEFAULT_MAX_VISIBLE = 3;
16569
17187
  const DEFAULT_GAP = 8;
16570
- const DEFAULT_Z_INDEX = 10000;
17188
+ const DEFAULT_Z_INDEX = 999;
16571
17189
  const TRANSITION_DURATION = 400;
16572
17190
  const TRANSITION_FALLBACK_BUFFER = 100;
16573
17191
  const COLLAPSED_SCALE_STEP = 0.05;
@@ -16796,7 +17414,7 @@ class SdToastContainer {
16796
17414
  const activeToasts = toasts.filter(t => t.state !== 'exiting').reverse();
16797
17415
  const indexMap = new Map();
16798
17416
  activeToasts.forEach((t, i) => indexMap.set(t.id, i));
16799
- return (hAsync("div", { key: '8a63cb5f1e62fea7f562eac000743bb59ec69fda', class: "sd-toast-container", style: this.getContainerStyles(), onMouseEnter: () => {
17417
+ return (hAsync("div", { key: '4660dd2f2626d391bbcca7da59e16e6c4204d80d', class: "sd-toast-container", style: this.getContainerStyles(), onMouseEnter: () => {
16800
17418
  this.expanded = true;
16801
17419
  this.pauseTimers();
16802
17420
  }, onMouseLeave: () => {
@@ -16954,7 +17572,7 @@ class SdToggle {
16954
17572
  '--sd-toggle-content-select': TOGGLE_COLORS.content.select,
16955
17573
  '--sd-toggle-content-disabled': TOGGLE_COLORS.content.disabled,
16956
17574
  };
16957
- return (hAsync("label", { key: 'ec38c0ca834e5208d2cc5eb1fc32f959eacbb46d', class: this.toggleClasses, style: cssVars, "aria-label": this.label || 'toggle' }, this.label, hAsync("input", { key: '2b47036dbd0cb880a7b7973523c985ae13e0cf22', style: { display: 'none' }, type: "checkbox", onInput: this.handleChange })));
17575
+ return (hAsync("label", { key: '1e0864450b0447ec08643290d1050e4d0ee0c4a4', class: this.toggleClasses, style: cssVars, "aria-label": this.label || 'toggle' }, this.label, hAsync("input", { key: '7e44e8569de24839c41e8c28f579923e3a837366', style: { display: 'none' }, type: "checkbox", onInput: this.handleChange })));
16958
17576
  }
16959
17577
  static get style() { return sdToggleCss(); }
16960
17578
  static get cmpMeta() { return {
@@ -17081,14 +17699,14 @@ class SdTooltip {
17081
17699
  const toggleTooltip = () => (this.showTooltip = !this.showTooltip);
17082
17700
  const divTrigger = trigger === 'hover' ? hoverTrigger : this.label ? {} : { onClick: toggleTooltip };
17083
17701
  const buttonClickTrigger = trigger === 'click' && this.label ? { onSdClick: toggleTooltip } : {};
17084
- return (hAsync(Fragment, { key: '097722e57d6a808193e8fc0d48cebc80ee13848a' }, hAsync("div", { key: '92c6fd83098faec1cfa405ace12530d0cb408395', class: `sd-tooltip-trigger ${this.sdClass || ''}`, ...divTrigger }, this.label ? (hAsync("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: icon, size: this.buttonSize ?? 'sm', color: color, variant: this.buttonVariant ?? 'primary', class: "sd-tooltip", ...buttonClickTrigger })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: icon, size: this.iconSize ?? 12, color: color, class: "sd-tooltip" }))), this.showTooltip && (hAsync("sd-floating-portal", { key: 'd05d011181a8c183690607c974208e708ccba184', parentRef: this.buttonEl, onSdClose: this.handleClose.bind(this), placement: placement, offset: this.tooltipOffset }, hAsync("div", { key: '281c3994d52fcd1d6194edd12bd64ac9a42f5e71', ref: el => (this.menuEl = el), class: {
17702
+ return (hAsync(Fragment, { key: 'aade7a4be8e9955ca4dc437845ee8de9d212fd61' }, hAsync("div", { key: '332c4872541bea334c1f0b6f06de8a1789dc10b8', class: `sd-tooltip-trigger ${this.sdClass || ''}`, ...divTrigger }, this.label ? (hAsync("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: icon, size: this.buttonSize ?? 'sm', color: color, variant: this.buttonVariant ?? 'primary', class: "sd-tooltip", ...buttonClickTrigger })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: icon, size: this.iconSize ?? 12, color: color, class: "sd-tooltip" }))), this.showTooltip && (hAsync("sd-floating-portal", { key: '96f19d91f765020ae5663f216011e2000617c9d1', parentRef: this.buttonEl, onSdClose: this.handleClose.bind(this), placement: placement, offset: this.tooltipOffset }, hAsync("div", { key: '12c2f1fbf59dc1a790016da071805164b0426419', ref: el => (this.menuEl = el), class: {
17085
17703
  'sd-floating-menu': true,
17086
17704
  [`sd-floating-menu--${tooltipType}`]: true,
17087
17705
  [`sd-floating-menu--${placement}`]: true,
17088
17706
  }, style: {
17089
17707
  '--sd-floating-bg': typeConfig.bg,
17090
17708
  '--sd-floating-content': typeConfig.content,
17091
- }, onMouseEnter: () => this.show(), onMouseLeave: () => this.startHideTimer() }, hAsync("i", { key: '87374c0a423bc037decdc820e118c65ea7b3f75f', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, hAsync(TooltipArrow, { key: '9cdd8215849973011a2339ed80bfb2863b1e374e' })), hAsync("div", { key: '4f764958e07a8b2ed0ea093609f5a42d86fa3f3c', class: "sd-floating-menu__content", innerHTML: this.slotContentHTML }))))));
17709
+ }, onMouseEnter: () => this.show(), onMouseLeave: () => this.startHideTimer() }, hAsync("i", { key: 'f69c0cb66d5be975f60bfa7cdbd46e0283d4af2b', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, hAsync(TooltipArrow, { key: '3fbc2c3baa903e80d525225ab1f1aa4b3ec6ad4b' })), hAsync("div", { key: 'a2286ef4e9f5d6c1b1a26ea044ddf1051900c5a2', class: "sd-floating-menu__content", innerHTML: this.slotContentHTML }))))));
17092
17710
  }
17093
17711
  static get style() { return sdTooltipCss(); }
17094
17712
  static get cmpMeta() { return {
@@ -17243,13 +17861,13 @@ class SdTr {
17243
17861
  const stickyLeftCols = this.visibleColumns.slice(0, stickyLeftCount);
17244
17862
  const middleCols = this.visibleColumns.slice(stickyLeftCount, this.visibleColumns.length - stickyRightCount);
17245
17863
  const stickyRightCols = this.visibleColumns.slice(this.visibleColumns.length - stickyRightCount);
17246
- return (hAsync(Host, { key: 'e0b035db61ba424f4a33cdb470c839cb23c696cc', style: { display: this.isVisible ? '' : 'none' } }, hAsync("tr", { key: '224e8c360e01f81dee44d8c93f9e6724c3e87b4f', class: "tr" }, this._selectable && (hAsync("td", { key: '34afbe37ae3f86054cc6151c31a9de4f20296aef', class: {
17864
+ return (hAsync(Host, { key: '3bc910f3afa801d7824eee2e73456ef152c7dc93', style: { display: this.isVisible ? '' : 'none' } }, hAsync("tr", { key: '93b1f4113ae63aa1c0cf79addaa9e8d15c9e8287', class: "tr" }, this._selectable && (hAsync("td", { key: '0caba47c216126f4b7407dfe26afb9f0c75f6450', class: {
17247
17865
  'td': true,
17248
17866
  'td--selected': true,
17249
17867
  'sticky-left': true,
17250
17868
  'sticky-left-edge': stickyLeftCount === 0,
17251
17869
  'is-scrolled-left': stickyLeftCount === 0 && this._scrolledLeft,
17252
- }, style: { '--sticky-left-offset': '0px' } }, hAsync("sd-checkbox", { key: '29ad82d0b043964fdfc68cb250deddeda8029b39', value: this.isSelected(), onSdUpdate: () => this.handleSelect() }))), stickyLeftCols.map((col, idx) => (hAsync("td", { key: col.name, class: {
17870
+ }, style: { '--sticky-left-offset': '0px' } }, hAsync("sd-checkbox", { key: '2e41b3902f489877b624266e588221698aaa8f12', value: this.isSelected(), onSdUpdate: () => this.handleSelect() }))), stickyLeftCols.map((col, idx) => (hAsync("td", { key: col.name, class: {
17253
17871
  'td': true,
17254
17872
  [`td--${col.align || 'left'}`]: true,
17255
17873
  'sticky-left': true,
@@ -17316,6 +17934,7 @@ registerComponents([
17316
17934
  SdCalendar,
17317
17935
  SdCard,
17318
17936
  SdCheckbox,
17937
+ SdChip,
17319
17938
  SdCircleProgress,
17320
17939
  SdConfirmModal,
17321
17940
  SdDateBox,