@sellmate/design-system 1.29.0 → 1.31.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (384) hide show
  1. package/dist/cjs/design-system.cjs.js +2 -2
  2. package/dist/cjs/{index-iiJZMzVM.js → index-Jr8OU0y9.js} +1 -1
  3. package/dist/cjs/loader.cjs.js +2 -2
  4. package/dist/cjs/sd-action-modal.cjs.entry.js +2 -2
  5. package/dist/cjs/sd-badge.cjs.entry.js +2 -2
  6. package/dist/cjs/sd-barcode-input.cjs.entry.js +2 -2
  7. package/dist/cjs/sd-button_2.cjs.entry.js +3 -3
  8. package/dist/cjs/sd-calendar_2.cjs.entry.js +8 -9
  9. package/dist/cjs/sd-callout.cjs.entry.js +2 -2
  10. package/dist/cjs/sd-card.cjs.entry.js +2 -2
  11. package/dist/cjs/sd-checkbox.cjs.entry.js +5 -5
  12. package/dist/cjs/sd-chip-input.cjs.entry.js +21 -16
  13. package/dist/cjs/sd-chip.cjs.entry.js +7 -7
  14. package/dist/cjs/sd-circle-progress.cjs.entry.js +2 -2
  15. package/dist/cjs/sd-confirm-modal_2.cjs.entry.js +3 -3
  16. package/dist/cjs/sd-date-box.cjs.entry.js +1 -1
  17. package/dist/cjs/{component.datepicker-zFTQQKMH.js → sd-date-picker.config-CgyNxY03.js} +66 -1
  18. package/dist/cjs/sd-date-picker_8.cjs.entry.js +141 -51
  19. package/dist/cjs/sd-date-range-picker-calendar.cjs.entry.js +162 -12
  20. package/dist/cjs/sd-divider.cjs.entry.js +2 -2
  21. package/dist/cjs/sd-dropdown-button.cjs.entry.js +1 -1
  22. package/dist/cjs/sd-field_3.cjs.entry.js +51 -52
  23. package/dist/cjs/sd-form.cjs.entry.js +1 -1
  24. package/dist/cjs/sd-ghost-button_3.cjs.entry.js +14 -10
  25. package/dist/cjs/sd-guide.cjs.entry.js +1 -1
  26. package/dist/cjs/sd-key-value-table.cjs.entry.js +1 -1
  27. package/dist/cjs/sd-linear-progress.cjs.entry.js +2 -2
  28. package/dist/cjs/sd-loading-container.cjs.entry.js +3 -3
  29. package/dist/cjs/sd-modal-container.cjs.entry.js +1 -1
  30. package/dist/cjs/sd-pagination.cjs.entry.js +4 -4
  31. package/dist/cjs/sd-popover.cjs.entry.js +134 -44
  32. package/dist/cjs/sd-popup.cjs.entry.js +2 -2
  33. package/dist/cjs/sd-radio-button.cjs.entry.js +3 -3
  34. package/dist/cjs/sd-radio.cjs.entry.js +4 -2
  35. package/dist/cjs/sd-select-list-item_4.cjs.entry.js +11 -11
  36. package/dist/cjs/sd-switch.cjs.entry.js +13 -3
  37. package/dist/cjs/sd-tabs.cjs.entry.js +2 -2
  38. package/dist/cjs/sd-text-link.cjs.entry.js +4 -4
  39. package/dist/cjs/sd-time-picker-selector.cjs.entry.js +179 -0
  40. package/dist/cjs/sd-time-picker-trigger.cjs.entry.js +75 -0
  41. package/dist/cjs/sd-time-picker.cjs.entry.js +173 -0
  42. package/dist/cjs/sd-time-picker.config-C7REB08L.js +156 -0
  43. package/dist/cjs/sd-time-range-picker-selector.cjs.entry.js +219 -0
  44. package/dist/cjs/sd-time-range-picker.cjs.entry.js +204 -0
  45. package/dist/cjs/sd-toast-container.cjs.entry.js +2 -2
  46. package/dist/cjs/sd-toast.cjs.entry.js +3 -3
  47. package/dist/cjs/sd-toggle.cjs.entry.js +2 -2
  48. package/dist/cjs/{tooltipArrow-DOOcBlLp.js → tooltipArrow-BlrFItn5.js} +1 -1
  49. package/dist/cjs/useDatePicker-j06ymWZ_.js +103 -0
  50. package/dist/collection/collection-manifest.json +8 -3
  51. package/dist/collection/components/sd-action-modal/sd-action-modal.js +1 -1
  52. package/dist/collection/components/sd-badge/sd-badge.js +1 -1
  53. package/dist/collection/components/sd-barcode-input/sd-barcode-input.js +1 -1
  54. package/dist/collection/components/sd-button/sd-button.js +2 -2
  55. package/dist/collection/components/sd-calendar/sd-calendar.js +3 -3
  56. package/dist/collection/components/sd-callout/sd-callout.js +1 -1
  57. package/dist/collection/components/sd-card/sd-card.js +1 -1
  58. package/dist/collection/components/sd-checkbox/sd-checkbox.js +8 -8
  59. package/dist/collection/components/sd-chip/sd-chip.js +8 -8
  60. package/dist/collection/components/sd-chip-input/sd-chip-input.css +3 -0
  61. package/dist/collection/components/sd-chip-input/sd-chip-input.js +43 -17
  62. package/dist/collection/components/sd-circle-progress/sd-circle-progress.js +1 -1
  63. package/dist/collection/components/sd-confirm-modal/sd-confirm-modal.js +1 -1
  64. package/dist/collection/components/sd-date-picker/sd-date-picker-trigger/sd-date-picker-trigger.js +2 -2
  65. package/dist/collection/components/sd-date-picker/sd-date-picker.js +23 -2
  66. package/dist/collection/components/sd-date-range-picker/sd-date-range-picker-calendar/sd-date-range-picker-calendar.css +75 -0
  67. package/dist/collection/components/sd-date-range-picker/sd-date-range-picker-calendar/sd-date-range-picker-calendar.js +152 -6
  68. package/dist/collection/components/sd-date-range-picker/sd-date-range-picker.config.js +27 -0
  69. package/dist/collection/components/sd-date-range-picker/sd-date-range-picker.js +59 -3
  70. package/dist/collection/components/sd-divider/sd-divider.js +1 -1
  71. package/dist/collection/components/sd-field/sd-field.css +4 -0
  72. package/dist/collection/components/sd-field/sd-field.js +58 -5
  73. package/dist/collection/components/sd-file-picker/sd-file-picker.config.js +17 -10
  74. package/dist/collection/components/sd-file-picker/sd-file-picker.js +46 -16
  75. package/dist/collection/components/sd-floating-portal/sd-floating-portal.js +1 -1
  76. package/dist/collection/components/sd-ghost-button/sd-ghost-button.js +27 -3
  77. package/dist/collection/components/sd-input/sd-input.js +4 -4
  78. package/dist/collection/components/sd-linear-progress/sd-linear-progress.js +1 -1
  79. package/dist/collection/components/sd-loading-container/sd-loading-container.js +2 -2
  80. package/dist/collection/components/sd-loading-modal/sd-loading-modal.js +1 -1
  81. package/dist/collection/components/sd-number-input/sd-number-input.js +58 -7
  82. package/dist/collection/components/sd-pagination/sd-pagination.js +3 -3
  83. package/dist/collection/components/sd-popover/sd-popover.config.js +41 -0
  84. package/dist/collection/components/sd-popover/sd-popover.js +189 -191
  85. package/dist/collection/components/sd-popup/sd-popup.js +1 -1
  86. package/dist/collection/components/sd-portal/sd-portal.js +1 -1
  87. package/dist/collection/components/sd-radio/sd-radio.js +25 -4
  88. package/dist/collection/components/sd-radio-button/sd-radio-button.js +6 -6
  89. package/dist/collection/components/sd-radio-group/sd-radio-group.js +7 -7
  90. package/dist/collection/components/sd-select/sd-select-list-item/sd-select-list-item.js +2 -2
  91. package/dist/collection/components/sd-select/sd-select-list-item-search/sd-select-list-item-search.js +4 -4
  92. package/dist/collection/components/sd-select/sd-select-listbox/sd-select-listbox.js +2 -2
  93. package/dist/collection/components/sd-select/sd-select-trigger/sd-select-trigger.js +2 -2
  94. package/dist/collection/components/sd-select/sd-select.js +4 -4
  95. package/dist/collection/components/sd-switch/sd-switch.js +54 -3
  96. package/dist/collection/components/sd-tabs/sd-tabs.js +1 -1
  97. package/dist/collection/components/sd-tag/sd-tag.js +7 -8
  98. package/dist/collection/components/sd-text-link/sd-text-link.js +3 -3
  99. package/dist/collection/components/sd-textarea/sd-textarea.js +1 -1
  100. package/dist/collection/components/sd-time-picker/sd-time-picker-selector/sd-time-picker-selector.css +87 -0
  101. package/dist/collection/components/sd-time-picker/sd-time-picker-selector/sd-time-picker-selector.js +266 -0
  102. package/dist/collection/components/sd-time-picker/sd-time-picker-trigger/sd-time-picker-trigger.css +38 -0
  103. package/dist/collection/components/sd-time-picker/sd-time-picker-trigger/sd-time-picker-trigger.js +216 -0
  104. package/dist/collection/components/sd-time-picker/sd-time-picker.config.js +78 -0
  105. package/dist/collection/components/sd-time-picker/sd-time-picker.css +12 -0
  106. package/dist/collection/components/sd-time-picker/sd-time-picker.js +761 -0
  107. package/dist/collection/components/sd-time-range-picker/sd-time-range-picker-selector/sd-time-range-picker-selector.css +102 -0
  108. package/dist/collection/components/sd-time-range-picker/sd-time-range-picker-selector/sd-time-range-picker-selector.js +338 -0
  109. package/dist/collection/components/sd-time-range-picker/sd-time-range-picker.config.js +23 -0
  110. package/dist/collection/components/sd-time-range-picker/sd-time-range-picker.css +12 -0
  111. package/dist/collection/components/sd-time-range-picker/sd-time-range-picker.js +809 -0
  112. package/dist/collection/components/sd-toast/sd-toast.js +2 -2
  113. package/dist/collection/components/sd-toast-container/sd-toast-container.js +1 -1
  114. package/dist/collection/components/sd-toggle/sd-toggle.js +1 -1
  115. package/dist/collection/components/sd-tooltip/sd-tooltip.js +36 -189
  116. package/dist/components/index.js +1 -1
  117. package/dist/components/p-1DsQj3tv.js +1 -0
  118. package/dist/components/p-2g4jlJ3i.js +1 -0
  119. package/dist/components/{p-C_in6AVN.js → p-6U1qyU5A.js} +1 -1
  120. package/dist/components/{p-CSr33M9s.js → p-B-EV9bey.js} +1 -1
  121. package/dist/components/p-B887QQl2.js +1 -0
  122. package/dist/components/{p-Bpv90tfa.js → p-BPzs63D8.js} +1 -1
  123. package/dist/components/{p-Dg1UrMqI.js → p-BvJ14GuJ.js} +1 -1
  124. package/dist/components/p-Bxv2AFOb.js +1 -0
  125. package/dist/components/p-C6o10dl7.js +1 -0
  126. package/dist/components/p-C6wuKkUq.js +1 -0
  127. package/dist/components/{p-CbS69IvC.js → p-C9IKm4j5.js} +1 -1
  128. package/dist/components/{p-BHjezpAC.js → p-CH9dgzTr.js} +1 -1
  129. package/dist/components/{p-oYbVr-z0.js → p-CKV2W-zU.js} +1 -1
  130. package/dist/components/p-CTCt17CE.js +1 -0
  131. package/dist/components/{p-BOxGhKKP.js → p-CghFB91T.js} +1 -1
  132. package/dist/components/p-Ckr9iuVb.js +1 -0
  133. package/dist/components/p-ClbD4Gsr.js +1 -0
  134. package/dist/components/p-CmCOLnc0.js +1 -0
  135. package/dist/components/{p-C7mC7a1z.js → p-CwzkplrI.js} +1 -1
  136. package/dist/components/p-CzJ9g73f.js +1 -0
  137. package/dist/components/p-D8yhjm54.js +1 -0
  138. package/dist/components/p-D9qp3o5Y.js +1 -0
  139. package/dist/components/{p-OO7xxhkC.js → p-DE8Ws9As.js} +1 -1
  140. package/dist/components/p-DMm_GeZC.js +1 -0
  141. package/dist/components/{p-idG6CMO0.js → p-DOfLrOEu.js} +1 -1
  142. package/dist/components/{p-R-Sdglj0.js → p-DSWD8udu.js} +1 -1
  143. package/dist/components/{p-Di1q4f5E.js → p-DWnuCSqC.js} +1 -1
  144. package/dist/components/p-DYjaQs6e.js +1 -0
  145. package/dist/components/{p-9Ap2W-Mi.js → p-DasiqnrU.js} +1 -1
  146. package/dist/components/{p-CErFctrV.js → p-Dc9g3-5z.js} +1 -1
  147. package/dist/components/{p-CFTyEfB9.js → p-DnlLqzGM.js} +1 -1
  148. package/dist/components/p-DsZwiWiU.js +1 -0
  149. package/dist/components/{p-DMoFncVl.js → p-FGII920I.js} +1 -1
  150. package/dist/components/p-Hjv7LqkN.js +1 -0
  151. package/dist/components/{p-BIEPMPWA.js → p-In6mljvA.js} +1 -1
  152. package/dist/components/p-OnBLxJAP.js +1 -0
  153. package/dist/components/p-SYnTIeiO.js +1 -0
  154. package/dist/{design-system/p-B91K50wC.js → components/p-bXzpfkfN.js} +1 -1
  155. package/dist/components/p-mcbwNjNT.js +1 -0
  156. package/dist/components/p-qZxAQy4p.js +1 -0
  157. package/dist/components/sd-action-modal.js +1 -1
  158. package/dist/components/sd-badge.js +1 -1
  159. package/dist/components/sd-barcode-input.js +1 -1
  160. package/dist/components/sd-button.js +1 -1
  161. package/dist/components/sd-calendar.js +1 -1
  162. package/dist/components/sd-callout.js +1 -1
  163. package/dist/components/sd-card.js +1 -1
  164. package/dist/components/sd-checkbox.js +1 -1
  165. package/dist/components/sd-chip-input.js +1 -1
  166. package/dist/components/sd-chip.js +1 -1
  167. package/dist/components/sd-circle-progress.js +1 -1
  168. package/dist/components/sd-confirm-modal.js +1 -1
  169. package/dist/components/sd-date-box.js +1 -1
  170. package/dist/components/sd-date-picker-trigger.js +1 -1
  171. package/dist/components/sd-date-picker.js +1 -1
  172. package/dist/components/sd-date-range-picker-calendar.js +1 -1
  173. package/dist/components/sd-date-range-picker.js +1 -1
  174. package/dist/components/sd-divider.js +1 -1
  175. package/dist/components/sd-dropdown-button.js +1 -1
  176. package/dist/components/sd-field.js +1 -1
  177. package/dist/components/sd-file-picker.js +1 -1
  178. package/dist/components/sd-floating-portal.js +1 -1
  179. package/dist/components/sd-form.js +1 -1
  180. package/dist/components/sd-ghost-button.js +1 -1
  181. package/dist/components/sd-guide.js +1 -1
  182. package/dist/components/sd-icon.js +1 -1
  183. package/dist/components/sd-input.js +1 -1
  184. package/dist/components/sd-key-value-table.js +1 -1
  185. package/dist/components/sd-linear-progress.js +1 -1
  186. package/dist/components/sd-loading-container.js +1 -1
  187. package/dist/components/sd-loading-modal.js +1 -1
  188. package/dist/components/sd-modal-container.js +1 -1
  189. package/dist/components/sd-number-input.js +1 -1
  190. package/dist/components/sd-pagination.js +1 -1
  191. package/dist/components/sd-popover.js +1 -1
  192. package/dist/components/sd-popup.js +1 -1
  193. package/dist/components/sd-portal.js +1 -1
  194. package/dist/components/sd-radio-button.js +1 -1
  195. package/dist/components/sd-radio-group.js +1 -1
  196. package/dist/components/sd-radio.js +1 -1
  197. package/dist/components/sd-select-list-item-search.js +1 -1
  198. package/dist/components/sd-select-list-item.js +1 -1
  199. package/dist/components/sd-select-listbox.js +1 -1
  200. package/dist/components/sd-select-trigger.js +1 -1
  201. package/dist/components/sd-select.js +1 -1
  202. package/dist/components/sd-switch.js +1 -1
  203. package/dist/components/sd-tabs.js +1 -1
  204. package/dist/components/sd-tag.js +1 -1
  205. package/dist/components/sd-text-link.js +1 -1
  206. package/dist/components/sd-textarea.js +1 -1
  207. package/dist/components/sd-time-picker-selector.d.ts +11 -0
  208. package/dist/components/sd-time-picker-selector.js +1 -0
  209. package/dist/components/sd-time-picker-trigger.d.ts +11 -0
  210. package/dist/components/sd-time-picker-trigger.js +1 -0
  211. package/dist/components/sd-time-picker.d.ts +11 -0
  212. package/dist/components/sd-time-picker.js +1 -0
  213. package/dist/components/sd-time-range-picker-selector.d.ts +11 -0
  214. package/dist/components/sd-time-range-picker-selector.js +1 -0
  215. package/dist/components/sd-time-range-picker.d.ts +11 -0
  216. package/dist/components/sd-time-range-picker.js +1 -0
  217. package/dist/components/sd-toast-container.js +1 -1
  218. package/dist/components/sd-toast.js +1 -1
  219. package/dist/components/sd-toggle.js +1 -1
  220. package/dist/components/sd-tooltip.js +1 -1
  221. package/dist/design-system/design-system.css +1 -1
  222. package/dist/design-system/design-system.esm.js +1 -1
  223. package/dist/design-system/{p-b585f94b.entry.js → p-129b6330.entry.js} +1 -1
  224. package/dist/design-system/{p-adf2f398.entry.js → p-15f43b9b.entry.js} +1 -1
  225. package/dist/design-system/p-16b9eac4.entry.js +1 -0
  226. package/dist/design-system/{p-c1066f40.entry.js → p-1858636f.entry.js} +1 -1
  227. package/dist/design-system/{p-840006b1.entry.js → p-21672bb8.entry.js} +1 -1
  228. package/dist/design-system/{p-c7d2c195.entry.js → p-219288ef.entry.js} +1 -1
  229. package/dist/design-system/{p-c5cffcc6.entry.js → p-22ac9e05.entry.js} +1 -1
  230. package/dist/design-system/p-2534d3d4.entry.js +1 -0
  231. package/dist/design-system/{p-be54fd3a.entry.js → p-3859316f.entry.js} +1 -1
  232. package/dist/design-system/{p-53fe2741.entry.js → p-46da4e95.entry.js} +1 -1
  233. package/dist/design-system/{p-8de3b502.entry.js → p-46eb3421.entry.js} +1 -1
  234. package/dist/design-system/p-4782331f.entry.js +1 -0
  235. package/dist/design-system/{p-5a257ed9.entry.js → p-4a117dd6.entry.js} +1 -1
  236. package/dist/design-system/{p-55c0be7d.entry.js → p-4ae0a64a.entry.js} +1 -1
  237. package/dist/design-system/{p-246aafb9.entry.js → p-52b1be6f.entry.js} +1 -1
  238. package/dist/design-system/p-56e7c87b.entry.js +1 -0
  239. package/dist/design-system/{p-26a27312.entry.js → p-570b9e91.entry.js} +1 -1
  240. package/dist/design-system/p-5a113197.entry.js +1 -0
  241. package/dist/design-system/p-62ff77e4.entry.js +1 -0
  242. package/dist/design-system/{p-d204cac5.entry.js → p-655324cd.entry.js} +1 -1
  243. package/dist/design-system/p-66cff123.entry.js +1 -0
  244. package/dist/design-system/{p-0c1d1a15.entry.js → p-6c4fa9d7.entry.js} +1 -1
  245. package/dist/design-system/{p-8ed1d470.entry.js → p-809a0a71.entry.js} +1 -1
  246. package/dist/design-system/{p-ec4ad48c.entry.js → p-82cb62a9.entry.js} +1 -1
  247. package/dist/design-system/p-843d1a8a.entry.js +1 -0
  248. package/dist/design-system/{p-02f0b906.entry.js → p-8836d9ff.entry.js} +1 -1
  249. package/dist/design-system/{p-d2ce01ac.entry.js → p-8af8e302.entry.js} +1 -1
  250. package/dist/design-system/p-9c131122.entry.js +1 -0
  251. package/dist/design-system/{p-BPKiBSGr.js → p-BnUjeY2n.js} +1 -1
  252. package/dist/design-system/p-C599jhDs.js +2 -0
  253. package/dist/design-system/p-Cn8LZw1e.js +1 -0
  254. package/dist/design-system/p-DMm_GeZC.js +1 -0
  255. package/dist/design-system/p-Dz23PPdF.js +1 -0
  256. package/dist/design-system/p-a0c55a19.entry.js +1 -0
  257. package/dist/design-system/p-a6c292d1.entry.js +1 -0
  258. package/dist/design-system/p-a9cc4697.entry.js +1 -0
  259. package/dist/design-system/{p-3595cafb.entry.js → p-b2dc1202.entry.js} +1 -1
  260. package/dist/design-system/{p-86329ae3.entry.js → p-b5229957.entry.js} +1 -1
  261. package/dist/design-system/{p-a631cd78.entry.js → p-b75cc0dd.entry.js} +1 -1
  262. package/dist/design-system/p-b97a6cf3.entry.js +1 -0
  263. package/dist/design-system/{p-3cd2751a.entry.js → p-c1e625e5.entry.js} +1 -1
  264. package/dist/design-system/{p-1ed1bfa1.entry.js → p-c7f03dea.entry.js} +1 -1
  265. package/dist/design-system/p-cdb2433a.entry.js +1 -0
  266. package/dist/design-system/{p-d9f33192.entry.js → p-d5325895.entry.js} +1 -1
  267. package/dist/design-system/p-e0e4a451.entry.js +1 -0
  268. package/dist/design-system/p-e387ec65.entry.js +1 -0
  269. package/dist/design-system/{p-4c85f6f6.entry.js → p-efe3601d.entry.js} +1 -1
  270. package/dist/esm/design-system.js +3 -3
  271. package/dist/esm/{index-Dz490Ukt.js → index-C599jhDs.js} +1 -1
  272. package/dist/esm/loader.js +3 -3
  273. package/dist/esm/sd-action-modal.entry.js +2 -2
  274. package/dist/esm/sd-badge.entry.js +2 -2
  275. package/dist/esm/sd-barcode-input.entry.js +2 -2
  276. package/dist/esm/sd-button_2.entry.js +3 -3
  277. package/dist/esm/sd-calendar_2.entry.js +8 -9
  278. package/dist/esm/sd-callout.entry.js +2 -2
  279. package/dist/esm/sd-card.entry.js +2 -2
  280. package/dist/esm/sd-checkbox.entry.js +5 -5
  281. package/dist/esm/sd-chip-input.entry.js +21 -16
  282. package/dist/esm/sd-chip.entry.js +7 -7
  283. package/dist/esm/sd-circle-progress.entry.js +2 -2
  284. package/dist/esm/sd-confirm-modal_2.entry.js +3 -3
  285. package/dist/esm/sd-date-box.entry.js +1 -1
  286. package/dist/esm/{component.datepicker-BOxGhKKP.js → sd-date-picker.config-CdXJcOGr.js} +65 -2
  287. package/dist/esm/sd-date-picker_8.entry.js +141 -51
  288. package/dist/esm/sd-date-range-picker-calendar.entry.js +158 -8
  289. package/dist/esm/sd-divider.entry.js +2 -2
  290. package/dist/esm/sd-dropdown-button.entry.js +1 -1
  291. package/dist/esm/sd-field_3.entry.js +51 -52
  292. package/dist/esm/sd-form.entry.js +1 -1
  293. package/dist/esm/sd-ghost-button_3.entry.js +14 -10
  294. package/dist/esm/sd-guide.entry.js +1 -1
  295. package/dist/esm/sd-key-value-table.entry.js +1 -1
  296. package/dist/esm/sd-linear-progress.entry.js +2 -2
  297. package/dist/esm/sd-loading-container.entry.js +3 -3
  298. package/dist/esm/sd-modal-container.entry.js +1 -1
  299. package/dist/esm/sd-pagination.entry.js +4 -4
  300. package/dist/esm/sd-popover.entry.js +134 -44
  301. package/dist/esm/sd-popup.entry.js +2 -2
  302. package/dist/esm/sd-radio-button.entry.js +3 -3
  303. package/dist/esm/sd-radio.entry.js +4 -2
  304. package/dist/esm/sd-select-list-item_4.entry.js +11 -11
  305. package/dist/esm/sd-switch.entry.js +13 -3
  306. package/dist/esm/sd-tabs.entry.js +2 -2
  307. package/dist/esm/sd-text-link.entry.js +4 -4
  308. package/dist/esm/sd-time-picker-selector.entry.js +177 -0
  309. package/dist/esm/sd-time-picker-trigger.entry.js +73 -0
  310. package/dist/esm/sd-time-picker.config-DUq29Nhs.js +148 -0
  311. package/dist/esm/sd-time-picker.entry.js +171 -0
  312. package/dist/esm/sd-time-range-picker-selector.entry.js +217 -0
  313. package/dist/esm/sd-time-range-picker.entry.js +202 -0
  314. package/dist/esm/sd-toast-container.entry.js +2 -2
  315. package/dist/esm/sd-toast.entry.js +3 -3
  316. package/dist/esm/sd-toggle.entry.js +2 -2
  317. package/dist/esm/{tooltipArrow-CEHVt90h.js → tooltipArrow-DbLihSLI.js} +1 -1
  318. package/dist/esm/{useDatePicker-BG0lUGJG.js → useDatePicker-DQ5Kyy_D.js} +1 -1
  319. package/dist/types/components/sd-checkbox/sd-checkbox.d.ts +2 -2
  320. package/dist/types/components/sd-chip/sd-chip.d.ts +3 -3
  321. package/dist/types/components/sd-chip-input/sd-chip-input.d.ts +4 -2
  322. package/dist/types/components/sd-date-picker/sd-date-picker.d.ts +2 -0
  323. package/dist/types/components/sd-date-range-picker/sd-date-range-picker-calendar/sd-date-range-picker-calendar.d.ts +20 -0
  324. package/dist/types/components/sd-date-range-picker/sd-date-range-picker.config.d.ts +25 -0
  325. package/dist/types/components/sd-date-range-picker/sd-date-range-picker.d.ts +9 -0
  326. package/dist/types/components/sd-field/sd-field.d.ts +7 -0
  327. package/dist/types/components/sd-file-picker/sd-file-picker.config.d.ts +28 -0
  328. package/dist/types/components/sd-file-picker/sd-file-picker.d.ts +3 -1
  329. package/dist/types/components/sd-ghost-button/sd-ghost-button.d.ts +5 -0
  330. package/dist/types/components/sd-input/sd-input.d.ts +1 -1
  331. package/dist/types/components/sd-number-input/sd-number-input.d.ts +8 -0
  332. package/dist/types/components/sd-popover/sd-popover.config.d.ts +22 -0
  333. package/dist/types/components/sd-popover/sd-popover.d.ts +29 -36
  334. package/dist/types/components/sd-radio/sd-radio.d.ts +3 -1
  335. package/dist/types/components/sd-radio-button/sd-radio-button.d.ts +2 -2
  336. package/dist/types/components/sd-radio-group/sd-radio-group.d.ts +2 -2
  337. package/dist/types/components/sd-switch/sd-switch.d.ts +8 -1
  338. package/dist/types/components/sd-tag/sd-tag.d.ts +2 -2
  339. package/dist/types/components/sd-time-picker/sd-time-picker-selector/sd-time-picker-selector.d.ts +35 -0
  340. package/dist/types/components/sd-time-picker/sd-time-picker-trigger/sd-time-picker-trigger.d.ts +21 -0
  341. package/dist/types/components/sd-time-picker/sd-time-picker.config.d.ts +71 -0
  342. package/dist/types/components/sd-time-picker/sd-time-picker.d.ts +84 -0
  343. package/dist/types/components/sd-time-range-picker/sd-time-range-picker-selector/sd-time-range-picker-selector.d.ts +40 -0
  344. package/dist/types/components/sd-time-range-picker/sd-time-range-picker.config.d.ts +9 -0
  345. package/dist/types/components/sd-time-range-picker/sd-time-range-picker.d.ts +88 -0
  346. package/dist/types/components/sd-tooltip/sd-tooltip.d.ts +7 -22
  347. package/dist/types/components.d.ts +1268 -381
  348. package/hydrate/index.js +1975 -502
  349. package/hydrate/index.mjs +1975 -502
  350. package/package.json +1 -1
  351. package/dist/cjs/sd-date-picker.config-Chrd8c4v.js +0 -41
  352. package/dist/cjs/useDatePicker-CgpIfwLA.js +0 -103
  353. package/dist/components/p-BFVfSW9t.js +0 -1
  354. package/dist/components/p-BKu0I6Io.js +0 -1
  355. package/dist/components/p-B_Zwr4Et.js +0 -1
  356. package/dist/components/p-CBoDoYDO.js +0 -1
  357. package/dist/components/p-CYMMLsGt.js +0 -1
  358. package/dist/components/p-C_SG4M4z.js +0 -1
  359. package/dist/components/p-CgSXYw_0.js +0 -1
  360. package/dist/components/p-CmRF12Fy.js +0 -1
  361. package/dist/components/p-CnRfET5y.js +0 -1
  362. package/dist/components/p-Cvsrc0be.js +0 -1
  363. package/dist/components/p-DJ8z7_EG.js +0 -1
  364. package/dist/components/p-DJmxpVkK.js +0 -1
  365. package/dist/components/p-DN7MAx-q.js +0 -1
  366. package/dist/components/p-DS6NVBvu.js +0 -1
  367. package/dist/components/p-D_56BjcD.js +0 -1
  368. package/dist/components/p-Uh9emYrV.js +0 -1
  369. package/dist/components/p-f0aBxUBG.js +0 -1
  370. package/dist/design-system/p-0e014b76.entry.js +0 -1
  371. package/dist/design-system/p-1b5fcf7b.entry.js +0 -1
  372. package/dist/design-system/p-2a4d2ee0.entry.js +0 -1
  373. package/dist/design-system/p-2d6a7d7b.entry.js +0 -1
  374. package/dist/design-system/p-4b474538.entry.js +0 -1
  375. package/dist/design-system/p-BOxGhKKP.js +0 -1
  376. package/dist/design-system/p-BhcvMs8c.js +0 -1
  377. package/dist/design-system/p-Dz490Ukt.js +0 -2
  378. package/dist/design-system/p-cb6ab65c.entry.js +0 -1
  379. package/dist/design-system/p-d51f4170.entry.js +0 -1
  380. package/dist/design-system/p-e7740a5f.entry.js +0 -1
  381. package/dist/design-system/p-e85bf462.entry.js +0 -1
  382. package/dist/design-system/p-ea008087.entry.js +0 -1
  383. package/dist/design-system/p-f962e5d2.entry.js +0 -1
  384. package/dist/esm/sd-date-picker.config-krRuSUsA.js +0 -38
package/hydrate/index.js CHANGED
@@ -134,7 +134,7 @@ function hydrateFactory($stencilWindow, $stencilHydrateOpts, $stencilHydrateResu
134
134
  const NAMESPACE = 'design-system';
135
135
  const BUILD = /* design-system */ { hotModuleReplacement: false, hydratedSelectorName: "hydrated", slotRelocation: true, state: true, updatable: true};
136
136
 
137
- 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-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-xs-default-font-size:12px;--sd-system-typography-control-xs-default-font-weight:400;--sd-system-typography-control-xs-default-text-decoration:none;--sd-system-typography-control-xs-default-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-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-xs-underline-font-size:12px;--sd-system-typography-control-xs-underline-font-weight:500;--sd-system-typography-control-xs-underline-text-decoration:underline;--sd-system-typography-control-xs-underline-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:14px;--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:24px;--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:14px;--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:24px;--sd-system-typography-control-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-control-md-default-font-size:16px;--sd-system-typography-control-md-default-font-weight:500;--sd-system-typography-control-md-default-text-decoration:none;--sd-system-typography-control-md-default-line-height:26px;--sd-system-typography-control-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-control-md-underline-font-size:16px;--sd-system-typography-control-md-underline-font-weight:500;--sd-system-typography-control-md-underline-text-decoration:underline;--sd-system-typography-control-md-underline-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-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-md-medium-font-size:14px;--sd-system-typography-feedback-md-medium-font-weight:500;--sd-system-typography-feedback-md-medium-line-height:24px;--sd-system-typography-feedback-md-medium-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-xs-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-xs-default-font-weight:400;--sd-system-typography-field-xs-default-font-size:11px;--sd-system-typography-field-xs-default-line-height:18px;--sd-system-typography-field-xs-default-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-typography-navigation-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-navigation-sm-default-font-weight:400;--sd-system-typography-navigation-sm-default-font-size:12px;--sd-system-typography-navigation-sm-default-line-height:20px;--sd-system-typography-navigation-sm-default-text-decoration:none;--sd-system-typography-navigation-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-navigation-sm-medium-font-weight:500;--sd-system-typography-navigation-sm-medium-font-size:12px;--sd-system-typography-navigation-sm-medium-line-height:20px;--sd-system-typography-navigation-sm-medium-text-decoration:none;--sd-system-typography-navigation-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-navigation-sm-bold-font-weight:700;--sd-system-typography-navigation-sm-bold-font-size:12px;--sd-system-typography-navigation-sm-bold-line-height:20px;--sd-system-typography-navigation-sm-bold-text-decoration:none;--sd-system-typography-navigation-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-navigation-md-bold-font-weight:700;--sd-system-typography-navigation-md-bold-font-size:13px;--sd-system-typography-navigation-md-bold-line-height:22px;--sd-system-typography-navigation-md-bold-text-decoration:none;--sd-system-typography-navigation-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-navigation-lg-medium-font-weight:500;--sd-system-typography-navigation-lg-medium-font-size:14px;--sd-system-typography-navigation-lg-medium-line-height:24px;--sd-system-typography-navigation-lg-medium-text-decoration:none;--sd-system-typography-navigation-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-navigation-lg-bold-font-weight:700;--sd-system-typography-navigation-lg-bold-font-size:14px;--sd-system-typography-navigation-lg-bold-line-height:24px;--sd-system-typography-navigation-lg-bold-text-decoration:none;--sd-system-typography-table-header-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-table-header-font-weight:500;--sd-system-typography-table-header-font-size:12px;--sd-system-typography-table-header-line-height:20px;--sd-system-typography-table-header-text-decoration:none;--sd-system-typography-table-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-system-typography-table-body-font-weight:400;--sd-system-typography-table-body-font-size:12px;--sd-system-typography-table-body-line-height:20px;--sd-system-typography-table-body-text-decoration:none;--sd-system-typography-table-accent-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-table-accent-font-weight:700;--sd-system-typography-table-accent-font-size:12px;--sd-system-typography-table-accent-line-height:20px;--sd-system-typography-table-accent-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-size-navigation-lg-height:44px;--sd-system-size-navigation-md-height:36px;--sd-system-size-navigation-gnb-topbar-height:56px;--sd-system-size-table-height-xs:32px;--sd-system-size-table-height-sm:36px;--sd-system-size-table-height-md:44px;--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-feedback-lg-padding-x:16px;--sd-system-space-feedback-lg-gap:12px;--sd-system-space-stack-gap-text-tight:2px;--sd-system-space-stack-gap-text-normal:4px;--sd-system-space-stack-gap-text-relaxed:8px;--sd-system-space-stack-gap-element-tight:4px;--sd-system-space-stack-gap-element-normal:8px;--sd-system-space-stack-gap-element-relaxed:12px;--sd-system-space-stack-gap-element-wide:16px;--sd-system-space-stack-gap-element-spacious:24px;--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-padding-y:8px;--sd-system-space-field-md-container-gap:12px;--sd-system-space-field-md-gap:16px;--sd-system-space-navigation-lg-padding-x:32px;--sd-system-space-navigation-md-padding-x:24px;--sd-system-space-table-padding-sm:8px;--sd-system-space-table-padding-md:16px;--sd-system-space-action-gap:16px;--sd-system-space-overlay-padding-x-sm:20px;--sd-system-space-overlay-padding-x-md:24px;--sd-system-space-overlay-padding-y-sm:8px;--sd-system-space-panel-gap:12px;--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-radius-navigation:6px;--sd-system-border-width-control-default:1px;--sd-system-border-width-field-default:1px;--sd-system-border-width-navigation-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:#2D8DFF;--sd-system-color-bg-accent-light-light:#F5FAFF;--sd-system-color-bg-accent-bright-default:#D9EAFF;--sd-system-color-bg-accent-bright-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-neutral-light:#F6F6F6;--sd-system-color-bg-neutral-bright:#F9F9F9;--sd-system-color-bg-table-header:#F5FAFF;--sd-system-color-fg-primary:#222222;--sd-system-color-fg-secondary:#555555;--sd-system-color-fg-tertiary:#888888;--sd-system-color-fg-quaternary:#AAAAAA;--sd-system-color-fg-brand:#005CC9;--sd-system-color-fg-subtle-warm:#066D9B;--sd-system-color-fg-subtle-cool:#025497;--sd-system-color-fg-deep:#004290;--sd-system-color-fg-success:#00973C;--sd-system-color-fg-danger-light:#FB4444;--sd-system-color-fg-accent:#0075FF;--sd-system-color-fg-danger:#E30000;--sd-system-color-fg-warning:#FF6B00;--sd-system-color-fg-inverse:#FFFFFF;--sd-system-color-disabled-bg:#E1E1E1;--sd-system-color-disabled-text:#888888;--sd-system-color-disabled-icon:#BBBBBB;--sd-system-color-disabled-border:#CCCCCC;--sd-system-color-link-accent:#006AC1;--sd-system-color-divider-default:#E1E1E1;--sd-system-color-border-default:#E1E1E1;--sd-system-color-border-accent:#0075FF;--sd-system-color-border-accent-light:#93C4FF;--sd-system-color-border-danger:#FB4444;--sd-system-color-border-success:#12B553;--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-bg-read-only:#EEEEEE;--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-text-read-only:#555555;--sd-system-color-field-icon-default:#888888;--sd-system-color-control-bg-inverse-hover:#0075FF;--sd-system-color-navigation-gnb-bg-dark:#001B39;--sd-system-shadow-spread-sm-x:0px;--sd-system-shadow-spread-sm-y:0px;--sd-system-shadow-spread-sm-blur:8px;--sd-system-shadow-spread-sm-spread:0px;--sd-system-shadow-spread-sm-color:rgba(34,34,34,0.1);--sd-system-shadow-spread-sm-type:dropShadow;--sd-system-shadow-spread-md-x:0px;--sd-system-shadow-spread-md-y:0px;--sd-system-shadow-spread-md-blur:24px;--sd-system-shadow-spread-md-spread:0px;--sd-system-shadow-spread-md-color:rgba(34,34,34,0.2);--sd-system-shadow-spread-md-type:dropShadow;--sd-system-shadow-focus-x:0px;--sd-system-shadow-focus-y:0px;--sd-system-shadow-focus-blur:8px;--sd-system-shadow-focus-spread:0px;--sd-system-shadow-focus-color:rgba(0,117,255,0.25);--sd-system-shadow-focus-type:dropShadow;--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-subtle-bg-default:#1F8AE1;--sd-button-button-brand-subtle-bg-hover:#006AC1;--sd-button-button-brand-subtle-content:#FFFFFF;--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-dropdown-brand-strong-split:#006AC1;--sd-button-button-dropdown-brand-subtle-split:#5CB0F3;--sd-button-button-dropdown-danger-strong-split:#FF7C7C;--sd-button-button-dropdown-xs-arrow:12px;--sd-button-button-dropdown-xs-gap:6px;--sd-button-button-dropdown-sm-arrow:12px;--sd-button-button-dropdown-sm-gap:8px;--sd-button-button-dropdown-md-arrow:16px;--sd-button-button-dropdown-md-gap:16px;--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-text:#222222;--sd-button-button-neutral-outline-icon:#555555;--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-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-button-button-group-gap-normal:8px;--sd-button-button-group-gap-wide:12px;--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-ghost-button-ghost-button-group-gap:8px;--sd-text-link-text-link-sm-gap:4px;--sd-text-link-text-link-sm-icon:16px;--sd-text-link-text-link-sm-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-sm-typography-default-font-size:12px;--sd-text-link-text-link-sm-typography-default-font-weight:500;--sd-text-link-text-link-sm-typography-default-text-decoration:none;--sd-text-link-text-link-sm-typography-default-line-height:20px;--sd-text-link-text-link-sm-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-sm-typography-underline-font-size:12px;--sd-text-link-text-link-sm-typography-underline-font-weight:500;--sd-text-link-text-link-sm-typography-underline-text-decoration:underline;--sd-text-link-text-link-sm-typography-underline-line-height:20px;--sd-text-link-text-link-md-gap:8px;--sd-text-link-text-link-md-icon:16px;--sd-text-link-text-link-md-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-md-typography-default-font-size:14px;--sd-text-link-text-link-md-typography-default-font-weight:500;--sd-text-link-text-link-md-typography-default-text-decoration:none;--sd-text-link-text-link-md-typography-default-line-height:24px;--sd-text-link-text-link-md-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-md-typography-underline-font-size:14px;--sd-text-link-text-link-md-typography-underline-font-weight:500;--sd-text-link-text-link-md-typography-underline-text-decoration:underline;--sd-text-link-text-link-md-typography-underline-line-height:24px;--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-text-link-text-link-lg-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-lg-typography-default-font-size:16px;--sd-text-link-text-link-lg-typography-default-font-weight:500;--sd-text-link-text-link-lg-typography-default-text-decoration:none;--sd-text-link-text-link-lg-typography-default-line-height:26px;--sd-text-link-text-link-lg-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-lg-typography-underline-font-size:16px;--sd-text-link-text-link-lg-typography-underline-font-weight:500;--sd-text-link-text-link-lg-typography-underline-text-decoration:underline;--sd-text-link-text-link-lg-typography-underline-line-height:26px;--sd-text-link-text-link-lg-gap:8px;--sd-text-link-text-link-lg-icon:20px;--sd-text-link-text-link-group-horizontal-normal:16px;--sd-text-link-text-link-group-horizontal-wide:24px;--sd-text-link-text-link-group-vertical-normal:4px;--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-default:#FFFFFF;--sd-switch-switch-knob-disabled:#EEEEEE;--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:14px;--sd-toggle-toggle-typography-font-weight:500;--sd-toggle-toggle-typography-text-decoration:none;--sd-toggle-toggle-typography-line-height:24px;--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-toggle-toggle-group-gap:8px;--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-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-checkbox-checkbox-typography-default-font-weight:400;--sd-checkbox-checkbox-typography-default-font-size:12px;--sd-checkbox-checkbox-typography-default-line-height:20px;--sd-checkbox-checkbox-typography-default-text-decoration:none;--sd-checkbox-checkbox-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-checkbox-checkbox-typography-selected-font-weight:500;--sd-checkbox-checkbox-typography-selected-font-size:12px;--sd-checkbox-checkbox-typography-selected-text-decoration:none;--sd-checkbox-checkbox-typography-selected-line-height:20px;--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-label-disabled:#888888;--sd-checkbox-checkbox-bg-disabled:#E1E1E1;--sd-checkbox-checkbox-border-disabled:#CCCCCC;--sd-checkbox-checkbox-group-gap-horizontal:24px;--sd-checkbox-checkbox-group-gap-vertical:8px;--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-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-radio-radio-typography-default-font-weight:400;--sd-radio-radio-typography-default-font-size:12px;--sd-radio-radio-typography-default-line-height:20px;--sd-radio-radio-typography-default-text-decoration:none;--sd-radio-radio-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-radio-radio-typography-selected-font-weight:500;--sd-radio-radio-typography-selected-font-size:12px;--sd-radio-radio-typography-selected-text-decoration:none;--sd-radio-radio-typography-selected-line-height:20px;--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-radio-label-disabled:#888888;--sd-radio-radio-group-gap-horizontal:24px;--sd-radio-radio-group-gap-vertical:8px;--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-sm-height:28px;--sd-select-select-sm-radius:4px;--sd-select-select-sm-border-width:1px;--sd-select-select-sm-padding-x:12px;--sd-select-select-sm-gap:8px;--sd-select-select-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-select-select-sm-typography-font-weight:400;--sd-select-select-sm-typography-font-size:12px;--sd-select-select-sm-typography-line-height:20px;--sd-select-select-sm-typography-text-decoration:none;--sd-select-select-sm-icon:16px;--sd-select-select-md-height:36px;--sd-select-select-md-radius:6px;--sd-select-select-md-border-width:1px;--sd-select-select-md-padding-x:16px;--sd-select-select-md-gap:12px;--sd-select-select-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-select-select-md-typography-font-weight:400;--sd-select-select-md-typography-font-size:14px;--sd-select-select-md-typography-text-decoration:none;--sd-select-select-md-typography-line-height:24px;--sd-select-select-md-icon:16px;--sd-select-select-icon-default:#888888;--sd-select-select-icon-disabled:#BBBBBB;--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-field-field-label-sm-height:28px;--sd-field-field-label-sm-gap:6px;--sd-field-field-label-sm-icon:16px;--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-field-field-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-field-field-hint-typography-font-weight:400;--sd-field-field-hint-typography-font-size:12px;--sd-field-field-hint-typography-line-height:20px;--sd-field-field-hint-typography-text-decoration:none;--sd-field-field-hint-color:#555555;--sd-field-field-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-field-field-error-message-typography-font-weight:400;--sd-field-field-error-message-typography-font-size:12px;--sd-field-field-error-message-typography-line-height:20px;--sd-field-field-error-message-typography-text-decoration:none;--sd-field-field-error-message-color:#E30000;--sd-field-field-contents-gap:4px;--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-padding-x:16px;--sd-textinput-textinput-md-padding-y:8px;--sd-textinput-textinput-md-height:36px;--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-size-icon:16px;--sd-textinput-textinput-icon-default:#888888;--sd-textinput-textinput-unit-color:#888888;--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-sm-gap:4px;--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:14px;--sd-number-input-number-input-md-typography-text-decoration:none;--sd-number-input-number-input-md-typography-line-height:24px;--sd-number-input-number-input-md-gap:6px;--sd-number-input-number-input-border-width:1px;--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-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-number-input-number-input-stepper-border-default:#93C4FF;--sd-chip-input-chip-input-sm-min-height:36px;--sd-chip-input-chip-input-sm-padding-x:12px;--sd-chip-input-chip-input-sm-padding-y:6px;--sd-chip-input-chip-input-sm-radius:4px;--sd-chip-input-chip-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-chip-input-chip-input-sm-typography-font-weight:400;--sd-chip-input-chip-input-sm-typography-font-size:12px;--sd-chip-input-chip-input-sm-typography-line-height:20px;--sd-chip-input-chip-input-sm-typography-text-decoration:none;--sd-chip-input-chip-input-md-min-height:40px;--sd-chip-input-chip-input-md-padding-x:16px;--sd-chip-input-chip-input-md-padding-y:8px;--sd-chip-input-chip-input-md-radius:6px;--sd-chip-input-chip-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-chip-input-chip-input-md-typography-font-weight:400;--sd-chip-input-chip-input-md-typography-font-size:14px;--sd-chip-input-chip-input-md-typography-text-decoration:none;--sd-chip-input-chip-input-md-typography-line-height:24px;--sd-chip-input-chip-input-chip-gap:8px;--sd-chip-input-chip-input-border-width:1px;--sd-chip-input-chip-input-border-default:#AAAAAA;--sd-chip-input-chip-input-border-focus:#0075FF;--sd-chip-input-chip-input-border-disabled:#CCCCCC;--sd-chip-input-chip-input-bg-default:#FFFFFF;--sd-chip-input-chip-input-bg-disabled:#E1E1E1;--sd-chip-input-chip-input-text-placeholder:#AAAAAA;--sd-filepicker-filepicker-sm-height:28px;--sd-filepicker-filepicker-sm-padding-x:12px;--sd-filepicker-filepicker-sm-gap:8px;--sd-filepicker-filepicker-sm-radius:4px;--sd-filepicker-filepicker-sm-border-width:1px;--sd-filepicker-filepicker-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-filepicker-filepicker-sm-typography-font-weight:400;--sd-filepicker-filepicker-sm-typography-font-size:12px;--sd-filepicker-filepicker-sm-typography-line-height:20px;--sd-filepicker-filepicker-sm-typography-text-decoration:none;--sd-filepicker-filepicker-sm-icon:16px;--sd-filepicker-filepicker-md-height:36px;--sd-filepicker-filepicker-md-padding-x:16px;--sd-filepicker-filepicker-md-gap:12px;--sd-filepicker-filepicker-md-radius:6px;--sd-filepicker-filepicker-md-border-width:1px;--sd-filepicker-filepicker-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-filepicker-filepicker-md-typography-font-weight:400;--sd-filepicker-filepicker-md-typography-font-size:14px;--sd-filepicker-filepicker-md-typography-text-decoration:none;--sd-filepicker-filepicker-md-typography-line-height:24px;--sd-filepicker-filepicker-md-icon:20px;--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-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:14px;--sd-datepicker-datepicker-md-typography-text-decoration:none;--sd-datepicker-datepicker-md-typography-line-height:24px;--sd-datepicker-datepicker-md-radius: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-disabled:#888888;--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-datepicker-datepicker-calendar-legend-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-legend-typography-font-weight:400;--sd-datepicker-datepicker-calendar-legend-typography-font-size:11px;--sd-datepicker-datepicker-calendar-legend-typography-line-height:18px;--sd-datepicker-datepicker-calendar-legend-typography-text-decoration:none;--sd-datepicker-datepicker-calendar-legend-gap:4px;--sd-datepicker-datepicker-calendar-legend-group-gap:12px;--sd-datepicker-datepicker-calendar-time-bg-default:#F9F9F9;--sd-datepicker-datepicker-calendar-time-bg-selected:#F5FAFF;--sd-datepicker-datepicker-calendar-time-date-label:#222222;--sd-datepicker-datepicker-calendar-time-date-unit:#888888;--sd-datepicker-datepicker-calendar-time-date-gap:6px;--sd-datepicker-datepicker-calendar-time-radius:8px;--sd-datepicker-datepicker-calendar-time-padding-x:16px;--sd-datepicker-datepicker-calendar-time-padding-y:12px;--sd-datepicker-datepicker-calendar-time-gap:12px;--sd-datepicker-datepicker-calendar-time-section-gap:12px;--sd-datepicker-datepicker-calendar-time-unit-gap:2px;--sd-datepicker-datepicker-calendar-time-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-time-typography-font-weight:500;--sd-datepicker-datepicker-calendar-time-typography-font-size:12px;--sd-datepicker-datepicker-calendar-time-typography-text-decoration:none;--sd-datepicker-datepicker-calendar-time-typography-line-height: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-bg-disabled:#F6F6F6;--sd-chip-chip-content-default:#222222;--sd-chip-chip-content-error:#E30000;--sd-chip-chip-content-focus:#222222;--sd-chip-chip-content-disabled:#888888;--sd-chip-chip-border-focus:#E1E1E1;--sd-chip-chip-border-width:1px;--sd-timepicker-timepicker-border-default:#AAAAAA;--sd-timepicker-timepicker-border-focus:#0075FF;--sd-timepicker-timepicker-border-disabled:#CCCCCC;--sd-timepicker-timepicker-border-width:1px;--sd-timepicker-timepicker-bg-default:#FFFFFF;--sd-timepicker-timepicker-bg-disabled:#E1E1E1;--sd-timepicker-timepicker-icon-default:#888888;--sd-timepicker-timepicker-icon-disabled:#BBBBBB;--sd-timepicker-timepicker-text-default:#222222;--sd-timepicker-timepicker-text-disabled:#888888;--sd-timepicker-timepicker-selector-bg:#FFFFFF;--sd-timepicker-timepicker-selector-range-heading-color:#555555;--sd-timepicker-timepicker-selector-range-heading-gap:16px;--sd-timepicker-timepicker-selector-range-padding-x-y:24px;--sd-timepicker-timepicker-selector-range-panel-gap:24px;--sd-timepicker-timepicker-selector-range-section-gap:12px;--sd-timepicker-timepicker-selector-radius:8px;--sd-timepicker-timepicker-selector-section-padding-x:16px;--sd-timepicker-timepicker-selector-section-padding-y:12px;--sd-timepicker-timepicker-selector-time-gap:4px;--sd-timepicker-timepicker-selector-time-column-gap:8px;--sd-timepicker-timepicker-selector-input-width:40px;--sd-timepicker-timepicker-selector-colon-size:16px;--sd-timepicker-timepicker-sm-height:28px;--sd-timepicker-timepicker-sm-padding-x:12px;--sd-timepicker-timepicker-sm-gap:8px;--sd-timepicker-timepicker-sm-icon:16px;--sd-timepicker-timepicker-sm-radius:4px;--sd-timepicker-timepicker-md-height:36px;--sd-timepicker-timepicker-md-padding-x:16px;--sd-timepicker-timepicker-md-gap:12px;--sd-timepicker-timepicker-md-icon:20px;--sd-timepicker-timepicker-md-radius:6px;--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-tag-tag-group-gap:8px;--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-x:20px;--sd-popover-popover-padding-y:16px;--sd-popover-popover-gap:12px;--sd-popover-popover-contents-gap:4px;--sd-popover-popover-arrow-width:16px;--sd-popover-popover-arrow-height:12px;--sd-popover-popover-default-bg:#07284A;--sd-popover-popover-default-title:#FFFFFF;--sd-popover-popover-default-description:#FFFFFF;--sd-popover-popover-default-sub-action:#D8D8D8;--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-title-leading-icon:16px;--sd-popover-popover-title-gap:8px;--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-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-popover-popover-danger-bg:#FCEFEF;--sd-popover-popover-danger-title:#FB4444;--sd-popover-popover-warning-bg:#FEF1EA;--sd-popover-popover-warning-title:#FF6B00;--sd-popover-popover-accent-bg:#E6F1FF;--sd-popover-popover-accent-title:#0075FF;--sd-popover-popover-light-description:#555555;--sd-popover-popover-light-sub-action:#888888;--sd-toast-toast-radius:8px;--sd-toast-toast-padding-x:24px;--sd-toast-toast-padding-y:12px;--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:500;--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-toast-toast-info-bg:#E6F1FF;--sd-toast-toast-info-icon:#0075FF;--sd-toast-toast-info-text:#222222;--sd-toast-toast-info-text-link:#555555;--sd-overlay-overlay-header-bg:#FFFFFF;--sd-overlay-overlay-header-padding-x:24px;--sd-overlay-overlay-header-padding-y:20px;--sd-overlay-overlay-header-gap:12px;--sd-overlay-overlay-header-title-color:#033F59;--sd-overlay-overlay-header-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-overlay-overlay-header-title-typography-font-weight:700;--sd-overlay-overlay-header-title-typography-font-size:16px;--sd-overlay-overlay-header-title-typography-text-decoration:none;--sd-overlay-overlay-header-title-typography-line-height:26px;--sd-overlay-overlay-footer-bg-default:#FFFFFF;--sd-overlay-overlay-footer-bg-neutral:#F6F6F6;--sd-overlay-overlay-footer-padding-x:20px;--sd-overlay-overlay-footer-padding-y:8px;--sd-overlay-overlay-footer-gap:16px;--sd-overlay-overlay-footer-shadow-x:0px;--sd-overlay-overlay-footer-shadow-y:0px;--sd-overlay-overlay-footer-shadow-blur:24px;--sd-overlay-overlay-footer-shadow-spread:0px;--sd-overlay-overlay-footer-shadow-color:rgba(34,34,34,0.2);--sd-overlay-overlay-footer-shadow-type:dropShadow;--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-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-popup-popup-header-bg-default:#07284A;--sd-popup-popup-header-bg-inverse:#FFFFFF;--sd-popup-popup-header-title-default:#FFFFFF;--sd-popup-popup-header-title-inverse:#004290;--sd-popup-popup-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-popup-popup-header-typography-font-weight:700;--sd-popup-popup-header-typography-font-size:18px;--sd-popup-popup-header-typography-line-height:30px;--sd-popup-popup-header-typography-text-decoration:none;--sd-popup-popup-header-padding-x:16px;--sd-popup-popup-header-padding-y:12px;--sd-popup-popup-bg:#EEEEEE;--sd-drawer-drawer-bg:#F6F6F6;--sd-drawer-drawer-body-border:#E1E1E1;--sd-callout-callout-radius:8px;--sd-callout-callout-border-width:1px;--sd-callout-callout-body-gap:2px;--sd-callout-callout-body-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-callout-callout-body-typography-font-size:12px;--sd-callout-callout-body-typography-font-weight:400;--sd-callout-callout-body-typography-line-height:20px;--sd-callout-callout-body-typography-text-decoration:none;--sd-callout-callout-body-padding-x:12px;--sd-callout-callout-body-padding-y:8px;--sd-callout-callout-default-bg:#F9F9F9;--sd-callout-callout-default-border:#E1E1E1;--sd-callout-callout-default-content:#555555;--sd-callout-callout-danger-bg:#FCEFEF;--sd-callout-callout-danger-border:#FFB5B5;--sd-callout-callout-danger-content:#222222;--sd-callout-callout-danger-title-bg:#FB4444;--sd-callout-callout-danger-title-padding-x:24px;--sd-callout-callout-danger-title-gap:2px;--sd-callout-callout-danger-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-callout-callout-danger-title-typography-font-weight:700;--sd-callout-callout-danger-title-typography-font-size:16px;--sd-callout-callout-danger-title-typography-text-decoration:none;--sd-callout-callout-danger-title-typography-line-height:26px;--sd-callout-callout-danger-title-color:#FFFFFF;--sd-callout-callout-danger-title-icon:24px;--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-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-progress-progress-linear-height:20px;--sd-progress-progress-linear-radius:9999px;--sd-progress-progress-linear-gap:12px;--sd-progress-progress-linear-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-progress-progress-linear-typography-font-size:12px;--sd-progress-progress-linear-typography-font-weight:700;--sd-progress-progress-linear-typography-text-decoration:none;--sd-progress-progress-linear-typography-line-height:20px;--sd-progress-progress-circular-size:80px;--sd-progress-progress-circular-gap:8px;--sd-progress-progress-circular-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-progress-progress-circular-typography-font-weight:700;--sd-progress-progress-circular-typography-font-size:16px;--sd-progress-progress-circular-typography-text-decoration:none;--sd-progress-progress-circular-typography-line-height:26px;--sd-progress-progress-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-progress-progress-label-typography-font-size:12px;--sd-progress-progress-label-typography-font-weight:400;--sd-progress-progress-label-typography-line-height:20px;--sd-progress-progress-label-typography-text-decoration:none;--sd-progress-progress-color-track:#EEEEEE;--sd-progress-progress-color-label:#555555;--sd-progress-progress-active-color:#2D8DFF;--sd-progress-progress-success-color:#12B553;--sd-progress-progress-error-color:#FB4444;--sd-progress-progress-bar-text:#FFFFFF;--sd-progress-progress-inverse-color:#FFFFFF;--sd-progress-progress-inverse-opacity:40%;--sd-table-table-header-height:36px;--sd-table-table-header-padding-x:16px;--sd-table-table-header-gap:4px;--sd-table-table-header-bg:#F5FAFF;--sd-table-table-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-table-table-header-typography-font-weight:500;--sd-table-table-header-typography-font-size:12px;--sd-table-table-header-typography-line-height:20px;--sd-table-table-header-typography-text-decoration:none;--sd-table-table-header-resizing-bar-color:#CCCCCC;--sd-table-table-header-resizing-bar-height:16px;--sd-table-table-body-default-height:44px;--sd-table-table-body-default-padding-y:8px;--sd-table-table-body-dense-height:32px;--sd-table-table-body-padding-y-dense:6px;--sd-table-table-body-padding-y-default:8px;--sd-table-table-body-padding-x-default:8px;--sd-table-table-body-padding-x-wide:16px;--sd-table-table-body-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-table-table-body-typography-font-weight:400;--sd-table-table-body-typography-font-size:12px;--sd-table-table-body-typography-line-height:20px;--sd-table-table-body-typography-text-decoration:none;--sd-table-table-border-color:#E1E1E1;--sd-table-table-border-width:1px;--sd-table-table-content-gap:8px;--sd-table-table-bar-section-gap:12px;--sd-table-table-bar-divider-height:20px;--sd-table-table-bar-height:44px;--sd-table-table-bar-count-total:#066D9B;--sd-table-table-bar-count-null:#888888;--sd-table-table-radius:8px;--sd-table-table-key-value-body-padding-y:8px;--sd-table-table-key-value-body-padding-x-default:8px;--sd-table-table-key-value-body-padding-x-wide:16px;--sd-table-table-key-value-height:44px;--sd-table-table-key-value-search-padding-x:32px;--sd-table-table-key-value-search-bg:#F9F9F9;--sd-table-table-separator-color:#EEEEEE;--sd-table-table-separator-width-default:6px;--sd-table-table-separator-width-dense:4px;--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;--sd-pagination-pagination-simple-gap:8px;--sd-tab-tab-main-lg-height:44px;--sd-tab-tab-main-lg-padding-x:32px;--sd-tab-tab-main-md-height:36px;--sd-tab-tab-main-md-padding-x:24px;--sd-tab-tab-main-gap:8px;--sd-tab-tab-main-container-gap:4px;--sd-tab-tab-main-radius:6px;--sd-tab-tab-main-border-width:1px;--sd-tab-tab-main-selected-bg:#FFFFFF;--sd-tab-tab-main-selected-text:#0075FF;--sd-tab-tab-main-selected-border:#0075FF;--sd-tab-tab-main-selected-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-tab-tab-main-selected-typography-font-weight:700;--sd-tab-tab-main-selected-typography-font-size:12px;--sd-tab-tab-main-selected-typography-line-height:20px;--sd-tab-tab-main-selected-typography-text-decoration:none;--sd-tab-tab-main-default-bg:#F6F6F6;--sd-tab-tab-main-default-text:#888888;--sd-tab-tab-main-default-border:#CCCCCC;--sd-tab-tab-main-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-tab-tab-main-default-typography-font-weight:400;--sd-tab-tab-main-default-typography-font-size:12px;--sd-tab-tab-main-default-typography-line-height:20px;--sd-tab-tab-main-default-typography-text-decoration:none;--sd-tab-tab-sub-selected-text:#0075FF;--sd-tab-tab-sub-selected-line:#0075FF;--sd-tab-tab-sub-selected-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-tab-tab-sub-selected-typography-font-weight:700;--sd-tab-tab-sub-selected-typography-font-size:12px;--sd-tab-tab-sub-selected-typography-line-height:20px;--sd-tab-tab-sub-selected-typography-text-decoration:none;--sd-tab-tab-sub-default-text:#222222;--sd-tab-tab-sub-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-tab-tab-sub-default-typography-font-weight:400;--sd-tab-tab-sub-default-typography-font-size:12px;--sd-tab-tab-sub-default-typography-line-height:20px;--sd-tab-tab-sub-default-typography-text-decoration:none;--sd-tab-tab-sub-border-width:1px;--sd-tab-tab-sub-gap-horizontal:24px;--sd-tab-tab-sub-gap-vertical:16px;--sd-tab-tab-sub-content-gap:4px;--sd-tab-tab-sub-item-height:20px;--sd-gnb-belt-gnb-belt-top-height:56px;--sd-gnb-belt-gnb-belt-top-padding-x:12px;--sd-gnb-belt-gnb-belt-top-gap:8px;--sd-gnb-belt-gnb-belt-logo-height:32px;--sd-gnb-belt-gnb-belt-body-padding-y:12px;--sd-gnb-belt-gnb-belt-item-padding-y:6px;--sd-gnb-belt-gnb-belt-item-padding-right:20px;--sd-gnb-belt-gnb-belt-item-gap:12px;--sd-gnb-belt-gnb-belt-item-icon:12px;--sd-gnb-belt-gnb-belt-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-gnb-belt-gnb-belt-item-typography-default-font-weight:500;--sd-gnb-belt-gnb-belt-item-typography-default-font-size:12px;--sd-gnb-belt-gnb-belt-item-typography-default-line-height:20px;--sd-gnb-belt-gnb-belt-item-typography-default-text-decoration:none;--sd-gnb-belt-gnb-belt-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-gnb-belt-gnb-belt-item-typography-selected-font-weight:700;--sd-gnb-belt-gnb-belt-item-typography-selected-font-size:12px;--sd-gnb-belt-gnb-belt-item-typography-selected-line-height:20px;--sd-gnb-belt-gnb-belt-item-typography-selected-text-decoration:none;--sd-gnb-belt-gnb-belt-item-depth1-padding-left:20px;--sd-gnb-belt-gnb-belt-item-depth1-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-gnb-belt-gnb-belt-item-depth1-typography-font-weight:700;--sd-gnb-belt-gnb-belt-item-depth1-typography-font-size:13px;--sd-gnb-belt-gnb-belt-item-depth1-typography-line-height:22px;--sd-gnb-belt-gnb-belt-item-depth1-typography-text-decoration:none;--sd-gnb-belt-gnb-belt-item-depth2-padding-left:32px;--sd-gnb-belt-gnb-belt-item-depth3-padding-left:44px;--sd-gnb-belt-gnb-belt-fold-width:48px;--sd-gnb-box-gnb-box-top-height:56px;--sd-gnb-box-gnb-box-padding-x:16px;--sd-gnb-box-gnb-box-gap:16px;--sd-gnb-box-gnb-box-button-gap:8px;--sd-gnb-box-gnb-box-logo-height:32px;--sd-gnb-box-gnb-box-menu-body-padding:12px;--sd-gnb-box-gnb-box-item-padding-y:6px;--sd-gnb-box-gnb-box-item-padding-right:12px;--sd-gnb-box-gnb-box-item-gap:8px;--sd-gnb-box-gnb-box-item-radius:8px;--sd-gnb-box-gnb-box-item-arrow:12px;--sd-gnb-box-gnb-box-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-gnb-box-gnb-box-item-typography-default-font-weight:500;--sd-gnb-box-gnb-box-item-typography-default-font-size:14px;--sd-gnb-box-gnb-box-item-typography-default-line-height:24px;--sd-gnb-box-gnb-box-item-typography-default-text-decoration:none;--sd-gnb-box-gnb-box-item-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-gnb-box-gnb-box-item-typography-bold-font-weight:700;--sd-gnb-box-gnb-box-item-typography-bold-font-size:14px;--sd-gnb-box-gnb-box-item-typography-bold-line-height:24px;--sd-gnb-box-gnb-box-item-typography-bold-text-decoration:none;--sd-gnb-box-gnb-box-item-depth1-padding-left:12px;--sd-gnb-box-gnb-box-item-depth1-icon:20px;--sd-gnb-box-gnb-box-item-depth2-padding-left:24px;--sd-gnb-box-gnb-box-item-depth3-padding-left:36px;--sd-stepper-stepper-sm-sequence-size:20px;--sd-stepper-stepper-sm-typography-active-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-stepper-stepper-sm-typography-active-font-weight:700;--sd-stepper-stepper-sm-typography-active-font-size:12px;--sd-stepper-stepper-sm-typography-active-line-height:20px;--sd-stepper-stepper-sm-typography-active-text-decoration:none;--sd-stepper-stepper-sm-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-stepper-stepper-sm-typography-default-font-weight:500;--sd-stepper-stepper-sm-typography-default-font-size:12px;--sd-stepper-stepper-sm-typography-default-line-height:20px;--sd-stepper-stepper-sm-typography-default-text-decoration:none;--sd-stepper-stepper-dash-width:20px;--sd-stepper-stepper-dash-color:#888888;--sd-stepper-stepper-lg-sequence-size:24px;--sd-stepper-stepper-lg-typography-active-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-stepper-stepper-lg-typography-active-font-weight:700;--sd-stepper-stepper-lg-typography-active-font-size:14px;--sd-stepper-stepper-lg-typography-active-line-height:24px;--sd-stepper-stepper-lg-typography-active-text-decoration:none;--sd-stepper-stepper-lg-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-stepper-stepper-lg-typography-default-font-weight:500;--sd-stepper-stepper-lg-typography-default-font-size:14px;--sd-stepper-stepper-lg-typography-default-line-height:24px;--sd-stepper-stepper-lg-typography-default-text-decoration:none;--sd-stepper-stepper-container-gap:12px;--sd-stepper-stepper-item-gap:8px;--sd-stepper-stepper-sequence-radius:9999px;--sd-stepper-stepper-sequence-border-active:#93C4FF;--sd-stepper-stepper-sequence-border-default:#E1E1E1;--sd-stepper-stepper-sequence-border-completed:#CCCCCC;--sd-stepper-stepper-sequence-border-witdh:1px;--sd-stepper-stepper-sequence-icon:12px;--sd-stepper-stepper-sequence-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-stepper-stepper-sequence-typography-font-weight:700;--sd-stepper-stepper-sequence-typography-font-size:12px;--sd-stepper-stepper-sequence-typography-line-height:20px;--sd-stepper-stepper-sequence-typography-text-decoration:none;--sd-stepper-stepper-sequence-bg-active:#D9EAFF;--sd-stepper-stepper-sequence-bg-default:#FFFFFF;--sd-stepper-stepper-sequence-bg-completed:#E1E1E1;--sd-stepper-stepper-sequence-text-active:#0075FF;--sd-stepper-stepper-sequence-text-default:#AAAAAA;--sd-stepper-stepper-text-active:#0075FF;--sd-stepper-stepper-text-default:#888888;--sd-gnb-light-bg:#FFFFFF;--sd-gnb-light-divider:#E1E1E1;--sd-gnb-light-item-bg-default:#FFFFFF;--sd-gnb-light-item-bg-hover:#F6F6F6;--sd-gnb-light-item-bg-selected:#EFF6FF;--sd-gnb-light-item-fg-default:#222222;--sd-gnb-light-item-fg-hover:#222222;--sd-gnb-light-item-fg-selected:#0075FF;--sd-gnb-light-item-chevron:#555555;--sd-gnb-light-top-icon:#888888;--sd-gnb-dark-bg:#001B39;--sd-gnb-dark-divider:#004177;--sd-gnb-dark-item-bg-default:#001B39;--sd-gnb-dark-item-bg-hover:#07284A;--sd-gnb-dark-item-bg-selected:#002B5E;--sd-gnb-dark-item-fg-default:#FFFFFF;--sd-gnb-dark-item-fg-hover:#FFFFFF;--sd-gnb-dark-item-fg-selected:#93C4FF;--sd-gnb-dark-item-chevron:#AAAAAA;--sd-gnb-dark-top-icon:#FFFFFF}.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}.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}";
137
+ 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-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-xs-default-font-size:12px;--sd-system-typography-control-xs-default-font-weight:400;--sd-system-typography-control-xs-default-text-decoration:none;--sd-system-typography-control-xs-default-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-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-xs-underline-font-size:12px;--sd-system-typography-control-xs-underline-font-weight:500;--sd-system-typography-control-xs-underline-text-decoration:underline;--sd-system-typography-control-xs-underline-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:14px;--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:24px;--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:14px;--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:24px;--sd-system-typography-control-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-control-md-default-font-size:16px;--sd-system-typography-control-md-default-font-weight:500;--sd-system-typography-control-md-default-text-decoration:none;--sd-system-typography-control-md-default-line-height:26px;--sd-system-typography-control-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-control-md-underline-font-size:16px;--sd-system-typography-control-md-underline-font-weight:500;--sd-system-typography-control-md-underline-text-decoration:underline;--sd-system-typography-control-md-underline-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-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-md-medium-font-size:14px;--sd-system-typography-feedback-md-medium-font-weight:500;--sd-system-typography-feedback-md-medium-line-height:24px;--sd-system-typography-feedback-md-medium-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-xs-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-xs-default-font-weight:400;--sd-system-typography-field-xs-default-font-size:11px;--sd-system-typography-field-xs-default-line-height:18px;--sd-system-typography-field-xs-default-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-typography-navigation-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-navigation-xs-medium-font-weight:500;--sd-system-typography-navigation-xs-medium-font-size:11px;--sd-system-typography-navigation-xs-medium-line-height:18px;--sd-system-typography-navigation-xs-medium-text-decoration:none;--sd-system-typography-navigation-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-navigation-xs-bold-font-weight:700;--sd-system-typography-navigation-xs-bold-font-size:11px;--sd-system-typography-navigation-xs-bold-line-height:18px;--sd-system-typography-navigation-xs-bold-text-decoration:none;--sd-system-typography-navigation-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-navigation-sm-default-font-weight:400;--sd-system-typography-navigation-sm-default-font-size:12px;--sd-system-typography-navigation-sm-default-line-height:20px;--sd-system-typography-navigation-sm-default-text-decoration:none;--sd-system-typography-navigation-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-navigation-sm-medium-font-weight:500;--sd-system-typography-navigation-sm-medium-font-size:12px;--sd-system-typography-navigation-sm-medium-line-height:20px;--sd-system-typography-navigation-sm-medium-text-decoration:none;--sd-system-typography-navigation-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-navigation-sm-bold-font-weight:700;--sd-system-typography-navigation-sm-bold-font-size:12px;--sd-system-typography-navigation-sm-bold-line-height:20px;--sd-system-typography-navigation-sm-bold-text-decoration:none;--sd-system-typography-navigation-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-navigation-md-bold-font-weight:700;--sd-system-typography-navigation-md-bold-font-size:13px;--sd-system-typography-navigation-md-bold-line-height:22px;--sd-system-typography-navigation-md-bold-text-decoration:none;--sd-system-typography-navigation-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-navigation-lg-medium-font-weight:500;--sd-system-typography-navigation-lg-medium-font-size:14px;--sd-system-typography-navigation-lg-medium-line-height:24px;--sd-system-typography-navigation-lg-medium-text-decoration:none;--sd-system-typography-navigation-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-navigation-lg-bold-font-weight:700;--sd-system-typography-navigation-lg-bold-font-size:14px;--sd-system-typography-navigation-lg-bold-line-height:24px;--sd-system-typography-navigation-lg-bold-text-decoration:none;--sd-system-typography-table-header-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-table-header-font-weight:500;--sd-system-typography-table-header-font-size:12px;--sd-system-typography-table-header-line-height:20px;--sd-system-typography-table-header-text-decoration:none;--sd-system-typography-table-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-system-typography-table-body-font-weight:400;--sd-system-typography-table-body-font-size:12px;--sd-system-typography-table-body-line-height:20px;--sd-system-typography-table-body-text-decoration:none;--sd-system-typography-table-accent-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-table-accent-font-weight:700;--sd-system-typography-table-accent-font-size:12px;--sd-system-typography-table-accent-line-height:20px;--sd-system-typography-table-accent-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-size-navigation-lg-height:44px;--sd-system-size-navigation-md-height:36px;--sd-system-size-table-height-xs:32px;--sd-system-size-table-height-sm:36px;--sd-system-size-table-height-md:44px;--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-feedback-lg-padding-x:16px;--sd-system-space-feedback-lg-gap:12px;--sd-system-space-stack-gap-text-tight:2px;--sd-system-space-stack-gap-text-normal:4px;--sd-system-space-stack-gap-text-relaxed:8px;--sd-system-space-stack-gap-element-tight:4px;--sd-system-space-stack-gap-element-normal:8px;--sd-system-space-stack-gap-element-relaxed:12px;--sd-system-space-stack-gap-element-wide:16px;--sd-system-space-stack-gap-element-spacious:24px;--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-padding-y:8px;--sd-system-space-field-md-container-gap:12px;--sd-system-space-field-md-gap:16px;--sd-system-space-navigation-lg-padding-x:32px;--sd-system-space-navigation-md-padding-x:24px;--sd-system-space-table-padding-sm:8px;--sd-system-space-table-padding-md:16px;--sd-system-space-action-gap:16px;--sd-system-space-overlay-padding-x-sm:20px;--sd-system-space-overlay-padding-x-md:24px;--sd-system-space-overlay-padding-y-sm:8px;--sd-system-space-panel-gap:12px;--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-radius-navigation:6px;--sd-system-border-width-control-default:1px;--sd-system-border-width-field-default:1px;--sd-system-border-width-navigation-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:#2D8DFF;--sd-system-color-bg-accent-light-light:#F5FAFF;--sd-system-color-bg-accent-bright-default:#D9EAFF;--sd-system-color-bg-accent-bright-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-neutral-light:#F6F6F6;--sd-system-color-bg-neutral-bright:#F9F9F9;--sd-system-color-bg-table-header:#F5FAFF;--sd-system-color-fg-primary:#222222;--sd-system-color-fg-secondary:#555555;--sd-system-color-fg-tertiary:#888888;--sd-system-color-fg-quaternary:#AAAAAA;--sd-system-color-fg-brand:#005CC9;--sd-system-color-fg-subtle-warm:#066D9B;--sd-system-color-fg-subtle-cool:#025497;--sd-system-color-fg-deep:#004290;--sd-system-color-fg-success:#00973C;--sd-system-color-fg-danger-light:#FB4444;--sd-system-color-fg-accent:#0075FF;--sd-system-color-fg-danger:#E30000;--sd-system-color-fg-warning:#FF6B00;--sd-system-color-fg-inverse:#FFFFFF;--sd-system-color-disabled-bg:#E1E1E1;--sd-system-color-disabled-text:#888888;--sd-system-color-disabled-icon:#BBBBBB;--sd-system-color-disabled-border:#CCCCCC;--sd-system-color-link-accent:#006AC1;--sd-system-color-divider-default:#E1E1E1;--sd-system-color-border-default:#E1E1E1;--sd-system-color-border-accent:#0075FF;--sd-system-color-border-accent-light:#93C4FF;--sd-system-color-border-danger:#FB4444;--sd-system-color-border-success:#12B553;--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-bg-read-only:#EEEEEE;--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-text-read-only:#555555;--sd-system-color-field-icon-default:#888888;--sd-system-color-control-bg-inverse-hover:#0075FF;--sd-system-color-navigation-gnb-bg-dark:#001B39;--sd-system-shadow-spread-sm-x:0px;--sd-system-shadow-spread-sm-y:0px;--sd-system-shadow-spread-sm-blur:8px;--sd-system-shadow-spread-sm-spread:0px;--sd-system-shadow-spread-sm-color:rgba(34,34,34,0.1);--sd-system-shadow-spread-sm-type:dropShadow;--sd-system-shadow-spread-md-x:0px;--sd-system-shadow-spread-md-y:0px;--sd-system-shadow-spread-md-blur:24px;--sd-system-shadow-spread-md-spread:0px;--sd-system-shadow-spread-md-color:rgba(34,34,34,0.2);--sd-system-shadow-spread-md-type:dropShadow;--sd-system-shadow-focus-x:0px;--sd-system-shadow-focus-y:0px;--sd-system-shadow-focus-blur:8px;--sd-system-shadow-focus-spread:0px;--sd-system-shadow-focus-color:rgba(0,117,255,0.25);--sd-system-shadow-focus-type:dropShadow;--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-subtle-bg-default:#1F8AE1;--sd-button-button-brand-subtle-bg-hover:#006AC1;--sd-button-button-brand-subtle-content:#FFFFFF;--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-dropdown-brand-strong-split:#006AC1;--sd-button-button-dropdown-brand-subtle-split:#5CB0F3;--sd-button-button-dropdown-danger-strong-split:#FF7C7C;--sd-button-button-dropdown-xs-arrow:12px;--sd-button-button-dropdown-xs-gap:6px;--sd-button-button-dropdown-sm-arrow:12px;--sd-button-button-dropdown-sm-gap:8px;--sd-button-button-dropdown-md-arrow:16px;--sd-button-button-dropdown-md-gap:16px;--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-text:#222222;--sd-button-button-neutral-outline-icon:#555555;--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-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-button-button-group-gap-normal:8px;--sd-button-button-group-gap-wide:12px;--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-ghost-button-ghost-button-group-gap:8px;--sd-text-link-text-link-sm-gap:4px;--sd-text-link-text-link-sm-icon:16px;--sd-text-link-text-link-sm-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-sm-typography-default-font-size:12px;--sd-text-link-text-link-sm-typography-default-font-weight:500;--sd-text-link-text-link-sm-typography-default-text-decoration:none;--sd-text-link-text-link-sm-typography-default-line-height:20px;--sd-text-link-text-link-sm-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-sm-typography-underline-font-size:12px;--sd-text-link-text-link-sm-typography-underline-font-weight:500;--sd-text-link-text-link-sm-typography-underline-text-decoration:underline;--sd-text-link-text-link-sm-typography-underline-line-height:20px;--sd-text-link-text-link-md-gap:8px;--sd-text-link-text-link-md-icon:16px;--sd-text-link-text-link-md-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-md-typography-default-font-size:14px;--sd-text-link-text-link-md-typography-default-font-weight:500;--sd-text-link-text-link-md-typography-default-text-decoration:none;--sd-text-link-text-link-md-typography-default-line-height:24px;--sd-text-link-text-link-md-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-md-typography-underline-font-size:14px;--sd-text-link-text-link-md-typography-underline-font-weight:500;--sd-text-link-text-link-md-typography-underline-text-decoration:underline;--sd-text-link-text-link-md-typography-underline-line-height:24px;--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-text-link-text-link-lg-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-lg-typography-default-font-size:16px;--sd-text-link-text-link-lg-typography-default-font-weight:500;--sd-text-link-text-link-lg-typography-default-text-decoration:none;--sd-text-link-text-link-lg-typography-default-line-height:26px;--sd-text-link-text-link-lg-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-lg-typography-underline-font-size:16px;--sd-text-link-text-link-lg-typography-underline-font-weight:500;--sd-text-link-text-link-lg-typography-underline-text-decoration:underline;--sd-text-link-text-link-lg-typography-underline-line-height:26px;--sd-text-link-text-link-lg-gap:8px;--sd-text-link-text-link-lg-icon:20px;--sd-text-link-text-link-group-horizontal-normal:16px;--sd-text-link-text-link-group-horizontal-wide:24px;--sd-text-link-text-link-group-vertical-normal:4px;--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-default:#FFFFFF;--sd-switch-switch-knob-disabled:#EEEEEE;--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:14px;--sd-toggle-toggle-typography-font-weight:500;--sd-toggle-toggle-typography-text-decoration:none;--sd-toggle-toggle-typography-line-height:24px;--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-toggle-toggle-group-gap:8px;--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-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-checkbox-checkbox-typography-default-font-weight:400;--sd-checkbox-checkbox-typography-default-font-size:12px;--sd-checkbox-checkbox-typography-default-line-height:20px;--sd-checkbox-checkbox-typography-default-text-decoration:none;--sd-checkbox-checkbox-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-checkbox-checkbox-typography-selected-font-weight:500;--sd-checkbox-checkbox-typography-selected-font-size:12px;--sd-checkbox-checkbox-typography-selected-text-decoration:none;--sd-checkbox-checkbox-typography-selected-line-height:20px;--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-label-disabled:#888888;--sd-checkbox-checkbox-bg-disabled:#E1E1E1;--sd-checkbox-checkbox-border-disabled:#CCCCCC;--sd-checkbox-checkbox-group-gap-horizontal:24px;--sd-checkbox-checkbox-group-gap-vertical:8px;--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-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-radio-radio-typography-default-font-weight:400;--sd-radio-radio-typography-default-font-size:12px;--sd-radio-radio-typography-default-line-height:20px;--sd-radio-radio-typography-default-text-decoration:none;--sd-radio-radio-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-radio-radio-typography-selected-font-weight:500;--sd-radio-radio-typography-selected-font-size:12px;--sd-radio-radio-typography-selected-text-decoration:none;--sd-radio-radio-typography-selected-line-height:20px;--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-radio-label-disabled:#888888;--sd-radio-radio-group-gap-horizontal:24px;--sd-radio-radio-group-gap-vertical:8px;--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-sm-height:28px;--sd-select-select-sm-radius:4px;--sd-select-select-sm-border-width:1px;--sd-select-select-sm-padding-x:12px;--sd-select-select-sm-gap:8px;--sd-select-select-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-select-select-sm-typography-font-weight:400;--sd-select-select-sm-typography-font-size:12px;--sd-select-select-sm-typography-line-height:20px;--sd-select-select-sm-typography-text-decoration:none;--sd-select-select-sm-icon:16px;--sd-select-select-md-height:36px;--sd-select-select-md-radius:6px;--sd-select-select-md-border-width:1px;--sd-select-select-md-padding-x:16px;--sd-select-select-md-gap:12px;--sd-select-select-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-select-select-md-typography-font-weight:400;--sd-select-select-md-typography-font-size:14px;--sd-select-select-md-typography-text-decoration:none;--sd-select-select-md-typography-line-height:24px;--sd-select-select-md-icon:16px;--sd-select-select-icon-default:#888888;--sd-select-select-icon-disabled:#BBBBBB;--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-field-field-label-sm-height:28px;--sd-field-field-label-sm-gap:6px;--sd-field-field-label-sm-icon:16px;--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-field-field-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-field-field-hint-typography-font-weight:400;--sd-field-field-hint-typography-font-size:12px;--sd-field-field-hint-typography-line-height:20px;--sd-field-field-hint-typography-text-decoration:none;--sd-field-field-hint-color:#555555;--sd-field-field-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-field-field-error-message-typography-font-weight:400;--sd-field-field-error-message-typography-font-size:12px;--sd-field-field-error-message-typography-line-height:20px;--sd-field-field-error-message-typography-text-decoration:none;--sd-field-field-error-message-color:#E30000;--sd-field-field-contents-gap:4px;--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-padding-x:16px;--sd-textinput-textinput-md-padding-y:8px;--sd-textinput-textinput-md-height:36px;--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-size-icon:16px;--sd-textinput-textinput-icon-default:#888888;--sd-textinput-textinput-unit-color:#888888;--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-sm-gap:4px;--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:14px;--sd-number-input-number-input-md-typography-text-decoration:none;--sd-number-input-number-input-md-typography-line-height:24px;--sd-number-input-number-input-md-gap:6px;--sd-number-input-number-input-border-width:1px;--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-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-number-input-number-input-stepper-border-default:#93C4FF;--sd-chip-input-chip-input-sm-min-height:36px;--sd-chip-input-chip-input-sm-padding-x:12px;--sd-chip-input-chip-input-sm-padding-y:6px;--sd-chip-input-chip-input-sm-radius:4px;--sd-chip-input-chip-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-chip-input-chip-input-sm-typography-font-weight:400;--sd-chip-input-chip-input-sm-typography-font-size:12px;--sd-chip-input-chip-input-sm-typography-line-height:20px;--sd-chip-input-chip-input-sm-typography-text-decoration:none;--sd-chip-input-chip-input-md-min-height:40px;--sd-chip-input-chip-input-md-padding-x:16px;--sd-chip-input-chip-input-md-padding-y:8px;--sd-chip-input-chip-input-md-radius:6px;--sd-chip-input-chip-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-chip-input-chip-input-md-typography-font-weight:400;--sd-chip-input-chip-input-md-typography-font-size:14px;--sd-chip-input-chip-input-md-typography-text-decoration:none;--sd-chip-input-chip-input-md-typography-line-height:24px;--sd-chip-input-chip-input-chip-gap:8px;--sd-chip-input-chip-input-border-width:1px;--sd-chip-input-chip-input-border-default:#AAAAAA;--sd-chip-input-chip-input-border-focus:#0075FF;--sd-chip-input-chip-input-border-disabled:#CCCCCC;--sd-chip-input-chip-input-bg-default:#FFFFFF;--sd-chip-input-chip-input-bg-disabled:#E1E1E1;--sd-chip-input-chip-input-text-placeholder:#AAAAAA;--sd-filepicker-filepicker-sm-height:28px;--sd-filepicker-filepicker-sm-padding-x:12px;--sd-filepicker-filepicker-sm-gap:8px;--sd-filepicker-filepicker-sm-radius:4px;--sd-filepicker-filepicker-sm-border-width:1px;--sd-filepicker-filepicker-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-filepicker-filepicker-sm-typography-font-weight:400;--sd-filepicker-filepicker-sm-typography-font-size:12px;--sd-filepicker-filepicker-sm-typography-line-height:20px;--sd-filepicker-filepicker-sm-typography-text-decoration:none;--sd-filepicker-filepicker-sm-icon:16px;--sd-filepicker-filepicker-md-height:36px;--sd-filepicker-filepicker-md-padding-x:16px;--sd-filepicker-filepicker-md-gap:12px;--sd-filepicker-filepicker-md-radius:6px;--sd-filepicker-filepicker-md-border-width:1px;--sd-filepicker-filepicker-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-filepicker-filepicker-md-typography-font-weight:400;--sd-filepicker-filepicker-md-typography-font-size:14px;--sd-filepicker-filepicker-md-typography-text-decoration:none;--sd-filepicker-filepicker-md-typography-line-height:24px;--sd-filepicker-filepicker-md-icon:20px;--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-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:14px;--sd-datepicker-datepicker-md-typography-text-decoration:none;--sd-datepicker-datepicker-md-typography-line-height:24px;--sd-datepicker-datepicker-md-radius: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-disabled:#888888;--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-datepicker-datepicker-calendar-legend-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-legend-typography-font-weight:400;--sd-datepicker-datepicker-calendar-legend-typography-font-size:11px;--sd-datepicker-datepicker-calendar-legend-typography-line-height:18px;--sd-datepicker-datepicker-calendar-legend-typography-text-decoration:none;--sd-datepicker-datepicker-calendar-legend-gap:4px;--sd-datepicker-datepicker-calendar-legend-group-gap:12px;--sd-datepicker-datepicker-calendar-time-bg-default:#F9F9F9;--sd-datepicker-datepicker-calendar-time-bg-selected:#F5FAFF;--sd-datepicker-datepicker-calendar-time-date-label:#222222;--sd-datepicker-datepicker-calendar-time-date-unit:#888888;--sd-datepicker-datepicker-calendar-time-date-gap:6px;--sd-datepicker-datepicker-calendar-time-radius:8px;--sd-datepicker-datepicker-calendar-time-padding-x:16px;--sd-datepicker-datepicker-calendar-time-padding-y:12px;--sd-datepicker-datepicker-calendar-time-gap:12px;--sd-datepicker-datepicker-calendar-time-section-gap:12px;--sd-datepicker-datepicker-calendar-time-unit-gap:2px;--sd-datepicker-datepicker-calendar-time-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-time-typography-font-weight:500;--sd-datepicker-datepicker-calendar-time-typography-font-size:12px;--sd-datepicker-datepicker-calendar-time-typography-text-decoration:none;--sd-datepicker-datepicker-calendar-time-typography-line-height: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-bg-disabled:#F6F6F6;--sd-chip-chip-content-default:#222222;--sd-chip-chip-content-error:#E30000;--sd-chip-chip-content-focus:#222222;--sd-chip-chip-content-disabled:#888888;--sd-chip-chip-border-focus:#E1E1E1;--sd-chip-chip-border-width:1px;--sd-timepicker-timepicker-border-default:#AAAAAA;--sd-timepicker-timepicker-border-focus:#0075FF;--sd-timepicker-timepicker-border-disabled:#CCCCCC;--sd-timepicker-timepicker-border-width:1px;--sd-timepicker-timepicker-bg-default:#FFFFFF;--sd-timepicker-timepicker-bg-disabled:#E1E1E1;--sd-timepicker-timepicker-icon-default:#888888;--sd-timepicker-timepicker-icon-disabled:#BBBBBB;--sd-timepicker-timepicker-text-default:#222222;--sd-timepicker-timepicker-text-disabled:#888888;--sd-timepicker-timepicker-selector-bg:#FFFFFF;--sd-timepicker-timepicker-selector-range-heading-color:#555555;--sd-timepicker-timepicker-selector-range-heading-gap:16px;--sd-timepicker-timepicker-selector-range-padding-x-y:24px;--sd-timepicker-timepicker-selector-range-panel-gap:24px;--sd-timepicker-timepicker-selector-range-section-gap:12px;--sd-timepicker-timepicker-selector-radius:8px;--sd-timepicker-timepicker-selector-section-padding-x:16px;--sd-timepicker-timepicker-selector-section-padding-y:12px;--sd-timepicker-timepicker-selector-time-gap:4px;--sd-timepicker-timepicker-selector-time-column-gap:8px;--sd-timepicker-timepicker-selector-input-width:40px;--sd-timepicker-timepicker-selector-colon-size:16px;--sd-timepicker-timepicker-sm-height:28px;--sd-timepicker-timepicker-sm-padding-x:12px;--sd-timepicker-timepicker-sm-gap:8px;--sd-timepicker-timepicker-sm-icon:16px;--sd-timepicker-timepicker-sm-radius:4px;--sd-timepicker-timepicker-md-height:36px;--sd-timepicker-timepicker-md-padding-x:16px;--sd-timepicker-timepicker-md-gap:12px;--sd-timepicker-timepicker-md-icon:20px;--sd-timepicker-timepicker-md-radius:6px;--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-tag-tag-group-gap:8px;--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-x:20px;--sd-popover-popover-padding-y:16px;--sd-popover-popover-gap:12px;--sd-popover-popover-contents-gap:4px;--sd-popover-popover-arrow-width:16px;--sd-popover-popover-arrow-height:12px;--sd-popover-popover-default-bg:#07284A;--sd-popover-popover-default-title:#FFFFFF;--sd-popover-popover-default-description:#FFFFFF;--sd-popover-popover-default-sub-action:#D8D8D8;--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-title-leading-icon:16px;--sd-popover-popover-title-gap:8px;--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-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-popover-popover-danger-bg:#FCEFEF;--sd-popover-popover-danger-title:#FB4444;--sd-popover-popover-warning-bg:#FEF1EA;--sd-popover-popover-warning-title:#FF6B00;--sd-popover-popover-accent-bg:#E6F1FF;--sd-popover-popover-accent-title:#0075FF;--sd-popover-popover-light-description:#555555;--sd-popover-popover-light-sub-action:#888888;--sd-toast-toast-radius:8px;--sd-toast-toast-padding-x:24px;--sd-toast-toast-padding-y:12px;--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:500;--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-toast-toast-info-bg:#E6F1FF;--sd-toast-toast-info-icon:#0075FF;--sd-toast-toast-info-text:#222222;--sd-toast-toast-info-text-link:#555555;--sd-overlay-overlay-header-bg:#FFFFFF;--sd-overlay-overlay-header-padding-x:24px;--sd-overlay-overlay-header-padding-y:20px;--sd-overlay-overlay-header-gap:12px;--sd-overlay-overlay-header-title-color:#033F59;--sd-overlay-overlay-header-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-overlay-overlay-header-title-typography-font-weight:700;--sd-overlay-overlay-header-title-typography-font-size:16px;--sd-overlay-overlay-header-title-typography-text-decoration:none;--sd-overlay-overlay-header-title-typography-line-height:26px;--sd-overlay-overlay-footer-bg-default:#FFFFFF;--sd-overlay-overlay-footer-bg-neutral:#F6F6F6;--sd-overlay-overlay-footer-padding-x:20px;--sd-overlay-overlay-footer-padding-y:8px;--sd-overlay-overlay-footer-gap:16px;--sd-overlay-overlay-footer-shadow-x:0px;--sd-overlay-overlay-footer-shadow-y:0px;--sd-overlay-overlay-footer-shadow-blur:24px;--sd-overlay-overlay-footer-shadow-spread:0px;--sd-overlay-overlay-footer-shadow-color:rgba(34,34,34,0.2);--sd-overlay-overlay-footer-shadow-type:dropShadow;--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-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-popup-popup-header-bg-default:#07284A;--sd-popup-popup-header-bg-inverse:#FFFFFF;--sd-popup-popup-header-title-default:#FFFFFF;--sd-popup-popup-header-title-inverse:#004290;--sd-popup-popup-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-popup-popup-header-typography-font-weight:700;--sd-popup-popup-header-typography-font-size:18px;--sd-popup-popup-header-typography-line-height:30px;--sd-popup-popup-header-typography-text-decoration:none;--sd-popup-popup-header-padding-x:16px;--sd-popup-popup-header-padding-y:12px;--sd-popup-popup-bg:#EEEEEE;--sd-drawer-drawer-bg:#F6F6F6;--sd-drawer-drawer-body-border:#E1E1E1;--sd-callout-callout-radius:8px;--sd-callout-callout-border-width:1px;--sd-callout-callout-body-gap:2px;--sd-callout-callout-body-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-callout-callout-body-typography-font-size:12px;--sd-callout-callout-body-typography-font-weight:400;--sd-callout-callout-body-typography-line-height:20px;--sd-callout-callout-body-typography-text-decoration:none;--sd-callout-callout-body-padding-x:12px;--sd-callout-callout-body-padding-y:8px;--sd-callout-callout-default-bg:#F9F9F9;--sd-callout-callout-default-border:#E1E1E1;--sd-callout-callout-default-content:#555555;--sd-callout-callout-danger-bg:#FCEFEF;--sd-callout-callout-danger-border:#FFB5B5;--sd-callout-callout-danger-content:#222222;--sd-callout-callout-danger-title-bg:#FB4444;--sd-callout-callout-danger-title-padding-x:24px;--sd-callout-callout-danger-title-gap:2px;--sd-callout-callout-danger-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-callout-callout-danger-title-typography-font-weight:700;--sd-callout-callout-danger-title-typography-font-size:16px;--sd-callout-callout-danger-title-typography-text-decoration:none;--sd-callout-callout-danger-title-typography-line-height:26px;--sd-callout-callout-danger-title-color:#FFFFFF;--sd-callout-callout-danger-title-icon:24px;--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-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-progress-progress-linear-height:20px;--sd-progress-progress-linear-radius:9999px;--sd-progress-progress-linear-gap:12px;--sd-progress-progress-linear-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-progress-progress-linear-typography-font-size:12px;--sd-progress-progress-linear-typography-font-weight:700;--sd-progress-progress-linear-typography-text-decoration:none;--sd-progress-progress-linear-typography-line-height:20px;--sd-progress-progress-circular-size:80px;--sd-progress-progress-circular-gap:8px;--sd-progress-progress-circular-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-progress-progress-circular-typography-font-weight:700;--sd-progress-progress-circular-typography-font-size:16px;--sd-progress-progress-circular-typography-text-decoration:none;--sd-progress-progress-circular-typography-line-height:26px;--sd-progress-progress-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-progress-progress-label-typography-font-size:12px;--sd-progress-progress-label-typography-font-weight:400;--sd-progress-progress-label-typography-line-height:20px;--sd-progress-progress-label-typography-text-decoration:none;--sd-progress-progress-color-track:#EEEEEE;--sd-progress-progress-color-label:#555555;--sd-progress-progress-active-color:#2D8DFF;--sd-progress-progress-success-color:#12B553;--sd-progress-progress-error-color:#FB4444;--sd-progress-progress-bar-text:#FFFFFF;--sd-progress-progress-inverse-color:#FFFFFF;--sd-progress-progress-inverse-opacity:40%;--sd-table-table-header-height:36px;--sd-table-table-header-padding-x:16px;--sd-table-table-header-gap:4px;--sd-table-table-header-bg:#F5FAFF;--sd-table-table-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-table-table-header-typography-font-weight:500;--sd-table-table-header-typography-font-size:12px;--sd-table-table-header-typography-line-height:20px;--sd-table-table-header-typography-text-decoration:none;--sd-table-table-header-resizing-bar-color:#CCCCCC;--sd-table-table-header-resizing-bar-height:16px;--sd-table-table-body-default-height:44px;--sd-table-table-body-default-padding-y:8px;--sd-table-table-body-dense-height:32px;--sd-table-table-body-padding-y-dense:6px;--sd-table-table-body-padding-y-default:8px;--sd-table-table-body-padding-x-default:8px;--sd-table-table-body-padding-x-wide:16px;--sd-table-table-body-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-table-table-body-typography-font-weight:400;--sd-table-table-body-typography-font-size:12px;--sd-table-table-body-typography-line-height:20px;--sd-table-table-body-typography-text-decoration:none;--sd-table-table-border-color:#E1E1E1;--sd-table-table-border-width:1px;--sd-table-table-content-gap:8px;--sd-table-table-bar-section-gap:12px;--sd-table-table-bar-divider-height:20px;--sd-table-table-bar-height:44px;--sd-table-table-bar-count-total:#066D9B;--sd-table-table-bar-count-null:#888888;--sd-table-table-radius:8px;--sd-table-table-key-value-body-padding-y:8px;--sd-table-table-key-value-body-padding-x-default:8px;--sd-table-table-key-value-body-padding-x-wide:16px;--sd-table-table-key-value-height:44px;--sd-table-table-key-value-search-padding-x:32px;--sd-table-table-key-value-search-bg:#F9F9F9;--sd-table-table-separator-color:#EEEEEE;--sd-table-table-separator-width-default:6px;--sd-table-table-separator-width-dense:4px;--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;--sd-pagination-pagination-simple-gap:8px;--sd-stepper-stepper-sm-sequence-size:20px;--sd-stepper-stepper-sm-typography-active-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-stepper-stepper-sm-typography-active-font-weight:700;--sd-stepper-stepper-sm-typography-active-font-size:12px;--sd-stepper-stepper-sm-typography-active-line-height:20px;--sd-stepper-stepper-sm-typography-active-text-decoration:none;--sd-stepper-stepper-sm-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-stepper-stepper-sm-typography-default-font-weight:500;--sd-stepper-stepper-sm-typography-default-font-size:12px;--sd-stepper-stepper-sm-typography-default-line-height:20px;--sd-stepper-stepper-sm-typography-default-text-decoration:none;--sd-stepper-stepper-dash-width:20px;--sd-stepper-stepper-dash-color:#888888;--sd-stepper-stepper-lg-sequence-size:24px;--sd-stepper-stepper-lg-typography-active-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-stepper-stepper-lg-typography-active-font-weight:700;--sd-stepper-stepper-lg-typography-active-font-size:14px;--sd-stepper-stepper-lg-typography-active-line-height:24px;--sd-stepper-stepper-lg-typography-active-text-decoration:none;--sd-stepper-stepper-lg-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-stepper-stepper-lg-typography-default-font-weight:500;--sd-stepper-stepper-lg-typography-default-font-size:14px;--sd-stepper-stepper-lg-typography-default-line-height:24px;--sd-stepper-stepper-lg-typography-default-text-decoration:none;--sd-stepper-stepper-container-gap:12px;--sd-stepper-stepper-item-gap:8px;--sd-stepper-stepper-sequence-radius:9999px;--sd-stepper-stepper-sequence-border-active:#93C4FF;--sd-stepper-stepper-sequence-border-default:#E1E1E1;--sd-stepper-stepper-sequence-border-completed:#CCCCCC;--sd-stepper-stepper-sequence-border-witdh:1px;--sd-stepper-stepper-sequence-icon:12px;--sd-stepper-stepper-sequence-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-stepper-stepper-sequence-typography-font-weight:700;--sd-stepper-stepper-sequence-typography-font-size:12px;--sd-stepper-stepper-sequence-typography-line-height:20px;--sd-stepper-stepper-sequence-typography-text-decoration:none;--sd-stepper-stepper-sequence-bg-active:#D9EAFF;--sd-stepper-stepper-sequence-bg-default:#FFFFFF;--sd-stepper-stepper-sequence-bg-completed:#E1E1E1;--sd-stepper-stepper-sequence-text-active:#0075FF;--sd-stepper-stepper-sequence-text-default:#AAAAAA;--sd-stepper-stepper-text-active:#0075FF;--sd-stepper-stepper-text-default:#888888;--sd-tab-tab-main-lg-height:44px;--sd-tab-tab-main-lg-padding-x:32px;--sd-tab-tab-main-md-height:36px;--sd-tab-tab-main-md-padding-x:24px;--sd-tab-tab-main-gap:8px;--sd-tab-tab-main-container-gap:4px;--sd-tab-tab-main-radius:6px;--sd-tab-tab-main-border-width:1px;--sd-tab-tab-main-selected-bg:#FFFFFF;--sd-tab-tab-main-selected-text:#0075FF;--sd-tab-tab-main-selected-border:#0075FF;--sd-tab-tab-main-selected-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-tab-tab-main-selected-typography-font-weight:700;--sd-tab-tab-main-selected-typography-font-size:12px;--sd-tab-tab-main-selected-typography-line-height:20px;--sd-tab-tab-main-selected-typography-text-decoration:none;--sd-tab-tab-main-default-bg:#F6F6F6;--sd-tab-tab-main-default-text:#888888;--sd-tab-tab-main-default-border:#CCCCCC;--sd-tab-tab-main-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-tab-tab-main-default-typography-font-weight:400;--sd-tab-tab-main-default-typography-font-size:12px;--sd-tab-tab-main-default-typography-line-height:20px;--sd-tab-tab-main-default-typography-text-decoration:none;--sd-tab-tab-sub-selected-text:#0075FF;--sd-tab-tab-sub-selected-line:#0075FF;--sd-tab-tab-sub-selected-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-tab-tab-sub-selected-typography-font-weight:700;--sd-tab-tab-sub-selected-typography-font-size:12px;--sd-tab-tab-sub-selected-typography-line-height:20px;--sd-tab-tab-sub-selected-typography-text-decoration:none;--sd-tab-tab-sub-default-text:#222222;--sd-tab-tab-sub-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-tab-tab-sub-default-typography-font-weight:400;--sd-tab-tab-sub-default-typography-font-size:12px;--sd-tab-tab-sub-default-typography-line-height:20px;--sd-tab-tab-sub-default-typography-text-decoration:none;--sd-tab-tab-sub-border-width:1px;--sd-tab-tab-sub-gap-horizontal:24px;--sd-tab-tab-sub-gap-vertical:16px;--sd-tab-tab-sub-content-gap:4px;--sd-tab-tab-sub-item-height:20px;--sd-gnb-gnb-light-bg:#FFFFFF;--sd-gnb-gnb-light-divider:#E1E1E1;--sd-gnb-gnb-light-item-bg-default:#FFFFFF;--sd-gnb-gnb-light-item-bg-hover:#F6F6F6;--sd-gnb-gnb-light-item-bg-selected:#EFF6FF;--sd-gnb-gnb-light-item-fg-default:#222222;--sd-gnb-gnb-light-item-fg-hover:#222222;--sd-gnb-gnb-light-item-fg-selected:#0075FF;--sd-gnb-gnb-light-item-chevron:#555555;--sd-gnb-gnb-light-top-icon:#888888;--sd-gnb-gnb-light-rail-fg-default:#888888;--sd-gnb-gnb-dark-bg:#001B39;--sd-gnb-gnb-dark-divider:#004177;--sd-gnb-gnb-dark-item-bg-default:#001B39;--sd-gnb-gnb-dark-item-bg-hover:#07284A;--sd-gnb-gnb-dark-item-bg-selected:#002B5E;--sd-gnb-gnb-dark-item-fg-default:#FFFFFF;--sd-gnb-gnb-dark-item-fg-hover:#FFFFFF;--sd-gnb-gnb-dark-item-fg-selected:#93C4FF;--sd-gnb-gnb-dark-item-chevron:#AAAAAA;--sd-gnb-gnb-dark-top-icon:#FFFFFF;--sd-gnb-gnb-dark-rail-fg-default:#AAAAAA;--sd-gnb-gnb-top-height:56px;--sd-gnb-gnb-top-padding-x:16px;--sd-gnb-gnb-top-gap:16px;--sd-gnb-gnb-logo-height:32px;--sd-gnb-gnb-fold-width:48px;--sd-gnb-gnb-body-padding:12px;--sd-gnb-gnb-item-padding-y:6px;--sd-gnb-gnb-item-chevron-size:12px;--sd-gnb-gnb-box-item-padding-right:12px;--sd-gnb-gnb-box-item-gap:8px;--sd-gnb-gnb-box-item-radius:8px;--sd-gnb-gnb-box-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-gnb-gnb-box-item-typography-default-font-weight:500;--sd-gnb-gnb-box-item-typography-default-font-size:14px;--sd-gnb-gnb-box-item-typography-default-line-height:24px;--sd-gnb-gnb-box-item-typography-default-text-decoration:none;--sd-gnb-gnb-box-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-gnb-gnb-box-item-typography-selected-font-weight:700;--sd-gnb-gnb-box-item-typography-selected-font-size:14px;--sd-gnb-gnb-box-item-typography-selected-line-height:24px;--sd-gnb-gnb-box-item-typography-selected-text-decoration:none;--sd-gnb-gnb-box-item-depth1-padding-left:12px;--sd-gnb-gnb-box-item-depth1-icon:20px;--sd-gnb-gnb-box-item-depth2-padding-left:24px;--sd-gnb-gnb-box-item-depth3-padding-left:36px;--sd-gnb-gnb-belt-item-padding-right:20px;--sd-gnb-gnb-belt-item-gap:8px;--sd-gnb-gnb-belt-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-gnb-gnb-belt-item-typography-default-font-weight:500;--sd-gnb-gnb-belt-item-typography-default-font-size:12px;--sd-gnb-gnb-belt-item-typography-default-line-height:20px;--sd-gnb-gnb-belt-item-typography-default-text-decoration:none;--sd-gnb-gnb-belt-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-gnb-gnb-belt-item-typography-selected-font-weight:700;--sd-gnb-gnb-belt-item-typography-selected-font-size:12px;--sd-gnb-gnb-belt-item-typography-selected-line-height:20px;--sd-gnb-gnb-belt-item-typography-selected-text-decoration:none;--sd-gnb-gnb-belt-item-depth1-padding-left:20px;--sd-gnb-gnb-belt-item-depth1-icon:16px;--sd-gnb-gnb-belt-item-depth1-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-gnb-gnb-belt-item-depth1-typography-font-weight:700;--sd-gnb-gnb-belt-item-depth1-typography-font-size:13px;--sd-gnb-gnb-belt-item-depth1-typography-line-height:22px;--sd-gnb-gnb-belt-item-depth1-typography-text-decoration:none;--sd-gnb-gnb-belt-item-depth2-padding-left:32px;--sd-gnb-gnb-belt-item-depth3-padding-left:44px;--sd-gnb-gnb-rail-padding:12px;--sd-gnb-gnb-rail-gap:16px;--sd-gnb-gnb-rail-item-padding-top:4px;--sd-gnb-gnb-rail-item-padding-bottom:2px;--sd-gnb-gnb-rail-item-radius:8px;--sd-gnb-gnb-rail-item-icon:24px;--sd-gnb-gnb-rail-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-gnb-gnb-rail-item-typography-default-font-weight:500;--sd-gnb-gnb-rail-item-typography-default-font-size:11px;--sd-gnb-gnb-rail-item-typography-default-line-height:18px;--sd-gnb-gnb-rail-item-typography-default-text-decoration:none;--sd-gnb-gnb-rail-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-gnb-gnb-rail-item-typography-selected-font-weight:700;--sd-gnb-gnb-rail-item-typography-selected-font-size:11px;--sd-gnb-gnb-rail-item-typography-selected-line-height:18px;--sd-gnb-gnb-rail-item-typography-selected-text-decoration:none;--sd-gnb-gnb-rail-item-width:44px}.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}.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}";
138
138
 
139
139
  /*
140
140
  Stencil Hydrate Platform v4.43.2 | MIT Licensed | https://stenciljs.com
@@ -5346,7 +5346,7 @@ class SdActionModal {
5346
5346
  if (this.height != null && this.height !== '') {
5347
5347
  sizeStyle.height = typeof this.height === 'number' ? `${this.height}px` : this.height;
5348
5348
  }
5349
- return (hAsync("div", { key: '19ea6ad7ef8aeb5fc4a8537e388542c6c2244c71', class: "sd-action-modal", style: { ...cssVars, ...sizeStyle } }, hAsync("header", { key: 'd56e8c35c88b3f4c2f279ee7e8b2f92c9e9760c5', class: "sd-action-modal__header" }, hAsync("h2", { key: '50e3334be477751314febff5b29103cc7600201e', class: "sd-action-modal__title" }, this.modalTitle), hAsync("div", { key: 'bc95f535e273ad97f820d548647601897b6d4253', class: "sd-action-modal__header-sub" }, hAsync("slot", { key: '332a0923092c0ecec193d774f9b77316d41cd97c', name: "header-sub-title" })), hAsync("sd-ghost-button", { key: '56127a67e0130b9639b7b9146604ce09f9d48e16', class: "sd-action-modal__close", icon: "close", ariaLabel: "close", onClick: () => this.close.emit() })), hAsync("div", { key: '22668cbe686a310e829c9d6052cec4b62a7bd194', class: "sd-action-modal__body" }, hAsync("slot", { key: '58621eddef8c7423620a41a3c8c52b128554946e', name: "body" })), (this.buttonProps != null || this.buttonProps != undefined) && (hAsync("footer", { key: '6c5ed286a5cfa39a1a46da606fee61767199344c', class: "sd-action-modal__footer" }, hAsync("div", { key: 'ea0f414e3a1aecd3b150f93d544b801d633793c8', class: "sd-action-modal__footer-sub" }, hAsync("slot", { key: '171f7df6863e49565e9bf0d7193e7c39c05462b5', name: "bottom-sub-content" })), hAsync("sd-button", { key: '919ec31d0ab1c60fb1f186c6c404ba9452ff0dbb', ...DEFAULT_BUTTON_PROPS, ...this.buttonProps, onSdClick: () => this.ok.emit() })))));
5349
+ return (hAsync("div", { key: '0ea43d16b08533b5b9cfbeb6ba841e6deb9a4212', class: "sd-action-modal", style: { ...cssVars, ...sizeStyle } }, hAsync("header", { key: '410e57f4bf29a2f754d86b78292e2281625d7cc7', class: "sd-action-modal__header" }, hAsync("h2", { key: '0d27f2538b7b65d7cb0e708e431ba93bbe874e7f', class: "sd-action-modal__title" }, this.modalTitle), hAsync("div", { key: '9ad61d454f2305165878a8e41c2165590e56b8e2', class: "sd-action-modal__header-sub" }, hAsync("slot", { key: '7a0cdfa33590fbc743e8cace34f2963f1f413516', name: "header-sub-title" })), hAsync("sd-ghost-button", { key: '4a216590c2a4ab28dbaf5cead04c1239c46897a6', class: "sd-action-modal__close", icon: "close", ariaLabel: "close", onClick: () => this.close.emit() })), hAsync("div", { key: 'a127cc066dc02a421b8bf79ac8c4ee9149e14988', class: "sd-action-modal__body" }, hAsync("slot", { key: '0db445593169be7f38bde831d0024edc199720f2', name: "body" })), (this.buttonProps != null || this.buttonProps != undefined) && (hAsync("footer", { key: 'ea4255f7c8d010ba6305a9cec484ea6625eab9ee', class: "sd-action-modal__footer" }, hAsync("div", { key: 'f722674d3f478748b826ee2265412e700bcdacc4', class: "sd-action-modal__footer-sub" }, hAsync("slot", { key: '96c8ab1d079c4824ef661e2fa0565023ac2222f4', name: "bottom-sub-content" })), hAsync("sd-button", { key: '0d63bee0d36c827c49ddf96fe41de67d1dc4524d', ...DEFAULT_BUTTON_PROPS, ...this.buttonProps, onSdClick: () => this.ok.emit() })))));
5350
5350
  }
5351
5351
  static get style() { return sdActionModalCss(); }
5352
5352
  static get cmpMeta() { return {
@@ -5399,7 +5399,7 @@ class SdBadge {
5399
5399
  color = 'blue';
5400
5400
  render() {
5401
5401
  const resolvedColor = BADGE_COLOR_MAP[this.color] ?? BADGE_COLOR_MAP.blue;
5402
- return (hAsync("div", { key: '2531ebcfe66e33f8ac31be0299865ee8aa45ed17', class: "sd-badge", style: { '--sd-badge-color': resolvedColor } }, hAsync("div", { key: 'a8ddd518167b90fedb4d6d26cc28b17082f5fe0b', class: "sd-badge__dot" })));
5402
+ return (hAsync("div", { key: '71aebd3dd22a67eeb04189ff0e7c4379ec5d6802', class: "sd-badge", style: { '--sd-badge-color': resolvedColor } }, hAsync("div", { key: 'd40e81130d58b6a03ffe0461478ee8af50cd7cf6', class: "sd-badge__dot" })));
5403
5403
  }
5404
5404
  static get style() { return sdBadgeCss(); }
5405
5405
  static get cmpMeta() { return {
@@ -5472,26 +5472,26 @@ var inputTokens = {
5472
5472
  textinput: textinput
5473
5473
  };
5474
5474
 
5475
- const sm$5 = inputTokens.textinput.sm;
5476
- const md$5 = inputTokens.textinput.md;
5475
+ const sm$6 = inputTokens.textinput.sm;
5476
+ const md$6 = inputTokens.textinput.md;
5477
5477
  const BARCODE_INPUT_SIZE_MAP = {
5478
5478
  sm: {
5479
- height: sm$5.height,
5480
- paddingX: sm$5.paddingX,
5481
- gap: sm$5.gap,
5482
- radius: sm$5.radius,
5483
- fontSize: sm$5.typography.fontSize,
5484
- lineHeight: sm$5.typography.lineHeight,
5485
- fontWeight: sm$5.typography.fontWeight,
5479
+ height: sm$6.height,
5480
+ paddingX: sm$6.paddingX,
5481
+ gap: sm$6.gap,
5482
+ radius: sm$6.radius,
5483
+ fontSize: sm$6.typography.fontSize,
5484
+ lineHeight: sm$6.typography.lineHeight,
5485
+ fontWeight: sm$6.typography.fontWeight,
5486
5486
  },
5487
5487
  md: {
5488
- height: md$5.height,
5489
- paddingX: md$5.paddingX,
5490
- gap: md$5.gap,
5491
- radius: md$5.radius,
5492
- fontSize: md$5.typography.fontSize,
5493
- lineHeight: md$5.typography.lineHeight,
5494
- fontWeight: md$5.typography.fontWeight,
5488
+ height: md$6.height,
5489
+ paddingX: md$6.paddingX,
5490
+ gap: md$6.gap,
5491
+ radius: md$6.radius,
5492
+ fontSize: md$6.typography.fontSize,
5493
+ lineHeight: md$6.typography.lineHeight,
5494
+ fontWeight: md$6.typography.fontWeight,
5495
5495
  },
5496
5496
  };
5497
5497
  const BARCODE_INPUT_COLORS = {
@@ -5642,7 +5642,7 @@ class SdBarcodeInput {
5642
5642
  '--sd-system-radius-field-sm': `${sizeTokens.radius}px`,
5643
5643
  '--sd-system-color-field-bg-default': BARCODE_INPUT_COLORS.bg.barcode,
5644
5644
  };
5645
- return (hAsync("sd-field", { key: '79dd05ab7f39104c2aa54c44a71cc3fe4cf7870f', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, 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: '5470e7e6ddff60239bf1d42d78843f807a72c07b', class: "sd-barcode-input__content" }, hAsync("slot", { key: 'ab15a2e5a9287f3c124f48f89610ab55c898b76e', name: "prefix" }), hAsync("input", { key: 'e2edbbcfb70ec035e68735c4de7792d6c8ef177f', 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: 'd2065cad4d491747a2a61b60b2bb10a7ef5b18d9', name: "suffix" }), this.clearable && this.internalValue && (hAsync("sd-ghost-button", { key: '2b88fe6fd8c1c013c60b50584721a7c4d4f3bef5', icon: "close", ariaLabel: "clear", size: "xxs", disabled: this.disabled, class: "sd-barcode-input__clear-icon", onClick: async () => {
5645
+ return (hAsync("sd-field", { key: 'a1b0bba7815d907fbe1bd255a852a05c83837c27', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, 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: 'c1f5145823f0a66dd0207b2b634963360d81dfd9', class: "sd-barcode-input__content" }, hAsync("slot", { key: '09d3d9aee00e59c6445c0f6701017dac236de9ac', name: "prefix" }), hAsync("input", { key: 'c626ca1f66c660d340202d47b523e379c20dff0e', 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: 'b0989ed15b141b29472a884302b1f25d8c8616e2', name: "suffix" }), this.clearable && this.internalValue && (hAsync("sd-ghost-button", { key: 'ec07f8233456f8a4e039048ac2958da4ccc0709e', icon: "close", ariaLabel: "clear", size: "xxs", disabled: this.disabled, class: "sd-barcode-input__clear-icon", onClick: async () => {
5646
5646
  if (this.disabled)
5647
5647
  return;
5648
5648
  this.internalValue = '';
@@ -6587,14 +6587,14 @@ class SdButton {
6587
6587
  const validRightIcon = isValidIcon(this.rightIcon) ? this.rightIcon : undefined;
6588
6588
  const iconOnly = !hasLabel && Boolean(validIcon) !== Boolean(validRightIcon);
6589
6589
  const accessibleName = iconOnly && this.ariaLabel.trim() !== '' ? this.ariaLabel : undefined;
6590
- return (hAsync("button", { key: 'ea6482b86f91b26cd20ab635c357b655e92c2ec1', class: this.getButtonClasses(preset, config.size, hasLabel, iconOnly), type: this.type ?? 'button', disabled: this.disabled, "aria-label": accessibleName, style: {
6590
+ return (hAsync("button", { key: '2a57abd6819306be62a379861e15cfa06c626e63', class: this.getButtonClasses(preset, config.size, hasLabel, iconOnly), type: this.type ?? 'button', disabled: this.disabled, "aria-label": accessibleName, style: {
6591
6591
  '--sd-button-bg': config.color,
6592
6592
  '--sd-button-bg-hover': PRESET_HOVER_BACKGROUNDS$1[preset],
6593
6593
  '--sd-button-border': PRESET_BORDER_COLORS$1[preset],
6594
6594
  '--sd-button-text': PRESET_TEXT_COLORS$1[preset],
6595
6595
  '--sd-button-icon': PRESET_ICON_COLORS$1[preset],
6596
6596
  '--sd-button-accent': BUTTON_FOCUS_RING_COLOR,
6597
- }, onClick: this.handleClick }, hAsync("span", { key: 'fd0cbd15e1edf4dc599e7eb3df3dcb1ddbd4732e', class: "sd-button__content" }, validIcon && (hAsync("sd-icon", { key: '5ace6d85974e1c2ecb0fcf55b0330801f78f094f', class: "sd-button__icon", name: validIcon, size: BUTTON_ICON_SIZES[config.size], color: "var(--sd-button-current-icon)" })), this.label && hAsync("span", { key: 'ef1240a6acee55def8244149b0af4e0252be558c', class: "sd-button__label" }, this.label), validRightIcon && (hAsync("sd-icon", { key: '127de568676734d75dd801b9ea46aa35e09b558c', class: "sd-button__icon sd-button__icon--right", name: validRightIcon, size: BUTTON_ICON_SIZES[config.size], color: "var(--sd-button-current-icon)" })))));
6597
+ }, onClick: this.handleClick }, hAsync("span", { key: 'af0bcef670ee1d3963f9e2f19fbba369bb8fa341', class: "sd-button__content" }, validIcon && (hAsync("sd-icon", { key: 'f2a104e410d76363981acd565ffe76132d69a420', class: "sd-button__icon", name: validIcon, size: BUTTON_ICON_SIZES[config.size], color: "var(--sd-button-current-icon)" })), this.label && hAsync("span", { key: '0e19594ad6525841f7567aced516aa82321c83a2', class: "sd-button__label" }, this.label), validRightIcon && (hAsync("sd-icon", { key: '01cb1bba8a4a1450c0a2cc30abfb4608190788d5', class: "sd-button__icon sd-button__icon--right", name: validRightIcon, size: BUTTON_ICON_SIZES[config.size], color: "var(--sd-button-current-icon)" })))));
6598
6598
  }
6599
6599
  static get style() { return sdButtonCss(); }
6600
6600
  static get cmpMeta() { return {
@@ -6781,7 +6781,34 @@ const datepicker = {
6781
6781
  group: {
6782
6782
  gap: "12"
6783
6783
  }
6784
- }}
6784
+ },
6785
+ time: {
6786
+ bg: {
6787
+ "default": "#F9F9F9",
6788
+ selected: "#F5FAFF"
6789
+ },
6790
+ date: {
6791
+ label: "#222222",
6792
+ unit: "#888888",
6793
+ gap: "6"
6794
+ },
6795
+ radius: "8",
6796
+ paddingX: "16",
6797
+ paddingY: "12",
6798
+ gap: "12",
6799
+ section: {
6800
+ gap: "12"
6801
+ },
6802
+ unit: {
6803
+ gap: "2"
6804
+ },
6805
+ typography: {
6806
+ fontWeight: "500",
6807
+ fontSize: "12",
6808
+ lineHeight: "20"
6809
+ }
6810
+ }
6811
+ }
6785
6812
  };
6786
6813
  var datepickerTokens = {
6787
6814
  datepicker: datepicker
@@ -7022,7 +7049,7 @@ class SdCalendar {
7022
7049
  const eventMap = this.eventMap;
7023
7050
  const legend = this.legendItems;
7024
7051
  const hasEvents = (this.events?.length ?? 0) > 0;
7025
- return (hAsync("div", { key: '317beb7cdffbba8982306539441fec46e6330d82', class: { 'sd-calendar': true, 'sd-calendar--elevated': this.elevated }, style: cssVars }, hAsync("div", { key: '0d9e1084ee0bff994b4a00b7f2d490c0e101aa16', class: "sd-calendar__header" }, hAsync("div", { key: '8d82438f1820721fcbcd14cf42c1ae00b3a517d9', class: "sd-calendar__nav-group" }, hAsync("sd-ghost-button", { key: '4e3391c57c0fdf3ad95b82d82c7a130c3202229d', ariaLabel: "prevYear", size: "xxs", icon: "chevronLeft", onClick: this.goPrevYear }), hAsync("span", { key: '6a7cbfb0069dd1d29e195cc09a9c55a8ae52aa40', class: "sd-calendar__label" }, this.currentYear), hAsync("sd-ghost-button", { key: '239d5e623f830e8ceeb069e78126175772af48de', ariaLabel: "nextYear", size: "xxs", icon: "chevronRight", onClick: this.goNextYear })), hAsync("span", { key: '24362199d36afc204eebe5c5f14a41705f6782d9', class: "sd-calendar__divider", "aria-hidden": "true" }), hAsync("div", { key: '7aa04fa1fbb355d8b3fae4cca011999b4f7f5850', class: "sd-calendar__nav-group sd-calendar__nav-group-month" }, hAsync("sd-ghost-button", { key: 'ea5d0129d4f7eecaeff5793460363e2f15c238b8', ariaLabel: "prevMonth", size: "xxs", icon: "chevronLeft", onClick: this.goPrevMonth }), hAsync("span", { key: '7a3879edb74cb71c46fc500d7c230c21e19042c4', class: "sd-calendar__label sd-calendar__label-month" }, this.currentMonth, "\uC6D4"), hAsync("sd-ghost-button", { key: '7532053f6607d9e4940403f22fd32994128fc457', ariaLabel: "nextMonth", size: "xxs", icon: "chevronRight", onClick: this.goNextMonth }))), hAsync("div", { key: 'ef59638defed69c325e49fc71ca0cc73a7d778bf', class: "sd-calendar__week" }, WEEK_LABELS.map(label => (hAsync("span", { key: label, class: "sd-calendar__week-cell" }, label)))), hAsync("div", { key: '0205b10254c75567336bc7e4ed8a26d2227ecb33', class: "sd-calendar__grid" }, this.cells.map(cell => {
7052
+ return (hAsync("div", { key: 'e1e0c276ef6642e811b796d6840ea2ed8860e5ef', class: { 'sd-calendar': true, 'sd-calendar--elevated': this.elevated }, style: cssVars }, hAsync("div", { key: 'ed4cb4166fe14237a0291986caae6641f7075be7', class: "sd-calendar__header" }, hAsync("div", { key: '83fb71b32ca4adaf6e42eee2a069d64ed67e08a2', class: "sd-calendar__nav-group" }, hAsync("sd-ghost-button", { key: '35610f7ad609f1f694929355ab6aa363609d035f', ariaLabel: "prevYear", size: "xxs", icon: "chevronLeft", onClick: this.goPrevYear }), hAsync("span", { key: '413232de704c401ff38a02e9d5d05788e53d650e', class: "sd-calendar__label" }, this.currentYear), hAsync("sd-ghost-button", { key: '5d60b66064809edaf3505659cca23e70c0702f97', ariaLabel: "nextYear", size: "xxs", icon: "chevronRight", onClick: this.goNextYear })), hAsync("span", { key: '0d137eea005ac4ee7dd21075f3954b1259a43de1', class: "sd-calendar__divider", "aria-hidden": "true" }), hAsync("div", { key: 'b66dc00192dfd111b3afe98d7ad0ebb775de264d', class: "sd-calendar__nav-group sd-calendar__nav-group-month" }, hAsync("sd-ghost-button", { key: '9e0087e68fe1ec2ac7d36454e135f0cd5dac71ce', ariaLabel: "prevMonth", size: "xxs", icon: "chevronLeft", onClick: this.goPrevMonth }), hAsync("span", { key: '83ff452dd50105c7515143a6fae5b33da204a945', class: "sd-calendar__label sd-calendar__label-month" }, this.currentMonth, "\uC6D4"), hAsync("sd-ghost-button", { key: 'abc04cedfd725eb5b87ab49d451e55ab727d8fad', ariaLabel: "nextMonth", size: "xxs", icon: "chevronRight", onClick: this.goNextMonth }))), hAsync("div", { key: 'e06706abdd90a500067b211dea6141a99c736be9', class: "sd-calendar__week" }, WEEK_LABELS.map(label => (hAsync("span", { key: label, class: "sd-calendar__week-cell" }, label)))), hAsync("div", { key: '11a86af0b5b297ad3cfe66e207f2e7a12e9bf869', class: "sd-calendar__grid" }, this.cells.map(cell => {
7026
7053
  const isSelected = cell.inCurrentMonth && this.value !== '' && this.value === cell.date;
7027
7054
  const isToday = cell.inCurrentMonth && today === cell.date;
7028
7055
  const isDisabled = cell.inCurrentMonth && this.isDisabled(cell.date);
@@ -7035,8 +7062,8 @@ class SdCalendar {
7035
7062
  'sd-calendar__day--disabled': isDisabled,
7036
7063
  }, disabled: !cell.inCurrentMonth || isDisabled, tabindex: !cell.inCurrentMonth ? -1 : undefined, "aria-hidden": !cell.inCurrentMonth ? 'true' : undefined, onClick: () => cell.inCurrentMonth && this.handleDayClick(cell) }, hAsync("span", { class: "sd-calendar__day-circle" }, cell.inCurrentMonth ? cell.day : ''), hasEvents && (hAsync("span", { class: "sd-calendar__dot-row", "aria-hidden": "true" }, dayEvents?.map((ev, i) => (hAsync("span", { key: `${ev.color}|${ev.label}|${i}`, class: "sd-calendar__dot", style: { backgroundColor: ev.color } })))))));
7037
7064
  })), legend.length > 0 && [
7038
- hAsync("span", { key: 'a06b1cd9ec93891e3762f6334949cd23b643290f', class: "sd-calendar__divider-bottom", "aria-hidden": "true" }),
7039
- hAsync("div", { key: '8dc6bd2495ab471b56ed6fa252c9e0ad5ebe8341', class: "sd-calendar__legend" }, legend.map(item => (hAsync("span", { key: `${item.color}|${item.label}`, class: "sd-calendar__legend-item" }, hAsync("span", { class: "sd-calendar__legend-dot", style: { backgroundColor: item.color }, "aria-hidden": "true" }), hAsync("span", { class: "sd-calendar__legend-label" }, item.label))))),
7065
+ hAsync("span", { key: 'd924bb7ce8ceb077cad4d35face238cbb6e39802', class: "sd-calendar__divider-bottom", "aria-hidden": "true" }),
7066
+ hAsync("div", { key: '2738f49b64e7a45aee0f11eac96c98b811312ad6', class: "sd-calendar__legend" }, legend.map(item => (hAsync("span", { key: `${item.color}|${item.label}`, class: "sd-calendar__legend-item" }, hAsync("span", { class: "sd-calendar__legend-dot", style: { backgroundColor: item.color }, "aria-hidden": "true" }), hAsync("span", { class: "sd-calendar__legend-label" }, item.label))))),
7040
7067
  ]));
7041
7068
  }
7042
7069
  static get watchers() { return {
@@ -7293,7 +7320,7 @@ class SdCallout {
7293
7320
  }
7294
7321
  render() {
7295
7322
  const showTitle = this.type === 'danger';
7296
- return (hAsync("div", { key: '6f1f3f4b05febbac7fcfe163d641beca60a67ddb', class: "sd-callout", style: this.calloutStyle, role: "note" }, showTitle && this.renderTitle(), hAsync("div", { key: '2e0c4050c4ed2d353cd270420abfbd6aac014015', class: "sd-callout__body" }, this.renderBody())));
7323
+ return (hAsync("div", { key: 'dc97a963717ac7f0eb3c18e7f56e46278775ce6b', class: "sd-callout", style: this.calloutStyle, role: "note" }, showTitle && this.renderTitle(), hAsync("div", { key: '6f03a18f95672b95c3e24b3d113b281d40d97f35', class: "sd-callout__body" }, this.renderBody())));
7297
7324
  }
7298
7325
  static get style() { return sdCalloutCss(); }
7299
7326
  static get cmpMeta() { return {
@@ -7320,7 +7347,7 @@ class SdCard {
7320
7347
  /** 카드 루트 엘리먼트에 추가할 클래스 */
7321
7348
  sdClass = '';
7322
7349
  render() {
7323
- return (hAsync(Fragment, { key: 'c8835377275c2bed1a193eaf0a1db0c1c6fde960' }, hAsync("div", { key: '37cec8daa273881a40258f632109d9490e5c6978', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.sdClass}` }, hAsync("slot", { key: 'b1b485f3cfe056db25c79bbe15420484e61e5d1a' }))));
7350
+ return (hAsync(Fragment, { key: '517d48bc3444e448241974b93e31f0079d1f3ef6' }, hAsync("div", { key: '3917d6ba9fc5e20a4f45d8c798f9b29eb6a239de', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.sdClass}` }, hAsync("slot", { key: '430091d73c9419fdf8496f17fa1f52b5906fa1a4' }))));
7324
7351
  }
7325
7352
  static get style() { return sdCardCss(); }
7326
7353
  static get cmpMeta() { return {
@@ -7432,7 +7459,7 @@ class SdCheckbox {
7432
7459
  this.update = createEvent(this, "sdUpdate", 7);
7433
7460
  }
7434
7461
  get el() { return getElement(this); }
7435
- /** 현재 선택 상태 또는 배열 형태의 값 */
7462
+ /** 현재 선택 상태 또는 배열 형태의 값 (미지정 시 미선택 상태) */
7436
7463
  value;
7437
7464
  /** 배열 모드에서의 개별 값 */
7438
7465
  val;
@@ -7537,13 +7564,13 @@ class SdCheckbox {
7537
7564
  '--sd-checkbox-inverse-icon': CHECKBOX_COLORS.checked.iconInverse,
7538
7565
  '--sd-checkbox-inverse-label': CHECKBOX_COLORS.labelInverse,
7539
7566
  };
7540
- return (hAsync("label", { key: '3fa9a68790e4a777904d1c8ec1fc18b646a2e41b', class: this.checkboxClasses, style: cssVars }, hAsync("input", { key: 'ecbabd8967c8c73e0b9216157d96b5d5f07777bd', type: "checkbox", ref: el => {
7567
+ return (hAsync("label", { key: 'e8c51cf3c43e401dc7d5a625a424dc59203a18db', class: this.checkboxClasses, style: cssVars }, hAsync("input", { key: '46d20e76a9c5b7a8a44bf13c7f75970dc5c05bad', type: "checkbox", ref: el => {
7541
7568
  this.inputEl = el;
7542
- }, value: this.val, checked: !!this.isChecked, disabled: this.disabled, onChange: this.handleChange, name: this.val?.toString() || 'checkbox', "aria-label": this.label || 'checkbox', "aria-checked": this.isChecked === null ? 'mixed' : this.isChecked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false' }), hAsync("div", { key: '633c38ae79790aa5745240f68253613705f804cf', class: "sd-checkbox__bg" }, this.isChecked !== false ? (hAsync("sd-icon", { name: this.isChecked === true ? 'checkboxCheck' : 'checkboxIndeterminate', size: Number(CHECKBOX_LAYOUT.iconSize), color: this.disabled
7569
+ }, value: this.val, checked: !!this.isChecked, disabled: this.disabled, onChange: this.handleChange, name: this.val?.toString() || 'checkbox', "aria-label": this.label || 'checkbox', "aria-checked": this.isChecked === null ? 'mixed' : this.isChecked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false' }), hAsync("div", { key: '86a6a05ee77c940ae0eb54c0839eda9c0afb988e', class: "sd-checkbox__bg" }, this.isChecked !== false ? (hAsync("sd-icon", { name: this.isChecked === true ? 'checkboxCheck' : 'checkboxIndeterminate', size: Number(CHECKBOX_LAYOUT.iconSize), color: this.disabled
7543
7570
  ? CHECKBOX_COLORS.checked.iconDisabled
7544
7571
  : this.inverse
7545
7572
  ? CHECKBOX_COLORS.checked.iconInverse
7546
- : CHECKBOX_COLORS.checked.icon })) : null), this.label && (hAsync("span", { key: '6e46c09aa41d4d1b0dbad75b825513d6e4e08f11', class: "sd-checkbox__label", "data-text": this.label }, this.label))));
7573
+ : CHECKBOX_COLORS.checked.icon })) : null), this.label && (hAsync("span", { key: '2ef1708c384c6668f256b8a75d2c7821f06ec10f', class: "sd-checkbox__label", "data-text": this.label }, this.label))));
7547
7574
  }
7548
7575
  static get watchers() { return {
7549
7576
  "value": [{
@@ -7653,8 +7680,8 @@ class SdChip {
7653
7680
  error = false;
7654
7681
  /** 비활성 상태 여부 */
7655
7682
  disabled = false;
7656
- /** 인라인 편집 가능 여부 */
7657
- editable = true;
7683
+ /** 인라인 편집 가능 여부 (기본값 false) */
7684
+ editable = false;
7658
7685
  /** 닫기 버튼 표시 여부 */
7659
7686
  showRemove = true;
7660
7687
  /** 편집 중 표시할 placeholder */
@@ -7739,11 +7766,11 @@ class SdChip {
7739
7766
  return this.inputEl ?? null;
7740
7767
  }
7741
7768
  /**
7742
- * SSR 환경에서 editable prop이 전달되지 않으면 undefined로 들어올 수 있으므로,
7743
- * false로 명시된 경우에만 편집 불가로 처리한다 (기본값 true).
7769
+ * editable이 명시적으로 true일 때만 편집 가능으로 처리한다 (기본값 false — RN SChip과 일치).
7770
+ * SSR 등에서 editable이 undefined로 들어와도 편집 불가로 안전하게 처리된다.
7744
7771
  */
7745
7772
  get isEditable() {
7746
- return this.editable !== false;
7773
+ return this.editable === true;
7747
7774
  }
7748
7775
  enterEditMode = () => {
7749
7776
  if (this.disabled || this.isEditing || !this.isEditable)
@@ -7877,7 +7904,7 @@ class SdChip {
7877
7904
  '--sd-chip-font-weight': typography.fontWeight,
7878
7905
  '--sd-chip-line-height': typography.lineHeight,
7879
7906
  };
7880
- return (hAsync("span", { key: '2cd717bc842330a28bbc89a662deda16f59106ee', class: {
7907
+ return (hAsync("span", { key: '1dbe21611f38fdcd5670bddf6da42ae4581253e8', class: {
7881
7908
  'sd-chip': true,
7882
7909
  [`sd-chip--${state}`]: true,
7883
7910
  'sd-chip--disabled': this.disabled,
@@ -8047,28 +8074,28 @@ var listItemTokens = {
8047
8074
  listItem: listItem$1
8048
8075
  };
8049
8076
 
8050
- const sm$4 = chipInputTokens.chipInput.sm;
8051
- const md$4 = chipInputTokens.chipInput.md;
8077
+ const sm$5 = chipInputTokens.chipInput.sm;
8078
+ const md$5 = chipInputTokens.chipInput.md;
8052
8079
  const CHIP_INPUT_SIZE_MAP = {
8053
8080
  sm: {
8054
- minHeight: sm$4.minHeight,
8055
- paddingX: sm$4.paddingX,
8056
- paddingY: sm$4.paddingY,
8057
- radius: sm$4.radius,
8058
- fontSize: sm$4.typography.fontSize,
8059
- lineHeight: sm$4.typography.lineHeight,
8060
- fontWeight: sm$4.typography.fontWeight,
8061
- fontFamily: sm$4.typography.fontFamily,
8081
+ minHeight: sm$5.minHeight,
8082
+ paddingX: sm$5.paddingX,
8083
+ paddingY: sm$5.paddingY,
8084
+ radius: sm$5.radius,
8085
+ fontSize: sm$5.typography.fontSize,
8086
+ lineHeight: sm$5.typography.lineHeight,
8087
+ fontWeight: sm$5.typography.fontWeight,
8088
+ fontFamily: sm$5.typography.fontFamily,
8062
8089
  },
8063
8090
  md: {
8064
- minHeight: md$4.minHeight,
8065
- paddingX: md$4.paddingX,
8066
- paddingY: md$4.paddingY,
8067
- radius: md$4.radius,
8068
- fontSize: md$4.typography.fontSize,
8069
- lineHeight: md$4.typography.lineHeight,
8070
- fontWeight: md$4.typography.fontWeight,
8071
- fontFamily: md$4.typography.fontFamily,
8091
+ minHeight: md$5.minHeight,
8092
+ paddingX: md$5.paddingX,
8093
+ paddingY: md$5.paddingY,
8094
+ radius: md$5.radius,
8095
+ fontSize: md$5.typography.fontSize,
8096
+ lineHeight: md$5.typography.lineHeight,
8097
+ fontWeight: md$5.typography.fontWeight,
8098
+ fontFamily: md$5.typography.fontFamily,
8072
8099
  },
8073
8100
  };
8074
8101
  const CHIP_INPUT_COLORS = {
@@ -8111,7 +8138,7 @@ const CHIP_INPUT_SUGGESTIONS = {
8111
8138
  emptyLineHeight: '20px',
8112
8139
  };
8113
8140
 
8114
- const sdChipInputCss = () => `sd-chip-input{display:inline-flex}sd-chip-input sd-portal{display:none}sd-chip-input .sd-chip-input{position:relative;width:100%;isolation:isolate;min-height:var(--sd-chip-input-min-height);display:flex;flex-flow:row wrap;align-items:center;gap:var(--sd-chip-input-chip-gap);padding:var(--sd-chip-input-padding-y) var(--sd-chip-input-padding-x);cursor:text}sd-chip-input .sd-chip-input__reset{display:inline-flex;align-items:center;gap:var(--sd-chip-input-reset-gap);flex-shrink:0}sd-chip-input .sd-chip-input__divider{display:inline-block;width:1px;height:12px;background-color:var(--sd-chip-input-divider-color);flex-shrink:0}sd-chip-input .sd-chip-input__max-count{font-size:var(--sd-chip-input-max-count-font-size);font-weight:var(--sd-chip-input-max-count-font-weight);color:var(--sd-chip-input-max-count-color);white-space:nowrap;flex-shrink:0}sd-chip-input .sd-chip-input__field{flex:0 0 auto;display:inline-grid;grid-template-columns:minmax(0, max-content);align-items:center;min-width:1ch;max-width:100%;height:var(--sd-chip-input-field-height);box-sizing:border-box;padding:0;border:none;border-radius:0;background:transparent;overflow:hidden}sd-chip-input .sd-chip-input__field::after{content:attr(data-value);grid-area:1/1;visibility:hidden;white-space:pre;font-size:var(--sd-chip-input-field-font-size);line-height:var(--sd-chip-input-field-line-height);font-weight:var(--sd-chip-input-field-font-weight);font-family:var(--sd-chip-input-field-font-family)}sd-chip-input .sd-chip-input__field--filled{padding:0 var(--sd-chip-input-field-padding-x);border:var(--sd-chip-input-field-border-width) solid var(--sd-chip-input-field-border-color);border-radius:var(--sd-chip-input-field-radius);background:var(--sd-chip-input-field-bg)}sd-chip-input .sd-chip-input__field--empty{position:absolute;top:0;left:0;width:0;height:0;min-width:0;overflow:hidden}sd-chip-input .sd-chip-input__input{grid-area:1/1;width:100%;min-width:1ch;height:var(--sd-chip-input-field-height);margin:0;padding:0;border:none;outline:none;overflow:hidden;text-overflow:ellipsis;background:transparent;font-size:var(--sd-chip-input-field-font-size);line-height:var(--sd-chip-input-field-line-height);font-weight:var(--sd-chip-input-field-font-weight);font-family:var(--sd-chip-input-field-font-family);color:var(--sd-chip-input-field-content)}sd-chip-input .sd-chip-input__input[disabled]{cursor:not-allowed;pointer-events:none}sd-chip-input .sd-chip-input__input::placeholder{color:var(--sd-chip-input-placeholder-color)}sd-chip-input .sd-chip-input__suggestions{display:flex;flex-direction:column;box-sizing:border-box;background:white;border-radius:var(--sd-chip-input-suggestions-radius);box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);max-height:var(--sd-chip-input-suggestions-max-height);min-height:0;overflow-y:auto;overflow-x:hidden;outline:none}sd-chip-input .sd-chip-input__suggestions--autocomplete{width:max-content}sd-chip-input .sd-chip-input__suggestion-item{display:flex;flex-shrink:0;align-items:center;gap:var(--sd-chip-input-suggestion-gap);padding:var(--sd-chip-input-suggestion-padding-y) var(--sd-chip-input-suggestion-padding-right) var(--sd-chip-input-suggestion-padding-y) var(--sd-chip-input-suggestion-padding-x);font-size:var(--sd-chip-input-suggestion-font-size);line-height:var(--sd-chip-input-suggestion-line-height);font-weight:var(--sd-chip-input-suggestion-font-weight);font-family:var(--sd-chip-input-suggestion-font-family);color:var(--sd-chip-input-suggestion-color);cursor:pointer;user-select:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}sd-chip-input .sd-chip-input__suggestion-item--active{background:var(--sd-chip-input-suggestion-bg-hover);color:var(--sd-chip-input-suggestion-color-hover);font-weight:var(--sd-chip-input-suggestion-font-weight-selected)}sd-chip-input .sd-chip-input__suggestion-item--selected{cursor:default;overflow:visible;text-overflow:unset}sd-chip-input .sd-chip-input__suggestions-empty{padding:12px;text-align:center;font-size:var(--sd-chip-input-suggestions-empty-font-size);line-height:var(--sd-chip-input-suggestions-empty-line-height);font-family:var(--sd-chip-input-suggestion-font-family);color:var(--sd-chip-input-suggestions-empty-color)}`;
8141
+ const sdChipInputCss = () => `sd-chip-input{display:inline-flex}sd-chip-input sd-portal{display:none}sd-chip-input .sd-chip-input{position:relative;width:100%;isolation:isolate;min-height:var(--sd-chip-input-min-height);display:flex;flex-flow:row wrap;align-items:center;gap:var(--sd-chip-input-chip-gap);padding:var(--sd-chip-input-padding-y) var(--sd-chip-input-padding-x);cursor:text}sd-chip-input .sd-chip-input__reset{display:inline-flex;align-items:center;gap:var(--sd-chip-input-reset-gap);flex-shrink:0}sd-chip-input .sd-chip-input__reset--end{margin-left:auto}sd-chip-input .sd-chip-input__divider{display:inline-block;width:1px;height:12px;background-color:var(--sd-chip-input-divider-color);flex-shrink:0}sd-chip-input .sd-chip-input__max-count{font-size:var(--sd-chip-input-max-count-font-size);font-weight:var(--sd-chip-input-max-count-font-weight);color:var(--sd-chip-input-max-count-color);white-space:nowrap;flex-shrink:0}sd-chip-input .sd-chip-input__field{flex:0 0 auto;display:inline-grid;grid-template-columns:minmax(0, max-content);align-items:center;min-width:1ch;max-width:100%;height:var(--sd-chip-input-field-height);box-sizing:border-box;padding:0;border:none;border-radius:0;background:transparent;overflow:hidden}sd-chip-input .sd-chip-input__field::after{content:attr(data-value);grid-area:1/1;visibility:hidden;white-space:pre;font-size:var(--sd-chip-input-field-font-size);line-height:var(--sd-chip-input-field-line-height);font-weight:var(--sd-chip-input-field-font-weight);font-family:var(--sd-chip-input-field-font-family)}sd-chip-input .sd-chip-input__field--filled{padding:0 var(--sd-chip-input-field-padding-x);border:var(--sd-chip-input-field-border-width) solid var(--sd-chip-input-field-border-color);border-radius:var(--sd-chip-input-field-radius);background:var(--sd-chip-input-field-bg)}sd-chip-input .sd-chip-input__field--empty{position:absolute;top:0;left:0;width:0;height:0;min-width:0;overflow:hidden}sd-chip-input .sd-chip-input__input{grid-area:1/1;width:100%;min-width:1ch;height:var(--sd-chip-input-field-height);margin:0;padding:0;border:none;outline:none;overflow:hidden;text-overflow:ellipsis;background:transparent;font-size:var(--sd-chip-input-field-font-size);line-height:var(--sd-chip-input-field-line-height);font-weight:var(--sd-chip-input-field-font-weight);font-family:var(--sd-chip-input-field-font-family);color:var(--sd-chip-input-field-content)}sd-chip-input .sd-chip-input__input[disabled]{cursor:not-allowed;pointer-events:none}sd-chip-input .sd-chip-input__input::placeholder{color:var(--sd-chip-input-placeholder-color)}sd-chip-input .sd-chip-input__suggestions{display:flex;flex-direction:column;box-sizing:border-box;background:white;border-radius:var(--sd-chip-input-suggestions-radius);box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);max-height:var(--sd-chip-input-suggestions-max-height);min-height:0;overflow-y:auto;overflow-x:hidden;outline:none}sd-chip-input .sd-chip-input__suggestions--autocomplete{width:max-content}sd-chip-input .sd-chip-input__suggestion-item{display:flex;flex-shrink:0;align-items:center;gap:var(--sd-chip-input-suggestion-gap);padding:var(--sd-chip-input-suggestion-padding-y) var(--sd-chip-input-suggestion-padding-right) var(--sd-chip-input-suggestion-padding-y) var(--sd-chip-input-suggestion-padding-x);font-size:var(--sd-chip-input-suggestion-font-size);line-height:var(--sd-chip-input-suggestion-line-height);font-weight:var(--sd-chip-input-suggestion-font-weight);font-family:var(--sd-chip-input-suggestion-font-family);color:var(--sd-chip-input-suggestion-color);cursor:pointer;user-select:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}sd-chip-input .sd-chip-input__suggestion-item--active{background:var(--sd-chip-input-suggestion-bg-hover);color:var(--sd-chip-input-suggestion-color-hover);font-weight:var(--sd-chip-input-suggestion-font-weight-selected)}sd-chip-input .sd-chip-input__suggestion-item--selected{cursor:default;overflow:visible;text-overflow:unset}sd-chip-input .sd-chip-input__suggestions-empty{padding:12px;text-align:center;font-size:var(--sd-chip-input-suggestions-empty-font-size);line-height:var(--sd-chip-input-suggestions-empty-line-height);font-family:var(--sd-chip-input-suggestion-font-family);color:var(--sd-chip-input-suggestions-empty-color)}`;
8115
8142
 
8116
8143
  class SdChipInput {
8117
8144
  constructor(hostRef) {
@@ -8145,6 +8172,8 @@ class SdChipInput {
8145
8172
  useReset = false;
8146
8173
  /** 최대 입력 가능한 칩 개수 (없으면 제한 없음) */
8147
8174
  maxCount;
8175
+ /** 최대 개수·초기화 meta 위치 (end=우측 끝으로 정렬 / inline=콘텐츠에 이어서 배치) */
8176
+ metaPlacement = 'end';
8148
8177
  /** 중복 에러 메시지에 표시할 항목 이름 (없으면 기본 메시지 사용) */
8149
8178
  duplicateLabel;
8150
8179
  /** 자동완성 후보 목록 */
@@ -8155,8 +8184,8 @@ class SdChipInput {
8155
8184
  recommendedItems = [];
8156
8185
  /** 추천 항목 로딩 중 여부 */
8157
8186
  loadingRecommendedItems = false;
8158
- /** 자동완성 드롭다운 최소 너비 (숫자면 px, 문자열이면 그대로 적용. 없으면 입력 필드 너비를 사용) */
8159
- autocompleteMinWidth;
8187
+ /** 드롭다운(자동완성) 최소 너비 (숫자면 px, 문자열이면 그대로 적용. 기본값 200) */
8188
+ dropdownMinWidth = 200;
8160
8189
  // sd-field props
8161
8190
  /** 레이블 텍스트 */
8162
8191
  label = '';
@@ -8529,16 +8558,16 @@ class SdChipInput {
8529
8558
  ...suggestionBoxBaseStyle,
8530
8559
  width: `${this.chipInputRef?.offsetWidth ?? 0}px`,
8531
8560
  };
8532
- // 자동완성은 입력 중인 칩(필드) 기준으로 노출되며, 최소 너비를 유지한 채 텍스트 길이에 따라 늘어난다.
8533
- const autocompleteMinWidth = this.autocompleteMinWidth != null
8534
- ? typeof this.autocompleteMinWidth === 'number'
8535
- ? `${this.autocompleteMinWidth}px`
8536
- : this.autocompleteMinWidth
8537
- : `${this.fieldRef?.offsetWidth ?? 0}px`;
8561
+ // 자동완성은 입력 중인 칩(필드) 기준으로 노출되며, 최소 너비(기본 200px)를 유지한 채 텍스트 길이에 따라 늘어난다.
8562
+ const resolvedDropdownMinWidth = this.dropdownMinWidth == null
8563
+ ? `${this.fieldRef?.offsetWidth ?? 0}px`
8564
+ : typeof this.dropdownMinWidth === 'number'
8565
+ ? `${this.dropdownMinWidth}px`
8566
+ : this.dropdownMinWidth;
8538
8567
  const autocompleteBoxStyle = {
8539
8568
  ...suggestionBoxBaseStyle,
8540
8569
  width: 'max-content',
8541
- minWidth: autocompleteMinWidth,
8570
+ minWidth: resolvedDropdownMinWidth,
8542
8571
  };
8543
8572
  const suggestionItemStyle = {
8544
8573
  display: 'flex',
@@ -8566,7 +8595,7 @@ class SdChipInput {
8566
8595
  fontFamily: CHIP_INPUT_SUGGESTIONS.itemFontFamily,
8567
8596
  color: CHIP_INPUT_SUGGESTIONS.emptyColor,
8568
8597
  };
8569
- return (hAsync("sd-field", { key: 'c5f94bcc3343549d225d8310e98d424bd74471e5', name: this.name, label: this.label, labelWidth: this.labelWidth, hint: this.hint, errorMessage: this.errorMessage, rules: [this.duplicateRule, ...(this.rules ?? [])], error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, size: this.size, width: this.width, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), style: cssVars, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false) }, hAsync("div", { key: '40a0d8d08b33ff454eae29e815afd0378b93d927', class: "sd-chip-input", ref: el => (this.chipInputRef = el), onClick: this.handleContainerClick }, (this.internalValues ?? []).map((value, i) => (hAsync("sd-chip", { key: i, value: value, error: this.getChipError(i), disabled: this.getChipDisabled(i), editable: false, onSdRemove: () => this.handleChipRemove(i) }))), !isMaxReached && (hAsync("div", { key: 'c40b423a77272adaded79c3bc45af2084ef76ecf', class: {
8598
+ return (hAsync("sd-field", { key: '7be2526c67f5eddf5a8652211e7fb47610559d84', name: this.name, label: this.label, labelWidth: this.labelWidth, hint: this.hint, errorMessage: this.errorMessage, rules: [this.duplicateRule, ...(this.rules ?? [])], error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, size: this.size, width: this.width, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), style: cssVars, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false) }, hAsync("div", { key: '07534d138b631226433ed17101de70170df269cb', class: "sd-chip-input", ref: el => (this.chipInputRef = el), onClick: this.handleContainerClick }, (this.internalValues ?? []).map((value, i) => (hAsync("sd-chip", { key: i, value: value, error: this.getChipError(i), disabled: this.getChipDisabled(i), editable: false, onSdRemove: () => this.handleChipRemove(i) }))), !isMaxReached && (hAsync("div", { key: '329ec02d448fe6da2b9cba977fc2e17fa86e358f', class: {
8570
8599
  'sd-chip-input__field': true,
8571
8600
  'sd-chip-input__field--filled': this.inputValue !== '',
8572
8601
  'sd-chip-input__field--empty': this.inputValue === '' && this.internalValues.length > 0 && !this.focused,
@@ -8574,12 +8603,15 @@ class SdChipInput {
8574
8603
  ? this.inputValue
8575
8604
  : this.internalValues.length === 0
8576
8605
  ? this.placeholder
8577
- : '' }, hAsync("input", { key: '05ff9dc453577cb53a6284b9d064ef3e572bbc83', ref: el => (this.inputEl = el), class: "sd-chip-input__input", placeholder: this.internalValues.length === 0 ? this.placeholder : '', disabled: this.disabled, size: 1, onInput: this.handleInput, onKeyDown: this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur }))), showResetArea && (
8606
+ : '' }, hAsync("input", { key: 'bbe535cc1dd12db472b995bbe1c7d4ac43aa85e4', ref: el => (this.inputEl = el), class: "sd-chip-input__input", placeholder: this.internalValues.length === 0 ? this.placeholder : '', disabled: this.disabled, size: 1, onInput: this.handleInput, onKeyDown: this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur }))), showResetArea && (
8578
8607
  // eslint-disable-next-line jsx-a11y/no-static-element-interactions
8579
- hAsync("div", { key: 'f2e5336974905e3b7672567b29ad4f902ed2bcdf', class: "sd-chip-input__reset",
8608
+ hAsync("div", { key: '2384ba5c13e27556f8135f71c43aa8dd98922850', class: {
8609
+ 'sd-chip-input__reset': true,
8610
+ 'sd-chip-input__reset--end': this.metaPlacement === 'end',
8611
+ }, "data-placement": this.metaPlacement,
8580
8612
  // 리셋 버튼 클릭 시 input blur → portal unmount → refocus → 새 portal mount로
8581
8613
  // 두 wrapper가 body에 잠깐 겹치는 타이밍 이슈를 방지한다.
8582
- onMouseDown: e => e.preventDefault() }, this.inputValue === '' && hAsync("span", { key: '65f0bcd6086029ab9637dd6c7a64524478c11e76', class: "sd-chip-input__divider" }), this.maxCount != null && (hAsync("span", { key: 'd4702a86e9f1ca03bf74937dfb9e0c822e9722bf', class: "sd-chip-input__max-count" }, "\uCD5C\uB300 ", this.maxCount, "\uAC1C")), this.useReset && this.internalValues.length > 0 && (hAsync("sd-text-link", { key: '70a5d27129e37e49d8d8d7f92b6ad9471575fa71', icon: "reset", iconColor: CHIP_INPUT_RESET.iconColor, label: "\uC785\uB825 \uCD08\uAE30\uD654", underline: true, disabled: this.disabled, style: { '--sd-text-link-color': CHIP_INPUT_RESET.labelColor }, onSdClick: this.handleResetInput })))), hAsync("sd-portal", { key: '24e9ac9124c514debc6df00ed663c20ac0f92bf7', class: "sd-chip-input__autocomplete-portal", open: showAutocomplete, parentRef: this.fieldRef ?? null, viewportPadding: SdChipInput.SUGGESTIONS_VIEWPORT_PADDING, onSdClose: this.closeSuggestions }, hAsync("div", { key: 'd0e7697fc7a8a754d6b1ce6a34c205bbc7630a81', class: "sd-chip-input__suggestions sd-chip-input__suggestions--autocomplete", role: "listbox", style: autocompleteBoxStyle }, isAutocompleteLoading && (hAsync("div", { key: '2709073f6174ede46b5d9e4d0c72f9b2dc207c54', class: "sd-chip-input__suggestions-empty", style: suggestionEmptyStyle }, "\uBD88\uB7EC\uC624\uB294 \uC911...")), autocompleteListItems.map((item, i) => {
8614
+ onMouseDown: e => e.preventDefault() }, this.inputValue === '' && hAsync("span", { key: 'b332a240d13c48f31c76cf7c5afffe69b25213e5', class: "sd-chip-input__divider" }), this.maxCount != null && (hAsync("span", { key: '70641e0b72e6aec6e02a9cfa84e7a118b24f1355', class: "sd-chip-input__max-count" }, "\uCD5C\uB300 ", this.maxCount, "\uAC1C")), this.useReset && this.internalValues.length > 0 && (hAsync("sd-text-link", { key: '2dba93d961187b5f2a8501038ea01beb45123a5a', icon: "reset", iconColor: CHIP_INPUT_RESET.iconColor, label: "\uC785\uB825 \uCD08\uAE30\uD654", underline: true, disabled: this.disabled, style: { '--sd-text-link-color': CHIP_INPUT_RESET.labelColor }, onSdClick: this.handleResetInput })))), hAsync("sd-portal", { key: '68eea57d431b5aafecafc785febe50ead9586652', class: "sd-chip-input__autocomplete-portal", open: showAutocomplete, parentRef: this.fieldRef ?? null, viewportPadding: SdChipInput.SUGGESTIONS_VIEWPORT_PADDING, onSdClose: this.closeSuggestions }, hAsync("div", { key: 'face530c9604516f06ed9c304172f64fa44d42b0', class: "sd-chip-input__suggestions sd-chip-input__suggestions--autocomplete", role: "listbox", style: autocompleteBoxStyle }, isAutocompleteLoading && (hAsync("div", { key: '1d691afb5bf3a65991bcff925bb8c6ceffa3a688', class: "sd-chip-input__suggestions-empty", style: suggestionEmptyStyle }, "\uBD88\uB7EC\uC624\uB294 \uC911...")), autocompleteListItems.map((item, i) => {
8583
8615
  const isSelected = (this.internalValues ?? []).includes(item);
8584
8616
  const isActive = i === this.activeSuggestionIndex && !isSelected;
8585
8617
  return (hAsync("div", { key: item, class: {
@@ -8605,7 +8637,7 @@ class SdChipInput {
8605
8637
  if (!isSelected)
8606
8638
  this.addChip(item);
8607
8639
  } }, hAsync("span", { style: { flex: '1' } }, item), isSelected && (hAsync("sd-icon", { name: "check", size: "12", style: { color: '#0075FF', flexShrink: '0' } }))));
8608
- }))), hAsync("sd-portal", { key: '96424b38ffe1ec646b48fdea0b65cdb9dbc2caf7', class: "sd-chip-input__recommendation-portal", open: showRecommendations, parentRef: this.chipInputRef ?? null, viewportPadding: SdChipInput.SUGGESTIONS_VIEWPORT_PADDING, onSdClose: this.closeSuggestions }, hAsync("div", { key: '2ae809c5d03b662e98252768ac3f7ac44730dbb7', class: "sd-chip-input__suggestions", role: "listbox", style: suggestionBoxStyle }, isRecommendationLoading && (hAsync("div", { key: '3dbf23b89e923762c0ee092f9f5f724a043bd3a6', class: "sd-chip-input__suggestions-empty", style: suggestionEmptyStyle }, "\uBD88\uB7EC\uC624\uB294 \uC911...")), hAsync("div", { key: 'ebbccb03b333bed84a88d1ca10f0e4e142211582', style: {
8640
+ }))), hAsync("sd-portal", { key: '44d969fb589aad9d292725e6d5fa90da814012fe', class: "sd-chip-input__recommendation-portal", open: showRecommendations, parentRef: this.chipInputRef ?? null, viewportPadding: SdChipInput.SUGGESTIONS_VIEWPORT_PADDING, onSdClose: this.closeSuggestions }, hAsync("div", { key: 'e87049f20b42bfe12e8127aa51133704d4bdd233', class: "sd-chip-input__suggestions", role: "listbox", style: suggestionBoxStyle }, isRecommendationLoading && (hAsync("div", { key: '63815fc8325a93178fd8eb1b6394bb489ae1344d', class: "sd-chip-input__suggestions-empty", style: suggestionEmptyStyle }, "\uBD88\uB7EC\uC624\uB294 \uC911...")), hAsync("div", { key: '2598ec64253198067f3b215e79d90d256a9eb562', style: {
8609
8641
  display: 'flex',
8610
8642
  flexWrap: 'wrap',
8611
8643
  gap: '8px',
@@ -8658,12 +8690,13 @@ class SdChipInput {
8658
8690
  "error": [1028],
8659
8691
  "useReset": [4, "use-reset"],
8660
8692
  "maxCount": [2, "max-count"],
8693
+ "metaPlacement": [1, "meta-placement"],
8661
8694
  "duplicateLabel": [1, "duplicate-label"],
8662
8695
  "suggestions": [1040],
8663
8696
  "loadingSuggestions": [4, "loading-suggestions"],
8664
8697
  "recommendedItems": [1040],
8665
8698
  "loadingRecommendedItems": [4, "loading-recommended-items"],
8666
- "autocompleteMinWidth": [8, "autocomplete-min-width"],
8699
+ "dropdownMinWidth": [8, "dropdown-min-width"],
8667
8700
  "label": [1],
8668
8701
  "labelWidth": [8, "label-width"],
8669
8702
  "hint": [1],
@@ -8777,7 +8810,7 @@ class SdCircleProgress {
8777
8810
  }
8778
8811
  const c = CIRCLE_PROGRESS_VIEWBOX_SIZE / 2;
8779
8812
  const showPercent = !this.indeterminate;
8780
- return (hAsync(Host, { key: '869ec15d8df4b3e240b70599d8ba72618cda4c87', style: hostStyle }, hAsync("svg", { key: '446fa350f3c7e225e455f5f6c12b4aab45d20287', 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: 'c3555674067f60ab1a1458d789d62fc9bbc8015f', class: "sd-circle-progress__track", cx: c, cy: c, r: CIRCLE_PROGRESS_RADIUS, fill: "none", "stroke-width": CIRCLE_PROGRESS_STROKE_WIDTH }), hAsync("circle", { key: '62716c5645d957be08ea0e0818e47edda2c9e471', 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 })), showPercent && (hAsync("span", { key: 'b56d75c0c40cb82d4c4c87161913b28063a9d369', class: "sd-circle-progress__percent" }, Math.round(this.clampedValue), "%")), this.label && hAsync("span", { key: '65cfb5cd0426c7cbf5ee7aefeaf675471abccaaf', class: "sd-circle-progress__label" }, this.label)));
8813
+ return (hAsync(Host, { key: '7458f47e0e621f2cead4d72618edcd2bdab4b923', style: hostStyle }, hAsync("svg", { key: 'ca0b2b99ac2e1c4a6a51b509fa37292689f4f6ff', 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: '61d09511593f23d1e88712fa45c341a45e34589d', class: "sd-circle-progress__track", cx: c, cy: c, r: CIRCLE_PROGRESS_RADIUS, fill: "none", "stroke-width": CIRCLE_PROGRESS_STROKE_WIDTH }), hAsync("circle", { key: 'a4875d4001db2ee091a41c0afe7a4afb0062c610', 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 })), showPercent && (hAsync("span", { key: 'a49f13b27e1c8ee46370ff0fc7692e7d535ddca3', class: "sd-circle-progress__percent" }, Math.round(this.clampedValue), "%")), this.label && hAsync("span", { key: '0c76f052dbccb5f2e33511afb5ff5d325e36d697', class: "sd-circle-progress__label" }, this.label)));
8781
8814
  }
8782
8815
  static get style() { return sdCircleProgressCss(); }
8783
8816
  static get cmpMeta() { return {
@@ -8908,7 +8941,7 @@ class SdConfirmModal {
8908
8941
  const type = this.resolvedType;
8909
8942
  const iconName = CONFIRM_MODAL_ICON_MAP[type];
8910
8943
  const iconColor = CONFIRM_MODAL_ICON_COLOR[type];
8911
- return (hAsync("div", { key: '0376a60d15b1e090a6ff8d4181f8afb107d5ede3', class: "sd-confirm-modal" }, hAsync("sd-ghost-button", { key: 'e652536ecf9a97c19a943de4ef5ebca99323a40a', class: "sd-confirm-modal__close-button", icon: "close", ariaLabel: "close", onClick: () => this.close.emit() }), iconName && (hAsync("sd-icon", { key: '8bb1e4a9207681ced8f06fa1919c99104a03b71c', class: "sd-confirm-modal__icon", name: iconName, size: TITLE_ICON_SIZE, color: iconColor })), hAsync("h2", { key: '08991739402f4a1f8b4da3af3df24eec556cf88e', class: `sd-confirm-modal__title ${this.titleClass ?? ''}` }, this.modalTitle), hAsync("div", { key: 'ba7aad2acaacc31f6e66122648c36b3398620b5b', class: "sd-confirm-modal__body" }, (this.topMessage ?? []).length > 0 && (hAsync("div", { key: '6a0ccc07791d2d4c8923c1616fe9346d4a3c92c0', class: "sd-confirm-modal__message" }, (this.topMessage ?? []).map(msg => (hAsync("p", { class: "sd-confirm-modal__message-text", innerHTML: sanitizeInlineHtml(msg) }))))), this.showTagBox && (hAsync("div", { key: '0e380d6d5ffe607863bae04821098b7585016f96', class: "sd-confirm-modal__content-box" }, hAsync("slot", { key: 'de4eddc19f18831bf59797bda48aa4eaea3fac6a', name: "tag", onSlotchange: () => this.syncHasSlottedContent() }, this.tagLabel && (hAsync("sd-tag", { key: 'a63cfc4baaef0a1a8e666d5dba8528b8b135c1bc', name: this.tagPreset ?? 'square_sm_grey', label: this.tagLabel }))))), (this.bottomMessage ?? []).length > 0 && (hAsync("div", { key: '0e9ebab6b5aaf4af7282358f7ddc57dc75cd682a', class: "sd-confirm-modal__message" }, (this.bottomMessage ?? []).map(msg => (hAsync("p", { class: "sd-confirm-modal__message-text", innerHTML: sanitizeInlineHtml(msg) }))))), this.showOption && (hAsync("div", { key: 'cd8088453591b2fbda51aac93c8284e0f3c23aa9', class: "sd-confirm-modal__option" }, hAsync("slot", { key: '4cbe1c57b47f12ba1f3cae23b55fb694f6b00787', name: "option", onSlotchange: () => this.syncHasSlottedContent() }, this.slotLabel && (hAsync("span", { key: 'ed7e7aa05f5e32de4a361dcf8e3f2c2207dc9981', class: "sd-confirm-modal__slot-label" }, this.slotLabel)))))), hAsync("div", { key: '069af4cfe63733e6960dd9e35888b26a06269026', class: "sd-confirm-modal__button" }, this.subButtonLabel && (hAsync("sd-button", { key: 'a5371149596d109bede88df34736aaff88745f18', name: SUB_BUTTON_PRESET, label: this.subButtonLabel, onSdClick: () => this.cancel.emit() })), hAsync("sd-button", { key: '46c0406da30bd761aa4d09f70ae9bb735b8dff5f', name: this.resolvedMainButton, label: this.mainButtonLabel ?? '확인', onSdClick: () => this.ok.emit() }))));
8944
+ return (hAsync("div", { key: '8d84d72de4a8194100a22c2f19190d35da8ad9d0', class: "sd-confirm-modal" }, hAsync("sd-ghost-button", { key: '8d3c11e01819fc4b3a92ef2c00afab336b12a4d8', class: "sd-confirm-modal__close-button", icon: "close", ariaLabel: "close", onClick: () => this.close.emit() }), iconName && (hAsync("sd-icon", { key: 'f5013d2753d946a46666c3fc4e7e5ec79ebb5bf3', class: "sd-confirm-modal__icon", name: iconName, size: TITLE_ICON_SIZE, color: iconColor })), hAsync("h2", { key: '88ca2b2d80ec9dfe06aa6d9ae4d65a9bf365e52e', class: `sd-confirm-modal__title ${this.titleClass ?? ''}` }, this.modalTitle), hAsync("div", { key: 'ab9ad0c312d4155a5d8985d43c31f4ab11fc9110', class: "sd-confirm-modal__body" }, (this.topMessage ?? []).length > 0 && (hAsync("div", { key: '294bea4d946392e63ec152f4a109e75fd9c5a743', class: "sd-confirm-modal__message" }, (this.topMessage ?? []).map(msg => (hAsync("p", { class: "sd-confirm-modal__message-text", innerHTML: sanitizeInlineHtml(msg) }))))), this.showTagBox && (hAsync("div", { key: '6ab23578df59a6c29718087fda729a256f32e725', class: "sd-confirm-modal__content-box" }, hAsync("slot", { key: '48c21c001a4608d1b36c4a8feee99d7ee05422c7', name: "tag", onSlotchange: () => this.syncHasSlottedContent() }, this.tagLabel && (hAsync("sd-tag", { key: 'fb227ba974fc9b176e90bfa906c212099c23c98b', name: this.tagPreset ?? 'square_sm_grey', label: this.tagLabel }))))), (this.bottomMessage ?? []).length > 0 && (hAsync("div", { key: '665429ebae13b9c71e4eeaf372c45dbb98b71aa8', class: "sd-confirm-modal__message" }, (this.bottomMessage ?? []).map(msg => (hAsync("p", { class: "sd-confirm-modal__message-text", innerHTML: sanitizeInlineHtml(msg) }))))), this.showOption && (hAsync("div", { key: '589d730c0952cd6370f96984f2d0e3c9a9fe50e6', class: "sd-confirm-modal__option" }, hAsync("slot", { key: '23a57ca4663436aabd4f606246c80d3c3aec1ecf', name: "option", onSlotchange: () => this.syncHasSlottedContent() }, this.slotLabel && (hAsync("span", { key: '6dead5dc544f4f1ed68a50d2619a6c10f438ea67', class: "sd-confirm-modal__slot-label" }, this.slotLabel)))))), hAsync("div", { key: '7156c27678f8f9a6de5afdbeed191a954420f1fa', class: "sd-confirm-modal__button" }, this.subButtonLabel && (hAsync("sd-button", { key: '02a6b6ffe4218e93ceef0dad349cd122587864df', name: SUB_BUTTON_PRESET, label: this.subButtonLabel, onSdClick: () => this.cancel.emit() })), hAsync("sd-button", { key: '6441fda6cebcc24fd48715ed85909b652725788f', name: this.resolvedMainButton, label: this.mainButtonLabel ?? '확인', onSdClick: () => this.ok.emit() }))));
8912
8945
  }
8913
8946
  static get style() { return sdConfirmModalCss(); }
8914
8947
  static get cmpMeta() { return {
@@ -9072,28 +9105,28 @@ var fieldTokens = {
9072
9105
  field: field
9073
9106
  };
9074
9107
 
9075
- const sm$3 = datepickerTokens.datepicker.sm;
9076
- const md$3 = datepickerTokens.datepicker.md;
9108
+ const sm$4 = datepickerTokens.datepicker.sm;
9109
+ const md$4 = datepickerTokens.datepicker.md;
9077
9110
  const DATEPICKER_SIZE_MAP = {
9078
9111
  sm: {
9079
- height: sm$3.height,
9080
- paddingX: sm$3.paddingX,
9081
- gap: sm$3.gap,
9082
- iconSize: sm$3.icon,
9083
- radius: sm$3.radius,
9084
- fontSize: sm$3.typography.fontSize,
9085
- lineHeight: sm$3.typography.lineHeight,
9086
- fontWeight: sm$3.typography.fontWeight,
9112
+ height: sm$4.height,
9113
+ paddingX: sm$4.paddingX,
9114
+ gap: sm$4.gap,
9115
+ iconSize: sm$4.icon,
9116
+ radius: sm$4.radius,
9117
+ fontSize: sm$4.typography.fontSize,
9118
+ lineHeight: sm$4.typography.lineHeight,
9119
+ fontWeight: sm$4.typography.fontWeight,
9087
9120
  },
9088
9121
  md: {
9089
- height: md$3.height,
9090
- paddingX: md$3.paddingX,
9091
- gap: md$3.gap,
9092
- iconSize: md$3.icon,
9093
- radius: md$3.radius,
9094
- fontSize: md$3.typography.fontSize,
9095
- lineHeight: md$3.typography.lineHeight,
9096
- fontWeight: md$3.typography.fontWeight,
9122
+ height: md$4.height,
9123
+ paddingX: md$4.paddingX,
9124
+ gap: md$4.gap,
9125
+ iconSize: md$4.icon,
9126
+ radius: md$4.radius,
9127
+ fontSize: md$4.typography.fontSize,
9128
+ lineHeight: md$4.typography.lineHeight,
9129
+ fontWeight: md$4.typography.fontWeight,
9097
9130
  },
9098
9131
  };
9099
9132
  const DATEPICKER_COLORS = {
@@ -9145,6 +9178,8 @@ class SdDatePicker {
9145
9178
  rules = [];
9146
9179
  /** 에러 상태 여부 */
9147
9180
  error = false;
9181
+ /** 필드 상태 (없으면 error/rules 결과로 자동 결정) */
9182
+ status;
9148
9183
  /** 레이블 영역 아이콘 */
9149
9184
  icon = undefined;
9150
9185
  /** 레이블 툴팁 텍스트 */
@@ -9228,9 +9263,9 @@ class SdDatePicker {
9228
9263
  '--sd-system-color-field-border-focus': DATEPICKER_COLORS.border.focus,
9229
9264
  '--sd-system-color-field-bg-default': DATEPICKER_COLORS.bg.default,
9230
9265
  };
9231
- return (hAsync("sd-field", { key: 'f6fe03d9c87b8de3d33d641934b28f1e42a1b23a', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, 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: '0d77d31b48f1ee8f87f7e59f472b0335f19b00be', class: "sd-date-picker", ref: el => {
9266
+ return (hAsync("sd-field", { key: 'c3adbcb65f372a7c33350a747b29b5a35990c292', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, status: this.status, 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: 'aac9b498321c4506a6979a17de4896c4521887a1', class: "sd-date-picker", ref: el => {
9232
9267
  this.triggerRef = el;
9233
- } }, hAsync("sd-date-picker-trigger", { key: '003de27ec2c3c660b1c183f10af02d6d982a6069', displayText: this.value ?? '', placeholder: this.placeholder, disabled: this.disabled, size: this.size, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (hAsync("sd-portal", { key: '719f5f0a191286d2f2d06ca41c5746f6dea569e3', open: this.isOpen, parentRef: this.triggerRef, onSdClose: () => this.closeDropdown() }, hAsync("sd-calendar", { key: 'd4a62d31666f21f6fb9d03f09cf36d16acc1c8a9', elevated: true, value: this.value, selectable: this.selectable, onSdUpdate: this.handleSelect, onSdViewChange: this.handleViewChange })))));
9268
+ } }, hAsync("sd-date-picker-trigger", { key: '00a558ac1c9a5af666c62c15e18e240036e1bb34', displayText: this.value ?? '', placeholder: this.placeholder, disabled: this.disabled, size: this.size, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (hAsync("sd-portal", { key: '142098d59d8a5df4054e7a39f4d93b0ddc06109b', open: this.isOpen, parentRef: this.triggerRef, onSdClose: () => this.closeDropdown() }, hAsync("sd-calendar", { key: '319dc85ff9a41e8b04fdaecc1c7e9e01c953014b', elevated: true, value: this.value, selectable: this.selectable, onSdUpdate: this.handleSelect, onSdViewChange: this.handleViewChange })))));
9234
9269
  }
9235
9270
  static get watchers() { return {
9236
9271
  "isOpen": [{
@@ -9256,6 +9291,7 @@ class SdDatePicker {
9256
9291
  "errorMessage": [1, "error-message"],
9257
9292
  "rules": [16],
9258
9293
  "error": [1028],
9294
+ "status": [1],
9259
9295
  "icon": [16],
9260
9296
  "labelTooltip": [1, "label-tooltip"],
9261
9297
  "labelTooltipProps": [16],
@@ -9318,7 +9354,7 @@ class SdDatePickerTrigger {
9318
9354
  ? DATEPICKER_COLORS.icon.disabled
9319
9355
  : DATEPICKER_COLORS.icon.default,
9320
9356
  };
9321
- return (hAsync("div", { key: '60a3b3ac02181faaabc1b77bdd8923069afa0af0', role: "button", tabindex: this.disabled ? -1 : 0, class: {
9357
+ return (hAsync("div", { key: 'b52c18bc057886ed8d6b1f5d145225a4c31f0035', role: "button", tabindex: this.disabled ? -1 : 0, class: {
9322
9358
  'sd-date-picker-trigger': true,
9323
9359
  'sd-date-picker-trigger--disabled': this.disabled,
9324
9360
  }, style: cssVars, onClick: this.handleClick, onKeyDown: e => {
@@ -9326,7 +9362,7 @@ class SdDatePickerTrigger {
9326
9362
  e.preventDefault();
9327
9363
  this.handleClick();
9328
9364
  }
9329
- } }, hAsync("sd-icon", { key: 'cafd36605dcc7edb20f11c008abd7b434eb1d36e', name: "date", size: Number(sizeTokens.iconSize), color: "var(--trigger-icon-color)", class: "sd-date-picker-trigger__icon" }), hAsync("span", { key: '6d9b6fad8b60fe8d9bcc02762b688eccc66f63b3', class: "sd-date-picker-trigger__text" }, hasValue ? this.displayText : this.placeholder)));
9365
+ } }, hAsync("sd-icon", { key: 'd653fa9a79c41b39e77a6a77afba2233a977ba29', name: "date", size: Number(sizeTokens.iconSize), color: "var(--trigger-icon-color)", class: "sd-date-picker-trigger__icon" }), hAsync("span", { key: 'e37f745bab9ea7ac1864ce0944ffd9d1d62eecd2', class: "sd-date-picker-trigger__text" }, hasValue ? this.displayText : this.placeholder)));
9330
9366
  }
9331
9367
  static get style() { return sdDatePickerTriggerCss(); }
9332
9368
  static get cmpMeta() { return {
@@ -9350,6 +9386,33 @@ const RANGE_LAYOUT = {
9350
9386
  panelGap: datepickerTokens.datepicker.calendar.range.panelGap,
9351
9387
  divider: datepickerTokens.datepicker.calendar.range.divider,
9352
9388
  };
9389
+ const timeTokens = datepickerTokens.datepicker.calendar.time;
9390
+ /** 시간(시:분) 선택 푸터 레이아웃 토큰 */
9391
+ const TIME_LAYOUT = {
9392
+ bgDefault: timeTokens.bg.default,
9393
+ bgSelected: timeTokens.bg.selected,
9394
+ dateLabel: timeTokens.date.label,
9395
+ dateUnit: timeTokens.date.unit,
9396
+ dateGap: timeTokens.date.gap,
9397
+ radius: timeTokens.radius,
9398
+ paddingX: timeTokens.paddingX,
9399
+ paddingY: timeTokens.paddingY,
9400
+ gap: timeTokens.gap,
9401
+ sectionGap: timeTokens.section.gap,
9402
+ unitGap: timeTokens.unit.gap,
9403
+ fontSize: timeTokens.typography.fontSize,
9404
+ lineHeight: timeTokens.typography.lineHeight,
9405
+ fontWeight: timeTokens.typography.fontWeight,
9406
+ // 시:분 입력 박스는 datepicker 필드(sm) 토큰을 재사용한다
9407
+ input: {
9408
+ height: DATEPICKER_SIZE_MAP.sm.height,
9409
+ radius: DATEPICKER_SIZE_MAP.sm.radius,
9410
+ border: DATEPICKER_COLORS.border.default,
9411
+ borderFocus: DATEPICKER_COLORS.border.focus,
9412
+ text: DATEPICKER_COLORS.text.default,
9413
+ placeholder: DATEPICKER_COLORS.text.disabled,
9414
+ },
9415
+ };
9353
9416
 
9354
9417
  const sdDateRangePickerCss = () => `sd-date-range-picker{display:inline-flex}sd-date-range-picker sd-portal{display:none}sd-date-range-picker .sd-date-range-picker{position:relative;width:100%;height:100%}`;
9355
9418
 
@@ -9371,6 +9434,11 @@ class SdDateRangePicker {
9371
9434
  selectable;
9372
9435
  /** 최대 선택 가능한 날짜 범위 (일 단위) */
9373
9436
  maxRange;
9437
+ /**
9438
+ * 시간(시:분) 선택 푸터 사용 여부.
9439
+ * true이면 value는 "YYYY-MM-DD HH:mm" 형식이 되고, 캘린더 하단에 시작·종료 시간 입력이 표시됩니다.
9440
+ */
9441
+ useTimePicker = false;
9374
9442
  /** 비활성 상태 여부 */
9375
9443
  disabled = false;
9376
9444
  /** 필드 너비 (숫자면 px, 문자열이면 그대로 적용) */
@@ -9392,6 +9460,8 @@ class SdDateRangePicker {
9392
9460
  rules = [];
9393
9461
  /** 에러 상태 여부 */
9394
9462
  error = false;
9463
+ /** 필드 상태 (없으면 error/rules 결과로 자동 결정) */
9464
+ status;
9395
9465
  /** 레이블 영역 아이콘 */
9396
9466
  icon = undefined;
9397
9467
  /** 레이블 툴팁 텍스트 */
@@ -9451,7 +9521,9 @@ class SdDateRangePicker {
9451
9521
  }
9452
9522
  };
9453
9523
  handleSelect = (e) => {
9454
- this.closeDropdown();
9524
+ // 시간 선택 모드에서는 사용자가 시:분을 조정할 수 있도록 드롭다운을 닫지 않고 실시간 반영만 한다
9525
+ if (!this.useTimePicker)
9526
+ this.closeDropdown();
9455
9527
  this.value = e.detail;
9456
9528
  const nextValue = this.value;
9457
9529
  requestAnimationFrame(() => {
@@ -9466,6 +9538,14 @@ class SdDateRangePicker {
9466
9538
  return '';
9467
9539
  return `${this.value[0]} ~ ${this.value[1]}`;
9468
9540
  }
9541
+ static DEFAULT_PLACEHOLDER = 'YYYY-MM-DD ~ YYYY-MM-DD';
9542
+ get resolvedPlaceholder() {
9543
+ // placeholder를 따로 지정하지 않았고 시간 선택 모드이면 시:분을 포함한 기본 placeholder를 쓴다
9544
+ if (this.useTimePicker && this.placeholder === SdDateRangePicker.DEFAULT_PLACEHOLDER) {
9545
+ return 'YYYY-MM-DD HH:mm ~ YYYY-MM-DD HH:mm';
9546
+ }
9547
+ return this.placeholder;
9548
+ }
9469
9549
  disconnectedCallback() {
9470
9550
  if (this.closeAnimationTimer)
9471
9551
  clearTimeout(this.closeAnimationTimer);
@@ -9479,9 +9559,9 @@ class SdDateRangePicker {
9479
9559
  '--sd-system-color-field-border-focus': DATEPICKER_COLORS.border.focus,
9480
9560
  '--sd-system-color-field-bg-default': DATEPICKER_COLORS.bg.default,
9481
9561
  };
9482
- return (hAsync("sd-field", { key: '00e25ab4608b5340b8be9e1dd19050968e34b758', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, 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: '98179e2ec90e55f83e5deff6e36fc821fc103456', class: "sd-date-range-picker", ref: el => {
9562
+ return (hAsync("sd-field", { key: '01098a74a5066d2328409dcdf21bb38691adf455', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, status: this.status, 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: 'dab4a666f5c144bbcbf3848528ce246c752ab906', class: "sd-date-range-picker", ref: el => {
9483
9563
  this.triggerRef = el;
9484
- } }, hAsync("sd-date-picker-trigger", { key: 'fe123228a851da602f0a5a8929fc20782742a24b', displayText: this.displayText, placeholder: this.placeholder, disabled: this.disabled, size: this.size, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (hAsync("sd-portal", { key: 'ee7eb14cc09fd067a8eeb9f19bd93178378d81b2', open: this.isOpen, parentRef: this.triggerRef, onSdClose: () => this.closeDropdown() }, hAsync("sd-date-range-picker-calendar", { key: '8dc57a29f1ecd6811fb4538a96eea823dfebe080', value: this.value, selectable: this.selectable, maxRange: this.maxRange, onSdSelect: this.handleSelect, onSdViewChange: this.handleViewChange })))));
9564
+ } }, hAsync("sd-date-picker-trigger", { key: '5aa378df1b53a2b8cc29e159e7bda0544210a81e', displayText: this.displayText, placeholder: this.resolvedPlaceholder, disabled: this.disabled, size: this.size, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (hAsync("sd-portal", { key: '8d18658004dc009d869804bdabd31155117edde3', open: this.isOpen, parentRef: this.triggerRef, onSdClose: () => this.closeDropdown() }, hAsync("sd-date-range-picker-calendar", { key: '0bf96efeed4c567052e690a83a70f27df85ccc64', value: this.value, selectable: this.selectable, maxRange: this.maxRange, useTimePicker: this.useTimePicker, onSdSelect: this.handleSelect, onSdViewChange: this.handleViewChange })))));
9485
9565
  }
9486
9566
  static get watchers() { return {
9487
9567
  "isOpen": [{
@@ -9498,6 +9578,7 @@ class SdDateRangePicker {
9498
9578
  "placeholder": [513],
9499
9579
  "selectable": [16],
9500
9580
  "maxRange": [2, "max-range"],
9581
+ "useTimePicker": [4, "use-time-picker"],
9501
9582
  "disabled": [516],
9502
9583
  "width": [8],
9503
9584
  "label": [1],
@@ -9508,6 +9589,7 @@ class SdDateRangePicker {
9508
9589
  "errorMessage": [1, "error-message"],
9509
9590
  "rules": [16],
9510
9591
  "error": [1028],
9592
+ "status": [1],
9511
9593
  "icon": [16],
9512
9594
  "labelTooltip": [1, "label-tooltip"],
9513
9595
  "labelTooltipProps": [16],
@@ -9526,7 +9608,7 @@ class SdDateRangePicker {
9526
9608
  }; }
9527
9609
  }
9528
9610
 
9529
- const sdDateRangePickerCalendarCss = () => `sd-date-range-picker-calendar{display:block}sd-date-range-picker-calendar .sd-date-range-picker-calendar{display:flex;flex-direction:column;gap:var(--calendar-gap);height:364px;padding:var(--calendar-padding);background:var(--calendar-bg);border-radius:var(--calendar-radius);box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.2);user-select:none}sd-date-range-picker-calendar .sd-date-range-picker-calendar__top-bar{position:relative;display:flex;align-items:center;justify-content:center}sd-date-range-picker-calendar .sd-date-range-picker-calendar__year-nav{display:flex;align-items:center;justify-content:center;gap:var(--calendar-gap);font-size:var(--calendar-header-font-size);line-height:var(--calendar-header-line-height);font-weight:var(--calendar-header-font-weight);color:var(--calendar-day-text)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__today-button{position:absolute;right:0;background:transparent;cursor:pointer;font-size:var(--calendar-week-font-size);font-weight:var(--calendar-header-font-weight);color:var(--calendar-day-text);min-width:37px;height:24px;line-height:24px;text-align:center}sd-date-range-picker-calendar .sd-date-range-picker-calendar__today-button:hover{text-decoration:underline}sd-date-range-picker-calendar .sd-date-range-picker-calendar__panels{display:flex;flex-direction:row;gap:var(--range-panel-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__divider{flex-shrink:0;width:1px;background:var(--range-divider)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__panel{display:flex;flex-direction:column;gap:var(--calendar-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__header{display:flex;flex-flow:column nowrap;align-items:center;justify-content:center;gap:var(--calendar-header-gap);font-size:var(--calendar-header-font-size);line-height:var(--calendar-header-line-height);font-weight:var(--calendar-header-font-weight);color:var(--calendar-day-text)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__nav-group{display:inline-flex;align-items:center;gap:var(--calendar-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__nav-group-month{display:flex;width:100%;align-items:center;gap:var(--calendar-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__label{display:inline-flex;align-items:center;justify-content:center;min-width:40px;text-align:center}sd-date-range-picker-calendar .sd-date-range-picker-calendar__label-month{flex:1}sd-date-range-picker-calendar .sd-date-range-picker-calendar__nav-placeholder{visibility:hidden;pointer-events:none}sd-date-range-picker-calendar .sd-date-range-picker-calendar__week{display:grid;grid-template-columns:repeat(7, var(--calendar-day-size))}sd-date-range-picker-calendar .sd-date-range-picker-calendar__week-cell{display:inline-flex;align-items:center;justify-content:center;height:20px;font-size:var(--calendar-week-font-size);line-height:var(--calendar-week-line-height);font-weight:var(--calendar-week-font-weight);color:var(--calendar-week-color)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__grid{display:grid;grid-template-columns:repeat(7, var(--calendar-day-size));row-gap:var(--calendar-grid-row-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--calendar-day-size);height:var(--range-height);padding:0;border:none;background:transparent;cursor:pointer;font-size:var(--calendar-day-font-size);line-height:var(--calendar-day-line-height);font-weight:var(--calendar-day-font-weight);color:var(--calendar-day-text)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day-circle{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:var(--calendar-day-circle-size);height:var(--calendar-day-circle-size);border-radius:calc(var(--calendar-day-circle-radius) * 1px);border:1px solid transparent;box-sizing:border-box}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day:not(:disabled):hover .sd-date-range-picker-calendar__day-circle{border-radius:16px;border:1px solid var(--calendar-day-hover-border)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--today .sd-date-range-picker-calendar__day-circle{font-weight:700}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--in-range{background:var(--range-bg)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--range-start{background:linear-gradient(to right, transparent 50%, var(--range-bg) 50%)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--range-end{background:var(--range-bg)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--range-startsd-date-range-picker-calendar .sd-date-range-picker-calendar__day--range-end{background:transparent}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--selected .sd-date-range-picker-calendar__day-circle{border-radius:16px;background:var(--calendar-day-select-bg);color:var(--calendar-day-select-text)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--selected:not(:disabled):hover .sd-date-range-picker-calendar__day-circle{background:var(--calendar-day-select-bg);color:var(--calendar-day-select-text)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--disabled{color:var(--calendar-day-disabled-text);cursor:not-allowed}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--disabled:not(.sd-date-range-picker-calendar__day--in-range):not(.sd-date-range-picker-calendar__day--range-start):not(.sd-date-range-picker-calendar__day--range-end){background:none}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--empty{visibility:hidden;pointer-events:none;background:transparent}`;
9611
+ const sdDateRangePickerCalendarCss = () => `sd-date-range-picker-calendar{display:block}sd-date-range-picker-calendar .sd-date-range-picker-calendar{display:flex;flex-direction:column;gap:var(--calendar-gap);height:364px;padding:var(--calendar-padding);background:var(--calendar-bg);border-radius:var(--calendar-radius);box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.2);user-select:none}sd-date-range-picker-calendar .sd-date-range-picker-calendar--with-time{height:auto}sd-date-range-picker-calendar .sd-date-range-picker-calendar__top-bar{position:relative;display:flex;align-items:center;justify-content:center}sd-date-range-picker-calendar .sd-date-range-picker-calendar__year-nav{display:flex;align-items:center;justify-content:center;gap:var(--calendar-gap);font-size:var(--calendar-header-font-size);line-height:var(--calendar-header-line-height);font-weight:var(--calendar-header-font-weight);color:var(--calendar-day-text)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__today-button{position:absolute;right:0;background:transparent;cursor:pointer;font-size:var(--calendar-week-font-size);font-weight:var(--calendar-header-font-weight);color:var(--calendar-day-text);min-width:37px;height:24px;line-height:24px;text-align:center}sd-date-range-picker-calendar .sd-date-range-picker-calendar__today-button:hover{text-decoration:underline}sd-date-range-picker-calendar .sd-date-range-picker-calendar__panels{display:flex;flex-direction:row;gap:var(--range-panel-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__divider{flex-shrink:0;width:1px;background:var(--range-divider)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__panel{display:flex;flex-direction:column;gap:var(--calendar-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__header{display:flex;flex-flow:column nowrap;align-items:center;justify-content:center;gap:var(--calendar-header-gap);font-size:var(--calendar-header-font-size);line-height:var(--calendar-header-line-height);font-weight:var(--calendar-header-font-weight);color:var(--calendar-day-text)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__nav-group{display:inline-flex;align-items:center;gap:var(--calendar-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__nav-group-month{display:flex;width:100%;align-items:center;gap:var(--calendar-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__label{display:inline-flex;align-items:center;justify-content:center;min-width:40px;text-align:center}sd-date-range-picker-calendar .sd-date-range-picker-calendar__label-month{flex:1}sd-date-range-picker-calendar .sd-date-range-picker-calendar__nav-placeholder{visibility:hidden;pointer-events:none}sd-date-range-picker-calendar .sd-date-range-picker-calendar__week{display:grid;grid-template-columns:repeat(7, var(--calendar-day-size))}sd-date-range-picker-calendar .sd-date-range-picker-calendar__week-cell{display:inline-flex;align-items:center;justify-content:center;height:20px;font-size:var(--calendar-week-font-size);line-height:var(--calendar-week-line-height);font-weight:var(--calendar-week-font-weight);color:var(--calendar-week-color)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__grid{display:grid;grid-template-columns:repeat(7, var(--calendar-day-size));row-gap:var(--calendar-grid-row-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--calendar-day-size);height:var(--range-height);padding:0;border:none;background:transparent;cursor:pointer;font-size:var(--calendar-day-font-size);line-height:var(--calendar-day-line-height);font-weight:var(--calendar-day-font-weight);color:var(--calendar-day-text)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day-circle{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:var(--calendar-day-circle-size);height:var(--calendar-day-circle-size);border-radius:calc(var(--calendar-day-circle-radius) * 1px);border:1px solid transparent;box-sizing:border-box}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day:not(:disabled):hover .sd-date-range-picker-calendar__day-circle{border-radius:16px;border:1px solid var(--calendar-day-hover-border)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--today .sd-date-range-picker-calendar__day-circle{font-weight:700}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--in-range{background:var(--range-bg)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--range-start{background:linear-gradient(to right, transparent 50%, var(--range-bg) 50%)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--range-end{background:var(--range-bg)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--range-startsd-date-range-picker-calendar .sd-date-range-picker-calendar__day--range-end{background:transparent}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--selected .sd-date-range-picker-calendar__day-circle{border-radius:16px;background:var(--calendar-day-select-bg);color:var(--calendar-day-select-text)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--selected:not(:disabled):hover .sd-date-range-picker-calendar__day-circle{background:var(--calendar-day-select-bg);color:var(--calendar-day-select-text)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--disabled{color:var(--calendar-day-disabled-text);cursor:not-allowed}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--disabled:not(.sd-date-range-picker-calendar__day--in-range):not(.sd-date-range-picker-calendar__day--range-start):not(.sd-date-range-picker-calendar__day--range-end){background:none}sd-date-range-picker-calendar .sd-date-range-picker-calendar__day--empty{visibility:hidden;pointer-events:none;background:transparent}sd-date-range-picker-calendar .sd-date-range-picker-calendar__time-divider{width:100%;height:1px;background:var(--range-divider)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__time{display:flex;flex-direction:row;gap:var(--time-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__time-section{display:flex;flex:1;align-items:center;justify-content:center;gap:var(--time-section-gap);padding:var(--time-padding-y) var(--time-padding-x);border-radius:var(--time-radius);background:var(--time-bg-default);font-size:var(--time-font-size);line-height:var(--time-line-height);font-weight:var(--time-font-weight)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__time-section--active{background:var(--time-bg-selected)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__time-date{display:inline-flex;align-items:center;gap:var(--time-date-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__time-num{color:var(--time-date-label)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__time-unit{color:var(--time-date-unit)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__time-input-group{display:inline-flex;align-items:center;gap:var(--time-unit-gap)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__time-input{width:40px;height:var(--time-input-height);padding:0;border:1px solid var(--time-input-border);border-radius:var(--time-input-radius);background:var(--calendar-bg);text-align:center;font-size:var(--time-font-size);line-height:var(--time-line-height);font-weight:var(--time-font-weight);color:var(--time-input-text);box-sizing:border-box;outline:none}sd-date-range-picker-calendar .sd-date-range-picker-calendar__time-input::placeholder{color:var(--time-input-placeholder)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__time-input:focus{border-color:var(--time-input-border-focus)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__time-input:disabled{cursor:not-allowed}sd-date-range-picker-calendar .sd-date-range-picker-calendar__time-colon{color:var(--time-date-label)}sd-date-range-picker-calendar .sd-date-range-picker-calendar__time-suffix{color:var(--time-date-unit)}`;
9530
9612
 
9531
9613
  class SdDateRangePickerCalendar {
9532
9614
  constructor(hostRef) {
@@ -9540,11 +9622,20 @@ class SdDateRangePickerCalendar {
9540
9622
  selectable;
9541
9623
  /** 최대 선택 가능 일 수 */
9542
9624
  maxRange;
9625
+ /** 시간(시:분) 선택 푸터 사용 여부 */
9626
+ useTimePicker = false;
9543
9627
  currentYear;
9544
9628
  currentMonth;
9545
9629
  pendingStart = '';
9546
9630
  hoverDate = '';
9547
9631
  displayValue = null;
9632
+ // 시:분은 2자리 미만도 허용하기 위해 문자열로 관리하고 emit/blur 시 패딩한다
9633
+ startHour = '00';
9634
+ startMinute = '00';
9635
+ endHour = '00';
9636
+ endMinute = '00';
9637
+ /** 직접 emit한 값이 value prop으로 되돌아오는 에코를 구분해 시간 입력 clobber를 막는다 */
9638
+ lastEmitted = '';
9548
9639
  /** 날짜 범위 선택 시 발생합니다. */
9549
9640
  select;
9550
9641
  /** 달력 뷰가 변경될 때 발생합니다. */
@@ -9557,13 +9648,31 @@ class SdDateRangePickerCalendar {
9557
9648
  this.syncFromValue();
9558
9649
  }
9559
9650
  syncFromValue() {
9560
- const base = this.value?.[0] || today;
9651
+ // 자신이 emit한 값이 그대로 돌아온 경우(에코)에는 시간 입력 상태를 건드리지 않는다
9652
+ if (this.useTimePicker && JSON.stringify(this.value) === this.lastEmitted)
9653
+ return;
9654
+ const start = this.splitDateTime(this.value?.[0]);
9655
+ const end = this.splitDateTime(this.value?.[1]);
9656
+ const base = start.date || today;
9561
9657
  const [year, month] = base.split('-').map(Number);
9562
9658
  this.currentYear = year;
9563
9659
  this.currentMonth = month;
9564
9660
  this.pendingStart = '';
9565
9661
  this.hoverDate = '';
9566
- this.displayValue = this.value ? [this.value[0], this.value[1]] : null;
9662
+ // displayValue는 날짜 부분만 보관 — 캘린더 그리드 로직은 시간과 무관하게 동작한다
9663
+ this.displayValue = this.value ? [start.date, end.date] : null;
9664
+ this.startHour = start.hour;
9665
+ this.startMinute = start.minute;
9666
+ this.endHour = end.hour;
9667
+ this.endMinute = end.minute;
9668
+ }
9669
+ /** "YYYY-MM-DD HH:mm" 또는 "YYYY-MM-DD"를 날짜/시/분으로 분리한다 */
9670
+ splitDateTime(v) {
9671
+ if (v == null || v === '')
9672
+ return { date: '', hour: '00', minute: '00' };
9673
+ const [date = '', time = ''] = v.split(' ');
9674
+ const [hour = '00', minute = '00'] = time.split(':');
9675
+ return { date, hour, minute };
9567
9676
  }
9568
9677
  get rightYear() {
9569
9678
  return this.currentMonth === 12 ? this.currentYear + 1 : this.currentYear;
@@ -9670,13 +9779,69 @@ class SdDateRangePickerCalendar {
9670
9779
  this.pendingStart = cell.date;
9671
9780
  this.displayValue = null;
9672
9781
  this.hoverDate = '';
9782
+ // 새 범위 선택을 시작하면 시작=00:00, 종료=23:59(하루 전체)로 초기화한다
9783
+ if (this.useTimePicker) {
9784
+ this.startHour = '00';
9785
+ this.startMinute = '00';
9786
+ this.endHour = '23';
9787
+ this.endMinute = '59';
9788
+ }
9673
9789
  return;
9674
9790
  }
9675
9791
  const newRange = [this.pendingStart, cell.date];
9676
9792
  this.pendingStart = '';
9677
9793
  this.hoverDate = '';
9678
9794
  this.displayValue = newRange;
9679
- this.select.emit(newRange);
9795
+ this.emitRange(newRange[0], newRange[1]);
9796
+ }
9797
+ /** 날짜 범위(+ useTimePicker면 시:분)를 결합해 sdSelect로 emit한다 */
9798
+ emitRange(startDate, endDate) {
9799
+ const range = this.useTimePicker
9800
+ ? [
9801
+ `${startDate} ${this.pad(this.startHour)}:${this.pad(this.startMinute)}`,
9802
+ `${endDate} ${this.pad(this.endHour)}:${this.pad(this.endMinute)}`,
9803
+ ]
9804
+ : [startDate, endDate];
9805
+ this.lastEmitted = JSON.stringify(range);
9806
+ this.select.emit(range);
9807
+ }
9808
+ pad(v) {
9809
+ return String(Number(v) || 0).padStart(2, '0');
9810
+ }
9811
+ /** 시:분 입력 — 숫자만/2자리로 제한하고 범위(시 0~23, 분 0~59)로 클램프한다 */
9812
+ handleTimeInput(which, part, event) {
9813
+ const input = event.target;
9814
+ const digits = input.value.replace(/\D/g, '').slice(0, 2);
9815
+ const max = part === 'h' ? 23 : 59;
9816
+ const next = digits !== '' && Number(digits) > max ? String(max) : digits;
9817
+ input.value = next;
9818
+ this.setTimePart(which, part, next);
9819
+ // 범위가 확정된 상태면 실시간으로 재emit한다
9820
+ if (this.displayValue != null && this.displayValue[0] !== '' && this.displayValue[1] !== '') {
9821
+ this.emitRange(this.displayValue[0], this.displayValue[1]);
9822
+ }
9823
+ }
9824
+ handleTimeBlur(which, part) {
9825
+ this.setTimePart(which, part, this.pad(this.getTimePart(which, part)));
9826
+ }
9827
+ getTimePart(which, part) {
9828
+ if (which === 'start')
9829
+ return part === 'h' ? this.startHour : this.startMinute;
9830
+ return part === 'h' ? this.endHour : this.endMinute;
9831
+ }
9832
+ setTimePart(which, part, value) {
9833
+ if (which === 'start') {
9834
+ if (part === 'h')
9835
+ this.startHour = value;
9836
+ else
9837
+ this.startMinute = value;
9838
+ }
9839
+ else {
9840
+ if (part === 'h')
9841
+ this.endHour = value;
9842
+ else
9843
+ this.endMinute = value;
9844
+ }
9680
9845
  }
9681
9846
  handleDayHover(cell) {
9682
9847
  if (!cell.inCurrentMonth)
@@ -9742,6 +9907,22 @@ class SdDateRangePickerCalendar {
9742
9907
  }, disabled: !cell.inCurrentMonth || isDisabled, tabindex: !cell.inCurrentMonth ? -1 : undefined, "aria-hidden": !cell.inCurrentMonth ? 'true' : undefined, onClick: () => this.handleDayClick(cell), onMouseEnter: () => this.handleDayHover(cell) }, hAsync("span", { class: "sd-date-range-picker-calendar__day-circle" }, cell.inCurrentMonth ? cell.day : '')));
9743
9908
  }))));
9744
9909
  }
9910
+ renderTimeSection(which, date, suffix) {
9911
+ const active = date !== '';
9912
+ const [year = '', month = '', day = ''] = active ? date.split('-') : [];
9913
+ const hour = which === 'start' ? this.startHour : this.endHour;
9914
+ const minute = which === 'start' ? this.startMinute : this.endMinute;
9915
+ const renderNum = (n, strip) => (hAsync("span", { class: "sd-date-range-picker-calendar__time-num" }, active && n !== '' ? (strip ? String(Number(n)) : n) : '-'));
9916
+ return (hAsync("div", { class: {
9917
+ 'sd-date-range-picker-calendar__time-section': true,
9918
+ 'sd-date-range-picker-calendar__time-section--active': active,
9919
+ } }, hAsync("div", { class: "sd-date-range-picker-calendar__time-date" }, renderNum(year, false), hAsync("span", { class: "sd-date-range-picker-calendar__time-unit" }, "\uB144"), renderNum(month, true), hAsync("span", { class: "sd-date-range-picker-calendar__time-unit" }, "\uC6D4"), renderNum(day, true), hAsync("span", { class: "sd-date-range-picker-calendar__time-unit" }, "\uC77C")), hAsync("div", { class: "sd-date-range-picker-calendar__time-input-group" }, hAsync("input", { type: "text", inputMode: "numeric", maxLength: 2, class: "sd-date-range-picker-calendar__time-input", placeholder: "--", "aria-label": `${suffix} 시`, disabled: !active, value: active ? hour : '', onInput: e => this.handleTimeInput(which, 'h', e), onBlur: () => this.handleTimeBlur(which, 'h') }), hAsync("span", { class: "sd-date-range-picker-calendar__time-colon" }, ":"), hAsync("input", { type: "text", inputMode: "numeric", maxLength: 2, class: "sd-date-range-picker-calendar__time-input", placeholder: "--", "aria-label": `${suffix} 분`, disabled: !active, value: active ? minute : '', onInput: e => this.handleTimeInput(which, 'm', e), onBlur: () => this.handleTimeBlur(which, 'm') })), hAsync("span", { class: "sd-date-range-picker-calendar__time-suffix" }, suffix)));
9920
+ }
9921
+ renderTimeFooter() {
9922
+ const startDate = this.pendingStart || this.displayValue?.[0] || '';
9923
+ const endDate = this.displayValue?.[1] || '';
9924
+ return (hAsync(Fragment, null, hAsync("span", { class: "sd-date-range-picker-calendar__time-divider", "aria-hidden": "true" }), hAsync("div", { class: "sd-date-range-picker-calendar__time" }, this.renderTimeSection('start', startDate, '부터'), this.renderTimeSection('end', endDate, '까지'))));
9925
+ }
9745
9926
  render() {
9746
9927
  const cssVars = {
9747
9928
  '--calendar-bg': CALENDAR_LAYOUT.bg,
@@ -9774,8 +9955,31 @@ class SdDateRangePickerCalendar {
9774
9955
  '--range-height': `${RANGE_LAYOUT.height}px`,
9775
9956
  '--range-panel-gap': `${RANGE_LAYOUT.panelGap}px`,
9776
9957
  '--range-divider': RANGE_LAYOUT.divider,
9958
+ '--time-bg-default': TIME_LAYOUT.bgDefault,
9959
+ '--time-bg-selected': TIME_LAYOUT.bgSelected,
9960
+ '--time-date-label': TIME_LAYOUT.dateLabel,
9961
+ '--time-date-unit': TIME_LAYOUT.dateUnit,
9962
+ '--time-date-gap': `${TIME_LAYOUT.dateGap}px`,
9963
+ '--time-radius': `${TIME_LAYOUT.radius}px`,
9964
+ '--time-padding-x': `${TIME_LAYOUT.paddingX}px`,
9965
+ '--time-padding-y': `${TIME_LAYOUT.paddingY}px`,
9966
+ '--time-gap': `${TIME_LAYOUT.gap}px`,
9967
+ '--time-section-gap': `${TIME_LAYOUT.sectionGap}px`,
9968
+ '--time-unit-gap': `${TIME_LAYOUT.unitGap}px`,
9969
+ '--time-font-size': `${TIME_LAYOUT.fontSize}px`,
9970
+ '--time-line-height': `${TIME_LAYOUT.lineHeight}px`,
9971
+ '--time-font-weight': TIME_LAYOUT.fontWeight,
9972
+ '--time-input-height': `${TIME_LAYOUT.input.height}px`,
9973
+ '--time-input-radius': `${TIME_LAYOUT.input.radius}px`,
9974
+ '--time-input-border': TIME_LAYOUT.input.border,
9975
+ '--time-input-border-focus': TIME_LAYOUT.input.borderFocus,
9976
+ '--time-input-text': TIME_LAYOUT.input.text,
9977
+ '--time-input-placeholder': TIME_LAYOUT.input.placeholder,
9777
9978
  };
9778
- return (hAsync(Fragment, { key: '21999354836fc4068eecc9d115fb4c5e28a8f411' }, hAsync("div", { key: '1bc993c9e5cb6f02152591c3f70b68fb580a392b', class: "sd-date-range-picker-calendar", style: cssVars }, this.renderYearNav(), hAsync("div", { key: '09564bf7c14a55c7be56726fefbb6cec793df783', class: "sd-date-range-picker-calendar__panels" }, this.renderPanel(this.currentYear, this.currentMonth, true), hAsync("span", { key: '5d8910e7c463c33ad8719a293a616b7f50095532', class: "sd-date-range-picker-calendar__divider", "aria-hidden": "true" }), this.renderPanel(this.rightYear, this.rightMonth, false)))));
9979
+ return (hAsync(Fragment, { key: '7d368d23f2c9d2b28c847a7fee5de474edc350f0' }, hAsync("div", { key: '6d97bfa728eb65c46d21f53c3b046b1a0c7d2ff6', class: {
9980
+ 'sd-date-range-picker-calendar': true,
9981
+ 'sd-date-range-picker-calendar--with-time': this.useTimePicker,
9982
+ }, style: cssVars }, this.renderYearNav(), hAsync("div", { key: '45b4a2488f6e73814d3a6be9710d7c14fd2e8130', class: "sd-date-range-picker-calendar__panels" }, this.renderPanel(this.currentYear, this.currentMonth, true), hAsync("span", { key: 'f1d741f8684ca213d30f559e7f6fc5a4388bbac1', class: "sd-date-range-picker-calendar__divider", "aria-hidden": "true" }), this.renderPanel(this.rightYear, this.rightMonth, false)), this.useTimePicker && this.renderTimeFooter())));
9779
9983
  }
9780
9984
  static get watchers() { return {
9781
9985
  "value": [{
@@ -9790,11 +9994,16 @@ class SdDateRangePickerCalendar {
9790
9994
  "value": [16],
9791
9995
  "selectable": [16],
9792
9996
  "maxRange": [2, "max-range"],
9997
+ "useTimePicker": [4, "use-time-picker"],
9793
9998
  "currentYear": [32],
9794
9999
  "currentMonth": [32],
9795
10000
  "pendingStart": [32],
9796
10001
  "hoverDate": [32],
9797
- "displayValue": [32]
10002
+ "displayValue": [32],
10003
+ "startHour": [32],
10004
+ "startMinute": [32],
10005
+ "endHour": [32],
10006
+ "endMinute": [32]
9798
10007
  },
9799
10008
  "$listeners$": undefined,
9800
10009
  "$lazyBundleId$": "-",
@@ -9818,7 +10027,7 @@ class SdDivider {
9818
10027
  const hostStyle = {
9819
10028
  '--sd-divider-color': DIVIDER_COLORS.default,
9820
10029
  };
9821
- return (hAsync(Host, { key: 'b19941ad314f31fccf77ea0dd3373f9e3362ecd2', style: hostStyle }, hAsync("hr", { key: 'bbc765fc901298fbacb8323fecd8fd1ca4683d19', "aria-orientation": this.vertical ? 'vertical' : 'horizontal' })));
10030
+ return (hAsync(Host, { key: '5e25f94dbe34f19280f6952e0a1bfbf4e4816264', style: hostStyle }, hAsync("hr", { key: 'a47f51ba0dfc15819cd5cda169554433b978eb15', "aria-orientation": this.vertical ? 'vertical' : 'horizontal' })));
9822
10031
  }
9823
10032
  static get style() { return sdDividerCss(); }
9824
10033
  static get cmpMeta() { return {
@@ -10263,28 +10472,28 @@ const FIELD_ADDON_ALIGN_MAP = {
10263
10472
  center: 'center',
10264
10473
  end: 'flex-end',
10265
10474
  };
10266
- const sm$2 = fieldTokens.field.label.sm;
10267
- const md$2 = fieldTokens.field.label.md;
10475
+ const sm$3 = fieldTokens.field.label.sm;
10476
+ const md$3 = fieldTokens.field.label.md;
10268
10477
  const FIELD_LABEL_SIZE_MAP = {
10269
10478
  sm: {
10270
- height: sm$2.height,
10271
- gap: sm$2.gap,
10272
- icon: sm$2.icon,
10273
- fontSize: sm$2.typography.fontSize,
10274
- lineHeight: sm$2.typography.lineHeight,
10275
- fontWeight: sm$2.typography.fontWeight,
10479
+ height: sm$3.height,
10480
+ gap: sm$3.gap,
10481
+ icon: sm$3.icon,
10482
+ fontSize: sm$3.typography.fontSize,
10483
+ lineHeight: sm$3.typography.lineHeight,
10484
+ fontWeight: sm$3.typography.fontWeight,
10276
10485
  },
10277
10486
  md: {
10278
- height: md$2.height,
10279
- gap: md$2.gap,
10280
- icon: md$2.icon,
10281
- fontSize: md$2.typography.fontSize,
10282
- lineHeight: md$2.typography.lineHeight,
10283
- fontWeight: md$2.typography.fontWeight,
10487
+ height: md$3.height,
10488
+ gap: md$3.gap,
10489
+ icon: md$3.icon,
10490
+ fontSize: md$3.typography.fontSize,
10491
+ lineHeight: md$3.typography.lineHeight,
10492
+ fontWeight: md$3.typography.fontWeight,
10284
10493
  },
10285
10494
  };
10286
10495
 
10287
- const sdFieldCss = () => `sd-field{display:inline-flex;flex-flow:column nowrap;height:fit-content;width:100%}sd-field .sd-field *:focus,sd-field .sd-field *:focus-visible,sd-field .sd-field *:focus-within{outline:none !important}sd-field .sd-field.sd-field--disabled{cursor:not-allowed}sd-field .sd-field.sd-field--disabled .sd-field__wrapper{cursor:not-allowed !important}sd-field .sd-field.sd-field--disabled .sd-field__wrapper .sd-field__label-inside{border-color:#CCCCCC;color:#888888;cursor:not-allowed !important}sd-field .sd-field.sd-field--disabled .sd-field__wrapper .sd-field__control{background-color:#E1E1E1;border-color:#CCCCCC;color:#888888;cursor:not-allowed !important}sd-field .sd-field.sd-field--readonly .sd-field__wrapper .sd-field__control{background-color:var(--sd-system-color-field-bg-read-only);color:var(--sd-system-color-field-text-read-only)}sd-field .sd-field--has-label .sd-field__wrapper .sd-field__label{display:flex;align-items:center;flex-shrink:0;width:var(--sd-field-label-width, auto);height:var(--sd-field-label-height);margin-right:var(--sd-field-label-margin-right)}sd-field .sd-field--has-label .sd-field__wrapper .sd-field__label__icon{margin-right:var(--sd-field-label-gap);flex-shrink:0}sd-field .sd-field--has-label .sd-field__wrapper .sd-field__label__text{font-size:var(--sd-field-label-font-size);line-height:var(--sd-field-label-line-height);font-weight:var(--sd-field-label-font-weight);color:var(--sd-system-color-field-text-default);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}sd-field .sd-field--has-label .sd-field__wrapper .sd-field__label__tooltip{margin-left:var(--sd-field-label-gap);flex-shrink:0}sd-field .sd-field--has-addon .sd-field__control .sd-field__addon{display:flex;gap:var(--sd-field-addon-gap);align-items:center;justify-content:var(--sd-field-addon-justify, flex-start);white-space:nowrap;box-sizing:border-box;flex-shrink:0;width:var(--sd-field-addon-width, auto);padding:0 var(--sd-field-addon-padding-x);font-size:var(--sd-field-addon-font-size);line-height:var(--sd-field-addon-line-height);font-weight:var(--sd-field-addon-font-weight);background:var(--sd-field-addon-bg);border-right:var(--sd-field-addon-border-width) solid var(--sd-field-addon-border-color);border-radius:calc(var(--sd-field-control-radius) - 1px) 0 0 calc(var(--sd-field-control-radius) - 1px)}sd-field .sd-field__wrapper{width:100%;display:flex;align-items:flex-start;flex-flow:row nowrap;position:relative;color:var(--sd-system-color-field-text-default);-webkit-user-select:none;user-select:none}sd-field .sd-field__wrapper .sd-field__main{flex:1;min-width:0;display:flex;flex-direction:column}sd-field .sd-field__wrapper .sd-field__control{position:relative;height:var(--sd-field-wrapper-height);display:flex;min-width:0;border:1px solid var(--sd-system-color-field-border-default);border-radius:var(--sd-field-control-radius);background:var(--sd-system-color-field-bg-default)}sd-field .sd-field--error .sd-field__wrapper .sd-field__control:not(:hover){border:1px solid var(--sd-system-color-field-border-danger) !important}sd-field .sd-field.sd-field--pass .sd-field__wrapper .sd-field__control{border:1px solid var(--sd-system-color-field-border-success) !important}sd-field .sd-field:not(.sd-field--disabled):not(.sd-field--readonly) .sd-field__wrapper .sd-field__control:hover{border:1px solid var(--sd-system-color-field-border-focus) !important;box-shadow:0px 0px 4px 0px rgba(0, 113, 255, 0.4)}sd-field .sd-field.sd-field--focus:not(.sd-field--readonly) .sd-field__wrapper .sd-field__control{border:1px solid var(--sd-system-color-field-border-focus) !important;box-shadow:0px 0px 4px 0px rgba(0, 113, 255, 0.4)}sd-field .sd-field.sd-field--borderless .sd-field__wrapper .sd-field__control,sd-field .sd-field.sd-field--borderless.sd-field--error .sd-field__wrapper .sd-field__control:not(:hover),sd-field .sd-field.sd-field--borderless.sd-field--pass .sd-field__wrapper .sd-field__control,sd-field .sd-field.sd-field--borderless:not(.sd-field--disabled):not(.sd-field--readonly) .sd-field__wrapper .sd-field__control:hover,sd-field .sd-field.sd-field--borderless.sd-field--focus:not(.sd-field--readonly) .sd-field__wrapper .sd-field__control{border-color:transparent !important;background:transparent !important;box-shadow:none !important}sd-field .sd-field .sd-field__error-message{color:var(--sd-field-error-message-color);font-size:var(--sd-field-error-message-font-size);line-height:var(--sd-field-error-message-line-height);margin-top:var(--sd-field-message-gap)}sd-field .sd-field .sd-field__hint{color:var(--sd-field-hint-color);font-size:var(--sd-field-hint-font-size);line-height:var(--sd-field-hint-line-height);margin-top:var(--sd-field-message-gap)}`;
10496
+ const sdFieldCss = () => `sd-field{display:inline-flex;flex-flow:column nowrap;height:fit-content;width:100%}sd-field .sd-field *:focus,sd-field .sd-field *:focus-visible,sd-field .sd-field *:focus-within{outline:none !important}sd-field .sd-field.sd-field--disabled{cursor:not-allowed}sd-field .sd-field.sd-field--disabled .sd-field__wrapper{cursor:not-allowed !important}sd-field .sd-field.sd-field--disabled .sd-field__wrapper .sd-field__label-inside{border-color:#CCCCCC;color:#888888;cursor:not-allowed !important}sd-field .sd-field.sd-field--disabled .sd-field__wrapper .sd-field__control{background-color:#E1E1E1;border-color:#CCCCCC;color:#888888;cursor:not-allowed !important}sd-field .sd-field.sd-field--readonly .sd-field__wrapper .sd-field__control{background-color:var(--sd-system-color-field-bg-read-only);color:var(--sd-system-color-field-text-read-only)}sd-field .sd-field--has-label .sd-field__wrapper .sd-field__label{display:flex;align-items:center;flex-shrink:0;width:var(--sd-field-label-width, auto);height:var(--sd-field-label-height);margin-right:var(--sd-field-label-margin-right)}sd-field .sd-field--has-label .sd-field__wrapper .sd-field__label__icon{margin-right:var(--sd-field-label-gap);flex-shrink:0}sd-field .sd-field--has-label .sd-field__wrapper .sd-field__label__text{font-size:var(--sd-field-label-font-size);line-height:var(--sd-field-label-line-height);font-weight:var(--sd-field-label-font-weight);color:var(--sd-system-color-field-text-default);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}sd-field .sd-field--has-label .sd-field__wrapper .sd-field__label__tooltip{margin-left:var(--sd-field-label-gap);flex-shrink:0}sd-field .sd-field--has-addon .sd-field__control .sd-field__addon{display:flex;gap:var(--sd-field-addon-gap);align-items:center;justify-content:var(--sd-field-addon-justify, flex-start);white-space:nowrap;box-sizing:border-box;flex-shrink:0;width:var(--sd-field-addon-width, auto);padding:0 var(--sd-field-addon-padding-x);font-size:var(--sd-field-addon-font-size);line-height:var(--sd-field-addon-line-height);font-weight:var(--sd-field-addon-font-weight);background:var(--sd-field-addon-bg);border-right:var(--sd-field-addon-border-width) solid var(--sd-field-addon-border-color);border-radius:calc(var(--sd-field-control-radius) - 1px) 0 0 calc(var(--sd-field-control-radius) - 1px)}sd-field .sd-field--multiline .sd-field__wrapper .sd-field__control{height:auto;min-height:var(--sd-field-wrapper-height)}sd-field .sd-field__wrapper{width:100%;display:flex;align-items:flex-start;flex-flow:row nowrap;position:relative;color:var(--sd-system-color-field-text-default);-webkit-user-select:none;user-select:none}sd-field .sd-field__wrapper .sd-field__main{flex:1;min-width:0;display:flex;flex-direction:column}sd-field .sd-field__wrapper .sd-field__control{position:relative;height:var(--sd-field-wrapper-height);display:flex;min-width:0;border:1px solid var(--sd-system-color-field-border-default);border-radius:var(--sd-field-control-radius);background:var(--sd-system-color-field-bg-default)}sd-field .sd-field--error .sd-field__wrapper .sd-field__control:not(:hover){border:1px solid var(--sd-system-color-field-border-danger) !important}sd-field .sd-field.sd-field--pass .sd-field__wrapper .sd-field__control{border:1px solid var(--sd-system-color-field-border-success) !important}sd-field .sd-field:not(.sd-field--disabled):not(.sd-field--readonly) .sd-field__wrapper .sd-field__control:hover{border:1px solid var(--sd-system-color-field-border-focus) !important;box-shadow:0px 0px 4px 0px rgba(0, 113, 255, 0.4)}sd-field .sd-field.sd-field--focus:not(.sd-field--readonly) .sd-field__wrapper .sd-field__control{border:1px solid var(--sd-system-color-field-border-focus) !important;box-shadow:0px 0px 4px 0px rgba(0, 113, 255, 0.4)}sd-field .sd-field.sd-field--borderless .sd-field__wrapper .sd-field__control,sd-field .sd-field.sd-field--borderless.sd-field--error .sd-field__wrapper .sd-field__control:not(:hover),sd-field .sd-field.sd-field--borderless.sd-field--pass .sd-field__wrapper .sd-field__control,sd-field .sd-field.sd-field--borderless:not(.sd-field--disabled):not(.sd-field--readonly) .sd-field__wrapper .sd-field__control:hover,sd-field .sd-field.sd-field--borderless.sd-field--focus:not(.sd-field--readonly) .sd-field__wrapper .sd-field__control{border-color:transparent !important;background:transparent !important;box-shadow:none !important}sd-field .sd-field .sd-field__error-message{color:var(--sd-field-error-message-color);font-size:var(--sd-field-error-message-font-size);line-height:var(--sd-field-error-message-line-height);margin-top:var(--sd-field-message-gap)}sd-field .sd-field .sd-field__hint{color:var(--sd-field-hint-color);font-size:var(--sd-field-hint-font-size);line-height:var(--sd-field-hint-line-height);margin-top:var(--sd-field-message-gap)}`;
10288
10497
 
10289
10498
  const FORM_PARENT_TAGS = [
10290
10499
  'sd-input',
@@ -10295,6 +10504,8 @@ const FORM_PARENT_TAGS = [
10295
10504
  'sd-file-picker',
10296
10505
  'sd-date-picker',
10297
10506
  'sd-date-range-picker',
10507
+ 'sd-time-picker',
10508
+ 'sd-time-range-picker',
10298
10509
  'sd-chip-input',
10299
10510
  ];
10300
10511
  class SdField {
@@ -10336,6 +10547,13 @@ class SdField {
10336
10547
  label = '';
10337
10548
  /** 레이블 너비 */
10338
10549
  labelWidth = '';
10550
+ /**
10551
+ * 레이블 박스 높이 (숫자면 px). 미지정 시 size별 기본값 사용.
10552
+ * multiline 등 컨트롤 박스가 커질 때 레이블을 첫 행에 맞추기 위해 사용한다.
10553
+ */
10554
+ labelHeight;
10555
+ /** 멀티라인 컨트롤 — 컨트롤 높이를 고정하지 않고 min-height만 적용한다. */
10556
+ multiline = false;
10339
10557
  /** 필드 우측 어드온 레이블 */
10340
10558
  addonLabel = '';
10341
10559
  /** 어드온 정렬 방향 */
@@ -10466,7 +10684,11 @@ class SdField {
10466
10684
  };
10467
10685
  const labelCssVars = this.label !== ''
10468
10686
  ? {
10469
- '--sd-field-label-height': `${labelTokens.height}px`,
10687
+ '--sd-field-label-height': this.labelHeight !== undefined && this.labelHeight !== '' && this.labelHeight !== 0
10688
+ ? typeof this.labelHeight === 'number'
10689
+ ? `${this.labelHeight}px`
10690
+ : this.labelHeight
10691
+ : `${labelTokens.height}px`,
10470
10692
  '--sd-field-label-gap': `${labelTokens.gap}px`,
10471
10693
  '--sd-field-label-font-size': `${labelTokens.fontSize}px`,
10472
10694
  '--sd-field-label-line-height': `${labelTokens.lineHeight}px`,
@@ -10498,19 +10720,20 @@ class SdField {
10498
10720
  : {}),
10499
10721
  }
10500
10722
  : {};
10501
- return (hAsync("div", { key: '7474477aa89e459e5f31cc085e855db6d1851822', class: {
10723
+ return (hAsync("div", { key: 'd29e49fe9ecf467f0c1ed443524fac2648dc9da4', class: {
10502
10724
  'sd-field': true,
10503
10725
  'sd-field--has-label': this.label !== '',
10504
10726
  'sd-field--has-addon': addon !== '',
10727
+ 'sd-field--multiline': this.multiline,
10505
10728
  'sd-field--borderless': this.borderless,
10506
10729
  [this.fieldStatus]: this.fieldStatus !== '',
10507
- }, style: { ...sizeCssVars, ...labelCssVars, ...addonCssVars, ...messageCssVars } }, hAsync("div", { key: '9bea489357731d9630753e552a73e98ff85a47d8', class: "sd-field__wrapper" }, this.renderLabel(this.label), hAsync("div", { key: '582b762cea494f2987381eebfcdd9cab9c6dd3e0', class: "sd-field__main" }, hAsync("div", { key: '24f1b2ffa75077573178de296be26c48d5f36958', class: {
10730
+ }, style: { ...sizeCssVars, ...labelCssVars, ...addonCssVars, ...messageCssVars } }, hAsync("div", { key: '396173067f4a8ce38ea8ea9f5a6b9d76303b16fa', class: "sd-field__wrapper" }, this.renderLabel(this.label), hAsync("div", { key: '3e4aab5e10cf52f116aabfe1a8d36a806eb03af4', class: "sd-field__main" }, hAsync("div", { key: 'edbe4443387935e2b51469339284024429f1f0d3', class: {
10508
10731
  'sd-field__control': true,
10509
10732
  'sd-field__control--has-addon': addon !== '',
10510
10733
  }, style: this.width !== '' && this.width !== 0
10511
10734
  ? { width: typeof this.width === 'number' ? `${this.width}px` : this.width }
10512
- : {} }, addon && (hAsync("div", { key: 'ace4b56d75bbaff3335694b6549b383a023d9125', class: "sd-field__addon" }, this.icon && (hAsync("sd-icon", { key: 'aba7a6c3834f73be2c1be1e82f4673aad317c383', name: this.icon.name, size: this.icon.size ??
10513
- Number(FIELD_LABEL_SIZE_MAP[(this.size in FIELD_LABEL_SIZE_MAP ? this.size : 'sm')].icon), color: this.icon.color, rotate: this.icon.rotate })), addon)), hAsync("slot", { key: '4a3776fc53bc003cc5b54696a8353668ce306a0c' })), this.errorMsg !== '' || this.errorMessage !== '' ? (hAsync("div", { class: "sd-field__error-message" }, this.errorMsg !== '' ? this.errorMsg : this.errorMessage)) : (this.hint !== '' && hAsync("div", { class: "sd-field__hint" }, this.hint))))));
10735
+ : {} }, addon && (hAsync("div", { key: '7ac28abf5f37b7ada42b16f81227afb5c7f8d656', class: "sd-field__addon" }, this.icon && (hAsync("sd-icon", { key: 'd995424c6f620b090006cdbcf8645d2ff822e802', name: this.icon.name, size: this.icon.size ??
10736
+ Number(FIELD_LABEL_SIZE_MAP[(this.size in FIELD_LABEL_SIZE_MAP ? this.size : 'sm')].icon), color: this.icon.color, rotate: this.icon.rotate })), addon)), hAsync("slot", { key: 'd105a65b5c926b5db9dd1d68239c0a2015739aba' })), this.errorMsg !== '' || this.errorMessage !== '' ? (hAsync("div", { class: "sd-field__error-message" }, this.errorMsg !== '' ? this.errorMsg : this.errorMessage)) : (this.hint !== '' && hAsync("div", { class: "sd-field__hint" }, this.hint))))));
10514
10737
  }
10515
10738
  renderLabel(label) {
10516
10739
  if (label == null || label === '')
@@ -10538,6 +10761,8 @@ class SdField {
10538
10761
  "borderless": [4],
10539
10762
  "label": [1],
10540
10763
  "labelWidth": [8, "label-width"],
10764
+ "labelHeight": [8, "label-height"],
10765
+ "multiline": [4],
10541
10766
  "addonLabel": [1, "addon-label"],
10542
10767
  "addonAlign": [1, "addon-align"],
10543
10768
  "icon": [16],
@@ -10561,12 +10786,39 @@ const filepicker = {
10561
10786
  paddingX: "12",
10562
10787
  gap: "8",
10563
10788
  radius: "4",
10789
+ borderWidth: "1",
10564
10790
  typography: {
10791
+ 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",
10565
10792
  fontWeight: "400",
10566
10793
  fontSize: "12",
10567
- lineHeight: "20"},
10794
+ lineHeight: "20",
10795
+ textDecoration: "none"
10796
+ },
10568
10797
  icon: "16"
10569
10798
  },
10799
+ md: {
10800
+ height: "36",
10801
+ paddingX: "16",
10802
+ gap: "12",
10803
+ radius: "6",
10804
+ borderWidth: "1",
10805
+ typography: {
10806
+ 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",
10807
+ fontWeight: "400",
10808
+ fontSize: "14",
10809
+ textDecoration: "none",
10810
+ lineHeight: "24"
10811
+ },
10812
+ icon: "20"
10813
+ },
10814
+ border: {
10815
+ "default": "#AAAAAA",
10816
+ disabled: "#CCCCCC"
10817
+ },
10818
+ bg: {
10819
+ "default": "#FFFFFF",
10820
+ disabled: "#E1E1E1"
10821
+ },
10570
10822
  text: {
10571
10823
  "default": "#222222",
10572
10824
  placeholder: "#AAAAAA",
@@ -10581,15 +10833,25 @@ var filePickerTokens = {
10581
10833
  };
10582
10834
 
10583
10835
  const fp = filePickerTokens.filepicker;
10584
- const FILE_PICKER_LAYOUT = {
10585
- height: fp.sm.height,
10586
- paddingX: fp.sm.paddingX,
10587
- gap: fp.sm.gap,
10588
- radius: fp.sm.radius,
10589
- fontSize: fp.sm.typography.fontSize,
10590
- lineHeight: fp.sm.typography.lineHeight,
10591
- fontWeight: fp.sm.typography.fontWeight,
10592
- iconSize: fp.sm.icon};
10836
+ const buildLayout = (s) => ({
10837
+ height: fp[s].height,
10838
+ paddingX: fp[s].paddingX,
10839
+ gap: fp[s].gap,
10840
+ radius: fp[s].radius,
10841
+ borderWidth: fp[s].borderWidth,
10842
+ fontSize: fp[s].typography.fontSize,
10843
+ lineHeight: fp[s].typography.lineHeight,
10844
+ fontWeight: fp[s].typography.fontWeight,
10845
+ iconSize: fp[s].icon,
10846
+ contentsGap: fieldTokens.field.contents.gap,
10847
+ });
10848
+ /** 기본(sm) 레이아웃 — 하위호환용 단일 export */
10849
+ const FILE_PICKER_LAYOUT = buildLayout('sm');
10850
+ /** size별 레이아웃 맵 */
10851
+ const FILE_PICKER_LAYOUTS = {
10852
+ sm: FILE_PICKER_LAYOUT,
10853
+ md: buildLayout('md'),
10854
+ };
10593
10855
  const FILE_PICKER_COLORS = {
10594
10856
  text: fp.text,
10595
10857
  icon: {
@@ -10636,6 +10898,8 @@ class SdFilePicker {
10636
10898
  /** 최대 파일 개수 */
10637
10899
  maxFiles;
10638
10900
  // sd-field 패스스루 props
10901
+ /** 필드 크기 */
10902
+ size = 'sm';
10639
10903
  /** 폼 연동용 name 속성 */
10640
10904
  name = nanoid();
10641
10905
  /** 레이블 텍스트 */
@@ -10838,7 +11102,7 @@ class SdFilePicker {
10838
11102
  renderChipList() {
10839
11103
  if (!this.hasChips())
10840
11104
  return null;
10841
- return (hAsync("div", { class: "sd-file-picker__chip-list" }, this.internalValue.map((file, index) => (hAsync("sd-chip", { value: file.name, onSdRemove: () => this.handleChipRemove(index) })))));
11105
+ return (hAsync("div", { class: "sd-file-picker__chip-list" }, this.internalValue.map((file, index) => (hAsync("sd-chip", { value: file.name, editable: false, onSdRemove: () => this.handleChipRemove(index) })))));
10842
11106
  }
10843
11107
  renderListbox() {
10844
11108
  if (!this.hasChips() || !this.isListboxOpen)
@@ -10864,38 +11128,39 @@ class SdFilePicker {
10864
11128
  render() {
10865
11129
  const hasFiles = this.hasFiles();
10866
11130
  const displayText = this.getDisplayText();
11131
+ const layout = FILE_PICKER_LAYOUTS[this.size] ?? FILE_PICKER_LAYOUT;
10867
11132
  const cssVars = {
10868
- '--sd-file-picker-font-size': `${FILE_PICKER_LAYOUT.fontSize}px`,
10869
- '--sd-file-picker-line-height': `${FILE_PICKER_LAYOUT.lineHeight}px`,
10870
- '--sd-file-picker-font-weight': FILE_PICKER_LAYOUT.fontWeight,
10871
- '--sd-file-picker-padding-x': `${FILE_PICKER_LAYOUT.paddingX}px`,
10872
- '--sd-file-picker-gap': `${FILE_PICKER_LAYOUT.gap}px`,
11133
+ '--sd-file-picker-font-size': `${layout.fontSize}px`,
11134
+ '--sd-file-picker-line-height': `${layout.lineHeight}px`,
11135
+ '--sd-file-picker-font-weight': layout.fontWeight,
11136
+ '--sd-file-picker-padding-x': `${layout.paddingX}px`,
11137
+ '--sd-file-picker-gap': `${layout.gap}px`,
10873
11138
  '--sd-file-picker-text-color': FILE_PICKER_COLORS.text.default,
10874
11139
  '--sd-file-picker-placeholder-color': FILE_PICKER_COLORS.text.placeholder,
10875
11140
  '--sd-file-picker-disabled-color': FILE_PICKER_COLORS.text.disabled,
10876
- // sd-field 시스템 변수 override
10877
- '--sd-system-size-field-sm-height': `${FILE_PICKER_LAYOUT.height}px`,
10878
- '--sd-system-radius-field-sm': `${FILE_PICKER_LAYOUT.radius}px`,
11141
+ // sd-field 시스템 변수 override (size에 맞춰)
11142
+ [`--sd-system-size-field-${this.size}-height`]: `${layout.height}px`,
11143
+ [`--sd-system-radius-field-${this.size}`]: `${layout.radius}px`,
10879
11144
  };
10880
11145
  const showListbox = this.multiple && this.useMultipleListBox;
10881
- const content = (hAsync("div", { key: '932b5549b6b27e0fec8096127dd8fb09f682fe56', role: "button", tabindex: this.disabled ? -1 : 0, class: "sd-file-picker__content", ref: el => (this.contentRef = el), onClick: this.handleClick, onKeyDown: e => {
11146
+ const content = (hAsync("div", { key: 'd1c3af9860038ddb11d540af8312ad59d051524f', role: "button", tabindex: this.disabled ? -1 : 0, class: "sd-file-picker__content", ref: el => (this.contentRef = el), onClick: this.handleClick, onKeyDown: e => {
10882
11147
  if (e.key === 'Enter' || e.key === ' ') {
10883
11148
  e.preventDefault();
10884
11149
  this.handleClick();
10885
11150
  }
10886
- } }, hAsync("input", { key: 'd10a6a2bc0606954588cee4ad77898ad28cbbe75', ref: el => (this.fileInputRef = el), type: "file", class: "sd-file-picker__input", disabled: this.disabled, multiple: this.multiple, accept: this.accept, onInput: this.handleFileChange, "aria-label": this.placeholder ?? 'Click to upload' }), hAsync("sd-icon", { key: '70102b5a6ff6606423ba36601015bccc2d48f22c', name: "attachFile", size: Number(FILE_PICKER_LAYOUT.iconSize), color: this.getIconColor(), class: "sd-file-picker__icon" }), hAsync("div", { key: '7a0696f4f4b3ccd56c707bf2ecee59562ceb1a7b', ref: el => (this.fileNamesRef = el), class: {
11151
+ } }, hAsync("input", { key: '760c38cd73d0a2a3d0832c5597c0e22bf737bb06', ref: el => (this.fileInputRef = el), type: "file", class: "sd-file-picker__input", disabled: this.disabled, multiple: this.multiple, accept: this.accept, onInput: this.handleFileChange, "aria-label": this.placeholder ?? 'Click to upload' }), hAsync("sd-icon", { key: '96ff0bf43eb3f17df92bd8834cd38a1ae36ad475', name: "attachFile", size: Number(layout.iconSize), color: this.getIconColor(), class: "sd-file-picker__icon" }), hAsync("div", { key: '0757b8b734e21fcf7bed04d7306ee3a9d202f950', ref: el => (this.fileNamesRef = el), class: {
10887
11152
  'sd-file-picker__text': true,
10888
11153
  'sd-file-picker__text--placeholder': !hasFiles,
10889
11154
  'sd-file-picker__text--active': hasFiles,
10890
- } }, displayText), showListbox && hasFiles && !this.disabled && (hAsync("sd-ghost-button", { key: 'a68ba1cd8dabf75279eba8993befef8dd03008ae', icon: "caretDown", size: "xxs", ariaLabel: "toggle file list", disabled: this.disabled, class: {
11155
+ } }, displayText), showListbox && hasFiles && !this.disabled && (hAsync("sd-ghost-button", { key: '8e42d38452d00256147ee65e614bdeb7040917d7', icon: "caretDown", size: "xxs", ariaLabel: "toggle file list", disabled: this.disabled, class: {
10891
11156
  'sd-file-picker__caret': true,
10892
11157
  'sd-file-picker__caret--open': this.isListboxOpen,
10893
- }, onClick: this.handleListboxToggle })), !this.disabled && hasFiles && (hAsync("sd-ghost-button", { key: '6abcae4722ebbe7f888ce500774f3a749061ad4e', 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", { key: 'f1e3821eee58a1b126a6375a8d830a9fc9055cbe', class: "sd-file-picker__tooltip" }, displayText))));
10894
- return (hAsync("div", { key: '952fbde18439ce103d62ede9e7b7a59dda408aa1', class: {
11158
+ }, onClick: this.handleListboxToggle })), !this.disabled && hasFiles && (hAsync("sd-ghost-button", { key: '6f65042ce5e4efa1b6ab126653d434ca77cdd790', 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", { key: 'b41146f39c384a5954dca22f2d3da767a63ef0c0', class: "sd-file-picker__tooltip" }, displayText))));
11159
+ return (hAsync("div", { key: '858fea100a9317ac6806ae40699e9f5608394e10', class: {
10895
11160
  'sd-file-picker__wrapper': true,
10896
11161
  'sd-file-picker--inline': this.inline,
10897
11162
  'sd-file-picker--inline-disabled': this.inline && this.disabled,
10898
- }, style: cssVars }, hAsync("sd-field", { key: '08ed598117f29d7c6977f75a73300c033bb6ec9d', borderless: this.inline, name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, 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) }, content), this.useMultipleListBox ? this.renderListbox() : this.renderChipList()));
11163
+ }, style: cssVars }, hAsync("sd-field", { key: '1b7a6a57e4e46c253bd9f77c500dabf92edc2ae0', borderless: this.inline, size: this.size, name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, 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) }, content), this.useMultipleListBox ? this.renderListbox() : this.renderChipList()));
10899
11164
  }
10900
11165
  static get watchers() { return {
10901
11166
  "value": [{
@@ -10917,6 +11182,7 @@ class SdFilePicker {
10917
11182
  "maxFileSize": [8, "max-file-size"],
10918
11183
  "maxTotalSize": [8, "max-total-size"],
10919
11184
  "maxFiles": [8, "max-files"],
11185
+ "size": [513],
10920
11186
  "name": [1],
10921
11187
  "label": [1],
10922
11188
  "labelWidth": [8, "label-width"],
@@ -10943,7 +11209,7 @@ class SdFilePicker {
10943
11209
  },
10944
11210
  "$listeners$": undefined,
10945
11211
  "$lazyBundleId$": "-",
10946
- "$attrsToReflect$": [["placeholder", "placeholder"], ["disabled", "disabled"], ["inline", "inline"], ["multiple", "multiple"], ["useMultipleListBox", "use-multiple-list-box"]]
11212
+ "$attrsToReflect$": [["placeholder", "placeholder"], ["disabled", "disabled"], ["inline", "inline"], ["multiple", "multiple"], ["useMultipleListBox", "use-multiple-list-box"], ["size", "size"]]
10947
11213
  }; }
10948
11214
  }
10949
11215
 
@@ -11127,7 +11393,7 @@ class SdFloatingPopover {
11127
11393
  }
11128
11394
  }
11129
11395
  render() {
11130
- return hAsync("slot", { key: '3a3234d89652728a077681775de4f8c14141ab2d' });
11396
+ return hAsync("slot", { key: 'f45790ba4fc45aef991a54b409acc2791342fcdf' });
11131
11397
  }
11132
11398
  static get style() { return sdFloatingPortalCss(); }
11133
11399
  static get cmpMeta() { return {
@@ -11376,6 +11642,11 @@ class SdGhostButton {
11376
11642
  intent = 'default';
11377
11643
  /** 스크린리더용 접근성 레이블 */
11378
11644
  ariaLabel = '';
11645
+ /**
11646
+ * 토글 버튼일 때 눌림 상태 → `aria-pressed`로 반영. 미지정 시 속성 자체를 내보내지 않는다.
11647
+ * (DOM `Element.ariaPressed`(문자열 예약 속성)와 충돌하므로 prop 이름은 `pressed`)
11648
+ */
11649
+ pressed;
11379
11650
  /** 호버 시 표시할 툴팁 텍스트 */
11380
11651
  tooltipText;
11381
11652
  /** 비활성 상태 여부 */
@@ -11433,16 +11704,16 @@ class SdGhostButton {
11433
11704
  const accessibleName = (this.ariaLabel ?? '').trim() || undefined;
11434
11705
  const tooltipText = (this.tooltipText ?? '').trim();
11435
11706
  const hasTooltip = tooltipText.length > 0;
11436
- return (hAsync("button", { key: '9d2d352d36c7c34c67d8c57de6236d72727bd078', class: {
11707
+ return (hAsync("button", { key: '921a2e6e54aa3cbb0e6c14ad117d6ddcfc753618', class: {
11437
11708
  'sd-ghost-button': true,
11438
11709
  'sd-ghost-button--disabled': this.disabled,
11439
- }, type: "button", "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: this.disabled ? -1 : undefined, "aria-label": accessibleName, style: {
11710
+ }, type: "button", "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: this.disabled ? -1 : undefined, "aria-label": accessibleName, "aria-pressed": this.pressed, style: {
11440
11711
  '--sd-ghost-button-size': `${sizeConfig.size}px`,
11441
11712
  '--sd-ghost-button-radius': `${GHOST_BUTTON_RADIUS[size]}px`,
11442
11713
  '--sd-ghost-button-hover-bg': GHOST_BUTTON_HOVER_BG_COLORS[intent],
11443
11714
  '--sd-ghost-button-hover-opacity': GHOST_BUTTON_HOVER_OPACITY,
11444
11715
  '--sd-ghost-button-accent': GHOST_BUTTON_FOCUS_RING_COLOR,
11445
- }, onClick: this.handleClick, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onFocus: this.handleFocus, onBlur: this.handleBlur }, hasTooltip && this.isTooltipOpen && (hAsync("sd-portal", { key: '1a73fb53be28a622d03e4f20be0b30e0e76bccd4', parentRef: this.hostEl, open: true, offset: [sizeConfig.size / 2, 4], placement: "top" }, hAsync("div", { key: 'e4a349dbfbf2fd16eed9a46f5e2ed43935212cfe', class: "sd-ghost-button__tooltip-inner", "aria-hidden": "true" }, hAsync("sd-tag", { key: '4aa1525a6da6ee72daf1815f1440d665bd1cf2c8', name: "square_xs_grey", label: tooltipText })))), hAsync("sd-icon", { key: '4caac22d0d888c1998032697043e3a3761e012aa', name: this.icon, size: sizeConfig.icon, color: contentColor })));
11716
+ }, onClick: this.handleClick, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onFocus: this.handleFocus, onBlur: this.handleBlur }, hasTooltip && this.isTooltipOpen && (hAsync("sd-portal", { key: '90817207f1b8b5c1d55ce510dfb5ea90cf614bfd', parentRef: this.hostEl, open: true, offset: [sizeConfig.size / 2, 4], placement: "top" }, hAsync("div", { key: '75379a80a230eb197d56df9eb3a79f4536c425d5', class: "sd-ghost-button__tooltip-inner", "aria-hidden": "true" }, hAsync("sd-tag", { key: 'b7cc000adb2aaa3e9f65635d7e9cab7fceff62c3', name: "square_xs_grey", label: tooltipText })))), hAsync("sd-icon", { key: '0df3fd325eb7e82b3da6427e22c05819f35d307e', name: this.icon, size: sizeConfig.icon, color: contentColor })));
11446
11717
  }
11447
11718
  static get style() { return sdGhostButtonCss(); }
11448
11719
  static get cmpMeta() { return {
@@ -11453,6 +11724,7 @@ class SdGhostButton {
11453
11724
  "size": [1],
11454
11725
  "intent": [1],
11455
11726
  "ariaLabel": [1, "aria-label"],
11727
+ "pressed": [4, "aria-pressed"],
11456
11728
  "tooltipText": [1, "tooltip-text"],
11457
11729
  "disabled": [4],
11458
11730
  "isTooltipOpen": [32]
@@ -12007,26 +12279,26 @@ class SdIcon {
12007
12279
  }; }
12008
12280
  }
12009
12281
 
12010
- const sm$1 = inputTokens.textinput.sm;
12011
- const md$1 = inputTokens.textinput.md;
12282
+ const sm$2 = inputTokens.textinput.sm;
12283
+ const md$2 = inputTokens.textinput.md;
12012
12284
  const INPUT_SIZE_MAP = {
12013
12285
  sm: {
12014
- height: sm$1.height,
12015
- paddingX: sm$1.paddingX,
12016
- gap: sm$1.gap,
12017
- radius: sm$1.radius,
12018
- fontSize: sm$1.typography.fontSize,
12019
- lineHeight: sm$1.typography.lineHeight,
12020
- fontWeight: sm$1.typography.fontWeight,
12286
+ height: sm$2.height,
12287
+ paddingX: sm$2.paddingX,
12288
+ gap: sm$2.gap,
12289
+ radius: sm$2.radius,
12290
+ fontSize: sm$2.typography.fontSize,
12291
+ lineHeight: sm$2.typography.lineHeight,
12292
+ fontWeight: sm$2.typography.fontWeight,
12021
12293
  },
12022
12294
  md: {
12023
- height: md$1.height,
12024
- paddingX: md$1.paddingX,
12025
- gap: md$1.gap,
12026
- radius: md$1.radius,
12027
- fontSize: md$1.typography.fontSize,
12028
- lineHeight: md$1.typography.lineHeight,
12029
- fontWeight: md$1.typography.fontWeight,
12295
+ height: md$2.height,
12296
+ paddingX: md$2.paddingX,
12297
+ gap: md$2.gap,
12298
+ radius: md$2.radius,
12299
+ fontSize: md$2.typography.fontSize,
12300
+ lineHeight: md$2.typography.lineHeight,
12301
+ fontWeight: md$2.typography.fontWeight,
12030
12302
  },
12031
12303
  };
12032
12304
  const INPUT_COLORS = {
@@ -12193,12 +12465,12 @@ class SdInput {
12193
12465
  '--sd-system-size-field-sm-height': `${sizeTokens.height}px`,
12194
12466
  '--sd-system-radius-field-sm': `${sizeTokens.radius}px`,
12195
12467
  };
12196
- return (hAsync("sd-field", { key: '5707ad3cdfd0194d4200899f3838e6e7ff03cb34', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, readonly: this.readonly, 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: 'a5146f59435269a419c8273c72e7704a359108f0', class: "sd-input__content" }, hAsync("slot", { key: 'cfa0393abc20439a7746e874215864d02d41ce17', name: "prefix" }), hAsync("input", { key: 'bf7503a5701e237868c7be863f5d2653d074fb66', name: this.name, ref: el => (this.nativeEl = el), class: `sd-input__native ${this.inputClass}`, type: this.type === 'password' && this.passwordVisible ? 'text' : (this.type ?? 'text'), 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: 'bc16a709380137d6993753892e71cab33e0fc070', name: "suffix" }), this.clearable && this.internalValue && !this.disabled && !this.readonly && (hAsync("sd-ghost-button", { key: '4053ddc137f8d104a3e619f81ca2c99fd7e52a75', icon: "close", ariaLabel: "clear", size: "xxs", disabled: this.disabled, class: "sd-input__clear-icon", onClick: async () => {
12468
+ return (hAsync("sd-field", { key: '66c7d6a9292bf8129fea6a33d2288733c264a39f', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, readonly: this.readonly, 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: 'b429ae6e521440eb917b17b10525ff3d3767a50d', class: "sd-input__content" }, hAsync("slot", { key: 'dc1cd825ff1bea6484eada71d5aff621f82522c2', name: "prefix" }), hAsync("input", { key: '93bd923644ac7660c2c9be28e4c64d39d93365c3', name: this.name, ref: el => (this.nativeEl = el), class: `sd-input__native ${this.inputClass}`, type: this.type === 'password' && this.passwordVisible ? 'text' : (this.type ?? 'text'), 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: 'ec2f67a7ae01ebbaaa1f48f1e231f6fe2cfb413c', name: "suffix" }), this.clearable && this.internalValue && !this.disabled && !this.readonly && (hAsync("sd-ghost-button", { key: 'de33f6902ab5560e151ef13e01ef84eea14da17d', icon: "close", ariaLabel: "clear", size: "xxs", disabled: this.disabled, class: "sd-input__clear-icon", onClick: async () => {
12197
12469
  if (this.disabled || this.readonly)
12198
12470
  return;
12199
12471
  this.internalValue = '';
12200
12472
  await this.formField?.sdValidate();
12201
- } })), this.type === 'password' && (hAsync("sd-ghost-button", { key: '7062bbfecd4289185dc847bca0524405d6f4bbfe', icon: this.passwordVisible ? 'visibilityOn' : 'visibilityOff', ariaLabel: "visibility", size: "xxs", disabled: this.disabled || this.readonly, class: "sd-input__password-icon", onClick: () => {
12473
+ } })), this.type === 'password' && (hAsync("sd-ghost-button", { key: 'db07c28cede67dbec93454b5ea90e94f72c5f313', icon: this.passwordVisible ? 'visibilityOn' : 'visibilityOff', ariaLabel: "visibility", size: "xxs", disabled: this.disabled || this.readonly, class: "sd-input__password-icon", onClick: () => {
12202
12474
  if (this.disabled || this.readonly)
12203
12475
  return;
12204
12476
  this.passwordVisible = !this.passwordVisible;
@@ -12305,41 +12577,41 @@ var tableTokens = {
12305
12577
  table: table
12306
12578
  };
12307
12579
 
12308
- const t = tableTokens.table;
12580
+ const t$1 = tableTokens.table;
12309
12581
  const KEY_VALUE_TABLE_LAYOUT = {
12310
- rowHeight: Number(t.keyValue.height),
12582
+ rowHeight: Number(t$1.keyValue.height),
12311
12583
  thWidth: 120,
12312
- borderRadius: Number(t.radius),
12313
- thPaddingX: Number(t.header.paddingX),
12314
- padding: Number(t.keyValue.body.paddingY),
12315
- tdPaddingX: Number(t.keyValue.body.paddingX.default),
12316
- tdPaddingXWide: Number(t.keyValue.body.paddingX.wide),
12584
+ borderRadius: Number(t$1.radius),
12585
+ thPaddingX: Number(t$1.header.paddingX),
12586
+ padding: Number(t$1.keyValue.body.paddingY),
12587
+ tdPaddingX: Number(t$1.keyValue.body.paddingX.default),
12588
+ tdPaddingXWide: Number(t$1.keyValue.body.paddingX.wide),
12317
12589
  helpIconSize: 16,
12318
12590
  requiredIconSize: 12,
12319
- gap: Number(t.header.gap),
12320
- labelGap: Number(t.content.gap),
12321
- borderWidth: Number(t.border.width),
12322
- searchPaddingX: Number(t.keyValue.search.paddingX),
12591
+ gap: Number(t$1.header.gap),
12592
+ labelGap: Number(t$1.content.gap),
12593
+ borderWidth: Number(t$1.border.width),
12594
+ searchPaddingX: Number(t$1.keyValue.search.paddingX),
12323
12595
  };
12324
12596
  const KEY_VALUE_TABLE_COLORS = {
12325
- border: t.border.color,
12326
- thBg: t.header.bg,
12597
+ border: t$1.border.color,
12598
+ thBg: t$1.header.bg,
12327
12599
  thLabel: systemTokens.color.fg.primary,
12328
12600
  required: systemTokens.color.fg.accent,
12329
12601
  helpIcon: systemTokens.color.fg.success,
12330
12602
  tdBg: systemTokens.color.bg.frame,
12331
12603
  tdText: systemTokens.color.fg.primary,
12332
- searchBg: t.keyValue.search.bg,
12604
+ searchBg: t$1.keyValue.search.bg,
12333
12605
  };
12334
12606
  const KEY_VALUE_TABLE_TYPOGRAPHY = {
12335
- labelFontFamily: t.header.typography.fontFamily,
12336
- labelFontSize: Number(t.header.typography.fontSize),
12607
+ labelFontFamily: t$1.header.typography.fontFamily,
12608
+ labelFontSize: Number(t$1.header.typography.fontSize),
12337
12609
  labelFontWeight: 700,
12338
- labelLineHeight: Number(t.header.typography.lineHeight),
12339
- tdFontFamily: t.body.typography.fontFamily,
12340
- tdFontSize: Number(t.body.typography.fontSize),
12341
- tdFontWeight: Number(t.body.typography.fontWeight),
12342
- tdLineHeight: Number(t.body.typography.lineHeight),
12610
+ labelLineHeight: Number(t$1.header.typography.lineHeight),
12611
+ tdFontFamily: t$1.body.typography.fontFamily,
12612
+ tdFontSize: Number(t$1.body.typography.fontSize),
12613
+ tdFontWeight: Number(t$1.body.typography.fontWeight),
12614
+ tdLineHeight: Number(t$1.body.typography.lineHeight),
12343
12615
  };
12344
12616
 
12345
12617
  const sdKeyValueTableCss = () => `sd-key-value-table{display:block}sd-key-value-table .sd-key-value-table__wrapper{display:flex;align-items:stretch;width:100%;border:var(--sd-kvt-border-width) solid var(--sd-kvt-border-color);border-radius:var(--sd-kvt-radius);overflow:hidden}sd-key-value-table .sd-key-value-table__wrapper .sd-key-value-table{flex:1 1 auto;border:0;border-radius:0}sd-key-value-table .sd-key-value-table__wrapper.sd-key-value-table__wrapper--radius-useTop{border-top-left-radius:0;border-top-right-radius:0}sd-key-value-table .sd-key-value-table__wrapper.sd-key-value-table__wrapper--radius-full{border-radius:0}sd-key-value-table .sd-key-value-table__search-panel{display:flex;align-items:center;justify-content:center;flex:0 0 auto;padding:var(--sd-kvt-padding) var(--sd-kvt-search-padding-x);background:var(--sd-kvt-search-bg);border-left:var(--sd-kvt-border-width) solid var(--sd-kvt-border-color)}sd-key-value-table .sd-key-value-table{width:100%;table-layout:fixed;border:var(--sd-kvt-border-width) solid var(--sd-kvt-border-color);border-radius:var(--sd-kvt-radius);border-collapse:separate;border-spacing:0;overflow:hidden}sd-key-value-table .sd-key-value-table.sd-key-value-table--radius-useTop{border-top-left-radius:0;border-top-right-radius:0}sd-key-value-table .sd-key-value-table.sd-key-value-table--radius-full{border-radius:0}sd-key-value-table .sd-key-value-table__th,sd-key-value-table .sd-key-value-table__td{height:var(--sd-kvt-row-height);box-sizing:border-box;vertical-align:middle;text-align:left;font-weight:normal;border-top:var(--sd-kvt-border-width) solid var(--sd-kvt-border-color)}sd-key-value-table .sd-key-value-table tbody>tr:first-child>.sd-key-value-table__th,sd-key-value-table .sd-key-value-table tbody>tr:first-child>.sd-key-value-table__td{border-top:0}sd-key-value-table .sd-key-value-table__th{padding:var(--sd-kvt-padding) var(--sd-kvt-th-padding-x);width:var(--sd-kvt-th-width);background:var(--sd-kvt-th-bg);color:var(--sd-kvt-th-color)}sd-key-value-table .sd-key-value-table__th-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--sd-kvt-gap);width:100%;height:100%}sd-key-value-table .sd-key-value-table__label{display:inline-flex;align-items:center;gap:var(--sd-kvt-label-gap);font-family:var(--sd-kvt-label-font-family);font-size:var(--sd-kvt-label-font-size);font-weight:var(--sd-kvt-label-font-weight);line-height:var(--sd-kvt-label-line-height);color:var(--sd-kvt-th-color)}sd-key-value-table .sd-key-value-table__required{display:inline-flex;align-items:center;flex-shrink:0}sd-key-value-table .sd-key-value-table__help{display:inline-flex;align-items:center;flex-shrink:0}sd-key-value-table .sd-key-value-table__td{padding:var(--sd-kvt-padding) var(--sd-kvt-td-padding-x);background:var(--sd-kvt-td-bg);color:var(--sd-kvt-td-color)}sd-key-value-table .sd-key-value-table__td--text{padding-left:var(--sd-kvt-td-padding-x-wide);padding-right:var(--sd-kvt-td-padding-x-wide)}sd-key-value-table .sd-key-value-table__td-inner{display:flex;align-items:center;width:100%;height:100%}sd-key-value-table .sd-key-value-table__td-inner>slot{display:block;flex:1 1 auto;min-width:0}sd-key-value-table .sd-key-value-table__td-inner sd-input,sd-key-value-table .sd-key-value-table__td-inner sd-textarea,sd-key-value-table .sd-key-value-table__td-inner sd-number-input,sd-key-value-table .sd-key-value-table__td-inner sd-select,sd-key-value-table .sd-key-value-table__td-inner sd-date-picker,sd-key-value-table .sd-key-value-table__td-inner sd-date-range-picker,sd-key-value-table .sd-key-value-table__td-inner sd-file-picker{width:100%}sd-key-value-table .sd-key-value-table__text{font-family:var(--sd-kvt-td-font-family);font-size:var(--sd-kvt-td-font-size);font-weight:var(--sd-kvt-td-font-weight);line-height:var(--sd-kvt-td-line-height);color:var(--sd-kvt-td-color)}`;
@@ -12662,7 +12934,7 @@ class SdLinearProgress {
12662
12934
  clipPath: `inset(0 ${100 - this.clampedValue}% 0 0)`,
12663
12935
  };
12664
12936
  const valueText = `${Math.round(this.clampedValue)}%`;
12665
- return (hAsync(Host, { key: 'fb7aacfafc15a5570717f4ba13cd7d6a8193375a', style: hostStyle }, hAsync("div", { key: '7a054e0cac8fcc757c15871ff4d2305a8d190fb9', class: "sd-linear-progress__track" }, hAsync("div", { key: '35b45b58b899e4c7201bf39783d3d4c6be42ede5', class: "sd-linear-progress__fill", style: fillStyle }), !this.indeterminate && (hAsync("span", { key: 'a9b44e03fe2446fe8dbfd9bbd6801d6b9bebfc10', class: "sd-linear-progress__value sd-linear-progress__value--on-track" }, valueText)), !this.indeterminate && (hAsync("span", { key: '363bacb116ca51417892f9f49db58360a97899c4', class: "sd-linear-progress__value sd-linear-progress__value--on-fill", style: valueOnFillStyle }, valueText))), this.label && hAsync("span", { key: 'c8b9c15d2eb85ca1ac46ba8983ae399661012f31', class: "sd-linear-progress__label" }, this.label)));
12937
+ return (hAsync(Host, { key: 'bb8b4b933b609a42d1c342b7b480d32a48527321', style: hostStyle }, hAsync("div", { key: 'd127baf4c4cf49d5c6e04ada72636c9d3fd81733', class: "sd-linear-progress__track" }, hAsync("div", { key: '6251da38b070cf9f064b22ed1ecb694da41f63ec', class: "sd-linear-progress__fill", style: fillStyle }), !this.indeterminate && (hAsync("span", { key: '7b15d0383e4cc391a22e4fc7e2a85bc6cd076f80', class: "sd-linear-progress__value sd-linear-progress__value--on-track" }, valueText)), !this.indeterminate && (hAsync("span", { key: '8755f23a83aede79a141a14b73337eacca0fc10d', class: "sd-linear-progress__value sd-linear-progress__value--on-fill", style: valueOnFillStyle }, valueText))), this.label && hAsync("span", { key: 'c874dd1ca0cb86c90a84c318790639c0f4283255', class: "sd-linear-progress__label" }, this.label)));
12666
12938
  }
12667
12939
  static get style() { return sdLinearProgressCss(); }
12668
12940
  static get cmpMeta() { return {
@@ -12718,10 +12990,10 @@ class SdLoadingContainer {
12718
12990
  this.prevBodyOverflow = null;
12719
12991
  }
12720
12992
  render() {
12721
- return (hAsync("div", { key: '89949c219d7ace3858c7539f3db4843a20a2c67e', class: {
12993
+ return (hAsync("div", { key: 'c7821d4c50651217e48f424cbdfb9a32006afda4', class: {
12722
12994
  'sd-loading-container': true,
12723
12995
  'sd-loading-container--visible': this.visible,
12724
- }, "aria-hidden": this.visible ? 'false' : 'true' }, hAsync("div", { key: '0c538680987653059a8baae6e6f6d2b7dabeda69', class: "sd-loading-container__backdrop" }), hAsync("div", { key: '8b5b01c51e97d9ebdd63be32aff8f228449c1e47', class: "sd-loading-container__content" }, hAsync("sd-circle-progress", { key: 'ccf47434cf4c7b3e948cc10741e63fe362bd9316', indeterminate: true, type: "inverse" }), this.message && hAsync("p", { key: 'db63acff8b44e5725e9c8e29fed7d9957f18aa9d', class: "sd-loading-container__message" }, this.message))));
12996
+ }, "aria-hidden": this.visible ? 'false' : 'true' }, hAsync("div", { key: 'f7674699f3dd15edd74fc3224203b59ad2a96735', class: "sd-loading-container__backdrop" }), hAsync("div", { key: 'cd361e1a1f470109298459cc2872be104e382015', class: "sd-loading-container__content" }, hAsync("sd-circle-progress", { key: 'c856a1e9ab203040dd8bf0d01dbdf151718aaa3e', indeterminate: true, type: "inverse" }), this.message && hAsync("p", { key: '8af15dba086fb024b652db5f776d384f00fd9cf7', class: "sd-loading-container__message" }, this.message))));
12725
12997
  }
12726
12998
  static get style() { return sdLoadingContainerCss(); }
12727
12999
  static get cmpMeta() { return {
@@ -12833,7 +13105,7 @@ class SdLoadingModal {
12833
13105
  '--sd-loading-modal-width': this.toCssSize(this.width) ?? `${LOADING_MODAL_LAYOUT.minWidth}px`,
12834
13106
  '--sd-loading-modal-height': this.toCssSize(this.height) ?? `${LOADING_MODAL_LAYOUT.minHeight}px`,
12835
13107
  };
12836
- return (hAsync(Host, { key: '1b22ac1569044c27867745c08d3e49325192c673', style: hostStyle }, hAsync("div", { key: '06fbf9cb54f7753a2560b208ab634a9090d5462a', class: "sd-loading-modal" }, this.resolvedState === 'error' && (hAsync("sd-ghost-button", { key: 'fc8e95da691cefe22b47d75cacd9e4ea36695347', class: "sd-loading-modal__close", icon: "close", ariaLabel: "close", onClick: () => this.close.emit() })), hAsync("div", { key: 'ca4840db307050f8509d3a632b8f028bce18e399', class: "sd-loading-modal__content" }, this.resolvedState === 'loading' ? (this.progress !== undefined ? (hAsync("sd-circle-progress", { value: this.progress })) : (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("div", { key: '11b93fc8996ca64a42f09e4688267329da8a74c9', class: "sd-loading-modal__message-wrapper" }, Array.isArray(this.resolvedMessage) ? (this.resolvedMessage.map(message => (hAsync("p", { class: "sd-loading-modal__message" }, message)))) : (hAsync("p", { class: "sd-loading-modal__message" }, this.resolvedMessage))), this.showButton && (hAsync("div", { key: 'b75b3cb2a48167746d583e540c48746b9590efad', class: "sd-loading-modal__button" }, hAsync("sd-button", { key: '7c298c2f62460ecb955a53e57c841a9e7244008e', name: LOADING_MODAL_BUTTON_PRESET, label: this.resolvedButtonLabel, onSdClick: this.handleClick }))))));
13108
+ return (hAsync(Host, { key: 'c6b6406cc751cfc007f6fbff72580a22b2975c03', style: hostStyle }, hAsync("div", { key: '139b7397598768e526275dc8b508a333ba1e6058', class: "sd-loading-modal" }, this.resolvedState === 'error' && (hAsync("sd-ghost-button", { key: '098c693d5da0c333fb06309be5371a5e8a6c3016', class: "sd-loading-modal__close", icon: "close", ariaLabel: "close", onClick: () => this.close.emit() })), hAsync("div", { key: 'f072a17c4c8e47e296cbf52d34414a32efa6aaa1', class: "sd-loading-modal__content" }, this.resolvedState === 'loading' ? (this.progress !== undefined ? (hAsync("sd-circle-progress", { value: this.progress })) : (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("div", { key: 'a2c501cfee2181b2a7dda2544e03bf1a709baaf3', class: "sd-loading-modal__message-wrapper" }, Array.isArray(this.resolvedMessage) ? (this.resolvedMessage.map(message => (hAsync("p", { class: "sd-loading-modal__message" }, message)))) : (hAsync("p", { class: "sd-loading-modal__message" }, this.resolvedMessage))), this.showButton && (hAsync("div", { key: 'e9d1beef80bf8fa4a0647802ce4a6e023e74bc12', class: "sd-loading-modal__button" }, hAsync("sd-button", { key: '63a64f356fc09cbaf56ff715d04c97b208f63945', name: LOADING_MODAL_BUTTON_PRESET, label: this.resolvedButtonLabel, onSdClick: this.handleClick }))))));
12837
13109
  }
12838
13110
  static get style() { return sdLoadingModalCss(); }
12839
13111
  static get cmpMeta() { return {
@@ -13372,24 +13644,24 @@ var numberInputTokens = {
13372
13644
  numberInput: numberInput
13373
13645
  };
13374
13646
 
13375
- const sm = numberInputTokens.numberInput.sm;
13376
- const md = numberInputTokens.numberInput.md;
13647
+ const sm$1 = numberInputTokens.numberInput.sm;
13648
+ const md$1 = numberInputTokens.numberInput.md;
13377
13649
  const NUMBER_INPUT_SIZE_MAP = {
13378
13650
  sm: {
13379
- height: sm.height,
13380
- paddingX: sm.paddingX,
13381
- radius: sm.radius,
13382
- fontSize: sm.typography.fontSize,
13383
- lineHeight: sm.typography.lineHeight,
13384
- fontWeight: sm.typography.fontWeight,
13651
+ height: sm$1.height,
13652
+ paddingX: sm$1.paddingX,
13653
+ radius: sm$1.radius,
13654
+ fontSize: sm$1.typography.fontSize,
13655
+ lineHeight: sm$1.typography.lineHeight,
13656
+ fontWeight: sm$1.typography.fontWeight,
13385
13657
  },
13386
13658
  md: {
13387
- height: md.height,
13388
- paddingX: md.paddingX,
13389
- radius: md.radius,
13390
- fontSize: md.typography.fontSize,
13391
- lineHeight: md.typography.lineHeight,
13392
- fontWeight: md.typography.fontWeight,
13659
+ height: md$1.height,
13660
+ paddingX: md$1.paddingX,
13661
+ radius: md$1.radius,
13662
+ fontSize: md$1.typography.fontSize,
13663
+ lineHeight: md$1.typography.lineHeight,
13664
+ fontWeight: md$1.typography.fontWeight,
13393
13665
  },
13394
13666
  };
13395
13667
  const NUMBER_INPUT_COLORS = {
@@ -13430,6 +13702,8 @@ class SdNumberInput {
13430
13702
  useButton = false;
13431
13703
  /** 소수점 입력 허용 여부 */
13432
13704
  useDecimal = false;
13705
+ /** 소수점 이하 최대 자리수 (useDecimal일 때만 적용, 초과 입력한 소수부는 잘라냄) */
13706
+ maxDecimalLength;
13433
13707
  /** 입력 값 */
13434
13708
  value = null;
13435
13709
  /** 레이블 텍스트 */
@@ -13510,6 +13784,31 @@ class SdNumberInput {
13510
13784
  const result = isNegative ? '-' + formatted : formatted;
13511
13785
  return decPart !== undefined && decPart !== '' ? result + '.' + decPart : String(result);
13512
13786
  }
13787
+ /** useDecimal이면서 유효한 maxDecimalLength가 있을 때만 소수점 이하 제한 자리수를 반환합니다. */
13788
+ getDecimalLimit() {
13789
+ if (!this.useDecimal ||
13790
+ this.maxDecimalLength === undefined ||
13791
+ !Number.isFinite(this.maxDecimalLength)) {
13792
+ return undefined;
13793
+ }
13794
+ return Math.max(0, Math.floor(this.maxDecimalLength));
13795
+ }
13796
+ /** 소수부를 제한 자리수로 잘라낸 문자열을 반환합니다(반올림하지 않고 잘라냄). */
13797
+ truncateToDecimalLimit(cleaned, limit) {
13798
+ if (!cleaned.includes('.'))
13799
+ return cleaned;
13800
+ const [intPart, fractionPart = ''] = cleaned.split('.');
13801
+ const truncatedFraction = fractionPart.slice(0, limit);
13802
+ return truncatedFraction === '' ? intPart : `${intPart}.${truncatedFraction}`;
13803
+ }
13804
+ /** 숫자값의 소수부를 제한 자리수로 잘라냅니다(제한이 없으면 원본 그대로). */
13805
+ applyDecimalLimit(value) {
13806
+ const decimalLimit = this.getDecimalLimit();
13807
+ if (decimalLimit === undefined)
13808
+ return value;
13809
+ const parsed = parseFloat(this.truncateToDecimalLimit(value.toString(), decimalLimit));
13810
+ return isNaN(parsed) ? value : parsed;
13811
+ }
13513
13812
  parseInput(input) {
13514
13813
  if (input.trim() === '')
13515
13814
  return null;
@@ -13517,12 +13816,15 @@ class SdNumberInput {
13517
13816
  if (!/^-?(\d+\.?\d*|\d*\.\d+)$/.test(cleaned)) {
13518
13817
  return null;
13519
13818
  }
13520
- const parsed = parseFloat(cleaned);
13521
- if (isNaN(parsed))
13522
- return null;
13523
13819
  if (!this.useDecimal && cleaned.includes('.')) {
13524
13820
  return null;
13525
13821
  }
13822
+ // useDecimal이면서 maxDecimalLength가 설정된 경우 소수부를 제한 자리수로 잘라냄(반올림 아님)
13823
+ const decimalLimit = this.getDecimalLimit();
13824
+ const normalized = decimalLimit !== undefined ? this.truncateToDecimalLimit(cleaned, decimalLimit) : cleaned;
13825
+ const parsed = parseFloat(normalized);
13826
+ if (isNaN(parsed))
13827
+ return null;
13526
13828
  return parsed;
13527
13829
  }
13528
13830
  clampMinMax(value) {
@@ -13677,6 +13979,7 @@ class SdNumberInput {
13677
13979
  if (nextVal > this.max) {
13678
13980
  nextVal = this.max;
13679
13981
  }
13982
+ nextVal = this.applyDecimalLimit(nextVal);
13680
13983
  if (nextVal === currentVal)
13681
13984
  return;
13682
13985
  this.internalValue = nextVal;
@@ -13689,6 +13992,7 @@ class SdNumberInput {
13689
13992
  if (nextVal < this.min) {
13690
13993
  nextVal = this.min;
13691
13994
  }
13995
+ nextVal = this.applyDecimalLimit(nextVal);
13692
13996
  if (nextVal === currentVal)
13693
13997
  return;
13694
13998
  this.internalValue = nextVal;
@@ -13729,15 +14033,15 @@ class SdNumberInput {
13729
14033
  '--sd-textinput-input-hint-typography-line-height': `${NUMBER_INPUT_HINT.typography.lineHeight}px`,
13730
14034
  '--sd-textinput-input-contents-gap': `${NUMBER_INPUT_CONTENTS_GAP}px`,
13731
14035
  };
13732
- return (hAsync("sd-field", { key: 'abfc6fbc218ed829eabbf33476e6feb25ed0b783', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, readonly: this.readonly, 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("div", { key: 'ab9f55eb4dcf8b345fae2e0546833f9d4216df1d', class: {
14036
+ return (hAsync("sd-field", { key: 'ffa6befb9565a33e762fce231c29d7a2f663eb08', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, readonly: this.readonly, 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("div", { key: '2fb1686b071fd69c65fc0c908807c029edc3b253', class: {
13733
14037
  'sd-number-input__content': true,
13734
14038
  'sd-number-input__content--no-stepper': !this.useButton,
13735
- } }, this.useButton && (hAsync("button", { key: '3a12f0c1c1963790b3337f34452d9bc200e072c1', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--decrement", disabled: this.isDecrementDisabled(), onClick: this.handleDecrement, tabindex: -1 }, hAsync("sd-icon", { key: 'cae2acccfb818a25a1d2c6abe8a0accdff293931', name: "minus", size: iconSize, color: this.isDecrementDisabled()
14039
+ } }, this.useButton && (hAsync("button", { key: '6b2464867bb0224f4fbcb50ea4e4bfc5386474ba', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--decrement", disabled: this.isDecrementDisabled(), onClick: this.handleDecrement, tabindex: -1 }, hAsync("sd-icon", { key: 'f65e9144ad93f4ba8d293b5af1bf9fd1286e7520', name: "minus", size: iconSize, color: this.isDecrementDisabled()
13736
14040
  ? NUMBER_INPUT_STEPPER.icon.disabled
13737
- : NUMBER_INPUT_STEPPER.icon.default }))), this.inputPrefix && hAsync("span", { key: '37a2724e2973205cd9f0083d796c556aed8c50c6', class: "sd-number-input__prefix" }, this.inputPrefix), hAsync("input", { key: '5d9bfccaa121f0bc3ecaac4d8db3023d1d03dd68', 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: {
14041
+ : NUMBER_INPUT_STEPPER.icon.default }))), this.inputPrefix && hAsync("span", { key: '3d89b3557f961f36b429e3cf4ae247098a412b30', class: "sd-number-input__prefix" }, this.inputPrefix), hAsync("input", { key: 'c5c503b634aee3b0c8d81f855b5de1d0abe35eac', 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: {
13738
14042
  textAlign: this.useButton ? 'center' : 'right',
13739
14043
  ...this.inputStyle,
13740
- } }), this.inputSuffix && hAsync("span", { key: 'ba990181e4b3d100087d20b177710f09b61f23cc', class: "sd-number-input__suffix" }, this.inputSuffix), this.useButton && (hAsync("button", { key: '91666af2e343d3098bc020fb7266aa1e785783c3', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--increment", disabled: this.isIncrementDisabled(), onClick: this.handleIncrement, tabindex: -1 }, hAsync("sd-icon", { key: '336ea010c7e9e314c98f56f4c79c86944087912e', name: "add", size: iconSize, color: this.isIncrementDisabled()
14044
+ } }), this.inputSuffix && hAsync("span", { key: '15177064a4daab2ede3af4f8758912da266f1c29', class: "sd-number-input__suffix" }, this.inputSuffix), this.useButton && (hAsync("button", { key: 'dcc1fbfe7c4e7eaa6db95fe7dc9a34f4b82ade8b', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--increment", disabled: this.isIncrementDisabled(), onClick: this.handleIncrement, tabindex: -1 }, hAsync("sd-icon", { key: '58eee48f37c0e942a3734a9275a9d459bc9bc420', name: "add", size: iconSize, color: this.isIncrementDisabled()
13741
14045
  ? NUMBER_INPUT_STEPPER.icon.disabled
13742
14046
  : NUMBER_INPUT_STEPPER.icon.default }))))));
13743
14047
  }
@@ -13760,6 +14064,7 @@ class SdNumberInput {
13760
14064
  "step": [2],
13761
14065
  "useButton": [4, "use-button"],
13762
14066
  "useDecimal": [4, "use-decimal"],
14067
+ "maxDecimalLength": [2, "max-decimal-length"],
13763
14068
  "value": [1032],
13764
14069
  "label": [1],
13765
14070
  "labelWidth": [8, "label-width"],
@@ -13956,13 +14261,13 @@ class SdPagination {
13956
14261
  '--sd-pagination-bg-selected': PAGINATION_COLORS.bgSelected,
13957
14262
  '--sd-pagination-item-width': `${this.buttonWidth}px`,
13958
14263
  };
13959
- return (hAsync("div", { key: '78ef11e415c8d086e0a5f582fa5b4568ed3e49a4', class: {
14264
+ return (hAsync("div", { key: '0b5a2e9aec83e6f6a8de3426e57b3f9a53623652', class: {
13960
14265
  'sd-pagination': true,
13961
14266
  'sd-pagination--simple': this.simple,
13962
- }, style: cssVars }, hAsync("div", { key: '360cdb85715508d2f8155851b11928031015909c', 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: {
14267
+ }, style: cssVars }, hAsync("div", { key: 'aa53d0366ae4678950ecd3917fd0d7011dd9608d', 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: {
13963
14268
  'sd-pagination__item': true,
13964
14269
  'sd-pagination__item--selected': this.currentPage === n,
13965
- }, onClick: () => this.handlePageChange(n) }, n))))), hAsync("div", { key: '3726aaab29e0347cf7ae5e2aebad268e33eb33c7', class: "sd-pagination__group sd-pagination__group--next" }, this.renderNextButtons())));
14270
+ }, onClick: () => this.handlePageChange(n) }, n))))), hAsync("div", { key: '1aa72933c849af4fc886cc4e5f8962710c6c40bf', class: "sd-pagination__group sd-pagination__group--next" }, this.renderNextButtons())));
13966
14271
  }
13967
14272
  static get style() { return sdPaginationCss(); }
13968
14273
  static get cmpMeta() { return {
@@ -13983,57 +14288,135 @@ const TooltipArrow = (props) => (hAsync("svg", { width: "16", height: "12", view
13983
14288
 
13984
14289
  const popover = {
13985
14290
  "default": {
13986
- bg: "#07284A"}};
14291
+ bg: "#07284A",
14292
+ title: "#FFFFFF",
14293
+ description: "#FFFFFF",
14294
+ subAction: "#D8D8D8"
14295
+ },
14296
+ title: {
14297
+ leadingIcon: "16",
14298
+ gap: "8"
14299
+ },
14300
+ danger: {
14301
+ bg: "#FCEFEF",
14302
+ title: "#FB4444"
14303
+ },
14304
+ warning: {
14305
+ bg: "#FEF1EA",
14306
+ title: "#FF6B00"
14307
+ },
14308
+ accent: {
14309
+ bg: "#E6F1FF",
14310
+ title: "#0075FF"
14311
+ },
14312
+ light: {
14313
+ description: "#555555",
14314
+ subAction: "#888888"
14315
+ }
14316
+ };
13987
14317
  var popoverTokens = {
13988
14318
  popover: popover
13989
14319
  };
13990
14320
 
14321
+ const t = popoverTokens.popover;
14322
+ /** 제목-아이콘 간격 */
14323
+ const POPOVER_TITLE_GAP = t.title.gap;
14324
+ /** 제목 좌측 아이콘 크기 */
14325
+ const POPOVER_TITLE_ICON_SIZE = t.title.leadingIcon;
14326
+ /**
14327
+ * popoverType별 색상·버튼 매핑.
14328
+ * - default·accent: 하단 버튼 primary(solid) / danger: danger outline / warning: neutral outline
14329
+ * - default: 다크 배경 + 흰색 텍스트 / danger·warning·accent: 라이트 배경 + 타입 색상 제목 + light 계열 본문·링크 색상
14330
+ */
14331
+ const POPOVER_TYPE_CONFIG = {
14332
+ default: {
14333
+ bg: t.default.bg,
14334
+ title: t.default.title,
14335
+ description: t.default.description,
14336
+ subAction: t.default.subAction,
14337
+ buttonName: 'primary_xs',
14338
+ },
14339
+ danger: {
14340
+ bg: t.danger.bg,
14341
+ title: t.danger.title,
14342
+ description: t.light.description,
14343
+ subAction: t.light.subAction,
14344
+ buttonName: 'danger_outline_xs',
14345
+ },
14346
+ warning: {
14347
+ bg: t.warning.bg,
14348
+ title: t.warning.title,
14349
+ description: t.light.description,
14350
+ subAction: t.light.subAction,
14351
+ buttonName: 'neutral_outline_xs',
14352
+ },
14353
+ accent: {
14354
+ bg: t.accent.bg,
14355
+ title: t.accent.title,
14356
+ description: t.light.description,
14357
+ subAction: t.light.subAction,
14358
+ buttonName: 'primary_xs',
14359
+ },
14360
+ };
14361
+
13991
14362
  const sdPopoverCss = () => `sd-popover{position:relative;cursor:pointer;display:inline-flex}`;
13992
14363
 
13993
14364
  class SdPopover {
13994
14365
  constructor(hostRef) {
13995
14366
  registerInstance(this, hostRef);
13996
14367
  this.showChange = createEvent(this, "sdShowChange", 7);
14368
+ this.buttonClick = createEvent(this, "sdButtonClick", 7);
14369
+ this.leftLinkClick = createEvent(this, "sdLeftLinkClick", 7);
13997
14370
  }
13998
14371
  get el() { return getElement(this); }
13999
- /** 팝오버 표시 여부 */
14000
- show = false;
14372
+ /** 표시 여부 (제어). 미지정 시 defaultOpen 기반 비제어로 동작 */
14373
+ open;
14374
+ /** 기본 표시 여부 (비제어) */
14375
+ defaultOpen = false;
14001
14376
  /** 팝오버를 표시할 방향 */
14002
14377
  placement = 'bottom';
14003
- /** 아이콘 트리거 색상 */
14004
- color = '#01BB4B';
14005
- /** 아이콘 트리거 아이콘명 */
14378
+ /** 색상 타입 (default=다크 배경 / danger·warning·accent=라이트 배경) */
14379
+ type = 'default';
14380
+ /** 메뉴 제목 (필수) */
14381
+ menuTitle;
14382
+ /** 제목 좌측 아이콘 (선택) */
14383
+ titleIcon;
14384
+ /** 기본(아이콘) 트리거 아이콘명. slot="trigger" 가 있으면 무시 */
14006
14385
  icon = 'helpOutline';
14007
- /** 아이콘 트리거 크기 */
14386
+ /** 기본(아이콘) 트리거 크기 */
14008
14387
  iconSize = 12;
14009
- /** 버튼 트리거 레이블 (있으면 아이콘 대신 버튼 렌더링) */
14010
- label = '';
14011
- /** 버튼 트리거 프리셋 */
14012
- name = 'primary_sm';
14013
- /** 버튼 트리거 우측 아이콘 */
14014
- rightIcon;
14388
+ /** 기본(아이콘) 트리거 색상 */
14389
+ color = '#01BB4B';
14390
+ /** 하단 좌측 링크 레이블 (선택) */
14391
+ leftLinkLabel;
14392
+ /** 하단 우측 버튼 레이블 (필수). 색상/스타일은 type 별로 고정 */
14393
+ buttonLabel;
14015
14394
  /** 스크린리더용 접근성 레이블 */
14016
14395
  ariaLabel = '';
14017
- /** 비활성 상태 여부 */
14018
- disabled = false;
14019
- /** 버튼 type 속성 */
14020
- type = 'button';
14021
- /** 팝오버 메뉴 제목 */
14022
- menuTitle;
14023
- /** 팝오버 하단 좌측 링크 옵션 */
14024
- leftLink;
14025
- /** 팝오버 하단 버튼 옵션 */
14026
- button;
14027
14396
  /** 팝오버 메뉴에 추가할 클래스 */
14028
- menuClass = '';
14397
+ menuClassName = '';
14398
+ internalOpen = false;
14029
14399
  slotContentHTML = '';
14400
+ triggerHTML = '';
14030
14401
  /** 팝오버 표시 상태가 바뀔 때 발생합니다. */
14031
14402
  showChange;
14032
- buttonEl;
14033
- setShow = (next) => {
14034
- if (this.show === next)
14403
+ /** 하단 우측 버튼 클릭 시 발생합니다. */
14404
+ buttonClick;
14405
+ /** 하단 좌측 링크 클릭 시 발생합니다. */
14406
+ leftLinkClick;
14407
+ triggerEl;
14408
+ get isOpen() {
14409
+ return this.open !== undefined ? this.open : this.internalOpen;
14410
+ }
14411
+ setOpen = (next) => {
14412
+ if (this.isOpen === next)
14035
14413
  return;
14036
- this.show = next;
14414
+ if (this.open === undefined) {
14415
+ this.internalOpen = next;
14416
+ }
14417
+ else {
14418
+ this.open = next;
14419
+ }
14037
14420
  this.showChange.emit(next);
14038
14421
  };
14039
14422
  get popoverOffset() {
@@ -14048,57 +14431,69 @@ class SdPopover {
14048
14431
  return [4, 0];
14049
14432
  }
14050
14433
  }
14051
- handleClose = () => this.setShow(false);
14434
+ handleClose = () => this.setOpen(false);
14052
14435
  componentWillLoad() {
14436
+ this.internalOpen = this.defaultOpen;
14437
+ // slot="trigger" 커스텀 트리거를 분리해 두고, 나머지 라이트 DOM은 메뉴 본문으로 캡처한다.
14438
+ const triggerSlot = this.el.querySelector('[slot="trigger"]');
14439
+ if (triggerSlot) {
14440
+ this.triggerHTML = triggerSlot.outerHTML;
14441
+ triggerSlot.remove();
14442
+ }
14053
14443
  this.slotContentHTML = this.el.innerHTML;
14054
14444
  this.el.innerHTML = '';
14055
14445
  }
14056
14446
  render() {
14057
14447
  const placement = this.placement ?? 'bottom';
14058
- const color = this.color ?? '#01BB4B';
14059
- const icon = this.icon ?? 'helpOutline';
14060
- const iconSize = this.iconSize ?? 12;
14061
- const menuClass = this.menuClass ?? '';
14062
- const leftLink = this.leftLink;
14063
- const button = this.button;
14064
- const hasFooter = !!leftLink || !!button;
14065
- return (hAsync(Fragment, { key: '163802d6f0954b87902bbf957831f311829e63dc' }, this.label !== '' ? (hAsync("sd-button", { ref: el => (this.buttonEl = el), name: this.name ?? 'primary_sm', label: this.label, icon: icon, rightIcon: this.rightIcon, ariaLabel: this.ariaLabel || this.label || icon || 'Open popover', disabled: this.disabled, type: this.type ?? 'button', class: "sd-popover", onSdClick: () => this.setShow(!this.show) })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: icon, size: iconSize, color: color, class: "sd-popover", onClick: () => this.setShow(!this.show) })), this.show && (hAsync("sd-floating-portal", { key: '1bd73048fd65916a400840c572d988c445dd662b', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: placement, offset: this.popoverOffset }, hAsync("div", { key: 'f3791b078c7970174d9394ffcbb19beb450f12c5', class: {
14448
+ const typeConfig = POPOVER_TYPE_CONFIG[this.type ?? 'default'] ?? POPOVER_TYPE_CONFIG.default;
14449
+ const menuClassName = this.menuClassName ?? '';
14450
+ const hasLeftLink = this.leftLinkLabel !== undefined && this.leftLinkLabel !== '';
14451
+ return (hAsync(Fragment, { key: '16cc231907c02de80749163ce4b639303e969f4a' }, this.triggerHTML !== '' ? (
14452
+ // 사용자가 넘긴 slot="trigger" 콘텐츠를 감싸 클릭을 전달하는 래퍼(키보드 상호작용은 내부 트리거가 담당)
14453
+ // eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events
14454
+ hAsync("span", { ref: el => (this.triggerEl = el), class: "sd-popover", "aria-label": this.ariaLabel || undefined, innerHTML: this.triggerHTML, onClick: () => this.setOpen(!this.isOpen) })) : (hAsync("sd-icon", { ref: el => (this.triggerEl = el), name: this.icon ?? 'helpOutline', size: this.iconSize ?? 12, color: this.color ?? '#01BB4B', class: "sd-popover", "aria-label": this.ariaLabel || undefined, onClick: () => this.setOpen(!this.isOpen) })), this.isOpen && (hAsync("sd-floating-portal", { key: 'c59ec7fb1b7ea137b95542f7e8f775c6bd837975', parentRef: this.triggerEl, onSdClose: this.handleClose, placement: placement, offset: this.popoverOffset }, hAsync("div", { key: '97e68e0246997a0a73beb3e984331daa57161e8e', class: {
14066
14455
  'sd-floating-menu': true,
14067
14456
  'sd-floating-menu--popover': true,
14068
14457
  [`sd-floating-menu--${placement}`]: true,
14069
- [menuClass]: menuClass !== '',
14458
+ [menuClassName]: menuClassName !== '',
14070
14459
  }, style: {
14071
- '--sd-floating-bg': popoverTokens.popover.default.bg,
14072
- } }, hAsync("i", { key: 'f9ab66a933669a057a1da5188cb82ca9e5f17ed6', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, hAsync(TooltipArrow, { key: '6ea9ca3bacd2c84c468e5f00fa33e93e61a6bf9d' })), hAsync("div", { key: '91d094cd45973bcc5ea6e6016510006f41956546', class: "sd-floating-menu__content" }, this.menuTitle && hAsync("div", { key: 'ebe9a1e130792d7e60ca9abef9020dff6c0bd4c4', class: "sd-floating-menu__title" }, this.menuTitle), this.slotContentHTML && (hAsync("div", { key: 'b898402e77f125099b29f6bd8eb5384a70aa671a', class: "sd-floating-menu__messages", innerHTML: this.slotContentHTML })), hasFooter && (hAsync("div", { key: 'e797202b27ff538d4148f3b6782b33f58fc6bc2f', class: {
14460
+ '--sd-floating-bg': typeConfig.bg,
14461
+ '--sd-floating-content': typeConfig.description,
14462
+ } }, hAsync("i", { key: 'b96d7dc623a1fab61ee84f612c68c9f7bbac7405', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, hAsync(TooltipArrow, { key: '92c6e5ef1258d6e99f744c75cef7ee3dd26d0367' })), hAsync("div", { key: '9c9f3cfcc8a3d60e5282a5f6f2653e2cce17cf56', class: "sd-floating-menu__content" }, this.menuTitle && (hAsync("div", { key: '044ae6b271fbf0cede0b4983e074d56882d5f50f', class: "sd-floating-menu__title", style: {
14463
+ color: typeConfig.title,
14464
+ display: 'flex',
14465
+ alignItems: 'center',
14466
+ gap: `${POPOVER_TITLE_GAP}px`,
14467
+ } }, this.titleIcon && (hAsync("sd-icon", { key: '360cf55b73ee395191836ee13a2d492460059f4a', name: this.titleIcon, size: Number(POPOVER_TITLE_ICON_SIZE), color: typeConfig.title })), hAsync("span", { key: '5cc44d0806971433b42c41e48a48e7ea8cc2c975' }, this.menuTitle))), this.slotContentHTML && (hAsync("div", { key: 'a5343a56938c0d6d5d5fd07fb83b7ccee4e81cf0', class: "sd-floating-menu__messages", innerHTML: this.slotContentHTML })), hAsync("div", { key: '1f6a0f46b2b6b5f08a0d453cae2a868f93015ac7', class: {
14073
14468
  'sd-floating-menu__buttons': true,
14074
- 'sd-floating-menu__buttons--with-link': !!leftLink,
14075
- } }, leftLink && (hAsync("sd-text-link", { key: 'fdeacc2b97c997d0c7385bab5260e060a70292e6', class: "sd-floating-menu__left-link", label: leftLink.label, icon: leftLink.icon ?? '', iconColor: leftLink.iconColor ?? '', rightArrow: leftLink.rightArrow ?? 'none', underline: !!leftLink.underline, disabled: !!leftLink.disabled, onSdClick: leftLink.onClick })), button && (hAsync("sd-button", { key: '4a56e7e714517edcbea075e7d4521f0a54388e9f', name: button.name ?? 'secondary_xs', label: button.label, icon: button.icon, rightIcon: button.rightIcon, ariaLabel: button.ariaLabel || button.label || button.icon || 'Open popover', disabled: button.disabled, type: button.type, onSdClick: button.onClick }))))), hAsync("sd-ghost-button", { key: 'ca713f6a07637b014c58923db2ff7af1f3ae98a8', class: "sd-floating-menu__close-button", icon: "close", ariaLabel: "close", size: "xs", onClick: this.handleClose }))))));
14469
+ 'sd-floating-menu__buttons--with-link': hasLeftLink,
14470
+ } }, hasLeftLink && (hAsync("sd-text-link", { key: '5ec7502837f7417266810769885e2318c80ad986', class: "sd-floating-menu__left-link", style: { '--sd-text-link-color': typeConfig.subAction }, label: this.leftLinkLabel, onSdClick: () => this.leftLinkClick.emit() })), hAsync("sd-button", { key: '3d9df22cd0b65add5cd18b3750888248dc235408', name: typeConfig.buttonName, label: this.buttonLabel, ariaLabel: this.buttonLabel || 'confirm', onSdClick: () => this.buttonClick.emit() }))), hAsync("sd-ghost-button", { key: '7e1ca491a2539b52ded454aca8afd26a92dc2ef6', class: "sd-floating-menu__close-button", icon: "close", ariaLabel: "close", size: "xs", onClick: this.handleClose }))))));
14076
14471
  }
14077
14472
  static get style() { return sdPopoverCss(); }
14078
14473
  static get cmpMeta() { return {
14079
14474
  "$flags$": 512,
14080
14475
  "$tagName$": "sd-popover",
14081
14476
  "$members$": {
14082
- "show": [1028],
14477
+ "open": [1028],
14478
+ "defaultOpen": [4, "default-open"],
14083
14479
  "placement": [513],
14084
- "color": [513],
14480
+ "type": [513],
14481
+ "menuTitle": [1, "menu-title"],
14482
+ "titleIcon": [1, "title-icon"],
14085
14483
  "icon": [513],
14086
14484
  "iconSize": [514, "icon-size"],
14087
- "label": [1],
14088
- "name": [1],
14089
- "rightIcon": [1, "right-icon"],
14485
+ "color": [513],
14486
+ "leftLinkLabel": [1, "left-link-label"],
14487
+ "buttonLabel": [1, "button-label"],
14090
14488
  "ariaLabel": [1, "aria-label"],
14091
- "disabled": [4],
14092
- "type": [1],
14093
- "menuTitle": [1, "menu-title"],
14094
- "leftLink": [16],
14095
- "button": [16],
14096
- "menuClass": [1, "menu-class"],
14097
- "slotContentHTML": [32]
14489
+ "menuClassName": [1, "menu-class-name"],
14490
+ "internalOpen": [32],
14491
+ "slotContentHTML": [32],
14492
+ "triggerHTML": [32]
14098
14493
  },
14099
14494
  "$listeners$": undefined,
14100
14495
  "$lazyBundleId$": "-",
14101
- "$attrsToReflect$": [["placement", "placement"], ["color", "color"], ["icon", "icon"], ["iconSize", "icon-size"]]
14496
+ "$attrsToReflect$": [["placement", "placement"], ["type", "type"], ["icon", "icon"], ["iconSize", "icon-size"], ["color", "color"]]
14102
14497
  }; }
14103
14498
  }
14104
14499
 
@@ -14202,7 +14597,7 @@ class SdPopup {
14202
14597
  ...DEFAULT_SUBMIT_BUTTON_PROPS,
14203
14598
  ...this.submitButtonProps,
14204
14599
  };
14205
- return (hAsync("div", { key: 'd86bb173d6fe8540e8b96f5dff4c8285cbf9ff91', class: `sd-popup sd-popup--${this.type}`, style: cssVars }, hAsync("header", { key: '0f006173fda3be589cdc208f382ed1898c49396a', class: "sd-popup__header" }, hAsync("h2", { key: '62179c692f08b21e6386175b153d4f8c1013ea53', class: "sd-popup__title" }, this.popupTitle)), hAsync("div", { key: 'a1a786d9d71f0a17eb4f3bce3a6b1ae8a1fa3367', class: "sd-popup__body" }, hAsync("slot", { key: '40b772fd34963ef78507dddf81474eb5e1a58174' })), this.useFooter && (hAsync("footer", { key: '40c981163f237b44764dec66205e01203a0d150d', class: "sd-popup__footer" }, hAsync("div", { key: '0c91d37584c0bc5f74b510430a83889aea4abb93', class: "sd-popup__footer-slot sd-popup__footer-slot--left" }, hAsync("slot", { key: '120c41484fee23d160a1fa7b5ab7cd70c1422d12', name: "footer-left" })), hAsync("sd-button", { key: '6dadd08ab99380d0e55730888fbbd2fea88bcfe9', ...submitButtonProps, class: "sd-popup__submit", onSdClick: () => this.submit.emit() })))));
14600
+ return (hAsync("div", { key: '1b8dc171a7b0dea5216aa63425ccc72ae80e3a3e', class: `sd-popup sd-popup--${this.type}`, style: cssVars }, hAsync("header", { key: '1ae57ef360ad124a2afac3340258dce481bb7bc7', class: "sd-popup__header" }, hAsync("h2", { key: '3d0cc0df6ba901b4dc9e0917103e57d6279cde31', class: "sd-popup__title" }, this.popupTitle)), hAsync("div", { key: 'a0fee226ac513744243d6f78ddce6125170700da', class: "sd-popup__body" }, hAsync("slot", { key: '55c5f94dff5413810f2c4648c9684e520db7268b' })), this.useFooter && (hAsync("footer", { key: 'f8f0dc3751324ac5976aef55bec974341db036c1', class: "sd-popup__footer" }, hAsync("div", { key: 'ea2f7e63c857d135eeffd7c2a43b171619067161', class: "sd-popup__footer-slot sd-popup__footer-slot--left" }, hAsync("slot", { key: '0d56c0c25e1e10f6900af0f632c7bb339b736032', name: "footer-left" })), hAsync("sd-button", { key: 'd334174cd98be32856a6f3b1b3348ca2ebea3cdd', ...submitButtonProps, class: "sd-popup__submit", onSdClick: () => this.submit.emit() })))));
14206
14601
  }
14207
14602
  static get style() { return sdPopupCss(); }
14208
14603
  static get cmpMeta() { return {
@@ -14493,7 +14888,7 @@ class SdPortal {
14493
14888
  this.close.emit();
14494
14889
  }
14495
14890
  render() {
14496
- return hAsync("slot", { key: '623ee5423b145701ba9dd801d44874214f7a76e3' });
14891
+ return hAsync("slot", { key: '8b2a674bbd8c75c150940d53c0e5204e951cbb82' });
14497
14892
  }
14498
14893
  static get watchers() { return {
14499
14894
  "open": [{
@@ -14608,6 +15003,8 @@ class SdRadio {
14608
15003
  disabled = false;
14609
15004
  /** 표시할 라벨 텍스트 */
14610
15005
  label;
15006
+ /** native radio 그룹핑을 위한 name 속성 (미지정 시 val을 name으로 사용) */
15007
+ name;
14611
15008
  /** 선택 값이 변경될 때 발생합니다. */
14612
15009
  update;
14613
15010
  valueChanged(newValue) {
@@ -14651,7 +15048,7 @@ class SdRadio {
14651
15048
  '--sd-radio-label-color': RADIO_COLORS.label.default,
14652
15049
  '--sd-radio-label-disabled-color': RADIO_COLORS.label.disabled,
14653
15050
  };
14654
- return (hAsync("label", { key: 'cc7ff62ac992791ef81db9212bb5986989f6b4d6', class: this.radioClasses, style: cssVars, "aria-checked": this.isSelected ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false' }, hAsync("input", { key: '20bfeaf5bc322335f5300955ebf653213d662fa6', 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: '61d8bdfdb5f8309b8832b89ea2979db5b80968c8', class: "sd-radio__circle" }), this.label && (hAsync("span", { key: 'cc2a5402e4745aaae897c8f37d5fc287a2ba9b29', class: "sd-radio__label", "data-label": this.label }, this.label))));
15051
+ return (hAsync("label", { key: 'c4179fa98fcfdb885e7760a99acad56106cf2445', class: this.radioClasses, style: cssVars, "aria-checked": this.isSelected ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false' }, hAsync("input", { key: '0fe92e2cf0a539ebe2562e907f41c0055eb5d54e', type: "radio", name: this.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: 'abf2338b324ee693edf3c98564f2e8f63028e584', class: "sd-radio__circle" }), this.label && (hAsync("span", { key: '738c30cf39dd497bc2b710d5384be9634bbf74bf', class: "sd-radio__label", "data-label": this.label }, this.label))));
14655
15052
  }
14656
15053
  static get watchers() { return {
14657
15054
  "value": [{
@@ -14666,7 +15063,8 @@ class SdRadio {
14666
15063
  "value": [1032],
14667
15064
  "val": [8],
14668
15065
  "disabled": [4],
14669
- "label": [1]
15066
+ "label": [1],
15067
+ "name": [1]
14670
15068
  },
14671
15069
  "$listeners$": undefined,
14672
15070
  "$lazyBundleId$": "-",
@@ -14776,7 +15174,7 @@ class SdRadioButton {
14776
15174
  registerInstance(this, hostRef);
14777
15175
  this.change = createEvent(this, "sdUpdate", 7);
14778
15176
  }
14779
- /** 현재 선택된 값 */
15177
+ /** 현재 선택된 값 (미지정 시 선택 없음) */
14780
15178
  value;
14781
15179
  /** 라디오 버튼 옵션 목록 */
14782
15180
  options = [];
@@ -14856,7 +15254,7 @@ class SdRadioButton {
14856
15254
  '--sd-radio-button-content-select': RADIO_BUTTON_COLORS.content.select,
14857
15255
  '--sd-radio-button-content-disabled': RADIO_BUTTON_COLORS.content.disabled,
14858
15256
  };
14859
- return (hAsync("div", { key: '17355ebde09f652f5b94b4f70f09f68ef44cd29d', class: this.getGroupClasses(), style: cssVars, role: "radiogroup", "aria-disabled": this.disabled.toString() }, this.options.map(option => {
15257
+ return (hAsync("div", { key: '7621cf9885bb69bc18083dc076b4e6babc86ff62', class: this.getGroupClasses(), style: cssVars, role: "radiogroup", "aria-disabled": this.disabled.toString() }, this.options.map(option => {
14860
15258
  const isSelected = this.isOptionSelected(option);
14861
15259
  const isDisabled = this.isOptionDisabled(option);
14862
15260
  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)));
@@ -14886,7 +15284,7 @@ class SdRadioGroup {
14886
15284
  registerInstance(this, hostRef);
14887
15285
  this.change = createEvent(this, "sdUpdate", 7);
14888
15286
  }
14889
- /** 현재 선택된 값 */
15287
+ /** 현재 선택된 값 (미지정 시 선택 없음) */
14890
15288
  value;
14891
15289
  /** 라디오 옵션 목록 */
14892
15290
  options = [];
@@ -14914,8 +15312,8 @@ class SdRadioGroup {
14914
15312
  return classes.join(' ');
14915
15313
  }
14916
15314
  render() {
14917
- return (hAsync("div", { key: 'e5f4051ea9b2843816a849a018b8040e7b951a55', class: this.getGroupClasses(), role: "radiogroup" }, this.options.map(option => {
14918
- 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) }));
15315
+ return (hAsync("div", { key: '7ee8aaf1872ac215e7d4c27e71d4a0a41c6f5e4e', class: this.getGroupClasses(), role: "radiogroup" }, this.options.map(option => {
15316
+ 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) }));
14919
15317
  })));
14920
15318
  }
14921
15319
  static get watchers() { return {
@@ -15230,15 +15628,15 @@ class SdSelect {
15230
15628
  this.closeDropdown();
15231
15629
  },
15232
15630
  };
15233
- return (hAsync("sd-field", { key: '13ca7b4ddb0e124e90dd2b843df9a11b7cc98487', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, 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: () => {
15631
+ return (hAsync("sd-field", { key: 'a8107af7c63f38eee519b44e33021f3d650c97a4', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, 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: () => {
15234
15632
  this.hovered = true;
15235
15633
  }, onMouseLeave: () => {
15236
15634
  this.hovered = false;
15237
- } }, hAsync("div", { key: '3892e98679d28ed6199578f1033571fec2137143', class: "sd-select", ref: el => {
15635
+ } }, hAsync("div", { key: 'd1b3c4d6f1da7ca9eeb31a19db7dd7b28a94103d', class: "sd-select", ref: el => {
15238
15636
  this.triggerRef = el;
15239
- } }, hAsync("sd-select-trigger", { key: '150dda9f50762bedc538181d8c1e5623e8d3fbac', ref: el => {
15637
+ } }, hAsync("sd-select-trigger", { key: 'c2ce229c398cf35aa1cdc58a12eb7ed81f316d0d', ref: el => {
15240
15638
  this.triggerComponentRef = el;
15241
- }, displayText: this.displayText, placeholder: this.placeholder ?? '선택', disabled: this.disabled, isOpen: this.isOpen, onSdTriggerClick: this.handleTriggerClick, onSdTriggerFocus: this.handleTriggerFocus, onSdTriggerBlur: this.handleTriggerBlur })), (this.isOpen || this.isAnimatingOut) && (hAsync("sd-portal", { key: '554e158719e791600a6215223a5c0c7ac289b00a', ...portalProps }, hAsync("sd-select-listbox", { key: 'c309fdfc53ff0c970ff33eb9eeec58636a869408', type: this.type, options: this.options, value: this.value, emitValue: this.emitValue, useSearch: this.useSearch, useSelectAll: this.useSelectAll, triggerWidth: this.dropdownWidth || this.triggerWidth, maxWidth: this.resolvedMaxDropdownWidth, maxHeight: this.resolvedDropdownHeight, onSdOptionSelect: event => this.handleOptionSelect(event.detail) })))));
15639
+ }, displayText: this.displayText, placeholder: this.placeholder ?? '선택', disabled: this.disabled, isOpen: this.isOpen, onSdTriggerClick: this.handleTriggerClick, onSdTriggerFocus: this.handleTriggerFocus, onSdTriggerBlur: this.handleTriggerBlur })), (this.isOpen || this.isAnimatingOut) && (hAsync("sd-portal", { key: '1f67ba5abb693d49b2e332edb991bf89edbc2456', ...portalProps }, hAsync("sd-select-listbox", { key: '108acb8763dc0cf4bd7e807643140a9f41381248', type: this.type, options: this.options, value: this.value, emitValue: this.emitValue, useSearch: this.useSearch, useSelectAll: this.useSelectAll, triggerWidth: this.dropdownWidth || this.triggerWidth, maxWidth: this.resolvedMaxDropdownWidth, maxHeight: this.resolvedDropdownHeight, onSdOptionSelect: event => this.handleOptionSelect(event.detail) })))));
15242
15640
  }
15243
15641
  static get watchers() { return {
15244
15642
  "isOpen": [{
@@ -15499,7 +15897,7 @@ class SdSelectListItem {
15499
15897
  return (
15500
15898
  // 키보드 네비게이션은 부모 listbox 의 ArrowUp/Down + Enter 가 담당. 항목 자체는 role=option, tabindex=-1 으로 표시.
15501
15899
  // eslint-disable-next-line jsx-a11y/click-events-have-key-events
15502
- hAsync("div", { key: '86ebbdb437d7799cefb9a9466997df44ea346e44', role: "option", tabindex: -1, "aria-selected": this.isSelected === true ? 'true' : 'false', class: {
15900
+ hAsync("div", { key: '4fff470052d5d02cddf204f33df24247e087a55d', role: "option", tabindex: -1, "aria-selected": this.isSelected === true ? 'true' : 'false', class: {
15503
15901
  'sd-select-list-item': true,
15504
15902
  'sd-select-list-item--group': isGroup,
15505
15903
  'sd-select-list-item--depth1-group': isDepth1Group,
@@ -15509,7 +15907,7 @@ class SdSelectListItem {
15509
15907
  'sd-select-list-item--focused': this.isFocused,
15510
15908
  'sd-select-list-item--selectable': this.isSelectable && !this.option.disabled,
15511
15909
  'sd-select-list-item--disabled': !!this.option.disabled,
15512
- }, style: cssVars, onClick: this.handleClick }, this.useCheckbox && (hAsync("sd-checkbox", { key: '297067b88bedf8eed648f60050688e23e9dfcbdd', value: this.isSelected === null ? null : !!this.isSelected, disabled: this.option.disabled, inverse: this.isFocused && this.isSelected !== false, class: "sd-select-list-item__checkbox", onClick: this.handleCheckboxClick, onSdUpdate: this.handleCheckboxUpdate })), isHtmlLabel(this.option.label) ? (hAsync("span", { class: "sd-select-list-item__label", ref: el => el && (el.innerHTML = sanitizeInlineHtml(this.option.label)) })) : (hAsync("span", { class: "sd-select-list-item__label" }, this.option.label)), this.countInfo && (hAsync("span", { key: 'e71dbbfcd454a43fe2364aa0205f14805de20653', class: "sd-select-list-item__count" }, "(", this.countInfo.selected, "/", this.countInfo.total, ")"))));
15910
+ }, style: cssVars, onClick: this.handleClick }, this.useCheckbox && (hAsync("sd-checkbox", { key: '45649f31743eac574560399b07c9ba94d7185013', value: this.isSelected === null ? null : !!this.isSelected, disabled: this.option.disabled, inverse: this.isFocused && this.isSelected !== false, class: "sd-select-list-item__checkbox", onClick: this.handleCheckboxClick, onSdUpdate: this.handleCheckboxUpdate })), isHtmlLabel(this.option.label) ? (hAsync("span", { class: "sd-select-list-item__label", ref: el => el && (el.innerHTML = sanitizeInlineHtml(this.option.label)) })) : (hAsync("span", { class: "sd-select-list-item__label" }, this.option.label)), this.countInfo && (hAsync("span", { key: '2e2c1dca85ed4be38cf8435df86f8ea4b7273673', class: "sd-select-list-item__count" }, "(", this.countInfo.selected, "/", this.countInfo.total, ")"))));
15513
15911
  }
15514
15912
  static get style() { return sdSelectListItemCss(); }
15515
15913
  static get cmpMeta() { return {
@@ -15581,15 +15979,15 @@ class SdSelectListItemSearch {
15581
15979
  clearTimeout(this.debounceTimer);
15582
15980
  }
15583
15981
  render() {
15584
- return (hAsync("div", { key: 'fd13ed863fa624bb672a80594a1397831c55b859', class: {
15982
+ return (hAsync("div", { key: '3231c0ea91e678a71cac6a1c5805fa255a96deb2', class: {
15585
15983
  'sd-select-list-item-search': true,
15586
15984
  'sd-select-list-item-search--scrolled': this.isScrolled,
15587
- } }, hAsync("div", { key: 'c36783523de2c29b04ce300307770a666daad9df', class: "sd-select-list-item-search__inner" }, hAsync("sd-icon", { key: '6e21aebf25090024c882dda1e9fec46219dce8ee', name: "search", size: 16, color: "grey_70", class: "sd-select-list-item-search__icon" }), hAsync("input", { key: '2ed89f33de74c98cde3caa4e8924ef2e7b3baa0f', ref: el => {
15985
+ } }, hAsync("div", { key: 'f25df864ea6bbe2db7c0ca8e1abc0645f11b12f3', class: "sd-select-list-item-search__inner" }, hAsync("sd-icon", { key: '494d5b964543e3a595629c02ef7b61b492d26eed', name: "search", size: 16, color: "grey_70", class: "sd-select-list-item-search__icon" }), hAsync("input", { key: '475b925b7987d98fb0a46d6b63a0a9edd2db00ae', ref: el => {
15588
15986
  this.inputEl = el;
15589
- }, type: "text", class: "sd-select-list-item-search__input", placeholder: "\uAC80\uC0C9\uC5B4 \uC785\uB825", value: this.searchText, onInput: this.handleInput, onFocus: () => this.searchFocus.emit() }), hAsync("button", { key: 'c16ed94bbddd24e829548b4ff063a6a3095f955a', type: "button", class: {
15987
+ }, type: "text", class: "sd-select-list-item-search__input", placeholder: "\uAC80\uC0C9\uC5B4 \uC785\uB825", value: this.searchText, onInput: this.handleInput, onFocus: () => this.searchFocus.emit() }), hAsync("button", { key: '26fa161589df77bea51e4568bfd2d501008a0846', type: "button", class: {
15590
15988
  'sd-select-list-item-search__clear': true,
15591
15989
  'sd-select-list-item-search__clear--hidden': this.searchText === '',
15592
- }, onClick: this.handleClear, tabindex: this.searchText !== '' ? 0 : -1, "aria-hidden": this.searchText !== '' ? 'false' : 'true' }, hAsync("sd-icon", { key: 'f2808e3b1b5ae6937bd818e4f29f999d04286b60', name: "close", size: 12, color: "#888888" })))));
15990
+ }, onClick: this.handleClear, tabindex: this.searchText !== '' ? 0 : -1, "aria-hidden": this.searchText !== '' ? 'false' : 'true' }, hAsync("sd-icon", { key: 'aca5037c9dbc171f201cc02e7a2d00f49e6e6397', name: "close", size: 12, color: "#888888" })))));
15593
15991
  }
15594
15992
  static get style() { return sdSelectListItemSearchCss(); }
15595
15993
  static get cmpMeta() { return {
@@ -15973,9 +16371,9 @@ class SdSelectListbox {
15973
16371
  '--listbox-max-height': this.maxHeight ?? '260px',
15974
16372
  '--listbox-radius': `${LIST_BOX_LAYOUT.radius}px`,
15975
16373
  };
15976
- return (hAsync("div", { key: 'cec8e4e12dd806a93375853386a1d7cc3ac6b269', class: "sd-select-listbox", style: cssVars }, this.showSearch && (hAsync("sd-select-list-item-search", { key: '9e07a7e742e956df314796e9babf6c0a7fb21d7f', isScrolled: this.isScrolled, onSdSearchFilter: this.handleSearchFilter })), hAsync("div", { key: 'd5ff5620c63b5c53e69b6348f2c9cd6cb73cbe88', class: "sd-select-listbox__list", onScroll: this.handleScroll, ref: el => {
16374
+ return (hAsync("div", { key: '1686c9749284be82edcf4eaf9c4741e1be3920d4', class: "sd-select-listbox", style: cssVars }, this.showSearch && (hAsync("sd-select-list-item-search", { key: '934e1bf38324bda71e0c4c956fd8ad82eb9c4f46', isScrolled: this.isScrolled, onSdSearchFilter: this.handleSearchFilter })), hAsync("div", { key: '33ec8b142a0f60b329fcd58bc8952d3577c92f83', class: "sd-select-listbox__list", onScroll: this.handleScroll, ref: el => {
15977
16375
  this.listEl = el;
15978
- } }, this.showSelectAll && (hAsync("sd-select-list-item", { key: '9b36cdd7466b639c65497da94ee1e3c5129566cb', option: SdSelectListbox.SELECT_ALL_OPTION, depth: 1, isSelected: this.selectAllState, isFocused: this.isOptionFocused(SdSelectListbox.SELECT_ALL_OPTION), useCheckbox: true, onSdListItemClick: this.handleSelectAllClick, onMouseEnter: () => this.handleOptionHover(SdSelectListbox.SELECT_ALL_OPTION) })), this.isEmpty ? (hAsync("div", { class: "sd-select-listbox__empty" }, EMPTY_MESSAGE)) : this.isDepth ? (this.renderOptions(this.filteredOptions)) : (this.filteredOptions.map(option => (hAsync("sd-select-list-item", { option: option, depth: 1, isSelected: this.isOptionSelected(option), isFocused: this.isOptionFocused(option), useCheckbox: this.isMulti, onSdListItemClick: this.handleOptionClick, onMouseEnter: () => this.handleOptionHover(option) })))))));
16376
+ } }, this.showSelectAll && (hAsync("sd-select-list-item", { key: '46d1f11884ed2fa9a55144fbf0633cb78f2f8ec3', option: SdSelectListbox.SELECT_ALL_OPTION, depth: 1, isSelected: this.selectAllState, isFocused: this.isOptionFocused(SdSelectListbox.SELECT_ALL_OPTION), useCheckbox: true, onSdListItemClick: this.handleSelectAllClick, onMouseEnter: () => this.handleOptionHover(SdSelectListbox.SELECT_ALL_OPTION) })), this.isEmpty ? (hAsync("div", { class: "sd-select-listbox__empty" }, EMPTY_MESSAGE)) : this.isDepth ? (this.renderOptions(this.filteredOptions)) : (this.filteredOptions.map(option => (hAsync("sd-select-list-item", { option: option, depth: 1, isSelected: this.isOptionSelected(option), isFocused: this.isOptionFocused(option), useCheckbox: this.isMulti, onSdListItemClick: this.handleOptionClick, onMouseEnter: () => this.handleOptionHover(option) })))))));
15979
16377
  }
15980
16378
  static get watchers() { return {
15981
16379
  "searchKeyword": [{
@@ -16064,7 +16462,7 @@ class SdSelectTrigger {
16064
16462
  ? SELECT_COLORS.icon.disabled
16065
16463
  : SELECT_COLORS.icon.default,
16066
16464
  };
16067
- return (hAsync("div", { key: '2ec5e736c0742a10fdfa9b4b12b0820e99c30f7f', ref: el => {
16465
+ return (hAsync("div", { key: '3e5b42da3a391f52f597594ccf9ebf9e9b236ccc', ref: el => {
16068
16466
  this.triggerEl = el;
16069
16467
  }, role: "button", "aria-haspopup": "listbox", "aria-expanded": this.isOpen ? 'true' : 'false', tabindex: this.disabled ? -1 : 0, class: {
16070
16468
  'sd-select-trigger': true,
@@ -16075,7 +16473,7 @@ class SdSelectTrigger {
16075
16473
  e.preventDefault();
16076
16474
  this.handleClick();
16077
16475
  }
16078
- }, onFocus: this.handleFocus, onBlur: this.handleBlur }, hAsync("div", { key: '6b71e60a76d430bfe14bc5b7c59d82130be27c8a', class: "sd-select-trigger__content" }, hasValue && isHtmlLabel(this.displayText) ? (hAsync("span", { class: "sd-select-trigger__text", ref: el => el && (el.innerHTML = sanitizeInlineHtml(this.displayText)) })) : (hAsync("span", { class: "sd-select-trigger__text" }, hasValue ? this.displayText : (this.placeholder ?? '선택'))), hAsync("sd-icon", { key: 'e34eae87f518f1b015e1d59bacf97bec66b6ec6d', name: "chevronDown", size: 12, color: "var(--trigger-icon-color)", class: {
16476
+ }, onFocus: this.handleFocus, onBlur: this.handleBlur }, hAsync("div", { key: '56938d493425d54b2c69840014b0354674fcf9d6', class: "sd-select-trigger__content" }, hasValue && isHtmlLabel(this.displayText) ? (hAsync("span", { class: "sd-select-trigger__text", ref: el => el && (el.innerHTML = sanitizeInlineHtml(this.displayText)) })) : (hAsync("span", { class: "sd-select-trigger__text" }, hasValue ? this.displayText : (this.placeholder ?? '선택'))), hAsync("sd-icon", { key: '90e7df2f8bd416ccd1545c78c79f02746c119db3', name: "chevronDown", size: 12, color: "var(--trigger-icon-color)", class: {
16079
16477
  'sd-select-trigger__icon': true,
16080
16478
  'sd-select-trigger__icon--open': this.isOpen,
16081
16479
  } }))));
@@ -16162,7 +16560,14 @@ class SdSwitch {
16162
16560
  }
16163
16561
  /** 현재 on/off 상태 */
16164
16562
  value = false;
16165
- /** 표시할 라벨 텍스트 */
16563
+ /** 스위치 좌측 라벨 */
16564
+ leftLabel;
16565
+ /** 스위치 우측 라벨 */
16566
+ rightLabel;
16567
+ /**
16568
+ * 표시할 라벨 텍스트
16569
+ * @deprecated `rightLabel` 사용. 우측 라벨(하위호환)
16570
+ */
16166
16571
  label = '';
16167
16572
  /** 비활성 상태 여부 */
16168
16573
  disabled = false;
@@ -16204,7 +16609,10 @@ class SdSwitch {
16204
16609
  '--sd-switch-line-height': `${SWITCH_TYPOGRAPHY.lineHeight}px`,
16205
16610
  '--sd-switch-text-decoration': SWITCH_TYPOGRAPHY.textDecoration,
16206
16611
  };
16207
- return (hAsync("label", { key: '96321de1da84594a8c4fc760c44e49f12168be13', "aria-label": this.label || 'switch', class: this.switchClasses, style: cssVars }, hAsync("input", { key: '5c89628f13ef22e19fadc53eea7e42428e783e83', type: "checkbox", checked: this.value, disabled: this.disabled, onInput: this.handleChange }), hAsync("div", { key: '11aa858c208ae5fb7c0f782e857abced64bcb0c3', class: "sd-switch__track" }, hAsync("div", { key: '9fc34ece3e66ca3c60824e44123d98a4179924ee', class: "sd-switch__knob" })), this.label && hAsync("span", { key: '1439b0ef2b5511560e5737452d1d21e74801e325', class: "sd-switch__label" }, this.label)));
16612
+ // label(deprecated)은 rightLabel 로 흡수 (하위호환)
16613
+ const right = this.rightLabel ?? this.label;
16614
+ const accessibleName = [this.leftLabel, right].filter(Boolean).join(' ') || 'switch';
16615
+ return (hAsync("label", { key: '617ec652e8878aa41abd2d376479730e4db69025', "aria-label": accessibleName, class: this.switchClasses, style: cssVars }, hAsync("input", { key: 'd765a1b3038d2decec2bf561d96a201cb617b40d', type: "checkbox", checked: this.value, disabled: this.disabled, onInput: this.handleChange }), this.leftLabel && hAsync("span", { key: '2c6e398e7f926d3d9d9049aa1aa3fe459b92f51e', class: "sd-switch__label" }, this.leftLabel), hAsync("div", { key: 'c71fdd196c0d50ce499c4c524005d01b834d066a', class: "sd-switch__track" }, hAsync("div", { key: 'eabac4c3305fabf2e857fc8066a9acb80f90bf31', class: "sd-switch__knob" })), right && hAsync("span", { key: '41a0f8ffd56791138b605379f88545b6e20d8df3', class: "sd-switch__label" }, right)));
16208
16616
  }
16209
16617
  static get style() { return sdSwitchCss(); }
16210
16618
  static get cmpMeta() { return {
@@ -16212,6 +16620,8 @@ class SdSwitch {
16212
16620
  "$tagName$": "sd-switch",
16213
16621
  "$members$": {
16214
16622
  "value": [1028],
16623
+ "leftLabel": [1, "left-label"],
16624
+ "rightLabel": [1, "right-label"],
16215
16625
  "label": [1],
16216
16626
  "disabled": [4]
16217
16627
  },
@@ -16426,7 +16836,7 @@ class SdTabs {
16426
16836
  };
16427
16837
  }
16428
16838
  render() {
16429
- return (hAsync("div", { key: '4306137f9dd004ec5ef43b8bdd9e3614adab23ed', class: this.getContainerClasses(), style: this.buildCssVars() }, this.tabs.map((tab, index) => {
16839
+ return (hAsync("div", { key: 'd8d86075bbf5e13444f99e57cf63c2f5b9ef28fc', class: this.getContainerClasses(), style: this.buildCssVars() }, this.tabs.map((tab, index) => {
16430
16840
  const badgeName = this.getBadgeName(tab);
16431
16841
  return (hAsync("div", { key: `tab-${index}`, role: "tab", tabindex: 0, "aria-selected": tab.value === this.value ? 'true' : 'false', class: this.getTabClasses(tab), "aria-label": tab.label || 'tab', onClick: () => this.handleTabClick(tab), onKeyDown: e => {
16432
16842
  if (e.key === 'Enter' || e.key === ' ') {
@@ -16644,9 +17054,8 @@ class SdTag {
16644
17054
  label = '';
16645
17055
  /** 아이콘명 */
16646
17056
  icon;
16647
- // 아이콘이 좌측 배치되는 게 자연스러운 default. prop 이름 변경(isRight 등)은 public API breaking 이라 별도 이슈로 분리.
16648
- /** true이면 아이콘을 레이블 왼쪽에 배치 */
16649
- isLeft = true;
17057
+ /** 아이콘을 레이블 왼쪽에 배치할지 여부 (기본값 true) */
17058
+ iconLeft = true;
16650
17059
  /** 태그 너비 (숫자면 px, 문자열이면 그대로 적용). 미지정 시 콘텐츠 크기(fit-content) */
16651
17060
  width = '';
16652
17061
  componentWillLoad() {
@@ -16675,7 +17084,7 @@ class SdTag {
16675
17084
  const config = this.resolvedConfig;
16676
17085
  const iconNode = this.renderIcon(config.icon, config.iconSize);
16677
17086
  const width = this.resolvedWidth;
16678
- return (hAsync(Host, { key: '9eb41b65a887a524d22e0a2663292de1f12674f6', style: width != null ? { '--sd-tag-width': width } : undefined }, hAsync("span", { key: '2c08b419141250c00e6ef1aec1c691c1a41434c0', class: "sd-tag", style: {
17087
+ return (hAsync(Host, { key: '9e893a8ec67d1baa12cdfe030d3ae15798666c0c', style: width != null ? { '--sd-tag-width': width } : undefined }, hAsync("span", { key: 'fe6b05143032b33bec7cc95ce5355701e894d0ea', class: "sd-tag", style: {
16679
17088
  '--sd-tag-background': config.background,
16680
17089
  '--sd-tag-content': config.content,
16681
17090
  '--sd-tag-height': config.height,
@@ -16685,7 +17094,7 @@ class SdTag {
16685
17094
  '--sd-tag-font-weight': config.fontWeight,
16686
17095
  '--sd-tag-line-height': config.lineHeight,
16687
17096
  '--sd-tag-radius': config.radius,
16688
- }, "aria-label": this.label || 'tag' }, this.icon && this.isLeft && iconNode, hAsync("span", { key: '5041322f15e5273cc3129f57958dc97fdce8c50c', class: "sd-tag__label" }, this.label), this.icon && !this.isLeft && iconNode)));
17097
+ }, "aria-label": this.label || 'tag' }, this.icon && this.iconLeft && iconNode, hAsync("span", { key: '9c4a07ac015672839dc5dda40d01609870979e04', class: "sd-tag__label" }, this.label), this.icon && !this.iconLeft && iconNode)));
16689
17098
  }
16690
17099
  static get style() { return sdTagCss(); }
16691
17100
  static get cmpMeta() { return {
@@ -16695,7 +17104,7 @@ class SdTag {
16695
17104
  "name": [1],
16696
17105
  "label": [1],
16697
17106
  "icon": [1],
16698
- "isLeft": [4, "is-left"],
17107
+ "iconLeft": [4, "icon-left"],
16699
17108
  "width": [8]
16700
17109
  },
16701
17110
  "$listeners$": undefined,
@@ -16875,7 +17284,7 @@ class SdTextLink {
16875
17284
  };
16876
17285
  const tooltipText = (this.tooltipText ?? '').trim();
16877
17286
  const hasTooltip = tooltipText.length > 0;
16878
- return (hAsync("span", { key: 'd9653ed47a77fb5c00dc57f8f7cc2b4dc9035ca4', role: "button", tabindex: this.disabled ? -1 : 0, class: {
17287
+ return (hAsync("span", { key: '363829c6d53fc3df03dee7ddd290ca078c255039', role: "button", tabindex: this.disabled ? -1 : 0, class: {
16879
17288
  'sd-text-link': true,
16880
17289
  'sd-text-link--disabled': this.disabled,
16881
17290
  }, style: cssVars, onClick: this.handleClick, onKeyDown: e => {
@@ -16883,13 +17292,13 @@ class SdTextLink {
16883
17292
  e.preventDefault();
16884
17293
  this.handleClick();
16885
17294
  }
16886
- }, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onFocus: this.handleFocus, onBlur: this.handleBlur }, hasTooltip && this.isTooltipOpen && (hAsync("sd-portal", { key: '62b3cb48c5b5fa6eb0b2b2962ef6c78bac5ac545', parentRef: this.hostEl, open: true, offset: [this.hostEl.offsetWidth / 2, 4], placement: "top" }, hAsync("div", { key: '5a428366f5bc2f8686a78fc73d91517ccca13eb9', class: "sd-text-link__tooltip-inner", "aria-hidden": "true" }, hAsync("sd-tag", { key: '3416662595e9bfd164279e684e2ead9d1575a9d8', name: "square_xs_grey", label: tooltipText })))), this.icon && (hAsync("sd-icon", { key: '5056f0c55ebe92963e856f2970cfd74143876cfb', name: this.icon, size: sizeConfig.iconSize, color: iconColor, class: "sd-text-link__icon" })), hAsync("span", { key: '6cf8474ba642c9ec3dc5952c5530f9ba15046053', class: labelClassName }, this.label), this.rightArrow && this.rightArrow !== 'none' && (hAsync("span", { key: '17a74ec3a3e1a26f18b73f7d4816ea0aee0cb22c', class: "sd-text-link__arrow", style: {
17295
+ }, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onFocus: this.handleFocus, onBlur: this.handleBlur }, hasTooltip && this.isTooltipOpen && (hAsync("sd-portal", { key: '4dcb8ca39f7b9627b5f77885c0823848d0aa5a5f', parentRef: this.hostEl, open: true, offset: [this.hostEl.offsetWidth / 2, 4], placement: "top" }, hAsync("div", { key: '7bbcabbd9d9bb3594d8c4817dbbb922018bbbd19', class: "sd-text-link__tooltip-inner", "aria-hidden": "true" }, hAsync("sd-tag", { key: '313c23dc9caf81d885ebf288c475ebe01bd24515', name: "square_xs_grey", label: tooltipText })))), this.icon && (hAsync("sd-icon", { key: '2668c579bc22547b542ca2045f9af0fad25a5ee7', name: this.icon, size: sizeConfig.iconSize, color: iconColor, class: "sd-text-link__icon" })), hAsync("span", { key: '28246109bab90175498e841ecb02ac4a53a992b8', class: labelClassName }, this.label), this.rightArrow && this.rightArrow !== 'none' && (hAsync("span", { key: 'c157788957cbba17a1411ebb329897fc6524171d', class: "sd-text-link__arrow", style: {
16887
17296
  width: `${TEXT_LINK_ARROW.arrowFrame}px`,
16888
17297
  height: `${TEXT_LINK_ARROW.arrowFrame}px`,
16889
17298
  display: 'inline-flex',
16890
17299
  alignItems: 'center',
16891
17300
  justifyContent: 'center',
16892
- } }, hAsync("sd-icon", { key: 'ed0a6bf8b678a93fa8a0da907efb0cbf60427738', name: this.rightArrow === 'chevron' ? 'chevronRight' : 'caretRight', size: TEXT_LINK_ARROW.arrowIconSize, color: arrowColor })))));
17301
+ } }, hAsync("sd-icon", { key: 'b74ca3398a1dd74ac5a9f7a16c872d313882fd4d', name: this.rightArrow === 'chevron' ? 'chevronRight' : 'caretRight', size: TEXT_LINK_ARROW.arrowIconSize, color: arrowColor })))));
16893
17302
  }
16894
17303
  static get style() { return sdTextLinkCss(); }
16895
17304
  static get cmpMeta() { return {
@@ -17073,7 +17482,7 @@ class SdTextarea {
17073
17482
  '--sd-system-size-field-sm-height': 'auto',
17074
17483
  '--sd-system-radius-field-sm': `${TEXTAREA_TOKENS.radius}px`,
17075
17484
  };
17076
- return (hAsync("sd-field", { key: '2f967ed7e9d9e419376162f9569847b931f126d5', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, readonly: this.readonly, 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: 'aa4f554c200a1b0aeadf4cac635facfabb158b90', class: "sd-textarea__content" }, hAsync("textarea", { key: 'fe0026af57e40e6d4fb8e16c87985352de401fa5', 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 }))));
17485
+ return (hAsync("sd-field", { key: 'f8fd8949824938bb79f101de2e5eca7980224b09', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, readonly: this.readonly, 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: '382441be15dd047888cf876006f1966256a503b7', class: "sd-textarea__content" }, hAsync("textarea", { key: '5f5985ccdcc401f4aff2f47fe40003abeb76e8b3', 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 }))));
17077
17486
  }
17078
17487
  static get watchers() { return {
17079
17488
  "value": [{
@@ -17127,162 +17536,1242 @@ class SdTextarea {
17127
17536
  }; }
17128
17537
  }
17129
17538
 
17130
- const toast = {
17131
- icon: "16",
17132
- "default": {
17133
- bg: "#07284A",
17134
- content: "#FFFFFF"
17539
+ const timepicker = {
17540
+ border: {
17541
+ "default": "#AAAAAA",
17542
+ focus: "#0075FF",
17543
+ width: "1"
17135
17544
  },
17136
- danger: {
17137
- bg: "#FB4444",
17138
- content: "#FFFFFF"
17545
+ bg: {
17546
+ "default": "#FFFFFF",
17547
+ disabled: "#E1E1E1"
17139
17548
  },
17140
- caution: {
17141
- bg: "#FFC700",
17142
- content: "#222222"
17549
+ icon: {
17550
+ "default": "#888888",
17551
+ disabled: "#BBBBBB"
17143
17552
  },
17144
- complete: {
17145
- bg: "#00973C",
17146
- content: "#FFFFFF"
17553
+ text: {
17554
+ "default": "#222222",
17555
+ disabled: "#888888"
17147
17556
  },
17148
- accent: {
17149
- bg: "#005CC9",
17150
- content: "#FFFFFF"
17557
+ selector: {
17558
+ bg: "#FFFFFF",
17559
+ range: {
17560
+ heading: {
17561
+ color: "#555555",
17562
+ gap: "16"
17563
+ },
17564
+ paddingXY: "24",
17565
+ panelGap: "24",
17566
+ section: {
17567
+ gap: "12"
17568
+ }
17569
+ },
17570
+ radius: "8",
17571
+ section: {
17572
+ paddingX: "16",
17573
+ paddingY: "12"
17574
+ },
17575
+ time: {
17576
+ gap: "4",
17577
+ column: {
17578
+ gap: "8"
17579
+ }
17580
+ },
17581
+ input: {
17582
+ width: "40"
17583
+ },
17584
+ colon: {
17585
+ size: "16"
17586
+ }
17151
17587
  },
17152
- info: {
17153
- bg: "#E6F1FF",
17154
- icon: "#0075FF",
17155
- text: "#222222",
17156
- textLink: "#555555"
17588
+ sm: {
17589
+ height: "28",
17590
+ paddingX: "12",
17591
+ gap: "8",
17592
+ icon: "16",
17593
+ radius: "4"
17594
+ },
17595
+ md: {
17596
+ height: "36",
17597
+ paddingX: "16",
17598
+ gap: "12",
17599
+ icon: "20",
17600
+ radius: "6"
17157
17601
  }
17158
17602
  };
17159
- var toastTokens = {
17160
- toast: toast
17603
+ var timepickerTokens = {
17604
+ timepicker: timepicker
17161
17605
  };
17162
17606
 
17163
- const TOAST_BUTTON_NAME_BY_TYPE = {
17164
- default: 'secondary_sm',
17165
- danger: 'danger_outline_sm',
17166
- caution: 'neutral_outline_sm',
17167
- complete: 'neutral_outline_sm',
17168
- accent: 'neutral_outline_sm',
17169
- info: 'secondary_sm',
17170
- };
17171
- const TOAST_TYPE_CONFIG = {
17172
- default: { bg: toastTokens.toast.default.bg, content: toastTokens.toast.default.content },
17173
- danger: { bg: toastTokens.toast.danger.bg, content: toastTokens.toast.danger.content },
17174
- caution: { bg: toastTokens.toast.caution.bg, content: toastTokens.toast.caution.content },
17175
- complete: { bg: toastTokens.toast.complete.bg, content: toastTokens.toast.complete.content },
17176
- accent: { bg: toastTokens.toast.accent.bg, content: toastTokens.toast.accent.content },
17177
- info: {
17178
- bg: toastTokens.toast.info.bg,
17179
- content: toastTokens.toast.info.text,
17180
- icon: toastTokens.toast.info.icon,
17181
- linkColor: toastTokens.toast.info.textLink,
17607
+ const sm = timepickerTokens.timepicker.sm;
17608
+ const md = timepickerTokens.timepicker.md;
17609
+ const TIMEPICKER_SIZE_MAP = {
17610
+ sm: {
17611
+ height: sm.height,
17612
+ paddingX: sm.paddingX,
17613
+ gap: sm.gap,
17614
+ iconSize: sm.icon,
17615
+ radius: sm.radius,
17616
+ // TODO: component.timepicker 토큰에 typography가 추가되면 이 fallback을 교체한다.
17617
+ fontSize: '12',
17618
+ lineHeight: '20',
17619
+ fontWeight: '400',
17620
+ minWidth: '128',
17621
+ },
17622
+ md: {
17623
+ height: md.height,
17624
+ paddingX: md.paddingX,
17625
+ gap: md.gap,
17626
+ iconSize: md.icon,
17627
+ radius: md.radius,
17628
+ // TODO: component.timepicker 토큰에 typography가 추가되면 이 fallback을 교체한다.
17629
+ fontSize: '14',
17630
+ lineHeight: '24',
17631
+ fontWeight: '400',
17632
+ minWidth: '160',
17182
17633
  },
17183
17634
  };
17184
- const TOAST_LAYOUT = {
17185
- iconSize: toastTokens.toast.icon,
17635
+ const TIMEPICKER_COLORS = {
17636
+ border: timepickerTokens.timepicker.border,
17637
+ bg: timepickerTokens.timepicker.bg,
17638
+ icon: timepickerTokens.timepicker.icon,
17639
+ text: {
17640
+ ...timepickerTokens.timepicker.text,
17641
+ hint: fieldTokens.field.hint.color,
17642
+ },
17186
17643
  };
17644
+ const TIMEPICKER_SELECTOR = {
17645
+ bg: timepickerTokens.timepicker.selector.bg,
17646
+ radius: timepickerTokens.timepicker.selector.radius,
17647
+ section: timepickerTokens.timepicker.selector.section,
17648
+ time: timepickerTokens.timepicker.selector.time,
17649
+ inputWidth: timepickerTokens.timepicker.selector.input.width,
17650
+ colonSize: timepickerTokens.timepicker.selector.colon.size,
17651
+ range: timepickerTokens.timepicker.selector.range,
17652
+ };
17653
+ function clampTimePart(value, min, max) {
17654
+ if (!Number.isFinite(value))
17655
+ return min;
17656
+ return Math.min(Math.max(value, min), max);
17657
+ }
17658
+ function padTimePart(value) {
17659
+ return String(value).padStart(2, '0');
17660
+ }
17661
+ function parseTimeValue(value) {
17662
+ const match = /^(\d{1,2}):(\d{1,2})$/.exec(value ?? '');
17663
+ if (!match)
17664
+ return { hour: 0, minute: 0 };
17665
+ return {
17666
+ hour: clampTimePart(Number(match[1]), 0, 23),
17667
+ minute: clampTimePart(Number(match[2]), 0, 59),
17668
+ };
17669
+ }
17670
+ function formatTimeValue(hour, minute) {
17671
+ return `${padTimePart(clampTimePart(hour, 0, 23))}:${padTimePart(clampTimePart(minute, 0, 59))}`;
17672
+ }
17673
+ function formatTimeDisplay(value, type) {
17674
+ if (value == null || value === '')
17675
+ return '';
17676
+ const { hour, minute } = parseTimeValue(value);
17677
+ if (type === 'default')
17678
+ return formatTimeValue(hour, minute);
17679
+ const meridiem = hour >= 12 ? '오후' : '오전';
17680
+ const displayHour = hour % 12 === 0 ? 12 : hour % 12;
17681
+ return `${meridiem} ${padTimePart(displayHour)}:${padTimePart(minute)}`;
17682
+ }
17187
17683
 
17188
- const sdToastCss = () => `sd-toast{display:block;width:fit-content;height:fit-content}sd-toast .sd-toast{display:flex;width:fit-content;align-items:center;gap:var(--sd-toast-gap, 16px);padding:var(--sd-toast-padding-y, 12px) var(--sd-toast-padding-x, 24px);border-radius:var(--sd-toast-radius, 8px);background-color:var(--sd-toast-bg);color:var(--sd-toast-text);box-shadow:2px 2px 8px 2px rgba(0, 0, 0, 0.2)}sd-toast .sd-toast__icon{display:flex;align-items:center;flex-shrink:0}sd-toast .sd-toast__content{display:flex;flex:1}sd-toast .sd-toast__message{font-size:14px;line-height:24px;font-weight:500;white-space:nowrap}sd-toast .sd-toast__link{font-size:14px;line-height:24px;font-weight:700;color:var(--sd-toast-link, var(--sd-toast-text));text-decoration:underline;cursor:pointer;transition:opacity 0.2s ease;margin-left:4px;white-space:nowrap}sd-toast .sd-toast__link:hover{opacity:0.8}sd-toast .sd-toast__button{flex-shrink:0}sd-toast .sd-toast__close{flex-shrink:0}`;
17684
+ const sdTimePickerCss = () => `sd-time-picker{display:inline-flex}sd-time-picker sd-portal{display:none}sd-time-picker .sd-time-picker{position:relative;min-width:var(--sd-time-picker-min-width);width:100%;height:100%}`;
17189
17685
 
17190
- class SdToast {
17686
+ class SdTimePicker {
17191
17687
  constructor(hostRef) {
17192
17688
  registerInstance(this, hostRef);
17193
- this.close = createEvent(this, "sdClose", 7);
17194
- this.buttonClick = createEvent(this, "sdButtonClick", 7);
17689
+ this.update = createEvent(this, "sdUpdate", 7);
17690
+ this.dropDownShow = createEvent(this, "sdDropDownShow", 7);
17195
17691
  }
17196
- /** 좌측 아이콘명 */
17197
- icon;
17198
- /** 표시할 메시지 */
17199
- message;
17200
- /** 우측 링크 URL */
17201
- link;
17202
- /** 링크 표시 레이블 (없으면 URL 표시) */
17203
- linkLabel;
17204
- /** 우측 버튼 레이블 */
17205
- buttonLabel;
17206
- /** 닫기 버튼 표시 여부 */
17207
- useClose = false;
17208
- /** 토스트 타입 (색상/아이콘 프리셋) */
17692
+ static CLOSE_ANIMATION_DURATION = 150;
17693
+ get el() { return getElement(this); }
17694
+ /** 선택된 시간 (HH:mm) */
17695
+ value = null;
17696
+ /** 입력 필드 크기 */
17697
+ size = 'sm';
17698
+ /** 표시 타입: default(24시간) / midday(오전·오후) */
17209
17699
  type = 'default';
17210
- /** 닫기 버튼 클릭 또는 자동 닫힘 시 발생합니다. */
17211
- close;
17212
- /** 우측 버튼 클릭 시 발생합니다. */
17213
- buttonClick;
17214
- render() {
17215
- const typeConfig = TOAST_TYPE_CONFIG[this.type] ?? TOAST_TYPE_CONFIG.default;
17216
- const iconSize = Number(TOAST_LAYOUT.iconSize);
17217
- const iconColor = typeConfig.icon ?? typeConfig.content;
17218
- const linkColor = typeConfig.linkColor ?? typeConfig.content;
17219
- const useDefaultCloseIntent = ['default', 'caution', 'info'].includes(this.type);
17220
- const buttonName = TOAST_BUTTON_NAME_BY_TYPE[this.type] ?? TOAST_BUTTON_NAME_BY_TYPE.default;
17221
- return (hAsync("div", { key: 'c402e2eabab8b2d229cc40550d2ffb7c601ad992', style: {
17222
- '--sd-toast-bg': typeConfig.bg,
17223
- '--sd-toast-text': typeConfig.content,
17224
- '--sd-toast-icon': iconColor,
17225
- '--sd-toast-link': linkColor,
17226
- } }, hAsync("div", { key: 'a6dbbc079649181799f434f7158791ec1e52fd4a', class: "sd-toast", role: "status", "aria-live": "polite", "aria-atomic": "true" }, this.icon && (hAsync("div", { key: 'c8210c48776c0722ed025049ebfce5eb8477df0a', class: "sd-toast__icon" }, hAsync("sd-icon", { key: 'ee99941287447694a3aa700281bacdbb5d9605bc', name: this.icon, size: iconSize, color: iconColor }))), hAsync("div", { key: 'f4be8a8599e84bb75aeaa5414cf6ff2cd063e391', class: "sd-toast__content" }, hAsync("span", { key: 'af60e01cf1be615fd3b462885c9060445e49c809', class: "sd-toast__message" }, this.message)), this.link && (hAsync("a", { key: 'cd7bbe3ef56e6f475d4182118321645b444c2334', href: this.link, class: "sd-toast__link", target: "_blank", rel: "noopener noreferrer" }, this.linkLabel || this.link)), this.buttonLabel && (hAsync("sd-button", { key: '87c9a38fead8416d36850ff9247d02a962e92f27', class: "sd-toast__button", name: buttonName, label: this.buttonLabel, onSdClick: (event) => this.buttonClick.emit(event.detail) })), this.useClose && (hAsync("sd-ghost-button", { key: '1af5e0ffa26a26574bb9935fdeb01192895c32eb', class: "sd-toast__close", icon: "close", intent: useDefaultCloseIntent ? 'default' : 'inverse', ariaLabel: "close", size: "xs", onClick: () => this.close.emit() })))));
17700
+ /** 시간 미선택 시 표시할 placeholder */
17701
+ placeholder = '00:00';
17702
+ /** 비활성 상태 여부 */
17703
+ disabled = false;
17704
+ /** 값이 있을 때 지우기 버튼 표시 여부 */
17705
+ clearable = false;
17706
+ /** 오전/오후 선택 표시 여부. 지정하지 않으면 type="midday"일 때만 켜집니다. */
17707
+ useMeridiem;
17708
+ /** 분 증감 단위 */
17709
+ minuteStep = 1;
17710
+ /** 필드 너비 (숫자면 px, 문자열이면 그대로 적용) */
17711
+ width = '';
17712
+ // sd-field 공통 props
17713
+ /** 레이블 텍스트 */
17714
+ label = '';
17715
+ /** 레이블 너비 */
17716
+ labelWidth = '';
17717
+ /** 필드 우측 어드온 레이블 */
17718
+ addonLabel = '';
17719
+ /** 어드온 정렬 방향 */
17720
+ addonAlign = 'start';
17721
+ /** 필드 하단 힌트 텍스트 */
17722
+ hint = '';
17723
+ /** 에러 메시지 */
17724
+ errorMessage = '';
17725
+ /** 유효성 검사 규칙 목록 */
17726
+ rules = [];
17727
+ /** 에러 상태 여부 */
17728
+ error = false;
17729
+ /** 필드 상태 (없으면 error/rules 결과로 자동 결정) */
17730
+ status;
17731
+ /** 레이블 영역 아이콘 */
17732
+ icon = undefined;
17733
+ /** 레이블 툴팁 텍스트 */
17734
+ labelTooltip = '';
17735
+ /** 레이블 툴팁 상세 옵션 */
17736
+ labelTooltipProps = null;
17737
+ isOpen = false;
17738
+ isAnimatingOut = false;
17739
+ focused = false;
17740
+ hovered = false;
17741
+ /** 시간 선택 시 선택된 시간(HH:mm)을 전달합니다. */
17742
+ update;
17743
+ /** 선택기 열림/닫힘 상태가 바뀔 때 발생합니다. */
17744
+ dropDownShow;
17745
+ triggerRef;
17746
+ formField;
17747
+ closeAnimationTimer;
17748
+ /** 폼 연동용 name 속성 */
17749
+ name = nanoid();
17750
+ watchIsOpen(newValue) {
17751
+ this.focused = newValue;
17752
+ this.dropDownShow.emit({ isOpen: newValue });
17227
17753
  }
17228
- static get style() { return sdToastCss(); }
17229
- static get cmpMeta() { return {
17230
- "$flags$": 512,
17231
- "$tagName$": "sd-toast",
17232
- "$members$": {
17233
- "icon": [1],
17234
- "message": [1],
17235
- "link": [1],
17236
- "linkLabel": [1, "link-label"],
17237
- "buttonLabel": [1, "button-label"],
17238
- "useClose": [4, "use-close"],
17239
- "type": [1]
17240
- },
17241
- "$listeners$": undefined,
17242
- "$lazyBundleId$": "-",
17243
- "$attrsToReflect$": []
17244
- }; }
17245
- }
17246
-
17247
- const DEFAULT_DURATION = 4000;
17248
- const DEFAULT_MAX_VISIBLE = 3;
17249
- const DEFAULT_GAP = 8;
17250
- const DEFAULT_Z_INDEX = 999;
17251
- const TRANSITION_DURATION = 400;
17252
- const TRANSITION_FALLBACK_BUFFER = 100;
17253
- const COLLAPSED_SCALE_STEP = 0.05;
17254
- const COLLAPSED_OFFSET_STEP = 8;
17255
-
17256
- const sdToastContainerCss = () => `sd-toast-container{display:block}sd-toast-container .sd-toast-container__item{pointer-events:auto;transition:transform 0.4s ease, opacity 0.4s ease, bottom 0.4s ease, top 0.4s ease}sd-toast-container .sd-toast-container__item::before{content:"";position:absolute;left:0;right:0;top:-8px;bottom:-8px}sd-toast-container .sd-toast-container__item--entering{transition:none}sd-toast-container .sd-toast-container__item--exiting{pointer-events:none}`;
17257
-
17258
- let toastIdCounter = 0;
17259
- class SdToastContainer {
17260
- constructor(hostRef) {
17261
- registerInstance(this, hostRef);
17262
- this.toastShow = createEvent(this, "sdToastShow", 7);
17263
- this.toastDismiss = createEvent(this, "sdToastDismiss", 7);
17754
+ valueChanged(newValue) {
17755
+ if (newValue == null || newValue === '')
17756
+ return;
17757
+ const parsed = parseTimeValue(newValue);
17758
+ const normalized = formatTimeValue(parsed.hour, parsed.minute);
17759
+ if (normalized !== newValue)
17760
+ this.value = normalized;
17264
17761
  }
17265
- get el() { return getElement(this); }
17266
- /** 토스트 표시 위치 */
17267
- position = 'bottom-center';
17268
- /** 동시에 표시할 최대 토스트 수 */
17269
- maxVisible = DEFAULT_MAX_VISIBLE;
17270
- /** 자동 닫힘 지연 시간 (ms, 0이면 자동 닫힘 없음) */
17271
- defaultDuration = DEFAULT_DURATION;
17272
- /** z-index */
17273
- zIndex = DEFAULT_Z_INDEX;
17274
- toasts = [];
17275
- expanded = false;
17276
- toastRefs = new Map();
17277
- /** 토스트가 표시될 때 발생합니다. */
17278
- toastShow;
17279
- /** 토스트가 제거될 때 발생합니다. */
17280
- toastDismiss;
17281
- /** 토스트를 생성하고 ID를 반환합니다. */
17282
- async create(options) {
17283
- const id = `toast-${++toastIdCounter}`;
17284
- const entry = { id, options, state: 'entering' };
17285
- const duration = options.duration ?? this.defaultDuration ?? DEFAULT_DURATION;
17762
+ /** 유효성 검사를 실행합니다. */
17763
+ async sdValidate() {
17764
+ return this.formField?.sdValidate();
17765
+ }
17766
+ /** 값과 유효성 상태를 초기화합니다. */
17767
+ async sdReset() {
17768
+ return this.formField?.sdReset();
17769
+ }
17770
+ /** 유효성 상태만 초기화합니다. */
17771
+ async sdResetValidate() {
17772
+ return this.formField?.sdResetValidation();
17773
+ }
17774
+ /** 입력 필드에 포커스를 이동합니다. */
17775
+ async sdFocus() {
17776
+ return this.formField?.sdFocus();
17777
+ }
17778
+ componentWillLoad() {
17779
+ this.valueChanged(this.value);
17780
+ }
17781
+ disconnectedCallback() {
17782
+ if (this.closeAnimationTimer)
17783
+ clearTimeout(this.closeAnimationTimer);
17784
+ }
17785
+ closeDropdown() {
17786
+ if (!this.isOpen)
17787
+ return;
17788
+ this.isOpen = false;
17789
+ this.isAnimatingOut = true;
17790
+ if (this.closeAnimationTimer)
17791
+ clearTimeout(this.closeAnimationTimer);
17792
+ this.closeAnimationTimer = setTimeout(() => {
17793
+ this.isAnimatingOut = false;
17794
+ }, SdTimePicker.CLOSE_ANIMATION_DURATION);
17795
+ }
17796
+ handleTriggerClick = () => {
17797
+ if (this.disabled)
17798
+ return;
17799
+ if (this.isOpen) {
17800
+ this.closeDropdown();
17801
+ }
17802
+ else {
17803
+ if (this.closeAnimationTimer)
17804
+ clearTimeout(this.closeAnimationTimer);
17805
+ this.isAnimatingOut = false;
17806
+ this.isOpen = true;
17807
+ }
17808
+ };
17809
+ handleClear = (event) => {
17810
+ event.stopPropagation();
17811
+ this.value = null;
17812
+ this.update.emit(null);
17813
+ };
17814
+ handleSelect = (event) => {
17815
+ event.stopPropagation();
17816
+ this.value = event.detail;
17817
+ this.update.emit(this.value);
17818
+ };
17819
+ get effectiveUseMeridiem() {
17820
+ return this.useMeridiem ?? this.type === 'midday';
17821
+ }
17822
+ render() {
17823
+ const sizeTokens = TIMEPICKER_SIZE_MAP[this.size] ?? TIMEPICKER_SIZE_MAP.sm;
17824
+ const cssVars = {
17825
+ '--sd-system-size-field-sm-height': `${sizeTokens.height}px`,
17826
+ '--sd-system-size-field-md-height': `${sizeTokens.height}px`,
17827
+ '--sd-system-radius-field-sm': `${sizeTokens.radius}px`,
17828
+ '--sd-system-radius-field-md': `${sizeTokens.radius}px`,
17829
+ '--sd-time-picker-min-width': `${sizeTokens.minWidth}px`,
17830
+ '--sd-system-color-field-border-default': TIMEPICKER_COLORS.border.default,
17831
+ '--sd-system-color-field-border-focus': TIMEPICKER_COLORS.border.focus,
17832
+ '--sd-system-color-field-bg-default': TIMEPICKER_COLORS.bg.default,
17833
+ };
17834
+ return (hAsync("sd-field", { key: 'dc433d8d452ad71bc5ea1b388399df862ca9cd04', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, status: this.status, 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: '258c3a0d3232e8edfe5304dd2e0fcea4060f5893', class: "sd-time-picker", ref: el => {
17835
+ this.triggerRef = el;
17836
+ } }, hAsync("sd-time-picker-trigger", { key: '22af4e81d925cbdacea4e08b05aaa13cf5eb9ef8', displayText: formatTimeDisplay(this.value, this.effectiveUseMeridiem ? 'midday' : 'default'), placeholder: this.placeholder, disabled: this.disabled, clearable: this.clearable, size: this.size, onSdTriggerClick: this.handleTriggerClick, onSdClear: this.handleClear })), (this.isOpen || this.isAnimatingOut) && (hAsync("sd-portal", { key: '8c7e43950257c8a8bf3b157f69985b3284430107', open: this.isOpen, parentRef: this.triggerRef, onSdClose: () => this.closeDropdown() }, hAsync("sd-time-picker-selector", { key: '27109beda36d1817807f6a8b6af8a7a12b4c31c6', value: this.value, useMeridiem: this.effectiveUseMeridiem, minuteStep: this.minuteStep, onSdUpdate: this.handleSelect })))));
17837
+ }
17838
+ static get watchers() { return {
17839
+ "isOpen": [{
17840
+ "watchIsOpen": 0
17841
+ }],
17842
+ "value": [{
17843
+ "valueChanged": 0
17844
+ }]
17845
+ }; }
17846
+ static get style() { return sdTimePickerCss(); }
17847
+ static get cmpMeta() { return {
17848
+ "$flags$": 512,
17849
+ "$tagName$": "sd-time-picker",
17850
+ "$members$": {
17851
+ "value": [1025],
17852
+ "size": [513],
17853
+ "type": [513],
17854
+ "placeholder": [513],
17855
+ "disabled": [516],
17856
+ "clearable": [4],
17857
+ "useMeridiem": [4, "use-meridiem"],
17858
+ "minuteStep": [2, "minute-step"],
17859
+ "width": [8],
17860
+ "label": [1],
17861
+ "labelWidth": [8, "label-width"],
17862
+ "addonLabel": [1, "addon-label"],
17863
+ "addonAlign": [1, "addon-align"],
17864
+ "hint": [1],
17865
+ "errorMessage": [1, "error-message"],
17866
+ "rules": [16],
17867
+ "error": [1028],
17868
+ "status": [1],
17869
+ "icon": [16],
17870
+ "labelTooltip": [1, "label-tooltip"],
17871
+ "labelTooltipProps": [16],
17872
+ "name": [1],
17873
+ "isOpen": [32],
17874
+ "isAnimatingOut": [32],
17875
+ "focused": [32],
17876
+ "hovered": [32],
17877
+ "sdValidate": [64],
17878
+ "sdReset": [64],
17879
+ "sdResetValidate": [64],
17880
+ "sdFocus": [64]
17881
+ },
17882
+ "$listeners$": undefined,
17883
+ "$lazyBundleId$": "-",
17884
+ "$attrsToReflect$": [["size", "size"], ["type", "type"], ["placeholder", "placeholder"], ["disabled", "disabled"]]
17885
+ }; }
17886
+ }
17887
+
17888
+ const sdTimePickerSelectorCss = () => `sd-time-picker-selector{display:block}sd-time-picker-selector .sd-time-picker-selector{display:flex;flex-direction:column;align-items:stretch;justify-content:center;overflow:hidden;background:var(--selector-bg);border-radius:var(--selector-radius);box-shadow:4px 8px 16px -4px rgba(34, 34, 34, 0.1), 0 0 24px -6px rgba(34, 34, 34, 0.12)}sd-time-picker-selector .sd-time-picker-selector__meridiem{display:flex;align-items:center;justify-content:center;padding:var(--selector-section-padding-y) var(--selector-section-padding-x);background:var(--selector-bg)}sd-time-picker-selector .sd-time-picker-selector__meridiem-group{display:flex;isolation:isolate}sd-time-picker-selector .sd-time-picker-selector__meridiem-button{width:61px;height:28px;border:1px solid #ccc;background:#fff;color:#555;font-size:12px;line-height:20px;font-weight:500;cursor:pointer}sd-time-picker-selector .sd-time-picker-selector__meridiem-button--first{border-radius:4px 0 0 4px;margin-right:-1px}sd-time-picker-selector .sd-time-picker-selector__meridiem-button--end{border-radius:0 4px 4px 0}sd-time-picker-selector .sd-time-picker-selector__meridiem-button--selected{z-index:1;border-color:#0075ff;color:#0075ff}sd-time-picker-selector .sd-time-picker-selector__divider{height:1px;width:100%;background:#e1e1e1}sd-time-picker-selector .sd-time-picker-selector__time{display:flex;align-items:center;justify-content:center;gap:var(--selector-time-gap);padding:var(--selector-section-padding-y) var(--selector-section-padding-x);background:var(--selector-bg)}sd-time-picker-selector .sd-time-picker-selector__column{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--selector-time-column-gap)}sd-time-picker-selector .sd-time-picker-selector__input{width:var(--selector-input-width);height:28px;box-sizing:border-box;border:1px solid #aaa;border-radius:4px;background:#fff;color:#222;font-size:12px;line-height:20px;text-align:center;outline:none}sd-time-picker-selector .sd-time-picker-selector__colon{width:var(--selector-colon-size);color:#555;font-size:16px;line-height:16px;text-align:center}`;
17889
+
17890
+ class SdTimePickerSelector {
17891
+ constructor(hostRef) {
17892
+ registerInstance(this, hostRef);
17893
+ this.update = createEvent(this, "sdUpdate", 7);
17894
+ }
17895
+ /** 선택된 시간 (HH:mm) */
17896
+ value = null;
17897
+ /** 오전/오후 선택 표시 여부 */
17898
+ useMeridiem = true;
17899
+ /** 분 증감 단위 */
17900
+ minuteStep = 1;
17901
+ /** 시간 변경 시 발생합니다. */
17902
+ update;
17903
+ valueChanged() {
17904
+ this.syncFromValue();
17905
+ }
17906
+ editingPart = null;
17907
+ inputDraft = {};
17908
+ hour = 0;
17909
+ minute = 0;
17910
+ componentWillLoad() {
17911
+ this.syncFromValue();
17912
+ }
17913
+ syncFromValue() {
17914
+ const parsed = parseTimeValue(this.value);
17915
+ this.hour = parsed.hour;
17916
+ this.minute = parsed.minute;
17917
+ }
17918
+ get meridiem() {
17919
+ return this.hour >= 12 ? 'PM' : 'AM';
17920
+ }
17921
+ get displayHour() {
17922
+ if (!this.useMeridiem)
17923
+ return this.hour;
17924
+ const hour = this.hour % 12;
17925
+ return hour === 0 ? 12 : hour;
17926
+ }
17927
+ emitNext(hour, minute) {
17928
+ this.hour = clampTimePart(hour, 0, 23);
17929
+ this.minute = clampTimePart(minute, 0, 59);
17930
+ this.update.emit(formatTimeValue(this.hour, this.minute));
17931
+ }
17932
+ sanitizeInput(value) {
17933
+ return value.replace(/\D/g, '').slice(0, 2);
17934
+ }
17935
+ setDraft(part, value) {
17936
+ this.inputDraft = { ...this.inputDraft, [part]: value };
17937
+ }
17938
+ beginEdit(part, value) {
17939
+ this.editingPart = part;
17940
+ this.setDraft(part, String(value).padStart(2, '0'));
17941
+ }
17942
+ commitHourDraft(draft) {
17943
+ const raw = clampTimePart(Number(draft), this.useMeridiem ? 1 : 0, this.useMeridiem ? 12 : 23);
17944
+ const nextHour = this.useMeridiem
17945
+ ? this.meridiem === 'PM'
17946
+ ? raw === 12
17947
+ ? 12
17948
+ : raw + 12
17949
+ : raw === 12
17950
+ ? 0
17951
+ : raw
17952
+ : raw;
17953
+ this.emitNext(nextHour, this.minute);
17954
+ return raw;
17955
+ }
17956
+ commitMinuteDraft(draft) {
17957
+ const minute = clampTimePart(Number(draft), 0, 59);
17958
+ this.emitNext(this.hour, minute);
17959
+ return minute;
17960
+ }
17961
+ endEdit(part) {
17962
+ const draft = this.inputDraft[part];
17963
+ if (part === 'hour' && draft != null && draft !== '') {
17964
+ this.commitHourDraft(draft);
17965
+ }
17966
+ if (part === 'minute' && draft != null && draft !== '') {
17967
+ this.commitMinuteDraft(draft);
17968
+ }
17969
+ this.editingPart = null;
17970
+ this.inputDraft = {};
17971
+ }
17972
+ setMeridiem(meridiem) {
17973
+ if (meridiem === this.meridiem)
17974
+ return;
17975
+ if (meridiem === 'AM') {
17976
+ this.emitNext(this.hour - 12, this.minute);
17977
+ return;
17978
+ }
17979
+ this.emitNext(this.hour + 12, this.minute);
17980
+ }
17981
+ changeHour(delta) {
17982
+ this.emitNext((this.hour + delta + 24) % 24, this.minute);
17983
+ }
17984
+ changeMinute(delta) {
17985
+ const next = this.minute + delta;
17986
+ if (next > 59) {
17987
+ this.emitNext((this.hour + 1) % 24, next - 60);
17988
+ return;
17989
+ }
17990
+ if (next < 0) {
17991
+ this.emitNext((this.hour + 23) % 24, next + 60);
17992
+ return;
17993
+ }
17994
+ this.emitNext(this.hour, next);
17995
+ }
17996
+ handleHourInput = (event) => {
17997
+ const target = event.target;
17998
+ const draft = this.sanitizeInput(target.value);
17999
+ target.value = draft;
18000
+ this.setDraft('hour', draft);
18001
+ if (draft === '')
18002
+ return;
18003
+ if (draft.length < 2)
18004
+ return;
18005
+ const raw = this.commitHourDraft(draft);
18006
+ const displayDraft = Number(draft) === raw ? draft : String(raw);
18007
+ target.value = displayDraft;
18008
+ this.setDraft('hour', displayDraft);
18009
+ };
18010
+ handleMinuteInput = (event) => {
18011
+ const target = event.target;
18012
+ const draft = this.sanitizeInput(target.value);
18013
+ target.value = draft;
18014
+ this.setDraft('minute', draft);
18015
+ if (draft === '')
18016
+ return;
18017
+ if (draft.length < 2)
18018
+ return;
18019
+ const nextMinute = this.commitMinuteDraft(draft);
18020
+ const displayDraft = Number(draft) === nextMinute ? draft : String(nextMinute);
18021
+ target.value = displayDraft;
18022
+ this.setDraft('minute', displayDraft);
18023
+ this.emitNext(this.hour, nextMinute);
18024
+ };
18025
+ renderMeridiemButton(label, meridiem, position) {
18026
+ const selected = this.meridiem === meridiem;
18027
+ return (hAsync("button", { type: "button", class: {
18028
+ 'sd-time-picker-selector__meridiem-button': true,
18029
+ 'sd-time-picker-selector__meridiem-button--selected': selected,
18030
+ [`sd-time-picker-selector__meridiem-button--${position}`]: true,
18031
+ }, onClick: () => this.setMeridiem(meridiem) }, label));
18032
+ }
18033
+ renderColumn(type) {
18034
+ const isHour = type === 'hour';
18035
+ const value = isHour ? this.displayHour : this.minute;
18036
+ const displayValue = this.editingPart === type ? (this.inputDraft[type] ?? '') : String(value).padStart(2, '0');
18037
+ return (hAsync("div", { class: `sd-time-picker-selector__column sd-time-picker-selector__column--${type}` }, hAsync("sd-ghost-button", { icon: "chevronUp", size: "xs", ariaLabel: `${isHour ? '시' : '분'} 증가`, onSdClick: () => (isHour ? this.changeHour(1) : this.changeMinute(this.minuteStep)) }), hAsync("input", { class: "sd-time-picker-selector__input", type: "text", inputmode: "numeric", value: displayValue, placeholder: "-", onFocus: () => this.beginEdit(type, value), onBlur: () => this.endEdit(type), onInput: isHour ? this.handleHourInput : this.handleMinuteInput, "aria-label": isHour ? '시' : '분' }), hAsync("sd-ghost-button", { icon: "chevronDown", size: "xs", ariaLabel: `${isHour ? '시' : '분'} 감소`, onSdClick: () => (isHour ? this.changeHour(-1) : this.changeMinute(-this.minuteStep)) })));
18038
+ }
18039
+ render() {
18040
+ const cssVars = {
18041
+ '--selector-bg': TIMEPICKER_SELECTOR.bg,
18042
+ '--selector-radius': `${TIMEPICKER_SELECTOR.radius}px`,
18043
+ '--selector-section-padding-x': `${TIMEPICKER_SELECTOR.section.paddingX}px`,
18044
+ '--selector-section-padding-y': `${TIMEPICKER_SELECTOR.section.paddingY}px`,
18045
+ '--selector-time-gap': `${TIMEPICKER_SELECTOR.time.gap}px`,
18046
+ '--selector-time-column-gap': `${TIMEPICKER_SELECTOR.time.column.gap}px`,
18047
+ '--selector-input-width': `${TIMEPICKER_SELECTOR.inputWidth}px`,
18048
+ '--selector-colon-size': `${TIMEPICKER_SELECTOR.colonSize}px`,
18049
+ };
18050
+ return (hAsync("div", { key: '230eba90099f06b238a49da38bade09d5a1a168a', class: "sd-time-picker-selector", style: cssVars }, this.useMeridiem && (hAsync("div", { key: 'a15baa49aa07b469843f15a1c381c97df6b31600', class: "sd-time-picker-selector__meridiem" }, hAsync("div", { key: 'e1e9576461c4c9059b1d5c9f4a8528af91869316', class: "sd-time-picker-selector__meridiem-group" }, this.renderMeridiemButton('오전', 'AM', 'first'), this.renderMeridiemButton('오후', 'PM', 'end')))), this.useMeridiem && hAsync("div", { key: 'c9c8dfbb3c724bef2d20d22ea839079c8176c1c6', class: "sd-time-picker-selector__divider" }), hAsync("div", { key: 'd7157d6f5a38b09098fea6dc33d9ca69cf9fcd06', class: "sd-time-picker-selector__time" }, this.renderColumn('hour'), hAsync("span", { key: '83b0ce7966cabe292eb454d103507a0504915aa7', class: "sd-time-picker-selector__colon" }, ":"), this.renderColumn('minute'))));
18051
+ }
18052
+ static get watchers() { return {
18053
+ "value": [{
18054
+ "valueChanged": 0
18055
+ }]
18056
+ }; }
18057
+ static get style() { return sdTimePickerSelectorCss(); }
18058
+ static get cmpMeta() { return {
18059
+ "$flags$": 512,
18060
+ "$tagName$": "sd-time-picker-selector",
18061
+ "$members$": {
18062
+ "value": [1],
18063
+ "useMeridiem": [4, "use-meridiem"],
18064
+ "minuteStep": [2, "minute-step"],
18065
+ "editingPart": [32],
18066
+ "inputDraft": [32]
18067
+ },
18068
+ "$listeners$": undefined,
18069
+ "$lazyBundleId$": "-",
18070
+ "$attrsToReflect$": []
18071
+ }; }
18072
+ }
18073
+
18074
+ const sdTimePickerTriggerCss = () => `sd-time-picker-trigger{display:block;width:100%;height:100%}sd-time-picker-trigger .sd-time-picker-trigger{display:flex;align-items:center;gap:var(--trigger-gap);width:100%;height:100%;padding:0 var(--trigger-padding-x);cursor:pointer;user-select:none;overflow:hidden;border-radius:var(--trigger-radius)}sd-time-picker-trigger .sd-time-picker-trigger--disabled{cursor:not-allowed}sd-time-picker-trigger .sd-time-picker-trigger__icon,sd-time-picker-trigger .sd-time-picker-trigger__clear{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center}sd-time-picker-trigger .sd-time-picker-trigger__text{flex:1;min-width:var(--trigger-text-min-width, 80px);font-size:var(--trigger-font-size);line-height:var(--trigger-line-height);font-weight:var(--trigger-font-weight);color:var(--trigger-text-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}`;
18075
+
18076
+ class SdTimePickerTrigger {
18077
+ constructor(hostRef) {
18078
+ registerInstance(this, hostRef);
18079
+ this.triggerClick = createEvent(this, "sdTriggerClick", 7);
18080
+ this.clear = createEvent(this, "sdClear", 7);
18081
+ }
18082
+ /** 표시할 시간 텍스트 */
18083
+ displayText = '';
18084
+ /** 입력 힌트 텍스트 */
18085
+ placeholder = '00:00';
18086
+ /** 비활성 상태 여부 */
18087
+ disabled = false;
18088
+ /** 지우기 버튼 표시 여부 */
18089
+ clearable = false;
18090
+ /** 트리거 크기 */
18091
+ size = 'sm';
18092
+ /** 트리거 클릭 시 발생합니다. */
18093
+ triggerClick;
18094
+ /** 지우기 버튼 클릭 시 발생합니다. */
18095
+ clear;
18096
+ handleClick = () => {
18097
+ if (this.disabled)
18098
+ return;
18099
+ this.triggerClick.emit();
18100
+ };
18101
+ handleClear = (event) => {
18102
+ event.stopPropagation();
18103
+ if (this.disabled)
18104
+ return;
18105
+ this.clear.emit();
18106
+ };
18107
+ render() {
18108
+ const sizeTokens = TIMEPICKER_SIZE_MAP[this.size] ?? TIMEPICKER_SIZE_MAP.sm;
18109
+ const hasValue = this.displayText !== '';
18110
+ const textMinWidth = this.size === 'md' ? 96 : 80;
18111
+ const cssVars = {
18112
+ '--trigger-padding-x': `${sizeTokens.paddingX}px`,
18113
+ '--trigger-gap': `${sizeTokens.gap}px`,
18114
+ '--trigger-icon-size': `${sizeTokens.iconSize}px`,
18115
+ '--trigger-font-size': `${sizeTokens.fontSize}px`,
18116
+ '--trigger-line-height': `${sizeTokens.lineHeight}px`,
18117
+ '--trigger-font-weight': sizeTokens.fontWeight,
18118
+ '--trigger-radius': `${sizeTokens.radius}px`,
18119
+ '--trigger-text-min-width': `${textMinWidth}px`,
18120
+ '--trigger-text-color': this.disabled
18121
+ ? TIMEPICKER_COLORS.text.disabled
18122
+ : hasValue
18123
+ ? TIMEPICKER_COLORS.text.default
18124
+ : TIMEPICKER_COLORS.text.hint,
18125
+ '--trigger-icon-color': this.disabled
18126
+ ? TIMEPICKER_COLORS.icon.disabled
18127
+ : TIMEPICKER_COLORS.icon.default,
18128
+ };
18129
+ return (hAsync("div", { key: '6b6bff8d9928ace4cda84a7bdb2ac6f73f0d2329', role: "button", tabindex: this.disabled ? -1 : 0, class: {
18130
+ 'sd-time-picker-trigger': true,
18131
+ 'sd-time-picker-trigger--disabled': this.disabled,
18132
+ }, style: cssVars, onClick: this.handleClick, onKeyDown: e => {
18133
+ if (e.key === 'Enter' || e.key === ' ') {
18134
+ e.preventDefault();
18135
+ this.handleClick();
18136
+ }
18137
+ } }, hAsync("sd-icon", { key: 'd371bf5acec8592a44c0d18e738b5ac71b556f32', name: "clockOutline", size: Number(sizeTokens.iconSize), color: "var(--trigger-icon-color)", class: "sd-time-picker-trigger__icon" }), hAsync("span", { key: '2bc0ddfef47a1e929ceafb723345e1ae9e62095b', class: "sd-time-picker-trigger__text" }, hasValue ? this.displayText : this.placeholder), this.clearable && hasValue && !this.disabled && (hAsync("sd-ghost-button", { key: '76763c65dd6ee64c8f1abc0c871d8c50cfaf3852', class: "sd-time-picker-trigger__clear", icon: "close", size: "xs", ariaLabel: "\uC2DC\uAC04 \uC9C0\uC6B0\uAE30", onSdClick: this.handleClear }))));
18138
+ }
18139
+ static get style() { return sdTimePickerTriggerCss(); }
18140
+ static get cmpMeta() { return {
18141
+ "$flags$": 512,
18142
+ "$tagName$": "sd-time-picker-trigger",
18143
+ "$members$": {
18144
+ "displayText": [1, "display-text"],
18145
+ "placeholder": [1],
18146
+ "disabled": [4],
18147
+ "clearable": [4],
18148
+ "size": [1]
18149
+ },
18150
+ "$listeners$": undefined,
18151
+ "$lazyBundleId$": "-",
18152
+ "$attrsToReflect$": []
18153
+ }; }
18154
+ }
18155
+
18156
+ function getTimeMinutes(value) {
18157
+ const { hour, minute } = parseTimeValue(value);
18158
+ return hour * 60 + minute;
18159
+ }
18160
+ function normalizeTimeRangeValue(value, rangeOrder = 'strict') {
18161
+ if (value == null)
18162
+ return null;
18163
+ const normalized = value.map(item => {
18164
+ const parsed = parseTimeValue(item);
18165
+ return formatTimeValue(parsed.hour, parsed.minute);
18166
+ });
18167
+ if (rangeOrder === 'strict' && getTimeMinutes(normalized[0]) > getTimeMinutes(normalized[1])) {
18168
+ return [normalized[0], normalized[0]];
18169
+ }
18170
+ return normalized;
18171
+ }
18172
+ function formatTimeRangeDisplay(value, type) {
18173
+ if (value == null || value[0] === '' || value[1] === '')
18174
+ return '';
18175
+ return `${formatTimeDisplay(value[0], type)} ~ ${formatTimeDisplay(value[1], type)}`;
18176
+ }
18177
+
18178
+ const sdTimeRangePickerCss = () => `sd-time-range-picker{display:inline-flex}sd-time-range-picker sd-portal{display:none}sd-time-range-picker .sd-time-range-picker{position:relative;min-width:var(--sd-time-range-picker-min-width);width:100%;height:100%}`;
18179
+
18180
+ class SdTimeRangePicker {
18181
+ constructor(hostRef) {
18182
+ registerInstance(this, hostRef);
18183
+ this.update = createEvent(this, "sdUpdate", 7);
18184
+ this.dropDownShow = createEvent(this, "sdDropDownShow", 7);
18185
+ }
18186
+ static CLOSE_ANIMATION_DURATION = 150;
18187
+ get el() { return getElement(this); }
18188
+ /** 선택된 시간 범위 [시작, 종료] (HH:mm) */
18189
+ value = null;
18190
+ /** 입력 필드 크기 */
18191
+ size = 'sm';
18192
+ /** 표시 타입: default(24시간) / midday(오전·오후) */
18193
+ type = 'default';
18194
+ /** 시간 미선택 시 표시할 placeholder */
18195
+ placeholder = '00:00 ~ 23:59';
18196
+ /** 비활성 상태 여부 */
18197
+ disabled = false;
18198
+ /** 값이 있을 때 지우기 버튼 표시 여부 */
18199
+ clearable = false;
18200
+ /** 오전/오후 선택 표시 여부. 지정하지 않으면 type="midday"일 때만 켜집니다. */
18201
+ useMeridiem;
18202
+ /** 분 증감 단위 */
18203
+ minuteStep = 1;
18204
+ /** 범위 순서 정책. strict는 시작 시간이 종료 시간보다 늦어지지 않도록 보정합니다. */
18205
+ rangeOrder = 'strict';
18206
+ /** 필드 너비 (숫자면 px, 문자열이면 그대로 적용) */
18207
+ width = '';
18208
+ // sd-field 공통 props
18209
+ /** 레이블 텍스트 */
18210
+ label = '';
18211
+ /** 레이블 너비 */
18212
+ labelWidth = '';
18213
+ /** 필드 우측 어드온 레이블 */
18214
+ addonLabel = '';
18215
+ /** 어드온 정렬 방향 */
18216
+ addonAlign = 'start';
18217
+ /** 필드 하단 힌트 텍스트 */
18218
+ hint = '';
18219
+ /** 에러 메시지 */
18220
+ errorMessage = '';
18221
+ /** 유효성 검사 규칙 목록 */
18222
+ rules = [];
18223
+ /** 에러 상태 여부 */
18224
+ error = false;
18225
+ /** 필드 상태 (없으면 error/rules 결과로 자동 결정) */
18226
+ status;
18227
+ /** 레이블 영역 아이콘 */
18228
+ icon = undefined;
18229
+ /** 레이블 툴팁 텍스트 */
18230
+ labelTooltip = '';
18231
+ /** 레이블 툴팁 상세 옵션 */
18232
+ labelTooltipProps = null;
18233
+ isOpen = false;
18234
+ isAnimatingOut = false;
18235
+ focused = false;
18236
+ hovered = false;
18237
+ /** 시간 범위 선택 시 선택된 범위([시작, 종료])를 전달합니다. */
18238
+ update;
18239
+ /** 선택기 열림/닫힘 상태가 바뀔 때 발생합니다. */
18240
+ dropDownShow;
18241
+ triggerRef;
18242
+ formField;
18243
+ closeAnimationTimer;
18244
+ /** 폼 연동용 name 속성 */
18245
+ name = nanoid();
18246
+ watchIsOpen(newValue) {
18247
+ this.focused = newValue;
18248
+ this.dropDownShow.emit({ isOpen: newValue });
18249
+ }
18250
+ valueChanged(newValue) {
18251
+ const normalized = normalizeTimeRangeValue(newValue, this.rangeOrder);
18252
+ if (normalized != null && JSON.stringify(normalized) !== JSON.stringify(newValue)) {
18253
+ this.value = normalized;
18254
+ }
18255
+ }
18256
+ rangeOrderChanged() {
18257
+ this.valueChanged(this.value);
18258
+ }
18259
+ /** 유효성 검사를 실행합니다. */
18260
+ async sdValidate() {
18261
+ return this.formField?.sdValidate();
18262
+ }
18263
+ /** 값과 유효성 상태를 초기화합니다. */
18264
+ async sdReset() {
18265
+ return this.formField?.sdReset();
18266
+ }
18267
+ /** 유효성 상태만 초기화합니다. */
18268
+ async sdResetValidate() {
18269
+ return this.formField?.sdResetValidation();
18270
+ }
18271
+ /** 입력 필드에 포커스를 이동합니다. */
18272
+ async sdFocus() {
18273
+ return this.formField?.sdFocus();
18274
+ }
18275
+ componentWillLoad() {
18276
+ this.valueChanged(this.value);
18277
+ }
18278
+ disconnectedCallback() {
18279
+ if (this.closeAnimationTimer)
18280
+ clearTimeout(this.closeAnimationTimer);
18281
+ }
18282
+ closeDropdown() {
18283
+ if (!this.isOpen)
18284
+ return;
18285
+ this.isOpen = false;
18286
+ this.isAnimatingOut = true;
18287
+ if (this.closeAnimationTimer)
18288
+ clearTimeout(this.closeAnimationTimer);
18289
+ this.closeAnimationTimer = setTimeout(() => {
18290
+ this.isAnimatingOut = false;
18291
+ }, SdTimeRangePicker.CLOSE_ANIMATION_DURATION);
18292
+ }
18293
+ handleTriggerClick = () => {
18294
+ if (this.disabled)
18295
+ return;
18296
+ if (this.isOpen) {
18297
+ this.closeDropdown();
18298
+ }
18299
+ else {
18300
+ if (this.closeAnimationTimer)
18301
+ clearTimeout(this.closeAnimationTimer);
18302
+ this.isAnimatingOut = false;
18303
+ this.isOpen = true;
18304
+ }
18305
+ };
18306
+ handleClear = (event) => {
18307
+ event.stopPropagation();
18308
+ this.value = null;
18309
+ this.update.emit(null);
18310
+ };
18311
+ handleSelect = (event) => {
18312
+ event.stopPropagation();
18313
+ this.value = event.detail;
18314
+ this.update.emit(this.value);
18315
+ };
18316
+ get effectiveUseMeridiem() {
18317
+ return this.useMeridiem ?? this.type === 'midday';
18318
+ }
18319
+ get displayText() {
18320
+ return formatTimeRangeDisplay(this.value, this.effectiveUseMeridiem ? 'midday' : 'default');
18321
+ }
18322
+ render() {
18323
+ const sizeTokens = TIMEPICKER_SIZE_MAP[this.size] ?? TIMEPICKER_SIZE_MAP.sm;
18324
+ const cssVars = {
18325
+ '--sd-system-size-field-sm-height': `${sizeTokens.height}px`,
18326
+ '--sd-system-size-field-md-height': `${sizeTokens.height}px`,
18327
+ '--sd-system-radius-field-sm': `${sizeTokens.radius}px`,
18328
+ '--sd-system-radius-field-md': `${sizeTokens.radius}px`,
18329
+ '--sd-time-range-picker-min-width': `${sizeTokens.minWidth}px`,
18330
+ '--sd-system-color-field-border-default': TIMEPICKER_COLORS.border.default,
18331
+ '--sd-system-color-field-border-focus': TIMEPICKER_COLORS.border.focus,
18332
+ '--sd-system-color-field-bg-default': TIMEPICKER_COLORS.bg.default,
18333
+ };
18334
+ return (hAsync("sd-field", { key: '41f3bdb3d08a72f590a25486975962d02cb7bbb8', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, status: this.status, 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: 'b3b8e08bd44e3f96a733c7341b8ca66c343aaa9d', class: "sd-time-range-picker", ref: el => {
18335
+ this.triggerRef = el;
18336
+ } }, hAsync("sd-time-picker-trigger", { key: '39c927a8a3eee331bf253d2faabe9711c2516987', displayText: this.displayText, placeholder: this.placeholder, disabled: this.disabled, clearable: this.clearable, size: this.size, onSdTriggerClick: this.handleTriggerClick, onSdClear: this.handleClear })), (this.isOpen || this.isAnimatingOut) && (hAsync("sd-portal", { key: '33fd2740d81d4dea5af75ed21888e4de213de1e3', open: this.isOpen, parentRef: this.triggerRef, onSdClose: () => this.closeDropdown() }, hAsync("sd-time-range-picker-selector", { key: '554057e0b4a0fd27d570bf9ea955c947cfc5cc50', value: this.value, useMeridiem: this.effectiveUseMeridiem, minuteStep: this.minuteStep, "range-order": this.rangeOrder, onSdUpdate: this.handleSelect })))));
18337
+ }
18338
+ static get watchers() { return {
18339
+ "isOpen": [{
18340
+ "watchIsOpen": 0
18341
+ }],
18342
+ "value": [{
18343
+ "valueChanged": 0
18344
+ }],
18345
+ "rangeOrder": [{
18346
+ "rangeOrderChanged": 0
18347
+ }]
18348
+ }; }
18349
+ static get style() { return sdTimeRangePickerCss(); }
18350
+ static get cmpMeta() { return {
18351
+ "$flags$": 512,
18352
+ "$tagName$": "sd-time-range-picker",
18353
+ "$members$": {
18354
+ "value": [1040],
18355
+ "size": [513],
18356
+ "type": [513],
18357
+ "placeholder": [513],
18358
+ "disabled": [516],
18359
+ "clearable": [4],
18360
+ "useMeridiem": [4, "use-meridiem"],
18361
+ "minuteStep": [2, "minute-step"],
18362
+ "rangeOrder": [1, "range-order"],
18363
+ "width": [8],
18364
+ "label": [1],
18365
+ "labelWidth": [8, "label-width"],
18366
+ "addonLabel": [1, "addon-label"],
18367
+ "addonAlign": [1, "addon-align"],
18368
+ "hint": [1],
18369
+ "errorMessage": [1, "error-message"],
18370
+ "rules": [16],
18371
+ "error": [1028],
18372
+ "status": [1],
18373
+ "icon": [16],
18374
+ "labelTooltip": [1, "label-tooltip"],
18375
+ "labelTooltipProps": [16],
18376
+ "name": [1],
18377
+ "isOpen": [32],
18378
+ "isAnimatingOut": [32],
18379
+ "focused": [32],
18380
+ "hovered": [32],
18381
+ "sdValidate": [64],
18382
+ "sdReset": [64],
18383
+ "sdResetValidate": [64],
18384
+ "sdFocus": [64]
18385
+ },
18386
+ "$listeners$": undefined,
18387
+ "$lazyBundleId$": "-",
18388
+ "$attrsToReflect$": [["size", "size"], ["type", "type"], ["placeholder", "placeholder"], ["disabled", "disabled"]]
18389
+ }; }
18390
+ }
18391
+
18392
+ const sdTimeRangePickerSelectorCss = () => `sd-time-range-picker-selector{display:block}sd-time-range-picker-selector .sd-time-range-picker-selector{display:flex;align-items:flex-start;justify-content:center;gap:var(--selector-range-panel-gap);padding:var(--selector-range-padding);overflow:hidden;background:var(--selector-bg);border-radius:var(--selector-radius);box-shadow:var(--sd-system-shadow-spread-sm-x) var(--sd-system-shadow-spread-sm-y) var(--sd-system-shadow-spread-sm-blur) var(--sd-system-shadow-spread-sm-spread) var(--sd-system-shadow-spread-sm-color), var(--sd-system-shadow-spread-md-x) var(--sd-system-shadow-spread-md-y) var(--sd-system-shadow-spread-md-blur) var(--sd-system-shadow-spread-md-spread) var(--sd-system-shadow-spread-md-color)}sd-time-range-picker-selector .sd-time-range-picker-selector__panel{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--selector-range-section-gap)}sd-time-range-picker-selector .sd-time-range-picker-selector__heading{display:flex;flex-direction:column;align-items:center;gap:var(--selector-range-heading-gap)}sd-time-range-picker-selector .sd-time-range-picker-selector__heading-text{color:var(--selector-range-heading-color);font-size:12px;line-height:20px;font-weight:700;text-align:center;white-space:nowrap}sd-time-range-picker-selector .sd-time-range-picker-selector__meridiem-group{display:flex;isolation:isolate}sd-time-range-picker-selector .sd-time-range-picker-selector__meridiem-button{width:61px;height:28px;border:var(--selector-border-width) solid var(--selector-border-default);background:var(--selector-bg);color:var(--selector-range-heading-color);font-size:12px;line-height:20px;font-weight:500;cursor:pointer}sd-time-range-picker-selector .sd-time-range-picker-selector__meridiem-button--first{border-radius:4px 0 0 4px;margin-right:-1px}sd-time-range-picker-selector .sd-time-range-picker-selector__meridiem-button--end{border-radius:0 4px 4px 0}sd-time-range-picker-selector .sd-time-range-picker-selector__meridiem-button--selected{z-index:1;border-color:var(--selector-border-focus);color:var(--selector-border-focus)}sd-time-range-picker-selector .sd-time-range-picker-selector__divider{align-self:stretch;width:1px;background:var(--selector-bg-disabled)}sd-time-range-picker-selector .sd-time-range-picker-selector__time{display:flex;align-items:center;justify-content:center;gap:var(--selector-time-gap);padding:0 16px;background:var(--selector-bg)}sd-time-range-picker-selector .sd-time-range-picker-selector__column{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--selector-time-column-gap)}sd-time-range-picker-selector .sd-time-range-picker-selector__input{width:var(--selector-input-width);height:28px;box-sizing:border-box;border:var(--selector-border-width) solid var(--selector-border-default);border-radius:4px;background:var(--selector-bg);color:var(--selector-text-default);font-size:12px;line-height:20px;text-align:center;outline:none}sd-time-range-picker-selector .sd-time-range-picker-selector__colon{width:var(--selector-colon-size);color:var(--selector-range-heading-color);font-size:16px;line-height:16px;text-align:center}`;
18393
+
18394
+ class SdTimeRangePickerSelector {
18395
+ constructor(hostRef) {
18396
+ registerInstance(this, hostRef);
18397
+ this.update = createEvent(this, "sdUpdate", 7);
18398
+ }
18399
+ /** 선택된 시간 범위 [시작, 종료] (HH:mm) */
18400
+ value = null;
18401
+ /** 오전/오후 선택 표시 여부 */
18402
+ useMeridiem = false;
18403
+ /** 분 증감 단위 */
18404
+ minuteStep = 1;
18405
+ /** 범위 순서 정책. strict는 시작 시간이 종료 시간보다 늦어지지 않도록 보정합니다. */
18406
+ rangeOrder = 'strict';
18407
+ /** 시간 범위 변경 시 발생합니다. */
18408
+ update;
18409
+ editingKey = null;
18410
+ inputDraft = {};
18411
+ autoAdjusted = null;
18412
+ getRange() {
18413
+ return this.value ?? ['00:00', '23:59'];
18414
+ }
18415
+ getParts(side) {
18416
+ const [start, end] = this.getRange();
18417
+ return parseTimeValue(side === 'start' ? start : end);
18418
+ }
18419
+ getMeridiem(side) {
18420
+ return this.getParts(side).hour >= 12 ? 'PM' : 'AM';
18421
+ }
18422
+ getDisplayHour(side) {
18423
+ const { hour } = this.getParts(side);
18424
+ if (!this.useMeridiem)
18425
+ return hour;
18426
+ const displayHour = hour % 12;
18427
+ return displayHour === 0 ? 12 : displayHour;
18428
+ }
18429
+ emitSide(side, hour, minute, direction = 'unknown') {
18430
+ const [start, end] = this.getRange();
18431
+ const next = formatTimeValue(hour, minute);
18432
+ this.update.emit(this.normalizeNextRange(side === 'start' ? [next, end] : [start, next], side, direction));
18433
+ }
18434
+ getTimeMinutes(value) {
18435
+ const { hour, minute } = parseTimeValue(value);
18436
+ return hour * 60 + minute;
18437
+ }
18438
+ normalizeNextRange(range, changedSide, direction) {
18439
+ if (this.rangeOrder === 'allow-cross-day')
18440
+ return range;
18441
+ const [start, end] = range;
18442
+ const [currentStart, currentEnd] = this.getRange();
18443
+ if (this.getTimeMinutes(start) <= this.getTimeMinutes(end)) {
18444
+ const shouldKeepSynced = this.autoAdjusted?.side === changedSide &&
18445
+ currentStart === currentEnd &&
18446
+ start !== end &&
18447
+ (direction === 'unknown' || this.autoAdjusted.direction === direction);
18448
+ if (shouldKeepSynced) {
18449
+ return changedSide === 'start' ? [start, start] : [end, end];
18450
+ }
18451
+ this.autoAdjusted = null;
18452
+ return range;
18453
+ }
18454
+ this.autoAdjusted = {
18455
+ side: changedSide,
18456
+ direction: changedSide === 'start' ? 'increase' : 'decrease',
18457
+ };
18458
+ return changedSide === 'start' ? [start, start] : [end, end];
18459
+ }
18460
+ getEditingKey(side, part) {
18461
+ return `${side}-${part}`;
18462
+ }
18463
+ sanitizeInput(value) {
18464
+ return value.replace(/\D/g, '').slice(0, 2);
18465
+ }
18466
+ setDraft(key, value) {
18467
+ this.inputDraft = { ...this.inputDraft, [key]: value };
18468
+ }
18469
+ beginEdit(side, part, value) {
18470
+ const key = this.getEditingKey(side, part);
18471
+ this.editingKey = key;
18472
+ this.setDraft(key, String(value).padStart(2, '0'));
18473
+ }
18474
+ commitHourDraft(side, draft) {
18475
+ const raw = clampTimePart(Number(draft), this.useMeridiem ? 1 : 0, this.useMeridiem ? 12 : 23);
18476
+ const { minute } = this.getParts(side);
18477
+ const meridiem = this.getMeridiem(side);
18478
+ const nextHour = this.useMeridiem
18479
+ ? meridiem === 'PM'
18480
+ ? raw === 12
18481
+ ? 12
18482
+ : raw + 12
18483
+ : raw === 12
18484
+ ? 0
18485
+ : raw
18486
+ : raw;
18487
+ this.emitSide(side, nextHour, minute);
18488
+ return raw;
18489
+ }
18490
+ commitMinuteDraft(side, draft) {
18491
+ const { hour } = this.getParts(side);
18492
+ const nextMinute = clampTimePart(Number(draft), 0, 59);
18493
+ this.emitSide(side, hour, nextMinute);
18494
+ return nextMinute;
18495
+ }
18496
+ endEdit(side, part) {
18497
+ const draft = this.inputDraft[this.getEditingKey(side, part)];
18498
+ if (part === 'hour' && draft != null && draft !== '') {
18499
+ this.commitHourDraft(side, draft);
18500
+ }
18501
+ if (part === 'minute' && draft != null && draft !== '') {
18502
+ this.commitMinuteDraft(side, draft);
18503
+ }
18504
+ this.editingKey = null;
18505
+ this.inputDraft = {};
18506
+ }
18507
+ setMeridiem(side, meridiem) {
18508
+ const current = this.getMeridiem(side);
18509
+ if (current === meridiem)
18510
+ return;
18511
+ const { hour, minute } = this.getParts(side);
18512
+ this.emitSide(side, meridiem === 'AM' ? hour - 12 : hour + 12, minute);
18513
+ }
18514
+ changeHour(side, delta) {
18515
+ const { hour, minute } = this.getParts(side);
18516
+ this.emitSide(side, (hour + delta + 24) % 24, minute, delta > 0 ? 'increase' : 'decrease');
18517
+ }
18518
+ changeMinute(side, delta) {
18519
+ const { hour, minute } = this.getParts(side);
18520
+ const next = minute + delta;
18521
+ if (next > 59) {
18522
+ this.emitSide(side, (hour + 1) % 24, next - 60, delta > 0 ? 'increase' : 'decrease');
18523
+ return;
18524
+ }
18525
+ if (next < 0) {
18526
+ this.emitSide(side, (hour + 23) % 24, next + 60, delta > 0 ? 'increase' : 'decrease');
18527
+ return;
18528
+ }
18529
+ this.emitSide(side, hour, next, delta > 0 ? 'increase' : 'decrease');
18530
+ }
18531
+ handleHourInput = (side, event) => {
18532
+ const target = event.target;
18533
+ const draft = this.sanitizeInput(target.value);
18534
+ target.value = draft;
18535
+ this.setDraft(this.getEditingKey(side, 'hour'), draft);
18536
+ if (draft === '')
18537
+ return;
18538
+ if (draft.length < 2)
18539
+ return;
18540
+ const raw = this.commitHourDraft(side, draft);
18541
+ const displayDraft = Number(draft) === raw ? draft : String(raw);
18542
+ target.value = displayDraft;
18543
+ this.setDraft(this.getEditingKey(side, 'hour'), displayDraft);
18544
+ };
18545
+ handleMinuteInput = (side, event) => {
18546
+ const target = event.target;
18547
+ const draft = this.sanitizeInput(target.value);
18548
+ target.value = draft;
18549
+ this.setDraft(this.getEditingKey(side, 'minute'), draft);
18550
+ if (draft === '')
18551
+ return;
18552
+ if (draft.length < 2)
18553
+ return;
18554
+ const nextMinute = this.commitMinuteDraft(side, draft);
18555
+ const displayDraft = Number(draft) === nextMinute ? draft : String(nextMinute);
18556
+ target.value = displayDraft;
18557
+ this.setDraft(this.getEditingKey(side, 'minute'), displayDraft);
18558
+ };
18559
+ renderMeridiemButton(side, label, meridiem, position) {
18560
+ const selected = this.getMeridiem(side) === meridiem;
18561
+ return (hAsync("button", { type: "button", class: {
18562
+ 'sd-time-range-picker-selector__meridiem-button': true,
18563
+ 'sd-time-range-picker-selector__meridiem-button--selected': selected,
18564
+ [`sd-time-range-picker-selector__meridiem-button--${position}`]: true,
18565
+ }, onClick: () => this.setMeridiem(side, meridiem) }, label));
18566
+ }
18567
+ renderColumn(side, type) {
18568
+ const isHour = type === 'hour';
18569
+ const { minute } = this.getParts(side);
18570
+ const value = isHour ? this.getDisplayHour(side) : minute;
18571
+ const editingKey = this.getEditingKey(side, type);
18572
+ const displayValue = this.editingKey === editingKey
18573
+ ? (this.inputDraft[editingKey] ?? '')
18574
+ : String(value).padStart(2, '0');
18575
+ return (hAsync("div", { class: "sd-time-range-picker-selector__column" }, hAsync("sd-ghost-button", { icon: "chevronUp", size: "xs", ariaLabel: `${side === 'start' ? '시작' : '종료'} ${isHour ? '시' : '분'} 증가`, onSdClick: () => isHour ? this.changeHour(side, 1) : this.changeMinute(side, this.minuteStep) }), hAsync("input", { class: "sd-time-range-picker-selector__input", type: "text", inputmode: "numeric", value: displayValue, placeholder: "-", onFocus: () => this.beginEdit(side, type, value), onBlur: () => this.endEdit(side, type), onInput: event => isHour ? this.handleHourInput(side, event) : this.handleMinuteInput(side, event), "aria-label": `${side === 'start' ? '시작' : '종료'} ${isHour ? '시' : '분'}` }), hAsync("sd-ghost-button", { icon: "chevronDown", size: "xs", ariaLabel: `${side === 'start' ? '시작' : '종료'} ${isHour ? '시' : '분'} 감소`, onSdClick: () => isHour ? this.changeHour(side, -1) : this.changeMinute(side, -this.minuteStep) })));
18576
+ }
18577
+ renderPanel(side, title) {
18578
+ return (hAsync("div", { class: "sd-time-range-picker-selector__panel" }, hAsync("div", { class: "sd-time-range-picker-selector__heading" }, hAsync("div", { class: "sd-time-range-picker-selector__heading-text" }, title), this.useMeridiem && (hAsync("div", { class: "sd-time-range-picker-selector__meridiem-group" }, this.renderMeridiemButton(side, '오전', 'AM', 'first'), this.renderMeridiemButton(side, '오후', 'PM', 'end')))), hAsync("div", { class: "sd-time-range-picker-selector__time" }, this.renderColumn(side, 'hour'), hAsync("span", { class: "sd-time-range-picker-selector__colon" }, ":"), this.renderColumn(side, 'minute'))));
18579
+ }
18580
+ render() {
18581
+ const cssVars = {
18582
+ '--selector-bg': TIMEPICKER_SELECTOR.bg,
18583
+ '--selector-radius': `${TIMEPICKER_SELECTOR.radius}px`,
18584
+ '--selector-range-padding': `${TIMEPICKER_SELECTOR.range.paddingXY}px`,
18585
+ '--selector-range-panel-gap': `${TIMEPICKER_SELECTOR.range.panelGap}px`,
18586
+ '--selector-range-section-gap': `${TIMEPICKER_SELECTOR.range.section.gap}px`,
18587
+ '--selector-range-heading-gap': `${TIMEPICKER_SELECTOR.range.heading.gap}px`,
18588
+ '--selector-range-heading-color': TIMEPICKER_SELECTOR.range.heading.color,
18589
+ '--selector-time-gap': `${TIMEPICKER_SELECTOR.time.gap}px`,
18590
+ '--selector-time-column-gap': `${TIMEPICKER_SELECTOR.time.column.gap}px`,
18591
+ '--selector-input-width': `${TIMEPICKER_SELECTOR.inputWidth}px`,
18592
+ '--selector-colon-size': `${TIMEPICKER_SELECTOR.colonSize}px`,
18593
+ '--selector-border-width': `${TIMEPICKER_COLORS.border.width}px`,
18594
+ '--selector-border-default': TIMEPICKER_COLORS.border.default,
18595
+ '--selector-border-focus': TIMEPICKER_COLORS.border.focus,
18596
+ '--selector-bg-disabled': TIMEPICKER_COLORS.bg.disabled,
18597
+ '--selector-text-default': TIMEPICKER_COLORS.text.default,
18598
+ };
18599
+ return (hAsync("div", { key: '2cfcf8240579a3526c40c430e1704c8b10556add', class: "sd-time-range-picker-selector", style: cssVars }, this.renderPanel('start', '시작 시간'), hAsync("div", { key: 'c48b1c6af7897a64339ce9c1c1da9d8e4a02c612', class: "sd-time-range-picker-selector__divider" }), this.renderPanel('end', '종료 시간')));
18600
+ }
18601
+ static get style() { return sdTimeRangePickerSelectorCss(); }
18602
+ static get cmpMeta() { return {
18603
+ "$flags$": 512,
18604
+ "$tagName$": "sd-time-range-picker-selector",
18605
+ "$members$": {
18606
+ "value": [16],
18607
+ "useMeridiem": [4, "use-meridiem"],
18608
+ "minuteStep": [2, "minute-step"],
18609
+ "rangeOrder": [1, "range-order"],
18610
+ "editingKey": [32],
18611
+ "inputDraft": [32]
18612
+ },
18613
+ "$listeners$": undefined,
18614
+ "$lazyBundleId$": "-",
18615
+ "$attrsToReflect$": []
18616
+ }; }
18617
+ }
18618
+
18619
+ const toast = {
18620
+ icon: "16",
18621
+ "default": {
18622
+ bg: "#07284A",
18623
+ content: "#FFFFFF"
18624
+ },
18625
+ danger: {
18626
+ bg: "#FB4444",
18627
+ content: "#FFFFFF"
18628
+ },
18629
+ caution: {
18630
+ bg: "#FFC700",
18631
+ content: "#222222"
18632
+ },
18633
+ complete: {
18634
+ bg: "#00973C",
18635
+ content: "#FFFFFF"
18636
+ },
18637
+ accent: {
18638
+ bg: "#005CC9",
18639
+ content: "#FFFFFF"
18640
+ },
18641
+ info: {
18642
+ bg: "#E6F1FF",
18643
+ icon: "#0075FF",
18644
+ text: "#222222",
18645
+ textLink: "#555555"
18646
+ }
18647
+ };
18648
+ var toastTokens = {
18649
+ toast: toast
18650
+ };
18651
+
18652
+ const TOAST_BUTTON_NAME_BY_TYPE = {
18653
+ default: 'secondary_sm',
18654
+ danger: 'danger_outline_sm',
18655
+ caution: 'neutral_outline_sm',
18656
+ complete: 'neutral_outline_sm',
18657
+ accent: 'neutral_outline_sm',
18658
+ info: 'secondary_sm',
18659
+ };
18660
+ const TOAST_TYPE_CONFIG = {
18661
+ default: { bg: toastTokens.toast.default.bg, content: toastTokens.toast.default.content },
18662
+ danger: { bg: toastTokens.toast.danger.bg, content: toastTokens.toast.danger.content },
18663
+ caution: { bg: toastTokens.toast.caution.bg, content: toastTokens.toast.caution.content },
18664
+ complete: { bg: toastTokens.toast.complete.bg, content: toastTokens.toast.complete.content },
18665
+ accent: { bg: toastTokens.toast.accent.bg, content: toastTokens.toast.accent.content },
18666
+ info: {
18667
+ bg: toastTokens.toast.info.bg,
18668
+ content: toastTokens.toast.info.text,
18669
+ icon: toastTokens.toast.info.icon,
18670
+ linkColor: toastTokens.toast.info.textLink,
18671
+ },
18672
+ };
18673
+ const TOAST_LAYOUT = {
18674
+ iconSize: toastTokens.toast.icon,
18675
+ };
18676
+
18677
+ const sdToastCss = () => `sd-toast{display:block;width:fit-content;height:fit-content}sd-toast .sd-toast{display:flex;width:fit-content;align-items:center;gap:var(--sd-toast-gap, 16px);padding:var(--sd-toast-padding-y, 12px) var(--sd-toast-padding-x, 24px);border-radius:var(--sd-toast-radius, 8px);background-color:var(--sd-toast-bg);color:var(--sd-toast-text);box-shadow:2px 2px 8px 2px rgba(0, 0, 0, 0.2)}sd-toast .sd-toast__icon{display:flex;align-items:center;flex-shrink:0}sd-toast .sd-toast__content{display:flex;flex:1}sd-toast .sd-toast__message{font-size:14px;line-height:24px;font-weight:500;white-space:nowrap}sd-toast .sd-toast__link{font-size:14px;line-height:24px;font-weight:700;color:var(--sd-toast-link, var(--sd-toast-text));text-decoration:underline;cursor:pointer;transition:opacity 0.2s ease;margin-left:4px;white-space:nowrap}sd-toast .sd-toast__link:hover{opacity:0.8}sd-toast .sd-toast__button{flex-shrink:0}sd-toast .sd-toast__close{flex-shrink:0}`;
18678
+
18679
+ class SdToast {
18680
+ constructor(hostRef) {
18681
+ registerInstance(this, hostRef);
18682
+ this.close = createEvent(this, "sdClose", 7);
18683
+ this.buttonClick = createEvent(this, "sdButtonClick", 7);
18684
+ }
18685
+ /** 좌측 아이콘명 */
18686
+ icon;
18687
+ /** 표시할 메시지 */
18688
+ message;
18689
+ /** 우측 링크 URL */
18690
+ link;
18691
+ /** 링크 표시 레이블 (없으면 URL 표시) */
18692
+ linkLabel;
18693
+ /** 우측 버튼 레이블 */
18694
+ buttonLabel;
18695
+ /** 닫기 버튼 표시 여부 */
18696
+ useClose = false;
18697
+ /** 토스트 타입 (색상/아이콘 프리셋) */
18698
+ type = 'default';
18699
+ /** 닫기 버튼 클릭 또는 자동 닫힘 시 발생합니다. */
18700
+ close;
18701
+ /** 우측 버튼 클릭 시 발생합니다. */
18702
+ buttonClick;
18703
+ render() {
18704
+ const typeConfig = TOAST_TYPE_CONFIG[this.type] ?? TOAST_TYPE_CONFIG.default;
18705
+ const iconSize = Number(TOAST_LAYOUT.iconSize);
18706
+ const iconColor = typeConfig.icon ?? typeConfig.content;
18707
+ const linkColor = typeConfig.linkColor ?? typeConfig.content;
18708
+ const useDefaultCloseIntent = ['default', 'caution', 'info'].includes(this.type);
18709
+ const buttonName = TOAST_BUTTON_NAME_BY_TYPE[this.type] ?? TOAST_BUTTON_NAME_BY_TYPE.default;
18710
+ return (hAsync("div", { key: 'f452ef18c746e75d0a2139fe14e10e2f6badc09e', style: {
18711
+ '--sd-toast-bg': typeConfig.bg,
18712
+ '--sd-toast-text': typeConfig.content,
18713
+ '--sd-toast-icon': iconColor,
18714
+ '--sd-toast-link': linkColor,
18715
+ } }, hAsync("div", { key: '2f72746f674d8eb2ea60ee4d77421a08c55c519d', class: "sd-toast", role: "status", "aria-live": "polite", "aria-atomic": "true" }, this.icon && (hAsync("div", { key: '41b1f311746bfae1cc85d262ab5358b3dc63b336', class: "sd-toast__icon" }, hAsync("sd-icon", { key: 'c683d9d8a4b0712f70895c9168f1db0ed6de64f9', name: this.icon, size: iconSize, color: iconColor }))), hAsync("div", { key: '6656f4d296ea8fb284f8eb6cca961a23a993c811', class: "sd-toast__content" }, hAsync("span", { key: '17a9b19754c725a6b70e56c23f92e518e7ded0a1', class: "sd-toast__message" }, this.message)), this.link && (hAsync("a", { key: '0b6da1f070cc31d136a5e366bd8d6655d8bbc291', href: this.link, class: "sd-toast__link", target: "_blank", rel: "noopener noreferrer" }, this.linkLabel || this.link)), this.buttonLabel && (hAsync("sd-button", { key: '9325d2e1ec659e72858a190077c821475e5ef8f2', class: "sd-toast__button", name: buttonName, label: this.buttonLabel, onSdClick: (event) => this.buttonClick.emit(event.detail) })), this.useClose && (hAsync("sd-ghost-button", { key: 'acbb5e957e6fa989412e9824bf2b4f4314afca8c', class: "sd-toast__close", icon: "close", intent: useDefaultCloseIntent ? 'default' : 'inverse', ariaLabel: "close", size: "xs", onClick: () => this.close.emit() })))));
18716
+ }
18717
+ static get style() { return sdToastCss(); }
18718
+ static get cmpMeta() { return {
18719
+ "$flags$": 512,
18720
+ "$tagName$": "sd-toast",
18721
+ "$members$": {
18722
+ "icon": [1],
18723
+ "message": [1],
18724
+ "link": [1],
18725
+ "linkLabel": [1, "link-label"],
18726
+ "buttonLabel": [1, "button-label"],
18727
+ "useClose": [4, "use-close"],
18728
+ "type": [1]
18729
+ },
18730
+ "$listeners$": undefined,
18731
+ "$lazyBundleId$": "-",
18732
+ "$attrsToReflect$": []
18733
+ }; }
18734
+ }
18735
+
18736
+ const DEFAULT_DURATION = 4000;
18737
+ const DEFAULT_MAX_VISIBLE = 3;
18738
+ const DEFAULT_GAP = 8;
18739
+ const DEFAULT_Z_INDEX = 999;
18740
+ const TRANSITION_DURATION = 400;
18741
+ const TRANSITION_FALLBACK_BUFFER = 100;
18742
+ const COLLAPSED_SCALE_STEP = 0.05;
18743
+ const COLLAPSED_OFFSET_STEP = 8;
18744
+
18745
+ const sdToastContainerCss = () => `sd-toast-container{display:block}sd-toast-container .sd-toast-container__item{pointer-events:auto;transition:transform 0.4s ease, opacity 0.4s ease, bottom 0.4s ease, top 0.4s ease}sd-toast-container .sd-toast-container__item::before{content:"";position:absolute;left:0;right:0;top:-8px;bottom:-8px}sd-toast-container .sd-toast-container__item--entering{transition:none}sd-toast-container .sd-toast-container__item--exiting{pointer-events:none}`;
18746
+
18747
+ let toastIdCounter = 0;
18748
+ class SdToastContainer {
18749
+ constructor(hostRef) {
18750
+ registerInstance(this, hostRef);
18751
+ this.toastShow = createEvent(this, "sdToastShow", 7);
18752
+ this.toastDismiss = createEvent(this, "sdToastDismiss", 7);
18753
+ }
18754
+ get el() { return getElement(this); }
18755
+ /** 토스트 표시 위치 */
18756
+ position = 'bottom-center';
18757
+ /** 동시에 표시할 최대 토스트 수 */
18758
+ maxVisible = DEFAULT_MAX_VISIBLE;
18759
+ /** 자동 닫힘 지연 시간 (ms, 0이면 자동 닫힘 없음) */
18760
+ defaultDuration = DEFAULT_DURATION;
18761
+ /** z-index */
18762
+ zIndex = DEFAULT_Z_INDEX;
18763
+ toasts = [];
18764
+ expanded = false;
18765
+ toastRefs = new Map();
18766
+ /** 토스트가 표시될 때 발생합니다. */
18767
+ toastShow;
18768
+ /** 토스트가 제거될 때 발생합니다. */
18769
+ toastDismiss;
18770
+ /** 토스트를 생성하고 ID를 반환합니다. */
18771
+ async create(options) {
18772
+ const id = `toast-${++toastIdCounter}`;
18773
+ const entry = { id, options, state: 'entering' };
18774
+ const duration = options.duration ?? this.defaultDuration ?? DEFAULT_DURATION;
17286
18775
  if (duration > 0) {
17287
18776
  entry.timerId = setTimeout(() => this.startDismiss(id), duration);
17288
18777
  }
@@ -17485,7 +18974,7 @@ class SdToastContainer {
17485
18974
  const activeToasts = toasts.filter(t => t.state !== 'exiting').reverse();
17486
18975
  const indexMap = new Map();
17487
18976
  activeToasts.forEach((t, i) => indexMap.set(t.id, i));
17488
- return (hAsync("div", { key: '9d0347cd5aba313c4e5cddaf7ecd9eaa3be096c8', class: "sd-toast-container", style: this.getContainerStyles(), onMouseEnter: () => {
18977
+ return (hAsync("div", { key: '3b7cfb69d072ae23f91b8afcced5d02f553f972b', class: "sd-toast-container", style: this.getContainerStyles(), onMouseEnter: () => {
17489
18978
  this.expanded = true;
17490
18979
  this.pauseTimers();
17491
18980
  }, onMouseLeave: () => {
@@ -17646,7 +19135,7 @@ class SdToggle {
17646
19135
  '--sd-toggle-content-select': TOGGLE_COLORS.content.select,
17647
19136
  '--sd-toggle-content-disabled': TOGGLE_COLORS.content.disabled,
17648
19137
  };
17649
- return (hAsync("label", { key: '26ca7c70bf68964bc7bd0fd321912ee49dfc5c73', class: this.toggleClasses, style: cssVars, "aria-label": this.label || 'toggle' }, this.label, hAsync("input", { key: '5189d6d9f234921d78a0bd3cdded8256ad273702', style: { display: 'none' }, type: "checkbox", onInput: this.handleChange })));
19138
+ return (hAsync("label", { key: 'af787ccf9ff1c49242a7f5822e8c97c5a65f2b95', class: this.toggleClasses, style: cssVars, "aria-label": this.label || 'toggle' }, this.label, hAsync("input", { key: 'e2584e65a77af911136766358ecdaa730b631394', style: { display: 'none' }, type: "checkbox", onInput: this.handleChange })));
17650
19139
  }
17651
19140
  static get style() { return sdToggleCss(); }
17652
19141
  static get cmpMeta() { return {
@@ -17699,42 +19188,29 @@ class SdTooltip {
17699
19188
  trigger = 'hover';
17700
19189
  /** 툴팁 표시 방향 */
17701
19190
  placement = 'top';
17702
- /** 아이콘 트리거 색상 */
19191
+ /** 기본(아이콘) 트리거 색상 */
17703
19192
  color = '#01BB4B';
17704
19193
  /** 툴팁 배경/텍스트 색상 타입 */
17705
19194
  tooltipType = 'default';
17706
- /** 아이콘 트리거 아이콘명 */
19195
+ /** 기본(아이콘) 트리거 아이콘명. slot="anchor" 가 있으면 무시 */
17707
19196
  icon = 'helpOutline';
17708
- /** 아이콘 트리거 크기 */
19197
+ /** 기본(아이콘) 트리거 크기 */
17709
19198
  iconSize = 12;
17710
- /** 버튼 트리거 레이블 (있으면 아이콘 대신 버튼 렌더링) */
17711
- label = '';
17712
- /** 버튼 트리거 프리셋 */
17713
- name = 'primary_sm';
17714
- /** 버튼 트리거 우측 아이콘 */
17715
- rightIcon;
17716
19199
  /** 스크린리더용 접근성 레이블 */
17717
19200
  ariaLabel = '';
17718
- /** 비활성 상태 여부 */
19201
+ /** 비활성 — 트리거만 렌더하고 툴팁을 열지 않음 */
17719
19202
  disabled = false;
17720
- /** 버튼 type 속성 */
17721
- type = 'button';
17722
19203
  /** 툴팁 우측 상단 닫기 버튼 표시 여부 */
17723
19204
  useClose = false;
17724
- /** 트리거 래퍼(.sd-tooltip-trigger)에 추가할 클래스 */
17725
- sdClass = '';
17726
19205
  /**
17727
19206
  * 툴팁 본문에 표시할 메시지. 각 항목이 한 줄로 innerHTML 렌더링됩니다.
17728
- * (HTML 문자열 허용) 지정하지 않으면 slot 으로 전달한 내용을 본문으로 사용합니다.
19207
+ * (HTML 문자열 허용) 지정하지 않으면 default slot 으로 전달한 내용을 본문으로 사용합니다.
17729
19208
  */
17730
19209
  message = [];
17731
- /** anchor 트리거 래퍼(.sd-tooltip-trigger)에 추가할 클래스. (예: Tailwind `block w-full`) */
17732
- triggerClass = '';
17733
- /** anchor 트리거 래퍼에 적용할 인라인 스타일(CSS 문자열). (예: `width:100%`) */
17734
- triggerStyle = '';
19210
+ /** 트리거 래퍼(.sd-tooltip-trigger)에 추가할 클래스. (예: Tailwind `block w-full`) */
19211
+ triggerClassName = '';
17735
19212
  showTooltip = false;
17736
19213
  slotContentHTML = '';
17737
- buttonEl;
17738
19214
  triggerEl;
17739
19215
  isAnchorMode = false;
17740
19216
  menuEl;
@@ -17742,6 +19218,8 @@ class SdTooltip {
17742
19218
  closeTimeout;
17743
19219
  static CLOSE_ANIM_MS = 150;
17744
19220
  openTooltip = () => {
19221
+ if (this.disabled)
19222
+ return;
17745
19223
  this.cancelHideTimer();
17746
19224
  this.showTooltip = true;
17747
19225
  if (this.menuEl) {
@@ -17791,22 +19269,16 @@ class SdTooltip {
17791
19269
  this.closeTooltip();
17792
19270
  }
17793
19271
  componentWillLoad() {
17794
- // slot="anchor" 자식이 있으면 anchor 모드(다른 컴포넌트를 트리거로 사용)
19272
+ // slot="anchor" 자식이 있으면 anchor 모드(다른 요소를 트리거로 사용)
17795
19273
  this.isAnchorMode = Array.from(this.el.children).some(child => child.getAttribute('slot') === 'anchor');
17796
19274
  if (!this.isAnchorMode) {
17797
- // 레거시 모드: 슬롯 내용을 본문으로 캡처하고 자식을 비웁니다.
19275
+ // 기본 모드: default slot 내용을 본문으로 캡처하고 자식을 비웁니다.
17798
19276
  this.slotContentHTML = this.el.innerHTML;
17799
19277
  this.el.replaceChildren();
17800
19278
  }
17801
19279
  // anchor 모드: 자식(slot="anchor")은 그대로 두어 Stencil 슬롯으로 투영합니다.
17802
19280
  this.el.classList.toggle('visible', true);
17803
19281
  }
17804
- componentDidRender() {
17805
- // CSS 문자열 스타일은 ref로 직접 적용 (속성/프로퍼티 전달 모두 호환)
17806
- if (this.triggerEl && this.triggerStyle !== '') {
17807
- this.triggerEl.setAttribute('style', this.triggerStyle);
17808
- }
17809
- }
17810
19282
  render() {
17811
19283
  const trigger = this.trigger ?? 'hover';
17812
19284
  const placement = this.placement ?? 'top';
@@ -17814,27 +19286,29 @@ class SdTooltip {
17814
19286
  const icon = this.icon ?? 'helpOutline';
17815
19287
  const color = this.color ?? '#01BB4B';
17816
19288
  const typeConfig = TOOLTIP_TYPE_CONFIG[tooltipType] ?? TOOLTIP_TYPE_CONFIG.default;
17817
- const hoverTrigger = {
17818
- onMouseEnter: () => this.openTooltip(),
17819
- onMouseLeave: () => !this.useClose && this.startHideTimer(),
19289
+ // 클릭 토글: 열림은 openTooltip(타이머 정리), 닫힘은 즉시(애니메이션 없이)
19290
+ const toggleTooltip = () => {
19291
+ if (this.showTooltip) {
19292
+ this.showTooltip = false;
19293
+ }
19294
+ else {
19295
+ this.openTooltip();
19296
+ }
17820
19297
  };
17821
- const toggleTooltip = () => (this.showTooltip = !this.showTooltip);
17822
- const hasLabel = this.label !== undefined && this.label !== '';
17823
- const anchorMode = this.isAnchorMode;
17824
19298
  const divTrigger = trigger === 'hover'
17825
- ? hoverTrigger
17826
- : anchorMode || !hasLabel
17827
- ? { onClick: toggleTooltip }
17828
- : {};
17829
- const buttonClickTrigger = trigger === 'click' && !anchorMode && hasLabel ? { onSdClick: toggleTooltip } : {};
17830
- const triggerClasses = ['sd-tooltip-trigger', this.sdClass, this.triggerClass]
19299
+ ? {
19300
+ onMouseEnter: () => this.openTooltip(),
19301
+ onMouseLeave: () => !this.useClose && this.startHideTimer(),
19302
+ }
19303
+ : { onClick: toggleTooltip };
19304
+ const triggerClasses = ['sd-tooltip-trigger', this.triggerClassName]
17831
19305
  .filter(c => c !== undefined && c !== '')
17832
19306
  .join(' ');
17833
- // anchor 모드에서는 slot 을 트리거로 쓰므로 본문은 message 로 받습니다.
19307
+ // 본문: message 가 있으면 각 줄을 innerHTML 로, 없으면 default slot 캡처 내용 사용
17834
19308
  const bodyHTML = this.message && this.message.length > 0
17835
19309
  ? this.message.map(line => `<div>${line}</div>`).join('')
17836
19310
  : this.slotContentHTML;
17837
- return (hAsync(Fragment, { key: '9c6adbf151f6c36536406809cf8714db7ced8d5e' }, hAsync("div", { key: '38abb48e4f209a6ef8d587c3b0d9c9158e76f7c3', ref: el => (this.triggerEl = el), class: triggerClasses, ...divTrigger }, anchorMode ? (hAsync("slot", { name: "anchor" })) : hasLabel ? (hAsync("sd-button", { ref: el => (this.buttonEl = el), name: this.name ?? 'primary_sm', label: this.label, icon: icon, rightIcon: this.rightIcon, ariaLabel: this.ariaLabel, disabled: this.disabled, type: this.type ?? 'button', 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: '178f37ef8d28dcdbc527f9d3f8b2bdc45774afd4', parentRef: anchorMode ? this.triggerEl : this.buttonEl, onSdClose: this.handleClose, placement: placement, offset: this.tooltipOffset }, hAsync("div", { key: '4d2990d20f35694c95b6627d6ddee106d9b707c2', ref: el => (this.menuEl = el), class: {
19311
+ return (hAsync(Fragment, { key: 'bdac226a4c4363e4461619b197584742e670f0dc' }, hAsync("div", { key: '3455977839562a69f8ee0a8b008e197b62944eac', ref: el => (this.triggerEl = el), class: triggerClasses, ...divTrigger }, this.isAnchorMode ? (hAsync("slot", { name: "anchor" })) : (hAsync("sd-icon", { name: icon, size: this.iconSize ?? 12, color: color, "aria-label": this.ariaLabel || undefined, class: "sd-tooltip" }))), this.showTooltip && (hAsync("sd-floating-portal", { key: '787d1240ed16df1d56d82449e8130376cc45cfa0', parentRef: this.triggerEl, onSdClose: this.handleClose, placement: placement, offset: this.tooltipOffset }, hAsync("div", { key: 'e8c6139f815f837b5ada7eb4d8d95a7ae47293a6', ref: el => (this.menuEl = el), class: {
17838
19312
  'sd-floating-menu': true,
17839
19313
  [`sd-floating-menu--${tooltipType}`]: true,
17840
19314
  [`sd-floating-menu--${placement}`]: true,
@@ -17842,7 +19316,7 @@ class SdTooltip {
17842
19316
  }, style: {
17843
19317
  '--sd-floating-bg': typeConfig.bg,
17844
19318
  '--sd-floating-content': typeConfig.content,
17845
- }, onMouseEnter: () => this.openTooltip(), onMouseLeave: () => !this.useClose && this.startHideTimer() }, hAsync("i", { key: 'ee1366c6550c30c9a9a741763bef9a3dfe8ee4e1', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, hAsync(TooltipArrow, { key: '7d0ea9d040b56e4a136b448144b447154372a526' })), hAsync("div", { key: '1e62996b156a848cf0b202740602258aa8e5c6c7', class: "sd-floating-menu__content", innerHTML: bodyHTML }), this.useClose && (hAsync("sd-ghost-button", { key: '86e6796421c16a970cee038d72386f68972733e1', class: "sd-floating-menu__close-button", icon: "close", ariaLabel: "close", size: "xxs", onClick: () => this.closeTooltip() })))))));
19319
+ }, onMouseEnter: () => this.openTooltip(), onMouseLeave: () => !this.useClose && this.startHideTimer() }, hAsync("i", { key: 'b845e04d76578972d651bf62e5580571c187367f', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, hAsync(TooltipArrow, { key: '8d4dbba5fb8134ccfa4282e2344142d3427a8d1e' })), hAsync("div", { key: '3d532c9ff232c51bde05543b24ce619c6ab34c9c', class: "sd-floating-menu__content", innerHTML: bodyHTML }), this.useClose && (hAsync("sd-ghost-button", { key: '53eb0fd00f2713451e201bb47f8b211b39287a43', class: "sd-floating-menu__close-button", icon: "close", ariaLabel: "close", size: "xxs", onClick: () => this.closeTooltip() })))))));
17846
19320
  }
17847
19321
  static get style() { return sdTooltipCss(); }
17848
19322
  static get cmpMeta() { return {
@@ -17855,17 +19329,11 @@ class SdTooltip {
17855
19329
  "tooltipType": [1, "tooltip-type"],
17856
19330
  "icon": [1],
17857
19331
  "iconSize": [2, "icon-size"],
17858
- "label": [1],
17859
- "name": [1],
17860
- "rightIcon": [1, "right-icon"],
17861
19332
  "ariaLabel": [1, "aria-label"],
17862
19333
  "disabled": [4],
17863
- "type": [1],
17864
19334
  "useClose": [4, "use-close"],
17865
- "sdClass": [1, "sd-class"],
17866
19335
  "message": [16],
17867
- "triggerClass": [1, "trigger-class"],
17868
- "triggerStyle": [1, "trigger-style"],
19336
+ "triggerClassName": [1, "trigger-class-name"],
17869
19337
  "showTooltip": [32],
17870
19338
  "slotContentHTML": [32],
17871
19339
  "show": [64],
@@ -17928,6 +19396,11 @@ registerComponents([
17928
19396
  SdTag,
17929
19397
  SdTextLink,
17930
19398
  SdTextarea,
19399
+ SdTimePicker,
19400
+ SdTimePickerSelector,
19401
+ SdTimePickerTrigger,
19402
+ SdTimeRangePicker,
19403
+ SdTimeRangePickerSelector,
17931
19404
  SdToast,
17932
19405
  SdToastContainer,
17933
19406
  SdToggle,