@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.mjs CHANGED
@@ -132,7 +132,7 @@ function hydrateFactory($stencilWindow, $stencilHydrateOpts, $stencilHydrateResu
132
132
  const NAMESPACE = 'design-system';
133
133
  const BUILD = /* design-system */ { hotModuleReplacement: false, hydratedSelectorName: "hydrated", slotRelocation: true, state: true, updatable: true};
134
134
 
135
- 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}";
135
+ 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}";
136
136
 
137
137
  /*
138
138
  Stencil Hydrate Platform v4.43.2 | MIT Licensed | https://stenciljs.com
@@ -5344,7 +5344,7 @@ class SdActionModal {
5344
5344
  if (this.height != null && this.height !== '') {
5345
5345
  sizeStyle.height = typeof this.height === 'number' ? `${this.height}px` : this.height;
5346
5346
  }
5347
- 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() })))));
5347
+ 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() })))));
5348
5348
  }
5349
5349
  static get style() { return sdActionModalCss(); }
5350
5350
  static get cmpMeta() { return {
@@ -5397,7 +5397,7 @@ class SdBadge {
5397
5397
  color = 'blue';
5398
5398
  render() {
5399
5399
  const resolvedColor = BADGE_COLOR_MAP[this.color] ?? BADGE_COLOR_MAP.blue;
5400
- return (hAsync("div", { key: '2531ebcfe66e33f8ac31be0299865ee8aa45ed17', class: "sd-badge", style: { '--sd-badge-color': resolvedColor } }, hAsync("div", { key: 'a8ddd518167b90fedb4d6d26cc28b17082f5fe0b', class: "sd-badge__dot" })));
5400
+ return (hAsync("div", { key: '71aebd3dd22a67eeb04189ff0e7c4379ec5d6802', class: "sd-badge", style: { '--sd-badge-color': resolvedColor } }, hAsync("div", { key: 'd40e81130d58b6a03ffe0461478ee8af50cd7cf6', class: "sd-badge__dot" })));
5401
5401
  }
5402
5402
  static get style() { return sdBadgeCss(); }
5403
5403
  static get cmpMeta() { return {
@@ -5470,26 +5470,26 @@ var inputTokens = {
5470
5470
  textinput: textinput
5471
5471
  };
5472
5472
 
5473
- const sm$5 = inputTokens.textinput.sm;
5474
- const md$5 = inputTokens.textinput.md;
5473
+ const sm$6 = inputTokens.textinput.sm;
5474
+ const md$6 = inputTokens.textinput.md;
5475
5475
  const BARCODE_INPUT_SIZE_MAP = {
5476
5476
  sm: {
5477
- height: sm$5.height,
5478
- paddingX: sm$5.paddingX,
5479
- gap: sm$5.gap,
5480
- radius: sm$5.radius,
5481
- fontSize: sm$5.typography.fontSize,
5482
- lineHeight: sm$5.typography.lineHeight,
5483
- fontWeight: sm$5.typography.fontWeight,
5477
+ height: sm$6.height,
5478
+ paddingX: sm$6.paddingX,
5479
+ gap: sm$6.gap,
5480
+ radius: sm$6.radius,
5481
+ fontSize: sm$6.typography.fontSize,
5482
+ lineHeight: sm$6.typography.lineHeight,
5483
+ fontWeight: sm$6.typography.fontWeight,
5484
5484
  },
5485
5485
  md: {
5486
- height: md$5.height,
5487
- paddingX: md$5.paddingX,
5488
- gap: md$5.gap,
5489
- radius: md$5.radius,
5490
- fontSize: md$5.typography.fontSize,
5491
- lineHeight: md$5.typography.lineHeight,
5492
- fontWeight: md$5.typography.fontWeight,
5486
+ height: md$6.height,
5487
+ paddingX: md$6.paddingX,
5488
+ gap: md$6.gap,
5489
+ radius: md$6.radius,
5490
+ fontSize: md$6.typography.fontSize,
5491
+ lineHeight: md$6.typography.lineHeight,
5492
+ fontWeight: md$6.typography.fontWeight,
5493
5493
  },
5494
5494
  };
5495
5495
  const BARCODE_INPUT_COLORS = {
@@ -5640,7 +5640,7 @@ class SdBarcodeInput {
5640
5640
  '--sd-system-radius-field-sm': `${sizeTokens.radius}px`,
5641
5641
  '--sd-system-color-field-bg-default': BARCODE_INPUT_COLORS.bg.barcode,
5642
5642
  };
5643
- 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 () => {
5643
+ 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 () => {
5644
5644
  if (this.disabled)
5645
5645
  return;
5646
5646
  this.internalValue = '';
@@ -6585,14 +6585,14 @@ class SdButton {
6585
6585
  const validRightIcon = isValidIcon(this.rightIcon) ? this.rightIcon : undefined;
6586
6586
  const iconOnly = !hasLabel && Boolean(validIcon) !== Boolean(validRightIcon);
6587
6587
  const accessibleName = iconOnly && this.ariaLabel.trim() !== '' ? this.ariaLabel : undefined;
6588
- return (hAsync("button", { key: 'ea6482b86f91b26cd20ab635c357b655e92c2ec1', class: this.getButtonClasses(preset, config.size, hasLabel, iconOnly), type: this.type ?? 'button', disabled: this.disabled, "aria-label": accessibleName, style: {
6588
+ return (hAsync("button", { key: '2a57abd6819306be62a379861e15cfa06c626e63', class: this.getButtonClasses(preset, config.size, hasLabel, iconOnly), type: this.type ?? 'button', disabled: this.disabled, "aria-label": accessibleName, style: {
6589
6589
  '--sd-button-bg': config.color,
6590
6590
  '--sd-button-bg-hover': PRESET_HOVER_BACKGROUNDS$1[preset],
6591
6591
  '--sd-button-border': PRESET_BORDER_COLORS$1[preset],
6592
6592
  '--sd-button-text': PRESET_TEXT_COLORS$1[preset],
6593
6593
  '--sd-button-icon': PRESET_ICON_COLORS$1[preset],
6594
6594
  '--sd-button-accent': BUTTON_FOCUS_RING_COLOR,
6595
- }, 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)" })))));
6595
+ }, 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)" })))));
6596
6596
  }
6597
6597
  static get style() { return sdButtonCss(); }
6598
6598
  static get cmpMeta() { return {
@@ -6779,7 +6779,34 @@ const datepicker = {
6779
6779
  group: {
6780
6780
  gap: "12"
6781
6781
  }
6782
- }}
6782
+ },
6783
+ time: {
6784
+ bg: {
6785
+ "default": "#F9F9F9",
6786
+ selected: "#F5FAFF"
6787
+ },
6788
+ date: {
6789
+ label: "#222222",
6790
+ unit: "#888888",
6791
+ gap: "6"
6792
+ },
6793
+ radius: "8",
6794
+ paddingX: "16",
6795
+ paddingY: "12",
6796
+ gap: "12",
6797
+ section: {
6798
+ gap: "12"
6799
+ },
6800
+ unit: {
6801
+ gap: "2"
6802
+ },
6803
+ typography: {
6804
+ fontWeight: "500",
6805
+ fontSize: "12",
6806
+ lineHeight: "20"
6807
+ }
6808
+ }
6809
+ }
6783
6810
  };
6784
6811
  var datepickerTokens = {
6785
6812
  datepicker: datepicker
@@ -7020,7 +7047,7 @@ class SdCalendar {
7020
7047
  const eventMap = this.eventMap;
7021
7048
  const legend = this.legendItems;
7022
7049
  const hasEvents = (this.events?.length ?? 0) > 0;
7023
- 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 => {
7050
+ 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 => {
7024
7051
  const isSelected = cell.inCurrentMonth && this.value !== '' && this.value === cell.date;
7025
7052
  const isToday = cell.inCurrentMonth && today === cell.date;
7026
7053
  const isDisabled = cell.inCurrentMonth && this.isDisabled(cell.date);
@@ -7033,8 +7060,8 @@ class SdCalendar {
7033
7060
  'sd-calendar__day--disabled': isDisabled,
7034
7061
  }, 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 } })))))));
7035
7062
  })), legend.length > 0 && [
7036
- hAsync("span", { key: 'a06b1cd9ec93891e3762f6334949cd23b643290f', class: "sd-calendar__divider-bottom", "aria-hidden": "true" }),
7037
- 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))))),
7063
+ hAsync("span", { key: 'd924bb7ce8ceb077cad4d35face238cbb6e39802', class: "sd-calendar__divider-bottom", "aria-hidden": "true" }),
7064
+ 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))))),
7038
7065
  ]));
7039
7066
  }
7040
7067
  static get watchers() { return {
@@ -7291,7 +7318,7 @@ class SdCallout {
7291
7318
  }
7292
7319
  render() {
7293
7320
  const showTitle = this.type === 'danger';
7294
- 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())));
7321
+ 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())));
7295
7322
  }
7296
7323
  static get style() { return sdCalloutCss(); }
7297
7324
  static get cmpMeta() { return {
@@ -7318,7 +7345,7 @@ class SdCard {
7318
7345
  /** 카드 루트 엘리먼트에 추가할 클래스 */
7319
7346
  sdClass = '';
7320
7347
  render() {
7321
- return (hAsync(Fragment, { key: 'c8835377275c2bed1a193eaf0a1db0c1c6fde960' }, hAsync("div", { key: '37cec8daa273881a40258f632109d9490e5c6978', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.sdClass}` }, hAsync("slot", { key: 'b1b485f3cfe056db25c79bbe15420484e61e5d1a' }))));
7348
+ return (hAsync(Fragment, { key: '517d48bc3444e448241974b93e31f0079d1f3ef6' }, hAsync("div", { key: '3917d6ba9fc5e20a4f45d8c798f9b29eb6a239de', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.sdClass}` }, hAsync("slot", { key: '430091d73c9419fdf8496f17fa1f52b5906fa1a4' }))));
7322
7349
  }
7323
7350
  static get style() { return sdCardCss(); }
7324
7351
  static get cmpMeta() { return {
@@ -7430,7 +7457,7 @@ class SdCheckbox {
7430
7457
  this.update = createEvent(this, "sdUpdate", 7);
7431
7458
  }
7432
7459
  get el() { return getElement(this); }
7433
- /** 현재 선택 상태 또는 배열 형태의 값 */
7460
+ /** 현재 선택 상태 또는 배열 형태의 값 (미지정 시 미선택 상태) */
7434
7461
  value;
7435
7462
  /** 배열 모드에서의 개별 값 */
7436
7463
  val;
@@ -7535,13 +7562,13 @@ class SdCheckbox {
7535
7562
  '--sd-checkbox-inverse-icon': CHECKBOX_COLORS.checked.iconInverse,
7536
7563
  '--sd-checkbox-inverse-label': CHECKBOX_COLORS.labelInverse,
7537
7564
  };
7538
- return (hAsync("label", { key: '3fa9a68790e4a777904d1c8ec1fc18b646a2e41b', class: this.checkboxClasses, style: cssVars }, hAsync("input", { key: 'ecbabd8967c8c73e0b9216157d96b5d5f07777bd', type: "checkbox", ref: el => {
7565
+ return (hAsync("label", { key: 'e8c51cf3c43e401dc7d5a625a424dc59203a18db', class: this.checkboxClasses, style: cssVars }, hAsync("input", { key: '46d20e76a9c5b7a8a44bf13c7f75970dc5c05bad', type: "checkbox", ref: el => {
7539
7566
  this.inputEl = el;
7540
- }, 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
7567
+ }, 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
7541
7568
  ? CHECKBOX_COLORS.checked.iconDisabled
7542
7569
  : this.inverse
7543
7570
  ? CHECKBOX_COLORS.checked.iconInverse
7544
- : CHECKBOX_COLORS.checked.icon })) : null), this.label && (hAsync("span", { key: '6e46c09aa41d4d1b0dbad75b825513d6e4e08f11', class: "sd-checkbox__label", "data-text": this.label }, this.label))));
7571
+ : CHECKBOX_COLORS.checked.icon })) : null), this.label && (hAsync("span", { key: '2ef1708c384c6668f256b8a75d2c7821f06ec10f', class: "sd-checkbox__label", "data-text": this.label }, this.label))));
7545
7572
  }
7546
7573
  static get watchers() { return {
7547
7574
  "value": [{
@@ -7651,8 +7678,8 @@ class SdChip {
7651
7678
  error = false;
7652
7679
  /** 비활성 상태 여부 */
7653
7680
  disabled = false;
7654
- /** 인라인 편집 가능 여부 */
7655
- editable = true;
7681
+ /** 인라인 편집 가능 여부 (기본값 false) */
7682
+ editable = false;
7656
7683
  /** 닫기 버튼 표시 여부 */
7657
7684
  showRemove = true;
7658
7685
  /** 편집 중 표시할 placeholder */
@@ -7737,11 +7764,11 @@ class SdChip {
7737
7764
  return this.inputEl ?? null;
7738
7765
  }
7739
7766
  /**
7740
- * SSR 환경에서 editable prop이 전달되지 않으면 undefined로 들어올 수 있으므로,
7741
- * false로 명시된 경우에만 편집 불가로 처리한다 (기본값 true).
7767
+ * editable이 명시적으로 true일 때만 편집 가능으로 처리한다 (기본값 false — RN SChip과 일치).
7768
+ * SSR 등에서 editable이 undefined로 들어와도 편집 불가로 안전하게 처리된다.
7742
7769
  */
7743
7770
  get isEditable() {
7744
- return this.editable !== false;
7771
+ return this.editable === true;
7745
7772
  }
7746
7773
  enterEditMode = () => {
7747
7774
  if (this.disabled || this.isEditing || !this.isEditable)
@@ -7875,7 +7902,7 @@ class SdChip {
7875
7902
  '--sd-chip-font-weight': typography.fontWeight,
7876
7903
  '--sd-chip-line-height': typography.lineHeight,
7877
7904
  };
7878
- return (hAsync("span", { key: '2cd717bc842330a28bbc89a662deda16f59106ee', class: {
7905
+ return (hAsync("span", { key: '1dbe21611f38fdcd5670bddf6da42ae4581253e8', class: {
7879
7906
  'sd-chip': true,
7880
7907
  [`sd-chip--${state}`]: true,
7881
7908
  'sd-chip--disabled': this.disabled,
@@ -8045,28 +8072,28 @@ var listItemTokens = {
8045
8072
  listItem: listItem$1
8046
8073
  };
8047
8074
 
8048
- const sm$4 = chipInputTokens.chipInput.sm;
8049
- const md$4 = chipInputTokens.chipInput.md;
8075
+ const sm$5 = chipInputTokens.chipInput.sm;
8076
+ const md$5 = chipInputTokens.chipInput.md;
8050
8077
  const CHIP_INPUT_SIZE_MAP = {
8051
8078
  sm: {
8052
- minHeight: sm$4.minHeight,
8053
- paddingX: sm$4.paddingX,
8054
- paddingY: sm$4.paddingY,
8055
- radius: sm$4.radius,
8056
- fontSize: sm$4.typography.fontSize,
8057
- lineHeight: sm$4.typography.lineHeight,
8058
- fontWeight: sm$4.typography.fontWeight,
8059
- fontFamily: sm$4.typography.fontFamily,
8079
+ minHeight: sm$5.minHeight,
8080
+ paddingX: sm$5.paddingX,
8081
+ paddingY: sm$5.paddingY,
8082
+ radius: sm$5.radius,
8083
+ fontSize: sm$5.typography.fontSize,
8084
+ lineHeight: sm$5.typography.lineHeight,
8085
+ fontWeight: sm$5.typography.fontWeight,
8086
+ fontFamily: sm$5.typography.fontFamily,
8060
8087
  },
8061
8088
  md: {
8062
- minHeight: md$4.minHeight,
8063
- paddingX: md$4.paddingX,
8064
- paddingY: md$4.paddingY,
8065
- radius: md$4.radius,
8066
- fontSize: md$4.typography.fontSize,
8067
- lineHeight: md$4.typography.lineHeight,
8068
- fontWeight: md$4.typography.fontWeight,
8069
- fontFamily: md$4.typography.fontFamily,
8089
+ minHeight: md$5.minHeight,
8090
+ paddingX: md$5.paddingX,
8091
+ paddingY: md$5.paddingY,
8092
+ radius: md$5.radius,
8093
+ fontSize: md$5.typography.fontSize,
8094
+ lineHeight: md$5.typography.lineHeight,
8095
+ fontWeight: md$5.typography.fontWeight,
8096
+ fontFamily: md$5.typography.fontFamily,
8070
8097
  },
8071
8098
  };
8072
8099
  const CHIP_INPUT_COLORS = {
@@ -8109,7 +8136,7 @@ const CHIP_INPUT_SUGGESTIONS = {
8109
8136
  emptyLineHeight: '20px',
8110
8137
  };
8111
8138
 
8112
- 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)}`;
8139
+ 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)}`;
8113
8140
 
8114
8141
  class SdChipInput {
8115
8142
  constructor(hostRef) {
@@ -8143,6 +8170,8 @@ class SdChipInput {
8143
8170
  useReset = false;
8144
8171
  /** 최대 입력 가능한 칩 개수 (없으면 제한 없음) */
8145
8172
  maxCount;
8173
+ /** 최대 개수·초기화 meta 위치 (end=우측 끝으로 정렬 / inline=콘텐츠에 이어서 배치) */
8174
+ metaPlacement = 'end';
8146
8175
  /** 중복 에러 메시지에 표시할 항목 이름 (없으면 기본 메시지 사용) */
8147
8176
  duplicateLabel;
8148
8177
  /** 자동완성 후보 목록 */
@@ -8153,8 +8182,8 @@ class SdChipInput {
8153
8182
  recommendedItems = [];
8154
8183
  /** 추천 항목 로딩 중 여부 */
8155
8184
  loadingRecommendedItems = false;
8156
- /** 자동완성 드롭다운 최소 너비 (숫자면 px, 문자열이면 그대로 적용. 없으면 입력 필드 너비를 사용) */
8157
- autocompleteMinWidth;
8185
+ /** 드롭다운(자동완성) 최소 너비 (숫자면 px, 문자열이면 그대로 적용. 기본값 200) */
8186
+ dropdownMinWidth = 200;
8158
8187
  // sd-field props
8159
8188
  /** 레이블 텍스트 */
8160
8189
  label = '';
@@ -8527,16 +8556,16 @@ class SdChipInput {
8527
8556
  ...suggestionBoxBaseStyle,
8528
8557
  width: `${this.chipInputRef?.offsetWidth ?? 0}px`,
8529
8558
  };
8530
- // 자동완성은 입력 중인 칩(필드) 기준으로 노출되며, 최소 너비를 유지한 채 텍스트 길이에 따라 늘어난다.
8531
- const autocompleteMinWidth = this.autocompleteMinWidth != null
8532
- ? typeof this.autocompleteMinWidth === 'number'
8533
- ? `${this.autocompleteMinWidth}px`
8534
- : this.autocompleteMinWidth
8535
- : `${this.fieldRef?.offsetWidth ?? 0}px`;
8559
+ // 자동완성은 입력 중인 칩(필드) 기준으로 노출되며, 최소 너비(기본 200px)를 유지한 채 텍스트 길이에 따라 늘어난다.
8560
+ const resolvedDropdownMinWidth = this.dropdownMinWidth == null
8561
+ ? `${this.fieldRef?.offsetWidth ?? 0}px`
8562
+ : typeof this.dropdownMinWidth === 'number'
8563
+ ? `${this.dropdownMinWidth}px`
8564
+ : this.dropdownMinWidth;
8536
8565
  const autocompleteBoxStyle = {
8537
8566
  ...suggestionBoxBaseStyle,
8538
8567
  width: 'max-content',
8539
- minWidth: autocompleteMinWidth,
8568
+ minWidth: resolvedDropdownMinWidth,
8540
8569
  };
8541
8570
  const suggestionItemStyle = {
8542
8571
  display: 'flex',
@@ -8564,7 +8593,7 @@ class SdChipInput {
8564
8593
  fontFamily: CHIP_INPUT_SUGGESTIONS.itemFontFamily,
8565
8594
  color: CHIP_INPUT_SUGGESTIONS.emptyColor,
8566
8595
  };
8567
- 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: {
8596
+ 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: {
8568
8597
  'sd-chip-input__field': true,
8569
8598
  'sd-chip-input__field--filled': this.inputValue !== '',
8570
8599
  'sd-chip-input__field--empty': this.inputValue === '' && this.internalValues.length > 0 && !this.focused,
@@ -8572,12 +8601,15 @@ class SdChipInput {
8572
8601
  ? this.inputValue
8573
8602
  : this.internalValues.length === 0
8574
8603
  ? this.placeholder
8575
- : '' }, 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 && (
8604
+ : '' }, 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 && (
8576
8605
  // eslint-disable-next-line jsx-a11y/no-static-element-interactions
8577
- hAsync("div", { key: 'f2e5336974905e3b7672567b29ad4f902ed2bcdf', class: "sd-chip-input__reset",
8606
+ hAsync("div", { key: '2384ba5c13e27556f8135f71c43aa8dd98922850', class: {
8607
+ 'sd-chip-input__reset': true,
8608
+ 'sd-chip-input__reset--end': this.metaPlacement === 'end',
8609
+ }, "data-placement": this.metaPlacement,
8578
8610
  // 리셋 버튼 클릭 시 input blur → portal unmount → refocus → 새 portal mount로
8579
8611
  // 두 wrapper가 body에 잠깐 겹치는 타이밍 이슈를 방지한다.
8580
- 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) => {
8612
+ 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) => {
8581
8613
  const isSelected = (this.internalValues ?? []).includes(item);
8582
8614
  const isActive = i === this.activeSuggestionIndex && !isSelected;
8583
8615
  return (hAsync("div", { key: item, class: {
@@ -8603,7 +8635,7 @@ class SdChipInput {
8603
8635
  if (!isSelected)
8604
8636
  this.addChip(item);
8605
8637
  } }, hAsync("span", { style: { flex: '1' } }, item), isSelected && (hAsync("sd-icon", { name: "check", size: "12", style: { color: '#0075FF', flexShrink: '0' } }))));
8606
- }))), 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: {
8638
+ }))), 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: {
8607
8639
  display: 'flex',
8608
8640
  flexWrap: 'wrap',
8609
8641
  gap: '8px',
@@ -8656,12 +8688,13 @@ class SdChipInput {
8656
8688
  "error": [1028],
8657
8689
  "useReset": [4, "use-reset"],
8658
8690
  "maxCount": [2, "max-count"],
8691
+ "metaPlacement": [1, "meta-placement"],
8659
8692
  "duplicateLabel": [1, "duplicate-label"],
8660
8693
  "suggestions": [1040],
8661
8694
  "loadingSuggestions": [4, "loading-suggestions"],
8662
8695
  "recommendedItems": [1040],
8663
8696
  "loadingRecommendedItems": [4, "loading-recommended-items"],
8664
- "autocompleteMinWidth": [8, "autocomplete-min-width"],
8697
+ "dropdownMinWidth": [8, "dropdown-min-width"],
8665
8698
  "label": [1],
8666
8699
  "labelWidth": [8, "label-width"],
8667
8700
  "hint": [1],
@@ -8775,7 +8808,7 @@ class SdCircleProgress {
8775
8808
  }
8776
8809
  const c = CIRCLE_PROGRESS_VIEWBOX_SIZE / 2;
8777
8810
  const showPercent = !this.indeterminate;
8778
- 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)));
8811
+ 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)));
8779
8812
  }
8780
8813
  static get style() { return sdCircleProgressCss(); }
8781
8814
  static get cmpMeta() { return {
@@ -8906,7 +8939,7 @@ class SdConfirmModal {
8906
8939
  const type = this.resolvedType;
8907
8940
  const iconName = CONFIRM_MODAL_ICON_MAP[type];
8908
8941
  const iconColor = CONFIRM_MODAL_ICON_COLOR[type];
8909
- 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() }))));
8942
+ 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() }))));
8910
8943
  }
8911
8944
  static get style() { return sdConfirmModalCss(); }
8912
8945
  static get cmpMeta() { return {
@@ -9070,28 +9103,28 @@ var fieldTokens = {
9070
9103
  field: field
9071
9104
  };
9072
9105
 
9073
- const sm$3 = datepickerTokens.datepicker.sm;
9074
- const md$3 = datepickerTokens.datepicker.md;
9106
+ const sm$4 = datepickerTokens.datepicker.sm;
9107
+ const md$4 = datepickerTokens.datepicker.md;
9075
9108
  const DATEPICKER_SIZE_MAP = {
9076
9109
  sm: {
9077
- height: sm$3.height,
9078
- paddingX: sm$3.paddingX,
9079
- gap: sm$3.gap,
9080
- iconSize: sm$3.icon,
9081
- radius: sm$3.radius,
9082
- fontSize: sm$3.typography.fontSize,
9083
- lineHeight: sm$3.typography.lineHeight,
9084
- fontWeight: sm$3.typography.fontWeight,
9110
+ height: sm$4.height,
9111
+ paddingX: sm$4.paddingX,
9112
+ gap: sm$4.gap,
9113
+ iconSize: sm$4.icon,
9114
+ radius: sm$4.radius,
9115
+ fontSize: sm$4.typography.fontSize,
9116
+ lineHeight: sm$4.typography.lineHeight,
9117
+ fontWeight: sm$4.typography.fontWeight,
9085
9118
  },
9086
9119
  md: {
9087
- height: md$3.height,
9088
- paddingX: md$3.paddingX,
9089
- gap: md$3.gap,
9090
- iconSize: md$3.icon,
9091
- radius: md$3.radius,
9092
- fontSize: md$3.typography.fontSize,
9093
- lineHeight: md$3.typography.lineHeight,
9094
- fontWeight: md$3.typography.fontWeight,
9120
+ height: md$4.height,
9121
+ paddingX: md$4.paddingX,
9122
+ gap: md$4.gap,
9123
+ iconSize: md$4.icon,
9124
+ radius: md$4.radius,
9125
+ fontSize: md$4.typography.fontSize,
9126
+ lineHeight: md$4.typography.lineHeight,
9127
+ fontWeight: md$4.typography.fontWeight,
9095
9128
  },
9096
9129
  };
9097
9130
  const DATEPICKER_COLORS = {
@@ -9143,6 +9176,8 @@ class SdDatePicker {
9143
9176
  rules = [];
9144
9177
  /** 에러 상태 여부 */
9145
9178
  error = false;
9179
+ /** 필드 상태 (없으면 error/rules 결과로 자동 결정) */
9180
+ status;
9146
9181
  /** 레이블 영역 아이콘 */
9147
9182
  icon = undefined;
9148
9183
  /** 레이블 툴팁 텍스트 */
@@ -9226,9 +9261,9 @@ class SdDatePicker {
9226
9261
  '--sd-system-color-field-border-focus': DATEPICKER_COLORS.border.focus,
9227
9262
  '--sd-system-color-field-bg-default': DATEPICKER_COLORS.bg.default,
9228
9263
  };
9229
- 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 => {
9264
+ 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 => {
9230
9265
  this.triggerRef = el;
9231
- } }, 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 })))));
9266
+ } }, 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 })))));
9232
9267
  }
9233
9268
  static get watchers() { return {
9234
9269
  "isOpen": [{
@@ -9254,6 +9289,7 @@ class SdDatePicker {
9254
9289
  "errorMessage": [1, "error-message"],
9255
9290
  "rules": [16],
9256
9291
  "error": [1028],
9292
+ "status": [1],
9257
9293
  "icon": [16],
9258
9294
  "labelTooltip": [1, "label-tooltip"],
9259
9295
  "labelTooltipProps": [16],
@@ -9316,7 +9352,7 @@ class SdDatePickerTrigger {
9316
9352
  ? DATEPICKER_COLORS.icon.disabled
9317
9353
  : DATEPICKER_COLORS.icon.default,
9318
9354
  };
9319
- return (hAsync("div", { key: '60a3b3ac02181faaabc1b77bdd8923069afa0af0', role: "button", tabindex: this.disabled ? -1 : 0, class: {
9355
+ return (hAsync("div", { key: 'b52c18bc057886ed8d6b1f5d145225a4c31f0035', role: "button", tabindex: this.disabled ? -1 : 0, class: {
9320
9356
  'sd-date-picker-trigger': true,
9321
9357
  'sd-date-picker-trigger--disabled': this.disabled,
9322
9358
  }, style: cssVars, onClick: this.handleClick, onKeyDown: e => {
@@ -9324,7 +9360,7 @@ class SdDatePickerTrigger {
9324
9360
  e.preventDefault();
9325
9361
  this.handleClick();
9326
9362
  }
9327
- } }, 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)));
9363
+ } }, 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)));
9328
9364
  }
9329
9365
  static get style() { return sdDatePickerTriggerCss(); }
9330
9366
  static get cmpMeta() { return {
@@ -9348,6 +9384,33 @@ const RANGE_LAYOUT = {
9348
9384
  panelGap: datepickerTokens.datepicker.calendar.range.panelGap,
9349
9385
  divider: datepickerTokens.datepicker.calendar.range.divider,
9350
9386
  };
9387
+ const timeTokens = datepickerTokens.datepicker.calendar.time;
9388
+ /** 시간(시:분) 선택 푸터 레이아웃 토큰 */
9389
+ const TIME_LAYOUT = {
9390
+ bgDefault: timeTokens.bg.default,
9391
+ bgSelected: timeTokens.bg.selected,
9392
+ dateLabel: timeTokens.date.label,
9393
+ dateUnit: timeTokens.date.unit,
9394
+ dateGap: timeTokens.date.gap,
9395
+ radius: timeTokens.radius,
9396
+ paddingX: timeTokens.paddingX,
9397
+ paddingY: timeTokens.paddingY,
9398
+ gap: timeTokens.gap,
9399
+ sectionGap: timeTokens.section.gap,
9400
+ unitGap: timeTokens.unit.gap,
9401
+ fontSize: timeTokens.typography.fontSize,
9402
+ lineHeight: timeTokens.typography.lineHeight,
9403
+ fontWeight: timeTokens.typography.fontWeight,
9404
+ // 시:분 입력 박스는 datepicker 필드(sm) 토큰을 재사용한다
9405
+ input: {
9406
+ height: DATEPICKER_SIZE_MAP.sm.height,
9407
+ radius: DATEPICKER_SIZE_MAP.sm.radius,
9408
+ border: DATEPICKER_COLORS.border.default,
9409
+ borderFocus: DATEPICKER_COLORS.border.focus,
9410
+ text: DATEPICKER_COLORS.text.default,
9411
+ placeholder: DATEPICKER_COLORS.text.disabled,
9412
+ },
9413
+ };
9351
9414
 
9352
9415
  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%}`;
9353
9416
 
@@ -9369,6 +9432,11 @@ class SdDateRangePicker {
9369
9432
  selectable;
9370
9433
  /** 최대 선택 가능한 날짜 범위 (일 단위) */
9371
9434
  maxRange;
9435
+ /**
9436
+ * 시간(시:분) 선택 푸터 사용 여부.
9437
+ * true이면 value는 "YYYY-MM-DD HH:mm" 형식이 되고, 캘린더 하단에 시작·종료 시간 입력이 표시됩니다.
9438
+ */
9439
+ useTimePicker = false;
9372
9440
  /** 비활성 상태 여부 */
9373
9441
  disabled = false;
9374
9442
  /** 필드 너비 (숫자면 px, 문자열이면 그대로 적용) */
@@ -9390,6 +9458,8 @@ class SdDateRangePicker {
9390
9458
  rules = [];
9391
9459
  /** 에러 상태 여부 */
9392
9460
  error = false;
9461
+ /** 필드 상태 (없으면 error/rules 결과로 자동 결정) */
9462
+ status;
9393
9463
  /** 레이블 영역 아이콘 */
9394
9464
  icon = undefined;
9395
9465
  /** 레이블 툴팁 텍스트 */
@@ -9449,7 +9519,9 @@ class SdDateRangePicker {
9449
9519
  }
9450
9520
  };
9451
9521
  handleSelect = (e) => {
9452
- this.closeDropdown();
9522
+ // 시간 선택 모드에서는 사용자가 시:분을 조정할 수 있도록 드롭다운을 닫지 않고 실시간 반영만 한다
9523
+ if (!this.useTimePicker)
9524
+ this.closeDropdown();
9453
9525
  this.value = e.detail;
9454
9526
  const nextValue = this.value;
9455
9527
  requestAnimationFrame(() => {
@@ -9464,6 +9536,14 @@ class SdDateRangePicker {
9464
9536
  return '';
9465
9537
  return `${this.value[0]} ~ ${this.value[1]}`;
9466
9538
  }
9539
+ static DEFAULT_PLACEHOLDER = 'YYYY-MM-DD ~ YYYY-MM-DD';
9540
+ get resolvedPlaceholder() {
9541
+ // placeholder를 따로 지정하지 않았고 시간 선택 모드이면 시:분을 포함한 기본 placeholder를 쓴다
9542
+ if (this.useTimePicker && this.placeholder === SdDateRangePicker.DEFAULT_PLACEHOLDER) {
9543
+ return 'YYYY-MM-DD HH:mm ~ YYYY-MM-DD HH:mm';
9544
+ }
9545
+ return this.placeholder;
9546
+ }
9467
9547
  disconnectedCallback() {
9468
9548
  if (this.closeAnimationTimer)
9469
9549
  clearTimeout(this.closeAnimationTimer);
@@ -9477,9 +9557,9 @@ class SdDateRangePicker {
9477
9557
  '--sd-system-color-field-border-focus': DATEPICKER_COLORS.border.focus,
9478
9558
  '--sd-system-color-field-bg-default': DATEPICKER_COLORS.bg.default,
9479
9559
  };
9480
- 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 => {
9560
+ 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 => {
9481
9561
  this.triggerRef = el;
9482
- } }, 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 })))));
9562
+ } }, 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 })))));
9483
9563
  }
9484
9564
  static get watchers() { return {
9485
9565
  "isOpen": [{
@@ -9496,6 +9576,7 @@ class SdDateRangePicker {
9496
9576
  "placeholder": [513],
9497
9577
  "selectable": [16],
9498
9578
  "maxRange": [2, "max-range"],
9579
+ "useTimePicker": [4, "use-time-picker"],
9499
9580
  "disabled": [516],
9500
9581
  "width": [8],
9501
9582
  "label": [1],
@@ -9506,6 +9587,7 @@ class SdDateRangePicker {
9506
9587
  "errorMessage": [1, "error-message"],
9507
9588
  "rules": [16],
9508
9589
  "error": [1028],
9590
+ "status": [1],
9509
9591
  "icon": [16],
9510
9592
  "labelTooltip": [1, "label-tooltip"],
9511
9593
  "labelTooltipProps": [16],
@@ -9524,7 +9606,7 @@ class SdDateRangePicker {
9524
9606
  }; }
9525
9607
  }
9526
9608
 
9527
- 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}`;
9609
+ 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)}`;
9528
9610
 
9529
9611
  class SdDateRangePickerCalendar {
9530
9612
  constructor(hostRef) {
@@ -9538,11 +9620,20 @@ class SdDateRangePickerCalendar {
9538
9620
  selectable;
9539
9621
  /** 최대 선택 가능 일 수 */
9540
9622
  maxRange;
9623
+ /** 시간(시:분) 선택 푸터 사용 여부 */
9624
+ useTimePicker = false;
9541
9625
  currentYear;
9542
9626
  currentMonth;
9543
9627
  pendingStart = '';
9544
9628
  hoverDate = '';
9545
9629
  displayValue = null;
9630
+ // 시:분은 2자리 미만도 허용하기 위해 문자열로 관리하고 emit/blur 시 패딩한다
9631
+ startHour = '00';
9632
+ startMinute = '00';
9633
+ endHour = '00';
9634
+ endMinute = '00';
9635
+ /** 직접 emit한 값이 value prop으로 되돌아오는 에코를 구분해 시간 입력 clobber를 막는다 */
9636
+ lastEmitted = '';
9546
9637
  /** 날짜 범위 선택 시 발생합니다. */
9547
9638
  select;
9548
9639
  /** 달력 뷰가 변경될 때 발생합니다. */
@@ -9555,13 +9646,31 @@ class SdDateRangePickerCalendar {
9555
9646
  this.syncFromValue();
9556
9647
  }
9557
9648
  syncFromValue() {
9558
- const base = this.value?.[0] || today;
9649
+ // 자신이 emit한 값이 그대로 돌아온 경우(에코)에는 시간 입력 상태를 건드리지 않는다
9650
+ if (this.useTimePicker && JSON.stringify(this.value) === this.lastEmitted)
9651
+ return;
9652
+ const start = this.splitDateTime(this.value?.[0]);
9653
+ const end = this.splitDateTime(this.value?.[1]);
9654
+ const base = start.date || today;
9559
9655
  const [year, month] = base.split('-').map(Number);
9560
9656
  this.currentYear = year;
9561
9657
  this.currentMonth = month;
9562
9658
  this.pendingStart = '';
9563
9659
  this.hoverDate = '';
9564
- this.displayValue = this.value ? [this.value[0], this.value[1]] : null;
9660
+ // displayValue는 날짜 부분만 보관 — 캘린더 그리드 로직은 시간과 무관하게 동작한다
9661
+ this.displayValue = this.value ? [start.date, end.date] : null;
9662
+ this.startHour = start.hour;
9663
+ this.startMinute = start.minute;
9664
+ this.endHour = end.hour;
9665
+ this.endMinute = end.minute;
9666
+ }
9667
+ /** "YYYY-MM-DD HH:mm" 또는 "YYYY-MM-DD"를 날짜/시/분으로 분리한다 */
9668
+ splitDateTime(v) {
9669
+ if (v == null || v === '')
9670
+ return { date: '', hour: '00', minute: '00' };
9671
+ const [date = '', time = ''] = v.split(' ');
9672
+ const [hour = '00', minute = '00'] = time.split(':');
9673
+ return { date, hour, minute };
9565
9674
  }
9566
9675
  get rightYear() {
9567
9676
  return this.currentMonth === 12 ? this.currentYear + 1 : this.currentYear;
@@ -9668,13 +9777,69 @@ class SdDateRangePickerCalendar {
9668
9777
  this.pendingStart = cell.date;
9669
9778
  this.displayValue = null;
9670
9779
  this.hoverDate = '';
9780
+ // 새 범위 선택을 시작하면 시작=00:00, 종료=23:59(하루 전체)로 초기화한다
9781
+ if (this.useTimePicker) {
9782
+ this.startHour = '00';
9783
+ this.startMinute = '00';
9784
+ this.endHour = '23';
9785
+ this.endMinute = '59';
9786
+ }
9671
9787
  return;
9672
9788
  }
9673
9789
  const newRange = [this.pendingStart, cell.date];
9674
9790
  this.pendingStart = '';
9675
9791
  this.hoverDate = '';
9676
9792
  this.displayValue = newRange;
9677
- this.select.emit(newRange);
9793
+ this.emitRange(newRange[0], newRange[1]);
9794
+ }
9795
+ /** 날짜 범위(+ useTimePicker면 시:분)를 결합해 sdSelect로 emit한다 */
9796
+ emitRange(startDate, endDate) {
9797
+ const range = this.useTimePicker
9798
+ ? [
9799
+ `${startDate} ${this.pad(this.startHour)}:${this.pad(this.startMinute)}`,
9800
+ `${endDate} ${this.pad(this.endHour)}:${this.pad(this.endMinute)}`,
9801
+ ]
9802
+ : [startDate, endDate];
9803
+ this.lastEmitted = JSON.stringify(range);
9804
+ this.select.emit(range);
9805
+ }
9806
+ pad(v) {
9807
+ return String(Number(v) || 0).padStart(2, '0');
9808
+ }
9809
+ /** 시:분 입력 — 숫자만/2자리로 제한하고 범위(시 0~23, 분 0~59)로 클램프한다 */
9810
+ handleTimeInput(which, part, event) {
9811
+ const input = event.target;
9812
+ const digits = input.value.replace(/\D/g, '').slice(0, 2);
9813
+ const max = part === 'h' ? 23 : 59;
9814
+ const next = digits !== '' && Number(digits) > max ? String(max) : digits;
9815
+ input.value = next;
9816
+ this.setTimePart(which, part, next);
9817
+ // 범위가 확정된 상태면 실시간으로 재emit한다
9818
+ if (this.displayValue != null && this.displayValue[0] !== '' && this.displayValue[1] !== '') {
9819
+ this.emitRange(this.displayValue[0], this.displayValue[1]);
9820
+ }
9821
+ }
9822
+ handleTimeBlur(which, part) {
9823
+ this.setTimePart(which, part, this.pad(this.getTimePart(which, part)));
9824
+ }
9825
+ getTimePart(which, part) {
9826
+ if (which === 'start')
9827
+ return part === 'h' ? this.startHour : this.startMinute;
9828
+ return part === 'h' ? this.endHour : this.endMinute;
9829
+ }
9830
+ setTimePart(which, part, value) {
9831
+ if (which === 'start') {
9832
+ if (part === 'h')
9833
+ this.startHour = value;
9834
+ else
9835
+ this.startMinute = value;
9836
+ }
9837
+ else {
9838
+ if (part === 'h')
9839
+ this.endHour = value;
9840
+ else
9841
+ this.endMinute = value;
9842
+ }
9678
9843
  }
9679
9844
  handleDayHover(cell) {
9680
9845
  if (!cell.inCurrentMonth)
@@ -9740,6 +9905,22 @@ class SdDateRangePickerCalendar {
9740
9905
  }, 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 : '')));
9741
9906
  }))));
9742
9907
  }
9908
+ renderTimeSection(which, date, suffix) {
9909
+ const active = date !== '';
9910
+ const [year = '', month = '', day = ''] = active ? date.split('-') : [];
9911
+ const hour = which === 'start' ? this.startHour : this.endHour;
9912
+ const minute = which === 'start' ? this.startMinute : this.endMinute;
9913
+ const renderNum = (n, strip) => (hAsync("span", { class: "sd-date-range-picker-calendar__time-num" }, active && n !== '' ? (strip ? String(Number(n)) : n) : '-'));
9914
+ return (hAsync("div", { class: {
9915
+ 'sd-date-range-picker-calendar__time-section': true,
9916
+ 'sd-date-range-picker-calendar__time-section--active': active,
9917
+ } }, 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)));
9918
+ }
9919
+ renderTimeFooter() {
9920
+ const startDate = this.pendingStart || this.displayValue?.[0] || '';
9921
+ const endDate = this.displayValue?.[1] || '';
9922
+ 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, '까지'))));
9923
+ }
9743
9924
  render() {
9744
9925
  const cssVars = {
9745
9926
  '--calendar-bg': CALENDAR_LAYOUT.bg,
@@ -9772,8 +9953,31 @@ class SdDateRangePickerCalendar {
9772
9953
  '--range-height': `${RANGE_LAYOUT.height}px`,
9773
9954
  '--range-panel-gap': `${RANGE_LAYOUT.panelGap}px`,
9774
9955
  '--range-divider': RANGE_LAYOUT.divider,
9956
+ '--time-bg-default': TIME_LAYOUT.bgDefault,
9957
+ '--time-bg-selected': TIME_LAYOUT.bgSelected,
9958
+ '--time-date-label': TIME_LAYOUT.dateLabel,
9959
+ '--time-date-unit': TIME_LAYOUT.dateUnit,
9960
+ '--time-date-gap': `${TIME_LAYOUT.dateGap}px`,
9961
+ '--time-radius': `${TIME_LAYOUT.radius}px`,
9962
+ '--time-padding-x': `${TIME_LAYOUT.paddingX}px`,
9963
+ '--time-padding-y': `${TIME_LAYOUT.paddingY}px`,
9964
+ '--time-gap': `${TIME_LAYOUT.gap}px`,
9965
+ '--time-section-gap': `${TIME_LAYOUT.sectionGap}px`,
9966
+ '--time-unit-gap': `${TIME_LAYOUT.unitGap}px`,
9967
+ '--time-font-size': `${TIME_LAYOUT.fontSize}px`,
9968
+ '--time-line-height': `${TIME_LAYOUT.lineHeight}px`,
9969
+ '--time-font-weight': TIME_LAYOUT.fontWeight,
9970
+ '--time-input-height': `${TIME_LAYOUT.input.height}px`,
9971
+ '--time-input-radius': `${TIME_LAYOUT.input.radius}px`,
9972
+ '--time-input-border': TIME_LAYOUT.input.border,
9973
+ '--time-input-border-focus': TIME_LAYOUT.input.borderFocus,
9974
+ '--time-input-text': TIME_LAYOUT.input.text,
9975
+ '--time-input-placeholder': TIME_LAYOUT.input.placeholder,
9775
9976
  };
9776
- 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)))));
9977
+ return (hAsync(Fragment, { key: '7d368d23f2c9d2b28c847a7fee5de474edc350f0' }, hAsync("div", { key: '6d97bfa728eb65c46d21f53c3b046b1a0c7d2ff6', class: {
9978
+ 'sd-date-range-picker-calendar': true,
9979
+ 'sd-date-range-picker-calendar--with-time': this.useTimePicker,
9980
+ }, 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())));
9777
9981
  }
9778
9982
  static get watchers() { return {
9779
9983
  "value": [{
@@ -9788,11 +9992,16 @@ class SdDateRangePickerCalendar {
9788
9992
  "value": [16],
9789
9993
  "selectable": [16],
9790
9994
  "maxRange": [2, "max-range"],
9995
+ "useTimePicker": [4, "use-time-picker"],
9791
9996
  "currentYear": [32],
9792
9997
  "currentMonth": [32],
9793
9998
  "pendingStart": [32],
9794
9999
  "hoverDate": [32],
9795
- "displayValue": [32]
10000
+ "displayValue": [32],
10001
+ "startHour": [32],
10002
+ "startMinute": [32],
10003
+ "endHour": [32],
10004
+ "endMinute": [32]
9796
10005
  },
9797
10006
  "$listeners$": undefined,
9798
10007
  "$lazyBundleId$": "-",
@@ -9816,7 +10025,7 @@ class SdDivider {
9816
10025
  const hostStyle = {
9817
10026
  '--sd-divider-color': DIVIDER_COLORS.default,
9818
10027
  };
9819
- return (hAsync(Host, { key: 'b19941ad314f31fccf77ea0dd3373f9e3362ecd2', style: hostStyle }, hAsync("hr", { key: 'bbc765fc901298fbacb8323fecd8fd1ca4683d19', "aria-orientation": this.vertical ? 'vertical' : 'horizontal' })));
10028
+ return (hAsync(Host, { key: '5e25f94dbe34f19280f6952e0a1bfbf4e4816264', style: hostStyle }, hAsync("hr", { key: 'a47f51ba0dfc15819cd5cda169554433b978eb15', "aria-orientation": this.vertical ? 'vertical' : 'horizontal' })));
9820
10029
  }
9821
10030
  static get style() { return sdDividerCss(); }
9822
10031
  static get cmpMeta() { return {
@@ -10261,28 +10470,28 @@ const FIELD_ADDON_ALIGN_MAP = {
10261
10470
  center: 'center',
10262
10471
  end: 'flex-end',
10263
10472
  };
10264
- const sm$2 = fieldTokens.field.label.sm;
10265
- const md$2 = fieldTokens.field.label.md;
10473
+ const sm$3 = fieldTokens.field.label.sm;
10474
+ const md$3 = fieldTokens.field.label.md;
10266
10475
  const FIELD_LABEL_SIZE_MAP = {
10267
10476
  sm: {
10268
- height: sm$2.height,
10269
- gap: sm$2.gap,
10270
- icon: sm$2.icon,
10271
- fontSize: sm$2.typography.fontSize,
10272
- lineHeight: sm$2.typography.lineHeight,
10273
- fontWeight: sm$2.typography.fontWeight,
10477
+ height: sm$3.height,
10478
+ gap: sm$3.gap,
10479
+ icon: sm$3.icon,
10480
+ fontSize: sm$3.typography.fontSize,
10481
+ lineHeight: sm$3.typography.lineHeight,
10482
+ fontWeight: sm$3.typography.fontWeight,
10274
10483
  },
10275
10484
  md: {
10276
- height: md$2.height,
10277
- gap: md$2.gap,
10278
- icon: md$2.icon,
10279
- fontSize: md$2.typography.fontSize,
10280
- lineHeight: md$2.typography.lineHeight,
10281
- fontWeight: md$2.typography.fontWeight,
10485
+ height: md$3.height,
10486
+ gap: md$3.gap,
10487
+ icon: md$3.icon,
10488
+ fontSize: md$3.typography.fontSize,
10489
+ lineHeight: md$3.typography.lineHeight,
10490
+ fontWeight: md$3.typography.fontWeight,
10282
10491
  },
10283
10492
  };
10284
10493
 
10285
- 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)}`;
10494
+ 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)}`;
10286
10495
 
10287
10496
  const FORM_PARENT_TAGS = [
10288
10497
  'sd-input',
@@ -10293,6 +10502,8 @@ const FORM_PARENT_TAGS = [
10293
10502
  'sd-file-picker',
10294
10503
  'sd-date-picker',
10295
10504
  'sd-date-range-picker',
10505
+ 'sd-time-picker',
10506
+ 'sd-time-range-picker',
10296
10507
  'sd-chip-input',
10297
10508
  ];
10298
10509
  class SdField {
@@ -10334,6 +10545,13 @@ class SdField {
10334
10545
  label = '';
10335
10546
  /** 레이블 너비 */
10336
10547
  labelWidth = '';
10548
+ /**
10549
+ * 레이블 박스 높이 (숫자면 px). 미지정 시 size별 기본값 사용.
10550
+ * multiline 등 컨트롤 박스가 커질 때 레이블을 첫 행에 맞추기 위해 사용한다.
10551
+ */
10552
+ labelHeight;
10553
+ /** 멀티라인 컨트롤 — 컨트롤 높이를 고정하지 않고 min-height만 적용한다. */
10554
+ multiline = false;
10337
10555
  /** 필드 우측 어드온 레이블 */
10338
10556
  addonLabel = '';
10339
10557
  /** 어드온 정렬 방향 */
@@ -10464,7 +10682,11 @@ class SdField {
10464
10682
  };
10465
10683
  const labelCssVars = this.label !== ''
10466
10684
  ? {
10467
- '--sd-field-label-height': `${labelTokens.height}px`,
10685
+ '--sd-field-label-height': this.labelHeight !== undefined && this.labelHeight !== '' && this.labelHeight !== 0
10686
+ ? typeof this.labelHeight === 'number'
10687
+ ? `${this.labelHeight}px`
10688
+ : this.labelHeight
10689
+ : `${labelTokens.height}px`,
10468
10690
  '--sd-field-label-gap': `${labelTokens.gap}px`,
10469
10691
  '--sd-field-label-font-size': `${labelTokens.fontSize}px`,
10470
10692
  '--sd-field-label-line-height': `${labelTokens.lineHeight}px`,
@@ -10496,19 +10718,20 @@ class SdField {
10496
10718
  : {}),
10497
10719
  }
10498
10720
  : {};
10499
- return (hAsync("div", { key: '7474477aa89e459e5f31cc085e855db6d1851822', class: {
10721
+ return (hAsync("div", { key: 'd29e49fe9ecf467f0c1ed443524fac2648dc9da4', class: {
10500
10722
  'sd-field': true,
10501
10723
  'sd-field--has-label': this.label !== '',
10502
10724
  'sd-field--has-addon': addon !== '',
10725
+ 'sd-field--multiline': this.multiline,
10503
10726
  'sd-field--borderless': this.borderless,
10504
10727
  [this.fieldStatus]: this.fieldStatus !== '',
10505
- }, 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: {
10728
+ }, 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: {
10506
10729
  'sd-field__control': true,
10507
10730
  'sd-field__control--has-addon': addon !== '',
10508
10731
  }, style: this.width !== '' && this.width !== 0
10509
10732
  ? { width: typeof this.width === 'number' ? `${this.width}px` : this.width }
10510
- : {} }, addon && (hAsync("div", { key: 'ace4b56d75bbaff3335694b6549b383a023d9125', class: "sd-field__addon" }, this.icon && (hAsync("sd-icon", { key: 'aba7a6c3834f73be2c1be1e82f4673aad317c383', name: this.icon.name, size: this.icon.size ??
10511
- 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))))));
10733
+ : {} }, addon && (hAsync("div", { key: '7ac28abf5f37b7ada42b16f81227afb5c7f8d656', class: "sd-field__addon" }, this.icon && (hAsync("sd-icon", { key: 'd995424c6f620b090006cdbcf8645d2ff822e802', name: this.icon.name, size: this.icon.size ??
10734
+ 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))))));
10512
10735
  }
10513
10736
  renderLabel(label) {
10514
10737
  if (label == null || label === '')
@@ -10536,6 +10759,8 @@ class SdField {
10536
10759
  "borderless": [4],
10537
10760
  "label": [1],
10538
10761
  "labelWidth": [8, "label-width"],
10762
+ "labelHeight": [8, "label-height"],
10763
+ "multiline": [4],
10539
10764
  "addonLabel": [1, "addon-label"],
10540
10765
  "addonAlign": [1, "addon-align"],
10541
10766
  "icon": [16],
@@ -10559,12 +10784,39 @@ const filepicker = {
10559
10784
  paddingX: "12",
10560
10785
  gap: "8",
10561
10786
  radius: "4",
10787
+ borderWidth: "1",
10562
10788
  typography: {
10789
+ 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",
10563
10790
  fontWeight: "400",
10564
10791
  fontSize: "12",
10565
- lineHeight: "20"},
10792
+ lineHeight: "20",
10793
+ textDecoration: "none"
10794
+ },
10566
10795
  icon: "16"
10567
10796
  },
10797
+ md: {
10798
+ height: "36",
10799
+ paddingX: "16",
10800
+ gap: "12",
10801
+ radius: "6",
10802
+ borderWidth: "1",
10803
+ typography: {
10804
+ 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",
10805
+ fontWeight: "400",
10806
+ fontSize: "14",
10807
+ textDecoration: "none",
10808
+ lineHeight: "24"
10809
+ },
10810
+ icon: "20"
10811
+ },
10812
+ border: {
10813
+ "default": "#AAAAAA",
10814
+ disabled: "#CCCCCC"
10815
+ },
10816
+ bg: {
10817
+ "default": "#FFFFFF",
10818
+ disabled: "#E1E1E1"
10819
+ },
10568
10820
  text: {
10569
10821
  "default": "#222222",
10570
10822
  placeholder: "#AAAAAA",
@@ -10579,15 +10831,25 @@ var filePickerTokens = {
10579
10831
  };
10580
10832
 
10581
10833
  const fp = filePickerTokens.filepicker;
10582
- const FILE_PICKER_LAYOUT = {
10583
- height: fp.sm.height,
10584
- paddingX: fp.sm.paddingX,
10585
- gap: fp.sm.gap,
10586
- radius: fp.sm.radius,
10587
- fontSize: fp.sm.typography.fontSize,
10588
- lineHeight: fp.sm.typography.lineHeight,
10589
- fontWeight: fp.sm.typography.fontWeight,
10590
- iconSize: fp.sm.icon};
10834
+ const buildLayout = (s) => ({
10835
+ height: fp[s].height,
10836
+ paddingX: fp[s].paddingX,
10837
+ gap: fp[s].gap,
10838
+ radius: fp[s].radius,
10839
+ borderWidth: fp[s].borderWidth,
10840
+ fontSize: fp[s].typography.fontSize,
10841
+ lineHeight: fp[s].typography.lineHeight,
10842
+ fontWeight: fp[s].typography.fontWeight,
10843
+ iconSize: fp[s].icon,
10844
+ contentsGap: fieldTokens.field.contents.gap,
10845
+ });
10846
+ /** 기본(sm) 레이아웃 — 하위호환용 단일 export */
10847
+ const FILE_PICKER_LAYOUT = buildLayout('sm');
10848
+ /** size별 레이아웃 맵 */
10849
+ const FILE_PICKER_LAYOUTS = {
10850
+ sm: FILE_PICKER_LAYOUT,
10851
+ md: buildLayout('md'),
10852
+ };
10591
10853
  const FILE_PICKER_COLORS = {
10592
10854
  text: fp.text,
10593
10855
  icon: {
@@ -10634,6 +10896,8 @@ class SdFilePicker {
10634
10896
  /** 최대 파일 개수 */
10635
10897
  maxFiles;
10636
10898
  // sd-field 패스스루 props
10899
+ /** 필드 크기 */
10900
+ size = 'sm';
10637
10901
  /** 폼 연동용 name 속성 */
10638
10902
  name = nanoid();
10639
10903
  /** 레이블 텍스트 */
@@ -10836,7 +11100,7 @@ class SdFilePicker {
10836
11100
  renderChipList() {
10837
11101
  if (!this.hasChips())
10838
11102
  return null;
10839
- return (hAsync("div", { class: "sd-file-picker__chip-list" }, this.internalValue.map((file, index) => (hAsync("sd-chip", { value: file.name, onSdRemove: () => this.handleChipRemove(index) })))));
11103
+ 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) })))));
10840
11104
  }
10841
11105
  renderListbox() {
10842
11106
  if (!this.hasChips() || !this.isListboxOpen)
@@ -10862,38 +11126,39 @@ class SdFilePicker {
10862
11126
  render() {
10863
11127
  const hasFiles = this.hasFiles();
10864
11128
  const displayText = this.getDisplayText();
11129
+ const layout = FILE_PICKER_LAYOUTS[this.size] ?? FILE_PICKER_LAYOUT;
10865
11130
  const cssVars = {
10866
- '--sd-file-picker-font-size': `${FILE_PICKER_LAYOUT.fontSize}px`,
10867
- '--sd-file-picker-line-height': `${FILE_PICKER_LAYOUT.lineHeight}px`,
10868
- '--sd-file-picker-font-weight': FILE_PICKER_LAYOUT.fontWeight,
10869
- '--sd-file-picker-padding-x': `${FILE_PICKER_LAYOUT.paddingX}px`,
10870
- '--sd-file-picker-gap': `${FILE_PICKER_LAYOUT.gap}px`,
11131
+ '--sd-file-picker-font-size': `${layout.fontSize}px`,
11132
+ '--sd-file-picker-line-height': `${layout.lineHeight}px`,
11133
+ '--sd-file-picker-font-weight': layout.fontWeight,
11134
+ '--sd-file-picker-padding-x': `${layout.paddingX}px`,
11135
+ '--sd-file-picker-gap': `${layout.gap}px`,
10871
11136
  '--sd-file-picker-text-color': FILE_PICKER_COLORS.text.default,
10872
11137
  '--sd-file-picker-placeholder-color': FILE_PICKER_COLORS.text.placeholder,
10873
11138
  '--sd-file-picker-disabled-color': FILE_PICKER_COLORS.text.disabled,
10874
- // sd-field 시스템 변수 override
10875
- '--sd-system-size-field-sm-height': `${FILE_PICKER_LAYOUT.height}px`,
10876
- '--sd-system-radius-field-sm': `${FILE_PICKER_LAYOUT.radius}px`,
11139
+ // sd-field 시스템 변수 override (size에 맞춰)
11140
+ [`--sd-system-size-field-${this.size}-height`]: `${layout.height}px`,
11141
+ [`--sd-system-radius-field-${this.size}`]: `${layout.radius}px`,
10877
11142
  };
10878
11143
  const showListbox = this.multiple && this.useMultipleListBox;
10879
- 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 => {
11144
+ 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 => {
10880
11145
  if (e.key === 'Enter' || e.key === ' ') {
10881
11146
  e.preventDefault();
10882
11147
  this.handleClick();
10883
11148
  }
10884
- } }, 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: {
11149
+ } }, 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: {
10885
11150
  'sd-file-picker__text': true,
10886
11151
  'sd-file-picker__text--placeholder': !hasFiles,
10887
11152
  'sd-file-picker__text--active': hasFiles,
10888
- } }, displayText), showListbox && hasFiles && !this.disabled && (hAsync("sd-ghost-button", { key: 'a68ba1cd8dabf75279eba8993befef8dd03008ae', icon: "caretDown", size: "xxs", ariaLabel: "toggle file list", disabled: this.disabled, class: {
11153
+ } }, displayText), showListbox && hasFiles && !this.disabled && (hAsync("sd-ghost-button", { key: '8e42d38452d00256147ee65e614bdeb7040917d7', icon: "caretDown", size: "xxs", ariaLabel: "toggle file list", disabled: this.disabled, class: {
10889
11154
  'sd-file-picker__caret': true,
10890
11155
  'sd-file-picker__caret--open': this.isListboxOpen,
10891
- }, 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))));
10892
- return (hAsync("div", { key: '952fbde18439ce103d62ede9e7b7a59dda408aa1', class: {
11156
+ }, 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))));
11157
+ return (hAsync("div", { key: '858fea100a9317ac6806ae40699e9f5608394e10', class: {
10893
11158
  'sd-file-picker__wrapper': true,
10894
11159
  'sd-file-picker--inline': this.inline,
10895
11160
  'sd-file-picker--inline-disabled': this.inline && this.disabled,
10896
- }, 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()));
11161
+ }, 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()));
10897
11162
  }
10898
11163
  static get watchers() { return {
10899
11164
  "value": [{
@@ -10915,6 +11180,7 @@ class SdFilePicker {
10915
11180
  "maxFileSize": [8, "max-file-size"],
10916
11181
  "maxTotalSize": [8, "max-total-size"],
10917
11182
  "maxFiles": [8, "max-files"],
11183
+ "size": [513],
10918
11184
  "name": [1],
10919
11185
  "label": [1],
10920
11186
  "labelWidth": [8, "label-width"],
@@ -10941,7 +11207,7 @@ class SdFilePicker {
10941
11207
  },
10942
11208
  "$listeners$": undefined,
10943
11209
  "$lazyBundleId$": "-",
10944
- "$attrsToReflect$": [["placeholder", "placeholder"], ["disabled", "disabled"], ["inline", "inline"], ["multiple", "multiple"], ["useMultipleListBox", "use-multiple-list-box"]]
11210
+ "$attrsToReflect$": [["placeholder", "placeholder"], ["disabled", "disabled"], ["inline", "inline"], ["multiple", "multiple"], ["useMultipleListBox", "use-multiple-list-box"], ["size", "size"]]
10945
11211
  }; }
10946
11212
  }
10947
11213
 
@@ -11125,7 +11391,7 @@ class SdFloatingPopover {
11125
11391
  }
11126
11392
  }
11127
11393
  render() {
11128
- return hAsync("slot", { key: '3a3234d89652728a077681775de4f8c14141ab2d' });
11394
+ return hAsync("slot", { key: 'f45790ba4fc45aef991a54b409acc2791342fcdf' });
11129
11395
  }
11130
11396
  static get style() { return sdFloatingPortalCss(); }
11131
11397
  static get cmpMeta() { return {
@@ -11374,6 +11640,11 @@ class SdGhostButton {
11374
11640
  intent = 'default';
11375
11641
  /** 스크린리더용 접근성 레이블 */
11376
11642
  ariaLabel = '';
11643
+ /**
11644
+ * 토글 버튼일 때 눌림 상태 → `aria-pressed`로 반영. 미지정 시 속성 자체를 내보내지 않는다.
11645
+ * (DOM `Element.ariaPressed`(문자열 예약 속성)와 충돌하므로 prop 이름은 `pressed`)
11646
+ */
11647
+ pressed;
11377
11648
  /** 호버 시 표시할 툴팁 텍스트 */
11378
11649
  tooltipText;
11379
11650
  /** 비활성 상태 여부 */
@@ -11431,16 +11702,16 @@ class SdGhostButton {
11431
11702
  const accessibleName = (this.ariaLabel ?? '').trim() || undefined;
11432
11703
  const tooltipText = (this.tooltipText ?? '').trim();
11433
11704
  const hasTooltip = tooltipText.length > 0;
11434
- return (hAsync("button", { key: '9d2d352d36c7c34c67d8c57de6236d72727bd078', class: {
11705
+ return (hAsync("button", { key: '921a2e6e54aa3cbb0e6c14ad117d6ddcfc753618', class: {
11435
11706
  'sd-ghost-button': true,
11436
11707
  'sd-ghost-button--disabled': this.disabled,
11437
- }, type: "button", "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: this.disabled ? -1 : undefined, "aria-label": accessibleName, style: {
11708
+ }, type: "button", "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: this.disabled ? -1 : undefined, "aria-label": accessibleName, "aria-pressed": this.pressed, style: {
11438
11709
  '--sd-ghost-button-size': `${sizeConfig.size}px`,
11439
11710
  '--sd-ghost-button-radius': `${GHOST_BUTTON_RADIUS[size]}px`,
11440
11711
  '--sd-ghost-button-hover-bg': GHOST_BUTTON_HOVER_BG_COLORS[intent],
11441
11712
  '--sd-ghost-button-hover-opacity': GHOST_BUTTON_HOVER_OPACITY,
11442
11713
  '--sd-ghost-button-accent': GHOST_BUTTON_FOCUS_RING_COLOR,
11443
- }, 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 })));
11714
+ }, 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 })));
11444
11715
  }
11445
11716
  static get style() { return sdGhostButtonCss(); }
11446
11717
  static get cmpMeta() { return {
@@ -11451,6 +11722,7 @@ class SdGhostButton {
11451
11722
  "size": [1],
11452
11723
  "intent": [1],
11453
11724
  "ariaLabel": [1, "aria-label"],
11725
+ "pressed": [4, "aria-pressed"],
11454
11726
  "tooltipText": [1, "tooltip-text"],
11455
11727
  "disabled": [4],
11456
11728
  "isTooltipOpen": [32]
@@ -12005,26 +12277,26 @@ class SdIcon {
12005
12277
  }; }
12006
12278
  }
12007
12279
 
12008
- const sm$1 = inputTokens.textinput.sm;
12009
- const md$1 = inputTokens.textinput.md;
12280
+ const sm$2 = inputTokens.textinput.sm;
12281
+ const md$2 = inputTokens.textinput.md;
12010
12282
  const INPUT_SIZE_MAP = {
12011
12283
  sm: {
12012
- height: sm$1.height,
12013
- paddingX: sm$1.paddingX,
12014
- gap: sm$1.gap,
12015
- radius: sm$1.radius,
12016
- fontSize: sm$1.typography.fontSize,
12017
- lineHeight: sm$1.typography.lineHeight,
12018
- fontWeight: sm$1.typography.fontWeight,
12284
+ height: sm$2.height,
12285
+ paddingX: sm$2.paddingX,
12286
+ gap: sm$2.gap,
12287
+ radius: sm$2.radius,
12288
+ fontSize: sm$2.typography.fontSize,
12289
+ lineHeight: sm$2.typography.lineHeight,
12290
+ fontWeight: sm$2.typography.fontWeight,
12019
12291
  },
12020
12292
  md: {
12021
- height: md$1.height,
12022
- paddingX: md$1.paddingX,
12023
- gap: md$1.gap,
12024
- radius: md$1.radius,
12025
- fontSize: md$1.typography.fontSize,
12026
- lineHeight: md$1.typography.lineHeight,
12027
- fontWeight: md$1.typography.fontWeight,
12293
+ height: md$2.height,
12294
+ paddingX: md$2.paddingX,
12295
+ gap: md$2.gap,
12296
+ radius: md$2.radius,
12297
+ fontSize: md$2.typography.fontSize,
12298
+ lineHeight: md$2.typography.lineHeight,
12299
+ fontWeight: md$2.typography.fontWeight,
12028
12300
  },
12029
12301
  };
12030
12302
  const INPUT_COLORS = {
@@ -12191,12 +12463,12 @@ class SdInput {
12191
12463
  '--sd-system-size-field-sm-height': `${sizeTokens.height}px`,
12192
12464
  '--sd-system-radius-field-sm': `${sizeTokens.radius}px`,
12193
12465
  };
12194
- 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 () => {
12466
+ 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 () => {
12195
12467
  if (this.disabled || this.readonly)
12196
12468
  return;
12197
12469
  this.internalValue = '';
12198
12470
  await this.formField?.sdValidate();
12199
- } })), 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: () => {
12471
+ } })), 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: () => {
12200
12472
  if (this.disabled || this.readonly)
12201
12473
  return;
12202
12474
  this.passwordVisible = !this.passwordVisible;
@@ -12303,41 +12575,41 @@ var tableTokens = {
12303
12575
  table: table
12304
12576
  };
12305
12577
 
12306
- const t = tableTokens.table;
12578
+ const t$1 = tableTokens.table;
12307
12579
  const KEY_VALUE_TABLE_LAYOUT = {
12308
- rowHeight: Number(t.keyValue.height),
12580
+ rowHeight: Number(t$1.keyValue.height),
12309
12581
  thWidth: 120,
12310
- borderRadius: Number(t.radius),
12311
- thPaddingX: Number(t.header.paddingX),
12312
- padding: Number(t.keyValue.body.paddingY),
12313
- tdPaddingX: Number(t.keyValue.body.paddingX.default),
12314
- tdPaddingXWide: Number(t.keyValue.body.paddingX.wide),
12582
+ borderRadius: Number(t$1.radius),
12583
+ thPaddingX: Number(t$1.header.paddingX),
12584
+ padding: Number(t$1.keyValue.body.paddingY),
12585
+ tdPaddingX: Number(t$1.keyValue.body.paddingX.default),
12586
+ tdPaddingXWide: Number(t$1.keyValue.body.paddingX.wide),
12315
12587
  helpIconSize: 16,
12316
12588
  requiredIconSize: 12,
12317
- gap: Number(t.header.gap),
12318
- labelGap: Number(t.content.gap),
12319
- borderWidth: Number(t.border.width),
12320
- searchPaddingX: Number(t.keyValue.search.paddingX),
12589
+ gap: Number(t$1.header.gap),
12590
+ labelGap: Number(t$1.content.gap),
12591
+ borderWidth: Number(t$1.border.width),
12592
+ searchPaddingX: Number(t$1.keyValue.search.paddingX),
12321
12593
  };
12322
12594
  const KEY_VALUE_TABLE_COLORS = {
12323
- border: t.border.color,
12324
- thBg: t.header.bg,
12595
+ border: t$1.border.color,
12596
+ thBg: t$1.header.bg,
12325
12597
  thLabel: systemTokens.color.fg.primary,
12326
12598
  required: systemTokens.color.fg.accent,
12327
12599
  helpIcon: systemTokens.color.fg.success,
12328
12600
  tdBg: systemTokens.color.bg.frame,
12329
12601
  tdText: systemTokens.color.fg.primary,
12330
- searchBg: t.keyValue.search.bg,
12602
+ searchBg: t$1.keyValue.search.bg,
12331
12603
  };
12332
12604
  const KEY_VALUE_TABLE_TYPOGRAPHY = {
12333
- labelFontFamily: t.header.typography.fontFamily,
12334
- labelFontSize: Number(t.header.typography.fontSize),
12605
+ labelFontFamily: t$1.header.typography.fontFamily,
12606
+ labelFontSize: Number(t$1.header.typography.fontSize),
12335
12607
  labelFontWeight: 700,
12336
- labelLineHeight: Number(t.header.typography.lineHeight),
12337
- tdFontFamily: t.body.typography.fontFamily,
12338
- tdFontSize: Number(t.body.typography.fontSize),
12339
- tdFontWeight: Number(t.body.typography.fontWeight),
12340
- tdLineHeight: Number(t.body.typography.lineHeight),
12608
+ labelLineHeight: Number(t$1.header.typography.lineHeight),
12609
+ tdFontFamily: t$1.body.typography.fontFamily,
12610
+ tdFontSize: Number(t$1.body.typography.fontSize),
12611
+ tdFontWeight: Number(t$1.body.typography.fontWeight),
12612
+ tdLineHeight: Number(t$1.body.typography.lineHeight),
12341
12613
  };
12342
12614
 
12343
12615
  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)}`;
@@ -12660,7 +12932,7 @@ class SdLinearProgress {
12660
12932
  clipPath: `inset(0 ${100 - this.clampedValue}% 0 0)`,
12661
12933
  };
12662
12934
  const valueText = `${Math.round(this.clampedValue)}%`;
12663
- 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)));
12935
+ 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)));
12664
12936
  }
12665
12937
  static get style() { return sdLinearProgressCss(); }
12666
12938
  static get cmpMeta() { return {
@@ -12716,10 +12988,10 @@ class SdLoadingContainer {
12716
12988
  this.prevBodyOverflow = null;
12717
12989
  }
12718
12990
  render() {
12719
- return (hAsync("div", { key: '89949c219d7ace3858c7539f3db4843a20a2c67e', class: {
12991
+ return (hAsync("div", { key: 'c7821d4c50651217e48f424cbdfb9a32006afda4', class: {
12720
12992
  'sd-loading-container': true,
12721
12993
  'sd-loading-container--visible': this.visible,
12722
- }, "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))));
12994
+ }, "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))));
12723
12995
  }
12724
12996
  static get style() { return sdLoadingContainerCss(); }
12725
12997
  static get cmpMeta() { return {
@@ -12831,7 +13103,7 @@ class SdLoadingModal {
12831
13103
  '--sd-loading-modal-width': this.toCssSize(this.width) ?? `${LOADING_MODAL_LAYOUT.minWidth}px`,
12832
13104
  '--sd-loading-modal-height': this.toCssSize(this.height) ?? `${LOADING_MODAL_LAYOUT.minHeight}px`,
12833
13105
  };
12834
- 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 }))))));
13106
+ 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 }))))));
12835
13107
  }
12836
13108
  static get style() { return sdLoadingModalCss(); }
12837
13109
  static get cmpMeta() { return {
@@ -13370,24 +13642,24 @@ var numberInputTokens = {
13370
13642
  numberInput: numberInput
13371
13643
  };
13372
13644
 
13373
- const sm = numberInputTokens.numberInput.sm;
13374
- const md = numberInputTokens.numberInput.md;
13645
+ const sm$1 = numberInputTokens.numberInput.sm;
13646
+ const md$1 = numberInputTokens.numberInput.md;
13375
13647
  const NUMBER_INPUT_SIZE_MAP = {
13376
13648
  sm: {
13377
- height: sm.height,
13378
- paddingX: sm.paddingX,
13379
- radius: sm.radius,
13380
- fontSize: sm.typography.fontSize,
13381
- lineHeight: sm.typography.lineHeight,
13382
- fontWeight: sm.typography.fontWeight,
13649
+ height: sm$1.height,
13650
+ paddingX: sm$1.paddingX,
13651
+ radius: sm$1.radius,
13652
+ fontSize: sm$1.typography.fontSize,
13653
+ lineHeight: sm$1.typography.lineHeight,
13654
+ fontWeight: sm$1.typography.fontWeight,
13383
13655
  },
13384
13656
  md: {
13385
- height: md.height,
13386
- paddingX: md.paddingX,
13387
- radius: md.radius,
13388
- fontSize: md.typography.fontSize,
13389
- lineHeight: md.typography.lineHeight,
13390
- fontWeight: md.typography.fontWeight,
13657
+ height: md$1.height,
13658
+ paddingX: md$1.paddingX,
13659
+ radius: md$1.radius,
13660
+ fontSize: md$1.typography.fontSize,
13661
+ lineHeight: md$1.typography.lineHeight,
13662
+ fontWeight: md$1.typography.fontWeight,
13391
13663
  },
13392
13664
  };
13393
13665
  const NUMBER_INPUT_COLORS = {
@@ -13428,6 +13700,8 @@ class SdNumberInput {
13428
13700
  useButton = false;
13429
13701
  /** 소수점 입력 허용 여부 */
13430
13702
  useDecimal = false;
13703
+ /** 소수점 이하 최대 자리수 (useDecimal일 때만 적용, 초과 입력한 소수부는 잘라냄) */
13704
+ maxDecimalLength;
13431
13705
  /** 입력 값 */
13432
13706
  value = null;
13433
13707
  /** 레이블 텍스트 */
@@ -13508,6 +13782,31 @@ class SdNumberInput {
13508
13782
  const result = isNegative ? '-' + formatted : formatted;
13509
13783
  return decPart !== undefined && decPart !== '' ? result + '.' + decPart : String(result);
13510
13784
  }
13785
+ /** useDecimal이면서 유효한 maxDecimalLength가 있을 때만 소수점 이하 제한 자리수를 반환합니다. */
13786
+ getDecimalLimit() {
13787
+ if (!this.useDecimal ||
13788
+ this.maxDecimalLength === undefined ||
13789
+ !Number.isFinite(this.maxDecimalLength)) {
13790
+ return undefined;
13791
+ }
13792
+ return Math.max(0, Math.floor(this.maxDecimalLength));
13793
+ }
13794
+ /** 소수부를 제한 자리수로 잘라낸 문자열을 반환합니다(반올림하지 않고 잘라냄). */
13795
+ truncateToDecimalLimit(cleaned, limit) {
13796
+ if (!cleaned.includes('.'))
13797
+ return cleaned;
13798
+ const [intPart, fractionPart = ''] = cleaned.split('.');
13799
+ const truncatedFraction = fractionPart.slice(0, limit);
13800
+ return truncatedFraction === '' ? intPart : `${intPart}.${truncatedFraction}`;
13801
+ }
13802
+ /** 숫자값의 소수부를 제한 자리수로 잘라냅니다(제한이 없으면 원본 그대로). */
13803
+ applyDecimalLimit(value) {
13804
+ const decimalLimit = this.getDecimalLimit();
13805
+ if (decimalLimit === undefined)
13806
+ return value;
13807
+ const parsed = parseFloat(this.truncateToDecimalLimit(value.toString(), decimalLimit));
13808
+ return isNaN(parsed) ? value : parsed;
13809
+ }
13511
13810
  parseInput(input) {
13512
13811
  if (input.trim() === '')
13513
13812
  return null;
@@ -13515,12 +13814,15 @@ class SdNumberInput {
13515
13814
  if (!/^-?(\d+\.?\d*|\d*\.\d+)$/.test(cleaned)) {
13516
13815
  return null;
13517
13816
  }
13518
- const parsed = parseFloat(cleaned);
13519
- if (isNaN(parsed))
13520
- return null;
13521
13817
  if (!this.useDecimal && cleaned.includes('.')) {
13522
13818
  return null;
13523
13819
  }
13820
+ // useDecimal이면서 maxDecimalLength가 설정된 경우 소수부를 제한 자리수로 잘라냄(반올림 아님)
13821
+ const decimalLimit = this.getDecimalLimit();
13822
+ const normalized = decimalLimit !== undefined ? this.truncateToDecimalLimit(cleaned, decimalLimit) : cleaned;
13823
+ const parsed = parseFloat(normalized);
13824
+ if (isNaN(parsed))
13825
+ return null;
13524
13826
  return parsed;
13525
13827
  }
13526
13828
  clampMinMax(value) {
@@ -13675,6 +13977,7 @@ class SdNumberInput {
13675
13977
  if (nextVal > this.max) {
13676
13978
  nextVal = this.max;
13677
13979
  }
13980
+ nextVal = this.applyDecimalLimit(nextVal);
13678
13981
  if (nextVal === currentVal)
13679
13982
  return;
13680
13983
  this.internalValue = nextVal;
@@ -13687,6 +13990,7 @@ class SdNumberInput {
13687
13990
  if (nextVal < this.min) {
13688
13991
  nextVal = this.min;
13689
13992
  }
13993
+ nextVal = this.applyDecimalLimit(nextVal);
13690
13994
  if (nextVal === currentVal)
13691
13995
  return;
13692
13996
  this.internalValue = nextVal;
@@ -13727,15 +14031,15 @@ class SdNumberInput {
13727
14031
  '--sd-textinput-input-hint-typography-line-height': `${NUMBER_INPUT_HINT.typography.lineHeight}px`,
13728
14032
  '--sd-textinput-input-contents-gap': `${NUMBER_INPUT_CONTENTS_GAP}px`,
13729
14033
  };
13730
- 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: {
14034
+ 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: {
13731
14035
  'sd-number-input__content': true,
13732
14036
  'sd-number-input__content--no-stepper': !this.useButton,
13733
- } }, 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()
14037
+ } }, 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()
13734
14038
  ? NUMBER_INPUT_STEPPER.icon.disabled
13735
- : 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: {
14039
+ : 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: {
13736
14040
  textAlign: this.useButton ? 'center' : 'right',
13737
14041
  ...this.inputStyle,
13738
- } }), 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()
14042
+ } }), 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()
13739
14043
  ? NUMBER_INPUT_STEPPER.icon.disabled
13740
14044
  : NUMBER_INPUT_STEPPER.icon.default }))))));
13741
14045
  }
@@ -13758,6 +14062,7 @@ class SdNumberInput {
13758
14062
  "step": [2],
13759
14063
  "useButton": [4, "use-button"],
13760
14064
  "useDecimal": [4, "use-decimal"],
14065
+ "maxDecimalLength": [2, "max-decimal-length"],
13761
14066
  "value": [1032],
13762
14067
  "label": [1],
13763
14068
  "labelWidth": [8, "label-width"],
@@ -13954,13 +14259,13 @@ class SdPagination {
13954
14259
  '--sd-pagination-bg-selected': PAGINATION_COLORS.bgSelected,
13955
14260
  '--sd-pagination-item-width': `${this.buttonWidth}px`,
13956
14261
  };
13957
- return (hAsync("div", { key: '78ef11e415c8d086e0a5f582fa5b4568ed3e49a4', class: {
14262
+ return (hAsync("div", { key: '0b5a2e9aec83e6f6a8de3426e57b3f9a53623652', class: {
13958
14263
  'sd-pagination': true,
13959
14264
  'sd-pagination--simple': this.simple,
13960
- }, 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: {
14265
+ }, 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: {
13961
14266
  'sd-pagination__item': true,
13962
14267
  'sd-pagination__item--selected': this.currentPage === n,
13963
- }, onClick: () => this.handlePageChange(n) }, n))))), hAsync("div", { key: '3726aaab29e0347cf7ae5e2aebad268e33eb33c7', class: "sd-pagination__group sd-pagination__group--next" }, this.renderNextButtons())));
14268
+ }, onClick: () => this.handlePageChange(n) }, n))))), hAsync("div", { key: '1aa72933c849af4fc886cc4e5f8962710c6c40bf', class: "sd-pagination__group sd-pagination__group--next" }, this.renderNextButtons())));
13964
14269
  }
13965
14270
  static get style() { return sdPaginationCss(); }
13966
14271
  static get cmpMeta() { return {
@@ -13981,57 +14286,135 @@ const TooltipArrow = (props) => (hAsync("svg", { width: "16", height: "12", view
13981
14286
 
13982
14287
  const popover = {
13983
14288
  "default": {
13984
- bg: "#07284A"}};
14289
+ bg: "#07284A",
14290
+ title: "#FFFFFF",
14291
+ description: "#FFFFFF",
14292
+ subAction: "#D8D8D8"
14293
+ },
14294
+ title: {
14295
+ leadingIcon: "16",
14296
+ gap: "8"
14297
+ },
14298
+ danger: {
14299
+ bg: "#FCEFEF",
14300
+ title: "#FB4444"
14301
+ },
14302
+ warning: {
14303
+ bg: "#FEF1EA",
14304
+ title: "#FF6B00"
14305
+ },
14306
+ accent: {
14307
+ bg: "#E6F1FF",
14308
+ title: "#0075FF"
14309
+ },
14310
+ light: {
14311
+ description: "#555555",
14312
+ subAction: "#888888"
14313
+ }
14314
+ };
13985
14315
  var popoverTokens = {
13986
14316
  popover: popover
13987
14317
  };
13988
14318
 
14319
+ const t = popoverTokens.popover;
14320
+ /** 제목-아이콘 간격 */
14321
+ const POPOVER_TITLE_GAP = t.title.gap;
14322
+ /** 제목 좌측 아이콘 크기 */
14323
+ const POPOVER_TITLE_ICON_SIZE = t.title.leadingIcon;
14324
+ /**
14325
+ * popoverType별 색상·버튼 매핑.
14326
+ * - default·accent: 하단 버튼 primary(solid) / danger: danger outline / warning: neutral outline
14327
+ * - default: 다크 배경 + 흰색 텍스트 / danger·warning·accent: 라이트 배경 + 타입 색상 제목 + light 계열 본문·링크 색상
14328
+ */
14329
+ const POPOVER_TYPE_CONFIG = {
14330
+ default: {
14331
+ bg: t.default.bg,
14332
+ title: t.default.title,
14333
+ description: t.default.description,
14334
+ subAction: t.default.subAction,
14335
+ buttonName: 'primary_xs',
14336
+ },
14337
+ danger: {
14338
+ bg: t.danger.bg,
14339
+ title: t.danger.title,
14340
+ description: t.light.description,
14341
+ subAction: t.light.subAction,
14342
+ buttonName: 'danger_outline_xs',
14343
+ },
14344
+ warning: {
14345
+ bg: t.warning.bg,
14346
+ title: t.warning.title,
14347
+ description: t.light.description,
14348
+ subAction: t.light.subAction,
14349
+ buttonName: 'neutral_outline_xs',
14350
+ },
14351
+ accent: {
14352
+ bg: t.accent.bg,
14353
+ title: t.accent.title,
14354
+ description: t.light.description,
14355
+ subAction: t.light.subAction,
14356
+ buttonName: 'primary_xs',
14357
+ },
14358
+ };
14359
+
13989
14360
  const sdPopoverCss = () => `sd-popover{position:relative;cursor:pointer;display:inline-flex}`;
13990
14361
 
13991
14362
  class SdPopover {
13992
14363
  constructor(hostRef) {
13993
14364
  registerInstance(this, hostRef);
13994
14365
  this.showChange = createEvent(this, "sdShowChange", 7);
14366
+ this.buttonClick = createEvent(this, "sdButtonClick", 7);
14367
+ this.leftLinkClick = createEvent(this, "sdLeftLinkClick", 7);
13995
14368
  }
13996
14369
  get el() { return getElement(this); }
13997
- /** 팝오버 표시 여부 */
13998
- show = false;
14370
+ /** 표시 여부 (제어). 미지정 시 defaultOpen 기반 비제어로 동작 */
14371
+ open;
14372
+ /** 기본 표시 여부 (비제어) */
14373
+ defaultOpen = false;
13999
14374
  /** 팝오버를 표시할 방향 */
14000
14375
  placement = 'bottom';
14001
- /** 아이콘 트리거 색상 */
14002
- color = '#01BB4B';
14003
- /** 아이콘 트리거 아이콘명 */
14376
+ /** 색상 타입 (default=다크 배경 / danger·warning·accent=라이트 배경) */
14377
+ type = 'default';
14378
+ /** 메뉴 제목 (필수) */
14379
+ menuTitle;
14380
+ /** 제목 좌측 아이콘 (선택) */
14381
+ titleIcon;
14382
+ /** 기본(아이콘) 트리거 아이콘명. slot="trigger" 가 있으면 무시 */
14004
14383
  icon = 'helpOutline';
14005
- /** 아이콘 트리거 크기 */
14384
+ /** 기본(아이콘) 트리거 크기 */
14006
14385
  iconSize = 12;
14007
- /** 버튼 트리거 레이블 (있으면 아이콘 대신 버튼 렌더링) */
14008
- label = '';
14009
- /** 버튼 트리거 프리셋 */
14010
- name = 'primary_sm';
14011
- /** 버튼 트리거 우측 아이콘 */
14012
- rightIcon;
14386
+ /** 기본(아이콘) 트리거 색상 */
14387
+ color = '#01BB4B';
14388
+ /** 하단 좌측 링크 레이블 (선택) */
14389
+ leftLinkLabel;
14390
+ /** 하단 우측 버튼 레이블 (필수). 색상/스타일은 type 별로 고정 */
14391
+ buttonLabel;
14013
14392
  /** 스크린리더용 접근성 레이블 */
14014
14393
  ariaLabel = '';
14015
- /** 비활성 상태 여부 */
14016
- disabled = false;
14017
- /** 버튼 type 속성 */
14018
- type = 'button';
14019
- /** 팝오버 메뉴 제목 */
14020
- menuTitle;
14021
- /** 팝오버 하단 좌측 링크 옵션 */
14022
- leftLink;
14023
- /** 팝오버 하단 버튼 옵션 */
14024
- button;
14025
14394
  /** 팝오버 메뉴에 추가할 클래스 */
14026
- menuClass = '';
14395
+ menuClassName = '';
14396
+ internalOpen = false;
14027
14397
  slotContentHTML = '';
14398
+ triggerHTML = '';
14028
14399
  /** 팝오버 표시 상태가 바뀔 때 발생합니다. */
14029
14400
  showChange;
14030
- buttonEl;
14031
- setShow = (next) => {
14032
- if (this.show === next)
14401
+ /** 하단 우측 버튼 클릭 시 발생합니다. */
14402
+ buttonClick;
14403
+ /** 하단 좌측 링크 클릭 시 발생합니다. */
14404
+ leftLinkClick;
14405
+ triggerEl;
14406
+ get isOpen() {
14407
+ return this.open !== undefined ? this.open : this.internalOpen;
14408
+ }
14409
+ setOpen = (next) => {
14410
+ if (this.isOpen === next)
14033
14411
  return;
14034
- this.show = next;
14412
+ if (this.open === undefined) {
14413
+ this.internalOpen = next;
14414
+ }
14415
+ else {
14416
+ this.open = next;
14417
+ }
14035
14418
  this.showChange.emit(next);
14036
14419
  };
14037
14420
  get popoverOffset() {
@@ -14046,57 +14429,69 @@ class SdPopover {
14046
14429
  return [4, 0];
14047
14430
  }
14048
14431
  }
14049
- handleClose = () => this.setShow(false);
14432
+ handleClose = () => this.setOpen(false);
14050
14433
  componentWillLoad() {
14434
+ this.internalOpen = this.defaultOpen;
14435
+ // slot="trigger" 커스텀 트리거를 분리해 두고, 나머지 라이트 DOM은 메뉴 본문으로 캡처한다.
14436
+ const triggerSlot = this.el.querySelector('[slot="trigger"]');
14437
+ if (triggerSlot) {
14438
+ this.triggerHTML = triggerSlot.outerHTML;
14439
+ triggerSlot.remove();
14440
+ }
14051
14441
  this.slotContentHTML = this.el.innerHTML;
14052
14442
  this.el.innerHTML = '';
14053
14443
  }
14054
14444
  render() {
14055
14445
  const placement = this.placement ?? 'bottom';
14056
- const color = this.color ?? '#01BB4B';
14057
- const icon = this.icon ?? 'helpOutline';
14058
- const iconSize = this.iconSize ?? 12;
14059
- const menuClass = this.menuClass ?? '';
14060
- const leftLink = this.leftLink;
14061
- const button = this.button;
14062
- const hasFooter = !!leftLink || !!button;
14063
- 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: {
14446
+ const typeConfig = POPOVER_TYPE_CONFIG[this.type ?? 'default'] ?? POPOVER_TYPE_CONFIG.default;
14447
+ const menuClassName = this.menuClassName ?? '';
14448
+ const hasLeftLink = this.leftLinkLabel !== undefined && this.leftLinkLabel !== '';
14449
+ return (hAsync(Fragment, { key: '16cc231907c02de80749163ce4b639303e969f4a' }, this.triggerHTML !== '' ? (
14450
+ // 사용자가 넘긴 slot="trigger" 콘텐츠를 감싸 클릭을 전달하는 래퍼(키보드 상호작용은 내부 트리거가 담당)
14451
+ // eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events
14452
+ 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: {
14064
14453
  'sd-floating-menu': true,
14065
14454
  'sd-floating-menu--popover': true,
14066
14455
  [`sd-floating-menu--${placement}`]: true,
14067
- [menuClass]: menuClass !== '',
14456
+ [menuClassName]: menuClassName !== '',
14068
14457
  }, style: {
14069
- '--sd-floating-bg': popoverTokens.popover.default.bg,
14070
- } }, 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: {
14458
+ '--sd-floating-bg': typeConfig.bg,
14459
+ '--sd-floating-content': typeConfig.description,
14460
+ } }, 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: {
14461
+ color: typeConfig.title,
14462
+ display: 'flex',
14463
+ alignItems: 'center',
14464
+ gap: `${POPOVER_TITLE_GAP}px`,
14465
+ } }, 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: {
14071
14466
  'sd-floating-menu__buttons': true,
14072
- 'sd-floating-menu__buttons--with-link': !!leftLink,
14073
- } }, 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 }))))));
14467
+ 'sd-floating-menu__buttons--with-link': hasLeftLink,
14468
+ } }, 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 }))))));
14074
14469
  }
14075
14470
  static get style() { return sdPopoverCss(); }
14076
14471
  static get cmpMeta() { return {
14077
14472
  "$flags$": 512,
14078
14473
  "$tagName$": "sd-popover",
14079
14474
  "$members$": {
14080
- "show": [1028],
14475
+ "open": [1028],
14476
+ "defaultOpen": [4, "default-open"],
14081
14477
  "placement": [513],
14082
- "color": [513],
14478
+ "type": [513],
14479
+ "menuTitle": [1, "menu-title"],
14480
+ "titleIcon": [1, "title-icon"],
14083
14481
  "icon": [513],
14084
14482
  "iconSize": [514, "icon-size"],
14085
- "label": [1],
14086
- "name": [1],
14087
- "rightIcon": [1, "right-icon"],
14483
+ "color": [513],
14484
+ "leftLinkLabel": [1, "left-link-label"],
14485
+ "buttonLabel": [1, "button-label"],
14088
14486
  "ariaLabel": [1, "aria-label"],
14089
- "disabled": [4],
14090
- "type": [1],
14091
- "menuTitle": [1, "menu-title"],
14092
- "leftLink": [16],
14093
- "button": [16],
14094
- "menuClass": [1, "menu-class"],
14095
- "slotContentHTML": [32]
14487
+ "menuClassName": [1, "menu-class-name"],
14488
+ "internalOpen": [32],
14489
+ "slotContentHTML": [32],
14490
+ "triggerHTML": [32]
14096
14491
  },
14097
14492
  "$listeners$": undefined,
14098
14493
  "$lazyBundleId$": "-",
14099
- "$attrsToReflect$": [["placement", "placement"], ["color", "color"], ["icon", "icon"], ["iconSize", "icon-size"]]
14494
+ "$attrsToReflect$": [["placement", "placement"], ["type", "type"], ["icon", "icon"], ["iconSize", "icon-size"], ["color", "color"]]
14100
14495
  }; }
14101
14496
  }
14102
14497
 
@@ -14200,7 +14595,7 @@ class SdPopup {
14200
14595
  ...DEFAULT_SUBMIT_BUTTON_PROPS,
14201
14596
  ...this.submitButtonProps,
14202
14597
  };
14203
- 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() })))));
14598
+ 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() })))));
14204
14599
  }
14205
14600
  static get style() { return sdPopupCss(); }
14206
14601
  static get cmpMeta() { return {
@@ -14491,7 +14886,7 @@ class SdPortal {
14491
14886
  this.close.emit();
14492
14887
  }
14493
14888
  render() {
14494
- return hAsync("slot", { key: '623ee5423b145701ba9dd801d44874214f7a76e3' });
14889
+ return hAsync("slot", { key: '8b2a674bbd8c75c150940d53c0e5204e951cbb82' });
14495
14890
  }
14496
14891
  static get watchers() { return {
14497
14892
  "open": [{
@@ -14606,6 +15001,8 @@ class SdRadio {
14606
15001
  disabled = false;
14607
15002
  /** 표시할 라벨 텍스트 */
14608
15003
  label;
15004
+ /** native radio 그룹핑을 위한 name 속성 (미지정 시 val을 name으로 사용) */
15005
+ name;
14609
15006
  /** 선택 값이 변경될 때 발생합니다. */
14610
15007
  update;
14611
15008
  valueChanged(newValue) {
@@ -14649,7 +15046,7 @@ class SdRadio {
14649
15046
  '--sd-radio-label-color': RADIO_COLORS.label.default,
14650
15047
  '--sd-radio-label-disabled-color': RADIO_COLORS.label.disabled,
14651
15048
  };
14652
- 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))));
15049
+ 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))));
14653
15050
  }
14654
15051
  static get watchers() { return {
14655
15052
  "value": [{
@@ -14664,7 +15061,8 @@ class SdRadio {
14664
15061
  "value": [1032],
14665
15062
  "val": [8],
14666
15063
  "disabled": [4],
14667
- "label": [1]
15064
+ "label": [1],
15065
+ "name": [1]
14668
15066
  },
14669
15067
  "$listeners$": undefined,
14670
15068
  "$lazyBundleId$": "-",
@@ -14774,7 +15172,7 @@ class SdRadioButton {
14774
15172
  registerInstance(this, hostRef);
14775
15173
  this.change = createEvent(this, "sdUpdate", 7);
14776
15174
  }
14777
- /** 현재 선택된 값 */
15175
+ /** 현재 선택된 값 (미지정 시 선택 없음) */
14778
15176
  value;
14779
15177
  /** 라디오 버튼 옵션 목록 */
14780
15178
  options = [];
@@ -14854,7 +15252,7 @@ class SdRadioButton {
14854
15252
  '--sd-radio-button-content-select': RADIO_BUTTON_COLORS.content.select,
14855
15253
  '--sd-radio-button-content-disabled': RADIO_BUTTON_COLORS.content.disabled,
14856
15254
  };
14857
- return (hAsync("div", { key: '17355ebde09f652f5b94b4f70f09f68ef44cd29d', class: this.getGroupClasses(), style: cssVars, role: "radiogroup", "aria-disabled": this.disabled.toString() }, this.options.map(option => {
15255
+ return (hAsync("div", { key: '7621cf9885bb69bc18083dc076b4e6babc86ff62', class: this.getGroupClasses(), style: cssVars, role: "radiogroup", "aria-disabled": this.disabled.toString() }, this.options.map(option => {
14858
15256
  const isSelected = this.isOptionSelected(option);
14859
15257
  const isDisabled = this.isOptionDisabled(option);
14860
15258
  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)));
@@ -14884,7 +15282,7 @@ class SdRadioGroup {
14884
15282
  registerInstance(this, hostRef);
14885
15283
  this.change = createEvent(this, "sdUpdate", 7);
14886
15284
  }
14887
- /** 현재 선택된 값 */
15285
+ /** 현재 선택된 값 (미지정 시 선택 없음) */
14888
15286
  value;
14889
15287
  /** 라디오 옵션 목록 */
14890
15288
  options = [];
@@ -14912,8 +15310,8 @@ class SdRadioGroup {
14912
15310
  return classes.join(' ');
14913
15311
  }
14914
15312
  render() {
14915
- return (hAsync("div", { key: 'e5f4051ea9b2843816a849a018b8040e7b951a55', class: this.getGroupClasses(), role: "radiogroup" }, this.options.map(option => {
14916
- 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) }));
15313
+ return (hAsync("div", { key: '7ee8aaf1872ac215e7d4c27e71d4a0a41c6f5e4e', class: this.getGroupClasses(), role: "radiogroup" }, this.options.map(option => {
15314
+ 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) }));
14917
15315
  })));
14918
15316
  }
14919
15317
  static get watchers() { return {
@@ -15228,15 +15626,15 @@ class SdSelect {
15228
15626
  this.closeDropdown();
15229
15627
  },
15230
15628
  };
15231
- 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: () => {
15629
+ 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: () => {
15232
15630
  this.hovered = true;
15233
15631
  }, onMouseLeave: () => {
15234
15632
  this.hovered = false;
15235
- } }, hAsync("div", { key: '3892e98679d28ed6199578f1033571fec2137143', class: "sd-select", ref: el => {
15633
+ } }, hAsync("div", { key: 'd1b3c4d6f1da7ca9eeb31a19db7dd7b28a94103d', class: "sd-select", ref: el => {
15236
15634
  this.triggerRef = el;
15237
- } }, hAsync("sd-select-trigger", { key: '150dda9f50762bedc538181d8c1e5623e8d3fbac', ref: el => {
15635
+ } }, hAsync("sd-select-trigger", { key: 'c2ce229c398cf35aa1cdc58a12eb7ed81f316d0d', ref: el => {
15238
15636
  this.triggerComponentRef = el;
15239
- }, 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) })))));
15637
+ }, 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) })))));
15240
15638
  }
15241
15639
  static get watchers() { return {
15242
15640
  "isOpen": [{
@@ -15497,7 +15895,7 @@ class SdSelectListItem {
15497
15895
  return (
15498
15896
  // 키보드 네비게이션은 부모 listbox 의 ArrowUp/Down + Enter 가 담당. 항목 자체는 role=option, tabindex=-1 으로 표시.
15499
15897
  // eslint-disable-next-line jsx-a11y/click-events-have-key-events
15500
- hAsync("div", { key: '86ebbdb437d7799cefb9a9466997df44ea346e44', role: "option", tabindex: -1, "aria-selected": this.isSelected === true ? 'true' : 'false', class: {
15898
+ hAsync("div", { key: '4fff470052d5d02cddf204f33df24247e087a55d', role: "option", tabindex: -1, "aria-selected": this.isSelected === true ? 'true' : 'false', class: {
15501
15899
  'sd-select-list-item': true,
15502
15900
  'sd-select-list-item--group': isGroup,
15503
15901
  'sd-select-list-item--depth1-group': isDepth1Group,
@@ -15507,7 +15905,7 @@ class SdSelectListItem {
15507
15905
  'sd-select-list-item--focused': this.isFocused,
15508
15906
  'sd-select-list-item--selectable': this.isSelectable && !this.option.disabled,
15509
15907
  'sd-select-list-item--disabled': !!this.option.disabled,
15510
- }, 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, ")"))));
15908
+ }, 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, ")"))));
15511
15909
  }
15512
15910
  static get style() { return sdSelectListItemCss(); }
15513
15911
  static get cmpMeta() { return {
@@ -15579,15 +15977,15 @@ class SdSelectListItemSearch {
15579
15977
  clearTimeout(this.debounceTimer);
15580
15978
  }
15581
15979
  render() {
15582
- return (hAsync("div", { key: 'fd13ed863fa624bb672a80594a1397831c55b859', class: {
15980
+ return (hAsync("div", { key: '3231c0ea91e678a71cac6a1c5805fa255a96deb2', class: {
15583
15981
  'sd-select-list-item-search': true,
15584
15982
  'sd-select-list-item-search--scrolled': this.isScrolled,
15585
- } }, 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 => {
15983
+ } }, 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 => {
15586
15984
  this.inputEl = el;
15587
- }, 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: {
15985
+ }, 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: {
15588
15986
  'sd-select-list-item-search__clear': true,
15589
15987
  'sd-select-list-item-search__clear--hidden': this.searchText === '',
15590
- }, 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" })))));
15988
+ }, 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" })))));
15591
15989
  }
15592
15990
  static get style() { return sdSelectListItemSearchCss(); }
15593
15991
  static get cmpMeta() { return {
@@ -15971,9 +16369,9 @@ class SdSelectListbox {
15971
16369
  '--listbox-max-height': this.maxHeight ?? '260px',
15972
16370
  '--listbox-radius': `${LIST_BOX_LAYOUT.radius}px`,
15973
16371
  };
15974
- 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 => {
16372
+ 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 => {
15975
16373
  this.listEl = el;
15976
- } }, 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) })))))));
16374
+ } }, 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) })))))));
15977
16375
  }
15978
16376
  static get watchers() { return {
15979
16377
  "searchKeyword": [{
@@ -16062,7 +16460,7 @@ class SdSelectTrigger {
16062
16460
  ? SELECT_COLORS.icon.disabled
16063
16461
  : SELECT_COLORS.icon.default,
16064
16462
  };
16065
- return (hAsync("div", { key: '2ec5e736c0742a10fdfa9b4b12b0820e99c30f7f', ref: el => {
16463
+ return (hAsync("div", { key: '3e5b42da3a391f52f597594ccf9ebf9e9b236ccc', ref: el => {
16066
16464
  this.triggerEl = el;
16067
16465
  }, role: "button", "aria-haspopup": "listbox", "aria-expanded": this.isOpen ? 'true' : 'false', tabindex: this.disabled ? -1 : 0, class: {
16068
16466
  'sd-select-trigger': true,
@@ -16073,7 +16471,7 @@ class SdSelectTrigger {
16073
16471
  e.preventDefault();
16074
16472
  this.handleClick();
16075
16473
  }
16076
- }, 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: {
16474
+ }, 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: {
16077
16475
  'sd-select-trigger__icon': true,
16078
16476
  'sd-select-trigger__icon--open': this.isOpen,
16079
16477
  } }))));
@@ -16160,7 +16558,14 @@ class SdSwitch {
16160
16558
  }
16161
16559
  /** 현재 on/off 상태 */
16162
16560
  value = false;
16163
- /** 표시할 라벨 텍스트 */
16561
+ /** 스위치 좌측 라벨 */
16562
+ leftLabel;
16563
+ /** 스위치 우측 라벨 */
16564
+ rightLabel;
16565
+ /**
16566
+ * 표시할 라벨 텍스트
16567
+ * @deprecated `rightLabel` 사용. 우측 라벨(하위호환)
16568
+ */
16164
16569
  label = '';
16165
16570
  /** 비활성 상태 여부 */
16166
16571
  disabled = false;
@@ -16202,7 +16607,10 @@ class SdSwitch {
16202
16607
  '--sd-switch-line-height': `${SWITCH_TYPOGRAPHY.lineHeight}px`,
16203
16608
  '--sd-switch-text-decoration': SWITCH_TYPOGRAPHY.textDecoration,
16204
16609
  };
16205
- 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)));
16610
+ // label(deprecated)은 rightLabel 로 흡수 (하위호환)
16611
+ const right = this.rightLabel ?? this.label;
16612
+ const accessibleName = [this.leftLabel, right].filter(Boolean).join(' ') || 'switch';
16613
+ 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)));
16206
16614
  }
16207
16615
  static get style() { return sdSwitchCss(); }
16208
16616
  static get cmpMeta() { return {
@@ -16210,6 +16618,8 @@ class SdSwitch {
16210
16618
  "$tagName$": "sd-switch",
16211
16619
  "$members$": {
16212
16620
  "value": [1028],
16621
+ "leftLabel": [1, "left-label"],
16622
+ "rightLabel": [1, "right-label"],
16213
16623
  "label": [1],
16214
16624
  "disabled": [4]
16215
16625
  },
@@ -16424,7 +16834,7 @@ class SdTabs {
16424
16834
  };
16425
16835
  }
16426
16836
  render() {
16427
- return (hAsync("div", { key: '4306137f9dd004ec5ef43b8bdd9e3614adab23ed', class: this.getContainerClasses(), style: this.buildCssVars() }, this.tabs.map((tab, index) => {
16837
+ return (hAsync("div", { key: 'd8d86075bbf5e13444f99e57cf63c2f5b9ef28fc', class: this.getContainerClasses(), style: this.buildCssVars() }, this.tabs.map((tab, index) => {
16428
16838
  const badgeName = this.getBadgeName(tab);
16429
16839
  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 => {
16430
16840
  if (e.key === 'Enter' || e.key === ' ') {
@@ -16642,9 +17052,8 @@ class SdTag {
16642
17052
  label = '';
16643
17053
  /** 아이콘명 */
16644
17054
  icon;
16645
- // 아이콘이 좌측 배치되는 게 자연스러운 default. prop 이름 변경(isRight 등)은 public API breaking 이라 별도 이슈로 분리.
16646
- /** true이면 아이콘을 레이블 왼쪽에 배치 */
16647
- isLeft = true;
17055
+ /** 아이콘을 레이블 왼쪽에 배치할지 여부 (기본값 true) */
17056
+ iconLeft = true;
16648
17057
  /** 태그 너비 (숫자면 px, 문자열이면 그대로 적용). 미지정 시 콘텐츠 크기(fit-content) */
16649
17058
  width = '';
16650
17059
  componentWillLoad() {
@@ -16673,7 +17082,7 @@ class SdTag {
16673
17082
  const config = this.resolvedConfig;
16674
17083
  const iconNode = this.renderIcon(config.icon, config.iconSize);
16675
17084
  const width = this.resolvedWidth;
16676
- return (hAsync(Host, { key: '9eb41b65a887a524d22e0a2663292de1f12674f6', style: width != null ? { '--sd-tag-width': width } : undefined }, hAsync("span", { key: '2c08b419141250c00e6ef1aec1c691c1a41434c0', class: "sd-tag", style: {
17085
+ return (hAsync(Host, { key: '9e893a8ec67d1baa12cdfe030d3ae15798666c0c', style: width != null ? { '--sd-tag-width': width } : undefined }, hAsync("span", { key: 'fe6b05143032b33bec7cc95ce5355701e894d0ea', class: "sd-tag", style: {
16677
17086
  '--sd-tag-background': config.background,
16678
17087
  '--sd-tag-content': config.content,
16679
17088
  '--sd-tag-height': config.height,
@@ -16683,7 +17092,7 @@ class SdTag {
16683
17092
  '--sd-tag-font-weight': config.fontWeight,
16684
17093
  '--sd-tag-line-height': config.lineHeight,
16685
17094
  '--sd-tag-radius': config.radius,
16686
- }, "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)));
17095
+ }, "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)));
16687
17096
  }
16688
17097
  static get style() { return sdTagCss(); }
16689
17098
  static get cmpMeta() { return {
@@ -16693,7 +17102,7 @@ class SdTag {
16693
17102
  "name": [1],
16694
17103
  "label": [1],
16695
17104
  "icon": [1],
16696
- "isLeft": [4, "is-left"],
17105
+ "iconLeft": [4, "icon-left"],
16697
17106
  "width": [8]
16698
17107
  },
16699
17108
  "$listeners$": undefined,
@@ -16873,7 +17282,7 @@ class SdTextLink {
16873
17282
  };
16874
17283
  const tooltipText = (this.tooltipText ?? '').trim();
16875
17284
  const hasTooltip = tooltipText.length > 0;
16876
- return (hAsync("span", { key: 'd9653ed47a77fb5c00dc57f8f7cc2b4dc9035ca4', role: "button", tabindex: this.disabled ? -1 : 0, class: {
17285
+ return (hAsync("span", { key: '363829c6d53fc3df03dee7ddd290ca078c255039', role: "button", tabindex: this.disabled ? -1 : 0, class: {
16877
17286
  'sd-text-link': true,
16878
17287
  'sd-text-link--disabled': this.disabled,
16879
17288
  }, style: cssVars, onClick: this.handleClick, onKeyDown: e => {
@@ -16881,13 +17290,13 @@ class SdTextLink {
16881
17290
  e.preventDefault();
16882
17291
  this.handleClick();
16883
17292
  }
16884
- }, 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: {
17293
+ }, 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: {
16885
17294
  width: `${TEXT_LINK_ARROW.arrowFrame}px`,
16886
17295
  height: `${TEXT_LINK_ARROW.arrowFrame}px`,
16887
17296
  display: 'inline-flex',
16888
17297
  alignItems: 'center',
16889
17298
  justifyContent: 'center',
16890
- } }, hAsync("sd-icon", { key: 'ed0a6bf8b678a93fa8a0da907efb0cbf60427738', name: this.rightArrow === 'chevron' ? 'chevronRight' : 'caretRight', size: TEXT_LINK_ARROW.arrowIconSize, color: arrowColor })))));
17299
+ } }, hAsync("sd-icon", { key: 'b74ca3398a1dd74ac5a9f7a16c872d313882fd4d', name: this.rightArrow === 'chevron' ? 'chevronRight' : 'caretRight', size: TEXT_LINK_ARROW.arrowIconSize, color: arrowColor })))));
16891
17300
  }
16892
17301
  static get style() { return sdTextLinkCss(); }
16893
17302
  static get cmpMeta() { return {
@@ -17071,7 +17480,7 @@ class SdTextarea {
17071
17480
  '--sd-system-size-field-sm-height': 'auto',
17072
17481
  '--sd-system-radius-field-sm': `${TEXTAREA_TOKENS.radius}px`,
17073
17482
  };
17074
- 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 }))));
17483
+ 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 }))));
17075
17484
  }
17076
17485
  static get watchers() { return {
17077
17486
  "value": [{
@@ -17125,162 +17534,1242 @@ class SdTextarea {
17125
17534
  }; }
17126
17535
  }
17127
17536
 
17128
- const toast = {
17129
- icon: "16",
17130
- "default": {
17131
- bg: "#07284A",
17132
- content: "#FFFFFF"
17537
+ const timepicker = {
17538
+ border: {
17539
+ "default": "#AAAAAA",
17540
+ focus: "#0075FF",
17541
+ width: "1"
17133
17542
  },
17134
- danger: {
17135
- bg: "#FB4444",
17136
- content: "#FFFFFF"
17543
+ bg: {
17544
+ "default": "#FFFFFF",
17545
+ disabled: "#E1E1E1"
17137
17546
  },
17138
- caution: {
17139
- bg: "#FFC700",
17140
- content: "#222222"
17547
+ icon: {
17548
+ "default": "#888888",
17549
+ disabled: "#BBBBBB"
17141
17550
  },
17142
- complete: {
17143
- bg: "#00973C",
17144
- content: "#FFFFFF"
17551
+ text: {
17552
+ "default": "#222222",
17553
+ disabled: "#888888"
17145
17554
  },
17146
- accent: {
17147
- bg: "#005CC9",
17148
- content: "#FFFFFF"
17555
+ selector: {
17556
+ bg: "#FFFFFF",
17557
+ range: {
17558
+ heading: {
17559
+ color: "#555555",
17560
+ gap: "16"
17561
+ },
17562
+ paddingXY: "24",
17563
+ panelGap: "24",
17564
+ section: {
17565
+ gap: "12"
17566
+ }
17567
+ },
17568
+ radius: "8",
17569
+ section: {
17570
+ paddingX: "16",
17571
+ paddingY: "12"
17572
+ },
17573
+ time: {
17574
+ gap: "4",
17575
+ column: {
17576
+ gap: "8"
17577
+ }
17578
+ },
17579
+ input: {
17580
+ width: "40"
17581
+ },
17582
+ colon: {
17583
+ size: "16"
17584
+ }
17149
17585
  },
17150
- info: {
17151
- bg: "#E6F1FF",
17152
- icon: "#0075FF",
17153
- text: "#222222",
17154
- textLink: "#555555"
17586
+ sm: {
17587
+ height: "28",
17588
+ paddingX: "12",
17589
+ gap: "8",
17590
+ icon: "16",
17591
+ radius: "4"
17592
+ },
17593
+ md: {
17594
+ height: "36",
17595
+ paddingX: "16",
17596
+ gap: "12",
17597
+ icon: "20",
17598
+ radius: "6"
17155
17599
  }
17156
17600
  };
17157
- var toastTokens = {
17158
- toast: toast
17601
+ var timepickerTokens = {
17602
+ timepicker: timepicker
17159
17603
  };
17160
17604
 
17161
- const TOAST_BUTTON_NAME_BY_TYPE = {
17162
- default: 'secondary_sm',
17163
- danger: 'danger_outline_sm',
17164
- caution: 'neutral_outline_sm',
17165
- complete: 'neutral_outline_sm',
17166
- accent: 'neutral_outline_sm',
17167
- info: 'secondary_sm',
17168
- };
17169
- const TOAST_TYPE_CONFIG = {
17170
- default: { bg: toastTokens.toast.default.bg, content: toastTokens.toast.default.content },
17171
- danger: { bg: toastTokens.toast.danger.bg, content: toastTokens.toast.danger.content },
17172
- caution: { bg: toastTokens.toast.caution.bg, content: toastTokens.toast.caution.content },
17173
- complete: { bg: toastTokens.toast.complete.bg, content: toastTokens.toast.complete.content },
17174
- accent: { bg: toastTokens.toast.accent.bg, content: toastTokens.toast.accent.content },
17175
- info: {
17176
- bg: toastTokens.toast.info.bg,
17177
- content: toastTokens.toast.info.text,
17178
- icon: toastTokens.toast.info.icon,
17179
- linkColor: toastTokens.toast.info.textLink,
17605
+ const sm = timepickerTokens.timepicker.sm;
17606
+ const md = timepickerTokens.timepicker.md;
17607
+ const TIMEPICKER_SIZE_MAP = {
17608
+ sm: {
17609
+ height: sm.height,
17610
+ paddingX: sm.paddingX,
17611
+ gap: sm.gap,
17612
+ iconSize: sm.icon,
17613
+ radius: sm.radius,
17614
+ // TODO: component.timepicker 토큰에 typography가 추가되면 이 fallback을 교체한다.
17615
+ fontSize: '12',
17616
+ lineHeight: '20',
17617
+ fontWeight: '400',
17618
+ minWidth: '128',
17619
+ },
17620
+ md: {
17621
+ height: md.height,
17622
+ paddingX: md.paddingX,
17623
+ gap: md.gap,
17624
+ iconSize: md.icon,
17625
+ radius: md.radius,
17626
+ // TODO: component.timepicker 토큰에 typography가 추가되면 이 fallback을 교체한다.
17627
+ fontSize: '14',
17628
+ lineHeight: '24',
17629
+ fontWeight: '400',
17630
+ minWidth: '160',
17180
17631
  },
17181
17632
  };
17182
- const TOAST_LAYOUT = {
17183
- iconSize: toastTokens.toast.icon,
17633
+ const TIMEPICKER_COLORS = {
17634
+ border: timepickerTokens.timepicker.border,
17635
+ bg: timepickerTokens.timepicker.bg,
17636
+ icon: timepickerTokens.timepicker.icon,
17637
+ text: {
17638
+ ...timepickerTokens.timepicker.text,
17639
+ hint: fieldTokens.field.hint.color,
17640
+ },
17184
17641
  };
17642
+ const TIMEPICKER_SELECTOR = {
17643
+ bg: timepickerTokens.timepicker.selector.bg,
17644
+ radius: timepickerTokens.timepicker.selector.radius,
17645
+ section: timepickerTokens.timepicker.selector.section,
17646
+ time: timepickerTokens.timepicker.selector.time,
17647
+ inputWidth: timepickerTokens.timepicker.selector.input.width,
17648
+ colonSize: timepickerTokens.timepicker.selector.colon.size,
17649
+ range: timepickerTokens.timepicker.selector.range,
17650
+ };
17651
+ function clampTimePart(value, min, max) {
17652
+ if (!Number.isFinite(value))
17653
+ return min;
17654
+ return Math.min(Math.max(value, min), max);
17655
+ }
17656
+ function padTimePart(value) {
17657
+ return String(value).padStart(2, '0');
17658
+ }
17659
+ function parseTimeValue(value) {
17660
+ const match = /^(\d{1,2}):(\d{1,2})$/.exec(value ?? '');
17661
+ if (!match)
17662
+ return { hour: 0, minute: 0 };
17663
+ return {
17664
+ hour: clampTimePart(Number(match[1]), 0, 23),
17665
+ minute: clampTimePart(Number(match[2]), 0, 59),
17666
+ };
17667
+ }
17668
+ function formatTimeValue(hour, minute) {
17669
+ return `${padTimePart(clampTimePart(hour, 0, 23))}:${padTimePart(clampTimePart(minute, 0, 59))}`;
17670
+ }
17671
+ function formatTimeDisplay(value, type) {
17672
+ if (value == null || value === '')
17673
+ return '';
17674
+ const { hour, minute } = parseTimeValue(value);
17675
+ if (type === 'default')
17676
+ return formatTimeValue(hour, minute);
17677
+ const meridiem = hour >= 12 ? '오후' : '오전';
17678
+ const displayHour = hour % 12 === 0 ? 12 : hour % 12;
17679
+ return `${meridiem} ${padTimePart(displayHour)}:${padTimePart(minute)}`;
17680
+ }
17185
17681
 
17186
- 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}`;
17682
+ 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%}`;
17187
17683
 
17188
- class SdToast {
17684
+ class SdTimePicker {
17189
17685
  constructor(hostRef) {
17190
17686
  registerInstance(this, hostRef);
17191
- this.close = createEvent(this, "sdClose", 7);
17192
- this.buttonClick = createEvent(this, "sdButtonClick", 7);
17687
+ this.update = createEvent(this, "sdUpdate", 7);
17688
+ this.dropDownShow = createEvent(this, "sdDropDownShow", 7);
17193
17689
  }
17194
- /** 좌측 아이콘명 */
17195
- icon;
17196
- /** 표시할 메시지 */
17197
- message;
17198
- /** 우측 링크 URL */
17199
- link;
17200
- /** 링크 표시 레이블 (없으면 URL 표시) */
17201
- linkLabel;
17202
- /** 우측 버튼 레이블 */
17203
- buttonLabel;
17204
- /** 닫기 버튼 표시 여부 */
17205
- useClose = false;
17206
- /** 토스트 타입 (색상/아이콘 프리셋) */
17690
+ static CLOSE_ANIMATION_DURATION = 150;
17691
+ get el() { return getElement(this); }
17692
+ /** 선택된 시간 (HH:mm) */
17693
+ value = null;
17694
+ /** 입력 필드 크기 */
17695
+ size = 'sm';
17696
+ /** 표시 타입: default(24시간) / midday(오전·오후) */
17207
17697
  type = 'default';
17208
- /** 닫기 버튼 클릭 또는 자동 닫힘 시 발생합니다. */
17209
- close;
17210
- /** 우측 버튼 클릭 시 발생합니다. */
17211
- buttonClick;
17212
- render() {
17213
- const typeConfig = TOAST_TYPE_CONFIG[this.type] ?? TOAST_TYPE_CONFIG.default;
17214
- const iconSize = Number(TOAST_LAYOUT.iconSize);
17215
- const iconColor = typeConfig.icon ?? typeConfig.content;
17216
- const linkColor = typeConfig.linkColor ?? typeConfig.content;
17217
- const useDefaultCloseIntent = ['default', 'caution', 'info'].includes(this.type);
17218
- const buttonName = TOAST_BUTTON_NAME_BY_TYPE[this.type] ?? TOAST_BUTTON_NAME_BY_TYPE.default;
17219
- return (hAsync("div", { key: 'c402e2eabab8b2d229cc40550d2ffb7c601ad992', style: {
17220
- '--sd-toast-bg': typeConfig.bg,
17221
- '--sd-toast-text': typeConfig.content,
17222
- '--sd-toast-icon': iconColor,
17223
- '--sd-toast-link': linkColor,
17224
- } }, 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() })))));
17698
+ /** 시간 미선택 시 표시할 placeholder */
17699
+ placeholder = '00:00';
17700
+ /** 비활성 상태 여부 */
17701
+ disabled = false;
17702
+ /** 값이 있을 때 지우기 버튼 표시 여부 */
17703
+ clearable = false;
17704
+ /** 오전/오후 선택 표시 여부. 지정하지 않으면 type="midday"일 때만 켜집니다. */
17705
+ useMeridiem;
17706
+ /** 분 증감 단위 */
17707
+ minuteStep = 1;
17708
+ /** 필드 너비 (숫자면 px, 문자열이면 그대로 적용) */
17709
+ width = '';
17710
+ // sd-field 공통 props
17711
+ /** 레이블 텍스트 */
17712
+ label = '';
17713
+ /** 레이블 너비 */
17714
+ labelWidth = '';
17715
+ /** 필드 우측 어드온 레이블 */
17716
+ addonLabel = '';
17717
+ /** 어드온 정렬 방향 */
17718
+ addonAlign = 'start';
17719
+ /** 필드 하단 힌트 텍스트 */
17720
+ hint = '';
17721
+ /** 에러 메시지 */
17722
+ errorMessage = '';
17723
+ /** 유효성 검사 규칙 목록 */
17724
+ rules = [];
17725
+ /** 에러 상태 여부 */
17726
+ error = false;
17727
+ /** 필드 상태 (없으면 error/rules 결과로 자동 결정) */
17728
+ status;
17729
+ /** 레이블 영역 아이콘 */
17730
+ icon = undefined;
17731
+ /** 레이블 툴팁 텍스트 */
17732
+ labelTooltip = '';
17733
+ /** 레이블 툴팁 상세 옵션 */
17734
+ labelTooltipProps = null;
17735
+ isOpen = false;
17736
+ isAnimatingOut = false;
17737
+ focused = false;
17738
+ hovered = false;
17739
+ /** 시간 선택 시 선택된 시간(HH:mm)을 전달합니다. */
17740
+ update;
17741
+ /** 선택기 열림/닫힘 상태가 바뀔 때 발생합니다. */
17742
+ dropDownShow;
17743
+ triggerRef;
17744
+ formField;
17745
+ closeAnimationTimer;
17746
+ /** 폼 연동용 name 속성 */
17747
+ name = nanoid();
17748
+ watchIsOpen(newValue) {
17749
+ this.focused = newValue;
17750
+ this.dropDownShow.emit({ isOpen: newValue });
17225
17751
  }
17226
- static get style() { return sdToastCss(); }
17227
- static get cmpMeta() { return {
17228
- "$flags$": 512,
17229
- "$tagName$": "sd-toast",
17230
- "$members$": {
17231
- "icon": [1],
17232
- "message": [1],
17233
- "link": [1],
17234
- "linkLabel": [1, "link-label"],
17235
- "buttonLabel": [1, "button-label"],
17236
- "useClose": [4, "use-close"],
17237
- "type": [1]
17238
- },
17239
- "$listeners$": undefined,
17240
- "$lazyBundleId$": "-",
17241
- "$attrsToReflect$": []
17242
- }; }
17243
- }
17244
-
17245
- const DEFAULT_DURATION = 4000;
17246
- const DEFAULT_MAX_VISIBLE = 3;
17247
- const DEFAULT_GAP = 8;
17248
- const DEFAULT_Z_INDEX = 999;
17249
- const TRANSITION_DURATION = 400;
17250
- const TRANSITION_FALLBACK_BUFFER = 100;
17251
- const COLLAPSED_SCALE_STEP = 0.05;
17252
- const COLLAPSED_OFFSET_STEP = 8;
17253
-
17254
- 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}`;
17255
-
17256
- let toastIdCounter = 0;
17257
- class SdToastContainer {
17258
- constructor(hostRef) {
17259
- registerInstance(this, hostRef);
17260
- this.toastShow = createEvent(this, "sdToastShow", 7);
17261
- this.toastDismiss = createEvent(this, "sdToastDismiss", 7);
17752
+ valueChanged(newValue) {
17753
+ if (newValue == null || newValue === '')
17754
+ return;
17755
+ const parsed = parseTimeValue(newValue);
17756
+ const normalized = formatTimeValue(parsed.hour, parsed.minute);
17757
+ if (normalized !== newValue)
17758
+ this.value = normalized;
17262
17759
  }
17263
- get el() { return getElement(this); }
17264
- /** 토스트 표시 위치 */
17265
- position = 'bottom-center';
17266
- /** 동시에 표시할 최대 토스트 수 */
17267
- maxVisible = DEFAULT_MAX_VISIBLE;
17268
- /** 자동 닫힘 지연 시간 (ms, 0이면 자동 닫힘 없음) */
17269
- defaultDuration = DEFAULT_DURATION;
17270
- /** z-index */
17271
- zIndex = DEFAULT_Z_INDEX;
17272
- toasts = [];
17273
- expanded = false;
17274
- toastRefs = new Map();
17275
- /** 토스트가 표시될 때 발생합니다. */
17276
- toastShow;
17277
- /** 토스트가 제거될 때 발생합니다. */
17278
- toastDismiss;
17279
- /** 토스트를 생성하고 ID를 반환합니다. */
17280
- async create(options) {
17281
- const id = `toast-${++toastIdCounter}`;
17282
- const entry = { id, options, state: 'entering' };
17283
- const duration = options.duration ?? this.defaultDuration ?? DEFAULT_DURATION;
17760
+ /** 유효성 검사를 실행합니다. */
17761
+ async sdValidate() {
17762
+ return this.formField?.sdValidate();
17763
+ }
17764
+ /** 값과 유효성 상태를 초기화합니다. */
17765
+ async sdReset() {
17766
+ return this.formField?.sdReset();
17767
+ }
17768
+ /** 유효성 상태만 초기화합니다. */
17769
+ async sdResetValidate() {
17770
+ return this.formField?.sdResetValidation();
17771
+ }
17772
+ /** 입력 필드에 포커스를 이동합니다. */
17773
+ async sdFocus() {
17774
+ return this.formField?.sdFocus();
17775
+ }
17776
+ componentWillLoad() {
17777
+ this.valueChanged(this.value);
17778
+ }
17779
+ disconnectedCallback() {
17780
+ if (this.closeAnimationTimer)
17781
+ clearTimeout(this.closeAnimationTimer);
17782
+ }
17783
+ closeDropdown() {
17784
+ if (!this.isOpen)
17785
+ return;
17786
+ this.isOpen = false;
17787
+ this.isAnimatingOut = true;
17788
+ if (this.closeAnimationTimer)
17789
+ clearTimeout(this.closeAnimationTimer);
17790
+ this.closeAnimationTimer = setTimeout(() => {
17791
+ this.isAnimatingOut = false;
17792
+ }, SdTimePicker.CLOSE_ANIMATION_DURATION);
17793
+ }
17794
+ handleTriggerClick = () => {
17795
+ if (this.disabled)
17796
+ return;
17797
+ if (this.isOpen) {
17798
+ this.closeDropdown();
17799
+ }
17800
+ else {
17801
+ if (this.closeAnimationTimer)
17802
+ clearTimeout(this.closeAnimationTimer);
17803
+ this.isAnimatingOut = false;
17804
+ this.isOpen = true;
17805
+ }
17806
+ };
17807
+ handleClear = (event) => {
17808
+ event.stopPropagation();
17809
+ this.value = null;
17810
+ this.update.emit(null);
17811
+ };
17812
+ handleSelect = (event) => {
17813
+ event.stopPropagation();
17814
+ this.value = event.detail;
17815
+ this.update.emit(this.value);
17816
+ };
17817
+ get effectiveUseMeridiem() {
17818
+ return this.useMeridiem ?? this.type === 'midday';
17819
+ }
17820
+ render() {
17821
+ const sizeTokens = TIMEPICKER_SIZE_MAP[this.size] ?? TIMEPICKER_SIZE_MAP.sm;
17822
+ const cssVars = {
17823
+ '--sd-system-size-field-sm-height': `${sizeTokens.height}px`,
17824
+ '--sd-system-size-field-md-height': `${sizeTokens.height}px`,
17825
+ '--sd-system-radius-field-sm': `${sizeTokens.radius}px`,
17826
+ '--sd-system-radius-field-md': `${sizeTokens.radius}px`,
17827
+ '--sd-time-picker-min-width': `${sizeTokens.minWidth}px`,
17828
+ '--sd-system-color-field-border-default': TIMEPICKER_COLORS.border.default,
17829
+ '--sd-system-color-field-border-focus': TIMEPICKER_COLORS.border.focus,
17830
+ '--sd-system-color-field-bg-default': TIMEPICKER_COLORS.bg.default,
17831
+ };
17832
+ 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 => {
17833
+ this.triggerRef = el;
17834
+ } }, 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 })))));
17835
+ }
17836
+ static get watchers() { return {
17837
+ "isOpen": [{
17838
+ "watchIsOpen": 0
17839
+ }],
17840
+ "value": [{
17841
+ "valueChanged": 0
17842
+ }]
17843
+ }; }
17844
+ static get style() { return sdTimePickerCss(); }
17845
+ static get cmpMeta() { return {
17846
+ "$flags$": 512,
17847
+ "$tagName$": "sd-time-picker",
17848
+ "$members$": {
17849
+ "value": [1025],
17850
+ "size": [513],
17851
+ "type": [513],
17852
+ "placeholder": [513],
17853
+ "disabled": [516],
17854
+ "clearable": [4],
17855
+ "useMeridiem": [4, "use-meridiem"],
17856
+ "minuteStep": [2, "minute-step"],
17857
+ "width": [8],
17858
+ "label": [1],
17859
+ "labelWidth": [8, "label-width"],
17860
+ "addonLabel": [1, "addon-label"],
17861
+ "addonAlign": [1, "addon-align"],
17862
+ "hint": [1],
17863
+ "errorMessage": [1, "error-message"],
17864
+ "rules": [16],
17865
+ "error": [1028],
17866
+ "status": [1],
17867
+ "icon": [16],
17868
+ "labelTooltip": [1, "label-tooltip"],
17869
+ "labelTooltipProps": [16],
17870
+ "name": [1],
17871
+ "isOpen": [32],
17872
+ "isAnimatingOut": [32],
17873
+ "focused": [32],
17874
+ "hovered": [32],
17875
+ "sdValidate": [64],
17876
+ "sdReset": [64],
17877
+ "sdResetValidate": [64],
17878
+ "sdFocus": [64]
17879
+ },
17880
+ "$listeners$": undefined,
17881
+ "$lazyBundleId$": "-",
17882
+ "$attrsToReflect$": [["size", "size"], ["type", "type"], ["placeholder", "placeholder"], ["disabled", "disabled"]]
17883
+ }; }
17884
+ }
17885
+
17886
+ 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}`;
17887
+
17888
+ class SdTimePickerSelector {
17889
+ constructor(hostRef) {
17890
+ registerInstance(this, hostRef);
17891
+ this.update = createEvent(this, "sdUpdate", 7);
17892
+ }
17893
+ /** 선택된 시간 (HH:mm) */
17894
+ value = null;
17895
+ /** 오전/오후 선택 표시 여부 */
17896
+ useMeridiem = true;
17897
+ /** 분 증감 단위 */
17898
+ minuteStep = 1;
17899
+ /** 시간 변경 시 발생합니다. */
17900
+ update;
17901
+ valueChanged() {
17902
+ this.syncFromValue();
17903
+ }
17904
+ editingPart = null;
17905
+ inputDraft = {};
17906
+ hour = 0;
17907
+ minute = 0;
17908
+ componentWillLoad() {
17909
+ this.syncFromValue();
17910
+ }
17911
+ syncFromValue() {
17912
+ const parsed = parseTimeValue(this.value);
17913
+ this.hour = parsed.hour;
17914
+ this.minute = parsed.minute;
17915
+ }
17916
+ get meridiem() {
17917
+ return this.hour >= 12 ? 'PM' : 'AM';
17918
+ }
17919
+ get displayHour() {
17920
+ if (!this.useMeridiem)
17921
+ return this.hour;
17922
+ const hour = this.hour % 12;
17923
+ return hour === 0 ? 12 : hour;
17924
+ }
17925
+ emitNext(hour, minute) {
17926
+ this.hour = clampTimePart(hour, 0, 23);
17927
+ this.minute = clampTimePart(minute, 0, 59);
17928
+ this.update.emit(formatTimeValue(this.hour, this.minute));
17929
+ }
17930
+ sanitizeInput(value) {
17931
+ return value.replace(/\D/g, '').slice(0, 2);
17932
+ }
17933
+ setDraft(part, value) {
17934
+ this.inputDraft = { ...this.inputDraft, [part]: value };
17935
+ }
17936
+ beginEdit(part, value) {
17937
+ this.editingPart = part;
17938
+ this.setDraft(part, String(value).padStart(2, '0'));
17939
+ }
17940
+ commitHourDraft(draft) {
17941
+ const raw = clampTimePart(Number(draft), this.useMeridiem ? 1 : 0, this.useMeridiem ? 12 : 23);
17942
+ const nextHour = this.useMeridiem
17943
+ ? this.meridiem === 'PM'
17944
+ ? raw === 12
17945
+ ? 12
17946
+ : raw + 12
17947
+ : raw === 12
17948
+ ? 0
17949
+ : raw
17950
+ : raw;
17951
+ this.emitNext(nextHour, this.minute);
17952
+ return raw;
17953
+ }
17954
+ commitMinuteDraft(draft) {
17955
+ const minute = clampTimePart(Number(draft), 0, 59);
17956
+ this.emitNext(this.hour, minute);
17957
+ return minute;
17958
+ }
17959
+ endEdit(part) {
17960
+ const draft = this.inputDraft[part];
17961
+ if (part === 'hour' && draft != null && draft !== '') {
17962
+ this.commitHourDraft(draft);
17963
+ }
17964
+ if (part === 'minute' && draft != null && draft !== '') {
17965
+ this.commitMinuteDraft(draft);
17966
+ }
17967
+ this.editingPart = null;
17968
+ this.inputDraft = {};
17969
+ }
17970
+ setMeridiem(meridiem) {
17971
+ if (meridiem === this.meridiem)
17972
+ return;
17973
+ if (meridiem === 'AM') {
17974
+ this.emitNext(this.hour - 12, this.minute);
17975
+ return;
17976
+ }
17977
+ this.emitNext(this.hour + 12, this.minute);
17978
+ }
17979
+ changeHour(delta) {
17980
+ this.emitNext((this.hour + delta + 24) % 24, this.minute);
17981
+ }
17982
+ changeMinute(delta) {
17983
+ const next = this.minute + delta;
17984
+ if (next > 59) {
17985
+ this.emitNext((this.hour + 1) % 24, next - 60);
17986
+ return;
17987
+ }
17988
+ if (next < 0) {
17989
+ this.emitNext((this.hour + 23) % 24, next + 60);
17990
+ return;
17991
+ }
17992
+ this.emitNext(this.hour, next);
17993
+ }
17994
+ handleHourInput = (event) => {
17995
+ const target = event.target;
17996
+ const draft = this.sanitizeInput(target.value);
17997
+ target.value = draft;
17998
+ this.setDraft('hour', draft);
17999
+ if (draft === '')
18000
+ return;
18001
+ if (draft.length < 2)
18002
+ return;
18003
+ const raw = this.commitHourDraft(draft);
18004
+ const displayDraft = Number(draft) === raw ? draft : String(raw);
18005
+ target.value = displayDraft;
18006
+ this.setDraft('hour', displayDraft);
18007
+ };
18008
+ handleMinuteInput = (event) => {
18009
+ const target = event.target;
18010
+ const draft = this.sanitizeInput(target.value);
18011
+ target.value = draft;
18012
+ this.setDraft('minute', draft);
18013
+ if (draft === '')
18014
+ return;
18015
+ if (draft.length < 2)
18016
+ return;
18017
+ const nextMinute = this.commitMinuteDraft(draft);
18018
+ const displayDraft = Number(draft) === nextMinute ? draft : String(nextMinute);
18019
+ target.value = displayDraft;
18020
+ this.setDraft('minute', displayDraft);
18021
+ this.emitNext(this.hour, nextMinute);
18022
+ };
18023
+ renderMeridiemButton(label, meridiem, position) {
18024
+ const selected = this.meridiem === meridiem;
18025
+ return (hAsync("button", { type: "button", class: {
18026
+ 'sd-time-picker-selector__meridiem-button': true,
18027
+ 'sd-time-picker-selector__meridiem-button--selected': selected,
18028
+ [`sd-time-picker-selector__meridiem-button--${position}`]: true,
18029
+ }, onClick: () => this.setMeridiem(meridiem) }, label));
18030
+ }
18031
+ renderColumn(type) {
18032
+ const isHour = type === 'hour';
18033
+ const value = isHour ? this.displayHour : this.minute;
18034
+ const displayValue = this.editingPart === type ? (this.inputDraft[type] ?? '') : String(value).padStart(2, '0');
18035
+ 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)) })));
18036
+ }
18037
+ render() {
18038
+ const cssVars = {
18039
+ '--selector-bg': TIMEPICKER_SELECTOR.bg,
18040
+ '--selector-radius': `${TIMEPICKER_SELECTOR.radius}px`,
18041
+ '--selector-section-padding-x': `${TIMEPICKER_SELECTOR.section.paddingX}px`,
18042
+ '--selector-section-padding-y': `${TIMEPICKER_SELECTOR.section.paddingY}px`,
18043
+ '--selector-time-gap': `${TIMEPICKER_SELECTOR.time.gap}px`,
18044
+ '--selector-time-column-gap': `${TIMEPICKER_SELECTOR.time.column.gap}px`,
18045
+ '--selector-input-width': `${TIMEPICKER_SELECTOR.inputWidth}px`,
18046
+ '--selector-colon-size': `${TIMEPICKER_SELECTOR.colonSize}px`,
18047
+ };
18048
+ 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'))));
18049
+ }
18050
+ static get watchers() { return {
18051
+ "value": [{
18052
+ "valueChanged": 0
18053
+ }]
18054
+ }; }
18055
+ static get style() { return sdTimePickerSelectorCss(); }
18056
+ static get cmpMeta() { return {
18057
+ "$flags$": 512,
18058
+ "$tagName$": "sd-time-picker-selector",
18059
+ "$members$": {
18060
+ "value": [1],
18061
+ "useMeridiem": [4, "use-meridiem"],
18062
+ "minuteStep": [2, "minute-step"],
18063
+ "editingPart": [32],
18064
+ "inputDraft": [32]
18065
+ },
18066
+ "$listeners$": undefined,
18067
+ "$lazyBundleId$": "-",
18068
+ "$attrsToReflect$": []
18069
+ }; }
18070
+ }
18071
+
18072
+ 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}`;
18073
+
18074
+ class SdTimePickerTrigger {
18075
+ constructor(hostRef) {
18076
+ registerInstance(this, hostRef);
18077
+ this.triggerClick = createEvent(this, "sdTriggerClick", 7);
18078
+ this.clear = createEvent(this, "sdClear", 7);
18079
+ }
18080
+ /** 표시할 시간 텍스트 */
18081
+ displayText = '';
18082
+ /** 입력 힌트 텍스트 */
18083
+ placeholder = '00:00';
18084
+ /** 비활성 상태 여부 */
18085
+ disabled = false;
18086
+ /** 지우기 버튼 표시 여부 */
18087
+ clearable = false;
18088
+ /** 트리거 크기 */
18089
+ size = 'sm';
18090
+ /** 트리거 클릭 시 발생합니다. */
18091
+ triggerClick;
18092
+ /** 지우기 버튼 클릭 시 발생합니다. */
18093
+ clear;
18094
+ handleClick = () => {
18095
+ if (this.disabled)
18096
+ return;
18097
+ this.triggerClick.emit();
18098
+ };
18099
+ handleClear = (event) => {
18100
+ event.stopPropagation();
18101
+ if (this.disabled)
18102
+ return;
18103
+ this.clear.emit();
18104
+ };
18105
+ render() {
18106
+ const sizeTokens = TIMEPICKER_SIZE_MAP[this.size] ?? TIMEPICKER_SIZE_MAP.sm;
18107
+ const hasValue = this.displayText !== '';
18108
+ const textMinWidth = this.size === 'md' ? 96 : 80;
18109
+ const cssVars = {
18110
+ '--trigger-padding-x': `${sizeTokens.paddingX}px`,
18111
+ '--trigger-gap': `${sizeTokens.gap}px`,
18112
+ '--trigger-icon-size': `${sizeTokens.iconSize}px`,
18113
+ '--trigger-font-size': `${sizeTokens.fontSize}px`,
18114
+ '--trigger-line-height': `${sizeTokens.lineHeight}px`,
18115
+ '--trigger-font-weight': sizeTokens.fontWeight,
18116
+ '--trigger-radius': `${sizeTokens.radius}px`,
18117
+ '--trigger-text-min-width': `${textMinWidth}px`,
18118
+ '--trigger-text-color': this.disabled
18119
+ ? TIMEPICKER_COLORS.text.disabled
18120
+ : hasValue
18121
+ ? TIMEPICKER_COLORS.text.default
18122
+ : TIMEPICKER_COLORS.text.hint,
18123
+ '--trigger-icon-color': this.disabled
18124
+ ? TIMEPICKER_COLORS.icon.disabled
18125
+ : TIMEPICKER_COLORS.icon.default,
18126
+ };
18127
+ return (hAsync("div", { key: '6b6bff8d9928ace4cda84a7bdb2ac6f73f0d2329', role: "button", tabindex: this.disabled ? -1 : 0, class: {
18128
+ 'sd-time-picker-trigger': true,
18129
+ 'sd-time-picker-trigger--disabled': this.disabled,
18130
+ }, style: cssVars, onClick: this.handleClick, onKeyDown: e => {
18131
+ if (e.key === 'Enter' || e.key === ' ') {
18132
+ e.preventDefault();
18133
+ this.handleClick();
18134
+ }
18135
+ } }, 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 }))));
18136
+ }
18137
+ static get style() { return sdTimePickerTriggerCss(); }
18138
+ static get cmpMeta() { return {
18139
+ "$flags$": 512,
18140
+ "$tagName$": "sd-time-picker-trigger",
18141
+ "$members$": {
18142
+ "displayText": [1, "display-text"],
18143
+ "placeholder": [1],
18144
+ "disabled": [4],
18145
+ "clearable": [4],
18146
+ "size": [1]
18147
+ },
18148
+ "$listeners$": undefined,
18149
+ "$lazyBundleId$": "-",
18150
+ "$attrsToReflect$": []
18151
+ }; }
18152
+ }
18153
+
18154
+ function getTimeMinutes(value) {
18155
+ const { hour, minute } = parseTimeValue(value);
18156
+ return hour * 60 + minute;
18157
+ }
18158
+ function normalizeTimeRangeValue(value, rangeOrder = 'strict') {
18159
+ if (value == null)
18160
+ return null;
18161
+ const normalized = value.map(item => {
18162
+ const parsed = parseTimeValue(item);
18163
+ return formatTimeValue(parsed.hour, parsed.minute);
18164
+ });
18165
+ if (rangeOrder === 'strict' && getTimeMinutes(normalized[0]) > getTimeMinutes(normalized[1])) {
18166
+ return [normalized[0], normalized[0]];
18167
+ }
18168
+ return normalized;
18169
+ }
18170
+ function formatTimeRangeDisplay(value, type) {
18171
+ if (value == null || value[0] === '' || value[1] === '')
18172
+ return '';
18173
+ return `${formatTimeDisplay(value[0], type)} ~ ${formatTimeDisplay(value[1], type)}`;
18174
+ }
18175
+
18176
+ 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%}`;
18177
+
18178
+ class SdTimeRangePicker {
18179
+ constructor(hostRef) {
18180
+ registerInstance(this, hostRef);
18181
+ this.update = createEvent(this, "sdUpdate", 7);
18182
+ this.dropDownShow = createEvent(this, "sdDropDownShow", 7);
18183
+ }
18184
+ static CLOSE_ANIMATION_DURATION = 150;
18185
+ get el() { return getElement(this); }
18186
+ /** 선택된 시간 범위 [시작, 종료] (HH:mm) */
18187
+ value = null;
18188
+ /** 입력 필드 크기 */
18189
+ size = 'sm';
18190
+ /** 표시 타입: default(24시간) / midday(오전·오후) */
18191
+ type = 'default';
18192
+ /** 시간 미선택 시 표시할 placeholder */
18193
+ placeholder = '00:00 ~ 23:59';
18194
+ /** 비활성 상태 여부 */
18195
+ disabled = false;
18196
+ /** 값이 있을 때 지우기 버튼 표시 여부 */
18197
+ clearable = false;
18198
+ /** 오전/오후 선택 표시 여부. 지정하지 않으면 type="midday"일 때만 켜집니다. */
18199
+ useMeridiem;
18200
+ /** 분 증감 단위 */
18201
+ minuteStep = 1;
18202
+ /** 범위 순서 정책. strict는 시작 시간이 종료 시간보다 늦어지지 않도록 보정합니다. */
18203
+ rangeOrder = 'strict';
18204
+ /** 필드 너비 (숫자면 px, 문자열이면 그대로 적용) */
18205
+ width = '';
18206
+ // sd-field 공통 props
18207
+ /** 레이블 텍스트 */
18208
+ label = '';
18209
+ /** 레이블 너비 */
18210
+ labelWidth = '';
18211
+ /** 필드 우측 어드온 레이블 */
18212
+ addonLabel = '';
18213
+ /** 어드온 정렬 방향 */
18214
+ addonAlign = 'start';
18215
+ /** 필드 하단 힌트 텍스트 */
18216
+ hint = '';
18217
+ /** 에러 메시지 */
18218
+ errorMessage = '';
18219
+ /** 유효성 검사 규칙 목록 */
18220
+ rules = [];
18221
+ /** 에러 상태 여부 */
18222
+ error = false;
18223
+ /** 필드 상태 (없으면 error/rules 결과로 자동 결정) */
18224
+ status;
18225
+ /** 레이블 영역 아이콘 */
18226
+ icon = undefined;
18227
+ /** 레이블 툴팁 텍스트 */
18228
+ labelTooltip = '';
18229
+ /** 레이블 툴팁 상세 옵션 */
18230
+ labelTooltipProps = null;
18231
+ isOpen = false;
18232
+ isAnimatingOut = false;
18233
+ focused = false;
18234
+ hovered = false;
18235
+ /** 시간 범위 선택 시 선택된 범위([시작, 종료])를 전달합니다. */
18236
+ update;
18237
+ /** 선택기 열림/닫힘 상태가 바뀔 때 발생합니다. */
18238
+ dropDownShow;
18239
+ triggerRef;
18240
+ formField;
18241
+ closeAnimationTimer;
18242
+ /** 폼 연동용 name 속성 */
18243
+ name = nanoid();
18244
+ watchIsOpen(newValue) {
18245
+ this.focused = newValue;
18246
+ this.dropDownShow.emit({ isOpen: newValue });
18247
+ }
18248
+ valueChanged(newValue) {
18249
+ const normalized = normalizeTimeRangeValue(newValue, this.rangeOrder);
18250
+ if (normalized != null && JSON.stringify(normalized) !== JSON.stringify(newValue)) {
18251
+ this.value = normalized;
18252
+ }
18253
+ }
18254
+ rangeOrderChanged() {
18255
+ this.valueChanged(this.value);
18256
+ }
18257
+ /** 유효성 검사를 실행합니다. */
18258
+ async sdValidate() {
18259
+ return this.formField?.sdValidate();
18260
+ }
18261
+ /** 값과 유효성 상태를 초기화합니다. */
18262
+ async sdReset() {
18263
+ return this.formField?.sdReset();
18264
+ }
18265
+ /** 유효성 상태만 초기화합니다. */
18266
+ async sdResetValidate() {
18267
+ return this.formField?.sdResetValidation();
18268
+ }
18269
+ /** 입력 필드에 포커스를 이동합니다. */
18270
+ async sdFocus() {
18271
+ return this.formField?.sdFocus();
18272
+ }
18273
+ componentWillLoad() {
18274
+ this.valueChanged(this.value);
18275
+ }
18276
+ disconnectedCallback() {
18277
+ if (this.closeAnimationTimer)
18278
+ clearTimeout(this.closeAnimationTimer);
18279
+ }
18280
+ closeDropdown() {
18281
+ if (!this.isOpen)
18282
+ return;
18283
+ this.isOpen = false;
18284
+ this.isAnimatingOut = true;
18285
+ if (this.closeAnimationTimer)
18286
+ clearTimeout(this.closeAnimationTimer);
18287
+ this.closeAnimationTimer = setTimeout(() => {
18288
+ this.isAnimatingOut = false;
18289
+ }, SdTimeRangePicker.CLOSE_ANIMATION_DURATION);
18290
+ }
18291
+ handleTriggerClick = () => {
18292
+ if (this.disabled)
18293
+ return;
18294
+ if (this.isOpen) {
18295
+ this.closeDropdown();
18296
+ }
18297
+ else {
18298
+ if (this.closeAnimationTimer)
18299
+ clearTimeout(this.closeAnimationTimer);
18300
+ this.isAnimatingOut = false;
18301
+ this.isOpen = true;
18302
+ }
18303
+ };
18304
+ handleClear = (event) => {
18305
+ event.stopPropagation();
18306
+ this.value = null;
18307
+ this.update.emit(null);
18308
+ };
18309
+ handleSelect = (event) => {
18310
+ event.stopPropagation();
18311
+ this.value = event.detail;
18312
+ this.update.emit(this.value);
18313
+ };
18314
+ get effectiveUseMeridiem() {
18315
+ return this.useMeridiem ?? this.type === 'midday';
18316
+ }
18317
+ get displayText() {
18318
+ return formatTimeRangeDisplay(this.value, this.effectiveUseMeridiem ? 'midday' : 'default');
18319
+ }
18320
+ render() {
18321
+ const sizeTokens = TIMEPICKER_SIZE_MAP[this.size] ?? TIMEPICKER_SIZE_MAP.sm;
18322
+ const cssVars = {
18323
+ '--sd-system-size-field-sm-height': `${sizeTokens.height}px`,
18324
+ '--sd-system-size-field-md-height': `${sizeTokens.height}px`,
18325
+ '--sd-system-radius-field-sm': `${sizeTokens.radius}px`,
18326
+ '--sd-system-radius-field-md': `${sizeTokens.radius}px`,
18327
+ '--sd-time-range-picker-min-width': `${sizeTokens.minWidth}px`,
18328
+ '--sd-system-color-field-border-default': TIMEPICKER_COLORS.border.default,
18329
+ '--sd-system-color-field-border-focus': TIMEPICKER_COLORS.border.focus,
18330
+ '--sd-system-color-field-bg-default': TIMEPICKER_COLORS.bg.default,
18331
+ };
18332
+ 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 => {
18333
+ this.triggerRef = el;
18334
+ } }, 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 })))));
18335
+ }
18336
+ static get watchers() { return {
18337
+ "isOpen": [{
18338
+ "watchIsOpen": 0
18339
+ }],
18340
+ "value": [{
18341
+ "valueChanged": 0
18342
+ }],
18343
+ "rangeOrder": [{
18344
+ "rangeOrderChanged": 0
18345
+ }]
18346
+ }; }
18347
+ static get style() { return sdTimeRangePickerCss(); }
18348
+ static get cmpMeta() { return {
18349
+ "$flags$": 512,
18350
+ "$tagName$": "sd-time-range-picker",
18351
+ "$members$": {
18352
+ "value": [1040],
18353
+ "size": [513],
18354
+ "type": [513],
18355
+ "placeholder": [513],
18356
+ "disabled": [516],
18357
+ "clearable": [4],
18358
+ "useMeridiem": [4, "use-meridiem"],
18359
+ "minuteStep": [2, "minute-step"],
18360
+ "rangeOrder": [1, "range-order"],
18361
+ "width": [8],
18362
+ "label": [1],
18363
+ "labelWidth": [8, "label-width"],
18364
+ "addonLabel": [1, "addon-label"],
18365
+ "addonAlign": [1, "addon-align"],
18366
+ "hint": [1],
18367
+ "errorMessage": [1, "error-message"],
18368
+ "rules": [16],
18369
+ "error": [1028],
18370
+ "status": [1],
18371
+ "icon": [16],
18372
+ "labelTooltip": [1, "label-tooltip"],
18373
+ "labelTooltipProps": [16],
18374
+ "name": [1],
18375
+ "isOpen": [32],
18376
+ "isAnimatingOut": [32],
18377
+ "focused": [32],
18378
+ "hovered": [32],
18379
+ "sdValidate": [64],
18380
+ "sdReset": [64],
18381
+ "sdResetValidate": [64],
18382
+ "sdFocus": [64]
18383
+ },
18384
+ "$listeners$": undefined,
18385
+ "$lazyBundleId$": "-",
18386
+ "$attrsToReflect$": [["size", "size"], ["type", "type"], ["placeholder", "placeholder"], ["disabled", "disabled"]]
18387
+ }; }
18388
+ }
18389
+
18390
+ 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}`;
18391
+
18392
+ class SdTimeRangePickerSelector {
18393
+ constructor(hostRef) {
18394
+ registerInstance(this, hostRef);
18395
+ this.update = createEvent(this, "sdUpdate", 7);
18396
+ }
18397
+ /** 선택된 시간 범위 [시작, 종료] (HH:mm) */
18398
+ value = null;
18399
+ /** 오전/오후 선택 표시 여부 */
18400
+ useMeridiem = false;
18401
+ /** 분 증감 단위 */
18402
+ minuteStep = 1;
18403
+ /** 범위 순서 정책. strict는 시작 시간이 종료 시간보다 늦어지지 않도록 보정합니다. */
18404
+ rangeOrder = 'strict';
18405
+ /** 시간 범위 변경 시 발생합니다. */
18406
+ update;
18407
+ editingKey = null;
18408
+ inputDraft = {};
18409
+ autoAdjusted = null;
18410
+ getRange() {
18411
+ return this.value ?? ['00:00', '23:59'];
18412
+ }
18413
+ getParts(side) {
18414
+ const [start, end] = this.getRange();
18415
+ return parseTimeValue(side === 'start' ? start : end);
18416
+ }
18417
+ getMeridiem(side) {
18418
+ return this.getParts(side).hour >= 12 ? 'PM' : 'AM';
18419
+ }
18420
+ getDisplayHour(side) {
18421
+ const { hour } = this.getParts(side);
18422
+ if (!this.useMeridiem)
18423
+ return hour;
18424
+ const displayHour = hour % 12;
18425
+ return displayHour === 0 ? 12 : displayHour;
18426
+ }
18427
+ emitSide(side, hour, minute, direction = 'unknown') {
18428
+ const [start, end] = this.getRange();
18429
+ const next = formatTimeValue(hour, minute);
18430
+ this.update.emit(this.normalizeNextRange(side === 'start' ? [next, end] : [start, next], side, direction));
18431
+ }
18432
+ getTimeMinutes(value) {
18433
+ const { hour, minute } = parseTimeValue(value);
18434
+ return hour * 60 + minute;
18435
+ }
18436
+ normalizeNextRange(range, changedSide, direction) {
18437
+ if (this.rangeOrder === 'allow-cross-day')
18438
+ return range;
18439
+ const [start, end] = range;
18440
+ const [currentStart, currentEnd] = this.getRange();
18441
+ if (this.getTimeMinutes(start) <= this.getTimeMinutes(end)) {
18442
+ const shouldKeepSynced = this.autoAdjusted?.side === changedSide &&
18443
+ currentStart === currentEnd &&
18444
+ start !== end &&
18445
+ (direction === 'unknown' || this.autoAdjusted.direction === direction);
18446
+ if (shouldKeepSynced) {
18447
+ return changedSide === 'start' ? [start, start] : [end, end];
18448
+ }
18449
+ this.autoAdjusted = null;
18450
+ return range;
18451
+ }
18452
+ this.autoAdjusted = {
18453
+ side: changedSide,
18454
+ direction: changedSide === 'start' ? 'increase' : 'decrease',
18455
+ };
18456
+ return changedSide === 'start' ? [start, start] : [end, end];
18457
+ }
18458
+ getEditingKey(side, part) {
18459
+ return `${side}-${part}`;
18460
+ }
18461
+ sanitizeInput(value) {
18462
+ return value.replace(/\D/g, '').slice(0, 2);
18463
+ }
18464
+ setDraft(key, value) {
18465
+ this.inputDraft = { ...this.inputDraft, [key]: value };
18466
+ }
18467
+ beginEdit(side, part, value) {
18468
+ const key = this.getEditingKey(side, part);
18469
+ this.editingKey = key;
18470
+ this.setDraft(key, String(value).padStart(2, '0'));
18471
+ }
18472
+ commitHourDraft(side, draft) {
18473
+ const raw = clampTimePart(Number(draft), this.useMeridiem ? 1 : 0, this.useMeridiem ? 12 : 23);
18474
+ const { minute } = this.getParts(side);
18475
+ const meridiem = this.getMeridiem(side);
18476
+ const nextHour = this.useMeridiem
18477
+ ? meridiem === 'PM'
18478
+ ? raw === 12
18479
+ ? 12
18480
+ : raw + 12
18481
+ : raw === 12
18482
+ ? 0
18483
+ : raw
18484
+ : raw;
18485
+ this.emitSide(side, nextHour, minute);
18486
+ return raw;
18487
+ }
18488
+ commitMinuteDraft(side, draft) {
18489
+ const { hour } = this.getParts(side);
18490
+ const nextMinute = clampTimePart(Number(draft), 0, 59);
18491
+ this.emitSide(side, hour, nextMinute);
18492
+ return nextMinute;
18493
+ }
18494
+ endEdit(side, part) {
18495
+ const draft = this.inputDraft[this.getEditingKey(side, part)];
18496
+ if (part === 'hour' && draft != null && draft !== '') {
18497
+ this.commitHourDraft(side, draft);
18498
+ }
18499
+ if (part === 'minute' && draft != null && draft !== '') {
18500
+ this.commitMinuteDraft(side, draft);
18501
+ }
18502
+ this.editingKey = null;
18503
+ this.inputDraft = {};
18504
+ }
18505
+ setMeridiem(side, meridiem) {
18506
+ const current = this.getMeridiem(side);
18507
+ if (current === meridiem)
18508
+ return;
18509
+ const { hour, minute } = this.getParts(side);
18510
+ this.emitSide(side, meridiem === 'AM' ? hour - 12 : hour + 12, minute);
18511
+ }
18512
+ changeHour(side, delta) {
18513
+ const { hour, minute } = this.getParts(side);
18514
+ this.emitSide(side, (hour + delta + 24) % 24, minute, delta > 0 ? 'increase' : 'decrease');
18515
+ }
18516
+ changeMinute(side, delta) {
18517
+ const { hour, minute } = this.getParts(side);
18518
+ const next = minute + delta;
18519
+ if (next > 59) {
18520
+ this.emitSide(side, (hour + 1) % 24, next - 60, delta > 0 ? 'increase' : 'decrease');
18521
+ return;
18522
+ }
18523
+ if (next < 0) {
18524
+ this.emitSide(side, (hour + 23) % 24, next + 60, delta > 0 ? 'increase' : 'decrease');
18525
+ return;
18526
+ }
18527
+ this.emitSide(side, hour, next, delta > 0 ? 'increase' : 'decrease');
18528
+ }
18529
+ handleHourInput = (side, event) => {
18530
+ const target = event.target;
18531
+ const draft = this.sanitizeInput(target.value);
18532
+ target.value = draft;
18533
+ this.setDraft(this.getEditingKey(side, 'hour'), draft);
18534
+ if (draft === '')
18535
+ return;
18536
+ if (draft.length < 2)
18537
+ return;
18538
+ const raw = this.commitHourDraft(side, draft);
18539
+ const displayDraft = Number(draft) === raw ? draft : String(raw);
18540
+ target.value = displayDraft;
18541
+ this.setDraft(this.getEditingKey(side, 'hour'), displayDraft);
18542
+ };
18543
+ handleMinuteInput = (side, event) => {
18544
+ const target = event.target;
18545
+ const draft = this.sanitizeInput(target.value);
18546
+ target.value = draft;
18547
+ this.setDraft(this.getEditingKey(side, 'minute'), draft);
18548
+ if (draft === '')
18549
+ return;
18550
+ if (draft.length < 2)
18551
+ return;
18552
+ const nextMinute = this.commitMinuteDraft(side, draft);
18553
+ const displayDraft = Number(draft) === nextMinute ? draft : String(nextMinute);
18554
+ target.value = displayDraft;
18555
+ this.setDraft(this.getEditingKey(side, 'minute'), displayDraft);
18556
+ };
18557
+ renderMeridiemButton(side, label, meridiem, position) {
18558
+ const selected = this.getMeridiem(side) === meridiem;
18559
+ return (hAsync("button", { type: "button", class: {
18560
+ 'sd-time-range-picker-selector__meridiem-button': true,
18561
+ 'sd-time-range-picker-selector__meridiem-button--selected': selected,
18562
+ [`sd-time-range-picker-selector__meridiem-button--${position}`]: true,
18563
+ }, onClick: () => this.setMeridiem(side, meridiem) }, label));
18564
+ }
18565
+ renderColumn(side, type) {
18566
+ const isHour = type === 'hour';
18567
+ const { minute } = this.getParts(side);
18568
+ const value = isHour ? this.getDisplayHour(side) : minute;
18569
+ const editingKey = this.getEditingKey(side, type);
18570
+ const displayValue = this.editingKey === editingKey
18571
+ ? (this.inputDraft[editingKey] ?? '')
18572
+ : String(value).padStart(2, '0');
18573
+ 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) })));
18574
+ }
18575
+ renderPanel(side, title) {
18576
+ 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'))));
18577
+ }
18578
+ render() {
18579
+ const cssVars = {
18580
+ '--selector-bg': TIMEPICKER_SELECTOR.bg,
18581
+ '--selector-radius': `${TIMEPICKER_SELECTOR.radius}px`,
18582
+ '--selector-range-padding': `${TIMEPICKER_SELECTOR.range.paddingXY}px`,
18583
+ '--selector-range-panel-gap': `${TIMEPICKER_SELECTOR.range.panelGap}px`,
18584
+ '--selector-range-section-gap': `${TIMEPICKER_SELECTOR.range.section.gap}px`,
18585
+ '--selector-range-heading-gap': `${TIMEPICKER_SELECTOR.range.heading.gap}px`,
18586
+ '--selector-range-heading-color': TIMEPICKER_SELECTOR.range.heading.color,
18587
+ '--selector-time-gap': `${TIMEPICKER_SELECTOR.time.gap}px`,
18588
+ '--selector-time-column-gap': `${TIMEPICKER_SELECTOR.time.column.gap}px`,
18589
+ '--selector-input-width': `${TIMEPICKER_SELECTOR.inputWidth}px`,
18590
+ '--selector-colon-size': `${TIMEPICKER_SELECTOR.colonSize}px`,
18591
+ '--selector-border-width': `${TIMEPICKER_COLORS.border.width}px`,
18592
+ '--selector-border-default': TIMEPICKER_COLORS.border.default,
18593
+ '--selector-border-focus': TIMEPICKER_COLORS.border.focus,
18594
+ '--selector-bg-disabled': TIMEPICKER_COLORS.bg.disabled,
18595
+ '--selector-text-default': TIMEPICKER_COLORS.text.default,
18596
+ };
18597
+ 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', '종료 시간')));
18598
+ }
18599
+ static get style() { return sdTimeRangePickerSelectorCss(); }
18600
+ static get cmpMeta() { return {
18601
+ "$flags$": 512,
18602
+ "$tagName$": "sd-time-range-picker-selector",
18603
+ "$members$": {
18604
+ "value": [16],
18605
+ "useMeridiem": [4, "use-meridiem"],
18606
+ "minuteStep": [2, "minute-step"],
18607
+ "rangeOrder": [1, "range-order"],
18608
+ "editingKey": [32],
18609
+ "inputDraft": [32]
18610
+ },
18611
+ "$listeners$": undefined,
18612
+ "$lazyBundleId$": "-",
18613
+ "$attrsToReflect$": []
18614
+ }; }
18615
+ }
18616
+
18617
+ const toast = {
18618
+ icon: "16",
18619
+ "default": {
18620
+ bg: "#07284A",
18621
+ content: "#FFFFFF"
18622
+ },
18623
+ danger: {
18624
+ bg: "#FB4444",
18625
+ content: "#FFFFFF"
18626
+ },
18627
+ caution: {
18628
+ bg: "#FFC700",
18629
+ content: "#222222"
18630
+ },
18631
+ complete: {
18632
+ bg: "#00973C",
18633
+ content: "#FFFFFF"
18634
+ },
18635
+ accent: {
18636
+ bg: "#005CC9",
18637
+ content: "#FFFFFF"
18638
+ },
18639
+ info: {
18640
+ bg: "#E6F1FF",
18641
+ icon: "#0075FF",
18642
+ text: "#222222",
18643
+ textLink: "#555555"
18644
+ }
18645
+ };
18646
+ var toastTokens = {
18647
+ toast: toast
18648
+ };
18649
+
18650
+ const TOAST_BUTTON_NAME_BY_TYPE = {
18651
+ default: 'secondary_sm',
18652
+ danger: 'danger_outline_sm',
18653
+ caution: 'neutral_outline_sm',
18654
+ complete: 'neutral_outline_sm',
18655
+ accent: 'neutral_outline_sm',
18656
+ info: 'secondary_sm',
18657
+ };
18658
+ const TOAST_TYPE_CONFIG = {
18659
+ default: { bg: toastTokens.toast.default.bg, content: toastTokens.toast.default.content },
18660
+ danger: { bg: toastTokens.toast.danger.bg, content: toastTokens.toast.danger.content },
18661
+ caution: { bg: toastTokens.toast.caution.bg, content: toastTokens.toast.caution.content },
18662
+ complete: { bg: toastTokens.toast.complete.bg, content: toastTokens.toast.complete.content },
18663
+ accent: { bg: toastTokens.toast.accent.bg, content: toastTokens.toast.accent.content },
18664
+ info: {
18665
+ bg: toastTokens.toast.info.bg,
18666
+ content: toastTokens.toast.info.text,
18667
+ icon: toastTokens.toast.info.icon,
18668
+ linkColor: toastTokens.toast.info.textLink,
18669
+ },
18670
+ };
18671
+ const TOAST_LAYOUT = {
18672
+ iconSize: toastTokens.toast.icon,
18673
+ };
18674
+
18675
+ 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}`;
18676
+
18677
+ class SdToast {
18678
+ constructor(hostRef) {
18679
+ registerInstance(this, hostRef);
18680
+ this.close = createEvent(this, "sdClose", 7);
18681
+ this.buttonClick = createEvent(this, "sdButtonClick", 7);
18682
+ }
18683
+ /** 좌측 아이콘명 */
18684
+ icon;
18685
+ /** 표시할 메시지 */
18686
+ message;
18687
+ /** 우측 링크 URL */
18688
+ link;
18689
+ /** 링크 표시 레이블 (없으면 URL 표시) */
18690
+ linkLabel;
18691
+ /** 우측 버튼 레이블 */
18692
+ buttonLabel;
18693
+ /** 닫기 버튼 표시 여부 */
18694
+ useClose = false;
18695
+ /** 토스트 타입 (색상/아이콘 프리셋) */
18696
+ type = 'default';
18697
+ /** 닫기 버튼 클릭 또는 자동 닫힘 시 발생합니다. */
18698
+ close;
18699
+ /** 우측 버튼 클릭 시 발생합니다. */
18700
+ buttonClick;
18701
+ render() {
18702
+ const typeConfig = TOAST_TYPE_CONFIG[this.type] ?? TOAST_TYPE_CONFIG.default;
18703
+ const iconSize = Number(TOAST_LAYOUT.iconSize);
18704
+ const iconColor = typeConfig.icon ?? typeConfig.content;
18705
+ const linkColor = typeConfig.linkColor ?? typeConfig.content;
18706
+ const useDefaultCloseIntent = ['default', 'caution', 'info'].includes(this.type);
18707
+ const buttonName = TOAST_BUTTON_NAME_BY_TYPE[this.type] ?? TOAST_BUTTON_NAME_BY_TYPE.default;
18708
+ return (hAsync("div", { key: 'f452ef18c746e75d0a2139fe14e10e2f6badc09e', style: {
18709
+ '--sd-toast-bg': typeConfig.bg,
18710
+ '--sd-toast-text': typeConfig.content,
18711
+ '--sd-toast-icon': iconColor,
18712
+ '--sd-toast-link': linkColor,
18713
+ } }, 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() })))));
18714
+ }
18715
+ static get style() { return sdToastCss(); }
18716
+ static get cmpMeta() { return {
18717
+ "$flags$": 512,
18718
+ "$tagName$": "sd-toast",
18719
+ "$members$": {
18720
+ "icon": [1],
18721
+ "message": [1],
18722
+ "link": [1],
18723
+ "linkLabel": [1, "link-label"],
18724
+ "buttonLabel": [1, "button-label"],
18725
+ "useClose": [4, "use-close"],
18726
+ "type": [1]
18727
+ },
18728
+ "$listeners$": undefined,
18729
+ "$lazyBundleId$": "-",
18730
+ "$attrsToReflect$": []
18731
+ }; }
18732
+ }
18733
+
18734
+ const DEFAULT_DURATION = 4000;
18735
+ const DEFAULT_MAX_VISIBLE = 3;
18736
+ const DEFAULT_GAP = 8;
18737
+ const DEFAULT_Z_INDEX = 999;
18738
+ const TRANSITION_DURATION = 400;
18739
+ const TRANSITION_FALLBACK_BUFFER = 100;
18740
+ const COLLAPSED_SCALE_STEP = 0.05;
18741
+ const COLLAPSED_OFFSET_STEP = 8;
18742
+
18743
+ 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}`;
18744
+
18745
+ let toastIdCounter = 0;
18746
+ class SdToastContainer {
18747
+ constructor(hostRef) {
18748
+ registerInstance(this, hostRef);
18749
+ this.toastShow = createEvent(this, "sdToastShow", 7);
18750
+ this.toastDismiss = createEvent(this, "sdToastDismiss", 7);
18751
+ }
18752
+ get el() { return getElement(this); }
18753
+ /** 토스트 표시 위치 */
18754
+ position = 'bottom-center';
18755
+ /** 동시에 표시할 최대 토스트 수 */
18756
+ maxVisible = DEFAULT_MAX_VISIBLE;
18757
+ /** 자동 닫힘 지연 시간 (ms, 0이면 자동 닫힘 없음) */
18758
+ defaultDuration = DEFAULT_DURATION;
18759
+ /** z-index */
18760
+ zIndex = DEFAULT_Z_INDEX;
18761
+ toasts = [];
18762
+ expanded = false;
18763
+ toastRefs = new Map();
18764
+ /** 토스트가 표시될 때 발생합니다. */
18765
+ toastShow;
18766
+ /** 토스트가 제거될 때 발생합니다. */
18767
+ toastDismiss;
18768
+ /** 토스트를 생성하고 ID를 반환합니다. */
18769
+ async create(options) {
18770
+ const id = `toast-${++toastIdCounter}`;
18771
+ const entry = { id, options, state: 'entering' };
18772
+ const duration = options.duration ?? this.defaultDuration ?? DEFAULT_DURATION;
17284
18773
  if (duration > 0) {
17285
18774
  entry.timerId = setTimeout(() => this.startDismiss(id), duration);
17286
18775
  }
@@ -17483,7 +18972,7 @@ class SdToastContainer {
17483
18972
  const activeToasts = toasts.filter(t => t.state !== 'exiting').reverse();
17484
18973
  const indexMap = new Map();
17485
18974
  activeToasts.forEach((t, i) => indexMap.set(t.id, i));
17486
- return (hAsync("div", { key: '9d0347cd5aba313c4e5cddaf7ecd9eaa3be096c8', class: "sd-toast-container", style: this.getContainerStyles(), onMouseEnter: () => {
18975
+ return (hAsync("div", { key: '3b7cfb69d072ae23f91b8afcced5d02f553f972b', class: "sd-toast-container", style: this.getContainerStyles(), onMouseEnter: () => {
17487
18976
  this.expanded = true;
17488
18977
  this.pauseTimers();
17489
18978
  }, onMouseLeave: () => {
@@ -17644,7 +19133,7 @@ class SdToggle {
17644
19133
  '--sd-toggle-content-select': TOGGLE_COLORS.content.select,
17645
19134
  '--sd-toggle-content-disabled': TOGGLE_COLORS.content.disabled,
17646
19135
  };
17647
- 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 })));
19136
+ 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 })));
17648
19137
  }
17649
19138
  static get style() { return sdToggleCss(); }
17650
19139
  static get cmpMeta() { return {
@@ -17697,42 +19186,29 @@ class SdTooltip {
17697
19186
  trigger = 'hover';
17698
19187
  /** 툴팁 표시 방향 */
17699
19188
  placement = 'top';
17700
- /** 아이콘 트리거 색상 */
19189
+ /** 기본(아이콘) 트리거 색상 */
17701
19190
  color = '#01BB4B';
17702
19191
  /** 툴팁 배경/텍스트 색상 타입 */
17703
19192
  tooltipType = 'default';
17704
- /** 아이콘 트리거 아이콘명 */
19193
+ /** 기본(아이콘) 트리거 아이콘명. slot="anchor" 가 있으면 무시 */
17705
19194
  icon = 'helpOutline';
17706
- /** 아이콘 트리거 크기 */
19195
+ /** 기본(아이콘) 트리거 크기 */
17707
19196
  iconSize = 12;
17708
- /** 버튼 트리거 레이블 (있으면 아이콘 대신 버튼 렌더링) */
17709
- label = '';
17710
- /** 버튼 트리거 프리셋 */
17711
- name = 'primary_sm';
17712
- /** 버튼 트리거 우측 아이콘 */
17713
- rightIcon;
17714
19197
  /** 스크린리더용 접근성 레이블 */
17715
19198
  ariaLabel = '';
17716
- /** 비활성 상태 여부 */
19199
+ /** 비활성 — 트리거만 렌더하고 툴팁을 열지 않음 */
17717
19200
  disabled = false;
17718
- /** 버튼 type 속성 */
17719
- type = 'button';
17720
19201
  /** 툴팁 우측 상단 닫기 버튼 표시 여부 */
17721
19202
  useClose = false;
17722
- /** 트리거 래퍼(.sd-tooltip-trigger)에 추가할 클래스 */
17723
- sdClass = '';
17724
19203
  /**
17725
19204
  * 툴팁 본문에 표시할 메시지. 각 항목이 한 줄로 innerHTML 렌더링됩니다.
17726
- * (HTML 문자열 허용) 지정하지 않으면 slot 으로 전달한 내용을 본문으로 사용합니다.
19205
+ * (HTML 문자열 허용) 지정하지 않으면 default slot 으로 전달한 내용을 본문으로 사용합니다.
17727
19206
  */
17728
19207
  message = [];
17729
- /** anchor 트리거 래퍼(.sd-tooltip-trigger)에 추가할 클래스. (예: Tailwind `block w-full`) */
17730
- triggerClass = '';
17731
- /** anchor 트리거 래퍼에 적용할 인라인 스타일(CSS 문자열). (예: `width:100%`) */
17732
- triggerStyle = '';
19208
+ /** 트리거 래퍼(.sd-tooltip-trigger)에 추가할 클래스. (예: Tailwind `block w-full`) */
19209
+ triggerClassName = '';
17733
19210
  showTooltip = false;
17734
19211
  slotContentHTML = '';
17735
- buttonEl;
17736
19212
  triggerEl;
17737
19213
  isAnchorMode = false;
17738
19214
  menuEl;
@@ -17740,6 +19216,8 @@ class SdTooltip {
17740
19216
  closeTimeout;
17741
19217
  static CLOSE_ANIM_MS = 150;
17742
19218
  openTooltip = () => {
19219
+ if (this.disabled)
19220
+ return;
17743
19221
  this.cancelHideTimer();
17744
19222
  this.showTooltip = true;
17745
19223
  if (this.menuEl) {
@@ -17789,22 +19267,16 @@ class SdTooltip {
17789
19267
  this.closeTooltip();
17790
19268
  }
17791
19269
  componentWillLoad() {
17792
- // slot="anchor" 자식이 있으면 anchor 모드(다른 컴포넌트를 트리거로 사용)
19270
+ // slot="anchor" 자식이 있으면 anchor 모드(다른 요소를 트리거로 사용)
17793
19271
  this.isAnchorMode = Array.from(this.el.children).some(child => child.getAttribute('slot') === 'anchor');
17794
19272
  if (!this.isAnchorMode) {
17795
- // 레거시 모드: 슬롯 내용을 본문으로 캡처하고 자식을 비웁니다.
19273
+ // 기본 모드: default slot 내용을 본문으로 캡처하고 자식을 비웁니다.
17796
19274
  this.slotContentHTML = this.el.innerHTML;
17797
19275
  this.el.replaceChildren();
17798
19276
  }
17799
19277
  // anchor 모드: 자식(slot="anchor")은 그대로 두어 Stencil 슬롯으로 투영합니다.
17800
19278
  this.el.classList.toggle('visible', true);
17801
19279
  }
17802
- componentDidRender() {
17803
- // CSS 문자열 스타일은 ref로 직접 적용 (속성/프로퍼티 전달 모두 호환)
17804
- if (this.triggerEl && this.triggerStyle !== '') {
17805
- this.triggerEl.setAttribute('style', this.triggerStyle);
17806
- }
17807
- }
17808
19280
  render() {
17809
19281
  const trigger = this.trigger ?? 'hover';
17810
19282
  const placement = this.placement ?? 'top';
@@ -17812,27 +19284,29 @@ class SdTooltip {
17812
19284
  const icon = this.icon ?? 'helpOutline';
17813
19285
  const color = this.color ?? '#01BB4B';
17814
19286
  const typeConfig = TOOLTIP_TYPE_CONFIG[tooltipType] ?? TOOLTIP_TYPE_CONFIG.default;
17815
- const hoverTrigger = {
17816
- onMouseEnter: () => this.openTooltip(),
17817
- onMouseLeave: () => !this.useClose && this.startHideTimer(),
19287
+ // 클릭 토글: 열림은 openTooltip(타이머 정리), 닫힘은 즉시(애니메이션 없이)
19288
+ const toggleTooltip = () => {
19289
+ if (this.showTooltip) {
19290
+ this.showTooltip = false;
19291
+ }
19292
+ else {
19293
+ this.openTooltip();
19294
+ }
17818
19295
  };
17819
- const toggleTooltip = () => (this.showTooltip = !this.showTooltip);
17820
- const hasLabel = this.label !== undefined && this.label !== '';
17821
- const anchorMode = this.isAnchorMode;
17822
19296
  const divTrigger = trigger === 'hover'
17823
- ? hoverTrigger
17824
- : anchorMode || !hasLabel
17825
- ? { onClick: toggleTooltip }
17826
- : {};
17827
- const buttonClickTrigger = trigger === 'click' && !anchorMode && hasLabel ? { onSdClick: toggleTooltip } : {};
17828
- const triggerClasses = ['sd-tooltip-trigger', this.sdClass, this.triggerClass]
19297
+ ? {
19298
+ onMouseEnter: () => this.openTooltip(),
19299
+ onMouseLeave: () => !this.useClose && this.startHideTimer(),
19300
+ }
19301
+ : { onClick: toggleTooltip };
19302
+ const triggerClasses = ['sd-tooltip-trigger', this.triggerClassName]
17829
19303
  .filter(c => c !== undefined && c !== '')
17830
19304
  .join(' ');
17831
- // anchor 모드에서는 slot 을 트리거로 쓰므로 본문은 message 로 받습니다.
19305
+ // 본문: message 가 있으면 각 줄을 innerHTML 로, 없으면 default slot 캡처 내용 사용
17832
19306
  const bodyHTML = this.message && this.message.length > 0
17833
19307
  ? this.message.map(line => `<div>${line}</div>`).join('')
17834
19308
  : this.slotContentHTML;
17835
- 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: {
19309
+ 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: {
17836
19310
  'sd-floating-menu': true,
17837
19311
  [`sd-floating-menu--${tooltipType}`]: true,
17838
19312
  [`sd-floating-menu--${placement}`]: true,
@@ -17840,7 +19314,7 @@ class SdTooltip {
17840
19314
  }, style: {
17841
19315
  '--sd-floating-bg': typeConfig.bg,
17842
19316
  '--sd-floating-content': typeConfig.content,
17843
- }, 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() })))))));
19317
+ }, 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() })))))));
17844
19318
  }
17845
19319
  static get style() { return sdTooltipCss(); }
17846
19320
  static get cmpMeta() { return {
@@ -17853,17 +19327,11 @@ class SdTooltip {
17853
19327
  "tooltipType": [1, "tooltip-type"],
17854
19328
  "icon": [1],
17855
19329
  "iconSize": [2, "icon-size"],
17856
- "label": [1],
17857
- "name": [1],
17858
- "rightIcon": [1, "right-icon"],
17859
19330
  "ariaLabel": [1, "aria-label"],
17860
19331
  "disabled": [4],
17861
- "type": [1],
17862
19332
  "useClose": [4, "use-close"],
17863
- "sdClass": [1, "sd-class"],
17864
19333
  "message": [16],
17865
- "triggerClass": [1, "trigger-class"],
17866
- "triggerStyle": [1, "trigger-style"],
19334
+ "triggerClassName": [1, "trigger-class-name"],
17867
19335
  "showTooltip": [32],
17868
19336
  "slotContentHTML": [32],
17869
19337
  "show": [64],
@@ -17926,6 +19394,11 @@ registerComponents([
17926
19394
  SdTag,
17927
19395
  SdTextLink,
17928
19396
  SdTextarea,
19397
+ SdTimePicker,
19398
+ SdTimePickerSelector,
19399
+ SdTimePickerTrigger,
19400
+ SdTimeRangePicker,
19401
+ SdTimeRangePickerSelector,
17929
19402
  SdToast,
17930
19403
  SdToastContainer,
17931
19404
  SdToggle,